welcome-ui 8.0.0 → 8.0.3

package/dist/Tabs.mjs

@@ -1,17 +1,17 @@
 "use client";
 import L, { createContext as re, useMemo as ge, useCallback as ae, useRef as z, useEffect as Z, useState as K, Children as Te, Fragment as Pe, cloneElement as Ce } from "react";
 import { u as Ee } from "./use-fork-ref-CUZErtAC.mjs";
-import { u as $e } from "./use-viewport-m3glsbna.mjs";
+import { u as $e } from "./use-viewport-CfklieD-.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 ie, a as ce, d as ee, u as _e, e as Re } from "./P2CTZE2T-YPes1GXe.mjs";
-import { v as le, A as Le, B as V, C as A, D as O, Q as te, d as g, g as p, H as oe, c as Q, _ as U, i as X, x as de, l as Ne, b as H, t as M, w as Be, f as Y, h as q, E as ue, aa as Ae, e as Oe, r as ke } 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 ne, s as k, d as y, g as We, c as Ke, a as me, b as se, u as F } from "./YV4JVR4I-BGfUf3Nu.mjs";
+import j, { th as x, system as we, css as D } from "@xstyled/styled-components";
+import { C as ie, a as ce, d as ee, u as _e, e as Re } from "./P2CTZE2T-Cl2w7OLV.mjs";
+import { v as le, A as Le, B as V, C as A, D as O, Q as te, d as g, g as p, H as oe, w as Ne, f as Q, c as U, h as X, _ as Y, i as q, x as de, l as Be, b as H, t as M, E as ue, aa as Ae, e as Oe, m as ke } from "./LVA2YJMS-DDEmK0pp.mjs";
+import { c as De, b as Ve, u as Fe, a as Me } from "./ITI7HKP4-EL9KXYBU.mjs";
+import { e as je, f as ze } from "./VGCJ63VH-BMzoZtCu.mjs";
+import { m as He, o as se, c as We, s as k, d as y, g as Ke, a as me, b as ne, u as F } from "./YV4JVR4I-Bh7B7TET.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";
+import { u as Qe } from "./VEVQD5MH-CuegL0m0.mjs";
+import { P as Ue, a as Xe } from "./MTZPJQMC-CMjAwC0N.mjs";
 var Ye = le(
   [Xe, ce],
   [Ue, ie]
@@ -19,10 +19,10 @@ var Ye = le(
 re(!1);
 re(null);
 function Ge(t = {}) {
-  var n = t, {
+  var s = t, {
     composite: o,
     combobox: e
-  } = n, s = Le(n, [
+  } = s, n = Le(s, [
     "composite",
     "combobox"
   ]);
@@ -38,43 +38,43 @@ function Ge(t = {}) {
     "focusShift",
     "focusWrap"
   ], m = He(
-    s.store,
-    ne(o, r),
-    ne(e, r)
-  ), c = m == null ? void 0 : m.getState(), d = De(V(O({}, s), {
+    n.store,
+    se(o, r),
+    se(e, r)
+  ), c = m == null ? void 0 : m.getState(), d = De(V(O({}, n), {
     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`
     // when the activeId state is null, which could be the case when rendering
     // combobox with tab.
     includesBaseElement: A(
-      s.includesBaseElement,
+      n.includesBaseElement,
       c == null ? void 0 : c.includesBaseElement,
       !1
     ),
     orientation: A(
-      s.orientation,
+      n.orientation,
       c == null ? void 0 : c.orientation,
       "horizontal"
     ),
-    focusLoop: A(s.focusLoop, c == null ? void 0 : c.focusLoop, !0)
+    focusLoop: A(n.focusLoop, c == null ? void 0 : c.focusLoop, !0)
   })), a = Ve(), T = V(O({}, d.getState()), {
     selectedId: A(
-      s.selectedId,
+      n.selectedId,
       c == null ? void 0 : c.selectedId,
-      s.defaultSelectedId
+      n.defaultSelectedId
     ),
     selectOnMove: A(
-      s.selectOnMove,
+      n.selectOnMove,
       c == null ? void 0 : c.selectOnMove,
       !0
     )
-  }), i = Ke(T, d, m);
+  }), i = We(T, d, m);
   k(
     i,
     () => y(i, ["moves"], () => {
-      const { activeId: u, selectOnMove: b } = i.getState();
-      if (!b || !u) return;
+      const { activeId: u, selectOnMove: f } = i.getState();
+      if (!f || !u) return;
       const I = d.item(u);
       I && (I.dimmed || I.disabled || i.setState("selectedId", I.id));
     })
@@ -82,18 +82,18 @@ function Ge(t = {}) {
   let v = !0;
   k(
     i,
-    () => We(i, ["selectedId"], (u, b) => {
+    () => Ke(i, ["selectedId"], (u, f) => {
       if (!v) {
         v = !0;
         return;
       }
-      o && u.selectedId === b.selectedId || i.setState("activeId", u.selectedId);
+      o && u.selectedId === f.selectedId || i.setState("activeId", u.selectedId);
     })
   ), k(
     i,
     () => y(i, ["selectedId", "renderedItems"], (u) => {
       if (u.selectedId !== void 0) return;
-      const { activeId: b, renderedItems: I } = i.getState(), S = d.item(b);
+      const { activeId: f, renderedItems: I } = i.getState(), S = d.item(f);
       if (S && !S.disabled && !S.dimmed)
         i.setState("selectedId", S.id);
       else {
@@ -106,13 +106,13 @@ function Ge(t = {}) {
   ), k(
     i,
     () => y(i, ["renderedItems"], (u) => {
-      const b = u.renderedItems;
-      if (b.length)
+      const f = u.renderedItems;
+      if (f.length)
         return y(a, ["renderedItems"], (I) => {
           const S = I.renderedItems;
           S.some((P) => !P.tabId) && S.forEach((P, _) => {
             if (P.tabId) return;
-            const N = b[_];
+            const N = f[_];
             N && a.renderItem(V(O({}, P), { tabId: N.id }));
           });
         });
@@ -122,18 +122,18 @@ function Ge(t = {}) {
   return k(i, () => {
     const u = () => {
       h = i.getState().selectedId;
-    }, b = () => {
+    }, f = () => {
       v = !1, i.setState("selectedId", h);
     };
     if (o && "setSelectElement" in o)
       return te(
         y(o, ["value"], u),
-        y(o, ["mounted"], b)
+        y(o, ["mounted"], f)
       );
     if (e)
       return te(
         y(e, ["selectedValue"], u),
-        y(e, ["mounted"], b)
+        y(e, ["mounted"], f)
       );
   }), V(O(O({}, d), i), {
     panels: a,
@@ -143,53 +143,53 @@ function Ge(t = {}) {
     }
   });
 }
-function Je(t, n, o) {
-  oe(n, [o.composite, o.combobox]), t = Fe(t, n, o), se(t, o, "selectedId", "setSelectedId"), se(t, o, "selectOnMove");
-  const [e, s] = me(() => t.panels, {});
-  return oe(s, [t, s]), Object.assign(
+function Je(t, s, o) {
+  oe(s, [o.composite, o.combobox]), t = Fe(t, s, o), ne(t, o, "selectedId", "setSelectedId"), ne(t, o, "selectOnMove");
+  const [e, n] = me(() => t.panels, {});
+  return oe(n, [t, n]), Object.assign(
     ge(() => g(p({}, t), { panels: e }), [t, e]),
     { composite: o.composite, combobox: o.combobox }
   );
 }
 function Ze(t = {}) {
-  const n = Qe(), o = qe() || n;
+  const s = Qe(), o = qe() || s;
   t = g(p({}, t), {
     composite: t.composite !== void 0 ? t.composite : o,
-    combobox: t.combobox !== void 0 ? t.combobox : n
+    combobox: t.combobox !== void 0 ? t.combobox : s
   });
-  const [e, s] = me(Ge, t);
-  return Je(e, s, t);
+  const [e, n] = me(Ge, t);
+  return Je(e, n, t);
 }
 var J = le(
   [ce],
   [ie]
-), et = J.useScopedContext, fe = J.useProviderContext, be = J.ScopedContextProvider, tt = "button", ot = Q(function(n) {
-  var o = n, {
+), et = J.useScopedContext, be = J.useProviderContext, fe = J.ScopedContextProvider, tt = "button", ot = U(function(s) {
+  var o = s, {
     store: e,
-    getItem: s
-  } = o, r = U(o, [
+    getItem: n
+  } = o, r = Y(o, [
     "store",
     "getItem"
   ]), m;
   const c = et();
-  e = e || c, X(
+  e = e || c, q(
     e,
     process.env.NODE_ENV !== "production" && "Tab must be wrapped in a TabList component."
   );
-  const d = de(), a = r.id || d, T = Ne(r), i = ae(
-    (f) => {
-      const w = g(p({}, f), { dimmed: T });
-      return s ? s(w) : w;
+  const d = de(), a = r.id || d, T = Be(r), i = ae(
+    (b) => {
+      const w = g(p({}, b), { dimmed: T });
+      return n ? n(w) : w;
     },
-    [T, s]
-  ), v = r.onClick, h = H((f) => {
-    v == null || v(f), !f.defaultPrevented && (e == null || e.setSelectedId(a));
+    [T, n]
+  ), v = r.onClick, h = H((b) => {
+    v == null || v(b), !b.defaultPrevented && (e == null || e.setSelectedId(a));
   }), u = e.panels.useState(
-    (f) => {
+    (b) => {
       var w;
-      return (w = f.items.find((l) => l.tabId === a)) == null ? void 0 : w.id;
+      return (w = b.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)), P = I || S && !E, _ = S || ((m = r.accessibleWhenDisabled) != null ? m : !0);
+  ), f = d ? r.shouldRegisterItem : !1, I = e.useState((b) => !!a && b.activeId === a), S = e.useState((b) => !!a && b.selectedId === a), E = e.useState((b) => !!e.item(b.activeId)), P = I || S && !E, _ = S || ((m = r.accessibleWhenDisabled) != null ? m : !0);
   if (F(
     e.combobox || e.composite,
     "virtualFocus"
@@ -203,19 +203,19 @@ var J = le(
   }, r), {
     onClick: h
   }), e.composite) {
-    const f = {
+    const b = {
       id: a,
       accessibleWhenDisabled: _,
       store: e.composite,
-      shouldRegisterItem: P && b,
+      shouldRegisterItem: P && f,
       rowId: r.rowId,
       render: r.render
     };
     r = g(p({}, r), {
       render: /* @__PURE__ */ M.jsx(
         ee,
-        g(p({}, f), {
-          render: e.combobox && e.composite !== e.combobox ? /* @__PURE__ */ M.jsx(ee, g(p({}, f), { store: e.combobox })) : f.render
+        g(p({}, b), {
+          render: e.combobox && e.composite !== e.combobox ? /* @__PURE__ */ M.jsx(ee, g(p({}, b), { store: e.combobox })) : b.render
         })
       )
     });
@@ -225,48 +225,48 @@ var J = le(
   }, r), {
     accessibleWhenDisabled: _,
     getItem: i,
-    shouldRegisterItem: b
+    shouldRegisterItem: f
   })), r;
-}), nt = Be(
-  Y(function(n) {
-    const o = ot(n);
-    return q(tt, o);
+}), st = Ne(
+  Q(function(s) {
+    const o = ot(s);
+    return X(tt, o);
   })
-), st = "div", rt = Q(
-  function(n) {
-    var o = n, { store: e } = o, s = U(o, ["store"]);
-    const r = fe();
-    e = e || r, X(
+), nt = "div", rt = U(
+  function(s) {
+    var o = s, { store: e } = o, n = Y(o, ["store"]);
+    const r = be();
+    e = e || r, q(
       e,
       process.env.NODE_ENV !== "production" && "TabList must receive a `store` prop or be wrapped in a TabProvider component."
     );
     const m = e.useState(
       (c) => c.orientation === "both" ? void 0 : c.orientation
     );
-    return s = ue(
-      s,
-      (c) => /* @__PURE__ */ M.jsx(be, { value: e, children: c }),
+    return n = ue(
+      n,
+      (c) => /* @__PURE__ */ M.jsx(fe, { value: e, children: c }),
       [e]
-    ), e.composite && (s = p({
+    ), e.composite && (n = p({
       focusable: !1
-    }, s)), s = p({
+    }, n)), n = p({
       role: "tablist",
       "aria-orientation": m
-    }, s), s = Me(p({ store: e }, s)), s;
+    }, n), n = Me(p({ store: e }, n)), n;
   }
-), at = Y(function(n) {
-  const o = rt(n);
-  return q(st, o);
-}), it = "div", ct = Q(
-  function(n) {
-    var o = n, {
+), at = Q(function(s) {
+  const o = rt(s);
+  return X(nt, o);
+}), it = "div", ct = U(
+  function(s) {
+    var o = s, {
       store: e,
-      unmountOnHide: s,
+      unmountOnHide: n,
       tabId: r,
       getItem: m,
       scrollRestoration: c,
       scrollElement: d
-    } = o, a = U(o, [
+    } = o, a = Y(o, [
       "store",
       "unmountOnHide",
       "tabId",
@@ -274,8 +274,8 @@ var J = le(
       "scrollRestoration",
       "scrollElement"
     ]);
-    const T = fe();
-    e = e || T, X(
+    const T = be();
+    e = e || T, q(
       e,
       process.env.NODE_ENV !== "production" && "TabPanel must receive a `store` prop or be wrapped in a TabProvider component."
     );
@@ -288,7 +288,7 @@ var J = le(
     ), u = F(
       e,
       (l) => !!h && l.selectedId === h
-    ), b = je({ open: u }), I = F(b, "mounted"), S = z(
+    ), f = je({ open: u }), I = F(f, "mounted"), S = z(
       /* @__PURE__ */ new Map()
     ), E = H(() => {
       const l = i.current;
@@ -329,8 +329,8 @@ var J = le(
         return m ? m($) : $;
       },
       [v, r, m]
-    ), f = a.onKeyDown, w = H((l) => {
-      if (f == null || f(l), l.defaultPrevented || !(e != null && e.composite)) return;
+    ), b = a.onKeyDown, w = H((l) => {
+      if (b == null || b(l), l.defaultPrevented || !(e != null && e.composite)) return;
       const C = {
         ArrowLeft: e.previous,
         ArrowRight: e.next,
@@ -343,29 +343,29 @@ var J = le(
     });
     return a = ue(
       a,
-      (l) => /* @__PURE__ */ M.jsx(be, { value: e, children: l }),
+      (l) => /* @__PURE__ */ M.jsx(fe, { value: e, children: l }),
       [e]
     ), a = g(p({
       id: v,
       role: "tabpanel",
       "aria-labelledby": h || void 0
     }, a), {
-      children: s && !I ? null : a.children,
+      children: n && !I ? null : a.children,
       ref: Oe(i, a.ref),
       onKeyDown: w
     }), a = ke(p({
       // If the tab panel is rendered as part of another composite widget such
       // as combobox, it should not be focusable.
       focusable: !e.composite && !P
-    }, a)), a = ze(p({ store: b }, a)), a = Re(g(p({ store: e.panels }, a), { getItem: N })), a;
+    }, a)), a = ze(p({ store: f }, a)), a = Re(g(p({ store: e.panels }, a), { getItem: N })), a;
   }
-), lt = Y(function(n) {
-  const o = ct(n);
-  return q(it, o);
+), lt = Q(function(s) {
+  const o = ct(s);
+  return X(it, o);
 });
 function W(t) {
-  var n = Te.toArray(t);
-  return n.reduce(function(o, e) {
+  var s = Te.toArray(t);
+  return s.reduce(function(o, e) {
     return e.type === Pe ? o.concat(W(e.props.children)) : (o.push(e), o);
   }, []);
 }
@@ -436,88 +436,88 @@ const dt = j(at)(
   ({ orientation: t }) => D`
     ${t === "vertical" ? x("tabs.panel.vertical") : x("tabs.panel.horizontal")};
   `
-), mt = ({ offset: t = 0, size: n = 0 }) => D`
+), mt = ({ offset: t = 0, size: s = 0 }) => D`
   ${x("tabs.activeBar.horizontal")};
   left: 0;
   bottom: 0;
-  width: ${n}px;
+  width: ${s}px;
   transform: translateX(${t}px);
-`, ft = ({ offset: t = 0, size: n = 0 }) => D`
+`, bt = ({ offset: t = 0, size: s = 0 }) => D`
   ${x("tabs.activeBar.vertical")};
   right: 0;
   top: 0;
-  height: ${n}px;
+  height: ${s}px;
   transform: translateY(${t}px);
-`, bt = j.span(
-  ({ orientation: t, ...n }) => D`
+`, ft = j.span(
+  ({ orientation: t, ...s }) => D`
     position: absolute;
-    ${t === "vertical" ? ft(n) : mt(n)}
+    ${t === "vertical" ? bt(s) : mt(s)}
     will-change: width, transform;
     transition: medium;
     transition-property: transform, width;
   `
 ), ve = (t) => {
   if (!t || typeof window > "u") return 1;
-  const n = Number(window.getComputedStyle(t).scale);
-  return isNaN(n) ? ve(t.parentElement) : n;
+  const s = Number(window.getComputedStyle(t).scale);
+  return isNaN(s) ? ve(t.parentElement) : s;
 };
-function pt(t, n, o) {
-  const [e, s] = K({}), { height: r, width: m } = $e();
+function pt(t, s, o) {
+  const [e, n] = K({}), { height: r, width: m } = $e();
   return ye(() => {
     const c = t.current;
-    if (!c || !n) return;
-    const d = c.getBoundingClientRect(), a = n.getBoundingClientRect(), T = ve(c);
+    if (!c || !s) return;
+    const d = c.getBoundingClientRect(), a = s.getBoundingClientRect(), T = ve(c);
     if (o === "vertical") {
       const i = a.top - d.top, v = a.height;
-      s({
+      n({
         size: v,
         offset: i,
         orientation: o
       });
     } else {
       const i = (a.left - d.left + c.scrollLeft) / T, v = a.width / T;
-      s({
+      n({
         size: isNaN(v) ? 0 : v,
         offset: isNaN(i) ? 0 : i,
         orientation: o
       });
     }
-  }, [t, n, m, r, o]), e;
+  }, [t, s, m, r, o]), e;
 }
-const Ie = ({ activeTab: t, listRef: n, orientation: o }) => {
-  const e = pt(n, t, o);
-  return /* @__PURE__ */ L.createElement(bt, { ...e });
+const Ie = ({ activeTab: t, listRef: s, orientation: o }) => {
+  const e = pt(s, t, o);
+  return /* @__PURE__ */ L.createElement(ft, { ...e });
 };
 Ie.displayName = "ActiveBar";
 const vt = W.default || W;
-function It(t, n) {
+function It(t, s) {
   const [o, e] = K(null);
-  return [vt(n).map((r) => r.props.id === t ? Ce(r, { ref: e }) : r), o];
+  return [vt(s).map((r) => r.props.id === t ? Ce(r, { ref: e }) : r), o];
 }
 const Se = G(
-  ({ children: t, size: n = "md", store: o, ...e }, s) => {
-    const r = z(), m = Ee(s, r), { orientation: c, selectedId: d } = o.useState(), [a, T] = It(d, t);
-    return /* @__PURE__ */ L.createElement(dt, { orientation: c, ref: m, size: n, store: o, ...e }, a, a.length > 1 && /* @__PURE__ */ L.createElement(Ie, { activeTab: T, listRef: r, orientation: c }));
+  ({ children: t, size: s = "md", store: o, ...e }, n) => {
+    const r = z(), m = Ee(n, r), { orientation: c, selectedId: d } = o.useState(), [a, T] = It(d, t);
+    return /* @__PURE__ */ L.createElement(dt, { orientation: c, ref: m, size: s, store: o, ...e }, a, a.length > 1 && /* @__PURE__ */ L.createElement(Ie, { activeTab: T, listRef: r, orientation: c }));
   }
 );
 Se.displayName = "TabList";
 const xe = G(
-  ({ children: t, store: n, tabId: o, ...e }, s) => {
-    const r = n.useState("orientation");
-    return /* @__PURE__ */ L.createElement(ut, { orientation: r, ref: s, store: n, tabId: o, ...e }, t);
+  ({ children: t, store: s, tabId: o, ...e }, n) => {
+    const r = s.useState("orientation");
+    return /* @__PURE__ */ L.createElement(ut, { orientation: r, ref: n, store: s, tabId: o, ...e }, t);
   }
 );
 xe.displayName = "TabPanel";
 const he = G(
-  ({ as: t, children: n, id: o, store: e, ...s }, r) => /* @__PURE__ */ L.createElement(
-    nt,
+  ({ as: t, children: s, id: o, store: e, ...n }, r) => /* @__PURE__ */ L.createElement(
+    st,
     {
       id: o,
       render: (m) => /* @__PURE__ */ L.createElement(pe, { as: t, ...m, ref: r }),
       store: e,
-      ...s
+      ...n
     },
-    n
+    s
   )
 );
 he.displayName = "Tab";

package/dist/Tag.mjs

@@ -1,26 +1,26 @@
 "use client";
 import d from "react";
 import { w as C } from "./wrap-children-aq69jtFP.mjs";
-import m, { css as n, th as i, system as w } from "@xstyled/styled-components";
+import m, { th as i, system as w, css as n } from "@xstyled/styled-components";
 import { o as p } from "./overflow-ellipsis-DGV5Kgt-.mjs";
 import { g } from "./get-max-width-height-DoUro2T7.mjs";
 import { StyledIcon as S } from "./Icon.mjs";
 import { forwardRef as b } from "./System.mjs";
 import { C as A } from "./index-C7zM96J_.mjs";
-const E = (e, t, s) => n`
-  ${i(`tags.shape.${e}`)}
+const E = (o, t, s) => n`
+  ${i(`tags.shape.${o}`)}
   padding: 0;
   ${(t || s) && n`
     width: ${g(t || "0", s)};
     height: ${g(t || "0", s)};
   `}
 `, h = m.div.withConfig({
-  shouldForwardProp: (e) => !["hasClickAction", "hasLink", "hasRemoveAction"].includes(e)
+  shouldForwardProp: (o) => !["hasClickAction", "hasLink", "hasRemoveAction"].includes(o)
 })(
-  ({ h: e, hasClickAction: t, hasLink: s, hasRemoveAction: c, length: a, size: o, variant: r, w: l }) => n`
+  ({ h: o, hasClickAction: t, hasLink: s, hasRemoveAction: c, length: a, size: e, variant: r, w: l }) => n`
     ${i("tags.default")};
     ${i(`tags.variants.${r}`)};
-    ${i(`tags.sizes.${o}`)}
+    ${i(`tags.sizes.${e}`)}
     position: relative;
     display: inline-flex;
     align-items: center;
@@ -38,7 +38,7 @@ const E = (e, t, s) => n`
     `}
     ${a === 1 && n`
       justify-content: center;
-      ${E(o, l, e)};
+      ${E(e, l, o)};
     `};
 
     ${(s || t) && n`
@@ -60,8 +60,8 @@ const E = (e, t, s) => n`
     }
 
     & > svg {
-      width: ${i(`tags.icon.${o}`)};
-      height: ${i(`tags.icon.${o}`)};
+      width: ${i(`tags.icon.${e}`)};
+      height: ${i(`tags.icon.${e}`)};
     }
 
     > *:not(:only-child) {
@@ -78,9 +78,9 @@ const E = (e, t, s) => n`
     }
   `
 ), I = m.divBox(
-  ({ size: e }) => n`
+  ({ size: o }) => n`
     position: absolute;
-    ${i(`tags.sizes.${e}`)};
+    ${i(`tags.sizes.${o}`)};
     top: 0;
     bottom: 0;
     right: 0;
@@ -93,12 +93,12 @@ const E = (e, t, s) => n`
   display: flex;
 `, R = b(
   ({
-    as: e,
+    as: o,
     children: t,
     dataTestId: s,
     href: c,
     onClick: a,
-    onRemove: o,
+    onRemove: e,
     size: r = "md",
     to: l,
     variant: $ = "default",
@@ -108,11 +108,11 @@ const E = (e, t, s) => n`
     return /* @__PURE__ */ d.createElement(
       h,
       {
-        as: e,
+        as: o,
         "data-testid": s,
         hasClickAction: !!a,
         hasLink: v,
-        hasRemoveAction: !!o,
+        hasRemoveAction: !!e,
         href: c,
         length: x,
         onClick: a,
@@ -123,7 +123,7 @@ const E = (e, t, s) => n`
         ...f
       },
       y,
-      !!o && /* @__PURE__ */ d.createElement(I, { size: r }, /* @__PURE__ */ d.createElement(k, { onClick: o, title: "Remove", type: "button" }, /* @__PURE__ */ d.createElement(A, { size: "xs", title: "Remove" })))
+      !!e && /* @__PURE__ */ d.createElement(I, { size: r }, /* @__PURE__ */ d.createElement(k, { onClick: e, title: "Remove", type: "button" }, /* @__PURE__ */ d.createElement(A, { size: "xs", title: "Remove" })))
     );
   }
 );

package/dist/Text.mjs

@@ -1,6 +1,6 @@
 "use client";
 import p from "react";
-import f, { css as l, th as d, system as b } from "@xstyled/styled-components";
+import f, { th as d, system as b, css as l } from "@xstyled/styled-components";
 import { forwardRef as x } from "./System.mjs";
 const g = {
   h0: "h1",

package/dist/Textarea.mjs

@@ -1,12 +1,12 @@
 "use client";
 import u from "react";
-import w, { css as g, th as y } from "@xstyled/styled-components";
-import { d as T } from "./field-styles-DLIhqG_8.mjs";
+import w, { th as g, css as y } from "@xstyled/styled-components";
+import { d as T } from "./field-styles-CfVLcVQp.mjs";
 import { shouldForwardProp as $, forwardRef as F } from "./System.mjs";
 const R = w.textareaBox.withConfig({ shouldForwardProp: $ })(
-  ({ size: e, variant: t }) => g`
+  ({ size: e, variant: t }) => y`
     ${T({ size: e, variant: t })};
-    ${y("textareas")};
+    ${g("textareas")};
     line-height: lg;
   `
 ), _ = F(