@telefonica/mistica 15.20.1 → 16.0.0

package/dist/generated/mistica-icons/icon-hand-snap-light.js

@@ -97,7 +97,7 @@ const s = (_param)=>{
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), o = r !== null && r !== void 0 ? r : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: n } = (0, _hooks.useTheme)();
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), o = r !== null && r !== void 0 ? r : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: n } = (0, _hooks.useTheme)();
     return n.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: a,
         height: a,

package/dist/generated/mistica-icons/icon-hand-snap-regular.js

@@ -93,11 +93,11 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const s = (_param)=>{
-    var { color: r, size: a = 24 } = _param, c = _object_without_properties(_param, [
+    var { color: o, size: a = 24 } = _param, c = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const n = (0, _themevariantcontext.useIsInverseVariant)(), e = r !== null && r !== void 0 ? r : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
+    const n = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), e = o !== null && o !== void 0 ? o : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
     return t.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: a,
         height: a,

package/dist/generated/mistica-icons/icon-hand-up-filled.js

@@ -96,7 +96,7 @@ const l = (_param)=>{
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), s = c !== null && c !== void 0 ? c : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), i = c !== null && c !== void 0 ? c : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: o,
         height: o,
@@ -104,7 +104,7 @@ const l = (_param)=>{
         role: "presentation"
     }, n), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: s,
+            fill: i,
             d: "M18.159 9.614q-.424 0-.773.118c-.238-.857-.941-1.367-1.95-1.367q-.425.002-.776.118c-.24-.85-.94-1.353-1.944-1.353q-.37 0-.683.09V4.316c0-1.333-.818-2.162-2.135-2.162-1.266 0-2.042.77-2.128 2.118V11.7c-.34-.577-.645-.98-1.009-1.271a1.93 1.93 0 0 0-1.207-.432c-.403 0-.801.132-1.132.398-.65.52-.81 1.409-.409 2.263a415 415 0 0 0 2.748 5.647c.574 1.165 1.07 2.174 1.21 2.476.146.32.49 1.062 1.272 1.062h7.787c.983 0 1.82-.308 2.361-.866.538-.554.81-1.33.81-2.302v-6.997c-.006-1.275-.784-2.065-2.042-2.065"
         })
     }));

package/dist/generated/mistica-icons/icon-hand-up-light.js

@@ -91,12 +91,12 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const i = (_param)=>{
+const s = (_param)=>{
     var { color: t, size: c = 24 } = _param, a = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const n = (0, _themevariantcontext.useIsInverseVariant)(), e = t !== null && t !== void 0 ? t : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const e = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), n = t !== null && t !== void 0 ? t : e ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,
@@ -104,8 +104,8 @@ const i = (_param)=>{
         role: "presentation"
     }, a), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: n,
             d: "M17.39 9.732q.346-.117.774-.118c1.258 0 2.036.79 2.039 2.065v7c0 .969-.272 1.745-.81 2.3-.54.557-1.378.865-2.36.865H9.244c-.782 0-1.126-.745-1.272-1.062-.137-.298-.613-1.265-1.17-2.396l-.04-.08-.208-.424a405 405 0 0 1-2.537-5.223c-.4-.854-.24-1.742.41-2.263a1.8 1.8 0 0 1 1.13-.398c.44.003.866.154 1.208.432.364.29.67.694 1.008 1.271l.003-7.428c.087-1.348.863-2.118 2.13-2.118 1.316 0 2.133.826 2.133 2.16v2.904q.314-.089.684-.09c1.003 0 1.703.505 1.944 1.354q.35-.116.776-.118c1.005 0 1.709.51 1.947 1.367m1.418 10.67c.387-.398.58-.98.58-1.729l-.003-6.991c0-.824-.412-1.241-1.224-1.241-.19 0-.367.025-.518.075a.8.8 0 0 1-.639-.056.82.82 0 0 1-.4-.504c-.143-.51-.535-.767-1.166-.767-.193 0-.37.025-.52.075a.819.819 0 0 1-1.04-.555c-.143-.504-.535-.759-1.162-.759q-.258 0-.465.06a.8.8 0 0 1-.219.03.82.82 0 0 1-.812-.82V4.316c0-.876-.457-1.339-1.32-1.339-.529 0-1.238.138-1.316 1.348V11.7c0 .37-.247.695-.6.793a.81.81 0 0 1-.915-.373c-.309-.526-.552-.84-.813-1.047a1.13 1.13 0 0 0-.703-.255 1 1 0 0 0-.625.218c-.347.278-.414.765-.179 1.266.678 1.449 1.82 3.77 2.74 5.636.552 1.118 1.07 2.177 1.218 2.496.193.42.345.585.535.585h7.787c.762 0 1.393-.22 1.779-.619"
         })
     }));
-}, v = i;
+}, v = s;

package/dist/generated/mistica-icons/icon-hand-up-regular.js

@@ -96,7 +96,7 @@ const l = (_param)=>{
         "color",
         "size"
     ]);
-    const n = (0, _themevariantcontext.useIsInverseVariant)(), t = a !== null && a !== void 0 ? a : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const n = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), t = a !== null && a !== void 0 ? a : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,

package/dist/generated/mistica-icons/icon-hard-disk-filled.js

