@telefonica/mistica 14.34.0 → 14.35.0

package/dist/tooltip.js

@@ -6,23 +6,27 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return ae;
+        return se;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
-const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
-const _reacttransitiongroup = require("react-transition-group");
 const _hooks = require("./hooks.js");
 const _portal = require("./portal.js");
-const _overlay = /*#__PURE__*/ _interop_require_default(require("./overlay.js"));
-const _text = require("./text.js");
-const _keycodes = require("./utils/key-codes.js");
-const _stack = /*#__PURE__*/ _interop_require_default(require("./stack.js"));
+const _reacttransitiongroup = require("react-transition-group");
 const _tooltipcssmistica = require("./tooltip.css-mistica.js");
+const _stack = /*#__PURE__*/ _interop_require_default(require("./stack.js"));
+const _text = require("./text.js");
 const _dom = require("./utils/dom.js");
+const _keys = require("./utils/keys.js");
 const _environment = require("./utils/environment.js");
-const _css = require("./utils/css.js");
+const _helpers = require("./utils/helpers.js");
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _skincontractcssmistica = require("./skins/skin-contract.css-mistica.js");
+const _themevariantcontext = require("./theme-variant-context.js");
+const _common = require("./utils/common.js");
+const _tooltipcontextprovider = require("./tooltip-context-provider.js");
+const _platform = require("./utils/platform.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -121,224 +125,268 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-function _object_without_properties(source, excluded) {
-    if (source == null) return {};
-    var target = _object_without_properties_loose(source, excluded);
-    var key, i;
-    if (Object.getOwnPropertySymbols) {
-        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-        for(i = 0; i < sourceSymbolKeys.length; i++){
-            key = sourceSymbolKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-            target[key] = source[key];
-        }
+const at = (e)=>({
+        border: `1px solid ${e ? _skincontractcssmistica.vars.colors.backgroundContainer : _skincontractcssmistica.vars.colors.border}`
+    }), lt = 496, Dt = 300, Wt = 500, Vt = 100, c = 20, b = 6, E = b + c / 2 + 1, Bt = (e)=>{
+    switch(e){
+        case "left":
+            return `translateX(-${b}px)`;
+        case "right":
+            return `translateX(${b}px)`;
+        case "top":
+            return `translateY(-${b}px)`;
+        case "bottom":
+            return `translateY(${b}px)`;
+        default:
+            return "";
     }
-    return target;
-}
-function _object_without_properties_loose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-    for(i = 0; i < sourceKeys.length; i++){
-        key = sourceKeys[i];
-        if (excluded.indexOf(key) >= 0) continue;
-        target[key] = source[key];
+}, ft = (e)=>{
+    const O = parseFloat(getComputedStyle(e, null).paddingLeft) + parseFloat(getComputedStyle(e, null).paddingRight), m = parseFloat(getComputedStyle(e, null).paddingTop) + parseFloat(getComputedStyle(e, null).paddingBottom), w = e.offsetWidth - O, h = e.offsetHeight - m;
+    return {
+        width: w,
+        height: h
+    };
+}, ct = (e, O, m, w, h)=>{
+    if (!e || !O) return;
+    const { top: D, bottom: R, left: W, right: V } = e, I = w - R, g = h - V, M = D, n = W, { width: B, height: $ } = ft(O), S = B + E, d = $ + E, y = S <= Math.max(n, g), T = d <= Math.max(I, M);
+    if (!(!T && !y)) switch(m){
+        case "left":
+            return y ? S <= n ? "left" : "right" : I > M ? "bottom" : "top";
+        case "right":
+            return y ? S <= g ? "right" : "left" : I > M ? "bottom" : "top";
+        case "top":
+            return T ? d <= M ? "top" : "bottom" : n > g ? "left" : "right";
+        case "bottom":
+            return T ? d <= I ? "bottom" : "top" : n > g ? "left" : "right";
+        default:
+            return;
     }
-    return target;
-}
-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" ? _tooltipcssmistica.fadeInTopKeyframes : r === "bottom" ? _tooltipcssmistica.fadeInBottomKeyframes : _tooltipcssmistica.fadeInXKeyframes, jt = (r)=>r ? "1" : "0.2", Kt = (r)=>r === "top" ? `2px 2px 4px 0 rgba(0, 0, 0, ${_tooltipcssmistica.vars.shadowAlpha})` : r === "right" ? `0 0 4px 0 rgba(0, 0, 0, ${_tooltipcssmistica.vars.shadowAlpha})` : r === "left" ? `0 0 4px 0 rgba(0, 0, 0, ${_tooltipcssmistica.vars.shadowAlpha})` : r === "bottom" ? `-1px -1px 4px 0 rgba(0, 0, 0, ${_tooltipcssmistica.vars.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, R = _object_without_properties(_param, [
-        "children",
-        "extra",
-        "description",
-        "target",
-        "title",
-        "targetLabel",
-        "delay",
-        "dataAttributes",
-        "targetStyle",
-        "unstable_offsetX",
-        "textCenter"
+}, Xt = (param)=>{
+    let { children: e, extra: O, description: m, target: w, title: h, width: D, position: R = "top", dataAttributes: W, delay: V = !0, centerContent: I, open: g, textCenter: M } = param;
+    const n = (0, _hooks.useAriaId)(), { openTooltipId: B } = (0, _tooltipcontextprovider.useTooltipState)(), { openTooltip: $, closeTooltip: S } = (0, _tooltipcontextprovider.useSetTooltipState)(), [d, y] = _react.useState(), [T, J] = _react.useState(), X = _react.useRef(null), z = _react.useRef(null), [_, pt] = _react.useState(null), p = (0, _environment.isTouchableDevice)(), H = V ? Wt : 0, [Q, Y] = _react.useState(!1), [tt, P] = _react.useState(!1), G = g !== void 0, [et, K] = _react.useState(!1), v = G ? g : n === B, U = (0, _themevariantcontext.useIsInverseVariant)(), l = (0, _hooks.useBoundingRect)(X, v), dt = (0, _hooks.useBoundingRect)(z, v, !0), s = (0, _hooks.useWindowSize)(), x = _react.useCallback(()=>{
+        K(!1), Y(!1), P(!1);
+    }, []);
+    _react.useEffect(()=>{
+        v || x();
+    }, [
+        v,
+        x
+    ]), _react.useEffect(()=>{
+        if (!_ || !v) return;
+        const r = ct(l, _, R, s.height, s.width);
+        if (!r || !l) {
+            y(void 0), J(void 0), x();
+            return;
+        }
+        let o, t;
+        const { left: a, right: C, top: N, bottom: k } = l, { width: L, height: A } = ft(_), ot = s.width - L, rt = s.height - A, u = parseInt((0, _dom.getCssVarValue)(_skincontractcssmistica.vars.borderRadii.container)) || 8;
+        switch(r){
+            case "top":
+                o = {
+                    left: Math.max(0, Math.min(ot, (a + C - L) / 2)),
+                    top: N - A - c / 2,
+                    padding: `0px 0px ${E}px 0px`
+                }, t = {
+                    left: Math.max(u, Math.min(s.width - u - c, (a + C - c) / 2)),
+                    top: "100%"
+                };
+                break;
+            case "bottom":
+                o = {
+                    left: Math.max(0, Math.min(ot, (a + C - L) / 2)),
+                    top: k - b,
+                    padding: `${E}px 0px 0px 0px`
+                }, t = {
+                    left: Math.max(u, Math.min(s.width - u - c, (a + C - c) / 2)),
+                    bottom: "100%",
+                    transform: "rotate(180deg)"
+                };
+                break;
+            case "left":
+                o = {
+                    left: a - L - c / 2,
+                    top: Math.max(0, Math.min(rt, (N + k - A) / 2)),
+                    padding: `0px ${E}px 0px 0px`
+                }, t = {
+                    top: Math.max(u, Math.min(s.height - u - c, (N + k - c) / 2)),
+                    left: "100%",
+                    transform: "rotate(-90deg)",
+                    transformOrigin: "bottom"
+                };
+                break;
+            case "right":
+            default:
+                o = {
+                    left: C - b,
+                    top: Math.max(0, Math.min(rt, (N + k - A) / 2)),
+                    padding: `0px 0px 0px ${E}px`
+                }, t = {
+                    top: Math.max(u, Math.min(s.height - u - c, (N + k - c) / 2)),
+                    right: "100%",
+                    transform: "rotate(90deg)",
+                    transformOrigin: "bottom"
+                };
+                break;
+        }
+        typeof t.top == "number" && (t.top -= o.top, t.top = `${t.top / A * 100}%`), typeof t.left == "number" && (t.left -= o.left, t.left = `${t.left / L * 100}%`), (0, _helpers.isEqual)(o, d) || y(o), (0, _helpers.isEqual)(t, T) || J(t);
+    }, [
+        _,
+        l,
+        dt,
+        v,
+        R,
+        s,
+        d,
+        T,
+        U,
+        p,
+        n,
+        x
     ]);
-    const { isDarkMode: F } = (0, _hooks.useTheme)(), [a, C] = _react.useState(!1), { isTabletOrSmaller: H } = (0, _hooks.useScreenSize)(), D = (0, _hooks.useAriaId)(), h = _react.useRef(!1), c = _react.useRef(null), g = _react.useRef(null), y = _react.useRef(null), x = _react.useRef(null), t = _react.useRef({
-        top: 0,
-        right: 0,
-        left: 0,
-        bottom: 0,
-        width: 0,
-        height: 0
-    }), [X, q] = _react.useState({}), G = (n)=>H ? n || Bt : n || $t, [e, J] = _react.useState(void 0), i = ((n)=>{
-        if (!e) return n;
-        const u = (d)=>{
-            const p = t.current.top > e.height;
-            return t.current.left < e.width ? p ? "top" : "bottom" : d;
-        }, l = (d)=>t.current.right + e.width > window.innerWidth ? u("left") : d;
-        return ({
-            top: t.current.top < e.height ? l("bottom") : l(n),
-            right: l(n),
-            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];
-    })(G(R.position)), O = (0, _environment.isClientSide)() ? window.matchMedia("(pointer: coarse)").matches : !1, W = ()=>{
-        a && C(!1);
-    };
-    _react.useEffect(()=>(window.addEventListener("resize", W), ()=>{
-            window.removeEventListener("resize", W);
-        }));
-    const $ = ()=>{
-        C(!1);
-    }, T = ()=>{
-        y.current && (t.current = y.current.getBoundingClientRect(), C(!a));
-    }, Q = ()=>{
-        a || T();
-    }, U = (n)=>{
-        n.keyCode === _keycodes.TAB && $();
-    }, 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 = _react.useCallback((n, u)=>{
-        if ((0, _environment.isServerSide)() || !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: {
-                left: t.current.right + e.width > window.innerWidth ? d : t.current.right + m,
-                top: t.current.right + e.width > window.innerWidth ? p : f || window.pageYOffset + t.current.top + t.current.height / 2
-            },
-            left: {
-                left: d,
-                top: p
-            },
-            top: {
-                top: t.current.right + e.width > window.innerWidth ? p : window.pageYOffset + t.current.top - m,
-                left: t.current.right + e.width > window.innerWidth ? d : A
-            },
-            bottom: {
-                top: t.current.right + e.width > window.innerWidth ? p : window.pageYOffset + t.current.bottom + m,
-                left: t.current.right + e.width > window.innerWidth ? d : A
+    const j = _react.useRef(!1);
+    _react.useEffect(()=>{
+        const r = (a)=>{
+            switch(a.key){
+                case _keys.ESC:
+                    x();
+                    break;
+                case _keys.TAB:
+                    j.current = !0;
+                    break;
             }
-        })[n];
-    }, [
-        f,
-        e
-    ]), b = (()=>R.width)(), _ = {
-        top: _tooltipcssmistica.arrowTop,
-        bottom: _tooltipcssmistica.arrowBottom,
-        left: _tooltipcssmistica.arrowLeft,
-        right: _tooltipcssmistica.arrowRight
-    }, tt = i && (0, _css.applyCssVars)({
-        [_tooltipcssmistica.vars.enterTransform]: Nt(i),
-        [_tooltipcssmistica.vars.exitTransform]: Lt(i),
-        [_tooltipcssmistica.vars.enterActiveAnimationName]: Vt(i),
-        [_tooltipcssmistica.vars.enterDoneTransform]: kt(i),
-        [_tooltipcssmistica.vars.shadowAlpha]: jt(F),
-        [_tooltipcssmistica.vars.arrowBoxShadow]: Kt(i)
-    });
-    return _react.useEffect(()=>{
-        i && x.current && a && q(B(i, b || 0));
+        }, o = ()=>j.current = !1, t = (a)=>{
+            p && l && (a.clientX < l.left || a.clientX > l.right || a.clientY < l.top || a.clientY > l.bottom) && x();
+        };
+        return document.addEventListener("keydown", r, !1), document.addEventListener("keyup", o, !1), document.addEventListener("click", t, !1), ()=>{
+            document.removeEventListener("keydown", r, !1), document.removeEventListener("keyup", o, !1), document.removeEventListener("click", t, !1);
+        };
     }, [
-        a,
-        B,
-        i,
-        b
+        p,
+        x,
+        l
     ]), _react.useEffect(()=>{
-        x.current && (x.current.getBoundingClientRect(), a && J(x.current.getBoundingClientRect()));
+        G || (tt || Q || et ? $(n) : S(n));
     }, [
-        a
-    ]), /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        tt,
+        Q,
+        et,
+        n,
+        $,
+        S,
+        G
+    ]);
+    const ut = ct(l, _, R, s.height, s.width);
+    return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                ref: y,
-                style: K,
-                className: _tooltipcssmistica.wrapper,
-                onPointerOver: ()=>{
-                    c.current && (clearTimeout(c.current), c.current = null), !h.current && (h.current = !0, V ? g.current = setTimeout(()=>{
-                        g.current = null, T();
-                    }, Mt) : T());
+                ref: (r)=>{
+                    const o = r == null ? void 0 : r.firstElementChild;
+                    o && o !== X.current && (X.current = o);
+                },
+                onMouseOver: ()=>{
+                    p || P(!0);
+                },
+                onMouseLeave: ()=>{
+                    p || P(!1);
                 },
-                onPointerLeave: O ? M : ()=>{
-                    if (g.current) {
-                        clearTimeout(g.current), g.current = null, h.current = !1;
-                        return;
-                    }
-                    c.current = setTimeout(()=>{
-                        h.current && (c.current = null, h.current = !1, T());
-                    }, 100);
+                onClick: ()=>{
+                    p && P(!0);
                 },
-                onFocus: Q,
-                onKeyDown: U,
-                "touch-action": "auto",
-                role: "button",
-                tabIndex: 0,
-                "aria-describedby": D,
-                "aria-expanded": a,
-                "aria-label": L,
-                children: k
+                onFocus: ()=>{
+                    j.current && K(!0);
+                },
+                onBlur: ()=>{
+                    p || K(!1);
+                },
+                "aria-describedby": n,
+                children: w
             }),
-            /* @__PURE__ */ (0, _jsxruntime.jsxs)(_portal.Portal, {
-                children: [
-                    a && O && /* @__PURE__ */ (0, _jsxruntime.jsx)(_overlay.default, {
-                        onPress: $
-                    }),
-                    /* @__PURE__ */ (0, _jsxruntime.jsx)(_reacttransitiongroup.CSSTransition, {
-                        in: a,
-                        timeout: It,
-                        classNames: {
-                            enter: _tooltipcssmistica.enter,
-                            enterActive: _tooltipcssmistica.enterActive,
-                            enterDone: _tooltipcssmistica.enterDone,
-                            exit: _tooltipcssmistica.exit,
-                            exitActive: _tooltipcssmistica.exitActive
-                        },
-                        unmountOnExit: !0,
-                        children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({
-                            ref: x
-                        }, (0, _dom.getPrefixedDataAttributes)(j, "Tooltip")), {
+            /* @__PURE__ */ (0, _jsxruntime.jsx)(_portal.Portal, {
+                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_reacttransitiongroup.Transition, {
+                    in: v,
+                    nodeRef: z,
+                    timeout: (0, _platform.isRunningAcceptanceTest)() ? 0 : {
+                        enter: Dt + H,
+                        exit: Vt
+                    },
+                    mountOnEnter: !0,
+                    unmountOnExit: !0,
+                    children: (r)=>/* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({
+                            style: {
+                                /**
+               * Hack to prevent text from wrapping automatically when touching the viewport's edges,
+               * even if the content's width didn't reach the max width.
+               * https://stackoverflow.com/questions/66106629/how-to-disable-text-wrapping-when-viewport-border-is-reached
+               */ width: `calc(100vw + ${lt}px)`,
+                                top: 0,
+                                left: 0,
+                                position: "fixed",
+                                visibility: d ? "visible" : "hidden"
+                            }
+                        }, (0, _dom.getPrefixedDataAttributes)(W, "Tooltip")), {
                             role: "tooltip",
-                            id: D,
-                            className: (0, _classnames.default)(_tooltipcssmistica.container, _tooltipcssmistica.textAlign, z ? _tooltipcssmistica.textCenter : ""),
-                            style: _object_spread({
-                                width: b
-                            }, X, tt),
-                            onPointerOver: ()=>{
-                                c.current && (clearTimeout(c.current), c.current = null);
-                            },
-                            onPointerLeave: O ? M : ()=>{
-                                c.current = setTimeout(()=>{
-                                    h.current && (c.current = null, h.current = !1, T());
-                                }, 100);
-                            },
-                            children: [
-                                /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                                    style: Z(i),
-                                    className: (0, _classnames.default)(_tooltipcssmistica.arrowWrapper, _[i]),
-                                    children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                                        className: _tooltipcssmistica.arrow
-                                    })
+                            "aria-label": n,
+                            tabIndex: -1,
+                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                                className: (0, _classnames.default)(_tooltipcssmistica.container),
+                                style: _object_spread_props(_object_spread({
+                                    pointerEvents: r === "entered" ? "auto" : "none",
+                                    transform: Bt(ut)
+                                }, d, _tooltipcssmistica.tooltipTransitionClasses[r]), {
+                                    transition: r === "entering" ? `opacity .1s linear ${H}ms,transform .3s cubic-bezier(0.215,0.61,0.335,1) ${H}ms` : "opacity .1s linear"
                                 }),
-                                (Y || S) && /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
-                                    space: 4,
+                                ref: (0, _common.combineRefs)(pt, z),
+                                onMouseEnter: ()=>{
+                                    !p && r === "entered" && Y(!0);
+                                },
+                                onMouseLeave: ()=>{
+                                    p || Y(!1);
+                                },
+                                children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
+                                    className: _tooltipcssmistica.tooltip,
+                                    style: _object_spread({
+                                        width: D
+                                    }, at(U)),
                                     children: [
-                                        Y && /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
-                                            medium: !0,
-                                            children: Y
+                                        /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                                            className: (0, _classnames.default)(_tooltipcssmistica.content, I || M ? _tooltipcssmistica.tooltipCenter : void 0),
+                                            style: {
+                                                maxWidth: Math.min(lt, s.width)
+                                            },
+                                            children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_themevariantcontext.ThemeVariant, {
+                                                isInverse: !1,
+                                                children: [
+                                                    (h || m) && /* @__PURE__ */ (0, _jsxruntime.jsxs)(_stack.default, {
+                                                        space: 4,
+                                                        children: [
+                                                            h && /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
+                                                                medium: !0,
+                                                                children: h
+                                                            }),
+                                                            m && /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
+                                                                regular: !0,
+                                                                children: m
+                                                            })
+                                                        ]
+                                                    }),
+                                                    O || e
+                                                ]
+                                            })
                                         }),
-                                        S && /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
-                                            regular: !0,
-                                            children: S
+                                        /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                                            className: _tooltipcssmistica.arrowContainer,
+                                            style: T,
+                                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                                                className: (0, _classnames.default)(_tooltipcssmistica.arrow),
+                                                style: at(U)
+                                            })
                                         })
                                     ]
