@telefonica/mistica 14.20.1 → 14.22.0

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./icon-button.css.ts.vanilla.css-mistica.js";
-var t = "yqt1oe1 _1y2v1nfb8";
+var t = "yqt1oe1 _1y2v1nfb9";
 export { t as base };

package/dist-es/icons/icon-error.js

@@ -26,41 +26,43 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as r, jsxs as e } from "react/jsx-runtime";
-import { getAnimateDrawLineProps as i, getAnimateFadeInProps as s } from "../utils/animation.js";
-import { useTheme as n } from "../hooks.js";
-import { O2_SKIN as a, O2_CLASSIC_SKIN as m } from "../skins/constants.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { getAnimateDrawLineProps as s, getAnimateFadeInProps as n } from "../utils/animation.js";
+import { useTheme as c } from "../hooks.js";
+import { O2_SKIN as m, O2_CLASSIC_SKIN as d } from "../skins/constants.js";
 import { vars as t } from "../skins/skin-contract.css-mistica.js";
-import { outerAnimation as c, innerAnimation as l } from "./icon-error.css-mistica.js";
-const d = ()=>{
-    const { platformOverrides: o  } = n();
+import { outerAnimation as l, innerAnimation as a } from "./icon-error.css-mistica.js";
+const h = (param)=>{
+    let { size: e = 48  } = param;
+    const { platformOverrides: o  } = c();
     return /* @__PURE__ */ r("svg", {
-        width: "72",
-        height: "64",
-        viewBox: "0 0 72 64",
-        children: /* @__PURE__ */ e("g", {
+        width: e,
+        height: e,
+        viewBox: "0 0 64 64",
+        overflow: "visible",
+        children: /* @__PURE__ */ i("g", {
             stroke: t.colors.error,
             fill: t.colors.error,
             strokeLinecap: "round",
             strokeLinejoin: "round",
             children: [
-                /* @__PURE__ */ e("g", {
-                    className: c,
+                /* @__PURE__ */ i("g", {
+                    className: l,
                     children: [
                         /* @__PURE__ */ r("path", _object_spread({
                             strokeWidth: "2",
                             fill: "none",
                             d: "M48.24,57.99c-4.71,2.95-10.27,4.65-16.24,4.65C15.08,62.64,1.36,48.92,1.36,32S15.08,1.36,32,1.36 S62.64,15.08,62.64,32c0,6.11-1.79,11.8-4.87,16.58"
-                        }, i("202", "0.3s", o))),
+                        }, s("202", "0.3s", o))),
                         /* @__PURE__ */ r("circle", _object_spread({
                             cx: "53.64",
                             cy: "53.54",
                             r: "1.06"
-                        }, s("0.2s", o)))
+                        }, n("0.2s", o)))
                     ]
                 }),
-                /* @__PURE__ */ e("g", {
-                    className: l,
+                /* @__PURE__ */ i("g", {
+                    className: a,
                     children: [
                         /* @__PURE__ */ r("line", _object_spread({
                             strokeWidth: "2",
@@ -69,25 +71,27 @@ const d = ()=>{
                             y1: "14.86",
                             x2: "32",
                             y2: "39.08"
-                        }, i("110", "0.6s", o))),
+                        }, s("110", "0.6s", o))),
                         /* @__PURE__ */ r("circle", _object_spread({
                             strokeWidth: "0",
                             cx: "32",
                             cy: "46.25",
                             r: "1.72"
-                        }, s("0.8s", o)))
+                        }, n("0.8s", o)))
                     ]
                 })
             ]
         })
     });