@@ -91,12 +91,12 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const a = (_param)=>{
-    var { color: r, size: c = 24 } = _param, o = _object_without_properties(_param, [
+const t = (_param)=>{
+    var { color: s, size: c = 24 } = _param, o = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const e = (0, _themevariantcontext.useIsInverseVariant)(), i = r !== null && r !== void 0 ? r : e ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const e = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), i = s !== null && s !== void 0 ? s : e ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,
@@ -108,4 +108,4 @@ const a = (_param)=>{
             d: "m21.84 15.735-.002-.02q.001-.005-.005-.011l-.008-.078v-.003c-.003-.044-.006-.09-.017-.135l-1.524-12.1c-.132-.718-.68-1.216-1.336-1.216L5.046 2.155c-.692 0-1.252.566-1.25 1.202l-1.638 12.28.001.024.002.023q0 .019-.003.035l-.003.035v4.83c0 .694.56 1.257 1.252 1.257H20.59c.692 0 1.252-.566 1.252-1.257v-4.83zm-.976-1.202a1.2 1.2 0 0 0-.275-.034v-.002H3.41c-.092 0-.184.014-.274.033L4.617 3.41c0-.238.193-.434.432-.434l13.902.017c.252 0 .47.224.526.52zM6.065 4.76c-.484 0-.764-.176-.764-.552 0-.378.283-.554.764-.554s.765.176.765.554c0 .376-.28.552-.765.552m7.681 3.798c0-.414-.17-1.378-1.748-1.378-1.577 0-1.745.964-1.745 1.378 0 .415.168 1.379 1.745 1.379s1.748-.964 1.748-1.379m-.82.003c0 .165 0 .555-.928.555-.927 0-.927-.387-.927-.555s0-.557.927-.557.927.392.927.557m5.383-4.353c0-.378-.283-.554-.765-.554-.484 0-.767.176-.764.554 0 .376.28.552.764.552.482 0 .765-.176.765-.552m.11 9.04c0-.379.282-.555.764-.555s.765.176.765.554c0 .376-.283.552-.765.552-.485.003-.765-.176-.765-.552M16.636 8.56c0-.787 0-3.185-4.639-3.185-4.638 0-4.638 2.398-4.638 3.185a3.4 3.4 0 0 0 .193 1.185c.52-.207.991-.28 1.297-.078a.76.76 0 0 1 .347.59c.022.267-.09.589-.274.925l.022.011c.759.364 1.787.55 3.053.55 4.639 0 4.639-2.396 4.639-3.183m-4.639-4.42c5.107 0 5.868 2.768 5.868 4.417s-.761 4.415-5.868 4.415c-1.45 0-2.658-.224-3.582-.67l-.152-.075a.1.1 0 0 1-.025-.02q-.009-.009-.02-.017a16 16 0 0 1-1.442 1.527c-.353.325-.765.487-1.19.487-.348 0-.706-.109-1.048-.33-.518-.339-.656-.714-.675-.97-.02-.249.045-.627.473-1.019l.004-.004c.076-.066 1.068-.93 2.139-1.587l-.024-.033c-.024-.032-.048-.065-.063-.107a4.6 4.6 0 0 1-.266-1.6c.003-1.646.765-4.414 5.871-4.414m6.465 15.347c-.678 0-1.098-.423-1.098-1.1 0-.681.42-1.101 1.098-1.101s1.098.423 1.098 1.1c0 .681-.42 1.101-1.098 1.101"
         })
     }));
-}, d = a;
+}, d = t;

package/dist/generated/mistica-icons/icon-hard-disk-light.js

@@ -96,7 +96,7 @@ const e = (_param)=>{
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), a = o !== null && o !== void 0 ? o : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), a = o !== null && o !== void 0 ? o : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,

package/dist/generated/mistica-icons/icon-hard-disk-regular.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return h;
+        return d;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -96,7 +96,7 @@ const i = (_param)=>{
         "color",
         "size"
     ]);
-    const a = (0, _themevariantcontext.useIsInverseVariant)(), e = s !== null && s !== void 0 ? s : a ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const a = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), e = s !== null && s !== void 0 ? s : a ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,
@@ -108,4 +108,4 @@ const i = (_param)=>{
             d: "m21.835 15.623-.001-.011v-.02l-.014-.12-.005-.043a.4.4 0 0 0-.01-.064L20.316 3.54c-.148-.807-.775-1.37-1.523-1.37L5.2 2.155c-.796 0-1.446.653-1.44 1.367L2.159 15.528q-.002.015 0 .03.002.01.002.023l-.005.037a.4.4 0 0 0-.006.055v4.723c0 .798.65 1.448 1.446 1.448h16.798c.798 0 1.445-.65 1.445-1.448v-4.723q0-.026-.004-.05M4.996 3.603c0-.112.093-.204.205-.201l13.59.014c.138 0 .267.148.298.316l1.322 10.493-.009-.001-.008-.002H3.596l-.007.002-.007.001zm15.398 16.995H3.593a.205.205 0 0 1-.202-.205V15.67c0-.112.09-.204.202-.204H20.39c.107 0 .188.084.196.188l.009.056v4.683c0 .112-.09.204-.202.204M11.996 8.105c.894 0 .894.372.894.532s0 .53-.894.53c-.893 0-.893-.37-.893-.53s0-.532.893-.532m-1.72.532c0 .409.168 1.358 1.72 1.358s1.72-.95 1.723-1.358c0-.41-.168-1.362-1.723-1.362-1.552 0-1.72.953-1.72 1.362m7.773 10.227c-.507 0-.703-.196-.703-.706 0-.504.2-.703.703-.703.505 0 .703.196.703.703 0 .51-.198.706-.703.706m1.53-.706c0-.958-.572-1.532-1.53-1.532s-1.532.574-1.529 1.532c0 .96.571 1.535 1.53 1.535.957 0 1.529-.575 1.529-1.535M6.195 4.92c-.473 0-.748-.174-.748-.54 0-.37.275-.542.748-.542.47 0 .748.174.748.541 0 .37-.275.54-.748.54m10.473-.54c0 .366.275.54.748.54.47 0 .748-.171.748-.54 0-.368-.277-.542-.748-.542-.473 0-.748.171-.748.541m2.35 9.38c-.473 0-.747-.174-.747-.54 0-.37.274-.541.747-.541.474 0 .748.17.748.54s-.274.541-.747.541M5.013 12.544c-.006-.084.067-.201.202-.325.798-.73 2.854-2.14 3.347-2.14q.021 0 .04.003c.066.367-1.099 1.804-2.102 2.723-.448.409-.899.263-1.196.07-.173-.115-.283-.238-.291-.33m2.468-3.907c0-.765 0-3.093 4.512-3.095 4.516 0 4.516 2.33 4.516 3.095 0 .762 0 3.09-4.516 3.09-1.232 0-2.235-.18-2.972-.533l-.02-.008c.272-.426.452-.84.427-1.168a.76.76 0 0 0-.345-.588c-.339-.222-.88-.107-1.468.16a3.5 3.5 0 0 1-.134-.953m-3.292 3.977c.023.252.155.625.667.958.336.219.686.325 1.028.323.42 0 .826-.163 1.174-.482.047-.042.624-.575 1.196-1.238l.028.025a.2.2 0 0 0 .053.042l.149.073c.907.437 2.09.655 3.51.655 5.01 0 5.758-2.717 5.758-4.336 0-1.622-.747-4.339-5.759-4.339-5.005 0-5.753 2.717-5.753 4.339a4.6 4.6 0 0 0 .263 1.577 19 19 0 0 0-1.838 1.388l-.008.007c-.423.39-.487.762-.468 1.008"
         })
     }));
