@telefonica/mistica 15.0.0 → 15.1.0

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

@@ -10,9 +10,9 @@ var a = {
     default: "yqt1oe1a",
     small: "yqt1oe1b"
 }, o = {
-    default: "yqt1oe12 _1y2v1nf71 _1y2v1nf8a _1y2v1nf9j _1y2v1nfas _1y2v1nfjq _1y2v1nf70 _1y2v1nfh8 _1y2v1nfhn _1y2v1nfhh",
-    small: "yqt1oe13 _1y2v1nf71 _1y2v1nf8a _1y2v1nf9j _1y2v1nfas _1y2v1nfjq _1y2v1nf70 _1y2v1nfh8 _1y2v1nfhn _1y2v1nfhh"
-}, y = "yqt1oe1m _1y2v1nfhc", v = "yqt1oey", l = "yqt1oe1i _1y2v1nfh2 _1y2v1nfh9", f = {
+    default: "yqt1oe12 _1y2v1nf73 _1y2v1nf8c _1y2v1nf9l _1y2v1nfau _1y2v1nfjs _1y2v1nf72 _1y2v1nfha _1y2v1nfhp _1y2v1nfhj",
+    small: "yqt1oe13 _1y2v1nf73 _1y2v1nf8c _1y2v1nf9l _1y2v1nfau _1y2v1nfjs _1y2v1nf72 _1y2v1nfha _1y2v1nfhp _1y2v1nfhj"
+}, y = "yqt1oe1m _1y2v1nfhe", v = "yqt1oey", l = "yqt1oe1i _1y2v1nfh4 _1y2v1nfhb", f = {
     "brand-solid-default": "yqt1oe4",
     "brand-solid-inverse": "yqt1oe5",
     "brand-solid-alternative": "yqt1oe6",
@@ -44,16 +44,13 @@ var a = {
     "neutral-media": "yqt1oew",
     "danger-media": "yqt1oex"
 }, d = {
-    default: "yqt1oe1e yqt1oe1d _1y2v1nfjr _1y2v1nfh8 _1y2v1nfhn _1y2v1nfhh _1y2v1nfk9 _1y2v1nfh2",
-    small: "yqt1oe1f yqt1oe1d _1y2v1nfjr _1y2v1nfh8 _1y2v1nfhn _1y2v1nfhh _1y2v1nfk9 _1y2v1nfh2"
-}, q = {
+    default: "yqt1oe1e yqt1oe1d _1y2v1nfjt _1y2v1nfha _1y2v1nfhp _1y2v1nfhj _1y2v1nfkb _1y2v1nfh4",
+    small: "yqt1oe1f yqt1oe1d _1y2v1nfjt _1y2v1nfha _1y2v1nfhp _1y2v1nfhj _1y2v1nfkb _1y2v1nfh4"
+}, i = {
     default: "calc(1.5rem + 24px)",
     small: "calc(1.25rem + 12px)"
-}, i = {
+}, q = {
     default: "1.5rem",
     small: "1.25rem"
-}, s = {
-    default: "yqt1oe14",
-    small: "yqt1oe15"
-}, _ = "yqt1oez", u = "yqt1oe1g", h = "yqt1oe10", m = "yqt1oe1k _1y2v1nfh3";
-export { a as bleedLeft, n as bleedRight, r as bleedY, o as buttonContainer, y as deprecatedIconButtonBase, v as disabled, l as icon, f as iconButtonTokens, d as iconContainer, q as iconContainerSize, i as iconSize, s as interactiveAreaBleed, _ as isLoading, u as overlay, h as overlayContainer, m as spinner };
+}, s = "yqt1oez", _ = "yqt1oe15", u = "yqt1oe1g", m = "yqt1oe10", p = "yqt1oe1k _1y2v1nfh5";
+export { a as bleedLeft, n as bleedRight, r as bleedY, o as buttonContainer, y as deprecatedIconButtonBase, v as disabled, l as icon, f as iconButtonTokens, d as iconContainer, i as iconContainerSize, q as iconSize, s as isLoading, _ as minimumInteractiveArea, u as overlay, m as overlayContainer, p as spinner };

package/dist-es/icon-button.js

@@ -78,30 +78,30 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as t, jsxs as A } from "react/jsx-runtime";
+import { jsx as t, jsxs as C } from "react/jsx-runtime";
 import * as i from "react";
