@telefonica/mistica 17.2.0 → 17.4.0

package/dist-es/sidenav-bar-keyboard.js

@@ -0,0 +1,253 @@
+'use client';
+import * as l from "react";
+const m = 'a[href], button:not([disabled]), [tabindex]:not([tabindex="-1"])', g = (t)=>typeof CSS < "u" && CSS.escape ? CSS.escape(t) : t.replace(/"/g, '\\"'), A = (t)=>t.map((e)=>e.querySelector(m)).filter((e)=>e !== null), f = (t)=>t ? A(Array.from(t.querySelectorAll("[data-sidenav-item-id]"))) : [], v = (t)=>{
+    if (!t) return [];
+    const e = Array.from(t.querySelectorAll("[data-sidenav-item-id]")).filter((r)=>!r.closest("[data-sidenav-double-panel]"));
+    return A(e);
+}, S = (t, e)=>{
+    var _e_querySelector;
+    var _e_querySelector_querySelector;
+    return (_e_querySelector_querySelector = (_e_querySelector = e.querySelector(`[data-sidenav-item-id="${g(t)}"]`)) === null || _e_querySelector === void 0 ? void 0 : _e_querySelector.querySelector(m)) !== null && _e_querySelector_querySelector !== void 0 ? _e_querySelector_querySelector : null;
+}, h = (t, e)=>{
+    const r = S(t, e);
+    if (!r) return null;
+    const o = v(e);
+    var _o_;
+    return (_o_ = o[o.indexOf(r) + 1]) !== null && _o_ !== void 0 ? _o_ : null;
+}, w = (t)=>{
+    var _t_closest;
+    if (t.getAttribute("aria-expanded") !== "true") return null;
+    const r = (_t_closest = t.closest("[data-sidenav-item-id]")) === null || _t_closest === void 0 ? void 0 : _t_closest.getAttribute("data-sidenav-item-id");
+    return r ? document.querySelector(`[data-sidenav-dialog-panel="${g(r)}"]`) : null;
+}, y = (t, e)=>{
+    var _t_closest;
+    const r = (_t_closest = t.closest("[data-sidenav-item-id]")) === null || _t_closest === void 0 ? void 0 : _t_closest.getAttribute("data-sidenav-item-id");
+    return r ? e.querySelector(`[data-sidenav-double-panel="${g(r)}"]`) : null;
+}, q = (t, e)=>{
+    var _t_closest;
+    const r = (_t_closest = t.closest("[data-sidenav-item-id]")) === null || _t_closest === void 0 ? void 0 : _t_closest.getAttribute("data-sidenav-item-id");
+    return r ? e.querySelector(`[data-sidenav-accordion-for="${g(r)}"]`) : null;
+}, x = (t, e)=>{
+    var _t_closest, _e_querySelector;
+    const o = (_t_closest = t.closest("[data-sidenav-accordion-for]")) === null || _t_closest === void 0 ? void 0 : _t_closest.getAttribute("data-sidenav-accordion-for");
+    var _e_querySelector_querySelector;
+    return o ? (_e_querySelector_querySelector = (_e_querySelector = e.querySelector(`[data-sidenav-item-id="${g(o)}"]`)) === null || _e_querySelector === void 0 ? void 0 : _e_querySelector.querySelector(m)) !== null && _e_querySelector_querySelector !== void 0 ? _e_querySelector_querySelector : null : null;
+}, k = (t)=>l.useCallback((e)=>{
+        const r = t.current;
+        if (!r) return;
+        const o = document.activeElement;
+        if (!o) return;
+        const d = o.closest("[data-sidenav-double-panel]");
+        if (d) {
+            var _d_getAttribute;
+            const c = (_d_getAttribute = d.getAttribute("data-sidenav-double-panel")) !== null && _d_getAttribute !== void 0 ? _d_getAttribute : "", a = S(c, r), n = f(d), u = n.indexOf(o);
+            switch(e.key){
+                case "ArrowDown":
+                    var _n_Math_min;
+                    e.preventDefault(), (_n_Math_min = n[Math.min(u + 1, n.length - 1)]) === null || _n_Math_min === void 0 ? void 0 : _n_Math_min.focus();
+                    return;
+                // The column is not a floating panel, so it stays open when the focus leaves it.
+                case "ArrowUp":
+                case "ArrowLeft":
+                    if (e.preventDefault(), e.key === "ArrowUp" && u > 0) {
+                        n[u - 1].focus();
+                        return;
+                    }
+                    a === null || a === void 0 ? void 0 : a.focus();
+                    return;
+                case "ArrowRight":
+                    e.preventDefault();
+                    return;
+                case "Home":
+                    var _n_;
+                    e.preventDefault(), (_n_ = n[0]) === null || _n_ === void 0 ? void 0 : _n_.focus();
+                    return;
+                case "End":
+                    var _n_1;
+                    e.preventDefault(), (_n_1 = n[n.length - 1]) === null || _n_1 === void 0 ? void 0 : _n_1.focus();
+                    return;
+                case "Tab":
+                    {
+                        var _this;
+                        if (e.preventDefault(), e.shiftKey) {
+                            var _this1;
+                            (_this1 = u > 0 ? n[u - 1] : a) === null || _this1 === void 0 ? void 0 : _this1.focus();
+                            return;
+                        }
+                        (_this = u < n.length - 1 ? n[u + 1] : h(c, r)) === null || _this === void 0 ? void 0 : _this.focus();
+                        return;
+                    }
+                default:
+                    return;
+            }
+        }
+        if (!o.closest("[data-sidenav-item-id]")) return;
+        const s = v(r), i = s.indexOf(o);
+        switch(e.key){
+            case "ArrowDown":
+                {
+                    e.preventDefault(), i >= 0 && i < s.length - 1 && s[i + 1].focus();
+                    return;
+                }
+            case "ArrowUp":
+                {
+                    e.preventDefault(), i > 0 && s[i - 1].focus();
+                    return;
+                }
+            case "Home":
+                {
+                    var _s_;
+                    e.preventDefault(), (_s_ = s[0]) === null || _s_ === void 0 ? void 0 : _s_.focus();
+                    return;
+                }
+            case "End":
+                {
+                    var _s_1;
+                    e.preventDefault(), (_s_1 = s[s.length - 1]) === null || _s_1 === void 0 ? void 0 : _s_1.focus();
+                    return;
+                }
+            case "ArrowRight":
+                {
+                    var _f_;
+                    if (o.getAttribute("aria-expanded") === "false") {
+                        e.preventDefault(), o.click();
+                        return;
+                    }
+                    const c = w(o);
+                    if (c) {
+                        var _f_1;
+                        e.preventDefault(), (_f_1 = f(c)[0]) === null || _f_1 === void 0 ? void 0 : _f_1.focus();
+                        return;
+                    }
+                    const a = y(o, r);
+                    if (a) {
+                        var _f_2;
+                        e.preventDefault(), (_f_2 = f(a)[0]) === null || _f_2 === void 0 ? void 0 : _f_2.focus();
+                        return;
+                    }
+                    const n = q(o, r);
+                    n && (e.preventDefault(), (_f_ = f(n)[0]) === null || _f_ === void 0 ? void 0 : _f_.focus());
+                    return;
+                }
+            case "ArrowLeft":
+                {
+                    if (o.getAttribute("aria-expanded") === "true") {
+                        e.preventDefault(), o.click();
+                        return;
+                    }
+                    const c = x(o, r);
+                    c && (e.preventDefault(), c.focus());
+                    return;
+                }
+            case "Tab":
+                {
+                    if (!e.shiftKey) {
+                        var _f_3;
+                        var _w;
+                        const u = (_w = w(o)) !== null && _w !== void 0 ? _w : y(o, r);
+                        u && (e.preventDefault(), (_f_3 = f(u)[0]) === null || _f_3 === void 0 ? void 0 : _f_3.focus());
+                        return;
+                    }
+                    const c = i > 0 ? s[i - 1] : null;
+                    if (!c) return;
+                    var _w1;
+                    const a = (_w1 = w(c)) !== null && _w1 !== void 0 ? _w1 : y(c, r), n = f(a).pop();
+                    n && (e.preventDefault(), n.focus());
+                    return;
+                }
+            default:
+                return;
+        }
+    }, [
+        t
+    ]), F = (param)=>{
+    let { panelElement: t, containerRef: e, itemId: r, isPositioned: o, onClose: d } = param;
+    const s = l.useRef(null), i = l.useRef(d);
+    i.current = d, l.useEffect(()=>{
+        var _e_current;
+        const a = (_e_current = e.current) === null || _e_current === void 0 ? void 0 : _e_current.querySelector(`[data-sidenav-item-id="${g(r)}"]`);
+        var _a_querySelector;
+        s.current = (_a_querySelector = a === null || a === void 0 ? void 0 : a.querySelector(m)) !== null && _a_querySelector !== void 0 ? _a_querySelector : null;
+    }, [
+        e,
+        r,
+        t
+    ]);
+    const c = l.useCallback(()=>{
+        const a = e.current;
+        if (!a) return;
+        const n = ()=>{
+            var _a_querySelector_querySelector, _a_querySelector;
+            const u = document.activeElement;
+            if (u && u !== document.body) return;
+            (_a_querySelector = a.querySelector(`[data-sidenav-item-id="${g(r)}"]`)) === null || _a_querySelector === void 0 ? void 0 : (_a_querySelector_querySelector = _a_querySelector.querySelector(m)) === null || _a_querySelector_querySelector === void 0 ? void 0 : _a_querySelector_querySelector.focus();
+        };
+        typeof requestAnimationFrame == "function" ? requestAnimationFrame(n) : n();
+    }, [
+        e,
+        r
+    ]);
+    l.useEffect(()=>{
+        var _f_;
+        !t || !o || ((_f_ = f(t)[0]) === null || _f_ === void 0 ? void 0 : _f_.focus());
+    }, [
+        t,
+        o
+    ]), l.useEffect(()=>()=>c(), [
+        c
+    ]), l.useEffect(()=>{
+        if (!t) return;
+        const a = (n)=>{
+            const u = f(t);
+            if (u.length === 0) return;
+            const b = document.activeElement, p = b ? u.indexOf(b) : -1;
+            switch(n.key){
+                case "ArrowDown":
+                    var _u_Math_min;
+                    n.preventDefault(), (_u_Math_min = u[Math.min(p + 1, u.length - 1)]) === null || _u_Math_min === void 0 ? void 0 : _u_Math_min.focus();
+                    return;
+                // Closing the panel unmounts it, and the restore effect returns the focus to the trigger.
+                case "ArrowLeft":
+                    n.preventDefault(), i.current();
+                    return;
+                case "ArrowUp":
+                    if (n.preventDefault(), p <= 0) {
+                        i.current();
+                        return;
+                    }
+                    u[p - 1].focus();
+                    return;
+                case "Home":
+                    n.preventDefault(), u[0].focus();
+                    return;
+                case "End":
+                    n.preventDefault(), u[u.length - 1].focus();
+                    return;
+                case "Tab":
+                    {
+                        var _h;
+                        if (n.preventDefault(), n.shiftKey) {
+                            var _this;
+                            (_this = p > 0 ? u[p - 1] : s.current) === null || _this === void 0 ? void 0 : _this.focus();
+                            return;
+                        }
+                        if (p < u.length - 1) {
+                            u[p + 1].focus();
+                            return;
+                        }
+                        const D = e.current;
+                        D && ((_h = h(r, D)) === null || _h === void 0 ? void 0 : _h.focus());
+                        return;
+                    }
+                default:
+                    return;
+            }
+        };
+        return t.addEventListener("keydown", a), ()=>t.removeEventListener("keydown", a);
+    }, [
+        t,
+        e,
+        r
+    ]);
+};
+export { f as getItemFocusables, F as useDialogPanelKeyboard, k as useSidenavRailKeyboard };