-}, h = i;
+}, d = i;

package/dist/generated/mistica-icons/icon-hd-filled.js

@@ -97,7 +97,7 @@ const v = (_param)=>{
         "color",
         "size"
     ]);
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), s = c !== null && c !== void 0 ? c : i ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: n } = (0, _hooks.useTheme)();
+    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), s = c !== null && c !== void 0 ? c : i ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: n } = (0, _hooks.useTheme)();
     return n.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: e,
         height: e,

package/dist/generated/mistica-icons/icon-hd-light.js

@@ -92,20 +92,20 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const m = (_param)=>{
-    var { color: t, size: h = 24 } = _param, c = _object_without_properties(_param, [
+const a = (_param)=>{
+    var { color: t, size: h = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const s = (0, _themevariantcontext.useIsInverseVariant)(), e = t !== null && t !== void 0 ? t : s ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
-    return i.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
+    const i = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), r = t !== null && t !== void 0 ? t : i ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: s } = (0, _hooks.useTheme)();
+    return s.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: h,
         height: h,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, c), {
+    }, e), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: r,
             d: "M2 6v12h20V6zm4.257 3.2v5.6c0 .333.246.6.555.6.308 0 .554-.267.554-.6V12.6h2.963V14.8c0 .333.246.6.555.6.308 0 .554-.267.554-.6V9.2c0-.333-.246-.6-.554-.6s-.555.267-.555.6V11.4H7.366V9.2c0-.333-.246-.6-.554-.6s-.555.267-.555.6M18.108 12c0-1.94-1.431-3.4-3.333-3.4h-2.223v6.8h2.223c1.902 0 3.333-1.46 3.333-3.4m-4.442-2.201h1.11c1.289 0 2.223.926 2.223 2.201s-.934 2.201-2.223 2.201h-1.11zM3.48 16.398V7.602h17.037v8.796z"
         })
     })) : /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
@@ -113,10 +113,10 @@ const m = (_param)=>{
         height: h,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, c), {
+    }, e), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: r,
             d: "M22 6v11.613h-1.48a.38.38 0 0 1-.37-.386c0-.213.167-.386.37-.386h.74V6.773H2.74v10.063h13.333c.204 0 .37.173.37.386a.38.38 0 0 1-.37.387H2V6zm-3.703 10.454c-.408 0-.74.347-.74.773s.332.773.74.773.74-.347.74-.773-.332-.773-.74-.773m-3.518-1.55c1.735 0 3.148-1.477 3.148-3.29 0-1.814-1.413-3.29-3.148-3.29h-2.04v6.58zm2.408-3.29c0 1.387-1.08 2.516-2.408 2.516h-1.295V9.098h1.295c1.327 0 2.408 1.13 2.408 2.517m-5.927 2.903a.38.38 0 0 1-.37.386.376.376 0 0 1-.37-.386v-2.71H7.188v2.71a.38.38 0 0 1-.37.386.38.38 0 0 1-.37-.386V8.71c0-.213.167-.386.37-.386.204 0 .37.173.37.386v2.324h3.334V8.71c0-.213.166-.386.37-.386s.37.173.37.386z"
         })
     }));
-}, f = m;
+}, f = a;

package/dist/generated/mistica-icons/icon-hd-regular.js

@@ -93,17 +93,17 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const v = (_param)=>{
-    var { color: s, size: e = 24 } = _param, r = _object_without_properties(_param, [
+    var { color: s, size: e = 24 } = _param, o = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), h = s !== null && s !== void 0 ? s : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: n } = (0, _hooks.useTheme)();
-    return n.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), h = s !== null && s !== void 0 ? s : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
+    return i.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, r), {
+    }, o), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
             fill: h,
             d: "M2 6v12h20V6zm4.257 3.2v5.6c0 .333.246.6.555.6.308 0 .554-.267.554-.6V12.6h2.963V14.8c0 .333.246.6.555.6.308 0 .554-.267.554-.6V9.2c0-.333-.246-.6-.554-.6s-.555.267-.555.6V11.4H7.366V9.2c0-.333-.246-.6-.554-.6s-.555.267-.555.6M18.108 12c0-1.94-1.431-3.4-3.333-3.4h-2.223v6.8h2.223c1.902 0 3.333-1.46 3.333-3.4m-4.442-2.201h1.11c1.289 0 2.223.926 2.223 2.201s-.934 2.201-2.223 2.201h-1.11zM3.48 16.398V7.602h17.037v8.796z"
@@ -113,7 +113,7 @@ const v = (_param)=>{
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, r), {
+    }, o), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
             fill: h,
             d: "M2 6v12h20V6zm4.257 3.2v5.6c0 .333.246.6.555.6.308 0 .554-.267.554-.6V12.6h2.963V14.8c0 .333.246.6.555.6.308 0 .554-.267.554-.6V9.2c0-.333-.246-.6-.554-.6s-.555.267-.555.6V11.4H7.366V9.2c0-.333-.246-.6-.554-.6s-.555.267-.555.6M18.108 12c0-1.94-1.431-3.4-3.333-3.4h-2.223v6.8h2.223c1.902 0 3.333-1.46 3.333-3.4m-4.442-2.201h1.11c1.289 0 2.223.926 2.223 2.201s-.934 2.201-2.223 2.201h-1.11zM3.48 16.398V7.602h17.037v8.796z"

