vite-plugin-vue-devtools 1.0.0-alpha.2 → 1.0.0-beta.0

package/README.md

@@ -5,16 +5,19 @@
 Vue DevTools <sup>Preview</sup>
 </h1>
 
+<p align="center">
+English | <a href="./README.zh-CN.md">简体中文</a>
+</p>
 
 <p align="center">
   <a href="https://www.npmjs.com/package/vite-plugin-vue-devtools" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/npm/v/vite-plugin-vue-devtools" alt="NPM Version" /></a>
   <a href="https://www.npmjs.com/package/vite-plugin-vue-devtools" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/npm/dt/vite-plugin-vue-devtools" alt="NPM Downloads" /></a>
- <a href="https://github.comhttps://github.com/webfansplz/vite-plugin-vue-devtools/blob/main/LICENSE" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/github/license/webfansplz/vite-plugin-vue-devtools" alt="License" /></a>
+ <a href="https://github.com/webfansplz/vite-plugin-vue-devtools/blob/main/LICENSE" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/github/license/webfansplz/vite-plugin-vue-devtools" alt="License" /></a>
 </p>
 
 <p align="center">
-  <a href="https://github.comhttps://github.com/webfansplz/vite-plugin-vue-devtools/discussions/1">💡 Ideas & Suggestions</a> |
-  <a href="https://github.comhttps://github.com/webfansplz/vite-plugin-vue-devtools/discussions/2">🗺️ Project Roadmap</a> 
+  <a href="https://github.com/webfansplz/vite-plugin-vue-devtools/discussions/1">💡 Ideas & Suggestions</a> |
+  <a href="https://github.com/webfansplz/vite-plugin-vue-devtools/discussions/2">🗺️ Project Roadmap</a> 
 </p>
 
 <p align="center">
@@ -24,7 +27,7 @@ Vue DevTools <sup>Preview</sup>
 
 ## 📖 Introduction
 
-`vite-plugin-vue-devtools` is a Vite plugin designed to enhance the Vue developer experience.
+`vite-plugin-vue-devtools` is a `Vite` plugin designed to enhance the `Vue` developer experience.
 
 
 
