@telefonica/mistica 16.61.0 → 16.62.0

package/dist/list.css-mistica.js

@@ -91,4 +91,4 @@ _export(exports, {
         return p;
     }
 });
-/* empty css                                     */ /* empty css                                */ var n = "v16_61_2buj9g0", f = "v16_61_2buj9g1 v16_61_1y2v1nfqr", y = "v16_61_2buj9g2", r = "v16_61_2buj9g3", u = "v16_61_2buj9g4", a = "v16_61_2buj9g5 v16_61_1y2v1nft7", g = "v16_61_2buj9g7 v16_61_2buj9g6 v16_61_1y2v1nffx v16_61_1y2v1nfh6 v16_61_1y2v1nfif v16_61_1y2v1nfjo v16_61_1y2v1nfqr v16_61_1y2v1nfsm v16_61_1y2v1nffw v16_61_1y2v1nfq6 v16_61_1y2v1nfr8 v16_61_1y2v1nfpy", j = "v16_61_2buj9g8 v16_61_1y2v1nfiu v16_61_1y2v1nfk3", b = "v16_61_2buj9g9 v16_61_1y2v1nfgc v16_61_1y2v1nfhl v16_61_1y2v1nfq4 v16_61_1y2v1nfqr v16_61_1y2v1nfsh", t = "v16_61_2buj9ga v16_61_1y2v1nfk3", i = "v16_61_2buj9gb v16_61_1y2v1nfq4 v16_61_1y2v1nfqm v16_61_1y2v1nfqo", o = "v16_61_2buj9gc v16_61_1y2v1nfq4 v16_61_1y2v1nfqa v16_61_1y2v1nfqq", q = "v16_61_2buj9gd v16_61_1y2v1nfq4 v16_61_1y2v1nfqj", e = "v16_61_2buj9gf v16_61_2buj9gd v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_2buj9ge v16_61_1y2v1nfqd v16_61_1y2v1nfru v16_61_1y2v1nfr8 v16_61_1y2v1nfqm", d = "v16_61_2buj9gg", l = "v16_61_2buj9gh", h = "v16_61_2buj9gi", c = "v16_61_2buj9gj v16_61_2buj9gd v16_61_1y2v1nfq4 v16_61_1y2v1nfqj", s = "v16_61_2buj9gk v16_61_1y2v1nfq4 v16_61_1y2v1nfq9 v16_61_1y2v1nfr8", m = "v16_61_2buj9gn v16_61_2buj9gl v16_61_1y2v1nffx v16_61_1y2v1nfh6 v16_61_1y2v1nfif v16_61_1y2v1nfjo v16_61_1y2v1nfsm v16_61_1y2v1nffw v16_61_2buj9gm v16_61_1y2v1nfiu v16_61_1y2v1nfk3 v16_61_1y2v1nfq6 v16_61_1y2v1nfqp", k = "v16_61_2buj9gp v16_61_2buj9go v16_61_1y2v1nfq4", w = "v16_61_2buj9gr v16_61_2buj9gl v16_61_1y2v1nffx v16_61_1y2v1nfh6 v16_61_1y2v1nfif v16_61_1y2v1nfjo v16_61_1y2v1nfsm v16_61_1y2v1nffw v16_61_2buj9gq v16_61_1y2v1nfiu v16_61_1y2v1nfk3 v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfqo v16_61_1y2v1nfqs v16_61_1y2v1nfr8", p = "v16_61_2buj9gs", C = "v16_61_2buj9gt", x = "v16_61_2buj9gu", A = "v16_61_2buj9gv", B = "v16_61_2buj9gw";
+/* empty css                                     */ /* empty css                                */ var n = "v16_62_2buj9g0", f = "v16_62_2buj9g1 v16_62_1y2v1nfqr", y = "v16_62_2buj9g2", r = "v16_62_2buj9g3", u = "v16_62_2buj9g4", a = "v16_62_2buj9g5 v16_62_1y2v1nft7", g = "v16_62_2buj9g7 v16_62_2buj9g6 v16_62_1y2v1nffx v16_62_1y2v1nfh6 v16_62_1y2v1nfif v16_62_1y2v1nfjo v16_62_1y2v1nfqr v16_62_1y2v1nfsm v16_62_1y2v1nffw v16_62_1y2v1nfq6 v16_62_1y2v1nfr8 v16_62_1y2v1nfpy", j = "v16_62_2buj9g8 v16_62_1y2v1nfiu v16_62_1y2v1nfk3", b = "v16_62_2buj9g9 v16_62_1y2v1nfgc v16_62_1y2v1nfhl v16_62_1y2v1nfq4 v16_62_1y2v1nfqr v16_62_1y2v1nfsh", t = "v16_62_2buj9ga v16_62_1y2v1nfk3", i = "v16_62_2buj9gb v16_62_1y2v1nfq4 v16_62_1y2v1nfqm v16_62_1y2v1nfqo", o = "v16_62_2buj9gc v16_62_1y2v1nfq4 v16_62_1y2v1nfqa v16_62_1y2v1nfqq", q = "v16_62_2buj9gd v16_62_1y2v1nfq4 v16_62_1y2v1nfqj", e = "v16_62_2buj9gf v16_62_2buj9gd v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_2buj9ge v16_62_1y2v1nfqd v16_62_1y2v1nfru v16_62_1y2v1nfr8 v16_62_1y2v1nfqm", d = "v16_62_2buj9gg", l = "v16_62_2buj9gh", h = "v16_62_2buj9gi", c = "v16_62_2buj9gj v16_62_2buj9gd v16_62_1y2v1nfq4 v16_62_1y2v1nfqj", s = "v16_62_2buj9gk v16_62_1y2v1nfq4 v16_62_1y2v1nfq9 v16_62_1y2v1nfr8", m = "v16_62_2buj9gn v16_62_2buj9gl v16_62_1y2v1nffx v16_62_1y2v1nfh6 v16_62_1y2v1nfif v16_62_1y2v1nfjo v16_62_1y2v1nfsm v16_62_1y2v1nffw v16_62_2buj9gm v16_62_1y2v1nfiu v16_62_1y2v1nfk3 v16_62_1y2v1nfq6 v16_62_1y2v1nfqp", k = "v16_62_2buj9gp v16_62_2buj9go v16_62_1y2v1nfq4", w = "v16_62_2buj9gr v16_62_2buj9gl v16_62_1y2v1nffx v16_62_1y2v1nfh6 v16_62_1y2v1nfif v16_62_1y2v1nfjo v16_62_1y2v1nfsm v16_62_1y2v1nffw v16_62_2buj9gq v16_62_1y2v1nfiu v16_62_1y2v1nfk3 v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfqo v16_62_1y2v1nfqs v16_62_1y2v1nfr8", p = "v16_62_2buj9gs", C = "v16_62_2buj9gt", x = "v16_62_2buj9gu", A = "v16_62_2buj9gv", B = "v16_62_2buj9gw";