-}, h = ()=>{
-    const { platformOverrides: o  } = n();
+}, f = (param)=>{
+    let { size: e = 48  } = param;
+    const { platformOverrides: o  } = c();
     return /* @__PURE__ */ r("svg", {
-        width: "72",
-        height: "64",
-        viewBox: "0 0 72 64",
-        children: /* @__PURE__ */ e("g", {
+        width: e,
+        height: e,
+        viewBox: "0 0 64 64",
+        overflow: "visible",
+        children: /* @__PURE__ */ i("g", {
             stroke: t.colors.error,
             fill: "none",
             strokeWidth: "2",
@@ -96,24 +100,24 @@ const d = ()=>{
             strokeMiterlimit: "10",
             children: [
                 /* @__PURE__ */ r("g", {
-                    className: c,
+                    className: l,
                     children: /* @__PURE__ */ r("path", _object_spread({
                         fill: "none",
                         strokeWidth: "2",
                         strokeMiterlimit: "10",
                         d: "M 31.9 0.9 C 52.5 0.9 62.9 11.4 62.9 31.9 C 62.9 52.5 52.5 62.9 31.9 62.9 C 11.3 62.9 0.9 52.5 0.9 31.9 C 0.9 11.3 11.3 0.9 31.9 0.9 Z",
                         transform: "rotate(90 32 32)"
-                    }, i("202", "0.3s", o)))
+                    }, s("202", "0.3s", o)))
                 }),
-                /* @__PURE__ */ e("g", {
-                    className: l,
+                /* @__PURE__ */ i("g", {
+                    className: a,
                     children: [
                         /* @__PURE__ */ r("line", _object_spread({
                             x1: "31.9",
                             y1: "20.9",
                             x2: "31.9",
                             y2: "36.9"
-                        }, i("17", "0.7s", o))),
+                        }, s("17", "0.7s", o))),
                         /* @__PURE__ */ r("circle", _object_spread({
                             stroke: t.colors.error,
                             fill: t.colors.error,
@@ -121,14 +125,14 @@ const d = ()=>{
                             cx: "31.9",
                             cy: "43.9",
                             r: "1.5"
-                        }, s("1s", o)))
+                        }, n("1s", o)))
                     ]
                 })
             ]
         })
     });
-}, f = ()=>{
-    const { skinName: o  } = n();
-    return o === a || o === m ? /* @__PURE__ */ r(d, {}) : /* @__PURE__ */ r(h, {});
-}, v = f;
-export { v as default };
+}, k = (e)=>{
+    const { skinName: o  } = c();
+    return o === m || o === d ? /* @__PURE__ */ r(h, _object_spread({}, e)) : /* @__PURE__ */ r(f, _object_spread({}, e));
+}, w = k;
+export { w as default };

package/dist-es/icons/icon-info.js

@@ -1,12 +1,40 @@
+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;
+}
 import { jsx as o, jsxs as t } from "react/jsx-runtime";
-import { useTheme as i } from "../hooks.js";
-import { O2_CLASSIC_SKIN as s, O2_SKIN as c } from "../skins/constants.js";
+import { useTheme as c } from "../hooks.js";
+import { O2_CLASSIC_SKIN as i, O2_SKIN as l } from "../skins/constants.js";
 import { vars as n } from "../skins/skin-contract.css-mistica.js";
