@telefonica/mistica 14.11.0 → 14.12.0

package/dist-es/checkbox.js

@@ -1,4 +1,4 @@
-function _defineProperty(obj, key, value) {
+function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -11,7 +11,7 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _objectSpread(target) {
+function _object_spread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -21,7 +21,7 @@ function _objectSpread(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _defineProperty(target, key, source[key]);
+            _define_property(target, key, source[key]);
         });
     }
     return target;
@@ -39,7 +39,7 @@ function ownKeys(object, enumerableOnly) {
     }
     return keys;
 }
-function _objectSpreadProps(target, source) {
+function _object_spread_props(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
         Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
@@ -50,89 +50,91 @@ function _objectSpreadProps(target, source) {
     }
     return target;
 }
-import * as w from "react";
-import { SPACE as I } from "./utils/key-codes.js";
-import { useControlProps as N } from "./form-context.js";
-import A from "./inline.js";
+import { jsx as a, jsxs as w } from "react/jsx-runtime";
+import * as I from "react";
+import { SPACE as N } from "./utils/key-codes.js";
+import { useControlProps as A } from "./form-context.js";
+import D from "./inline.js";
 import { Text3 as m } from "./text.js";
-import { useAriaId as D, useTheme as L } from "./hooks.js";
+import { useAriaId as L, useTheme as P } from "./hooks.js";
 import n from "classnames";
-import { getPrefixedDataAttributes as P } from "./utils/dom.js";
-import { checkboxContainer as S, checkboxContainerDisabled as E, disabled as u, check as f, checkChecked as k, boxVariant as V } from "./checkbox.css-mistica.js";
-import { vars as x } from "./skins/skin-contract.css-mistica.js";
-import { jsx as i, jsxs as j } from "./_virtual/jsx-runtime.js";
+import { getPrefixedDataAttributes as S } from "./utils/dom.js";
+import { checkboxContainer as E, checkboxContainerDisabled as V, disabled as k, check as f, checkChecked as u, boxVariant as j } from "./checkbox.css-mistica.js";
+import { vars as v } from "./skins/skin-contract.css-mistica.js";
 const z = (param)=>{
-    let { isChecked: e , disabled: d  } = param;
-    const { isIos: t  } = L(), c = t ? /* @__PURE__ */ i("svg", {
+    let { isChecked: e , disabled: o  } = param;
+    const { isIos: l  } = P(), c = l ? /* @__PURE__ */ a("svg", {
         viewBox: "0 0 10 8",
         width: "10",
         height: "8",
         className: n(f, {
-            [k]: e
+            [u]: e
         }),
-        children: /* @__PURE__ */ i("path", {
+        children: /* @__PURE__ */ a("path", {
             d: "M2.659 7.724c.33.366.92.368 1.254.005L9.79 1.336A.782.782 0 009.719.202a.858.858 0 00-1.178.069l-5.236 5.72-1.841-2.038a.857.857 0 00-1.177-.078.782.782 0 00-.082 1.133l2.454 2.716z",
-            fill: x.colors.inverse
+            fill: v.colors.inverse
         })
-    }) : /* @__PURE__ */ i("svg", {
+    }) : /* @__PURE__ */ a("svg", {
         viewBox: "0 0 14 10",
         width: "14",
         height: "10",
         className: n(f, {
-            [k]: e
+            [u]: e
         }),
-        children: /* @__PURE__ */ i("path", {
+        children: /* @__PURE__ */ a("path", {
             d: "M5 10L0 5.192l1.4-1.346L5 7.308 12.6 0 14 1.346z",
-            fill: x.colors.inverse
+            fill: v.colors.inverse
         })
     });
-    return /* @__PURE__ */ i("div", {
-        className: n(V[e ? "checked" : t ? "ios" : "rest"], {
-            [u]: d
+    return /* @__PURE__ */ a("div", {
+        className: n(j[e ? "checked" : l ? "ios" : "rest"], {
+            [k]: o
         }),
         children: c
     });
-}, J = (e)=>{
-    const d = D(e["aria-labelledby"]), t = e["aria-label"], c = t || e["aria-labelledby"], { defaultValue: C , value: a , onChange: s , focusableRef: v , disabled: l  } = N({
+}, B = (e)=>{
+    const o = L(e["aria-labelledby"]), l = e["aria-label"], c = l || e["aria-labelledby"], { defaultValue: x , value: t , onChange: s , focusableRef: C , disabled: i  } = A({
         name: e.name,
         value: e.checked,
         defaultValue: e.defaultChecked,
         onChange: e.onChange,
         disabled: e.disabled
-    }), [o, g] = w.useState(!!C), h = ()=>{
-        a === void 0 ? (g(!o), s(!o)) : s(!a);
+    }), [d, g] = I.useState(!!x), h = ()=>{
+        t === void 0 ? (g(!d), s(!d)) : s(!t);
     }, y = (r)=>{
-        r.keyCode === I && (r.preventDefault(), r.stopPropagation(), h());
-    }, b = /* @__PURE__ */ i(z, {
-        disabled: l,
-        isChecked: a != null ? a : o
+        r.keyCode === N && (r.preventDefault(), r.stopPropagation(), h());
+    }, b = /* @__PURE__ */ a(z, {
+        disabled: i,
+        isChecked: t !== null && t !== void 0 ? t : d
     });
-    return /* @__PURE__ */ i("div", _objectSpreadProps(_objectSpread({
+    return(// When the checkbox is disabled, it shouldn't be focusable
+    // eslint-disable-next-line jsx-a11y/interactive-supports-focus
+    /* @__PURE__ */ a("div", _object_spread_props(_object_spread({
         id: e.id,
         role: "checkbox",
-        "aria-checked": a != null ? a : o,
-        onKeyDown: l ? void 0 : y,
-        onClick: l ? void 0 : h,
-        tabIndex: l ? void 0 : 0,
-        ref: v,
-        className: S,
-        "aria-label": t,
-        "aria-labelledby": t ? void 0 : d,
-        "aria-disabled": l
-    }, P(e.dataAttributes, "Checkbox")), {
+        "aria-checked": t !== null && t !== void 0 ? t : d,
+        onKeyDown: i ? void 0 : y,
+        onClick: i ? void 0 : h,
+        tabIndex: i ? void 0 : 0,
+        ref: C,
+        className: E,
+        "aria-label": l,
+        "aria-labelledby": l ? void 0 : o,
+        "aria-disabled": i
+    }, S(e.dataAttributes, "Checkbox")), {
         children: e.render ? e.render({
             controlElement: b,
-            labelId: d,
-            checked: a != null ? a : o,
-            disabled: !!l
-        }) : /* @__PURE__ */ j(A, {
+            labelId: o,
+            checked: t !== null && t !== void 0 ? t : d,
+            disabled: !!i
+        }) : /* @__PURE__ */ w(D, {
             space: 16,
-            className: l ? E : "",
+            className: i ? V : "",
             children: [
-                /* @__PURE__ */ i(m, {
+                /* @__PURE__ */ a(m, {
                     regular: !0,
                     as: "div",
-                    children: /* @__PURE__ */ i("div", {
+                    children: /* @__PURE__ */ a("div", {
                         style: {
                             position: "relative",
                             top: -2
@@ -140,18 +142,18 @@ const z = (param)=>{
                         children: b
                     })
                 }),
-                e.children && /* @__PURE__ */ i(m, {
+                e.children && /* @__PURE__ */ a(m, {
                     regular: !0,
                     as: "div",
-                    id: d,
+                    id: o,
                     role: c ? "presentation" : void 0,
-                    children: /* @__PURE__ */ i("span", {
-                        className: l ? u : "",
+                    children: /* @__PURE__ */ a("span", {
+                        className: i ? k : "",
                         children: e.children
                     })
                 })
             ]
         })
-    }));
-};
-export { J as default };
+    })));
+}, O = B;
+export { O as default };

package/dist-es/chip.css-mistica.js

@@ -1,5 +1,5 @@
-import "./sprinkles.css.ts.vanilla.js";
-import "./chip.css.ts.vanilla.js";
+import "./sprinkles.css.ts.vanilla.css-mistica.js";
+import "./chip.css.ts.vanilla.css-mistica.js";
 var c = "_1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nfa2 _1y2v1nf5y", t = {
     light: "cc7htnb cc7htn9",
     dark: "cc7htnc cc7htn9"

package/dist-es/chip.js

@@ -1,4 +1,4 @@
-function _defineProperty(obj, key, value) {
+function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -11,7 +11,7 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _objectSpread(target) {
+function _object_spread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -21,7 +21,7 @@ function _objectSpread(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _defineProperty(target, key, source[key]);
+            _define_property(target, key, source[key]);
         });
     }
     return target;
@@ -39,7 +39,7 @@ function ownKeys(object, enumerableOnly) {
     }
     return keys;
 }
-function _objectSpreadProps(target, source) {
+function _object_spread_props(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
         Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
@@ -50,31 +50,31 @@ function _objectSpreadProps(target, source) {
     }
     return target;
 }
-import k from "classnames";
-import { useTheme as P } from "./hooks.js";
+import { jsxs as u, Fragment as k, jsx as t } from "react/jsx-runtime";
+import P from "classnames";
+import { useTheme as T } from "./hooks.js";
 import n from "./box.js";
-import { Text2 as T } from "./text.js";
-import A from "./icon-button.js";
-import E from "./generated/mistica-icons/icon-close-regular.js";
-import { pxToRem as I } from "./utils/css.js";
-import { iconActive as V, icon as w, chipVariants as a, button as y, chipInteractiveVariants as B } from "./chip.css-mistica.js";
-import { vars as N } from "./skins/skin-contract.css-mistica.js";
-import { getPrefixedDataAttributes as u } from "./utils/dom.js";
-import { useThemeVariant as R } from "./theme-variant-context.js";
+import { Text2 as A } from "./text.js";
+import E from "./icon-button.js";
+import I from "./generated/mistica-icons/icon-close-regular.js";
+import { pxToRem as V } from "./utils/css.js";
+import { iconActive as w, icon as y, chipVariants as a, button as B, chipInteractiveVariants as N } from "./chip.css-mistica.js";
+import { vars as R } from "./skins/skin-contract.css-mistica.js";
+import { getPrefixedDataAttributes as h } from "./utils/dom.js";
+import { useThemeVariant as j } from "./theme-variant-context.js";
 import { BaseTouchable as c } from "./touchable.js";
-import { jsxs as h, Fragment as j, jsx as t } from "./_virtual/jsx-runtime.js";
-const S = (e)=>{
-    const { Icon: i , children: v , id: g , dataAttributes: l , active: o , onClose: s  } = e, { texts: b , isDarkMode: x  } = P(), m = R() === "alternative", d = /* @__PURE__ */ h(j, {
+const z = (e)=>{
+    const { Icon: i , children: v , id: g , dataAttributes: l , active: o , onClose: s  } = e, { texts: b , isDarkMode: C  } = T(), m = j() === "alternative", d = /* @__PURE__ */ u(k, {
         children: [
             i && /* @__PURE__ */ t(n, {
                 paddingRight: 4,
-                className: o ? V : w,
+                className: o ? w : y,
                 children: /* @__PURE__ */ t(i, {
                     color: "currentColor",
-                    size: I(16)
+                    size: V(16)
                 })
             }),
-            /* @__PURE__ */ t(T, {
+            /* @__PURE__ */ t(A, {
                 id: g,
                 medium: !0,
                 truncate: 1,
@@ -83,15 +83,15 @@ const S = (e)=>{
             })
         ]
     }), f = i ? 8 : 12;
-    if (s) return /* @__PURE__ */ h(n, _objectSpreadProps(_objectSpread({
+    if (s) return /* @__PURE__ */ u(n, _object_spread_props(_object_spread({
         className: m ? a.overAlternative : a.default,
         paddingLeft: f
-    }, u(l, "Chip")), {
+    }, h(l, "Chip")), {
         children: [
             d,
             /* @__PURE__ */ t(n, {
                 paddingLeft: 4,
-                children: /* @__PURE__ */ t(A, {
+                children: /* @__PURE__ */ t(E, {
                     size: 24,
                     style: {
                         display: "flex",
@@ -100,25 +100,25 @@ const S = (e)=>{
                     },
                     "aria-label": b.closeButtonLabel,
                     onPress: ()=>s(),
-                    children: /* @__PURE__ */ t(E, {
+                    children: /* @__PURE__ */ t(I, {
                         size: 16,
-                        color: N.colors.neutralMedium
+                        color: R.colors.neutralMedium
                     })
                 })
             })
         ]
     }));
-    const C = o !== void 0 || e.href || e.onPress || e.to, r = ()=>/* @__PURE__ */ t(n, _objectSpreadProps(_objectSpread({
-            className: k(a[o ? "active" : m ? "overAlternative" : "default"], {
-                [B[x ? "dark" : "light"]]: C
+    const x = o !== void 0 || e.href || e.onPress || e.to, r = ()=>/* @__PURE__ */ t(n, _object_spread_props(_object_spread({
+            className: P(a[o ? "active" : m ? "overAlternative" : "default"], {
+                [N[C ? "dark" : "light"]]: x
             }),
             paddingLeft: f,
             paddingRight: 12
-        }, u(l, "Chip")), {
+        }, h(l, "Chip")), {
             children: d
         }));
     return e.onPress ? /* @__PURE__ */ t(c, {
-        className: y,
+        className: B,
         trackingEvent: e.trackingEvent,
         onPress: e.onPress,
         children: r()
@@ -133,5 +133,5 @@ const S = (e)=>{
         newTab: e.newTab,
         children: r()
     }) : r();
-};
+}, S = z;
 export { S as default };

package/dist-es/circle.css-mistica.js

@@ -1,4 +1,4 @@
-import "./sprinkles.css.ts.vanilla.js";
-import "./circle.css.ts.vanilla.js";
+import "./sprinkles.css.ts.vanilla.css-mistica.js";
+import "./circle.css.ts.vanilla.css-mistica.js";
 var r = "_1wpwyyp1 _1y2v1nf64 _1y2v1nf6j _1y2v1nf6d _1y2v1nfa3";
 export { r as circle };

package/dist-es/circle.js

@@ -1,19 +1,19 @@
-import { circle as c } from "./circle.css-mistica.js";
-import { vars as d } from "./skins/skin-contract.css-mistica.js";
-import { jsx as m } from "./_virtual/jsx-runtime.js";
-const f = (param)=>{
+import { jsx as i } from "react/jsx-runtime";
+import { circle as d } from "./circle.css-mistica.js";
+import { vars as m } from "./skins/skin-contract.css-mistica.js";
+const n = (param)=>{
     let { children: e , backgroundColor: s , backgroundImage: o , size: t , border: r = !1  } = param;
-    const l = r === !0 ? d.colors.border : r, i = r ? `1px solid ${l}` : void 0;
-    return /* @__PURE__ */ m("div", {
-        className: c,
+    const l = r === !0 ? m.colors.border : r, c = r ? `1px solid ${l}` : void 0;
+    return /* @__PURE__ */ i("div", {
+        className: d,
         style: {
             width: t,
             height: t,
             backgroundColor: s,
             backgroundImage: o ? `url(${o})` : "none",
-            border: i
+            border: c
         },
         children: e
     });
-};
-export { f as default };
+}, u = n;
+export { u as default };

package/dist-es/community/example-component.css-mistica.js

@@ -0,0 +1,3 @@
+import "./example-component.css.ts.vanilla.css-mistica.js";
+var m = "jbmjs60";
+export { m as example };

package/dist-es/community/example-component.js

@@ -0,0 +1,11 @@
+import { jsx as o } from "react/jsx-runtime";
+import { example as m } from "./example-component.css-mistica.js";
+import r from "../box.js";
+const n = (e)=>/* @__PURE__ */ o("div", {
+        className: m,
+        children: /* @__PURE__ */ o(r, {
+            padding: 16,
+            children: e.children
+        })
+    }), i = n;
+export { i as default };

package/dist-es/community/index.js

@@ -0,0 +1,2 @@
+import { default as a } from "./example-component.js";
+export { a as ExampleComponent };

package/dist-es/credit-card-expiration-field.js

@@ -1,4 +1,4 @@
-function _defineProperty(obj, key, value) {
+function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
             value: value,
@@ -11,7 +11,7 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _objectSpread(target) {
+function _object_spread(target) {
     for(var i = 1; i < arguments.length; i++){
         var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
@@ -21,7 +21,7 @@ function _objectSpread(target) {
             }));
         }
         ownKeys.forEach(function(key) {
-            _defineProperty(target, key, source[key]);
+            _define_property(target, key, source[key]);
         });
     }
     return target;
@@ -39,7 +39,7 @@ function ownKeys(object, enumerableOnly) {
     }
     return keys;
 }
-function _objectSpreadProps(target, source) {
+function _object_spread_props(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
         Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
@@ -50,9 +50,9 @@ function _objectSpreadProps(target, source) {
     }
     return target;
 }
-function _objectWithoutProperties(source, excluded) {
+function _object_without_properties(source, excluded) {
     if (source == null) return {};
-    var target = _objectWithoutPropertiesLoose(source, excluded);
+    var target = _object_without_properties_loose(source, excluded);
     var key, i;
     if (Object.getOwnPropertySymbols) {
         var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
@@ -65,7 +65,7 @@ function _objectWithoutProperties(source, excluded) {
     }
     return target;
 }
-function _objectWithoutPropertiesLoose(source, excluded) {
+function _object_without_properties_loose(source, excluded) {
     if (source == null) return {};
     var target = {};
     var sourceKeys = Object.keys(source);
@@ -77,37 +77,37 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }
     return target;
 }
+import { jsx as y } from "react/jsx-runtime";
 import * as v from "react";
 import { useForm as V, useFieldProps as j } from "./form-context.js";
-import { useTheme as y } from "./hooks.js";
+import { useTheme as D } from "./hooks.js";
 import { TextFieldBaseAutosuggest as w } from "./text-field-base.js";
-import { jsx as D } from "./_virtual/jsx-runtime.js";
 const N = (_param)=>{
-    var { inputRef: x , defaultValue: p , value: a  } = _param, u = _objectWithoutProperties(_param, [
+    var { inputRef: x , defaultValue: p , value: a  } = _param, u = _object_without_properties(_param, [
         "inputRef",
         "defaultValue",
         "value"
     ]);
-    const { texts: f  } = y(), s = v.useRef(a || ""), c = (i)=>{
-        let e = i.replace(/[^\d/]/g, "").replace(/\/+/g, "/");
-        const [l, m] = e.split("/");
-        return m && (e = `${l}/${m}`), String(s.current).length >= e.length || (e === "/" ? e = "" : e.length === 1 && parseInt(e) >= 2 ? e = `0${e}/` : e.length === 2 && (e[1] === "/" ? e = `0${e}` : parseInt(l) > 12 || parseInt(l) < 1 ? e = e[0] : e = `${e}/`)), e;
+    const { texts: f  } = D(), s = v.useRef(a || ""), c = (i)=>{
+        let r = i.replace(/[^\d/]/g, "").replace(/\/+/g, "/");
+        const [l, m] = r.split("/");
+        return m && (r = `${l}/${m}`), String(s.current).length >= r.length || (r === "/" ? r = "" : r.length === 1 && parseInt(r) >= 2 ? r = `0${r}/` : r.length === 2 && (r[1] === "/" ? r = `0${r}` : parseInt(l) > 12 || parseInt(l) < 1 ? r = r[0] : r = `${r}/`)), r;
     };
-    return /* @__PURE__ */ D("input", _objectSpreadProps(_objectSpread({}, u), {
+    return /* @__PURE__ */ y("input", _object_spread_props(_object_spread({}, u), {
         placeholder: f.expirationDatePlaceholder,
         type: "text",
         inputMode: "decimal",
         maxLength: "5",
         onInput: (i)=>{
-            const e = c(i.currentTarget.value);
-            s.current = e, i.currentTarget.value = e;
+            const r = c(i.currentTarget.value);
+            s.current = r, i.currentTarget.value = r;
         },
         value: a === void 0 ? void 0 : c(a),
         defaultValue: p === void 0 ? void 0 : c(p),
         ref: x
     }));
-}, B = (_param)=>{
-    var { disabled: x , error: p , helperText: a , name: u , optional: f , validate: s , onChange: c , onChangeValue: i , onBlur: e , value: l , autoComplete: m = "cc-exp" , defaultValue: C  } = _param, T = _objectWithoutProperties(_param, [
+}, R = (_param)=>{
+    var { disabled: x , error: p , helperText: a , name: u , optional: f , validate: s , onChange: c , onChangeValue: i , onBlur: r , value: l , autoComplete: m = "cc-exp" , defaultValue: C  } = _param, T = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -121,20 +121,20 @@ const N = (_param)=>{
         "autoComplete",
         "defaultValue"
     ]);
-    const { texts: g  } = y(), { setFormError: M , jumpToNext: $  } = V(), d = (r, t)=>{
-        if (!t) return f ? "" : g.formFieldErrorIsMandatory;
-        const { month: o , year: n  } = r;
-        if (!o || !n) return g.formCreditCardExpirationError;
-        const h = new Date(), Y = h.getMonth() + 1, F = h.getFullYear();
-        return n < F || n === F && o < Y ? g.formCreditCardExpirationError : s == null ? void 0 : s(r, t);
-    }, E = (r)=>{
-        const [t, o] = String(r).split("/").map((h)=>parseInt(h)), n = Number.isInteger(o) ? 2e3 + o : null;
+    const { texts: d  } = D(), { setFormError: $ , jumpToNext: M  } = V(), g = (e, t)=>{
+        if (!t) return f ? "" : d.formFieldErrorIsMandatory;
+        const { month: o , year: n  } = e;
+        if (!o || !n) return d.formCreditCardExpirationError;
+        const h = /* @__PURE__ */ new Date(), Y = h.getMonth() + 1, I = h.getFullYear();
+        return n < I || n === I && o < Y ? d.formCreditCardExpirationError : s == null ? void 0 : s(e, t);
+    }, E = (e)=>{
+        const [t, o] = String(e).split("/").map((h)=>parseInt(h)), n = Number.isInteger(o) ? 2e3 + o : null;
         return {
             month: t || null,
             year: n,
-            raw: r
+            raw: e
         };
-    }, I = j({
+    }, F = j({
         name: u,
         value: l,
         defaultValue: C,
@@ -143,25 +143,25 @@ const N = (_param)=>{
         optional: f,
         error: p,
         disabled: x,
-        onBlur: e,
-        validate: d,
+        onBlur: r,
+        validate: g,
         onChange: c,
         onChangeValue: i
     });
-    return /* @__PURE__ */ D(w, _objectSpreadProps(_objectSpread({}, T, I), {
-        onChange: (r)=>{
-            I.onChange(r);
-            const t = r.currentTarget.value, o = E(t);
+    return /* @__PURE__ */ y(w, _object_spread_props(_object_spread({}, T, F), {
+        onChange: (e)=>{
+            F.onChange(e);
+            const t = e.currentTarget.value, o = E(t);
             if (t.length === 5) {
-                const n = d == null ? void 0 : d(o, t);
-                n ? M({
+                const n = g == null ? void 0 : g(o, t);
+                n ? $({
                     name: u,
                     error: n
-                }) : $(u);
+                }) : M(u);
             }
         },
         autoComplete: m,
         inputComponent: N
     }));
-};
-export { B as default };
+}, L = R;
+export { L as default };

package/dist-es/credit-card-fields.js

@@ -1,16 +1,16 @@
-import { useForm as n } from "./form-context.js";
-import { useTheme as C } from "./hooks.js";
-import { getCvvLength as c } from "./utils/credit-card.js";
-import f from "./double-field.js";
-import p from "./stack.js";
-import s from "./credit-card-expiration-field.js";
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { useForm as C } from "./form-context.js";
+import { useTheme as n } from "./hooks.js";
+import { getCvvLength as s } from "./utils/credit-card.js";
+import c from "./double-field.js";
+import f from "./stack.js";
+import p from "./credit-card-expiration-field.js";
 import v from "./credit-card-number-field.js";
 import u from "./cvv-field.js";
-import { jsxs as m, jsx as e } from "./_virtual/jsx-runtime.js";
-const S = (param)=>{
-    let { numberFieldName: t = "ccNum" , expirationFieldName: i = "ccExp" , cvvFieldName: a = "ccCvv" , acceptedCards: o  } = param;
-    const { values: l  } = n(), { texts: r  } = C(), d = c(String(l[t]));
-    return /* @__PURE__ */ m(p, {
+const b = (param)=>{
+    let { numberFieldName: t = "ccNum" , expirationFieldName: m = "ccExp" , cvvFieldName: a = "ccCvv" , acceptedCards: o  } = param;
+    const { values: d  } = C(), { texts: r  } = n(), l = s(String(d[t]));
+    return /* @__PURE__ */ i(f, {
         space: 16,
         children: [
             /* @__PURE__ */ e(v, {
@@ -18,22 +18,22 @@ const S = (param)=>{
                 name: t,
                 label: r.formCreditCardNumberLabel
             }),
-            /* @__PURE__ */ m(f, {
+            /* @__PURE__ */ i(c, {
                 layout: "60/40",
                 children: [
-                    /* @__PURE__ */ e(s, {
-                        name: i,
+                    /* @__PURE__ */ e(p, {
+                        name: m,
                         label: r.formCreditCardExpirationLabel
                     }),
                     /* @__PURE__ */ e(u, {
                         acceptedCards: o,
                         name: a,
                         label: r.formCreditCardCvvLabel,
-                        maxLength: d
+                        maxLength: l
                     })
                 ]
             })
         ]
     });
-};
-export { S as default };
+}, k = b;
+export { k as default };

package/dist-es/credit-card-number-field.css-mistica.js

@@ -1,5 +1,5 @@
-import "./sprinkles.css.ts.vanilla.js";
-import "./credit-card-number-field.css.ts.vanilla.js";
+import "./sprinkles.css.ts.vanilla.css-mistica.js";
+import "./credit-card-number-field.css.ts.vanilla.css-mistica.js";
 var a = "yvyo3q0", o = "yvyo3q2", r = "_1y2v1nf60", f = {
     default: "yvyo3q4 _1y2v1nf5z yvyo3q5",
     backface: "yvyo3q4 _1y2v1nf5z yvyo3q6"