orion-design 0.1.16 → 0.1.18

package/dist/components/Tabs/index.js

@@ -1,84 +1,192 @@
 import "lodash-es";
-import { defineComponent as V, getCurrentInstance as q, inject as H, ref as P, watch as R, nextTick as K, onBeforeUnmount as ue, openBlock as ae, createElementBlock as se, normalizeClass as ne, unref as B, normalizeStyle as fe, computed as A, onMounted as oe, onUpdated as de, createVNode as f, provide as be, renderSlot as M, useSlots as ve, reactive as me, onUnmounted as pe, withDirectives as he, vShow as ge, createCommentVNode as ye } from "vue";
-import { withInstall as Ne } from "../_util/vue/install.js";
-import { ElIcon as G } from "element-plus";
-import { isNumber as Pe, isUndefined as xe } from "../_util/types.js";
-import { e as Te } from "../../functions-DzLqXvGt.js";
-import { buildProps as re, definePropType as ie } from "../_util/vue/props/runtime.js";
-import { UPDATE_MODEL_EVENT as le } from "../_constants/event.js";
-import { useNamespace as D } from "../_hooks/use-namespace/index.js";
-import { useOrderedChildren as $e } from "../_hooks/use-ordered-children/index.js";
-import { tabsRootContextKey as I } from "./constants.js";
-import { u as W, a as Ce, b as Se } from "../../index-DLvlyWAh.js";
-import { capitalize as k } from "../_util/strings.js";
-import { throwError as j } from "../_util/error.js";
-import { e as Oe, f as we } from "../../index-BwWeqwHB.js";
-import { mutable as Ee } from "../_util/typescript.js";
-import { EVENT_CODE as _e } from "../_constants/aria.js";
-import { tabBarProps as ke } from "./tab-bar.js";
-import { tabPaneProps as Be } from "./tab-pane.js";
-import { e as J } from "../../index-DG_8kbAs.js";
-const Q = "OTabBar", ze = /* @__PURE__ */ V({
-  name: Q,
+import { ref as h, watch as B, defineComponent as M, getCurrentInstance as D, inject as H, nextTick as K, onBeforeUnmount as Pe, openBlock as ue, createElementBlock as fe, normalizeClass as de, unref as k, normalizeStyle as Ne, computed as F, onMounted as ve, onUpdated as Ee, createVNode as O, provide as we, renderSlot as L, useSlots as Te, reactive as Se, onUnmounted as xe, withDirectives as $e, vShow as Ce, createCommentVNode as Ie } from "vue";
+import { withInstall as Be } from "../_util/vue/install.js";
+import { ElIcon as J } from "element-plus";
+import { isNumber as ke, isUndefined as ze } from "../_util/types.js";
+import { e as Re } from "../../functions-DzLqXvGt.js";
+import { buildProps as be, definePropType as pe } from "../_util/vue/props/runtime.js";
+import { UPDATE_MODEL_EVENT as me } from "../_constants/event.js";
+import { useNamespace as V } from "../_hooks/use-namespace/index.js";
+import { useOrderedChildren as Ae } from "../_hooks/use-ordered-children/index.js";
+import { tabsRootContextKey as Q } from "./constants.js";
+import { t as he, r as ye, i as Oe, b as Le, n as Fe, c as Me, d as Ve, e as Z } from "../../index-C9tCD90X.js";
+import { capitalize as I } from "../_util/strings.js";
+import { throwError as q } from "../_util/error.js";
+import { e as Qe, f as Ue } from "../../index-BwWeqwHB.js";
+import { mutable as We } from "../_util/typescript.js";
+import { EVENT_CODE as je } from "../_constants/aria.js";
+import { tabBarProps as De } from "./tab-bar.js";
+import { tabPaneProps as He } from "./tab-pane.js";
+function ge(e) {
+  var t;
+  const a = ye(e);
+  return (t = a == null ? void 0 : a.$el) != null ? t : a;
+}
+const G = Oe ? window : void 0, Ke = Oe ? window.document : void 0;
+function W(...e) {
+  let t, a, s, n;
+  if (Le(e[0]) || Array.isArray(e[0]) ? ([a, s, n] = e, t = G) : [t, a, s, n] = e, !t)
+    return Fe;
+  Array.isArray(a) || (a = [a]), Array.isArray(s) || (s = [s]);
+  const P = [], d = () => {
+    P.forEach((r) => r()), P.length = 0;
+  }, u = (r, i, f, b) => (r.addEventListener(i, f, b), () => r.removeEventListener(i, f, b)), y = B(() => [ge(t), ye(n)], ([r, i]) => {
+    d(), r && P.push(...a.flatMap((f) => s.map((b) => u(r, f, b, i))));
+  }, { immediate: !0, flush: "post" }), v = () => {
+    y(), d();
+  };
+  return he(v), v;
+}
+function qe(e, t = !1) {
+  const a = h(), s = () => a.value = !!e();
+  return s(), Me(s, t), a;
+}
+const ee = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, te = "__vueuse_ssr_handlers__";
+ee[te] = ee[te] || {};
+function Ge({ document: e = Ke } = {}) {
+  if (!e)
+    return h("visible");
+  const t = h(e.visibilityState);
+  return W(e, "visibilitychange", () => {
+    t.value = e.visibilityState;
+  }), t;
+}
+var ae = Object.getOwnPropertySymbols, Xe = Object.prototype.hasOwnProperty, Ye = Object.prototype.propertyIsEnumerable, Je = (e, t) => {
+  var a = {};
+  for (var s in e)
+    Xe.call(e, s) && t.indexOf(s) < 0 && (a[s] = e[s]);
+  if (e != null && ae)
+    for (var s of ae(e))
+      t.indexOf(s) < 0 && Ye.call(e, s) && (a[s] = e[s]);
+  return a;
+};
+function j(e, t, a = {}) {
+  const s = a, { window: n = G } = s, P = Je(s, ["window"]);
+  let d;
+  const u = qe(() => n && "ResizeObserver" in n), y = () => {
+    d && (d.disconnect(), d = void 0);
+  }, v = B(() => ge(e), (i) => {
+    y(), u.value && n && i && (d = new ResizeObserver(t), d.observe(i, P));
+  }, { immediate: !0, flush: "post" }), r = () => {
+    y(), v();
+  };
+  return he(r), {
+    isSupported: u,
+    stop: r
+  };
+}
+var ne;
+(function(e) {
+  e.UP = "UP", e.RIGHT = "RIGHT", e.DOWN = "DOWN", e.LEFT = "LEFT", e.NONE = "NONE";
+})(ne || (ne = {}));
+var Ze = Object.defineProperty, se = Object.getOwnPropertySymbols, et = Object.prototype.hasOwnProperty, tt = Object.prototype.propertyIsEnumerable, oe = (e, t, a) => t in e ? Ze(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a, at = (e, t) => {
+  for (var a in t || (t = {}))
+    et.call(t, a) && oe(e, a, t[a]);
+  if (se)
+    for (var a of se(t))
+      tt.call(t, a) && oe(e, a, t[a]);
+  return e;
+};
+const nt = {
+  easeInSine: [0.12, 0, 0.39, 0],
+  easeOutSine: [0.61, 1, 0.88, 1],
+  easeInOutSine: [0.37, 0, 0.63, 1],
+  easeInQuad: [0.11, 0, 0.5, 0],
+  easeOutQuad: [0.5, 1, 0.89, 1],
+  easeInOutQuad: [0.45, 0, 0.55, 1],
+  easeInCubic: [0.32, 0, 0.67, 0],
+  easeOutCubic: [0.33, 1, 0.68, 1],
+  easeInOutCubic: [0.65, 0, 0.35, 1],
+  easeInQuart: [0.5, 0, 0.75, 0],
+  easeOutQuart: [0.25, 1, 0.5, 1],
+  easeInOutQuart: [0.76, 0, 0.24, 1],
+  easeInQuint: [0.64, 0, 0.78, 0],
+  easeOutQuint: [0.22, 1, 0.36, 1],
+  easeInOutQuint: [0.83, 0, 0.17, 1],
+  easeInExpo: [0.7, 0, 0.84, 0],
+  easeOutExpo: [0.16, 1, 0.3, 1],
+  easeInOutExpo: [0.87, 0, 0.13, 1],
+  easeInCirc: [0.55, 0, 1, 0.45],
+  easeOutCirc: [0, 0.55, 0.45, 1],
+  easeInOutCirc: [0.85, 0, 0.15, 1],
+  easeInBack: [0.36, 0, 0.66, -0.56],
+  easeOutBack: [0.34, 1.56, 0.64, 1],
+  easeInOutBack: [0.68, -0.6, 0.32, 1.6]
+};
+at({
+  linear: Ve
+}, nt);
+function st({ window: e = G } = {}) {
+  if (!e)
+    return h(!1);
+  const t = h(e.document.hasFocus());
+  return W(e, "blur", () => {
+    t.value = !1;
+  }), W(e, "focus", () => {
+    t.value = !0;
+  }), t;
+}
+const re = "OTabBar", ot = /* @__PURE__ */ M({
+  name: re,
   __name: "tab-bar",
-  props: ke,
-  setup(a, { expose: d }) {
-    const h = a, g = q(), e = H(I);
-    e || j(Q, "<o-tabs><o-tab-bar /></p-tabs>");
-    const _ = D("tabs"), x = P(), i = P(), T = () => {
-      let v = 0, t = 0;
-      const o = ["top", "bottom"].includes(e.props.tabPosition) ? "width" : "height", y = o === "width" ? "x" : "y", O = y === "x" ? "left" : "top";
-      return h.tabs.every((E) => {
-        var L, F;
-        const w = (F = (L = g.parent) == null ? void 0 : L.refs) == null ? void 0 : F[`tab-${E.uid}`];
-        if (!w) return !1;
-        if (!E.active)
+  props: De,
+  setup(e, { expose: t }) {
+    const a = e, s = D(), n = H(Q);
+    n || q(re, "<o-tabs><o-tab-bar /></p-tabs>");
+    const P = V("tabs"), d = h(), u = h(), y = () => {
+      let b = 0, o = 0;
+      const p = ["top", "bottom"].includes(n.props.tabPosition) ? "width" : "height", N = p === "width" ? "x" : "y", x = N === "x" ? "left" : "top";
+      return a.tabs.every((C) => {
+        var A, R;
+        const $ = (R = (A = s.parent) == null ? void 0 : A.refs) == null ? void 0 : R[`tab-${C.uid}`];
+        if (!$) return !1;
+        if (!C.active)
           return !0;
-        v = w[`offset${k(O)}`], t = w[`client${k(o)}`];
-        const z = window.getComputedStyle(w);
-        return o === "width" && (t -= Number.parseFloat(z.paddingLeft) + Number.parseFloat(z.paddingRight), v += Number.parseFloat(z.paddingLeft)), !1;
+        b = $[`offset${I(x)}`], o = $[`client${I(p)}`];
+        const z = window.getComputedStyle($);
+        return p === "width" && (o -= Number.parseFloat(z.paddingLeft) + Number.parseFloat(z.paddingRight), b += Number.parseFloat(z.paddingLeft)), !1;
       }), {
-        [o]: `${t}px`,
-        transform: `translate${k(y)}(${v}px)`
+        [p]: `${o}px`,
+        transform: `translate${I(N)}(${b}px)`
       };
-    }, b = () => i.value = T(), c = [], l = () => {
-      var t;
-      c.forEach((o) => o.stop()), c.length = 0;
-      const v = (t = g.parent) == null ? void 0 : t.refs;
-      if (v) {
-        for (const o in v)
-          if (o.startsWith("tab-")) {
-            const y = v[o];
-            y && c.push(W(y, b));
+    }, v = () => u.value = y(), r = [], i = () => {
+      var o;
+      r.forEach((p) => p.stop()), r.length = 0;
+      const b = (o = s.parent) == null ? void 0 : o.refs;
+      if (b) {
+        for (const p in b)
+          if (p.startsWith("tab-")) {
+            const N = b[p];
+            N && r.push(j(N, v));
           }
       }
     };
-    R(
-      () => h.tabs,
+    B(
+      () => a.tabs,
       async () => {
-        await K(), b(), l();
+        await K(), v(), i();
       },
       { immediate: !0 }
     );
-    const u = W(x, () => b());
-    return ue(() => {
-      c.forEach((v) => v.stop()), c.length = 0, u.stop();
-    }), d({
+    const f = j(d, () => v());
+    return Pe(() => {
+      r.forEach((b) => b.stop()), r.length = 0, f.stop();
+    }), t({
       /** @description tab root html element */
-      ref: x,
+      ref: d,
       /** @description method to manually update tab bar style */
-      update: b
-    }), (v, t) => (ae(), se("div", {
+      update: v
+    }), (b, o) => (ue(), fe("div", {
       ref_key: "barRef",
-      ref: x,
-      class: ne([B(_).e("active-bar"), B(_).is(B(e).props.tabPosition)]),
-      style: fe(i.value)
+      ref: d,
+      class: de([k(P).e("active-bar"), k(P).is(k(n).props.tabPosition)]),
+      style: Ne(u.value)
     }, null, 6));
   }
-}), Re = re({
+}), rt = be({
   panes: {
-    type: ie(Array),
-    default: () => Ee([])
+    type: pe(Array),
+    default: () => We([])
   },
   currentName: {
     type: [String, Number],
@@ -90,122 +198,122 @@ const Q = "OTabBar", ze = /* @__PURE__ */ V({
     default: "card"
   },
   stretch: Boolean
-}), Fe = {
-  tabClick: (a, d, h) => h instanceof Event,
-  tabRemove: (a, d) => d instanceof Event
-}, Z = "OTabNav", Le = /* @__PURE__ */ V({
-  name: Z,
-  props: Re,
-  emits: Fe,
-  setup(a, {
-    expose: d,
-    emit: h
+}), it = {
+  tabClick: (e, t, a) => a instanceof Event,
+  tabRemove: (e, t) => t instanceof Event
+}, ie = "OTabNav", lt = /* @__PURE__ */ M({
+  name: ie,
+  props: rt,
+  emits: it,
+  setup(e, {
+    expose: t,
+    emit: a
   }) {
-    const g = H(I);
-    g || j(Z, "<o-tabs><o-tab-nav /></o-tabs>");
-    const e = D("tabs"), _ = Ce(), x = Se(), i = P(), T = P(), b = P(), c = P(), l = P(!1), u = P(0), v = P(!1), t = P(!0), o = A(() => ["top", "bottom"].includes(g.props.tabPosition) ? "width" : "height"), y = A(() => ({
-      transform: `translate${o.value === "width" ? "X" : "Y"}(-${u.value}px)`
-    })), O = () => {
-      if (!i.value) return;
-      const s = i.value[`offset${k(o.value)}`], r = u.value;
-      if (!r) return;
-      const n = r > s ? r - s : 0;
-      u.value = n;
-    }, E = () => {
-      if (!i.value || !T.value) return;
-      const s = T.value[`offset${k(o.value)}`], r = i.value[`offset${k(o.value)}`], n = u.value;
-      if (s - n <= r) return;
-      const $ = s - n > r * 2 ? n + r : s - r;
-      u.value = $;
-    }, w = async () => {
-      const s = T.value;
-      if (!l.value || !b.value || !i.value || !s) return;
+    const s = H(Q);
+    s || q(ie, "<o-tabs><o-tab-nav /></o-tabs>");
+    const n = V("tabs"), P = Ge(), d = st(), u = h(), y = h(), v = h(), r = h(), i = h(!1), f = h(0), b = h(!1), o = h(!0), p = F(() => ["top", "bottom"].includes(s.props.tabPosition) ? "width" : "height"), N = F(() => ({
+      transform: `translate${p.value === "width" ? "X" : "Y"}(-${f.value}px)`
+    })), x = () => {
+      if (!u.value) return;
+      const l = u.value[`offset${I(p.value)}`], m = f.value;
+      if (!m) return;
+      const c = m > l ? m - l : 0;
+      f.value = c;
+    }, C = () => {
+      if (!u.value || !y.value) return;
+      const l = y.value[`offset${I(p.value)}`], m = u.value[`offset${I(p.value)}`], c = f.value;
+      if (l - c <= m) return;
+      const w = l - c > m * 2 ? c + m : l - m;
+      f.value = w;
+    }, $ = async () => {
+      const l = y.value;
+      if (!i.value || !v.value || !u.value || !l) return;
       await K();
-      const r = b.value.querySelector(".is-active");
-      if (!r) return;
-      const n = i.value, $ = ["top", "bottom"].includes(g.props.tabPosition), N = r.getBoundingClientRect(), p = n.getBoundingClientRect(), S = $ ? s.offsetWidth - p.width : s.offsetHeight - p.height, C = u.value;
-      let m = C;
-      $ ? (N.left < p.left && (m = C - (p.left - N.left)), N.right > p.right && (m = C + N.right - p.right)) : (N.top < p.top && (m = C - (p.top - N.top)), N.bottom > p.bottom && (m = C + (N.bottom - p.bottom))), m = Math.max(m, 0), u.value = Math.min(m, S);
+      const m = v.value.querySelector(".is-active");
+      if (!m) return;
+      const c = u.value, w = ["top", "bottom"].includes(s.props.tabPosition), E = m.getBoundingClientRect(), _ = c.getBoundingClientRect(), S = w ? l.offsetWidth - _.width : l.offsetHeight - _.height, T = f.value;
+      let g = T;
+      w ? (E.left < _.left && (g = T - (_.left - E.left)), E.right > _.right && (g = T + E.right - _.right)) : (E.top < _.top && (g = T - (_.top - E.top)), E.bottom > _.bottom && (g = T + (E.bottom - _.bottom))), g = Math.max(g, 0), f.value = Math.min(g, S);
     }, z = () => {
-      var $;
-      if (!T.value || !i.value) return;
-      a.stretch && (($ = c.value) == null || $.update());
-      const s = T.value[`offset${k(o.value)}`], r = i.value[`offset${k(o.value)}`], n = u.value;
-      r < s ? (l.value = l.value || {}, l.value.prev = n, l.value.next = n + r < s, s - n < r && (u.value = s - r)) : (l.value = !1, n > 0 && (u.value = 0));
-    }, L = (s) => {
-      const r = s.code, {
-        up: n,
-        down: $,
-        left: N,
-        right: p
-      } = _e;
-      if (![n, $, N, p].includes(r)) return;
-      const S = Array.from(s.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)")), C = S.indexOf(s.target);
-      let m;
-      r === N || r === n ? C === 0 ? m = S.length - 1 : m = C - 1 : C < S.length - 1 ? m = C + 1 : m = 0, S[m].focus({
+      var w;
+      if (!y.value || !u.value) return;
+      e.stretch && ((w = r.value) == null || w.update());
+      const l = y.value[`offset${I(p.value)}`], m = u.value[`offset${I(p.value)}`], c = f.value;
+      m < l ? (i.value = i.value || {}, i.value.prev = c, i.value.next = c + m < l, l - c < m && (f.value = l - m)) : (i.value = !1, c > 0 && (f.value = 0));
+    }, A = (l) => {
+      const m = l.code, {
+        up: c,
+        down: w,
+        left: E,
+        right: _
+      } = je;
+      if (![c, w, E, _].includes(m)) return;
+      const S = Array.from(l.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)")), T = S.indexOf(l.target);
+      let g;
+      m === E || m === c ? T === 0 ? g = S.length - 1 : g = T - 1 : T < S.length - 1 ? g = T + 1 : g = 0, S[g].focus({
         preventScroll: !0
-      }), S[m].click(), F();
-    }, F = () => {
-      t.value && (v.value = !0);
-    }, U = () => v.value = !1;
-    return R(_, (s) => {
-      s === "hidden" ? t.value = !1 : s === "visible" && setTimeout(() => t.value = !0, 50);
-    }), R(x, (s) => {
-      s ? setTimeout(() => t.value = !0, 50) : t.value = !1;
-    }), W(b, z), oe(() => setTimeout(() => w(), 0)), de(() => z()), d({
-      scrollToActiveTab: w,
+      }), S[g].click(), R();
+    }, R = () => {
+      o.value && (b.value = !0);
+    }, U = () => b.value = !1;
+    return B(P, (l) => {
+      l === "hidden" ? o.value = !1 : l === "visible" && setTimeout(() => o.value = !0, 50);
+    }), B(d, (l) => {
+      l ? setTimeout(() => o.value = !0, 50) : o.value = !1;
+    }), j(v, z), ve(() => setTimeout(() => $(), 0)), Ee(() => z()), t({
+      scrollToActiveTab: $,
       removeFocus: U
     }), () => {
-      const s = l.value ? [f("span", {
-        class: [e.e("nav-prev"), e.is("disabled", !l.value.prev)],
-        onClick: O
-      }, [f(G, null, {
-        default: () => [f(Oe, null, null)]
-      })]), f("span", {
-        class: [e.e("nav-next"), e.is("disabled", !l.value.next)],
-        onClick: E
-      }, [f(G, null, {
-        default: () => [f(we, null, null)]
-      })])] : null, r = a.panes.map((n, $) => {
+      const l = i.value ? [O("span", {
+        class: [n.e("nav-prev"), n.is("disabled", !i.value.prev)],
+        onClick: x
+      }, [O(J, null, {
+        default: () => [O(Qe, null, null)]
+      })]), O("span", {
+        class: [n.e("nav-next"), n.is("disabled", !i.value.next)],
+        onClick: C
+      }, [O(J, null, {
+        default: () => [O(Ue, null, null)]
+      })])] : null, m = e.panes.map((c, w) => {
         var X, Y;
-        const N = n.uid, p = n.props.disabled, S = n.props.name ?? n.index ?? `${$}`;
-        n.index = `${$}`;
-        const C = ((Y = (X = n.slots).label) == null ? void 0 : Y.call(X)) || n.props.label, m = !p && n.active ? 0 : -1;
-        return f("div", {
-          ref: `tab-${N}`,
-          class: [e.e("item"), e.is(g.props.tabPosition), e.is("active", n.active), e.is("disabled", p), e.is("focus", v.value)],
+        const E = c.uid, _ = c.props.disabled, S = c.props.name ?? c.index ?? `${w}`;
+        c.index = `${w}`;
+        const T = ((Y = (X = c.slots).label) == null ? void 0 : Y.call(X)) || c.props.label, g = !_ && c.active ? 0 : -1;
+        return O("div", {
+          ref: `tab-${E}`,
+          class: [n.e("item"), n.is(s.props.tabPosition), n.is("active", c.active), n.is("disabled", _), n.is("focus", b.value)],
           id: `tab-${S}`,
-          key: `tab-${N}`,
+          key: `tab-${E}`,
           "aria-controls": `pane-${S}`,
           role: "tab",
-          "aria-selected": n.active,
-          tabindex: m,
-          onFocus: () => F(),
+          "aria-selected": c.active,
+          tabindex: g,
+          onFocus: () => R(),
           onBlur: () => U(),
-          onClick: (ce) => {
-            U(), h("tabClick", n, S, ce);
+          onClick: (_e) => {
+            U(), a("tabClick", c, S, _e);
           }
-        }, [C]);
+        }, [T]);
       });
-      return f("div", {
-        ref: b,
-        class: [e.e("nav-wrap"), e.is("scrollable", !!l.value), e.is(g.props.tabPosition)]
-      }, [s, f("div", {
-        class: e.e("nav-scroll"),
-        ref: i
-      }, [f("div", {
-        class: [e.e("nav"), e.is(g.props.tabPosition), e.is("stretch", a.stretch && ["top", "bottom"].includes(g.props.tabPosition))],
-        ref: T,
-        style: y.value,
+      return O("div", {
+        ref: v,
+        class: [n.e("nav-wrap"), n.is("scrollable", !!i.value), n.is(s.props.tabPosition)]
+      }, [l, O("div", {
+        class: n.e("nav-scroll"),
+        ref: u
+      }, [O("div", {
+        class: [n.e("nav"), n.is(s.props.tabPosition), n.is("stretch", e.stretch && ["top", "bottom"].includes(s.props.tabPosition))],
+        ref: y,
+        style: N.value,
         role: "tablist",
-        onKeydown: L
-      }, [a.type ? null : f(ze, {
-        ref: c,
-        tabs: [...a.panes]
-      }, null), r])])]);
+        onKeydown: A
+      }, [e.type ? null : O(ot, {
+        ref: r,
+        tabs: [...e.panes]
+      }, null), m])])]);
     };
   }
-}), Me = re({
+}), ct = be({
   /**
    * @description type of Tab
    */
@@ -232,136 +340,136 @@ const Q = "OTabBar", ze = /* @__PURE__ */ V({
    * @description hook function before switching tab. If `false` is returned or a `Promise` is returned and then is rejected, switching will be prevented
    */
   beforeLeave: {
-    type: ie(Function),
+    type: pe(Function),
     default: () => !0
   },
   /**
    * @description whether width of tab automatically fits its container
    */
   stretch: Boolean
-}), ee = (a) => Te(a) || Pe(a), Ae = {
-  [le]: (a) => ee(a),
-  tabClick: (a, d) => d instanceof Event,
-  tabChange: (a) => ee(a)
-}, Ve = /* @__PURE__ */ V({
+}), le = (e) => Re(e) || ke(e), ut = {
+  [me]: (e) => le(e),
+  tabClick: (e, t) => t instanceof Event,
+  tabChange: (e) => le(e)
+}, ft = /* @__PURE__ */ M({
   name: "OTabs",
-  props: Me,
-  emits: Ae,
-  setup(a, {
-    emit: d,
-    slots: h,
-    expose: g
+  props: ct,
+  emits: ut,
+  setup(e, {
+    emit: t,
+    slots: a,
+    expose: s
   }) {
-    const e = D("tabs"), _ = A(() => ["left", "right"].includes(a.tabPosition)), {
-      children: x,
-      addChild: i,
-      removeChild: T
-    } = $e(q(), "OTabPane"), b = P(), c = P(a.modelValue ?? "0"), l = async (t, o = !1) => {
-      var y, O, E;
-      if (!(c.value === t || xe(t)))
+    const n = V("tabs"), P = F(() => ["left", "right"].includes(e.tabPosition)), {
+      children: d,
+      addChild: u,
+      removeChild: y
+    } = Ae(D(), "OTabPane"), v = h(), r = h(e.modelValue ?? "0"), i = async (o, p = !1) => {
+      var N, x, C;
+      if (!(r.value === o || ze(o)))
         try {
-          await ((y = a.beforeLeave) == null ? void 0 : y.call(a, t, c.value)) !== !1 && (c.value = t, o && (d(le, t), d("tabChange", t)), (E = (O = b.value) == null ? void 0 : O.removeFocus) == null || E.call(O));
+          await ((N = e.beforeLeave) == null ? void 0 : N.call(e, o, r.value)) !== !1 && (r.value = o, p && (t(me, o), t("tabChange", o)), (C = (x = v.value) == null ? void 0 : x.removeFocus) == null || C.call(x));
         } catch {
         }
-    }, u = (t, o, y) => {
-      t.props.disabled || (l(o, !0), d("tabClick", t, y));
+    }, f = (o, p, N) => {
+      o.props.disabled || (i(p, !0), t("tabClick", o, N));
     };
-    R(() => a.modelValue, (t) => l(t)), R(c, async () => {
-      var t;
-      await K(), (t = b.value) == null || t.scrollToActiveTab();
-    }), be(I, {
-      props: a,
-      currentName: c,
-      registerPane: (t) => {
-        x.value.push(t);
+    B(() => e.modelValue, (o) => i(o)), B(r, async () => {
+      var o;
+      await K(), (o = v.value) == null || o.scrollToActiveTab();
+    }), we(Q, {
+      props: e,
+      currentName: r,
+      registerPane: (o) => {
+        d.value.push(o);
       },
-      sortPane: i,
-      unregisterPane: T
-    }), g({
-      currentName: c
+      sortPane: u,
+      unregisterPane: y
+    }), s({
+      currentName: r
     });
-    const v = ({
-      render: t
-    }) => t();
+    const b = ({
+      render: o
+    }) => o();
     return () => {
-      const t = h["left-extra"], o = h["right-extra"], y = f("div", {
-        class: [e.e("header"), _.value && e.e("header-vertical"), e.is(a.tabPosition)]
-      }, [t && f("div", {
-        class: e.e("extra-content-left")
-      }, [M(h, "left-extra")]), f(v, {
+      const o = a["left-extra"], p = a["right-extra"], N = O("div", {
+        class: [n.e("header"), P.value && n.e("header-vertical"), n.is(e.tabPosition)]
+      }, [o && O("div", {
+        class: n.e("extra-content-left")
+      }, [L(a, "left-extra")]), O(b, {
         render: () => {
-          const E = x.value.some((w) => w.slots.label);
-          return f(Le, {
-            ref: b,
-            currentName: c.value,
-            type: a.type,
-            panes: x.value,
-            stretch: a.stretch,
-            onTabClick: u
+          const C = d.value.some(($) => $.slots.label);
+          return O(lt, {
+            ref: v,
+            currentName: r.value,
+            type: e.type,
+            panes: d.value,
+            stretch: e.stretch,
+            onTabClick: f
           }, {
-            $stable: !E
+            $stable: !C
           });
         }
-      }, null), o && f("div", {
-        class: e.e("extra-content-right")
-      }, [M(h, "right-extra")])]), O = f("div", {
-        class: e.e("content")
-      }, [M(h, "default")]);
-      return f("div", {
-        class: [e.b(), e.m(a.tabPosition), {
-          [e.m("card")]: a.type === "card",
-          [e.m("border-card")]: a.type === "border-card"
+      }, null), p && O("div", {
+        class: n.e("extra-content-right")
+      }, [L(a, "right-extra")])]), x = O("div", {
+        class: n.e("content")
+      }, [L(a, "default")]);
+      return O("div", {
+        class: [n.b(), n.m(e.tabPosition), {
+          [n.m("card")]: e.type === "card",
+          [n.m("border-card")]: e.type === "border-card"
         }]
-      }, [O, y]);
+      }, [x, N]);
     };
   }
-}), De = ["id", "aria-hidden", "aria-labelledby"], te = "OTabPane", Ie = /* @__PURE__ */ V({
-  name: te,
+}), dt = ["id", "aria-hidden", "aria-labelledby"], ce = "OTabPane", vt = /* @__PURE__ */ M({
+  name: ce,
   __name: "tab-pane",
-  props: Be,
-  setup(a) {
-    const d = a, h = q(), g = ve(), e = H(I);
-    e || j(te, "usage: <o-tabs><o-tab-pane /></o-tabs/>");
-    const _ = D("tab-pane"), x = P(), i = J(() => e.currentName.value === (d.name ?? x.value)), T = P(i.value), b = A(() => d.name ?? x.value), c = J(() => !d.lazy || T.value || i.value);
-    R(i, (u) => {
-      u && (T.value = !0);
+  props: He,
+  setup(e) {
+    const t = e, a = D(), s = Te(), n = H(Q);
+    n || q(ce, "usage: <o-tabs><o-tab-pane /></o-tabs/>");
+    const P = V("tab-pane"), d = h(), u = Z(() => n.currentName.value === (t.name ?? d.value)), y = h(u.value), v = F(() => t.name ?? d.value), r = Z(() => !t.lazy || y.value || u.value);
+    B(u, (f) => {
+      f && (y.value = !0);
     });
-    const l = me({
-      uid: h.uid,
-      slots: g,
-      props: d,
-      paneName: b,
-      active: i,
-      index: x
+    const i = Se({
+      uid: a.uid,
+      slots: s,
+      props: t,
+      paneName: v,
+      active: u,
+      index: d
     });
-    return e.registerPane(l), oe(() => {
-      e.sortPane(l);
-    }), pe(() => {
-      e.unregisterPane(l.uid);
-    }), (u, v) => B(c) ? he((ae(), se("div", {
+    return n.registerPane(i), ve(() => {
+      n.sortPane(i);
+    }), xe(() => {
+      n.unregisterPane(i.uid);
+    }), (f, b) => k(r) ? $e((ue(), fe("div", {
       key: 0,
-      id: `pane-${b.value}`,
-      class: ne(B(_).b()),
+      id: `pane-${v.value}`,
+      class: de(k(P).b()),
       role: "tabpanel",
-      "aria-hidden": !B(i),
-      "aria-labelledby": `tab-${b.value}`
+      "aria-hidden": !k(u),
+      "aria-labelledby": `tab-${v.value}`
     }, [
-      M(u.$slots, "default")
-    ], 10, De)), [
-      [ge, B(i)]
-    ]) : ye("", !0);
+      L(f.$slots, "default")
+    ], 10, dt)), [
+      [Ce, k(u)]
+    ]) : Ie("", !0);
   }
-}), lt = Ne(Ve, {
-  TabPane: Ie
+}), kt = Be(ft, {
+  TabPane: vt
 });
 export {
-  lt as default,
-  ke as tabBarProps,
-  Fe as tabNavEmits,
-  Re as tabNavProps,
-  Be as tabPaneProps,
-  Ae as tabsEmits,
-  Me as tabsProps,
-  I as tabsRootContextKey
+  kt as default,
+  De as tabBarProps,
+  it as tabNavEmits,
+  rt as tabNavProps,
+  He as tabPaneProps,
+  ut as tabsEmits,
+  ct as tabsProps,
+  Q as tabsRootContextKey
 };
 //# sourceMappingURL=index.js.map