@telefonica/mistica 17.8.0 → 17.10.0

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

@@ -27,19 +27,20 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as C, jsxs as o } from "react/jsx-runtime";
-import { useTheme as n } from "../hooks.js";
-import { VIVO_EVOLUTION_SKIN as i, VIVO_SKIN as a, O2_SKIN as c } from "../skins/constants.js";
-import { vars as r } from "../skins/skin-contract.css-mistica.js";
-const h = (param)=>{
+import { jsx as C, jsxs as r } from "react/jsx-runtime";
+import { useTheme as i } from "../hooks.js";
+import { VIVO_EVOLUTION_SKIN as a, VIVO_SKIN as l, O2_SKIN as h } from "../skins/constants.js";
+import { vars as e } from "../skins/skin-contract.css-mistica.js";
+import { useThemeVariant as c } from "../theme-variant-context.js";
+const d = (param)=>{
     let { size: t = 48 } = param;
     return /* @__PURE__ */ C("svg", {
         role: "presentation",
         width: t,
         height: t,
         viewBox: "0 0 48 48",
-        children: /* @__PURE__ */ o("g", {
-            fill: r.colors.brand,
+        children: /* @__PURE__ */ r("g", {
+            fill: e.colors.brand,
             children: [
                 /* @__PURE__ */ C("path", {
                     d: "M24 36.8544C23.0592 36.8544 22.2816 36.0864 22.2816 35.136V18.8544C22.2816 17.9136 23.0496 17.136 24 17.136C24.9408 17.136 25.7184 17.904 25.7184 18.8544V35.136C25.7184 36.0864 24.9408 36.8544 24 36.8544Z"
@@ -53,7 +54,7 @@ const h = (param)=>{
             ]
         })
     });
-}, l = (param)=>{
+}, s = (param)=>{
     let { size: t = 48 } = param;
     return /* @__PURE__ */ C("svg", {
         role: "presentation",
@@ -61,7 +62,7 @@ const h = (param)=>{
         height: t,
         viewBox: "0 0 64 64",
         children: /* @__PURE__ */ C("g", {
-            fill: r.colors.brand,
+            fill: e.colors.brand,
             children: /* @__PURE__ */ C("path", {
                 fillRule: "nonzero",
                 strokeWidth: "0",
@@ -69,15 +70,45 @@ const h = (param)=>{
             })
         })
     });
-}, d = (param)=>{
+}, V = (param)=>{
+    let { size: t = 48 } = param;
+    const o = c() === "alternative";
+    return /* @__PURE__ */ r("svg", {
+        role: "presentation",
+        width: t,
+        height: t,
+        viewBox: "0 0 48 48",
+        fill: "none",
+        children: [
+            /* @__PURE__ */ C("path", {
+                d: "M0 18C0 8.05888 8.05888 0 18 0H30C39.9411 0 48 8.05888 48 18V30C48 39.9411 39.9411 48 30 48H18C8.05888 48 0 39.9411 0 30V18Z",
+                fill: o ? e.colors.neutralLowAlternative : e.colors.neutralLow
+            }),
+            /* @__PURE__ */ r("g", {
+                fill: e.colors.neutralHigh,
+                children: [
+                    /* @__PURE__ */ C("path", {
+                        d: "M24 21.0453C24.5178 21.0453 24.9375 21.465 24.9375 21.9828V29.8075C24.9375 30.3253 24.5178 30.745 24 30.745C23.4822 30.745 23.0625 30.3253 23.0625 29.8075V21.9828C23.0625 21.465 23.4822 21.0453 24 21.0453Z"
+                    }),
+                    /* @__PURE__ */ C("path", {
+                        d: "M24 20.0675C24.5178 20.0675 24.9375 19.6478 24.9375 19.13C24.9375 18.6122 24.5178 18.1925 24 18.1925C23.4822 18.1925 23.0625 18.6122 23.0625 19.13C23.0625 19.6478 23.4822 20.0675 24 20.0675Z"
+                    }),
+                    /* @__PURE__ */ C("path", {
+                        d: "M11.5 21.8125C11.5 16.1171 16.1171 11.5 21.8125 11.5H26.1875C31.8829 11.5 36.5 16.1171 36.5 21.8125V26.1875C36.5 31.8829 31.8829 36.5 26.1875 36.5H21.8125C16.1171 36.5 11.5 31.8829 11.5 26.1875V21.8125ZM21.8125 13.375C17.1526 13.375 13.375 17.1526 13.375 21.8125V26.1875C13.375 30.8474 17.1526 34.625 21.8125 34.625H26.1875C30.8474 34.625 34.625 30.8474 34.625 26.1875V21.8125C34.625 17.1526 30.8474 13.375 26.1875 13.375H21.8125Z"
+                    })
+                ]
+            })
+        ]
+    });
+}, f = (param)=>{
     let { size: t = 48 } = param;
     return /* @__PURE__ */ C("svg", {
         role: "presentation",
         width: t,
         height: t,
         viewBox: "0 0 64 64",
-        children: /* @__PURE__ */ o("g", {
-            fill: r.colors.brand,
+        children: /* @__PURE__ */ r("g", {
+            fill: e.colors.brand,
             children: [
                 /* @__PURE__ */ C("path", {
                     d: "M32 29.1797C33.0354 29.1797 33.8867 29.9663 33.9893 30.9746L34 31.1797V45.9492C34 47.0538 33.1046 47.9492 32 47.9492C30.8954 47.9492 30 47.0538 30 45.9492V31.1797L30.0107 30.9746C30.1133 29.9663 30.9646 29.1797 32 29.1797Z"
@@ -91,16 +122,17 @@ const h = (param)=>{
             ]
         })
     });
-}, p = (t)=>{
-    const { skinName: e } = n();
-    switch(e){
-        case c:
-            return /* @__PURE__ */ C(h, _object_spread({}, t));
+}, M = (t)=>{
+    const { skinName: n } = i();
+    switch(n){
+        case h:
+            return /* @__PURE__ */ C(d, _object_spread({}, t));
+        case l:
+            return /* @__PURE__ */ C(s, _object_spread({}, t));
         case a:
-        case i:
-            return /* @__PURE__ */ C(l, _object_spread({}, t));
+            return /* @__PURE__ */ C(V, _object_spread({}, t));
         default:
-            return /* @__PURE__ */ C(d, _object_spread({}, t));
+            return /* @__PURE__ */ C(f, _object_spread({}, t));
     }
 };
-export { p as default };
+export { M as default };

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

@@ -0,0 +1,69 @@
+'use client';
+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 m } from "react/jsx-runtime";
+import { useTheme as c } from "../hooks.js";
+import { getAnimateDrawLineProps as a, mergeProperties as p, getAnimateHopInProps as d } from "../utils/animation.js";
+import { useThemeVariant as f } from "../theme-variant-context.js";
+import { vars as s } from "../skins/skin-contract.css-mistica.js";
+const x = (param)=>{
+    let { size: i = 48, color: e, skipAnimation: n = !1 } = param;
+    const r = f(), { platformOverrides: t } = c(), l = r === "brand" || r === "media" ? s.colors.neutralHighBrand : r === "negative" ? s.colors.neutralHighNegative : s.colors.brand;
+    return /* @__PURE__ */ o("svg", {
+        role: "presentation",
+        width: i,
+        height: i,
+        viewBox: "0 0 64 64",
+        children: /* @__PURE__ */ m("g", {
+            stroke: e ? void 0 : l,
+            children: [
+                /* @__PURE__ */ o("path", _object_spread({
+                    vectorEffect: "non-scaling-stroke",
+                    fill: "none",
+                    stroke: e,
+                    strokeWidth: "2",
+                    strokeMiterlimit: "10",
+                    d: "M61.4,32c0,19.5-10,29.4-29.4,29.4C12.5,61.4,2.6,51.5,2.6,32S12.5,2.6,32,2.6S61.4,12.5,61.4,32z",
+                    transform: "rotate(90 32 32)"
+                }, !n && a("202", "0.2s", t))),
+                /* @__PURE__ */ o("polyline", _object_spread({
+                    vectorEffect: "non-scaling-stroke",
+                    fill: "none",
+                    stroke: e,
+                    strokeWidth: "2",
+                    strokeMiterlimit: "10",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    points: "20,34.9 27.4,44.3 45.6,21"
+                }, !n && p(a("44", "0.6s", t), d("0.6s", t))))
+            ]
+        })
+    });
+};
+export { x as default };

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

@@ -27,93 +27,126 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as n, jsxs as c } from "react/jsx-runtime";
-import { VIVO_EVOLUTION_SKIN as v, VIVO_SKIN as m, O2_SKIN as g } from "../skins/constants.js";
-import { getAnimateDrawLineProps as d, mergeProperties as h, getAnimateHopInProps as f } from "../utils/animation.js";
-import { useTheme as l } from "../hooks.js";
-import { vars as i } from "../skins/skin-contract.css-mistica.js";
-import { useThemeVariant as u } from "../theme-variant-context.js";
-const p = (param)=>{
-    let { size: r = 48, color: e, skipAnimation: o = !1 } = param;
-    const { platformOverrides: t } = l(), s = u(), a = s === "brand" || s === "media" ? i.colors.neutralHighBrand : s === "negative" ? i.colors.neutralHighNegative : i.colors.brand;
-    return /* @__PURE__ */ n("svg", {
+import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import * as C from "react";
+import { VIVO_EVOLUTION_SKIN as f, VIVO_SKIN as g, O2_SKIN as m } from "../skins/constants.js";
+import { getAnimateDrawLineProps as c, mergeProperties as u, getAnimateHopInProps as p, getAnimateCircleScaleInProps as v } from "../utils/animation.js";
+import { useTheme as d } from "../hooks.js";
+import { vars as n } from "../skins/skin-contract.css-mistica.js";
+import { useThemeVariant as h } from "../theme-variant-context.js";
+const k = (param)=>{
+    let { size: t = 48, color: e, skipAnimation: o = !1 } = param;
+    const { platformOverrides: s } = d(), i = h(), l = i === "brand" || i === "media" ? n.colors.neutralHighBrand : i === "negative" ? n.colors.neutralHighNegative : n.colors.brand;
+    return /* @__PURE__ */ r("svg", {
         role: "presentation",
-        width: r,
-        height: r,
+        width: t,
+        height: t,
         viewBox: "0 0 64 64",
-        children: /* @__PURE__ */ c("g", {
-            stroke: e ? void 0 : a,
-            fill: e ? void 0 : a,
+        children: /* @__PURE__ */ a("g", {
+            stroke: e ? void 0 : l,
+            fill: e ? void 0 : l,
             strokeLinecap: "round",
             strokeWidth: "4",
             children: [
-                /* @__PURE__ */ n("circle", _object_spread({
+                /* @__PURE__ */ r("circle", _object_spread({
                     stroke: e || void 0,
                     fill: "none",
                     cx: "32",
                     cy: "32",
                     r: "30"
-                }, !o && d("202", "0.3s", t))),
-                /* @__PURE__ */ n("polyline", _object_spread({
+                }, !o && c("202", "0.3s", s))),
+                /* @__PURE__ */ r("polyline", _object_spread({
                     fill: "none",
                     stroke: e || void 0,
                     points: "18,32.67 27.33,42 49.33,20.67"
-                }, !o && h(d("50", "0.6s", t), f("0.6", t))))
+                }, !o && u(c("50", "0.6s", s), p("0.6", s))))
             ]
         })
     });
-}, k = (param)=>{
-    let { size: r = 48, color: e, skipAnimation: o = !1 } = param;
-    const { platformOverrides: t } = l(), s = u(), a = s === "brand" || s === "media" ? i.colors.neutralHighBrand : s === "negative" ? i.colors.neutralHighNegative : i.colors.brand;
-    return /* @__PURE__ */ n("svg", {
+}, I = (param)=>{
+    let { size: t = 48 } = param;
+    const { platformOverrides: e } = d(), o = C.useId();
+    return /* @__PURE__ */ a("svg", {
         role: "presentation",
-        width: r,
-        height: r,
+        width: t,
+        height: t,
         viewBox: "0 0 64 64",
-        children: /* @__PURE__ */ c("g", {
-            stroke: e ? void 0 : a,
-            children: [
-                /* @__PURE__ */ n("path", _object_spread({
-                    vectorEffect: "non-scaling-stroke",
-                    fill: "none",
-                    stroke: e || void 0,
-                    strokeWidth: "2",
-                    strokeMiterlimit: "10",
-                    d: "M61.4,32c0,19.5-10,29.4-29.4,29.4C12.5,61.4,2.6,51.5,2.6,32S12.5,2.6,32,2.6S61.4,12.5,61.4,32z",
-                    transform: "rotate(90 32 32)"
-                }, !o && d("202", "0.2s", t))),
-                /* @__PURE__ */ n("polyline", _object_spread({
-                    vectorEffect: "non-scaling-stroke",
-                    fill: "none",
-                    stroke: e || void 0,
-                    strokeWidth: "2",
-                    strokeMiterlimit: "10",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    points: "20,34.9 27.4,44.3 45.6,21"
-                }, !o && h(d("44", "0.6s", t), f("0.6s", t))))
-            ]
-        })
+        fill: "none",
+        children: [
+            /* @__PURE__ */ r("circle", _object_spread({
+                cx: "32",
+                cy: "32",
+                r: "31",
+                stroke: `url(#${o})`
+            }, v("31", e))),
+            /* @__PURE__ */ r("polyline", _object_spread({
+                fill: "none",
+                stroke: "white",
+                strokeWidth: "1.5",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                points: "24,32.75 30,39 40.5,24.5"
+            }, c("44", "0.4s", e, "0.5 0 0.83 0.83"))),
+            /* @__PURE__ */ r("defs", {
+                children: /* @__PURE__ */ a("linearGradient", {
+                    id: o,
+                    x1: "6.66663",
+                    y1: "6.66669",
+                    x2: "58.3441",
+                    y2: "7.98638",
+                    gradientUnits: "userSpaceOnUse",
+                    children: [
+                        /* @__PURE__ */ r("stop", {
+                            stopColor: "#E5B9FF"
+                        }),
+                        /* @__PURE__ */ r("stop", {
+                            offset: "1",
+                            stopColor: "#FF6ACE"
+                        })
+                    ]
+                })
+            })
+        ]
     });
-}, C = (param)=>{
-    let { size: r = 48, color: e, skipAnimation: o = !1 } = param;
-    const { platformOverrides: t } = l(), s = u(), a = s === "brand" || s === "media" ? i.colors.neutralHighBrand : s === "negative" ? i.colors.neutralHighNegative : i.colors.brand;
-    return /* @__PURE__ */ n("svg", {
+}, L = (param)=>{
+    let { size: t = 48 } = param;
+    const o = h() === "brand";
+    return /* @__PURE__ */ a("svg", {
         role: "presentation",
-        width: r,
-        height: r,
+        width: t,
+        height: t,
+        viewBox: "0 0 48 48",
+        fill: "none",
+        children: [
+            /* @__PURE__ */ r("path", {
+                d: "M0 18C0 8.05888 8.05888 0 18 0H30C39.9411 0 48 8.05888 48 18V30C48 39.9411 39.9411 48 30 48H18C8.05888 48 0 39.9411 0 30V18Z",
+                fill: o ? n.colors.backgroundBrandSecondary : n.colors.successLow
+            }),
+            /* @__PURE__ */ r("path", {
+                d: "M34.9092 15.5156C35.2803 15.1548 35.8734 15.1632 36.2344 15.5342C36.5952 15.9053 36.5869 16.4984 36.2158 16.8594L20.1572 32.4844C19.7933 32.8385 19.2135 32.8385 18.8496 32.4844L11.7842 25.6094C11.4132 25.2484 11.4048 24.6553 11.7656 24.2842C12.1266 23.9132 12.7197 23.9048 13.0908 24.2656L19.5039 30.5049L34.9092 15.5156Z",
+                fill: o ? n.colors.neutralHighBrand : n.colors.successHigh
+            })
+        ]
+    });
+}, V = (param)=>{
+    let { size: t = 48, color: e, skipAnimation: o = !1 } = param;
+    const { platformOverrides: s } = d(), i = h(), l = i === "brand" || i === "media" ? n.colors.neutralHighBrand : i === "negative" ? n.colors.neutralHighNegative : n.colors.brand;
+    return /* @__PURE__ */ r("svg", {
+        role: "presentation",
+        width: t,
+        height: t,
         viewBox: "0 0 64 64",
-        children: /* @__PURE__ */ c("g", {
-            stroke: e ? void 0 : a,
+        children: /* @__PURE__ */ a("g", {
+            stroke: e ? void 0 : l,
             children: [
-                /* @__PURE__ */ n("path", _object_spread({
+                /* @__PURE__ */ r("path", _object_spread({
                     fill: "none",
                     stroke: e || void 0,
                     strokeWidth: "4",
                     strokeMiterlimit: "10",
                     d: "M4.71002 43.3039C3.22557 39.7201 2.46154 35.879 2.46154 32C2.46154 28.121 3.22557 24.2799 4.71002 20.6961C6.19447 17.1124 8.37025 13.8561 11.1132 11.1132C13.8561 8.37026 17.1124 6.19447 20.6961 4.71002C24.2799 3.22558 28.121 2.46154 32 2.46154C35.879 2.46154 39.7201 3.22558 43.3039 4.71002C46.8877 6.19447 50.1439 8.37026 52.8868 11.1132C55.6297 13.8561 57.8055 17.1124 59.29 20.6961C60.7744 24.2799 61.5385 28.121 61.5385 32C61.5385 35.879 60.7744 39.7201 59.29 43.3039C57.8055 46.8877 55.6297 50.1439 52.8868 52.8868C50.1439 55.6297 46.8877 57.8055 43.3039 59.29C39.7201 60.7744 35.879 61.5385 32 61.5385C28.121 61.5385 24.2799 60.7744 20.6961 59.29C17.1124 57.8055 13.8561 55.6297 11.1132 52.8868C8.37025 50.1439 6.19447 46.8877 4.71002 43.3039Z"
-                }, !o && d("202", "0.2s", t))),
-                /* @__PURE__ */ n("path", _object_spread({
+                }, !o && c("202", "0.2s", s))),
+                /* @__PURE__ */ r("path", _object_spread({
                     fill: "none",
                     stroke: e || void 0,
                     strokeWidth: "4",
@@ -121,33 +154,38 @@ const p = (param)=>{
                     strokeLinecap: "round",
                     strokeLinejoin: "round",
                     d: "M18.8718 32L28.7179 41.8462L45.1282 23.7949"
-                }, !o && h(d("44", "0.6s", t), f("0.6s", t))))
+                }, !o && u(c("44", "0.6s", s), p("0.6s", s))))
             ]
         })
     });
-}, N = (param)=>{
-    let { size: r, color: e, skipAnimation: o } = param;
-    const { skinName: t } = l();
-    switch(t){
+}, y = (param)=>{
+    let { size: t, color: e, skipAnimation: o } = param;
+    const { skinName: s } = d();
+    switch(s){
+        case m:
+            return /* @__PURE__ */ r(k, {
+                size: t,
+                color: e,
+                skipAnimation: o
+            });
         case g:
-            return /* @__PURE__ */ n(p, {
-                size: r,
+            return /* @__PURE__ */ r(I, {
+                size: t,
                 color: e,
                 skipAnimation: o
             });
-        case m:
-        case v:
-            return /* @__PURE__ */ n(k, {
-                size: r,
+        case f:
+            return /* @__PURE__ */ r(L, {
+                size: t,
                 color: e,
                 skipAnimation: o
             });
         default:
-            return /* @__PURE__ */ n(C, {
-                size: r,
+            return /* @__PURE__ */ r(V, {
+                size: t,
                 color: e,
                 skipAnimation: o
             });
     }
 };
-export { N as default };
+export { y as default };

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

@@ -1,4 +1,4 @@
 /* empty css                                     */ /* empty css                                 */ var r = 300, t = {
-    mediaBorderRadius: "var(--v17_8_17tt25r0)"
-}, a = "v17_8_17tt25r1", i = "v17_8_17tt25r3 v17_8_17tt25r2 v17_8_1y2v1nfuo v17_8_1y2v1nfv3 v17_8_1y2v1nfrg v17_8_1y2v1nfs1 v17_8_1y2v1nfsi v17_8_1y2v1nfwc v17_8_1y2v1nftt v17_8_1y2v1nftu v17_8_1y2v1nfu6", d = "v17_8_17tt25r4", e = "v17_8_17tt25r5", o = "v17_8_17tt25r6", u = "v17_8_17tt25r7";
-export { r as FADE_IN_DURATION_MS, e as circularBorderRadius, u as defaultBorderRadius, i as image, a as imageWithBorder, t as vars, o as withBorderRadius, d as withoutBorderRadius };
+    mediaBorderRadius: "var(--v17_10_17tt25r0)"
+}, a = "v17_10_17tt25r1", d = "v17_10_17tt25r3 v17_10_17tt25r2 v17_10_1y2v1nfv8 v17_10_1y2v1nfvn v17_10_1y2v1nfs0 v17_10_1y2v1nfsl v17_10_1y2v1nft2 v17_10_1y2v1nfww v17_10_1y2v1nfud v17_10_1y2v1nfue v17_10_1y2v1nfuq", i = "v17_10_17tt25r4", e = "v17_10_17tt25r5", u = "v17_10_17tt25r6", f = "v17_10_17tt25r7";
+export { r as FADE_IN_DURATION_MS, e as circularBorderRadius, f as defaultBorderRadius, d as image, a as imageWithBorder, t as vars, u as withBorderRadius, i as withoutBorderRadius };