@oiij/chrome-tabs 0.0.2 → 0.0.4

package/dist/index.js

@@ -1,4 +1,4 @@
-import { inject as Le, onBeforeMount as je, createElementBlock as A, openBlock as I, createStaticVNode as Te, createElementVNode as k, defineComponent as $e, computed as N, h as re, normalizeClass as E, unref as p, createCommentVNode as Q, createBlock as X, resolveDynamicComponent as ie, withModifiers as Pe, createVNode as q, onMounted as ke, nextTick as we, watch as D, getCurrentScope as ze, onScopeDispose as Oe, getCurrentInstance as Ce, toValue as L, shallowRef as ee, ref as De, mergeModels as se, useModel as Ve, normalizeStyle as We, renderSlot as ue, TransitionGroup as _e, withCtx as He, Fragment as Fe, renderList as qe, mergeProps as Ge } from "vue";
+import { inject as Be, onBeforeMount as Le, createElementBlock as _, openBlock as E, createStaticVNode as je, createElementVNode as k, defineComponent as $e, computed as M, h as re, normalizeClass as C, unref as b, createCommentVNode as Q, createBlock as X, resolveDynamicComponent as ie, withModifiers as Te, createVNode as q, onMounted as ke, nextTick as we, watch as O, getCurrentScope as Pe, onScopeDispose as ze, getCurrentInstance as Ce, toValue as B, shallowRef as ee, ref as Oe, mergeModels as se, useModel as De, normalizeStyle as Ve, renderSlot as ue, TransitionGroup as He, withCtx as We, Fragment as Fe, renderList as qe, mergeProps as Ge } from "vue";
 function Ze(e) {
   let t = ".", n = "__", o = "--", r;
   if (e) {
@@ -8,51 +8,51 @@ function Ze(e) {
   const i = {
     install(l) {
       r = l.c;
-      const b = l.context;
-      b.bem = {}, b.bem.b = null, b.bem.els = null;
+      const p = l.context;
+      p.bem = {}, p.bem.b = null, p.bem.els = null;
     }
   };
   function s(l) {
-    let b, h;
+    let p, h;
     return {
       before(m) {
-        b = m.bem.b, h = m.bem.els, m.bem.els = null;
+        p = m.bem.b, h = m.bem.els, m.bem.els = null;
       },
       after(m) {
-        m.bem.b = b, m.bem.els = h;
+        m.bem.b = p, m.bem.els = h;
       },
       $({ context: m, props: $ }) {
-        return l = typeof l == "string" ? l : l({ context: m, props: $ }), m.bem.b = l, `${($ == null ? void 0 : $.bPrefix) || t}${m.bem.b}`;
+        return l = typeof l == "string" ? l : l({ context: m, props: $ }), m.bem.b = l, `${$?.bPrefix || t}${m.bem.b}`;
       }
     };
   }
   function u(l) {
-    let b;
+    let p;
     return {
       before(h) {
-        b = h.bem.els;
+        p = h.bem.els;
       },
       after(h) {
-        h.bem.els = b;
+        h.bem.els = p;
       },
       $({ context: h, props: m }) {
-        return l = typeof l == "string" ? l : l({ context: h, props: m }), h.bem.els = l.split(",").map(($) => $.trim()), h.bem.els.map(($) => `${(m == null ? void 0 : m.bPrefix) || t}${h.bem.b}${n}${$}`).join(", ");
+        return l = typeof l == "string" ? l : l({ context: h, props: m }), h.bem.els = l.split(",").map(($) => $.trim()), h.bem.els.map(($) => `${m?.bPrefix || t}${h.bem.b}${n}${$}`).join(", ");
       }
     };
   }
   function f(l) {
     return {
-      $({ context: b, props: h }) {
-        l = typeof l == "string" ? l : l({ context: b, props: h });
-        const m = l.split(",").map((j) => j.trim());
-        function $(j) {
-          return m.map((V) => `&${(h == null ? void 0 : h.bPrefix) || t}${b.bem.b}${j !== void 0 ? `${n}${j}` : ""}${o}${V}`).join(", ");
+      $({ context: p, props: h }) {
+        l = typeof l == "string" ? l : l({ context: p, props: h });
+        const m = l.split(",").map((L) => L.trim());
+        function $(L) {
+          return m.map((D) => `&${h?.bPrefix || t}${p.bem.b}${L !== void 0 ? `${n}${L}` : ""}${o}${D}`).join(", ");
         }
-        const P = b.bem.els;
-        if (P !== null) {
-          if (process.env.NODE_ENV !== "production" && P.length >= 2)
+        const T = p.bem.els;
+        if (T !== null) {
+          if (process.env.NODE_ENV !== "production" && T.length >= 2)
             throw Error(`[css-render/plugin-bem]: m(${l}) is invalid, using modifier inside multiple elements is not allowed`);
-          return $(P[0]);
+          return $(T[0]);
         } else
           return $();
       }
@@ -60,12 +60,12 @@ function Ze(e) {
   }
   function c(l) {
     return {
-      $({ context: b, props: h }) {
-        l = typeof l == "string" ? l : l({ context: b, props: h });
-        const m = b.bem.els;
+      $({ context: p, props: h }) {
+        l = typeof l == "string" ? l : l({ context: p, props: h });
+        const m = p.bem.els;
         if (process.env.NODE_ENV !== "production" && m !== null && m.length >= 2)
           throw Error(`[css-render/plugin-bem]: notM(${l}) is invalid, using modifier inside multiple elements is not allowed`);
-        return `&:not(${(h == null ? void 0 : h.bPrefix) || t}${b.bem.b}${m !== null && m.length > 0 ? `${n}${m[0]}` : ""}${o}${l})`;
+        return `&:not(${h?.bPrefix || t}${p.bem.b}${m !== null && m.length > 0 ? `${n}${m[0]}` : ""}${o}${l})`;
       }
     };
   }
@@ -145,7 +145,7 @@ function Xe(e) {
   const t = document.createElement("style");
   return t.setAttribute("cssr-id", e), t;
 }
-function W(e) {
+function V(e) {
   return e ? /^\s*@(s|m)/.test(e) : !1;
 }
 const et = /[A-Z]/g;
@@ -207,21 +207,21 @@ function Me(e, t, n, o, r) {
   const i = e.$;
   let s = "";
   if (!i || typeof i == "string")
-    W(i) ? s = i : t.push(i);
+    V(i) ? s = i : t.push(i);
   else if (typeof i == "function") {
     const c = i({
       context: o.context,
       props: r
     });
-    W(c) ? s = c : t.push(c);
+    V(c) ? s = c : t.push(c);
   } else if (i.before && i.before(o.context), !i.$ || typeof i.$ == "string")
-    W(i.$) ? s = i.$ : t.push(i.$);
+    V(i.$) ? s = i.$ : t.push(i.$);
   else if (i.$) {
     const c = i.$({
       context: o.context,
       props: r
     });
-    W(c) ? s = c : t.push(c);
+    V(c) ? s = c : t.push(c);
   }
   const u = Qe(t), f = ae(u, e.props, o, r);
   s ? n.push(`${s} {`) : f.length && n.push(f), e.children && te(e.children, {
@@ -304,7 +304,7 @@ function at(e = {}) {
   const { id: t, parent: n } = e;
   it(this.instance, this, t, n);
 }
-const _ = function(e, t, n, o) {
+const H = function(e, t, n, o) {
   return {
     instance: e,
     $: t,
@@ -316,7 +316,7 @@ const _ = function(e, t, n, o) {
     unmount: at
   };
 }, ct = function(e, t, n, o) {
-  return Array.isArray(t) ? _(e, { $: null }, null, t) : Array.isArray(n) ? _(e, t, null, n) : Array.isArray(o) ? _(e, t, n, o) : _(e, t, n, null);
+  return Array.isArray(t) ? H(e, { $: null }, null, t) : Array.isArray(n) ? H(e, t, null, n) : Array.isArray(o) ? H(e, t, n, o) : H(e, t, n, null);
 };
 function ft(e = {}) {
   const t = {
@@ -349,23 +349,23 @@ function mt(e, t) {
 ${t}
 </style>`;
 }
-function vt(e, t, n) {
+function pt(e, t, n) {
   const { styles: o, ids: r } = n;
   r.has(e) || o !== null && (r.add(e), o.push(mt(e, t)));
 }
-const bt = typeof document < "u";
-function pt() {
-  if (bt)
+const vt = typeof document < "u";
+function bt() {
+  if (vt)
     return;
-  const e = Le(ht, null);
+  const e = Be(ht, null);
   if (e !== null)
     return {
-      adapter: (t, n) => vt(t, n, e),
+      adapter: (t, n) => pt(t, n, e),
       context: e
     };
 }
 function gt(e, t) {
-  const n = pt();
+  const n = bt();
   function o() {
     t.mount({
       id: e,
@@ -373,14 +373,14 @@ function gt(e, t) {
       ssr: n
     });
   }
-  n ? o() : je(() => {
+  n ? o() : Le(() => {
     o();
   });
 }
-const { cssr: xt, plugin: yt, namespace: Ne } = dt(), { c: x, cB: H, cE: g, cM: U, cNotM: fe } = { ...xt, ...yt }, z = `${Ne}-chrome-tabs`, C = `${Ne}-chrome-tabs-item`, T = "all .2s cubic-bezier(.4, 0, .2, 1)";
+const { cssr: xt, plugin: yt, namespace: Ne } = dt(), { c: g, cB: W, cE: x, cM: U, cNotM: fe } = { ...xt, ...yt }, P = `${Ne}-chrome-tabs`, w = `${Ne}-chrome-tabs-item`, j = "all .2s cubic-bezier(.4, 0, .2, 1)";
 function $t() {
-  return x([
-    H("chrome-tabs", {
+  return g([
+    W("chrome-tabs", {
       display: "flex",
       width: "100%",
       height: "40px",
@@ -389,15 +389,18 @@ function $t() {
       backgroundColor: "var(--background-color)",
       color: "var(--background-color-dark)"
     }, [
-      x(".group-move, .group-enter-active, .group-leave-active", {
-        transition: T
+      g("div", {
+        boxSizing: "border-box"
       }),
-      x(".group-enter-from, .group-leave-to", {
+      g(".group-move, .group-enter-active, .group-leave-active", {
+        transition: j
+      }),
+      g(".group-enter-from, .group-leave-to", {
         opacity: 0
       }),
-      x(".group-leave-active", {}),
-      g("prefix", {}),
-      g("icon", {
+      g(".group-leave-active", {}),
+      x("prefix", {}),
+      x("icon", {
         width: "28px",
         height: "28px",
         display: "flex",
@@ -406,18 +409,18 @@ function $t() {
         padding: "5px",
         borderRadius: "10px",
         backgroundColor: "var(--active-background-color)",
-        transition: T
+        transition: j
       }, [
-        x("svg", {
+        g("svg", {
           width: "100%",
           height: "100%",
           fill: "currentColor"
         }),
-        x("&:hover", {
+        g("&:hover", {
           backgroundColor: "var(--primary-color)"
         })
       ]),
-      g("content", {
+      x("content", {
         flex: "1",
         height: "100%",
         minWidth: 0,
@@ -425,26 +428,26 @@ function $t() {
         marginLeft: "-6px",
         padding: "0 10px"
       }),
-      g("scroll", {
+      x("scroll", {
         position: "relative",
         display: "flex",
         alignItems: "center",
         height: "100%"
       }, [
-        g("icon", {
+        x("icon", {
           marginLeft: "5px",
           borderRadius: "50%",
           backgroundColor: "transparent",
           flexShrink: 0
         }, [
-          x("&:hover", {
+          g("&:hover", {
             backgroundColor: "var(--primary-color)"
           })
         ])
       ]),
-      g("suffix", {})
+      x("suffix", {})
     ]),
-    H("chrome-tabs-item", {
+    W("chrome-tabs-item", {
       position: "relative",
       margin: "0 -5px",
       height: "100%",
@@ -460,24 +463,24 @@ function $t() {
         filter: "grayscale(0.5)"
       }),
       U("active", [
-        g("background", {
+        x("background", {
           opacity: 1
         })
       ]),
       fe("active", [
-        x("&:hover", {}, [
-          g("content", {
+        g("&:hover", {}, [
+          x("content", {
             backgroundColor: "var(--primary-color)"
           })
         ])
       ]),
-      x("&::first-child", {
+      g("&::first-child", {
         marginLeft: "0 !important"
       }),
-      x("&::last-child", {
+      g("&::last-child", {
         marginRight: "0 !important"
       }),
-      g("content", {
+      x("content", {
         position: "relative",
         zIndex: 1,
         height: "28px",
@@ -486,17 +489,19 @@ function $t() {
         gap: "5px",
         borderRadius: "10px",
         padding: "0 10px",
-        transition: T
+        transition: j
       }),
-      g("slot", {}),
-      g("icon", {}, [
-        x("svg", {
+      x("slot", {}),
+      x("icon", {
+        lineHeight: 1
+      }, [
+        g("svg", {
           width: "1.2em",
           height: "1.2em",
           fill: "currentColor"
         })
       ]),
-      g("close", {
+      x("close", {
         width: "16px",
         height: "16px",
         padding: "2px",
@@ -504,18 +509,18 @@ function $t() {
         alignItems: "center",
         justifyContent: "center",
         borderRadius: "50%",
-        transition: T
+        transition: j
       }, [
-        x("&:hover", {
+        g("&:hover", {
           backgroundColor: "rgba(0,0,0,0.1)"
         }),
-        x("svg", {
+        g("svg", {
           width: "100%",
           height: "100%",
           fill: "currentColor"
         })
       ]),
-      g("background", {
+      x("background", {
         position: "absolute",
         opacity: 0,
         left: 0,
@@ -525,27 +530,27 @@ function $t() {
         width: "100%",
         display: "flex",
         alignItems: "flex-end",
-        transition: T
+        transition: j
       }, [
-        g("block", {
+        x("block", {
           height: "100%",
           flex: 1,
           minWidth: 0,
           borderRadius: "10px 10px 0 0",
           backgroundColor: "var(--active-background-color)"
         }),
-        x("svg", {
+        g("svg", {
           fill: "var(--active-background-color)"
         })
       ]),
-      g("line", {
+      x("line", {
         position: "absolute",
         bottom: "12px",
         right: "4px",
         height: "16px",
         width: "2px",
         borderRadius: "1px",
-        transition: T,
+        transition: j,
         backgroundColor: "var(--primary-color)",
         opacity: 0
       }, [
@@ -554,32 +559,32 @@ function $t() {
         })
       ])
     ]),
-    x(".dark", [
-      H("chrome-tabs", {
+    g(".dark", [
+      W("chrome-tabs", {
         backgroundColor: "var(--background-color-dark)",
         color: "var(--background-color)"
       }, [
-        g("icon", {
+        x("icon", {
           backgroundColor: "var(--active-background-color-dark)"
         }, [
-          x("&:hover", {
+          g("&:hover", {
             backgroundColor: "var(--primary-color-dark)"
           })
         ])
       ]),
-      H("chrome-tabs-item", {}, [
+      W("chrome-tabs-item", {}, [
         fe("active", [
-          x("&:hover", {}, [
-            g("content", {
+          g("&:hover", {}, [
+            x("content", {
               backgroundColor: "var(--primary-color-dark)"
             })
           ])
         ]),
-        g("background", {}, [
-          g("block", {
+        x("background", {}, [
+          x("block", {
             backgroundColor: "var(--active-background-color-dark)"
           }),
-          x("svg", {
+          g("svg", {
             fill: "var(--active-background-color-dark)"
           })
         ])
@@ -601,8 +606,8 @@ const Z = (e, t) => {
   viewBox: "0 0 24 24"
 };
 function Ct(e, t, n, o, r, i) {
-  return I(), A("svg", wt, t[0] || (t[0] = [
-    Te('<g fill="none" stroke="#757575" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path stroke-dasharray="16" stroke-dashoffset="16" d="M12 3c4.97 0 9 4.03 9 9"><animate fill="freeze" attributeName="stroke-dashoffset" dur="0.3s" values="16;0"></animate><animateTransform attributeName="transform" dur="1.5s" repeatCount="indefinite" type="rotate" values="0 12 12;360 12 12"></animateTransform></path><path stroke-dasharray="64" stroke-dashoffset="64" stroke-opacity=".3" d="M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z"><animate fill="freeze" attributeName="stroke-dashoffset" dur="1.2s" values="64;0"></animate></path></g>', 1)
+  return E(), _("svg", wt, t[0] || (t[0] = [
+    je('<g fill="none" stroke="#757575" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path stroke-dasharray="16" stroke-dashoffset="16" d="M12 3c4.97 0 9 4.03 9 9"><animate fill="freeze" attributeName="stroke-dashoffset" dur="0.3s" values="16;0"></animate><animateTransform attributeName="transform" dur="1.5s" repeatCount="indefinite" type="rotate" values="0 12 12;360 12 12"></animateTransform></path><path stroke-dasharray="64" stroke-dashoffset="64" stroke-opacity=".3" d="M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z"><animate fill="freeze" attributeName="stroke-dashoffset" dur="1.2s" values="64;0"></animate></path></g>', 1)
   ]));
 }
 const Et = /* @__PURE__ */ Z(kt, [["render", Ct]]), It = {
@@ -614,14 +619,14 @@ const Et = /* @__PURE__ */ Z(kt, [["render", Ct]]), It = {
   viewBox: "0 0 24 24"
 };
 function Nt(e, t, n, o, r, i) {
-  return I(), A("svg", Mt, t[0] || (t[0] = [
+  return E(), _("svg", Mt, t[0] || (t[0] = [
     k("path", {
       fill: "#757575",
       d: "m12 10.587l4.95-4.95l1.414 1.414l-4.95 4.95l4.95 4.95l-1.415 1.414l-4.95-4.95l-4.949 4.95l-1.414-1.415l4.95-4.95l-4.95-4.95L7.05 5.638z"
     }, null, -1)
   ]));
 }
-const St = /* @__PURE__ */ Z(It, [["render", Nt]]), At = /* @__PURE__ */ $e({
+const St = /* @__PURE__ */ Z(It, [["render", Nt]]), _t = /* @__PURE__ */ $e({
   __name: "TabItem",
   props: {
     label: { type: [String, Function] },
@@ -638,53 +643,50 @@ const St = /* @__PURE__ */ Z(It, [["render", Nt]]), At = /* @__PURE__ */ $e({
   },
   emits: ["itemClick", "itemContextmenu", "itemClose"],
   setup(e, { emit: t }) {
-    const n = t, o = N(() => e.activeIndex !== e.index && e.activeIndex !== e.index - 1), r = N(() => e.activeIndex === e.index), i = N(() => typeof e.label == "string" ? re("span", { class: `${C}__label` }, e.label) : e.label), s = N(() => e.loadingIcon ?? re(Et));
+    const n = t, o = M(() => e.activeIndex !== e.index && e.activeIndex !== e.index - 1), r = M(() => e.activeIndex === e.index), i = M(() => typeof e.label == "string" ? re("span", { class: `${w}__label` }, e.label) : e.label), s = M(() => e.loadingIcon ?? re(Et));
     function u(d) {
-      var a;
-      d.stopPropagation(), n("itemClick", d), (a = e.onClick) == null || a.call(e, d);
+      d.stopPropagation(), n("itemClick", d), e.onClick?.(d);
     }
     function f(d) {
-      var a;
-      n("itemContextmenu", d), (a = e.onContextMenu) == null || a.call(e, d);
+      n("itemContextmenu", d), e.onContextMenu?.(d);
     }
     function c() {
-      var d;
-      n("itemClose"), (d = e.onClose) == null || d.call(e);
+      n("itemClose"), e.onClose?.();
     }
-    return (d, a) => (I(), A("div", {
-      class: E([
-        p(C),
+    return (d, a) => (E(), _("div", {
+      class: C([
+        b(w),
         {
-          [`${p(C)}--active`]: r.value,
-          [`${p(C)}--disabled`]: d.disabled
+          [`${b(w)}--active`]: r.value,
+          [`${b(w)}--disabled`]: d.disabled
         }
       ]),
       onClick: u,
       onContextmenu: f
     }, [
       k("div", {
-        class: E([`${p(C)}__content`])
+        class: C([`${b(w)}__content`])
       }, [
         k("div", {
-          class: E([`${p(C)}__icon`])
+          class: C([`${b(w)}__icon`])
         }, [
-          (I(), X(ie(d.loading ? s.value : d.icon)))
+          (E(), X(ie(d.loading ? s.value : d.icon)))
         ], 2),
         k("div", {
-          class: E([`${p(C)}__slot`])
+          class: C([`${b(w)}__slot`])
         }, [
-          (I(), X(ie(i.value)))
+          (E(), X(ie(i.value)))
         ], 2),
-        d.closable ? (I(), A("div", {
+        d.closable ? (E(), _("div", {
           key: 0,
-          class: E([`${p(C)}__close`]),
-          onClick: Pe(c, ["stop"])
+          class: C([`${b(w)}__close`]),
+          onClick: Te(c, ["stop"])
         }, [
           q(St)
         ], 2)) : Q("", !0)
       ], 2),
       k("div", {
-        class: E([`${p(C)}__background`])
+        class: C([`${b(w)}__background`])
       }, [
         a[0] || (a[0] = k("svg", {
           width: "10",
@@ -693,7 +695,7 @@ const St = /* @__PURE__ */ Z(It, [["render", Nt]]), At = /* @__PURE__ */ $e({
           k("path", { d: "M 0 10 A 10 10 0 0 0 10 0 L 10 10 Z" })
         ], -1)),
         k("div", {
-          class: E([`${p(C)}__block`])
+          class: C([`${b(w)}__block`])
         }, null, 2),
         a[1] || (a[1] = k("svg", {
           width: "10",
@@ -703,19 +705,19 @@ const St = /* @__PURE__ */ Z(It, [["render", Nt]]), At = /* @__PURE__ */ $e({
         ], -1))
       ], 2),
       k("div", {
-        class: E([`${p(C)}__line`, o.value ? `${p(C)}__line--show` : ""])
+        class: C([`${b(w)}__line`, o.value ? `${b(w)}__line--show` : ""])
       }, null, 2)
     ], 34));
   }
 });
 function Se(e) {
-  return ze() ? (Oe(e), !0) : !1;
+  return Pe() ? (ze(e), !0) : !1;
 }
-const Rt = typeof window < "u" && typeof document < "u";
+const At = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const Bt = Object.prototype.toString, Lt = (e) => Bt.call(e) === "[object Object]", de = () => {
+const Rt = Object.prototype.toString, Bt = (e) => Rt.call(e) === "[object Object]", de = () => {
 };
-function jt(e, t) {
+function Lt(e, t) {
   function n(...o) {
     return new Promise((r, i) => {
       Promise.resolve(e(() => t.apply(this, o), { fn: t, thisArg: this, args: o })).then(r).catch(i);
@@ -723,19 +725,19 @@ function jt(e, t) {
   }
   return n;
 }
-function Tt(e, t = {}) {
+function jt(e, t = {}) {
   let n, o, r = de;
   const i = (f) => {
     clearTimeout(f), r(), r = de;
   };
   let s;
   return (f) => {
-    const c = L(e), d = L(t.maxWait);
-    return n && i(n), c <= 0 || d !== void 0 && d <= 0 ? (o && (i(o), o = null), Promise.resolve(f())) : new Promise((a, v) => {
+    const c = B(e), d = B(t.maxWait);
+    return n && i(n), c <= 0 || d !== void 0 && d <= 0 ? (o && (i(o), o = void 0), Promise.resolve(f())) : new Promise((a, v) => {
       r = t.rejectOnCancel ? v : a, s = f, d && !o && (o = setTimeout(() => {
-        n && i(n), o = null, a(s());
+        n && i(n), o = void 0, a(s());
       }, d)), n = setTimeout(() => {
-        o && i(o), o = null, a(f());
+        o && i(o), o = void 0, a(f());
       }, c);
     });
   };
@@ -743,20 +745,20 @@ function Tt(e, t = {}) {
 function G(e) {
   return Array.isArray(e) ? e : [e];
 }
-function Pt(e) {
+function Tt(e) {
   return Ce();
 }
-function zt(e, t = 200, n = {}) {
-  return jt(
-    Tt(t, n),
+function Pt(e, t = 200, n = {}) {
+  return Lt(
+    jt(t, n),
     e
   );
 }
-function Ot(e, t = !0, n) {
-  Pt() ? ke(e, n) : t ? e() : we(e);
+function zt(e, t = !0, n) {
+  Tt() ? ke(e, n) : t ? e() : we(e);
 }
-function Dt(e, t, n) {
-  return D(
+function Ot(e, t, n) {
+  return O(
     e,
     t,
     {
@@ -765,37 +767,37 @@ function Dt(e, t, n) {
     }
   );
 }
-const oe = Rt ? window : void 0;
-function B(e) {
+const oe = At ? window : void 0;
+function R(e) {
   var t;
-  const n = L(e);
-  return (t = n == null ? void 0 : n.$el) != null ? t : n;
+  const n = B(e);
+  return (t = n?.$el) != null ? t : n;
 }
-function Vt(...e) {
+function Dt(...e) {
   const t = [], n = () => {
     t.forEach((u) => u()), t.length = 0;
-  }, o = (u, f, c, d) => (u.addEventListener(f, c, d), () => u.removeEventListener(f, c, d)), r = N(() => {
-    const u = G(L(e[0])).filter((f) => f != null);
+  }, o = (u, f, c, d) => (u.addEventListener(f, c, d), () => u.removeEventListener(f, c, d)), r = M(() => {
+    const u = G(B(e[0])).filter((f) => f != null);
     return u.every((f) => typeof f != "string") ? u : void 0;
-  }), i = Dt(
+  }), i = Ot(
     () => {
       var u, f;
       return [
-        (f = (u = r.value) == null ? void 0 : u.map((c) => B(c))) != null ? f : [oe].filter((c) => c != null),
-        G(L(r.value ? e[1] : e[0])),
-        G(p(r.value ? e[2] : e[1])),
+        (f = (u = r.value) == null ? void 0 : u.map((c) => R(c))) != null ? f : [oe].filter((c) => c != null),
+        G(B(r.value ? e[1] : e[0])),
+        G(b(r.value ? e[2] : e[1])),
         // @ts-expect-error - TypeScript gets the correct types, but somehow still complains
-        L(r.value ? e[3] : e[2])
+        B(r.value ? e[3] : e[2])
       ];
     },
     ([u, f, c, d]) => {
-      if (n(), !(u != null && u.length) || !(f != null && f.length) || !(c != null && c.length))
+      if (n(), !u?.length || !f?.length || !c?.length)
         return;
-      const a = Lt(d) ? { ...d } : d;
+      const a = Bt(d) ? { ...d } : d;
       t.push(
         ...u.flatMap(
           (v) => f.flatMap(
-            (w) => c.map((l) => o(v, w, l, a))
+            (S) => c.map((l) => o(v, S, l, a))
           )
         )
       );
@@ -806,25 +808,25 @@ function Vt(...e) {
   };
   return Se(n), s;
 }
-function Wt() {
+function Vt() {
   const e = ee(!1), t = Ce();
   return t && ke(() => {
     e.value = !0;
   }, t), e;
 }
-function _t(e) {
-  const t = Wt();
-  return N(() => (t.value, !!e()));
+function Ht(e) {
+  const t = Vt();
+  return M(() => (t.value, !!e()));
 }
-function Ht(e, t, n = {}) {
+function Wt(e, t, n = {}) {
   const { window: o = oe, ...r } = n;
   let i;
-  const s = _t(() => o && "ResizeObserver" in o), u = () => {
+  const s = Ht(() => o && "ResizeObserver" in o), u = () => {
     i && (i.disconnect(), i = void 0);
-  }, f = N(() => {
-    const a = L(e);
-    return Array.isArray(a) ? a.map((v) => B(v)) : [B(a)];
-  }), c = D(
+  }, f = M(() => {
+    const a = B(e);
+    return Array.isArray(a) ? a.map((v) => R(v)) : [R(a)];
+  }), c = O(
     f,
     (a) => {
       if (u(), s.value && o) {
@@ -843,33 +845,33 @@ function Ht(e, t, n = {}) {
   };
 }
 function Ft(e, t = { width: 0, height: 0 }, n = {}) {
-  const { window: o = oe, box: r = "content-box" } = n, i = N(() => {
+  const { window: o = oe, box: r = "content-box" } = n, i = M(() => {
     var a, v;
-    return (v = (a = B(e)) == null ? void 0 : a.namespaceURI) == null ? void 0 : v.includes("svg");
-  }), s = ee(t.width), u = ee(t.height), { stop: f } = Ht(
+    return (v = (a = R(e)) == null ? void 0 : a.namespaceURI) == null ? void 0 : v.includes("svg");
+  }), s = ee(t.width), u = ee(t.height), { stop: f } = Wt(
     e,
     ([a]) => {
       const v = r === "border-box" ? a.borderBoxSize : r === "content-box" ? a.contentBoxSize : a.devicePixelContentBoxSize;
       if (o && i.value) {
-        const w = B(e);
-        if (w) {
-          const l = w.getBoundingClientRect();
+        const S = R(e);
+        if (S) {
+          const l = S.getBoundingClientRect();
           s.value = l.width, u.value = l.height;
         }
       } else if (v) {
-        const w = G(v);
-        s.value = w.reduce((l, { inlineSize: b }) => l + b, 0), u.value = w.reduce((l, { blockSize: b }) => l + b, 0);
+        const S = G(v);
+        s.value = S.reduce((l, { inlineSize: p }) => l + p, 0), u.value = S.reduce((l, { blockSize: p }) => l + p, 0);
       } else
         s.value = a.contentRect.width, u.value = a.contentRect.height;
     },
     n
   );
-  Ot(() => {
-    const a = B(e);
+  zt(() => {
+    const a = R(e);
     a && (s.value = "offsetWidth" in a ? a.offsetWidth : t.width, u.value = "offsetHeight" in a ? a.offsetHeight : t.height);
   });
-  const c = D(
-    () => B(e),
+  const c = O(
+    () => R(e),
     (a) => {
       s.value = a ? t.width : 0, u.value = a ? t.height : 0;
     }
@@ -884,11 +886,10 @@ function Ft(e, t = { width: 0, height: 0 }, n = {}) {
   };
 }
 function qt(e) {
-  const { activeClassName: t = ".active", enableWheel: n = !0, direction: o = "vertical" } = e ?? {}, r = De(), { width: i, height: s } = Ft(r);
+  const { activeClassName: t = ".active", enableWheel: n = !0, direction: o = "vertical" } = e ?? {}, r = Oe(), { width: i, height: s } = Ft(r);
   async function u(d) {
-    var v;
     await we();
-    const a = (v = r.value) == null ? void 0 : v.querySelector(t);
+    const a = r.value?.querySelector(t);
     a && a.scrollIntoView({
       behavior: "smooth",
       block: "nearest",
@@ -897,68 +898,67 @@ function qt(e) {
     });
   }
   function f(d) {
-    var v, w;
     if (!n) return;
     d.preventDefault();
     const { deltaY: a } = d;
     switch (o) {
       case "vertical":
-        (v = r.value) == null || v.scrollBy({
+        r.value?.scrollBy({
           top: a > 0 ? s.value : -s.value,
           behavior: "smooth"
         });
         break;
       case "horizontal":
-        (w = r.value) == null || w.scrollBy({
+        r.value?.scrollBy({
           left: a > 0 ? i.value : -i.value,
           behavior: "smooth"
         });
         break;
     }
   }
-  Vt(r, "wheel", f);
-  const c = zt(u, 500);
-  return D([i, s], () => {
+  Dt(r, "wheel", f);
+  const c = Pt(u, 500);
+  return O([i, s], () => {
     c();
   }), {
     scrollRef: r,
     scrollToView: u
   };
 }
-var Gt = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, R = function(e) {
+var Gt = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, A = function(e) {
   return typeof e == "string" ? e.length > 0 : typeof e == "number";
 }, y = function(e, t, n) {
   return t === void 0 && (t = 0), n === void 0 && (n = Math.pow(10, t)), Math.round(n * e) / n + 0;
-}, S = function(e, t, n) {
+}, N = function(e, t, n) {
   return t === void 0 && (t = 0), n === void 0 && (n = 1), e > n ? n : e > t ? e : t;
-}, Ae = function(e) {
+}, _e = function(e) {
   return (e = isFinite(e) ? e % 360 : 0) > 0 ? e : e + 360;
 }, he = function(e) {
-  return { r: S(e.r, 0, 255), g: S(e.g, 0, 255), b: S(e.b, 0, 255), a: S(e.a) };
+  return { r: N(e.r, 0, 255), g: N(e.g, 0, 255), b: N(e.b, 0, 255), a: N(e.a) };
 }, K = function(e) {
   return { r: y(e.r), g: y(e.g), b: y(e.b), a: y(e.a, 3) };
 }, Zt = /^#([0-9a-f]{3,8})$/i, F = function(e) {
   var t = e.toString(16);
   return t.length < 2 ? "0" + t : t;
-}, Re = function(e) {
+}, Ae = function(e) {
   var t = e.r, n = e.g, o = e.b, r = e.a, i = Math.max(t, n, o), s = i - Math.min(t, n, o), u = s ? i === t ? (n - o) / s : i === n ? 2 + (o - t) / s : 4 + (t - n) / s : 0;
   return { h: 60 * (u < 0 ? u + 6 : u), s: i ? s / i * 100 : 0, v: i / 255 * 100, a: r };
-}, Be = function(e) {
+}, Re = function(e) {
   var t = e.h, n = e.s, o = e.v, r = e.a;
   t = t / 360 * 6, n /= 100, o /= 100;
   var i = Math.floor(t), s = o * (1 - n), u = o * (1 - (t - i) * n), f = o * (1 - (1 - t + i) * n), c = i % 6;
   return { r: 255 * [o, u, s, s, f, o][c], g: 255 * [f, o, o, u, s, s][c], b: 255 * [s, s, f, o, o, u][c], a: r };
 }, me = function(e) {
-  return { h: Ae(e.h), s: S(e.s, 0, 100), l: S(e.l, 0, 100), a: S(e.a) };
-}, ve = function(e) {
+  return { h: _e(e.h), s: N(e.s, 0, 100), l: N(e.l, 0, 100), a: N(e.a) };
+}, pe = function(e) {
   return { h: y(e.h), s: y(e.s), l: y(e.l), a: y(e.a, 3) };
-}, be = function(e) {
-  return Be((n = (t = e).s, { h: t.h, s: (n *= ((o = t.l) < 50 ? o : 100 - o) / 100) > 0 ? 2 * n / (o + n) * 100 : 0, v: o + n, a: t.a }));
+}, ve = function(e) {
+  return Re((n = (t = e).s, { h: t.h, s: (n *= ((o = t.l) < 50 ? o : 100 - o) / 100) > 0 ? 2 * n / (o + n) * 100 : 0, v: o + n, a: t.a }));
   var t, n, o;
-}, O = function(e) {
-  return { h: (t = Re(e)).h, s: (r = (200 - (n = t.s)) * (o = t.v) / 100) > 0 && r < 200 ? n * o / 100 / (r <= 100 ? r : 200 - r) * 100 : 0, l: r / 2, a: t.a };
+}, z = function(e) {
+  return { h: (t = Ae(e)).h, s: (r = (200 - (n = t.s)) * (o = t.v) / 100) > 0 && r < 200 ? n * o / 100 / (r <= 100 ? r : 200 - r) * 100 : 0, l: r / 2, a: t.a };
   var t, n, o, r;
-}, Ut = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, Kt = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, Yt = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, Jt = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, pe = { string: [[function(e) {
+}, Ut = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, Kt = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, Yt = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, Jt = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, be = { string: [[function(e) {
   var t = Zt.exec(e);
   return t ? (e = t[1]).length <= 4 ? { r: parseInt(e[0] + e[0], 16), g: parseInt(e[1] + e[1], 16), b: parseInt(e[2] + e[2], 16), a: e.length === 4 ? y(parseInt(e[3] + e[3], 16) / 255, 2) : 1 } : e.length === 6 || e.length === 8 ? { r: parseInt(e.substr(0, 2), 16), g: parseInt(e.substr(2, 2), 16), b: parseInt(e.substr(4, 2), 16), a: e.length === 8 ? y(parseInt(e.substr(6, 2), 16) / 255, 2) : 1 } : null : null;
 }, "hex"], [function(e) {
@@ -968,22 +968,22 @@ var Gt = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, R = function(e) {
   var t = Ut.exec(e) || Kt.exec(e);
   if (!t) return null;
   var n, o, r = me({ h: (n = t[1], o = t[2], o === void 0 && (o = "deg"), Number(n) * (Gt[o] || 1)), s: Number(t[3]), l: Number(t[4]), a: t[5] === void 0 ? 1 : Number(t[5]) / (t[6] ? 100 : 1) });
-  return be(r);
+  return ve(r);
 }, "hsl"]], object: [[function(e) {
   var t = e.r, n = e.g, o = e.b, r = e.a, i = r === void 0 ? 1 : r;
-  return R(t) && R(n) && R(o) ? he({ r: Number(t), g: Number(n), b: Number(o), a: Number(i) }) : null;
+  return A(t) && A(n) && A(o) ? he({ r: Number(t), g: Number(n), b: Number(o), a: Number(i) }) : null;
 }, "rgb"], [function(e) {
   var t = e.h, n = e.s, o = e.l, r = e.a, i = r === void 0 ? 1 : r;
-  if (!R(t) || !R(n) || !R(o)) return null;
+  if (!A(t) || !A(n) || !A(o)) return null;
   var s = me({ h: Number(t), s: Number(n), l: Number(o), a: Number(i) });
-  return be(s);
+  return ve(s);
 }, "hsl"], [function(e) {
   var t = e.h, n = e.s, o = e.v, r = e.a, i = r === void 0 ? 1 : r;
-  if (!R(t) || !R(n) || !R(o)) return null;
+  if (!A(t) || !A(n) || !A(o)) return null;
   var s = function(u) {
-    return { h: Ae(u.h), s: S(u.s, 0, 100), v: S(u.v, 0, 100), a: S(u.a) };
+    return { h: _e(u.h), s: N(u.s, 0, 100), v: N(u.v, 0, 100), a: N(u.a) };
   }({ h: Number(t), s: Number(n), v: Number(o), a: Number(i) });
-  return Be(s);
+  return Re(s);
 }, "hsv"]] }, ge = function(e, t) {
   for (var n = 0; n < t.length; n++) {
     var o = t[n][0](e);
@@ -991,15 +991,15 @@ var Gt = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, R = function(e) {
   }
   return [null, void 0];
 }, Qt = function(e) {
-  return typeof e == "string" ? ge(e.trim(), pe.string) : typeof e == "object" && e !== null ? ge(e, pe.object) : [null, void 0];
+  return typeof e == "string" ? ge(e.trim(), be.string) : typeof e == "object" && e !== null ? ge(e, be.object) : [null, void 0];
 }, Y = function(e, t) {
-  var n = O(e);
-  return { h: n.h, s: S(n.s + 100 * t, 0, 100), l: n.l, a: n.a };
+  var n = z(e);
+  return { h: n.h, s: N(n.s + 100 * t, 0, 100), l: n.l, a: n.a };
 }, J = function(e) {
   return (299 * e.r + 587 * e.g + 114 * e.b) / 1e3 / 255;
 }, xe = function(e, t) {
-  var n = O(e);
-  return { h: n.h, s: n.s, l: S(n.l + 100 * t, 0, 100), a: n.a };
+  var n = z(e);
+  return { h: n.h, s: n.s, l: N(n.l + 100 * t, 0, 100), a: n.a };
 }, ye = function() {
   function e(t) {
     this.parsed = Qt(t)[0], this.rgba = this.parsed || { r: 0, g: 0, b: 0, a: 1 };
@@ -1021,38 +1021,38 @@ var Gt = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, R = function(e) {
     return t = K(this.rgba), n = t.r, o = t.g, r = t.b, (i = t.a) < 1 ? "rgba(" + n + ", " + o + ", " + r + ", " + i + ")" : "rgb(" + n + ", " + o + ", " + r + ")";
     var t, n, o, r, i;
   }, e.prototype.toHsl = function() {
-    return ve(O(this.rgba));
+    return pe(z(this.rgba));
   }, e.prototype.toHslString = function() {
-    return t = ve(O(this.rgba)), n = t.h, o = t.s, r = t.l, (i = t.a) < 1 ? "hsla(" + n + ", " + o + "%, " + r + "%, " + i + ")" : "hsl(" + n + ", " + o + "%, " + r + "%)";
+    return t = pe(z(this.rgba)), n = t.h, o = t.s, r = t.l, (i = t.a) < 1 ? "hsla(" + n + ", " + o + "%, " + r + "%, " + i + ")" : "hsl(" + n + ", " + o + "%, " + r + "%)";
     var t, n, o, r, i;
   }, e.prototype.toHsv = function() {
-    return t = Re(this.rgba), { h: y(t.h), s: y(t.s), v: y(t.v), a: y(t.a, 3) };
+    return t = Ae(this.rgba), { h: y(t.h), s: y(t.s), v: y(t.v), a: y(t.a, 3) };
     var t;
   }, e.prototype.invert = function() {
-    return M({ r: 255 - (t = this.rgba).r, g: 255 - t.g, b: 255 - t.b, a: t.a });
+    return I({ r: 255 - (t = this.rgba).r, g: 255 - t.g, b: 255 - t.b, a: t.a });
     var t;
   }, e.prototype.saturate = function(t) {
-    return t === void 0 && (t = 0.1), M(Y(this.rgba, t));
+    return t === void 0 && (t = 0.1), I(Y(this.rgba, t));
   }, e.prototype.desaturate = function(t) {
-    return t === void 0 && (t = 0.1), M(Y(this.rgba, -t));
+    return t === void 0 && (t = 0.1), I(Y(this.rgba, -t));
   }, e.prototype.grayscale = function() {
-    return M(Y(this.rgba, -1));
+    return I(Y(this.rgba, -1));
   }, e.prototype.lighten = function(t) {
-    return t === void 0 && (t = 0.1), M(xe(this.rgba, t));
+    return t === void 0 && (t = 0.1), I(xe(this.rgba, t));
   }, e.prototype.darken = function(t) {
-    return t === void 0 && (t = 0.1), M(xe(this.rgba, -t));
+    return t === void 0 && (t = 0.1), I(xe(this.rgba, -t));
   }, e.prototype.rotate = function(t) {
     return t === void 0 && (t = 15), this.hue(this.hue() + t);
   }, e.prototype.alpha = function(t) {
-    return typeof t == "number" ? M({ r: (n = this.rgba).r, g: n.g, b: n.b, a: t }) : y(this.rgba.a, 3);
+    return typeof t == "number" ? I({ r: (n = this.rgba).r, g: n.g, b: n.b, a: t }) : y(this.rgba.a, 3);
     var n;
   }, e.prototype.hue = function(t) {
-    var n = O(this.rgba);
-    return typeof t == "number" ? M({ h: t, s: n.s, l: n.l, a: n.a }) : y(n.h);
+    var n = z(this.rgba);
+    return typeof t == "number" ? I({ h: t, s: n.s, l: n.l, a: n.a }) : y(n.h);
   }, e.prototype.isEqual = function(t) {
-    return this.toHex() === M(t).toHex();
+    return this.toHex() === I(t).toHex();
   }, e;
-}(), M = function(e) {
+}(), I = function(e) {
   return e instanceof ye ? e : new ye(e);
 };
 const Xt = {
@@ -1064,7 +1064,7 @@ const Xt = {
   viewBox: "0 0 24 24"
 };
 function tn(e, t, n, o, r, i) {
-  return I(), A("svg", en, t[0] || (t[0] = [
+  return E(), _("svg", en, t[0] || (t[0] = [
     k("path", {
       fill: "#757575",
       d: "M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z"
@@ -1080,7 +1080,7 @@ const nn = /* @__PURE__ */ Z(Xt, [["render", tn]]), on = {
   viewBox: "0 0 24 24"
 };
 function sn(e, t, n, o, r, i) {
-  return I(), A("svg", rn, t[0] || (t[0] = [
+  return E(), _("svg", rn, t[0] || (t[0] = [
     k("path", {
       fill: "#757575",
       d: "m12 15l-4.243-4.242l1.415-1.414L12 12.172l2.828-2.828l1.415 1.414z"
@@ -1102,39 +1102,36 @@ const un = /* @__PURE__ */ Z(on, [["render", sn]]), an = /* @__PURE__ */ $e({
   setup(e, { emit: t }) {
     const n = t;
     gt("n-chrome-tabs", $t());
-    const { background: o = "#E5E7EB", active: r = "#fff", primary: i = "rgba(251,191,36,1)" } = e.colors ?? {}, s = Ve(e, "value"), u = N(() => {
-      var h;
-      return (h = e.options) == null ? void 0 : h.findIndex((m) => m.key === s.value);
-    }), { scrollRef: f, scrollToView: c } = qt({ activeClassName: `.${C}--active`, direction: "horizontal" });
-    D(s, () => {
+    const { background: o = "#E5E7EB", active: r = "#fff", primary: i = "rgba(251,191,36,1)" } = e.colors ?? {}, s = De(e, "value"), u = M(() => e.options?.findIndex((h) => h.key === s.value)), { scrollRef: f, scrollToView: c } = qt({ activeClassName: `.${w}--active`, direction: "horizontal" });
+    O(s, () => {
       c();
     }, {
       immediate: !0
     });
-    const d = N(() => M(o).darken(0.9).toHex()), a = N(() => M(r).darken(0.8).toHex()), v = N(() => M(i).darken(0.3).toHex());
-    function w(h) {
+    const d = M(() => I(o).darken(0.9).toHex()), a = M(() => I(r).darken(0.8).toHex()), v = M(() => I(i).darken(0.3).toHex());
+    function S(h) {
       n("click", h);
     }
     function l(h) {
       n("contextmenu", h);
     }
-    function b(h) {
+    function p(h) {
       n("close", h);
     }
-    return (h, m) => (I(), A("div", {
-      class: E([p(z)]),
-      style: We({
-        "--background-color": `${p(o)}`,
+    return (h, m) => (E(), _("div", {
+      class: C([b(P)]),
+      style: Ve({
+        "--background-color": `${b(o)}`,
         "--background-color-dark": `${d.value}`,
-        "--active-background-color": `${p(r)}`,
+        "--active-background-color": `${b(r)}`,
         "--active-background-color-dark": `${a.value}`,
-        "--primary-color": `${p(i)}`,
+        "--primary-color": `${b(i)}`,
         "--primary-color-dark": `${v.value}`
       })
     }, [
-      h.dropdown ? (I(), A("div", {
+      h.dropdown ? (E(), _("div", {
         key: 0,
-        class: E([`${p(z)}__icon`])
+        class: C([`${b(P)}__icon`])
       }, [
         q(un)
       ], 2)) : Q("", !0),
@@ -1142,29 +1139,29 @@ const un = /* @__PURE__ */ Z(on, [["render", sn]]), an = /* @__PURE__ */ $e({
       k("div", {
         ref_key: "scrollRef",
         ref: f,
-        class: E([`${p(z)}__content`])
+        class: C([`${b(P)}__content`])
       }, [
-        q(_e, {
+        q(He, {
           name: "group",
           tag: "div",
-          class: E([`${p(z)}__scroll`])
+          class: C([`${b(P)}__scroll`])
         }, {
-          default: He(() => [
-            (I(!0), A(Fe, null, qe(h.options, ({ key: $, ...P }, j) => (I(), X(At, Ge({ key: $ }, { ref_for: !0 }, P, {
-              index: j,
+          default: We(() => [
+            (E(!0), _(Fe, null, qe(h.options, ({ key: $, ...T }, L) => (E(), X(_t, Ge({ key: $ }, { ref_for: !0 }, T, {
+              index: L,
               "active-index": u.value,
-              onItemClick: (V) => w($),
-              onItemContextmenu: (V) => l($),
-              onItemClose: (V) => b($)
+              onItemClick: (D) => S($),
+              onItemContextmenu: (D) => l($),
+              onItemClose: (D) => p($)
             }), null, 16, ["index", "active-index", "onItemClick", "onItemContextmenu", "onItemClose"]))), 128))
           ]),
           _: 1
         }, 8, ["class"])
       ], 2),
       ue(h.$slots, "suffix"),
-      h.addable ? (I(), A("div", {
+      h.addable ? (E(), _("div", {
         key: 1,
-        class: E([`${p(z)}__icon`]),
+        class: C([`${b(P)}__icon`]),
         onClick: m[0] || (m[0] = ($) => n("add"))
       }, [
         q(nn)
@@ -1173,6 +1170,6 @@ const un = /* @__PURE__ */ Z(on, [["render", sn]]), an = /* @__PURE__ */ $e({
   }
 });
 export {
-  At as CTabItem,
+  _t as CTabItem,
   an as CTabs
 };