@telefonica/mistica 14.32.1 → 14.34.0

package/dist/integer-field.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -100,7 +101,7 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const T = (_param)=>{
-    var { inputRef: u , value: r , defaultValue: n , type: i = "text"  } = _param, o = _object_without_properties(_param, [
+    var { inputRef: u, value: r, defaultValue: n, type: i = "text" } = _param, o = _object_without_properties(_param, [
         "inputRef",
         "value",
         "defaultValue",
@@ -119,7 +120,7 @@ const T = (_param)=>{
         defaultValue: n === void 0 ? void 0 : t(n)
     }));
 }, h = (_param)=>{
-    var { disabled: u , error: r , helperText: n , name: i , optional: o , validate: t , onChange: c , onChangeValue: e , onBlur: m , value: p , defaultValue: a  } = _param, l = _object_without_properties(_param, [
+    var { disabled: u, error: r, helperText: n, name: i, optional: o, validate: t, onChange: c, onChangeValue: e, onBlur: m, value: p, defaultValue: a } = _param, l = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -132,7 +133,7 @@ const T = (_param)=>{
         "value",
         "defaultValue"
     ]);
-    const { texts: f  } = (0, _hooks.useTheme)(), g = (0, _formcontext.useFieldProps)({
+    const { texts: f } = (0, _hooks.useTheme)(), g = (0, _formcontext.useFieldProps)({
         name: i,
         value: p,
         defaultValue: a,

package/dist/list.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -70,7 +71,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -177,7 +180,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
         },
         children: e
     }) : e, ye = (param)=>{
-    let { withChevron: e , headline: n , title: r , titleLinesMax: o , subtitle: s , subtitleLinesMax: x , description: d , descriptionLinesMax: W , detail: m , asset: V , type: g = "basic" , badge: A , right: E , extra: X , labelId: l , disabled: v  } = param;
+    let { withChevron: e, headline: n, title: r, titleLinesMax: o, subtitle: s, subtitleLinesMax: x, description: d, descriptionLinesMax: W, detail: m, asset: V, type: g = "basic", badge: A, right: E, extra: X, labelId: l, disabled: v } = param;
     const h = (0, _themevariantcontext.useIsInverseVariant)(), a = [
         n,
         r,
@@ -303,7 +306,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
         ]
     });
 }, Re = (param)=>{
-    let { value: e , defaultValue: n , onChange: r  } = param;
+    let { value: e, defaultValue: n, onChange: r } = param;
     const o = e !== void 0, [s, x] = _react.useState(!!n), d = ()=>{
         o || x(!s), r && r(o ? !e : !s);
     };
@@ -315,8 +318,8 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
         d
     ];
 }, Ce = (e)=>e.switch !== void 0, Ne = (e)=>e.checkbox !== void 0, ke = (e)=>e.radioValue !== void 0, ee = /*#__PURE__*/ _react.forwardRef((e, n)=>{
-    const r = (0, _hooks.useAriaId)(), o = (0, _themevariantcontext.useIsInverseVariant)(), { asset: s , headline: x , title: d , titleLinesMax: W , subtitle: m , subtitleLinesMax: V , description: g , descriptionLinesMax: A , detail: E , badge: X , role: l , extra: v , dataAttributes: h  } = e, F = (0, _radiobutton.useRadioContext)(), a = e.disabled || e.radioValue !== void 0 && F.disabled, f = !a && !o, w = !a && o, [Y, q] = Re(e.switch || e.checkbox || {}), y = (param)=>/* @__PURE__ */ {
-        let { type: c , right: b , labelId: D  } = param;
+    const r = (0, _hooks.useAriaId)(), o = (0, _themevariantcontext.useIsInverseVariant)(), { asset: s, headline: x, title: d, titleLinesMax: W, subtitle: m, subtitleLinesMax: V, description: g, descriptionLinesMax: A, detail: E, badge: X, role: l, extra: v, dataAttributes: h } = e, F = (0, _radiobutton.useRadioContext)(), a = e.disabled || e.radioValue !== void 0 && F.disabled, f = !a && !o, w = !a && o, [Y, q] = Re(e.switch || e.checkbox || {}), y = (param)=>/* @__PURE__ */ {
+        let { type: c, right: b, labelId: D } = param;
         return (0, _jsxruntime.jsx)(ye, {
             asset: s,
             headline: x,
@@ -419,7 +422,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
                     "aria-labelledby": r,
                     onChange: q,
                     render: (param)=>/* @__PURE__ */ {
-                        let { controlElement: H  } = param;
+                        let { controlElement: H } = param;
                         return (0, _jsxruntime.jsx)("div", {
                             className: _listcssmistica.dualActionRight,
                             children: H
@@ -440,7 +443,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
                 checked: Y,
                 onChange: q,
                 render: (param)=>/* @__PURE__ */ {
-                    let { controlElement: H , labelId: te  } = param;
+                    let { controlElement: H, labelId: te } = param;
                     return (0, _jsxruntime.jsx)(_box.default, {
                         paddingX: 16,
                         role: l,
@@ -481,7 +484,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
                 value: e.radioValue,
                 "aria-labelledby": r,
                 render: (param)=>/* @__PURE__ */ {
-                    let { controlElement: c  } = param;
+                    let { controlElement: c } = param;
                     return (0, _jsxruntime.jsx)(_stack.default, {
                         space: "around",
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
@@ -505,7 +508,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
             value: e.radioValue,
             "aria-labelledby": r,
             render: (param)=>/* @__PURE__ */ {
-                let { controlElement: c  } = param;
+                let { controlElement: c } = param;
                 return (0, _jsxruntime.jsx)(_box.default, {
                     paddingX: 16,
                     children: y({
@@ -532,7 +535,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
         })
     });
 }), qe = /*#__PURE__*/ _react.forwardRef((_param, r)=>/* @__PURE__ */ {
-    var { dataAttributes: e  } = _param, n = _object_without_properties(_param, [
+    var { dataAttributes: e } = _param, n = _object_without_properties(_param, [
         "dataAttributes"
     ]);
     return (0, _jsxruntime.jsx)(ee, _object_spread_props(_object_spread({}, n), {
@@ -542,7 +545,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
         }, e)
     }));
 }), ze = (param)=>{
-    let { children: e , ariaLabelledby: n , role: r , dataAttributes: o  } = param;
+    let { children: e, ariaLabelledby: n, role: r, dataAttributes: o } = param;
     const s = _react.Children.count(e) - 1;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({
         role: r,
@@ -559,7 +562,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
             }, d))
     }));
 }, Ge = /*#__PURE__*/ _react.forwardRef((_param, r)=>/* @__PURE__ */ {
-    var { dataAttributes: e  } = _param, n = _object_without_properties(_param, [
+    var { dataAttributes: e } = _param, n = _object_without_properties(_param, [
         "dataAttributes"
     ]);
     return (0, _jsxruntime.jsx)(_boxed.Boxed, {
@@ -571,7 +574,7 @@ const $ = (e, n)=>typeof e == "function" ? e == null ? void 0 : e({
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(ee, _object_spread({}, n))
     });
 }), Je = (param)=>/* @__PURE__ */ {
-    let { children: e , ariaLabelledby: n , role: r , dataAttributes: o  } = param;
+    let { children: e, ariaLabelledby: n, role: r, dataAttributes: o } = param;
     return (0, _jsxruntime.jsx)(_stack.default, {
         space: 16,
         role: r,

package/dist/loading-bar.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -67,7 +68,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 const x = (param)=>/* @__PURE__ */ {
-    let { visible: r , dataAttributes: t  } = param;
+    let { visible: r, dataAttributes: t } = param;
     return (0, _jsxruntime.jsx)(_reacttransitiongroup.CSSTransition, {
         in: r,
         timeout: (0, _platform.isRunningAcceptanceTest)() ? 0 : _loadingbarcssmistica.TRANSITION_DURATION_MS,

package/dist/logo.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -124,8 +125,8 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const g = (param)=>{
-    let { size: t , type: a  } = param;
-    const { isDarkMode: e  } = (0, _hooks.useTheme)(), { colors: V  } = (0, _movistar.getMovistarSkin)(), H = (0, _themevariantcontext.useIsInverseVariant)() && !e ? V.inverse : V.brand;
+    let { size: t, type: a } = param;
+    const { isDarkMode: e } = (0, _hooks.useTheme)(), { colors: V } = (0, _movistar.getMovistarSkin)(), H = (0, _themevariantcontext.useIsInverseVariant)() && !e ? V.inverse : V.brand;
     return a === "vertical" ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
         height: t,
         viewBox: "0 0 72 72",
@@ -201,8 +202,8 @@ const g = (param)=>{
         })
     });
 }, m = (param)=>{
-    let { size: t , type: a  } = param;
-    const { isDarkMode: e  } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i  } = (0, _vivo.getVivoSkin)(), H = V && !e ? i.inverse : i.brand;
+    let { size: t, type: a } = param;
+    const { isDarkMode: e } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i } = (0, _vivo.getVivoSkin)(), H = V && !e ? i.inverse : i.brand;
     return a === "vertical" ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
         height: t,
         viewBox: "0 0 72 72",
@@ -260,8 +261,8 @@ const g = (param)=>{
         })
     });
 }, k = (param)=>{
-    let { size: t , type: a  } = param;
-    const { isDarkMode: e  } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i  } = (0, _o2.getO2Skin)(), H = V && !e ? i.inverse : i.brand;
+    let { size: t, type: a } = param;
+    const { isDarkMode: e } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i } = (0, _o2.getO2Skin)(), H = V && !e ? i.inverse : i.brand;
     return a === "vertical" ? /* @__PURE__ */ (0, _jsxruntime.jsx)("svg", {
         height: t,
         viewBox: "0 0 72 72",
@@ -285,8 +286,8 @@ const g = (param)=>{
         })
     });
 }, u = (param)=>{
-    let { size: t , type: a  } = param;
-    const { isDarkMode: e  } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i  } = (0, _telefonica.getTelefonicaSkin)(), H = V && !e ? i.inverse : i.brand;
+    let { size: t, type: a } = param;
+    const { isDarkMode: e } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i } = (0, _telefonica.getTelefonicaSkin)(), H = V && !e ? i.inverse : i.brand;
     return a === "vertical" ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
         height: t,
         viewBox: "0 0 73 72",
@@ -460,8 +461,8 @@ const g = (param)=>{
         ]
     });
 }, w = (param)=>{
-    let { size: t , type: a  } = param;
-    const { isDarkMode: e  } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i  } = (0, _blau.getBlauSkin)(), H = V && !e ? i.inverse : i.brand, s = V && !e ? i.inverse : i.promo;
+    let { size: t, type: a } = param;
+    const { isDarkMode: e } = (0, _hooks.useTheme)(), V = (0, _themevariantcontext.useIsInverseVariant)(), { colors: i } = (0, _blau.getBlauSkin)(), H = V && !e ? i.inverse : i.brand, s = V && !e ? i.inverse : i.promo;
     return a === "vertical" ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("svg", {
         height: t,
         viewBox: "0 0 73 72",
@@ -512,7 +513,7 @@ const g = (param)=>{
         ]
     });
 }, h = (param)=>{
-    let { size: t = 48 , skinName: a , type: e = "isotype"  } = param;
+    let { size: t = 48, skinName: a, type: e = "isotype" } = param;
     switch(a){
         case "Movistar":
             return /* @__PURE__ */ (0, _jsxruntime.jsx)(g, {
@@ -577,11 +578,11 @@ const g = (param)=>{
         children: t.children
     }));
 }, W = (_param)=>{
-    var { size: t , type: a = "isotype"  } = _param, e = _object_without_properties(_param, [
+    var { size: t, type: a = "isotype" } = _param, e = _object_without_properties(_param, [
         "size",
         "type"
     ]);
-    const { skinName: V  } = (0, _hooks.useTheme)();
+    const { skinName: V } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(d, _object_spread_props(_object_spread({}, e), {
         children: /* @__PURE__ */ (0, _jsxruntime.jsx)(h, {
             skinName: V,
@@ -590,7 +591,7 @@ const g = (param)=>{
         })
     }));
 }, b = (_param)=>/* @__PURE__ */ {
-    var { type: t = "isotype" , size: a  } = _param, e = _object_without_properties(_param, [
+    var { type: t = "isotype", size: a } = _param, e = _object_without_properties(_param, [
         "type",
         "size"
     ]);
@@ -602,7 +603,7 @@ const g = (param)=>{
         })
     }));
 }, q = (_param)=>/* @__PURE__ */ {
-    var { size: t , type: a = "isotype"  } = _param, e = _object_without_properties(_param, [
+    var { size: t, type: a = "isotype" } = _param, e = _object_without_properties(_param, [
         "size",
         "type"
     ]);
@@ -614,7 +615,7 @@ const g = (param)=>{
         })
     }));
 }, F = (_param)=>/* @__PURE__ */ {
-    var { size: t , type: a = "isotype"  } = _param, e = _object_without_properties(_param, [
+    var { size: t, type: a = "isotype" } = _param, e = _object_without_properties(_param, [
         "size",
         "type"
     ]);
@@ -626,7 +627,7 @@ const g = (param)=>{
         })
     }));
 }, G = (_param)=>/* @__PURE__ */ {
-    var { size: t , type: a = "isotype"  } = _param, e = _object_without_properties(_param, [
+    var { size: t, type: a = "isotype" } = _param, e = _object_without_properties(_param, [
         "size",
         "type"
     ]);
@@ -638,7 +639,7 @@ const g = (param)=>{
         })
     }));
 }, J = (_param)=>/* @__PURE__ */ {
-    var { size: t , type: a = "isotype"  } = _param, e = _object_without_properties(_param, [
+    var { size: t, type: a = "isotype" } = _param, e = _object_without_properties(_param, [
         "size",
         "type"
     ]);

package/dist/master-detail-layout.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -18,8 +19,8 @@ function _interop_require_default(obj) {
     };
 }
 const m = (param)=>{
-    let { isOpen: i , master: r , detail: e  } = param;
-    const { isTabletOrSmaller: a  } = (0, _hooks.useScreenSize)();
+    let { isOpen: i, master: r, detail: e } = param;
+    const { isTabletOrSmaller: a } = (0, _hooks.useScreenSize)();
     return a ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_responsivelayout.default, {
         children: i ? e : r
     }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_responsivelayout.default, {

package/dist/maybe-dismissable.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -49,7 +50,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -67,19 +70,20 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-const i = /*#__PURE__*/ _react.createContext(!1), I = ()=>_react.useContext(i), x = (param)=>{
-    let { children: e , width: r , onClose: t , "aria-label": o  } = param;
-    const { texts: l  } = (0, _hooks.useTheme)();
+const a = /*#__PURE__*/ _react.createContext(!1), I = ()=>_react.useContext(a), x = (param)=>{
+    let { children: s, width: r, onClose: t, "aria-label": o } = param;
+    const { texts: l } = (0, _hooks.useTheme)();
     return t ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("section", {
         className: _maybedismissablecssmistica.dismissableContainer,
         "aria-label": o,
         style: {
-            width: r || "100%"
+            width: r || "100%",
+            minHeight: "100%"
         },
         children: [
-            /* @__PURE__ */ (0, _jsxruntime.jsx)(i.Provider, {
+            /* @__PURE__ */ (0, _jsxruntime.jsx)(a.Provider, {
                 value: !0,
-                children: e
+                children: s
             }),
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.default, {
                 className: _maybedismissablecssmistica.dismissableButton,
@@ -99,6 +103,6 @@ const i = /*#__PURE__*/ _react.createContext(!1), I = ()=>_react.useContext(i),
             })
         ]
     }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
-        children: e
+        children: s
     });
 }, N = x;

package/dist/menu.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -28,7 +29,6 @@ const _overlay = /*#__PURE__*/ _interop_require_default(require("./overlay.js"))
 const _menucssmistica = require("./menu.css-mistica.js");
 const _hooks = require("./hooks.js");
 const _portal = require("./portal.js");
-const _dynamic = require("@vanilla-extract/dynamic");
 const _box = /*#__PURE__*/ _interop_require_default(require("./box.js"));
 const _inline = /*#__PURE__*/ _interop_require_default(require("./inline.js"));
 const _touchable = /*#__PURE__*/ _interop_require_default(require("./touchable.js"));
@@ -38,6 +38,7 @@ const _divider = /*#__PURE__*/ _interop_require_default(require("./divider.js"))
 const _checkbox = /*#__PURE__*/ _interop_require_default(require("./checkbox.js"));
 const _reacttransitiongroup = require("react-transition-group");
 const _common = require("./utils/common.js");
+const _css = require("./utils/css.js");
 const _platform = require("./utils/platform.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
@@ -65,7 +66,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -145,8 +148,8 @@ const ke = 120, Q = /*#__PURE__*/ _react.createContext({
     const f = D(r).indexOf(d);
     return f < 0 ? null : f;
 }, qe = (param)=>{
-    let { label: r , Icon: d , destructive: f , disabled: u , onPress: E , controlType: s , checked: p  } = param;
-    const { focusedItem: n , setFocusedItem: v , closeMenu: i , isMenuOpen: k  } = Ne(), c = _react.useRef(null), h = f ? _skincontractcssmistica.vars.colors.textLinkDanger : _skincontractcssmistica.vars.colors.neutralHigh, x = c == null ? void 0 : c.current, M = (x == null ? void 0 : x.closest("[role=menu]")) || null, m = Re(M, x), l = ()=>s === "checkbox" ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_checkbox.default, {
+    let { label: r, Icon: d, destructive: f, disabled: u, onPress: E, controlType: s, checked: p } = param;
+    const { focusedItem: n, setFocusedItem: v, closeMenu: i, isMenuOpen: k } = Ne(), c = _react.useRef(null), h = f ? _skincontractcssmistica.vars.colors.textLinkDanger : _skincontractcssmistica.vars.colors.neutralHigh, x = c == null ? void 0 : c.current, M = (x == null ? void 0 : x.closest("[role=menu]")) || null, m = Re(M, x), l = ()=>s === "checkbox" ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_checkbox.default, {
             ref: c,
             name: r,
             checked: p,
@@ -156,7 +159,7 @@ const ke = 120, Q = /*#__PURE__*/ _react.createContext({
             disabled: u,
             role: "menuitemcheckbox",
             render: (param)=>/* @__PURE__ */ {
-                let { controlElement: N  } = param;
+                let { controlElement: N } = param;
                 return (0, _jsxruntime.jsx)(_box.default, {
                     paddingX: 8,
                     paddingY: 12,
@@ -229,7 +232,7 @@ const ke = 120, Q = /*#__PURE__*/ _react.createContext({
         children: l()
     });
 }, Ve = (param)=>{
-    let { children: r  } = param;
+    let { children: r } = param;
     return r ? /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
             r,
@@ -241,12 +244,12 @@ const ke = 120, Q = /*#__PURE__*/ _react.createContext({
         ]
     }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {});
 }, V = 12, J = 8, Je = (param)=>{
-    let { renderTarget: r , renderMenu: d , width: f , position: u = "left" , dataAttributes: E  } = param;
+    let { renderTarget: r, renderMenu: d, width: f, position: u = "left", dataAttributes: E } = param;
     const [s, p] = _react.useState(!1), [n, v] = _react.useState(null), [i, k] = _react.useState(null), [c, h] = _react.useState(null), [x, M] = _react.useState(!1), m = _react.useRef(null), [l, N] = _react.useState(null), R = (0, _hooks.useWindowSize)();
     _react.useEffect(()=>{
         const a = n == null ? void 0 : n.getBoundingClientRect();
         if (!i || !a || !s) return;
-        const { top: t , right: O , left: g , bottom: A  } = a, T = i.scrollHeight, I = u === "left" ? g : void 0, F = u === "right" ? R.width - O : void 0, L = t - J, $ = A + J, H = R.height - $ - V, P = L - V, B = H > T, z = P > T, te = B || !z && H > P;
+        const { top: t, right: O, left: g, bottom: A } = a, T = i.scrollHeight, I = u === "left" ? g : void 0, F = u === "right" ? R.width - O : void 0, L = t - J, $ = A + J, H = R.height - $ - V, P = L - V, B = H > T, z = P > T, te = B || !z && H > P;
         N(te ? {
             left: I,
             right: F,
@@ -367,7 +370,7 @@ const ke = 120, Q = /*#__PURE__*/ _react.createContext({
                         },
                         disableScroll: !0,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                            style: _object_spread({}, (0, _dynamic.assignInlineVars)(_object_spread({}, l ? _object_spread({
+                            style: _object_spread({}, (0, _css.applyCssVars)(_object_spread({}, l ? _object_spread({
                                 [_menucssmistica.vars.top]: l.top,
                                 [_menucssmistica.vars.bottom]: l.bottom,
                                 [_menucssmistica.vars.transformOrigin]: l.transformOrigin

package/dist/modal-context-provider.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -45,7 +46,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -94,7 +97,7 @@ function _object_spread(target) {
 const o = /*#__PURE__*/ _react.createContext({
     isModalOpen: !1
 }), s = /*#__PURE__*/ _react.createContext(()=>{}), S = (param)=>{
-    let { children: e  } = param;
+    let { children: e } = param;
     const [l, n] = _react.useState({
         isModalOpen: !1
     }), d = _react.useCallback((r)=>{

package/dist/month-field.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -43,7 +44,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -141,7 +144,7 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const j = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "date-time-picker" */ "./date-time-picker.js")))), z = (_param)=>{
-    var { disabled: l , error: h , helperText: g , name: y , optional: a , validate: s , onChange: D , onChangeValue: n , onBlur: R , value: S , defaultValue: k , min: o , max: i  } = _param, d = _object_without_properties(_param, [
+    var { disabled: l, error: h, helperText: g, name: y, optional: a, validate: s, onChange: D, onChangeValue: n, onBlur: R, value: S, defaultValue: k, min: o, max: i } = _param, d = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -156,7 +159,7 @@ const j = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/
         "min",
         "max"
     ]);
-    const F = (t)=>t, I = _react.useMemo(()=>(0, _dom.isInputTypeSupported)("month"), []), { texts: T  } = (0, _hooks.useTheme)(), c = (t)=>!(o && t && t < (0, _time.getLocalYearMonthString)(o) || i && t && t > (0, _time.getLocalYearMonthString)(i)), u = (0, _formcontext.useFieldProps)({
+    const F = (t)=>t, I = _react.useMemo(()=>(0, _dom.isInputTypeSupported)("month"), []), { texts: T } = (0, _hooks.useTheme)(), c = (t)=>!(o && t && t < (0, _time.getLocalYearMonthString)(o) || i && t && t > (0, _time.getLocalYearMonthString)(i)), u = (0, _formcontext.useFieldProps)({
         name: y,
         value: S,
         defaultValue: k,

package/dist/navigation-bar.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -79,7 +80,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -177,7 +180,7 @@ function _object_without_properties_loose(source, excluded) {
     return target;
 }
 const ke = (param)=>/* @__PURE__ */ {
-    let { isOpen: n  } = param;
+    let { isOpen: n } = param;
     return (0, _jsxruntime.jsxs)("div", {
         className: _navigationbarcssmistica.burgerIconContainer,
         role: "presentation",
@@ -194,8 +197,8 @@ const ke = (param)=>/* @__PURE__ */ {
         ]
     });
 }, Ee = 300, f = (param)=>{
-    let { children: n , topFixed: o , withBorder: t , isMenuOpen: r , isInverse: a , dataAttributes: c , isBottomRow: d = !1  } = param;
-    const { isDarkMode: s  } = (0, _hooks.useTheme)();
+    let { children: n, topFixed: o, withBorder: t, isMenuOpen: r, isInverse: a, dataAttributes: c, isBottomRow: d = !1 } = param;
+    const { isDarkMode: s } = (0, _hooks.useTheme)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("header", _object_spread_props(_object_spread({
         className: (0, _classnames.default)((()=>{
             const h = a && !s;
@@ -212,8 +215,8 @@ const ke = (param)=>/* @__PURE__ */ {
         children: n
     }));
 }, Ge = 136, ye = 24, N = (param)=>{
-    let { right: n , children: o  } = param;
-    const { isTabletOrSmaller: t  } = (0, _hooks.useScreenSize)();
+    let { right: n, children: o } = param;
+    const { isTabletOrSmaller: t } = (0, _hooks.useScreenSize)();
     return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
         className: _navigationbarcssmistica.navigationBarContent,
         children: [
@@ -228,8 +231,8 @@ const ke = (param)=>/* @__PURE__ */ {
         ]
     });
 }, dn = (param)=>{
-    let { sections: n , selectedIndex: o , right: t , isInverse: r = !1 , topFixed: a = !0 , withBorder: c = !0 , burgerMenuExtra: d , logo: s , large: p = !1  } = param;
-    const { texts: h , isDarkMode: q  } = (0, _hooks.useTheme)(), [l, x] = _react.useState(!1), [_, v] = _react.useState("closed"), k = (0, _hooks.useAriaId)(), J = q ? 1 : 0.2, { isTabletOrSmaller: E  } = (0, _hooks.useScreenSize)(), G = (0, _modalcontextprovider.useSetModalState)();
+    let { sections: n, selectedIndex: o, right: t, isInverse: r = !1, topFixed: a = !0, withBorder: c = !0, burgerMenuExtra: d, logo: s, large: p = !1 } = param;
+    const { texts: h, isDarkMode: q } = (0, _hooks.useTheme)(), [l, x] = _react.useState(!1), [_, v] = _react.useState("closed"), k = (0, _hooks.useAriaId)(), J = q ? 1 : 0.2, { isTabletOrSmaller: E } = (0, _hooks.useScreenSize)(), G = (0, _modalcontextprovider.useSetModalState)();
     if (s = s !== null && s !== void 0 ? s : /* @__PURE__ */ (0, _jsxruntime.jsx)(_logo.Logo, {
         size: E ? 40 : 48
     }), E) {
@@ -348,7 +351,7 @@ const ke = (param)=>/* @__PURE__ */ {
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_inline.default, {
                 space: 32,
                 children: n.map((_param, g)=>/* @__PURE__ */ /*#__PURE__*/ {
-                    var { title: I  } = _param, b = _object_without_properties(_param, [
+                    var { title: I } = _param, b = _object_without_properties(_param, [
                         "title"
                     ]);
                     return /*#__PURE__*/ (0, _react.createElement)(_touchable.BaseTouchable, _object_spread_props(_object_spread({}, b), {
@@ -413,8 +416,8 @@ const ke = (param)=>/* @__PURE__ */ {
         ]
     });
 }, mn = (param)=>{
-    let { onBack: n , title: o , right: t , isInverse: r = !1 , topFixed: a = !0 , paddingX: c = 0 , withBorder: d = !0  } = param;
-    const { texts: s  } = (0, _hooks.useTheme)(), p = /* @__PURE__ */ (0, _jsxruntime.jsx)(N, {
+    let { onBack: n, title: o, right: t, isInverse: r = !1, topFixed: a = !0, paddingX: c = 0, withBorder: d = !0 } = param;
+    const { texts: s } = (0, _hooks.useTheme)(), p = /* @__PURE__ */ (0, _jsxruntime.jsx)(N, {
         right: t,
         children: /* @__PURE__ */ (0, _jsxruntime.jsxs)(_inline.default, {
             space: 24,
@@ -464,8 +467,8 @@ const ke = (param)=>/* @__PURE__ */ {
         ]
     });
 }, un = (param)=>{
-    let { logo: n , right: o , isInverse: t = !1 , topFixed: r = !0 , withBorder: a = !0  } = param;
-    const { isTabletOrSmaller: c  } = (0, _hooks.useScreenSize)();
+    let { logo: n, right: o, isInverse: t = !1, topFixed: r = !0, withBorder: a = !0 } = param;
+    const { isTabletOrSmaller: c } = (0, _hooks.useScreenSize)();
     return n = n !== null && n !== void 0 ? n : /* @__PURE__ */ (0, _jsxruntime.jsx)(_logo.Logo, {
         size: c ? 40 : 48
     }), /* @__PURE__ */ (0, _jsxruntime.jsxs)(_themevariantcontext.ThemeVariant, {
@@ -494,7 +497,7 @@ const ke = (param)=>/* @__PURE__ */ {
         ]
     });
 }, pn = (param)=>/* @__PURE__ */ {
-    let { children: n  } = param;
+    let { children: n } = param;
     return (0, _jsxruntime.jsx)("div", {
         className: _navigationbarcssmistica.lineHeightFix,
         "data-component-name": "NavigationBarActionGroup",
@@ -505,7 +508,7 @@ const ke = (param)=>/* @__PURE__ */ {
         })
     });
 }, hn = (_param)=>{
-    var { children: n  } = _param, o = _object_without_properties(_param, [
+    var { children: n } = _param, o = _object_without_properties(_param, [
         "children"
     ]);
     const t = (0, _themevariantcontext.useIsInverseVariant)();

package/dist/navigation-breadcrumbs.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
@@ -73,7 +74,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 const N = " / ", b = (param)=>{
-    let { title: s , breadcrumbs: n , dataAttributes: c , "aria-label": m = "Breadcrumb"  } = param;
+    let { title: s, breadcrumbs: n, dataAttributes: c, "aria-label": m = "Breadcrumb" } = param;
     const i = (0, _themevariantcontext.useIsInverseVariant)();
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("nav", _object_spread_props(_object_spread({
         "aria-label": m
@@ -82,7 +83,7 @@ const N = " / ", b = (param)=>{
             className: _navigationbreadcrumbscssmistica.list,
             children: [
                 n.map((param, u)=>/* @__PURE__ */ {
-                    let { title: a , url: d  } = param;
+                    let { title: a, url: d } = param;
                     return (0, _jsxruntime.jsxs)("li", {
                         className: _navigationbreadcrumbscssmistica.listItem,
                         children: [

package/dist/negative-box.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "default", {
 });
 const _jsxruntime = require("react/jsx-runtime");
 const a = (param)=>/* @__PURE__ */ {
-    let { left: o , right: t , children: i  } = param;
+    let { left: o, right: t, children: i } = param;
     return (0, _jsxruntime.jsx)("div", {
         style: {
             marginLeft: o || !o && !t ? -16 : void 0,