@stokelp/ui 1.20.0 → 1.21.0

package/dist/ui.js

@@ -1,33 +1,33 @@
 "use client";
 import { jsx as e, jsxs as c, Fragment as ve } from "react/jsx-runtime";
-import { Accordion as N, Checkbox as I, Dialog as T, ark as g, Portal as X, Switch as D, Tabs as F, Select as f, DatePicker as u, RadioGroup as y, Tooltip as A, switchAnatomy as fe, dialogAnatomy as we, accordionAnatomy as Ce, checkboxAnatomy as Se, tabsAnatomy as ke, selectAnatomy as _e, datePickerAnatomy as Te, radioGroupAnatomy as ce, tooltipAnatomy as Pe } from "@ark-ui/react";
+import { Accordion as H, Checkbox as I, Dialog as P, ark as g, Portal as X, Tooltip as F, Switch as D, Tabs as A, Select as w, DatePicker as p, RadioGroup as v, switchAnatomy as fe, dialogAnatomy as we, accordionAnatomy as Ce, checkboxAnatomy as Se, tabsAnatomy as ke, selectAnatomy as _e, datePickerAnatomy as Te, radioGroupAnatomy as ce, tooltipAnatomy as Pe } from "@ark-ui/react";
 import { styled as o, splitCssProps as B, Circle as ze } from "@stokelp/styled-system/jsx";
