@oiij/chrome-tabs 0.0.1 → 0.0.3

package/dist/index.js

@@ -1,551 +1,1170 @@
-import { onMounted, nextTick, getCurrentScope, onScopeDispose, getCurrentInstance, toValue, computed, ref, watch, onBeforeUnmount, defineComponent, h as h$1, inject, createElementBlock, openBlock, normalizeClass, createElementVNode, createBlock, createCommentVNode, resolveDynamicComponent, renderSlot, withModifiers, createStaticVNode, mergeModels, useModel, provide, normalizeStyle, createVNode, TransitionGroup, withCtx } from "vue";
-function tryOnScopeDispose(fn) {
-  if (getCurrentScope()) {
-    onScopeDispose(fn);
-    return true;
+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 We, withCtx as He, Fragment as Fe, renderList as qe, mergeProps as Ge } from "vue";
+function Ze(e) {
+  let t = ".", n = "__", o = "--", r;
+  if (e) {
+    let l = e.blockPrefix;
+    l && (t = l), l = e.elementPrefix, l && (n = l), l = e.modifierPrefix, l && (o = l);
   }
-  return false;
+  const i = {
+    install(l) {
+      r = l.c;
+      const p = l.context;
+      p.bem = {}, p.bem.b = null, p.bem.els = null;
+    }
+  };
+  function s(l) {
+    let p, h;
+    return {
+      before(m) {
+        p = m.bem.b, h = m.bem.els, m.bem.els = null;
+      },
+      after(m) {
+        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, `${$?.bPrefix || t}${m.bem.b}`;
+      }
+    };
+  }
+  function u(l) {
+    let p;
+    return {
+      before(h) {
+        p = h.bem.els;
+      },
+      after(h) {
+        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?.bPrefix || t}${h.bem.b}${n}${$}`).join(", ");
+      }
+    };
+  }
+  function f(l) {
+    return {
+      $({ 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 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 $(T[0]);
+        } else
+          return $();
+      }
+    };
+  }
+  function c(l) {
+    return {
+      $({ 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?.bPrefix || t}${p.bem.b}${m !== null && m.length > 0 ? `${n}${m[0]}` : ""}${o}${l})`;
+      }
+    };
+  }
+  return Object.assign(i, {
+    cB: (...l) => r(s(l[0]), l[1], l[2]),
+    cE: (...l) => r(u(l[0]), l[1], l[2]),
+    cM: (...l) => r(f(l[0]), l[1], l[2]),
+    cNotM: (...l) => r(c(l[0]), l[1], l[2])
+  }), i;
 }
