@telefonica/mistica 16.2.0 → 16.3.0

package/dist-es/hero.js

@@ -78,22 +78,22 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as r, jsxs as p } from "react/jsx-runtime";
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
 import * as $ from "react";
-import h from "classnames";
+import f from "classnames";
 import { useScreenSize as D } from "./hooks.js";
-import { Text3 as R, Text8 as G } from "./text.js";
+import { Text3 as N, Text8 as G } from "./text.js";
 import j from "./grid-layout.js";
-import m from "./box.js";
+import R from "./box.js";
 import g from "./stack.js";
 import A from "./button-group.js";
 import { vars as i } from "./skins/skin-contract.css-mistica.js";
-import { container as v, containerMobile as E, containerMinHeight as C, expandedContent as M, layout as B, vars as H, hero as V, containerDesktop as S, contentContainer as _, actions as z } from "./hero.css-mistica.js";
-import { vars as y } from "./image.css-mistica.js";
+import { container as v, containerMobile as E, containerMinHeight as C, expandedContent as M, layout as b, vars as H, hero as V, containerDesktop as S, contentContainer as _, actions as z } from "./hero.css-mistica.js";
+import { vars as h } from "./image.css-mistica.js";
 import { useSlideshowContext as K } from "./carousel.js";
 import { getPrefixedDataAttributes as T } from "./utils/dom.js";
 import { useIsInverseOrMediaVariant as U } from "./theme-variant-context.js";
