@done-coding/admin-core 0.8.3-alpha.0 → 0.9.1-alpha.0

package/es/components/app-layout/AppSidebar.vue2.mjs

@@ -1,13 +1,10 @@
-import { ElTooltip as T, ElIcon as H } from "element-plus/es";
-import "element-plus/es/components/base/style/css";
-import "element-plus/es/components/tooltip/style/css";
-import "element-plus/es/components/icon/style/css";
-import { defineComponent as P, useCssVars as w, unref as o, inject as A, computed as e, ref as b, toRefs as F, openBlock as f, createElementBlock as I, normalizeStyle as g, createVNode as a, withCtx as p, renderSlot as v, createElementVNode as h, createBlock as L, createCommentVNode as V } from "vue";
-import N from "../menu/MenuTree.vue.mjs";
-import y from "../display/WatchSize.vue.mjs";
-import { ArrowRightBold as R } from "@element-plus/icons-vue";
-import { APP_LAYOUT_APP_STORE_KEY as M } from "../../inject/key.mjs";
-const O = { class: "app-sidebar-shim" }, J = /* @__PURE__ */ P({
+import { defineComponent as w, useCssVars as A, inject as f, computed as e, ref as b, openBlock as g, createElementBlock as T, normalizeStyle as h, createVNode as l, unref as o, withCtx as u, renderSlot as C, createElementVNode as y, createBlock as H, createCommentVNode as L } from "vue";
+import F from "../menu/MenuTree.vue.mjs";
+import S from "../display/WatchSize.vue.mjs";
+import { ElTooltip as I, ElIcon as V } from "element-plus";
+import { ArrowRightBold as Y } from "@element-plus/icons-vue";
+import { APP_LAYOUT_APP_STORE_KEY as N, APP_LAYOUT_BRIDGE_KEY as O } from "../../inject/key.mjs";
+const R = { class: "app-sidebar-shim" }, G = /* @__PURE__ */ w({
   __name: "AppSidebar",
   props: {
     show: { type: Boolean },
@@ -16,82 +13,82 @@ const O = { class: "app-sidebar-shim" }, J = /* @__PURE__ */ P({
     menuFlatList: {}
   },
   setup(s) {
-    w((c) => ({
-      ce9ef212: o(E),
-      v309db2c2: o(x),
-      v2189b8a1: o(_),
-      v65908f82: o(l).bodyColor,
-      v42a24063: o(l).primaryColor
+    A((c) => ({
+      f2149ac0: d.value.left,
+      v6fb5779c: d.value.top,
+      e0532af8: d.value.bottom,
+      v36eef49e: E.value,
+      v7a209d86: _.value,
+      v0a70f74c: B.value,
+      v1ffafb76: a.value.bodyColor,
+      v738d1dcc: a.value.primaryColor
     }));
-    const C = s, r = A(M), m = e(() => r.sidebarStyle), d = b(0), u = b(0), S = e(() => parseFloat(m.value.paddingTop) || 0), x = e(
-      () => `${Math.max(S.value, d.value)}px`
-    ), _ = e(() => `${u.value}px`), E = e(() => C.aboveHeader ? 2 : 0), n = e(() => r.sidebarIsCollapse), $ = e(() => ({
+    const x = s, r = f(N), p = e(() => r.sidebarStyle), d = e(() => r.viewportPadding), m = b(0), v = b(0), P = e(() => parseFloat(p.value.paddingTop) || 0), _ = e(
+      () => `${Math.max(P.value, m.value)}px`
+    ), B = e(() => `${v.value}px`), E = e(() => x.aboveHeader ? 2 : 0), n = e(() => r.sidebarIsCollapse), $ = e(() => ({
       transform: `rotate(${n.value ? 0 : 180}deg)`
-    })), { theme: l } = F(r);
-    return (c, t) => {
-      const k = H, B = T;
-      return f(), I("div", {
-        class: "app-sidebar",
-        style: g(o(m))
-      }, [
-        a(o(y), {
-          class: "app-sidebar-top",
-          onHeightChange: t[0] || (t[0] = (i) => d.value = i)
-        }, {
-          default: p(() => [
-            v(c.$slots, "top", {}, void 0, !0)
-          ]),
-          _: 3
-        }),
-        h("div", O, [
-          a(o(N), {
-            collapse: o(n),
-            menus: s.menus,
-            style: { height: "100%" },
-            "background-color": o(l).bodyColor,
-            "text-color": o(l).baseColor,
-            "active-text-color": o(l).primaryColor,
-            menuFlatList: s.menuFlatList,
-            routerMode: ""
-          }, null, 8, ["collapse", "menus", "background-color", "text-color", "active-text-color", "menuFlatList"])
+    })), k = f(O), a = e(() => k.themeColors.value);
+    return (c, t) => (g(), T("div", {
+      class: "app-sidebar",
+      style: h(p.value)
+    }, [
+      l(o(S), {
+        class: "app-sidebar-top",
+        onHeightChange: t[0] || (t[0] = (i) => m.value = i)
+      }, {
+        default: u(() => [
+          C(c.$slots, "top", {}, void 0, !0)
         ]),
-        a(o(y), {
-          class: "app-sidebar-bottom",
-          onHeightChange: t[1] || (t[1] = (i) => u.value = i)
-        }, {
-          default: p(() => [
-            v(c.$slots, "bottom", {}, void 0, !0)
-          ]),
-          _: 3
-        }),
-        s.show ? (f(), L(B, {
-          key: 0,
-          content: o(n) ? "展开" : "收起",
-          placement: "right",
-          "show-after": 200
-        }, {
-          default: p(() => [
-            h("div", {
-              class: "app-sidebar-toggle",
-              onClick: t[2] || (t[2] = (i) => o(r).changeSidebarCollapseStatus(!o(n)))
-            }, [
-              a(k, null, {
-                default: p(() => [
-                  a(o(R), {
-                    class: "app-sidebar-toggle-icon",
-                    style: g(o($))
-                  }, null, 8, ["style"])
-                ]),
-                _: 1
-              })
-            ])
-          ]),
-          _: 1
-        }, 8, ["content"])) : V("", !0)
-      ], 4);
-    };
+        _: 3
+      }),
+      y("div", R, [
+        l(o(F), {
+          collapse: n.value,
+          menus: s.menus,
+          style: { height: "100%" },
+          "background-color": a.value.bodyColor,
+          "text-color": a.value.baseColor,
+          "active-text-color": a.value.primaryColor,
+          menuFlatList: s.menuFlatList,
+          routerMode: ""
+        }, null, 8, ["collapse", "menus", "background-color", "text-color", "active-text-color", "menuFlatList"])
+      ]),
+      l(o(S), {
+        class: "app-sidebar-bottom",
+        onHeightChange: t[1] || (t[1] = (i) => v.value = i)
+      }, {
+        default: u(() => [
+          C(c.$slots, "bottom", {}, void 0, !0)
+        ]),
+        _: 3
+      }),
+      s.show ? (g(), H(o(I), {
+        key: 0,
+        content: n.value ? "展开" : "收起",
+        placement: "right",
+        "show-after": 200
+      }, {
+        default: u(() => [
+          y("div", {
+            class: "app-sidebar-toggle",
+            onClick: t[2] || (t[2] = (i) => o(r).changeSidebarCollapseStatus(!n.value))
+          }, [
+            l(o(V), null, {
+              default: u(() => [
+                l(o(Y), {
+                  class: "app-sidebar-toggle-icon",
+                  style: h($.value)
+                }, null, 8, ["style"])
+              ]),
+              _: 1
+            })
+          ])
+        ]),
+        _: 1
+      }, 8, ["content"])) : L("", !0)
+    ], 4));
   }
 });
 export {
-  J as default
+  G as default
 };

package/es/components/app-layout/AppTheme.vue.mjs

@@ -0,0 +1,7 @@
+import o from "./AppTheme.vue2.mjs";
+/* empty css               */
+import p from "../../_virtual/_plugin-vue_export-helper.mjs";
+const e = /* @__PURE__ */ p(o, [["__scopeId", "data-v-1f068b22"]]);
+export {
+  e as default
+};

package/es/components/app-layout/AppTheme.vue2.mjs

@@ -0,0 +1,38 @@
+import { defineComponent as u, inject as p, computed as n, openBlock as a, createElementBlock as m, createBlock as r, unref as e, withCtx as v, Fragment as d, renderList as h, createCommentVNode as _, createVNode as f } from "vue";
+import { ElSelect as k, ElOption as y, ElSwitch as E } from "element-plus";
+import { Sunny as S, Moon as B } from "@element-plus/icons-vue";
+import { APP_LAYOUT_BRIDGE_KEY as b } from "../../inject/key.mjs";
+const g = { class: "app-theme" }, O = /* @__PURE__ */ u({
+  __name: "AppTheme",
+  setup(C) {
+    const l = p(b), c = n(() => l.themeIsDark.value), s = n(() => l.themeStyle.value), i = n(() => l.theme.list.value);
+    return (D, o) => (a(), m("div", g, [
+      i.value.length > 1 ? (a(), r(e(k), {
+        key: 0,
+        "model-value": s.value,
+        class: "app-theme__style-select",
+        size: "small",
+        onChange: o[0] || (o[0] = (t) => e(l).theme.setStyle(t))
+      }, {
+        default: v(() => [
+          (a(!0), m(d, null, h(i.value, (t) => (a(), r(e(y), {
+            key: t,
+            label: e(l).theme.labelOf(t),
+            value: t
+          }, null, 8, ["label", "value"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["model-value"])) : _("", !0),
+      f(e(E), {
+        "model-value": c.value,
+        class: "app-theme__dark-switch",
+        "active-action-icon": e(B),
+        "inactive-action-icon": e(S),
+        "onUpdate:modelValue": o[1] || (o[1] = (t) => e(l).theme.setDark(!!t))
+      }, null, 8, ["model-value", "active-action-icon", "inactive-action-icon"])
+    ]));
+  }
+});
+export {
+  O as default
+};

package/es/components/data-view/DataListView.vue.mjs

@@ -1,7 +1,7 @@
 import t from "./DataListView.vue2.mjs";
 /* empty css                   */
-import a from "../../_virtual/_plugin-vue_export-helper.mjs";
-const i = /* @__PURE__ */ a(t, [["__scopeId", "data-v-da38bea6"]]);
+import o from "../../_virtual/_plugin-vue_export-helper.mjs";
+const i = /* @__PURE__ */ o(t, [["__scopeId", "data-v-708af83f"]]);
 export {
   i as default
 };

package/es/components/data-view/DataListView.vue2.mjs

@@ -1,11 +1,11 @@
-import { defineComponent as v, computed as m, ref as A, watch as F, openBlock as i, createElementBlock as p, normalizeStyle as H, unref as f, Fragment as z, renderList as E, createBlock as K, withCtx as q, renderSlot as k, createVNode as I, markRaw as M, h as c } from "vue";
+import { defineComponent as S, computed as m, ref as R, watch as A, openBlock as i, createElementBlock as p, normalizeStyle as F, Fragment as H, renderList as z, createBlock as E, withCtx as K, renderSlot as h, createVNode as q, unref as I, markRaw as M, h as c } from "vue";
 import { ElEmpty as N } from "element-plus";
 import O from "./DataListViewItem.vue.mjs";
 import { createDataListViewInstance as P } from "./utils.mjs";
 const j = {
   key: 1,
   class: "data-list-view-empty"
-}, T = /* @__PURE__ */ v({
+}, T = /* @__PURE__ */ S({
   __name: "DataListView",
   props: {
     data: {},
@@ -16,26 +16,26 @@ const j = {
     getRenderCtxParams: {}
   },
   emits: ["selectionChange"],
-  setup(r, { expose: C, emit: b }) {
-    const o = r, V = b, s = (t) => {
+  setup(r, { expose: k, emit: C }) {
+    const o = r, b = C, s = (t) => {
       const e = o.rowKey;
       return typeof e == "function" ? e(t) : String(t[e]);
-    }, D = m(
+    }, V = m(
       () => o.maxHeight ? { maxHeight: `${o.maxHeight}px`, overflowY: "auto" } : void 0
-    ), l = A(/* @__PURE__ */ new Set()), L = m(() => l.value.size === o.data.length), g = (t) => o.selectable && l.value.has(s(t)), d = () => {
-      V("selectionChange", y());
-    }, y = () => o.selectable ? o.data.filter((t) => l.value.has(s(t))) : [], w = () => {
+    ), l = R(/* @__PURE__ */ new Set()), D = m(() => l.value.size === o.data.length), f = (t) => o.selectable && l.value.has(s(t)), d = () => {
+      b("selectionChange", g());
+    }, g = () => o.selectable ? o.data.filter((t) => l.value.has(s(t))) : [], y = () => {
       l.value = /* @__PURE__ */ new Set(), d();
-    }, _ = () => {
+    }, L = () => {
       if (!o.selectable) return;
-      const t = !L.value;
+      const t = !D.value;
       l.value = t ? new Set(o.data.map((e) => s(e))) : /* @__PURE__ */ new Set(), d();
-    }, x = (t) => {
+    }, v = (t) => {
       if (!o.selectable) return;
       const e = s(t), n = new Set(l.value);
       n.has(e) ? n.delete(e) : n.add(e), l.value = n, d();
-    }, $ = (t) => M(
-      v({
+    }, _ = (t) => M(
+      S({
         name: "DataViewField",
         props: {
           row: { type: Object, required: !0 },
@@ -45,7 +45,7 @@ const j = {
         },
         setup(e) {
           return () => {
-            const { type: n, render: a, prop: S } = t;
+            const { type: n, render: a, prop: w } = t;
             if (n === "index")
               return c("span", String(e.index + 1));
             if (n === "selection")
@@ -53,8 +53,8 @@ const j = {
                 type: "checkbox",
                 checked: e.selected,
                 onChange: () => {
-                  var h;
-                  return (h = e.toggleSelect) == null ? void 0 : h.call(e);
+                  var x;
+                  return (x = e.toggleSelect) == null ? void 0 : x.call(e);
                 }
               });
             if (typeof a == "function")
@@ -66,12 +66,12 @@ const j = {
               });
             if (a)
               return c(a);
-            const u = S ? e.row[S] : void 0;
+            const u = w ? e.row[w] : void 0;
             return c("span", u == null ? "" : String(u));
           };
         }
       })
-    ), B = m(() => {
+    ), $ = m(() => {
       const t = {};
       for (const e of o.columns) {
         if (e.type === "expand") continue;
@@ -83,42 +83,42 @@ const j = {
           );
           continue;
         }
-        t[n] && console.warn(`[DataListView] 列 key 重复 "${n}"，后者覆盖前者`), t[n] = $(e);
+        t[n] && console.warn(`[DataListView] 列 key 重复 "${n}"，后者覆盖前者`), t[n] = _(e);
       }
       return t;
-    }), R = P({
-      clearSelection: w,
-      getSelectionRows: y,
-      toggleRowSelection: x,
-      toggleAllSelection: _,
+    }), B = P({
+      clearSelection: y,
+      getSelectionRows: g,
+      toggleRowSelection: v,
+      toggleAllSelection: L,
       columns: o.columns
     });
-    return C(R), F(
+    return k(B), A(
       () => o.data,
       () => {
-        l.value.size && w();
+        l.value.size && y();
       }
     ), (t, e) => (i(), p("div", {
       class: "data-list-view",
-      style: H(f(D))
+      style: F(V.value)
     }, [
-      r.data.length ? (i(!0), p(z, { key: 0 }, E(r.data, (n, a) => (i(), K(O, {
+      r.data.length ? (i(!0), p(H, { key: 0 }, z(r.data, (n, a) => (i(), E(O, {
         key: s(n),
-        selected: g(n)
+        selected: f(n)
       }, {
-        default: q(() => [
-          k(t.$slots, "item", {
-            fieldComponentMap: f(B),
+        default: K(() => [
+          h(t.$slots, "item", {
+            fieldComponentMap: $.value,
             row: n,
             index: a,
-            selected: g(n),
-            toggleSelect: () => x(n)
+            selected: f(n),
+            toggleSelect: () => v(n)
           }, void 0, !0)
         ]),
         _: 2
       }, 1032, ["selected"]))), 128)) : (i(), p("div", j, [
-        k(t.$slots, "empty", {}, () => [
-          I(f(N))
+        h(t.$slots, "empty", {}, () => [
+          q(I(N))
         ], !0)
       ]))
     ], 4));

package/es/components/display/ActionConfirm.vue2.mjs

@@ -1,5 +1,5 @@
-import { defineComponent as V, useModel as P, ref as $, computed as s, h as r, openBlock as o, createBlock as u, unref as d, withCtx as c, createElementVNode as x, createElementBlock as f, resolveDynamicComponent as C, createCommentVNode as k, createVNode as m, createTextVNode as T, toDisplayString as _, renderSlot as v, Fragment as z, mergeModels as D } from "vue";
-import { ElPopover as S, ElButton as b } from "element-plus";
+import { defineComponent as _, useModel as P, ref as $, computed as s, h as r, openBlock as o, createBlock as u, unref as d, withCtx as c, createElementVNode as C, createElementBlock as f, resolveDynamicComponent as x, createCommentVNode as k, createVNode as m, createTextVNode as T, toDisplayString as b, renderSlot as v, Fragment as z, mergeModels as D } from "vue";
+import { ElPopover as S, ElButton as N } from "element-plus";
 import A from "../modal/ConfirmModal.vue.mjs";
 const U = { class: "action-confirm" }, j = {
   key: 0,
@@ -7,7 +7,7 @@ const U = { class: "action-confirm" }, j = {
 }, q = {
   key: 1,
   class: "action-confirm__content"
-}, G = { class: "action-confirm__actions" }, K = /* @__PURE__ */ V({
+}, G = { class: "action-confirm__actions" }, K = /* @__PURE__ */ _({
   __name: "ActionConfirm",
   props: /* @__PURE__ */ D({
     mode: {},
@@ -29,7 +29,7 @@ const U = { class: "action-confirm" }, j = {
     }, y = (e) => {
       if (!(e == null || e === ""))
         return typeof e == "string" ? () => r("span", e) : () => e;
-    }, p = s(() => y(l(n.title))), h = s(() => y(l(n.content))), N = async () => {
+    }, p = s(() => y(l(n.title))), h = s(() => y(l(n.content))), B = async () => {
       a.value = !0;
       try {
         await Promise.resolve(n.submitFn()), i.value = !1;
@@ -39,7 +39,7 @@ const U = { class: "action-confirm" }, j = {
       }
     }, g = () => {
       i.value = !1;
-    }, B = s(() => {
+    }, M = s(() => {
       const e = l(n.title);
       if (!(e === void 0 || e === ""))
         return typeof e == "string" ? e : () => r("span", e);
@@ -64,32 +64,32 @@ const U = { class: "action-confirm" }, j = {
         v(e.$slots, "default", {}, void 0, !0)
       ]),
       default: c(() => [
-        x("div", U, [
+        C("div", U, [
           p.value ? (o(), f("div", j, [
-            (o(), u(C(p.value)))
+            (o(), u(x(p.value)))
           ])) : k("", !0),
           h.value ? (o(), f("div", q, [
-            (o(), u(C(h.value)))
+            (o(), u(x(h.value)))
           ])) : k("", !0),
-          x("div", G, [
-            m(d(b), {
+          C("div", G, [
+            m(d(N), {
               size: "small",
               disabled: a.value,
               onClick: g
             }, {
               default: c(() => [
-                T(_(t.cancelText), 1)
+                T(b(t.cancelText), 1)
               ]),
               _: 1
             }, 8, ["disabled"]),
-            m(d(b), {
+            m(d(N), {
               size: "small",
               type: t.type,
               loading: a.value,
-              onClick: N
+              onClick: B
             }, {
               default: c(() => [
-                T(_(t.confirmText), 1)
+                T(b(t.confirmText), 1)
               ]),
               _: 1
             }, 8, ["type", "loading"])
@@ -101,8 +101,8 @@ const U = { class: "action-confirm" }, j = {
       v(e.$slots, "default", {}, void 0, !0),
       m(A, {
         show: i.value,
-        "onUpdate:show": w[0] || (w[0] = (M) => i.value = M),
-        title: B.value,
+        "onUpdate:show": w[0] || (w[0] = (V) => i.value = V),
+        title: M.value,
         content: E.value,
         "confirm-text": t.confirmText,
         "cancel-text": t.cancelText,

package/es/components/display/HeightProvider.vue.mjs

@@ -1,14 +1,14 @@
-import { defineComponent as p, ref as u, computed as a, watch as d, openBlock as i, createElementBlock as g, Fragment as f, createBlock as H, withCtx as v, renderSlot as n, createCommentVNode as w, normalizeProps as C, guardReactiveProps as _, unref as k } from "vue";
-import P from "./WatchSize.vue.mjs";
-const S = /* @__PURE__ */ p({
+import { defineComponent as p, ref as u, computed as a, watch as d, openBlock as i, createElementBlock as g, Fragment as f, createBlock as v, withCtx as H, renderSlot as n, createCommentVNode as w, normalizeProps as C, guardReactiveProps as _ } from "vue";
+import k from "./WatchSize.vue.mjs";
+const V = /* @__PURE__ */ p({
   __name: "HeightProvider",
   props: {
     viewportHeight: {},
     minHeight: { default: 0 }
   },
   emits: ["childViewportHeightChange"],
-  setup(s, { emit: l }) {
-    const t = s, h = l, o = u(0), r = a(
+  setup(l, { emit: s }) {
+    const t = l, h = s, o = u(0), r = a(
       () => Math.max(t.viewportHeight - o.value, t.minHeight)
     ), m = (e) => {
       o.value = e;
@@ -19,20 +19,20 @@ const S = /* @__PURE__ */ p({
     );
     return d(r, (e) => h("childViewportHeightChange", e), {
       immediate: !0
-    }), (e, $) => (i(), g(f, null, [
-      e.$slots.header ? (i(), H(P, {
+    }), (e, P) => (i(), g(f, null, [
+      e.$slots.header ? (i(), v(k, {
         key: 0,
         onHeightChange: m
       }, {
-        default: v(() => [
+        default: H(() => [
           n(e.$slots, "header")
         ]),
         _: 3
       })) : w("", !0),
-      n(e.$slots, "default", C(_(k(c))))
+      n(e.$slots, "default", C(_(c.value)))
     ], 64));
   }
 });
 export {
-  S as default
+  V as default
 };

package/es/components/display/TabsHeader.vue.mjs

@@ -1,7 +1,7 @@
-import o from "./TabsHeader.vue2.mjs";
+import a from "./TabsHeader.vue2.mjs";
 /* empty css                 */
-import r from "../../_virtual/_plugin-vue_export-helper.mjs";
-const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-d6937179"]]);
+import o from "../../_virtual/_plugin-vue_export-helper.mjs";
+const e = /* @__PURE__ */ o(a, [["__scopeId", "data-v-3faa57f5"]]);
 export {
-  m as default
+  e as default
 };

package/es/components/display/TabsHeader.vue2.mjs

@@ -1,5 +1,5 @@
-import { defineComponent as $, toRefs as z, useModel as K, ref as T, computed as n, onMounted as g, onBeforeUnmount as B, watch as R, openBlock as i, createElementBlock as r, normalizeClass as b, unref as o, Fragment as S, renderList as D, renderSlot as H, createTextVNode as I, toDisplayString as N, normalizeStyle as V, createCommentVNode as F, mergeModels as U, nextTick as W } from "vue";
-const X = ["onClick"], q = /* @__PURE__ */ $({
+import { defineComponent as L, toRefs as $, useModel as z, ref as K, computed as n, onMounted as T, onBeforeUnmount as g, watch as B, openBlock as s, createElementBlock as l, normalizeClass as y, Fragment as R, renderList as S, unref as D, renderSlot as H, createTextVNode as I, toDisplayString as N, normalizeStyle as V, createCommentVNode as F, mergeModels as U, nextTick as W } from "vue";
+const X = ["onClick"], q = /* @__PURE__ */ L({
   __name: "TabsHeader",
   props: /* @__PURE__ */ U({
     tabs: {},
@@ -10,63 +10,63 @@ const X = ["onClick"], q = /* @__PURE__ */ $({
     activeKeyModifiers: {}
   }),
   emits: ["update:activeKey"],
-  setup(v) {
-    const d = v, { tabs: k, level: h, variant: M } = z(d), s = K(v, "activeKey"), l = /* @__PURE__ */ new Map(), m = T(0), f = n(
-      () => Math.min(Math.max(Math.floor(h.value), 1), 4)
-    ), w = n(() => `tabs-main-bar--l${f.value}`), C = {
+  setup(u) {
+    const v = u, { tabs: b, level: k, variant: h } = $(v), o = z(u, "activeKey"), i = /* @__PURE__ */ new Map(), d = K(0), m = n(
+      () => Math.min(Math.max(Math.floor(k.value), 1), 4)
+    ), M = n(() => `tabs-main-bar--l${m.value}`), w = {
       1: "card",
       2: "indicator",
       3: "indicator-compact",
       4: "plain"
-    }, c = n(
-      () => M.value ?? C[f.value]
+    }, r = n(
+      () => h.value ?? w[m.value]
+    ), C = n(
+      () => `tabs-main-bar--variant-${r.value}`
     ), x = n(
-      () => `tabs-main-bar--variant-${c.value}`
-    ), _ = n(
-      () => c.value === "indicator" || c.value === "indicator-compact"
-    ), E = n(() => {
-      const [, t] = [m.value, s.value], a = t ? l.get(t) : void 0;
+      () => r.value === "indicator" || r.value === "indicator-compact"
+    ), _ = n(() => {
+      const [, t] = [d.value, o.value], a = t ? i.get(t) : void 0;
       return a ? {
         width: `${a.offsetWidth}px`,
         transform: `translateX(${a.offsetLeft}px)`
       } : { width: "0px" };
-    }), L = (t, a) => {
-      a instanceof HTMLElement ? l.set(t, a) : l.delete(t);
-    }, u = () => {
+    }), E = (t, a) => {
+      a instanceof HTMLElement ? i.set(t, a) : i.delete(t);
+    }, c = () => {
       W(() => {
-        m.value++;
+        d.value++;
       });
-    }, p = () => u();
-    return g(() => {
-      u(), window.addEventListener("resize", p);
-    }), B(() => {
-      window.removeEventListener("resize", p);
-    }), R(
-      () => d.tabs,
-      () => u(),
+    }, f = () => c();
+    return T(() => {
+      c(), window.addEventListener("resize", f);
+    }), g(() => {
+      window.removeEventListener("resize", f);
+    }), B(
+      () => v.tabs,
+      () => c(),
       { flush: "post" }
-    ), (t, a) => (i(), r("div", {
-      class: b(["tabs-main-bar", [o(w), o(x)]])
+    ), (t, a) => (s(), l("div", {
+      class: y(["tabs-main-bar", [M.value, C.value]])
     }, [
-      (i(!0), r(S, null, D(o(k), (e) => (i(), r("button", {
+      (s(!0), l(R, null, S(D(b), (e) => (s(), l("button", {
         key: e.key,
         ref_for: !0,
-        ref: (y) => L(e.key, y),
+        ref: (p) => E(e.key, p),
         type: "button",
-        class: b(["tabs-main-bar-item", { "tabs-main-bar-item_active": e.key === s.value }]),
-        onClick: (y) => s.value = e.key
+        class: y(["tabs-main-bar-item", { "tabs-main-bar-item_active": e.key === o.value }]),
+        onClick: (p) => o.value = e.key
       }, [
         H(t.$slots, e.key, {
           tab: e,
-          active: e.key === s.value
+          active: e.key === o.value
         }, () => [
           I(N(e.title), 1)
         ], !0)
       ], 10, X))), 128)),
-      o(_) ? (i(), r("div", {
+      x.value ? (s(), l("div", {
         key: 0,
         class: "tabs-main-bar-indicator",
-        style: V(o(E))
+        style: V(_.value)
       }, null, 4)) : F("", !0)
     ], 2));
   }