welcome-ui 1.0.0-beta.9 → 7.0.0-alpha.7

package/dist/Tabs.mjs

@@ -1,28 +1,27 @@
 "use client";
-import L, { createContext as ae, useMemo as ie, useCallback as ce, useRef as z, useEffect as J, useState as W, cloneElement as Ce } from "react";
-import { forwardRef as K } from "./System.mjs";
-import Z from "react-flatten-children";
-import { u as Pe } from "./use-viewport-m3glsbna.mjs";
-import { u as Ee } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
-import M, { css as V, th as x, system as $e } from "@xstyled/styled-components";
-import { C as le, a as de, d as ee, u as we, e as ye } from "./P2CTZE2T-5jxBu6ix.mjs";
-import { n as ue, A as _e, B as A, C as O, D as k, Q as te, h as g, a as p, H as oe, c as Q, _ as U, i as X, x as me, o as Re, e as H, m as F, w as Le, f as Y, b as q, E as fe, aa as Ne, j as Be, v as Oe } from "./LVA2YJMS-Dm5ieEMw.mjs";
-import { c as ke, b as De, u as Ve, a as Ae } from "./ITI7HKP4-Couz1Z73.mjs";
-import { e as je, f as Fe } from "./VGCJ63VH-BqPfqkK_.mjs";
-import { m as Me, o as ne, s as D, d as w, g as ze, c as He, a as be, b as se, u as j } from "./YV4JVR4I-1ezWeCCz.mjs";
-import { u as We } from "./VEVQD5MH-DOp_qaPw.mjs";
-import { P as Ke, a as Qe } from "./MTZPJQMC-C9lHSyrL.mjs";
-var Ue = ue(
-  [Qe, de],
-  [Ke, le]
-), Xe = Ue.useContext;
+import L, { createContext as ae, useMemo as ie, useCallback as ce, useRef as z, useEffect as Z, useState as K, Children as Pe, Fragment as Ce, cloneElement as Ee } from "react";
+import { u as $e } from "./use-viewport-m3glsbna.mjs";
+import { u as ye } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
+import j, { css as D, th as x, system as we } from "@xstyled/styled-components";
+import { C as le, a as de, d as ee, u as _e, e as Re } from "./P2CTZE2T-YPes1GXe.mjs";
+import { v as ue, A as Le, B as V, C as O, D as k, Q as te, d as g, g as p, H as ne, c as Q, _ as U, i as X, x as me, l as Ne, b as H, t as M, w as Be, f as Y, h as q, E as fe, aa as Oe, e as ke, r as Ae } from "./LVA2YJMS-qFC9J-lt.mjs";
+import { c as De, b as Ve, u as Fe, a as Me } from "./ITI7HKP4-BONrZ9Pq.mjs";
+import { e as je, f as ze } from "./VGCJ63VH-B39w1tBw.mjs";
+import { m as He, o as oe, s as A, d as y, g as We, c as Ke, a as be, b as se, u as F } from "./YV4JVR4I-BGfUf3Nu.mjs";
+import { forwardRef as G } from "./System.mjs";
+import { u as Qe } from "./VEVQD5MH-ZMnHV8ZJ.mjs";
+import { P as Ue, a as Xe } from "./MTZPJQMC-C0Xe_WK4.mjs";
+var Ye = ue(
+  [Xe, de],
+  [Ue, le]
+), qe = Ye.useContext;
 ae(!1);
 ae(null);