package/dist/generated/mistica-icons/icon-headphone-bluetooth-filled.js

@@ -93,12 +93,12 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const c = (_param)=>{
-    var { color: r, size: l = 24 } = _param, t = _object_without_properties(_param, [
+    var { color: h, size: l = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const n = (0, _themevariantcontext.useIsInverseVariant)(), e = r !== null && r !== void 0 ? r : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: s } = (0, _hooks.useTheme)();
-    return s.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", _object_spread_props(_object_spread({
+    const n = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), e = h !== null && h !== void 0 ? h : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: a } = (0, _hooks.useTheme)();
+    return a.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", _object_spread_props(_object_spread({
         width: l,
         height: l,
         viewBox: "0 0 24 24",

package/dist/generated/mistica-icons/icon-headphone-bluetooth-light.js

@@ -93,11 +93,11 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const v = (_param)=>{
-    var { color: s, size: o = 24 } = _param, c = _object_without_properties(_param, [
+    var { color: i, size: o = 24 } = _param, c = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), h = s !== null && s !== void 0 ? s : i ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: r } = (0, _hooks.useTheme)();
+    const s = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), h = i !== null && i !== void 0 ? i : s ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: r } = (0, _hooks.useTheme)();
     return r.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", _object_spread_props(_object_spread({
         width: o,
         height: o,

package/dist/generated/mistica-icons/icon-headphone-bluetooth-regular.js

@@ -97,7 +97,7 @@ const n = (_param)=>{
         "color",
         "size"
     ]);
-    const c = (0, _themevariantcontext.useIsInverseVariant)(), h = s !== null && s !== void 0 ? s : c ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
+    const c = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), h = s !== null && s !== void 0 ? s : c ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
     return i.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", _object_spread_props(_object_spread({
         width: o,
         height: o,

package/dist/generated/mistica-icons/icon-headphones-filled.js

@@ -97,7 +97,7 @@ const a = (_param)=>{
         "color",
         "size"
     ]);
-    const n = (0, _themevariantcontext.useIsInverseVariant)(), r = i !== null && i !== void 0 ? i : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
+    const n = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), r = i !== null && i !== void 0 ? i : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
     return t.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: e,
         height: e,

package/dist/generated/mistica-icons/icon-headphones-light.js

@@ -93,11 +93,11 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const l = (_param)=>{
-    var { color: s, size: c = 24 } = _param, e = _object_without_properties(_param, [
+    var { color: i, size: c = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), o = s !== null && s !== void 0 ? s : i ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
+    const s = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), o = i !== null && i !== void 0 ? i : s ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
     return t.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,

package/dist/generated/mistica-icons/icon-headphones-regular.js

@@ -93,11 +93,11 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const a = (_param)=>{
-    var { color: n, size: c = 24 } = _param, h = _object_without_properties(_param, [
+    var { color: i, size: c = 24 } = _param, h = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const i = (0, _themevariantcontext.useIsInverseVariant)(), o = n !== null && n !== void 0 ? n : i ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: r } = (0, _hooks.useTheme)();
+    const n = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), o = i !== null && i !== void 0 ? i : n ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: r } = (0, _hooks.useTheme)();
     return r.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,

package/dist/generated/mistica-icons/icon-heart-bubble-filled.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return m;
+        return d;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -91,12 +91,12 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const i = (_param)=>{
+const s = (_param)=>{
     var { color: o, size: l = 24 } = _param, a = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), c = o !== null && o !== void 0 ? o : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), c = o !== null && o !== void 0 ? o : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: l,
         height: l,
@@ -108,4 +108,4 @@ const i = (_param)=>{
             d: "M5.292 2.982h13.412c1.731 0 3.137 1.355 3.14 3.022v8.96c0 1.67-1.409 3.026-3.137 3.026h-9.91l-1.99 2.462c-.296.378-.686.574-1.156.574-.756 0-1.398-.602-1.398-1.319v-1.863a2.98 2.98 0 0 1-2.098-2.88v-8.96c0-1.667 1.409-3.022 3.137-3.022m9.168 9.003c.55-.824.925-1.642 1.118-2.429.21-.857.04-1.569-.482-2.008-.305-.255-.723-.407-1.17-.429q-.061-.004-.121-.003l-.027.003-.026.003c-.194.005-.39.028-.583.078l-.032.01-.032.01a3 3 0 0 0-.776.336q-.15.082-.314.176a.1.1 0 0 1-.056.014.1.1 0 0 1-.056-.014l-.144-.08-.346-.191a3 3 0 0 0-.603-.238l-.025-.009-.036-.011a2.6 2.6 0 0 0-.583-.078l-.026-.003-.027-.003q-.06 0-.12.003c-.449.022-.863.173-1.169.428-.526.437-.7 1.149-.49 2.006.196.787.572 1.605 1.118 2.429a9.8 9.8 0 0 0 1.406 1.696c.077.074.255.246.41.354a1.3 1.3 0 0 0 .632.232h.006a.2.2 0 0 0 .044.003h.014l.025-.001.02-.002h.006a1.346 1.346 0 0 0 .63-.232c.153-.106.325-.273.405-.35l.027-.025.014-.014a9.8 9.8 0 0 0 1.37-1.662"
         })
     }));
-}, m = i;
+}, d = s;

package/dist/generated/mistica-icons/icon-heart-bubble-light.js