-import { BaseTouchable as u } from "./touchable.js";
-import { buttonContainer as j, iconButtonTokens as L, disabled as _, overlayContainer as $, bleedLeft as D, bleedRight as K, bleedY as M, interactiveAreaBleed as Y, iconContainer as Z, isLoading as q, overlay as F, icon as G, iconSize as k, spinner as H, deprecatedIconButtonBase as J } from "./icon-button.css-mistica.js";
-import v from "classnames";
-import Q from "./spinner.js";
-import { useThemeVariant as X } from "./theme-variant-context.js";
-const U = 24, p = (e, r, o, a, n)=>{
-    const c = a ? `${a}px ${a}px` : "100% 100%";
+import { BaseTouchable as d } from "./touchable.js";
+import { buttonContainer as W, iconButtonTokens as j, minimumInteractiveArea as L, disabled as _, overlayContainer as $, bleedLeft as D, bleedRight as K, bleedY as M, iconContainer as Y, isLoading as Z, overlay as q, icon as F, iconSize as A, spinner as G, deprecatedIconButtonBase as H } from "./icon-button.css-mistica.js";
+import S from "classnames";
+import J from "./spinner.js";
+import { useThemeVariant as Q } from "./theme-variant-context.js";
+const X = 24, U = (e, a, l, r, n)=>{
+    const o = r ? `${r}px ${r}px` : "100% 100%";
     return {
         padding: 0,
-        backgroundColor: o,
+        backgroundColor: l,
         backgroundImage: e ? `url(${e})` : "initial",
-        backgroundSize: c,
+        backgroundSize: o,
         cursor: n ? "default" : "pointer",
-        height: r,
-        width: r,
+        height: a,
+        width: a,
         verticalAlign: "middle",
         textAlign: "center"
     };
-}, ee = /*#__PURE__*/ i.forwardRef((e, r)=>{
-    const { icon: o, children: a } = e, n = {
+}, p = /*#__PURE__*/ i.forwardRef((e, a)=>{
+    const { icon: l, children: r } = e, n = {
         className: e.className || "",
-        ref: r,
+        ref: a,
         disabled: e.disabled,
         style: e.style,
         trackingEvent: e.trackingEvent,
@@ -110,29 +110,29 @@ const U = 24, p = (e, r, o, a, n)=>{
             "component-name": "IconButton"
         }, e.dataAttributes)
     };
-    return e.href ? /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, n), {
+    return e.href ? /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, n), {
         href: e.href,
         newTab: e.newTab,
         "aria-label": e["aria-label"],
-        children: !o && i.Children.only(a)
-    })) : e.to ? /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, n), {
+        children: !l && i.Children.only(r)
+    })) : e.to ? /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, n), {
         to: e.to,
         fullPageOnWebView: e.fullPageOnWebView,
         replace: e.replace,
         "aria-label": e["aria-label"],
-        children: !o && i.Children.only(a)
-    })) : e.onPress ? /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, n), {
-        onPress: (c)=>{
-            c.stopPropagation(), e.onPress(c);
+        children: !l && i.Children.only(r)
+    })) : e.onPress ? /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, n), {
+        onPress: (o)=>{
+            o.stopPropagation(), e.onPress(o);
         },
         "aria-label": e["aria-label"],
-        children: !o && i.Children.only(a)
-    })) : /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, n), {
+        children: !l && i.Children.only(r)
+    })) : /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, n), {
         maybe: !0,
-        children: !o && i.Children.only(a)
+        children: !l && i.Children.only(r)
     }));