-const d = (param)=>/* @__PURE__ */ {
-    let { size: e = 64 , color: r  } = param;
+const s = (param)=>/* @__PURE__ */ {
+    let { size: r = 48  } = param;
     return o("svg", {
-        width: e,
-        height: e,
+        width: r,
+        height: r,
         viewBox: "0 0 64 64",
         children: /* @__PURE__ */ t("g", {
             stroke: n.colors.brand,
@@ -17,20 +45,17 @@ const d = (param)=>/* @__PURE__ */ {
                 /* @__PURE__ */ o("path", {
                     fill: "none",
                     strokeWidth: "2",
-                    stroke: r || void 0,
                     d: "M48.24,57.99c-4.71,2.95-10.27,4.65-16.24,4.65C15.08,62.64,1.36,48.92,1.36,32S15.08,1.36,32,1.36 S62.64,15.08,62.64,32c0,6.11-1.79,11.8-4.87,16.58"
                 }),
                 /* @__PURE__ */ o("line", {
                     fill: "none",
                     strokeWidth: "2",
-                    stroke: r || void 0,
                     x1: "32",
                     y1: "47.96",
                     x2: "32",
                     y2: "23.74"
                 }),
                 /* @__PURE__ */ o("circle", {
-                    stroke: r || void 0,
                     cx: "53.64",
                     cy: "53.54",
                     r: "1.06"
@@ -44,9 +69,11 @@ const d = (param)=>/* @__PURE__ */ {
             ]
         })
     });
-}, l = ()=>/* @__PURE__ */ o("svg", {
-        width: "64",
-        height: "64",
+}, d = (param)=>/* @__PURE__ */ {
+    let { size: r = 48  } = param;
+    return o("svg", {
+        width: r,
+        height: r,
         viewBox: "0 0 64 64",
         children: /* @__PURE__ */ o("g", {
             fill: n.colors.brand,
@@ -56,8 +83,9 @@ const d = (param)=>/* @__PURE__ */ {
                 d: "M31.991 0c21.24 0 32.01 10.77 32.01 32.01C64 53.235 53.23 64 31.99 64 10.763 64 .001 53.236.001 32.01 0 10.77 10.762 0 31.99 0zm0 2c-20.18 0-29.99 9.816-29.99 30.01C2 52.19 11.81 62 31.99 62c20.192 0 30.01-9.81 30.01-29.99C62 11.815 52.182 2 31.99 2zM32 27a1 1 0 0 1 1 1v16a1 1 0 0 1-2 0V28a1 1 0 0 1 1-1zm0-7.5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3z"
             })
         })
-    }), h = ()=>{
-    const { skinName: e  } = i();
-    return e === s || e === c ? /* @__PURE__ */ o(d, {}) : /* @__PURE__ */ o(l, {});
-}, I = h;
-export { I as default };
+    });
+}, h = (r)=>{
+    const { skinName: e  } = c();
+    return e === i || e === l ? /* @__PURE__ */ o(s, _object_spread({}, r)) : /* @__PURE__ */ o(d, _object_spread({}, r));
+}, u = h;
+export { u as default };

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

@@ -0,0 +1,77 @@
+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;
+}
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { useTheme as i, useAriaId as n } from "../hooks.js";
+import { getAnimateCircleScaleInProps as c, getAnimateDrawLineProps as l } from "../utils/animation.js";
+const d = (param)=>{
+    let { size: o = 48  } = param;
+    const { platformOverrides: r  } = i(), t = n();
+    return /* @__PURE__ */ s("svg", {
+        width: o,
+        height: o,
+        viewBox: "0 0 64 64",
+        fill: "none",
+        children: [
+            /* @__PURE__ */ e("circle", _object_spread({
+                cx: "32",
+                cy: "32",
+                r: "25",
+                stroke: `url(#${t})`
+            }, c("25", r))),
+            /* @__PURE__ */ e("polyline", _object_spread({
+                fill: "none",
+                stroke: "white",
+                strokeWidth: "1.5",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                points: "25.75,32.75 29.69,37.5 38.25,26.5"
+            }, l("44", "0.4s", r, "0.5 0 0.83 0.83"))),
+            /* @__PURE__ */ e("defs", {
+                children: /* @__PURE__ */ s("linearGradient", {
+                    id: t,
+                    x1: "6.66663",
+                    y1: "6.66669",
+                    x2: "58.3441",
+                    y2: "7.98638",
+                    gradientUnits: "userSpaceOnUse",
+                    children: [
+                        /* @__PURE__ */ e("stop", {
+                            stopColor: "#E5B9FF"
+                        }),
+                        /* @__PURE__ */ e("stop", {
+                            offset: "1",
+                            stopColor: "#FF6ACE"
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+}, m = d;
+export { m as default };

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

@@ -26,31 +26,27 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as o } from "react/jsx-runtime";
-import { useTheme as n } from "../hooks.js";
-import { getAnimateSweepInProps as i } from "../utils/animation.js";
-import { useIsInverseVariant as c } from "../theme-variant-context.js";
-import { vars as r } from "../skins/skin-contract.css-mistica.js";
-const a = (param)=>{
-    let { role: s = "presentation" , size: e = 64  } = param;
-    const C = c(), { platformOverrides: t  } = n();
-    return /* @__PURE__ */ o("svg", {
-        role: s,
-        width: e,
-        height: e,
+import { jsx as r } from "react/jsx-runtime";
+import { useTheme as i } from "../hooks.js";
+import { getAnimateSweepInProps as n } from "../utils/animation.js";
+import { useIsInverseVariant as t } from "../theme-variant-context.js";
+import { vars as o } from "../skins/skin-contract.css-mistica.js";
+const c = (param)=>{
+    let { size: C = 48  } = param;
+    const e = t(), { platformOverrides: s  } = i();
+    return /* @__PURE__ */ r("svg", {
+        width: C,
+        height: C,
         viewBox: "0 0 64 64",
-        style: {
-            marginLeft: -17
-        },
-        children: /* @__PURE__ */ o("g", {
-            transform: "translate(17, 10)",
-            fill: C ? r.colors.inverse : r.colors.brand,
-            stroke: C ? r.colors.inverse : r.colors.brand,
-            children: /* @__PURE__ */ o("path", _object_spread({
+        overflow: "visible",
+        children: /* @__PURE__ */ r("g", {
+            fill: e ? o.colors.inverse : o.colors.brand,
+            stroke: e ? o.colors.inverse : o.colors.brand,
+            children: /* @__PURE__ */ r("path", _object_spread({
                 fillRule: "nonzero",
                 d: "M14.8832276,0 C10.2293915,0.0191737965 6.86229932,3.79747692 6.87644677,7.70928648 C6.89025737,11.6228714 9.24614399,14.2258918 11.0573539,15.1980743 C12.084728,15.7491434 11.7559683,16.7408548 11.7559683,16.7408548 C11.7559683,16.7408548 11.5093985,17.7055808 10.4274557,17.44922 C9.3458498,17.1875332 4.10725261,15.8961425 4.10725261,15.8961425 C4.10725261,15.8961425 0.947319469,15.2651826 0.18436791,18.6252129 C-0.579931024,21.9873736 1.196584,23.2652716 2.5001701,23.5816393 C3.80375621,23.8972968 8.2116962,25.0470144 8.2116962,25.0470144 C8.2116962,25.0470144 9.52370341,25.7443725 9.57490369,27.1742406 C9.60656702,28.0203732 9.60825124,28.7209269 8.78163618,29.9800062 C7.95670533,31.2394406 2.82589821,37.6825463 2.82589821,37.6825463 C2.82589821,37.6825463 1.06218326,39.9379529 3.61781834,41.9710855 C6.17345343,44.0045731 7.61110343,43.5309094 9.12824861,41.6575584 C10.6440464,39.7845626 13.6392629,35.862456 13.6392629,35.862456 C13.6392629,35.862456 14.0525704,35.0099322 14.8956908,35.0610623 C15.7388112,35.1136127 15.985381,35.5961532 16.2710247,35.9650713 C16.5580157,36.3339893 20.7318492,41.7285725 21.0164823,42.0786718 C21.297747,42.4326769 22.0782145,43.0806802 22.9364929,43.2042447 C23.7937607,43.3263889 24.7338922,43.1396219 25.3358324,42.6712841 C25.9360883,42.2022363 26.698703,41.5641749 26.9664939,41.1388007 C27.2326007,40.7134265 27.6863295,40.1034157 27.6027922,39.0996319 C27.5182443,38.0986887 27.3144537,37.574605 26.5878813,36.7149798 C25.8613089,35.8564198 21.565538,30.4178079 20.7567756,29.3742563 C20.7567756,29.3742563 20.022119,28.4461025 20.1285616,27.1341177 C20.2353412,25.8192924 20.7874284,25.2334264 21.9495401,24.9067617 C23.1099675,24.5815173 27.6499503,23.3980679 27.6499503,23.3980679 C27.6499503,23.3980679 30.2487014,22.0733006 29.6595614,19.4472006 L29.3210332,18.1046798 C29.3210332,18.1046798 28.7551353,15.0407782 25.0208833,15.989526 C21.2835996,16.9411144 19.2079671,17.5014154 19.2079671,17.5014154 C19.2079671,17.5014154 18.0185711,17.6235596 17.8477912,16.777427 C17.6797061,15.9302293 17.9003389,15.4934928 18.4258155,15.257016 C18.9516289,15.0208942 22.2685313,13.3144263 22.6939652,8.70064277 C23.121757,4.09538091 19.5505374,0 14.9128698,0 L14.8832276,0"
-            }, i("0.2s", t)))
+            }, n("0.2s", s)))
         })
     });
-}, d = a;
-export { d as default };
+}, p = c;
+export { p as default };

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

@@ -33,7 +33,7 @@ import { useTheme as d } from "../hooks.js";
 import { useIsInverseVariant as v } from "../theme-variant-context.js";
 import { vars as i } from "../skins/skin-contract.css-mistica.js";
 const u = (param)=>{
-    let { size: t = 64 , color: e , skipAnimation: r = !1  } = param;
+    let { size: t = 48 , color: e , skipAnimation: r = !1  } = param;
     const n = v(), { platformOverrides: o  } = d();
     return /* @__PURE__ */ s("svg", {
         role: "presentation",
@@ -68,7 +68,7 @@ const u = (param)=>{
         })
     });
 }, k = (param)=>{
-    let { size: t = 64 , color: e , skipAnimation: r = !1  } = param;
+    let { size: t = 48 , color: e , skipAnimation: r = !1  } = param;
     const n = v(), { platformOverrides: o  } = d();
     return /* @__PURE__ */ s("svg", {
         role: "presentation",

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./image.css.ts.vanilla.css-mistica.js";
-var f = 300, n = "_17tt25r1 _1y2v1nfe6 _1y2v1nfel _1y2v1nfb6 _1y2v1nfbr _1y2v1nfc8 _1y2v1nffu _1y2v1nfdj _1y2v1nfdk";
+var f = 300, n = "_17tt25r1 _1y2v1nfeb _1y2v1nfeq _1y2v1nfb7 _1y2v1nfbs _1y2v1nfc9 _1y2v1nffz _1y2v1nfdk _1y2v1nfdl";
 export { f as FADE_IN_DURATION_MS, n as image };