@telefonica/mistica 15.20.1 → 16.0.0

package/dist/icon-button.js

@@ -11,22 +11,19 @@ function _export(target, all) {
 }
 _export(exports, {
     IconButton: function() {
-        return ue;
+        return ie;
     },
     InternalIconButton: function() {
-        return re;
+        return $;
     },
     InternalToggleIconButton: function() {
-        return oe;
-    },
-    RawDeprecatedIconButton: function() {
-        return ne;
+        return C;
     },
     RawIconButton: function() {
-        return T;
+        return N;
     },
     ToggleIconButton: function() {
-        return me;
+        return ae;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -161,43 +158,14 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const ee = 24, te = (e, t, i, o, n)=>{
-    const c = o ? `${o}px ${o}px` : "100% 100%";
-    return {
-        padding: 0,
-        backgroundColor: i,
-        backgroundImage: e ? `url(${e})` : "initial",
-        backgroundSize: c,
-        cursor: n ? "default" : "pointer",
-        height: t,
-        width: t,
-        verticalAlign: "middle",
-        textAlign: "center"
-    };
-}, ne = /*#__PURE__*/ _react.forwardRef((e, t)=>{
-    const { icon: i, children: o } = e, n = _object_without_properties(e, [
-        "icon",
-        "children"
-    ]);
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({
-        ref: t
-    }, n), {
-        maybe: !0,
-        stopPropagation: !0,
-        dataAttributes: _object_spread({
-            "component-name": "IconButton"
-        }, e.dataAttributes),
-        children: !i && _react.Children.only(o)
-    }));
-}), T = /*#__PURE__*/ _react.forwardRef((_param, x)=>{
-    var { disabled: e, trackingEvent: t, role: i, dataAttributes: o, type: n = "neutral", backgroundType: c = "transparent", isOverMedia: S, hasOverlay: B = !0, "aria-label": u, "aria-labelledby": m, small: R, Icon: f, bleedLeft: d, bleedRight: v, bleedY: h, showSpinner: A } = _param, b = _object_without_properties(_param, [
+const N = /*#__PURE__*/ _react.forwardRef((_param, z)=>{
+    var { disabled: e, trackingEvent: r, role: f, dataAttributes: p, type: o = "neutral", backgroundType: b = "transparent", hasOverlay: S = !0, "aria-label": v, "aria-labelledby": c, small: d, Icon: R, bleedLeft: l, bleedRight: a, bleedY: I, showSpinner: g } = _param, m = _object_without_properties(_param, [
         "disabled",
         "trackingEvent",
         "role",
         "dataAttributes",
         "type",
         "backgroundType",
-        "isOverMedia",
         "hasOverlay",
         "aria-label",
         "aria-labelledby",
@@ -208,87 +176,78 @@ const ee = 24, te = (e, t, i, o, n)=>{
         "bleedY",
         "showSpinner"
     ]);
-    const z = (0, _themevariantcontext.useThemeVariant)(), [k, p] = _react.useState(!1), a = A || k, [I, y] = _react.useState(!!a);
+    const B = (0, _themevariantcontext.useThemeVariant)(), [x, w] = _react.useState(!1), t = g || x, [u, T] = _react.useState(!!t);
     _react.useEffect(()=>{
-        a && !I && y(!0);
+        t && !u && T(!0);
     }, [
-        a,
-        I
+        t,
+        u
     ]);
-    const l = R ? "small" : "default", O = S ? `${n}-media` : `${n}-${c}-${z}`, E = {
-        disabled: e || a,
-        ref: x,
-        trackingEvent: t,
-        role: i,
-        "aria-label": u,
-        "aria-labelledby": m,
+    const i = d ? "small" : "default", A = B === "media" ? `${o}-media` : `${o}-${b}-${B}`, O = {
+        disabled: e || t,
+        ref: z,
+        trackingEvent: r,
+        role: f,
+        "aria-label": v,
+        "aria-labelledby": c,
         dataAttributes: _object_spread({
             "component-name": "IconButton"
-        }, o),
-        className: (0, _classnames.default)(_iconbuttoncssmistica.buttonContainer[l], _iconbuttoncssmistica.iconButtonTokens[O], _iconbuttoncssmistica.minimumInteractiveArea, {
+        }, p),
+        className: (0, _classnames.default)(_iconbuttoncssmistica.buttonContainer[i], _iconbuttoncssmistica.iconButtonTokens[A], _iconbuttoncssmistica.minimumInteractiveArea, {
             [_iconbuttoncssmistica.disabled]: e,
-            [_iconbuttoncssmistica.overlayContainer]: !e && !a,
-            [_iconbuttoncssmistica.bleedLeft[l]]: d,
-            [_iconbuttoncssmistica.bleedRight[l]]: v,
-            [_iconbuttoncssmistica.bleedY[l]]: h
+            [_iconbuttoncssmistica.overlayContainer]: !e && !t,
+            [_iconbuttoncssmistica.bleedLeft[i]]: l,
+            [_iconbuttoncssmistica.bleedRight[i]]: a,
+            [_iconbuttoncssmistica.bleedY[i]]: I
         }),
-        resetMargin: !d && !v && !h
+        resetMargin: !l && !a && !I
     }, j = /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
-        className: (0, _classnames.default)(_iconbuttoncssmistica.iconContainer[l], {
-            [_iconbuttoncssmistica.isLoading]: a
+        className: (0, _classnames.default)(_iconbuttoncssmistica.iconContainer[i], {
+            [_iconbuttoncssmistica.isLoading]: t
         }),
         children: [
-            B && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            S && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _iconbuttoncssmistica.overlay
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                "aria-hidden": a ? !0 : void 0,
+                "aria-hidden": t ? !0 : void 0,
                 className: _iconbuttoncssmistica.icon,
-                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(f, {
-                    size: _iconbuttoncssmistica.iconSize[l],
+                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(R, {
+                    size: _iconbuttoncssmistica.iconSize[i],
                     color: "currentColor"
                 })
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                "aria-hidden": a ? void 0 : !0,
+                "aria-hidden": t ? void 0 : !0,
                 className: _iconbuttoncssmistica.spinner,
                 onTransitionEnd: ()=>{
-                    a !== I && y(a);
+                    t !== u && T(t);
                 },
-                children: I && /* @__PURE__ */ (0, _jsxruntime.jsx)(_spinner.default, {
-                    size: _iconbuttoncssmistica.iconSize[l],
+                children: u && /* @__PURE__ */ (0, _jsxruntime.jsx)(_spinner.default, {
+                    size: _iconbuttoncssmistica.iconSize[i],
                     color: "currentColor",
                     delay: "0s"
                 })
             })
         ]
     });
-    if (b.onPress) {
-        const L = b.onPress;
-        b.onPress = (V)=>{
-            const w = L(V);
-            w && (p(!0), w.finally(()=>p(!1)));
+    if (m.onPress) {
+        const k = m.onPress;
+        m.onPress = (E)=>{
+            const y = k(E);
+            y && (w(!0), y.finally(()=>w(!1)));
         };
     }
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({}, E, b), {
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, _object_spread_props(_object_spread({}, O, m), {
         maybe: !0,
         children: j
     }));
-}), re = /*#__PURE__*/ _react.forwardRef((e, t)=>{
-    if (e.Icon) return /* @__PURE__ */ (0, _jsxruntime.jsx)(T, _object_spread({
-        ref: t
-    }, e));
-    const { icon: i, backgroundColor: o = "transparent", iconSize: n, size: c = ee } = e;
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(ne, _object_spread_props(_object_spread({
-        ref: t
-    }, e), {
-        className: (0, _classnames.default)(_iconbuttoncssmistica.deprecatedIconButtonBase, e.className),
-        style: _object_spread({}, te(i, c, o, n, e.disabled), e.style)
-    }));
-}), ue = /*#__PURE__*/ _react.forwardRef((e, t)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(re, _object_spread({
-        ref: t
-    }, e))), oe = /*#__PURE__*/ _react.forwardRef((_param, B)=>{
-    var { checked: e, defaultChecked: t, checkedProps: i, uncheckedProps: o, onChange: n, dataAttributes: c } = _param, S = _object_without_properties(_param, [
+}), $ = /*#__PURE__*/ _react.forwardRef((e, r)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(N, _object_spread({
+        ref: r
+    }, e))), ie = /*#__PURE__*/ _react.forwardRef((e, r)=>/* @__PURE__ */ (0, _jsxruntime.jsx)($, _object_spread({
+        ref: r
+    }, e))), C = /*#__PURE__*/ _react.forwardRef((_param, v)=>{
+    var { checked: e, defaultChecked: r, checkedProps: f, uncheckedProps: p, onChange: o, dataAttributes: b } = _param, S = _object_without_properties(_param, [
         "checked",
         "defaultChecked",
         "checkedProps",
@@ -296,21 +255,21 @@ const ee = 24, te = (e, t, i, o, n)=>{
         "onChange",
         "dataAttributes"
     ]);
-    const [u, m] = _react.useState(!!t), R = ()=>{
+    const [c, d] = _react.useState(!!r), R = ()=>{
         if (e === void 0) {
-            const f = n == null ? void 0 : n(!u);
-            if (f) return f.then(()=>m((d)=>!d)).catch(()=>{});
-            m((d)=>!d);
-        } else return n == null ? void 0 : n(!e);
+            const l = o == null ? void 0 : o(!c);
+            if (l) return l.then(()=>d((a)=>!a)).catch(()=>{});
+            d((a)=>!a);
+        } else return o == null ? void 0 : o(!e);
     };
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(T, _object_spread_props(_object_spread({
-        ref: B
-    }, S, (e !== null && e !== void 0 ? e : u) ? i : o), {
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(N, _object_spread_props(_object_spread({
+        ref: v
+    }, S, (e !== null && e !== void 0 ? e : c) ? f : p), {
         dataAttributes: _object_spread({
             "component-name": "ToggleIconButton"
-        }, c),
+        }, b),
         onPress: R
     }));
-}), me = /*#__PURE__*/ _react.forwardRef((e, t)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(oe, _object_spread({
-        ref: t
+}), ae = /*#__PURE__*/ _react.forwardRef((e, r)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(C, _object_spread({
+        ref: r
     }, e)));

package/dist/icons/icon-success-vivo-new.js

@@ -6,12 +6,54 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return m;
+        return f;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _hooks = require("../hooks.js");
 const _animation = require("../utils/animation.js");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
 function _define_property(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -40,9 +82,9 @@ function _object_spread(target) {
     }
     return target;
 }
-const d = (param)=>{
+const p = (param)=>{
     let { size: o = 48 } = param;
-    const { platformOverrides: r } = (0, _hooks.useTheme)(), t = (0, _hooks.useAriaId)();
+    const { platformOverrides: r } = (0, _hooks.useTheme)(), t = _react.useId();
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
         role: "presentation",
         width: o,
@@ -85,4 +127,4 @@ const d = (param)=>{
             })
         ]
     });
-}, m = d;
+}, f = p;

package/dist/icons/icon-success-vivo.js

@@ -44,7 +44,7 @@ function _object_spread(target) {
 }
 const c = (param)=>{
     let { size: e = 48 } = param;
-    const C = (0, _themevariantcontext.useIsInverseVariant)(), { platformOverrides: s } = (0, _hooks.useTheme)();
+    const C = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), { platformOverrides: s } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
         role: "presentation",
         width: e,

package/dist/icons/icon-success.js

@@ -45,7 +45,7 @@ function _object_spread(target) {
 }
 const k = (param)=>{
     let { size: t = 48, color: e, skipAnimation: r = !1 } = param;
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), { platformOverrides: o } = (0, _hooks.useTheme)();
+    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), { platformOverrides: o } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
         role: "presentation",
         width: t,
@@ -80,7 +80,7 @@ const k = (param)=>{
     });
 }, m = (param)=>{
     let { size: t = 48, color: e, skipAnimation: r = !1 } = param;
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), { platformOverrides: o } = (0, _hooks.useTheme)();
+    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), { platformOverrides: o } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
         role: "presentation",
         width: t,
@@ -110,7 +110,7 @@ const k = (param)=>{
     });
 }, g = (param)=>{
     let { size: t = 48, color: e, skipAnimation: r = !1 } = param;
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), { platformOverrides: o } = (0, _hooks.useTheme)();
+    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), { platformOverrides: o } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
         role: "presentation",
         width: t,

package/dist/image.js

@@ -11,16 +11,16 @@ function _export(target, all) {
 }
 _export(exports, {
     ImageContent: function() {
-        return e1;
+        return Y;
     },
     ImageError: function() {
-        return Y;
+        return X;
     },
     RATIO: function() {
         return H;
     },
     default: function() {
-        return g1;
+        return f1;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -163,7 +163,7 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const X = (param)=>{
+const Q = (param)=>{
     let { style: e } = param;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
         width: "48",
@@ -177,7 +177,7 @@ const X = (param)=>{
             strokeWidth: "2"
         })
     });
-}, Y = /*#__PURE__*/ _react.forwardRef((param, s)=>{
+}, X = /*#__PURE__*/ _react.forwardRef((param, s)=>{
     let { borderRadius: e, withIcon: C = !0, border: d, className: m } = param;
     const a = (0, _themevariantcontext.useIsInverseVariant)(), { skinName: n } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
@@ -194,7 +194,7 @@ const X = (param)=>{
         },
         ref: s,
         className: m,
-        children: C ? n === _constants.VIVO_SKIN ? /* @__PURE__ */ (0, _jsxruntime.jsx)(X, {
+        children: C ? n === _constants.VIVO_SKIN ? /* @__PURE__ */ (0, _jsxruntime.jsx)(Q, {
             style: {
                 width: "10%",
                 minWidth: 24,
@@ -241,7 +241,7 @@ const X = (param)=>{
     "16:9": 16 / 9,
     "7:10": 7 / 10,
     "4:3": 4 / 3
-}, e1 = /*#__PURE__*/ _react.forwardRef((_param, S)=>{
+}, Y = /*#__PURE__*/ _react.forwardRef((_param, S)=>{
     var { aspectRatio: e = 0, alt: C = "", dataAttributes: d, noBorderRadius: m, src: s, srcSet: a, onError: n, onLoad: l, loadingFallback: M = !0, errorFallback: x = !0 } = _param, i = _object_without_properties(_param, [
         "aspectRatio",
         "alt",
@@ -255,7 +255,7 @@ const X = (param)=>{
         "errorFallback"
     ]);
     var I;
-    const h = (0, _hooks.useAriaId)(), c = _react.useRef(), u = i.circular ? _imagecssmistica.circularBorderRadius : m ? _imagecssmistica.noBorderRadius : _imagecssmistica.defaultBorderRadius, [y, f] = _react.useState(!s), [A, g] = _react.useState(!1), L = i.width && i.height ? void 0 : i.circular ? 1 : typeof e == "number" ? e : H[e], b = M && !!(L !== 0 || i.width && i.height), B = x && !!(L !== 0 || i.width && i.height), v = _react.useCallback(()=>{
+    const h = _react.useId(), c = _react.useRef(), u = i.circular ? _imagecssmistica.circularBorderRadius : m ? _imagecssmistica.noBorderRadius : _imagecssmistica.defaultBorderRadius, [y, f] = _react.useState(!s), [B, g] = _react.useState(!1), L = i.width && i.height ? void 0 : i.circular ? 1 : typeof e == "number" ? e : H[e], b = M && !!(L !== 0 || i.width && i.height), A = x && !!(L !== 0 || i.width && i.height), v = _react.useCallback(()=>{
         f(!1), c.current && (c.current.style.opacity = "1"), setTimeout(()=>{
             g(!0);
         }, _imagecssmistica.FADE_IN_DURATION_MS), l == null || l();
@@ -305,7 +305,7 @@ const X = (param)=>{
     var _i_height, _i_width;
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            b && !A && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            b && !B && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 style: {
                     position: "absolute",
                     width: "100%",
@@ -323,13 +323,13 @@ const X = (param)=>{
                     })
                 })
             }),
-            y && B && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            y && A && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 style: {
                     position: "absolute",
                     width: "100%",
                     height: "100%"
                 },
-                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(Y, {
+                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(X, {
                     border: i.border,
                     className: u
                 })
@@ -337,7 +337,7 @@ const X = (param)=>{
             !y && W
         ]
     });
-}), t1 = /*#__PURE__*/ _react.forwardRef((e, C)=>{
+}), e1 = /*#__PURE__*/ _react.forwardRef((e, C)=>{
     var _e_aspectRatio;
     const d = e.width && e.height ? void 0 : e.circular ? 1 : typeof e.aspectRatio == "number" || !e.aspectRatio ? (_e_aspectRatio = e.aspectRatio) !== null && _e_aspectRatio !== void 0 ? _e_aspectRatio : 0 : H[e.aspectRatio];
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(_aspectratiosupport.AspectRatioContainer, {
@@ -349,8 +349,8 @@ const X = (param)=>{
         height: e.height,
         dataAttributes: (0, _dom.getPrefixedDataAttributes)(e.dataAttributes, "Image"),
         forceNonCssAspectRatio: e.forceNonCssAspectRatio,
-        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(e1, _object_spread_props(_object_spread({}, e), {
+        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(Y, _object_spread_props(_object_spread({}, e), {
             ref: C
         }))
     });
-}), g1 = t1;
+}), f1 = e1;