package/dist/loading-bar.css-mistica.js

@@ -22,4 +22,4 @@ _export(exports, {
         return y;
     }
 });
-/* empty css                                     */ /* empty css                                       */ var n = "v16_61_1num3qg2 v16_61_1num3qg1 v16_61_1y2v1nfq0 v16_61_1y2v1nfte v16_61_1y2v1nftt v16_61_1y2v1nfu8", r = "v16_61_1num3qg3", y = "v16_61_1num3qg4 v16_61_1y2v1nfqr v16_61_1y2v1nft8 v16_61_1y2v1nfpy v16_61_1y2v1nfbx v16_61_1y2v1nfrb", f = "v16_61_1num3qg7 v16_61_1num3qg6 v16_61_1y2v1nfpz v16_61_1y2v1nfqr v16_61_1y2v1nfr8";
+/* empty css                                     */ /* empty css                                       */ var n = "v16_62_1num3qg2 v16_62_1num3qg1 v16_62_1y2v1nfq0 v16_62_1y2v1nfte v16_62_1y2v1nftt v16_62_1y2v1nfu8", r = "v16_62_1num3qg3", y = "v16_62_1num3qg4 v16_62_1y2v1nfqr v16_62_1y2v1nft8 v16_62_1y2v1nfpy v16_62_1y2v1nfbx v16_62_1y2v1nfrb", f = "v16_62_1num3qg7 v16_62_1num3qg6 v16_62_1y2v1nfpz v16_62_1y2v1nfqr v16_62_1y2v1nfr8";

package/dist/loading-screen.css-mistica.js

@@ -43,7 +43,7 @@ _export(exports, {
         return f;
     }
 });
-/* empty css                                     */ /* empty css                                          */ var e = "v16_61_flke8b1 v16_61_flke8b0 v16_61_1y2v1nfq4 v16_61_1y2v1nfqa v16_61_1y2v1nfqj", n = 500, a = "v16_61_flke8b3", r = {
-    default: "v16_61_flke8b4",
-    brand: "v16_61_flke8b5"
-}, f = "v16_61_flke8b6", l = "v16_61_flke8b7 v16_61_1y2v1nfqq v16_61_1y2v1nfq4 v16_61_1y2v1nfqa v16_61_1y2v1nfqj v16_61_1y2v1nfqd", d = "v16_61_flke8b9 v16_61_flke8b8 v16_61_1y2v1nfgi", k = "v16_61_flke8bb", o = "v16_61_flke8bc", b = "v16_61_flke8be", i = "v16_61_flke8bf";
+/* empty css                                     */ /* empty css                                          */ var e = "v16_62_flke8b1 v16_62_flke8b0 v16_62_1y2v1nfq4 v16_62_1y2v1nfqa v16_62_1y2v1nfqj", n = 500, a = "v16_62_flke8b3", r = {
+    default: "v16_62_flke8b4",
+    brand: "v16_62_flke8b5"
+}, f = "v16_62_flke8b6", l = "v16_62_flke8b7 v16_62_1y2v1nfqq v16_62_1y2v1nfq4 v16_62_1y2v1nfqa v16_62_1y2v1nfqj v16_62_1y2v1nfqd", d = "v16_62_flke8b9 v16_62_flke8b8 v16_62_1y2v1nfgi", k = "v16_62_flke8bb", o = "v16_62_flke8bc", b = "v16_62_flke8be", i = "v16_62_flke8bf";

package/dist/logo.css-mistica.js

@@ -20,8 +20,8 @@ _export(exports, {
     }
 });
 /* empty css                                */ var _ = {
-    size: "var(--v16_61_140ft6x0)",
-    sizeMobile: "var(--v16_61_140ft6x1)",
-    sizeTablet: "var(--v16_61_140ft6x2)",
-    sizeDesktop: "var(--v16_61_140ft6x3)"
-}, r = "v16_61_140ft6x4", t = "v16_61_140ft6x5";
+    size: "var(--v16_62_140ft6x0)",
+    sizeMobile: "var(--v16_62_140ft6x1)",
+    sizeTablet: "var(--v16_62_140ft6x2)",
+    sizeDesktop: "var(--v16_62_140ft6x3)"
+}, r = "v16_62_140ft6x4", t = "v16_62_140ft6x5";

package/dist/menu.css-mistica.js

