diff --git a/docs/developer-guide/plugin/api-reference/ui/components/plugin-detail-modal.md b/docs/developer-guide/plugin/api-reference/ui/components/plugin-detail-modal.md
new file mode 100644
index 0000000..2412b35
--- /dev/null
+++ b/docs/developer-guide/plugin/api-reference/ui/components/plugin-detail-modal.md
@@ -0,0 +1,30 @@
+---
+title: PluginDetailModal
+description: 插件详情弹窗组件
+---
+
+此组件可以在 UI 部分的任意组件中打开差价的详情和设置弹窗，可以用于实现在不打断正常操作流程的情况下让用户查看和修改插件的详细信息。
+
+## 使用方式
+
+```html
+<script lang="ts" setup>
+import { ref } from "vue"
+
+const modalVisible = ref(false)
+
+function onPluginDetailModalClose() {
+  // Do something
+}
+</script>
+
+<template>
+  <PluginDetailModal v-if="modalVisible" @close="onPluginDetailModalClose" name="starter" />
+</template>
+```
+
+## Props
+
+| 属性名 | 类型   | 默认值   | 描述                                          |
+| ------ | ------ | -------- | --------------------------------------------- |
+| `name` | string | 无，必填 | 插件名称，即 plugin.yaml 中的 `metadata.name` |
diff --git a/sidebars.js b/sidebars.js
index 42599dc..789f504 100644
--- a/sidebars.js
+++ b/sidebars.js
@@ -178,7 +178,7 @@ module.exports = {
                 "developer-guide/plugin/api-reference/server/reconciler",
                 "developer-guide/plugin/api-reference/server/role-template",
                 "developer-guide/plugin/api-reference/server/extension-client",
-                "developer-guide/plugin/api-reference/server/setting-fetcher", 
+                "developer-guide/plugin/api-reference/server/setting-fetcher",
                 "developer-guide/plugin/api-reference/server/reverseproxy",
                 "developer-guide/plugin/api-reference/server/finder-for-theme",
                 "developer-guide/plugin/api-reference/server/template-for-theme",
@@ -259,6 +259,7 @@ module.exports = {
                     "developer-guide/plugin/api-reference/ui/components/attachment-selector-modal",
                     "developer-guide/plugin/api-reference/ui/components/has-permission",
                     "developer-guide/plugin/api-reference/ui/components/search-input",
+                    "developer-guide/plugin/api-reference/ui/components/plugin-detail-modal",
                     "developer-guide/plugin/api-reference/ui/components/v-codemirror",
                     "developer-guide/plugin/api-reference/ui/components/v-tooltip",
                     "developer-guide/plugin/api-reference/ui/components/v-permission",
diff --git a/versioned_docs/version-2.17/developer-guide/plugin/api-reference/ui/components/plugin-detail-modal.md b/versioned_docs/version-2.17/developer-guide/plugin/api-reference/ui/components/plugin-detail-modal.md
new file mode 100644
index 0000000..2412b35
--- /dev/null
+++ b/versioned_docs/version-2.17/developer-guide/plugin/api-reference/ui/components/plugin-detail-modal.md
@@ -0,0 +1,30 @@
+---
+title: PluginDetailModal
+description: 插件详情弹窗组件
+---
+
+此组件可以在 UI 部分的任意组件中打开差价的详情和设置弹窗，可以用于实现在不打断正常操作流程的情况下让用户查看和修改插件的详细信息。
+
+## 使用方式
+
+```html
+<script lang="ts" setup>
+import { ref } from "vue"
+
+const modalVisible = ref(false)
+
+function onPluginDetailModalClose() {
+  // Do something
+}
+</script>
+
+<template>
+  <PluginDetailModal v-if="modalVisible" @close="onPluginDetailModalClose" name="starter" />
+</template>
+```
+
+## Props
+
+| 属性名 | 类型   | 默认值   | 描述                                          |
+| ------ | ------ | -------- | --------------------------------------------- |
+| `name` | string | 无，必填 | 插件名称，即 plugin.yaml 中的 `metadata.name` |
diff --git a/versioned_sidebars/version-2.17-sidebars.json b/versioned_sidebars/version-2.17-sidebars.json
index dbb44d4..d012cb1 100644
--- a/versioned_sidebars/version-2.17-sidebars.json
+++ b/versioned_sidebars/version-2.17-sidebars.json
@@ -244,6 +244,7 @@
                     "developer-guide/plugin/api-reference/ui/components/attachment-selector-modal",
                     "developer-guide/plugin/api-reference/ui/components/has-permission",
                     "developer-guide/plugin/api-reference/ui/components/search-input",
+                    "developer-guide/plugin/api-reference/ui/components/plugin-detail-modal",
                     "developer-guide/plugin/api-reference/ui/components/v-codemirror",
                     "developer-guide/plugin/api-reference/ui/components/v-tooltip",
                     "developer-guide/plugin/api-reference/ui/components/v-permission"