@telefonica/mistica 14.1.0 → 14.3.0

package/dist-es/header.js

@@ -77,172 +77,180 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }
     return target;
 }
-import d from "./box.js";
-import l from "./stack.js";
+import p from "./box.js";
+import n from "./stack.js";
 import { useIsInverseVariant as P } from "./theme-variant-context.js";
-import S from "./responsive-layout.js";
-import T from "./grid-layout.js";
-import { useScreenSize as h } from "./hooks.js";
-import v from "./overscroll-color-context.js";
-import { Text6 as B, Text3 as u, Text8 as R, Text7 as j } from "./text.js";
-import G from "./button-group.js";
-import { vars as p } from "./skins/skin-contract.css-mistica.js";
-import { jsxs as t, jsx as r } from "./_virtual/jsx-runtime.js";
-const J = (param)=>{
-    let { pretitle: i , title: e , description: o , dataAttributes: n , preamount: c , amount: s , button: a , subtitle: g , isErrorAmount: H , secondaryButton: x  } = param;
-    const { isTabletOrSmaller: L  } = h(), O = P(), f = (m, y)=>{
-        if (typeof m == "string") return /* @__PURE__ */ r(u, _objectSpreadProps(_objectSpread({
+import x from "./responsive-layout.js";
+import v from "./grid-layout.js";
+import { useScreenSize as f } from "./hooks.js";
+import B from "./overscroll-color-context.js";
+import { Text6 as H, Text3 as T, Text8 as R, Text7 as j } from "./text.js";
+import A from "./button-group.js";
+import { vars as d } from "./skins/skin-contract.css-mistica.js";
+import { jsxs as o, jsx as r, Fragment as C } from "./_virtual/jsx-runtime.js";
+const N = (param)=>{
+    let { pretitle: l , title: e , description: t , dataAttributes: i , preamount: c , amount: m , button: h , subtitle: a , isErrorAmount: s , secondaryButton: y  } = param;
+    const { isTabletOrSmaller: L  } = f(), O = P(), u = (g, S)=>{
+        if (typeof g == "string") return /* @__PURE__ */ r(T, _objectSpreadProps(_objectSpread({
             regular: !0
-        }, y), {
-            children: m
+        }, S), {
+            children: g
         }));
-        const { text: M  } = m, I = _objectWithoutProperties(m, [
+        const { text: G  } = g, k = _objectWithoutProperties(g, [
             "text"
         ]);
-        return /* @__PURE__ */ r(u, _objectSpreadProps(_objectSpread({
+        return /* @__PURE__ */ r(T, _objectSpreadProps(_objectSpread({
             regular: !0
-        }, y, I), {
-            children: m.text
+        }, S, k), {
+            children: g.text
         }));
     };
-    return /* @__PURE__ */ t(l, {
+    return /* @__PURE__ */ o(n, {
         space: L ? 24 : 32,
-        dataAttributes: n,
+        dataAttributes: i,
         children: [
-            (e || i || o) && /* @__PURE__ */ r(d, {
+            (e || l || t) && /* @__PURE__ */ r(p, {
                 paddingRight: 16,
-                children: /* @__PURE__ */ t(l, {
+                children: /* @__PURE__ */ o(n, {
                     space: 8,
                     children: [
-                        i && f(i, {
-                            color: p.colors.textPrimary
+                        l && u(l, {
+                            color: d.colors.textPrimary
                         }),
-                        /* @__PURE__ */ r(B, {
+                        /* @__PURE__ */ r(H, {
                             role: "heading",
                             "aria-level": 2,
                             children: e
                         }),
-                        o && /* @__PURE__ */ r(u, {
+                        t && /* @__PURE__ */ r(T, {
                             regular: !0,
-                            color: p.colors.textSecondary,
-                            children: o
+                            color: d.colors.textSecondary,
+                            children: t
                         })
                     ]
                 })
             }),
-            (c || s || a || g) && /* @__PURE__ */ t(l, {
+            (c || m || h || a) && /* @__PURE__ */ o(n, {
                 space: 16,
                 children: [
-                    (c || s) && /* @__PURE__ */ t(l, {
+                    (c || m) && /* @__PURE__ */ o(n, {
                         space: 8,
                         children: [
-                            c && f(c, {
-                                color: p.colors.textPrimary
+                            c && u(c, {
+                                color: d.colors.textPrimary
                             }),
                             /* @__PURE__ */ r(R, {
-                                color: H && !O ? p.colors.highlight : p.colors.textPrimary,
-                                children: s
+                                color: s && !O ? d.colors.highlight : d.colors.textPrimary,
+                                children: m
                             })
                         ]
                     }),
-                    (a || x) && /* @__PURE__ */ r(G, {
-                        primaryButton: a,
-                        secondaryButton: x
+                    (h || y) && /* @__PURE__ */ r(A, {
+                        primaryButton: h,
+                        secondaryButton: y
                     }),
-                    g && f(g, {})
+                    a && u(a, {})
                 ]
             })
         ]
     });
-}, K = (param)=>{
-    let { title: i , description: e , button: o  } = param;
-    const { isTabletOrSmaller: n  } = h();
-    return /* @__PURE__ */ t(l, {
+}, Q = (param)=>{
+    let { title: l , description: e , button: t  } = param;
+    const { isTabletOrSmaller: i  } = f();
+    return /* @__PURE__ */ o(n, {
         space: 32,
         children: [
-            /* @__PURE__ */ t(l, {
-                space: n ? 12 : 16,
+            /* @__PURE__ */ o(n, {
+                space: i ? 12 : 16,
                 children: [
-                    i && /* @__PURE__ */ r(j, {
+                    l && /* @__PURE__ */ r(j, {
                         role: "heading",
                         "aria-level": 1,
-                        children: i
+                        children: l
                     }),
-                    e && /* @__PURE__ */ r(B, {
+                    e && /* @__PURE__ */ r(H, {
                         children: e
                     })
                 ]
             }),
-            o
+            t
         ]
     });
-}, N = (param)=>{
-    let { isInverse: i = !0 , breadcrumbs: e , header: o , extra: n , sideBySideExtraOnDesktop: c = !1 , dataAttributes: s  } = param;
-    const { isTabletOrSmaller: a  } = h();
-    return /* @__PURE__ */ t(S, {
-        isInverse: i,
-        dataAttributes: _objectSpread({
-            "component-name": "HeaderLayout"
-        }, s),
+}, U = (param)=>{
+    let { isInverse: l = !0 , breadcrumbs: e , header: t , extra: i , sideBySideExtraOnDesktop: c = !1 , dataAttributes: m , bleed: h = !1  } = param;
+    const { isTabletOrSmaller: a  } = f(), s = h && l;
+    return /* @__PURE__ */ o(C, {
         children: [
-            /* @__PURE__ */ r(v, {}),
-            a ? /* @__PURE__ */ r(d, {
-                paddingTop: o ? 32 : 0,
-                paddingBottom: 24,
-                children: /* @__PURE__ */ t(l, {
-                    space: 24,
-                    children: [
-                        o,
-                        n
-                    ]
-                })
-            }) : c ? /* @__PURE__ */ r(d, {
-                paddingTop: e ? 16 : 48,
-                paddingBottom: 48,
-                children: /* @__PURE__ */ r(T, {
-                    template: "6+6",
-                    left: /* @__PURE__ */ t(l, {
-                        space: 32,
-                        children: [
-                            e,
-                            o
-                        ]
-                    }),
-                    right: n
-                })
-            }) : /* @__PURE__ */ r(d, {
-                paddingTop: e ? 16 : 48,
-                paddingBottom: 48,
-                children: /* @__PURE__ */ t(l, {
-                    space: a ? 24 : 32,
-                    children: [
-                        /* @__PURE__ */ t(l, {
-                            space: 32,
+            /* @__PURE__ */ o(x, {
+                isInverse: l,
+                dataAttributes: _objectSpread({
+                    "component-name": "HeaderLayout"
+                }, m),
+                children: [
+                    /* @__PURE__ */ r(B, {}),
+                    a ? /* @__PURE__ */ r(p, {
+                        paddingTop: t ? 32 : 0,
+                        paddingBottom: 24,
+                        children: /* @__PURE__ */ o(n, {
+                            space: 24,
                             children: [
-                                e,
-                                o
+                                t,
+                                !s && i
                             ]
-                        }),
-                        n
-                    ]
-                })
+                        })
+                    }) : c ? /* @__PURE__ */ r(p, {
+                        paddingTop: e ? 16 : 48,
+                        paddingBottom: 48,
+                        children: /* @__PURE__ */ r(v, {
+                            template: "6+6",
+                            left: /* @__PURE__ */ o(n, {
+                                space: 32,
+                                children: [
+                                    e,
+                                    t
+                                ]
+                            }),
+                            right: i
+                        })
+                    }) : /* @__PURE__ */ r(p, {
+                        paddingTop: e ? 16 : 48,
+                        paddingBottom: s ? 32 : 48,
+                        children: /* @__PURE__ */ o(n, {
+                            space: a ? 24 : 32,
+                            children: [
+                                /* @__PURE__ */ o(n, {
+                                    space: 32,
+                                    children: [
+                                        e,
+                                        t
+                                    ]
+                                }),
+                                !s && i
+                            ]
+                        })
+                    })
+                ]
+            }),
+            s && i && (a || !c) && /* @__PURE__ */ r(x, {
+                backgroundColor: `linear-gradient(to bottom, ${d.colors.backgroundBrand} 40px, ${d.colors.background} 0%)`,
+                children: i
             })
         ]
     });
-}, Q = (param)=>{
-    let { isInverse: i = !0 , children: e  } = param;
-    const { isTabletOrSmaller: o  } = h();
-    return /* @__PURE__ */ t(S, {
-        isInverse: i,
+}, W = (param)=>{
+    let { isInverse: l = !0 , children: e  } = param;
+    const { isTabletOrSmaller: t  } = f();
+    return /* @__PURE__ */ o(x, {
+        isInverse: l,
         children: [
-            /* @__PURE__ */ r(v, {}),
-            o ? /* @__PURE__ */ r(d, {
+            /* @__PURE__ */ r(B, {}),
+            t ? /* @__PURE__ */ r(p, {
                 paddingTop: 12,
                 paddingBottom: 24,
                 children: e
-            }) : /* @__PURE__ */ r(T, {
+            }) : /* @__PURE__ */ r(v, {
                 template: "6+6",
-                left: /* @__PURE__ */ r(d, {
+                left: /* @__PURE__ */ r(p, {
                     paddingY: 48,
                     children: e
                 }),
@@ -251,4 +259,4 @@ const J = (param)=>{
         ]
     });
 };
-export { J as Header, N as HeaderLayout, K as MainSectionHeader, Q as MainSectionHeaderLayout };
+export { N as Header, U as HeaderLayout, Q as MainSectionHeader, W as MainSectionHeaderLayout };

package/dist-es/highlighted-card.js

@@ -77,21 +77,21 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }
     return target;
 }
-import * as u from "react";
+import * as g from "react";
 import { useIsInverseVariant as b } from "./theme-variant-context.js";
 import v from "./box.js";
 import { BaseTouchable as c } from "./touchable.js";
 import { Text4 as w, Text2 as x } from "./text.js";
 import { Boxed as k } from "./boxed.js";
-import C, { useIsDismissable as I } from "./maybe-dismissable.js";
+import I, { useIsDismissable as C } from "./maybe-dismissable.js";
 import { container as E, textContainerVariant as N, imageContent as P, touchableContainer as s } from "./highlighted-card.css-mistica.js";
 import { vars as T } from "./skins/skin-contract.css-mistica.js";
 import { jsxs as d, jsx as t, Fragment as y } from "./_virtual/jsx-runtime.js";
-const V = /*#__PURE__*/ u.forwardRef((e, i)=>{
-    var h;
-    const { title: a , description: r , imageUrl: o , imageFit: l  } = e, f = b(), g = (h = e.isInverse) != null ? h : f, m = I(), n = /* @__PURE__ */ d(k, {
+const R = /*#__PURE__*/ g.forwardRef((e, i)=>{
+    var u;
+    const { title: a , description: r , imageUrl: o , imageFit: l  } = e, h = b(), f = (u = e.isInverse) != null ? u : h, m = C(), n = /* @__PURE__ */ d(k, {
         ref: i,
-        isInverse: g,
+        isInverse: f,
         className: E,
         dataAttributes: _objectSpread({
             "component-name": "HighlightedCard"
@@ -135,7 +135,8 @@ const V = /*#__PURE__*/ u.forwardRef((e, i)=>{
             o && /* @__PURE__ */ t("div", {
                 className: P,
                 style: {
-                    background: `url(${o}) no-repeat`,
+                    backgroundImage: `url(${o})`,
+                    backgroundRepeat: "no-repeat",
                     backgroundSize: l === "fit" ? "contain" : "cover",
                     backgroundPosition: l === "fit" ? "bottom right" : `center ${l === "fill-center" ? "center" : "right"}`
                 }
@@ -160,16 +161,16 @@ const V = /*#__PURE__*/ u.forwardRef((e, i)=>{
         className: s,
         children: n
     }) : n;
-}), F = /*#__PURE__*/ u.forwardRef((_param, a)=>{
+}), F = /*#__PURE__*/ g.forwardRef((_param, a)=>{
     var { "aria-label": e  } = _param, i = _objectWithoutProperties(_param, [
         "aria-label"
     ]);
     const r = e != null ? e : i.title;
-    return /* @__PURE__ */ t(C, {
+    return /* @__PURE__ */ t(I, {
         onClose: i.onClose,
         "aria-label": r,
         width: i.width,
-        children: /* @__PURE__ */ t(V, _objectSpreadProps(_objectSpread({}, i), {
+        children: /* @__PURE__ */ t(R, _objectSpreadProps(_objectSpread({}, i), {
             "aria-label": r,
             ref: a
         }))