@telefonica/mistica 14.40.0 → 14.42.0

package/dist/text-field-components.js

@@ -11,13 +11,13 @@ function _export(target, all) {
 }
 _export(exports, {
     FieldContainer: function() {
-        return K;
+        return M;
     },
     HelperText: function() {
-        return J;
+        return K;
     },
     Label: function() {
-        return G;
+        return J;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -29,6 +29,7 @@ const _text = require("./text.js");
 const _textfieldcomponentscssmistica = require("./text-field-components.css-mistica.js");
 const _sprinklescssmistica = require("./sprinkles.css-mistica.js");
 const _skincontractcssmistica = require("./skins/skin-contract.css-mistica.js");
+const _dom = require("./utils/dom.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -127,25 +128,25 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const G = (param)=>{
-    let { shrinkLabel: o, forId: l, inputState: r, error: t, children: i, style: n, optional: m } = param;
-    const f = o || r === "focused" || r === "filled", [u, c] = _react.useState("initial"), { texts: b } = (0, _hooks.useTheme)();
+const J = (param)=>{
+    let { shrinkLabel: t, forId: s, inputState: r, error: l, children: i, style: n, optional: a } = param;
+    const f = t || r === "focused" || r === "filled", [u, h] = _react.useState("initial"), { texts: d } = (0, _hooks.useTheme)();
     _react.useEffect(()=>{
         const g = setTimeout(()=>{
-            process.env.NODE_ENV !== "test" && c("transform 150ms, width 150ms");
+            process.env.NODE_ENV !== "test" && h("transform 150ms, width 150ms");
         });
         return ()=>{
             clearTimeout(g);
         };
     }, []);
-    let h = _skincontractcssmistica.vars.colors.textSecondary;
-    return t && r !== "default" ? h = _skincontractcssmistica.vars.colors.error : r === "focused" && (h = _skincontractcssmistica.vars.colors.controlActivated), /* @__PURE__ */ (0, _jsxruntime.jsxs)("label", {
+    let p = _skincontractcssmistica.vars.colors.textSecondary;
+    return l && r !== "default" ? p = _skincontractcssmistica.vars.colors.error : r === "focused" && (p = _skincontractcssmistica.vars.colors.controlActivated), /* @__PURE__ */ (0, _jsxruntime.jsxs)("label", {
         className: (0, _classnames.default)(_textfieldcomponentscssmistica.labelContainer, {
             [_textfieldcomponentscssmistica.shrinked]: f
         }, (0, _sprinklescssmistica.sprinkles)({
-            color: h
+            color: p
         })),
-        htmlFor: l,
+        htmlFor: s,
         style: _object_spread_props(_object_spread({}, n), {
             transition: u
         }),
@@ -154,62 +155,64 @@ const G = (param)=>{
                 className: _textfieldcomponentscssmistica.labelText,
                 children: i
             }),
-            m ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", {
+            a ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", {
                 children: [
                     "\xa0(",
-                    b.formFieldOptionalLabelSuffix,
+                    d.formFieldOptionalLabelSuffix,
                     ")"
                 ]
             }) : null
         ]
     });
-}, J = (param)=>{
-    let { leftText: o, rightText: l, error: r } = param;
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), i = t ? _skincontractcssmistica.vars.colors.textPrimaryInverse : r ? _skincontractcssmistica.vars.colors.error : _skincontractcssmistica.vars.colors.textSecondary, n = t ? _skincontractcssmistica.vars.colors.textPrimaryInverse : _skincontractcssmistica.vars.colors.textSecondary;
+}, K = (param)=>{
+    let { leftText: t, rightText: s, error: r, id: l } = param;
+    const i = (0, _themevariantcontext.useIsInverseVariant)(), n = i ? _skincontractcssmistica.vars.colors.textPrimaryInverse : r ? _skincontractcssmistica.vars.colors.error : _skincontractcssmistica.vars.colors.textSecondary, a = i ? _skincontractcssmistica.vars.colors.textPrimaryInverse : _skincontractcssmistica.vars.colors.textSecondary;
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            o && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            t && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_textfieldcomponentscssmistica.helperText, _textfieldcomponentscssmistica.leftText),
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
-                    color: i,
+                    color: n,
                     regular: !0,
                     as: "p",
-                    children: o
+                    id: l,
+                    children: t
                 })
             }),