@@ -114,6 +117,13 @@ export default defineConfig({
 ### Options
 
 ```ts
+interface AnalyzeOptions {
+  /**
+   * @default true
+  */
+  rerenderTrace: boolean
+}
+
 interface VitePluginVueDevToolsOptions {
   /**
   * append an import to the module id ending with `appendTo` instead of adding a script into body
@@ -122,16 +132,24 @@ interface VitePluginVueDevToolsOptions {
   * WARNING: only set this if you know exactly what it does.
   */
   appendTo?: string | RegExp
+  /**
+   * Enable Vue DevTools to analyze the codebase by using Babel
+   * @default
+   * {
+   *   rerenderTrace: true, // enable rerenderTrace feature
+   * }
+  */
+  analyze?: Partial<AnalyzeOptions>
 }
 ```
 
 ## 💡 Notice
 
-- Only available in development mode.
-- Only support Vue3.0+.
-- Currently only supports single-instance Vue applications (multi-instance support is coming soon).
-- Doesn't support SSR (If you're using Nuxt, use [nuxt/devtools](https://github.com/nuxt/devtools) directly).
-- The plugin follows Vue's DevTools configuration, so if you have configured the `hide` option, it will also be applied in this plugin. e.g.
+- Only available in `development mode`.
+- Only support `Vue3.0+` .
+- Only supports single-instance `Vue` applications.
+- Doesn't support `SSR` (If you're using `Nuxt`, use [nuxt/devtools](https://github.com/nuxt/devtools) directly).
+- The plugin follows `Vue's DevTools` configuration, so if you have configured the `hide` option, it will also be applied in this plugin. e.g.
 
   ```js
   // This Vue instance will be ignored by the plugin.
@@ -149,14 +167,14 @@ interface VitePluginVueDevToolsOptions {
 
 ## 🌸 Credits
 
-- This project is highly inspired by [nuxt/devtools](https://github.com/nuxt/devtools). Kudos to Anthony Fu and Nuxt team for the awesome work!
+- This project is highly inspired by [nuxt/devtools](https://github.com/nuxt/devtools). Kudos to [Anthony Fu](https://github.com/antfu) and `Nuxt` team for the awesome work!
 
 - [vuejs/devtools](https://github.com/vuejs/devtools)
 
 
 ## 👨‍💻 Contributors
 
-<a href="https://github.comhttps://github.com/webfansplz/vite-plugin-vue-devtools/graphs/contributors">
+<a href="https://github.com/webfansplz/vite-plugin-vue-devtools/graphs/contributors">
   <img src="https://contrib.rocks/image?repo=webfansplz/vite-plugin-vue-devtools" />   
 </a>    
 

package/README.zh-CN.md

@@ -0,0 +1,185 @@
+<p align="center">
+  <img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/bg.png" />
+</p>
+<h1 align="center">
+Vue DevTools <sup>预览</sup>
+</h1>
+
+<p align="center">
+<a href="./README.md">English</a> | 简体中文
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/vite-plugin-vue-devtools" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/npm/v/vite-plugin-vue-devtools" alt="NPM Version" /></a>
+  <a href="https://www.npmjs.com/package/vite-plugin-vue-devtools" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/npm/dt/vite-plugin-vue-devtools" alt="NPM Downloads" /></a>
+ <a href="https://github.com/webfansplz/vite-plugin-vue-devtools/blob/main/LICENSE" target="_blank" rel="noopener noreferrer"><img src="https://badgen.net/github/license/webfansplz/vite-plugin-vue-devtools" alt="License" /></a>
+</p>
+
+<p align="center">
+  <a href="https://github.com/webfansplz/vite-plugin-vue-devtools/discussions/1">💡 想法 & 建议</a> |
+  <a href="https://github.com/webfansplz/vite-plugin-vue-devtools/discussions/2">🗺️ 项目路线图</a> 
+</p>
+
+<p align="center">
+<a href="https://stackblitz.com/edit/vitejs-vite-oxbwzk?file=vite.config.ts&view=preview"><img src="https://developer.stackblitz.com/img/open_in_stackblitz.svg" alt=""></a>
+</p>
+
+
+## 📖 介绍
+
+`vite-plugin-vue-devtools` 是一个旨在增强 `Vue` 开发者体验的 `Vite` 插件。
+
+
+
+## 🎉 特性
+
+### Pages
+
+`Pages` 选项卡显示您当前的页面路由并提供快速导航的方法。对于动态路由，它还提供了一个表单来交互式地填写每个参数。您还可以使用文本框来测试每个路由的匹配情况。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/pages.png" />
+
+
+### Components
+
+`Components` 选项卡显示您应用程序的所有组件树，您还可以选择它们来查看组件的详细信息（例如数据、属性）。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/components.png" />
+
+### Assets
+
+`Assets` 选项卡显示所有静态资源及其信息，您可以在浏览器中打开或下载它。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/assets.png" />
+
+### Timeline
+
+`Timeline` 选项卡包含三个类别：性能、路由导航和 Pinia，您可以在它们之间切换以查看状态变化和时间线。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/timeline.png" />
+
+### Routes
+
+`Routes` 选项卡是与 [Vue Router](https://github.com/vuejs/router) 集成的功能，允许您查看注册的路由及其详细信息。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/routes.png" />
+
+### Pinia
+
+`Pinia` 选项卡是与 [Pinia](https://github.com/vuejs/pinia) 集成的功能，允许您查看注册的模块及其详细信息。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/pinia.png" />
+
+### Graph
+
+`Graph` 选项卡提供了显示组件依赖关系的视图。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/graph.png" />
+
+### Inspect
+
+`Inspect` 公开 [vite-plugin-inspect](https://github.com/antfu/vite-plugin-inspect) 集成，允许您检查 Vite 的转换步骤，了解每个插件如何改变您的代码并发现潜在问题可能会有所帮助。
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/inspect.png" />
+
+### Inspector
+
+您还可以使用 `Inspector` 功能来检查 `DOM` 树并查看哪个组件正在渲染它，单击可转到特定行的编辑器，使更改变得更加容易，而无需彻底了解项目结构。 (该功能基于 [vite-plugin-vue-inspector](https://github.com/webfansplz/vite-plugin-vue-inspector))
+
+<img src="https://github.com/webfansplz/vite-plugin-vue-devtools/raw/main/screenshots/inspector.png" height=450 />
+
+## 📦 安装
+
+```
+
+# vite-plugin-vue-devtools 
+
+pnpm install vite-plugin-vue-devtools -D
+
+```
+
+## 🦄 示例
+
+### Vite 配置
+
+```ts
+import { defineConfig } from 'vite'
+import VueDevTools from 'vite-plugin-vue-devtools'
+
+export default defineConfig({
+  plugins: [
+    VueDevTools(),
+    vue(),
+  ],
+})
+```
+
+### 选项
+
+```ts
+interface AnalyzeOptions {
+  /**
+   * @default true
+  */
+  rerenderTrace: boolean
+}
+
+interface VitePluginVueDevToolsOptions {
+  /**
+  * append an import to the module id ending with `appendTo` instead of adding a script into body
+  * useful for projects that do not use html file as an entry
+  *
+  * WARNING: only set this if you know exactly what it does.
+  */
+  appendTo?: string | RegExp
+
+  /**
+   * Enable Vue DevTools to analyze the codebase by using Babel
+   * @default
+   * {
+   *   rerenderTrace: true, // enable rerenderTrace feature
+   * }
+  */
+  analyze?: Partial<AnalyzeOptions>
+}
+```
+
+## 💡 注意
+
+- 仅在 `开发模式` 下可用。
+- 仅支持 `Vue3.0+` 。
+- 仅支持单实例 `Vue` 应用程序。
+- 不支持 `SSR` (如果您使用 `Nuxt` ，请使用 [nuxt/devtools](https://github.com/nuxt/devtools))。
+- 该插件遵循 `Vue` 的 `DevTools` 配置，因此如果您配置了 `hide` 选项，它也将应用于该插件。例如
+
+  ```js
+  // This Vue instance will be ignored by the plugin.
+  createApp({
+    render: () => h(App),
+    devtools: {
+      hide: true,
+    },
+  })
+  ```
+
+## 📖 博客
+
+- [介绍 Vue DevTools (Vite 插件)](https://gist.github.com/webfansplz/bc90a773a0dd474a34e043ab2d2a37a4)
+
+## 🌸 致谢
+
+- 该项目深受 [nuxt/devtools](https://github.com/nuxt/devtools) 的启发，感谢 [Anthony Fu](https://github.com/antfu) 和 `Nuxt` 团队的出色工作
+
+- [vuejs/devtools](https://github.com/vuejs/devtools)
+
+
+## 👨‍💻 贡献者
+
+<a href="https://github.com/webfansplz/vite-plugin-vue-devtools/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=webfansplz/vite-plugin-vue-devtools" />   
+</a>    
+
+## 📄 License
+
+[MIT LICENSE](./LICENSE)
+

package/dist/client/assets/{Icon.vue_vue_type_script_setup_true_lang-9344440e.js → Icon.vue_vue_type_script_setup_true_lang-38720372.js}

@@ -1,4 +1,4 @@
-import { v as defineComponent, o as openBlock, e as createElementBlock, q as normalizeClass } from './index-773a455a.js';
+import { v as defineComponent, o as openBlock, e as createElementBlock, q as normalizeClass } from './index-5bcfd23e.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Icon",

package/dist/client/assets/{IconButton.vue_vue_type_script_setup_true_lang-f308a32e.js → IconButton.vue_vue_type_script_setup_true_lang-3d53773c.js}

@@ -1,5 +1,5 @@
-import { _ as _sfc_main$1 } from './Icon.vue_vue_type_script_setup_true_lang-9344440e.js';
-import { v as defineComponent, o as openBlock, c as createBlock, h as withCtx, u as createVNode, k as mergeProps, j as resolveDynamicComponent } from './index-773a455a.js';
+import { _ as _sfc_main$1 } from './Icon.vue_vue_type_script_setup_true_lang-38720372.js';
+import { v as defineComponent, o as openBlock, c as createBlock, h as withCtx, u as createVNode, k as mergeProps, j as resolveDynamicComponent } from './index-5bcfd23e.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "IconButton",

package/dist/client/assets/{IconTitle.vue_vue_type_script_setup_true_lang-4cf300a8.js → IconTitle.vue_vue_type_script_setup_true_lang-968221a7.js}

@@ -1,4 +1,4 @@
-import { v as defineComponent, o as openBlock, e as createElementBlock, q as normalizeClass, g as createCommentVNode, f as renderSlot, x as createBaseVNode, y as toDisplayString } from './index-773a455a.js';
+import { v as defineComponent, o as openBlock, e as createElementBlock, q as normalizeClass, g as createCommentVNode, f as renderSlot, x as createBaseVNode, y as toDisplayString } from './index-5bcfd23e.js';
 
 const _hoisted_1 = {
   flex: "~ gap-3",

package/dist/client/assets/{IframeView.vue_vue_type_script_setup_true_lang-a998c802.js → IframeView.vue_vue_type_script_setup_true_lang-1f94d0bf.js}

@@ -1,4 +1,4 @@
-import { v as defineComponent, cn as useColorMode, a$ as ref, a1 as computed, aZ as reactive, co as useElementBounding, aP as onMounted, n as nextTick, bz as watchEffect, aU as onUnmounted, o as openBlock, e as createElementBlock, z as unref, g as createCommentVNode, x as createBaseVNode } from './index-773a455a.js';
+import { v as defineComponent, cs as useColorMode, a$ as ref, a1 as computed, aZ as reactive, ct as useElementBounding, aP as onMounted, n as nextTick, bz as watchEffect, aU as onUnmounted, o as openBlock, e as createElementBlock, z as unref, g as createCommentVNode, x as createBaseVNode } from './index-5bcfd23e.js';
 
 const _hoisted_1 = {
   key: 0,

package/dist/client/assets/{PanelGrids-bf67e36d.js → PanelGrids-e26dc60c.js}

@@ -1,4 +1,4 @@
-import { bJ as _export_sfc, o as openBlock, e as createElementBlock, f as renderSlot } from './index-773a455a.js';
+import { bM as _export_sfc, o as openBlock, e as createElementBlock, f as renderSlot } from './index-5bcfd23e.js';
 
 /* unplugin-vue-components disabled */const _sfc_main = {};
 

package/dist/client/assets/{SectionBlock-30cd0db7.js → SectionBlock-667aa26c.js}

@@ -1,6 +1,6 @@
-import { _ as _sfc_main$1 } from './IconTitle.vue_vue_type_script_setup_true_lang-4cf300a8.js';
-import { _ as _sfc_main$2 } from './Icon.vue_vue_type_script_setup_true_lang-9344440e.js';
-import { v as defineComponent, bK as useVModel, b as resolveDirective, o as openBlock, e as createElementBlock, x as createBaseVNode, q as normalizeClass, u as createVNode, h as withCtx, f as renderSlot, g as createCommentVNode, c as createBlock, z as unref, d as withDirectives, F as Fragment, a9 as createTextVNode, y as toDisplayString, p as pushScopeId, a as popScopeId, bJ as _export_sfc } from './index-773a455a.js';
+import { _ as _sfc_main$1 } from './IconTitle.vue_vue_type_script_setup_true_lang-968221a7.js';
+import { _ as _sfc_main$2 } from './Icon.vue_vue_type_script_setup_true_lang-38720372.js';
+import { v as defineComponent, bN as useVModel, b as resolveDirective, o as openBlock, e as createElementBlock, x as createBaseVNode, q as normalizeClass, u as createVNode, h as withCtx, f as renderSlot, g as createCommentVNode, c as createBlock, z as unref, d as withDirectives, F as Fragment, a9 as createTextVNode, y as toDisplayString, p as pushScopeId, a as popScopeId, bM as _export_sfc } from './index-5bcfd23e.js';
 
 const _withScopeId = (n) => (pushScopeId("data-v-e966339e"), n = n(), popScopeId(), n);
 const _hoisted_1 = ["open"];

package/dist/client/assets/{StateFields.vue_vue_type_script_setup_true_lang-f232f911.js → StateFields.vue_vue_type_script_setup_true_lang-0dc54647.js}

@@ -1,7 +1,7 @@
-import { _ as _sfc_main$3 } from './Icon.vue_vue_type_script_setup_true_lang-9344440e.js';
-import { v as defineComponent, o as openBlock, c as createBlock, q as normalizeClass, aC as isRef, bd as toRaw, a1 as computed, cs as useCopy, r as resolveComponent, e as createElementBlock, i as renderList, z as unref, ct as nanoid, x as createBaseVNode, y as toDisplayString, g as createCommentVNode, F as Fragment, a$ as ref, cu as useNotification, u as createVNode, bG as withModifiers, d as withDirectives, bv as vShow } from './index-773a455a.js';
-import { a as isComputed, b as isArray, c as isMap, d as isSet, e as isRegExp, t as toRawType, f as isPlainObject, g as escape } from './index-cc695468.js';
-import { _ as _sfc_main$4 } from './IconButton.vue_vue_type_script_setup_true_lang-f308a32e.js';
+import { _ as _sfc_main$3 } from './Icon.vue_vue_type_script_setup_true_lang-38720372.js';
+import { v as defineComponent, o as openBlock, c as createBlock, q as normalizeClass, aC as isRef, bd as toRaw, a1 as computed, cx as useCopy, r as resolveComponent, e as createElementBlock, i as renderList, z as unref, cy as nanoid, x as createBaseVNode, y as toDisplayString, g as createCommentVNode, F as Fragment, a$ as ref, cz as useNotification, u as createVNode, bG as withModifiers, d as withDirectives, bv as vShow } from './index-5bcfd23e.js';
+import { a as isComputed, b as isArray, c as isMap, d as isSet, e as isRegExp, t as toRawType, f as isPlainObject, g as escape } from './index-7ef2f30b.js';
+import { _ as _sfc_main$4 } from './IconButton.vue_vue_type_script_setup_true_lang-3d53773c.js';
 
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "ExpandIcon",

package/dist/client/assets/{Switch.vue_vue_type_script_setup_true_lang-ff441d43.js → Switch.vue_vue_type_script_setup_true_lang-cfc899d5.js}

@@ -1,5 +1,5 @@
-import { _ as _sfc_main$2 } from './Icon.vue_vue_type_script_setup_true_lang-9344440e.js';
-import { v as defineComponent, bK as useVModel, o as openBlock, e as createElementBlock, f as renderSlot, d as withDirectives, bt as vModelSelect, z as unref, x as createBaseVNode, y as toDisplayString, g as createCommentVNode, aC as isRef, c as createBlock, bq as vModelCheckbox, bE as withKeys } from './index-773a455a.js';
+import { _ as _sfc_main$2 } from './Icon.vue_vue_type_script_setup_true_lang-38720372.js';
+import { v as defineComponent, bN as useVModel, o as openBlock, e as createElementBlock, f as renderSlot, d as withDirectives, bt as vModelSelect, z as unref, x as createBaseVNode, y as toDisplayString, g as createCommentVNode, aC as isRef, c as createBlock, bq as vModelCheckbox, bE as withKeys } from './index-5bcfd23e.js';
 
 const _hoisted_1$1 = { class: "n-text-input flex flex items-center border n-border-base rounded px-2 py-1 focus-within:n-focus-base focus-within:border-context n-bg-base" };
 const _hoisted_2$1 = ["disabled"];

package/dist/client/assets/{TextInput.vue_vue_type_script_setup_true_lang-49fa3d66.js → TextInput.vue_vue_type_script_setup_true_lang-70f3e7d2.js}

@@ -1,5 +1,5 @@
-import { _ as _sfc_main$1 } from './Icon.vue_vue_type_script_setup_true_lang-9344440e.js';
-import { v as defineComponent, bK as useVModel, o as openBlock, e as createElementBlock, f as renderSlot, d as withDirectives, br as vModelDynamic, z as unref, x as createBaseVNode, k as mergeProps, aC as isRef, c as createBlock, g as createCommentVNode } from './index-773a455a.js';
+import { _ as _sfc_main$1 } from './Icon.vue_vue_type_script_setup_true_lang-38720372.js';
+import { v as defineComponent, bN as useVModel, o as openBlock, e as createElementBlock, f as renderSlot, d as withDirectives, br as vModelDynamic, z as unref, x as createBaseVNode, k as mergeProps, aC as isRef, c as createBlock, g as createCommentVNode } from './index-5bcfd23e.js';
 
 const _hoisted_1 = { class: "n-text-input flex flex items-center border n-border-base rounded py-1 pl-1 pr-2 focus-within:n-focus-base focus-within:border-context n-bg-base" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/client/assets/{__eyedropper-04974bae.js → __eyedropper-f3285f90.js}

@@ -1,6 +1,6 @@
-import { _ as __unplugin_components_0 } from './PanelGrids-bf67e36d.js';
-import { v as defineComponent, cB as useRouter, a$ as ref, a1 as computed, cs as useCopy, cc as useEventListener, aP as onMounted, o as openBlock, c as createBlock, h as withCtx, x as createBaseVNode, z as unref, e as createElementBlock, l as normalizeStyle, a9 as createTextVNode, y as toDisplayString, cl as useDevToolsClient, bX as useFrameState, u as createVNode } from './index-773a455a.js';
-import { h as checkIsSecurityContext } from './index-cc695468.js';
+import { _ as __unplugin_components_0 } from './PanelGrids-e26dc60c.js';
+import { v as defineComponent, cG as useRouter, a$ as ref, a1 as computed, cx as useCopy, ci as useEventListener, aP as onMounted, o as openBlock, c as createBlock, h as withCtx, x as createBaseVNode, z as unref, e as createElementBlock, l as normalizeStyle, a9 as createTextVNode, y as toDisplayString, c8 as useDevToolsClient, b_ as useFrameState, u as createVNode } from './index-5bcfd23e.js';
+import { h as checkIsSecurityContext } from './index-7ef2f30b.js';
 
 const _hoisted_1 = {
   key: 0

package/dist/client/assets/{assets-103b7b87.js → assets-64b2ffca.js}

@@ -1,11 +1,11 @@
-import { _ as __unplugin_components_0 } from './PanelGrids-bf67e36d.js';
-import { v as defineComponent, a$ as ref, cv as useElementSize, cw as onClickOutside, o as openBlock, c as createBlock, h as withCtx, e as createElementBlock, u as createVNode, x as createBaseVNode, f as renderSlot, k as mergeProps, z as unref, g as createCommentVNode, P as Transition, a1 as computed, y as toDisplayString, q as normalizeClass, cx as useStyleTag, l as normalizeStyle, cy as computedAsync, cs as useCopy, cz as useTimeAgo, F as Fragment, a9 as createTextVNode, c9 as rpc, cl as useDevToolsClient, bL as _sfc_main$a, cA as onKeyDown, aC as isRef, i as renderList, _ as __unplugin_components_7 } from './index-773a455a.js';
-import { _ as _sfc_main$9 } from './IconButton.vue_vue_type_script_setup_true_lang-f308a32e.js';
-import { _ as __unplugin_components_3 } from './SectionBlock-30cd0db7.js';
-import { _ as _sfc_main$b } from './TextInput.vue_vue_type_script_setup_true_lang-49fa3d66.js';
-import { _ as _sfc_main$c } from './Icon.vue_vue_type_script_setup_true_lang-9344440e.js';
+import { _ as __unplugin_components_0 } from './PanelGrids-e26dc60c.js';
+import { v as defineComponent, a$ as ref, cA as useElementSize, cB as onClickOutside, o as openBlock, c as createBlock, h as withCtx, e as createElementBlock, u as createVNode, x as createBaseVNode, f as renderSlot, k as mergeProps, z as unref, g as createCommentVNode, P as Transition, a1 as computed, y as toDisplayString, q as normalizeClass, cC as useStyleTag, l as normalizeStyle, cD as computedAsync, cx as useCopy, cE as useTimeAgo, F as Fragment, a9 as createTextVNode, cf as rpc, c8 as useDevToolsClient, bO as _sfc_main$a, cF as onKeyDown, aC as isRef, i as renderList, _ as __unplugin_components_7 } from './index-5bcfd23e.js';
+import { _ as _sfc_main$9 } from './IconButton.vue_vue_type_script_setup_true_lang-3d53773c.js';
+import { _ as __unplugin_components_3 } from './SectionBlock-667aa26c.js';
+import { _ as _sfc_main$b } from './TextInput.vue_vue_type_script_setup_true_lang-70f3e7d2.js';
+import { _ as _sfc_main$c } from './Icon.vue_vue_type_script_setup_true_lang-38720372.js';
 import { F as Fuse } from './fuse.esm-c317b696.js';
-import './IconTitle.vue_vue_type_script_setup_true_lang-4cf300a8.js';
+import './IconTitle.vue_vue_type_script_setup_true_lang-968221a7.js';
 
 const _hoisted_1$7 = {
   relative: "",
@@ -1077,19 +1077,15 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const icon = computed(() => {
-      if (props.asset.type === "image")
-        return "i-carbon-image";
-      if (props.asset.type === "video")
-        return "i-carbon-video";
-      if (props.asset.type === "audio")
-        return "i-carbon-volume-up";
-      if (props.asset.type === "font")
-        return "i-carbon-text-small-caps";
-      if (props.asset.type === "text")
-        return "i-carbon-document";
-      if (props.asset.type === "json")
-        return "i-carbon-json";
-      return "i-carbon-document-blank";
+      const assets = {
+        image: "i-carbon-image",
+        video: "i-carbon-video",
+        audio: "i-carbon-volume-up",
+        font: "i-carbon-text-small-caps",
+        text: "i-carbon-document",
+        json: "i-carbon-json"
+      };
+      return assets[props.asset.type] ?? "i-carbon-document-blank";
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("button", _hoisted_1$3, [