@@ -91,21 +91,21 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const i = (_param)=>{
-    var { color: t, size: c = 24 } = _param, e = _object_without_properties(_param, [
+const s = (_param)=>{
+    var { color: e, size: c = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const l = (0, _themevariantcontext.useIsInverseVariant)(), a = t !== null && t !== void 0 ? t : l ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const a = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), l = e !== null && e !== void 0 ? e : a ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, e), {
+    }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: a,
+            fill: l,
             d: "M21.838 6.004c0-1.67-1.41-3.025-3.138-3.025H5.29c-1.729 0-3.138 1.356-3.138 3.025v8.958c0 1.345.846 2.487 2.098 2.88v1.862c0 .715.639 1.32 1.395 1.32.474 0 .866-.194 1.157-.575l1.992-2.462H18.7c1.729 0 3.137-1.358 3.137-3.025zm-.821 0v8.958c0 1.23-1.04 2.23-2.32 2.232H8.589a.42.42 0 0 0-.325.152l-2.117 2.622c-.205.263-.407.263-.505.263-.296 0-.574-.258-.574-.527v-2.168a.4.4 0 0 0-.328-.39c-1.042-.207-1.77-1.106-1.77-2.184V6.004c0-1.23 1.042-2.233 2.32-2.233H18.7c1.278 0 2.317 1.003 2.317 2.233m-6.241 3.364c-.171.7-.51 1.434-1.011 2.185a9 9 0 0 1-1.27 1.54l-.027.029-.003.005a3 3 0 0 1-.303.263.5.5 0 0 1-.207.082l-.033-.006h-.009a.5.5 0 0 1-.174-.078 3 3 0 0 1-.322-.283 9 9 0 0 1-1.283-1.555c-.495-.748-.837-1.482-1.008-2.182-.076-.32-.151-.905.227-1.218.165-.14.414-.224.678-.238l.078-.003c.297 0 .608.084.902.24.149.082.3.166.482.27.14.078.3.117.462.117.157 0 .311-.039.474-.126q.246-.143.467-.26c.292-.157.605-.241.902-.241l.076.003c.269.014.512.1.68.238.376.313.3.899.222 1.218m.314-1.82c-.306-.253-.723-.404-1.171-.426q-.064-.004-.115-.003c-.437 0-.885.117-1.3.342-.157.084-.316.173-.49.271a.14.14 0 0 1-.056.014.13.13 0 0 1-.059-.014l-.116-.065q-.194-.112-.371-.206a2.7 2.7 0 0 0-1.3-.342q-.06 0-.12.003c-.451.02-.866.173-1.171.425-.524.435-.7 1.149-.488 2.003.194.79.569 1.608 1.115 2.429a9.7 9.7 0 0 0 1.384 1.678c.059.059.26.257.431.375.149.1.317.177.482.21q.072.014.151.02h.003c.017.002.028.002.045.002h.017q.024 0 .045-.002h.005a1 1 0 0 0 .151-.02 1.3 1.3 0 0 0 .48-.21 3.5 3.5 0 0 0 .445-.39 9.6 9.6 0 0 0 1.372-1.663c.547-.824.925-1.642 1.118-2.429.21-.854.04-1.566-.487-2.003"
         })
     }));
-}, m = i;
+}, m = s;

package/dist/generated/mistica-icons/icon-heart-bubble-regular.js

@@ -92,17 +92,17 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const n = (_param)=>{
-    var { color: e, size: c = 24 } = _param, o = _object_without_properties(_param, [
+    var { color: l, size: c = 24 } = _param, a = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const a = (0, _themevariantcontext.useIsInverseVariant)(), t = e !== null && e !== void 0 ? e : a ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const o = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), t = l !== null && l !== void 0 ? l : o ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, o), {
+    }, a), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
             fill: t,
             d: "M21.841 6.147c0-1.745-1.476-3.165-3.285-3.165H5.44c-1.81 0-3.286 1.42-3.286 3.165v8.748c0 1.353.824 2.51 2.053 2.96v1.673c0 .812.723 1.499 1.583 1.499.66 0 1.076-.353 1.3-.642l1.88-2.325h9.585c1.812 0 3.285-1.417 3.285-3.162zm-1.235 0v8.748c0 1.087-.919 1.97-2.048 1.97H8.67c-.19 0-.37.086-.487.229L6.11 19.66c-.134.173-.246.173-.32.173-.17 0-.346-.151-.346-.302v-2.118a.6.6 0 0 0-.496-.585c-.916-.182-1.558-.975-1.558-1.93V6.147c0-1.087.92-1.972 2.05-1.972h13.116c1.131 0 2.05.885 2.05 1.972M14.39 9.295c-.16.659-.484 1.353-.952 2.065a8.7 8.7 0 0 1-1.224 1.482l-.042.039-.003.005a3 3 0 0 1-.207.185 5 5 0 0 1-.241-.218 8.6 8.6 0 0 1-1.238-1.496c-.474-.711-.796-1.406-.958-2.064-.045-.185-.13-.645.092-.827a.76.76 0 0 1 .434-.143l.056-.002c.23 0 .474.067.706.193.146.076.294.16.482.266.202.112.431.17.664.17.227 0 .45-.052.65-.159l.02-.008.016-.011q.243-.139.46-.255c.232-.126.476-.194.703-.194l.059.003a.76.76 0 0 1 .434.143c.218.182.137.639.09.826m.715-1.733c-.306-.255-.726-.407-1.174-.429a1 1 0 0 1-.115-.008c-.437 0-.885.114-1.305.339-.157.084-.317.173-.49.274a.1.1 0 0 1-.057.014.1.1 0 0 1-.056-.014 26 26 0 0 0-.49-.272 2.8 2.8 0 0 0-1.305-.339l-.058.002-.062.001c-.454.023-.872.174-1.177.429-.527.437-.703 1.151-.49 2.011.193.79.571 1.61 1.12 2.434.44.661.79 1.087 1.39 1.684l.014.013c.073.07.261.25.42.362.148.104.314.174.482.21q.071.014.15.02h.113q.08-.005.151-.02a1.4 1.4 0 0 0 .482-.21 3.5 3.5 0 0 0 .434-.375l.014-.014a10 10 0 0 0 1.376-1.667c.551-.826.927-1.644 1.123-2.434.213-.86.039-1.572-.49-2.011"