-            l && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            s && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_textfieldcomponentscssmistica.helperText, _textfieldcomponentscssmistica.rightText),
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
-                    color: n,
+                    color: a,
                     regular: !0,
                     as: "p",
-                    children: l
+                    children: s
                 })
             })
         ]
     });
-}, K = (param)=>{
-    let { multiline: o, disabled: l, children: r, helperText: t, className: i, fieldRef: n, fullWidth: m, readOnly: f } = param;
-    return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
-        className: (0, _classnames.default)(_textfieldcomponentscssmistica.fieldContainer, m ? _textfieldcomponentscssmistica.fullWidth : _textfieldcomponentscssmistica.normalWidth, {
-            [_textfieldcomponentscssmistica.disabled]: l
+}, M = (param)=>{
+    let { multiline: t, disabled: s, children: r, helperText: l, className: i, fieldRef: n, fullWidth: a, readOnly: f, dataAttributes: u } = param;
+    return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({
+        className: (0, _classnames.default)(_textfieldcomponentscssmistica.fieldContainer, a ? _textfieldcomponentscssmistica.fullWidth : _textfieldcomponentscssmistica.normalWidth, {
+            [_textfieldcomponentscssmistica.disabled]: s
         }),
-        onClick: (u)=>{
-            var c;
-            o && ((c = u.currentTarget.querySelector("textarea")) == null || c.focus());
-        },
+        onClick: (h)=>{
+            var d;
+            (d = h.currentTarget.querySelector(t ? "textarea" : "input")) == null || d.focus();
+        }
+    }, (0, _dom.getPrefixedDataAttributes)(u)), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                className: (0, _classnames.default)(_textfieldcomponentscssmistica.field, o ? _textfieldcomponentscssmistica.fieldMulti : _textfieldcomponentscssmistica.fieldSingle, (0, _sprinklescssmistica.sprinkles)({
+                className: (0, _classnames.default)(_textfieldcomponentscssmistica.field, (0, _sprinklescssmistica.sprinkles)({
                     background: f ? _skincontractcssmistica.vars.colors.neutralLow : _skincontractcssmistica.vars.colors.backgroundContainer
                 }), i),
                 ref: n,
                 children: r
             }),
-            t && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            l && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _textfieldcomponentscssmistica.helperContainer,
-                children: t
+                children: l
             })
         ]
-    });
+    }));
 };

package/dist/text-field.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return z;
+        return D;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -136,17 +136,17 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const C = (c, t, r, i)=>{
+const H = (i, t, r, c)=>{
     (0, _hooks.useIsomorphicLayoutEffect)(()=>{
-        c && t && r && t.length > r && i && i((0, _dom.createChangeEvent)(c, t.slice(0, r)));
+        i && t && r && t.length > r && c && c((0, _dom.createChangeEvent)(i, t.slice(0, r)));
     }, [
-        i,
+        c,
         t,
         r,
-        c
+        i
     ]);
-}, H = /*#__PURE__*/ _react.forwardRef((_param, g)=>{
-    var { disabled: c, error: t, helperText: r, name: i, optional: m, validate: a, onChangeValue: p, onChange: d, value: R, defaultValue: T, onBlur: l, onFocus: u, onPress: x } = _param, s = _object_without_properties(_param, [
+}, I = /*#__PURE__*/ _react.forwardRef((_param, v)=>{
+    var { disabled: i, error: t, helperText: r, name: c, optional: m, validate: a, onChangeValue: p, onChange: d, value: R, defaultValue: T, onBlur: l, onFocus: u, onPress: x, dataAttributes: g } = _param, s = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -159,35 +159,39 @@ const C = (c, t, r, i)=>{
         "defaultValue",
         "onBlur",
         "onFocus",
-        "onPress"
+        "onPress",
+        "dataAttributes"
     ]);
-    const e = _react.useRef(null), v = (o)=>o, h = (o)=>{
+    const e = _react.useRef(null), F = (o)=>o, b = (o)=>{
         s.multiline && e.current && (e.current.scrollTop = 0), l == null || l(o);
-    }, y = (o)=>{
+    }, h = (o)=>{
         s.multiline && setTimeout(()=>{
             if (e.current) {
-                const E = e.current.value;
-                e.current.value = "", e.current.value = E, e.current.scrollTop = e.current.scrollHeight;
+                const y = e.current.value;
+                e.current.value = "", e.current.value = y, e.current.scrollTop = e.current.scrollHeight;
             }
         }, 0), u == null || u(o);
-    }, f = (0, _formcontext.useFieldProps)({
-        name: i,
+    }, n = (0, _formcontext.useFieldProps)({
+        name: c,
         value: R,
         defaultValue: T,
-        processValue: v,
+        processValue: F,
         helperText: r,
         optional: m,
         error: t,
-        disabled: c,
-        onBlur: h,
+        disabled: i,
+        onBlur: b,
         validate: a,
         onChange: d,
         onChangeValue: p
     });
-    return C(e.current, f.value, s.maxLength, f.onChange), /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, s, f), {
+    return H(e.current, n.value, s.maxLength, n.onChange), /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, s, n), {
         onClick: x,
-        inputRef: (0, _common.combineRefs)(e, f.inputRef, g),
-        onFocus: y,
-        type: "text"
+        inputRef: (0, _common.combineRefs)(e, n.inputRef, v),
+        onFocus: h,
+        type: "text",
+        dataAttributes: _object_spread({
+            "component-name": "TextField"
+        }, g)
     }));
-}), z = H;
+}), D = I;

