@tpc-mare/mare-ui-components-react 0.1.25 → 0.1.28

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

@@ -1,56 +1,57 @@
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import { useState as N, useMemo as x } from "react";
-import { createListCollection as I, SelectRoot as D, SelectControl as z, SelectTrigger as _, SelectPositioner as j, SelectContent as O, SelectItem as q, SelectItemText as E } from "@ark-ui/react/select";
-import { C as g } from "./Checkbox-BXnSN2vK.js";
-import { I as F } from "./IconChevronDown-ev2ML7Ex.js";
-import { I as M } from "./IconSearch-CgM6jEUh.js";
-const P = {
+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";
+const T = ["medium", "large"], B = {
   medium: "mare:h-10",
   large: "mare:h-12"
-}, T = {
+}, K = {
   medium: "mare:px-3.5",
   large: "mare:px-4"
-}, $ = (r) => `
+}, L = (r) => `
 	mare:group mare:inline-flex mare:items-center mare:gap-1.5 mare:max-w-full
 	mare:rounded-full mare:border mare:cursor-pointer mare:select-none
 	mare:tpc-typography-body-s mare:transition-colors mare:duration-150
-	${P[r]} ${T[r]}
+	${B[r]} ${K[r]}
 	mare:bg-default mare:text-default mare:border-default
 	mare:ark-open:outline-solid mare:ark-open:outline-2 mare:ark-open:outline-accent mare:ark-open:-outline-offset-2
 	mare:not-ark-disabled:hover:bg-hover
 	mare:ark-disabled:cursor-not-allowed mare:ark-disabled:text-disabled mare:ark-disabled:border-disabled-default
 	mare:data-[invalid]:outline-solid mare:data-[invalid]:outline-2 mare:data-[invalid]:outline-danger mare:data-[invalid]:-outline-offset-2
-`, B = "mare:truncate mare:data-[placeholder-shown]:text-weak", K = "mare:flex mare:items-center mare:shrink-0 mare:[&>svg]:size-4 mare:transition-transform mare:ark-open:rotate-180", L = `
+`, Q = "mare:truncate mare:data-[placeholder-shown]:text-weak", R = "mare:flex mare:items-center mare:shrink-0 mare:[&>svg]:size-4 mare:transition-transform mare:ark-open:rotate-180", V = `
 	mare:flex mare:flex-col mare:gap-0.5 mare:p-1
 	mare:rounded-input mare:border mare:border-default mare:bg-raised
 	mare:shadow-[0_2px_6px_0_rgba(0,0,0,0.16)]
 	mare:max-h-72 mare:overflow-y-auto
 	mare:min-w-[var(--reference-width)]
 	mare:z-50
-`, Q = `
+`, G = `
 	mare:flex mare:items-center mare:gap-2 mare:mb-1 mare:px-3 mare:h-10
 	mare:rounded-input mare:border mare:border-strong mare:bg-default
 	mare:focus-within:outline-solid mare:focus-within:outline-2 mare:focus-within:outline-accent mare:focus-within:-outline-offset-2
-`, R = "mare:flex-auto mare:bg-transparent mare:outline-none mare:text-default mare:placeholder:text-weak mare:tpc-typography-body-s", V = "mare:flex mare:items-center mare:shrink-0 mare:text-weak", G = "mare:flex mare:items-center mare:gap-2 mare:py-2 mare:px-3 mare:mb-0.5 mare:rounded-menu-item mare:cursor-pointer mare:hover:bg-hover mare:tpc-typography-body-s mare:text-default", H = `
+`, H = "mare:flex-auto mare:bg-transparent mare:outline-none mare:text-default mare:placeholder:text-weak mare:tpc-typography-body-s", J = "mare:flex mare:items-center mare:shrink-0 mare:text-weak", U = "mare:flex mare:items-center mare:gap-2 mare:py-2 mare:px-3 mare:mb-0.5 mare:rounded-menu-item mare:cursor-pointer mare:hover:bg-hover mare:tpc-typography-body-s mare:text-default", W = `
 	mare:group/option mare:flex mare:items-center mare:gap-2
 	mare:w-full mare:min-h-8 mare:py-2 mare:px-3 mare:cursor-pointer mare:rounded-menu-item
 	mare:tpc-typography-body-s mare:text-default
 	mare:ark-highlighted:bg-hover
 	mare:ark-selected:bg-accent-weak mare:ark-selected:text-accent
 	mare:ark-disabled:text-disabled mare:ark-disabled:cursor-not-allowed
-`, J = "mare:py-2 mare:px-3 mare:tpc-typography-body-s mare:text-weak", y = (r, m) => {
+`, X = "mare:py-2 mare:px-3 mare:tpc-typography-body-s mare:text-weak", y = (r, m) => {
   const a = r.filter((l) => !l.disabled);
   return a.length > 0 && a.every((l) => m.includes(l.value));
-}, U = (r, m) => {
-  const a = r.filter((n) => !n.disabled).map((n) => n.value), l = m.filter((n) => !a.includes(n));
+}, Y = (r, m) => {
+  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];
-}, W = (r, m) => r.filter((a) => m.includes(a.value)).map((a) => a.label).join(", ");
-function ae({
+}, Z = (r, m) => r.filter((a) => m.includes(a.value)).map((a) => a.label).join(", ");
+function oe({
   value: r = [],
   onValueChange: m,
   options: a,
   placeholder: l = "Select…",
-  size: n = "medium",
+  size: o = "medium",
   disabled: k = !1,
   invalid: v = !1,
   filter: s = !1,
@@ -59,27 +60,27 @@ function ae({
   showToggleAll: c = !1,
   renderOption: h
 }) {
-  const [u, b] = N(""), o = x(() => {
+  const w = F(o, T, "medium"), [u, b] = I(""), 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]), w = x(
-    () => I({
-      items: o,
+  }, [s, u, a]), S = g(
+    () => z({
+      items: n,
       itemToValue: (e) => e.value,
       itemToString: (e) => e.label,
       isItemDisabled: (e) => !!e.disabled
     }),
-    [o]
-  ), S = W(a, r), C = y(o, r);
+    [n]
+  ), C = Z(a, r), N = y(n, r);
   return /* @__PURE__ */ i(
     D,
     {
       multiple: !0,
       closeOnSelect: !1,
-      collection: w,
+      collection: S,
       value: r,
       disabled: k,
       invalid: v,
@@ -88,16 +89,16 @@ function ae({
         e.open || b("");
       },
       children: [
-        /* @__PURE__ */ t(z, { children: /* @__PURE__ */ i(_, { className: $(n), children: [
-          /* @__PURE__ */ t("span", { className: B, children: S || l }),
-          /* @__PURE__ */ t("span", { className: K, children: /* @__PURE__ */ t(F, { size: "1em" }) })
+        /* @__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(j, { children: /* @__PURE__ */ i(O, { className: L, children: [
-          s && /* @__PURE__ */ i("div", { className: Q, children: [
+        /* @__PURE__ */ t(O, { children: /* @__PURE__ */ i($, { className: V, children: [
+          s && /* @__PURE__ */ i("div", { className: G, children: [
             /* @__PURE__ */ t(
               "input",
               {
-                className: R,
+                className: H,
                 value: u,
                 onChange: (e) => b(e.target.value),
                 onKeyDown: (e) => {
@@ -106,23 +107,23 @@ function ae({
                 placeholder: "Buscar…"
               }
             ),
-            /* @__PURE__ */ t("span", { className: V, children: /* @__PURE__ */ t(M, { size: "1em" }) })
+            /* @__PURE__ */ t("span", { className: J, children: /* @__PURE__ */ t(P, { size: "1em" }) })
           ] }),
           (c || d) && /* @__PURE__ */ i(
             "div",
             {
-              className: G,
+              className: U,
               onClick: c ? () => m?.(
-                U(
-                  o,
+                Y(
+                  n,
                   r
                 )
               ) : void 0,
               children: [
                 c && f && /* @__PURE__ */ t(
-                  g,
+                  x,
                   {
-                    checked: C,
+                    checked: N,
                     readOnly: !0
                   }
                 ),
@@ -130,17 +131,17 @@ function ae({
               ]
             }
           ),
-          o.length === 0 && /* @__PURE__ */ t("div", { className: J, children: "Sin resultados" }),
-          o.map((e) => {
+          n.length === 0 && /* @__PURE__ */ t("div", { className: X, children: "Sin resultados" }),
+          n.map((e) => {
             const p = r.includes(e.value);
             return /* @__PURE__ */ i(
               q,
               {
                 item: e,
-                className: H,
+                className: W,
                 children: [
                   f && /* @__PURE__ */ t(
-                    g,
+                    x,
                     {
                       checked: p,
                       readOnly: !0
@@ -158,5 +159,5 @@ function ae({
   );
 }
 export {
-  ae as F
+  oe as F
 };

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

@@ -1,47 +1,48 @@
 import { jsxs as r, jsx as a } from "react/jsx-runtime";
-import { useState as k, useMemo as u } from "react";
-import { createListCollection as y, SelectRoot as S, SelectControl as I, SelectTrigger as N, SelectValueText as C, SelectClearTrigger as z, SelectIndicator as T, SelectPositioner as D, SelectContent as _, SelectItem as j, SelectItemText as L, SelectItemIndicator as V } from "@ark-ui/react/select";
-import { I as $ } from "./IconX-CpPADKjZ.js";
-import { I as q } from "./IconChevronDown-ev2ML7Ex.js";
-import { I as E } from "./IconSearch-CgM6jEUh.js";
-import { I as F } from "./IconCheck-DzZA6b2U.js";
-const P = {
+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";
+const K = ["medium", "large"], M = {
   medium: "mare:h-10",
   large: "mare:h-12"
-}, B = {
+}, Q = {
   medium: "mare:pl-3.5",
   large: "mare:pl-4"
-}, K = () => "mare:relative mare:inline-flex mare:items-center mare:max-w-full", M = (t, o) => `
+}, R = () => "mare:relative mare:inline-flex mare:items-center mare:max-w-full", X = (t, o) => `
 	mare:w-full mare:flex mare:items-center mare:cursor-pointer mare:select-none mare:text-left mare:min-w-0
 	mare:rounded-full mare:border
 	mare:tpc-typography-body-s mare:transition-colors mare:duration-150
-	${P[t]}
-	${B[t]} ${o ? "mare:pr-14" : "mare:pr-8"}
+	${M[t]}
+	${Q[t]} ${o ? "mare:pr-14" : "mare:pr-8"}
 	mare:bg-default mare:text-default mare:border-default
 	mare:focus-visible:outline-solid mare:focus-visible:outline-2 mare:focus-visible:outline-accent mare:focus-visible:-outline-offset-2
 	mare:not-ark-disabled:hover:bg-hover
 	mare:ark-disabled:cursor-not-allowed mare:ark-disabled:text-disabled mare:ark-disabled:border-disabled-default
 	mare:data-[invalid]:outline-solid mare:data-[invalid]:outline-2 mare:data-[invalid]:outline-danger mare:data-[invalid]:-outline-offset-2
-`, Q = "mare:truncate mare:data-[placeholder-shown]:text-weak", R = "mare:absolute mare:right-3.5 mare:top-1/2 mare:-translate-y-1/2 mare:flex mare:items-center mare:gap-1.5 mare:pointer-events-none", X = "mare:pointer-events-auto mare:flex mare:items-center mare:shrink-0 mare:text-base mare:cursor-pointer mare:hover:text-weak", A = "mare:flex mare:items-center mare:shrink-0 mare:[&>svg]:size-4 mare:transition-transform mare:ark-open:rotate-180", G = `
+`, A = "mare:truncate mare:data-[placeholder-shown]:text-weak", G = "mare:absolute mare:right-3.5 mare:top-1/2 mare:-translate-y-1/2 mare:flex mare:items-center mare:gap-1.5 mare:pointer-events-none", H = "mare:pointer-events-auto mare:flex mare:items-center mare:shrink-0 mare:text-base mare:cursor-pointer mare:hover:text-weak", J = "mare:flex mare:items-center mare:shrink-0 mare:[&>svg]:size-4 mare:transition-transform mare:ark-open:rotate-180", O = `
 	mare:flex mare:flex-col mare:gap-0.5 mare:p-1
 	mare:rounded-input mare:border mare:border-default mare:bg-raised
 	mare:shadow-[0_2px_6px_0_rgba(0,0,0,0.16)]
 	mare:max-h-72 mare:overflow-y-auto
 	mare:min-w-[var(--reference-width)]
 	mare:z-50
-`, H = `
+`, U = `
 	mare:flex mare:items-center mare:gap-2 mare:mb-1 mare:px-3 mare:h-10
 	mare:rounded-input mare:border mare:border-strong mare:bg-default
 	mare:focus-within:outline-solid mare:focus-within:outline-2 mare:focus-within:outline-accent mare:focus-within:-outline-offset-2
-`, J = "mare:flex-auto mare:bg-transparent mare:outline-none mare:text-default mare:placeholder:text-weak mare:tpc-typography-body-s", O = "mare:flex mare:items-center mare:shrink-0 mare:text-weak", U = `
+`, W = "mare:flex-auto mare:bg-transparent mare:outline-none mare:text-default mare:placeholder:text-weak mare:tpc-typography-body-s", Y = "mare:flex mare:items-center mare:shrink-0 mare:text-weak", Z = `
 	mare:group/option mare:flex mare:items-center mare:justify-between mare:gap-2
 	mare:w-full mare:min-h-8 mare:py-2 mare:px-3 mare:cursor-pointer mare:rounded-menu-item
 	mare:tpc-typography-body-s mare:text-default
 	mare:ark-highlighted:bg-hover
 	mare:ark-selected:bg-accent-weak mare:ark-selected:text-accent
 	mare:ark-disabled:text-disabled mare:ark-disabled:cursor-not-allowed
-`, W = "mare:flex mare:items-center mare:text-accent", Y = "mare:py-2 mare:px-3 mare:tpc-typography-body-s mare:text-weak";
-function oe({
+`, 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({
   value: t = null,
   onValueChange: o,
   options: m,
@@ -55,12 +56,12 @@ function oe({
   checkIcon: x,
   clearIcon: g
 }) {
-  const [n, d] = k(""), l = u(() => {
+  const w = q(p, K, "medium"), [n, d] = y(""), l = u(() => {
     if (!i) return m;
     const e = n.trim().toLowerCase();
-    return e ? m.filter((v) => v.label.toLowerCase().includes(e)) : m;
-  }, [i, n, m]), w = u(
-    () => y({
+    return e ? m.filter((k) => k.label.toLowerCase().includes(e)) : m;
+  }, [i, n, m]), v = u(
+    () => S({
       items: l,
       itemToValue: (e) => e.value,
       itemToString: (e) => e.label,
@@ -69,9 +70,9 @@ function oe({
     [l]
   );
   return /* @__PURE__ */ r(
-    S,
+    I,
     {
-      collection: w,
+      collection: v,
       value: t == null ? [] : [t],
       disabled: h,
       invalid: b,
@@ -80,25 +81,25 @@ function oe({
         e.open || d("");
       },
       children: [
-        /* @__PURE__ */ r(I, { className: K(), children: [
-          /* @__PURE__ */ a(N, { className: M(p, s), children: /* @__PURE__ */ a(
-            C,
+        /* @__PURE__ */ r(N, { className: R(), children: [
+          /* @__PURE__ */ a(C, { className: X(w, s), children: /* @__PURE__ */ a(
+            z,
             {
-              className: Q,
+              className: A,
               placeholder: f
             }
           ) }),
-          /* @__PURE__ */ r("div", { className: R, children: [
-            s && /* @__PURE__ */ a(z, { className: X, children: g ?? /* @__PURE__ */ a($, { size: "1em" }) }),
-            /* @__PURE__ */ a(T, { className: A, children: /* @__PURE__ */ a(q, { size: "1em" }) })
+          /* @__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" }) })
           ] })
         ] }),
-        /* @__PURE__ */ a(D, { children: /* @__PURE__ */ r(_, { className: G, children: [
-          i && /* @__PURE__ */ r("div", { className: H, children: [
+        /* @__PURE__ */ a(_, { children: /* @__PURE__ */ r($, { className: O, children: [
+          i && /* @__PURE__ */ r("div", { className: U, children: [
             /* @__PURE__ */ a(
               "input",
               {
-                className: J,
+                className: W,
                 value: n,
                 onChange: (e) => d(e.target.value),
                 onKeyDown: (e) => {
@@ -107,21 +108,21 @@ function oe({
                 placeholder: "Buscar…"
               }
             ),
-            /* @__PURE__ */ a("span", { className: O, children: /* @__PURE__ */ a(E, { size: "1em" }) })
+            /* @__PURE__ */ a("span", { className: Y, children: /* @__PURE__ */ a(P, { size: "1em" }) })
           ] }),
-          l.length === 0 && /* @__PURE__ */ a("div", { className: Y, children: "Sin resultados" }),
+          l.length === 0 && /* @__PURE__ */ a("div", { className: ae, children: "Sin resultados" }),
           l.map((e) => /* @__PURE__ */ r(
             j,
             {
               item: e,
-              className: U,
+              className: Z,
               children: [
                 /* @__PURE__ */ a(L, { children: c ? c(e) : e.label }),
                 /* @__PURE__ */ a(
                   V,
                   {
-                    className: W,
-                    children: x ?? /* @__PURE__ */ a(F, { size: "1em" })
+                    className: ee,
+                    children: x ?? /* @__PURE__ */ a(B, { size: "1em" })
                   }
                 )
               ]
@@ -134,5 +135,5 @@ function oe({
   );
 }
 export {
-  oe as F
+  ce as F
 };

package/dist/shared/FloatingActionButton-BWB5Taeg.js

@@ -0,0 +1,28 @@
+import { jsx as e } from "react/jsx-runtime";
+import { a as i, B as n } from "./Button-C2ULmKj3.js";
+import { o as a } from "./index-ByQ37VXf.js";
+const s = i.filter(
+  (r) => r !== "ghost" && r !== "danger"
+);
+function p({
+  severity: r = "primary",
+  ...t
+}) {
+  const o = a(
+    r,
+    s,
+    "primary"
+  );
+  return /* @__PURE__ */ e(
+    n,
+    {
+      ...t,
+      severity: o,
+      raised: !0,
+      rounded: !0
+    }
+  );
+}
+export {
+  p as F
+};

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

@@ -1,6 +1,6 @@
 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, h as y } from "./field-layout-D34MpDMB.js";
+import { x as f, g, F as x, p as l, _ as y } from "./field-layout-o6bDLvVU.js";
 function L({ value: e, max: o }) {
   const a = s()?.disabled ?? !1;
   return /* @__PURE__ */ i("span", { className: f(a), children: [

package/dist/shared/IconField-CqKydKep.js

@@ -0,0 +1,81 @@
+import { jsx as l, jsxs as L } from "react/jsx-runtime";
+import { useFieldContext as b, FieldInput as v, FieldRoot as I } from "@ark-ui/react/field";
+import { m as N } from "./InputText.types-KhlkzHMw-BtRY371_.js";
+import { u as f, d as g, m as x, f as y, F as C } from "./field-layout-o6bDLvVU.js";
+import { o as d } from "./index-ByQ37VXf.js";
+function _({
+  value: o = "",
+  onValueChange: r,
+  size: s = "medium",
+  rounded: e = !1,
+  invalid: c = !1,
+  disabled: m = !1,
+  placeholder: a,
+  ...i
+}) {
+  const t = f(), n = !b(), h = d(s, N, "medium"), p = g({
+    size: h,
+    rounded: e,
+    hasFloatLabel: t?.hasFloatLabel ?? !1,
+    iconSide: t?.iconSide ?? null
+  }), F = t?.hasFloatLabel ? " " : a, u = /* @__PURE__ */ l(
+    v,
+    {
+      ...i,
+      className: p,
+      placeholder: F,
+      value: o,
+      onChange: (S) => r?.(S.target.value)
+    }
+  );
+  return n ? /* @__PURE__ */ l(
+    I,
+    {
+      invalid: c,
+      disabled: m,
+      className: "mare:w-full",
+      children: u
+    }
+  ) : u;
+}
+const P = ["left", "right"];
+function D({
+  icon: o,
+  position: r = "left",
+  disabled: s = !1,
+  onIconClick: e,
+  iconLabel: c,
+  children: m
+}) {
+  const a = d(r, P, "left"), i = f(), t = {
+    hasFloatLabel: i?.hasFloatLabel ?? !1,
+    iconSide: x(i?.iconSide ?? null, a)
+  }, n = y(a, {
+    disabled: s,
+    interactive: !!e
+  });
+  return /* @__PURE__ */ l(C.Provider, { value: t, children: /* @__PURE__ */ L(
+    "div",
+    {
+      className: `mare:relative mare:w-full mare:group ${a === "left" ? "mare-icon-left" : "mare-icon-right"}`,
+      children: [
+        m,
+        e ? /* @__PURE__ */ l(
+          "button",
+          {
+            type: "button",
+            disabled: s,
+            onClick: e,
+            "aria-label": c,
+            className: n,
+            children: o
+          }
+        ) : /* @__PURE__ */ l("span", { className: n, children: o })
+      ]
+    }
+  ) });
+}
+export {
+  D as I,
+  _ as a
+};

package/dist/shared/ImageItem-CL2VGEha.js

@@ -0,0 +1,19 @@
+import { jsx as r } from "react/jsx-runtime";
+import { o as t } from "./index-ByQ37VXf.js";
+const o = ["4:3", "1:1", "5:4", "3:2", "free"], s = {
+  "4:3": "mare:aspect-[4/3]",
+  "1:1": "mare:aspect-square",
+  "5:4": "mare:aspect-[5/4]",
+  "3:2": "mare:aspect-[3/2]",
+  free: "mare:aspect-auto"
+}, c = (e) => `
+	mare:w-full mare:[&_img]:h-full mare:[&_img]:w-full mare:[&_img]:object-cover
+	${s[e]}
+`;
+function p({ ratio: e = "4:3", children: a }) {
+  const m = t(e, o, "4:3");
+  return /* @__PURE__ */ r("div", { className: c(m), children: a });
+}
+export {
+  p as I
+};

package/dist/shared/InputNumber-nxus9h5s.js

@@ -0,0 +1,64 @@
+import { jsx as a } from "react/jsx-runtime";
+import { NumberInput as t } from "@ark-ui/react/number-input";
+import { useFieldContext as g } from "@ark-ui/react/field";
+import { m as y } from "./InputText.types-KhlkzHMw-BtRY371_.js";
+import { u as z, d as j } from "./field-layout-o6bDLvVU.js";
+import { o as w } from "./index-ByQ37VXf.js";
+function B({
+  value: o = null,
+  onValueChange: n,
+  size: u = "medium",
+  rounded: i = !1,
+  invalid: r,
+  disabled: s,
+  readOnly: m,
+  step: c = 1,
+  clampValueOnBlur: f = !0,
+  placeholder: d,
+  id: p,
+  name: h,
+  min: b,
+  max: v,
+  formatOptions: F,
+  locale: N,
+  allowMouseWheel: S
+}) {
+  const e = z(), I = !g(), L = w(u, y, "medium"), x = j({
+    size: L,
+    rounded: i,
+    hasFloatLabel: e?.hasFloatLabel ?? !1,
+    iconSide: e?.iconSide ?? null
+  }), C = e?.hasFloatLabel ? " " : d;
+  return /* @__PURE__ */ a(
+    t.Root,
+    {
+      value: o == null ? "" : String(o),
+      min: b,
+      max: v,
+      step: c,
+      formatOptions: F,
+      locale: N,
+      allowMouseWheel: S,
+      clampValueOnBlur: f,
+      disabled: s,
+      readOnly: m,
+      name: h,
+      invalid: I ? r : void 0,
+      className: "mare:w-full",
+      onValueChange: (l) => n?.(
+        l.value === "" ? null : l.valueAsNumber
+      ),
+      children: /* @__PURE__ */ a(
+        t.Input,
+        {
+          id: p,
+          className: x,
+          placeholder: C
+        }
+      )
+    }
+  );
+}
+export {
+  B as I
+};

package/dist/shared/{InputOtp-CUXXVP2E.js → InputOtp-BxBc6Vhs.js}

@@ -1,10 +1,11 @@
-import { jsxs as I, jsx as m } from "react/jsx-runtime";
+import { jsxs as j, jsx as m } from "react/jsx-runtime";
 import { PinInput as a } from "@ark-ui/react/pin-input";
-const j = "mare:flex mare:items-center mare:gap-2", w = {
+import { o as w } from "./index-ByQ37VXf.js";
+const k = "mare:flex mare:items-center mare:gap-2", A = {
   small: "mare:w-10 mare:h-10 mare:px-3",
   medium: "mare:w-12 mare:h-12 mare:px-3.5",
   large: "mare:w-14 mare:h-14 mare:px-3"
-}, k = (e) => `
+}, N = (e) => `
 	mare:text-center mare:tpc-typography-body-m
 	mare:appearance-none mare:rounded-input mare:outline-none
 	mare:text-default mare:placeholder:text-weak
@@ -13,9 +14,9 @@ const j = "mare:flex mare:items-center mare:gap-2", w = {
 	mare:disabled:text-disabled mare:disabled:border-disabled-default
 	mare:ark-invalid:border-2 mare:ark-invalid:border-danger
 	mare:transition-colors mare:duration-200
-	${w[e]}
-`, d = (e) => Array.from(e);
-function V({
+	${A[e]}
+`, V = ["small", "medium", "large"], d = (e) => Array.from(e);
+function P({
   length: e = 4,
   value: o,
   defaultValue: t,
@@ -30,14 +31,14 @@ function V({
   readOnly: x,
   required: h,
   autoFocus: v,
-  name: y,
-  id: g
+  name: g,
+  id: y
 }) {
-  const C = k(s);
-  return /* @__PURE__ */ I(
+  const C = w(s, V, "medium"), I = N(C);
+  return /* @__PURE__ */ j(
     a.Root,
     {
-      id: g,
+      id: y,
       count: e,
       value: o === void 0 ? void 0 : d(o),
       defaultValue: t === void 0 ? void 0 : d(t),
@@ -50,15 +51,15 @@ function V({
       readOnly: x,
       required: h,
       autoFocus: v,
-      name: y,
+      name: g,
       onValueChange: (r) => i?.(r.value.join("")),
       onValueComplete: (r) => l?.(r.value.join("")),
       children: [
-        /* @__PURE__ */ m(a.Control, { className: j, children: Array.from({ length: e }, (r, n) => /* @__PURE__ */ m(
+        /* @__PURE__ */ m(a.Control, { className: k, children: Array.from({ length: e }, (r, n) => /* @__PURE__ */ m(
           a.Input,
           {
             index: n,
-            className: C
+            className: I
           },
           n
         )) }),
@@ -68,5 +69,5 @@ function V({
   );
 }
 export {
-  V as I
+  P as I
 };

package/dist/shared/InputText.types-KhlkzHMw-BtRY371_.js

@@ -0,0 +1,4 @@
+const m = ["small", "medium"];
+export {
+  m
+};