@@ -10,11 +10,14 @@ function _export(target, all) {
 }
 _export(exports, {
     get iconContainer () {
-        return f;
+        return o;
     },
     get itemContent () {
         return m;
     },
+    get itemTextContent () {
+        return f;
+    },
     get menuContainer () {
         return e;
     },
@@ -25,10 +28,10 @@ _export(exports, {
         return u;
     },
     get menuItemEnabled () {
-        return t;
+        return a;
     },
     get menuItemHovered () {
-        return a;
+        return t;
     },
     get menuSectionDivider () {
         return i;
@@ -41,16 +44,16 @@ _export(exports, {
     }
 });
 /* empty css                                     */ /* empty css                                */ var k = {
-    top: "var(--v16_61_2k0k3u0)",
-    bottom: "var(--v16_61_2k0k3u1)",
-    left: "var(--v16_61_2k0k3u2)",
-    right: "var(--v16_61_2k0k3u4)",
-    width: "var(--v16_61_2k0k3u3)",
-    maxHeight: "var(--v16_61_2k0k3u5)",
-    transformOrigin: "var(--v16_61_2k0k3u6)"
-}, e = "v16_61_2k0k3u8 v16_61_2k0k3u7 v16_61_1y2v1nfg6 v16_61_1y2v1nfhf v16_61_1y2v1nfio v16_61_1y2v1nfjx v16_61_1y2v1nf83 v16_61_1y2v1nfsy v16_61_1y2v1nfq4 v16_61_1y2v1nfqa v16_61_1y2v1nfpz", n = {
-    enter: "v16_61_2k0k3u9",
-    enterActive: "v16_61_2k0k3ua",
-    exit: "v16_61_2k0k3ub",
-    exitActive: "v16_61_2k0k3uc"
-}, r = "v16_61_2k0k3ud", a = "v16_61_2k0k3ue", t = "v16_61_2k0k3uf", u = "v16_61_2k0k3ug", i = "v16_61_2k0k3ui v16_61_2k0k3uh v16_61_1y2v1nfg6 v16_61_1y2v1nfhf", m = "v16_61_2k0k3uj", f = "v16_61_2k0k3uk";
+    top: "var(--v16_62_2k0k3u0)",
+    bottom: "var(--v16_62_2k0k3u1)",
+    left: "var(--v16_62_2k0k3u2)",
+    right: "var(--v16_62_2k0k3u4)",
+    width: "var(--v16_62_2k0k3u3)",
+    maxHeight: "var(--v16_62_2k0k3u5)",
+    transformOrigin: "var(--v16_62_2k0k3u6)"
+}, e = "v16_62_2k0k3u8 v16_62_2k0k3u7 v16_62_1y2v1nfg6 v16_62_1y2v1nfhf v16_62_1y2v1nfio v16_62_1y2v1nfjx v16_62_1y2v1nf83 v16_62_1y2v1nfsy v16_62_1y2v1nfq4 v16_62_1y2v1nfqa v16_62_1y2v1nfpz", n = {
+    enter: "v16_62_2k0k3u9",
+    enterActive: "v16_62_2k0k3ua",
+    exit: "v16_62_2k0k3ub",
+    exitActive: "v16_62_2k0k3uc"
+}, r = "v16_62_2k0k3ud", t = "v16_62_2k0k3ue", a = "v16_62_2k0k3uf", u = "v16_62_2k0k3ug", i = "v16_62_2k0k3ui v16_62_2k0k3uh v16_62_1y2v1nfg6 v16_62_1y2v1nfhf", m = "v16_62_2k0k3uj", f = "v16_62_2k0k3uk", o = "v16_62_2k0k3ul";

package/dist/menu.css.d.ts

@@ -20,4 +20,5 @@ export declare const menuItemEnabled: string;
 export declare const menuItemDisabled: string;
 export declare const menuSectionDivider: string;
 export declare const itemContent: string;
+export declare const itemTextContent: string;
 export declare const iconContainer: string;

package/dist/menu.d.ts

@@ -3,6 +3,7 @@ import type { ExclusifyUnion } from './utils/utility-types';
 import type { DataAttributes, IconProps } from './utils/types';
 interface MenuItemBaseProps {
     label: string;
+    description?: string;
     Icon?: (props: IconProps) => JSX.Element;
     destructive?: boolean;
     disabled?: boolean;
@@ -18,7 +19,7 @@ interface MenuItemWithControlProps extends MenuItemBaseProps {
     checked?: boolean;
 }
 type MenuItemProps = ExclusifyUnion<MenuItemWithControlProps | MenuItemWithoutControlProps>;
-export declare const MenuItem: ({ label, Icon, destructive, disabled, onPress, controlType, checked, dataAttributes, }: MenuItemProps) => JSX.Element;
+export declare const MenuItem: ({ label, Icon, destructive, disabled, onPress, controlType, checked, description, dataAttributes, }: MenuItemProps) => JSX.Element;
 type MenuSectionProps = {
     children?: React.ReactNode;
 };

package/dist/menu.js

@@ -11,13 +11,13 @@ function _export(target, all) {
 }
 _export(exports, {
     get Menu () {
-        return Je;
+        return Ze;
     },
     get MenuItem () {
-        return qe;
+        return Je;
     },
     get MenuSection () {
-        return Ve;
+        return Qe;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -138,31 +138,46 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const ke = 120, Z = /*#__PURE__*/ _react.createContext({
+const Ae = 120, Z = /*#__PURE__*/ _react.createContext({
     focusedItem: null,
     isMenuOpen: !1,
     setFocusedItem: ()=>{},
     closeMenu: ()=>{}
-}), Ae = ()=>_react.useContext(Z), F = (s)=>s ? Array.from(s.querySelectorAll("[role=menuitem],[role=menuitemcheckbox]")) : [], Ne = (s, m)=>{
-    if (!m) return null;
-    const u = F(s).indexOf(m);
-    return u < 0 ? null : u;
-}, qe = (param)=>{
-    let { label: s, Icon: m, destructive: u, disabled: a, onPress: E, controlType: r, checked: f, dataAttributes: d } = param;
-    const { focusedItem: C, setFocusedItem: i, closeMenu: k, isMenuOpen: l } = Ae(), p = _react.useRef(null), h = u ? _skincontractcssmistica.vars.colors.textLinkDanger : _skincontractcssmistica.vars.colors.neutralHigh, b = p === null || p === void 0 ? void 0 : p.current, A = (b === null || b === void 0 ? void 0 : b.closest("[role=menu]")) || null, t = Ne(A, b), M = _object_spread({
+}), Re = ()=>_react.useContext(Z), H = (r)=>r ? Array.from(r.querySelectorAll("[role=menuitem],[role=menuitemcheckbox]")) : [], Fe = (r, d)=>{
+    if (!d) return null;
+    const f = H(r).indexOf(d);
+    return f < 0 ? null : f;
+}, Je = (param)=>{
+    let { label: r, Icon: d, destructive: f, disabled: a, onPress: k, controlType: o, checked: p, description: l, dataAttributes: N } = param;
+    const { focusedItem: s, setFocusedItem: A, closeMenu: m, isMenuOpen: g } = Re(), v = _react.useRef(null), x = f ? _skincontractcssmistica.vars.colors.textLinkDanger : _skincontractcssmistica.vars.colors.neutralHigh, S = v === null || v === void 0 ? void 0 : v.current, i = (S === null || S === void 0 ? void 0 : S.closest("[role=menu]")) || null, u = Fe(i, S), b = _object_spread({
         testid: "MenuItem"
-    }, d), I = ()=>r === "checkbox" ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_checkbox.default, {
-            ref: p,
-            name: s,
-            checked: f,
+    }, N), R = (M)=>/* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
+            id: M,
+            className: _menucssmistica.itemTextContent,
+            children: [
+                /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text3, {
+                    regular: !0,
+                    color: x,
+                    children: r
+                }),
+                l && /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text2, {
+                    regular: !0,
+                    color: _skincontractcssmistica.vars.colors.textSecondary,
+                    children: l
+                })
+            ]
+        }), P = ()=>o === "checkbox" ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_checkbox.default, {
+            ref: v,
+            name: r,
+            checked: p,
             onChange: ()=>{
-                l && t !== null && (E(t), k());
+                g && u !== null && (k(u), m());
             },
             disabled: a,
             role: "menuitemcheckbox",
-            dataAttributes: M,
+            dataAttributes: b,
             render: (param)=>{
-                let { controlElement: y } = param;
+                let { controlElement: M, labelId: F } = param;
                 return /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                     paddingX: 8,
                     paddingY: 12,
@@ -173,54 +188,46 @@ const ke = 120, Z = /*#__PURE__*/ _react.createContext({
                             /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                                 className: _menucssmistica.itemContent,
                                 children: [
-                                    m && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                                    d && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                                         className: _menucssmistica.iconContainer,
-                                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(m, {
+                                        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(d, {
                                             size: 24,
-                                            color: h
+                                            color: x
                                         })
                                     }),
-                                    /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text3, {
-                                        regular: !0,
-                                        color: h,
-                                        children: s
-                                    })
+                                    R(F)
                                 ]
                             }),
                             /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                                 paddingLeft: 16,
-                                children: y
+                                children: M
                             })
                         ]
                     })
                 });
             }
         }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_touchable.default, {
-            ref: p,
+            ref: v,
             onPress: ()=>{
-                l && t !== null && (E(t), k());
+                g && u !== null && (k(u), m());
             },
             disabled: a,
             role: "menuitem",
-            dataAttributes: M,
+            dataAttributes: b,
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_box.default, {
                 paddingX: 8,
                 paddingY: 12,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
                     className: _menucssmistica.itemContent,
                     children: [
-                        m && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
+                        d && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                             className: _menucssmistica.iconContainer,
-                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(m, {
+                            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(d, {
                                 size: 24,
-                                color: h
+                                color: x
                             })
                         }),
-                        /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text3, {
-                            regular: !0,
-                            color: h,
-                            children: s
-                        })
+                        R()
                     ]
                 })
             })