package/dist/text-link.css-mistica.js

@@ -11,7 +11,7 @@ Object.defineProperty(exports, "variants", {
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./text-link.css.ts.vanilla.css-mistica.js");
 var v = {
-    default: "_1m1n0pr1 _1y2v1nfh4 _1y2v1nfgj _1y2v1nfjg _1y2v1nf2c",
-    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nfh4 _1y2v1nfgj _1y2v1nfjg _1y2v1nf2d",
-    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nfh4 _1y2v1nfgj _1y2v1nfjg _1y2v1nf2c"
+    default: "_1m1n0pr1 _1y2v1nfh6 _1y2v1nfgl _1y2v1nfji _1y2v1nf2d",
+    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nfh6 _1y2v1nfgl _1y2v1nfji _1y2v1nf2e",
+    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nfh6 _1y2v1nfgl _1y2v1nfji _1y2v1nf2d"
 };

package/dist/theme-context-provider.js

@@ -20,7 +20,7 @@ _export(exports, {
 const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _dynamic = require("@vanilla-extract/dynamic");
-const _dialog = /*#__PURE__*/ _interop_require_default(require("./dialog.js"));
+const _dialogcontext = require("./dialog-context.js");
 const _screensizecontextprovider = /*#__PURE__*/ _interop_require_default(require("./screen-size-context-provider.js"));
 const _ariaidgettercontext = /*#__PURE__*/ _interop_require_default(require("./aria-id-getter-context.js"));
 const _theme = require("./theme.js");
@@ -202,7 +202,7 @@ const it = "(prefers-color-scheme: dark)", st = ()=>{
                                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_ariaidgettercontext.default.Provider, {
                                     value: R,
                                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_screensizecontextprovider.default, {
-                                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_dialog.default, {
+                                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_dialogcontext.DialogRoot, {
                                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_snackbarcontext.SnackbarRoot, {
                                                 children: o ? /*#__PURE__*/ _react.createElement(o, {
                                                     style: v

package/dist/tooltip.css-mistica.js

@@ -10,10 +10,10 @@ function _export(target, all) {
 }
 _export(exports, {
     arrow: function() {
-        return a;
+        return v;
     },
     arrowContainer: function() {
-        return v;
+        return a;
     },
     container: function() {
         return _;
@@ -28,12 +28,12 @@ _export(exports, {
         return r;
     },
     tooltipTransitionClasses: function() {
-        return f;
+        return i;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./tooltip.css.ts.vanilla.css-mistica.js");
-var a = "_1xhatbpa _1y2v1nfh9 _1y2v1nfhp _1y2v1nfgb _1y2v1nfjn _1y2v1nf36", v = "_1xhatbp8 _1y2v1nfgb _1y2v1nfhb _1y2v1nfjh", _ = "_1xhatbp1 _1y2v1nfgb", y = "_1xhatbp5 _1y2v1nfga _1y2v1nfia _1y2v1nfjh", o = "_1xhatbp3 _1y2v1nfga _1y2v1nfj9 _1y2v1nf36", r = "_1y2v1nfgg _1y2v1nfgm _1y2v1nfgv", f = {
+var v = "_1xhatbpa _1y2v1nfhb _1y2v1nfhr _1y2v1nfgd _1y2v1nfjp _1y2v1nf37", a = "_1xhatbp8 _1y2v1nfgd _1y2v1nfhd _1y2v1nfjj", _ = "_1xhatbp1 _1y2v1nfgd", y = "_1xhatbp5 _1y2v1nfgc _1y2v1nfic _1y2v1nfjj", o = "_1xhatbp3 _1y2v1nfgc _1y2v1nfjb _1y2v1nf37", r = "_1y2v1nfgi _1y2v1nfgo _1y2v1nfgx", i = {
     entering: {
         opacity: 1
     },

package/dist/touchable.css-mistica.js

@@ -10,10 +10,10 @@ function _export(target, all) {
 }
 _export(exports, {
     base: function() {
-        return y;
+        return f;
     },
     notTouchable: function() {
-        return f;
+        return y;
     },
     touchable: function() {
         return _;
@@ -21,4 +21,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./touchable.css.ts.vanilla.css-mistica.js");
-var y = "mhti6u1 _1y2v1nfjg", f = "mhti6u4", _ = "mhti6u1 _1y2v1nfjg _1y2v1nf69 _1y2v1nf7i _1y2v1nf8r _1y2v1nfa0 _1y2v1nfgi _1y2v1nfiy _1y2v1nfh3 _1y2v1nf33 _1y2v1nf68 _1y2v1nfji";
+var f = "mhti6u1 _1y2v1nfji", y = "mhti6u4", _ = "mhti6u1 _1y2v1nfji _1y2v1nf6b _1y2v1nf7k _1y2v1nf8t _1y2v1nfa2 _1y2v1nfgk _1y2v1nfj0 _1y2v1nfh5 _1y2v1nf34 _1y2v1nf6a _1y2v1nfjk";

package/dist/utils/aspect-ratio-support.css-mistica.js

@@ -19,11 +19,11 @@ _export(exports, {
         return y;
     },
     wrapper: function() {
-        return f;
+        return p;
     }
 });
 require("../sprinkles.css.ts.vanilla.css-mistica.js");
 require("./aspect-ratio-support.css.ts.vanilla.css-mistica.js");
-var a = "yqswj62", n = "_1y2v1nfh3 _1y2v1nfhk _1y2v1nfjn _1y2v1nfk2", y = {
+var a = "yqswj62", n = "_1y2v1nfh5 _1y2v1nfhm _1y2v1nfjp _1y2v1nfk4", y = {
     aspectRatio: "var(--yqswj60)"
-}, f = "_1y2v1nfjh _1y2v1nfiv _1y2v1nfiw _1y2v1nfga";
+}, p = "_1y2v1nfjj _1y2v1nfix _1y2v1nfiy _1y2v1nfgc";

package/dist/utils/platform.js

@@ -10,28 +10,25 @@ function _export(target, all) {
 }
 _export(exports, {
     getPlatform: function() {
-        return g;
+        return p;
     },
     isAndroid: function() {
         return o;
     },
     isChrome: function() {
-        return p;
+        return a;
     },
     isFirefox: function() {
-        return f;
+        return d;
     },
     isInsideNovumNativeApp: function() {
-        return s;
+        return r;
     },
     isIos: function() {
         return u;
     },
     isRunningAcceptanceTest: function() {
-        return a;
-    },
-    isSafari: function() {
-        return d;
+        return f;
     }
 });
 const _webviewbridge = require("@tef-novum/webview-bridge");
@@ -40,13 +37,13 @@ const t = function() {
     var n;
     var _e_userAgent, _ref;
     return typeof self > "u" ? (_e_userAgent = e.userAgent) !== null && _e_userAgent !== void 0 ? _e_userAgent : "" : (_ref = (n = self.navigator) == null ? void 0 : n.userAgent) !== null && _ref !== void 0 ? _ref : "";
-}, s = function() {
+}, r = function() {
     let e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
     return typeof e.insideNovumNativeApp < "u" ? e.insideNovumNativeApp : (0, _webviewbridge.isWebViewBridgeAvailable)();
-}, a = function() {
+}, f = function() {
     let e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
     return t(e).includes("acceptance-test") && !process.env.SSR_TEST;
-}, i = !!(typeof self < "u" && self.MSStream), o = (e)=>t(e).toLowerCase().includes("android") && !i, u = (e)=>!!(/iPad|iPhone|iPod/.test(t(e)) && !i || s(e) && !o(e)), d = ()=>navigator.vendor.includes("Apple"), f = (e)=>!!t(e).match(/Firefox\/([0-9]+)\./), p = (e)=>!!t(e).match(/Chrom(e|ium)\/([0-9]+)\./), g = function() {
+}, i = !!(typeof self < "u" && self.MSStream), o = (e)=>t(e).toLowerCase().includes("android") && !i, u = (e)=>!!(/iPad|iPhone|iPod/.test(t(e)) && !i || r(e) && !o(e)), d = (e)=>!!t(e).match(/Firefox\/([0-9]+)\./), a = (e)=>!!t(e).match(/Chrom(e|ium)\/([0-9]+)\./), p = function() {
     let e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
     const n = e.platform;
     return n || (u(e) ? "ios" : o(e) ? "android" : "desktop");

package/dist/video.css-mistica.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "video", {
     enumerable: true,
     get: function() {
-        return n;
+        return y;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
-var n = "_1y2v1nfjn _1y2v1nfk2 _1y2v1nfgi _1y2v1nf68 _1y2v1nfiv _1y2v1nfiw _1y2v1nflb";
+var y = "_1y2v1nfjp _1y2v1nfk4 _1y2v1nfgk _1y2v1nf6a _1y2v1nfix _1y2v1nfiy _1y2v1nfld";

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

@@ -1,9 +1,9 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./accordion.css.ts.vanilla.css-mistica.js";
-var e = "_8s3szx3", r = "_1y2v1nf69 _1y2v1nf7i _1y2v1nf8r _1y2v1nfa0 _1y2v1nfh3 _1y2v1nfiy _1y2v1nf68 _1y2v1nfgi _1y2v1nfhk", v = "_8s3szx9", a = "_8s3szx4", _ = {
+var e = "_8s3szx3", a = "_1y2v1nf6b _1y2v1nf7k _1y2v1nf8t _1y2v1nfa2 _1y2v1nfh5 _1y2v1nfj0 _1y2v1nf6a _1y2v1nfgk _1y2v1nfhm", v = "_8s3szx9", r = "_8s3szx4", t = {
     enter: "_8s3szx5",
     enterActive: "_8s3szx6",
     exit: "_8s3szx7",
     exitActive: "_8s3szx8"
-}, t = "_8s3szx1", i = "_8s3szx2";
-export { e as chevronContainer, r as itemContent, v as panel, a as panelContainer, _ as panelTransitionClasses, t as touchableBackground, i as touchableBackgroundInverse };
+}, _ = "_8s3szx1", o = "_8s3szx2";
+export { e as chevronContainer, a as itemContent, v as panel, r as panelContainer, t as panelTransitionClasses, _ as touchableBackground, o as touchableBackgroundInverse };

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

@@ -1,3 +1,3 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
-var a = "_1y2v1nfje _1y2v1nfgg _1y2v1nfgv _1y2v1nfgp _1y2v1nfjh", f = "_1y2v1nflb";
+var a = "_1y2v1nfjg _1y2v1nfgi _1y2v1nfgx _1y2v1nfgr _1y2v1nfjj", f = "_1y2v1nfld";
 export { a as avatar, f as image };

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./badge.css.ts.vanilla.css-mistica.js";
-var _ = "_17szrmd2 _1y2v1nfh8 _1y2v1nfho _1y2v1nf4p", n = "_17szrmd6", f = "_17szrmd4 _17szrmd2 _1y2v1nfh8 _1y2v1nfho _1y2v1nf4p _1y2v1nfgg _1y2v1nfgv _1y2v1nfgp", g = "_1y2v1nfgb", y = "_1y2v1nfga _1y2v1nfgk";
-export { _ as badge, n as badgeBigNumber, f as badgeNumber, g as badgeWithChildren, y as container };
+var _ = "_17szrmd2 _1y2v1nfha _1y2v1nfhq _1y2v1nf4r", n = "_17szrmd6", a = "_17szrmd4 _17szrmd2 _1y2v1nfha _1y2v1nfhq _1y2v1nf4r _1y2v1nfgi _1y2v1nfgx _1y2v1nfgr", f = "_1y2v1nfgd", y = "_1y2v1nfgc _1y2v1nfgm";
+export { _ as badge, n as badgeBigNumber, a as badgeNumber, f as badgeWithChildren, y as container };

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

@@ -1,3 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
-var o = "_1y2v1nfix";
-export { o as boxBorder };
+import "./boxed.css.ts.vanilla.css-mistica.js";
+var e = "_1y2v1nfiz", i = "ihbkeq1";
+export { e as boxBorder, i as desktopOnly };

package/dist-es/boxed.js

@@ -53,19 +53,19 @@ function _object_spread_props(target, source) {
 }
 import { jsx as a } from "react/jsx-runtime";
 import * as i from "react";
-import g from "classnames";
-import { useIsInverseVariant as B, ThemeVariant as k } from "./theme-variant-context.js";
-import { getPrefixedDataAttributes as y } from "./utils/dom.js";
+import k from "classnames";
+import { useIsInverseVariant as y, ThemeVariant as B } from "./theme-variant-context.js";
+import { getPrefixedDataAttributes as O } from "./utils/dom.js";
 import { vars as o } from "./skins/skin-contract.css-mistica.js";
-import { boxBorder as R } from "./boxed.css-mistica.js";
+import { desktopOnly as R, boxBorder as h } from "./boxed.css-mistica.js";
 import { sprinkles as s } from "./sprinkles.css-mistica.js";
-const h = (e, r)=>e || r ? s({
+const w = (e, r)=>e || r ? s({
         border: "none"
-    }) : R, w = /*#__PURE__*/ i.forwardRef((param, v)=>{
-    let { children: e, isInverse: r = !1, className: l, role: d, dataAttributes: m, "aria-label": b, "aria-labelledby": f, width: c, height: p, minHeight: u, borderRadius: x = o.borderRadii.container, background: t } = param;
-    const n = B();
+    }) : h, C = /*#__PURE__*/ i.forwardRef((param, g)=>{
+    let { children: e, isInverse: r = !1, className: l, role: d, dataAttributes: m, "aria-label": b, "aria-labelledby": f, width: c, height: p, minHeight: u, borderRadius: x = o.borderRadii.container, background: t, desktopOnly: v } = param;
+    const n = y();
     return /* @__PURE__ */ a("div", _object_spread_props(_object_spread({
-        ref: v,
+        ref: g,
         style: {
             width: c,
             height: p,
@@ -73,21 +73,23 @@ const h = (e, r)=>e || r ? s({
             boxSizing: "border-box",
             background: t
         },
-        className: g(l, h(n, r), s({
+        className: k(l, w(n, r), s({
             borderRadius: x,
             overflow: "hidden",
             background: (t !== null && t !== void 0 ? t : r) ? n ? o.colors.backgroundContainerBrandOverInverse : o.colors.backgroundContainerBrand : o.colors.backgroundContainer
-        })),
+        }), {
+            [R]: v
+        }),
         role: d,
         "aria-label": b,
         "aria-labelledby": f
-    }, y(m)), {
-        children: /* @__PURE__ */ a(k, {
+    }, O(m)), {
+        children: /* @__PURE__ */ a(B, {
             isInverse: r,
             children: e
         })
     }));
-}), A = /*#__PURE__*/ i.forwardRef((e, r)=>/* @__PURE__ */ a(w, _object_spread_props(_object_spread({}, e), {
+}), N = /*#__PURE__*/ i.forwardRef((e, r)=>/* @__PURE__ */ a(C, _object_spread_props(_object_spread({}, e), {
         ref: r
     })));
-export { A as Boxed, w as InternalBoxed };
+export { N as Boxed, C as InternalBoxed };

package/dist-es/button-fixed-footer-layout.js

@@ -1,32 +1,37 @@
 "use client";
-import { jsx as o, jsxs as d } from "react/jsx-runtime";
-import p from "./fixed-footer-layout.js";
-import c from "./button-layout.js";
-import { useScreenSize as x } from "./hooks.js";
-import { InternalResponsiveLayout as F } from "./responsive-layout.js";
-import h from "./box.js";
-const B = (param)=>{
-    let { isFooterVisible: i = !0, button: t, secondaryButton: r, link: n, children: s, desktopButtonAlign: a = "left", footerBgColor: l, containerBgColor: m, onChangeFooterHeight: u } = param;
-    const { isTabletOrSmaller: e, isTablet: f } = x();
-    return /* @__PURE__ */ o(p, {
-        onChangeFooterHeight: u,
-        isFooterVisible: (!!t || !!r) && i,
-        footerBgColor: l,
-        containerBgColor: m,
-        footer: /* @__PURE__ */ o(F, {
-            children: /* @__PURE__ */ o(h, {
-                paddingY: f ? 32 : e ? 16 : 0,
-                children: /* @__PURE__ */ d(c, {
-                    align: e ? "full-width" : a,
-                    link: n,
+import { jsx as o, jsxs as p } from "react/jsx-runtime";
+import l from "./fixed-footer-layout.js";
+import f from "./button-layout.js";
+import { useScreenSize as h } from "./hooks.js";
+import { InternalResponsiveLayout as x } from "./responsive-layout.js";
+import c from "./box.js";
+const F = (param)=>{
+    let { isFooterVisible: i = !0, button: t, secondaryButton: e, link: s, children: n, desktopButtonAlign: r, footerBgColor: a, containerBgColor: d, onChangeFooterHeight: m } = param;
+    const { isDesktopOrBigger: u } = h();
+    return /* @__PURE__ */ o(l, {
+        onChangeFooterHeight: m,
+        isFooterVisible: (!!t || !!e) && i,
+        footerBgColor: a,
+        containerBgColor: d,
+        footer: /* @__PURE__ */ o(x, {
+            shouldExpandWhenNested: "desktop",
+            children: /* @__PURE__ */ o(c, {
+                paddingY: {
+                    mobile: 16,
+                    tablet: 32,
+                    desktop: 0
+                },
+                children: /* @__PURE__ */ p(f, {
+                    align: u && r ? r : "full-width",
+                    link: s,
                     children: [
                         t,
-                        r
+                        e
                     ]
                 })
             })
         }),
-        children: s
+        children: n
     });
-}, v = B;
-export { v as default };
+}, S = F;
+export { S as default };

package/dist-es/button-group.css-mistica.js

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./button-group.css.ts.vanilla.css-mistica.js";
-var r = "_1xdd1h64", t = "_1xdd1h63", v = "_1xdd1h62", _ = "_1xdd1h61 _1y2v1nfgh _1y2v1nfgv _1y2v1nfgl";
+var r = "_1xdd1h64", t = "_1xdd1h63", v = "_1xdd1h62", _ = "_1xdd1h61 _1y2v1nfgj _1y2v1nfgx _1y2v1nfgn";
 export { r as buttonChild, t as buttons, v as container, _ as inline };

package/dist-es/button-layout.css-mistica.js

@@ -1,10 +1,10 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./button.css.ts.vanilla.css-mistica.js";
 import "./button-layout.css.ts.vanilla.css-mistica.js";
-var l = "kfxylhg", a = {
-    right: "_1y2v1nfgq",
-    left: "_1y2v1nfgo",
-    center: "_1y2v1nfgp",
-    "full-width": "kfxylhf _1y2v1nfgp"
-}, i = "kfxylh5 _1y2v1nfgg", v = "kfxylh6", y = "kfxylh7", g = "kfxylh2 _1y2v1nfgg _1y2v1nfh3", h = "kfxylh3", t = "kfxylh0";
-export { l as alignMoreThanOneChildren, a as alignVariant, i as baseContainer, v as container, y as fullWidthContainer, g as link, h as linkAlignment, t as margins };
+var r = "kfxylhh", y = {
+    right: "kfxylhd _1y2v1nfgs",
+    left: "kfxylhe _1y2v1nfgq",
+    center: "kfxylhf _1y2v1nfgr",
+    "full-width": "kfxylhg _1y2v1nfgr"
+}, h = "kfxylh6 _1y2v1nfgi _1y2v1nfgx", i = "kfxylh7", a = "kfxylh8", v = "kfxylh3 kfxylh2 _1y2v1nfgi _1y2v1nfh5", t = "kfxylh4", k = "kfxylh2 _1y2v1nfgi _1y2v1nfh5", x = "kfxylh0";
+export { r as alignMoreThanOneChildren, y as alignVariant, h as baseContainer, i as container, a as fullWidthContainer, v as link, t as linkAlignment, k as linkWithTwoButtons, x as margins };