@telefonica/mistica 16.71.0 → 16.72.0

package/dist/theme-context-provider.js

@@ -11,10 +11,10 @@ function _export(target, all) {
 }
 _export(exports, {
     get default () {
-        return Ie;
+        return Pe;
     },
     get useIsOsDarkModeEnabled () {
-        return se;
+        return ie;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -26,7 +26,6 @@ const _theme = require("./theme.js");
 const _platform = require("./utils/platform.js");
 const _themecontext = /*#__PURE__*/ _interop_require_default(require("./theme-context.js"));
 const _hooks = require("./hooks.js");
-const _tabfocus = /*#__PURE__*/ _interop_require_default(require("./tab-focus.js"));
 const _modalcontextprovider = /*#__PURE__*/ _interop_require_default(require("./modal-context-provider.js"));
 const _tooltipcontextprovider = /*#__PURE__*/ _interop_require_default(require("./tooltip-context-provider.js"));
 const _documentvisibility = require("./utils/document-visibility.js");
@@ -119,27 +118,27 @@ if (process.env.NODE_ENV !== "production" && (0, _environment.isClientSide)()) {
     if (window.__mistica_version__ && window.__mistica_version__ !== _packageversion.PACKAGE_VERSION) throw new Error("There is more than one version of @telefonica/mistica running on the same page");
     window.__mistica_version__ = _packageversion.PACKAGE_VERSION;
 }
-const ie = "(prefers-color-scheme: dark)", se = ()=>{
+const re = "(prefers-color-scheme: dark)", ie = ()=>{
     const [t, c] = _react.useState(!1);
     return (0, _hooks.useIsomorphicLayoutEffect)(()=>{
         if (!window.matchMedia) return;
-        const n = window.matchMedia(ie), i = ()=>{
-            c(n.matches);
+        const s = window.matchMedia(re), i = ()=>{
+            c(s.matches);
         };
-        return n.addEventListener("change", i), i(), ()=>{
-            n.removeEventListener("change", i);
+        return s.addEventListener("change", i), i(), ()=>{
+            s.removeEventListener("change", i);
         };
     }, []), t;
-}, ne = ()=>(t)=>t, ae = (t)=>({
+}, se = ()=>(t)=>t, ne = (t)=>({
         headerMobileHeight: (t === null || t === void 0 ? void 0 : t.headerMobileHeight) === "mistica" ? _theme.NAVBAR_HEIGHT_MOBILE : t === null || t === void 0 ? void 0 : t.headerMobileHeight
-    }), le = ()=>{
-    const t = _react.useRef(null), [c, n] = _react.useState(!1), [i, p] = _react.useState(!0);
+    }), ae = ()=>{
+    const t = _react.useRef(null), [c, s] = _react.useState(!1), [i, p] = _react.useState(!0);
     return (0, _hooks.useIsomorphicLayoutEffect)(()=>{
         if (i) p(!1);
         else {
             var _t_current;
             const f = (_t_current = t.current) === null || _t_current === void 0 ? void 0 : _t_current.parentElement;
-            f && (f.style.isolation = "isolate", n(!0));
+            f && (f.style.isolation = "isolate", s(!0));
         }
     }, [
         i
@@ -150,20 +149,20 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
         }
     });
 }, P = (t)=>Object.fromEntries(Object.entries(t).map((param)=>{
-        let [c, n] = param;
+        let [c, s] = param;
         let i = "";
-        if (n.startsWith("#")) {
-            const [p, f, m] = (0, _color.fromHexToRgb)(n);
+        if (s.startsWith("#")) {
+            const [p, f, m] = (0, _color.fromHexToRgb)(s);
             i = `${p}, ${f}, ${m}`;
         }
         return [
             c,
             i
         ];
-    })), Ie = (param)=>{
-    let { theme: t, children: c, as: n, withoutStyles: i = !1 } = param;
+    })), Pe = (param)=>{
+    let { theme: t, children: c, as: s, withoutStyles: i = !1 } = param;
     var _t_colorScheme;
-    const p = _react.useId(), f = se(), m = (_t_colorScheme = t.colorScheme) !== null && _t_colorScheme !== void 0 ? _t_colorScheme : "auto", b = t.skin.colors, h = _object_spread({}, t.skin.colors, t.skin.darkModeColors), k = m === "auto" && f || m === "dark", M = k ? h : b, w = (0, _locale.localeToLanguage)(t.i18n.locale), v = _react.useCallback(function(o) {
+    const p = _react.useId(), f = ie(), m = (_t_colorScheme = t.colorScheme) !== null && _t_colorScheme !== void 0 ? _t_colorScheme : "auto", b = t.skin.colors, h = _object_spread({}, t.skin.colors, t.skin.darkModeColors), k = m === "auto" && f || m === "dark", M = k ? h : b, w = (0, _locale.localeToLanguage)(t.i18n.locale), v = _react.useCallback(function(o) {
         for(var _len = arguments.length, r = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++){
             r[_key - 1] = arguments[_key];
         }
@@ -196,7 +195,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
                 eventFormat: "universal-analytics"
             }, t.analytics),
             colorValues: M,
-            dimensions: _object_spread({}, _theme.dimensions, ae(t.dimensions)),
+            dimensions: _object_spread({}, _theme.dimensions, ne(t.dimensions)),
             borderRadii: (_t_skin_borderRadii = t.skin.borderRadii) !== null && _t_skin_borderRadii !== void 0 ? _t_skin_borderRadii : _defaults.defaultBorderRadiiConfig,
             textPresets: e,
             spacing: (_t_skin_spacing = t.skin.spacing) !== null && _t_skin_spacing !== void 0 ? _t_skin_spacing : _defaults.defaultSpacing,
@@ -204,7 +203,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
             Link: (0, _theme.getMisticaLinkComponent)(t.Link),
             isDarkMode: k,
             isIos: (0, _platform.getPlatform)(o) === "ios",
-            useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : ne,
+            useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : se,
             t: v,
             preventCopyInFormFields: (_t_preventCopyInFormFields = t.preventCopyInFormFields) !== null && _t_preventCopyInFormFields !== void 0 ? _t_preventCopyInFormFields : !1
         };
@@ -213,7 +212,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
         t,
         k,
         v
-    ]), T = _react.useMemo(()=>{
+    ]), D = _react.useMemo(()=>{
         const o = Object.entries(l.textPresets).map((param)=>{
             let [r, e] = param;
             return {
@@ -229,7 +228,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
         return Object.assign({}, ...o);
     }, [
         l
-    ]), D = _react.useMemo(()=>{
+    ]), H = _react.useMemo(()=>{
         const o = Object.entries(l.textPresets).map((param)=>{
             let [r, e] = param;
             return {
@@ -245,7 +244,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
         return Object.assign({}, ...o);
     }, [
         l
-    ]), H = _react.useMemo(()=>{
+    ]), y = _react.useMemo(()=>{
         const o = Object.entries(l.spacing).map((param)=>{
             let [r, e] = param;
             return {
@@ -263,7 +262,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
         return Object.assign({}, ...o);
     }, [
         l
-    ]), y = _react.useMemo(()=>{
+    ]), T = _react.useMemo(()=>{
         const o = Object.entries(l.spacing).map((param)=>{
             let [r, e] = param;
             return {
@@ -302,15 +301,15 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
                     ${(0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars, {
                 colors: d,
                 rawColors: x,
-                textPresets: T,
+                textPresets: D,
                 borderRadii: (_t_skin_borderRadii = t.skin.borderRadii) !== null && _t_skin_borderRadii !== void 0 ? _t_skin_borderRadii : _defaults.defaultBorderRadiiConfig,
-                spacing: H
+                spacing: y
             })}
                 }
                 @media ${_mediaqueriescssmistica.tabletOrSmaller} {
                     ${o} {
-                        ${(0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars.textPresets, D)}
-                        ${(0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars.spacing, y)}
+                        ${(0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars.textPresets, H)}
+                        ${(0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars.spacing, T)}
                     }
                 }
                 ${j}
@@ -319,35 +318,32 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
     };
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            /* @__PURE__ */ (0, _jsxruntime.jsx)(_tabfocus.default, {
-                disabled: !t.enableTabFocus,
-                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_modalcontextprovider.default, {
-                    children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_tooltipcontextprovider.default, {
-                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_themecontext.default.Provider, {
-                            value: l,
-                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_analytics.TrackingConfig, {
-                                eventFormat: l.analytics.eventFormat,
-                                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_aspectratiosupport.AspectRatioSupportProvider, {
-                                    children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_documentvisibility.DocumentVisibilityProvider, {
-                                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_screensizecontextprovider.default, {
-                                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_dialogcontext.DialogRoot, {
-                                                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_snackbarcontext.SnackbarRoot, {
-                                                    children: n ? /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-                                                        children: [
-                                                            S(`[data-mistica-theme="${p}"]`),
-                                                            /*#__PURE__*/ _react.createElement(n, {
-                                                                style: {
-                                                                    isolation: "isolate"
-                                                                },
-                                                                "data-mistica-theme": i ? void 0 : p
-                                                            }, c)
-                                                        ]
-                                                    }) : /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-                                                        children: [
-                                                            S(":root"),
-                                                            c
-                                                        ]
-                                                    })
+            /* @__PURE__ */ (0, _jsxruntime.jsx)(_modalcontextprovider.default, {
+                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_tooltipcontextprovider.default, {
+                    children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_themecontext.default.Provider, {
+                        value: l,
+                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_analytics.TrackingConfig, {
+                            eventFormat: l.analytics.eventFormat,
+                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_aspectratiosupport.AspectRatioSupportProvider, {
+                                children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_documentvisibility.DocumentVisibilityProvider, {
+                                    children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_screensizecontextprovider.default, {
+                                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_dialogcontext.DialogRoot, {
+                                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_snackbarcontext.SnackbarRoot, {
+                                                children: s ? /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+                                                    children: [
+                                                        S(`[data-mistica-theme="${p}"]`),
+                                                        /*#__PURE__*/ _react.createElement(s, {
+                                                            style: {
+                                                                isolation: "isolate"
+                                                            },
+                                                            "data-mistica-theme": i ? void 0 : p
+                                                        }, c)
+                                                    ]
+                                                }) : /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+                                                    children: [
+                                                        S(":root"),
+                                                        c
+                                                    ]
                                                 })
                                             })
                                         })
@@ -358,7 +354,7 @@ const ie = "(prefers-color-scheme: dark)", se = ()=>{
                     })
                 })
             }),
-            !n && /* @__PURE__ */ (0, _jsxruntime.jsx)(le, {})
+            !s && /* @__PURE__ */ (0, _jsxruntime.jsx)(ae, {})
         ]
     });
 };

package/dist/theme-variant-context.d.ts

@@ -5,19 +5,9 @@ export type Variant = 'default' | 'brand' | 'negative' | 'alternative' | 'media'
  | 'inverse';
 export declare const normalizeVariant: <T extends Variant>(variant: T) => T extends "inverse" ? "brand" : T;
 type ThemeVariantProps = {
-    /** @deprecated Use variant = 'brand' instead */
-    isInverse?: boolean;
     variant?: Variant;
     children: React.ReactNode;
 };
-export declare const ThemeVariant: ({ isInverse, variant, children }: ThemeVariantProps) => JSX.Element;
+export declare const ThemeVariant: ({ variant, children }: ThemeVariantProps) => JSX.Element;
 export declare const useThemeVariant: () => NonDeprecatedVariant;
-/**
- * @deprecated use `useThemeVariant` instead
- */
-export declare const useIsInverseVariant: () => boolean;
-/**
- * @deprecated use `useThemeVariant` instead
- */
-export declare const useIsInverseOrMediaVariant: () => boolean;
 export {};

package/dist/theme-variant-context.js

@@ -11,19 +11,13 @@ function _export(target, all) {
 }
 _export(exports, {
     get ThemeVariant () {
-        return c;
+        return s;
     },
     get normalizeVariant () {
-        return i;
-    },
-    get useIsInverseOrMediaVariant () {
-        return m;
-    },
-    get useIsInverseVariant () {
-        return d;
+        return o;
     },
     get useThemeVariant () {
-        return n;
+        return m;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -69,13 +63,10 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-const i = (e)=>e === "inverse" ? "brand" : e, t = /*#__PURE__*/ _react.createContext("default"), c = (param)=>{
-    let { isInverse: e, variant: a, children: s } = param;
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(t.Provider, {
-        value: a !== null && a !== void 0 ? a : e ? "brand" : "default",
-        children: s
+const o = (e)=>e === "inverse" ? "brand" : e, r = /*#__PURE__*/ _react.createContext("default"), s = (param)=>{
+    let { variant: e, children: n } = param;
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(r.Provider, {
+        value: e !== null && e !== void 0 ? e : "default",
+        children: n
     });
-}, n = ()=>i(_react.useContext(t)), d = ()=>n() === "brand", m = ()=>{
-    const e = n();
-    return e === "brand" || e === "media";
-};
+}, m = ()=>o(_react.useContext(r));

package/dist/theme.d.ts

@@ -70,8 +70,6 @@ export type ThemeConfig = Readonly<{
         Component: React.ComponentType<any>;
     };
     useHrefDecorator?: () => (href: string) => string;
-    /** @deprecated Better use default browser behavior for :focus-visible */
-    enableTabFocus?: boolean;
     preventCopyInFormFields?: boolean;
 }>;
 export type Theme = {

package/dist/time-field.js

@@ -102,7 +102,7 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const J = (_param)=>{
-    var { disabled: s, error: a, helperText: m, name: f, label: d, optional: l, validate: c, validateOnBlurInsideForm: u, onChange: p, onChangeValue: g, onBlur: T, value: h, defaultValue: F, min: t, max: r, dataAttributes: O } = _param, C = _object_without_properties(_param, [
+    var { disabled: s, error: a, helperText: m, name: f, label: d, optional: l, validate: c, validateOnBlurInsideForm: u, onChange: p, onChangeValue: g, onBlur: h, value: O, defaultValue: T, min: t, max: r, dataAttributes: C } = _param, F = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -123,14 +123,14 @@ const J = (_param)=>{
     const I = (e)=>e, { texts: R, t: V } = (0, _hooks.useTheme)(), n = (e)=>!(t && e && e < t || r && e && e > r), x = (0, _formcontext.useFieldProps)({
         name: f,
         label: d,
-        value: h,
-        defaultValue: F,
+        value: O,
+        defaultValue: T,
         processValue: I,
         helperText: m,
         optional: l,
         error: a,
         disabled: s,
-        onBlur: T,
+        onBlur: h,
         validate: (e, o)=>n(e) ? c === null || c === void 0 ? void 0 : c(e, o) : R.formDateOutOfRangeError || V(_texttokens.formDateOutOfRangeError),
         validateOnBlurInsideForm: u,
         onChange: p,
@@ -138,7 +138,7 @@ const J = (_param)=>{
             n(e) && (g === null || g === void 0 ? void 0 : g(e, o));
         }
     });
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, C, x), {
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, F, x), {
         min: t,
         max: r,
         type: "time",
@@ -150,8 +150,7 @@ const J = (_param)=>{
             })
         }),
         dataAttributes: _object_spread({
-            "component-name": "TimeField",
             testid: "TimeField"
-        }, O)
+        }, C)
     }));
 };

package/dist/timeline.css-mistica.js

@@ -35,13 +35,13 @@ _export(exports, {
     }
 });
 /* empty css                                     */ /* empty css                                    */ var t = {
-    vertical: "v16_71_w6pat20",
-    horizontal: "v16_71_w6pat21"
-}, a = "v16_71_w6pat23 v16_71_w6pat22 v16_71_1y2v1nfq4 v16_71_1y2v1nfqh", n = "v16_71_w6pat25 v16_71_w6pat24 v16_71_1y2v1nfqq v16_71_1y2v1nfsh v16_71_1y2v1nfhf", e = {
-    active: "v16_71_w6pat26",
-    inactive: "v16_71_w6pat27",
-    completed: "v16_71_w6pat28"
-}, p = "v16_71_w6pat2a v16_71_w6pat29 v16_71_1y2v1nfq4 v16_71_1y2v1nfqj", f = "v16_71_w6pat2b", r = "v16_71_w6pat2d v16_71_w6pat2c v16_71_1y2v1nfr1 v16_71_1y2v1nfrh v16_71_1y2v1nfso v16_71_1y2v1nfq4 v16_71_1y2v1nfqj v16_71_1y2v1nfqd v16_71_1y2v1nf83", w = {
-    default: "v16_71_w6pat2g v16_71_w6pat2f v16_71_w6pat2e v16_71_1y2v1nfqq",
-    overBrand: "v16_71_w6pat2h v16_71_w6pat2f v16_71_w6pat2e v16_71_1y2v1nfqq"
+    vertical: "v16_72_w6pat20",
+    horizontal: "v16_72_w6pat21"
+}, a = "v16_72_w6pat23 v16_72_w6pat22 v16_72_1y2v1nfq4 v16_72_1y2v1nfqh", n = "v16_72_w6pat25 v16_72_w6pat24 v16_72_1y2v1nfqq v16_72_1y2v1nfsh v16_72_1y2v1nfhf", e = {
+    active: "v16_72_w6pat26",
+    inactive: "v16_72_w6pat27",
+    completed: "v16_72_w6pat28"
+}, p = "v16_72_w6pat2a v16_72_w6pat29 v16_72_1y2v1nfq4 v16_72_1y2v1nfqj", f = "v16_72_w6pat2b", r = "v16_72_w6pat2d v16_72_w6pat2c v16_72_1y2v1nfr1 v16_72_1y2v1nfrh v16_72_1y2v1nfso v16_72_1y2v1nfq4 v16_72_1y2v1nfqj v16_72_1y2v1nfqd v16_72_1y2v1nf83", w = {
+    default: "v16_72_w6pat2g v16_72_w6pat2f v16_72_w6pat2e v16_72_1y2v1nfqq",
+    overBrand: "v16_72_w6pat2h v16_72_w6pat2f v16_72_w6pat2e v16_72_1y2v1nfqq"
 };

package/dist/timeline.js

@@ -217,7 +217,9 @@ const f = (param)=>{
         "aria-label": d,
         "aria-labelledby": s,
         "aria-current": i === "active" ? "step" : void 0
-    }, (0, _dom.getPrefixedDataAttributes)(m, "TimelineItem")), {
+    }, (0, _dom.getPrefixedDataAttributes)(_object_spread({
+        testid: "TimelineItem"
+    }, m))), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                 className: _timelinecssmistica.lineContainer,
@@ -245,7 +247,9 @@ const f = (param)=>{
         role: n,
         "aria-label": d,
         "aria-labelledby": s
-    }, (0, _dom.getPrefixedDataAttributes)(m, "Timeline")), {
+    }, (0, _dom.getPrefixedDataAttributes)(_object_spread({
+        testid: "Timeline"
+    }, m))), {
         children: r
     }));
 };

package/dist/timer.css-mistica.js

@@ -31,10 +31,10 @@ _export(exports, {
         return e;
     }
 });
-/* empty css                                     */ /* empty css                                 */ var f = "v16_71_18fye840 v16_71_1y2v1nfq8", y = "v16_71_18fye841", e = "v16_71_18fye843 v16_71_18fye841 v16_71_18fye842 v16_71_1y2v1nfq5 v16_71_1y2v1nfqd", n = "v16_71_18fye845 v16_71_18fye841 v16_71_18fye844 v16_71_1y2v1nfq8", a = "v16_71_18fye847 v16_71_18fye846 v16_71_1y2v1nfq4 v16_71_1y2v1nfqa v16_71_1y2v1nfqj", i = "v16_71_18fye848", r = {
-    default: "v16_71_18fye84g v16_71_18fye84a v16_71_18fye849 v16_71_1y2v1nfil v16_71_1y2v1nfju v16_71_1y2v1nfg6 v16_71_1y2v1nfhf v16_71_1y2v1nfsw v16_71_18fye84b v16_71_1y2v1nfdi",
-    brand: "v16_71_18fye84h v16_71_18fye84a v16_71_18fye849 v16_71_1y2v1nfil v16_71_1y2v1nfju v16_71_1y2v1nfg6 v16_71_1y2v1nfhf v16_71_1y2v1nfsw v16_71_18fye84c v16_71_1y2v1nf83",
-    negative: "v16_71_18fye84i v16_71_18fye84a v16_71_18fye849 v16_71_1y2v1nfil v16_71_1y2v1nfju v16_71_1y2v1nfg6 v16_71_1y2v1nfhf v16_71_1y2v1nfsw v16_71_18fye84d v16_71_1y2v1nf83",
-    alternative: "v16_71_18fye84j v16_71_18fye84a v16_71_18fye849 v16_71_1y2v1nfil v16_71_1y2v1nfju v16_71_1y2v1nfg6 v16_71_1y2v1nfhf v16_71_1y2v1nfsw v16_71_18fye84e v16_71_1y2v1nf83",
-    media: "v16_71_18fye84k v16_71_18fye84a v16_71_18fye849 v16_71_1y2v1nfil v16_71_1y2v1nfju v16_71_1y2v1nfg6 v16_71_1y2v1nfhf v16_71_1y2v1nfsw v16_71_18fye84f"
+/* empty css                                     */ /* empty css                                 */ var f = "v16_72_18fye840 v16_72_1y2v1nfq8", y = "v16_72_18fye841", e = "v16_72_18fye843 v16_72_18fye841 v16_72_18fye842 v16_72_1y2v1nfq5 v16_72_1y2v1nfqd", n = "v16_72_18fye845 v16_72_18fye841 v16_72_18fye844 v16_72_1y2v1nfq8", a = "v16_72_18fye847 v16_72_18fye846 v16_72_1y2v1nfq4 v16_72_1y2v1nfqa v16_72_1y2v1nfqj", i = "v16_72_18fye848", r = {
+    default: "v16_72_18fye84g v16_72_18fye84a v16_72_18fye849 v16_72_1y2v1nfil v16_72_1y2v1nfju v16_72_1y2v1nfg6 v16_72_1y2v1nfhf v16_72_1y2v1nfsw v16_72_18fye84b v16_72_1y2v1nfdi",
+    brand: "v16_72_18fye84h v16_72_18fye84a v16_72_18fye849 v16_72_1y2v1nfil v16_72_1y2v1nfju v16_72_1y2v1nfg6 v16_72_1y2v1nfhf v16_72_1y2v1nfsw v16_72_18fye84c v16_72_1y2v1nf83",
+    negative: "v16_72_18fye84i v16_72_18fye84a v16_72_18fye849 v16_72_1y2v1nfil v16_72_1y2v1nfju v16_72_1y2v1nfg6 v16_72_1y2v1nfhf v16_72_1y2v1nfsw v16_72_18fye84d v16_72_1y2v1nf83",
+    alternative: "v16_72_18fye84j v16_72_18fye84a v16_72_18fye849 v16_72_1y2v1nfil v16_72_1y2v1nfju v16_72_1y2v1nfg6 v16_72_1y2v1nfhf v16_72_1y2v1nfsw v16_72_18fye84e v16_72_1y2v1nf83",
+    media: "v16_72_18fye84k v16_72_18fye84a v16_72_18fye849 v16_72_1y2v1nfil v16_72_1y2v1nfju v16_72_1y2v1nfg6 v16_72_1y2v1nfhf v16_72_1y2v1nfsw v16_72_18fye84f"
 };

package/dist/timer.js

@@ -271,7 +271,9 @@ const $ = 24, V = 60, Q = 60, C = 1e3, X = Q * C, Z = V * X, be = $ * Z, H = (s,
             // try to keep the timer in the same line without wrapping only when label is not long
             display: o !== "long" ? "inline-block" : void 0
         }
-    }, (0, _dom.getPrefixedDataAttributes)(L, "TextTimer")), {
+    }, (0, _dom.getPrefixedDataAttributes)(_object_spread({
+        testid: "TextTimer"
+    }, L))), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_screenreaderonly.default, {
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {
@@ -348,7 +350,9 @@ const $ = 24, V = 60, Q = 60, C = 1e3, X = Q * C, Z = V * X, be = $ * Z, H = (s,
         role: "timer",
         "aria-labelledby": p,
         className: _timercssmistica.timerWrapper
-    }, (0, _dom.getPrefixedDataAttributes)(L, "Timer")), {
+    }, (0, _dom.getPrefixedDataAttributes)(_object_spread({
+        testid: "Timer"
+    }, L))), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_screenreaderonly.default, {
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)("span", {

package/dist/title.js

@@ -87,27 +87,27 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const m = (param)=>{
-    let { title: t, right: e, dataAttributes: o } = param;
-    const { textPresets: r } = (0, _hooks.useTheme)();
+const c = (param)=>{
+    let { title: t, right: e, dataAttributes: r } = param;
+    const { textPresets: o } = (0, _hooks.useTheme)();
     return e ? /* @__PURE__ */ (0, _jsxruntime.jsxs)(_inline.default, {
         space: "between",
         alignItems: "baseline",
-        dataAttributes: o,
+        dataAttributes: r,
         children: [
             t,
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                 paddingLeft: 16,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
-                    weight: r.link.weight,
+                    weight: o.link.weight,
                     children: e
                 })
             })
         ]
-    }) : /* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({}, (0, _dom.getPrefixedDataAttributes)(o)), {
+    }) : /* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({}, (0, _dom.getPrefixedDataAttributes)(r)), {
         children: t
     }));
-}, c = (t)=>{
+}, m = (t)=>{
     const { textPresets: e } = (0, _hooks.useTheme)();
     return {
         weight: e[t].weight,
@@ -117,66 +117,66 @@ const m = (param)=>{
         mobileLineHeight: e[t].lineHeight.mobile
     };
 }, A = (param)=>{
-    let { children: t, as: e = "h3", id: o, right: r, dataAttributes: n } = param;
-    const s = c("title1");
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(m, {
+    let { children: t, as: e = "h3", id: r, right: o, dataAttributes: s } = param;
+    const n = m("title1");
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(c, {
         title: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text, _object_spread_props(_object_spread({
             as: e,
-            id: o
-        }, s), {
+            id: r
+        }, n), {
             color: _skincontractcssmistica.vars.colors.textSecondary,
             transform: "uppercase",
             wordBreak: !1,
             children: t
         })),
-        right: r,
+        right: o,
         dataAttributes: _object_spread({
-            "component-name": "Title1"
-        }, n)
+            testid: "Title1"
+        }, s)
     });
 }, H = (param)=>{
-    let { children: t, as: e = "h3", id: o, right: r, dataAttributes: n } = param;
-    const s = c("title2");
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(m, {
+    let { children: t, as: e = "h3", id: r, right: o, dataAttributes: s } = param;
+    const n = m("title2");
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(c, {
         title: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text, _object_spread_props(_object_spread({
             as: e,
-            id: o
-        }, s), {
+            id: r
+        }, n), {
             children: t
         })),
-        right: r,
+        right: o,
         dataAttributes: _object_spread({
-            "component-name": "Title2"
-        }, n)
+            testid: "Title2"
+        }, s)
     });
 }, L = (param)=>{
-    let { children: t, as: e = "h3", id: o, right: r, dataAttributes: n } = param;
-    const s = c("title3");
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(m, {
+    let { children: t, as: e = "h3", id: r, right: o, dataAttributes: s } = param;
+    const n = m("title3");
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(c, {
         title: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text, _object_spread_props(_object_spread({
             as: e,
-            id: o
-        }, s), {
+            id: r
+        }, n), {
             children: t
         })),
-        right: r,
+        right: o,
         dataAttributes: _object_spread({
-            "component-name": "Title3"
-        }, n)
+            testid: "Title3"
+        }, s)
     });
 }, j = (param)=>{
-    let { children: t, as: e = "h3", id: o, right: r, dataAttributes: n } = param;
-    const s = c("title4");
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(m, {
+    let { children: t, as: e = "h3", id: r, right: o, dataAttributes: s } = param;
+    const n = m("title4");
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(c, {
         title: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text, _object_spread_props(_object_spread({
             as: e,
-            id: o
-        }, s), {
+            id: r
+        }, n), {
             children: t
         })),
-        right: r,
+        right: o,
         dataAttributes: _object_spread({
-            "component-name": "Title4"
-        }, n)
+            testid: "Title4"
+        }, s)
     });
 };

package/dist/tooltip.css-mistica.js

@@ -13,13 +13,13 @@ _export(exports, {
         return t;
     },
     get arrow () {
-        return f;
+        return x;
     },
     get arrowContainer () {
         return e;
     },
     get closeButtonIcon () {
-        return i;
+        return f;
     },
     get container () {
         return a;
@@ -54,4 +54,4 @@ _export(exports, {
         opacity: 0
     },
     unmounted: {}
-}, a = "v16_71_1xhatbp1 v16_71_1xhatbp0 v16_71_1y2v1nfpz", p = "v16_71_1xhatbp3 v16_71_1xhatbp2 v16_71_1y2v1nfpy v16_71_1y2v1nfsy v16_71_1y2v1nf83", o = "v16_71_1xhatbp5 v16_71_1xhatbp4 v16_71_1y2v1nfpy v16_71_1y2v1nft8", r = "v16_71_1xhatbp6", y = "v16_71_1xhatbp7 v16_71_1y2v1nfq4 v16_71_1y2v1nfqa v16_71_1y2v1nfqj", e = "v16_71_1xhatbp9 v16_71_1xhatbp8 v16_71_1y2v1nfpz v16_71_1y2v1nfqz v16_71_1y2v1nft8", f = "v16_71_1xhatbpb v16_71_1xhatbpa v16_71_1y2v1nfqx v16_71_1y2v1nfrd v16_71_1y2v1nfpz v16_71_1y2v1nfte v16_71_1y2v1nf83", i = "v16_71_1xhatbpd v16_71_1xhatbpc v16_71_1y2v1nfpz";
+}, a = "v16_72_1xhatbp1 v16_72_1xhatbp0 v16_72_1y2v1nfpz", p = "v16_72_1xhatbp3 v16_72_1xhatbp2 v16_72_1y2v1nfpy v16_72_1y2v1nfsx v16_72_1y2v1nf83", o = "v16_72_1xhatbp5 v16_72_1xhatbp4 v16_72_1y2v1nfpy v16_72_1y2v1nft7", r = "v16_72_1xhatbp6", y = "v16_72_1xhatbp7 v16_72_1y2v1nfq4 v16_72_1y2v1nfqa v16_72_1y2v1nfqj", e = "v16_72_1xhatbp9 v16_72_1xhatbp8 v16_72_1y2v1nfpz v16_72_1y2v1nfqz v16_72_1y2v1nft7", x = "v16_72_1xhatbpb v16_72_1xhatbpa v16_72_1y2v1nfqx v16_72_1y2v1nfrd v16_72_1y2v1nfpz v16_72_1y2v1nftd v16_72_1y2v1nf83", f = "v16_72_1xhatbpd v16_72_1xhatbpc v16_72_1y2v1nfpz";

package/dist/tooltip.d.ts

@@ -3,7 +3,7 @@ import type { DataAttributes, TrackingEvent } from './utils/types';
 type Position = 'top' | 'bottom' | 'left' | 'right';
 type Props = {
     children?: React.ReactNode;
-    extra?: React.ReactNode;
+    slot?: React.ReactNode;
     description?: string;
     target: React.ReactNode;
     targetStyle?: React.CSSProperties;
@@ -31,5 +31,5 @@ type BaseTooltipProps = {
     trackingEvent?: TrackingEvent | ReadonlyArray<TrackingEvent>;
 };
 export declare const BaseTooltip: ({ content, target, targetStyle, width, position, dataAttributes, delay, centerContent, open, onClose, closeButtonLabel, hasPointerInteractionOnly, trackingEvent, }: BaseTooltipProps) => JSX.Element;
-declare const Tooltip: ({ centerContent, extra, children, dataAttributes, title, description, ...props }: Props) => JSX.Element;
+declare const Tooltip: ({ centerContent, slot, children, dataAttributes, title, description, ...props }: Props) => JSX.Element;
 export default Tooltip;