@telefonica/mistica 14.6.0 → 14.7.0

package/dist/sprinkles.css.d.ts

@@ -21,7 +21,7 @@ export declare const sprinkles: ((props: {
     readonly maxWidth?: "100%" | undefined;
     readonly maxHeight?: "100%" | undefined;
     readonly border?: "regular" | "none" | undefined;
-    readonly borderRadius?: 2 | 4 | 8 | 16 | "50%" | 20 | undefined;
+    readonly borderRadius?: (`var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`) | 2 | 4 | 8 | 16 | "50%" | 20 | undefined;
     readonly cursor?: "pointer" | undefined;
     readonly overflow?: "hidden" | "visible" | undefined;
     readonly top?: 0 | 2 | 4 | 8 | 12 | 16 | 24 | 32 | 40 | 48 | 56 | 64 | 72 | 80 | undefined;

package/dist/stepper.css-mistica.js

@@ -11,19 +11,19 @@ function _export(target, all) {
 _export(exports, {
     bar: ()=>_,
     barFilled: ()=>r,
-    barFilledAnimation: ()=>f,
-    barFilledReverseAnimation: ()=>a,
-    currentNumber: ()=>e,
-    iconAnimation: ()=>m,
-    number: ()=>y,
+    barFilledAnimation: ()=>a,
+    barFilledReverseAnimation: ()=>e,
+    currentNumber: ()=>f,
+    iconAnimation: ()=>y,
+    number: ()=>m,
     step: ()=>i,
-    stepIconNumber: ()=>h,
-    stepper: ()=>t,
+    stepIconNumber: ()=>t,
+    stepper: ()=>h,
     textContainer: ()=>o,
-    vars: ()=>p
+    vars: ()=>q
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./stepper.css.ts.vanilla.js");
-var _ = "_14h93mqk _1y2v1nf88 _1y2v1nf7p _1y2v1nf9j _1y2v1nf9o", r = "_14h93mqm _1y2v1nf88 _1y2v1nf7p _1y2v1nf9m _1y2v1nf9o", f = "_14h93mqn", a = "_14h93mqp _1y2v1nf7r", e = "_14h93mqf", m = "_14h93mqc", y = "_14h93mqe _1y2v1nf5i _1y2v1nf5x _1y2v1nf5r _1y2v1nf9h", i = "_14h93mq9 _1y2v1nf5d _1y2v1nf5j _1y2v1nf5o _1y2v1nf5x", h = "_14h93mqb _1y2v1nf5d _1y2v1nf5i", t = "_14h93mq7 _1y2v1nf5i _1y2v1nf95", o = "_14h93mqh _1y2v1nf5e", p = {
+var _ = "_14h93mqk _1y2v1nf8e _1y2v1nf7v _1y2v1nfa1 _1y2v1nfa4", r = "_14h93mqm _1y2v1nf8e _1y2v1nf7v _1y2v1nfa1 _1y2v1nfa4", a = "_14h93mqn", e = "_14h93mqp _1y2v1nf7x", f = "_14h93mqf", y = "_14h93mqc", m = "_14h93mqe _1y2v1nf5o _1y2v1nf63 _1y2v1nf5x _1y2v1nf9n", i = "_14h93mq9 _1y2v1nf5j _1y2v1nf5p _1y2v1nf5u _1y2v1nf63", t = "_14h93mqb _1y2v1nf5j _1y2v1nf5o", h = "_14h93mq7 _1y2v1nf5o _1y2v1nf9b", o = "_14h93mqh _1y2v1nf5k", q = {
     stepperMinHeight: "var(--_14h93mq0)"
 };

package/dist/switch-component.css-mistica.js

@@ -9,32 +9,32 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    ballVariants: ()=>n,
-    barVariants: ()=>v,
-    checkboxVariants: ()=>p,
-    container: ()=>f,
-    disabled: ()=>q,
+    ballVariants: ()=>h,
+    barVariants: ()=>q,
+    checkboxVariants: ()=>v,
+    container: ()=>p,
+    disabled: ()=>f,
     switchCheckboxContainerVariants: ()=>y,
     switchCheckboxLabel: ()=>_
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./switch-component.css.ts.vanilla.js");
-var n = {
-    default: "q0hp3as q0hp3aq q0hp3ap _1y2v1nf5e _1y2v1nfaw _1y2v1nf5k _1y2v1nf9h",
-    ios: "q0hp3at q0hp3ar q0hp3ap _1y2v1nf5e _1y2v1nfaw _1y2v1nf5k _1y2v1nf9h",
-    checked: "q0hp3au q0hp3aq q0hp3ap _1y2v1nf5e _1y2v1nfaw _1y2v1nf5k _1y2v1nf9h",
-    checkedIos: "q0hp3av q0hp3ar q0hp3ap _1y2v1nf5e _1y2v1nfaw _1y2v1nf5k _1y2v1nf9h"
+var h = {
+    default: "q0hp3as q0hp3aq q0hp3ap _1y2v1nf5k _1y2v1nfbc _1y2v1nf5q _1y2v1nf9n",
+    ios: "q0hp3at q0hp3ar q0hp3ap _1y2v1nf5k _1y2v1nfbc _1y2v1nf5q _1y2v1nf9n",
+    checked: "q0hp3au q0hp3aq q0hp3ap _1y2v1nf5k _1y2v1nfbc _1y2v1nf5q _1y2v1nf9n",
+    checkedIos: "q0hp3av q0hp3ar q0hp3ap _1y2v1nf5k _1y2v1nfbc _1y2v1nf5q _1y2v1nf9n"
+}, q = {
+    default: "q0hp3ai q0hp3ah _1y2v1nf5q",
+    ios: "q0hp3aj q0hp3ah _1y2v1nf5q",
+    checked: "q0hp3ak q0hp3ah _1y2v1nf5q",
+    checkedIos: "q0hp3al q0hp3ah _1y2v1nf5q"
 }, v = {
-    default: "q0hp3ai q0hp3ah _1y2v1nf5k",
-    ios: "q0hp3aj q0hp3ah _1y2v1nf5k",
-    checked: "q0hp3ak q0hp3ah _1y2v1nf5k",
-    checkedIos: "q0hp3al q0hp3ah _1y2v1nf5k"
-}, p = {
-    default: "q0hp3a6 _1y2v1nf5m _1y2v1nf9n",
-    ios: "q0hp3a7 _1y2v1nf5m _1y2v1nf9n",
-    disabled: "q0hp3a8 _1y2v1nf5m _1y2v1nf9n",
-    disabledIos: "q0hp3a9 _1y2v1nf5m _1y2v1nf9n"
-}, f = "q0hp3am", q = "q0hp3an", y = {
-    default: "q0hp3ac q0hp3ab _1y2v1nf5d",
-    ios: "q0hp3ad q0hp3ab _1y2v1nf5d"
-}, _ = "q0hp3af _1y2v1nf5k _1y2v1nf9o";
+    default: "q0hp3a6 _1y2v1nf5s _1y2v1nfa3",
+    ios: "q0hp3a7 _1y2v1nf5s _1y2v1nfa3",
+    disabled: "q0hp3a8 _1y2v1nf5s _1y2v1nfa3",
+    disabledIos: "q0hp3a9 _1y2v1nf5s _1y2v1nfa3"
+}, p = "q0hp3am", f = "q0hp3an", y = {
+    default: "q0hp3ac q0hp3ab _1y2v1nf5j",
+    ios: "q0hp3ad q0hp3ab _1y2v1nf5j"
+}, _ = "q0hp3af _1y2v1nf5q _1y2v1nfa4";

package/dist/tabs.css-mistica.js

@@ -13,20 +13,20 @@ _export(exports, {
     icon: ()=>y,
     inner: ()=>_,
     outer: ()=>a,
-    outerBorder: ()=>o,
-    tabSelectionVariants: ()=>e,
-    tabVariants: ()=>r,
-    tabWithIcon: ()=>g,
-    tabsContainer: ()=>t
+    outerBorder: ()=>m,
+    tabSelectionVariants: ()=>o,
+    tabVariants: ()=>t,
+    tabWithIcon: ()=>r,
+    tabsContainer: ()=>e
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./tabs.css.ts.vanilla.js");
-var v = "_1y2v1nf5h _1y2v1nf5e _1y2v1nfa4 _1y2v1nfaw _1y2v1nf87 _1y2v1nf3n", y = "lgofm1m", _ = "lgofm14 _1y2v1nf5e _1y2v1nfa4 _1y2v1nfai _1y2v1nf8j", a = "lgofm12 _1y2v1nf8g _1y2v1nf5d _1y2v1nf9o", o = "lgofm10", e = {
-    noSelected: "_1y2v1nf1q",
-    selected: "_1y2v1nf1o lgofm1h",
-    selectedAnimating: "_1y2v1nf1o lgofm1i"
-}, r = {
-    default: "lgofm17 _1y2v1nf5j _1y2v1nf5x _1y2v1nf5r _1y2v1nf72 _1y2v1nf7g _1y2v1nf8g _1y2v1nf5c lgofm18",
-    tabs2: "lgofm17 _1y2v1nf5j _1y2v1nf5x _1y2v1nf5r _1y2v1nf72 _1y2v1nf7g _1y2v1nf8g _1y2v1nf5c lgofm19",
-    tabs3: "lgofm17 _1y2v1nf5j _1y2v1nf5x _1y2v1nf5r _1y2v1nf72 _1y2v1nf7g _1y2v1nf8g _1y2v1nf5c lgofm1a"
-}, g = "lgofm1e", t = "_1y2v1nf8g _1y2v1nf5i";
+var v = "_1y2v1nf5n _1y2v1nf5k _1y2v1nfak _1y2v1nfbc _1y2v1nf8d _1y2v1nf3s", y = "lgofm1m", _ = "lgofm14 _1y2v1nf5k _1y2v1nfak _1y2v1nfay _1y2v1nf8p", a = "lgofm12 _1y2v1nf8m _1y2v1nf5j _1y2v1nfa4", m = "lgofm10", o = {
+    noSelected: "_1y2v1nf1t",
+    selected: "_1y2v1nf1r lgofm1h",
+    selectedAnimating: "_1y2v1nf1r lgofm1i"
+}, t = {
+    default: "lgofm17 _1y2v1nf5p _1y2v1nf63 _1y2v1nf5x _1y2v1nf78 _1y2v1nf7m _1y2v1nf8m _1y2v1nf5i lgofm18",
+    tabs2: "lgofm17 _1y2v1nf5p _1y2v1nf63 _1y2v1nf5x _1y2v1nf78 _1y2v1nf7m _1y2v1nf8m _1y2v1nf5i lgofm19",
+    tabs3: "lgofm17 _1y2v1nf5p _1y2v1nf63 _1y2v1nf5x _1y2v1nf78 _1y2v1nf7m _1y2v1nf8m _1y2v1nf5i lgofm1a"
+}, r = "lgofm1e", e = "_1y2v1nf8m _1y2v1nf5o";

package/dist/tag.css-mistica.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "tag", {
     enumerable: true,
-    get: ()=>n
+    get: ()=>_
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./tag.css.ts.vanilla.js");
-var n = "_1wy08671 _1y2v1nf67 _1y2v1nf6l _1y2v1nf5j _1y2v1nf5n _1y2v1nf5x _1y2v1nf5r _1y2v1nf8v _1y2v1nf7f";
+var _ = "_1wy08671 _1y2v1nf6d _1y2v1nf6r _1y2v1nf5p _1y2v1nf5t _1y2v1nf63 _1y2v1nf5x _1y2v1nf91 _1y2v1nf7l";

package/dist/tag.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "default", {
     enumerable: true,
-    get: ()=>R
+    get: ()=>N
 });
 const _boxJs = /*#__PURE__*/ _interopRequireDefault(require("./box.js"));
 const _textJs = require("./text.js");
@@ -73,10 +73,10 @@ function _objectSpreadProps(target, source) {
     }
     return target;
 }
-const { colors: r  } = _skinContractCssMisticaJs.vars, R = (param)=>{
-    let { Icon: o , children: i , dataAttributes: m , type: c = "promo"  } = param;
-    const s = (0, _themeVariantContextJs.useIsInverseVariant)();
-    if (!i) return null;
+const { colors: r  } = _skinContractCssMisticaJs.vars, N = (param)=>{
+    let { Icon: o , children: s , dataAttributes: c , type: l = "promo"  } = param;
+    const t = (0, _themeVariantContextJs.useThemeVariant)(), i = t === "inverse";
+    if (!s) return null;
     const g = {
         promo: [
             r.promoHigh,
@@ -91,7 +91,7 @@ const { colors: r  } = _skinContractCssMisticaJs.vars, R = (param)=>{
         inactive: [
             r.neutralMedium,
             r.neutralMediumInverse,
-            r.neutralLow
+            t === "alternative" ? r.neutralLowAlternative : r.neutralLow
         ],
         success: [
             r.successHigh,
@@ -108,17 +108,17 @@ const { colors: r  } = _skinContractCssMisticaJs.vars, R = (param)=>{
             r.errorHighInverse,
             r.errorLow
         ]
-    }, [n, t, l] = g[c];
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("span", _objectSpreadProps(_objectSpread({}, (0, _domJs.getPrefixedDataAttributes)(m, "Tag")), {
+    }, [n, a, p] = g[l];
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("span", _objectSpreadProps(_objectSpread({}, (0, _domJs.getPrefixedDataAttributes)(c, "Tag")), {
         className: (0, _classnames.default)(_tagCssMisticaJs.tag, (0, _sprinklesCssMisticaJs.sprinkles)({
             paddingLeft: o ? 8 : 12,
-            background: s ? r.inverse : l
+            background: i ? r.inverse : p
         })),
         children: [
             o && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_boxJs.default, {
                 paddingRight: 4,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(o, {
-                    color: s ? t : n,
+                    color: i ? a : n,
                     size: (0, _cssJs.pxToRem)(16),
                     className: (0, _sprinklesCssMisticaJs.sprinkles)({
                         display: "block"
@@ -128,12 +128,12 @@ const { colors: r  } = _skinContractCssMisticaJs.vars, R = (param)=>{
             /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_themeVariantContextJs.ThemeVariant, {
                 isInverse: !1,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textJs.Text, {
-                    color: s ? t : n,
+                    color: i ? a : n,
                     size: 14,
                     lineHeight: 20,
                     weight: "medium",
                     truncate: !0,
-                    children: i
+                    children: s
                 })
             })
         ]

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

@@ -10,22 +10,22 @@ function _export(target, all) {
 }
 _export(exports, {
     endIcon: ()=>n,
-    fullWidth: ()=>t,
-    input: ()=>e,
-    inputFirefoxStyles: ()=>f,
-    inputWithLabel: ()=>r,
+    fullWidth: ()=>r,
+    input: ()=>t,
+    inputFirefoxStyles: ()=>e,
+    inputWithLabel: ()=>f,
     inputWithoutLabel: ()=>_,
     menuItem: ()=>a,
     menuItemSelected: ()=>h,
     prefix: ()=>i,
     prefixWithLabel: ()=>o,
     prefixWithoutLabel: ()=>l,
-    startIcon: ()=>p,
-    suggestionsContainer: ()=>x,
-    textArea: ()=>u,
-    textAreaWithLabel: ()=>b,
-    textAreaWithoutLabel: ()=>m
+    startIcon: ()=>u,
+    suggestionsContainer: ()=>p,
+    textArea: ()=>b,
+    textAreaWithLabel: ()=>m,
+    textAreaWithoutLabel: ()=>x
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./text-field-base.css.ts.vanilla.js");
-var n = "rhey4tf _1y2v1nf70 _1y2v1nf7g _1y2v1nf5i _1y2v1nf5x", t = "rhey4t4", e = "rhey4ta _1y2v1nf5d _1y2v1nf85 rhey4t1 _1y2v1nf9g _1y2v1nf8l _1y2v1nf1o _1y2v1nf7p", f = "rhey4tb", r = "rhey4tc", _ = "_1y2v1nf6a _1y2v1nf6o", a = "rhey4to _1y2v1nf8f _1y2v1nf5i _1y2v1nf5x _1y2v1nf9n", h = "_1y2v1nf2w", i = "rhey4tj _1y2v1nf71 _1y2v1nf7g", o = "rhey4tl _1y2v1nf6m", l = "_1y2v1nf6a _1y2v1nf6o", p = "rhey4th _1y2v1nf71 _1y2v1nf7f _1y2v1nf5i _1y2v1nf5x _1y2v1nf85 _1y2v1nf5e", x = "rhey4tr _1y2v1nf5e", u = "rhey4t6 _1y2v1nf65 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7b rhey4t1 _1y2v1nf9g _1y2v1nf8l _1y2v1nf1o _1y2v1nf7p", b = "rhey4t7", m = "rhey4t8";
+var n = "rhey4tf _1y2v1nf76 _1y2v1nf7m _1y2v1nf5o _1y2v1nf63", r = "rhey4t4", t = "rhey4ta _1y2v1nf5j _1y2v1nf8b rhey4t1 _1y2v1nf9m _1y2v1nf8r _1y2v1nf1r _1y2v1nf7v", e = "rhey4tb", f = "rhey4tc", _ = "_1y2v1nf6g _1y2v1nf6u", a = "rhey4to _1y2v1nf8l _1y2v1nf5o _1y2v1nf63 _1y2v1nfa3", h = "_1y2v1nf31", i = "rhey4tj _1y2v1nf77 _1y2v1nf7m", o = "rhey4tl _1y2v1nf6s", l = "_1y2v1nf6g _1y2v1nf6u", u = "rhey4th _1y2v1nf77 _1y2v1nf7l _1y2v1nf5o _1y2v1nf63 _1y2v1nf8b _1y2v1nf5k", p = "rhey4tr _1y2v1nf5k", b = "rhey4t6 _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h rhey4t1 _1y2v1nf9m _1y2v1nf8r _1y2v1nf1r _1y2v1nf7v", m = "rhey4t7", x = "rhey4t8";

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

@@ -11,23 +11,23 @@ function _export(target, all) {
 _export(exports, {
     DEFAULT_WIDTH: ()=>_,
     LABEL_LEFT_POSITION: ()=>n,
-    LABEL_SCALE_DESKTOP: ()=>f,
-    LABEL_SCALE_MOBILE: ()=>a,
+    LABEL_SCALE_DESKTOP: ()=>a,
+    LABEL_SCALE_MOBILE: ()=>f,
     disabled: ()=>e,
-    field: ()=>i,
-    fieldContainer: ()=>y,
+    field: ()=>y,
+    fieldContainer: ()=>i,
     fieldMulti: ()=>l,
     fieldSingle: ()=>t,
-    fullWidth: ()=>k,
-    helperContainer: ()=>u,
-    helperText: ()=>d,
+    fullWidth: ()=>u,
+    helperContainer: ()=>k,
+    helperText: ()=>o,
     labelContainer: ()=>L,
-    labelText: ()=>o,
+    labelText: ()=>d,
     leftText: ()=>E,
     normalWidth: ()=>T,
     rightText: ()=>h,
-    shrinked: ()=>p
+    shrinked: ()=>A
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./text-field-components.css.ts.vanilla.js");
-var _ = 328, n = 12, f = 0.78, a = 0.75, e = "_15k6ur97", i = "_1y2v1nf9o _1y2v1nf9f _1y2v1nf5i _1y2v1nf9k _1y2v1nf5d", y = "_15k6ur96 _1y2v1nf5i _1y2v1nf5o", l = "_15k6ur9e", t = "_15k6ur9d _1y2v1nf8g", k = "_1y2v1nf7p", u = "_1y2v1nf71 _1y2v1nf7g _1y2v1nf5i", d = "_15k6ur9g", L = "_15k6ur91 _1y2v1nf5e _1y2v1nf9q _1y2v1nf8c _1y2v1nf5i _1y2v1nf5n _1y2v1nfa8", o = "_15k6ur93 _1y2v1nf9o _1y2v1nf61", E = "_15k6ur9h", T = "_15k6ur99 _1y2v1nf7p", h = "_15k6ur9i", p = "_15k6ur94";
+var _ = 328, n = 12, a = 0.78, f = 0.75, e = "_15k6ur97", y = "_1y2v1nfa4 _1y2v1nf9l _1y2v1nf5o _1y2v1nf9u _1y2v1nf5j", i = "_15k6ur96 _1y2v1nf5o _1y2v1nf5u", l = "_15k6ur9e", t = "_15k6ur9d _1y2v1nf8m", u = "_1y2v1nf7v", k = "_1y2v1nf77 _1y2v1nf7m _1y2v1nf5o", o = "_15k6ur9g", L = "_15k6ur91 _1y2v1nf5k _1y2v1nfa6 _1y2v1nf8i _1y2v1nf5o _1y2v1nf5t _1y2v1nfao", d = "_15k6ur93 _1y2v1nfa4 _1y2v1nf67", E = "_15k6ur9h", T = "_15k6ur99 _1y2v1nf7v", h = "_15k6ur9i", A = "_15k6ur94";

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

@@ -4,12 +4,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "variants", {
     enumerable: true,
-    get: ()=>v
+    get: ()=>r
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./text-link.css.ts.vanilla.js");
-var v = {
-    default: "_1m1n0pr1 _1y2v1nf7q _1y2v1nf5l _1y2v1nf9n _1y2v1nf1z",
-    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nf7q _1y2v1nf5l _1y2v1nf9n _1y2v1nf20",
-    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nf7q _1y2v1nf5l _1y2v1nf9n _1y2v1nf1z"
+var r = {
+    default: "_1m1n0pr1 _1y2v1nf7w _1y2v1nf5r _1y2v1nfa3 _1y2v1nf22",
+    inverseLight: "_1m1n0pr6 _1m1n0pr1 _1y2v1nf7w _1y2v1nf5r _1y2v1nfa3 _1y2v1nf23",
+    inverseDark: "_1m1n0pr7 _1m1n0pr1 _1y2v1nf7w _1y2v1nf5r _1y2v1nfa3 _1y2v1nf22"
 };

package/dist/theme-context-provider.js

@@ -9,8 +9,8 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    default: ()=>pt,
-    useIsOsDarkModeEnabled: ()=>U
+    default: ()=>bt,
+    useIsOsDarkModeEnabled: ()=>Y
 });
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _dynamic = require("@vanilla-extract/dynamic");
@@ -28,6 +28,7 @@ const _aspectRatioSupportJs = require("./utils/aspect-ratio-support.js");
 const _analyticsJs = require("./utils/analytics.js");
 const _skinContractCssMisticaJs = require("./skins/skin-contract.css-mistica.js");
 const _colorJs = require("./utils/color.js");
+const _defaultsJs = require("./skins/defaults.js");
 const _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -101,44 +102,22 @@ function _objectSpread(target) {
     }
     return target;
 }
-const Q = "(prefers-color-scheme: dark)", U = ()=>{
+const X = "(prefers-color-scheme: dark)", Y = ()=>{
     const [t, c] = _react.useState(!1);
     return (0, _hooksJs.useIsomorphicLayoutEffect)(()=>{
         if (!window.matchMedia) return;
-        const o = window.matchMedia(Q), i = ()=>{
+        const o = window.matchMedia(X), s = ()=>{
             c(o.matches);
         };
-        return o.addListener(i), i(), ()=>o.removeListener(i);
+        return o.addListener(s), s(), ()=>o.removeListener(s);
     }, []), t;
-}, X = ()=>(t)=>t, r = {
-    text5: {
-        weight: "light"
-    },
-    text6: {
-        weight: "light"
-    },
-    text7: {
-        weight: "light"
-    },
-    text8: {
-        weight: "light"
-    },
-    text9: {
-        weight: "light"
-    },
-    text10: {
-        weight: "light"
-    },
-    cardTitle: {
-        weight: "regular"
-    }
-}, Y = (t)=>({
+}, Z = ()=>(t)=>t, tt = (t)=>({
         headerMobileHeight: (t == null ? void 0 : t.headerMobileHeight) === "mistica" ? _themeJs.NAVBAR_HEIGHT_MOBILE : t == null ? void 0 : t.headerMobileHeight
-    }), pt = (param)=>{
+    }), bt = (param)=>{
     let { theme: t , children: c , as: o  } = param;
-    var v;
-    const i = _react.useRef(1), D = _react.useCallback(()=>`aria-id-hook-${i.current++}`, []), w = U(), u = (v = t.colorScheme) != null ? v : "auto", C = t.skin.colors, I = _objectSpread({}, t.skin.colors, t.skin.darkModeColors), f = u === "auto" && w || u === "dark", p = f ? I : C, g = _react.useMemo(()=>{
-        var s, n, d, x, m, h, P, M, b;
+    var b, P;
+    const s = _react.useRef(1), I = _react.useCallback(()=>`aria-id-hook-${s.current++}`, []), E = Y(), u = (b = t.colorScheme) != null ? b : "auto", R = t.skin.colors, A = _objectSpread({}, t.skin.colors, t.skin.darkModeColors), x = u === "auto" && E || u === "dark", p = x ? A : R, k = _react.useMemo(()=>{
+        var i, a, d, f, m, g, M, T, C;
         const l = _objectSpread({
             platform: (0, _platformJs.getPlatform)(),
             insideNovumNativeApp: (0, _platformJs.isInsideNovumNativeApp)()
@@ -152,59 +131,60 @@ const Q = "(prefers-color-scheme: dark)", U = ()=>{
                 logEvent: ()=>Promise.resolve(),
                 eventFormat: "universal-analytics"
             }, t.analytics),
-            dimensions: _objectSpread({}, _themeJs.dimensions, Y(t.dimensions)),
+            dimensions: _objectSpread({}, _themeJs.dimensions, tt(t.dimensions)),
             textPresets: {
-                text5: _objectSpread({}, r.text5, (s = t.skin.textPresets) == null ? void 0 : s.text5),
-                text6: _objectSpread({}, r.text6, (n = t.skin.textPresets) == null ? void 0 : n.text6),
-                text7: _objectSpread({}, r.text7, (d = t.skin.textPresets) == null ? void 0 : d.text7),
-                text8: _objectSpread({}, r.text8, (x = t.skin.textPresets) == null ? void 0 : x.text8),
-                text9: _objectSpread({}, r.text9, (m = t.skin.textPresets) == null ? void 0 : m.text9),
-                text10: _objectSpread({}, r.text10, (h = t.skin.textPresets) == null ? void 0 : h.text10),
-                cardTitle: _objectSpread({}, r.cardTitle, (P = t.skin.textPresets) == null ? void 0 : P.cardTitle)
+                text5: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.text5, (i = t.skin.textPresets) == null ? void 0 : i.text5),
+                text6: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.text6, (a = t.skin.textPresets) == null ? void 0 : a.text6),
+                text7: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.text7, (d = t.skin.textPresets) == null ? void 0 : d.text7),
+                text8: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.text8, (f = t.skin.textPresets) == null ? void 0 : f.text8),
+                text9: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.text9, (m = t.skin.textPresets) == null ? void 0 : m.text9),
+                text10: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.text10, (g = t.skin.textPresets) == null ? void 0 : g.text10),
+                cardTitle: _objectSpread({}, _defaultsJs.defaultTextPresetsConfig.cardTitle, (M = t.skin.textPresets) == null ? void 0 : M.cardTitle)
             },
-            Link: (M = t.Link) != null ? M : _themeJs.AnchorLink,
-            isDarkMode: f,
+            Link: (T = t.Link) != null ? T : _themeJs.AnchorLink,
+            isDarkMode: x,
             isIos: (0, _platformJs.getPlatform)(l) === "ios",
-            useHrefDecorator: (b = t.useHrefDecorator) != null ? b : X,
+            useHrefDecorator: (C = t.useHrefDecorator) != null ? C : Z,
             useId: t.useId
         };
     }, [
         t,
-        f
-    ]), E = Object.fromEntries(Object.entries(p).map((param)=>{
-        let [l, s] = param;
-        let n = "";
-        if (s.startsWith("#")) {
-            const [d, x, m] = (0, _colorJs.fromHexToRgb)(s);
-            n = `${d}, ${x}, ${m}`;
+        x
+    ]), H = Object.fromEntries(Object.entries(p).map((param)=>{
+        let [l, i] = param;
+        let a = "";
+        if (i.startsWith("#")) {
+            const [d, f, m] = (0, _colorJs.fromHexToRgb)(i);
+            a = `${d}, ${f}, ${m}`;
         }
         return [
             l,
-            n
+            a
         ];
-    })), k = (0, _dynamic.assignInlineVars)(_skinContractCssMisticaJs.vars, {
+    })), v = (0, _dynamic.assignInlineVars)(_skinContractCssMisticaJs.vars, {
         colors: p,
-        rawColors: E
+        rawColors: H,
+        borderRadii: (P = t.skin.borderRadii) != null ? P : _defaultsJs.defaultBorderRadiiConfig
     });
     return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_tabFocusJs.default, {
         disabled: !t.enableTabFocus,
         children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_modalContextProviderJs.default, {
             children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_themeContextJs.default.Provider, {
-                value: g,
+                value: k,
                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_analyticsJs.TrackingConfig, {
-                    eventFormat: g.analytics.eventFormat,
+                    eventFormat: k.analytics.eventFormat,
                     children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_aspectRatioSupportJs.AspectRatioSupportProvider, {
                         children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_documentVisibilityJs.DocumentVisibilityProvider, {
                             children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_ariaIdGetterContextJs.default.Provider, {
-                                value: D,
+                                value: I,
                                 children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_screenSizeContextProviderJs.default, {
                                     children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_dialogJs.default, {
                                         children: o ? /*#__PURE__*/ _react.createElement(o, {
-                                            style: k
+                                            style: v
                                         }, c) : /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_jsxRuntimeJs.Fragment, {
                                             children: [
                                                 (process.env.NODE_ENV !== "test" || process.env.SSR_TEST) && /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("style", {
-                                                    children: `:root {${k}}`
+                                                    children: `:root {${v}}`
                                                 }),
                                                 c
                                             ]

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

@@ -1,8 +1,11 @@
 import * as React from 'react';
+export type Variant = 'default' | 'inverse' | 'alternative';
 type ThemeVariantProps = {
-    isInverse: boolean;
+    isInverse?: boolean;
+    variant?: Variant;
     children: React.ReactNode;
 };
 export declare const ThemeVariant: React.FC<ThemeVariantProps>;
+export declare const useThemeVariant: () => Variant;
 export declare const useIsInverseVariant: () => boolean;
 export {};

package/dist/theme-variant-context.js

@@ -9,8 +9,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    ThemeVariant: ()=>n,
-    useIsInverseVariant: ()=>i
+    ThemeVariant: ()=>c,
+    useIsInverseVariant: ()=>u,
+    useThemeVariant: ()=>m
 });
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
@@ -53,10 +54,10 @@ function _interopRequireWildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-const t = /*#__PURE__*/ _react.createContext(!1), n = (param)=>/* @__PURE__ */ {
-    let { isInverse: r , children: s  } = param;
-    return (0, _jsxRuntimeJs.jsx)(t.Provider, {
-        value: !!r,
-        children: s
+const o = /*#__PURE__*/ _react.createContext("default"), c = (param)=>/* @__PURE__ */ {
+    let { isInverse: s , variant: e , children: r  } = param;
+    return (0, _jsxRuntimeJs.jsx)(o.Provider, {
+        value: e != null ? e : s ? "inverse" : "default",
+        children: r
     });
-}, i = ()=>_react.useContext(t);
+}, m = ()=>_react.useContext(o), u = ()=>m() === "inverse";

package/dist/tooltip.css-mistica.js

@@ -29,11 +29,11 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./tooltip.css.ts.vanilla.js");
-var v = "_1xhatbpb _1y2v1nf5e _1y2v1nf9q _1y2v1nf7v _1y2v1nf8a _1y2v1nf9i _1y2v1nf2q _1y2v1nf9f", t = "_1xhatbpe", _ = "_1xhatbpf", n = "_1xhatbpd", e = "_1xhatbpc", f = "_1y2v1nf5e _1y2v1nf7x _1y2v1nf8a _1y2v1nf9o _1y2v1nf2", p = "_1xhatbpj _1y2v1nf68 _1y2v1nf6m _1y2v1nf70 _1y2v1nf7e _1y2v1nf5e _1y2v1nfa9 _1y2v1nf7q _1y2v1nf9k _1y2v1nf9f", o = "_1xhatbpk", x = "_1xhatbpl", y = "_1xhatbpm", h = "_1xhatbpn", b = "_1xhatbpo", m = "_1xhatbp6", i = "_1xhatbp7", w = "_1xhatbp8", s = {
+var v = "_1xhatbpb _1y2v1nf5k _1y2v1nfa6 _1y2v1nf81 _1y2v1nf8g _1y2v1nf9o _1y2v1nf2t _1y2v1nf9l", t = "_1xhatbpe", _ = "_1xhatbpf", n = "_1xhatbpd", e = "_1xhatbpc", f = "_1y2v1nf5k _1y2v1nf83 _1y2v1nf8g _1y2v1nfa4 _1y2v1nf2", p = "_1xhatbpj _1y2v1nf6e _1y2v1nf6s _1y2v1nf76 _1y2v1nf7k _1y2v1nf5k _1y2v1nfap _1y2v1nf7w _1y2v1nf9x _1y2v1nf9l", 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 = "_1y2v1nf5m";
+}, d = "_1y2v1nf5s";

package/dist/touchable.css-mistica.js

@@ -15,4 +15,4 @@ _export(exports, {
 });
 require("./sprinkles.css.ts.vanilla.js");
 require("./touchable.css.ts.vanilla.js");
-var f = "mhti6u1 _1y2v1nf9n", y = "mhti6u4", _ = "mhti6u1 _1y2v1nf9n _1y2v1nf65 _1y2v1nf6j _1y2v1nf6x _1y2v1nf7b _1y2v1nf5k _1y2v1nf9g _1y2v1nf7p _1y2v1nf2n _1y2v1nf5c _1y2v1nf9p";
+var f = "mhti6u1 _1y2v1nfa3", y = "mhti6u4", _ = "mhti6u1 _1y2v1nfa3 _1y2v1nf6b _1y2v1nf6p _1y2v1nf73 _1y2v1nf7h _1y2v1nf5q _1y2v1nf9m _1y2v1nf7v _1y2v1nf2q _1y2v1nf5i _1y2v1nfa5";

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

@@ -9,13 +9,13 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    container: ()=>a,
+    container: ()=>v,
     containerWithWrapper: ()=>n,
     vars: ()=>y,
-    wrapper: ()=>p
+    wrapper: ()=>f
 });
 require("../sprinkles.css.ts.vanilla.js");
 require("./aspect-ratio-support.css.ts.vanilla.js");
-var a = "yqswj62", n = "_1y2v1nf7p _1y2v1nf85 _1y2v1nf9q _1y2v1nfa4", y = {
+var v = "yqswj62", n = "_1y2v1nf7v _1y2v1nf8b _1y2v1nfa6 _1y2v1nfak", y = {
     aspectRatio: "var(--yqswj60)"
-}, p = "_1y2v1nf9o _1y2v1nf9d _1y2v1nf9e _1y2v1nf5d";
+}, f = "_1y2v1nfa4 _1y2v1nf9j _1y2v1nf9k _1y2v1nf5j";

package/dist/utils/renders-element.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import type * as React from 'react';
 export type RendersElement<T extends keyof JSX.IntrinsicElements | React.JSXElementConstructor<any>> = React.ReactComponentElement<T>;
 export type RendersNullableElement<T extends keyof JSX.IntrinsicElements | React.JSXElementConstructor<any>> = React.ReactComponentElement<T> | null;

package/dist/video.css-mistica.js

@@ -7,4 +7,4 @@ Object.defineProperty(exports, "video", {
     get: ()=>f
 });
 require("./sprinkles.css.ts.vanilla.js");
-var f = "_1y2v1nf5k _1y2v1nf7p _1y2v1nf85 _1y2v1nf5c _1y2v1nf9d _1y2v1nf9e _1y2v1nfba";
+var f = "_1y2v1nf5q _1y2v1nf7v _1y2v1nf8b _1y2v1nf5i _1y2v1nf9j _1y2v1nf9k _1y2v1nfbq";