@tpc-mare/mare-ui-components-react 1.0.2 → 1.0.3-beta.0

package/dist/shared/{DialogFooter-Cx7G-GHH.js → DialogFooter-DKFuHOJl.js}

@@ -79,7 +79,10 @@ function E({
         /* @__PURE__ */ a(r.Positioner, { className: k, children: /* @__PURE__ */ l(
           r.Content,
           {
-            className: y({ size: g, fullScreen: t }),
+            className: y({
+              size: g,
+              fullScreen: t
+            }),
             children: [
               p,
               /* @__PURE__ */ a("div", { className: v(t), children: c }),

package/dist/shared/{DialogHeader-DdVPFxGf.js → DialogHeader-D0dg5FBI.js}

@@ -1,18 +1,18 @@
 import { jsxs as t, jsx as s } from "react/jsx-runtime";
-import { Dialog as l } from "@ark-ui/react/dialog";
-import { s as h, i as o, n as d, l as u } from "./DialogFooter-Cx7G-GHH.js";
-import { B as r } from "./Button-C2ULmKj3.js";
-import { I as p } from "./IconX-CpPADKjZ.js";
+import { Dialog as a } from "@ark-ui/react/dialog";
+import { s as h, i as o, n as d, l as u } from "./DialogFooter-DKFuHOJl.js";
+import { B as r } from "./Button-BqFuDnSs.js";
+import { IconX as p } from "@tabler/icons-react";
 function y({
-  title: e,
+  title: l,
   leftIcon: i = /* @__PURE__ */ s(p, {}),
-  rightIcon: a,
+  rightIcon: e,
   onLeftIconClick: n,
   onRightIconClick: m,
   border: c = !1
 }) {
   return /* @__PURE__ */ t("div", { className: u(c), children: [
-    i ? /* @__PURE__ */ s("div", { className: h, children: /* @__PURE__ */ s(l.CloseTrigger, { asChild: !0, children: /* @__PURE__ */ s(
+    i ? /* @__PURE__ */ s("div", { className: h, children: /* @__PURE__ */ s(a.CloseTrigger, { asChild: !0, children: /* @__PURE__ */ s(
       r,
       {
         severity: "ghost",
@@ -22,31 +22,31 @@ function y({
         onClick: n
       }
     ) }) }) : null,
-    e ? /* @__PURE__ */ s(
-      l.Title,
+    l ? /* @__PURE__ */ s(
+      a.Title,
       {
         className: o({
           hasLeftIcon: !!i,
-          hasRightIcon: !!a
+          hasRightIcon: !!e
         }),
-        children: e
+        children: l
       }
     ) : /* @__PURE__ */ s(
       "span",
       {
         className: o({
           hasLeftIcon: !!i,
-          hasRightIcon: !!a
+          hasRightIcon: !!e
         })
       }
     ),
-    a ? /* @__PURE__ */ s("div", { className: d, children: /* @__PURE__ */ s(
+    e ? /* @__PURE__ */ s("div", { className: d, children: /* @__PURE__ */ s(
       r,
       {
         severity: "ghost",
         iconOnly: !0,
         size: "xsmall",
-        icon: a,
+        icon: e,
         onClick: m
       }
     ) }) : null

package/dist/shared/{DrawerFooter-DEb2gqW-.js → DrawerFooter-CGrPQoLH.js}

@@ -2,8 +2,8 @@ import { jsx as r, jsxs as c } from "react/jsx-runtime";
 import { Dialog as t } from "@ark-ui/react/dialog";
 import { Portal as y } from "@ark-ui/react/portal";
 import { o as _ } from "./index-ByQ37VXf.js";
-import { B as u } from "./Button-C2ULmKj3.js";
-import { I as $ } from "./IconX-CpPADKjZ.js";
+import { B as u } from "./Button-BqFuDnSs.js";
+import { IconX as $ } from "@tabler/icons-react";
 const k = [
   "left",
   "right",
@@ -58,12 +58,12 @@ const k = [
 	mare:px-6
 	${e.compact ? "mare:h-auto mare:py-4" : "mare:h-14 mare:md:h-16"}
 	${e.border ? "mare:border-b mare:border-default" : ""}
-`, B = "mare:-ml-1.5", I = "mare:-mr-1.5", d = (e) => `
+`, B = "mare:-ml-1.5", L = "mare:-mr-1.5", d = (e) => `
 	mare:grow mare:w-full mare:truncate mare:text-center
 	mare:tpc-typography-label-m mare:text-default
 	${e.hasRightIcon ? "" : "mare:mr-6.5"}
 	${e.hasLeftIcon ? "" : "mare:ml-6.5"}
-`, L = (e) => `
+`, P = (e) => `
 	mare:flex mare:flex-col-reverse mare:sm:flex-row mare:justify-end
 	mare:gap-3 mare:sm:gap-4 mare:w-full
 	mare:*:w-full mare:sm:*:flex-1
@@ -75,8 +75,8 @@ function H({
   onOpenChange: a,
   position: m = "left",
   modal: o = !0,
-  closeOnEscape: s = !0,
-  dismissableMask: l = !0,
+  closeOnEscape: l = !0,
+  dismissableMask: s = !0,
   maskColor: n,
   shadow: p = !0,
   portalContainer: x,
@@ -92,27 +92,36 @@ function H({
       open: e,
       onOpenChange: (g) => a?.(g.open),
       modal: o,
-      closeOnEscape: s,
-      closeOnInteractOutside: l,
+      closeOnEscape: l,
+      closeOnInteractOutside: s,
       "aria-label": w,
       lazyMount: !0,
       unmountOnExit: !0,
       children: /* @__PURE__ */ c(y, { container: x, children: [
         /* @__PURE__ */ r(t.Backdrop, { className: N(n) }),
-        /* @__PURE__ */ r(t.Positioner, { className: C(i), children: /* @__PURE__ */ c(
-          t.Content,
+        /* @__PURE__ */ r(
+          t.Positioner,
           {
-            className: z({ position: i, shadow: p }),
-            style: {
-              "--mare-drawer-from": v(i)
-            },
-            children: [
-              f,
-              /* @__PURE__ */ r("div", { className: D(!!f), children: b }),
-              h
-            ]
+            className: C(i),
+            children: /* @__PURE__ */ c(
+              t.Content,
+              {
+                className: z({
+                  position: i,
+                  shadow: p
+                }),
+                style: {
+                  "--mare-drawer-from": v(i)
+                },
+                children: [
+                  f,
+                  /* @__PURE__ */ r("div", { className: D(!!f), children: b }),
+                  h
+                ]
+              }
+            )
           }
-        ) })
+        )
       ] })
     }
   );
@@ -122,11 +131,11 @@ function M({
   leftIcon: a = /* @__PURE__ */ r($, {}),
   rightIcon: m,
   onLeftIconClick: o,
-  onRightIconClick: s,
-  border: l = !1,
+  onRightIconClick: l,
+  border: s = !1,
   compact: n = !1
 }) {
-  return /* @__PURE__ */ c("div", { className: R({ border: l, compact: n }), children: [
+  return /* @__PURE__ */ c("div", { className: R({ border: s, compact: n }), children: [
     a ? /* @__PURE__ */ r("div", { className: B, children: /* @__PURE__ */ r(t.CloseTrigger, { asChild: !0, children: /* @__PURE__ */ r(
       u,
       {
@@ -155,14 +164,14 @@ function M({
         })
       }
     ),
-    m ? /* @__PURE__ */ r("div", { className: I, children: /* @__PURE__ */ r(
+    m ? /* @__PURE__ */ r("div", { className: L, children: /* @__PURE__ */ r(
       u,
       {
         severity: "ghost",
         iconOnly: !0,
         size: "xsmall",
         icon: m,
-        onClick: s
+        onClick: l
       }
     ) }) : null
   ] });
@@ -171,7 +180,7 @@ function q({
   border: e = !1,
   children: a
 }) {
-  return /* @__PURE__ */ r("div", { className: L(e), children: a });
+  return /* @__PURE__ */ r("div", { className: P(e), children: a });
 }
 export {
   H as D,

package/dist/shared/{ExpandableCounter-pPJIrd6L.js → ExpandableCounter-BOCHfuye.js}

@@ -1,40 +1,41 @@
 import { jsx as r } from "react/jsx-runtime";
-import { B as p } from "./Button-C2ULmKj3.js";
-import { C as x, I as d } from "./Counter-0siKQRKc.js";
-const m = `
+import { IconPlus as p } from "@tabler/icons-react";
+import { B as x } from "./Button-BqFuDnSs.js";
+import { C as d } from "./Counter-lqywtgF6.js";
+const l = `
 	mare:inline-flex mare:origin-left mare:[animation:mare-expandable-counter-enter_100ms_ease-out]
 `, C = (e, a) => e > a;
-function h({
+function k({
   value: e = 0,
   onValueChange: a,
   disabled: o = !1,
   disabledIncrement: t = !1,
   disabledDecrement: c = !1,
-  step: s = 1,
-  id: i,
-  name: l,
+  step: i = 1,
+  id: s,
+  name: m,
   min: n = 0,
-  max: u
+  max: f
 }) {
   return C(e, n) ? /* @__PURE__ */ r(
     "span",
     {
-      className: m,
+      className: l,
       children: /* @__PURE__ */ r(
-        x,
+        d,
         {
           value: e,
-          onValueChange: (f) => a?.(f ?? n),
+          onValueChange: (u) => a?.(u ?? n),
           size: "medium",
           variant: "expandable",
           disabled: o,
           disabledIncrement: t,
           disabledDecrement: c,
-          id: i,
-          name: l,
+          id: s,
+          name: m,
           min: n,
-          max: u,
-          step: s
+          max: f,
+          step: i
         }
       )
     },
@@ -42,19 +43,19 @@ function h({
   ) : /* @__PURE__ */ r(
     "span",
     {
-      className: m,
+      className: l,
       children: /* @__PURE__ */ r(
-        p,
+        x,
         {
           severity: "secondary",
           size: "medium",
           iconOnly: !0,
-          icon: /* @__PURE__ */ r(d, { stroke: 1.5 }),
+          icon: /* @__PURE__ */ r(p, { stroke: 1.5 }),
           disabled: o || t,
           "aria-label": "Increment",
-          id: i,
-          name: l,
-          onClick: () => a?.(e + s)
+          id: s,
+          name: m,
+          onClick: () => a?.(e + i)
         }
       )
     },
@@ -62,5 +63,5 @@ function h({
   );
 }
 export {
-  h as E
+  k as E
 };

package/dist/shared/{FilterChip-TpKF-4vP.js → FilterChip-Cc4BBVz3.js}

@@ -1,10 +1,10 @@
+"use client";
 import { jsxs as v, jsx as a } from "react/jsx-runtime";
-import { useContext as h } from "react";
-import { o as x } from "./index-ByQ37VXf.js";
-import { a as C } from "./FilterChipGroup-BzE-EQsA.js";
-import { c as z } from "./createReactComponent-Cb6Pzf10.js";
-import { I as y } from "./IconChevronDown-ev2ML7Ex.js";
-const k = [["path", { d: "M6 15l6 -6l6 6", key: "svg-0" }]], N = z("outline", "chevron-up", "ChevronUp", k), F = ["medium", "large"], I = `
+import { useContext as x } from "react";
+import { IconChevronUp as h, IconChevronDown as z } from "@tabler/icons-react";
+import { o as C } from "./index-ByQ37VXf.js";
+import { a as y } from "./FilterChipGroup-BzE-EQsA.js";
+const k = ["medium", "large"], F = `
 	mare:group mare:relative mare:inline-flex mare:items-center mare:gap-1.5
 	mare:rounded-full mare:border mare:cursor-pointer mare:select-none
 	mare:tpc-typography-body-s mare:transition-colors mare:duration-150
@@ -22,47 +22,47 @@ const k = [["path", { d: "M6 15l6 -6l6 6", key: "svg-0" }]], N = z("outline", "c
 
 	mare:p-disabled:cursor-not-allowed mare:p-disabled:text-disabled mare:p-disabled:border-disabled-default
 	mare:p-disabled:bg-transparent mare:p-disabled:hover:bg-transparent
-`, j = "mare:truncate mare:px-0.5", G = "mare:flex mare:items-center mare:shrink-0 mare:[&>svg]:size-4 mare:cursor-pointer";
+`, N = "mare:truncate mare:px-0.5", j = "mare:flex mare:items-center mare:shrink-0 mare:[&>svg]:size-4 mare:cursor-pointer";
 function $({
-  value: d,
+  value: n,
   size: c = "medium",
   disabled: t = !1,
   dropdown: e = !1,
   selected: u = !1,
-  onSelectedChange: p,
+  onSelectedChange: f,
   dropdownOpen: r = !1,
-  onDropdownOpenChange: f,
+  onDropdownOpenChange: p,
   onToggleDropdown: b,
   children: s
 }) {
-  const g = x(c, F, "medium"), o = h(C), m = d ?? (typeof s == "string" ? s : ""), l = !!o && !e, i = e ? !1 : l ? o.isSelected(m) : u;
+  const g = C(c, k, "medium"), i = x(y), m = n ?? (typeof s == "string" ? s : ""), o = !!i && !e, l = e ? !1 : o ? i.isSelected(m) : u;
   return /* @__PURE__ */ v(
     "button",
     {
       type: "button",
-      className: I,
+      className: F,
       "data-size": g,
-      "data-selected": i ? "true" : void 0,
+      "data-selected": l ? "true" : void 0,
       "data-disabled": t ? "true" : void 0,
       disabled: t,
-      "aria-pressed": e ? void 0 : i,
+      "aria-pressed": e ? void 0 : l,
       "aria-expanded": e ? r : void 0,
-      onClick: (n) => {
+      onClick: (d) => {
         if (!t) {
           if (e) {
-            f?.(!r), b?.(n, n.currentTarget);
+            p?.(!r), b?.(d, d.currentTarget);
             return;
           }
-          if (l) {
-            o.toggle(m);
+          if (o) {
+            i.toggle(m);
             return;
           }
-          p?.(!i);
+          f?.(!l);
         }
       },
       children: [
-        /* @__PURE__ */ a("span", { className: j, children: s }),
-        e && /* @__PURE__ */ a("span", { className: G, children: r ? /* @__PURE__ */ a(N, { size: "1em" }) : /* @__PURE__ */ a(y, { size: "1em" }) })
+        /* @__PURE__ */ a("span", { className: N, children: s }),
+        e && /* @__PURE__ */ a("span", { className: j, children: r ? /* @__PURE__ */ a(h, { size: "1em" }) : /* @__PURE__ */ a(z, { size: "1em" }) })
       ]
     }
   );

package/dist/shared/{FilterChipDropdownMultiple-2mr_Z57i.js → FilterChipDropdownMultiple-DL3mHW9H.js}

@@ -1,10 +1,10 @@
+"use client";
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import { useState as I, useMemo as g } from "react";
-import { createListCollection as z, SelectRoot as D, SelectControl as _, SelectTrigger as j, SelectPositioner as O, SelectContent as $, SelectItem as q, SelectItemText as E } from "@ark-ui/react/select";
-import { C as x } from "./Checkbox-DCq3_MWz.js";
-import { o as F } from "./index-ByQ37VXf.js";
-import { I as M } from "./IconChevronDown-ev2ML7Ex.js";
-import { I as P } from "./IconSearch-CgM6jEUh.js";
+import { useState as z, useMemo as g } from "react";
+import { createListCollection as D, SelectRoot as I, SelectControl as _, SelectTrigger as j, SelectPositioner as O, SelectContent as $, SelectItem as q, SelectItemText as E } from "@ark-ui/react/select";
+import { IconChevronDown as F, IconSearch as M } from "@tabler/icons-react";
+import { C as x } from "./Checkbox-DgZAQsbr.js";
+import { o as P } from "./index-ByQ37VXf.js";
 const T = ["medium", "large"], B = {
   medium: "mare:h-10",
   large: "mare:h-12"
@@ -46,10 +46,13 @@ const T = ["medium", "large"], B = {
   const a = r.filter((o) => !o.disabled).map((o) => o.value), l = m.filter((o) => !a.includes(o));
   return y(r, m) ? l : [...l, ...a];
 }, Z = (r, m) => r.filter((a) => m.includes(a.value)).map((a) => a.label).join(", ");
-function oe({
+function le({
   value: r = [],
   onValueChange: m,
-  options: a,
+  /* Default a [] aunque el tipo diga que es requerido: `items={data}`
+   * con data de un fetch sin resolver llega `undefined` en el primer
+   * render y el .map() de abajo tiraba pantalla blanca. */
+  options: a = [],
   placeholder: l = "Select…",
   size: o = "medium",
   disabled: k = !1,
@@ -60,14 +63,14 @@ function oe({
   showToggleAll: c = !1,
   renderOption: h
 }) {
-  const w = F(o, T, "medium"), [u, b] = I(""), n = g(() => {
+  const w = P(o, T, "medium"), [u, b] = z(""), n = g(() => {
     if (!s) return a;
     const e = u.trim().toLowerCase();
     return e ? a.filter(
       (p) => p.label.toLowerCase().includes(e)
     ) : a;
   }, [s, u, a]), S = g(
-    () => z({
+    () => D({
       items: n,
       itemToValue: (e) => e.value,
       itemToString: (e) => e.label,
@@ -76,7 +79,7 @@ function oe({
     [n]
   ), C = Z(a, r), N = y(n, r);
   return /* @__PURE__ */ i(
-    D,
+    I,
     {
       multiple: !0,
       closeOnSelect: !1,
@@ -91,7 +94,7 @@ function oe({
       children: [
         /* @__PURE__ */ t(_, { children: /* @__PURE__ */ i(j, { className: L(w), children: [
           /* @__PURE__ */ t("span", { className: Q, children: C || l }),
-          /* @__PURE__ */ t("span", { className: R, children: /* @__PURE__ */ t(M, { size: "1em" }) })
+          /* @__PURE__ */ t("span", { className: R, children: /* @__PURE__ */ t(F, { size: "1em" }) })
         ] }) }),
         /* @__PURE__ */ t(O, { children: /* @__PURE__ */ i($, { className: V, children: [
           s && /* @__PURE__ */ i("div", { className: G, children: [
@@ -100,14 +103,16 @@ function oe({
               {
                 className: H,
                 value: u,
-                onChange: (e) => b(e.target.value),
+                onChange: (e) => {
+                  b(e.target.value);
+                },
                 onKeyDown: (e) => {
                   e.key === "Enter" && e.preventDefault(), e.key !== "Escape" && e.stopPropagation();
                 },
                 placeholder: "Buscar…"
               }
             ),
-            /* @__PURE__ */ t("span", { className: J, children: /* @__PURE__ */ t(P, { size: "1em" }) })
+            /* @__PURE__ */ t("span", { className: J, children: /* @__PURE__ */ t(M, { size: "1em" }) })
           ] }),
           (c || d) && /* @__PURE__ */ i(
             "div",
@@ -159,5 +164,5 @@ function oe({
   );
 }
 export {
-  oe as F
+  le as F
 };

package/dist/shared/{FilterChipDropdownSingle-CLmWzX9q.js → FilterChipDropdownSingle-BUrzUAmy.js}

@@ -1,11 +1,9 @@
+"use client";
 import { jsxs as r, jsx as a } from "react/jsx-runtime";
 import { useState as y, useMemo as u } from "react";
-import { createListCollection as S, SelectRoot as I, SelectControl as N, SelectTrigger as C, SelectValueText as z, SelectClearTrigger as T, SelectIndicator as D, SelectPositioner as _, SelectContent as $, SelectItem as j, SelectItemText as L, SelectItemIndicator as V } from "@ark-ui/react/select";
-import { o as q } from "./index-ByQ37VXf.js";
-import { I as E } from "./IconX-CpPADKjZ.js";
-import { I as F } from "./IconChevronDown-ev2ML7Ex.js";
-import { I as P } from "./IconSearch-CgM6jEUh.js";
-import { I as B } from "./IconCheck-DzZA6b2U.js";
+import { createListCollection as S, SelectRoot as N, SelectControl as C, SelectTrigger as I, SelectValueText as z, SelectClearTrigger as T, SelectIndicator as D, SelectPositioner as _, SelectContent as $, SelectItem as j, SelectItemText as L, SelectItemIndicator as V } from "@ark-ui/react/select";
+import { IconX as q, IconChevronDown as E, IconSearch as F, IconCheck as P } from "@tabler/icons-react";
+import { o as B } from "./index-ByQ37VXf.js";
 const K = ["medium", "large"], M = {
   medium: "mare:h-10",
   large: "mare:h-12"
@@ -42,10 +40,13 @@ const K = ["medium", "large"], M = {
 	mare:ark-selected:bg-accent-weak mare:ark-selected:text-accent
 	mare:ark-disabled:text-disabled mare:ark-disabled:cursor-not-allowed
 `, ee = "mare:flex mare:items-center mare:text-accent", ae = "mare:py-2 mare:px-3 mare:tpc-typography-body-s mare:text-weak";
-function ce({
+function ie({
   value: t = null,
   onValueChange: o,
-  options: m,
+  /* Default a [] aunque el tipo diga que es requerido: `items={data}`
+   * con data de un fetch sin resolver llega `undefined` en el primer
+   * render y el .map() de abajo tiraba pantalla blanca. */
+  options: m = [],
   placeholder: f = "Select…",
   size: p = "medium",
   disabled: h = !1,
@@ -56,7 +57,7 @@ function ce({
   checkIcon: x,
   clearIcon: g
 }) {
-  const w = q(p, K, "medium"), [n, d] = y(""), l = u(() => {
+  const w = B(p, K, "medium"), [n, d] = y(""), l = u(() => {
     if (!i) return m;
     const e = n.trim().toLowerCase();
     return e ? m.filter((k) => k.label.toLowerCase().includes(e)) : m;
@@ -70,7 +71,7 @@ function ce({
     [l]
   );
   return /* @__PURE__ */ r(
-    I,
+    N,
     {
       collection: v,
       value: t == null ? [] : [t],
@@ -81,17 +82,23 @@ function ce({
         e.open || d("");
       },
       children: [
-        /* @__PURE__ */ r(N, { className: R(), children: [
-          /* @__PURE__ */ a(C, { className: X(w, s), children: /* @__PURE__ */ a(
-            z,
+        /* @__PURE__ */ r(C, { className: R(), children: [
+          /* @__PURE__ */ a(
+            I,
             {
-              className: A,
-              placeholder: f
+              className: X(w, s),
+              children: /* @__PURE__ */ a(
+                z,
+                {
+                  className: A,
+                  placeholder: f
+                }
+              )
             }
-          ) }),
+          ),
           /* @__PURE__ */ r("div", { className: G, children: [
-            s && /* @__PURE__ */ a(T, { className: H, children: g ?? /* @__PURE__ */ a(E, { size: "1em" }) }),
-            /* @__PURE__ */ a(D, { className: J, children: /* @__PURE__ */ a(F, { size: "1em" }) })
+            s && /* @__PURE__ */ a(T, { className: H, children: g ?? /* @__PURE__ */ a(q, { size: "1em" }) }),
+            /* @__PURE__ */ a(D, { className: J, children: /* @__PURE__ */ a(E, { size: "1em" }) })
           ] })
         ] }),
         /* @__PURE__ */ a(_, { children: /* @__PURE__ */ r($, { className: O, children: [
@@ -101,14 +108,16 @@ function ce({
               {
                 className: W,
                 value: n,
-                onChange: (e) => d(e.target.value),
+                onChange: (e) => {
+                  d(e.target.value);
+                },
                 onKeyDown: (e) => {
                   e.key === "Enter" && e.preventDefault(), e.key !== "Escape" && e.stopPropagation();
                 },
                 placeholder: "Buscar…"
               }
             ),
-            /* @__PURE__ */ a("span", { className: Y, children: /* @__PURE__ */ a(P, { size: "1em" }) })
+            /* @__PURE__ */ a("span", { className: Y, children: /* @__PURE__ */ a(F, { size: "1em" }) })
           ] }),
           l.length === 0 && /* @__PURE__ */ a("div", { className: ae, children: "Sin resultados" }),
           l.map((e) => /* @__PURE__ */ r(
@@ -122,7 +131,7 @@ function ce({
                   V,
                   {
                     className: ee,
-                    children: x ?? /* @__PURE__ */ a(B, { size: "1em" })
+                    children: x ?? /* @__PURE__ */ a(P, { size: "1em" })
                   }
                 )
               ]
@@ -135,5 +144,5 @@ function ce({
   );
 }
 export {
-  ce as F
+  ie as F
 };

package/dist/shared/FloatingActionButton-Dhqp98s7.js

@@ -0,0 +1,27 @@
+import { jsx as n } from "react/jsx-runtime";
+import { B as e } from "./Button-BqFuDnSs.js";
+import { o as a } from "./index-ByQ37VXf.js";
+import { forwardRef as m } from "react";
+const s = [
+  "primary",
+  "secondary"
+], d = m(function({ severity: r = "primary", ...o }, t) {
+  const i = a(
+    r,
+    s,
+    "primary"
+  );
+  return /* @__PURE__ */ n(
+    e,
+    {
+      ref: t,
+      ...o,
+      severity: i,
+      raised: !0,
+      rounded: !0
+    }
+  );
+});
+export {
+  d as F
+};

package/dist/shared/{HelperText-zmUym82m.js → HelperText-C9TsD0wC.js}

@@ -1,3 +1,4 @@
+"use client";
 import { jsxs as i, jsx as r, Fragment as m } from "react/jsx-runtime";
 import { useFieldContext as s, FieldRoot as c, FieldLabel as d, FieldErrorText as u, FieldHelperText as h } from "@ark-ui/react/field";
 import { x as f, g, F as x, p as l, _ as y } from "./field-layout-o6bDLvVU.js";