@telefonica/mistica 14.24.1 → 14.26.0

package/dist-es/text-field-components.js

@@ -50,93 +50,95 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-import { jsxs as c, jsx as s } from "react/jsx-runtime";
+import { jsxs as c, jsx as t, Fragment as g } from "react/jsx-runtime";
 import * as u from "react";
 import a from "classnames";
 import { useIsInverseVariant as y } from "./theme-variant-context.js";
-import { useTheme as g } from "./hooks.js";
+import { useTheme as C } from "./hooks.js";
 import { Text1 as h } from "./text.js";
-import { labelContainer as C, shrinked as S, labelText as k, helperContainer as I, helperText as p, leftText as E, rightText as F, fieldContainer as L, fullWidth as W, normalWidth as j, disabled as w, field as O, fieldMulti as P, fieldSingle as V } from "./text-field-components.css-mistica.js";
+import { labelContainer as S, shrinked as k, labelText as I, helperText as p, leftText as F, rightText as E, fieldContainer as L, fullWidth as W, normalWidth as j, disabled as w, field as O, fieldMulti as P, fieldSingle as V, helperContainer as A } from "./text-field-components.css-mistica.js";
 import { sprinkles as x } from "./sprinkles.css-mistica.js";
 import { vars as e } from "./skins/skin-contract.css-mistica.js";