package/dist/generated/mistica-icons/icon-heart-filled.js

@@ -97,35 +97,35 @@ const s = (_param)=>{
         "color",
         "size"
     ]);
-    const c = (0, _themevariantcontext.useIsInverseVariant)(), o = n !== null && n !== void 0 ? n : c ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: r } = (0, _hooks.useTheme)();
-    return r.match(/^vivo-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
+    const c = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), r = n !== null && n !== void 0 ? n : c ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
+    return i.match(/^vivo-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: o,
+            fill: r,
             d: "M3 9.31C3 6.45 4.846 3.5 8.01 3.5c1.526 0 2.639.781 3.36 1.802.258.366.468.765.63 1.173.162-.408.372-.807.63-1.173.721-1.02 1.834-1.802 3.36-1.802C19.154 3.5 21 6.45 21 9.31c0 2.986-1.381 5.163-3.19 6.905-1.288 1.24-2.786 2.258-4.151 3.185l-.014.01c-.192.13-.41.27-.626.41l-.093.06c-.247.16-.485.314-.681.453l-.245.172-.245-.172a22 22 0 0 0-.681-.453l-.093-.06c-.216-.14-.434-.28-.626-.41l-.014-.01c-1.365-.927-2.863-1.945-4.151-3.185C4.38 14.473 3 12.296 3 9.31"
         })
-    })) : r.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
+    })) : i.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: o,
+            fill: r,
             d: "M17.252 2c-2.02 0-3.372.769-5.256 3.08C10.14 2.824 8.656 2 6.58 2 3.572 2 2 4.354 2 6.685c0 4.764 6.404 11.52 9.48 14.767L12 22l.52-.549c.88-.925 1.904-2.018 2.96-3.21l2.66-3.232C20.736 11.582 22 8.859 22 6.685 22 4.355 20.368 2 17.252 2"
         })
-    })) : r.match(/^o2/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
+    })) : i.match(/^o2/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: o,
+            fill: r,
             d: "M17.252 2c-2.02 0-3.372.769-5.256 3.08C10.14 2.824 8.656 2 6.58 2 3.572 2 2 4.354 2 6.685c0 4.764 6.404 11.52 9.48 14.767L12 22l.52-.549c.88-.925 1.904-2.018 2.96-3.21l2.66-3.232C20.736 11.582 22 8.859 22 6.685 22 4.355 20.368 2 17.252 2"
         })
     })) : /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
@@ -135,7 +135,7 @@ const s = (_param)=>{
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: o,
+            fill: r,
             d: "M12.016 21.809H12q-.075 0-.137-.003h-.017a2.4 2.4 0 0 1-.4-.056c-.46-.104-.896-.3-1.277-.574-.457-.33-.995-.874-1.149-1.031-1.588-1.639-2.515-2.801-3.678-4.605-1.454-2.258-2.454-4.501-2.969-6.667-.56-2.353-.098-4.305 1.297-5.504.81-.692 1.916-1.11 3.11-1.17 1.257-.065 2.562.254 3.772.926.412.227.835.474 1.297.745.093.05.205.05.3 0 .462-.274.885-.518 1.3-.747 1.207-.67 2.512-.99 3.77-.925 1.196.062 2.3.48 3.11 1.174 1.394 1.196 1.856 3.151 1.296 5.504-.515 2.163-1.512 4.403-2.97 6.664-1.15 1.79-2.075 2.947-3.638 4.563l-.036.042c-.154.16-.692.7-1.146 1.028a3.4 3.4 0 0 1-1.277.574q-.198.047-.4.056h-.018q-.06.007-.123.006"
         })
     }));

package/dist/generated/mistica-icons/icon-heart-light.js

@@ -93,11 +93,11 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const d = (_param)=>{
-    var { color: r, size: c = 24 } = _param, t = _object_without_properties(_param, [
+    var { color: o, size: c = 24 } = _param, t = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const h = (0, _themevariantcontext.useIsInverseVariant)(), e = r !== null && r !== void 0 ? r : h ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
+    const h = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), l = o !== null && o !== void 0 ? o : h ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
     return i.match(/^vivo-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,
@@ -105,7 +105,7 @@ const d = (_param)=>{
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: l,
             d: "M3 9.31C3 6.45 4.846 3.5 8.01 3.5c1.526 0 2.639.781 3.36 1.802.258.366.468.765.63 1.173.162-.408.372-.807.63-1.173.721-1.02 1.834-1.802 3.36-1.802C19.154 3.5 21 6.45 21 9.31c0 2.986-1.381 5.163-3.19 6.905-1.288 1.24-2.786 2.258-4.151 3.185l-.014.01c-.192.13-.41.27-.626.41l-.093.06c-.247.16-.485.314-.681.453l-.245.172-.245-.172a22 22 0 0 0-.681-.453l-.093-.06c-.216-.14-.434-.28-.626-.41l-.014-.01c-1.365-.927-2.863-1.945-4.151-3.185C4.38 14.473 3 12.296 3 9.31m9.425-.72h-.85c0-.851-.293-1.938-.9-2.798-.596-.844-1.47-1.442-2.665-1.442-2.516 0-4.16 2.368-4.16 4.96 0 2.682 1.226 4.652 2.93 6.293 1.23 1.186 2.674 2.167 4.052 3.103.183.124.393.26.609.399l.559.365a34 34 0 0 1 .559-.365c.216-.14.426-.275.609-.399 1.378-.936 2.821-1.917 4.053-3.103 1.703-1.64 2.929-3.61 2.929-6.293 0-2.592-1.644-4.96-4.16-4.96-1.195 0-2.069.598-2.665 1.442-.607.86-.9 1.947-.9 2.798"
         })
     })) : i.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