@@ -229,119 +236,119 @@ const ke = 120, Z = /*#__PURE__*/ _react.createContext({
         className: (0, _classnames.default)(_menucssmistica.menuItem, {
             [_menucssmistica.menuItemEnabled]: !a,
             [_menucssmistica.menuItemDisabled]: a,
-            [_menucssmistica.menuItemHovered]: !a && t !== null && C === t
+            [_menucssmistica.menuItemHovered]: !a && u !== null && s === u
         }),
-        onMouseMove: ()=>i(a ? null : t),
-        onMouseLeave: ()=>i(null),
-        children: I()
+        onMouseMove: ()=>A(a ? null : u),
+        onMouseLeave: ()=>A(null),
+        children: P()
     });
-}, Ve = (param)=>{
-    let { children: s } = param;
-    return s ? /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+}, Qe = (param)=>{
+    let { children: r } = param;
+    return r ? /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            s,
+            r,
             /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 className: _menucssmistica.menuSectionDivider,
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_divider.default, {})
             })
         ]
     }) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {});
-}, J = 12, Q = 8, Je = (param)=>{
-    let { renderTarget: s, renderMenu: m, width: u, position: a = "left", dataAttributes: E } = param;
-    const [r, f] = _react.useState(!1), [d, C] = _react.useState(null), [i, k] = _react.useState(null), [l, p] = _react.useState(null), [h, b] = _react.useState(!1), A = _react.useRef(null), [t, M] = _react.useState(null), I = (0, _hooks.useWindowSize)();
+}, J = 12, Q = 8, Ze = (param)=>{
+    let { renderTarget: r, renderMenu: d, width: f, position: a = "left", dataAttributes: k } = param;
+    const [o, p] = _react.useState(!1), [l, N] = _react.useState(null), [s, A] = _react.useState(null), [m, g] = _react.useState(null), [v, x] = _react.useState(!1), S = _react.useRef(null), [i, u] = _react.useState(null), b = (0, _hooks.useWindowSize)();
     _react.useEffect(()=>{
-        const c = d === null || d === void 0 ? void 0 : d.getBoundingClientRect();
-        if (!i || !c || !r) return;
-        const { top: n, right: O, left: g, bottom: N } = c, v = i.scrollHeight, R = a === "left" ? g : void 0, L = a === "right" ? I.width - O : void 0, $ = n - Q, B = N + Q, D = I.height - B - J, H = $ - J, z = D > v, U = H > v, te = z || !U && D > H;
-        M(te ? {
-            left: R,
-            right: L,
-            top: `${B}px`,
+        const c = l === null || l === void 0 ? void 0 : l.getBoundingClientRect();
+        if (!s || !c || !o) return;
+        const { top: t, right: C, left: h, bottom: y } = c, T = s.scrollHeight, D = a === "left" ? h : void 0, B = a === "right" ? b.width - C : void 0, z = t - Q, U = y + Q, w = b.height - U - J, _ = z - J, W = w > T, G = _ > T, ee = W || !G && w > _;
+        u(ee ? {
+            left: D,
+            right: B,
+            top: `${U}px`,
             bottom: "auto",
-            maxHeight: z ? void 0 : D,
+            maxHeight: W ? void 0 : w,
             transformOrigin: "center top"
         } : {
-            left: R,
-            right: L,
+            left: D,
+            right: B,
             top: "auto",
-            bottom: `${I.height - $}px`,
-            maxHeight: U ? void 0 : H,
+            bottom: `${b.height - z}px`,
+            maxHeight: G ? void 0 : _,
             transformOrigin: "center bottom"
         });
     }, [
         a,
-        r,
-        i,
-        d,
-        u,
-        I
+        o,
+        s,
+        l,
+        f,
+        b
     ]);
-    const y = _react.useMemo(()=>({
-            ref: C,
+    const R = _react.useMemo(()=>({
+            ref: N,
             onPress: ()=>{
-                f(!r);
+                p(!o);
             }
         }), [
-        C,
-        r
-    ]), ee = {
-        ref: (0, _common.combineRefs)(k, A),
+        N,
+        o
+    ]), P = {
+        ref: (0, _common.combineRefs)(A, S),
         className: _menucssmistica.menuContainer,
-        close: ()=>f(!1)
-    }, w = _react.useCallback(()=>{
-        const n = F(i).findIndex((O)=>!O.getAttribute("aria-disabled"));
-        p(n < 0 ? null : n);
+        close: ()=>p(!1)
+    }, M = _react.useCallback(()=>{
+        const t = H(s).findIndex((C)=>!C.getAttribute("aria-disabled"));
+        g(t < 0 ? null : t);
     }, [
-        i
-    ]), _ = _react.useCallback((c)=>{
-        var _n_g;
-        const n = F(i);
-        c && n.reverse();
-        const O = l === null ? -1 : c ? n.length - 1 - l : l;
-        let g = n.findIndex((v, R)=>!v.getAttribute("aria-disabled") && R > O);
-        g === -1 && (g = n.findIndex((v)=>!v.getAttribute("aria-disabled")));
-        const N = c && g !== -1 ? n.length - 1 - g : g;
-        p(N < 0 ? null : N), (_n_g = n[g]) === null || _n_g === void 0 ? void 0 : _n_g.focus();
+        s
+    ]), F = _react.useCallback((c)=>{
+        var _t_h;
+        const t = H(s);
+        c && t.reverse();
+        const C = m === null ? -1 : c ? t.length - 1 - m : m;
+        let h = t.findIndex((T, D)=>!T.getAttribute("aria-disabled") && D > C);
+        h === -1 && (h = t.findIndex((T)=>!T.getAttribute("aria-disabled")));
+        const y = c && h !== -1 ? t.length - 1 - h : h;
+        g(y < 0 ? null : y), (_t_h = t[h]) === null || _t_h === void 0 ? void 0 : _t_h.focus();
     }, [
-        l,
-        i
+        m,
+        s
     ]);
     return _react.useEffect(()=>{
-        r ? h && i && (w(), b(!1)) : p(null);
+        o ? v && s && (M(), x(!1)) : g(null);
     }, [
-        r,
-        w,
-        h,
-        i
+        o,
+        M,
+        v,
+        s
     ]), _react.useEffect(()=>{
-        const c = (n)=>{
-            if (r) switch(n.key){
+        const c = (t)=>{
+            if (o) switch(t.key){
                 case _keys.RIGHT:
                 case _keys.DOWN:
-                    (0, _dom.cancelEvent)(n), _();
+                    (0, _dom.cancelEvent)(t), F();
                     break;
                 case _keys.LEFT:
                 case _keys.UP:
-                    (0, _dom.cancelEvent)(n), _(!0);
+                    (0, _dom.cancelEvent)(t), F(!0);
                     break;
                 case _keys.ESC:
-                    f(!1);
+                    p(!1);
                     break;
                 case _keys.SPACE:
                 case _keys.ENTER:
-                    (0, _dom.cancelEvent)(n), l !== null && F(i)[l].click();
+                    (0, _dom.cancelEvent)(t), m !== null && H(s)[m].click();
                     break;
                 case _keys.TAB:
-                    (0, _dom.cancelEvent)(n);
+                    (0, _dom.cancelEvent)(t);
                     break;
             }
-            else switch(n.key){
+            else switch(t.key){
                 case _keys.ENTER:
                 case _keys.SPACE:
-                    b(!0);
+                    x(!0);
                     break;
                 case _keys.DOWN:
-                    d === document.activeElement && (b(!0), f(!0));
+                    l === document.activeElement && (x(!0), p(!0));
                     break;
             }
         };
@@ -349,52 +356,52 @@ const ke = 120, Z = /*#__PURE__*/ _react.createContext({
             document.removeEventListener("keydown", c, !1);
         };
     }), _react.useEffect(()=>{
-        d === null || d === void 0 ? void 0 : d.setAttribute("aria-haspopup", "menu"), d === null || d === void 0 ? void 0 : d.setAttribute("aria-expanded", String(r));
+        l === null || l === void 0 ? void 0 : l.setAttribute("aria-haspopup", "menu"), l === null || l === void 0 ? void 0 : l.setAttribute("aria-expanded", String(o));
     }, [
-        d,
-        r
-    ]), /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({}, (0, _dom.getPrefixedDataAttributes)(E, "Menu")), {
+        l,
+        o
+    ]), /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", _object_spread_props(_object_spread({}, (0, _dom.getPrefixedDataAttributes)(k, "Menu")), {
         children: [
-            s(_object_spread_props(_object_spread({}, y), {
-                isMenuOpen: r
+            r(_object_spread_props(_object_spread({}, R), {
+                isMenuOpen: o
             })),
             /* @__PURE__ */ (0, _jsxruntime.jsx)(_portal.Portal, {
                 children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_reacttransitiongroup.CSSTransition, {
-                    in: r,
-                    nodeRef: A,
-                    timeout: (0, _platform.isRunningAcceptanceTest)() ? 0 : ke,
+                    in: o,
+                    nodeRef: S,
+                    timeout: (0, _platform.isRunningAcceptanceTest)() ? 0 : Ae,
                     classNames: _menucssmistica.menuTransitionClasses,
                     mountOnEnter: !0,
                     unmountOnExit: !0,
-                    onExit: ()=>d === null || d === void 0 ? void 0 : d.focus(),
+                    onExit: ()=>l === null || l === void 0 ? void 0 : l.focus(),
                     children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_overlay.default, {
                         onPress: (c)=>{
-                            (0, _dom.cancelEvent)(c), f(!1);
+                            (0, _dom.cancelEvent)(c), p(!1);
                         },
                         disableScroll: !0,
                         children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                            style: _object_spread({}, (0, _css.applyCssVars)(_object_spread({}, t ? _object_spread({
-                                [_menucssmistica.vars.top]: t.top,
-                                [_menucssmistica.vars.bottom]: t.bottom,
-                                [_menucssmistica.vars.transformOrigin]: t.transformOrigin
-                            }, t.left !== void 0 && {
-                                [_menucssmistica.vars.left]: `${t.left}px`
-                            }, t.right !== void 0 && {
-                                [_menucssmistica.vars.right]: `${t.right}px`
-                            }, t.maxHeight !== void 0 && {
-                                [_menucssmistica.vars.maxHeight]: `${t.maxHeight}px`
-                            }, u !== void 0 && {
-                                [_menucssmistica.vars.width]: u ? `${u}px` : ""
+                            style: _object_spread({}, (0, _css.applyCssVars)(_object_spread({}, i ? _object_spread({
+                                [_menucssmistica.vars.top]: i.top,
+                                [_menucssmistica.vars.bottom]: i.bottom,
+                                [_menucssmistica.vars.transformOrigin]: i.transformOrigin
+                            }, i.left !== void 0 && {
+                                [_menucssmistica.vars.left]: `${i.left}px`
+                            }, i.right !== void 0 && {
+                                [_menucssmistica.vars.right]: `${i.right}px`
+                            }, i.maxHeight !== void 0 && {
+                                [_menucssmistica.vars.maxHeight]: `${i.maxHeight}px`
+                            }, f !== void 0 && {
+                                [_menucssmistica.vars.width]: f ? `${f}px` : ""
                             }) : {}))),
                             role: "menu",
                             children: /* @__PURE__ */ (0, _jsxruntime.jsx)(Z.Provider, {
                                 value: {
-                                    isMenuOpen: r,
-                                    focusedItem: l,
-                                    setFocusedItem: p,
-                                    closeMenu: ()=>f(!1)
+                                    isMenuOpen: o,
+                                    focusedItem: m,
+                                    setFocusedItem: g,
+                                    closeMenu: ()=>p(!1)
                                 },
-                                children: m(ee)
+                                children: d(P)
                             })
                         })
                     })

package/dist/mosaic.css-mistica.js

@@ -19,4 +19,4 @@ _export(exports, {
         return r;
     }
 });
-/* empty css                                  */ var r = "v16_61_1j2q6te0", t = "v16_61_1j2q6te1", a = "v16_61_1j2q6te2";
+/* empty css                                  */ var r = "v16_62_1j2q6te0", t = "v16_62_1j2q6te1", a = "v16_62_1j2q6te2";

package/dist/navigation-bar.css-mistica.js

@@ -136,22 +136,22 @@ _export(exports, {
         return t;
     }
 });
-/* empty css                                     */ /* empty css                                          */ var n = 184, y = 300, d = 400, r = "v16_61_1vcy5dz1 v16_61_1vcy5dz0 v16_61_1y2v1nfpy v16_61_1y2v1nfr0 v16_61_1y2v1nfrg", e = "v16_61_1vcy5dz4 v16_61_1vcy5dz3 v16_61_1vcy5dz2 v16_61_1y2v1nfpz", c = "v16_61_1vcy5dz5 v16_61_1vcy5dz3 v16_61_1vcy5dz2 v16_61_1y2v1nfpz", f = "v16_61_1vcy5dz6 v16_61_1vcy5dz3 v16_61_1vcy5dz2 v16_61_1y2v1nfpz", a = "v16_61_1vcy5dz7 v16_61_1vcy5dz3 v16_61_1vcy5dz2 v16_61_1y2v1nfpz", t = "v16_61_1vcy5dz9 v16_61_1vcy5dz8 v16_61_1y2v1nfq0 v16_61_1y2v1nfte v16_61_1y2v1nftt v16_61_1y2v1nfu8", z = {
-    default: "v16_61_1vcy5dzc v16_61_1vcy5dzb v16_61_1vcy5dza v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfqr",
-    noBorder: "v16_61_1vcy5dzd v16_61_1vcy5dzb v16_61_1vcy5dza v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfqr",
-    menuOpen: "v16_61_1vcy5dze v16_61_1vcy5dzb v16_61_1vcy5dza v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfqr"
-}, o = "v16_61_1vcy5dzf", i = "v16_61_1vcy5dzg", p = "v16_61_1vcy5dzi v16_61_1vcy5dzh v16_61_1y2v1nfpy v16_61_1y2v1nfq4", u = "v16_61_1vcy5dzj v16_61_1y2v1nfpy", q = "v16_61_1vcy5dzl v16_61_1vcy5dzk v16_61_1y2v1nfpz v16_61_1y2v1nfte v16_61_1y2v1nfun v16_61_1y2v1nfq4 v16_61_1y2v1nfqj", s = "v16_61_1vcy5dzn v16_61_1vcy5dzm v16_61_1y2v1nffx v16_61_1y2v1nfh6 v16_61_1y2v1nfif v16_61_1y2v1nfjo v16_61_1y2v1nfsm v16_61_1y2v1nffw", M = "v16_61_1vcy5dzp v16_61_1vcy5dzo v16_61_1y2v1nfio v16_61_1y2v1nfjx v16_61_1y2v1nfrn v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfsm v16_61_1y2v1nffw v16_61_1y2v1nfpy", g = {
-    default: "v16_61_1vcy5dzq",
-    brand: "v16_61_1vcy5dzr"
+/* empty css                                     */ /* empty css                                          */ var n = 184, y = 300, d = 400, r = "v16_62_1vcy5dz1 v16_62_1vcy5dz0 v16_62_1y2v1nfpy v16_62_1y2v1nfr0 v16_62_1y2v1nfrg", e = "v16_62_1vcy5dz4 v16_62_1vcy5dz3 v16_62_1vcy5dz2 v16_62_1y2v1nfpz", c = "v16_62_1vcy5dz5 v16_62_1vcy5dz3 v16_62_1vcy5dz2 v16_62_1y2v1nfpz", f = "v16_62_1vcy5dz6 v16_62_1vcy5dz3 v16_62_1vcy5dz2 v16_62_1y2v1nfpz", a = "v16_62_1vcy5dz7 v16_62_1vcy5dz3 v16_62_1vcy5dz2 v16_62_1y2v1nfpz", t = "v16_62_1vcy5dz9 v16_62_1vcy5dz8 v16_62_1y2v1nfq0 v16_62_1y2v1nfte v16_62_1y2v1nftt v16_62_1y2v1nfu8", z = {
+    default: "v16_62_1vcy5dzc v16_62_1vcy5dzb v16_62_1vcy5dza v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfqr",
+    noBorder: "v16_62_1vcy5dzd v16_62_1vcy5dzb v16_62_1vcy5dza v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfqr",
+    menuOpen: "v16_62_1vcy5dze v16_62_1vcy5dzb v16_62_1vcy5dza v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfqr"
+}, o = "v16_62_1vcy5dzf", i = "v16_62_1vcy5dzg", p = "v16_62_1vcy5dzi v16_62_1vcy5dzh v16_62_1y2v1nfpy v16_62_1y2v1nfq4", u = "v16_62_1vcy5dzj v16_62_1y2v1nfpy", q = "v16_62_1vcy5dzl v16_62_1vcy5dzk v16_62_1y2v1nfpz v16_62_1y2v1nfte v16_62_1y2v1nfun v16_62_1y2v1nfq4 v16_62_1y2v1nfqj", s = "v16_62_1vcy5dzn v16_62_1vcy5dzm v16_62_1y2v1nffx v16_62_1y2v1nfh6 v16_62_1y2v1nfif v16_62_1y2v1nfjo v16_62_1y2v1nfsm v16_62_1y2v1nffw", M = "v16_62_1vcy5dzp v16_62_1vcy5dzo v16_62_1y2v1nfio v16_62_1y2v1nfjx v16_62_1y2v1nfrn v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfsm v16_62_1y2v1nffw v16_62_1y2v1nfpy", g = {
+    default: "v16_62_1vcy5dzq",
+    brand: "v16_62_1vcy5dzr"
 }, C = {
-    default: "v16_61_1vcy5dzs",
-    alternative: "v16_61_1vcy5dzt",
-    brand: "v16_61_1vcy5dzu",
-    negative: "v16_61_1vcy5dzv",
-    media: "v16_61_1vcy5dzw"
-}, k = "v16_61_1vcy5dzy v16_61_1vcy5dzx v16_61_1y2v1nfqj v16_61_1y2v1nfqr v16_61_1y2v1nfq4", l = "v16_61_1vcy5dzz v16_61_1y2v1nffx v16_61_1y2v1nfh6 v16_61_1y2v1nfif v16_61_1y2v1nfjo v16_61_1y2v1nfsm v16_61_1y2v1nffw", j = "v16_61_1vcy5dz10", m = "v16_61_1vcy5dz12 v16_61_1vcy5dz11 v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfqe", x = "v16_61_1vcy5dz14 v16_61_1vcy5dz12 v16_61_1vcy5dz11 v16_61_1y2v1nfq4 v16_61_1y2v1nfqj v16_61_1y2v1nfqe v16_61_1vcy5dz13 v16_61_1y2v1nfqq", S = "v16_61_1vcy5dz17 v16_61_1vcy5dz16 v16_61_1y2v1nfrn v16_61_1vcy5dz15", b = "v16_61_1vcy5dz18 v16_61_1vcy5dz15", A = {
-    enter: "v16_61_1vcy5dz19",
-    enterActive: "v16_61_1vcy5dz1a",
-    exit: "v16_61_1vcy5dz1b",
-    exitActive: "v16_61_1vcy5dz1c"
-}, B = "v16_61_1vcy5dz1f v16_61_1vcy5dz1e v16_61_1y2v1nfq4 v16_61_1y2v1nfqq", N = "v16_61_1vcy5dz1h v16_61_1vcy5dz1g v16_61_1y2v1nfq4 v16_61_1y2v1nfqd", h = "v16_61_1vcy5dz1i", I = "v16_61_1vcy5dz1j v16_61_1y2v1nfq0 v16_61_1y2v1nftt v16_61_1y2v1nfu8 v16_61_1y2v1nfun v16_61_1y2v1nf7y", O = "v16_61_1vcy5dz1k v16_61_1y2v1nfr8 v16_61_1y2v1nfpy", w = "v16_61_1vcy5dz1m v16_61_1vcy5dz1l v16_61_1y2v1nftd v16_61_1y2v1nfqr v16_61_1y2v1nfr8 v16_61_1y2v1nfpz v16_61_1y2v1nfte", T = "v16_61_1vcy5dz1r", E = "v16_61_1vcy5dz1t v16_61_1vcy5dz1s v16_61_1y2v1nfqr", R = "v16_61_1vcy5dz1u v16_61_1y2v1nfpz v16_61_1y2v1nftt v16_61_1y2v1nfu8", U = "v16_61_1vcy5dz1w v16_61_1vcy5dz1v v16_61_1y2v1nfq0 v16_61_1y2v1nftt v16_61_1y2v1nfu8", W = "v16_61_1vcy5dz1y v16_61_1vcy5dz1x v16_61_1y2v1nf83 v16_61_1y2v1nfpz v16_61_1y2v1nftt v16_61_1y2v1nfu8", D = "v16_61_1vcy5dz20 v16_61_1vcy5dz1z v16_61_1y2v1nfj0 v16_61_1y2v1nfk9 v16_61_1y2v1nfgo v16_61_1y2v1nfhx v16_61_1y2v1nf83 v16_61_1y2v1nfq0 v16_61_1y2v1nftd", F = "v16_61_1vcy5dz22 v16_61_1vcy5dz21 v16_61_1y2v1nfgo v16_61_1y2v1nfhx v16_61_1y2v1nfpy", H = "v16_61_1vcy5dz23", L = "v16_61_1vcy5dz24";
+    default: "v16_62_1vcy5dzs",
+    alternative: "v16_62_1vcy5dzt",
+    brand: "v16_62_1vcy5dzu",
+    negative: "v16_62_1vcy5dzv",
+    media: "v16_62_1vcy5dzw"
+}, k = "v16_62_1vcy5dzy v16_62_1vcy5dzx v16_62_1y2v1nfqj v16_62_1y2v1nfqr v16_62_1y2v1nfq4", l = "v16_62_1vcy5dzz v16_62_1y2v1nffx v16_62_1y2v1nfh6 v16_62_1y2v1nfif v16_62_1y2v1nfjo v16_62_1y2v1nfsm v16_62_1y2v1nffw", j = "v16_62_1vcy5dz10", m = "v16_62_1vcy5dz12 v16_62_1vcy5dz11 v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfqe", x = "v16_62_1vcy5dz14 v16_62_1vcy5dz12 v16_62_1vcy5dz11 v16_62_1y2v1nfq4 v16_62_1y2v1nfqj v16_62_1y2v1nfqe v16_62_1vcy5dz13 v16_62_1y2v1nfqq", S = "v16_62_1vcy5dz17 v16_62_1vcy5dz16 v16_62_1y2v1nfrn v16_62_1vcy5dz15", b = "v16_62_1vcy5dz18 v16_62_1vcy5dz15", A = {
+    enter: "v16_62_1vcy5dz19",
+    enterActive: "v16_62_1vcy5dz1a",
+    exit: "v16_62_1vcy5dz1b",
+    exitActive: "v16_62_1vcy5dz1c"
+}, B = "v16_62_1vcy5dz1f v16_62_1vcy5dz1e v16_62_1y2v1nfq4 v16_62_1y2v1nfqq", N = "v16_62_1vcy5dz1h v16_62_1vcy5dz1g v16_62_1y2v1nfq4 v16_62_1y2v1nfqd", h = "v16_62_1vcy5dz1i", I = "v16_62_1vcy5dz1j v16_62_1y2v1nfq0 v16_62_1y2v1nftt v16_62_1y2v1nfu8 v16_62_1y2v1nfun v16_62_1y2v1nf7y", O = "v16_62_1vcy5dz1k v16_62_1y2v1nfr8 v16_62_1y2v1nfpy", w = "v16_62_1vcy5dz1m v16_62_1vcy5dz1l v16_62_1y2v1nftd v16_62_1y2v1nfqr v16_62_1y2v1nfr8 v16_62_1y2v1nfpz v16_62_1y2v1nfte", T = "v16_62_1vcy5dz1r", E = "v16_62_1vcy5dz1t v16_62_1vcy5dz1s v16_62_1y2v1nfqr", R = "v16_62_1vcy5dz1u v16_62_1y2v1nfpz v16_62_1y2v1nftt v16_62_1y2v1nfu8", U = "v16_62_1vcy5dz1w v16_62_1vcy5dz1v v16_62_1y2v1nfq0 v16_62_1y2v1nftt v16_62_1y2v1nfu8", W = "v16_62_1vcy5dz1y v16_62_1vcy5dz1x v16_62_1y2v1nf83 v16_62_1y2v1nfpz v16_62_1y2v1nftt v16_62_1y2v1nfu8", D = "v16_62_1vcy5dz20 v16_62_1vcy5dz1z v16_62_1y2v1nfj0 v16_62_1y2v1nfk9 v16_62_1y2v1nfgo v16_62_1y2v1nfhx v16_62_1y2v1nf83 v16_62_1y2v1nfq0 v16_62_1y2v1nftd", F = "v16_62_1vcy5dz22 v16_62_1vcy5dz21 v16_62_1y2v1nfgo v16_62_1y2v1nfhx v16_62_1y2v1nfpy", H = "v16_62_1vcy5dz23", L = "v16_62_1vcy5dz24";