@telefonica/mistica 14.14.0 → 14.16.0

package/dist/text-field-base.js

@@ -10,10 +10,10 @@ function _export(target, all) {
 }
 _export(exports, {
     TextFieldBase: function() {
-        return I;
+        return W;
     },
     TextFieldBaseAutosuggest: function() {
-        return Ke;
+        return Ge;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -151,8 +151,8 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
-    var { error: c , helperText: A , label: n , inputProps: g , inputRef: y , defaultValue: o , value: t , onFocus: u , onBlur: p , inputComponent: h , prefix: m , startIcon: e , endIcon: a , endIconOverlay: x , shrinkLabel: D , multiline: L = !1 , focus: C , fieldRef: H , maxLength: S , id: K , autoComplete: M , fullWidth: G  } = _param, r = _object_without_properties(_param, [
+const W = /*#__PURE__*/ _react.forwardRef((_param, M)=>{
+    var { error: c , helperText: T , label: n , inputProps: m , inputRef: y , defaultValue: o , value: t , onFocus: u , onBlur: S , inputComponent: h , prefix: g , startIcon: e , endIcon: a , endIconOverlay: L , shrinkLabel: z , multiline: x = !1 , focus: C , fieldRef: D , maxLength: p , id: G , autoComplete: H , fullWidth: K  } = _param, r = _object_without_properties(_param, [
         "error",
         "helperText",
         "label",
@@ -177,7 +177,7 @@ const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
         "fullWidth"
     ]);
     var _ref;
-    const F = (0, _hooks.useAriaId)(K), [f, d] = _react.useState(o != null && o.length || t != null && t.length ? "filled" : "default"), { isTabletOrSmaller: Q  } = (0, _hooks.useScreenSize)(), [U, N] = _react.useState((_ref = o == null ? void 0 : o.length) !== null && _ref !== void 0 ? _ref : 0), E = !!n || !r.required, w = (0, _hooks.useTheme)(), P = D || (r.type === "date" || r.type === "datetime-local" || r.type === "month") && !r.required, [X, Y] = _react.useState("baseline");
+    const F = (0, _hooks.useAriaId)(G), [f, d] = _react.useState(o != null && o.length || t != null && t.length ? "filled" : "default"), { isTabletOrSmaller: J  } = (0, _hooks.useScreenSize)(), [Q, N] = _react.useState((_ref = o == null ? void 0 : o.length) !== null && _ref !== void 0 ? _ref : 0), E = !!n || !r.required, U = (0, _hooks.useTheme)(), w = z || (r.type === "date" || r.type === "datetime-local" || r.type === "month") && !r.required, [X, Y] = _react.useState("baseline");
     (0, _hooks.useIsomorphicLayoutEffect)(()=>{
         (0, _platform.isSafari)() && Y("initial");
     }, []), _react.useEffect(()=>{
@@ -191,40 +191,40 @@ const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
     }, [
         r.autoFocus
     ]);
-    const Z = L ? "textarea" : "input", v = h ? {
+    const Z = x ? "textarea" : "input", $ = h ? {
         inputRef: y
     } : {
-        ref: (0, _common.combineRefs)(J, y)
+        ref: (0, _common.combineRefs)(M, y)
     }, b = _object_spread(_object_spread_props(_object_spread({}, r), {
-        maxLength: S,
-        autoComplete: M
-    }), g), k = P || f === "focused" || f === "filled", $ = k ? Q ? _textfieldcomponentscssmistica.LABEL_SCALE_MOBILE : _textfieldcomponentscssmistica.LABEL_SCALE_DESKTOP : 1, V = {
+        maxLength: p,
+        autoComplete: H
+    }), m), P = w || f === "focused" || f === "filled", v = P ? J ? _textfieldcomponentscssmistica.LABEL_SCALE_MOBILE : _textfieldcomponentscssmistica.LABEL_SCALE_DESKTOP : 1, V = {
         left: e ? 48 : _textfieldcomponentscssmistica.LABEL_LEFT_POSITION,
         // shrinking means applying a scale transformation, so width will be proportionally reduced.
         // Let's keep the original width.
-        width: `calc(((100% - ${_textfieldcomponentscssmistica.LABEL_LEFT_POSITION + (e ? 48 : _textfieldcomponentscssmistica.LABEL_LEFT_POSITION)}px)) / ${$})`,
-        paddingRight: a && !k ? 36 : 0
-    }, _ = (0, _sprinklescssmistica.sprinkles)({
+        width: `calc(((100% - ${_textfieldcomponentscssmistica.LABEL_LEFT_POSITION + (e ? 48 : _textfieldcomponentscssmistica.LABEL_LEFT_POSITION)}px)) / ${v})`,
+        paddingRight: a && !P ? 36 : 0
+    }, k = (0, _sprinklescssmistica.sprinkles)({
         paddingRight: a ? 0 : 16,
-        paddingLeft: m ? 0 : e ? 48 : 12
-    }), ee = r.type === "password" && (0, _platform.isIos)(w.platformOverrides) && !(0, _platform.isRunningAcceptanceTest)(w.platformOverrides) ? "arial" : "inherit";
+        paddingLeft: g ? 0 : e ? 48 : 12
+    }), ee = r.type === "password" && !(0, _platform.isRunningAcceptanceTest)(U.platformOverrides) ? "Lucida Grande, Arial, sans-serif" : "inherit";
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_textfieldcomponents.FieldContainer, {
         disabled: r.disabled,
         helperText: /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldcomponents.HelperText, {
             error: c,
-            leftText: A,
-            rightText: L && S ? `${U}/${S}` : void 0
+            leftText: T,
+            rightText: x && p ? `${Q}/${p}` : void 0
         }),
-        multiline: L,
-        fullWidth: G,
-        fieldRef: H,
+        multiline: x,
+        fullWidth: K,
+        fieldRef: D,
         readOnly: r.readOnly,
         children: [
             e && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _textfieldbasecssmistica.startIcon,
                 children: e
             }),
-            m && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+            g && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: (0, _classnames.default)(_textfieldbasecssmistica.prefix, E ? _textfieldbasecssmistica.prefixWithLabel : _textfieldbasecssmistica.prefixWithoutLabel),
                 style: {
                     opacity: f === "default" ? 0 : 1,
@@ -234,34 +234,34 @@ const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
                     color: _skincontractcssmistica.vars.colors.textSecondary,
                     regular: !0,
                     wordBreak: !1,
-                    children: m
+                    children: g
                 })
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _textfieldbasecssmistica.fullWidth,
                 style: {
-                    alignSelf: m ? "baseline" : "initial"
+                    alignSelf: g ? "baseline" : "initial"
                 },
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text3, {
                     as: "div",
                     regular: !0,
-                    children: /*#__PURE__*/ _react.createElement(h || Z, _object_spread(_object_spread_props(_object_spread({}, v, b), {
+                    children: /*#__PURE__*/ _react.createElement(h || Z, _object_spread(_object_spread_props(_object_spread({}, $, b), {
                         id: F,
                         style: _object_spread_props(_object_spread({}, b.style), {
                             fontFamily: ee
                         }),
-                        className: L ? (0, _classnames.default)(_textfieldbasecssmistica.textArea, E ? _textfieldbasecssmistica.textAreaWithLabel : _textfieldbasecssmistica.textAreaWithoutLabel, _) : (0, _classnames.default)(_textfieldbasecssmistica.input, E ? _textfieldbasecssmistica.inputWithLabel : _textfieldbasecssmistica.inputWithoutLabel, _, {
+                        className: x ? (0, _classnames.default)(_textfieldbasecssmistica.textArea, E ? _textfieldbasecssmistica.textAreaWithLabel : _textfieldbasecssmistica.textAreaWithoutLabel, k) : (0, _classnames.default)(_textfieldbasecssmistica.input, E ? _textfieldbasecssmistica.inputWithLabel : _textfieldbasecssmistica.inputWithoutLabel, k, {
                             [_textfieldbasecssmistica.inputFirefoxStyles]: (0, _platform.isFirefox)()
                         }),
                         onFocus: (l)=>{
                             d("focused"), u == null || u(l);
                         },
                         onBlur: (l)=>{
-                            l.target.value.length > 0 ? d("filled") : d("default"), p == null || p(l);
+                            l.target.value.length > 0 ? d("filled") : d("default"), S == null || S(l);
                         },
                         onChange: (l)=>{
-                            var q;
-                            S === void 0 || l.target.value.length <= S ? (N(l.target.value.length), l.target.value.length > 0 && f !== "focused" && d("filled"), (q = b.onChange) == null || q.call(b, l)) : (l.stopPropagation(), l.preventDefault());
+                            var _;
+                            p === void 0 || l.target.value.length <= p ? (N(l.target.value.length), l.target.value.length > 0 && f !== "focused" && d("filled"), (_ = b.onChange) == null || _.call(b, l)) : (l.stopPropagation(), l.preventDefault());
                         },
                         defaultValue: o,
                         value: t
@@ -275,7 +275,7 @@ const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
                 error: c,
                 forId: F,
                 inputState: f,
-                shrinkLabel: P,
+                shrinkLabel: w,
                 optional: !r.required,
                 children: n
             }),
@@ -283,41 +283,41 @@ const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
                 className: _textfieldbasecssmistica.endIcon,
                 children: a
             }),
-            x
+            L
         ]
     });
-}), Fe = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "react-autosuggest" */ "react-autosuggest")))), Ke = /*#__PURE__*/ _react.forwardRef((_param, g)=>{
-    var { getSuggestions: c , id: A  } = _param, n = _object_without_properties(_param, [
+}), Oe = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "react-autosuggest" */ "react-autosuggest")))), Ge = /*#__PURE__*/ _react.forwardRef((_param, m)=>{
+    var { getSuggestions: c , id: T  } = _param, n = _object_without_properties(_param, [
         "getSuggestions",
         "id"
     ]);
-    const [y, o] = _react.useState([]), t = _react.useRef(null), { platformOverrides: u , texts: p  } = (0, _hooks.useTheme)(), h = (0, _hooks.useAriaId)(A), m = (0, _hooks.useAriaId)();
+    const [y, o] = _react.useState([]), t = _react.useRef(null), { platformOverrides: u , texts: S  } = (0, _hooks.useTheme)(), h = (0, _hooks.useAriaId)(T), g = (0, _hooks.useAriaId)();
     if (c && (n.value === void 0 || n.defaultValue !== void 0)) throw Error("Fields with suggestions must be used in controlled mode");
     return c ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_react.Suspense, {
-        fallback: /* @__PURE__ */ (0, _jsxruntime.jsx)(I, _object_spread_props(_object_spread({}, n), {
+        fallback: /* @__PURE__ */ (0, _jsxruntime.jsx)(W, _object_spread_props(_object_spread({}, n), {
             label: (0, _platform.isRunningAcceptanceTest)(u) ? "" : n.label,
             autoComplete: "off",
-            ref: g,
+            ref: m,
             id: h
         })),
-        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(Fe, {
-            id: m,
+        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(Oe, {
+            id: g,
             inputProps: _object_spread_props(_object_spread({}, n), {
                 id: h,
                 autoComplete: "off",
                 // @ts-expect-error Autosuggest expects slightly different types
                 onChange: (e, param)=>{
                     let { newValue: a  } = param;
-                    var x;
+                    var L;
                     e.target = _object_spread_props(_object_spread({}, e.target), {
                         value: a
                     }), e.currentTarget = _object_spread_props(_object_spread({}, e.currentTarget), {
                         value: a
-                    }), (x = n.onChange) == null || x.call(n, e);
+                    }), (L = n.onChange) == null || L.call(n, e);
                 }
             }),
-            renderInputComponent: (e)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(I, _object_spread_props(_object_spread({}, e), {
-                    inputRef: (0, _common.combineRefs)(t, n.inputRef, g)
+            renderInputComponent: (e)=>/* @__PURE__ */ (0, _jsxruntime.jsx)(W, _object_spread_props(_object_spread({}, e), {
+                    inputRef: (0, _common.combineRefs)(t, n.inputRef, m)
                 })),
             suggestions: y,
             onSuggestionsFetchRequested: (param)=>{
@@ -344,12 +344,12 @@ const I = /*#__PURE__*/ _react.forwardRef((_param, J)=>{
                         width: t.current ? t.current.clientWidth + 2 : 0
                     },
                     className: _textfieldbasecssmistica.suggestionsContainer,
-                    "aria-label": `${n.label} ${p.menuLabelSuffix}`,
+                    "aria-label": `${n.label} ${S.menuLabelSuffix}`,
                     children: e.children
                 }))
         })
-    }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(I, _object_spread_props(_object_spread({}, n), {
+    }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(W, _object_spread_props(_object_spread({}, n), {
         id: h,
-        ref: g
+        ref: m
     }));
 });

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

@@ -37,16 +37,16 @@ _export(exports, {
         return t;
     },
     fullWidth: function() {
-        return k;
+        return u;
     },
     helperContainer: function() {
-        return u;
+        return k;
     },
     helperText: function() {
-        return L;
+        return d;
     },
     labelContainer: function() {
-        return d;
+        return L;
     },
     labelText: function() {
         return E;
@@ -61,9 +61,9 @@ _export(exports, {
         return o;
     },
     shrinked: function() {
-        return b;
+        return p;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./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";
+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";

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

@@ -5,13 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "variants", {
     enumerable: true,
     get: function() {
-        return v;
+        return r;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./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"
 };

package/dist/text.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { ExclusifyUnion } from './utils/utility-types';
 import type { FontWeight } from './skins/types';
 import type { DataAttributes } from './utils/types';
 export interface TextPresetProps {
@@ -38,21 +39,18 @@ interface TextProps extends TextPresetProps {
 export declare const Text: React.FC<TextProps>;
 interface LightProps extends TextPresetProps {
     light: boolean;
-    regular?: undefined;
-    medium?: undefined;
 }
 interface MediumProps extends TextPresetProps {
-    light?: undefined;
-    regular?: undefined;
     medium: boolean;
 }
 interface RegularProps extends TextPresetProps {
-    light?: undefined;
     regular: boolean;
-    medium?: undefined;
 }
-type RegularMediumProps = RegularProps | MediumProps;
-type LightRegularMediumProps = LightProps | RegularProps | MediumProps;
+interface RestrictedWeightTextProps<T> extends TextPresetProps {
+    weight: T;
+}
+type RegularMediumProps = ExclusifyUnion<RegularProps | MediumProps | RestrictedWeightTextProps<'regular' | 'medium'>>;
+type LightRegularMediumProps = ExclusifyUnion<LightProps | RegularProps | MediumProps | RestrictedWeightTextProps<'light' | 'regular' | 'medium'>>;
 export declare const Text10: React.FC<TextPresetProps>;
 export declare const Text9: React.FC<TextPresetProps>;
 export declare const Text8: React.FC<TextPresetProps>;

package/dist/text.js

@@ -185,7 +185,7 @@ const J = {
     medium: 500,
     bold: 700
 }, K = (e)=>e === !0 ? 1 : e || "initial", n = (param)=>{
-    let { weight: e , color: i = _skincontractcssmistica.vars.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 = _skincontractcssmistica.vars.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 = (0, _themevariantcontext.useIsInverseVariant)(), V = K(o), C = {
         [_skincontractcssmistica.vars.colors.textPrimary]: _skincontractcssmistica.vars.colors.textPrimaryInverse,
         [_skincontractcssmistica.vars.colors.textSecondary]: _skincontractcssmistica.vars.colors.textSecondaryInverse,
@@ -196,10 +196,10 @@ const J = {
         [_textcssmistica.truncateToOneLine]: o === 1 || o === !0,
         [_textcssmistica.truncateToMoreThanOneLine]: o && o > 1
     }), M = (0, _dynamic.assignInlineVars)({
-        [_textcssmistica.vars.mobileSize]: u ? (0, _css.pxToRem)(u) : "",
-        [_textcssmistica.vars.mobileLineHeight]: k ? (0, _css.pxToRem)(k) : "",
+        [_textcssmistica.vars.mobileSize]: d ? (0, _css.pxToRem)(d) : "",
+        [_textcssmistica.vars.mobileLineHeight]: f ? (0, _css.pxToRem)(f) : "",
         [_textcssmistica.vars.desktopSize]: b ? (0, _css.pxToRem)(b) : "",
-        [_textcssmistica.vars.desktopLineHeight]: L ? (0, _css.pxToRem)(L) : ""
+        [_textcssmistica.vars.desktopLineHeight]: k ? (0, _css.pxToRem)(k) : ""
     }), O = o ? (0, _dynamic.assignInlineVars)({
         [_textcssmistica.vars.lineClamp]: String(V)
     }) : {};
@@ -211,14 +211,14 @@ const J = {
         "aria-level": y
     }, (0, _dom.getPrefixedDataAttributes)(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);
@@ -226,6 +226,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/theme-context-provider.js

@@ -10,10 +10,10 @@ function _export(target, all) {
 }
 _export(exports, {
     default: function() {
-        return bt;
+        return gt;
     },
     useIsOsDarkModeEnabled: function() {
-        return Y;
+        return Z;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -106,27 +106,27 @@ function _object_spread(target) {
     }
     return target;
 }
-const X = "(prefers-color-scheme: dark)", Y = ()=>{
+const Y = "(prefers-color-scheme: dark)", Z = ()=>{
     const [t, c] = _react.useState(!1);
     return (0, _hooks.useIsomorphicLayoutEffect)(()=>{
         if (!window.matchMedia) return;
-        const o = window.matchMedia(X), s = ()=>{
+        const o = window.matchMedia(Y), s = ()=>{
             c(o.matches);
         };
         return o.addListener(s), s(), ()=>o.removeListener(s);
     }, []), t;
-}, Z = ()=>(t)=>t, tt = (t)=>({
+}, tt = ()=>(t)=>t, et = (t)=>({
         headerMobileHeight: (t == null ? void 0 : t.headerMobileHeight) === "mistica" ? _theme.NAVBAR_HEIGHT_MOBILE : t == null ? void 0 : t.headerMobileHeight
-    }), et = (param)=>{
+    }), rt = (param)=>{
     let { theme: t , children: c , as: o  } = param;
     var _t_colorScheme, _t_skin_borderRadii;
-    const s = _react.useRef(1), I = _react.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 = _react.useMemo(()=>{
-        var i, n, d, x, f, P, b, g, M, T, C;
+    const s = _react.useRef(1), E = _react.useCallback(()=>`aria-id-hook-${s.current++}`, []), L = Z(), k = (_t_colorScheme = t.colorScheme) !== null && _t_colorScheme !== void 0 ? _t_colorScheme : "auto", R = t.skin.colors, H = _object_spread({}, t.skin.colors, t.skin.darkModeColors), u = k === "auto" && L || k === "dark", m = u ? H : R, p = _react.useMemo(()=>{
+        var i, n, d, x, f, v, P, g, M, C, T, D;
         const l = _object_spread({
             platform: (0, _platform.getPlatform)(),
             insideNovumNativeApp: (0, _platform.isInsideNovumNativeApp)()
         }, t.platformOverrides);
-        var _t_Link, _t_useHrefDecorator;
+        var _t_useHrefDecorator;
         return {
             skinName: t.skin.name,
             i18n: t.i18n,
@@ -136,30 +136,31 @@ const X = "(prefers-color-scheme: dark)", Y = ()=>{
                 logEvent: ()=>Promise.resolve(),
                 eventFormat: "universal-analytics"
             }, t.analytics),
-            dimensions: _object_spread({}, _theme.dimensions, tt(t.dimensions)),
+            dimensions: _object_spread({}, _theme.dimensions, et(t.dimensions)),
             textPresets: {
                 text5: _object_spread({}, _defaults.defaultTextPresetsConfig.text5, (i = t.skin.textPresets) == null ? void 0 : i.text5),
                 text6: _object_spread({}, _defaults.defaultTextPresetsConfig.text6, (n = t.skin.textPresets) == null ? void 0 : n.text6),
                 text7: _object_spread({}, _defaults.defaultTextPresetsConfig.text7, (d = t.skin.textPresets) == null ? void 0 : d.text7),
                 text8: _object_spread({}, _defaults.defaultTextPresetsConfig.text8, (x = t.skin.textPresets) == null ? void 0 : x.text8),
                 text9: _object_spread({}, _defaults.defaultTextPresetsConfig.text9, (f = t.skin.textPresets) == null ? void 0 : f.text9),
-                text10: _object_spread({}, _defaults.defaultTextPresetsConfig.text10, (P = t.skin.textPresets) == null ? void 0 : P.text10),
-                cardTitle: _object_spread({}, _defaults.defaultTextPresetsConfig.cardTitle, (b = t.skin.textPresets) == null ? void 0 : b.cardTitle),
+                text10: _object_spread({}, _defaults.defaultTextPresetsConfig.text10, (v = t.skin.textPresets) == null ? void 0 : v.text10),
+                cardTitle: _object_spread({}, _defaults.defaultTextPresetsConfig.cardTitle, (P = t.skin.textPresets) == null ? void 0 : P.cardTitle),
                 button: _object_spread({}, _defaults.defaultTextPresetsConfig.button, (g = t.skin.textPresets) == null ? void 0 : g.button),
                 link: _object_spread({}, _defaults.defaultTextPresetsConfig.link, (M = t.skin.textPresets) == null ? void 0 : M.link),
-                title1: _object_spread({}, _defaults.defaultTextPresetsConfig.title1, (T = t.skin.textPresets) == null ? void 0 : T.title1),
-                indicator: _object_spread({}, _defaults.defaultTextPresetsConfig.indicator, (C = t.skin.textPresets) == null ? void 0 : C.indicator)
+                title1: _object_spread({}, _defaults.defaultTextPresetsConfig.title1, (C = t.skin.textPresets) == null ? void 0 : C.title1),
+                indicator: _object_spread({}, _defaults.defaultTextPresetsConfig.indicator, (T = t.skin.textPresets) == null ? void 0 : T.indicator),
+                tabsLabel: _object_spread({}, _defaults.defaultTextPresetsConfig.tabsLabel, (D = t.skin.textPresets) == null ? void 0 : D.tabsLabel)
             },
-            Link: (_t_Link = t.Link) !== null && _t_Link !== void 0 ? _t_Link : _theme.AnchorLink,
+            Link: (0, _theme.getMisticaLinkComponent)(t.Link),
             isDarkMode: u,
             isIos: (0, _platform.getPlatform)(l) === "ios",
-            useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : Z,
+            useHrefDecorator: (_t_useHrefDecorator = t.useHrefDecorator) !== null && _t_useHrefDecorator !== void 0 ? _t_useHrefDecorator : tt,
             useId: t.useId
         };
     }, [
         t,
         u
-    ]), H = Object.fromEntries(Object.entries(k).map((param)=>{
+    ]), S = Object.fromEntries(Object.entries(m).map((param)=>{
         let [l, i] = param;
         let n = "";
         if (i.startsWith("#")) {
@@ -170,9 +171,9 @@ const X = "(prefers-color-scheme: dark)", Y = ()=>{
             l,
             n
         ];
-    })), v = (0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars, {
-        colors: k,
-        rawColors: H,
+    })), b = (0, _dynamic.assignInlineVars)(_skincontractcssmistica.vars, {
+        colors: m,
+        rawColors: S,
         borderRadii: (_t_skin_borderRadii = t.skin.borderRadii) !== null && _t_skin_borderRadii !== void 0 ? _t_skin_borderRadii : _defaults.defaultBorderRadiiConfig
     });
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(_tabfocus.default, {
@@ -185,15 +186,15 @@ const X = "(prefers-color-scheme: dark)", Y = ()=>{
                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_aspectratiosupport.AspectRatioSupportProvider, {
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_documentvisibility.DocumentVisibilityProvider, {
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_ariaidgettercontext.default.Provider, {
-                                value: I,
+                                value: E,
                                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_screensizecontextprovider.default, {
                                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_dialog.default, {
                                         children: o ? /*#__PURE__*/ _react.createElement(o, {
-                                            style: v
+                                            style: b
                                         }, c) : /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                                             children: [
                                                 (process.env.NODE_ENV !== "test" || process.env.SSR_TEST) && /* @__PURE__ */ (0, _jsxruntime.jsx)("style", {
-                                                    children: `:root {${v}}`
+                                                    children: `:root {${b}}`
                                                 }),
                                                 c
                                             ]
@@ -207,4 +208,4 @@ const X = "(prefers-color-scheme: dark)", Y = ()=>{
             })
         })
     });
-}, bt = et;
+}, gt = rt;

package/dist/theme.d.ts

@@ -69,7 +69,7 @@ type LinkComponent = React.ComponentType<{
     onKeyDown?: React.KeyboardEventHandler<HTMLAnchorElement>;
     children: React.ReactNode;
 }>;
-export declare const AnchorLink: LinkComponent;
+export declare const getMisticaLinkComponent: (Link?: ThemeConfig['Link']) => LinkComponent;
 export type ColorScheme = 'dark' | 'light' | 'auto';
 export type EventFormat = 'universal-analytics' | 'google-analytics-4';
 export type ThemeConfig = Readonly<{
@@ -92,7 +92,10 @@ export type ThemeConfig = Readonly<{
     dimensions?: Readonly<{
         headerMobileHeight: number | 'mistica';
     }>;
-    Link?: LinkComponent;
+    Link?: LinkComponent | {
+        type: 'ReactRouter5' | 'ReactRouter6' | 'Next12' | 'Next13';
+        Component: React.ComponentType<any>;
+    };
     useHrefDecorator?: () => (href: string) => string;
     useId?: () => string;
     enableTabFocus?: boolean;