@@ -115,7 +115,7 @@ const d = (_param)=>{
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: l,
             d: "M11.497 21.772c.13.144.308.228.499.228a.66.66 0 0 0 .495-.232c.7-.787 1.756-1.981 2.818-3.268l.008-.01.008-.01 2.502-3.244.007-.012.008-.012c2.472-3.488 3.676-6.256 3.676-8.462 0-1.438-.492-2.66-1.425-3.54A4.5 4.5 0 0 0 16.997 2c-1.105 0-1.966.26-2.792.835-.678.471-1.375 1.19-2.213 2.29C10.225 2.834 8.812 2 6.83 2c-1.162 0-2.24.435-3.028 1.227-.872.866-1.333 2.089-1.333 3.523 0 2.13 1.112 4.77 3.397 8.075 1.909 2.752 4.236 5.377 5.63 6.947M3.83 6.75c0-2.293 1.508-3.32 3.001-3.32 1.508 0 2.636.508 4.624 3.296.13.18.331.288.544.288a.68.68 0 0 0 .545-.288c2.011-2.816 3.002-3.292 4.46-3.292 1.52 0 3.158 1.039 3.158 3.32 0 1.858-1.143 4.415-3.398 7.6l-2.487 3.223c-.819.987-1.634 1.922-2.281 2.657-1.387-1.566-3.379-3.871-5.024-6.248C4.885 10.977 3.83 8.54 3.83 6.75"
         })
     })) : i.match(/^o2/i) ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", _object_spread_props(_object_spread({
@@ -126,11 +126,11 @@ const d = (_param)=>{
     }, t), {
         children: [
             /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-                fill: e,
+                fill: l,
                 d: "M11.756 21.884a.33.33 0 0 0 .248.116.3.3 0 0 0 .229-.104.364.364 0 0 0 .018-.504C9.299 18.064 3.159 11.136 3.159 6.544c0-2.636 1.803-3.836 3.48-3.836 1.646 0 2.946.572 5.091 3.572a.34.34 0 0 0 .275.144.33.33 0 0 0 .274-.144c2.18-3.056 3.281-3.572 4.924-3.572 1.81 0 3.643 1.32 3.643 3.84 0 2.02-1.211 4.756-3.605 8.128l-2.527 3.28a.373.373 0 0 0 .05.504c.149.124.362.1.48-.052l2.53-3.284.005-.006.003-.006c2.523-3.552 3.747-6.352 3.747-8.56C21.528 3.564 19.352 2 17.202 2c-1.993 0-3.247.824-5.198 3.48C10.087 2.888 8.696 2 6.642 2c-1.113 0-2.138.416-2.893 1.168-.83.828-1.269 2-1.269 3.384 0 2.124 1.132 4.792 3.464 8.156 1.96 2.832 4.372 5.552 5.812 7.176"
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-                fill: e,
+                fill: l,
                 d: "M13.7 20.572c.377 0 .682-.324.682-.716a.704.704 0 0 0-.682-.716c-.378 0-.682.32-.682.716s.304.716.682.716"
             })
         ]
@@ -141,7 +141,7 @@ const d = (_param)=>{
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: l,
             d: "M11.984 21.817h.02q.071 0 .129-.003h.014q.185-.011.367-.053a3.3 3.3 0 0 0 1.207-.546c.359-.255.826-.698 1.143-1.025l.012-.016.013-.015c1.602-1.655 2.546-2.838 3.726-4.67 1.481-2.302 2.498-4.582 3.022-6.778.549-2.314.11-4.224-1.24-5.381-.788-.672-1.86-1.079-3.029-1.137-1.24-.062-2.532.254-3.728.921-.426.235-.863.485-1.336.768a.63.63 0 0 1-.605-.003c-.477-.28-.91-.532-1.334-.765-1.199-.667-2.487-.983-3.728-.921-1.168.061-2.244.465-3.028 1.14C2.256 4.489 1.816 6.4 2.365 8.71c.524 2.199 1.54 4.482 3.025 6.778 1.185 1.844 2.132 3.028 3.754 4.7.32.328.784.768 1.143 1.026.361.263.773.448 1.207.546q.181.044.367.053h.014q.05.004.11.003M6.665 2.756q.142-.009.286-.009c1.047 0 2.129.294 3.14.857.417.233.849.48 1.32.76l.002.002c.358.205.804.208 1.165.003l.006-.003c.47-.28.905-.53 1.325-.762 1.106-.613 2.291-.907 3.428-.848 1.045.053 2 .409 2.692 1.002.6.513.994 1.196 1.171 2.028.174.818.137 1.76-.11 2.796-.509 2.134-1.5 4.356-2.949 6.605-1.18 1.83-2.073 2.95-3.686 4.613q-.012.013-.025.028c-.3.309-.723.704-1.04.933-.3.216-.638.37-1 .451l-.008.003q-.136.032-.274.04h-.012q-.04.002-.095.002h-.003q-.03 0-.056-.002h-.047a1.5 1.5 0 0 1-.275-.04l-.008-.003a2.65 2.65 0 0 1-1-.45c-.328-.236-.768-.65-1.067-.962-1.611-1.663-2.507-2.784-3.684-4.613-1.445-2.247-2.437-4.468-2.947-6.605-.246-1.037-.283-1.978-.109-2.796.177-.832.569-1.515 1.168-2.028.692-.593 1.65-.95 2.692-1.002"
         })
     }));

package/dist/generated/mistica-icons/icon-heart-regular.js

@@ -97,7 +97,7 @@ const s = (_param)=>{
         "color",
         "size"
     ]);