-const isClient = typeof window !== "undefined" && typeof document !== "undefined";
-typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
-const noop = () => {
-};
-function createFilterWrapper(filter, fn) {
-  function wrapper(...args) {
-    return new Promise((resolve, reject) => {
-      Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args })).then(resolve).catch(reject);
+function Ue(e) {
+  let t = 0;
+  for (let n = 0; n < e.length; ++n)
+    e[n] === "&" && ++t;
+  return t;
+}
+const Ee = /\s*,(?![^(]*\))\s*/g, Ke = /\s+/g;
+function Ye(e, t) {
+  const n = [];
+  return t.split(Ee).forEach((o) => {
+    let r = Ue(o);
+    if (r) {
+      if (r === 1) {
+        e.forEach((s) => {
+          n.push(o.replace("&", s));
+        });
+        return;
+      }
+    } else {
+      e.forEach((s) => {
+        n.push(
+          // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
+          (s && s + " ") + o
+        );
+      });
+      return;
+    }
+    let i = [
+      o
+    ];
+    for (; r--; ) {
+      const s = [];
+      i.forEach((u) => {
+        e.forEach((f) => {
+          s.push(u.replace("&", f));
+        });
+      }), i = s;
+    }
+    i.forEach((s) => n.push(s));
+  }), n;
+}
+function Je(e, t) {
+  const n = [];
+  return t.split(Ee).forEach((o) => {
+    e.forEach((r) => {
+      n.push((r && r + " ") + o);
+    });
+  }), n;
+}
+function Qe(e) {
+  let t = [""];
+  return e.forEach((n) => {
+    n = n && n.trim(), // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
+    n && (n.includes("&") ? t = Ye(t, n) : t = Je(t, n));
+  }), t.join(", ").replace(Ke, " ");
+}
+function le(e) {
+  if (!e)
+    return;
+  const t = e.parentElement;
+  t && t.removeChild(e);
+}
+function ne(e, t) {
+  return (t ?? document.head).querySelector(`style[cssr-id="${e}"]`);
+}
+function Xe(e) {
+  const t = document.createElement("style");
+  return t.setAttribute("cssr-id", e), t;
+}
+function V(e) {
+  return e ? /^\s*@(s|m)/.test(e) : !1;
+}
+const et = /[A-Z]/g;
+function Ie(e) {
+  return e.replace(et, (t) => "-" + t.toLowerCase());
+}
+function tt(e, t = "  ") {
+  return typeof e == "object" && e !== null ? ` {
+` + Object.entries(e).map((n) => t + `  ${Ie(n[0])}: ${n[1]};`).join(`
+`) + `
+` + t + "}" : `: ${e};`;
+}
+function nt(e, t, n) {
+  return typeof e == "function" ? e({
+    context: t.context,
+    props: n
+  }) : e;
+}
+function ae(e, t, n, o) {
+  if (!t)
+    return "";
+  const r = nt(t, n, o);
+  if (!r)
+    return "";
+  if (typeof r == "string")
+    return `${e} {
+${r}
+}`;
+  const i = Object.keys(r);
+  if (i.length === 0)
+    return n.config.keepEmptyBlock ? e + ` {
+}` : "";
+  const s = e ? [
+    e + " {"
+  ] : [];
+  return i.forEach((u) => {
+    const f = r[u];
+    if (u === "raw") {
+      s.push(`
+` + f + `
+`);
+      return;
+    }
+    u = Ie(u), f != null && s.push(`  ${u}${tt(f)}`);
+  }), e && s.push("}"), s.join(`
+`);
+}
+function te(e, t, n) {
+  e && e.forEach((o) => {
+    if (Array.isArray(o))
+      te(o, t, n);
+    else if (typeof o == "function") {
+      const r = o(t);
+      Array.isArray(r) ? te(r, t, n) : r && n(r);
+    } else o && n(o);
+  });
+}
+function Me(e, t, n, o, r) {
+  const i = e.$;
+  let s = "";
+  if (!i || typeof i == "string")
+    V(i) ? s = i : t.push(i);
+  else if (typeof i == "function") {
+    const c = i({
+      context: o.context,
+      props: r
     });
+    V(c) ? s = c : t.push(c);
+  } else if (i.before && i.before(o.context), !i.$ || typeof i.$ == "string")
+    V(i.$) ? s = i.$ : t.push(i.$);
+  else if (i.$) {
+    const c = i.$({
+      context: o.context,
+      props: r
+    });
+    V(c) ? s = c : t.push(c);
   }
-  return wrapper;
-}
-function debounceFilter(ms, options = {}) {
-  let timer;
-  let maxTimer;
-  let lastRejector = noop;
-  const _clearTimeout = (timer2) => {
-    clearTimeout(timer2);
-    lastRejector();
-    lastRejector = noop;
+  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, {
+    context: o.context,
+    props: r
+  }, (c) => {
+    if (typeof c == "string") {
+      const d = ae(u, { raw: c }, o, r);
+      n.push(d);
+    } else
+      Me(c, t, n, o, r);
+  }), t.pop(), s && n.push("}"), i && i.after && i.after(o.context);
+}
+function ot(e, t, n) {
+  const o = [];
+  return Me(e, [], o, t, n), o.join(`
+
+`);
+}
+function rt(e) {
+  for (var t = 0, n, o = 0, r = e.length; r >= 4; ++o, r -= 4)
+    n = e.charCodeAt(o) & 255 | (e.charCodeAt(++o) & 255) << 8 | (e.charCodeAt(++o) & 255) << 16 | (e.charCodeAt(++o) & 255) << 24, n = /* Math.imul(k, m): */
+    (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16), n ^= /* k >>> r: */
+    n >>> 24, t = /* Math.imul(k, m): */
+    (n & 65535) * 1540483477 + ((n >>> 16) * 59797 << 16) ^ /* Math.imul(h, m): */
+    (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16);
+  switch (r) {
+    case 3:
+      t ^= (e.charCodeAt(o + 2) & 255) << 16;
+    case 2:
+      t ^= (e.charCodeAt(o + 1) & 255) << 8;
+    case 1:
+      t ^= e.charCodeAt(o) & 255, t = /* Math.imul(h, m): */
+      (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16);
+  }
+  return t ^= t >>> 13, t = /* Math.imul(h, m): */
+  (t & 65535) * 1540483477 + ((t >>> 16) * 59797 << 16), ((t ^ t >>> 15) >>> 0).toString(36);
+}
+typeof window < "u" && (window.__cssrContext = {});
+function it(e, t, n, o) {
+  const { els: r } = t;
+  if (n === void 0)
+    r.forEach(le), t.els = [];
+  else {
+    const i = ne(n, o);
+    i && r.includes(i) && (le(i), t.els = r.filter((s) => s !== i));
+  }
+}
+function ce(e, t) {
+  e.push(t);
+}
+function st(e, t, n, o, r, i, s, u, f) {
+  let c;
+  if (n === void 0 && (c = t.render(o), n = rt(c)), f) {
+    f.adapter(n, c ?? t.render(o));
+    return;
+  }
+  u === void 0 && (u = document.head);
+  const d = ne(n, u);
+  if (d !== null && !i)
+    return d;
+  const a = d ?? Xe(n);
+  if (c === void 0 && (c = t.render(o)), a.textContent = c, d !== null)
+    return d;
+  if (s) {
+    const v = u.querySelector(`meta[name="${s}"]`);
+    if (v)
+      return u.insertBefore(a, v), ce(t.els, a), a;
+  }
+  return r ? u.insertBefore(a, u.querySelector("style, link")) : u.appendChild(a), ce(t.els, a), a;
+}
+function ut(e) {
+  return ot(this, this.instance, e);
+}
+function lt(e = {}) {
+  const { id: t, ssr: n, props: o, head: r = !1, force: i = !1, anchorMetaName: s, parent: u } = e;
+  return st(this.instance, this, t, o, r, i, s, u, n);
+}
+function at(e = {}) {
+  const { id: t, parent: n } = e;
+  it(this.instance, this, t, n);
+}
+const W = function(e, t, n, o) {
+  return {
+    instance: e,
+    $: t,
+    props: n,
+    children: o,
+    els: [],
+    render: ut,
+    mount: lt,
+    unmount: at
   };
-  let lastInvoker;
-  const filter = (invoke) => {
-    const duration = toValue(ms);
-    const maxDuration = toValue(options.maxWait);
-    if (timer)
-      _clearTimeout(timer);
-    if (duration <= 0 || maxDuration !== void 0 && maxDuration <= 0) {
-      if (maxTimer) {
-        _clearTimeout(maxTimer);
-        maxTimer = null;
-      }
-      return Promise.resolve(invoke());
+}, ct = function(e, t, n, o) {
+  return Array.isArray(t) ? W(e, { $: null }, null, t) : Array.isArray(n) ? W(e, t, null, n) : Array.isArray(o) ? W(e, t, n, o) : W(e, t, n, null);
+};
+function ft(e = {}) {
+  const t = {
+    c: (...n) => ct(t, ...n),
+    use: (n, ...o) => n.install(t, ...o),
+    find: ne,
+    context: {},
+    config: e
+  };
+  return t;
+}
+function dt(e) {
+  const { namespace: t = "n", blockPrefix: n = `.${t}-`, elementPrefix: o = "__", modifierPrefix: r = "--" } = e ?? {}, i = ft(), s = Ze({
+    blockPrefix: n,
+    elementPrefix: o,
+    modifierPrefix: r
+  });
+  return i.use(s), {
+    namespace: t,
+    blockPrefix: n,
+    elementPrefix: o,
+    modifierPrefix: r,
+    cssr: i,
+    plugin: s
+  };
+}
+const ht = "@css-render/vue3-ssr";
+function mt(e, t) {
+  return `<style cssr-id="${e}">
+${t}
+</style>`;
+}
+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 vt = typeof document < "u";
+function bt() {
+  if (vt)
+    return;
+  const e = Be(ht, null);
+  if (e !== null)
+    return {
+      adapter: (t, n) => pt(t, n, e),
+      context: e
+    };
+}
+function gt(e, t) {
+  const n = bt();
+  function o() {
+    t.mount({
+      id: e,
+      head: !0,
+      ssr: n
+    });
+  }
+  n ? o() : Le(() => {
+    o();
+  });
+}
+const { cssr: xt, plugin: yt, namespace: Ne } = dt(), { c: x, cB: H, cE: g, 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", {
+      display: "flex",
+      width: "100%",
+      height: "40px",
+      padding: "0 10px",
+      alignItems: "center",
+      backgroundColor: "var(--background-color)",
+      color: "var(--background-color-dark)"
+    }, [
+      x(".group-move, .group-enter-active, .group-leave-active", {
+        transition: j
+      }),
+      x(".group-enter-from, .group-leave-to", {
+        opacity: 0
+      }),
+      x(".group-leave-active", {}),
+      g("prefix", {}),
+      g("icon", {
+        width: "28px",
+        height: "28px",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: "5px",
+        borderRadius: "10px",
+        backgroundColor: "var(--active-background-color)",
+        transition: j
+      }, [
+        x("svg", {
+          width: "100%",
+          height: "100%",
+          fill: "currentColor"
+        }),
+        x("&:hover", {
+          backgroundColor: "var(--primary-color)"
+        })
+      ]),
+      g("content", {
+        flex: "1",
+        height: "100%",
+        minWidth: 0,
+        overflow: "hidden",
+        marginLeft: "-6px",
+        padding: "0 10px"
+      }),
+      g("scroll", {
+        position: "relative",
+        display: "flex",
+        alignItems: "center",
+        height: "100%"
+      }, [
+        g("icon", {
+          marginLeft: "5px",
+          borderRadius: "50%",
+          backgroundColor: "transparent",
+          flexShrink: 0
+        }, [
+          x("&:hover", {
+            backgroundColor: "var(--primary-color)"
+          })
+        ])
+      ]),
+      g("suffix", {})
+    ]),
+    H("chrome-tabs-item", {
+      position: "relative",
+      margin: "0 -5px",
+      height: "100%",
+      flexShrink: 0,
+      cursor: "default",
+      userSelect: "none",
+      padding: "6px 10px 0px 10px"
+    }, [
+      U("disabled", {
+        cursor: "not-allowed",
+        pointerEvents: "none",
+        opacity: 0.5,
+        filter: "grayscale(0.5)"
+      }),
+      U("active", [
+        g("background", {
+          opacity: 1
+        })
+      ]),
+      fe("active", [
+        x("&:hover", {}, [
+          g("content", {
+            backgroundColor: "var(--primary-color)"
+          })
+        ])
+      ]),
+      x("&::first-child", {
+        marginLeft: "0 !important"
+      }),
+      x("&::last-child", {
+        marginRight: "0 !important"
+      }),
+      g("content", {
+        position: "relative",
+        zIndex: 1,
+        height: "28px",
+        display: "flex",
+        alignItems: "center",
+        gap: "5px",
+        borderRadius: "10px",
+        padding: "0 10px",
+        transition: j
+      }),
+      g("slot", {}),
+      g("icon", {}, [
+        x("svg", {
+          width: "1.2em",
+          height: "1.2em",
+          fill: "currentColor"
+        })
+      ]),
+      g("close", {
+        width: "16px",
+        height: "16px",
+        padding: "2px",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        borderRadius: "50%",
+        transition: j
+      }, [
+        x("&:hover", {
+          backgroundColor: "rgba(0,0,0,0.1)"
+        }),
+        x("svg", {
+          width: "100%",
+          height: "100%",
+          fill: "currentColor"
+        })
+      ]),
+      g("background", {
+        position: "absolute",
+        opacity: 0,
+        left: 0,
+        bottom: 0,
+        zIndex: 0,
+        height: "34px",
+        width: "100%",
+        display: "flex",
+        alignItems: "flex-end",
+        transition: j
+      }, [
+        g("block", {
+          height: "100%",
+          flex: 1,
+          minWidth: 0,
+          borderRadius: "10px 10px 0 0",
+          backgroundColor: "var(--active-background-color)"
+        }),
+        x("svg", {
+          fill: "var(--active-background-color)"
+        })
+      ]),
+      g("line", {
+        position: "absolute",
+        bottom: "12px",
+        right: "4px",
+        height: "16px",
+        width: "2px",
+        borderRadius: "1px",
+        transition: j,
+        backgroundColor: "var(--primary-color)",
+        opacity: 0
+      }, [
+        U("show", {
+          opacity: 1
+        })
+      ])
+    ]),
+    x(".dark", [
+      H("chrome-tabs", {
+        backgroundColor: "var(--background-color-dark)",
+        color: "var(--background-color)"
+      }, [
+        g("icon", {
+          backgroundColor: "var(--active-background-color-dark)"
+        }, [
+          x("&:hover", {
+            backgroundColor: "var(--primary-color-dark)"
+          })
+        ])
+      ]),
+      H("chrome-tabs-item", {}, [
+        fe("active", [
+          x("&:hover", {}, [
+            g("content", {
+              backgroundColor: "var(--primary-color-dark)"
+            })
+          ])
+        ]),
+        g("background", {}, [
+          g("block", {
+            backgroundColor: "var(--active-background-color-dark)"
+          }),
+          x("svg", {
+            fill: "var(--active-background-color-dark)"
+          })
+        ])
+      ])
+    ])
+  ]);
+}
+const Z = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [o, r] of t)
+    n[o] = r;
+  return n;
+}, kt = {
+  name: "LineMdLoadingTwotoneLoop"
+}, wt = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "1em",
+  height: "1em",
+  viewBox: "0 0 24 24"
+};
+function Ct(e, t, n, o, r, i) {
+  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 = {
+  name: "RiCloseLine"
+}, Mt = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "1em",
+  height: "1em",
+  viewBox: "0 0 24 24"
+};
+function Nt(e, t, n, o, r, i) {
+  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]]), _t = /* @__PURE__ */ $e({
+  __name: "TabItem",
+  props: {
+    label: { type: [String, Function] },
+    icon: { type: Function },
+    closable: { type: Boolean },
+    disabled: { type: Boolean },
+    loading: { type: Boolean },
+    loadingIcon: { type: Function },
+    onClick: { type: Function },
+    onContextMenu: { type: Function },
+    onClose: { type: Function },
+    activeIndex: { default: 0 },
+    index: {}
+  },
+  emits: ["itemClick", "itemContextmenu", "itemClose"],
+  setup(e, { emit: t }) {
+    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) {
+      d.stopPropagation(), n("itemClick", d), e.onClick?.(d);
     }
-    return new Promise((resolve, reject) => {
-      lastRejector = options.rejectOnCancel ? reject : resolve;
-      lastInvoker = invoke;
-      if (maxDuration && !maxTimer) {
-        maxTimer = setTimeout(() => {
-          if (timer)
-            _clearTimeout(timer);
-          maxTimer = null;
-          resolve(lastInvoker());
-        }, maxDuration);
-      }
-      timer = setTimeout(() => {
-        if (maxTimer)
-          _clearTimeout(maxTimer);
-        maxTimer = null;
-        resolve(invoke());
-      }, duration);
+    function f(d) {
+      n("itemContextmenu", d), e.onContextMenu?.(d);
+    }
+    function c() {
+      n("itemClose"), e.onClose?.();
+    }
+    return (d, a) => (E(), _("div", {
+      class: C([
+        b(w),
+        {
+          [`${b(w)}--active`]: r.value,
+          [`${b(w)}--disabled`]: d.disabled
+        }
+      ]),
+      onClick: u,
+      onContextmenu: f
+    }, [
+      k("div", {
+        class: C([`${b(w)}__content`])
+      }, [
+        k("div", {
+          class: C([`${b(w)}__icon`])
+        }, [
+          (E(), X(ie(d.loading ? s.value : d.icon)))
+        ], 2),
+        k("div", {
+          class: C([`${b(w)}__slot`])
+        }, [
+          (E(), X(ie(i.value)))
+        ], 2),
+        d.closable ? (E(), _("div", {
+          key: 0,
+          class: C([`${b(w)}__close`]),
+          onClick: Te(c, ["stop"])
+        }, [
+          q(St)
+        ], 2)) : Q("", !0)
+      ], 2),
+      k("div", {
+        class: C([`${b(w)}__background`])
+      }, [
+        a[0] || (a[0] = k("svg", {
+          width: "10",
+          height: "10"
+        }, [
+          k("path", { d: "M 0 10 A 10 10 0 0 0 10 0 L 10 10 Z" })
+        ], -1)),
+        k("div", {
+          class: C([`${b(w)}__block`])
+        }, null, 2),
+        a[1] || (a[1] = k("svg", {
+          width: "10",
+          height: "10"
+        }, [
+          k("path", { d: "M 0 0 A 10 10 0 0 0 10 10 L 0 10 Z" })
+        ], -1))
+      ], 2),
+      k("div", {
+        class: C([`${b(w)}__line`, o.value ? `${b(w)}__line--show` : ""])
+      }, null, 2)
+    ], 34));
+  }
+});
+function Se(e) {
+  return Pe() ? (ze(e), !0) : !1;
+}
+const At = typeof window < "u" && typeof document < "u";
+typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
+const Rt = Object.prototype.toString, Bt = (e) => Rt.call(e) === "[object Object]", de = () => {
+};
+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);
+    });
+  }
+  return n;
+}
+function jt(e, t = {}) {
+  let n, o, r = de;
+  const i = (f) => {
+    clearTimeout(f), r(), r = de;
+  };
+  let s;
+  return (f) => {
+    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 = void 0, a(s());
+      }, d)), n = setTimeout(() => {
+        o && i(o), o = void 0, a(f());
+      }, c);
     });
   };