-import { accordion as Ie, button as Le, checkbox as te, drawer as Re, formControl as Fe, formLabel as O, formHelperText as Ae, heading as Be, switchRecipe as re, text as De, textarea as Me, tabs as Ne, select as He, input as Ve, inputAddon as Ee, inputGroup as je, datepicker as We, tag as oe, radioButtonGroup as Ze, radioGroup as $e, chip as Ge, actionCard as Oe, iconButton as Ye, tooltip as Xe, alert as Ue } from "@stokelp/styled-system/recipes";
-import { createContext as qe, forwardRef as v, useContext as Ke, createElement as Qe, useMemo as U } from "react";
-import { cx as L, css as H, sva as Je } from "@stokelp/styled-system/css";
-import { defineKeyframes as et, defineRecipe as S, defineSlotRecipe as b, defineSemanticTokens as tt, defineTextStyles as rt, defineTokens as m, defineUtility as ot, definePreset as at } from "@pandacss/dev";
-const ae = (...t) => t.filter(Boolean).join(" "), C = (t, r) => {
+import { accordion as Ie, button as Le, checkbox as te, drawer as Re, formControl as Fe, tooltip as Ae, formLabel as O, formHelperText as Be, heading as De, switchRecipe as re, text as Me, textarea as He, tabs as Ve, select as Ne, input as Ee, inputAddon as je, inputGroup as We, datepicker as Ze, tag as oe, radioButtonGroup as $e, radioGroup as Ge, chip as Oe, actionCard as Ye, iconButton as Xe, alert as Ue } from "@stokelp/styled-system/recipes";
+import { createContext as qe, forwardRef as f, useContext as Ke, createElement as Qe, useMemo as U } from "react";
+import { cx as L, css as V, sva as Je } from "@stokelp/styled-system/css";
+import { defineKeyframes as et, defineRecipe as k, defineSlotRecipe as b, defineSemanticTokens as tt, defineTextStyles as rt, defineTokens as m, defineUtility as ot, definePreset as at } from "@pandacss/dev";
+const ae = (...t) => t.filter(Boolean).join(" "), S = (t, r) => {
   const a = qe(null);
   return {
-    withContext: (d, l, s) => l ? v((p, P) => {
+    withContext: (d, l, s) => l ? f((u, C) => {
       const z = Ke(a), G = (r == null ? void 0 : r.dataAttr) ?? !1;
       return Qe(d, {
         ...G && { "data-recipe-slot": l ?? "" },
-        ...p,
+        ...u,
         ...s == null ? void 0 : s.defaultProps,
-        className: ae(z == null ? void 0 : z[l ?? ""], p.className),
-        ref: P
+        className: ae(z == null ? void 0 : z[l ?? ""], u.className),
+        ref: C
       });
     }) : d,
-    withProvider: (d, l, s) => v((p, P) => {
+    withProvider: (d, l, s) => f((u, C) => {
       const [z, { children: G, ...J }] = t.splitVariantProps({
-        ...p,
+        ...u,
         ...s == null ? void 0 : s.defaultProps
       }), ee = t(z), ye = (r == null ? void 0 : r.dataAttr) ?? !1;
       return /* @__PURE__ */ e(a.Provider, { value: ee, children: /* @__PURE__ */ c(
         d,
         {
-          ref: P,
+          ref: C,
           ...ye && { "data-recipe-slot": l ?? "" },
           ...J,
           className: ae(ee[l ?? ""], J.className),
@@ -40,18 +40,18 @@ const ae = (...t) => t.filter(Boolean).join(" "), C = (t, r) => {
       ) });
     })
   };
-}, { withProvider: it, withContext: j } = C(Ie), oa = it(o(N.Root), "root"), aa = j(o(N.Item), "item"), ia = j(o(N.ItemContent), "itemContent"), na = j(o(N.ItemIndicator), "itemIndicator", {
+}, { withProvider: it, withContext: j } = S(Ie), aa = it(o(H.Root), "root"), ia = j(o(H.Item), "item"), na = j(o(H.ItemContent), "itemContent"), la = j(o(H.ItemIndicator), "itemIndicator", {
   defaultProps: {
     children: /* @__PURE__ */ e("svg", { width: "16", height: "17", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M4.94 6.03L8 9.08333L11.06 6.03L12 6.97L8 10.97L4 6.97L4.94 6.03Z", fill: "currentColor" }) })
   }
-}), la = j(o(N.ItemTrigger), "itemTrigger"), Y = o("button", Le), nt = v((t, r) => {
-  const [a, i] = te.splitVariantProps(t), [n, d] = B(i), { children: l, className: s, ...w } = d, p = te(a);
-  return /* @__PURE__ */ c(I.Root, { ref: r, className: L(p.root, H(n), s), ...w, children: [
-    /* @__PURE__ */ c(I.Control, { className: p.control, children: [
+}), sa = j(o(H.ItemTrigger), "itemTrigger"), Y = o("button", Le), nt = f((t, r) => {
+  const [a, i] = te.splitVariantProps(t), [n, d] = B(i), { children: l, className: s, ...y } = d, u = te(a);
+  return /* @__PURE__ */ c(I.Root, { ref: r, className: L(u.root, V(n), s), ...y, children: [
+    /* @__PURE__ */ c(I.Control, { className: u.control, children: [
       /* @__PURE__ */ e(I.Indicator, { children: /* @__PURE__ */ e(lt, {}) }),
       /* @__PURE__ */ e(I.Indicator, { indeterminate: !0, children: /* @__PURE__ */ e(st, {}) })
     ] }),
-    l && /* @__PURE__ */ e(I.Label, { className: p.label, children: l }),
+    l && /* @__PURE__ */ e(I.Label, { className: u.label, children: l }),
     /* @__PURE__ */ e(I.HiddenInput, {})
   ] });
 });
@@ -68,12 +68,12 @@ const lt = () => /* @__PURE__ */ c("svg", { viewBox: "0 0 12 13", fill: "none",
 ] }), st = () => /* @__PURE__ */ c("svg", { width: "12", height: "13", viewBox: "0 0 12 13", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
   /* @__PURE__ */ e("title", { children: "Minus Icon" }),
   /* @__PURE__ */ e("path", { d: "M3 6H9V7H3V6Z", fill: "white" })
-] }), { withProvider: ct, withContext: _ } = C(Re), sa = ct(T.Root, void 0, {
+] }), { withProvider: ct, withContext: T } = S(Re), ca = ct(P.Root, void 0, {
   defaultProps: {
     unmountOnExit: !0,
     lazyMount: !0
   }
-}), ca = _(o(g.main), "body"), dt = _(o(T.CloseTrigger), "closeTrigger"), da = _(o(g.footer), "footer"), de = v(
+}), da = T(o(g.main), "body"), dt = T(o(P.CloseTrigger), "closeTrigger"), pa = T(o(g.footer), "footer"), de = f(
   ({ children: t, showCloseTrigger: r = !0, ...a }, i) => /* @__PURE__ */ c(g.header, { ...a, ref: i, children: [
     t,
     r && /* @__PURE__ */ e(dt, { asChild: !0, children: /* @__PURE__ */ e(Y, { ml: "auto", p: "space-8", variant: "tertiary", children: /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
@@ -86,62 +86,98 @@ const lt = () => /* @__PURE__ */ c("svg", { viewBox: "0 0 12 13", fill: "none",
   ] })
 );
 de.displayName = "DrawerHeader";
-const pa = _(de, "header"), ua = _(o(T.Title), "title"), ha = _(o(T.Trigger), "trigger"), pt = _(o(T.Positioner), "positioner"), ut = _(o(T.Backdrop), "backdrop"), pe = v(
+const ua = T(de, "header"), ha = T(o(P.Title), "title"), ga = T(o(P.Trigger), "trigger"), pt = T(o(P.Positioner), "positioner"), ut = T(o(P.Backdrop), "backdrop"), pe = f(
   ({ children: t, ...r }, a) => /* @__PURE__ */ c(X, { children: [
     /* @__PURE__ */ e(ut, {}),
-    /* @__PURE__ */ e(pt, { children: /* @__PURE__ */ e(T.Content, { ref: a, ...r, children: t }) })
+    /* @__PURE__ */ e(pt, { children: /* @__PURE__ */ e(P.Content, { ref: a, ...r, children: t }) })
   ] })
 );
-pe.displayName = T.Content.displayName;
-const ga = _(o(pe), "content"), ht = o("div", Fe, {
+pe.displayName = P.Content.displayName;
+const ma = T(o(pe), "content"), ht = o("div", Fe, {
   defaultProps: {
     role: "group"
   }
-}), ma = ({ isInvalid: t, isRequired: r, ...a }) => {
+}), ba = ({ isInvalid: t, isRequired: r, ...a }) => {
   const i = {
     ...t ? { "aria-invalid": !0 } : {},
     ...r ? { "aria-required": !0 } : {}
   };
   return /* @__PURE__ */ e(ht, { ...i, ...a });
-}, gt = o("label", O), ba = (t) => {
-  const [r, a] = O.splitVariantProps(t), [i, n] = B(a), { children: d, className: l, addon: s, ...w } = n, p = O(r);
-  return /* @__PURE__ */ c(gt, { className: L(p.root, H(i), l), ...w, children: [
+}, { withProvider: gt, withContext: N } = S(Ae), mt = gt(o(F.Root), void 0, {
+  defaultProps: {
+    closeDelay: 50,
+    closeOnPointerDown: !1,
+    interactive: !1,
+    lazyMount: !0,
+    openDelay: 200,
+    unmountOnExit: !0
+  }
+}), bt = N(o(F.Arrow), "arrow"), xt = N(o(F.ArrowTip), "arrowTip"), yt = N(o(F.Content), "content"), vt = N(o(F.Positioner), "positioner"), ft = N(o(F.Trigger), "trigger"), wt = ({ label: t, children: r, withArrow: a = !0, ...i }) => {
+  const [n, d] = B(i);
+  return /* @__PURE__ */ c(mt, { ...d, children: [
+    /* @__PURE__ */ e(ft, { asChild: !0, children: r }),
+    /* @__PURE__ */ e(vt, { children: /* @__PURE__ */ c(yt, { ...n, children: [
+      a ? /* @__PURE__ */ e(bt, { children: /* @__PURE__ */ e(xt, {}) }) : null,
+      t
+    ] }) })
+  ] });
+}, Ct = o("label", O), xa = (t) => {
+  const [r, a] = O.splitVariantProps(t), [i, n] = B(a), { children: d, className: l, addon: s, tooltipInformation: y, ...u } = n, C = O(r);
+  return /* @__PURE__ */ c(Ct, { className: L(C.root, V(i), l), ...u, children: [
     d,
-    s ? /* @__PURE__ */ e(o.span, { className: p.addon, children: s }) : null
+    s ? /* @__PURE__ */ e(o.span, { className: C.addon, children: s }) : null,
+    y ? /* @__PURE__ */ e(wt, { label: y, children: /* @__PURE__ */ e(
+      o.svg,
+      {
+        className: C.icon,
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M7.33337 4.66659H8.66671V5.99992H7.33337V4.66659ZM7.33337 7.33325H8.66671V11.3333H7.33337V7.33325ZM8.00004 1.33325C4.32004 1.33325 1.33337 4.31992 1.33337 7.99992C1.33337 11.6799 4.32004 14.6666 8.00004 14.6666C11.68 14.6666 14.6667 11.6799 14.6667 7.99992C14.6667 4.31992 11.68 1.33325 8.00004 1.33325ZM8.00004 13.3333C5.06004 13.3333 2.66671 10.9399 2.66671 7.99992C2.66671 5.05992 5.06004 2.66659 8.00004 2.66659C10.94 2.66659 13.3334 5.05992 13.3334 7.99992C13.3334 10.9399 10.94 13.3333 8.00004 13.3333Z",
+            fill: "currentColor"
+          }
+        )
+      }
+    ) }) : null
   ] });
-}, xa = o("p", Ae, {
+}, ya = o("p", Be, {
   dataAttr: !0
-}), ya = (t) => {
-  const { as: r = "h2", ...a } = t, i = U(() => o(r, Be), [r]);
+}), va = (t) => {
+  const { as: r = "h2", ...a } = t, i = U(() => o(r, De), [r]);
   return /* @__PURE__ */ e(i, { size: r, ...a });
-}, mt = v((t, r) => {
-  const [a, i] = re.splitVariantProps(t), [n, d] = B(i), { children: l, className: s, ...w } = d, p = re(a);
-  return /* @__PURE__ */ c(D.Root, { ref: r, className: L(p.root, H(n), s), ...w, children: [
-    /* @__PURE__ */ e(D.Control, { className: p.control, children: /* @__PURE__ */ e(D.Thumb, { className: p.thumb }) }),
-    l ? /* @__PURE__ */ e(D.Label, { className: p.label, children: l }) : null,
+}, St = f((t, r) => {
+  const [a, i] = re.splitVariantProps(t), [n, d] = B(i), { children: l, className: s, ...y } = d, u = re(a);
+  return /* @__PURE__ */ c(D.Root, { ref: r, className: L(u.root, V(n), s), ...y, children: [
+    /* @__PURE__ */ e(D.Control, { className: u.control, children: /* @__PURE__ */ e(D.Thumb, { className: u.thumb }) }),
+    l ? /* @__PURE__ */ e(D.Label, { className: u.label, children: l }) : null,
     /* @__PURE__ */ e(D.HiddenInput, {})
   ] });
 });
-mt.displayName = "Switch";
-const bt = (t) => {
-  const { as: r = "p", ...a } = t, i = U(() => o(r, De), [r]);
+St.displayName = "Switch";
+const kt = (t) => {
+  const { as: r = "p", ...a } = t, i = U(() => o(r, Me), [r]);
   return /* @__PURE__ */ e(i, { ...a });
-}, va = o(g.textarea, Me), { withProvider: xt, withContext: W } = C(Ne), fa = xt(o(F.Root), "root", {
+}, fa = o(g.textarea, He), { withProvider: _t, withContext: W } = S(Ve), wa = _t(o(A.Root), "root", {
   defaultProps: {
     lazyMount: !0
   }
-}), wa = W(o(F.Content), "content"), Ca = W(o(F.Trigger), "trigger"), yt = W(o(F.Indicator), "indicator"), ue = v(
-  ({ children: t, ...r }, a) => /* @__PURE__ */ c(F.List, { ref: a, ...r, children: [
+}), Ca = W(o(A.Content), "content"), Sa = W(o(A.Trigger), "trigger"), Tt = W(o(A.Indicator), "indicator"), ue = f(
+  ({ children: t, ...r }, a) => /* @__PURE__ */ c(A.List, { ref: a, ...r, children: [
     t,
-    /* @__PURE__ */ e(yt, {})
+    /* @__PURE__ */ e(Tt, {})
   ] })
 );
-ue.displayName = F.List.displayName;
-const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r === !0 ? a(t) : t, { withProvider: ft, withContext: k } = C(He), wt = ft(o(f.Root), "root", {
+ue.displayName = A.List.displayName;
+const ka = W(o(ue), "list"), Pt = ({ children: t, when: r, wrapper: a }) => r === !0 ? a(t) : t, { withProvider: zt, withContext: _ } = S(Ne), It = zt(o(w.Root), "root", {
   defaultProps: {
     loopFocus: !0
   }
-}), Ct = k(o(f.ClearTrigger), "clearTrigger"), St = k(o(f.Content), "content"), kt = k(o(f.Control), "control"), _t = k(o(f.Indicator), "indicator"), Tt = k(o(f.Item), "item"), Pt = k(o(f.ItemIndicator), "itemIndicator"), zt = k(o(f.ItemText), "itemText"), It = k(o(f.Positioner), "positioner"), Lt = k(o(f.Trigger), "trigger"), Rt = k(o(f.ValueText), "valueText"), ka = ({
+}), Lt = _(o(w.ClearTrigger), "clearTrigger"), Rt = _(o(w.Content), "content"), Ft = _(o(w.Control), "control"), At = _(o(w.Indicator), "indicator"), Bt = _(o(w.Item), "item"), Dt = _(o(w.ItemIndicator), "itemIndicator"), Mt = _(o(w.ItemText), "itemText"), Ht = _(o(w.Positioner), "positioner"), Vt = _(o(w.Trigger), "trigger"), Nt = _(o(w.ValueText), "valueText"), _a = ({
   items: t,
   placeholder: r,
   emptyLabel: a,
@@ -149,7 +185,7 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
   positioning: n,
   ...d
 }) => /* @__PURE__ */ c(
-  wt,
+  It,
   {
     lazyMount: !0,
     unmountOnExit: !0,
@@ -158,10 +194,10 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
     "data-recipe": "select",
     ...d,
     children: [
-      /* @__PURE__ */ c(kt, { children: [
-        /* @__PURE__ */ c(Lt, { children: [
-          /* @__PURE__ */ e(Rt, { truncate: !0, placeholder: r }),
-          /* @__PURE__ */ e(_t, { asChild: !0, children: /* @__PURE__ */ e(o.svg, { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
+      /* @__PURE__ */ c(Ft, { children: [
+        /* @__PURE__ */ c(Vt, { children: [
+          /* @__PURE__ */ e(Nt, { truncate: !0, placeholder: r }),
+          /* @__PURE__ */ e(At, { asChild: !0, children: /* @__PURE__ */ e(o.svg, { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
             "path",
             {
               d: "M7.41 8.29498L12 12.875L16.59 8.29498L18 9.70498L12 15.705L6 9.70498L7.41 8.29498Z",
@@ -169,7 +205,7 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
             }
           ) }) })
         ] }),
-        /* @__PURE__ */ e(Ct, { asChild: !0, children: /* @__PURE__ */ e("button", { children: /* @__PURE__ */ e("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
+        /* @__PURE__ */ e(Lt, { asChild: !0, children: /* @__PURE__ */ e("button", { children: /* @__PURE__ */ e("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
           "path",
           {
             d: "M9.99996 1.66669C5.39163 1.66669 1.66663 5.39169 1.66663 10C1.66663 14.6084 5.39163 18.3334 9.99996 18.3334C14.6083 18.3334 18.3333 14.6084 18.3333 10C18.3333 5.39169 14.6083 1.66669 9.99996 1.66669ZM9.99996 16.6667C6.32496 16.6667 3.33329 13.675 3.33329 10C3.33329 6.32502 6.32496 3.33335 9.99996 3.33335C13.675 3.33335 16.6666 6.32502 16.6666 10C16.6666 13.675 13.675 16.6667 9.99996 16.6667ZM12.9916 5.83335L9.99996 8.82502L7.00829 5.83335L5.83329 7.00835L8.82496 10L5.83329 12.9917L7.00829 14.1667L9.99996 11.175L12.9916 14.1667L14.1666 12.9917L11.175 10L14.1666 7.00835L12.9916 5.83335Z",
@@ -177,23 +213,23 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
           }
         ) }) }) })
       ] }),
-      /* @__PURE__ */ e(vt, { when: i, wrapper: (l) => /* @__PURE__ */ e(X, { children: l }), children: /* @__PURE__ */ e(It, { children: /* @__PURE__ */ e(St, { children: t.length === 0 ? /* @__PURE__ */ e(bt, { px: "space-8", textAlign: "center", children: a ?? "Aucun résultat" }) : t.map((l) => /* @__PURE__ */ c(Tt, { item: l, children: [
-        /* @__PURE__ */ e(zt, { truncate: !0, children: l.label }),
-        d.multiple ? /* @__PURE__ */ e(Pt, { children: "✓" }) : null
+      /* @__PURE__ */ e(Pt, { when: i, wrapper: (l) => /* @__PURE__ */ e(X, { children: l }), children: /* @__PURE__ */ e(Ht, { children: /* @__PURE__ */ e(Rt, { children: t.length === 0 ? /* @__PURE__ */ e(kt, { px: "space-8", textAlign: "center", children: a ?? "Aucun résultat" }) : t.map((l) => /* @__PURE__ */ c(Bt, { item: l, children: [
+        /* @__PURE__ */ e(Mt, { truncate: !0, children: l.label }),
+        d.multiple ? /* @__PURE__ */ e(Dt, { children: "✓" }) : null
       ] }, l.value)) }) }) }),
-      /* @__PURE__ */ e(f.HiddenSelect, {})
+      /* @__PURE__ */ e(w.HiddenSelect, {})
     ]
   }
-), Ft = o("input", Ve, {
+), Et = o("input", Ee, {
   dataAttr: !0
-}), At = o(g.div, Ee, {
+}), jt = o(g.div, je, {
   dataAttr: !0
-}), Bt = o("div", je, {
+}), Wt = o("div", We, {
   dataAttr: !0
-}), _a = (t) => {
+}), Ta = (t) => {
   const { as: r = "div", ...a } = t, i = U(() => o(r), [r]);
   return /* @__PURE__ */ e(i, { ...a });
-}, { withProvider: Dt, withContext: h } = C(We), Mt = Dt(u.Root, "root", {
+}, { withProvider: Zt, withContext: h } = S(Ze), $t = Zt(p.Root, "root", {
   defaultProps: {
     positioning: {
       placement: "bottom-start"
@@ -204,61 +240,61 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
     lazyMount: !0,
     startOfWeek: 6
   }
-}), Nt = h(u.Content, "content"), Ht = h(u.Control, "control"), Vt = h(u.Input, "input"), Et = h(u.MonthSelect, "monthSelect"), jt = h(u.NextTrigger, "nextTrigger"), Wt = h(u.Positioner, "positioner"), Zt = h(u.PrevTrigger, "prevTrigger"), $t = h(u.TableBody, "tableBody"), Gt = h(u.TableCell, "tableCell"), Ot = h(u.TableCellTrigger, "tableCellTrigger"), Yt = h(u.TableHead, "tableHead"), Xt = h(u.TableHeader, "tableHeader"), Ut = h(u.Table, "table"), ie = h(u.TableRow, "tableRow"), qt = h(u.Trigger, "trigger"), Kt = h(u.ViewControl, "viewControl"), Qt = h(u.View, "view"), Jt = h(u.YearSelect, "yearSelect"), er = h(o(u.ClearTrigger), "clearTrigger"), tr = () => /* @__PURE__ */ e("svg", { width: "23", height: "24", viewBox: "0 0 23 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
+}), Gt = h(p.Content, "content"), Ot = h(p.Control, "control"), Yt = h(p.Input, "input"), Xt = h(p.MonthSelect, "monthSelect"), Ut = h(p.NextTrigger, "nextTrigger"), qt = h(p.Positioner, "positioner"), Kt = h(p.PrevTrigger, "prevTrigger"), Qt = h(p.TableBody, "tableBody"), Jt = h(p.TableCell, "tableCell"), er = h(p.TableCellTrigger, "tableCellTrigger"), tr = h(p.TableHead, "tableHead"), rr = h(p.TableHeader, "tableHeader"), or = h(p.Table, "table"), ie = h(p.TableRow, "tableRow"), ar = h(p.Trigger, "trigger"), ir = h(p.ViewControl, "viewControl"), nr = h(p.View, "view"), lr = h(p.YearSelect, "yearSelect"), sr = h(o(p.ClearTrigger), "clearTrigger"), cr = () => /* @__PURE__ */ e("svg", { width: "23", height: "24", viewBox: "0 0 23 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
   "path",
   {
     d: "M18.2083 4H17.25V2H15.3333V4H7.66667V2H5.75V4H4.79167C3.72792 4 2.88458 4.9 2.88458 6L2.875 20C2.875 21.1 3.72792 22 4.79167 22H18.2083C19.2625 22 20.125 21.1 20.125 20V6C20.125 4.9 19.2625 4 18.2083 4ZM18.2083 20H4.79167V10H18.2083V20ZM18.2083 8H4.79167V6H18.2083V8ZM8.625 14H6.70833V12H8.625V14ZM12.4583 14H10.5417V12H12.4583V14ZM16.2917 14H14.375V12H16.2917V14ZM8.625 18H6.70833V16H8.625V18ZM12.4583 18H10.5417V16H12.4583V18ZM16.2917 18H14.375V16H16.2917V18Z",
     fill: "#1E3A76"
   }
-) }), rr = () => /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M10.4698 4.94L9.52979 4L5.52979 8L9.52979 12L10.4698 11.06L7.41645 8L10.4698 4.94Z", fill: "currentColor" }) }), or = () => /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M6.46979 4L5.52979 4.94L8.58312 8L5.52979 11.06L6.46979 12L10.4698 8L6.46979 4Z", fill: "currentColor" }) }), Ta = ({ placeholder: t, preflightClassName: r, ...a }) => /* @__PURE__ */ c(Mt, { ...a, children: [
-  /* @__PURE__ */ e(Ht, { asChild: !0, children: /* @__PURE__ */ c(Bt, { children: [
-    /* @__PURE__ */ e(Vt, { asChild: !0, index: 0, placeholder: t, children: /* @__PURE__ */ e(Ft, {}) }),
-    /* @__PURE__ */ c(At, { children: [
-      /* @__PURE__ */ e(er, { asChild: !0, cursor: "pointer", mr: "space-4", children: /* @__PURE__ */ e("button", { children: /* @__PURE__ */ e("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
+) }), dr = () => /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M10.4698 4.94L9.52979 4L5.52979 8L9.52979 12L10.4698 11.06L7.41645 8L10.4698 4.94Z", fill: "currentColor" }) }), pr = () => /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M6.46979 4L5.52979 4.94L8.58312 8L5.52979 11.06L6.46979 12L10.4698 8L6.46979 4Z", fill: "currentColor" }) }), Pa = ({ placeholder: t, preflightClassName: r, ...a }) => /* @__PURE__ */ c($t, { ...a, children: [
+  /* @__PURE__ */ e(Ot, { asChild: !0, children: /* @__PURE__ */ c(Wt, { children: [
+    /* @__PURE__ */ e(Yt, { asChild: !0, index: 0, placeholder: t, children: /* @__PURE__ */ e(Et, {}) }),
+    /* @__PURE__ */ c(jt, { children: [
+      /* @__PURE__ */ e(sr, { asChild: !0, cursor: "pointer", mr: "space-4", children: /* @__PURE__ */ e("button", { children: /* @__PURE__ */ e("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
         "path",
         {
           d: "M9.99996 1.66669C5.39163 1.66669 1.66663 5.39169 1.66663 10C1.66663 14.6084 5.39163 18.3334 9.99996 18.3334C14.6083 18.3334 18.3333 14.6084 18.3333 10C18.3333 5.39169 14.6083 1.66669 9.99996 1.66669ZM9.99996 16.6667C6.32496 16.6667 3.33329 13.675 3.33329 10C3.33329 6.32502 6.32496 3.33335 9.99996 3.33335C13.675 3.33335 16.6666 6.32502 16.6666 10C16.6666 13.675 13.675 16.6667 9.99996 16.6667ZM12.9916 5.83335L9.99996 8.82502L7.00829 5.83335L5.83329 7.00835L8.82496 10L5.83329 12.9917L7.00829 14.1667L9.99996 11.175L12.9916 14.1667L14.1666 12.9917L11.175 10L14.1666 7.00835L12.9916 5.83335Z",
           fill: "currentColor"
         }
       ) }) }) }),
-      /* @__PURE__ */ e(qt, { children: /* @__PURE__ */ e(tr, {}) })
+      /* @__PURE__ */ e(ar, { children: /* @__PURE__ */ e(cr, {}) })
     ] })
   ] }) }),
-  /* @__PURE__ */ e(X, { children: /* @__PURE__ */ e(Wt, { className: r, children: /* @__PURE__ */ e(Nt, { children: /* @__PURE__ */ e(Qt, { view: "day", children: /* @__PURE__ */ e(u.Context, { children: (i) => /* @__PURE__ */ c(ve, { children: [
-    /* @__PURE__ */ c(Kt, { children: [
-      /* @__PURE__ */ e(Zt, { asChild: !0, children: /* @__PURE__ */ e(Y, { p: "space-8", variant: "secondary", size: "sm", children: /* @__PURE__ */ e(rr, {}) }) }),
-      /* @__PURE__ */ e(Et, {}),
-      /* @__PURE__ */ e(Jt, {}),
-      /* @__PURE__ */ e(jt, { asChild: !0, children: /* @__PURE__ */ e(Y, { p: "space-8", variant: "secondary", size: "sm", children: /* @__PURE__ */ e(or, {}) }) })
+  /* @__PURE__ */ e(X, { children: /* @__PURE__ */ e(qt, { className: r, children: /* @__PURE__ */ e(Gt, { children: /* @__PURE__ */ e(nr, { view: "day", children: /* @__PURE__ */ e(p.Context, { children: (i) => /* @__PURE__ */ c(ve, { children: [
+    /* @__PURE__ */ c(ir, { children: [
+      /* @__PURE__ */ e(Kt, { asChild: !0, children: /* @__PURE__ */ e(Y, { p: "space-8", variant: "secondary", size: "sm", children: /* @__PURE__ */ e(dr, {}) }) }),
+      /* @__PURE__ */ e(Xt, {}),
+      /* @__PURE__ */ e(lr, {}),
+      /* @__PURE__ */ e(Ut, { asChild: !0, children: /* @__PURE__ */ e(Y, { p: "space-8", variant: "secondary", size: "sm", children: /* @__PURE__ */ e(pr, {}) }) })
     ] }),
-    /* @__PURE__ */ c(Ut, { children: [
-      /* @__PURE__ */ e(Yt, { children: /* @__PURE__ */ e(ie, { children: i.weekDays.map((n, d) => /* @__PURE__ */ e(Xt, { children: n.short }, d)) }) }),
-      /* @__PURE__ */ e($t, { children: i.weeks.map((n, d) => /* @__PURE__ */ e(ie, { children: n.map((l, s) => /* @__PURE__ */ e(Gt, { value: l, children: /* @__PURE__ */ e(Ot, { asChild: !0, children: /* @__PURE__ */ e("button", { children: l.day }) }) }, s)) }, d)) })
+    /* @__PURE__ */ c(or, { children: [
+      /* @__PURE__ */ e(tr, { children: /* @__PURE__ */ e(ie, { children: i.weekDays.map((n, d) => /* @__PURE__ */ e(rr, { children: n.short }, d)) }) }),
+      /* @__PURE__ */ e(Qt, { children: i.weeks.map((n, d) => /* @__PURE__ */ e(ie, { children: n.map((l, s) => /* @__PURE__ */ e(Jt, { value: l, children: /* @__PURE__ */ e(er, { asChild: !0, children: /* @__PURE__ */ e("button", { children: l.day }) }) }, s)) }, d)) })
     ] })
   ] }) }) }) }) }) })
-] }), Pa = v((t, r) => {
-  const [a, i] = oe.splitVariantProps(t), [n, d] = B(i), { children: l, className: s, ...w } = d, p = oe(a);
-  return /* @__PURE__ */ c(g.div, { ref: r, className: L(p.root, H(n), s), ...w, children: [
+] }), za = f((t, r) => {
+  const [a, i] = oe.splitVariantProps(t), [n, d] = B(i), { children: l, className: s, ...y } = d, u = oe(a);
+  return /* @__PURE__ */ c(g.div, { ref: r, className: L(u.root, V(n), s), ...y, children: [
     l,
-    /* @__PURE__ */ e(ze, { className: L(p.badge) })
+    /* @__PURE__ */ e(ze, { className: L(u.badge) })
   ] });
-}), { withProvider: ar, withContext: Z } = C(Ze), ir = Z(o(y.ItemControl), "itemControl"), nr = Z(o(y.ItemText), "itemText"), lr = v(({ children: t, value: r, ...a }, i) => /* @__PURE__ */ c(y.Item, { ref: i, ...a, value: r, children: [
-  /* @__PURE__ */ e(nr, { children: t }),
-  /* @__PURE__ */ e(ir, {}),
-  /* @__PURE__ */ e(y.ItemHiddenInput, {})
-] })), za = ar(o(y.Root), "root", {
+}), { withProvider: ur, withContext: Z } = S($e), hr = Z(o(v.ItemControl), "itemControl"), gr = Z(o(v.ItemText), "itemText"), mr = f(({ children: t, value: r, ...a }, i) => /* @__PURE__ */ c(v.Item, { ref: i, ...a, value: r, children: [
+  /* @__PURE__ */ e(gr, { children: t }),
+  /* @__PURE__ */ e(hr, {}),
+  /* @__PURE__ */ e(v.ItemHiddenInput, {})
+] })), Ia = ur(o(v.Root), "root", {
   defaultProps: {
     orientation: "horizontal"
   }
-}), Ia = Z(o(lr), "item"), La = Z(o(y.Label), "label"), { withProvider: sr, withContext: $ } = C($e), cr = $(o(y.ItemControl), "itemControl"), dr = $(o(y.ItemText), "itemText"), pr = v(({ children: t, value: r, ...a }, i) => /* @__PURE__ */ c(y.Item, { ref: i, ...a, value: r, children: [
-  /* @__PURE__ */ e(cr, {}),
-  /* @__PURE__ */ e(dr, { children: t }),
-  /* @__PURE__ */ e(y.ItemHiddenInput, {})
-] })), Ra = sr(o(y.Root), "root", {
+}), La = Z(o(mr), "item"), Ra = Z(o(v.Label), "label"), { withProvider: br, withContext: $ } = S(Ge), xr = $(o(v.ItemControl), "itemControl"), yr = $(o(v.ItemText), "itemText"), vr = f(({ children: t, value: r, ...a }, i) => /* @__PURE__ */ c(v.Item, { ref: i, ...a, value: r, children: [
+  /* @__PURE__ */ e(xr, {}),
+  /* @__PURE__ */ e(yr, { children: t }),
+  /* @__PURE__ */ e(v.ItemHiddenInput, {})
+] })), Fa = br(o(v.Root), "root", {
   defaultProps: {
     orientation: "horizontal"
   }
-}), Fa = $(o(pr), "item"), Aa = $(o(y.Label), "label"), { withProvider: ur, withContext: q } = C(Ge), Ba = ur(o(g.span), "root"), Da = q(o("img"), "avatar"), Ma = q(o(g.p), "body"), Na = q(o(g.button), "clearTrigger", {
+}), Aa = $(o(vr), "item"), Ba = $(o(v.Label), "label"), { withProvider: fr, withContext: q } = S(Oe), Da = fr(o(g.span), "root"), Ma = q(o("img"), "avatar"), Ha = q(o(g.p), "body"), Va = q(o(g.button), "clearTrigger", {
   defaultProps: {
     type: "button",
     children: /* @__PURE__ */ e("svg", { width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
@@ -269,32 +305,14 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
       }
     ) })
   }
-}), { withProvider: hr, withContext: K } = C(Oe, {
+}), { withProvider: wr, withContext: K } = S(Ye, {
   dataAttr: !0
-}), gr = K(o(g.svg), "icon"), Ha = hr(o(g.button), "root", {
+}), Cr = K(o(g.svg), "icon"), Na = wr(o(g.button), "root", {
   defaultProps: {
     role: "group"
   },
-  afterSlot: /* @__PURE__ */ e(gr, { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M9.70501 6L8.29501 7.41L12.875 12L8.29501 16.59L9.70501 18L15.705 12L9.70501 6Z", fill: "currentColor" }) })
-}), Va = K(o(g.h3), "title"), Ea = K(o(g.p), "description"), mr = o("button", Ye), { withProvider: br, withContext: V } = C(Xe), xr = br(o(A.Root), void 0, {
-  defaultProps: {
-    closeDelay: 50,
-    closeOnPointerDown: !1,
-    interactive: !1,
-    lazyMount: !0,
-    openDelay: 200,
-    unmountOnExit: !0
-  }
-}), yr = V(o(A.Arrow), "arrow"), vr = V(o(A.ArrowTip), "arrowTip"), fr = V(o(A.Content), "content"), wr = V(o(A.Positioner), "positioner"), Cr = V(o(A.Trigger), "trigger"), ja = ({ label: t, children: r, withArrow: a = !0, ...i }) => {
-  const [n, d] = B(i);
-  return /* @__PURE__ */ c(xr, { ...d, children: [
-    /* @__PURE__ */ e(Cr, { asChild: !0, children: r }),
-    /* @__PURE__ */ e(wr, { children: /* @__PURE__ */ c(fr, { ...n, children: [
-      a ? /* @__PURE__ */ e(yr, { children: /* @__PURE__ */ e(vr, {}) }) : null,
-      t
-    ] }) })
-  ] });
-}, { withProvider: Sr, withContext: Q } = C(Ue), kr = Sr(o(g.div), "root"), _r = Q(o(g.svg), "icon"), Tr = Q(o(g.h3), "title"), Pr = Q(o(g.p), "description"), zr = (t) => {
+  afterSlot: /* @__PURE__ */ e(Cr, { viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("path", { d: "M9.70501 6L8.29501 7.41L12.875 12L8.29501 16.59L9.70501 18L15.705 12L9.70501 6Z", fill: "currentColor" }) })
+}), Ea = K(o(g.h3), "title"), ja = K(o(g.p), "description"), Sr = o("button", Xe), { withProvider: kr, withContext: Q } = S(Ue), _r = kr(o(g.div), "root"), Tr = Q(o(g.svg), "icon"), Pr = Q(o(g.h3), "title"), zr = Q(o(g.p), "description"), Ir = (t) => {
   switch (t) {
     default:
     case "neutral":
@@ -338,12 +356,12 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
         }
       ) });
   }
-}, Wa = v(
-  ({ title: t, description: r, showDismissTrigger: a, onDismiss: i, severity: n, showIcon: d = !0, ...l }, s) => /* @__PURE__ */ c(kr, { ref: s, severity: n, ...l, children: [
-    /* @__PURE__ */ c(Tr, { children: [
-      d ? /* @__PURE__ */ e(_r, { asChild: !0, children: zr(n) }) : null,
+}, Wa = f(
+  ({ title: t, description: r, showDismissTrigger: a, onDismiss: i, severity: n, showIcon: d = !0, ...l }, s) => /* @__PURE__ */ c(_r, { ref: s, severity: n, ...l, children: [
+    /* @__PURE__ */ c(Pr, { children: [
+      d ? /* @__PURE__ */ e(Tr, { asChild: !0, children: Ir(n) }) : null,
       t,
-      a ? /* @__PURE__ */ e(mr, { ml: "auto", onClick: i, size: "sm", variant: "tertiary", "aria-label": "dismiss", children: /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
+      a ? /* @__PURE__ */ e(Sr, { ml: "auto", onClick: i, size: "sm", variant: "tertiary", "aria-label": "dismiss", children: /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
         "path",
         {
           d: "M12.6666 4.27334L11.7266 3.33334L7.99998 7.06L4.27331 3.33334L3.33331 4.27334L7.05998 8L3.33331 11.7267L4.27331 12.6667L7.99998 8.94L11.7266 12.6667L12.6666 11.7267L8.93998 8L12.6666 4.27334Z",
@@ -351,7 +369,7 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
         }
       ) }) }) : null
     ] }),
-    r ? /* @__PURE__ */ e(Pr, { children: r }) : null
+    r ? /* @__PURE__ */ e(zr, { children: r }) : null
   ] })
 ), ne = Je({
   slots: ["root", "price", "unit"],
@@ -417,23 +435,23 @@ const Sa = W(o(ue), "list"), vt = ({ children: t, when: r, wrapper: a }) => r ==
   defaultVariants: {
     size: "md"
   }
-}), Ir = v((t, r) => {
-  const [a, i] = ne.splitVariantProps(t), [n, d] = B(i), { className: l, unit: s, price: w, ...p } = d, P = ne(a), z = !!s;
-  return /* @__PURE__ */ c("span", { ref: r, className: L(P.root, H(n), l), ...p, children: [
-    /* @__PURE__ */ e("span", { className: P.price, children: w }),
-    z ? /* @__PURE__ */ c("span", { className: P.unit, children: [
+}), Lr = f((t, r) => {
+  const [a, i] = ne.splitVariantProps(t), [n, d] = B(i), { className: l, unit: s, price: y, ...u } = d, C = ne(a), z = !!s;
+  return /* @__PURE__ */ c("span", { ref: r, className: L(C.root, V(n), l), ...u, children: [
+    /* @__PURE__ */ e("span", { className: C.price, children: y }),
+    z ? /* @__PURE__ */ c("span", { className: C.unit, children: [
       "/ ",
       s
     ] }) : null
   ] });
 });
-Ir.displayName = "PriceTag";
-const Lr = {
+Lr.displayName = "PriceTag";
+const Rr = {
   xl: "1536px",
   lg: "1200px",
   md: "900px",
   sm: "600px"
-}, Rr = {
+}, Fr = {
   extend: {
     checked: "&:where(:checked, [data-checked], [aria-checked=true], [data-state=checked])",
     closed: "&:where([data-state=closed])",
@@ -451,7 +469,7 @@ const Lr = {
     today: "&:where([data-today])",
     underValue: '&:where([data-state="under-value"])'
   }
-}, Fr = {
+}, Ar = {
   "2xl": "672px",
   "3xl": "768px",
   "4xl": "896px",
@@ -464,7 +482,7 @@ const Lr = {
   sm: "384px",
   xl: "576px",
   xs: "320px"
-}, Ar = et({
+}, Br = et({
   blob: {
     "0%": {
       rotate: "0deg"
@@ -582,7 +600,7 @@ const Lr = {
       transform: "rotate(360deg)"
     }
   }
-}), he = S({
+}), he = k({
   base: {
     _focusVisible: {
       ring: "2px solid {colors.primary.200}",
@@ -773,7 +791,7 @@ const Lr = {
       }
     }
   ]
-}), Br = S({
+}), Dr = k({
   className: "heading",
   defaultVariants: {
     size: "h2"
@@ -803,7 +821,7 @@ const Lr = {
       h6: { textStyle: "heading.h6" }
     }
   }
-}), Dr = b({
+}), Mr = b({
   base: {
     control: {
       _focus: {
@@ -885,7 +903,7 @@ const Lr = {
       }
     }
   }
-}), Mr = S({
+}), Hr = k({
   className: "text",
   defaultVariants: {
     size: "md"
@@ -918,7 +936,7 @@ const Lr = {
       sm: { textStyle: "body.sm" }
     }
   }
-}), ge = S({
+}), ge = k({
   base: {
     '&[type="time"]::-webkit-calendar-picker-indicator': {
       display: "none"
@@ -972,7 +990,7 @@ const Lr = {
       }
     }
   }
-}), Nr = S({
+}), Vr = k({
   className: "textarea",
   jsx: ["Textarea"],
   base: {
@@ -980,7 +998,7 @@ const Lr = {
     py: "space-8",
     ...ge.base
   }
-}), Hr = S({
+}), Nr = k({
   base: {
     _invalid: {
       '& [data-recipe="formHelperText"]': {
@@ -1010,7 +1028,7 @@ const Lr = {
   className: "form-control",
   description: "The styles for the FormControl component",
   jsx: ["FormControl"]
-}), Vr = S({
+}), Er = k({
   base: {
     color: "grey.400",
     fontFamily: "satoshi",
@@ -1019,9 +1037,9 @@ const Lr = {
   className: "form-helper-text",
   description: "The styles for the FormHelperText component",
   jsx: ["FormHelperText"]
-}), Er = we.extendWith("header", "body", "footer"), jr = b({
+}), jr = we.extendWith("header", "body", "footer"), Wr = b({
   className: "drawer",
-  slots: Er.keys(),
+  slots: jr.keys(),
   jsx: ["Drawer"],
   base: {
     backdrop: {
@@ -1139,7 +1157,7 @@ const Lr = {
       }
     }
   }
-}), Wr = b({
+}), Zr = b({
   className: "accordion",
   jsx: ["Accordion"],
   slots: Ce.keys(),
@@ -1243,15 +1261,24 @@ const Lr = {
       }
     }
   }
-}), Zr = b({
+}), $r = b({
   base: {
-    root: { color: "grey.400", fontFamily: "satoshi", textStyle: "body.sm" },
+    root: {
+      color: "grey.400",
+      fontFamily: "satoshi",
+      textStyle: "body.sm",
+      display: "flex",
+      alignItems: "center",
+      gap: "space-4"
+    },
     addon: {
-      ml: "space-4",
       bg: "primary.100",
       color: "secondary.800",
       borderRadius: "radius-2",
       px: "space-2"
+    },
+    icon: {
+      display: "inline"
     }
   },
   variants: {
@@ -1269,11 +1296,11 @@ const Lr = {
     }
   },
   defaultVariants: { variant: "absolute" },
-  slots: ["root", "addon"],
+  slots: ["root", "addon", "icon"],
   className: "form-label",
   description: "The styles for the FormLabel component",
   jsx: ["FormLabel"]
-}), $r = b({
+}), Gr = b({
   className: "checkbox",
   slots: Se.keys(),
   jsx: ["Checkbox"],
@@ -1391,7 +1418,7 @@ const Lr = {
       }
     }
   }
-}), Gr = b({
+}), Or = b({
   className: "tabs",
   slots: ke.keys(),
   base: {
@@ -1497,7 +1524,7 @@ const Lr = {
       }
     }
   }
-}), Or = b({
+}), Yr = b({
   base: {
     control: {
       fontFamily: "satoshi",
@@ -1650,7 +1677,7 @@ const Lr = {
       }
     }
   }
-}), Yr = S({
+}), Xr = k({
   base: {
     alignItems: "center",
     borderRadius: "inherit",
@@ -1663,7 +1690,7 @@ const Lr = {
   className: "input-addon",
   description: "The styles for the InputAddon component",
   jsx: ["InputAddon"]
-}), Xr = S({
+}), Ur = k({
   base: {
     '& [data-recipe="input"]': {
       border: {
@@ -1706,7 +1733,7 @@ const Lr = {
   className: "input-group",
   description: "The styles for the InputGroup component",
   jsx: ["InputGroup"]
-}), le = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI2IiB2aWV3Qm94PSIwIDAgOCA2IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC45NCAwLjUyOTk5OUw0IDMuNTgzMzNMNy4wNiAwLjUyOTk5OUw4IDEuNDdMNCA1LjQ3TDAgMS40N0wwLjk0IDAuNTI5OTk5WiIgZmlsbD0iIzFFM0E3NiIvPgo8L3N2Zz4K", Ur = b({
+}), le = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI2IiB2aWV3Qm94PSIwIDAgOCA2IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC45NCAwLjUyOTk5OUw0IDMuNTgzMzNMNy4wNiAwLjUyOTk5OUw4IDEuNDdMNCA1LjQ3TDAgMS40N0wwLjk0IDAuNTI5OTk5WiIgZmlsbD0iIzFFM0E3NiIvPgo8L3N2Zz4K", qr = b({
   className: "datepicker",
   slots: Te.keys(),
   jsx: ["DatePicker"],
@@ -1866,7 +1893,7 @@ const Lr = {
       textAlign: "center"
     }
   }
-}), qr = b({
+}), Kr = b({
   base: {
     root: {
       fontFamily: "satoshi",
@@ -1971,7 +1998,7 @@ const Lr = {
       }
     }
   }
-}), Kr = b({
+}), Qr = b({
   className: "radio-button-group",
   jsx: ["RadioButtonGroup"],
   slots: ce.keys(),
@@ -2038,7 +2065,7 @@ const Lr = {
       }
     }
   }
-}), Qr = b({
+}), Jr = b({
   base: {
     item: {
       _disabled: {
@@ -2147,7 +2174,7 @@ const Lr = {
       }
     }
   }
-}), Jr = b({
+}), eo = b({
   base: {
     root: {
       borderRadius: "full",
@@ -2270,7 +2297,7 @@ const Lr = {
       }
     }
   }
-}), eo = b({
+}), to = b({
   base: {
     root: {
       position: "relative",
@@ -2351,47 +2378,47 @@ const Lr = {
   description: "The styles for the ActionCard component",
   jsx: ["ActionCard", "ActionCardTitle", "ActionCardDescription"]
 });
-function to(t) {
+function ro(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var ro = function(r) {
-  return oo(r) && !ao(r);
+var oo = function(r) {
+  return ao(r) && !io(r);
 };
-function oo(t) {
+function ao(t) {
   return !!t && typeof t == "object";
 }
-function ao(t) {
+function io(t) {
   var r = Object.prototype.toString.call(t);
-  return r === "[object RegExp]" || r === "[object Date]" || lo(t);
-}
-var io = typeof Symbol == "function" && Symbol.for, no = io ? Symbol.for("react.element") : 60103;
-function lo(t) {
-  return t.$$typeof === no;
+  return r === "[object RegExp]" || r === "[object Date]" || so(t);
 }
+var no = typeof Symbol == "function" && Symbol.for, lo = no ? Symbol.for("react.element") : 60103;
 function so(t) {
+  return t.$$typeof === lo;
+}
+function co(t) {
   return Array.isArray(t) ? [] : {};
 }
 function M(t, r) {
-  return r.clone !== !1 && r.isMergeableObject(t) ? R(so(t), t, r) : t;
+  return r.clone !== !1 && r.isMergeableObject(t) ? R(co(t), t, r) : t;
 }
-function co(t, r, a) {
+function po(t, r, a) {
   return t.concat(r).map(function(i) {
     return M(i, a);
   });
 }
-function po(t, r) {
+function uo(t, r) {
   if (!r.customMerge)
     return R;
   var a = r.customMerge(t);
   return typeof a == "function" ? a : R;
 }
-function uo(t) {
+function ho(t) {
   return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(t).filter(function(r) {
     return Object.propertyIsEnumerable.call(t, r);
   }) : [];
 }
 function se(t) {
-  return Object.keys(t).concat(uo(t));
+  return Object.keys(t).concat(ho(t));
 }
 function me(t, r) {
   try {
@@ -2400,21 +2427,21 @@ function me(t, r) {
     return !1;
   }
 }
-function ho(t, r) {
+function go(t, r) {
   return me(t, r) && !(Object.hasOwnProperty.call(t, r) && Object.propertyIsEnumerable.call(t, r));
 }
-function go(t, r, a) {
+function mo(t, r, a) {
   var i = {};
   return a.isMergeableObject(t) && se(t).forEach(function(n) {
     i[n] = M(t[n], a);
   }), se(r).forEach(function(n) {
-    ho(t, n) || (me(t, n) && a.isMergeableObject(r[n]) ? i[n] = po(n, a)(t[n], r[n], a) : i[n] = M(r[n], a));
+    go(t, n) || (me(t, n) && a.isMergeableObject(r[n]) ? i[n] = uo(n, a)(t[n], r[n], a) : i[n] = M(r[n], a));
   }), i;
 }
 function R(t, r, a) {
-  a = a || {}, a.arrayMerge = a.arrayMerge || co, a.isMergeableObject = a.isMergeableObject || ro, a.cloneUnlessOtherwiseSpecified = M;
+  a = a || {}, a.arrayMerge = a.arrayMerge || po, a.isMergeableObject = a.isMergeableObject || oo, a.cloneUnlessOtherwiseSpecified = M;
   var i = Array.isArray(r), n = Array.isArray(t), d = i === n;
-  return d ? i ? a.arrayMerge(t, r, a) : go(t, r, a) : M(r, a);
+  return d ? i ? a.arrayMerge(t, r, a) : mo(t, r, a) : M(r, a);
 }
 R.all = function(r, a) {
   if (!Array.isArray(r))
@@ -2423,10 +2450,10 @@ R.all = function(r, a) {
     return R(i, n, a);
   }, {});
 };
-var mo = R, bo = mo;
-const xo = /* @__PURE__ */ to(bo), yo = xo(
+var bo = R, xo = bo;
+const yo = /* @__PURE__ */ ro(xo), vo = yo(
   he,
-  S({
+  k({
     className: "icon-button",
     defaultVariants: {
       size: "md",
@@ -2483,7 +2510,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
       }
     }
   })
-), vo = b({
+), fo = b({
   base: {
     content: {
       _closed: {
@@ -2513,7 +2540,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   className: "tooltip",
   jsx: ["Tooltip"],
   slots: Pe.keys()
-}), fo = b({
+}), wo = b({
   base: {
     root: {
       borderRadius: "radius-8",
@@ -2574,34 +2601,34 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
       }
     }
   }
-}), wo = {
+}), Co = {
   button: he,
-  iconButton: yo,
-  heading: Br,
-  switchRecipe: Dr,
-  text: Mr,
-  textarea: Nr,
-  formControl: Hr,
-  formHelperText: Vr,
+  iconButton: vo,
+  heading: Dr,
+  switchRecipe: Mr,
+  text: Hr,
+  textarea: Vr,
+  formControl: Nr,
+  formHelperText: Er,
   input: ge,
-  inputAddon: Yr,
-  inputGroup: Xr
-}, Co = {
-  drawer: jr,
-  radioButtonGroup: Kr,
-  radioGroup: Qr,
-  accordion: Wr,
-  formLabel: Zr,
-  checkbox: $r,
-  datepicker: Ur,
-  tabs: Gr,
-  tag: qr,
-  select: Or,
-  chip: Jr,
-  actionCard: eo,
-  tooltip: vo,
-  alert: fo
-}, So = tt.colors({
+  inputAddon: Xr,
+  inputGroup: Ur
+}, So = {
+  drawer: Wr,
+  radioButtonGroup: Qr,
+  radioGroup: Jr,
+  accordion: Zr,
+  formLabel: $r,
+  checkbox: Gr,
+  datepicker: qr,
+  tabs: Or,
+  tag: Kr,
+  select: Yr,
+  chip: eo,
+  actionCard: to,
+  tooltip: fo,
+  alert: wo
+}, ko = tt.colors({
   decorative: {
     red: {
       light: { value: "#FFB5AD" },
@@ -2700,9 +2727,9 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
       value: "{colors.primary.900}"
     }
   }
-}), ko = {
-  colors: So
-}, _o = rt({
+}), _o = {
+  colors: ko
+}, To = rt({
   body: {
     lg: {
       value: {
@@ -2785,7 +2812,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
       }
     }
   }
-}), To = m.animations({
+}), Po = m.animations({
   "backdrop-in": {
     value: "fade-in 250ms {easings.emphasized-in}"
   },
@@ -2826,14 +2853,14 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   "collapse-out": {
     value: "collapse-out 150ms {easings.in-out}"
   }
-}), Po = m.borders({
+}), zo = m.borders({
   golden: { value: "1.618 / 1" },
   landscape: { value: "4 / 3" },
   portrait: { value: "3 / 4" },
   square: { value: "1 / 1" },
   ultrawide: { value: "18 / 5" },
   wide: { value: "16 / 9" }
-}), zo = m.blurs({
+}), Io = m.blurs({
   "2xl": { value: "40px" },
   "3xl": { value: "64px" },
   base: { value: "8px" },
@@ -2841,11 +2868,11 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   md: { value: "12px" },
   sm: { value: "4px" },
   xl: { value: "24px" }
-}), Io = m.borders({
+}), Lo = m.borders({
   border: {
     none: { value: "none" }
   }
-}), Lo = m.colors({
+}), Ro = m.colors({
   black: { value: "#000" },
   current: { value: "currentColor" },
   transparent: { value: "rgb(0 0 0 / 0)" },
@@ -2917,7 +2944,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
     200: { value: "#FFEAAC" },
     100: { value: "#FFF9E6" }
   }
-}), Ro = m.durations({
+}), Fo = m.durations({
   fast: { value: "150ms" },
   faster: { value: "100ms" },
   fastest: { value: "50ms" },
@@ -2925,7 +2952,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   slow: { value: "300ms" },
   slower: { value: "400ms" },
   slowest: { value: "500ms" }
-}), Fo = m.easings({
+}), Ao = m.easings({
   default: { value: "cubic-bezier(0.2, 0.0, 0, 1.0)" },
   "ease-bounce-1": {
     value: `linear(
@@ -3013,7 +3040,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   linear: { value: "linear" },
   out: { value: "cubic-bezier(0, 0, 0.2, 1)" },
   pulse: { value: "cubic-bezier(0.4, 0.0, 0.6, 1.0)" }
-}), Ao = m.radii({
+}), Bo = m.radii({
   "radius-0": { value: "0px" },
   "radius-2": { value: "2px" },
   "radius-4": { value: "4px" },
@@ -3035,7 +3062,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   "radius-60": { value: "60px" },
   "radius-64": { value: "64px" },
   full: { value: "9999px" }
-}), Bo = m.shadows({
+}), Do = m.shadows({
   "2xl": { value: "0 25px 50px -12px rgb(0 0 0 / 0.25)" },
   inner: { value: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)" },
   lg: { value: ["0 10px 15px -3px rgb(0 0 0 / 0.1)", "0 4px 6px -4px rgb(0 0 0 / 0.1)"] },
@@ -3043,7 +3070,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   sm: { value: ["0 1px 3px 0 rgb(0 0 0 / 0.1)", "0 1px 2px -1px rgb(0 0 0 / 0.1)"] },
   xl: { value: ["0 20px 25px -5px rgb(0 0 0 / 0.1)", "0 8px 10px -6px rgb(0 0 0 / 0.1)"] },
   xs: { value: "0 1px 2px 0 rgb(0 0 0 / 0.05)" }
-}), Do = m.sizes({
+}), Mo = m.sizes({
   "size-0": {
     value: "0px"
   },
@@ -3120,7 +3147,7 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
   "size-80": {
     value: "80px"
   }
-}), Mo = m.spacing({
+}), Ho = m.spacing({
   "space-0": {
     value: "0px"
   },
@@ -3200,9 +3227,9 @@ const xo = /* @__PURE__ */ to(bo), yo = xo(
     value: "80px"
   }
 });
-var No = "cm,mm,Q,in,pc,pt,px,em,ex,ch,rem,lh,rlh,vw,vh,vmin,vmax,vb,vi,svw,svh,lvw,lvh,dvw,dvh,cqw,cqh,cqi,cqb,cqmin,cqmax,%";
-`${No.split(",").join("|")}`;
-var Ho = {
+var Vo = "cm,mm,Q,in,pc,pt,px,em,ex,ch,rem,lh,rlh,vw,vh,vmin,vmax,vb,vi,svw,svh,lvw,lvh,dvw,dvh,cqw,cqh,cqi,cqb,cqmin,cqmax,%";
+`${Vo.split(",").join("|")}`;
+var No = {
   animation: [
     "animationName",
     "animationDuration",
@@ -3313,22 +3340,22 @@ var Ho = {
   textEmphasis: ["textEmphasisStyle", "textEmphasisColor"],
   transition: ["transitionProperty", "transitionDuration", "transitionTimingFunction", "transitionDelay"]
 };
-Object.values(Ho).reduce((t, r) => [...t, ...r], []);
-var Vo = 16, be = "px", xe = "em", E = "rem";
-function Eo(t = "") {
+Object.values(No).reduce((t, r) => [...t, ...r], []);
+var Eo = 16, be = "px", xe = "em", E = "rem";
+function jo(t = "") {
   const r = new RegExp(String.raw`-?\d+(?:\.\d+|\d*)`), a = new RegExp(`${be}|${xe}|${E}`), i = t.match(new RegExp(`${r.source}(${a.source})`));
   return i == null ? void 0 : i[1];
 }
 function x(t = "") {
-  const r = Eo(t);
+  const r = jo(t);
   if (!r || r === E)
     return t;
   if (r === xe)
     return `${parseFloat(t)}${E}`;
   if (r === be)
-    return `${parseFloat(t) / Vo}${E}`;
+    return `${parseFloat(t) / Eo}${E}`;
 }
-const jo = m.fontSizes({
+const Wo = m.fontSizes({
   body: {
     lg: { value: x("16px") },
     md: { value: x("14px") },
@@ -3350,7 +3377,7 @@ const jo = m.fontSizes({
       xs: { value: x("18px") }
     }
   }
-}), Wo = m.fontWeights({
+}), Zo = m.fontWeights({
   black: { value: "900" },
   bold: { value: "700" },
   extrabold: { value: "800" },
@@ -3360,14 +3387,14 @@ const jo = m.fontSizes({
   normal: { value: "400" },
   semibold: { value: "600" },
   thin: { value: "100" }
-}), Zo = m.letterSpacings({
+}), $o = m.letterSpacings({
   normal: { value: "0em" },
   tight: { value: "-0.025em" },
   tighter: { value: "-0.05em" },
   wide: { value: "0.025em" },
   wider: { value: "0.05em" },
   widest: { value: "0.1em" }
-}), $o = m.lineHeights({}), Go = m.fonts({
+}), Go = m.lineHeights({}), Oo = m.fonts({
   satoshi: { value: "var(--font-satoshi)" },
   cabinet: { value: "var(--font-cabinet)" },
   mono: {
@@ -3403,7 +3430,7 @@ const jo = m.fontSizes({
   serif: {
     value: ["ui-serif", "Georgia", "Cambria", '"Times New Roman"', "Times", "serif"]
   }
-}), Oo = m.zIndex({
+}), Yo = m.zIndex({
   banner: {
     value: 1200
   },
@@ -3440,102 +3467,102 @@ const jo = m.fontSizes({
   tooltip: {
     value: 1800
   }
-}), Yo = {
-  animations: To,
-  aspectRatios: Po,
-  blurs: zo,
-  borders: Io,
-  colors: Lo,
-  durations: Ro,
-  easings: Fo,
-  fontSizes: jo,
-  fontWeights: Wo,
-  fonts: Go,
-  letterSpacings: Zo,
-  lineHeights: $o,
-  radii: Ao,
-  shadows: Bo,
-  sizes: Do,
-  spacing: Mo,
-  zIndex: Oo
-}, Xo = ot({
+}), Xo = {
+  animations: Po,
+  aspectRatios: zo,
+  blurs: Io,
+  borders: Lo,
+  colors: Ro,
+  durations: Fo,
+  easings: Ao,
+  fontSizes: Wo,
+  fontWeights: Zo,
+  fonts: Oo,
+  letterSpacings: $o,
+  lineHeights: Go,
+  radii: Bo,
+  shadows: Do,
+  sizes: Mo,
+  spacing: Ho,
+  zIndex: Yo
+}, Uo = ot({
   className: "size",
   transform(t) {
     return { height: t, width: t };
   },
   values: "sizes"
-}), Uo = {
+}), qo = {
   extend: {
-    boxSize: Xo
+    boxSize: Uo
   }
 }, Za = at({
   staticCss: {
     recipes: "*"
   },
   theme: {
-    breakpoints: Lr,
-    containerSizes: Fr,
-    keyframes: Ar,
-    recipes: wo,
-    semanticTokens: ko,
-    slotRecipes: Co,
-    textStyles: _o,
-    tokens: Yo
-  },
-  utilities: Uo,
-  conditions: Rr
+    breakpoints: Rr,
+    containerSizes: Ar,
+    keyframes: Br,
+    recipes: Co,
+    semanticTokens: _o,
+    slotRecipes: So,
+    textStyles: To,
+    tokens: Xo
+  },
+  utilities: qo,
+  conditions: Fr
 });
 export {
-  oa as Accordion,
-  aa as AccordionItem,
-  ia as AccordionItemContent,
-  na as AccordionItemIndicator,
-  la as AccordionItemTrigger,
-  Ha as ActionCard,
-  Ea as ActionCardDescription,
-  Va as ActionCardTitle,
+  aa as Accordion,
+  ia as AccordionItem,
+  na as AccordionItemContent,
+  la as AccordionItemIndicator,
+  sa as AccordionItemTrigger,
+  Na as ActionCard,
+  ja as ActionCardDescription,
+  Ea as ActionCardTitle,
   Wa as Alert,
-  _a as Box,
+  Ta as Box,
   Y as Button,
   nt as Checkbox,
-  Ba as Chip,
-  Da as ChipAvatar,
-  Na as ChipClearTrigger,
-  Ma as ChipLabel,
-  Ta as DatePicker,
-  sa as Drawer,
-  ca as DrawerBody,
+  Da as Chip,
+  Ma as ChipAvatar,
+  Va as ChipClearTrigger,
+  Ha as ChipLabel,
+  Pa as DatePicker,
+  ca as Drawer,
+  da as DrawerBody,
   dt as DrawerCloseTrigger,
-  ga as DrawerContent,
-  da as DrawerFooter,
-  pa as DrawerHeader,
-  ua as DrawerTitle,
-  ha as DrawerTrigger,
-  ma as FormControl,
-  xa as FormHelperText,
-  ba as FormLabel,
-  ya as Heading,
-  mr as IconButton,
-  Ft as Input,
-  At as InputAddon,
-  Bt as InputGroup,
-  Ir as PriceTag,
-  za as RadioButtonGroup,
-  Ia as RadioButtonGroupItem,
-  La as RadioButtonGroupLabel,
-  Ra as RadioGroup,
-  Fa as RadioGroupItem,
-  Aa as RadioGroupLabel,
-  ka as Select,
-  mt as Switch,
-  fa as Tabs,
-  wa as TabsContent,
-  Sa as TabsList,
-  Ca as TabsTrigger,
-  Pa as Tag,
-  bt as Text,
-  va as Textarea,
-  ja as Tooltip,
+  ma as DrawerContent,
+  pa as DrawerFooter,
+  ua as DrawerHeader,
+  ha as DrawerTitle,
+  ga as DrawerTrigger,
+  ba as FormControl,
+  ya as FormHelperText,
+  xa as FormLabel,
+  va as Heading,
+  Sr as IconButton,
+  Et as Input,
+  jt as InputAddon,
+  Wt as InputGroup,
+  Lr as PriceTag,
+  Ia as RadioButtonGroup,
+  La as RadioButtonGroupItem,
+  Ra as RadioButtonGroupLabel,
+  Fa as RadioGroup,
+  Aa as RadioGroupItem,
+  Ba as RadioGroupLabel,
+  _a as Select,
+  St as Switch,
+  wa as Tabs,
+  Ca as TabsContent,
+  ka as TabsList,
+  Sa as TabsTrigger,
+  za as Tag,
+  kt as Text,
+  fa as Textarea,
+  wt as Tooltip,
   Za as preset
 };
 //# sourceMappingURL=ui.js.map