@telefonica/mistica 15.3.0 → 15.5.0

package/dist-es/hero.js

@@ -79,37 +79,43 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 import { jsx as r, jsxs as p } from "react/jsx-runtime";
-import * as T from "react";
-import u from "classnames";
+import * as $ from "react";
+import h from "classnames";
 import { useScreenSize as j } from "./hooks.js";
-import { Text3 as b, Text8 as G } from "./text.js";
-import $ from "./grid-layout.js";
+import { Text3 as g, Text8 as G } from "./text.js";
+import A from "./grid-layout.js";
 import m from "./box.js";
-import N from "./stack.js";
-import A from "./button-group.js";
+import R from "./stack.js";
+import E from "./button-group.js";
 import { vars as i } from "./skins/skin-contract.css-mistica.js";
-import { container as v, containerMobile as V, containerMinHeight as C, mediaContainer as z, layout as y, containerDesktop as B, actions as E, vars as R } from "./hero.css-mistica.js";
-import { vars as S } from "./image.css-mistica.js";
-import { useIsInsideSlideshowContext as K } from "./carousel.js";
-import { getPrefixedDataAttributes as k } from "./utils/dom.js";
-import { sprinkles as w } from "./sprinkles.css-mistica.js";
+import { container as v, containerMobile as V, containerMinHeight as C, expandedContent as _, layout as B, vars as H, containerDesktop as S, actions as z } from "./hero.css-mistica.js";
+import { vars as y } from "./image.css-mistica.js";
+import { useSlideshowContext as K } from "./carousel.js";
+import { getPrefixedDataAttributes as T } from "./utils/dom.js";
+import { sprinkles as O } from "./sprinkles.css-mistica.js";
 import { useIsInverseVariant as M } from "./theme-variant-context.js";
