@telefonica/mistica 14.14.0 → 14.16.0

package/dist/date-time-picker.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return Z;
+        return ie;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -21,6 +21,10 @@ const _hooks = require("./hooks.js");
 const _iconcloseregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-close-regular.js"));
 const _datetimepickercssmistica = require("./date-time-picker.css-mistica.js");
 const _skincontractcssmistica = require("./skins/skin-contract.css-mistica.js");
+require("moment/locale/es");
+require("moment/locale/de");
+require("moment/locale/pt-br");
+require("moment/locale/en-gb");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -144,49 +148,64 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const g = navigator.language.toLocaleLowerCase().split("-")[0];
-Promise.resolve(/* webpackChunkName: "moment-locale" */ `moment/locale/${g}`).then((p)=>/*#__PURE__*/ _interop_require_wildcard(require(p))).finally(()=>{});
-const Z = (_param)=>{
-    var { withTime: s , mode: l , isValidDate: y , optional: u  } = _param, t = _object_without_properties(_param, [
+const A = {
+    es: "es",
+    // spanish
+    ca: "es",
+    // catalan
+    eu: "es",
+    // euskera
+    gl: "es",
+    // gallego
+    de: "de",
+    // german
+    pt: "pt-br",
+    // portuguese
+    en: "en-gb"
+}, O = (a)=>{
+    const i = a.toLocaleLowerCase().split("-")[0];
+    return A[i] || "en-gb";
+}, ie = (_param)=>{
+    var { withTime: a , mode: i , isValidDate: h , optional: u  } = _param, t = _object_without_properties(_param, [
         "withTime",
         "mode",
         "isValidDate",
         "optional"
     ]);
-    const [m, x] = _react.useState(!1), { texts: b  } = (0, _hooks.useTheme)(), n = _react.useRef(null), { height: v , ref: k  } = (0, _hooks.useElementDimensions)(), i = (e)=>{
-        t.disabled || x(e);
-    }, w = ()=>{
-        var p;
-        const { top: e = 0 , bottom: o = 0 , left: a = 0  } = ((p = n.current) == null ? void 0 : p.getBoundingClientRect()) || {}, P = 260 + o < window.innerHeight;
+    const [m, y] = _react.useState(!1), { texts: x , i18n: { locale: b  }  } = (0, _hooks.useTheme)(), n = _react.useRef(null), { height: k , ref: v  } = (0, _hooks.useElementDimensions)(), l = (e)=>{
+        t.disabled || y(e);
+    }, C = ()=>{
+        var f;
+        const { top: e = 0 , bottom: o = 0 , left: c = 0  } = ((f = n.current) == null ? void 0 : f.getBoundingClientRect()) || {}, M = 260 + o < window.innerHeight;
         return {
             width: _textfieldcomponentscssmistica.DEFAULT_WIDTH,
-            top: P ? o : e - v,
-            left: a,
+            top: M ? o : e - k,
+            left: c,
             position: "absolute",
             borderRadius: _skincontractcssmistica.vars.borderRadii.input,
             overflow: "hidden",
             boxShadow: "0px 5px 5px -3px rgba(0,0,0,0.2), 0px 8px 10px 1px rgba(0,0,0,0.14), 0px 3px 14px 2px rgba(0,0,0,0.12)"
         };
-    }, c = ()=>{
+    }, s = ()=>{
         var o;
         const e = (o = n.current) == null ? void 0 : o.value;
         return e ? new Date(e) : void 0;
-    }, C = (e)=>s ? e.format("yyyy-MM-DD HH:mm") : l === "year-month" ? e.format("yyyy-MM") : e.format("yyyy-MM-DD"), f = (e)=>{
-        var a;
-        const o = typeof e == "string" ? e : C(e);
-        n.current && (n.current.focus(), (a = t.onChange) == null || a.call(t, (0, _dom.createChangeEvent)(n.current, o)));
-    }, D = ()=>c() && u ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.default, {
-            "aria-label": b.clearButton,
+    }, D = (e)=>a ? e.format("yyyy-MM-DD HH:mm") : i === "year-month" ? e.format("yyyy-MM") : e.format("yyyy-MM-DD"), p = (e)=>{
+        var c;
+        const o = typeof e == "string" ? e : D(e);
+        n.current && (n.current.focus(), (c = t.onChange) == null || c.call(t, (0, _dom.createChangeEvent)(n.current, o)));
+    }, w = ()=>s() && u ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.default, {
+            "aria-label": x.clearButton,
             size: 32,
             onPress: ()=>{
-                f("");
+                p("");
             },
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconcloseregular.default, {})
         }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.default, {
             disabled: t.disabled,
             "aria-label": "",
             size: 32,
-            onPress: ()=>i(!m),
+            onPress: ()=>l(!m),
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconcalendarregular.default, {})
         });
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
@@ -198,36 +217,36 @@ const Z = (_param)=>{
                 required: !u,
                 type: "text",
                 autoComplete: "off",
-                shrinkLabel: !!c(),
-                endIcon: D(),
+                shrinkLabel: !!s(),
+                endIcon: w(),
                 inputRef: (e)=>{
                     var o;
                     (o = t == null ? void 0 : t.inputRef) == null || o.call(t, e), n.current = e;
                 },
                 readOnly: !0,
-                onKeyDown: ()=>i(!0),
+                onKeyDown: ()=>l(!0),
                 onClick: ()=>{
-                    i(!0);
+                    l(!0);
                 }
             })),
             m && /* @__PURE__ */ (0, _jsxruntime.jsx)(_overlay.default, {
                 onPress: (e)=>{
-                    (0, _dom.cancelEvent)(e), i(!1);
+                    (0, _dom.cancelEvent)(e), l(!1);
                 },
                 disableScroll: !0,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                    ref: k,
-                    style: w(),
+                    ref: v,
+                    style: C(),
                     className: _datetimepickercssmistica.reactDatePicker,
                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_reactdatetime.default, {
-                        initialViewMode: l === "year-month" ? "months" : void 0,
-                        dateFormat: l === "year-month" ? "YYYY-MM" : void 0,
-                        timeFormat: s ? "HH:mm" : !1,
-                        initialValue: c(),
-                        locale: g,
+                        initialViewMode: i === "year-month" ? "months" : void 0,
+                        dateFormat: i === "year-month" ? "YYYY-MM" : void 0,
+                        timeFormat: a ? "HH:mm" : !1,
+                        initialValue: s(),
+                        locale: O(b),
                         input: !1,
-                        onChange: f,
-                        isValidDate: y
+                        onChange: p,
+                        isValidDate: h
                     })
                 })
             })