-function Ye(t = {}) {
-  var o = t, {
-    composite: n,
+function Ge(t = {}) {
+  var n = t, {
+    composite: o,
     combobox: e
-  } = o, s = _e(o, [
+  } = n, s = Le(n, [
     "composite",
     "combobox"
   ]);
@@ -37,11 +36,11 @@ function Ye(t = {}) {
     "focusLoop",
     "focusShift",
     "focusWrap"
-  ], m = Me(
+  ], m = He(
     s.store,
-    ne(n, r),
-    ne(e, r)
-  ), c = m == null ? void 0 : m.getState(), d = ke(A(k({}, s), {
+    oe(o, r),
+    oe(e, r)
+  ), c = m == null ? void 0 : m.getState(), d = De(V(k({}, s), {
     store: m,
     // We need to explicitly set the default value of `includesBaseElement` to
     // `false` since we don't want the composite store to default it to `true`
@@ -58,7 +57,7 @@ function Ye(t = {}) {
       "horizontal"
     ),
     focusLoop: O(s.focusLoop, c == null ? void 0 : c.focusLoop, !0)
-  })), a = De(), T = A(k({}, d.getState()), {
+  })), a = Ve(), T = V(k({}, d.getState()), {
     selectedId: O(
       s.selectedId,
       c == null ? void 0 : c.selectedId,
@@ -69,10 +68,10 @@ function Ye(t = {}) {
       c == null ? void 0 : c.selectOnMove,
       !0
     )
-  }), i = He(T, d, m);
-  D(
+  }), i = Ke(T, d, m);
+  A(
     i,
-    () => w(i, ["moves"], () => {
+    () => y(i, ["moves"], () => {
       const { activeId: u, selectOnMove: b } = i.getState();
       if (!b || !u) return;
       const I = d.item(u);
@@ -80,62 +79,62 @@ function Ye(t = {}) {
     })
   );
   let v = !0;
-  D(
+  A(
     i,
-    () => ze(i, ["selectedId"], (u, b) => {
+    () => We(i, ["selectedId"], (u, b) => {
       if (!v) {
         v = !0;
         return;
       }
-      n && u.selectedId === b.selectedId || i.setState("activeId", u.selectedId);
+      o && u.selectedId === b.selectedId || i.setState("activeId", u.selectedId);
     })
-  ), D(
+  ), A(
     i,
-    () => w(i, ["selectedId", "renderedItems"], (u) => {
+    () => y(i, ["selectedId", "renderedItems"], (u) => {
       if (u.selectedId !== void 0) return;
       const { activeId: b, renderedItems: I } = i.getState(), S = d.item(b);
       if (S && !S.disabled && !S.dimmed)
         i.setState("selectedId", S.id);
       else {
         const E = I.find(
-          (C) => !C.disabled && !C.dimmed
+          (P) => !P.disabled && !P.dimmed
         );
         i.setState("selectedId", E == null ? void 0 : E.id);
       }
     })
-  ), D(
+  ), A(
     i,
-    () => w(i, ["renderedItems"], (u) => {
+    () => y(i, ["renderedItems"], (u) => {
       const b = u.renderedItems;
       if (b.length)
-        return w(a, ["renderedItems"], (I) => {
+        return y(a, ["renderedItems"], (I) => {
           const S = I.renderedItems;
-          S.some((C) => !C.tabId) && S.forEach((C, _) => {
-            if (C.tabId) return;
+          S.some((P) => !P.tabId) && S.forEach((P, _) => {
+            if (P.tabId) return;
             const N = b[_];
-            N && a.renderItem(A(k({}, C), { tabId: N.id }));
+            N && a.renderItem(V(k({}, P), { tabId: N.id }));
           });
         });
     })
   );
   let h = null;
-  return D(i, () => {
+  return A(i, () => {
     const u = () => {
       h = i.getState().selectedId;
     }, b = () => {
       v = !1, i.setState("selectedId", h);
     };
-    if (n && "setSelectElement" in n)
+    if (o && "setSelectElement" in o)
       return te(
-        w(n, ["value"], u),
-        w(n, ["mounted"], b)
+        y(o, ["value"], u),
+        y(o, ["mounted"], b)
       );
     if (e)
       return te(
-        w(e, ["selectedValue"], u),
-        w(e, ["mounted"], b)
+        y(e, ["selectedValue"], u),
+        y(e, ["mounted"], b)
       );
-  }), A(k(k({}, d), i), {
+  }), V(k(k({}, d), i), {
     panels: a,
     setSelectedId: (u) => i.setState("selectedId", u),
     select: (u) => {
@@ -143,54 +142,54 @@ function Ye(t = {}) {
     }
   });
 }
-function qe(t, o, n) {
-  oe(o, [n.composite, n.combobox]), t = Ve(t, o, n), se(t, n, "selectedId", "setSelectedId"), se(t, n, "selectOnMove");
+function Je(t, n, o) {
+  ne(n, [o.composite, o.combobox]), t = Fe(t, n, o), se(t, o, "selectedId", "setSelectedId"), se(t, o, "selectOnMove");
   const [e, s] = be(() => t.panels, {});
-  return oe(s, [t, s]), Object.assign(
+  return ne(s, [t, s]), Object.assign(
     ie(() => g(p({}, t), { panels: e }), [t, e]),
-    { composite: n.composite, combobox: n.combobox }
+    { composite: o.composite, combobox: o.combobox }
   );
 }
-function Ge(t = {}) {
-  const o = We(), n = Xe() || o;
+function Ze(t = {}) {
+  const n = Qe(), o = qe() || n;
   t = g(p({}, t), {
-    composite: t.composite !== void 0 ? t.composite : n,
-    combobox: t.combobox !== void 0 ? t.combobox : o
+    composite: t.composite !== void 0 ? t.composite : o,
+    combobox: t.combobox !== void 0 ? t.combobox : n
   });
-  const [e, s] = be(Ye, t);
-  return qe(e, s, t);
+  const [e, s] = be(Ge, t);
+  return Je(e, s, t);
 }
-var G = ue(
+var J = ue(
   [de],
   [le]
-), Je = G.useScopedContext, pe = G.useProviderContext, ve = G.ScopedContextProvider, Ze = "button", et = Q(function(o) {
-  var n = o, {
+), et = J.useScopedContext, pe = J.useProviderContext, ve = J.ScopedContextProvider, tt = "button", nt = Q(function(n) {
+  var o = n, {
     store: e,
     getItem: s
-  } = n, r = U(n, [
+  } = o, r = U(o, [
     "store",
     "getItem"
   ]), m;
-  const c = Je();
+  const c = et();
   e = e || c, X(
     e,
     process.env.NODE_ENV !== "production" && "Tab must be wrapped in a TabList component."
   );
-  const d = me(), a = r.id || d, T = Re(r), i = ce(
+  const d = me(), a = r.id || d, T = Ne(r), i = ce(
     (f) => {
-      const y = g(p({}, f), { dimmed: T });
-      return s ? s(y) : y;
+      const w = g(p({}, f), { dimmed: T });
+      return s ? s(w) : w;
     },
     [T, s]
   ), v = r.onClick, h = H((f) => {
     v == null || v(f), !f.defaultPrevented && (e == null || e.setSelectedId(a));
   }), u = e.panels.useState(
     (f) => {
-      var y;
-      return (y = f.items.find((l) => l.tabId === a)) == null ? void 0 : y.id;
+      var w;
+      return (w = f.items.find((l) => l.tabId === a)) == null ? void 0 : w.id;
     }
-  ), b = d ? r.shouldRegisterItem : !1, I = e.useState((f) => !!a && f.activeId === a), S = e.useState((f) => !!a && f.selectedId === a), E = e.useState((f) => !!e.item(f.activeId)), C = I || S && !E, _ = S || ((m = r.accessibleWhenDisabled) != null ? m : !0);
-  if (j(
+  ), b = d ? r.shouldRegisterItem : !1, I = e.useState((f) => !!a && f.activeId === a), S = e.useState((f) => !!a && f.selectedId === a), E = e.useState((f) => !!e.item(f.activeId)), P = I || S && !E, _ = S || ((m = r.accessibleWhenDisabled) != null ? m : !0);
+  if (F(
     e.combobox || e.composite,
     "virtualFocus"
   ) && (r = g(p({}, r), {
@@ -207,34 +206,34 @@ var G = ue(
       id: a,
       accessibleWhenDisabled: _,
       store: e.composite,
-      shouldRegisterItem: C && b,
+      shouldRegisterItem: P && b,
       rowId: r.rowId,
       render: r.render
     };
     r = g(p({}, r), {
-      render: /* @__PURE__ */ F.jsx(
+      render: /* @__PURE__ */ M.jsx(
         ee,
         g(p({}, f), {
-          render: e.combobox && e.composite !== e.combobox ? /* @__PURE__ */ F.jsx(ee, g(p({}, f), { store: e.combobox })) : f.render
+          render: e.combobox && e.composite !== e.combobox ? /* @__PURE__ */ M.jsx(ee, g(p({}, f), { store: e.combobox })) : f.render
         })
       )
     });
   }
-  return r = we(g(p({
+  return r = _e(g(p({
     store: e
   }, r), {
     accessibleWhenDisabled: _,
     getItem: i,
     shouldRegisterItem: b
   })), r;
-}), tt = Le(
-  Y(function(o) {
-    const n = et(o);
-    return q(Ze, n);
+}), ot = Be(
+  Y(function(n) {
+    const o = nt(n);
+    return q(tt, o);
   })
-), ot = "div", nt = Q(
-  function(o) {
-    var n = o, { store: e } = n, s = U(n, ["store"]);
+), st = "div", rt = Q(
+  function(n) {
+    var o = n, { store: e } = o, s = U(o, ["store"]);
     const r = pe();
     e = e || r, X(
       e,
@@ -245,28 +244,28 @@ var G = ue(
     );
     return s = fe(
       s,
-      (c) => /* @__PURE__ */ F.jsx(ve, { value: e, children: c }),
+      (c) => /* @__PURE__ */ M.jsx(ve, { value: e, children: c }),
       [e]
     ), e.composite && (s = p({
       focusable: !1
     }, s)), s = p({
       role: "tablist",
       "aria-orientation": m
-    }, s), s = Ae(p({ store: e }, s)), s;
+    }, s), s = Me(p({ store: e }, s)), s;
   }
-), st = Y(function(o) {
-  const n = nt(o);
-  return q(ot, n);
-}), rt = "div", at = Q(
-  function(o) {
-    var n = o, {
+), at = Y(function(n) {
+  const o = rt(n);
+  return q(st, o);
+}), it = "div", ct = Q(
+  function(n) {
+    var o = n, {
       store: e,
       unmountOnHide: s,
       tabId: r,
       getItem: m,
       scrollRestoration: c,
       scrollElement: d
-    } = n, a = U(n, [
+    } = o, a = U(o, [
       "store",
       "unmountOnHide",
       "tabId",
@@ -279,48 +278,48 @@ var G = ue(
       e,
       process.env.NODE_ENV !== "production" && "TabPanel must receive a `store` prop or be wrapped in a TabProvider component."
     );
-    const i = z(null), v = me(a.id), h = j(
+    const i = z(null), v = me(a.id), h = F(
       e.panels,
       () => {
         var l;
         return r || ((l = e == null ? void 0 : e.panels.item(v)) == null ? void 0 : l.tabId);
       }
-    ), u = j(
+    ), u = F(
       e,
       (l) => !!h && l.selectedId === h
-    ), b = je({ open: u }), I = j(b, "mounted"), S = z(
+    ), b = je({ open: u }), I = F(b, "mounted"), S = z(
       /* @__PURE__ */ new Map()
     ), E = H(() => {
       const l = i.current;
       return l ? d ? typeof d == "function" ? d(l) : "current" in d ? d.current : d : l : null;
     });
-    J(() => {
+    Z(() => {
       var l, $;
       if (!c || !I) return;
-      const P = E();
-      if (!P) return;
+      const C = E();
+      if (!C) return;
       if (c === "reset") {
-        P.scroll(0, 0);
+        C.scroll(0, 0);
         return;
       }
       if (!h) return;
       const R = S.current.get(h);
-      P.scroll((l = R == null ? void 0 : R.x) != null ? l : 0, ($ = R == null ? void 0 : R.y) != null ? $ : 0);
+      C.scroll((l = R == null ? void 0 : R.x) != null ? l : 0, ($ = R == null ? void 0 : R.y) != null ? $ : 0);
       const B = () => {
         S.current.set(h, {
-          x: P.scrollLeft,
-          y: P.scrollTop
+          x: C.scrollLeft,
+          y: C.scrollTop
         });
       };
-      return P.addEventListener("scroll", B), () => {
-        P.removeEventListener("scroll", B);
+      return C.addEventListener("scroll", B), () => {
+        C.removeEventListener("scroll", B);
       };
     }, [c, I, h, E, e]);
-    const [C, _] = W(!1);
-    J(() => {
+    const [P, _] = K(!1);
+    Z(() => {
       const l = i.current;
       if (!l) return;
-      const $ = Ne(l);
+      const $ = Oe(l);
       _(!!$.length);
     }, []);
     const N = ce(
@@ -329,21 +328,21 @@ var G = ue(
         return m ? m($) : $;
       },
       [v, r, m]
-    ), f = a.onKeyDown, y = H((l) => {
+    ), f = a.onKeyDown, w = H((l) => {
       if (f == null || f(l), l.defaultPrevented || !(e != null && e.composite)) return;
-      const P = {
+      const C = {
         ArrowLeft: e.previous,
         ArrowRight: e.next,
         Home: e.first,
         End: e.last
       }[l.key];
-      if (!P) return;
-      const { selectedId: R } = e.getState(), B = P({ activeId: R });
+      if (!C) return;
+      const { selectedId: R } = e.getState(), B = C({ activeId: R });
       B && (l.preventDefault(), e.move(B));
     });
     return a = fe(
       a,
-      (l) => /* @__PURE__ */ F.jsx(ve, { value: e, children: l }),
+      (l) => /* @__PURE__ */ M.jsx(ve, { value: e, children: l }),
       [e]
     ), a = g(p({
       id: v,
@@ -351,28 +350,34 @@ var G = ue(
       "aria-labelledby": h || void 0
     }, a), {
       children: s && !I ? null : a.children,
-      ref: Be(i, a.ref),
-      onKeyDown: y
-    }), a = Oe(p({
+      ref: ke(i, a.ref),
+      onKeyDown: w
+    }), a = Ae(p({
       // If the tab panel is rendered as part of another composite widget such
       // as combobox, it should not be focusable.
-      focusable: !e.composite && !C
-    }, a)), a = Fe(p({ store: b }, a)), a = ye(g(p({ store: e.panels }, a), { getItem: N })), a;
+      focusable: !e.composite && !P
+    }, a)), a = ze(p({ store: b }, a)), a = Re(g(p({ store: e.panels }, a), { getItem: N })), a;
   }
-), it = Y(function(o) {
-  const n = at(o);
-  return q(rt, n);
+), lt = Y(function(n) {
+  const o = ct(n);
+  return q(it, o);
 });
-function re(t, o) {
-  typeof t == "function" ? t(o) : t && (t.current = o);
+function W(t) {
+  var n = Pe.toArray(t);
+  return n.reduce(function(o, e) {
+    return e.type === Ce ? o.concat(W(e.props.children)) : (o.push(e), o);
+  }, []);
+}
+function re(t, n) {
+  typeof t == "function" ? t(n) : t && (t.current = n);
 }
-function ct(t, o) {
-  return ie(() => t == null && o == null ? null : (n) => {
-    re(t, n), re(o, n);
-  }, [t, o]);
+function dt(t, n) {
+  return ie(() => t == null && n == null ? null : (o) => {
+    re(t, o), re(n, o);
+  }, [t, n]);
 }
-const lt = M(st)(
-  ({ size: t }) => V`
+const ut = j(at)(
+  ({ size: t }) => D`
     position: relative;
     width: 100%;
     overflow-x: auto;
@@ -390,9 +395,9 @@ const lt = M(st)(
     ${Ie} {
       ${x(`tabs.item.size.${t}`)}
     }
-    ${$e};
+    ${we};
   `
-), Ie = M.button`
+), Ie = j.button`
   border: 0;
   background: none;
   ${x("tabs.item.default")};
@@ -434,101 +439,101 @@ const lt = M(st)(
   & > span {
     ${x("tabs.badge")};
   }
-`, dt = M(it)(
-  ({ orientation: t }) => V`
+`, mt = j(lt)(
+  ({ orientation: t }) => D`
     ${t === "vertical" ? x("tabs.panel.vertical") : x("tabs.panel.horizontal")};
   `
-), ut = ({ offset: t = 0, size: o = 0 }) => V`
+), ft = ({ offset: t = 0, size: n = 0 }) => D`
   ${x("tabs.activeBar.horizontal")};
   left: 0;
   bottom: 0;
-  width: ${o}px;
+  width: ${n}px;
   transform: translateX(${t}px);
-`, mt = ({ offset: t = 0, size: o = 0 }) => V`
+`, bt = ({ offset: t = 0, size: n = 0 }) => D`
   ${x("tabs.activeBar.vertical")};
   right: 0;
   top: 0;
-  height: ${o}px;
+  height: ${n}px;
   transform: translateY(${t}px);
-`, ft = M.span(
-  ({ orientation: t, ...o }) => V`
+`, pt = j.span(
+  ({ orientation: t, ...n }) => D`
     position: absolute;
-    ${t === "vertical" ? mt(o) : ut(o)}
+    ${t === "vertical" ? bt(n) : ft(n)}
     will-change: width, transform;
     transition: medium;
     transition-property: transform, width;
   `
 ), Se = (t) => {
   if (!t || typeof window > "u") return 1;
-  const o = Number(window.getComputedStyle(t).scale);
-  return isNaN(o) ? Se(t.parentElement) : o;
+  const n = Number(window.getComputedStyle(t).scale);
+  return isNaN(n) ? Se(t.parentElement) : n;
 };
-function bt(t, o, n) {
-  const [e, s] = W({}), { height: r, width: m } = Pe();
-  return Ee(() => {
+function vt(t, n, o) {
+  const [e, s] = K({}), { height: r, width: m } = $e();
+  return ye(() => {
     const c = t.current;
-    if (!c || !o) return;
-    const d = c.getBoundingClientRect(), a = o.getBoundingClientRect(), T = Se(c);
-    if (n === "vertical") {
+    if (!c || !n) return;
+    const d = c.getBoundingClientRect(), a = n.getBoundingClientRect(), T = Se(c);
+    if (o === "vertical") {
       const i = a.top - d.top, v = a.height;
       s({
         size: v,
         offset: i,
-        orientation: n
+        orientation: o
       });
     } else {
       const i = (a.left - d.left + c.scrollLeft) / T, v = a.width / T;
       s({
         size: isNaN(v) ? 0 : v,
         offset: isNaN(i) ? 0 : i,
-        orientation: n
+        orientation: o
       });
     }
-  }, [t, o, m, r, n]), e;
+  }, [t, n, m, r, o]), e;
 }
-const xe = ({ activeTab: t, listRef: o, orientation: n }) => {
-  const e = bt(o, t, n);
-  return /* @__PURE__ */ L.createElement(ft, { ...e });
+const xe = ({ activeTab: t, listRef: n, orientation: o }) => {
+  const e = vt(n, t, o);
+  return /* @__PURE__ */ L.createElement(pt, { ...e });
 };
 xe.displayName = "ActiveBar";
-const pt = Z.default || Z;
-function vt(t, o) {
-  const [n, e] = W(null);
-  return [pt(o).map((r) => r.props.id === t ? Ce(r, { ref: e }) : r), n];
+const It = W.default || W;
+function St(t, n) {
+  const [o, e] = K(null);
+  return [It(n).map((r) => r.props.id === t ? Ee(r, { ref: e }) : r), o];
 }
-const he = K(
-  ({ children: t, size: o = "md", store: n, ...e }, s) => {
-    const r = z(), m = ct(s, r), { orientation: c, selectedId: d } = n.useState(), [a, T] = vt(d, t);
-    return /* @__PURE__ */ L.createElement(lt, { orientation: c, ref: m, size: o, store: n, ...e }, a, a.length > 1 && /* @__PURE__ */ L.createElement(xe, { activeTab: T, listRef: r, orientation: c }));
+const he = G(
+  ({ children: t, size: n = "md", store: o, ...e }, s) => {
+    const r = z(), m = dt(s, r), { orientation: c, selectedId: d } = o.useState(), [a, T] = St(d, t);
+    return /* @__PURE__ */ L.createElement(ut, { orientation: c, ref: m, size: n, store: o, ...e }, a, a.length > 1 && /* @__PURE__ */ L.createElement(xe, { activeTab: T, listRef: r, orientation: c }));
   }
 );
 he.displayName = "TabList";
-const ge = K(
-  ({ children: t, store: o, tabId: n, ...e }, s) => {
-    const r = o.useState("orientation");
-    return /* @__PURE__ */ L.createElement(dt, { orientation: r, ref: s, store: o, tabId: n, ...e }, t);
+const ge = G(
+  ({ children: t, store: n, tabId: o, ...e }, s) => {
+    const r = n.useState("orientation");
+    return /* @__PURE__ */ L.createElement(mt, { orientation: r, ref: s, store: n, tabId: o, ...e }, t);
   }
 );
 ge.displayName = "TabPanel";
-const Te = K(
-  ({ as: t, children: o, id: n, store: e, ...s }, r) => /* @__PURE__ */ L.createElement(
-    tt,
+const Te = G(
+  ({ as: t, children: n, id: o, store: e, ...s }, r) => /* @__PURE__ */ L.createElement(
+    ot,
     {
-      id: n,
+      id: o,
       render: (m) => /* @__PURE__ */ L.createElement(Ie, { as: t, ...m, ref: r }),
       store: e,
       ...s
     },
-    o
+    n
   )
 );
 Te.displayName = "Tab";
-const Rt = Object.assign(Te, { List: he, Panel: ge });
-function Lt(t) {
-  return Ge(t);
+const Lt = Object.assign(Te, { List: he, Panel: ge });
+function Nt(t) {
+  return Ze(t);
 }
 export {
-  Rt as Tab,
+  Lt as Tab,
   Te as TabComponent,
-  Lt as useTab
+  Nt as useTab
 };

package/dist/Tag.js

@@ -1,4 +1,4 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),v=require("./Icon.js"),S=require("./index-C1FV1q-F.js"),w=require("./System.js"),q=require("./wrap-children-BLDjJiiy.js"),t=require("@xstyled/styled-components"),d=require("./overflow-ellipsis-C2ESrF8C.js"),h=require("./get-max-width-height-CDLBnp_J.js"),C=(s,e,n)=>t.css`
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),v=require("./wrap-children-BLDjJiiy.js"),t=require("@xstyled/styled-components"),d=require("./overflow-ellipsis-C2ESrF8C.js"),h=require("./get-max-width-height-CDLBnp_J.js"),S=require("./Icon.js"),w=require("./System.js"),q=require("./index-C1FV1q-F.js"),C=(s,e,n)=>t.css`
   ${t.th(`tags.shape.${s}`)}
   padding: 0;
   ${(e||n)&&t.css`
@@ -53,7 +53,7 @@
     }
 
     > *:not(:only-child) {
-      ${v.StyledIcon}:last-child {
+      ${S.StyledIcon}:last-child {
         opacity: 1;
         transition: opacity ${t.th.transition("medium")};
         cursor: pointer;
@@ -75,4 +75,4 @@
   `),E=t.buttonBox`
   all: unset;
   display: flex;
-`,u=w.forwardRef(({as:s,children:e,dataTestId:n,href:r,onClick:o,onRemove:i,size:a="md",to:c,variant:p="default",...$},y)=>{const m=q.wrapChildren(e),f=!!(e||e===0)&&["number","string"].includes(typeof e)?e.toString().length:void 0,x=!!r||!!c;return l.createElement(g,{as:s,"data-testid":n,hasClickAction:!!o,hasLink:x,hasRemoveAction:!!i,href:r,length:f,onClick:o,ref:y,size:a,to:c,variant:p,...$},m,!!i&&l.createElement(b,{size:a},l.createElement(E,{onClick:i,title:"Remove",type:"button"},l.createElement(S.CrossIcon,{size:"xs",title:"Remove"}))))});u.displayName="Tag";const T=g;exports.StyledTag=T;exports.Tag=u;
+`,u=w.forwardRef(({as:s,children:e,dataTestId:n,href:r,onClick:o,onRemove:i,size:a="md",to:c,variant:p="default",...$},y)=>{const m=v.wrapChildren(e),f=!!(e||e===0)&&["number","string"].includes(typeof e)?e.toString().length:void 0,x=!!r||!!c;return l.createElement(g,{as:s,"data-testid":n,hasClickAction:!!o,hasLink:x,hasRemoveAction:!!i,href:r,length:f,onClick:o,ref:y,size:a,to:c,variant:p,...$},m,!!i&&l.createElement(b,{size:a},l.createElement(E,{onClick:i,title:"Remove",type:"button"},l.createElement(q.CrossIcon,{size:"xs",title:"Remove"}))))});u.displayName="Tag";const T=g;exports.StyledTag=T;exports.Tag=u;