@telefonica/mistica 14.13.0 → 14.15.0

package/dist-es/text-field-base.css-mistica.js

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./text-field-base.css.ts.vanilla.css-mistica.js";
-var n = "rhey4tf _1y2v1nf7m _1y2v1nf82 _1y2v1nf64 _1y2v1nf6j", r = "rhey4t4", t = "rhey4ta _1y2v1nf5z _1y2v1nf8r rhey4t1 _1y2v1nfa2 _1y2v1nf97 _1y2v1nf1w _1y2v1nf8b", e = "rhey4tb", f = "rhey4tc", _ = "_1y2v1nf6w _1y2v1nf7a", a = "rhey4to _1y2v1nf91 _1y2v1nf64 _1y2v1nf6j _1y2v1nfaj", h = "_1y2v1nf3e", i = "rhey4tj _1y2v1nf7n _1y2v1nf82", o = "rhey4tl _1y2v1nf78", l = "_1y2v1nf6w _1y2v1nf7a", u = "rhey4th _1y2v1nf7n _1y2v1nf81 _1y2v1nf64 _1y2v1nf6j _1y2v1nf8r _1y2v1nf60", p = "rhey4tr _1y2v1nf60", b = "rhey4t6 _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x rhey4t1 _1y2v1nfa2 _1y2v1nf97 _1y2v1nf1w _1y2v1nf8b", x = "rhey4t7", m = "rhey4t8";
-export { n as endIcon, r as fullWidth, t as input, e as inputFirefoxStyles, f as inputWithLabel, _ as inputWithoutLabel, a as menuItem, h as menuItemSelected, i as prefix, o as prefixWithLabel, l as prefixWithoutLabel, u as startIcon, p as suggestionsContainer, b as textArea, x as textAreaWithLabel, m as textAreaWithoutLabel };
+var n = "rhey4tf _1y2v1nf7o _1y2v1nf85 _1y2v1nf64 _1y2v1nf6j", r = "rhey4t4", t = "rhey4ta _1y2v1nf5z _1y2v1nf8w rhey4t1 _1y2v1nfaa _1y2v1nf9d _1y2v1nf1w _1y2v1nf8f", f = "rhey4tb", e = "rhey4tc", _ = "_1y2v1nf6w _1y2v1nf7b", a = "rhey4to _1y2v1nf97 _1y2v1nf64 _1y2v1nf6j _1y2v1nfar", h = "_1y2v1nf3e", i = "rhey4tj _1y2v1nf7p _1y2v1nf85", o = "rhey4tl _1y2v1nf79", l = "_1y2v1nf6w _1y2v1nf7b", p = "rhey4th _1y2v1nf7p _1y2v1nf84 _1y2v1nf64 _1y2v1nf6j _1y2v1nf8w _1y2v1nf60", u = "rhey4tr _1y2v1nf60", b = "rhey4t6 _1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 rhey4t1 _1y2v1nfaa _1y2v1nf9d _1y2v1nf1w _1y2v1nf8f", x = "rhey4t7", W = "rhey4t8";
+export { n as endIcon, r as fullWidth, t as input, f as inputFirefoxStyles, e as inputWithLabel, _ as inputWithoutLabel, a as menuItem, h as menuItemSelected, i as prefix, o as prefixWithLabel, l as prefixWithoutLabel, p as startIcon, u as suggestionsContainer, b as textArea, x as textAreaWithLabel, W as textAreaWithoutLabel };

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./text-field-components.css.ts.vanilla.css-mistica.js";
-var _ = 328, a = 12, n = 0.78, f = 0.75, e = "_15k6ur97", y = "_1y2v1nfak _1y2v1nfa1 _1y2v1nf64 _1y2v1nfaa _1y2v1nf5z", i = "_15k6ur96 _1y2v1nf64 _1y2v1nf6a", l = "_15k6ur9e", t = "_15k6ur9d _1y2v1nf92", k = "_1y2v1nf8b", u = "_1y2v1nf7n _1y2v1nf82 _1y2v1nf64", L = "_15k6ur9g", d = "_15k6ur91 _1y2v1nf60 _1y2v1nfam _1y2v1nf8y _1y2v1nf64 _1y2v1nf69 _1y2v1nfb4", E = "_15k6ur93 _1y2v1nfak _1y2v1nf6n", T = "_15k6ur9h", h = "_15k6ur99 _1y2v1nf8b", o = "_15k6ur9i", b = "_15k6ur94";
-export { _ as DEFAULT_WIDTH, a as LABEL_LEFT_POSITION, n as LABEL_SCALE_DESKTOP, f as LABEL_SCALE_MOBILE, e as disabled, y as field, i as fieldContainer, l as fieldMulti, t as fieldSingle, k as fullWidth, u as helperContainer, L as helperText, d as labelContainer, E as labelText, T as leftText, h as normalWidth, o as rightText, b as shrinked };
+var _ = 328, a = 12, n = 0.78, f = 0.75, e = "_15k6ur97", y = "_1y2v1nfas _1y2v1nfa9 _1y2v1nf64 _1y2v1nfai _1y2v1nf5z", i = "_15k6ur96 _1y2v1nf64 _1y2v1nf6a", l = "_15k6ur9e", t = "_15k6ur9d _1y2v1nf98", u = "_1y2v1nf8f", k = "_1y2v1nf7p _1y2v1nf85 _1y2v1nf64", d = "_15k6ur9g", L = "_15k6ur91 _1y2v1nf60 _1y2v1nfau _1y2v1nf94 _1y2v1nf64 _1y2v1nf69 _1y2v1nfbd", E = "_15k6ur93 _1y2v1nfas _1y2v1nf6n", T = "_15k6ur9h", h = "_15k6ur99 _1y2v1nf8f", o = "_15k6ur9i", p = "_15k6ur94";
+export { _ as DEFAULT_WIDTH, a as LABEL_LEFT_POSITION, n as LABEL_SCALE_DESKTOP, f as LABEL_SCALE_MOBILE, e as disabled, y as field, i as fieldContainer, l as fieldMulti, t as fieldSingle, u as fullWidth, k as helperContainer, d as helperText, L as labelContainer, E as labelText, T as leftText, h as normalWidth, o as rightText, p as shrinked };