package/dist-es/sidenav-bar-layout.css-mistica.js

@@ -0,0 +1,2 @@
+/* empty css                                     */ /* empty css                                              */ var s = "var(--v17_4_16kses10)", e = "v17_4_16kses12 v17_4_16kses11 v17_4_1y2v1nfre", r = "v17_4_16kses14 v17_4_16kses13 v17_4_1y2v1nfre v17_4_1y2v1nfrk v17_4_1y2v1nfrr", n = "v17_4_16kses16 v17_4_16kses15 v17_4_1y2v1nfs0 v17_4_1y2v1nfsz", a = "v17_4_16kses17";
+export { a as centeredResponsiveLayout, e as container, n as content, r as sidenav, s as topOffsetVar };

package/dist-es/sidenav-bar-layout.js

@@ -0,0 +1,86 @@
+'use client';
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { container as d, sidenav as l, content as m, centeredResponsiveLayout as p, topOffsetVar as c } from "./sidenav-bar-layout.css-mistica.js";
+import { InternalResponsiveLayout as v } from "./responsive-layout.js";
+import { getPrefixedDataAttributes as u } from "./utils/dom.js";
+import { applyCssVars as f } from "./utils/css.js";
+const j = (param)=>{
+    let { sidenav: s, children: a, mode: i = "whole-viewport", topOffset: t, dataAttributes: o } = param;
+    const r = /* @__PURE__ */ n("div", _object_spread_props(_object_spread({
+        className: d,
+        style: t ? f({
+            [c]: `${t}px`
+        }) : void 0
+    }, u(_object_spread({
+        testid: "SidenavLayout"
+    }, o))), {
+        children: [
+            /* @__PURE__ */ e("div", {
+                className: l,
+                children: s
+            }),
+            /* @__PURE__ */ e("div", {
+                className: m,
+                children: a
+            })
+        ]
+    }));
+    return i === "centered" ? /* @__PURE__ */ e(v, {
+        innerDivClassName: p,
+        shouldExpandWhenNested: !0,
+        children: r
+    }) : r;
+};
+export { j as SidenavLayout, j as default };