-import { applyCssVars as h } from "./utils/css.js";
-import { InternalResponsiveLayout as U } from "./responsive-layout.js";
-const H = (param)=>{
-    let { children: o, isInverse: e, isInsideSlideShow: a } = param;
-    return /* @__PURE__ */ r(U, {
-        isInverse: e,
-        className: y,
-        innerDivClassName: y,
-        shouldExpandWhenNested: a ? "desktop" : !0,
-        backgroundColor: "transparent",
-        children: o
+import { applyCssVars as x } from "./utils/css.js";
+import { ResetResponsiveLayout as U, InternalResponsiveLayout as W } from "./responsive-layout.js";
+const k = {
+    default: i.colors.background,
+    alternative: i.colors.backgroundAlternative,
+    brand: i.colors.backgroundBrand,
+    "brand-secondary": i.colors.backgroundBrandSecondary,
+    none: "transparent"
+}, w = (param)=>{
+    let { children: e, isInverse: o, backgroundColor: a } = param;
+    return /* @__PURE__ */ r(W, {
+        isInverse: o,
+        className: B,
+        innerDivClassName: B,
+        shouldExpandWhenNested: !0,
+        backgroundColor: a !== null && a !== void 0 ? a : "transparent",
+        children: e
     });
-}, g = (param)=>{
-    let { headline: o, title: e, titleAs: a = "h1", pretitle: s, description: l, descriptionLinesMax: n, extra: t, button: c, secondaryButton: f, buttonLink: d } = param;
+}, b = (param)=>{
+    let { headline: e, title: o, titleAs: a = "h1", pretitle: l, description: c, descriptionLinesMax: t, extra: n, button: d, secondaryButton: f, buttonLink: s } = param;
     return /* @__PURE__ */ p("section", {
-        className: w({
+        className: O({
             height: "100%",
             display: "flex",
             justifyContent: "space-between",
@@ -118,56 +124,50 @@ const H = (param)=>{
         children: [
             /* @__PURE__ */ p("div", {
                 children: [
-                    /* @__PURE__ */ p(N, {
+                    /* @__PURE__ */ p(R, {
                         space: 16,
                         children: [
-                            o && o,
-                            /* @__PURE__ */ p(N, {
+                            e && e,
+                            /* @__PURE__ */ p(R, {
                                 space: 8,
                                 children: [
-                                    s && /* @__PURE__ */ r(b, {
+                                    l && /* @__PURE__ */ r(g, {
                                         as: "p",
                                         regular: !0,
-                                        children: s
+                                        children: l
                                     }),
-                                    e && /* @__PURE__ */ r(G, {
+                                    o && /* @__PURE__ */ r(G, {
                                         as: a,
-                                        children: e
+                                        children: o
                                     })
                                 ]
                             }),
-                            l && /* @__PURE__ */ r(b, {
+                            c && /* @__PURE__ */ r(g, {
                                 as: "p",
                                 regular: !0,
                                 color: i.colors.textSecondary,
-                                truncate: n,
-                                children: l
+                                truncate: t,
+                                children: c
                             })
                         ]
                     }),
-                    t && /* @__PURE__ */ r("div", {
-                        children: t
+                    n && /* @__PURE__ */ r("div", {
+                        children: n
                     })
                 ]
             }),
-            (c || d) && /* @__PURE__ */ r("div", {
-                className: E,
-                children: /* @__PURE__ */ r(A, {
-                    primaryButton: c,
+            (d || s) && /* @__PURE__ */ r("div", {
+                className: z,
+                children: /* @__PURE__ */ r(E, {
+                    primaryButton: d,
                     secondaryButton: f,
-                    link: d
+                    link: s
                 })
             })
         ]
     });
-}, I = {
-    default: i.colors.background,
-    alternative: i.colors.backgroundAlternative,
-    brand: i.colors.backgroundBrand,
-    "brand-secondary": i.colors.backgroundBrandSecondary,
-    none: "transparent"
-}, W = /*#__PURE__*/ T.forwardRef((_param, c)=>{
-    var { height: o, background: e = "default", media: a, desktopMediaPosition: s = "left", dataAttributes: l, noPaddingY: n } = _param, t = _object_without_properties(_param, [
+}, q = /*#__PURE__*/ $.forwardRef((_param, d)=>{
+    var { height: e, background: o = "default", media: a, desktopMediaPosition: l = "left", dataAttributes: c, noPaddingY: t } = _param, n = _object_without_properties(_param, [
         "height",
         "background",
         "media",
@@ -175,87 +175,86 @@ const H = (param)=>{
         "dataAttributes",
         "noPaddingY"
     ]);
-    const { isTabletOrSmaller: f } = j(), d = K(), D = M(), x = e === "none" ? D : e === "brand" || e === "brand-secondary";
-    if (f) return /* @__PURE__ */ r("div", {
-        style: h({
-            [S.mediaBorderRadius]: "0px"
-        }),
-        children: /* @__PURE__ */ r("div", _object_spread_props(_object_spread({}, k(_object_spread({
-            "component-name": "Hero"
-        }, l))), {
-            ref: c,
-            style: _object_spread({
-                backgroundColor: I[e]
-            }, o === "100vh" ? {
-                maxHeight: "-webkit-fill-available"
-            } : {}, h({
-                [R.height]: o !== null && o !== void 0 ? o : "100%"
-            })),
-            className: u(v, V, {
-                [C]: !n
+    const { isTabletOrSmaller: f } = j(), s = K(), u = !!(s != null && s.withBullets), D = M(), N = o === "none" ? D : o === "brand" || o === "brand-secondary";
+    if (f) return /* @__PURE__ */ r(U, {
+        children: /* @__PURE__ */ r("div", {
+            style: x({
+                [y.mediaBorderRadius]: "0px"
             }),
-            children: /* @__PURE__ */ p(H, {
-                isInverse: x,
-                isInsideSlideShow: d,
+            children: /* @__PURE__ */ p("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({
+                    [H.height]: typeof e == "number" ? `${e}px` : e !== null && e !== void 0 ? e : "100%",
+                    [y.mediaBorderRadius]: "0px"
+                })),
+                className: h(v, V, {
+                    [C]: !t
+                }),
                 children: [
-                    /* @__PURE__ */ r("div", {
-                        className: z,
-                        children: a
-                    }),
-                    /* @__PURE__ */ r(m, {
-                        paddingTop: 24,
-                        paddingBottom: d ? 48 : n ? 0 : 24,
-                        className: y,
-                        children: /* @__PURE__ */ r(g, _object_spread({}, t))
+                    a,
+                    /* @__PURE__ */ r(w, {
+                        isInverse: N,
+                        backgroundColor: k[o],
+                        children: /* @__PURE__ */ r("div", {
+                            className: _,
+                            children: /* @__PURE__ */ r(m, {
+                                paddingTop: 24,
+                                paddingBottom: u ? 48 : t ? 0 : 24,
+                                className: B,
+                                children: /* @__PURE__ */ r(b, _object_spread({}, n))
+                            })
+                        })
                     })
                 ]
-            })
-        }))
+            }))
+        })
     });
-    const O = s === "left" ? a : /* @__PURE__ */ r(m, {
+    const I = l === "left" ? a : /* @__PURE__ */ r(m, {
         paddingRight: 24,
-        children: /* @__PURE__ */ r(g, _object_spread({}, t))
-    }), L = s === "right" ? a : /* @__PURE__ */ r(m, {
+        children: /* @__PURE__ */ r(b, _object_spread({}, n))
+    }), L = l === "right" ? a : /* @__PURE__ */ r(m, {
         paddingLeft: 24,
-        children: /* @__PURE__ */ r(g, _object_spread({}, t))
+        children: /* @__PURE__ */ r(b, _object_spread({}, n))
     });
-    return /* @__PURE__ */ r("div", {
-        style: h({
-            [S.mediaBorderRadius]: i.borderRadii.container
+    return /* @__PURE__ */ r("div", _object_spread_props(_object_spread({}, T(_object_spread({
+        "component-name": "Hero"
+    }, c))), {
+        ref: d,
+        style: _object_spread_props(_object_spread({}, e === "100vh" ? {
+            maxHeight: "-webkit-fill-available"
+        } : {}, x({
+            [H.height]: typeof e == "number" ? `${e}px` : e !== null && e !== void 0 ? e : "100%",
+            [y.mediaBorderRadius]: i.borderRadii.container
+        })), {
+            background: k[o]
         }),
-        children: /* @__PURE__ */ r("div", _object_spread_props(_object_spread({}, k(_object_spread({
-            "component-name": "Hero"
-        }, l))), {
-            ref: c,
-            style: _object_spread({
-                backgroundColor: I[e]
-            }, o === "100vh" ? {
-                maxHeight: "-webkit-fill-available"
-            } : {}, h({
-                [R.height]: o !== null && o !== void 0 ? o : "100%"
-            })),
-            className: w({
-                height: "100%"
-            }),
-            children: /* @__PURE__ */ r(H, {
-                isInverse: x,
-                children: /* @__PURE__ */ r($, {
-                    template: "6+6",
-                    left: /* @__PURE__ */ r(m, {
-                        paddingY: n ? 0 : 56,
-                        className: u(v, B, {
-                            [C]: !n
-                        }),
-                        children: O
+        className: O({
+            height: "100%"
+        }),
+        children: /* @__PURE__ */ r(w, {
+            isInverse: N,
+            children: /* @__PURE__ */ r(A, {
+                template: "6+6",
+                left: /* @__PURE__ */ r(m, {
+                    paddingTop: t ? 0 : 56,
+                    paddingBottom: t && !u ? 0 : 56,
+                    className: h(v, S, {
+                        [C]: !t
                     }),
-                    right: /* @__PURE__ */ r(m, {
-                        paddingY: n ? 0 : 56,
-                        className: u(v, B),
-                        children: L
-                    })
+                    children: I
+                }),
+                right: /* @__PURE__ */ r(m, {
+                    paddingTop: t ? 0 : 56,
+                    paddingBottom: t && !u ? 0 : 56,
+                    className: h(v, S),
+                    children: L
                 })
             })
-        }))
-    });
-}), lr = W;
-export { lr as default };
+        })
+    }));
+}), dr = q;
+export { dr as default };

package/dist-es/highlighted-card.css-mistica.js

@@ -1,7 +1,7 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./highlighted-card.css.ts.vanilla.css-mistica.js";
-var f = "wrb8722 _1y2v1nfha _1y2v1nfhf _1y2v1nfhm _1y2v1nfhs", y = "wrb8725 _1y2v1nfha", _ = {
-    withImage: "wrb8728 wrb8727 _1y2v1nfha _1y2v1nfhg _1y2v1nfho _1y2v1nf7o _1y2v1nf8x _1y2v1nfa0",
-    withoutImage: "wrb8729 wrb8727 _1y2v1nfha _1y2v1nfhg _1y2v1nfho _1y2v1nf7o _1y2v1nf8x _1y2v1nfa0"
-}, a = "_1y2v1nf73 _1y2v1nf8c _1y2v1nf9l _1y2v1nfau _1y2v1nfha _1y2v1nfhs _1y2v1nfjs _1y2v1nfhx _1y2v1nf72";
-export { f as container, y as imageContent, _ as textContainerVariant, a as touchableContainer };
+var y = "wrb8722 _1y2v1nfhk _1y2v1nfhp _1y2v1nfhw _1y2v1nfi2", f = "wrb8725 _1y2v1nfhk", _ = {
+    withImage: "wrb8728 wrb8727 _1y2v1nfhk _1y2v1nfhq _1y2v1nfhy _1y2v1nf7y _1y2v1nf97 _1y2v1nfaa",
+    withoutImage: "wrb8729 wrb8727 _1y2v1nfhk _1y2v1nfhq _1y2v1nfhy _1y2v1nf7y _1y2v1nf97 _1y2v1nfaa"
+}, a = "_1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfhk _1y2v1nfi2 _1y2v1nfk2 _1y2v1nfi7 _1y2v1nf7c";
+export { y as container, f as imageContent, _ as textContainerVariant, a as touchableContainer };

package/dist-es/hooks.js

@@ -1,30 +1,30 @@
 import * as r from "react";
-import S from "./theme-context.js";
-import b from "./screen-size-context.js";
-import y from "./aria-id-getter-context.js";
-import { listenResize as W } from "./utils/dom.js";
+import b from "./theme-context.js";
+import y from "./screen-size-context.js";
+import W from "./aria-id-getter-context.js";
+import { listenResize as x } from "./utils/dom.js";
 import { isClientSide as h } from "./utils/environment.js";
-import { isEqual as v } from "./utils/helpers.js";
-const x = ()=>{
-    const t = r.useContext(S);
+import { isEqual as E } from "./utils/helpers.js";
+const H = ()=>{
+    const t = r.useContext(b);
     if (!t) throw Error("To use @telefonica/mistica components you must instantiate <ThemeContextProvider> as their parent.");
     return t;
 };
-let l = "", w = 0, a = 0;
-const A = (t)=>{
+let a = "", m = 0, w = 0;
+const L = (t)=>{
     r.useEffect(()=>{
         if (t) {
             const n = document.scrollingElement || document.documentElement, e = ()=>{
                 var i;
                 var _ref, _ref1;
-                if (a++, !(a > 1) && (w = (_ref = n == null ? void 0 : n.scrollTop) !== null && _ref !== void 0 ? _ref : 0, l = (_ref1 = (i = document.body) == null ? void 0 : i.style.cssText) !== null && _ref1 !== void 0 ? _ref1 : "", document.body)) {
+                if (w++, !(w > 1) && (m = (_ref = n == null ? void 0 : n.scrollTop) !== null && _ref !== void 0 ? _ref : 0, a = (_ref1 = (i = document.body) == null ? void 0 : i.style.cssText) !== null && _ref1 !== void 0 ? _ref1 : "", document.body)) {
                     var _ref2;
                     const o = window.innerWidth > ((_ref2 = n == null ? void 0 : n.clientWidth) !== null && _ref2 !== void 0 ? _ref2 : window.innerWidth) ? "scroll" : "hidden";
-                    document.body.style.cssText = l + (l.endsWith(";") ? "" : ";") + [
+                    document.body.style.cssText = a + (a.endsWith(";") ? "" : ";") + [
                         "overflow: hidden;",
                         `overflow-y: ${o};`,
                         "position: fixed;",
-                        `top: ${-w}px;`,
+                        `top: ${-m}px;`,
                         "left: 0px;",
                         "right: 0px;",
                         "bottom: 0px;",
@@ -32,7 +32,7 @@ const A = (t)=>{
                     ].join("");
                 }
             }, s = ()=>{
-                a--, !(a > 0) && (document.body && (document.body.style.cssText = l), n && (n.scrollTop = w));
+                w--, !(w > 0) && (document.body && (document.body.style.cssText = a), n && (n.scrollTop = m));
             };
             return e(), s;
         }
@@ -40,14 +40,14 @@ const A = (t)=>{
     }, [
         t
     ]);
-}, L = ()=>r.useContext(b), M = ()=>{
+}, M = ()=>r.useContext(y), q = ()=>{
     const [t, n] = r.useState(0), [e, s] = r.useState(0), [i, c] = r.useState(null), o = r.useCallback((d)=>{
         if (!d) {
             n(0), s(0);
             return;
         }
-        const { width: m, height: g } = d[0].contentRect;
-        n(m), s(g);
+        const { width: f, height: l } = d[0].contentRect;
+        n(f), s(l);
     }, []), u = r.useCallback((d)=>{
         c(d);
     }, []);
@@ -56,7 +56,7 @@ const A = (t)=>{
             n(0), s(0);
             return;
         }
-        return W(i, o);
+        return x(i, o);
     }, [
         i,
         o
@@ -65,45 +65,46 @@ const A = (t)=>{
         height: e,
         ref: u
     };
-}, q = (t)=>{
-    const { useId: n } = x();
+}, D = (t)=>{
+    const { useId: n } = H();
     if (n) {
         const e = n();
         return t || e;
     } else {
-        const e = r.useContext(y);
+        const e = r.useContext(W);
         return r.useRef(t || e()).current;
     }
-}, f = ()=>{
-    const [t, n] = r.useState(h() ? window.innerHeight : 1200), [e, s] = r.useState(h() ? window.innerWidth : 800), [i, c] = r.useState(h() ? window.screen.availHeight : 1200), [o, u] = r.useState(h() ? window.screen.availWidth : 800);
+}, v = ()=>{
+    var l;
+    const [t, n] = r.useState(h() ? window.innerHeight : 1200), [e, s] = r.useState(h() ? window.innerWidth : 800), [i, c] = r.useState(h() ? window.screen.availHeight : 1200), [o, u] = r.useState(h() ? window.screen.availWidth : 800), [d, f] = r.useState(h() ? ((l = window.visualViewport) == null ? void 0 : l.height) || window.screen.availHeight : 1200);
     return r.useEffect(()=>{
-        const d = ()=>{
-            n(window.innerHeight), s(window.innerWidth), c(window.screen.availHeight), u(window.screen.availWidth);
+        const g = ()=>{
+            var S;
+            n(window.innerHeight), s(window.innerWidth), c(window.screen.availHeight), u(window.screen.availWidth), f(((S = window.visualViewport) == null ? void 0 : S.height) || window.screen.availHeight);
         };
-        return window.addEventListener("resize", d), ()=>{
-            window.removeEventListener("resize", d);
+        return window.addEventListener("resize", g), ()=>{
+            window.removeEventListener("resize", g);
         };
     }, []), r.useMemo(()=>({
             height: t,
             width: e,
             screenHeight: i,
-            screenWidth: o
+            screenWidth: o,
+            visualHeight: d
         }), [
         t,
         e,
         i,
-        o
+        o,
+        d
     ]);
-}, D = ()=>{
-    const { height: t } = f();
+}, k = ()=>{
+    const { height: t } = v();
     return t;
 }, F = ()=>{
-    const { width: t } = f();
-    return t;
-}, V = ()=>{
-    const { screenHeight: t } = f();
+    const { width: t } = v();
     return t;
-}, k = ()=>h() && window.top !== window.self, $ = h() ? r.useLayoutEffect : r.useEffect, E = (t, n, e)=>{
+}, $ = h() ? r.useLayoutEffect : r.useEffect, I = (t, n, e)=>{
     const [s, i] = r.useState(n);
     return r.useEffect(()=>{
         if (!t.current) return;
@@ -124,7 +125,7 @@ const A = (t)=>{
         e == null ? void 0 : e.rootMargin,
         e == null ? void 0 : e.threshold
     ]), s;
-}, I = (t)=>{
+}, T = (t)=>{
     const { top: n, right: e, bottom: s, left: i, width: c, height: o, x: u, y: d } = t.getBoundingClientRect();
     return {
         top: n,
@@ -138,13 +139,13 @@ const A = (t)=>{
     };
 }, j = function(t) {
     let n = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0, e = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
-    const [s, i] = r.useState(), c = E(t, !1);
+    const [s, i] = r.useState(), c = I(t, !1);
     return r.useEffect(()=>{
         let o;
         const u = ()=>{
             if (t.current && (c || e)) {
-                const d = I(t.current);
-                v(s, d) || i(d), n && (o = requestAnimationFrame(u));
+                const d = T(t.current);
+                E(s, d) || i(d), n && (o = requestAnimationFrame(u));
             } else i(void 0);
         };
         return o = requestAnimationFrame(u), ()=>{
@@ -158,4 +159,4 @@ const A = (t)=>{
         e
     ]), s;
 };
-export { q as useAriaId, j as useBoundingRect, A as useDisableBodyScroll, M as useElementDimensions, E as useIsInViewport, k as useIsWithinIFrame, $ as useIsomorphicLayoutEffect, V as useScreenHeight, L as useScreenSize, x as useTheme, D as useWindowHeight, f as useWindowSize, F as useWindowWidth };
+export { D as useAriaId, j as useBoundingRect, L as useDisableBodyScroll, q as useElementDimensions, I as useIsInViewport, $ as useIsomorphicLayoutEffect, M as useScreenSize, H as useTheme, k as useWindowHeight, v as useWindowSize, F as useWindowWidth };

package/dist-es/horizontal-scroll.css-mistica.js

@@ -1,5 +1,5 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./responsive-layout.css.ts.vanilla.css-mistica.js";
 import "./horizontal-scroll.css.ts.vanilla.css-mistica.js";
-var m = "_1gl3gmv2", v = "_1gl3gmv1 _1y2v1nfha";
+var m = "_1gl3gmv2", v = "_1gl3gmv1 _1y2v1nfhk";
 export { m as noScrollbar, v as scroll };

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

@@ -10,9 +10,9 @@ var a = {
     default: "yqt1oe1a",
     small: "yqt1oe1b"
 }, o = {
-    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 = {
+    default: "yqt1oe12 _1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfhk _1y2v1nfhz _1y2v1nfht",
+    small: "yqt1oe13 _1y2v1nf7d _1y2v1nf8m _1y2v1nf9v _1y2v1nfb4 _1y2v1nfk2 _1y2v1nf7c _1y2v1nfhk _1y2v1nfhz _1y2v1nfht"
+}, y = "yqt1oe1m _1y2v1nfho", v = "yqt1oey", l = "yqt1oe1i _1y2v1nfhe _1y2v1nfhl", f = {
     "brand-solid-default": "yqt1oe4",
     "brand-solid-inverse": "yqt1oe5",
     "brand-solid-alternative": "yqt1oe6",
@@ -44,13 +44,13 @@ var a = {
     "neutral-media": "yqt1oew",
     "danger-media": "yqt1oex"
 }, d = {
-    default: "yqt1oe1e yqt1oe1d _1y2v1nfjt _1y2v1nfha _1y2v1nfhp _1y2v1nfhj _1y2v1nfkb _1y2v1nfh4",
-    small: "yqt1oe1f yqt1oe1d _1y2v1nfjt _1y2v1nfha _1y2v1nfhp _1y2v1nfhj _1y2v1nfkb _1y2v1nfh4"
+    default: "yqt1oe1e yqt1oe1d _1y2v1nfk3 _1y2v1nfhk _1y2v1nfhz _1y2v1nfht _1y2v1nfkl _1y2v1nfhe",
+    small: "yqt1oe1f yqt1oe1d _1y2v1nfk3 _1y2v1nfhk _1y2v1nfhz _1y2v1nfht _1y2v1nfkl _1y2v1nfhe"
 }, i = {
     default: "calc(1.5rem + 24px)",
     small: "calc(1.25rem + 12px)"
 }, q = {
     default: "1.5rem",
     small: "1.25rem"
-}, 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 };
+}, s = "yqt1oez", _ = "yqt1oe15", u = "yqt1oe1g", m = "yqt1oe10", h = "yqt1oe1k _1y2v1nfhf";
+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, h as spinner };