@telefonica/mistica 14.37.0 → 14.39.0

package/dist/carousel.js

@@ -151,19 +151,22 @@ const ie = (e, r)=>{
     return (0, _hooks.useIsInViewport)(r, !1) && t && !!e;
 }, ae = (param)=>{
     let { currentIndex: e, numPages: r, onPress: t } = param;
-    const o = (0, _themevariantcontext.useIsInverseVariant)(), { isDesktopOrBigger: f } = (0, _hooks.useScreenSize)(), m = (v)=>{
-        const d = v === e;
-        return o ? d ? _carouselcssmistica.bulletActiveInverse : _carouselcssmistica.bulletInverse : d ? _carouselcssmistica.bulletActive : _carouselcssmistica.bullet;
+    const o = (0, _themevariantcontext.useIsInverseVariant)(), { isDesktopOrBigger: h } = (0, _hooks.useScreenSize)(), m = (b)=>{
+        const f = b === e;
+        return o ? f ? _carouselcssmistica.bulletActiveInverse : _carouselcssmistica.bulletInverse : f ? _carouselcssmistica.bulletActive : _carouselcssmistica.bullet;
     };
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(_inline.default, {
-        space: f ? 16 : 8,
+        space: {
+            mobile: 8,
+            desktop: 16
+        },
         alignItems: "center",
         dataAttributes: {
             "component-name": "PageBullets"
         },
         children: Array.from({
             length: r
-        }, (v, d)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
+        }, (b, f)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                 className: (0, _sprinklescssmistica.sprinkles)({
                     display: "block",
                     padding: 0,
@@ -171,11 +174,11 @@ const ie = (e, r)=>{
                     background: "transparent"
                 }),
                 maybe: !0,
-                onPress: f && t ? ()=>t(d) : void 0,
+                onPress: h && t ? ()=>t(f) : void 0,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                    className: m(d)
+                    className: m(f)
                 })
-            }, d))
+            }, f))
     });
 }, Z = (e, r, t)=>t ? typeof t == "number" ? t : t[e] || r[e] : r[e], Xe = (e, r)=>{
     const t = {
@@ -202,7 +205,7 @@ const ie = (e, r)=>{
 }, ee = (e, r)=>{
     if (e.length === 0) return [];
     const t = Math.ceil(e.length / r), o = [];
-    for(let f = 0; f < e.length; f += t)o.push(e[f]);
+    for(let h = 0; h < e.length; h += t)o.push(e[h]);
     return o[o.length - 1] = e[e.length - t], o;
 }, Ze = (e, r)=>{
     const t = [];
@@ -210,14 +213,14 @@ const ie = (e, r)=>{
     for(let o = t.length - 1; o >= 0; o--)if (e - t[o] >= -1) return o;
     return 0;
 }, ue = 5e3, fe = (param)=>{
-    let { items: e, itemStyle: r, itemClassName: t, withBullets: o, renderBullets: f, initialActiveItem: m, itemsPerPage: v, itemsToScroll: d, mobilePageOffset: p, gap: N, free: R, centered: A, autoplay: b, onPageChange: P, dataAttributes: F } = param;
-    const { texts: T, platformOverrides: x, skinName: y } = (0, _hooks.useTheme)(), c = (0, _desktopcontainertypecontext.useDesktopContainerType)(), i = Xe(c || "large", v), { isDesktopOrBigger: w, isTablet: C } = (0, _hooks.useScreenSize)(), U = C ? i.tablet : i.mobile, I = Math.max(Math.floor(w ? i.desktop : U), 1), g = _react.useRef(null), S = Math.ceil(e.length / I), [{ scrollLeft: G, scrollRight: q }, he] = _react.useState({
+    let { items: e, itemStyle: r, itemClassName: t, withBullets: o, renderBullets: h, initialActiveItem: m, itemsPerPage: b, itemsToScroll: f, mobilePageOffset: p, gap: N, free: R, centered: A, autoplay: v, onPageChange: P, dataAttributes: F } = param;
+    const { texts: T, platformOverrides: x, skinName: y } = (0, _hooks.useTheme)(), c = (0, _desktopcontainertypecontext.useDesktopContainerType)(), i = Xe(c || "large", b), { isDesktopOrBigger: w, isTablet: C } = (0, _hooks.useScreenSize)(), U = C ? i.tablet : i.mobile, I = Math.max(Math.floor(w ? i.desktop : U), 1), g = _react.useRef(null), S = Math.ceil(e.length / I), [{ scrollLeft: G, scrollRight: q }, he] = _react.useState({
         scrollLeft: 0,
         scrollRight: 0
     }), [K, me] = _react.useState([]), W = _react.useMemo(()=>ee(K, S), [
         K,
         S
-    ]), O = d ? ee(K, Math.ceil(e.length / d)) : W, pe = q !== 0, ge = G !== 0;
+    ]), O = f ? ee(K, Math.ceil(e.length / f)) : W, pe = q !== 0, ge = G !== 0;
     _react.useEffect(()=>{
         if (g.current) {
             const l = g.current, a = ()=>{
@@ -235,11 +238,11 @@ const ie = (e, r)=>{
                 }));
             };
             a(), u(), l.addEventListener("scroll", a);
-            const h = (0, _dom.listenResize)(l, ()=>{
+            const d = (0, _dom.listenResize)(l, ()=>{
                 a(), u();
             });
             return ()=>{
-                l.removeEventListener("scroll", a), h();
+                l.removeEventListener("scroll", a), d();
             };
         }
         return ()=>{};
@@ -257,20 +260,20 @@ const ie = (e, r)=>{
         let a = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0;
         const u = g.current;
         if (u) {
-            const h = W[l];
+            const d = W[l];
             u.scrollTo({
-                left: h,
+                left: d,
                 behavior: a ? "smooth" : "auto"
             });
         }
     }, [
         W
-    ]), ve = _react.useCallback(()=>{
+    ]), be = _react.useCallback(()=>{
         const l = g.current;
         if (l) {
             const { scrollLeft: a } = l, u = [
                 ...O
-            ].reverse().find((h)=>h - a < -1);
+            ].reverse().find((d)=>d - a < -1);
             l.scrollTo({
                 left: u,
                 behavior: "smooth"
@@ -281,7 +284,7 @@ const ie = (e, r)=>{
     ]), Y = _react.useCallback(()=>{
         const l = g.current;
         if (l) {
-            const { scrollLeft: a } = l, u = O.find((h)=>h - a > 1);
+            const { scrollLeft: a } = l, u = O.find((d)=>d - a > 1);
             l.scrollTo({
                 left: u,
                 behavior: "smooth"
@@ -289,7 +292,7 @@ const ie = (e, r)=>{
         }
     }, [
         O
-    ]), H = ie(!!b, g);
+    ]), H = ie(!!v, g);
     _react.useEffect(()=>{
         m !== void 0 && D(Math.floor(m / I), !1);
     }, [
@@ -297,10 +300,10 @@ const ie = (e, r)=>{
         D,
         I
     ]), _react.useEffect(()=>{
-        if (H && b) {
-            const l = typeof b == "boolean" ? ue : b.time, a = typeof b == "object" && b.loop, u = setInterval(()=>{
-                var h;
-                q !== 0 ? Y() : a && ((h = g.current) == null || h.scrollTo({
+        if (H && v) {
+            const l = typeof v == "boolean" ? ue : v.time, a = typeof v == "object" && v.loop, u = setInterval(()=>{
+                var d;
+                q !== 0 ? Y() : a && ((d = g.current) == null || d.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
@@ -308,7 +311,7 @@ const ie = (e, r)=>{
             return ()=>clearInterval(u);
         }
     }, [
-        b,
+        v,
         Y,
         q,
         H
@@ -318,8 +321,8 @@ const ie = (e, r)=>{
         if (P) {
             const l = Math.min((k + 1) * I - 1, e.length - 1), a = [];
             for(let u = 0; u < I; u++){
-                const h = l - u;
-                h >= 0 && a.unshift(h);
+                const d = l - u;
+                d >= 0 && a.unshift(d);
             }
             J.current ? Q.current !== k && P({
                 pageIndex: k,
@@ -334,7 +337,7 @@ const ie = (e, r)=>{
         P
     ]);
     let V = null;
-    f ? V = f({
+    h ? V = h({
         numPages: S,
         currentIndex: k,
         onPress: D
@@ -343,7 +346,7 @@ const ie = (e, r)=>{
         currentIndex: k,
         onPress: D
     }));
-    const be = "64px", Ie = "36px";
+    const ve = "64px", Ie = "36px";
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
         space: 24,
         dataAttributes: _object_spread({
@@ -358,7 +361,7 @@ const ie = (e, r)=>{
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                             className: _carouselcssmistica.carouselPrevArrowButton,
                             "aria-label": T.carouselPrevButton,
-                            onPress: ve,
+                            onPress: be,
                             disabled: !ge,
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronleftregular.default, {})
                         })
@@ -373,7 +376,7 @@ const ie = (e, r)=>{
                             [_carouselcssmistica.vars.itemsPerPageTablet]: String(i.tablet),
                             [_carouselcssmistica.vars.itemsPerPageMobile]: String(i.mobile)
                         }, p === "large" ? {
-                            [_carouselcssmistica.vars.mobilePageOffset]: be
+                            [_carouselcssmistica.vars.mobilePageOffset]: ve
                         } : y === _constants.VIVO_NEW_SKIN ? {
                             [_carouselcssmistica.vars.mobilePageOffset]: Ie
                         } : {}, N !== void 0 ? {
@@ -416,7 +419,7 @@ const ie = (e, r)=>{
         ]
     });
 }, It = (e)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(fe, _object_spread({}, e)), Pt = (param)=>/* @__PURE__ */ {
-    let { items: e, itemStyle: r, itemClassName: t, withBullets: o, renderBullets: f, initialActiveItem: m, onPageChange: v, dataAttributes: d } = param;
+    let { items: e, itemStyle: r, itemClassName: t, withBullets: o, renderBullets: h, initialActiveItem: m, onPageChange: b, dataAttributes: f } = param;
     return (0, _jsxruntime.jsx)(fe, {
         items: e,
         itemStyle: r,
@@ -430,10 +433,10 @@ const ie = (e, r)=>{
         itemsToScroll: 1,
         gap: 0,
         withBullets: o,
-        renderBullets: f,
+        renderBullets: h,
         initialActiveItem: m,
-        onPageChange: v,
-        dataAttributes: d
+        onPageChange: b,
+        dataAttributes: f
     });
 }, de = /*#__PURE__*/ _react.createContext(!1), xt = ()=>_react.useContext(de), et = (param)=>/* @__PURE__ */ {
     let { children: e } = param;
@@ -442,11 +445,11 @@ const ie = (e, r)=>{
         children: e
     });
 }, wt = (param)=>{
-    let { items: e, withBullets: r, autoplay: t, onPageChange: o, dataAttributes: f, inverseBullets: m = !0 } = param;
-    const { texts: v, platformOverrides: d } = (0, _hooks.useTheme)(), p = _react.useRef(null), [{ scrollLeft: N, scrollRight: R }, A] = _react.useState({
+    let { items: e, withBullets: r, autoplay: t, onPageChange: o, dataAttributes: h, inverseBullets: m = !0 } = param;
+    const { texts: b, platformOverrides: f } = (0, _hooks.useTheme)(), p = _react.useRef(null), [{ scrollLeft: N, scrollRight: R }, A] = _react.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), b = _react.useCallback(()=>{
+    }), v = _react.useCallback(()=>{
         const c = p.current;
         c && c.scrollBy({
             left: -c.clientWidth,
@@ -503,14 +506,14 @@ const ie = (e, r)=>{
     ]), /* @__PURE__ */ (0, _jsxruntime.jsx)(et, {
         children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({
             className: _carouselcssmistica.slideshowContainer
-        }, (0, _dom.getPrefixedDataAttributes)(f, "SlideShow")), {
+        }, (0, _dom.getPrefixedDataAttributes)(h, "SlideShow")), {
             children: [
                 /* @__PURE__ */ (0, _jsxruntime.jsx)(_themevariantcontext.ThemeVariant, {
                     isInverse: !1,
                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                         className: _carouselcssmistica.slideshowPrevArrowButton,
-                        "aria-label": v.carouselPrevButton,
-                        onPress: b,
+                        "aria-label": b.carouselPrevButton,
+                        onPress: v,
                         disabled: !T,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronleftregular.default, {})
                     })
@@ -525,7 +528,7 @@ const ie = (e, r)=>{
                         children: e.map((c, i)=>/* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                 className: _carouselcssmistica.slideshowItem,
                                 style: {
-                                    scrollSnapStop: (0, _platform.isAndroid)(d) ? "always" : "normal"
+                                    scrollSnapStop: (0, _platform.isAndroid)(f) ? "always" : "normal"
                                 },
                                 children: c
                             }, i))
@@ -535,7 +538,7 @@ const ie = (e, r)=>{
                     isInverse: !1,
                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
                         className: _carouselcssmistica.slideshowNextArrowButton,
-                        "aria-label": v.carouselNextButton,
+                        "aria-label": b.carouselNextButton,
                         onPress: P,
                         disabled: !F,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconchevronrightregular.default, {})

package/dist/chip.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return re;
+        return rt;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -80,8 +80,20 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const F = (e)=>{
-    const { Icon: c, children: P, id: k, dataAttributes: l, active: s, badge: r, onClose: d } = e, { texts: T, isDarkMode: A, textPresets: I } = (0, _hooks.useTheme)(), m = (0, _themevariantcontext.useThemeVariant)() === "alternative", { isTabletOrSmaller: a } = (0, _hooks.useScreenSize)(), f = c ? a ? 16 : 8 : a ? 20 : 12, R = a ? 20 : 12, b = a ? 16 : 8, w = ()=>r ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
+const $ = (t)=>{
+    const { Icon: c, children: C, id: x, dataAttributes: s, active: l, badge: r, onClose: d } = t, { texts: p, isDarkMode: P, textPresets: I } = (0, _hooks.useTheme)(), m = (0, _themevariantcontext.useThemeVariant)() === "alternative", u = c ? {
+        mobile: 16,
+        desktop: 8
+    } : {
+        mobile: 20,
+        desktop: 12
+    }, R = {
+        mobile: 20,
+        desktop: 12
+    }, v = {
+        mobile: 16,
+        desktop: 8
+    }, T = ()=>r ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
             children: r === !0 ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_badge.default, {}) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_badge.default, {
                 value: r
             })
@@ -89,7 +101,7 @@ const F = (e)=>{
         children: [
             c && /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                 paddingRight: 4,
-                className: s ? _chipcssmistica.iconActive : _chipcssmistica.icon,
+                className: l ? _chipcssmistica.iconActive : _chipcssmistica.icon,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(c, {
                     color: "currentColor",
                     size: (0, _css.pxToRem)(16)
@@ -98,30 +110,30 @@ const F = (e)=>{
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                 paddingRight: r ? 8 : d ? 4 : 0,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
-                    id: k,
+                    id: x,
                     weight: I.indicator.weight,
                     truncate: 1,
                     color: "currentColor",
-                    children: P
+                    children: C
                 })
             })
         ]
     });
     if (r) return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_box.default, _object_spread_props(_object_spread({
         className: m ? _chipcssmistica.chipVariants.overAlternative : _chipcssmistica.chipVariants.default,
-        paddingLeft: f,
-        paddingRight: b
-    }, (0, _dom.getPrefixedDataAttributes)(l, "Chip")), {
+        paddingLeft: u,
+        paddingRight: v
+    }, (0, _dom.getPrefixedDataAttributes)(s, "Chip")), {
         children: [
             h,
-            w()
+            T()
         ]
     }));
     if (d) return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_box.default, _object_spread_props(_object_spread({
         className: m ? _chipcssmistica.chipVariants.overAlternative : _chipcssmistica.chipVariants.default,
-        paddingLeft: f,
-        paddingRight: b
-    }, (0, _dom.getPrefixedDataAttributes)(l, "Chip")), {
+        paddingLeft: u,
+        paddingRight: v
+    }, (0, _dom.getPrefixedDataAttributes)(s, "Chip")), {
         children: [
             h,
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.default, {
@@ -131,7 +143,7 @@ const F = (e)=>{
                     justifyContent: "center",
                     alignItems: "center"
                 },
-                "aria-label": T.closeButtonLabel,
+                "aria-label": p.closeButtonLabel,
                 onPress: ()=>d(),
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconcloseregular.default, {
                     size: 16,
@@ -140,29 +152,34 @@ const F = (e)=>{
             })
         ]
     }));
-    const B = s !== void 0 || e.href || e.onPress || e.to, o = ()=>/* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, _object_spread_props(_object_spread({
-            className: (0, _classnames.default)(_chipcssmistica.chipVariants[s ? "active" : m ? "overAlternative" : "default"], {
-                [_chipcssmistica.chipInteractiveVariants[A ? "dark" : "light"]]: B
+    const w = l !== void 0 || t.href || t.onPress || t.to, a = _object_spread({
+        "component-name": "Chip"
+    }, s), o = (B)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
+            className: (0, _classnames.default)(_chipcssmistica.chipVariants[l ? "active" : m ? "overAlternative" : "default"], {
+                [_chipcssmistica.chipInteractiveVariants[P ? "dark" : "light"]]: w
             }),
-            paddingLeft: f,
-            paddingRight: R
-        }, (0, _dom.getPrefixedDataAttributes)(l, "Chip")), {
+            paddingLeft: u,
+            paddingRight: R,
+            dataAttributes: B,
             children: h
-        }));
-    return e.onPress ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
+        });
+    return t.onPress ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
         className: _chipcssmistica.button,
-        trackingEvent: e.trackingEvent,
-        onPress: e.onPress,
+        trackingEvent: t.trackingEvent,
+        onPress: t.onPress,
+        dataAttributes: a,
         children: o()
-    }) : e.to ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
-        trackingEvent: e.trackingEvent,
-        to: e.to,
-        fullPageOnWebView: e.fullPageOnWebView,
+    }) : t.to ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
+        trackingEvent: t.trackingEvent,
+        to: t.to,
+        fullPageOnWebView: t.fullPageOnWebView,
+        dataAttributes: a,
         children: o()
-    }) : e.href ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
-        trackingEvent: e.trackingEvent,
-        href: e.href,
-        newTab: e.newTab,
+    }) : t.href ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.BaseTouchable, {
+        trackingEvent: t.trackingEvent,
+        href: t.href,
+        newTab: t.newTab,
+        dataAttributes: a,
         children: o()
-    }) : o();
-}, re = F;
+    }) : o(a);
+}, rt = $;

package/dist/empty-state-card.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return V;
+        return O;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -23,29 +23,35 @@ function _interop_require_default(obj) {
         default: obj
     };
 }
-const z = (param)=>{
-    let { title: n, description: h, button: r, secondaryButton: i, buttonLink: t, icon: o, imageUrl: a, "aria-label": f, dataAttributes: x } = param;
-    var s;
-    const { isTabletOrSmaller: l } = (0, _hooks.useScreenSize)(), { textPresets: S } = (0, _hooks.useTheme)();
+const T = (param)=>{
+    let { title: d, description: n, button: r, secondaryButton: i, buttonLink: o, icon: t, imageUrl: a, "aria-label": h, dataAttributes: f } = param;
+    var l;
+    const { textPresets: x } = (0, _hooks.useTheme)();
     let m;
     return a && (m = /* @__PURE__ */ (0, _jsxruntime.jsx)("img", {
         className: _emptystatecardcssmistica.image,
         alt: "",
         src: a
-    })), process.env.NODE_ENV !== "production" && r && !((s = r == null ? void 0 : r.props) != null && s.small) && console.error("button property in EmptyStateCard must be a a small Button. Set small prop to true"), /* @__PURE__ */ (0, _jsxruntime.jsx)(_boxed.Boxed, {
-        dataAttributes: x,
+    })), process.env.NODE_ENV !== "production" && r && !((l = r == null ? void 0 : r.props) != null && l.small) && console.error("button property in EmptyStateCard must be a a small Button. Set small prop to true"), /* @__PURE__ */ (0, _jsxruntime.jsx)(_boxed.Boxed, {
+        dataAttributes: f,
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
-            paddingY: l ? 24 : 40,
-            paddingX: l ? 16 : 40,
+            paddingY: {
+                mobile: 24,
+                desktop: 40
+            },
+            paddingX: {
+                mobile: 16,
+                desktop: 40
+            },
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)("section", {
                 className: _emptystatecardcssmistica.container,
-                "aria-label": f,
+                "aria-label": h,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
                     space: 16,
                     children: [
-                        m !== null && m !== void 0 ? m : o && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                        m !== null && m !== void 0 ? m : t && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                             className: _emptystatecardcssmistica.iconContainer,
-                            children: o
+                            children: t
                         }),
                         /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                             children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
@@ -56,25 +62,25 @@ const z = (param)=>{
                                         mobileLineHeight: "24px",
                                         desktopSize: 20,
                                         desktopLineHeight: "28px",
-                                        weight: S.cardTitle.weight,
-                                        children: n
+                                        weight: x.cardTitle.weight,
+                                        children: d
                                     }),
                                     /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
                                         regular: !0,
                                         color: _skincontractcssmistica.vars.colors.textSecondary,
-                                        children: h
+                                        children: n
                                     })
                                 ]
                             })
                         }),
-                        (r || i || t) && /* @__PURE__ */ (0, _jsxruntime.jsx)(_buttongroup.default, {
+                        (r || i || o) && /* @__PURE__ */ (0, _jsxruntime.jsx)(_buttongroup.default, {
                             primaryButton: r,
                             secondaryButton: i,
-                            link: t
+                            link: o
                         })
                     ]
                 })
             })
         })
     });
-}, V = z;
+}, O = T;

package/dist/image.css-mistica.js

@@ -10,17 +10,20 @@ function _export(target, all) {
 }
 _export(exports, {
     FADE_IN_DURATION_MS: function() {
-        return r;
+        return _;
     },
     image: function() {
-        return n;
+        return a;
+    },
+    imageWithBorder: function() {
+        return i;
     },
     vars: function() {
-        return f;
+        return n;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./image.css.ts.vanilla.css-mistica.js");
-var r = 300, n = "_17tt25r2 _1y2v1nfjn _1y2v1nfk2 _1y2v1nfgi _1y2v1nfh3 _1y2v1nfhk _1y2v1nflb _1y2v1nfiv _1y2v1nfiw _1y2v1nfj7", f = {
+var _ = 300, a = "_17tt25r3 _1y2v1nfjn _1y2v1nfk2 _1y2v1nfgi _1y2v1nfh3 _1y2v1nfhk _1y2v1nflb _1y2v1nfiv _1y2v1nfiw _1y2v1nfj7", i = "_17tt25r1", n = {
     mediaBorderRadius: "var(--_17tt25r0)"
 };

package/dist/image.css.d.ts

@@ -2,5 +2,6 @@ export declare const FADE_IN_DURATION_MS = 300;
 export declare const vars: {
     mediaBorderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 };
+export declare const imageWithBorder: string;
 export declare const image: string;
 export declare const noBorder: string;