package/dist-es/sidenav-bar-mobile.js

@@ -0,0 +1,277 @@
+'use client';
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+    try {
+        var info = gen[key](arg);
+        var value = info.value;
+    } catch (error) {
+        reject(error);
+        return;
+    }
+    if (info.done) {
+        resolve(value);
+    } else {
+        Promise.resolve(value).then(_next, _throw);
+    }
+}
+function _async_to_generator(fn) {
+    return function() {
+        var self = this, args = arguments;
+        return new Promise(function(resolve, reject) {
+            var gen = fn.apply(self, args);
+            function _next(value) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+            }
+            function _throw(err) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+            }
+            _next(undefined);
+        });
+    };
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+import { jsx as o, jsxs as a, Fragment as Z } from "react/jsx-runtime";
+import * as i from "react";
+import { Header as q, NavigationBarSideMargins as J, NavigationBarContentContainer as Q, BurgerMenuIcon as W, NavigationBar as X } from "./navigation-shared.js";
+import { MobileNavigationMenu as ee } from "./mobile-navigation-menu.js";
+import { burgerMenuButton as oe, logoContainer as ne, spacer as re } from "./navigation-shared.css-mistica.js";
+import P, { ResetResponsiveLayout as g } from "./responsive-layout.js";
+import { RowList as S, Row as l } from "./list.js";
+import { Title3 as te, Title1 as ae } from "./title.js";
+import ie from "./touchable.js";
+import se from "./focus-trap.js";
+import d from "./stack.js";
+import R from "./box.js";
+import { Logo as le } from "./logo.js";
+import { ThemeVariant as de } from "./theme-variant-context.js";
+import { useTheme as ce, useDisableBodyScroll as pe } from "./hooks.js";
+import { useSetModalState as ue } from "./modal-context-provider.js";
+import { NAVBAR_HEIGHT_MOBILE as fe } from "./theme.js";
+import { closeNavigationMenu as me, openNavigationMenu as he, backNavigationBar as ve } from "./text-tokens.js";
+import { renderSidenavSlot as A, renderSidenavLogo as ge, getFirstLevelItems as Se, isSidenavSection as be, getSidenavSectionTitle as Ne } from "./sidenav-bar-data.js";
+const Te = 40, Be = 24, Me = 16, w = 32, Oe = 8, Ie = 16, F = "sidenav-burger-menu-lock", Ye = (param)=>{
+    let { entries: b, "aria-label": x, variant: N, logo: C, headerSlot: D, footerSlot: k, selectedItemId: G, onSelectedItemIdChange: H, dataAttributes: V } = param;
+    const { texts: c, t: p } = ce(), T = i.useId(), u = ue(), [r, B] = i.useState(!1), [M, y] = i.useState(!0), [O, I] = i.useState(null), [j, f] = i.useState(!1);
+    pe(r);
+    const U = ()=>{
+        B(!0), u({
+            isModalOpen: !0
+        });
+    }, L = i.useCallback(()=>{
+        B(!1), u({
+            isModalOpen: !1
+        });
+    }, [
+        u
+    ]), m = {
+        collapsed: !1,
+        state: "expanded"
+    }, Y = A(D, m), E = A(k, m), _ = ge(C, m, /* @__PURE__ */ o(le, {
+        size: Te
+    })), h = (e)=>{
+        var _e_children;
+        const n = {
+            title: e.label,
+            right: e.rightSlot,
+            "aria-current": G === e.id ? "page" : void 0
+        };
+        if ((_e_children = e.children) === null || _e_children === void 0 ? void 0 : _e_children.length) return /* @__PURE__ */ o(l, _object_spread_props(_object_spread({}, n), {
+            onPress: ()=>{
+                I(e.id), f(!0);
+            }
+        }), e.id);
+        const t = (v)=>_async_to_generator(function*() {
+                H === null || H === void 0 ? void 0 : H(e.id);
+                try {
+                    yield v === null || v === void 0 ? void 0 : v();
+                } finally{
+                    L();
+                }
+            })();
+        return e.href !== void 0 ? /* @__PURE__ */ o(l, _object_spread_props(_object_spread({}, n), {
+            href: e.href,
+            newTab: e.newTab,
+            onNavigate: ()=>t(e.onNavigate)
+        }), e.id) : e.to !== void 0 ? /* @__PURE__ */ o(l, _object_spread_props(_object_spread({}, n), {
+            to: e.to,
+            newTab: e.newTab,
+            onNavigate: ()=>t(e.onNavigate)
+        }), e.id) : /* @__PURE__ */ o(l, _object_spread_props(_object_spread({}, n), {
+            onPress: ()=>t(e.onPress)
+        }), e.id);
+    }, $ = (e, n)=>{
+        if (!be(e)) return /* @__PURE__ */ o(g, {
+            children: /* @__PURE__ */ o(S, {
+                children: h(e)
+            })
+        }, e.id);
+        const { text: t, isHeadingVisible: v } = Ne(e.title);
+        return /* @__PURE__ */ a(d, {
+            space: Oe,
+            children: [
+                v && /* @__PURE__ */ o(ae, {
+                    children: t
+                }),
+                /* @__PURE__ */ o(g, {
+                    children: /* @__PURE__ */ o(S, {
+                        "aria-label": t,
+                        children: e.items.map((K)=>h(K))
+                    })
+                })
+            ]
+        }, `${t}-${n}`);
+    }, s = O ? Se(b !== null && b !== void 0 ? b : []).find((e)=>e.id === O) : void 0, z = /* @__PURE__ */ o(q, {
+        topFixed: !0,
+        withBorder: !0,
+        isBurgerMenuOpen: r,
+        variant: N,
+        dataAttributes: _object_spread({
+            testid: "SidenavBar"
+        }, V),
+        children: /* @__PURE__ */ o(J, {
+            wide: !1,
+            children: /* @__PURE__ */ a(Q, {
+                right: Y,
+                children: [
+                    /* @__PURE__ */ o(ie, {
+                        className: oe,
+                        "aria-live": "polite",
+                        "aria-label": r ? c.closeNavigationMenu || p(me) : c.openNavigationMenu || p(he),
+                        "aria-expanded": r,
+                        "aria-controls": T,
+                        onPress: r ? L : U,
+                        children: /* @__PURE__ */ o(W, {
+                            isOpen: r
+                        })
+                    }),
+                    _ && /* @__PURE__ */ o("div", {
+                        className: ne,
+                        children: _
+                    })
+                ]
+            })
+        })
+    });
+    var _s_children;
+    return /* @__PURE__ */ a(Z, {
+        children: [
+            /* @__PURE__ */ o(de, {
+                variant: N,
+                children: /* @__PURE__ */ o(se, {
+                    disabled: M,
+                    group: F,
+                    children: z
+                })
+            }),
+            /* @__PURE__ */ o("div", {
+                className: re
+            }),
+            /* @__PURE__ */ o(ee, {
+                open: r,
+                id: T,
+                "aria-label": x,
+                topOffset: fe,
+                showSecondLevel: j,
+                onExited: ()=>{
+                    f(!1), I(null);
+                },
+                focusTrapGroup: F,
+                disableFocusTrap: M,
+                setDisableFocusTrap: y,
+                firstLevel: /* @__PURE__ */ a(P, {
+                    children: [
+                        /* @__PURE__ */ o(R, {
+                            paddingTop: Be,
+                            children: /* @__PURE__ */ o(d, {
+                                space: w,
+                                children: (b !== null && b !== void 0 ? b : []).map((e, n)=>$(e, n))
+                            })
+                        }),
+                        E && /* @__PURE__ */ o(R, {
+                            paddingY: Me,
+                            children: E
+                        })
+                    ]
+                }),
+                secondLevel: s ? /* @__PURE__ */ o(P, {
+                    children: /* @__PURE__ */ a(d, {
+                        space: w,
+                        children: [
+                            /* @__PURE__ */ a(d, {
+                                space: Ie,
+                                children: [
+                                    /* @__PURE__ */ o(X, {
+                                        title: c.backNavigationBar || p(ve),
+                                        onBack: ()=>f(!1),
+                                        topFixed: !1,
+                                        withBorder: !1
+                                    }),
+                                    /* @__PURE__ */ o(te, {
+                                        children: s.label
+                                    })
+                                ]
+                            }),
+                            /* @__PURE__ */ o(g, {
+                                children: /* @__PURE__ */ o(S, {
+                                    "aria-label": s.label,
+                                    children: ((_s_children = s.children) !== null && _s_children !== void 0 ? _s_children : []).map((e)=>h(e))
+                                })
+                            })
+                        ]
+                    })
+                }) : null
+            })
+        ]
+    });
+};
+export { Ye as SidenavBarMobile };