-                                }),
-                                N || r
-                            ]
+                                })
+                            })
                         }))
-                    })
-                ]
+                })
             })
         ]
     });
-}, ae = zt;
+}, se = Xt;

package/dist/touchable.css-mistica.js

@@ -21,4 +21,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./touchable.css.ts.vanilla.css-mistica.js");
-var f = "mhti6u1 _1y2v1nfe9", y = "mhti6u4", _ = "mhti6u1 _1y2v1nfe9 _1y2v1nf63 _1y2v1nf7c _1y2v1nf8l _1y2v1nf9u _1y2v1nfbc _1y2v1nfds _1y2v1nfbx _1y2v1nf30 _1y2v1nf62 _1y2v1nfeb";
+var f = "mhti6u1 _1y2v1nfea", y = "mhti6u4", _ = "mhti6u1 _1y2v1nfea _1y2v1nf63 _1y2v1nf7c _1y2v1nf8l _1y2v1nf9u _1y2v1nfbc _1y2v1nfds _1y2v1nfbx _1y2v1nf30 _1y2v1nf62 _1y2v1nfec";

package/dist/touchable.js

@@ -24,7 +24,7 @@ const _screenreaderonly = /*#__PURE__*/ _interop_require_default(require("./scre
 const _touchablecssmistica = require("./touchable.css-mistica.js");
 const _hooks = require("./hooks.js");
 const _platform = require("./utils/platform.js");
-const _keycodes = require("./utils/key-codes.js");
+const _keys = require("./utils/keys.js");
 const _dom = require("./utils/dom.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
@@ -128,7 +128,7 @@ const L = function(e) {
     let t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, d = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
     t ? window.open(e, "_blank") : d ? window.open(e, "_top") : document.location.href = e;
 }, T = /*#__PURE__*/ _react.forwardRef((e, t)=>{
-    const { texts: d, analytics: v, platformOverrides: N, Link: P, useHrefDecorator: E } = (0, _hooks.useTheme)(), C = E(), f = _react.useRef(!1);
+    const { texts: d, analytics: v, platformOverrides: N, Link: P, useHrefDecorator: E } = (0, _hooks.useTheme)(), x = E(), f = _react.useRef(!1);
     let l = [];
     e.trackingEvent && (Array.isArray(e.trackingEvent) ? l = e.trackingEvent : l = [
         e.trackingEvent
@@ -153,28 +153,28 @@ const L = function(e) {
         e.onPress && e.onPress(a);
     }, k = ()=>{
         var _e_to_pathname;
-        return e.href ? C(e.href) : e.to && e.fullPageOnWebView ? typeof e.to == "string" ? e.to : (_e_to_pathname = e.to.pathname) !== null && _e_to_pathname !== void 0 ? _e_to_pathname : "" : "";
+        return e.href ? x(e.href) : e.to && e.fullPageOnWebView ? typeof e.to == "string" ? e.to : (_e_to_pathname = e.to.pathname) !== null && _e_to_pathname !== void 0 ? _e_to_pathname : "" : "";
     }, y = ()=>Promise.all(l.map((a)=>v.logEvent(a))), g = (a)=>{
         f.current || (f.current = !0, y().finally(()=>{
             f.current = !1, a();
         }));
-    }, x = (a)=>{
+    }, R = (a)=>{
         if (s(a), !l.length) {
             h(a);
             return;
         }
         g(()=>h(a));
-    }, R = (a)=>{
+    }, C = (a)=>{
         s(a), l.length && (a.preventDefault(), g(()=>L(k(), r, m)));
     }, D = (a)=>{
         s(a), y();
     }, w = (a)=>{
-        (a.keyCode === _keycodes.ENTER || a.keyCode === _keycodes.SPACE) && (a.preventDefault(), a.currentTarget.click());
+        (a.key === _keys.ENTER || a.key === _keys.SPACE) && (a.preventDefault(), a.currentTarget.click());
     };
     if (e.href || e.to && e.fullPageOnWebView && (0, _platform.isInsideNovumNativeApp)(N)) return /* @__PURE__ */ (0, _jsxruntime.jsxs)("a", _object_spread_props(_object_spread({}, n), {
         "aria-label": e["aria-label"],
         "aria-labelledby": e["aria-labelledby"],
-        onClick: R,
+        onClick: C,
         onKeyDown: w,
         href: e.disabled ? void 0 : k(),
         target: (()=>{
@@ -216,7 +216,7 @@ const L = function(e) {
             "aria-labelledby": e["aria-labelledby"],
             type: u,
             ref: t,
-            onClick: x,
+            onClick: R,
             children: o
         }));
     }

package/dist/utils/aspect-ratio-support.css-mistica.js

@@ -24,6 +24,6 @@ _export(exports, {
 });
 require("../sprinkles.css.ts.vanilla.css-mistica.js");
 require("./aspect-ratio-support.css.ts.vanilla.css-mistica.js");
-var a = "yqswj62", n = "_1y2v1nfbx _1y2v1nfce _1y2v1nfeg _1y2v1nfev", e = {
+var a = "yqswj62", n = "_1y2v1nfbx _1y2v1nfce _1y2v1nfeh _1y2v1nfew", e = {
     aspectRatio: "var(--yqswj60)"
-}, y = "_1y2v1nfea _1y2v1nfdp _1y2v1nfdq _1y2v1nfb4";
+}, y = "_1y2v1nfeb _1y2v1nfdp _1y2v1nfdq _1y2v1nfb4";

package/dist/utils/environment.d.ts

@@ -1,2 +1,3 @@
 export declare const isServerSide: () => boolean;
 export declare const isClientSide: () => boolean;
+export declare const isTouchableDevice: () => boolean;

package/dist/utils/environment.js

@@ -14,6 +14,9 @@ _export(exports, {
     },
     isServerSide: function() {
         return e;
+    },
+    isTouchableDevice: function() {
+        return o;
     }
 });
-const e = ()=>typeof window > "u", i = ()=>!e();
+const e = ()=>typeof window > "u", i = ()=>!e(), o = ()=>i() ? window.matchMedia("(pointer: coarse)").matches : !1;

package/dist/utils/keys.d.ts

@@ -0,0 +1,8 @@
+export declare const LEFT = "ArrowLeft";
+export declare const UP = "ArrowUp";
+export declare const RIGHT = "ArrowRight";
+export declare const DOWN = "ArrowDown";
+export declare const ENTER = "Enter";
+export declare const ESC = "Escape";
+export declare const SPACE = " ";
+export declare const TAB = "Tab";