@telefonica/mistica 14.25.0 → 14.26.0

package/dist-es/carousel.js

@@ -57,26 +57,26 @@ import se from "./generated/mistica-icons/icon-chevron-right-regular.js";
 import { useScreenSize as oe, useTheme as re, useIsInViewport as xe, useIsomorphicLayoutEffect as we } from "./hooks.js";
 import Se from "./inline.js";
 import ke from "./stack.js";
-import { BaseTouchable as B } from "./touchable.js";
+import { BaseTouchable as E } from "./touchable.js";
 import Z from "classnames";
-import { useIsInverseVariant as Ne, ThemeVariant as E } from "./theme-variant-context.js";
+import { useIsInverseVariant as Ne, ThemeVariant as B } from "./theme-variant-context.js";
 import { MediaBorderRadiusProvider as Le } from "./image.js";
 import { listenResize as le, getPrefixedDataAttributes as Ce } from "./utils/dom.js";
-import { isAndroid as ne } from "./utils/platform.js";
-import { useDocumentVisibility as Re } from "./utils/document-visibility.js";
-import { slideshowContainer as Me, slideshowPrevArrowButton as Ae, slideshow as Ee, slideshowItem as Be, slideshowNextArrowButton as Te, slideshowBullets as ye, bulletActiveInverse as We, bulletInverse as Oe, bulletActive as De, bullet as Ve, carouselContainer as ze, carouselPrevArrowButton as _e, carousel as je, centeredCarousel as Fe, carouselWithScroll as Ue, vars as L, carouselItem as qe, carouselNextArrowButton as Ke, carouselBullets as Ye } from "./carousel.css-mistica.js";
-import { assignInlineVars as Ge } from "@vanilla-extract/dynamic";
-import { sprinkles as He } from "./sprinkles.css-mistica.js";
-import { useDesktopContainerType as Je } from "./desktop-container-type-context.js";
-import { VIVO_NEW_SKIN as Qe } from "./skins/constants.js";
+import { isAndroid as ne, isIos as Re, isRunningAcceptanceTest as Ae } from "./utils/platform.js";
+import { useDocumentVisibility as Me } from "./utils/document-visibility.js";
+import { slideshowContainer as Be, slideshowPrevArrowButton as Ee, slideshow as Te, slideshowItem as ye, slideshowNextArrowButton as We, slideshowBullets as Oe, bulletActiveInverse as De, bulletInverse as Ve, bulletActive as ze, bullet as _e, carouselContainer as je, carouselPrevArrowButton as Fe, carousel as Ue, centeredCarousel as qe, carouselWithScroll as Ke, vars as C, carouselItem as Ye, carouselNextArrowButton as Ge, carouselBullets as He } from "./carousel.css-mistica.js";
+import { assignInlineVars as Je } from "@vanilla-extract/dynamic";
+import { sprinkles as Qe } from "./sprinkles.css-mistica.js";
+import { useDesktopContainerType as Xe } from "./desktop-container-type-context.js";
+import { VIVO_NEW_SKIN as Ze } from "./skins/constants.js";
 const ce = (e, r)=>{
-    const t = Re();
+    const t = Me();
     return xe(r, !1) && t && !!e;
 }, ie = (param)=>{
     let { currentIndex: e , numPages: r , onPress: t  } = param;
     const o = Ne(), { isDesktopOrBigger: f  } = oe(), m = (b)=>{
         const d = b === e;
-        return o ? d ? We : Oe : d ? De : Ve;
+        return o ? d ? De : Ve : d ? ze : _e;
     };
     return /* @__PURE__ */ s(Se, {
         space: f ? 16 : 8,
@@ -86,8 +86,8 @@ const ce = (e, r)=>{
         },
         children: Array.from({
             length: r
-        }, (b, d)=>/* @__PURE__ */ s(B, {
-                className: He({
+        }, (b, d)=>/* @__PURE__ */ s(E, {
+                className: Qe({
                     display: "block",
                     padding: 0,
                     border: "none",
@@ -100,7 +100,7 @@ const ce = (e, r)=>{
                 })
             }, d))
     });
-}, $ = (e, r, t)=>t ? typeof t == "number" ? t : t[e] || r[e] : r[e], Xe = (e, r)=>{
+}, $ = (e, r, t)=>t ? typeof t == "number" ? t : t[e] || r[e] : r[e], $e = (e, r)=>{
     const t = {
         mobile: 1,
         tablet: 2,
@@ -127,33 +127,33 @@ const ce = (e, r)=>{
     const t = Math.ceil(e.length / r), o = [];
     for(let f = 0; f < e.length; f += t)o.push(e[f]);
     return o[o.length - 1] = e[e.length - t], o;
-}, Ze = (e, r)=>{
+}, et = (e, r)=>{
     const t = [];
     for(let o = 0; o < r.length; o++)o === 0 ? t.push(r[0]) : t.push((r[o] + r[o - 1]) / 2);
     for(let o = t.length - 1; o >= 0; o--)if (e - t[o] >= -1) return o;
     return 0;
 }, ae = 5e3, ue = (param)=>{
-    let { items: e , itemStyle: r , itemClassName: t , withBullets: o , renderBullets: f , initialActiveItem: m , itemsPerPage: b , itemsToScroll: d , mobilePageOffset: g , gap: k , free: C , centered: R , autoplay: v , onPageChange: P , dataAttributes: F  } = param;
-    const { texts: T , platformOverrides: M , skinName: y  } = re(), c = Je(), i = Xe(c || "large", b), { isDesktopOrBigger: x , isTablet: N  } = oe(), U = N ? i.tablet : i.mobile, I = Math.max(Math.floor(x ? i.desktop : U), 1), p = n.useRef(null), w = Math.ceil(e.length / I), [{ scrollLeft: H , scrollRight: q  }, de] = n.useState({
+    let { items: e , itemStyle: r , itemClassName: t , withBullets: o , renderBullets: f , initialActiveItem: m , itemsPerPage: b , itemsToScroll: d , mobilePageOffset: g , gap: N , free: R , centered: A , autoplay: v , onPageChange: P , dataAttributes: F  } = param;
+    const { texts: T , platformOverrides: x , skinName: y  } = re(), c = Xe(), i = $e(c || "large", b), { isDesktopOrBigger: w , isTablet: L  } = oe(), U = L ? i.tablet : i.mobile, I = Math.max(Math.floor(w ? i.desktop : U), 1), p = n.useRef(null), S = Math.ceil(e.length / I), [{ scrollLeft: H , scrollRight: q  }, de] = n.useState({
         scrollLeft: 0,
         scrollRight: 0
-    }), [K, he] = n.useState([]), W = n.useMemo(()=>ee(K, w), [
+    }), [K, he] = n.useState([]), W = n.useMemo(()=>ee(K, S), [
         K,
-        w
+        S
     ]), O = d ? ee(K, Math.ceil(e.length / d)) : W, me = q !== 0, ge = H !== 0;
     we(()=>{
         if (p.current) {
             const l = p.current, a = ()=>{
-                const { scrollWidth: z , clientWidth: A  } = l, _ = Math.round(l.scrollLeft), j = Math.round(z - (_ + A));
+                const { scrollWidth: z , clientWidth: M  } = l, _ = Math.round(l.scrollLeft), j = Math.round(z - (_ + M));
                 de({
                     scrollLeft: _,
                     scrollRight: j
                 });
             }, u = ()=>{
                 const z = l.scrollWidth - l.clientWidth;
-                he(Array.from(l.querySelectorAll("[data-item]")).map((A, _)=>{
+                he(Array.from(l.querySelectorAll("[data-item]")).map((M, _)=>{
                     if (_ === e.length - 1) return z;
-                    const j = A.offsetLeft, Ie = parseInt(getComputedStyle(A).scrollMargin), Pe = R && !x ? j - A.clientWidth / 2 : j;
+                    const j = M.offsetLeft, Ie = parseInt(getComputedStyle(M).scrollMargin), Pe = A && !w ? j - M.clientWidth / 2 : j;
                     return Math.min(Pe - Ie - l.offsetLeft, z);
                 }));
             };
@@ -170,10 +170,10 @@ const ce = (e, r)=>{
         i.desktop,
         i.tablet,
         i.mobile,
+        S,
+        N,
+        A,
         w,
-        k,
-        R,
-        x,
         e.length
     ]);
     const D = n.useCallback(function(l) {
@@ -236,21 +236,21 @@ const ce = (e, r)=>{
         q,
         J
     ]);
-    const S = Ze(H, W), Q = n.useRef(!m), X = n.useRef(0);
+    const k = et(H, W), Q = n.useRef(!m), X = n.useRef(0);
     n.useEffect(()=>{
         if (P) {
-            const l = Math.min((S + 1) * I - 1, e.length - 1), a = [];
+            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);
             }
-            Q.current ? X.current !== S && P({
-                pageIndex: S,
+            Q.current ? X.current !== k && P({
+                pageIndex: k,
                 shownItemIndexes: a
-            }) : Q.current = a.includes(m || 0), X.current = S;
+            }) : Q.current = a.includes(m || 0), X.current = k;
         }
     }, [
-        S,
+        k,
         e.length,
         I,
         m,
@@ -258,12 +258,12 @@ const ce = (e, r)=>{
     ]);
     let V = null;
     f ? V = f({
-        numPages: w,
-        currentIndex: S,
+        numPages: S,
+        currentIndex: k,
         onPress: D
-    }) : o && (V = w > 1 && /* @__PURE__ */ s(ie, {
-        numPages: w,
-        currentIndex: S,
+    }) : o && (V = S > 1 && /* @__PURE__ */ s(ie, {
+        numPages: S,
+        currentIndex: k,
         onPress: D
     }));
     const be = "64px", ve = "36px";
@@ -274,12 +274,12 @@ const ce = (e, r)=>{
         }, F),
         children: [
             /* @__PURE__ */ G("div", {
-                className: ze,
+                className: je,
                 children: [
-                    /* @__PURE__ */ s(E, {
+                    /* @__PURE__ */ s(B, {
                         isInverse: !1,
-                        children: /* @__PURE__ */ s(B, {
-                            className: _e,
+                        children: /* @__PURE__ */ s(E, {
+                            className: Fe,
                             "aria-label": T.carouselPrevButton,
                             onPress: pe,
                             disabled: !ge,
@@ -287,37 +287,43 @@ const ce = (e, r)=>{
                         })
                     }),
                     /* @__PURE__ */ s("div", {
-                        className: Z(je, {
-                            [Fe]: R,
-                            [Ue]: w > 1
+                        className: Z(Ue, {
+                            [qe]: A,
+                            [Ke]: S > 1
                         }),
-                        style: _object_spread_props(_object_spread({}, Ge(_object_spread({
-                            [L.itemsPerPageDesktop]: String(i.desktop),
-                            [L.itemsPerPageTablet]: String(i.tablet),
-                            [L.itemsPerPageMobile]: String(i.mobile)
+                        style: _object_spread_props(_object_spread({}, Je(_object_spread({
+                            [C.itemsPerPageDesktop]: String(i.desktop),
+                            [C.itemsPerPageTablet]: String(i.tablet),
+                            [C.itemsPerPageMobile]: String(i.mobile)
                         }, g === "large" ? {
-                            [L.mobilePageOffset]: be
-                        } : y === Qe ? {
-                            [L.mobilePageOffset]: ve
-                        } : {}, k !== void 0 ? {
-                            [L.gap]: String(k)
+                            [C.mobilePageOffset]: be
+                        } : y === Ze ? {
+                            [C.mobilePageOffset]: ve
+                        } : {}, N !== void 0 ? {
+                            [C.gap]: String(N)
                         } : {}))), {
-                            scrollSnapType: C ? "initial" : "x mandatory"
+                            scrollSnapType: R ? "initial" : "x mandatory",
+                            // Hack to fix https://jira.tid.es/browse/NOVUMCC-8988
+                            // there is a webkit rendering bug that causes a half pixel white line to appear at
+                            // the bottom of the scrollable area in retina displays when it has a height with
+                            // decimals. This extra padding avoids that line to partially cover the carousel
+                            // slides border:
+                            paddingBottom: Re(x) && !Ae(x) ? 0.5 : void 0
                         }),
                         ref: p,
                         children: e.map((l, a)=>/* @__PURE__ */ s("div", {
-                                className: Z(qe, t),
+                                className: Z(Ye, t),
                                 style: _object_spread_props(_object_spread({}, r), {
-                                    scrollSnapStop: ne(M) ? "always" : "normal"
+                                    scrollSnapStop: ne(x) ? "always" : "normal"
                                 }),
                                 "data-item": !0,
                                 children: l
                             }, a))
                     }),
-                    /* @__PURE__ */ s(E, {
+                    /* @__PURE__ */ s(B, {
                         isInverse: !1,
-                        children: /* @__PURE__ */ s(B, {
-                            className: Ke,
+                        children: /* @__PURE__ */ s(E, {
+                            className: Ge,
                             "aria-label": T.carouselNextButton,
                             onPress: Y,
                             disabled: !me,
@@ -327,12 +333,12 @@ const ce = (e, r)=>{
                 ]
             }),
             V && /* @__PURE__ */ s("div", {
-                className: Ye,
+                className: He,
                 children: V
             })
         ]
     });
-}, vt = (e)=>/* @__PURE__ */ s(ue, _object_spread({}, e)), It = (param)=>/* @__PURE__ */ {
+}, Pt = (e)=>/* @__PURE__ */ s(ue, _object_spread({}, e)), xt = (param)=>/* @__PURE__ */ {
     let { items: e , itemStyle: r , itemClassName: t , withBullets: o , renderBullets: f , initialActiveItem: m , onPageChange: b , dataAttributes: d  } = param;
     return s(ue, {
         items: e,
@@ -352,15 +358,15 @@ const ce = (e, r)=>{
         onPageChange: b,
         dataAttributes: d
     });
-}, fe = /*#__PURE__*/ n.createContext(!1), Pt = ()=>n.useContext(fe), $e = (param)=>/* @__PURE__ */ {
+}, fe = /*#__PURE__*/ n.createContext(!1), wt = ()=>n.useContext(fe), tt = (param)=>/* @__PURE__ */ {
     let { children: e  } = param;
     return s(fe.Provider, {
         value: !0,
         children: e
     });
-}, xt = (param)=>{
+}, St = (param)=>{
     let { items: e , withBullets: r , autoplay: t , onPageChange: o , dataAttributes: f , inverseBullets: m = !0  } = param;
-    const { texts: b , platformOverrides: d  } = re(), g = n.useRef(null), [{ scrollLeft: k , scrollRight: C  }, R] = n.useState({
+    const { texts: b , platformOverrides: d  } = re(), g = n.useRef(null), [{ scrollLeft: N , scrollRight: R  }, A] = n.useState({
         scrollLeft: 0,
         scrollRight: 0
     }), v = n.useCallback(()=>{
@@ -375,21 +381,21 @@ const ce = (e, r)=>{
             left: c.clientWidth,
             behavior: "smooth"
         });
-    }, []), F = C !== 0, T = k !== 0, M = g.current ? Math.floor((k + g.current.clientWidth / 2) / g.current.clientWidth) : 0;
+    }, []), F = R !== 0, T = N !== 0, x = g.current ? Math.floor((N + g.current.clientWidth / 2) / g.current.clientWidth) : 0;
     n.useLayoutEffect(()=>{
         const c = g.current;
         if (c) {
             const i = ()=>{
-                const { scrollWidth: N , clientWidth: U  } = c, I = Math.round(c.scrollLeft), p = Math.round(N - (I + U));
-                R({
+                const { scrollWidth: L , clientWidth: U  } = c, I = Math.round(c.scrollLeft), p = Math.round(L - (I + U));
+                A({
                     scrollLeft: I,
                     scrollRight: p
                 });
             };
             i(), c.addEventListener("scroll", i);
-            const x = le(c, i);
+            const w = le(c, i);
             return ()=>{
-                c.removeEventListener("scroll", i), x();
+                c.removeEventListener("scroll", i), w();
             };
         }
     }, [
@@ -398,34 +404,34 @@ const ce = (e, r)=>{
     const y = ce(!!t, g);
     return n.useEffect(()=>{
         if (y && t) {
-            const c = typeof t == "boolean" ? ae : t.time, i = typeof t == "object" && t.loop, x = setInterval(()=>{
-                var N;
-                C !== 0 ? P() : i && ((N = g.current) == null || N.scrollTo({
+            const c = typeof t == "boolean" ? ae : t.time, i = typeof t == "object" && t.loop, w = setInterval(()=>{
+                var L;
+                R !== 0 ? P() : i && ((L = g.current) == null || L.scrollTo({
                     left: 0,
                     behavior: "smooth"
                 }));
             }, c);
-            return ()=>clearInterval(x);
+            return ()=>clearInterval(w);
         }
     }, [
         t,
         P,
-        C,
+        R,
         y
     ]), n.useEffect(()=>{
-        o && o(M);
+        o && o(x);
     }, [
-        M,
+        x,
         o
-    ]), /* @__PURE__ */ s($e, {
+    ]), /* @__PURE__ */ s(tt, {
         children: /* @__PURE__ */ G("div", _object_spread_props(_object_spread({
-            className: Me
+            className: Be
         }, Ce(f, "SlideShow")), {
             children: [
-                /* @__PURE__ */ s(E, {
+                /* @__PURE__ */ s(B, {
                     isInverse: !1,
-                    children: /* @__PURE__ */ s(B, {
-                        className: Ae,
+                    children: /* @__PURE__ */ s(E, {
+                        className: Ee,
                         "aria-label": b.carouselPrevButton,
                         onPress: v,
                         disabled: !T,
@@ -435,10 +441,10 @@ const ce = (e, r)=>{
                 /* @__PURE__ */ s(Le, {
                     value: !1,
                     children: /* @__PURE__ */ s("div", {
-                        className: Ee,
+                        className: Te,
                         ref: g,
                         children: e.map((c, i)=>/* @__PURE__ */ s("div", {
-                                className: Be,
+                                className: ye,
                                 style: {
                                     scrollSnapStop: ne(d) ? "always" : "normal"
                                 },
@@ -446,23 +452,23 @@ const ce = (e, r)=>{
                             }, i))
                     })
                 }),
-                /* @__PURE__ */ s(E, {
+                /* @__PURE__ */ s(B, {
                     isInverse: !1,
-                    children: /* @__PURE__ */ s(B, {
-                        className: Te,
+                    children: /* @__PURE__ */ s(E, {
+                        className: We,
                         "aria-label": b.carouselNextButton,
                         onPress: P,
                         disabled: !F,
                         children: /* @__PURE__ */ s(se, {})
                     })
                 }),
-                r && e.length > 1 && /* @__PURE__ */ s(E, {
+                r && e.length > 1 && /* @__PURE__ */ s(B, {
                     isInverse: m,
                     children: /* @__PURE__ */ s("div", {
-                        className: ye,
+                        className: Oe,
                         children: /* @__PURE__ */ s(ie, {
                             numPages: e.length,
-                            currentIndex: M
+                            currentIndex: x
                         })
                     })
                 })
@@ -470,4 +476,4 @@ const ce = (e, r)=>{
         }))
     });
 };
-export { vt as Carousel, It as CenteredCarousel, $e as IsInsideSlideshowProvider, ie as PageBullets, xt as Slideshow, Pt as useIsInsideSlideshowContext };
+export { Pt as Carousel, xt as CenteredCarousel, tt as IsInsideSlideshowProvider, ie as PageBullets, St as Slideshow, wt as useIsInsideSlideshowContext };

package/dist-es/checkbox.js

@@ -50,75 +50,76 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-import { jsx as a, jsxs as w } from "react/jsx-runtime";
-import * as I from "react";
-import { SPACE as A } from "./utils/key-codes.js";
-import { useControlProps as D } from "./form-context.js";
-import L from "./inline.js";
-import { Text3 as m } from "./text.js";
-import { useAriaId as N, useTheme as P } from "./hooks.js";
+import { jsx as a, jsxs as A } from "react/jsx-runtime";
+import * as m from "react";
+import { SPACE as D } from "./utils/key-codes.js";
+import { useControlProps as L } from "./form-context.js";
+import N from "./inline.js";
+import { Text3 as f } from "./text.js";
+import { useAriaId as P, useTheme as R } from "./hooks.js";
 import n from "classnames";
 import { getPrefixedDataAttributes as S } from "./utils/dom.js";
-import { checkboxContainerDisabled as E, checkboxContainer as V, disabled as v, check as f, checkChecked as u, boxVariant as j } from "./checkbox.css-mistica.js";
-import { vars as k } from "./skins/skin-contract.css-mistica.js";
-const z = (param)=>{
-    let { isChecked: e , disabled: o  } = param;
-    const { isIos: l  } = P(), r = l ? /* @__PURE__ */ a("svg", {
+import { checkboxContainerDisabled as E, checkboxContainer as V, disabled as x, check as u, checkChecked as k, boxVariant as j } from "./checkbox.css-mistica.js";
+import { vars as v } from "./skins/skin-contract.css-mistica.js";
+import { combineRefs as z } from "./utils/common.js";
+const B = (param)=>{
+    let { isChecked: e , disabled: c  } = param;
+    const { isIos: o  } = R(), l = o ? /* @__PURE__ */ a("svg", {
         viewBox: "0 0 10 8",
         width: "10",
         height: "8",
-        className: n(f, {
-            [u]: e
+        className: n(u, {
+            [k]: e
         }),
         children: /* @__PURE__ */ a("path", {
             d: "M2.659 7.724c.33.366.92.368 1.254.005L9.79 1.336A.782.782 0 009.719.202a.858.858 0 00-1.178.069l-5.236 5.72-1.841-2.038a.857.857 0 00-1.177-.078.782.782 0 00-.082 1.133l2.454 2.716z",
-            fill: k.colors.inverse
+            fill: v.colors.inverse
         })
     }) : /* @__PURE__ */ a("svg", {
         viewBox: "0 0 14 10",
         width: "14",
         height: "10",
-        className: n(f, {
-            [u]: e
+        className: n(u, {
+            [k]: e
         }),
         children: /* @__PURE__ */ a("path", {
             d: "M5 10L0 5.192l1.4-1.346L5 7.308 12.6 0 14 1.346z",
-            fill: k.colors.inverse
+            fill: v.colors.inverse
         })
     });
     return /* @__PURE__ */ a("div", {
-        className: n(j[e ? "checked" : l ? "ios" : "rest"], {
-            [v]: o
+        className: n(j[e ? "checked" : o ? "ios" : "rest"], {
+            [x]: c
         }),
-        children: r
+        children: l
     });
-}, B = (e)=>{
-    const o = N(e["aria-labelledby"]), l = e["aria-label"], r = l || e["aria-labelledby"], { defaultValue: x , value: t , onChange: s , focusableRef: C , disabled: i  } = D({
+}, K = /*#__PURE__*/ m.forwardRef((e, c)=>{
+    const o = P(e["aria-labelledby"]), l = e["aria-label"], C = l || e["aria-labelledby"], { defaultValue: g , value: t , onChange: s , focusableRef: w , disabled: i  } = L({
         name: e.name,
         value: e.checked,
         defaultValue: e.defaultChecked,
         onChange: e.onChange,
         disabled: e.disabled
-    }), [d, g] = I.useState(!!x), h = ()=>{
-        t === void 0 ? (g(!d), s(!d)) : s(!t);
-    }, y = (c)=>{
-        c.keyCode === A && (c.preventDefault(), c.stopPropagation(), h());
-    }, b = /* @__PURE__ */ a(z, {
+    }), [d, y] = m.useState(!!g), h = ()=>{
+        t === void 0 ? (y(!d), s(!d)) : s(!t);
+    }, I = (r)=>{
+        r.keyCode === D && (r.preventDefault(), r.stopPropagation(), h());
+    }, b = /* @__PURE__ */ a(B, {
         disabled: i,
         isChecked: t !== null && t !== void 0 ? t : d
     });
     return(// When the checkbox is disabled, it shouldn't be focusable
-    // eslint-disable-next-line jsx-a11y/interactive-supports-focus
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
     /* @__PURE__ */ a("div", _object_spread_props(_object_spread({
         id: e.id,
-        role: "checkbox",
+        role: e.role || "checkbox",
         "aria-checked": t !== null && t !== void 0 ? t : d,
-        onKeyDown: i ? void 0 : y,
-        onClick: (c)=>{
-            c.stopPropagation(), i || h();
+        onKeyDown: i ? void 0 : I,
+        onClick: (r)=>{
+            r.stopPropagation(), i || h();
         },
         tabIndex: i ? void 0 : 0,
-        ref: C,
+        ref: z(c, w),
         className: i ? E : V,
         "aria-label": l,
         "aria-labelledby": l ? void 0 : o,
@@ -129,10 +130,10 @@ const z = (param)=>{
             labelId: o,
             checked: t !== null && t !== void 0 ? t : d,
             disabled: !!i
-        }) : /* @__PURE__ */ w(L, {
+        }) : /* @__PURE__ */ A(N, {
             space: 16,
             children: [
-                /* @__PURE__ */ a(m, {
+                /* @__PURE__ */ a(f, {
                     regular: !0,
                     as: "div",
                     children: /* @__PURE__ */ a("div", {
@@ -143,18 +144,18 @@ const z = (param)=>{
                         children: b
                     })
                 }),
-                e.children && /* @__PURE__ */ a(m, {
+                e.children && /* @__PURE__ */ a(f, {
                     regular: !0,
                     as: "div",
                     id: o,
-                    role: r ? "presentation" : void 0,
+                    role: C ? "presentation" : void 0,
                     children: /* @__PURE__ */ a("span", {
-                        className: i ? v : "",
+                        className: i ? x : "",
                         children: e.children
                     })
                 })
             ]
         })
     })));
-}, O = B;
-export { O as default };
+}), W = K;
+export { W as default };

package/dist-es/community/blocks.js

@@ -5,7 +5,7 @@ import { Text2 as n, Text5 as f, Text8 as h, Text3 as v } from "../text.js";
 import { vars as c } from "../skins/skin-contract.css-mistica.js";
 import s from "../inline.js";
 import u from "../box.js";
-import S from "../progress-bar.js";
+import { ProgressBar as S } from "../progress-bar.js";
 import B from "classnames";
 const g = (param)=>{
     let { title: o , description: e  } = param;
@@ -85,6 +85,7 @@ const g = (param)=>{
                     /* @__PURE__ */ r(n, {
                         regular: !0,
                         color: c.colors.textSecondary,
+                        decoration: "line-through",
                         children: l
                     }),
                     /* @__PURE__ */ r(f, {

package/dist-es/icons/icon-chevron.js

@@ -26,41 +26,44 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as l } from "react/jsx-runtime";
-import { vars as a } from "../skins/skin-contract.css-mistica.js";
-const c = (param)=>/* @__PURE__ */ {
-    let { size: o , color: t , transform: r , className: n , style: e  } = param;
-    return l("svg", {
+import { jsx as s } from "react/jsx-runtime";
+import { vars as c } from "../skins/skin-contract.css-mistica.js";
+const h = (param)=>/* @__PURE__ */ {
+    let { size: o , color: r , transform: n , transitionDuration: t , className: e , style: l  } = param;
+    return s("svg", {
         role: "presentation",
         width: o,
         height: o,
         viewBox: "0 0 24 24",
-        className: n,
-        style: e,
-        children: /* @__PURE__ */ l("path", {
+        className: e,
+        style: _object_spread({
+            transform: n,
+            transition: `transform ${t}ms`
+        }, l),
+        children: /* @__PURE__ */ s("path", {
             style: {
-                transition: "transform 0.3s"
+                transition: `fill ${t}ms`
             },
-            fill: t,
+            fill: r,
             fillRule: "evenodd",
-            d: "M14.338 11.478a.75.75 0 0 1 0 1.044l-3.837 3.997a.75.75 0 1 1-1.082-1.038L12.76 12 9.42 8.52a.75.75 0 0 1 1.082-1.04l3.837 3.998z",
-            transform: r
+            d: "M14.338 11.478a.75.75 0 0 1 0 1.044l-3.837 3.997a.75.75 0 1 1-1.082-1.038L12.76 12 9.42 8.52a.75.75 0 0 1 1.082-1.04l3.837 3.998z"
         })
     });
-}, h = {
+}, f = {
     up: -90,
     down: 90,
     left: 180,
     right: 0
-}, f = (param)=>{
-    let { size: o = 24 , color: t , className: r , style: n , direction: e = "right"  } = param;
-    const i = t || a.colors.neutralHigh, s = {
+}, g = (param)=>{
+    let { size: o = 24 , color: r , className: n , style: t , transitionDuration: e = 300 , direction: l = "right"  } = param;
+    const i = r || c.colors.neutralHigh, a = {
         size: o,
         color: i,
-        transform: `rotate(${h[e]} 12 12)`,
-        className: r,
-        style: n
+        transform: `rotate(${f[l]}deg)`,
+        className: n,
+        transitionDuration: e,
+        style: t
     };
-    return /* @__PURE__ */ l(c, _object_spread({}, s));
-}, v = f;
-export { v as default };
+    return /* @__PURE__ */ s(h, _object_spread({}, a));
+}, p = g;
+export { p as default };