package/dist-es/sidenav-bar-motion.js

@@ -0,0 +1,26 @@
+'use client';
+import * as s from "react";
+import { useTheme as u, useIsomorphicLayoutEffect as i } from "./hooks.js";
+import { isRunningAcceptanceTest as f } from "./utils/platform.js";
+const d = "(prefers-reduced-motion)", h = ()=>{
+    const { platformOverrides: n } = u(), [r, e] = s.useState(!1);
+    return s.useEffect(()=>{
+        var _window_matchMedia, _window;
+        const t = (_window_matchMedia = (_window = window).matchMedia) === null || _window_matchMedia === void 0 ? void 0 : _window_matchMedia.call(_window, d);
+        if (!t) return;
+        e(t.matches);
+        const o = (c)=>e(c.matches);
+        return t.addEventListener("change", o), ()=>t.removeEventListener("change", o);
+    }, []), f(n) || r;
+}, R = (n)=>{
+    const r = s.useRef(null), e = s.useRef(0);
+    i(()=>{
+        !n && r.current && (e.current = r.current.offsetWidth);
+    });
+    const t = n && e.current > 0 ? e.current : void 0;
+    return {
+        ref: r,
+        frozenWidth: t
+    };
+};
+export { h as useIsMotionOff, R as useRestWidth };