-    const a = (0, _themevariantcontext.useIsInverseVariant)(), r = i !== null && i !== void 0 ? i : a ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
+    const a = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), r = i !== null && i !== void 0 ? i : a ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: t } = (0, _hooks.useTheme)();
     return t.match(/^vivo-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,

package/dist/generated/mistica-icons/icon-high-priority-filled.js

@@ -92,17 +92,17 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const n = (_param)=>{
-    var { color: i, size: r = 24 } = _param, t = _object_without_properties(_param, [
+    var { color: i, size: r = 24 } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const e = (0, _themevariantcontext.useIsInverseVariant)(), l = i !== null && i !== void 0 ? i : e ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), l = i !== null && i !== void 0 ? i : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: r,
         height: r,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, t), {
+    }, e), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
             fill: l,
             d: "M8.989 6.173a.47.47 0 0 1 .707-.026l2.007 2.051-2.007 2.051a.47.47 0 0 1-.707-.025.58.58 0 0 1 .023-.77l.694-.71H6.12c-.255 0-.542.134-.772.37C5.115 9.35 5 9.629 5 9.85v5.95c0 .221.115.5.348.738.231.236.519.37.771.37h5.015c.276 0 .5.244.5.546 0 .3-.224.545-.5.545H6.119c-.556 0-1.078-.28-1.455-.665-.374-.382-.664-.93-.664-1.533v-5.95c0-.603.289-1.152.663-1.534.377-.385.899-.665 1.456-.665h3.587l-.694-.71a.58.58 0 0 1-.023-.77m3.377 2.025c0-.301.224-.545.5-.545H19.5c.276 0 .5.244.5.545s-.224.546-.5.546h-6.633c-.277 0-.5-.244-.5-.546m0 4.628c0-.301.224-.545.5-.545H19.5c.276 0 .5.244.5.545s-.224.546-.5.546h-6.633c-.277 0-.5-.245-.5-.546m0 4.628c0-.3.224-.545.5-.545H19.5c.276 0 .5.244.5.546 0 .3-.224.545-.5.545h-6.633c-.277 0-.5-.244-.5-.546"

package/dist/generated/mistica-icons/icon-high-priority-light.js

@@ -96,7 +96,7 @@ const n = (_param)=>{
         "color",
         "size"
     ]);
-    const s = (0, _themevariantcontext.useIsInverseVariant)(), h = i !== null && i !== void 0 ? i : s ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const s = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), e = i !== null && i !== void 0 ? i : s ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: r,
         height: r,
@@ -104,7 +104,7 @@ const n = (_param)=>{
         role: "presentation"
     }, t), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: h,
+            fill: e,
             d: "M9.052 6.107a.345.345 0 0 1 .5 0l1.9 1.966-1.9 1.966a.345.345 0 0 1-.5 0 .375.375 0 0 1 0-.517L10.1 8.439H6.004c-.299 0-.626.158-.886.427s-.411.607-.411.914v6.147c0 .306.152.644.412.914s.588.427.885.427h5.113a.36.36 0 0 1 .353.366.36.36 0 0 1-.353.366H6.004c-.527 0-1.025-.27-1.384-.642-.36-.372-.62-.887-.62-1.431V9.78c0-.544.26-1.06.618-1.431.36-.372.857-.642 1.386-.642H10.1L9.051 6.624a.375.375 0 0 1 0-.517m3.478 1.966a.36.36 0 0 1 .353-.366h6.764a.36.36 0 0 1 .353.366.36.36 0 0 1-.353.366h-6.764a.36.36 0 0 1-.353-.366m0 4.78a.36.36 0 0 1 .353-.365h6.764a.36.36 0 0 1 .353.366.36.36 0 0 1-.353.365h-6.764a.36.36 0 0 1-.353-.365m0 4.781a.36.36 0 0 1 .353-.366h6.764a.36.36 0 0 1 .353.366.36.36 0 0 1-.353.366h-6.764a.36.36 0 0 1-.353-.366"
         })
     }));

package/dist/generated/mistica-icons/icon-high-priority-regular.js

@@ -96,7 +96,7 @@ const h = (_param)=>{
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), e = c !== null && c !== void 0 ? c : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
+    const e = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), t = c !== null && c !== void 0 ? c : e ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: r,
         height: r,
@@ -104,7 +104,7 @@ const h = (_param)=>{
         role: "presentation"
     }, i), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("path", {
-            fill: e,
+            fill: t,
             d: "M8.994 6.156a.51.51 0 0 1 .733 0l1.98 2.033-1.98 2.034a.51.51 0 0 1-.733 0 .543.543 0 0 1 0-.753l.728-.748H6.134c-.237 0-.515.126-.745.362s-.352.522-.352.762v5.965c0 .239.123.524.353.761s.51.363.744.363h5.002c.286 0 .518.239.518.533a.526.526 0 0 1-.518.532H6.134c-.573 0-1.102-.29-1.477-.675S4 16.397 4 15.811V9.846c0-.586.28-1.129.655-1.514.376-.386.905-.675 1.479-.675h3.588l-.728-.748a.54.54 0 0 1 0-.753m3.352 2.033c0-.294.232-.532.518-.532h6.617c.287 0 .519.238.519.532a.526.526 0 0 1-.519.533h-6.617a.526.526 0 0 1-.518-.533m0 4.64c0-.295.232-.533.518-.533h6.617c.287 0 .519.238.519.532a.526.526 0 0 1-.519.533h-6.617a.526.526 0 0 1-.518-.533m0 4.639c0-.294.232-.533.518-.533h6.617c.287 0 .519.239.519.533a.526.526 0 0 1-.519.532h-6.617a.526.526 0 0 1-.518-.532"
         })
     }));

package/dist/generated/mistica-icons/icon-hockey-filled.js

@@ -97,7 +97,7 @@ const s = (_param)=>{
         "color",
         "size"
     ]);
-    const t = (0, _themevariantcontext.useIsInverseVariant)(), l = h !== null && h !== void 0 ? h : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
+    const t = (0, _themevariantcontext.useIsInverseOrMediaVariant)(), l = h !== null && h !== void 0 ? h : t ? _skincontractcssmistica.vars.colors.inverse : _skincontractcssmistica.vars.colors.neutralHigh, { skinName: i } = (0, _hooks.useTheme)();
     return i.match(/^o2-new/i) ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", _object_spread_props(_object_spread({
         width: c,
         height: c,