-const B = (param)=>{
-    let { shrinkLabel: o , forId: t , inputState: r , error: l , children: i , style: n , optional: d  } = param;
-    const m = o || r === "focused" || r === "filled", [v, T] = u.useState("initial"), { texts: b  } = g();
+const G = (param)=>{
+    let { shrinkLabel: l , forId: s , inputState: r , error: o , children: i , style: n , optional: d  } = param;
+    const m = l || r === "focused" || r === "filled", [v, b] = u.useState("initial"), { texts: N  } = C();
     u.useEffect(()=>{
-        const N = setTimeout(()=>{
-            process.env.NODE_ENV !== "test" && T("transform 150ms, width 150ms");
+        const T = setTimeout(()=>{
+            process.env.NODE_ENV !== "test" && b("transform 150ms, width 150ms");
         });
         return ()=>{
-            clearTimeout(N);
+            clearTimeout(T);
         };
     }, []);
     let f = e.colors.textSecondary;
-    return l && r !== "default" ? f = e.colors.error : r === "focused" && (f = e.colors.controlActivated), /* @__PURE__ */ c("label", {
-        className: a(C, {
-            [S]: m
+    return o && r !== "default" ? f = e.colors.error : r === "focused" && (f = e.colors.controlActivated), /* @__PURE__ */ c("label", {
+        className: a(S, {
+            [k]: m
         }, x({
             color: f
         })),
-        htmlFor: t,
+        htmlFor: s,
         style: _object_spread_props(_object_spread({}, n), {
             transition: v
         }),
         children: [
-            /* @__PURE__ */ s("span", {
-                className: k,
+            /* @__PURE__ */ t("span", {
+                className: I,
                 children: i
             }),
             d ? /* @__PURE__ */ c("span", {
                 children: [
                     "\xa0(",
-                    b.formFieldOptionalLabelSuffix,
+                    N.formFieldOptionalLabelSuffix,
                     ")"
                 ]
             }) : null
         ]
     });
-}, G = (param)=>{
-    let { leftText: o , rightText: t , error: r  } = param;
-    const l = y(), i = l ? e.colors.textPrimaryInverse : r ? e.colors.error : e.colors.textSecondary, n = l ? e.colors.textPrimaryInverse : e.colors.textSecondary;
-    return /* @__PURE__ */ c("div", {
-        className: I,
+}, J = (param)=>{
+    let { leftText: l , rightText: s , error: r  } = param;
+    const o = y(), i = o ? e.colors.textPrimaryInverse : r ? e.colors.error : e.colors.textSecondary, n = o ? e.colors.textPrimaryInverse : e.colors.textSecondary;
+    return /* @__PURE__ */ c(g, {
         children: [
-            o && /* @__PURE__ */ s("div", {
-                className: a(p, E),
-                children: /* @__PURE__ */ s(h, {
+            l && /* @__PURE__ */ t("div", {
+                className: a(p, F),
+                children: /* @__PURE__ */ t(h, {
                     color: i,
                     regular: !0,
                     as: "p",
-                    children: o
+                    children: l
                 })
             }),
-            t && /* @__PURE__ */ s("div", {
-                className: a(p, F),
-                children: /* @__PURE__ */ s(h, {
+            s && /* @__PURE__ */ t("div", {
+                className: a(p, E),
+                children: /* @__PURE__ */ t(h, {
                     color: n,
                     regular: !0,
                     as: "p",
-                    children: t
+                    children: s
                 })
             })
         ]
     });
-}, J = (param)=>/* @__PURE__ */ {
-    let { multiline: o , disabled: t , children: r , helperText: l , className: i , fieldRef: n , fullWidth: d , readOnly: m  } = param;
+}, K = (param)=>/* @__PURE__ */ {
+    let { multiline: l , disabled: s , children: r , helperText: o , className: i , fieldRef: n , fullWidth: d , readOnly: m  } = param;
     return c("div", {
         className: a(L, d ? W : j, {
-            [w]: t
+            [w]: s
         }),
         children: [
-            /* @__PURE__ */ s("div", {
-                className: a(O, o ? P : V, x({
+            /* @__PURE__ */ t("div", {
+                className: a(O, l ? P : V, x({
                     background: m ? e.colors.neutralLow : e.colors.backgroundContainer
                 }), i),
                 ref: n,
                 children: r
             }),
-            l
+            o && /* @__PURE__ */ t("div", {
+                className: A,
+                children: o
+            })
         ]
     });
 };
-export { J as FieldContainer, G as HelperText, B as Label };
+export { K as FieldContainer, J as HelperText, G as Label };

package/dist-es/theme.js

@@ -111,7 +111,10 @@ const l = {
     carouselPrevButton: "anterior",
     playIconButtonLabel: "Reproducir",
     pauseIconButtonLabel: "Pausar",
-    sheetConfirmButton: "Continuar"
+    sheetConfirmButton: "Continuar",
+    progressBarCompletedLabel: "completo",
+    progressBarStepLabel: "Paso 1$s de 2$s",
+    pinFieldInputLabel: "D\xedgito 1$s de 2$s"
 }, i = {
     expirationDatePlaceholder: "MM/YY",
     togglePasswordVisibilityLabel: "Toggle password visibility",
@@ -145,8 +148,11 @@ const l = {
     carouselPrevButton: "previous",
     playIconButtonLabel: "Play",
     pauseIconButtonLabel: "Pause",
-    sheetConfirmButton: "Continue"
-}, d = {
+    sheetConfirmButton: "Continue",
+    progressBarCompletedLabel: "completed",
+    progressBarStepLabel: "Step 1$s of 2$s",
+    pinFieldInputLabel: "Digit 1$s of 2$s"
+}, s = {
     expirationDatePlaceholder: "MM/JJ",
     togglePasswordVisibilityLabel: "Passwort un-/sichtbar machen",
     loading: "Wird gespeichert",
@@ -179,8 +185,11 @@ const l = {
     carouselPrevButton: "vorherige",
     playIconButtonLabel: "Abspielen",
     pauseIconButtonLabel: "Pausieren",
-    sheetConfirmButton: "Fortfahren"
-}, s = {
+    sheetConfirmButton: "Fortfahren",
+    progressBarCompletedLabel: "vollendet",
+    progressBarStepLabel: "Schritt 1$s von 2$s",
+    pinFieldInputLabel: "Ziffer 1$s von 2$s"
+}, d = {
     expirationDatePlaceholder: "MM/AA",
     togglePasswordVisibilityLabel: "Mostrar ou ocultar senha",
     loading: "Carregando",
@@ -213,15 +222,18 @@ const l = {
     carouselPrevButton: "anterior",
     playIconButtonLabel: "Reproduzir",
     pauseIconButtonLabel: "Pausar",
-    sheetConfirmButton: "Continuar"
-}, b = (e)=>{
+    sheetConfirmButton: "Continuar",
+    progressBarCompletedLabel: "conclu\xeddo",
+    progressBarStepLabel: "Etapa 1$s de 2$s",
+    pinFieldInputLabel: "D\xedgito 1$s de 2$s"
+}, v = (e)=>{
     switch(e.toLocaleLowerCase().split(/[-_]/)[0]){
         case "es":
             return l;
         case "pt":
-            return s;
-        case "de":
             return d;
+        case "de":
+            return s;
         case "en":
             return i;
         default:
@@ -262,7 +274,7 @@ const l = {
                 children: t
             }))
         });
-    }, v = (e)=>(_param)=>/* @__PURE__ */ {
+    }, g = (e)=>(_param)=>/* @__PURE__ */ {
         var { to: r , innerRef: o , children: t  } = _param, n = _object_without_properties(_param, [
             "to",
             "innerRef",
@@ -285,10 +297,10 @@ const l = {
         case "Next12":
             return p(e.Component);
         case "Next13":
-            return v(e.Component);
+            return g(e.Component);
         default:
             const r = e.type;
             throw new Error(`Invalid Link type: ${r}`);
     }
 };
-export { u as NAVBAR_HEIGHT_DESKTOP, c as NAVBAR_HEIGHT_MOBILE, E as dimensions, h as getMisticaLinkComponent, b as getTexts };
+export { u as NAVBAR_HEIGHT_DESKTOP, c as NAVBAR_HEIGHT_MOBILE, E as dimensions, h as getMisticaLinkComponent, v as getTexts };

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

@@ -1,11 +1,11 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./tooltip.css.ts.vanilla.css-mistica.js";
-var v = "_1xhatbpb _1y2v1nfb1 _1y2v1nfec _1y2v1nfbz _1y2v1nfcf _1y2v1nfdq _1y2v1nf31 _1y2v1nfdn", t = "_1xhatbpe", n = "_1xhatbpf", _ = "_1xhatbpd", e = "_1xhatbpc", f = "_1y2v1nfb1 _1y2v1nfc2 _1y2v1nfcf _1y2v1nfe6 _1y2v1nf2", p = "_1xhatbpj _1y2v1nf68 _1y2v1nf7h _1y2v1nf8q _1y2v1nf9z _1y2v1nfb1 _1y2v1nfew _1y2v1nfbu _1y2v1nfdz _1y2v1nfdn", b = "_1xhatbpl", o = "_1xhatbpm", x = "_1xhatbpn", h = "_1xhatbpo", y = "_1xhatbpp", i = "_1xhatbp6", m = "_1xhatbp7", w = "_1xhatbp8", d = "_1xhatbpk", c = {
+var v = "_1xhatbpb _1y2v1nfb1 _1y2v1nfec _1y2v1nfbz _1y2v1nfcf _1y2v1nfdq _1y2v1nf31 _1y2v1nfdn", t = "_1xhatbpe", n = "_1xhatbpf", _ = "_1xhatbpd", e = "_1xhatbpc", f = "_1y2v1nfb1 _1y2v1nfc2 _1y2v1nfcf _1y2v1nfe6 _1y2v1nf2", p = "_1xhatbpj _1y2v1nf68 _1y2v1nf7h _1y2v1nf8q _1y2v1nf9z _1y2v1nfb1 _1y2v1nfew _1y2v1nfbu _1y2v1nfdz _1y2v1nfdn", b = "_1xhatbpm", x = "_1xhatbpn", h = "_1xhatbpo", o = "_1xhatbpp", y = "_1xhatbpq", i = "_1xhatbp6", m = "_1xhatbp7", w = "_1xhatbp8", d = "_1xhatbpk", c = "_1xhatbpl", s = {
     shadowAlpha: "var(--_1xhatbp0)",
     enterTransform: "var(--_1xhatbp1)",
     enterDoneTransform: "var(--_1xhatbp2)",
     exitTransform: "var(--_1xhatbp3)",
     enterActiveAnimationName: "var(--_1xhatbp4)",
     arrowBoxShadow: "var(--_1xhatbp5)"
-}, s = "_1y2v1nfba";
-export { v as arrow, t as arrowBottom, n as arrowLeft, _ as arrowRight, e as arrowTop, f as arrowWrapper, p as container, b as enter, o as enterActive, x as enterDone, h as exit, y as exitActive, i as fadeInBottomKeyframes, m as fadeInTopKeyframes, w as fadeInXKeyframes, d as textAlign, c as vars, s as wrapper };
+}, A = "_1y2v1nfb7";
+export { v as arrow, t as arrowBottom, n as arrowLeft, _ as arrowRight, e as arrowTop, f as arrowWrapper, p as container, b as enter, x as enterActive, h as enterDone, o as exit, y as exitActive, i as fadeInBottomKeyframes, m as fadeInTopKeyframes, w as fadeInXKeyframes, d as textAlign, c as textCenter, s as vars, A as wrapper };

package/dist-es/tooltip.js

@@ -77,22 +77,22 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsxs as P, Fragment as tt, jsx as w } from "react/jsx-runtime";
+import { jsxs as P, Fragment as et, jsx as w } from "react/jsx-runtime";
 import * as o from "react";
 import E from "classnames";
-import { CSSTransition as et } from "react-transition-group";
-import { useTheme as rt, useScreenSize as nt, useAriaId as ot } from "./hooks.js";
-import { Portal as it } from "./portal.js";
-import at from "./overlay.js";
+import { CSSTransition as rt } from "react-transition-group";
+import { useTheme as nt, useScreenSize as ot, useAriaId as it } from "./hooks.js";
+import { Portal as at } from "./portal.js";
+import ct from "./overlay.js";
 import { Text2 as I } from "./text.js";
-import { TAB as ct } from "./utils/key-codes.js";
-import st from "./stack.js";
-import { vars as s, wrapper as ut, enter as lt, enterActive as dt, enterDone as ft, exit as ht, exitActive as wt, container as mt, textAlign as pt, arrowWrapper as gt, arrow as xt, fadeInTopKeyframes as Tt, fadeInBottomKeyframes as vt, fadeInXKeyframes as bt, arrowTop as At, arrowBottom as Pt, arrowLeft as St, arrowRight as Yt } from "./tooltip.css-mistica.js";
-import { assignInlineVars as Ot } from "@vanilla-extract/dynamic";
-import { getPrefixedDataAttributes as Rt } from "./utils/dom.js";
-import { isClientSide as yt, isServerSide as Ct } from "./utils/environment.js";
-const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500, M = ()=>{}, It = (r)=>r === "bottom" ? `translateY(${v}px)` : r === "top" ? `translateY(calc(-100% - ${v}px))` : r === "right" ? `translateX(${v}px) translateY(-50%)` : r === "left" ? `translateX(-${v}px) translateY(-50%)` : `translateY(-${v}px)`, Mt = (r)=>r === "top" ? "translateY(-100%)" : r === "bottom" ? "translateY(0)" : "translateY(-50%)", Nt = (r)=>r === "bottom" ? "translateY(0)" : r === "top" ? "translateY(-100%)" : r === "right" || r === "left" ? "translateX(0px) translateY(-50%)" : "translateY(0px)", kt = (r)=>r === "top" ? Tt : r === "bottom" ? vt : bt, Lt = (r)=>r ? "1" : "0.2", Vt = (r)=>r === "top" ? `2px 2px 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : r === "right" ? `0 0 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : r === "left" ? `0 0 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : r === "bottom" ? `-1px -1px 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : "", jt = (_param)=>{
-    var { children: r , extra: N , description: S , target: k , title: Y , targetLabel: L , delay: V = !0 , dataAttributes: j , targetStyle: K , unstable_offsetX: f  } = _param, C = _object_without_properties(_param, [
+import { TAB as st } from "./utils/key-codes.js";
+import ut from "./stack.js";
+import { vars as s, wrapper as lt, enter as dt, enterActive as ft, enterDone as ht, exit as wt, exitActive as mt, container as pt, textAlign as gt, textCenter as xt, arrowWrapper as Tt, arrow as vt, fadeInTopKeyframes as bt, fadeInBottomKeyframes as At, fadeInXKeyframes as Pt, arrowTop as St, arrowBottom as Yt, arrowLeft as Ct, arrowRight as Ot } from "./tooltip.css-mistica.js";
+import { assignInlineVars as Rt } from "@vanilla-extract/dynamic";
+import { getPrefixedDataAttributes as yt } from "./utils/dom.js";
+import { isClientSide as Dt, isServerSide as Wt } from "./utils/environment.js";
+const $t = "bottom", Bt = "top", Et = 12, m = 4 + Et, It = 500, v = 12, Mt = 500, M = ()=>{}, Nt = (r)=>r === "bottom" ? `translateY(${v}px)` : r === "top" ? `translateY(calc(-100% - ${v}px))` : r === "right" ? `translateX(${v}px) translateY(-50%)` : r === "left" ? `translateX(-${v}px) translateY(-50%)` : `translateY(-${v}px)`, kt = (r)=>r === "top" ? "translateY(-100%)" : r === "bottom" ? "translateY(0)" : "translateY(-50%)", Lt = (r)=>r === "bottom" ? "translateY(0)" : r === "top" ? "translateY(-100%)" : r === "right" || r === "left" ? "translateX(0px) translateY(-50%)" : "translateY(0px)", Vt = (r)=>r === "top" ? bt : r === "bottom" ? At : Pt, jt = (r)=>r ? "1" : "0.2", Kt = (r)=>r === "top" ? `2px 2px 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : r === "right" ? `0 0 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : r === "left" ? `0 0 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : r === "bottom" ? `-1px -1px 4px 0 rgba(0, 0, 0, ${s.shadowAlpha})` : "", zt = (_param)=>{
+    var { children: r , extra: N , description: S , target: k , title: Y , targetLabel: L , delay: V = !0 , dataAttributes: j , targetStyle: K , unstable_offsetX: f , textCenter: z  } = _param, y = _object_without_properties(_param, [
         "children",
         "extra",
         "description",
@@ -102,16 +102,17 @@ const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500
         "delay",
         "dataAttributes",
         "targetStyle",
-        "unstable_offsetX"
+        "unstable_offsetX",
+        "textCenter"
     ]);
-    const { isDarkMode: z  } = rt(), [a, O] = o.useState(!1), { isTabletOrSmaller: F  } = nt(), D = ot(), h = o.useRef(!1), c = o.useRef(null), g = o.useRef(null), R = o.useRef(null), x = o.useRef(null), t = o.useRef({
+    const { isDarkMode: F  } = nt(), [a, C] = o.useState(!1), { isTabletOrSmaller: H  } = ot(), D = it(), h = o.useRef(!1), c = o.useRef(null), g = o.useRef(null), O = o.useRef(null), x = o.useRef(null), t = o.useRef({
         top: 0,
         right: 0,
         left: 0,
         bottom: 0,
         width: 0,
         height: 0
-    }), [H, X] = o.useState({}), q = (n)=>F ? n || Wt : n || Dt, [e, G] = o.useState(void 0), i = ((n)=>{
+    }), [X, q] = o.useState({}), G = (n)=>H ? n || Bt : n || $t, [e, J] = o.useState(void 0), i = ((n)=>{
         if (!e) return n;
         const u = (d)=>{
             const p = t.current.top > e.height;
@@ -123,28 +124,28 @@ const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500
             left: t.current.left < e.width ? t.current.right + e.width > window.innerWidth ? t.current.top < e.height ? "bottom" : "top" : "right" : n,
             bottom: t.current.bottom + e.height > window.innerHeight ? l("top") : l(n)
         })[n];
-    })(q(C.position)), y = yt() ? window.matchMedia("(pointer: coarse)").matches : !1, W = ()=>{
-        a && O(!1);
+    })(G(y.position)), R = Dt() ? window.matchMedia("(pointer: coarse)").matches : !1, W = ()=>{
+        a && C(!1);
     };
     o.useEffect(()=>(window.addEventListener("resize", W), ()=>{
             window.removeEventListener("resize", W);
         }));
     const $ = ()=>{
-        O(!1);
+        C(!1);
     }, T = ()=>{
-        R.current && (t.current = R.current.getBoundingClientRect(), O(!a));
-    }, J = ()=>{
+        O.current && (t.current = O.current.getBoundingClientRect(), C(!a));
+    }, Q = ()=>{
         a || T();
-    }, Q = (n)=>{
-        n.keyCode === ct && $();
     }, U = (n)=>{
+        n.keyCode === st && $();
+    }, Z = (n)=>{
         if (!e) return {};
         const u = e.width > t.current.width && t.current.left + t.current.width / 2 < e.width / 2 + 16 ? t.current.width / 2 : "50%";
         return n === "bottom" || n === "top" ? {
             left: u
         } : {};
     }, B = o.useCallback((n, u)=>{
-        if (Ct() || !e) return {};
+        if (Wt() || !e) return {};
         const l = e.width > t.current.width && t.current.left + t.current.width / 2 < e.width / 2 + 16 ? Math.round(e.width / 2 - t.current.width / 2) : 0, A = f || (u ? window.pageXOffset + t.current.left + t.current.width / 2 - u / 2 : window.pageXOffset + t.current.left + l + t.current.width / 2 - e.width / 2), d = t.current.left < e.width ? A : u ? t.current.left - u - m : t.current.left - e.width - m, p = t.current.left < e.width ? t.current.top < e.height ? window.pageYOffset + t.current.bottom + m : window.pageYOffset + t.current.top - m : f || window.pageYOffset + t.current.top + t.current.height / 2;
         return ({
             right: {
@@ -167,42 +168,42 @@ const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500
     }, [
         f,
         e
-    ]), b = (()=>C.width)(), Z = {
-        top: At,
-        bottom: Pt,
-        left: St,
-        right: Yt
-    }, _ = i && Ot({
-        [s.enterTransform]: It(i),
-        [s.exitTransform]: Nt(i),
-        [s.enterActiveAnimationName]: kt(i),
-        [s.enterDoneTransform]: Mt(i),
-        [s.shadowAlpha]: Lt(z),
-        [s.arrowBoxShadow]: Vt(i)
+    ]), b = (()=>y.width)(), _ = {
+        top: St,
+        bottom: Yt,
+        left: Ct,
+        right: Ot
+    }, tt = i && Rt({
+        [s.enterTransform]: Nt(i),
+        [s.exitTransform]: Lt(i),
+        [s.enterActiveAnimationName]: Vt(i),
+        [s.enterDoneTransform]: kt(i),
+        [s.shadowAlpha]: jt(F),
+        [s.arrowBoxShadow]: Kt(i)
     });
     return o.useEffect(()=>{
-        i && x.current && a && X(B(i, b || 0));
+        i && x.current && a && q(B(i, b || 0));
     }, [
         a,
         B,
         i,
         b
     ]), o.useEffect(()=>{
-        x.current && (x.current.getBoundingClientRect(), a && G(x.current.getBoundingClientRect()));
+        x.current && (x.current.getBoundingClientRect(), a && J(x.current.getBoundingClientRect()));
     }, [
         a
-    ]), /* @__PURE__ */ P(tt, {
+    ]), /* @__PURE__ */ P(et, {
         children: [
             /* @__PURE__ */ w("div", {
-                ref: R,
+                ref: O,
                 style: K,
-                className: ut,
+                className: lt,
                 onPointerOver: ()=>{
                     c.current && (clearTimeout(c.current), c.current = null), !h.current && (h.current = !0, V ? g.current = setTimeout(()=>{
                         g.current = null, T();
-                    }, Et) : T());
+                    }, Mt) : T());
                 },
-                onPointerLeave: y ? M : ()=>{
+                onPointerLeave: R ? M : ()=>{
                     if (g.current) {
                         clearTimeout(g.current), g.current = null, h.current = !1;
                         return;
@@ -211,8 +212,8 @@ const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500
                         h.current && (c.current = null, h.current = !1, T());
                     }, 100);
                 },
-                onFocus: J,
-                onKeyDown: Q,
+                onFocus: Q,
+                onKeyDown: U,
                 "touch-action": "auto",
                 role: "button",
                 tabIndex: 0,
@@ -221,48 +222,48 @@ const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500
                 "aria-label": L,
                 children: k
             }),
-            /* @__PURE__ */ P(it, {
+            /* @__PURE__ */ P(at, {
                 children: [
-                    a && y && /* @__PURE__ */ w(at, {
+                    a && R && /* @__PURE__ */ w(ct, {
                         onPress: $
                     }),
-                    /* @__PURE__ */ w(et, {
+                    /* @__PURE__ */ w(rt, {
                         in: a,
-                        timeout: Bt,
+                        timeout: It,
                         classNames: {
-                            enter: lt,
-                            enterActive: dt,
-                            enterDone: ft,
-                            exit: ht,
-                            exitActive: wt
+                            enter: dt,
+                            enterActive: ft,
+                            enterDone: ht,
+                            exit: wt,
+                            exitActive: mt
                         },
                         unmountOnExit: !0,
                         children: /* @__PURE__ */ P("div", _object_spread_props(_object_spread({
                             ref: x
-                        }, Rt(j, "Tooltip")), {
+                        }, yt(j, "Tooltip")), {
                             role: "tooltip",
                             id: D,
-                            className: E(mt, pt),
+                            className: E(pt, gt, z ? xt : ""),
                             style: _object_spread({
                                 width: b
-                            }, H, _),
+                            }, X, tt),
                             onPointerOver: ()=>{
                                 c.current && (clearTimeout(c.current), c.current = null);
                             },
-                            onPointerLeave: y ? M : ()=>{
+                            onPointerLeave: R ? M : ()=>{
                                 c.current = setTimeout(()=>{
                                     h.current && (c.current = null, h.current = !1, T());
                                 }, 100);
                             },
                             children: [
                                 /* @__PURE__ */ w("div", {
-                                    style: U(i),
-                                    className: E(gt, Z[i]),
+                                    style: Z(i),
+                                    className: E(Tt, _[i]),
                                     children: /* @__PURE__ */ w("div", {
-                                        className: xt
+                                        className: vt
                                     })
                                 }),
-                                (Y || S) && /* @__PURE__ */ P(st, {
+                                (Y || S) && /* @__PURE__ */ P(ut, {
                                     space: 4,
                                     children: [
                                         Y && /* @__PURE__ */ w(I, {
@@ -283,5 +284,5 @@ const Dt = "bottom", Wt = "top", $t = 12, m = 4 + $t, Bt = 500, v = 12, Et = 500
             })
         ]
     });
-}, oe = jt;
-export { oe as default };
+}, ae = zt;
+export { ae as default };

package/dist-es/touchable.js

@@ -52,7 +52,7 @@ function _object_spread_props(target, source) {
 }
 import { jsxs as I, jsx as l } from "react/jsx-runtime";
 import * as c from "react";
-import b from "classnames";
+import s from "classnames";
 import A from "./screen-reader-only.js";
 import { notTouchable as _, touchable as H, base as K } from "./touchable.css-mistica.js";
 import { useTheme as j } from "./hooks.js";
@@ -75,13 +75,14 @@ const L = function(e) {
         style: e.style,
         role: e.role,
         "aria-checked": e["aria-checked"],
+        "aria-disabled": e.disabled ? !0 : void 0,
         "aria-controls": e["aria-controls"],
         "aria-expanded": e["aria-expanded"],
         "aria-hidden": e["aria-hidden"],
         "aria-selected": e["aria-selected"],
         "aria-live": e["aria-live"],
         tabIndex: e.tabIndex
-    }, W(e.dataAttributes, "Touchable")), u = e.type ? e.type : "button", r = !!e.href && !!e.newTab, m = !r && !!e.href && !!e.loadOnTop, s = (a)=>{
+    }, W(e.dataAttributes, "Touchable")), u = e.type ? e.type : "button", r = !!e.href && !!e.newTab, m = !r && !!e.href && !!e.loadOnTop, b = (a)=>{
         e.stopPropagation && a.stopPropagation();
     }, h = (a)=>{
         e.onPress && e.onPress(a);
@@ -90,15 +91,15 @@ const L = function(e) {
             f.current = !1, a();
         }));
     }, x = (a)=>{
-        if (s(a), !i.length) {
+        if (b(a), !i.length) {
             h(a);
             return;
         }
         g(()=>h(a));
     }, R = (a)=>{
-        s(a), i.length && (a.preventDefault(), g(()=>L(k(), r, m)));
+        b(a), i.length && (a.preventDefault(), g(()=>L(k(), r, m)));
     }, D = (a)=>{
-        s(a), y();
+        b(a), y();
     }, w = (a)=>{
         (a.keyCode === S || a.keyCode === V) && (a.preventDefault(), a.currentTarget.click());
     };
@@ -153,14 +154,14 @@ const L = function(e) {
     }
     return /* @__PURE__ */ l("div", _object_spread_props(_object_spread({}, n), {
         ref: t,
-        className: b(n.className, _),
+        className: s(n.className, _),
         children: o
     }));
 }), $ = /*#__PURE__*/ c.forwardRef((e, t)=>/* @__PURE__ */ l(T, _object_spread_props(_object_spread({}, e), {
-        className: b(H, e.className),
+        className: s(H, e.className),
         ref: t
     }))), X = /*#__PURE__*/ c.forwardRef((e, t)=>/* @__PURE__ */ l(T, _object_spread_props(_object_spread({}, e), {
-        className: b(K, e.className),
+        className: s(K, e.className),
         ref: t
     }))), Y = $;
 export { X as BaseTouchable, Y as default };