@clubmed/trident-ui 1.0.0-alpha.31 → 1.0.0-alpha.33

package/molecules/Buttons/ButtonContent.d.ts

@@ -1,8 +1,9 @@
 import { FunctionComponent, ReactNode } from 'react';
-import { Iconics } from '../../atoms/Icon';
+import { IconicNames, IconicTypes } from '../../atoms/Icons';
 export declare const ButtonContent: FunctionComponent<{
     showLabel: boolean;
     label?: string;
     children?: ReactNode;
-    icon?: Iconics;
+    icon?: IconicNames;
+    iconType?: IconicTypes;
 }>;

package/molecules/Buttons/ButtonContent.js

@@ -1,10 +1,10 @@
-import { jsxs as o, jsx as n } from "react/jsx-runtime";
-import { Icon as m } from "../../atoms/Icon.js";
-const p = ({ showLabel: s, label: t, children: r, icon: e }) => /* @__PURE__ */ o("span", { className: "flex items-center justify-center gap-x-8", children: [
+import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { Icon as p } from "../../atoms/Icons/Icon.js";
+const i = ({ showLabel: s, label: t, children: r, icon: e, iconType: o }) => /* @__PURE__ */ m("span", { className: "flex items-center justify-center gap-x-8", children: [
   s ? t : /* @__PURE__ */ n("span", { className: "sr-only", children: t }),
   r,
-  e && /* @__PURE__ */ n(m, { width: "24px", name: e })
+  e && /* @__PURE__ */ n(p, { width: "24px", name: e, type: o })
 ] });
 export {
-  p as ButtonContent
+  i as ButtonContent
 };

package/molecules/Card.d.ts

@@ -1,8 +1,9 @@
 import { FunctionComponent, PropsWithChildren } from 'react';
-import { Iconics } from '../atoms/Icon';
+import { IconicNames, IconicTypes } from '../atoms/Icons';
 interface CardProps {
     title: string;
-    icon: Iconics;
+    icon: IconicNames;
+    iconType?: IconicTypes;
     theme?: 'light' | 'dark';
     dataName?: string;
 }

package/molecules/Card.js

@@ -1,17 +1,18 @@
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
 import { c as d } from "../index-Cu0xwYjD.js";
-import { Icon as n } from "../atoms/Icon.js";
-const h = ({
+import { Icon as o } from "../atoms/Icons/Icon.js";
+const f = ({
   title: a,
   children: s,
   icon: i,
+  iconType: l,
   theme: r = "light",
-  dataName: l = "Card"
+  dataName: n = "Card"
 }) => /* @__PURE__ */ t(
   "div",
   {
     className: "border-lightGrey rounded-16 flex shrink-0 flex-row gap-20 border bg-white p-20",
-    "data-name": l,
+    "data-name": n,
     children: [
       /* @__PURE__ */ e(
         "div",
@@ -20,7 +21,7 @@ const h = ({
             "bg-ultramarine text-white": r === "dark",
             "bg-lightSand text-black": r === "light"
           }),
-          children: /* @__PURE__ */ e(n, { name: i, width: "24px" })
+          children: /* @__PURE__ */ e(o, { name: i, type: l, width: "24px" })
         }
       ),
       /* @__PURE__ */ t("div", { className: "space-y-8 font-sans", children: [
@@ -31,5 +32,5 @@ const h = ({
   }
 );
 export {
-  h as Card
+  f as Card
 };

package/molecules/ElasticHeight.js

@@ -1,15 +1,15 @@
 import { jsx as s } from "react/jsx-runtime";
-import { c as l, b as h, a as p } from "../react-spring_web.modern-CaA7KCmz.js";
-import { c as d } from "../index-Cu0xwYjD.js";
-import { useRef as u, useEffect as g } from "react";
-const r = (t) => t, N = ({
+import { u as l, a as h, b as p } from "../react-spring_web.modern-BPtZcx1z.js";
+import { c as u } from "../index-Cu0xwYjD.js";
+import { useRef as d, useEffect as g } from "react";
+const r = (t) => t, R = ({
   children: t,
   id: n,
   className: a,
   role: c,
   containerClassName: m
 }) => {
-  const i = u(null), { height: e } = l({ container: i }), [f, o] = h(() => ({
+  const i = d(null), { height: e } = l({ container: i }), [f, o] = h(() => ({
     from: {
       height: e.to(r)
     },
@@ -29,7 +29,7 @@ const r = (t) => t, N = ({
     p.div,
     {
       role: c,
-      className: d("overflow-hidden", m),
+      className: u("overflow-hidden", m),
       style: { ...f },
       id: n,
       children: /* @__PURE__ */ s("div", { className: a, ref: i, children: t })
@@ -37,5 +37,5 @@ const r = (t) => t, N = ({
   );
 };
 export {
-  N as ElasticHeight
+  R as ElasticHeight
 };

package/molecules/Forms/Checkbox.js

@@ -1,6 +1,6 @@
 import { jsxs as i, jsx as l } from "react/jsx-runtime";
 import { c as b } from "../../index-Cu0xwYjD.js";
-import { Icon as y } from "../../atoms/Icon.js";
+import { Icon as y } from "../../atoms/Icons/Icon.js";
 import { useValue as N } from "../../hooks/useValue.js";
 import "../../controls-l0sNRNKZ.js";
 let V = 0;

package/molecules/Forms/Checkboxes.js

@@ -1,5 +1,5 @@
-import { jsx as N } from "react/jsx-runtime";
-import { Children as k, isValidElement as v, cloneElement as C } from "react";
+import { jsx as k } from "react/jsx-runtime";
+import { Children as v, isValidElement as C, cloneElement as N } from "react";
 import { useValue as E } from "../../hooks/useValue.js";
 import { c as m } from "../../index-Cu0xwYjD.js";
 let $ = 0;
@@ -24,10 +24,10 @@ function q({
     defaultValue: p || [],
     onChange: i
   });
-  return /* @__PURE__ */ N("div", { ...a, className: m(a.className, ""), role: "listbox", children: k.map(u, (e, n) => {
-    if (v(e)) {
+  return /* @__PURE__ */ k("div", { ...a, className: m(a.className, ""), role: "listbox", children: v.map(u, (e, n) => {
+    if (C(e)) {
       const r = e.props.value;
-      return C(e, {
+      return N(e, {
         ...e.props,
         name: t,
         id: `${s}-${n}`,

package/molecules/Forms/DateField.d.ts

@@ -1,5 +1,5 @@
 import { FunctionComponent } from 'react';
-import { Iconics } from '../../atoms/Icon';
+import { IconicNames, IconicTypes } from '../../atoms/Icons';
 import { FormControlProps } from './FormControl.js';
 interface DateFieldProps extends Omit<FormControlProps<Date | null>, 'max' | 'min'> {
     /**
@@ -17,7 +17,8 @@ interface DateFieldProps extends Omit<FormControlProps<Date | null>, 'max' | 'mi
     /**
      * Icon name
      */
-    icon?: Iconics;
+    icon?: IconicNames;
+    iconType?: IconicTypes;
     /**
      * Error message
      */

package/molecules/Forms/DateField.js

@@ -1,110 +1,111 @@
-import { jsx as f, jsxs as b } from "react/jsx-runtime";
-import { c as I } from "../../index-Cu0xwYjD.js";
-import { useRef as O } from "react";
-import { Icon as C } from "../../atoms/Icon.js";
-import { useValue as R } from "../../hooks/useValue.js";
-import { useInternalStatus as P } from "../../hooks/useInternalStatus.js";
-import { FormControl as _ } from "./FormControl.js";
-function F(e) {
+import { jsx as p, jsxs as b } from "react/jsx-runtime";
+import { c as M } from "../../index-Cu0xwYjD.js";
+import { useRef as R } from "react";
+import { Icon as E } from "../../atoms/Icons/Icon.js";
+import { useValue as P } from "../../hooks/useValue.js";
+import { useInternalStatus as _ } from "../../hooks/useInternalStatus.js";
+import { FormControl as $ } from "./FormControl.js";
+function I(e) {
   "@babel/helpers - typeof";
-  return F = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
+  return I = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
     return typeof t;
   } : function(t) {
     return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
-  }, F(e);
+  }, I(e);
 }
-function M(e, t) {
+function T(e, t) {
   if (t.length < e)
     throw new TypeError(e + " argument" + (e > 1 ? "s" : "") + " required, but only " + t.length + " present");
 }
-function $(e) {
-  M(1, arguments);
+function z(e) {
+  T(1, arguments);
   var t = Object.prototype.toString.call(e);
-  return e instanceof Date || F(e) === "object" && t === "[object Date]" ? new Date(e.getTime()) : typeof e == "number" || t === "[object Number]" ? new Date(e) : ((typeof e == "string" || t === "[object String]") && typeof console < "u" && (console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#string-arguments"), console.warn(new Error().stack)), /* @__PURE__ */ new Date(NaN));
+  return e instanceof Date || I(e) === "object" && t === "[object Date]" ? new Date(e.getTime()) : typeof e == "number" || t === "[object Number]" ? new Date(e) : ((typeof e == "string" || t === "[object String]") && typeof console < "u" && (console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#string-arguments"), console.warn(new Error().stack)), /* @__PURE__ */ new Date(NaN));
 }
-function i(e, t) {
-  for (var c = e < 0 ? "-" : "", a = Math.abs(e).toString(); a.length < t; )
+function s(e, t) {
+  for (var i = e < 0 ? "-" : "", a = Math.abs(e).toString(); a.length < t; )
     a = "0" + a;
-  return c + a;
+  return i + a;
 }
-function z(e, t) {
-  var c, a;
-  M(1, arguments);
-  var o = $(e);
+function G(e, t) {
+  var i, a;
+  T(1, arguments);
+  var o = z(e);
   if (isNaN(o.getTime()))
     throw new RangeError("Invalid time value");
-  var l = String((c = t == null ? void 0 : t.format) !== null && c !== void 0 ? c : "extended"), u = String((a = t == null ? void 0 : t.representation) !== null && a !== void 0 ? a : "complete");
-  if (l !== "extended" && l !== "basic")
+  var c = String((i = t == null ? void 0 : t.format) !== null && i !== void 0 ? i : "extended"), l = String((a = t == null ? void 0 : t.representation) !== null && a !== void 0 ? a : "complete");
+  if (c !== "extended" && c !== "basic")
     throw new RangeError("format must be 'extended' or 'basic'");
-  if (u !== "date" && u !== "time" && u !== "complete")
+  if (l !== "date" && l !== "time" && l !== "complete")
     throw new RangeError("representation must be 'date', 'time', or 'complete'");
-  var m = "", r = "", g = l === "extended" ? "-" : "", h = l === "extended" ? ":" : "";
-  if (u !== "time") {
-    var y = i(o.getDate(), 2), x = i(o.getMonth() + 1, 2), p = i(o.getFullYear(), 4);
-    m = "".concat(p).concat(g).concat(x).concat(g).concat(y);
+  var u = "", d = "", r = c === "extended" ? "-" : "", h = c === "extended" ? ":" : "";
+  if (l !== "time") {
+    var y = s(o.getDate(), 2), x = s(o.getMonth() + 1, 2), w = s(o.getFullYear(), 4);
+    u = "".concat(w).concat(r).concat(x).concat(r).concat(y);
   }
-  if (u !== "date") {
-    var d = o.getTimezoneOffset();
-    if (d !== 0) {
-      var v = Math.abs(d), n = i(Math.floor(v / 60), 2), w = i(v % 60, 2), D = d < 0 ? "+" : "-";
-      r = "".concat(D).concat(n, ":").concat(w);
+  if (l !== "date") {
+    var m = o.getTimezoneOffset();
+    if (m !== 0) {
+      var v = Math.abs(m), g = s(Math.floor(v / 60), 2), n = s(v % 60, 2), D = m < 0 ? "+" : "-";
+      d = "".concat(D).concat(g, ":").concat(n);
     } else
-      r = "Z";
-    var S = i(o.getHours(), 2), N = i(o.getMinutes(), 2), j = i(o.getSeconds(), 2), k = m === "" ? "" : "T", s = [S, N, j].join(h);
-    m = "".concat(m).concat(k).concat(s).concat(r);
+      d = "Z";
+    var S = s(o.getHours(), 2), N = s(o.getMinutes(), 2), j = s(o.getSeconds(), 2), k = u === "" ? "" : "T", C = [S, N, j].join(h);
+    u = "".concat(u).concat(k).concat(C).concat(d);
   }
-  return m;
+  return u;
 }
-let G = 0;
-const E = (e) => e ? z(e, { representation: "date" }) : "", B = ({
-  id: e = `field-date-${++G}`,
+let V = 0;
+const F = (e) => e ? G(e, { representation: "date" }) : "", J = ({
+  id: e = `field-date-${++V}`,
   name: t = e,
-  label: c,
+  label: i,
   description: a,
   openDatepicker: o,
-  validationStatus: l = "default",
-  icon: u = "CalendarDefault",
-  errorMessage: m,
+  validationStatus: c = "default",
+  icon: l = "CalendarDefault",
+  iconType: u,
+  errorMessage: d,
   disabled: r = !1,
-  dataTestId: g = "DateField",
-  value: h,
-  min: y,
-  max: x,
-  onChange: p,
-  ...d
+  dataTestId: h = "DateField",
+  value: y,
+  min: x,
+  max: w,
+  onChange: m,
+  ...v
 }) => {
-  const v = O(null), n = P({
+  const g = R(null), n = _({
     isDisabled: r,
-    validationStatus: l
-  }), { setValue: w, value: D } = R({
+    validationStatus: c
+  }), { setValue: D, value: S } = P({
     name: t,
-    formatter: E,
-    initialValue: h,
-    onChange: (s, T) => p == null ? void 0 : p(s, new Date(T))
-  }), S = E(y), N = E(x), j = (s) => {
-    w(s.target.value);
-  }, k = () => {
-    var s;
-    (s = v.current) == null || s.showPicker();
+    formatter: F,
+    initialValue: y,
+    onChange: (f, O) => m == null ? void 0 : m(f, new Date(O))
+  }), N = F(x), j = F(w), k = (f) => {
+    D(f.target.value);
+  }, C = () => {
+    var f;
+    (f = g.current) == null || f.showPicker();
   };
-  return /* @__PURE__ */ f(
-    _,
+  return /* @__PURE__ */ p(
+    $,
     {
       id: e,
-      label: c,
+      label: i,
       description: a,
       dataName: "DateField",
-      dataTestId: g,
+      dataTestId: h,
       disabled: r,
-      validationStatus: l,
-      errorMessage: m,
+      validationStatus: c,
+      errorMessage: d,
       children: /* @__PURE__ */ b("div", { className: "relative", children: [
-        /* @__PURE__ */ f(
+        /* @__PURE__ */ p(
           "input",
           {
-            ...d,
+            ...v,
             type: "date",
-            className: I(
+            className: M(
               "text-b3 rounded-pill date-field min-h-[50px] w-full border px-20 py-12 ps-[52px] font-normal outline-none",
               {
                 "border-lightGrey focus:border-black active:border-black": n === "default",
@@ -117,17 +118,17 @@ const E = (e) => e ? z(e, { representation: "date" }) : "", B = ({
             ),
             id: e,
             disabled: r,
-            ref: v,
-            value: D,
-            min: S,
-            max: N,
-            onChange: j
+            ref: g,
+            value: S,
+            min: N,
+            max: j,
+            onChange: k
           }
         ),
         /* @__PURE__ */ b(
           "div",
           {
-            className: I(
+            className: M(
               "pointer-events-none absolute inset-0 flex items-center justify-between px-20 py-12",
               {
                 "text-grey": r,
@@ -136,13 +137,13 @@ const E = (e) => e ? z(e, { representation: "date" }) : "", B = ({
               }
             ),
             children: [
-              /* @__PURE__ */ b("button", { className: "pointer-events-auto leading-none", onClick: k, children: [
-                /* @__PURE__ */ f(C, { name: u, width: "24px" }),
-                /* @__PURE__ */ f("span", { className: "sr-only", children: o })
+              /* @__PURE__ */ b("button", { className: "pointer-events-auto leading-none", onClick: C, children: [
+                /* @__PURE__ */ p(E, { name: l, iconType: u, width: "24px" }),
+                /* @__PURE__ */ p("span", { className: "sr-only", children: o })
               ] }),
               /* @__PURE__ */ b("span", { className: "ms-auto flex gap-x-8", children: [
-                n === "error" && /* @__PURE__ */ f(C, { name: "CrossDefault", width: "24px" }),
-                n === "success" && /* @__PURE__ */ f(C, { name: "CheckDefault", width: "24px" })
+                n === "error" && /* @__PURE__ */ p(E, { name: "CrossDefault", width: "24px" }),
+                n === "success" && /* @__PURE__ */ p(E, { name: "CheckDefault", width: "24px" })
               ] })
             ]
           }
@@ -152,5 +153,5 @@ const E = (e) => e ? z(e, { representation: "date" }) : "", B = ({
   );
 };
 export {
-  B as DateField
+  J as DateField
 };

package/molecules/Forms/Filter.js

@@ -1,11 +1,11 @@
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import { c } from "../../index-Cu0xwYjD.js";
 import "../../controls-l0sNRNKZ.js";
-import { Icon as m } from "../../atoms/Icon.js";
-import { useValue as N } from "../../hooks/useValue.js";
-let D = 0;
+import { Icon as m } from "../../atoms/Icons/Icon.js";
+import { useValue as D } from "../../hooks/useValue.js";
+let N = 0;
 function A({
-  id: n = "filter-" + D++,
+  id: n = "filter-" + N++,
   name: a = n,
   className: u,
   dataTestId: p,
@@ -18,7 +18,7 @@ function A({
   children: b,
   ...h
 }) {
-  const { value: i, setValue: k } = N({
+  const { value: i, setValue: k } = D({
     name: a,
     initialValue: f,
     onChange(w, o) {

package/molecules/Forms/FormControl.js

@@ -1,8 +1,8 @@
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import { useInternalStatus as f } from "../../hooks/useInternalStatus.js";
 import { FormLabel as u } from "./FormLabel.js";
-import { Icon as h } from "../../atoms/Icon.js";
-import { c as N } from "../../index-Cu0xwYjD.js";
+import { Icon as h } from "../../atoms/Icons/Icon.js";
+import { c as b } from "../../index-Cu0xwYjD.js";
 const v = ({
   id: t,
   label: r,
@@ -23,7 +23,7 @@ const v = ({
   return /* @__PURE__ */ s(
     "div",
     {
-      className: N(n, "space-y-4"),
+      className: b(n, "space-y-4"),
       "data-name": p,
       "data-testid": l,
       children: [

package/molecules/Forms/FormLabel.js

@@ -1,4 +1,4 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { jsxs as n, jsx as m } from "react/jsx-runtime";
 import { c as x } from "../../index-Cu0xwYjD.js";
 const c = {
   horizontal: "flex flex-wrap items-center gap-x-12 px-20",
@@ -11,7 +11,7 @@ const c = {
   layout: o = "horizontal",
   className: r,
   ...s
-}) => /* @__PURE__ */ m(
+}) => /* @__PURE__ */ n(
   "label",
   {
     ...s,
@@ -20,7 +20,7 @@ const c = {
     "data-name": "InputLabel",
     children: [
       l || t,
-      e && /* @__PURE__ */ n("span", { className: "text-b4 text-middleGrey inline-block font-normal", children: e })
+      e && /* @__PURE__ */ m("span", { className: "text-b4 text-middleGrey inline-block font-normal", children: e })
     ]
   }
 );

package/molecules/Forms/NumberField.d.ts

@@ -18,20 +18,23 @@ export declare function useNumberField({ id, name, value: initialValue, onChange
     validationStatus?: import("../../hooks/useInternalStatus").ValidationStatus | undefined;
     dataName?: string | undefined;
     errorMessage?: string | undefined;
+    type?: import("react").HTMLInputTypeAttribute | undefined;
+    width?: string | number | undefined;
+    color?: string | undefined;
+    className?: string | undefined;
+    style?: import("react").CSSProperties | undefined;
+    prefix?: string | undefined;
     form?: string | undefined;
+    list?: string | undefined;
+    role?: import("react").AriaRole | undefined;
     label?: import("react").ReactNode;
     slot?: string | undefined;
-    style?: import("react").CSSProperties | undefined;
     title?: string | undefined;
     pattern?: string | undefined;
+    children?: import("react").ReactNode;
     suppressHydrationWarning?: boolean | undefined;
-    className?: string | undefined;
-    color?: string | undefined;
     height?: string | number | undefined;
     lang?: string | undefined;
-    type?: import("react").HTMLInputTypeAttribute | undefined;
-    width?: string | number | undefined;
-    role?: import("react").AriaRole | undefined;
     tabIndex?: number | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
@@ -55,7 +58,7 @@ export declare function useNumberField({ id, name, value: initialValue, onChange
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "tree" | "true" | "false" | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "grid" | "listbox" | "menu" | "tree" | "true" | "false" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
     "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
@@ -86,7 +89,6 @@ export declare function useNumberField({ id, name, value: initialValue, onChange
     "aria-valuemin"?: number | undefined;
     "aria-valuenow"?: number | undefined;
     "aria-valuetext"?: string | undefined;
-    children?: import("react").ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined;
@@ -251,7 +253,6 @@ export declare function useNumberField({ id, name, value: initialValue, onChange
     onAnimationIterationCapture?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLLabelElement>) | undefined;
     onTransitionEnd?: (import("react").TransitionEventHandler<HTMLInputElement> & import("react").TransitionEventHandler<HTMLLabelElement>) | undefined;
     onTransitionEndCapture?: (import("react").TransitionEventHandler<HTMLInputElement> & import("react").TransitionEventHandler<HTMLLabelElement>) | undefined;
-    list?: string | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     formAction?: string | undefined;
     formEncType?: string | undefined;
@@ -275,7 +276,6 @@ export declare function useNumberField({ id, name, value: initialValue, onChange
     content?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
-    prefix?: string | undefined;
     property?: string | undefined;
     rel?: string | undefined;
     resource?: string | undefined;
@@ -293,11 +293,11 @@ export declare function useNumberField({ id, name, value: initialValue, onChange
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "search" | "none" | "text" | "url" | "tel" | "email" | "numeric" | "decimal" | undefined;
     is?: string | undefined;
+    autoComplete?: import("react").HTMLInputAutoCompleteAttribute | undefined;
     alt?: string | undefined;
     src?: string | undefined;
-    autoComplete?: import("react").HTMLInputAutoCompleteAttribute | undefined;
     accept?: string | undefined;
     capture?: boolean | "user" | "environment" | undefined;
     checked?: boolean | undefined;

package/molecules/Forms/NumberField.js

@@ -1,7 +1,7 @@
 import { jsx as c, jsxs as g } from "react/jsx-runtime";
 import { c as x } from "../../index-Cu0xwYjD.js";
 import { useValue as v } from "../../hooks/useValue.js";
-import { Button as p } from "../Buttons/Button.js";
+import { Button as N } from "../Buttons/Button.js";
 import { FormControl as y } from "./FormControl.js";
 const C = { width: "28px", height: "28px" };
 let w = 0;
@@ -57,7 +57,7 @@ const P = (s) => {
     increase: n,
     decrease: b,
     errorMessage: h,
-    validationStatus: N,
+    validationStatus: p,
     ...m
   } = F(s);
   return /* @__PURE__ */ c(
@@ -70,12 +70,12 @@ const P = (s) => {
       dataName: "NumberField",
       dataTestId: d,
       errorMessage: h,
-      validationStatus: N,
+      validationStatus: p,
       disabled: e,
       layout: "vertical",
       children: /* @__PURE__ */ g("div", { className: "flex items-center gap-x-8", children: [
         /* @__PURE__ */ c(
-          p,
+          N,
           {
             theme: "yellow",
             onClick: b,
@@ -103,7 +103,7 @@ const P = (s) => {
           }
         ),
         /* @__PURE__ */ c(
-          p,
+          N,
           {
             theme: "yellow",
             onClick: n,

package/molecules/Forms/Radio.js

@@ -2,9 +2,9 @@ import { jsxs as c, jsx as e } from "react/jsx-runtime";
 import { c as y } from "../../index-Cu0xwYjD.js";
 import { useValue as w } from "../../hooks/useValue.js";
 import "../../controls-l0sNRNKZ.js";
-let N = 0;
+let k = 0;
 function R({
-  id: o = "radio-" + N++,
+  id: o = "radio-" + k++,
   name: r = o,
   className: d,
   dataTestId: m,
@@ -12,10 +12,10 @@ function R({
   checked: f = !1,
   value: i,
   size: a = 24,
-  tabIndex: p = 0,
-  children: h,
+  tabIndex: n = 0,
+  children: p,
   onChange: l,
-  ...n
+  ...h
 }) {
   const { value: s, setValue: u } = w({
     name: r,
@@ -35,11 +35,11 @@ function R({
           /* @__PURE__ */ e(
             "input",
             {
-              ...n,
+              ...h,
               name: r,
               "data-testid": m,
               type: "radio",
-              tabIndex: p,
+              tabIndex: n,
               onChange: () => {
                 !t && u(!s);
               },
@@ -51,7 +51,7 @@ function R({
           ),
           /* @__PURE__ */ e("span", { style: { height: a, width: a }, children: /* @__PURE__ */ e("svg", { viewBox: "0 0 16 16", width: a * 2 / 3, className: "overflow-visible", children: /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "8px", style: { fill: "hsl(var(--color-saffron))" } }) }) })
         ] }),
-        h
+        p
       ]
     }
   );