package/dist-es/text-link.css-mistica.js

@@ -1,8 +1,8 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./text-link.css.ts.vanilla.css-mistica.js";
-var v = {
-    default: "_1m1n0pr1 _1y2v1nf8c _1y2v1nf67 _1y2v1nfaj _1y2v1nf27",
-    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nf8c _1y2v1nf67 _1y2v1nfaj _1y2v1nf28",
-    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nf8c _1y2v1nf67 _1y2v1nfaj _1y2v1nf27"
+var r = {
+    default: "_1m1n0pr1 _1y2v1nf8g _1y2v1nf67 _1y2v1nfar _1y2v1nf27",
+    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nf8g _1y2v1nf67 _1y2v1nfar _1y2v1nf28",
+    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nf8g _1y2v1nf67 _1y2v1nfar _1y2v1nf27"
 };
-export { v as variants };
+export { r as variants };

package/dist-es/text.js

@@ -80,7 +80,7 @@ function _object_without_properties_loose(source, excluded) {
 import { jsx as r } from "react/jsx-runtime";
 import * as R from "react";
 import $ from "classnames";
-import { assignInlineVars as S } from "@vanilla-extract/dynamic";
+import { assignInlineVars as L } from "@vanilla-extract/dynamic";
 import { useIsInverseVariant as j } from "./theme-variant-context.js";
 import { pxToRem as p } from "./utils/css.js";
 import { getPrefixedDataAttributes as B } from "./utils/dom.js";
@@ -93,7 +93,7 @@ const J = {
     medium: 500,
     bold: 700
 }, K = (e)=>e === !0 ? 1 : e || "initial", n = (param)=>{
-    let { weight: e , color: i = m.colors.textPrimary , decoration: t , truncate: o , transform: g , wordBreak: c = !0 , hyphens: f , as: z = "span" , children: h , size: d , mobileSize: u = d , desktopSize: b = d , lineHeight: T , mobileLineHeight: k = T , desktopLineHeight: L = T , letterSpacing: H , textAlign: w , textShadow: v , id: A , role: P , "aria-level": y , dataAttributes: I  } = param;
+    let { weight: e , color: i = m.colors.textPrimary , decoration: t , truncate: o , transform: g , wordBreak: c = !0 , hyphens: S , as: z = "span" , children: h , size: u , mobileSize: d = u , desktopSize: b = u , lineHeight: T , mobileLineHeight: f = T , desktopLineHeight: k = T , letterSpacing: w , textAlign: H , textShadow: v , id: A , role: P , "aria-level": y , dataAttributes: I  } = param;
     const W = j(), V = K(o), C = {
         [m.colors.textPrimary]: m.colors.textPrimaryInverse,
         [m.colors.textSecondary]: m.colors.textSecondaryInverse,
@@ -103,12 +103,12 @@ const J = {
     const D = $(E, c ? N : q, {
         [F]: o === 1 || o === !0,
         [G]: o && o > 1
-    }), M = S({
-        [x.mobileSize]: u ? p(u) : "",
-        [x.mobileLineHeight]: k ? p(k) : "",
+    }), M = L({
+        [x.mobileSize]: d ? p(d) : "",
+        [x.mobileLineHeight]: f ? p(f) : "",
         [x.desktopSize]: b ? p(b) : "",
-        [x.desktopLineHeight]: L ? p(L) : ""
-    }), O = o ? S({
+        [x.desktopLineHeight]: k ? p(k) : ""
+    }), O = o ? L({
         [x.lineClamp]: String(V)
     }) : {};
     var _C_i;
@@ -119,14 +119,14 @@ const J = {
         "aria-level": y
     }, B(I)), {
         style: _object_spread_props(_object_spread({}, M, O), {
-            hyphens: f,
-            letterSpacing: H,
+            hyphens: S,
+            letterSpacing: w,
             fontWeight: e ? J[e] : "inherit",
             textTransform: g || "inherit",
             textDecoration: t !== null && t !== void 0 ? t : "inherit",
             overflowWrap: c ? "anywhere" : "inherit",
             color: W ? (_C_i = C[i]) !== null && _C_i !== void 0 ? _C_i : i : i,
-            textAlign: w,
+            textAlign: H,
             textShadow: v
         })
     }), h);
@@ -134,6 +134,7 @@ const J = {
     if (e.light) return "light";
     if (e.regular) return "regular";
     if (e.medium) return "medium";
+    if (e.weight) return e.weight;
 }, s = (param)=>{
     let { forceMobileSizes: e , mobileSize: i , mobileLineHeight: t , desktopSize: o , desktopLineHeight: g  } = param;
     return e ? {

package/dist-es/theme-context-provider.js

@@ -26,107 +26,111 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as e, jsxs as E, Fragment as R } from "react/jsx-runtime";
+import { jsx as r, jsxs as S, Fragment as y } from "react/jsx-runtime";
 import * as a from "react";
-import { assignInlineVars as h } from "@vanilla-extract/dynamic";
-import A from "./dialog.js";
-import H from "./screen-size-context-provider.js";
-import S from "./aria-id-getter-context.js";
-import { getTexts as y, dimensions as N, AnchorLink as O, NAVBAR_HEIGHT_MOBILE as L } from "./theme.js";
-import { getPlatform as g, isInsideNovumNativeApp as w } from "./utils/platform.js";
-import F from "./theme-context.js";
-import { useIsomorphicLayoutEffect as $ } from "./hooks.js";
-import V from "./tab-focus.js";
-import j from "./modal-context-provider.js";
-import { DocumentVisibilityProvider as _ } from "./utils/document-visibility.js";
-import { AspectRatioSupportProvider as B } from "./utils/aspect-ratio-support.js";
-import { TrackingConfig as z } from "./utils/analytics.js";
-import { vars as G } from "./skins/skin-contract.css-mistica.js";
-import { fromHexToRgb as q } from "./utils/color.js";
-import { defaultTextPresetsConfig as r, defaultBorderRadiiConfig as W } from "./skins/defaults.js";
-const J = "(prefers-color-scheme: dark)", K = ()=>{
+import { assignInlineVars as N } from "@vanilla-extract/dynamic";
+import O from "./dialog.js";
+import L from "./screen-size-context-provider.js";
+import w from "./aria-id-getter-context.js";
+import { getTexts as F, dimensions as $, AnchorLink as h, NAVBAR_HEIGHT_MOBILE as V } from "./theme.js";
+import { getPlatform as D, isInsideNovumNativeApp as j } from "./utils/platform.js";
+import _ from "./theme-context.js";
+import { useIsomorphicLayoutEffect as B } from "./hooks.js";
+import z from "./tab-focus.js";
+import G from "./modal-context-provider.js";
+import { DocumentVisibilityProvider as q } from "./utils/document-visibility.js";
+import { AspectRatioSupportProvider as W } from "./utils/aspect-ratio-support.js";
+import { TrackingConfig as J } from "./utils/analytics.js";
+import { vars as K } from "./skins/skin-contract.css-mistica.js";
+import { fromHexToRgb as Q } from "./utils/color.js";
+import { defaultTextPresetsConfig as e, defaultBorderRadiiConfig as U } from "./skins/defaults.js";
+const X = "(prefers-color-scheme: dark)", Y = ()=>{
     const [t, c] = a.useState(!1);
-    return $(()=>{
+    return B(()=>{
         if (!window.matchMedia) return;
-        const o = window.matchMedia(J), s = ()=>{
+        const o = window.matchMedia(X), s = ()=>{
             c(o.matches);
         };
         return o.addListener(s), s(), ()=>o.removeListener(s);
     }, []), t;
-}, Q = ()=>(t)=>t, U = (t)=>({
-        headerMobileHeight: (t == null ? void 0 : t.headerMobileHeight) === "mistica" ? L : t == null ? void 0 : t.headerMobileHeight
-    }), X = (param)=>{
+}, Z = ()=>(t)=>t, tt = (t)=>({
+        headerMobileHeight: (t == null ? void 0 : t.headerMobileHeight) === "mistica" ? V : t == null ? void 0 : t.headerMobileHeight
+    }), et = (param)=>{
     let { theme: t , children: c , as: o  } = param;
     var _t_colorScheme, _t_skin_borderRadii;
-    const s = a.useRef(1), M = a.useCallback(()=>`aria-id-hook-${s.current++}`, []), T = K(), u = (_t_colorScheme = t.colorScheme) !== null && _t_colorScheme !== void 0 ? _t_colorScheme : "auto", C = t.skin.colors, D = _object_spread({}, t.skin.colors, t.skin.darkModeColors), f = u === "auto" && T || u === "dark", p = f ? D : C, k = a.useMemo(()=>{
-        var i, n, l, m, x, P, b;
-        const d = _object_spread({
-            platform: g(),
-            insideNovumNativeApp: w()
+    const s = a.useRef(1), I = a.useCallback(()=>`aria-id-hook-${s.current++}`, []), E = Y(), m = (_t_colorScheme = t.colorScheme) !== null && _t_colorScheme !== void 0 ? _t_colorScheme : "auto", R = t.skin.colors, A = _object_spread({}, t.skin.colors, t.skin.darkModeColors), u = m === "auto" && E || m === "dark", k = u ? A : R, p = a.useMemo(()=>{
+        var i, n, d, x, f, P, b, g, M, T, C;
+        const l = _object_spread({
+            platform: D(),
+            insideNovumNativeApp: j()
         }, t.platformOverrides);
         var _t_Link, _t_useHrefDecorator;
         return {
             skinName: t.skin.name,
             i18n: t.i18n,
-            platformOverrides: d,
-            texts: _object_spread({}, y(t.i18n.locale), t.texts),
+            platformOverrides: l,
+            texts: _object_spread({}, F(t.i18n.locale), t.texts),
             analytics: _object_spread({
                 logEvent: ()=>Promise.resolve(),
                 eventFormat: "universal-analytics"
             }, t.analytics),
-            dimensions: _object_spread({}, N, U(t.dimensions)),
+            dimensions: _object_spread({}, $, tt(t.dimensions)),
             textPresets: {
-                text5: _object_spread({}, r.text5, (i = t.skin.textPresets) == null ? void 0 : i.text5),
-                text6: _object_spread({}, r.text6, (n = t.skin.textPresets) == null ? void 0 : n.text6),
-                text7: _object_spread({}, r.text7, (l = t.skin.textPresets) == null ? void 0 : l.text7),
-                text8: _object_spread({}, r.text8, (m = t.skin.textPresets) == null ? void 0 : m.text8),
-                text9: _object_spread({}, r.text9, (x = t.skin.textPresets) == null ? void 0 : x.text9),
-                text10: _object_spread({}, r.text10, (P = t.skin.textPresets) == null ? void 0 : P.text10),
-                cardTitle: _object_spread({}, r.cardTitle, (b = t.skin.textPresets) == null ? void 0 : b.cardTitle)
+                text5: _object_spread({}, e.text5, (i = t.skin.textPresets) == null ? void 0 : i.text5),
+                text6: _object_spread({}, e.text6, (n = t.skin.textPresets) == null ? void 0 : n.text6),
+                text7: _object_spread({}, e.text7, (d = t.skin.textPresets) == null ? void 0 : d.text7),
+                text8: _object_spread({}, e.text8, (x = t.skin.textPresets) == null ? void 0 : x.text8),
+                text9: _object_spread({}, e.text9, (f = t.skin.textPresets) == null ? void 0 : f.text9),
+                text10: _object_spread({}, e.text10, (P = t.skin.textPresets) == null ? void 0 : P.text10),
+                cardTitle: _object_spread({}, e.cardTitle, (b = t.skin.textPresets) == null ? void 0 : b.cardTitle),
+                button: _object_spread({}, e.button, (g = t.skin.textPresets) == null ? void 0 : g.button),
+                link: _object_spread({}, e.link, (M = t.skin.textPresets) == null ? void 0 : M.link),
+                title1: _object_spread({}, e.title1, (T = t.skin.textPresets) == null ? void 0 : T.title1),
+                indicator: _object_spread({}, e.indicator, (C = t.skin.textPresets) == null ? void 0 : C.indicator)
             },
-            Link: (_t_Link = t.Link) !== null && _t_Link !== void 0 ? _t_Link : O,
-            isDarkMode: f,
-            isIos: g(d) === "ios",
-            useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : Q,
+            Link: (_t_Link = t.Link) !== null && _t_Link !== void 0 ? _t_Link : h,
+            isDarkMode: u,
+            isIos: D(l) === "ios",
+            useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : Z,
             useId: t.useId
         };
     }, [
         t,
-        f
-    ]), I = Object.fromEntries(Object.entries(p).map((param)=>{
-        let [d, i] = param;
+        u
+    ]), H = Object.fromEntries(Object.entries(k).map((param)=>{
+        let [l, i] = param;
         let n = "";
         if (i.startsWith("#")) {
-            const [l, m, x] = q(i);
-            n = `${l}, ${m}, ${x}`;
+            const [d, x, f] = Q(i);
+            n = `${d}, ${x}, ${f}`;
         }
         return [
-            d,
+            l,
             n
         ];
-    })), v = h(G, {
-        colors: p,
-        rawColors: I,
-        borderRadii: (_t_skin_borderRadii = t.skin.borderRadii) !== null && _t_skin_borderRadii !== void 0 ? _t_skin_borderRadii : W
+    })), v = N(K, {
+        colors: k,
+        rawColors: H,
+        borderRadii: (_t_skin_borderRadii = t.skin.borderRadii) !== null && _t_skin_borderRadii !== void 0 ? _t_skin_borderRadii : U
     });
-    return /* @__PURE__ */ e(V, {
+    return /* @__PURE__ */ r(z, {
         disabled: !t.enableTabFocus,
-        children: /* @__PURE__ */ e(j, {
-            children: /* @__PURE__ */ e(F.Provider, {
-                value: k,
-                children: /* @__PURE__ */ e(z, {
-                    eventFormat: k.analytics.eventFormat,
-                    children: /* @__PURE__ */ e(B, {
-                        children: /* @__PURE__ */ e(_, {
-                            children: /* @__PURE__ */ e(S.Provider, {
-                                value: M,
-                                children: /* @__PURE__ */ e(H, {
-                                    children: /* @__PURE__ */ e(A, {
+        children: /* @__PURE__ */ r(G, {
+            children: /* @__PURE__ */ r(_.Provider, {
+                value: p,
+                children: /* @__PURE__ */ r(J, {
+                    eventFormat: p.analytics.eventFormat,
+                    children: /* @__PURE__ */ r(W, {
+                        children: /* @__PURE__ */ r(q, {
+                            children: /* @__PURE__ */ r(w.Provider, {
+                                value: I,
+                                children: /* @__PURE__ */ r(L, {
+                                    children: /* @__PURE__ */ r(O, {
                                         children: o ? /*#__PURE__*/ a.createElement(o, {
                                             style: v
-                                        }, c) : /* @__PURE__ */ E(R, {
+                                        }, c) : /* @__PURE__ */ S(y, {
                                             children: [
-                                                (process.env.NODE_ENV !== "test" || process.env.SSR_TEST) && /* @__PURE__ */ e("style", {
+                                                (process.env.NODE_ENV !== "test" || process.env.SSR_TEST) && /* @__PURE__ */ r("style", {
                                                     children: `:root {${v}}`
                                                 }),
                                                 c
@@ -141,5 +145,5 @@ const J = "(prefers-color-scheme: dark)", K = ()=>{
             })
         })
     });
-}, pt = X;
-export { pt as default, K as useIsOsDarkModeEnabled };
+}, bt = et;
+export { bt as default, Y as useIsOsDarkModeEnabled };

package/dist-es/title.js

@@ -26,56 +26,59 @@ function _object_spread(target) {
     }
     return target;
 }
-import { jsx as r, jsxs as m } from "react/jsx-runtime";
-import { Text1 as l, Text5 as s, Text2 as c } from "./text.js";
-import p from "./inline.js";
-import u from "./box.js";
-import { vars as d } from "./skins/skin-contract.css-mistica.js";
-const a = (param)=>{
-    let { title: e , right: t  } = param;
-    return t ? /* @__PURE__ */ m(p, {
+import { jsx as r, jsxs as l } from "react/jsx-runtime";
+import { Text1 as c, Text5 as p, Text2 as f } from "./text.js";
+import x from "./inline.js";
+import d from "./box.js";
+import { vars as h } from "./skins/skin-contract.css-mistica.js";
+import { useTheme as s } from "./hooks.js";
+const m = (param)=>{
+    let { title: t , right: e  } = param;
+    const { textPresets: o  } = s();
+    return e ? /* @__PURE__ */ l(x, {
         space: "between",
         alignItems: "baseline",
         children: [
-            e,
-            /* @__PURE__ */ r(u, {
+            t,
+            /* @__PURE__ */ r(d, {
                 paddingLeft: 16,
-                children: /* @__PURE__ */ r(c, {
-                    regular: !0,
-                    children: t
+                children: /* @__PURE__ */ r(f, {
+                    weight: o.link.weight,
+                    children: e
                 })
             })
         ]
-    }) : e;
-}, g = (param)=>/* @__PURE__ */ {
-    let { children: e , as: t = "h3" , id: o , right: n , dataAttributes: i  } = param;
-    return r(a, {
-        title: /* @__PURE__ */ r(l, {
-            color: d.colors.textSecondary,
+    }) : t;
+}, k = (param)=>{
+    let { children: t , as: e = "h3" , id: o , right: i , dataAttributes: n  } = param;
+    const { textPresets: a  } = s();
+    return /* @__PURE__ */ r(m, {
+        title: /* @__PURE__ */ r(c, {
+            color: h.colors.textSecondary,
             transform: "uppercase",
-            medium: !0,
-            as: t,
+            weight: a.title1.weight,
+            as: e,
             id: o,
             dataAttributes: _object_spread({
                 "component-name": "Title1"
-            }, i),
+            }, n),
             wordBreak: !1,
-            children: e
+            children: t
         }),
-        right: n
+        right: i
     });
-}, j = (param)=>/* @__PURE__ */ {
-    let { children: e , as: t = "h3" , id: o , right: n , dataAttributes: i  } = param;
-    return r(a, {
-        title: /* @__PURE__ */ r(s, {
-            as: t,
+}, y = (param)=>/* @__PURE__ */ {
+    let { children: t , as: e = "h3" , id: o , right: i , dataAttributes: n  } = param;
+    return r(m, {
+        title: /* @__PURE__ */ r(p, {
+            as: e,
             id: o,
             dataAttributes: _object_spread({
                 "component-name": "Title2"
-            }, i),
-            children: e
+            }, n),
+            children: t
         }),
-        right: n
+        right: i
     });
 };
-export { g as Title1, j as Title2 };
+export { k as Title1, y as Title2 };

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 _1y2v1nf60 _1y2v1nfam _1y2v1nf8h _1y2v1nf8w _1y2v1nfa4 _1y2v1nf31 _1y2v1nfa1", t = "_1xhatbpe", _ = "_1xhatbpf", n = "_1xhatbpd", e = "_1xhatbpc", f = "_1y2v1nf60 _1y2v1nf8j _1y2v1nf8w _1y2v1nfak _1y2v1nf2", p = "_1xhatbpj _1y2v1nf6u _1y2v1nf78 _1y2v1nf7m _1y2v1nf80 _1y2v1nf60 _1y2v1nfb5 _1y2v1nf8c _1y2v1nfad _1y2v1nfa1", o = "_1xhatbpk", h = "_1xhatbpl", x = "_1xhatbpm", y = "_1xhatbpn", b = "_1xhatbpo", m = "_1xhatbp6", i = "_1xhatbp7", w = "_1xhatbp8", s = {
+var v = "_1xhatbpb _1y2v1nf60 _1y2v1nfau _1y2v1nf8l _1y2v1nf91 _1y2v1nfac _1y2v1nf31 _1y2v1nfa9", t = "_1xhatbpe", _ = "_1xhatbpf", n = "_1xhatbpd", e = "_1xhatbpc", f = "_1y2v1nf60 _1y2v1nf8o _1y2v1nf91 _1y2v1nfas _1y2v1nf2", p = "_1xhatbpj _1y2v1nf6u _1y2v1nf79 _1y2v1nf7o _1y2v1nf83 _1y2v1nf60 _1y2v1nfbe _1y2v1nf8g _1y2v1nfal _1y2v1nfa9", o = "_1xhatbpk", x = "_1xhatbpl", y = "_1xhatbpm", h = "_1xhatbpn", b = "_1xhatbpo", m = "_1xhatbp6", i = "_1xhatbp7", w = "_1xhatbp8", s = {
     shadowAlpha: "var(--_1xhatbp0)",
     enterTransform: "var(--_1xhatbp1)",
     enterDoneTransform: "var(--_1xhatbp2)",
     exitTransform: "var(--_1xhatbp3)",
     enterActiveAnimationName: "var(--_1xhatbp4)",
     arrowBoxShadow: "var(--_1xhatbp5)"
-}, d = "_1y2v1nf68";
-export { v as arrow, t as arrowBottom, _ as arrowLeft, n as arrowRight, e as arrowTop, f as arrowWrapper, p as container, o as enter, h as enterActive, x as enterDone, y as exit, b as exitActive, m as fadeInBottomKeyframes, i as fadeInTopKeyframes, w as fadeInXKeyframes, s as vars, d as wrapper };
+}, c = "_1y2v1nf68";
+export { v as arrow, t as arrowBottom, _ as arrowLeft, n as arrowRight, e as arrowTop, f as arrowWrapper, p as container, o as enter, x as enterActive, y as enterDone, h as exit, b as exitActive, m as fadeInBottomKeyframes, i as fadeInTopKeyframes, w as fadeInXKeyframes, s as vars, c as wrapper };

package/dist-es/tooltip.js

@@ -84,14 +84,15 @@ import { CSSTransition as V } from "react-transition-group";
 import { useTheme as j, useScreenSize as q, useAriaId as G } from "./hooks.js";
 import { Portal as H } from "./portal.js";
 import J from "./overlay.js";
-import { Text2 as S } from "./text.js";
+import { Text2 as O } from "./text.js";
 import { TAB as Q } from "./utils/key-codes.js";
 import U from "./stack.js";
 import { vars as n, wrapper as Z, enter as _, enterActive as tt, enterDone as et, exit as rt, exitActive as nt, container as ot, arrowWrapper as at, arrow as it, fadeInTopKeyframes as st, fadeInBottomKeyframes as ct, fadeInXKeyframes as lt, arrowTop as ut, arrowBottom as ft, arrowLeft as mt, arrowRight as dt } from "./tooltip.css-mistica.js";
 import { assignInlineVars as pt } from "@vanilla-extract/dynamic";
 import { getPrefixedDataAttributes as ht } from "./utils/dom.js";
-const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500, d = 12, vt = 500, R = ()=>{}, At = (t)=>t || Tt, Yt = (t)=>t === "bottom" ? `translateY(${d}px)` : t === "top" ? `translateY(calc(-100% - ${d}px))` : t === "right" ? `translateX(${d}px) translateY(-50%)` : t === "left" ? `translateX(-${d}px) translateY(-50%)` : `translateY(-${d}px)`, yt = (t)=>t === "top" ? "translateY(-100%)" : t === "bottom" ? "translateY(0)" : "translateY(-50%)", Pt = (t)=>t === "bottom" ? "translateY(0)" : t === "top" ? "translateY(-100%)" : t === "right" || t === "left" ? "translateX(0px) translateY(-50%)" : "translateY(0px)", Dt = (t)=>t === "top" ? st : t === "bottom" ? ct : lt, Ot = (t)=>t ? "1" : "0.2", St = (t)=>t === "top" ? `2px 2px 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : t === "right" ? `0 0 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : t === "left" ? `0 0 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : t === "bottom" ? `-1px -1px 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : "", Rt = (_param)=>{
-    var { children: t , extra: $ , description: g , target: I , title: x , targetLabel: B , delay: C = !0 , dataAttributes: E  } = _param, Y = _object_without_properties(_param, [
+import { isClientSide as gt, isServerSide as wt } from "./utils/environment.js";
+const xt = "bottom", Tt = "top", bt = 12, h = 4 + bt, g = 16, vt = 340, At = 500, d = 12, Yt = 500, R = ()=>{}, Pt = (t)=>t || vt, St = (t)=>t === "bottom" ? `translateY(${d}px)` : t === "top" ? `translateY(calc(-100% - ${d}px))` : t === "right" ? `translateX(${d}px) translateY(-50%)` : t === "left" ? `translateX(-${d}px) translateY(-50%)` : `translateY(-${d}px)`, yt = (t)=>t === "top" ? "translateY(-100%)" : t === "bottom" ? "translateY(0)" : "translateY(-50%)", Dt = (t)=>t === "bottom" ? "translateY(0)" : t === "top" ? "translateY(-100%)" : t === "right" || t === "left" ? "translateX(0px) translateY(-50%)" : "translateY(0px)", Ot = (t)=>t === "top" ? st : t === "bottom" ? ct : lt, Rt = (t)=>t ? "1" : "0.2", $t = (t)=>t === "top" ? `2px 2px 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : t === "right" ? `0 0 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : t === "left" ? `0 0 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : t === "bottom" ? `-1px -1px 4px 0 rgba(0, 0, 0, ${n.shadowAlpha})` : "", It = (_param)=>{
+    var { children: t , extra: $ , description: w , target: I , title: x , targetLabel: C , delay: B = !0 , dataAttributes: E  } = _param, Y = _object_without_properties(_param, [
         "children",
         "extra",
         "description",
@@ -101,7 +102,7 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
         "delay",
         "dataAttributes"
     ]);
-    const { isDarkMode: M  } = j(), [l, T] = c.useState(!1), { isTabletOrSmaller: u  } = q(), y = G(), o = c.useRef(!1), r = c.useRef(null), f = c.useRef(null), b = c.useRef(null), e = c.useRef({
+    const { isDarkMode: M  } = j(), [l, T] = c.useState(!1), { isTabletOrSmaller: u  } = q(), P = G(), o = c.useRef(!1), r = c.useRef(null), f = c.useRef(null), b = c.useRef(null), e = c.useRef({
         top: 0,
         right: 0,
         left: 0,
@@ -109,23 +110,23 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
         width: 0,
         height: 0
     }), a = function() {
-        let i = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : wt;
-        return u && (i === "left" || i === "right") ? gt : i;
-    }(Y.position), v = typeof window < "u" ? window.matchMedia("(pointer: coarse)").matches : !1, P = ()=>{
+        let i = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : xt;
+        return u && (i === "left" || i === "right") ? Tt : i;
+    }(Y.position), v = gt() ? window.matchMedia("(pointer: coarse)").matches : !1, S = ()=>{
         l && T(!1);
     };
-    c.useEffect(()=>(window.addEventListener("resize", P), ()=>{
-            window.removeEventListener("resize", P);
+    c.useEffect(()=>(window.addEventListener("resize", S), ()=>{
+            window.removeEventListener("resize", S);
         }));
-    const D = ()=>{
+    const y = ()=>{
         T(!1);
     }, m = ()=>{
         b.current && (e.current = b.current.getBoundingClientRect(), T(!l));
     }, N = ()=>{
         l || m();
     }, k = (i)=>{
-        i.keyCode === Q && D();
-    }, X = (i, A)=>typeof window > "u" ? {} : ({
+        i.keyCode === Q && y();
+    }, X = (i, A)=>wt() ? {} : ({
             right: {
                 left: e.current.right + h,
                 top: window.pageYOffset + e.current.top + e.current.height / 2
@@ -136,26 +137,26 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
             },
             top: {
                 top: window.pageYOffset + e.current.top - h,
-                left: u ? w : window.pageXOffset + e.current.left + e.current.width / 2 - A / 2
+                left: u ? g : window.pageXOffset + e.current.left + e.current.width / 2 - A / 2
             },
             bottom: {
                 top: window.pageYOffset + e.current.bottom + h,
-                left: u ? w : window.pageXOffset + e.current.left + e.current.width / 2 - A / 2
+                left: u ? g : window.pageXOffset + e.current.left + e.current.width / 2 - A / 2
             }
         })[i], L = ()=>u ? {
-            left: e.current.left + e.current.width / 2 - w
-        } : {}, O = (()=>u ? window.innerWidth - w * 2 : At(Y.width))(), K = {
+            left: e.current.left + e.current.width / 2 - g
+        } : {}, D = (()=>u ? window.innerWidth - g * 2 : Pt(Y.width))(), K = {
         top: ut,
         bottom: ft,
         left: mt,
         right: dt
     }, W = pt({
-        [n.enterTransform]: Yt(a),
-        [n.exitTransform]: Pt(a),
-        [n.enterActiveAnimationName]: Dt(a),
+        [n.enterTransform]: St(a),
+        [n.exitTransform]: Dt(a),
+        [n.enterActiveAnimationName]: Ot(a),
         [n.enterDoneTransform]: yt(a),
-        [n.shadowAlpha]: Ot(M),
-        [n.arrowBoxShadow]: St(a)
+        [n.shadowAlpha]: Rt(M),
+        [n.arrowBoxShadow]: $t(a)
     });
     return /* @__PURE__ */ p(z, {
         children: [
@@ -163,9 +164,9 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
                 ref: b,
                 className: Z,
                 onPointerOver: ()=>{
-                    r.current && (clearTimeout(r.current), r.current = null), !o.current && (o.current = !0, C ? f.current = setTimeout(()=>{
+                    r.current && (clearTimeout(r.current), r.current = null), !o.current && (o.current = !0, B ? f.current = setTimeout(()=>{
                         f.current = null, m();
-                    }, vt) : m());
+                    }, Yt) : m());
                 },
                 onPointerLeave: v ? R : ()=>{
                     if (f.current) {
@@ -181,19 +182,19 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
                 "touch-action": "auto",
                 role: "button",
                 tabIndex: 0,
-                "aria-describedby": y,
+                "aria-describedby": P,
                 "aria-expanded": l,
-                "aria-label": B,
+                "aria-label": C,
                 children: I
             }),
             /* @__PURE__ */ p(H, {
                 children: [
                     l && v && /* @__PURE__ */ s(J, {
-                        onPress: D
+                        onPress: y
                     }),
                     /* @__PURE__ */ s(V, {
                         in: l,
-                        timeout: bt,
+                        timeout: At,
                         classNames: {
                             enter: _,
                             enterActive: tt,
@@ -204,11 +205,11 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
                         unmountOnExit: !0,
                         children: /* @__PURE__ */ p("div", _object_spread_props(_object_spread({}, ht(E, "Tooltip")), {
                             role: "tooltip",
-                            id: y,
+                            id: P,
                             className: ot,
                             style: _object_spread({
-                                width: O
-                            }, X(a, O), W),
+                                width: D
+                            }, X(a, D), W),
                             onPointerOver: ()=>{
                                 r.current && (clearTimeout(r.current), r.current = null);
                             },
@@ -225,16 +226,16 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
                                         className: it
                                     })
                                 }),
-                                (x || g) && /* @__PURE__ */ p(U, {
+                                (x || w) && /* @__PURE__ */ p(U, {
                                     space: 4,
                                     children: [
-                                        x && /* @__PURE__ */ s(S, {
+                                        x && /* @__PURE__ */ s(O, {
                                             medium: !0,
                                             children: x
                                         }),
-                                        g && /* @__PURE__ */ s(S, {
+                                        w && /* @__PURE__ */ s(O, {
                                             regular: !0,
-                                            children: g
+                                            children: w
                                         })
                                     ]
                                 }),
@@ -246,5 +247,5 @@ const wt = "bottom", gt = "top", xt = 12, h = 4 + xt, w = 16, Tt = 340, bt = 500
             })
         ]
     });
-}, jt = Rt;
-export { jt as default };
+}, Ht = It;
+export { Ht as default };

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

@@ -1,4 +1,4 @@
 import "./sprinkles.css.ts.vanilla.css-mistica.js";
 import "./touchable.css.ts.vanilla.css-mistica.js";
-var n = "mhti6u1 _1y2v1nfaj", f = "mhti6u4", _ = "mhti6u1 _1y2v1nfaj _1y2v1nf6r _1y2v1nf75 _1y2v1nf7j _1y2v1nf7x _1y2v1nf66 _1y2v1nfa2 _1y2v1nf8b _1y2v1nf2y _1y2v1nf5y _1y2v1nfal";
-export { n as base, f as notTouchable, _ as touchable };
+var f = "mhti6u1 _1y2v1nfar", n = "mhti6u4", _ = "mhti6u1 _1y2v1nfar _1y2v1nf6r _1y2v1nf76 _1y2v1nf7l _1y2v1nf80 _1y2v1nf66 _1y2v1nfaa _1y2v1nf8f _1y2v1nf2y _1y2v1nf5y _1y2v1nfat";
+export { f as base, n as notTouchable, _ as touchable };

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

@@ -1,6 +1,6 @@
 import "../sprinkles.css.ts.vanilla.css-mistica.js";
 import "./aspect-ratio-support.css.ts.vanilla.css-mistica.js";
-var v = "yqswj62", n = "_1y2v1nf8b _1y2v1nf8r _1y2v1nfam _1y2v1nfb0", y = {
+var v = "yqswj62", n = "_1y2v1nf8f _1y2v1nf8w _1y2v1nfau _1y2v1nfb9", y = {
     aspectRatio: "var(--yqswj60)"
-}, f = "_1y2v1nfak _1y2v1nf9z _1y2v1nfa0 _1y2v1nf5z";
+}, f = "_1y2v1nfas _1y2v1nfa7 _1y2v1nfa8 _1y2v1nf5z";
 export { v as container, n as containerWithWrapper, y as vars, f as wrapper };