-import { applyCssVars as x } from "./utils/css.js";
+import { applyCssVars as y } from "./utils/css.js";
 import { ResetResponsiveLayout as W, InternalResponsiveLayout as q } from "./responsive-layout.js";
 const O = {
     default: i.colors.background,
@@ -105,27 +105,27 @@ const O = {
     let { children: e, isInverse: o, backgroundColor: t } = param;
     return /* @__PURE__ */ r(q, {
         isInverse: o,
-        className: B,
-        innerDivClassName: B,
+        className: b,
+        innerDivClassName: b,
         shouldExpandWhenNested: !0,
         backgroundColor: t !== null && t !== void 0 ? t : "transparent",
         children: e
     });
-}, b = (param)=>{
-    let { headline: e, title: o, titleAs: t = "h1", pretitle: l, description: c, descriptionLinesMax: a, extra: n, button: d, secondaryButton: u, buttonLink: s } = param;
-    return /* @__PURE__ */ p("section", {
+}, x = (param)=>{
+    let { headline: e, title: o, titleAs: t = "h1", pretitle: l, description: c, descriptionLinesMax: a, extra: n, button: d, secondaryButton: p, buttonLink: s } = param;
+    return /* @__PURE__ */ m("section", {
         className: _,
         children: [
-            /* @__PURE__ */ p("div", {
+            /* @__PURE__ */ m("div", {
                 children: [
-                    /* @__PURE__ */ p(g, {
+                    /* @__PURE__ */ m(g, {
                         space: 16,
                         children: [
                             e && e,
-                            /* @__PURE__ */ p(g, {
+                            /* @__PURE__ */ m(g, {
                                 space: 8,
                                 children: [
-                                    l && /* @__PURE__ */ r(R, {
+                                    l && /* @__PURE__ */ r(N, {
                                         as: "p",
                                         regular: !0,
                                         children: l
@@ -136,7 +136,7 @@ const O = {
                                     })
                                 ]
                             }),
-                            c && /* @__PURE__ */ r(R, {
+                            c && /* @__PURE__ */ r(N, {
                                 as: "p",
                                 regular: !0,
                                 color: i.colors.textSecondary,
@@ -154,7 +154,7 @@ const O = {
                 className: z,
                 children: /* @__PURE__ */ r(A, {
                     primaryButton: d,
-                    secondaryButton: u,
+                    secondaryButton: p,
                     link: s
                 })
             })
@@ -169,37 +169,39 @@ const O = {
         "dataAttributes",
         "noPaddingY"
     ]);
-    const { isTabletOrSmaller: u } = D(), s = K(), f = !!(s != null && s.withBullets), w = U(), N = o === "none" ? w : o === "brand" || o === "brand-secondary";
-    if (u) return /* @__PURE__ */ r(W, {
+    const { isTabletOrSmaller: p } = D(), s = K(), u = !!(s != null && s.withBullets), w = U(), B = o === "none" ? w : o === "brand" || o === "brand-secondary";
+    if (p) return /* @__PURE__ */ r(W, {
         children: /* @__PURE__ */ r("div", {
-            style: x({
-                [y.mediaBorderRadius]: "0px"
+            style: y({
+                [h.mediaBorderRadius]: "0px"
             }),
-            children: /* @__PURE__ */ p("div", _object_spread_props(_object_spread({}, T(_object_spread({
+            children: /* @__PURE__ */ m("div", _object_spread_props(_object_spread({}, T(_object_spread({
                 "component-name": "Hero"
             }, c))), {
                 ref: d,
                 style: _object_spread({}, e === "100vh" ? {
                     maxHeight: "-webkit-fill-available"
-                } : {}, x({
+                } : {}, y({
                     [H.height]: typeof e == "number" ? `${e}px` : e !== null && e !== void 0 ? e : "100%",
-                    [y.mediaBorderRadius]: "0px"
+                    [h.mediaBorderRadius]: "0px"
                 })),
-                className: h(v, E, {
+                className: f(v, E, {
                     [C]: !a
                 }),
                 children: [
                     t,
                     /* @__PURE__ */ r(k, {
-                        isInverse: N,
+                        isInverse: B,
                         backgroundColor: O[o],
                         children: /* @__PURE__ */ r("div", {
                             className: M,
-                            children: /* @__PURE__ */ r(m, {
-                                paddingTop: 24,
-                                paddingBottom: f ? 48 : a ? 0 : 24,
-                                className: B,
-                                children: /* @__PURE__ */ r(b, _object_spread({}, n))
+                            children: /* @__PURE__ */ r("div", {
+                                style: {
+                                    paddingTop: 24,
+                                    paddingBottom: u ? 48 : a ? 0 : 24
+                                },
+                                className: b,
+                                children: /* @__PURE__ */ r(x, _object_spread({}, n))
                             })
                         })
                     })
@@ -207,12 +209,12 @@ const O = {
             }))
         })
     });
-    const I = l === "left" ? t : /* @__PURE__ */ r(m, {
+    const I = l === "left" ? t : /* @__PURE__ */ r(R, {
         paddingRight: 24,
-        children: /* @__PURE__ */ r(b, _object_spread({}, n))
-    }), L = l === "right" ? t : /* @__PURE__ */ r(m, {
+        children: /* @__PURE__ */ r(x, _object_spread({}, n))
+    }), L = l === "right" ? t : /* @__PURE__ */ r(R, {
         paddingLeft: 24,
-        children: /* @__PURE__ */ r(b, _object_spread({}, n))
+        children: /* @__PURE__ */ r(x, _object_spread({}, n))
     });
     return /* @__PURE__ */ r("div", _object_spread_props(_object_spread({}, T(_object_spread({
         "component-name": "Hero"
@@ -220,29 +222,33 @@ const O = {
         ref: d,
         style: _object_spread_props(_object_spread({}, e === "100vh" ? {
             maxHeight: "-webkit-fill-available"
-        } : {}, x({
+        } : {}, y({
             [H.height]: typeof e == "number" ? `${e}px` : e !== null && e !== void 0 ? e : "100%",
-            [y.mediaBorderRadius]: i.borderRadii.container
+            [h.mediaBorderRadius]: i.borderRadii.container
         })), {
             background: O[o]
         }),
         className: V,
         children: /* @__PURE__ */ r(k, {
-            isInverse: N,
+            isInverse: B,
             children: /* @__PURE__ */ r(j, {
                 template: "6+6",
-                left: /* @__PURE__ */ r(m, {
-                    paddingTop: a ? 0 : 56,
-                    paddingBottom: a && !f ? 0 : 56,
-                    className: h(v, S, {
+                left: /* @__PURE__ */ r("div", {
+                    style: {
+                        paddingTop: a ? 0 : 56,
+                        paddingBottom: a && !u ? 0 : 56
+                    },
+                    className: f(v, S, {
                         [C]: !a
                     }),
                     children: I
                 }),
-                right: /* @__PURE__ */ r(m, {
-                    paddingTop: a ? 0 : 56,
-                    paddingBottom: a && !f ? 0 : 56,
-                    className: h(v, S),
+                right: /* @__PURE__ */ r("div", {
+                    style: {
+                        paddingTop: a ? 0 : 56,
+                        paddingBottom: a && !u ? 0 : 56
+                    },
+                    className: f(v, S),
                     children: L
                 })
             })

package/dist-es/highlighted-card.js

@@ -83,15 +83,16 @@ import * as u from "react";
 import { useIsInverseOrMediaVariant as g } from "./theme-variant-context.js";
 import y from "./stack.js";
 import { BaseTouchable as k } from "./touchable.js";
-import { Text as H, textProps as P, Text2 as T } from "./text.js";
-import { Boxed as A } from "./boxed.js";
-import M, { useIsDismissable as N } from "./maybe-dismissable.js";
+import { Text as H, Text2 as T } from "./text.js";
+import { text4 as A } from "./text-props.js";
+import { Boxed as M } from "./boxed.js";
+import N, { useIsDismissable as P } from "./maybe-dismissable.js";
 import { container as R, textContainerVariant as $, imageContent as D, touchableContainer as O } from "./highlighted-card.css-mistica.js";
 import { vars as S } from "./skins/skin-contract.css-mistica.js";
 import { useTheme as j } from "./hooks.js";
-const B = /*#__PURE__*/ u.forwardRef((o, e)=>{
-    var _o_isInverse;
-    const { title: s, description: r, imageUrl: a, imageFit: n, imageAlt: m, titleAs: b = "h3", width: d, dataAttributes: f, titleLinesMax: v, descriptionLinesMax: x } = o, t = _object_without_properties(o, [
+const B = /*#__PURE__*/ u.forwardRef((n, e)=>{
+    var _n_isInverse;
+    const { title: s, description: r, imageUrl: a, imageFit: o, imageAlt: m, titleAs: f = "h3", width: d, dataAttributes: b, titleLinesMax: v, descriptionLinesMax: x } = n, t = _object_without_properties(n, [
         "title",
         "description",
         "imageUrl",
@@ -102,13 +103,13 @@ const B = /*#__PURE__*/ u.forwardRef((o, e)=>{
         "dataAttributes",
         "titleLinesMax",
         "descriptionLinesMax"
-    ]), I = g(), p = (_o_isInverse = o.isInverse) !== null && _o_isInverse !== void 0 ? _o_isInverse : I, h = N(), { textPresets: w } = j(), c = /* @__PURE__ */ l(A, {
+    ]), I = g(), p = (_n_isInverse = n.isInverse) !== null && _n_isInverse !== void 0 ? _n_isInverse : I, h = P(), { textPresets: w } = j(), c = /* @__PURE__ */ l(M, {
         ref: e,
         isInverse: p,
         className: R,
         dataAttributes: _object_spread({
             "component-name": "HighlightedCard"
-        }, f),
+        }, b),
         width: d ? `${d}px` : "100%",
         minHeight: "100%",
         children: [
@@ -120,10 +121,10 @@ const B = /*#__PURE__*/ u.forwardRef((o, e)=>{
                     /* @__PURE__ */ l(y, {
                         space: 8,
                         children: [
-                            !!s && /* @__PURE__ */ i(H, _object_spread_props(_object_spread({}, P.text4), {
+                            !!s && /* @__PURE__ */ i(H, _object_spread_props(_object_spread({}, A), {
                                 truncate: v,
                                 weight: w.cardTitle.weight,
-                                as: b,
+                                as: f,
                                 hyphens: "auto",
                                 children: s
                             })),
@@ -158,8 +159,8 @@ const B = /*#__PURE__*/ u.forwardRef((o, e)=>{
                 style: {
                     backgroundImage: `url(${a})`,
                     backgroundRepeat: "no-repeat",
-                    backgroundSize: n === "fit" ? "contain" : "cover",
-                    backgroundPosition: n === "fit" ? "bottom right" : `center ${n === "fill-center" ? "center" : "right"}`
+                    backgroundSize: o === "fit" ? "contain" : "cover",
+                    backgroundPosition: o === "fit" ? "bottom right" : `center ${o === "fill-center" ? "center" : "right"}`
                 }
             }))
         ]
@@ -169,20 +170,20 @@ const B = /*#__PURE__*/ u.forwardRef((o, e)=>{
         children: c
     })) : c;
 }), F = /*#__PURE__*/ u.forwardRef((_param, s)=>{
-    var { "aria-label": o } = _param, e = _object_without_properties(_param, [
+    var { "aria-label": n } = _param, e = _object_without_properties(_param, [
         "aria-label"
     ]);
     var _e_isInverse;
-    const r = o || e.title || e.description, a = g(), n = (_e_isInverse = e.isInverse) !== null && _e_isInverse !== void 0 ? _e_isInverse : a;
-    return /* @__PURE__ */ i(M, {
+    const r = n || e.title || e.description, a = g(), o = (_e_isInverse = e.isInverse) !== null && _e_isInverse !== void 0 ? _e_isInverse : a;
+    return /* @__PURE__ */ i(N, {
         onClose: e.onClose,
         "aria-label": r,
         width: e.width,
-        variant: e.imageUrl ? "media" : n ? "inverse" : void 0,
+        variant: e.imageUrl ? "media" : o ? "inverse" : void 0,
         children: /* @__PURE__ */ i(B, _object_spread_props(_object_spread({}, e), {
             "aria-label": r,
             ref: s
         }))
     });
-}), W = F;
-export { W as default };
+}), X = F;
+export { X as default };

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./list.css.ts.vanilla.css-mistica.js";
-var _ = "_1y2v1nfhk _1y2v1nfi2 _1y2v1nfi4", f = "_1y2v1nfhk _1y2v1nfhz _1y2v1nfht _1y2v1nfja _1y2v1nfio _1y2v1nfi2", y = "_1y2v1nfhk _1y2v1nfhz", a = "_1y2v1nfhk _1y2v1nfi7 _1y2v1nfjx", r = "_2buj9gf _1y2v1nfhk _1y2v1nfhz", i = "_2buj9ge", t = "_2buj9g0", h = "_1y2v1nfhk _1y2v1nfhp _1y2v1nfio", o = "_2buj9gl _1y2v1nfhk", e = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhm _1y2v1nfi5", d = "_2buj9gn _1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhk _1y2v1nfhz _1y2v1nfi4 _1y2v1nfi8 _1y2v1nfio", b = "_1y2v1nfkk", u = "_2buj9gc", g = "_2buj9gd", k = "_1y2v1nfi7", c = "_1y2v1nfhk _1y2v1nfhq _1y2v1nfi6", j = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfi7 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfhm _1y2v1nfio", l = "_2buj9g2", m = "_2buj9g3";
-export { _ as asset, f as badge, y as center, a as content, r as detail, i as detailRight, t as disabled, h as dualActionContainer, o as dualActionDivider, e as dualActionLeft, d as dualActionRight, b as pointer, u as rightContent, g as rightRestrictedWidth, k as row, c as rowBody, j as rowContent, l as touchableBackground, m as touchableBackgroundInverse };
+var _ = "_1y2v1nfhk _1y2v1nfi2 _1y2v1nfi4", f = "_1y2v1nfbj", y = "_1y2v1nfhk _1y2v1nfhz _1y2v1nfht _1y2v1nfja _1y2v1nfio _1y2v1nfi2", a = "_1y2v1nfhk _1y2v1nfhz", r = "_1y2v1nf7s _1y2v1nf91 _1y2v1nfhk _1y2v1nfi7 _1y2v1nfjx", i = "_2buj9gh _1y2v1nfhk _1y2v1nfhz", t = "_2buj9gg", o = "_2buj9g0", h = "_1y2v1nfhk _1y2v1nfhp _1y2v1nfio", e = "_2buj9gn _1y2v1nfhk", b = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhm _1y2v1nfi5", d = "_2buj9gp _1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfaa _1y2v1nfbj _1y2v1nfhk _1y2v1nfhz _1y2v1nfi4 _1y2v1nfi8 _1y2v1nfio", g = "_1y2v1nfkk", u = "_2buj9ge", k = "_2buj9gf", j = "_1y2v1nfi7", c = "_1y2v1nfhk _1y2v1nfhq _1y2v1nfi6", l = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfi7 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfhm _1y2v1nfio", s = "_1y2v1nfaa _1y2v1nfbj", m = "_2buj9g2", p = "_2buj9g3";
+export { _ as asset, f as assetContainer, y as badge, a as center, r as content, i as detail, t as detailRight, o as disabled, h as dualActionContainer, e as dualActionDivider, b as dualActionLeft, d as dualActionRight, g as pointer, u as rightContent, k as rightRestrictedWidth, j as row, c as rowBody, l as rowContent, s as rowContentPadding, m as touchableBackground, p as touchableBackgroundInverse };