package/dist/dialog.css-mistica.js

@@ -42,7 +42,7 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./dialog.css.ts.vanilla.css-mistica.js");
-var _ = "_3dl29lb", y = "_3dl29l6", f = "_3dl29ll _1y2v1nf6x", a = "_3dl29lj _1y2v1nf6q _1y2v1nf9l", l = "_3dl29lm", d = "_3dl29l8 _1y2v1nf6w _1y2v1nf7a _1y2v1nf7o _1y2v1nf82 _1y2v1nf60 _1y2v1nfam _1y2v1nfbe", o = "_3dl29la _1y2v1nf30 _1y2v1nfab", r = "_3dl29l5 _1y2v1nf61 _1y2v1nf64 _1y2v1nf6d _1y2v1nf6j _1y2v1nf6a _1y2v1nfam _1y2v1nfbe _1y2v1nfbs _1y2v1nfb0 _1y2v1nf3b", t = {
-    dialog: "_3dl29ld _1y2v1nf64 _1y2v1nf6a _1y2v1nf6g _1y2v1nf7p _1y2v1nf83 _1y2v1nf6z _1y2v1nf7b",
-    default: "_3dl29ld _1y2v1nf64 _1y2v1nf6a _1y2v1nf6g _1y2v1nf6x _1y2v1nf7b _1y2v1nf7p _1y2v1nf83"
+var _ = "_3dl29lb", y = "_3dl29l6", f = "_3dl29ll _1y2v1nf6y", a = "_3dl29lj _1y2v1nf6q _1y2v1nf9s", l = "_3dl29lm", d = "_3dl29l8 _1y2v1nf6w _1y2v1nf7b _1y2v1nf7q _1y2v1nf85 _1y2v1nf60 _1y2v1nfau _1y2v1nfbo", o = "_3dl29la _1y2v1nf30 _1y2v1nfaj", r = "_3dl29l5 _1y2v1nf61 _1y2v1nf64 _1y2v1nf6d _1y2v1nf6j _1y2v1nf6a _1y2v1nfau _1y2v1nfbo _1y2v1nfc3 _1y2v1nfb9 _1y2v1nf3b", t = {
+    dialog: "_3dl29ld _1y2v1nf64 _1y2v1nf6a _1y2v1nf6g _1y2v1nf7s _1y2v1nf87 _1y2v1nf70 _1y2v1nf7d",
+    default: "_3dl29ld _1y2v1nf64 _1y2v1nf6a _1y2v1nf6g _1y2v1nf6y _1y2v1nf7d _1y2v1nf7s _1y2v1nf87"
 }, e = "_3dl29l3 _1y2v1nf5z";

package/dist/double-field.css-mistica.js

@@ -12,6 +12,6 @@ require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./text-field-components.css.ts.vanilla.css-mistica.js");
 require("./double-field.css.ts.vanilla.css-mistica.js");
 var n = {
-    default: "skrulh1 _1y2v1nf64 _1y2v1nf69 _1y2v1nf8b",
-    fullWidth: "skrulh2 _1y2v1nf64 _1y2v1nf69 _1y2v1nf8b"
+    default: "skrulh1 _1y2v1nf64 _1y2v1nf69 _1y2v1nf8f",
+    fullWidth: "skrulh2 _1y2v1nf64 _1y2v1nf69 _1y2v1nf8f"
 };

package/dist/empty-state-card.css-mistica.js

@@ -21,4 +21,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./empty-state-card.css.ts.vanilla.css-mistica.js");
-var n = "_1azor6p0", o = "_1azor6p4 _1y2v1nf8m _1y2v1nf91", v = "_1azor6p2 _1y2v1nf66 _1y2v1nf93";
+var n = "_1azor6p0", o = "_1azor6p4 _1y2v1nf8r _1y2v1nf97", v = "_1azor6p2 _1y2v1nf66 _1y2v1nf99";

package/dist/empty-state.css-mistica.js

@@ -28,10 +28,10 @@ _export(exports, {
         return o;
     },
     smallImage: function() {
-        return u;
+        return t;
     },
     vars: function() {
-        return t;
+        return u;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
@@ -39,6 +39,6 @@ require("./empty-state.css.ts.vanilla.css-mistica.js");
 var n = "_13fzrua2 _1y2v1nf64 _1y2v1nf5y", v = {
     default: "_13fzrua3",
     largeImage: "_13fzrua4"
-}, e = "_13fzrua9 _1y2v1nf8o _1y2v1nf93", f = "_13fzruac", _ = "_13fzrua7 _1y2v1nf8r", o = "_13fzrua5", u = "_13fzruab _1y2v1nf66", t = {
+}, e = "_13fzrua9 _1y2v1nf8t _1y2v1nf99", f = "_13fzruac", _ = "_13fzrua7 _1y2v1nf8w", o = "_13fzrua5", t = "_13fzruab _1y2v1nf66", u = {
     backgroundColor: "var(--_13fzrua0)"
 };

package/dist/feedback.css-mistica.js

@@ -10,10 +10,10 @@ function _export(target, all) {
 }
 _export(exports, {
     container: function() {
-        return r;
+        return n;
     },
     desktopContainer: function() {
-        return n;
+        return r;
     },
     desktopContent: function() {
         return t;
@@ -33,4 +33,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./feedback.css.ts.vanilla.css-mistica.js");
-var r = "gx6h6a3 _1y2v1nf64 _1y2v1nf8r _1y2v1nf8b", n = "_1y2v1nfac _1y2v1nf64 _1y2v1nf6g", t = "gx6h6a1", v = "gx6h6a7", f = "gx6h6a5", o = "gx6h6a6", p = "gx6h6a4";
+var n = "gx6h6a3 _1y2v1nf64 _1y2v1nf8w _1y2v1nf8f", r = "_1y2v1nfak _1y2v1nf64 _1y2v1nf6g", t = "gx6h6a1", v = "gx6h6a7", f = "gx6h6a5", o = "gx6h6a6", p = "gx6h6a4";

package/dist/fixed-footer-layout.css-mistica.js

@@ -30,7 +30,7 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./fixed-footer-layout.css.ts.vanilla.css-mistica.js");
-var v = "p5j8j58", a = "p5j8j56 _1y2v1nf31", j = "p5j8j54", t = "p5j8j53 _1y2v1nf8b _1y2v1nf30", e = {
+var v = "p5j8j58", a = "p5j8j56 _1y2v1nf31", j = "p5j8j54", t = "p5j8j53 _1y2v1nf8f _1y2v1nf30", e = {
     footerHeight: "var(--p5j8j50)",
     backgroundColor: "var(--p5j8j51)"
 }, p = "_1y2v1nf63";

package/dist/fixed-footer-layout.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return ue;
+        return ce;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -17,7 +17,6 @@ const _hooks = require("./hooks.js");
 const _dom = require("./utils/dom.js");
 const _fixedfooterlayoutcssmistica = require("./fixed-footer-layout.css-mistica.js");
 const _dynamic = require("@vanilla-extract/dynamic");
-const _environment = require("./utils/environment.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -62,58 +61,111 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-const Y = 2, Z = (e)=>e === document.documentElement ? window : e, ee = (e)=>{
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+const X = 2, Y = (e)=>e === document.documentElement ? window : e, Z = (e)=>{
     const n = setTimeout(e, 0);
     return {
         cancel: ()=>clearTimeout(n)
     };
-}, te = (param)=>{
-    let { isFooterVisible: e = !0 , footer: n , footerHeight: x = "auto" , footerBgColor: T , containerBgColor: g , children: y , onChangeFooterHeight: o  } = param;
-    const [w, F] = _react.useState(!1), i = _react.useRef(null), { isTabletOrSmaller: b  } = (0, _hooks.useScreenSize)(), { platformOverrides: u  } = (0, _hooks.useTheme)(), { height: r , ref: I  } = (0, _hooks.useElementDimensions)(), R = (0, _hooks.useIsWithinIFrame)(), d = (0, _hooks.useWindowHeight)(), A = (0, _hooks.useScreenHeight)(), a = d - r > (R ? d : A) / Y;
+}, C = (param)=>{
+    let { isFooterVisible: e = !0 , footer: n , footerHeight: x = "auto" , footerBgColor: S , containerBgColor: m , children: T , onChangeFooterHeight: o  } = param;
+    const [g, y] = _react.useState(!1), u = _react.useRef(null), { isTabletOrSmaller: w  } = (0, _hooks.useScreenSize)(), { platformOverrides: d  } = (0, _hooks.useTheme)(), { height: s , ref: F  } = (0, _hooks.useElementDimensions)(), b = (0, _hooks.useIsWithinIFrame)(), f = (0, _hooks.useWindowHeight)(), I = (0, _hooks.useScreenHeight)(), i = f - s > (b ? f : I) / X;
     (0, _hooks.useIsomorphicLayoutEffect)(()=>{
-        o == null || o(r);
+        o == null || o(s);
     }, [
         o,
-        r
+        s
     ]), _react.useEffect(()=>{
-        const c = (0, _dom.getScrollableParentElement)(i.current), L = ()=>(0, _platform.isRunningAcceptanceTest)(u) || !a ? !1 : (0, _dom.hasScroll)(c) ? (0, _dom.getScrollDistanceToBottom)(c) > 1 : !1, t = (0, _debounce.default)(()=>{
-            F(L());
+        const a = (0, _dom.getScrollableParentElement)(u.current), R = ()=>(0, _platform.isRunningAcceptanceTest)(d) || !i ? !1 : (0, _dom.hasScroll)(a) ? (0, _dom.getScrollDistanceToBottom)(a) > 1 : !1, t = (0, _debounce.default)(()=>{
+            y(R());
         }, 50, {
             leading: !0,
             maxWait: 200
-        }), O = ee(t), s = Z(c);
-        return (0, _dom.addPassiveEventListener)(s, "resize", t), (0, _dom.addPassiveEventListener)(s, "scroll", t), ()=>{
-            t.cancel(), (0, _dom.removePassiveEventListener)(s, "scroll", t), (0, _dom.removePassiveEventListener)(s, "resize", t), O.cancel();
+        }), A = Z(t), r = Y(a);
+        return (0, _dom.addPassiveEventListener)(r, "resize", t), (0, _dom.addPassiveEventListener)(r, "scroll", t), ()=>{
+            t.cancel(), (0, _dom.removePassiveEventListener)(r, "scroll", t), (0, _dom.removePassiveEventListener)(r, "resize", t), A.cancel();
         };
     }, [
-        a,
-        u
+        i,
+        d
     ]);
-    const D = (0, _environment.isClientSide)() && (0, _dom.hasScroll)((0, _dom.getScrollableParentElement)(i.current)), f = a || !D;
+    const p = i;
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                ref: i,
+                ref: u,
                 className: _fixedfooterlayoutcssmistica.container,
-                style: (0, _dynamic.assignInlineVars)({
-                    [_fixedfooterlayoutcssmistica.vars.backgroundColor]: g !== null && g !== void 0 ? g : "",
-                    [_fixedfooterlayoutcssmistica.vars.footerHeight]: f ? `${r}px` : "0px"
-                }),
-                children: y
+                style: (0, _dynamic.assignInlineVars)(_object_spread_props(_object_spread({}, m && {
+                    [_fixedfooterlayoutcssmistica.vars.backgroundColor]: m
+                }), {
+                    [_fixedfooterlayoutcssmistica.vars.footerHeight]: p ? `${s}px` : "0px"
+                })),
+                children: T
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_fixedfooterlayoutcssmistica.footer, {
                     [_fixedfooterlayoutcssmistica.withoutFooter]: !e,
-                    [_fixedfooterlayoutcssmistica.elevated]: w,
-                    [_fixedfooterlayoutcssmistica.fixedFooter]: f
+                    [_fixedfooterlayoutcssmistica.elevated]: g,
+                    [_fixedfooterlayoutcssmistica.fixedFooter]: p
                 }),
                 style: {
-                    background: b ? T : void 0
+                    background: w ? S : void 0
                 },
                 "data-testid": `fixed-footer${e ? "-visible" : "-hidden"}`,
                 "data-position-fixed": "bottom",
                 children: e && /* @__PURE__ */ (0, _jsxruntime.jsx)("aside", {
-                    ref: I,
+                    ref: F,
                     "data-component-name": "FixedFooter",
                     style: {
                         height: x,
@@ -124,4 +176,4 @@ const Y = 2, Z = (e)=>e === document.documentElement ? window : e, ee = (e)=>{
             })
         ]
     });
-}, ue = te;
+}, ce = C;

package/dist/grid.css.d.ts

@@ -9,8 +9,8 @@ export declare const vars: {
 export declare const grid: string;
 export declare const gridTemplateColumnsAutoRepeat: string;
 export declare const gridTemplateRowsAutoRepeat: string;
-export declare const gridTemplateColumns: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
-export declare const gridTemplateRows: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const gridTemplateColumns: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 3 | 10 | 7 | 11, string>;
+export declare const gridTemplateRows: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 3 | 10 | 7 | 11, string>;
 export declare const gridAutoFlow: Record<"column" | "row" | "row dense" | "column dense", string>;
 export declare const gridJustifyItems: Record<"center" | "stretch" | "end" | "start", string>;
 export declare const gridAlignItems: Record<"center" | "stretch" | "end" | "start" | "baseline", string>;
@@ -18,9 +18,9 @@ export declare const gridJustifyContent: Record<"center" | "space-around" | "spa
 export declare const gridAlignContent: Record<"center" | "space-around" | "space-between" | "space-evenly" | "stretch" | "end" | "start", string>;
 export declare const fullColumns: string;
 export declare const fullRows: string;
-export declare const spanColumns: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
-export declare const spanRows: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
-export declare const columnStart: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
-export declare const rowStart: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 10 | 3 | 7 | 11, string>;
+export declare const spanColumns: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 3 | 10 | 7 | 11, string>;
+export declare const spanRows: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 3 | 10 | 7 | 11, string>;
+export declare const columnStart: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 3 | 10 | 7 | 11, string>;
+export declare const rowStart: Record<2 | 4 | 8 | 12 | 6 | 5 | 1 | 9 | 3 | 10 | 7 | 11, string>;
 export declare const justifySelf: Record<"center" | "stretch" | "end" | "start", string>;
 export declare const alignSelf: Record<"center" | "stretch" | "end" | "start" | "baseline", string>;

package/dist/hero.css-mistica.js

@@ -31,6 +31,6 @@ _export(exports, {
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./responsive-layout.css.ts.vanilla.css-mistica.js");
 require("./hero.css.ts.vanilla.css-mistica.js");
-var v = "_16rbpto6 _1y2v1nf64 _1y2v1nf6q _1y2v1nf6k", a = "_16rbpto2 _1y2v1nf64", n = "_1y2v1nf6j _1y2v1nf8r", _ = "_1y2v1nf6a", i = "_16rbpto7", p = {
+var v = "_16rbpto6 _1y2v1nf64 _1y2v1nf6q _1y2v1nf6k", a = "_16rbpto2 _1y2v1nf64", n = "_1y2v1nf6j _1y2v1nf8w", _ = "_1y2v1nf6a", i = "_16rbpto7", p = {
     height: "var(--_16rbpto0)"
 };

package/dist/highlighted-card.css-mistica.js

@@ -25,6 +25,6 @@ _export(exports, {
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./highlighted-card.css.ts.vanilla.css-mistica.js");
 var y = "wrb8722 _1y2v1nf64 _1y2v1nf69 _1y2v1nf6g _1y2v1nf6m", f = "wrb8725 _1y2v1nf64", _ = {
-    withImage: "wrb8728 wrb8727 _1y2v1nf64 _1y2v1nf6a _1y2v1nf6i _1y2v1nf6x _1y2v1nf7b _1y2v1nf7o",
-    withoutImage: "wrb8729 wrb8727 _1y2v1nf64 _1y2v1nf6a _1y2v1nf6i _1y2v1nf6x _1y2v1nf7b _1y2v1nf7o"
-}, r = "_1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf64 _1y2v1nf6m _1y2v1nfa2 _1y2v1nf8b _1y2v1nf5y";
+    withImage: "wrb8728 wrb8727 _1y2v1nf64 _1y2v1nf6a _1y2v1nf6i _1y2v1nf6y _1y2v1nf7d _1y2v1nf7q",
+    withoutImage: "wrb8729 wrb8727 _1y2v1nf64 _1y2v1nf6a _1y2v1nf6i _1y2v1nf6y _1y2v1nf7d _1y2v1nf7q"
+}, r = "_1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 _1y2v1nf64 _1y2v1nf6m _1y2v1nfaa _1y2v1nf8f _1y2v1nf5y";

package/dist/hooks.d.ts

@@ -24,7 +24,7 @@ export declare const useIsomorphicLayoutEffect: typeof React.useLayoutEffect;
 type IntersectionObserverOptions = {
     root?: Element | Document | null;
     rootMargin?: string;
-    threshold?: number | number[];
+    threshold?: number | Array<number>;
 };
 export declare const useIsInViewport: (ref: React.RefObject<HTMLElement>, defaultValue: boolean, options?: IntersectionObserverOptions) => boolean;
 export {};

package/dist/icons/icon-cvv-amex.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 type Props = {
     role?: string;
     size?: number;
+    color?: string;
 };
 declare const IconCvvAmex: React.FC<Props>;
 export default IconCvvAmex;

package/dist/icons/icon-cvv-amex.js

@@ -5,12 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return a;
+        return s;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
+const _skincontractcssmistica = require("../skins/skin-contract.css-mistica.js");
 const l = (param)=>/* @__PURE__ */ {
-    let { role: t = "presentation" , size: c = 48  } = param;
+    let { role: t = "presentation" , size: c = 48 , color: r  } = param;
     return (0, _jsxruntime.jsx)("svg", {
         width: c,
         height: c,
@@ -20,7 +21,7 @@ const l = (param)=>/* @__PURE__ */ {
             flexShrink: 0
         },
         children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("g", {
-            fill: "#00A9E0",
+            fill: r || _skincontractcssmistica.vars.colors.brand,
             children: [
                 /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
                     d: "M2.571 0H45.43C46.849 0 48 1.075 48 2.4v27.2c0 1.325-1.151 2.4-2.571 2.4H2.57C1.151 32 0 30.925 0 29.6V2.4C0 1.075 1.151 0 2.571 0zm0 1.2c-.71 0-1.285.537-1.285 1.2v27.2c0 .663.575 1.2 1.285 1.2H45.43c.71 0 1.285-.537 1.285-1.2V2.4c0-.663-.575-1.2-1.285-1.2H2.57z",
@@ -37,4 +38,4 @@ const l = (param)=>/* @__PURE__ */ {
             ]
         })
     });
-}, a = l;
+}, s = l;

package/dist/icons/icon-cvv-visa-mc.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 type Props = {
     role?: string;
     size?: number;
+    color?: string;
 };
 declare const IconCvvVisaMc: React.FC<Props>;
 export default IconCvvVisaMc;

package/dist/icons/icon-cvv-visa-mc.js

@@ -5,22 +5,23 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return s;
+        return l;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
-const a = (param)=>/* @__PURE__ */ {
-    let { role: v = "presentation" , size: t = 48  } = param;
+const _skincontractcssmistica = require("../skins/skin-contract.css-mistica.js");
+const s = (param)=>/* @__PURE__ */ {
+    let { role: r = "presentation" , size: t = 48 , color: v  } = param;
     return (0, _jsxruntime.jsx)("svg", {
         width: t,
         height: t,
         viewBox: "0 0 48 48",
-        role: v,
+        role: r,
         style: {
             flexShrink: 0
         },
         children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("g", {
-            fill: "#00A9E0",
+            fill: v || _skincontractcssmistica.vars.colors.brand,
             children: [
                 /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
                     d: "M2.571 0H45.43C46.849 0 48 1.075 48 2.4v27.2c0 1.325-1.151 2.4-2.571 2.4H2.57C1.151 32 0 30.925 0 29.6V2.4C0 1.075 1.151 0 2.571 0zm0 1.2c-.71 0-1.285.537-1.285 1.2v27.2c0 .663.575 1.2 1.285 1.2H45.43c.71 0 1.285-.537 1.285-1.2V2.4c0-.663-.575-1.2-1.285-1.2H2.57z",
@@ -37,4 +38,4 @@ const a = (param)=>/* @__PURE__ */ {
             ]
         })
     });
-}, s = a;
+}, l = s;

package/dist/image.css-mistica.js

@@ -18,4 +18,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./image.css.ts.vanilla.css-mistica.js");
-var f = 300, n = "_17tt25r1 _1y2v1nfam _1y2v1nfb0 _1y2v1nf66 _1y2v1nf8b _1y2v1nf8r _1y2v1nfc6 _1y2v1nf9z _1y2v1nfa0";
+var f = 300, n = "_17tt25r1 _1y2v1nfau _1y2v1nfb9 _1y2v1nf66 _1y2v1nf8f _1y2v1nf8w _1y2v1nfci _1y2v1nfa7 _1y2v1nfa8";

package/dist/index.d.ts

@@ -69,6 +69,7 @@ Logo as NavigationBarLogo, Logo, MovistarLogo, VivoLogo, O2Logo, TelefonicaLogo,
 export { default as Image } from './image';
 export { default as Chip } from './chip';
 export { default as Video } from './video';
+export type { VideoElement } from './video';
 export { Carousel, CenteredCarousel, Slideshow, PageBullets } from './carousel';
 export { Grid, GridItem } from './grid';
 export { default as StackingGroup } from './stacking-group';

package/dist/list.css-mistica.js

@@ -19,10 +19,10 @@ _export(exports, {
         return f;
     },
     content: function() {
-        return r;
+        return a;
     },
     disabled: function() {
-        return a;
+        return r;
     },
     dualActionContainer: function() {
         return o;
@@ -40,18 +40,18 @@ _export(exports, {
         return d;
     },
     pointer: function() {
-        return j;
+        return g;
     },
     right: function() {
-        return b;
+        return u;
     },
     rowBody: function() {
-        return u;
+        return b;
     },
     rowContent: function() {
-        return c;
+        return l;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./list.css.ts.vanilla.css-mistica.js");
-var _ = "_1y2v1nf64 _1y2v1nf6m _1y2v1nf6o", y = "_1y2v1nf6d _1y2v1nf9c _1y2v1nf8r _1y2v1nf6m", f = "_1y2v1nf64 _1y2v1nf6j", r = "_1y2v1nf64 _1y2v1nf8b _1y2v1nf9x", a = "_2buj9g0", o = "_1y2v1nf64 _1y2v1nf69", t = "_2buj9gi _1y2v1nf64", i = "_1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf66 _1y2v1nfa2 _1y2v1nf5y _1y2v1nf7o _1y2v1nf82 _1y2v1nf6p", e = "_2buj9gk _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf66 _1y2v1nfa2 _1y2v1nf5y _1y2v1nf7o _1y2v1nf82 _1y2v1nf64 _1y2v1nf6j _1y2v1nf6o _1y2v1nf8c", d = "_2buj9g1", j = "_1y2v1nfaj", b = "_2buj9gb", u = "_1y2v1nf64 _1y2v1nf6a _1y2v1nf6q", c = "_1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf8b _1y2v1nfa2 _1y2v1nf5y";
+var _ = "_1y2v1nf64 _1y2v1nf6m _1y2v1nf6o", y = "_1y2v1nf6d _1y2v1nf9i _1y2v1nf8w _1y2v1nf6m", f = "_1y2v1nf64 _1y2v1nf6j", a = "_1y2v1nf64 _1y2v1nf8f _1y2v1nfa5", r = "_2buj9g0", o = "_1y2v1nf64 _1y2v1nf69", t = "_2buj9gi _1y2v1nf64", i = "_1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 _1y2v1nfaa _1y2v1nf5y _1y2v1nf7q _1y2v1nf85 _1y2v1nf66 _1y2v1nf6p", e = "_2buj9gk _1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 _1y2v1nfaa _1y2v1nf5y _1y2v1nf7q _1y2v1nf85 _1y2v1nf64 _1y2v1nf6j _1y2v1nf6o _1y2v1nf8g _1y2v1nf8w", d = "_2buj9g1", g = "_1y2v1nfar", u = "_2buj9gb", b = "_1y2v1nf64 _1y2v1nf6a _1y2v1nf6q", l = "_1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 _1y2v1nf8f _1y2v1nfaa _1y2v1nf5y";