-  return filter;
 }
-function getLifeCycleTarget(target) {
-  return getCurrentInstance();
+function G(e) {
+  return Array.isArray(e) ? e : [e];
 }
-function toArray(value) {
-  return Array.isArray(value) ? value : [value];
+function Tt(e) {
+  return Ce();
 }
-function useDebounceFn(fn, ms = 200, options = {}) {
-  return createFilterWrapper(
-    debounceFilter(ms, options),
-    fn
+function Pt(e, t = 200, n = {}) {
+  return Lt(
+    jt(t, n),
+    e
   );
 }
-function tryOnMounted(fn, sync = true, target) {
-  const instance = getLifeCycleTarget();
-  if (instance)
-    onMounted(fn, target);
-  else if (sync)
-    fn();
-  else
-    nextTick(fn);
-}
-const defaultWindow = isClient ? window : void 0;
-function unrefElement(elRef) {
-  var _a;
-  const plain = toValue(elRef);
-  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
-}
-function useMounted() {
-  const isMounted = ref(false);
-  const instance = getCurrentInstance();
-  if (instance) {
-    onMounted(() => {
-      isMounted.value = true;
-    }, instance);
-  }
-  return isMounted;
-}
-function useSupported(callback) {
-  const isMounted = useMounted();
-  return computed(() => {
-    isMounted.value;
-    return Boolean(callback());
-  });
+function zt(e, t = !0, n) {
+  Tt() ? ke(e, n) : t ? e() : we(e);
 }
-function useResizeObserver(target, callback, options = {}) {
-  const { window: window2 = defaultWindow, ...observerOptions } = options;
-  let observer;
-  const isSupported = useSupported(() => window2 && "ResizeObserver" in window2);
-  const cleanup = () => {
-    if (observer) {
-      observer.disconnect();
-      observer = void 0;
+function Ot(e, t, n) {
+  return O(
+    e,
+    t,
+    {
+      ...n,
+      immediate: !0
     }
+  );
+}
+const oe = At ? window : void 0;
+function R(e) {
+  var t;
+  const n = B(e);
+  return (t = n?.$el) != null ? t : n;
+}
+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 = M(() => {
+    const u = G(B(e[0])).filter((f) => f != null);
+    return u.every((f) => typeof f != "string") ? u : void 0;
+  }), i = Ot(
+    () => {
+      var u, f;
+      return [
+        (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
+        B(r.value ? e[3] : e[2])
+      ];
+    },
+    ([u, f, c, d]) => {
+      if (n(), !u?.length || !f?.length || !c?.length)
+        return;
+      const a = Bt(d) ? { ...d } : d;
+      t.push(
+        ...u.flatMap(
+          (v) => f.flatMap(
+            (S) => c.map((l) => o(v, S, l, a))
+          )
+        )
+      );
+    },
+    { flush: "post" }
+  ), s = () => {
+    i(), n();
   };
-  const targets = computed(() => {
-    const _targets = toValue(target);
-    return Array.isArray(_targets) ? _targets.map((el) => unrefElement(el)) : [unrefElement(_targets)];
-  });
-  const stopWatch = watch(
-    targets,
-    (els) => {
-      cleanup();
-      if (isSupported.value && window2) {
-        observer = new ResizeObserver(callback);
-        for (const _el of els) {
-          if (_el)
-            observer.observe(_el, observerOptions);
-        }
+  return Se(n), s;
+}
+function Vt() {
+  const e = ee(!1), t = Ce();
+  return t && ke(() => {
+    e.value = !0;
+  }, t), e;
+}
+function Wt(e) {
+  const t = Vt();
+  return M(() => (t.value, !!e()));
+}
+function Ht(e, t, n = {}) {
+  const { window: o = oe, ...r } = n;
+  let i;
+  const s = Wt(() => o && "ResizeObserver" in o), u = () => {
+    i && (i.disconnect(), i = void 0);
+  }, 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) {
+        i = new ResizeObserver(t);
+        for (const v of a)
+          v && i.observe(v, r);
       }
     },
-    { immediate: true, flush: "post" }
-  );
-  const stop = () => {
-    cleanup();
-    stopWatch();
+    { immediate: !0, flush: "post" }
+  ), d = () => {
+    u(), c();
   };
-  tryOnScopeDispose(stop);
-  return {
-    isSupported,
-    stop
+  return Se(d), {
+    isSupported: s,
+    stop: d
   };
 }
-function useElementSize(target, initialSize = { width: 0, height: 0 }, options = {}) {
-  const { window: window2 = defaultWindow, box = "content-box" } = options;
-  const isSVG = computed(() => {
-    var _a, _b;
-    return (_b = (_a = unrefElement(target)) == null ? void 0 : _a.namespaceURI) == null ? void 0 : _b.includes("svg");
-  });
-  const width = ref(initialSize.width);
-  const height = ref(initialSize.height);
-  const { stop: stop1 } = useResizeObserver(
-    target,
-    ([entry]) => {
-      const boxSize = box === "border-box" ? entry.borderBoxSize : box === "content-box" ? entry.contentBoxSize : entry.devicePixelContentBoxSize;
-      if (window2 && isSVG.value) {
-        const $elem = unrefElement(target);
-        if ($elem) {
-          const rect = $elem.getBoundingClientRect();
-          width.value = rect.width;
-          height.value = rect.height;
-        }
-      } else {
-        if (boxSize) {
-          const formatBoxSize = toArray(boxSize);
-          width.value = formatBoxSize.reduce((acc, { inlineSize }) => acc + inlineSize, 0);
-          height.value = formatBoxSize.reduce((acc, { blockSize }) => acc + blockSize, 0);
-        } else {
-          width.value = entry.contentRect.width;
-          height.value = entry.contentRect.height;
+function Ft(e, t = { width: 0, height: 0 }, n = {}) {
+  const { window: o = oe, box: r = "content-box" } = n, i = M(() => {
+    var a, v;
+    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 } = Ht(
+    e,
+    ([a]) => {
+      const v = r === "border-box" ? a.borderBoxSize : r === "content-box" ? a.contentBoxSize : a.devicePixelContentBoxSize;
+      if (o && i.value) {
+        const S = R(e);
+        if (S) {
+          const l = S.getBoundingClientRect();
+          s.value = l.width, u.value = l.height;
         }
-      }
+      } else if (v) {
+        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;
     },
-    options
+    n
   );
-  tryOnMounted(() => {
-    const ele = unrefElement(target);
-    if (ele) {
-      width.value = "offsetWidth" in ele ? ele.offsetWidth : initialSize.width;
-      height.value = "offsetHeight" in ele ? ele.offsetHeight : initialSize.height;
-    }
+  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 stop2 = watch(
-    () => unrefElement(target),
-    (ele) => {
-      width.value = ele ? initialSize.width : 0;
-      height.value = ele ? initialSize.height : 0;
+  const c = O(
+    () => R(e),
+    (a) => {
+      s.value = a ? t.width : 0, u.value = a ? t.height : 0;
     }
   );
-  function stop() {
-    stop1();
-    stop2();
+  function d() {
+    f(), c();
   }
   return {
-    width,
-    height,
-    stop
+    width: s,
+    height: u,
+    stop: d
   };
 }
-function useInjectionKey(key) {
-  return Symbol(key);
-}
-function useScrollView(options) {
-  const { activeClassName = ".active", enableWheel = true } = options || {};
-  const scrollRef = ref();
-  const { width } = useElementSize(scrollRef);
-  async function scrollToView() {
-    var _a;
-    if (!scrollRef.value)
-      return;
-    await nextTick();
-    const activeEl = (_a = scrollRef.value) == null ? void 0 : _a.children[0].querySelector(activeClassName);
-    if (!activeEl)
-      return;
-    activeEl.scrollIntoView({
+function qt(e) {
+  const { activeClassName: t = ".active", enableWheel: n = !0, direction: o = "vertical" } = e ?? {}, r = Oe(), { width: i, height: s } = Ft(r);
+  async function u(d) {
+    await we();
+    const a = r.value?.querySelector(t);
+    a && a.scrollIntoView({
       behavior: "smooth",
       block: "nearest",
-      inline: "nearest"
+      inline: "nearest",
+      ...d
     });
   }
-  function wheelEvent(e2) {
-    var _a, _b;
-    const { deltaY } = e2;
-    if (deltaY > 0) {
-      (_a = scrollRef.value) == null ? void 0 : _a.scrollBy({
-        top: 0,
-        left: width.value,
-        behavior: "smooth"
-      });
-    } else {
-      (_b = scrollRef.value) == null ? void 0 : _b.scrollBy({
-        top: 0,
-        left: -width.value,
-        behavior: "smooth"
-      });
+  function f(d) {
+    if (!n) return;
+    d.preventDefault();
+    const { deltaY: a } = d;
+    switch (o) {
+      case "vertical":
+        r.value?.scrollBy({
+          top: a > 0 ? s.value : -s.value,
+          behavior: "smooth"
+        });
+        break;
+      case "horizontal":
+        r.value?.scrollBy({
+          left: a > 0 ? i.value : -i.value,
+          behavior: "smooth"
+        });
+        break;
     }
   }
-  function init() {
-    if (!scrollRef.value || !enableWheel)
-      return;
-    scrollRef.value.addEventListener("wheel", wheelEvent);
-  }
-  function destroy() {
-    var _a;
-    (_a = scrollRef.value) == null ? void 0 : _a.removeEventListener("wheel", wheelEvent);
-  }
-  const debouncedScrollToView = useDebounceFn(scrollToView, 500);
-  watch(width, () => {
-    debouncedScrollToView();
-  });
-  onBeforeUnmount(() => {
-    destroy();
-  });
-  onMounted(() => {
-    scrollToView();
-    init();
-  });
-  return {
-    scrollRef,
-    scrollToView
+  Dt(r, "wheel", f);
+  const c = Pt(u, 500);
+  return O([i, s], () => {
+    c();
+  }), {
+    scrollRef: r,
+    scrollToView: u
   };
 }
-const _hoisted_1$1 = { class: "uno-iyw1ix" };
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "TabItem",
-  props: {
-    name: {},
-    disabled: { type: Boolean },
-    closeable: { type: Boolean },
-    showLine: { type: Boolean },
-    icon: { type: [Function, String] },
-    loading: { type: Boolean },
-    loadingRender: { type: Function, default: () => h$1("i", { class: "i-line-md-loading-twotone-loop", style: { width: `16px`, height: `16px` } }) }
-  },
-  emits: ["close", "click", "contextmenu"],
-  setup(__props, { emit: __emit }) {
-    const emit = __emit;
-    const { activeName, list, pushItem, removeItem, itemClick } = inject(tabsBarInjectionKey) || {};
-    const active = computed(() => (activeName == null ? void 0 : activeName.value) === __props.name);
-    const activeIndex = computed(() => list == null ? void 0 : list.value.findIndex((f2) => f2 === (activeName == null ? void 0 : activeName.value)));
-    const currentIndex = computed(() => list == null ? void 0 : list.value.findIndex((f2) => f2 === __props.name));
-    const showLine = computed(() => (activeIndex == null ? void 0 : activeIndex.value) !== (currentIndex == null ? void 0 : currentIndex.value) && ((activeIndex == null ? void 0 : activeIndex.value) ?? 0) - 1 !== (currentIndex == null ? void 0 : currentIndex.value));
-    function onClose() {
-      removeItem == null ? void 0 : removeItem(__props.name);
-      emit("close");
-    }
-    function onClick(ev) {
-      itemClick == null ? void 0 : itemClick(__props.name);
-      emit("click", ev);
-    }
-    function onContextMenu(ev) {
-      emit("contextmenu", ev);
-    }
-    onMounted(() => {
-      pushItem == null ? void 0 : pushItem(__props.name);
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["uno-ubq14l group", [active.value ? "tab-active" : "", _ctx.disabled ? "uno-4y9yog" : ""]]),
-        onClick,
-        onContextmenu: onContextMenu
-      }, [
-        createElementVNode("div", {
-          class: normalizeClass(["uno-qjxywp", active.value ? "" : "uno-epu25o"])
-        }, [
-          (openBlock(), createBlock(resolveDynamicComponent(_ctx.loading ? _ctx.loadingRender : _ctx.icon))),
-          createElementVNode("div", _hoisted_1$1, [
-            renderSlot(_ctx.$slots, "default")
-          ]),
-          _ctx.closeable ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            class: "uno-r1pbch",
-            onClick: withModifiers(onClose, ["stop"])
-          }, _cache[0] || (_cache[0] = [
-            createElementVNode("i", { class: "uno-sjjwmq" }, null, -1)
-          ]))) : createCommentVNode("", true)
-        ], 2),
-        createElementVNode("div", {
-          class: normalizeClass(["uno-mzsdgg", active.value ? "uno-h6cmdc" : "uno-m6t4oj"])
-        }, _cache[1] || (_cache[1] = [
-          createStaticVNode('<svg width="10" height="10" class="uno-3sky1m"><path d="M 0 10 A 10 10 0 0 0 10 0 L 10 10 Z"></path></svg><div class="uno-nylnxp"></div><svg width="10" height="10" class="uno-3sky1m"><path d="M 0 0 A 10 10 0 0 0 10 10 L 0 10 Z"></path></svg>', 3)
-        ]), 2),
-        createElementVNode("div", {
-          class: normalizeClass([showLine.value ? "uno-h6cmdc" : "uno-m6t4oj", "uno-wqscdb"])
-        }, null, 2)
-      ], 34);
-    };
-  }
-});
-var r = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, t = function(r2) {
-  return "string" == typeof r2 ? r2.length > 0 : "number" == typeof r2;
-}, n = function(r2, t2, n2) {
-  return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = Math.pow(10, t2)), Math.round(n2 * r2) / n2 + 0;
-}, e = function(r2, t2, n2) {
-  return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = 1), r2 > n2 ? n2 : r2 > t2 ? r2 : t2;
-}, u = function(r2) {
-  return (r2 = isFinite(r2) ? r2 % 360 : 0) > 0 ? r2 : r2 + 360;
-}, a = function(r2) {
-  return { r: e(r2.r, 0, 255), g: e(r2.g, 0, 255), b: e(r2.b, 0, 255), a: e(r2.a) };
-}, o = function(r2) {
-  return { r: n(r2.r), g: n(r2.g), b: n(r2.b), a: n(r2.a, 3) };
-}, i = /^#([0-9a-f]{3,8})$/i, s = function(r2) {
-  var t2 = r2.toString(16);
-  return t2.length < 2 ? "0" + t2 : t2;
-}, h = function(r2) {
-  var t2 = r2.r, n2 = r2.g, e2 = r2.b, u2 = r2.a, a2 = Math.max(t2, n2, e2), o2 = a2 - Math.min(t2, n2, e2), i2 = o2 ? a2 === t2 ? (n2 - e2) / o2 : a2 === n2 ? 2 + (e2 - t2) / o2 : 4 + (t2 - n2) / o2 : 0;
-  return { h: 60 * (i2 < 0 ? i2 + 6 : i2), s: a2 ? o2 / a2 * 100 : 0, v: a2 / 255 * 100, a: u2 };
-}, b = function(r2) {
-  var t2 = r2.h, n2 = r2.s, e2 = r2.v, u2 = r2.a;
-  t2 = t2 / 360 * 6, n2 /= 100, e2 /= 100;
-  var a2 = Math.floor(t2), o2 = e2 * (1 - n2), i2 = e2 * (1 - (t2 - a2) * n2), s2 = e2 * (1 - (1 - t2 + a2) * n2), h2 = a2 % 6;
-  return { r: 255 * [e2, i2, o2, o2, s2, e2][h2], g: 255 * [s2, e2, e2, i2, o2, o2][h2], b: 255 * [o2, o2, s2, e2, e2, i2][h2], a: u2 };
-}, g = function(r2) {
-  return { h: u(r2.h), s: e(r2.s, 0, 100), l: e(r2.l, 0, 100), a: e(r2.a) };
-}, d = function(r2) {
-  return { h: n(r2.h), s: n(r2.s), l: n(r2.l), a: n(r2.a, 3) };
-}, f = function(r2) {
-  return b((n2 = (t2 = r2).s, { h: t2.h, s: (n2 *= ((e2 = t2.l) < 50 ? e2 : 100 - e2) / 100) > 0 ? 2 * n2 / (e2 + n2) * 100 : 0, v: e2 + n2, a: t2.a }));
-  var t2, n2, e2;
-}, c = function(r2) {
-  return { h: (t2 = h(r2)).h, s: (u2 = (200 - (n2 = t2.s)) * (e2 = t2.v) / 100) > 0 && u2 < 200 ? n2 * e2 / 100 / (u2 <= 100 ? u2 : 200 - u2) * 100 : 0, l: u2 / 2, a: t2.a };
-  var t2, n2, e2, u2;
-}, l = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, p = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, v = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, m = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i, y = { string: [[function(r2) {
-  var t2 = i.exec(r2);
-  return t2 ? (r2 = t2[1]).length <= 4 ? { r: parseInt(r2[0] + r2[0], 16), g: parseInt(r2[1] + r2[1], 16), b: parseInt(r2[2] + r2[2], 16), a: 4 === r2.length ? n(parseInt(r2[3] + r2[3], 16) / 255, 2) : 1 } : 6 === r2.length || 8 === r2.length ? { r: parseInt(r2.substr(0, 2), 16), g: parseInt(r2.substr(2, 2), 16), b: parseInt(r2.substr(4, 2), 16), a: 8 === r2.length ? n(parseInt(r2.substr(6, 2), 16) / 255, 2) : 1 } : null : null;
-}, "hex"], [function(r2) {
-  var t2 = v.exec(r2) || m.exec(r2);
-  return t2 ? t2[2] !== t2[4] || t2[4] !== t2[6] ? null : a({ r: Number(t2[1]) / (t2[2] ? 100 / 255 : 1), g: Number(t2[3]) / (t2[4] ? 100 / 255 : 1), b: Number(t2[5]) / (t2[6] ? 100 / 255 : 1), a: void 0 === t2[7] ? 1 : Number(t2[7]) / (t2[8] ? 100 : 1) }) : null;
-}, "rgb"], [function(t2) {
-  var n2 = l.exec(t2) || p.exec(t2);
-  if (!n2) return null;
-  var e2, u2, a2 = g({ h: (e2 = n2[1], u2 = n2[2], void 0 === u2 && (u2 = "deg"), Number(e2) * (r[u2] || 1)), s: Number(n2[3]), l: Number(n2[4]), a: void 0 === n2[5] ? 1 : Number(n2[5]) / (n2[6] ? 100 : 1) });
-  return f(a2);
-}, "hsl"]], object: [[function(r2) {
-  var n2 = r2.r, e2 = r2.g, u2 = r2.b, o2 = r2.a, i2 = void 0 === o2 ? 1 : o2;
-  return t(n2) && t(e2) && t(u2) ? a({ r: Number(n2), g: Number(e2), b: Number(u2), a: Number(i2) }) : null;
-}, "rgb"], [function(r2) {
-  var n2 = r2.h, e2 = r2.s, u2 = r2.l, a2 = r2.a, o2 = void 0 === a2 ? 1 : a2;
-  if (!t(n2) || !t(e2) || !t(u2)) return null;
-  var i2 = g({ h: Number(n2), s: Number(e2), l: Number(u2), a: Number(o2) });
-  return f(i2);
-}, "hsl"], [function(r2) {
-  var n2 = r2.h, a2 = r2.s, o2 = r2.v, i2 = r2.a, s2 = void 0 === i2 ? 1 : i2;
-  if (!t(n2) || !t(a2) || !t(o2)) return null;
-  var h2 = function(r3) {
-    return { h: u(r3.h), s: e(r3.s, 0, 100), v: e(r3.v, 0, 100), a: e(r3.a) };
-  }({ h: Number(n2), s: Number(a2), v: Number(o2), a: Number(s2) });
-  return b(h2);
-}, "hsv"]] }, N = function(r2, t2) {
-  for (var n2 = 0; n2 < t2.length; n2++) {
-    var e2 = t2[n2][0](r2);
-    if (e2) return [e2, t2[n2][1]];
+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;
+}, N = function(e, t, n) {
+  return t === void 0 && (t = 0), n === void 0 && (n = 1), e > n ? n : e > t ? e : t;
+}, _e = function(e) {
+  return (e = isFinite(e) ? e % 360 : 0) > 0 ? e : e + 360;
+}, he = function(e) {
+  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;
+}, 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 };
+}, 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: _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) };
+}, 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;
+}, 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, 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) {
+  var t = Yt.exec(e) || Jt.exec(e);
+  return t ? t[2] !== t[4] || t[4] !== t[6] ? null : he({ r: Number(t[1]) / (t[2] ? 100 / 255 : 1), g: Number(t[3]) / (t[4] ? 100 / 255 : 1), b: Number(t[5]) / (t[6] ? 100 / 255 : 1), a: t[7] === void 0 ? 1 : Number(t[7]) / (t[8] ? 100 : 1) }) : null;
+}, "rgb"], [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 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 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 (!A(t) || !A(n) || !A(o)) return null;
+  var s = me({ h: Number(t), s: Number(n), l: Number(o), a: Number(i) });
+  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 (!A(t) || !A(n) || !A(o)) return null;
+  var s = function(u) {
+    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 Re(s);
+}, "hsv"]] }, ge = function(e, t) {
+  for (var n = 0; n < t.length; n++) {
+    var o = t[n][0](e);
+    if (o) return [o, t[n][1]];
   }
   return [null, void 0];
-}, x = function(r2) {
-  return "string" == typeof r2 ? N(r2.trim(), y.string) : "object" == typeof r2 && null !== r2 ? N(r2, y.object) : [null, void 0];
-}, M = function(r2, t2) {
-  var n2 = c(r2);
-  return { h: n2.h, s: e(n2.s + 100 * t2, 0, 100), l: n2.l, a: n2.a };
-}, H = function(r2) {
-  return (299 * r2.r + 587 * r2.g + 114 * r2.b) / 1e3 / 255;
-}, $ = function(r2, t2) {
-  var n2 = c(r2);
-  return { h: n2.h, s: n2.s, l: e(n2.l + 100 * t2, 0, 100), a: n2.a };
-}, j = function() {
-  function r2(r3) {
-    this.parsed = x(r3)[0], this.rgba = this.parsed || { r: 0, g: 0, b: 0, a: 1 };
+}, Qt = function(e) {
+  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 = 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 = 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 };
   }
-  return r2.prototype.isValid = function() {
-    return null !== this.parsed;
-  }, r2.prototype.brightness = function() {
-    return n(H(this.rgba), 2);
-  }, r2.prototype.isDark = function() {
-    return H(this.rgba) < 0.5;
-  }, r2.prototype.isLight = function() {
-    return H(this.rgba) >= 0.5;
-  }, r2.prototype.toHex = function() {
-    return r3 = o(this.rgba), t2 = r3.r, e2 = r3.g, u2 = r3.b, i2 = (a2 = r3.a) < 1 ? s(n(255 * a2)) : "", "#" + s(t2) + s(e2) + s(u2) + i2;
-    var r3, t2, e2, u2, a2, i2;
-  }, r2.prototype.toRgb = function() {
-    return o(this.rgba);
-  }, r2.prototype.toRgbString = function() {
-    return r3 = o(this.rgba), t2 = r3.r, n2 = r3.g, e2 = r3.b, (u2 = r3.a) < 1 ? "rgba(" + t2 + ", " + n2 + ", " + e2 + ", " + u2 + ")" : "rgb(" + t2 + ", " + n2 + ", " + e2 + ")";
-    var r3, t2, n2, e2, u2;
-  }, r2.prototype.toHsl = function() {
-    return d(c(this.rgba));
-  }, r2.prototype.toHslString = function() {
-    return r3 = d(c(this.rgba)), t2 = r3.h, n2 = r3.s, e2 = r3.l, (u2 = r3.a) < 1 ? "hsla(" + t2 + ", " + n2 + "%, " + e2 + "%, " + u2 + ")" : "hsl(" + t2 + ", " + n2 + "%, " + e2 + "%)";
-    var r3, t2, n2, e2, u2;
-  }, r2.prototype.toHsv = function() {
-    return r3 = h(this.rgba), { h: n(r3.h), s: n(r3.s), v: n(r3.v), a: n(r3.a, 3) };
-    var r3;
-  }, r2.prototype.invert = function() {
-    return w({ r: 255 - (r3 = this.rgba).r, g: 255 - r3.g, b: 255 - r3.b, a: r3.a });
-    var r3;
-  }, r2.prototype.saturate = function(r3) {
-    return void 0 === r3 && (r3 = 0.1), w(M(this.rgba, r3));
-  }, r2.prototype.desaturate = function(r3) {
-    return void 0 === r3 && (r3 = 0.1), w(M(this.rgba, -r3));
-  }, r2.prototype.grayscale = function() {
-    return w(M(this.rgba, -1));
-  }, r2.prototype.lighten = function(r3) {
-    return void 0 === r3 && (r3 = 0.1), w($(this.rgba, r3));
-  }, r2.prototype.darken = function(r3) {
-    return void 0 === r3 && (r3 = 0.1), w($(this.rgba, -r3));
-  }, r2.prototype.rotate = function(r3) {
-    return void 0 === r3 && (r3 = 15), this.hue(this.hue() + r3);
-  }, r2.prototype.alpha = function(r3) {
-    return "number" == typeof r3 ? w({ r: (t2 = this.rgba).r, g: t2.g, b: t2.b, a: r3 }) : n(this.rgba.a, 3);
-    var t2;
-  }, r2.prototype.hue = function(r3) {
-    var t2 = c(this.rgba);
-    return "number" == typeof r3 ? w({ h: r3, s: t2.s, l: t2.l, a: t2.a }) : n(t2.h);
-  }, r2.prototype.isEqual = function(r3) {
-    return this.toHex() === w(r3).toHex();
-  }, r2;
-}(), w = function(r2) {
-  return r2 instanceof j ? r2 : new j(r2);
+  return e.prototype.isValid = function() {
+    return this.parsed !== null;
+  }, e.prototype.brightness = function() {
+    return y(J(this.rgba), 2);
+  }, e.prototype.isDark = function() {
+    return J(this.rgba) < 0.5;
+  }, e.prototype.isLight = function() {
+    return J(this.rgba) >= 0.5;
+  }, e.prototype.toHex = function() {
+    return t = K(this.rgba), n = t.r, o = t.g, r = t.b, s = (i = t.a) < 1 ? F(y(255 * i)) : "", "#" + F(n) + F(o) + F(r) + s;
+    var t, n, o, r, i, s;
+  }, e.prototype.toRgb = function() {
+    return K(this.rgba);
+  }, e.prototype.toRgbString = function() {
+    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 pe(z(this.rgba));
+  }, e.prototype.toHslString = function() {
+    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 = 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 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), I(Y(this.rgba, t));
+  }, e.prototype.desaturate = function(t) {
+    return t === void 0 && (t = 0.1), I(Y(this.rgba, -t));
+  }, e.prototype.grayscale = function() {
+    return I(Y(this.rgba, -1));
+  }, e.prototype.lighten = function(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), 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" ? 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 = 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() === I(t).toHex();
+  }, e;
+}(), I = function(e) {
+  return e instanceof ye ? e : new ye(e);
+};
+const Xt = {
+  name: "RiAddLine"
+}, en = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "1em",
+  height: "1em",
+  viewBox: "0 0 24 24"
 };
-const _hoisted_1 = { class: "uno-5zyl8j" };
-const _hoisted_2 = { class: "uno-ov60i3" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
+function tn(e, t, n, o, r, i) {
+  return E(), _("svg", en, t[0] || (t[0] = [
+    k("path", {
+      fill: "#757575",
+      d: "M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z"
+    }, null, -1)
+  ]));
+}
+const nn = /* @__PURE__ */ Z(Xt, [["render", tn]]), on = {
+  name: "RiArrowDropDownLine"
+}, rn = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "1em",
+  height: "1em",
+  viewBox: "0 0 24 24"
+};
+function sn(e, t, n, o, r, i) {
+  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"
+    }, null, -1)
+  ]));
+}
+const un = /* @__PURE__ */ Z(on, [["render", sn]]), an = /* @__PURE__ */ $e({
   __name: "Tabs",
-  props: /* @__PURE__ */ mergeModels({
-    backgroundColor: { default: "#E5E7EB" },
-    activeBackgroundColor: { default: "#fff" },
-    primaryColor: { default: "rgba(251,191,36,1)" }
+  props: /* @__PURE__ */ se({
+    colors: {},
+    dropdown: { type: Boolean },
+    addable: { type: Boolean },
+    options: {}
   }, {
-    "value": {},
-    "valueModifiers": {}
+    value: {},
+    valueModifiers: {}
   }),
-  emits: /* @__PURE__ */ mergeModels(["close"], ["update:value"]),
-  setup(__props, { emit: __emit }) {
-    const emit = __emit;
-    const value = useModel(__props, "value");
-    const { scrollRef, scrollToView } = useScrollView({ activeClassName: ".tab-active" });
-    watch(value, () => {
-      scrollToView();
+  emits: /* @__PURE__ */ se(["click", "contextmenu", "close", "add"], ["update:value"]),
+  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 = 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 list = ref([]);
-    const activeName = computed(() => list.value.find((f2) => f2 === value.value));
-    provide(tabsBarInjectionKey, {
-      list,
-      activeName,
-      pushItem(name) {
-        list.value.push(name);
-      },
-      removeItem(name) {
-        emit("close", name);
-        nextTick(() => {
-          scrollToView();
-        });
-      },
-      itemClick(name) {
-        value.value = name;
-      }
-    });
-    const backgroundColorDark = computed(() => w(__props.backgroundColor).darken(0.8).toHex());
-    const activeBackgroundColorDark = computed(() => w(__props.activeBackgroundColor).darken(0.8).toHex());
-    const primaryColorDark = computed(() => w(__props.primaryColor).darken(0.3).toHex());
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: "uno-f9asjx",
-        style: normalizeStyle({
-          "--tabs-bar-background-color": `${_ctx.backgroundColor}`,
-          "--tabs-bar-background-color-dark": `${backgroundColorDark.value}`,
-          "--tabs-bar-active-background-color": `${_ctx.activeBackgroundColor}`,
-          "--tabs-bar-active-background-color-dark": `${activeBackgroundColorDark.value}`,
-          "--tabs-bar-primary-color": `${_ctx.primaryColor}`,
-          "--tabs-bar-primary-color-dark": `${primaryColorDark.value}`
-        })
+    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 p(h) {
+      n("close", h);
+    }
+    return (h, m) => (E(), _("div", {
+      class: C([b(P)]),
+      style: Ve({
+        "--background-color": `${b(o)}`,
+        "--background-color-dark": `${d.value}`,
+        "--active-background-color": `${b(r)}`,
+        "--active-background-color-dark": `${a.value}`,
+        "--primary-color": `${b(i)}`,
+        "--primary-color-dark": `${v.value}`
+      })
+    }, [
+      h.dropdown ? (E(), _("div", {
+        key: 0,
+        class: C([`${b(P)}__icon`])
       }, [
-        createElementVNode("div", _hoisted_1, [
-          createElementVNode("div", _hoisted_2, [
-            renderSlot(_ctx.$slots, "prefix", {}, () => [
-              _cache[0] || (_cache[0] = createElementVNode("div", { class: "uno-kq7run" }, [
-                createElementVNode("i", { class: "i-ri-arrow-down-s-line" })
-              ], -1))
-            ])
+        q(un)
+      ], 2)) : Q("", !0),
+      ue(h.$slots, "prefix"),
+      k("div", {
+        ref_key: "scrollRef",
+        ref: f,
+        class: C([`${b(P)}__content`])
+      }, [
+        q(We, {
+          name: "group",
+          tag: "div",
+          class: C([`${b(P)}__scroll`])
+        }, {
+          default: He(() => [
+            (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: (D) => S($),
+              onItemContextmenu: (D) => l($),
+              onItemClose: (D) => p($)
+            }), null, 16, ["index", "active-index", "onItemClick", "onItemContextmenu", "onItemClose"]))), 128))
           ]),
-          createElementVNode("div", {
-            ref_key: "scrollRef",
-            ref: scrollRef,
-            class: "uno-23n4xq"
-          }, [
-            createVNode(TransitionGroup, {
-              name: "group",
-              tag: "div",
-              class: "uno-r0jwks"
-            }, {
-              default: withCtx(() => [
-                renderSlot(_ctx.$slots, "default")
-              ]),
-              _: 3
-            })
-          ], 512),
-          renderSlot(_ctx.$slots, "suffix")
-        ]),
-        _cache[1] || (_cache[1] = createElementVNode("div", { class: "uno-kfa0e9" }, null, -1))
-      ], 4);
-    };
+          _: 1
+        }, 8, ["class"])
+      ], 2),
+      ue(h.$slots, "suffix"),
+      h.addable ? (E(), _("div", {
+        key: 1,
+        class: C([`${b(P)}__icon`]),
+        onClick: m[0] || (m[0] = ($) => n("add"))
+      }, [
+        q(nn)
+      ], 2)) : Q("", !0)
+    ], 6));
   }
 });
-const tabsBarInjectionKey = useInjectionKey("tabs-bar-injection-key");
 export {
-  _sfc_main$1 as CTabItem,
-  _sfc_main as CTabs,
-  tabsBarInjectionKey
+  _t as CTabItem,
+  an as CTabs
 };