-}), x = /*#__PURE__*/ i.forwardRef((_param, z)=>{
-    var { disabled: e, trackingEvent: r, dataAttributes: o, type: a = "neutral", backgroundType: n = "transparent", isOverMedia: c, hasOverlay: S = !0, "aria-label": I, "aria-labelledby": h, small: w, Icon: R, bleedLeft: m, bleedRight: f, bleedY: T, hasInteractiveAreaBleed: b } = _param, l = _object_without_properties(_param, [
+}), O = /*#__PURE__*/ i.forwardRef((_param, k)=>{
+    var { disabled: e, trackingEvent: a, dataAttributes: l, type: r = "neutral", backgroundType: n = "transparent", isOverMedia: o, hasOverlay: P = !0, "aria-label": y, "aria-labelledby": b, small: h, Icon: v, bleedLeft: f, bleedRight: m, bleedY: B } = _param, c = _object_without_properties(_param, [
         "disabled",
         "trackingEvent",
         "dataAttributes",
@@ -146,99 +146,96 @@ const U = 24, p = (e, r, o, a, n)=>{
         "Icon",
         "bleedLeft",
         "bleedRight",
-        "bleedY",
-        "hasInteractiveAreaBleed"
+        "bleedY"
     ]);
-    const V = X(), [E, B] = i.useState(!1), s = l.showSpinner || E, [P, N] = i.useState(!!s);
+    const x = Q(), [z, R] = i.useState(!1), s = c.showSpinner || z, [w, T] = i.useState(!!s);
     i.useEffect(()=>{
-        s && !P && N(!0);
+        s && !w && T(!0);
     }, [
         s,
-        P
+        w
     ]);
-    const d = w ? "small" : "default", C = c ? `${a}-media` : `${a}-${n}-${V}`, g = {
+    const u = h ? "small" : "default", V = o ? `${r}-media` : `${r}-${n}-${x}`, I = {
         disabled: e || s,
-        ref: z,
-        trackingEvent: r,
-        "aria-label": I,
-        "aria-labelledby": h,
-        role: l.onPress || l.to || l.href ? "button" : void 0,
+        ref: k,
+        trackingEvent: a,
+        "aria-label": y,
+        "aria-labelledby": b,
         dataAttributes: _object_spread({
             "component-name": "IconButton"
-        }, o),
-        className: v(j[d], L[C], {
+        }, l),
+        className: S(W[u], j[V], L, {
             [_]: e,
             [$]: !e && !s,
-            [D[d]]: m && !b,
-            [K[d]]: f && !b,
-            [M[d]]: T && !b,
-            [Y[d]]: b
+            [D[u]]: f,
+            [K[u]]: m,
+            [M[u]]: B
         }),
-        resetMargin: !m && !f && !T && !b
-    }, y = /* @__PURE__ */ A("div", {
-        className: v(Z[d], {
-            [q]: s
+        resetMargin: !f && !m && !B
+    }, g = /* @__PURE__ */ C("div", {
+        className: S(Y[u], {
+            [Z]: s
         }),
         children: [
-            S && /* @__PURE__ */ t("div", {
-                className: F
+            P && /* @__PURE__ */ t("div", {
+                className: q
             }),
             /* @__PURE__ */ t("div", {
                 "aria-hidden": s ? !0 : void 0,
-                className: G,
-                children: /* @__PURE__ */ t(R, {
-                    size: k[d],
+                className: F,
+                children: /* @__PURE__ */ t(v, {
+                    size: A[u],
                     color: "currentColor"
                 })
             }),
             /* @__PURE__ */ t("div", {
                 "aria-hidden": s ? void 0 : !0,
-                className: H,
+                className: G,
                 onTransitionEnd: ()=>{
-                    s !== P && N(s);
+                    s !== w && T(s);
                 },
-                children: P && /* @__PURE__ */ t(Q, {
-                    size: k[d],
+                children: w && /* @__PURE__ */ t(J, {
+                    size: A[u],
                     color: "currentColor",
                     delay: "0s"
                 })
             })
         ]
     });
-    return l.href ? /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, g), {
-        href: l.href,
-        newTab: l.newTab,
-        children: y
-    })) : l.to ? /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, g), {
-        to: l.to,
-        fullPageOnWebView: l.fullPageOnWebView,
-        replace: l.replace,
-        children: y
-    })) : l.onPress ? /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, g), {
-        onPress: (W)=>{
-            const O = l.onPress(W);
-            O && (B(!0), O.finally(()=>B(!1)));
+    return c.href ? /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, I), {
+        href: c.href,
+        newTab: c.newTab,
+        children: g
+    })) : c.to ? /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, I), {
+        to: c.to,
+        fullPageOnWebView: c.fullPageOnWebView,
+        replace: c.replace,
+        children: g
+    })) : c.onPress ? /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, I), {
+        onPress: (E)=>{
+            const N = c.onPress(E);
+            N && (R(!0), N.finally(()=>R(!1)));
         },
-        children: y
-    })) : /* @__PURE__ */ t(u, _object_spread_props(_object_spread({}, g), {
+        children: g
+    })) : /* @__PURE__ */ t(d, _object_spread_props(_object_spread({}, I), {
         maybe: !0,
-        children: y
+        children: g
     }));
-}), te = /*#__PURE__*/ i.forwardRef((e, r)=>{
-    if (e.Icon) return /* @__PURE__ */ t(x, _object_spread({
-        ref: r
+}), ee = /*#__PURE__*/ i.forwardRef((e, a)=>{
+    if (e.Icon) return /* @__PURE__ */ t(O, _object_spread({
+        ref: a
     }, e));
-    const { icon: o, backgroundColor: a = "transparent", iconSize: n, size: c = U } = e;
-    return /* @__PURE__ */ t(ee, _object_spread_props(_object_spread({
-        ref: r
+    const { icon: l, backgroundColor: r = "transparent", iconSize: n, size: o = X } = e;
+    return /* @__PURE__ */ t(p, _object_spread_props(_object_spread({
+        ref: a
     }, e), {
-        className: v(J, e.className),
-        style: _object_spread({}, p(o, c, a, n, e.disabled), e.style)
+        className: S(H, e.className),
+        style: _object_spread({}, U(l, o, r, n, e.disabled), e.style)
     }));
-}), se = /*#__PURE__*/ i.forwardRef((e, r)=>/* @__PURE__ */ t(te, _object_spread({
-        ref: r
-    }, e))), ne = /*#__PURE__*/ i.forwardRef((_param, I)=>{
-    var { checked: e, defaultChecked: r, checkedProps: o, uncheckedProps: a, onChange: n, dataAttributes: c } = _param, S = _object_without_properties(_param, [
+}), ce = /*#__PURE__*/ i.forwardRef((e, a)=>/* @__PURE__ */ t(ee, _object_spread({
+        ref: a
+    }, e))), te = /*#__PURE__*/ i.forwardRef((_param, y)=>{
+    var { checked: e, defaultChecked: a, checkedProps: l, uncheckedProps: r, onChange: n, dataAttributes: o } = _param, P = _object_without_properties(_param, [
         "checked",
         "defaultChecked",
         "checkedProps",
@@ -246,22 +243,22 @@ const U = 24, p = (e, r, o, a, n)=>{
         "onChange",
         "dataAttributes"
     ]);
-    const [h, w] = i.useState(!!r), R = ()=>{
+    const [b, h] = i.useState(!!a), v = ()=>{
         if (e === void 0) {
-            const m = n == null ? void 0 : n(!h);
-            if (m) return m.then(()=>w((f)=>!f)).catch(()=>{});
-            w((f)=>!f);
+            const f = n == null ? void 0 : n(!b);
+            if (f) return f.then(()=>h((m)=>!m)).catch(()=>{});
+            h((m)=>!m);
         } else return n == null ? void 0 : n(!e);
     };
-    return /* @__PURE__ */ t(x, _object_spread_props(_object_spread({
-        ref: I
-    }, S, (e !== null && e !== void 0 ? e : h) ? o : a), {
+    return /* @__PURE__ */ t(O, _object_spread_props(_object_spread({
+        ref: y
+    }, P, (e !== null && e !== void 0 ? e : b) ? l : r), {
         dataAttributes: _object_spread({
             "component-name": "ToggleIconButton"
-        }, c),
-        onPress: R
+        }, o),
+        onPress: v
     }));
-}), de = /*#__PURE__*/ i.forwardRef((e, r)=>/* @__PURE__ */ t(ne, _object_spread({
-        ref: r
+}), se = /*#__PURE__*/ i.forwardRef((e, a)=>/* @__PURE__ */ t(te, _object_spread({
+        ref: a
     }, e)));
-export { se as IconButton, te as InternalIconButton, ne as InternalToggleIconButton, ee as RawDeprecatedIconButton, x as RawIconButton, de as ToggleIconButton };
+export { ce as IconButton, ee as InternalIconButton, te as InternalToggleIconButton, p as RawDeprecatedIconButton, O as RawIconButton, se as ToggleIconButton };

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

@@ -1,6 +1,6 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./image.css.ts.vanilla.css-mistica.js";
-var v = 300, _ = "_17tt25r5", t = "_17tt25r6", i = "_17tt25r3 _1y2v1nfkf _1y2v1nfku _1y2v1nfha _1y2v1nfhv _1y2v1nfic _1y2v1nfm3 _1y2v1nfjn _1y2v1nfjo _1y2v1nfjz", d = "_17tt25r1", f = "_17tt25r4", n = {
+var v = 300, _ = "_17tt25r5", t = "_17tt25r6", i = "_17tt25r3 _1y2v1nfkh _1y2v1nfkw _1y2v1nfhc _1y2v1nfhx _1y2v1nfie _1y2v1nfm5 _1y2v1nfjp _1y2v1nfjq _1y2v1nfk1", d = "_17tt25r1", e = "_17tt25r4", f = {
     mediaBorderRadius: "var(--_17tt25r0)"
 };
-export { v as FADE_IN_DURATION_MS, _ as circularBorderRadius, t as defaultBorderRadius, i as image, d as imageWithBorder, f as noBorderRadius, n as vars };
+export { v as FADE_IN_DURATION_MS, _ as circularBorderRadius, t as defaultBorderRadius, i as image, d as imageWithBorder, e as noBorderRadius, f as vars };