quirk-ui 0.1.78 → 0.1.80

package/dist/core/components/NavBar/index.mjs

@@ -1,14 +1,14 @@
-import { jsx as n, jsxs as i } from "react/jsx-runtime";
-import { useState as u, useRef as V, useCallback as L, useEffect as H } from "react";
-import { Modal as ie } from "../Modal/index.mjs";
-import { B as q, M as _e } from "../../../index-paelIj6o.js";
+import { jsx as a, jsxs as t } from "react/jsx-runtime";
+import { useState as v, useRef as F, useCallback as _, useEffect as U } from "react";
+import { Modal as re } from "../Modal/index.mjs";
+import { B as J, M as _e } from "../../../index-paelIj6o.js";
 import { ButtonGroup as se } from "../ButtonGroup/index.mjs";
-import { s as e, N as Se } from "../../../NavLink-BbTShlLw.js";
-import { lockScroll as ze, unlockScroll as re } from "../../utils/NoScroll/noScroll.mjs";
-import { C as Re } from "../../../chevron-right-Cim1KPuL.js";
-import { E as X } from "../../../external-link-BOPobeQJ.js";
-import { X as Ae } from "../../../x-CnsEH4Ox.js";
-import { c as te } from "../../../createLucideIcon-C8GTh_Qx.js";
+import { s as e, N as ze } from "../../../NavLink-BbTShlLw.js";
+import { lockScroll as xe, unlockScroll as ce } from "../../utils/NoScroll/noScroll.mjs";
+import { C as Ae } from "../../../chevron-right-Cim1KPuL.js";
+import { E as K } from "../../../external-link-BOPobeQJ.js";
+import { X as Re } from "../../../x-CnsEH4Ox.js";
+import { c as oe } from "../../../createLucideIcon-C8GTh_Qx.js";
 import { C as Be } from "../../../chevron-down-DSUzBz9F.js";
 /**
  * @license lucide-react v0.488.0 - ISC
@@ -27,215 +27,239 @@ const Oe = [
   ],
   ["path", { d: "M11 21.95V18a2 2 0 0 0-2-2a2 2 0 0 1-2-2v-1a2 2 0 0 0-2-2H2.05", key: "14pb5j" }],
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
-], We = te("earth", Oe);
+], We = oe("earth", Oe);
 /**
  * @license lucide-react v0.488.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const xe = [
+const De = [
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
   ["path", { d: "m21 21-4.3-4.3", key: "1qie3q" }]
-], Fe = te("search", xe), Ue = {
+], Fe = oe("search", De), Ue = {
   standard: e.standard,
   transparent: e.transparent
 }, je = {
   left: e.left,
   center: e.center,
   right: e.right
-}, De = ({
+}, Ge = ({
   spotlight: r,
-  renderText: p
+  renderText: k
 }) => {
-  var h, _, k, $, y, S;
-  const t = r.callToAction;
-  if (!t) return null;
-  const N = ((h = t.linkOptions) == null ? void 0 : h.linkType) === "external";
+  var h, z, g, w, C, x;
+  const c = r.callToAction;
+  if (!c) return null;
+  const $ = ((h = c.linkOptions) == null ? void 0 : h.linkType) === "external";
   let m = "#";
-  return N && ((_ = t.linkOptions) != null && _.externalUrl) ? m = t.linkOptions.externalUrl : ((k = t.linkOptions) == null ? void 0 : k.linkType) === "internal" && ((y = ($ = t.linkOptions) == null ? void 0 : $.internalUrl) != null && y.slug.current) && (m = `/${t.linkOptions.internalUrl.slug.current}`), /* @__PURE__ */ i("div", { className: e.spotlight, children: [
-    r.image && /* @__PURE__ */ n("div", { className: e.imageWrapper, children: /* @__PURE__ */ n(
+  return $ && ((z = c.linkOptions) != null && z.externalUrl) ? m = c.linkOptions.externalUrl : ((g = c.linkOptions) == null ? void 0 : g.linkType) === "internal" && ((C = (w = c.linkOptions) == null ? void 0 : w.internalUrl) != null && C.slug.current) && (m = `/${c.linkOptions.internalUrl.slug.current}`), /* @__PURE__ */ t("div", { className: e.spotlight, children: [
+    r.image && /* @__PURE__ */ a("div", { className: e.imageWrapper, children: /* @__PURE__ */ a(
       "img",
       {
-        src: ((S = r.image.imageUrls) == null ? void 0 : S.medium) ?? "",
+        src: ((x = r.image.imageUrls) == null ? void 0 : x.medium) ?? "",
         alt: r.image.asset.altText || r.image.asset.description || "Content image",
         width: 600,
         height: 400
       }
     ) }),
-    /* @__PURE__ */ i("div", { className: e.content, children: [
-      r.title && /* @__PURE__ */ n("div", { className: e.title, children: p == null ? void 0 : p(r.title, e.title) }),
-      r.description && /* @__PURE__ */ n("div", { className: e.description, children: p == null ? void 0 : p(r.description, e.description) })
+    /* @__PURE__ */ t("div", { className: e.content, children: [
+      r.title && /* @__PURE__ */ a("div", { className: e.title, children: k == null ? void 0 : k(r.title, e.title) }),
+      r.description && /* @__PURE__ */ a("div", { className: e.description, children: k == null ? void 0 : k(r.description, e.description) })
     ] }),
-    t.linkOptions && /* @__PURE__ */ n("div", { className: e.actions, children: /* @__PURE__ */ n(
-      q,
+    c.linkOptions && /* @__PURE__ */ a("div", { className: e.actions, children: /* @__PURE__ */ a(
+      J,
       {
         as: "a",
-        variant: t.variant ?? "primary",
+        variant: c.variant ?? "primary",
         href: m,
-        target: N ? "_blank" : "_self",
-        rel: N ? "noopener noreferrer" : void 0,
-        "aria-label": t.ariaLabel || t.label,
-        children: t.label
+        target: $ ? "_blank" : "_self",
+        rel: $ ? "noopener noreferrer" : void 0,
+        "aria-label": c.ariaLabel || c.label,
+        children: c.label
       }
     ) })
   ] });
 };
-function en({
+function nn({
   renderText: r,
-  title: p,
-  logo: t,
-  items: N,
+  title: k,
+  logo: c,
+  items: $,
   groups: m,
   utilityItems: h,
-  isSticky: _ = !1,
-  showSearch: k = !0,
-  showLocaleSelect: $ = !0,
-  showThemeToggle: y = !0,
-  themeToggleComponent: S,
-  alignment: x = "right",
-  variant: ce = "standard",
-  navigationType: z = "default",
-  searchComponent: oe,
-  localeSelectComponent: de,
-  className: me,
-  style: he,
-  ...ue
+  isSticky: z = !1,
+  showSearch: g = !0,
+  showLocaleSelect: w = !0,
+  showThemeToggle: C = !0,
+  themeToggleComponent: x,
+  alignment: j = "right",
+  variant: de = "standard",
+  navigationType: A = "default",
+  searchComponent: ue,
+  localeSelectComponent: me,
+  className: he,
+  style: fe,
+  ...be
 }) {
-  const [b, J] = u(!1), [K, g] = u(null), [pe, be] = u(0), [fe, ve] = u(!1), [ke, ge] = u(null), [c, I] = u([]), [R, F] = u(
+  const [f, Q] = v(!1), [Y, N] = v(null), [pe, ve] = v(0), [ke, ge] = v(!1), [Ne, ye] = v(null), [d, I] = v([]), [R, G] = v(
     0
-  ), [Ne, Q] = u(null), [M, $e] = u(!1), [A, B] = u("forward"), U = V(null), E = V(null), j = V(/* @__PURE__ */ new Map()), Y = () => /* @__PURE__ */ n("div", { className: `${e.linkWrapper} ${e.parent}`, children: /* @__PURE__ */ n("div", { className: `${e.linkItem} ${e.themeToggle}`, children: S }) }), D = () => /* @__PURE__ */ n(
+  ), [$e, Z] = v(null), [M, we] = v(!1), [B, O] = v("forward"), P = F(null), y = F(null), T = F(null), q = F(/* @__PURE__ */ new Map()), ee = () => /* @__PURE__ */ a("div", { className: `${e.linkWrapper} ${e.parent}`, children: /* @__PURE__ */ a("div", { className: `${e.linkItem} ${e.themeToggle}`, children: x }) }), V = () => /* @__PURE__ */ a(
     "div",
     {
       className: `${e.linkWrapper} ${e.parent} ${e.searchWrapper}`,
-      children: /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ n(
-        ie,
+      children: /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ a(
+        re,
         {
           size: "lg",
           className: e.searchModal,
-          trigger: /* @__PURE__ */ n(
+          trigger: /* @__PURE__ */ a(
             "button",
             {
               title: "Search",
               "aria-label": "Search",
               className: e.search,
-              children: /* @__PURE__ */ n(Fe, { size: 16, "aria-hidden": "true" })
+              children: /* @__PURE__ */ a(Fe, { size: 16, "aria-hidden": "true" })
             }
           ),
-          content: oe
+          content: ue
         }
       ) })
     }
-  ), Z = () => /* @__PURE__ */ n("div", { className: `${e.linkWrapper} ${e.parent}`, children: /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ n(
-    ie,
+  ), ne = () => /* @__PURE__ */ a("div", { className: `${e.linkWrapper} ${e.parent}`, children: /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ a(
+    re,
     {
       className: e.localeModal,
-      trigger: /* @__PURE__ */ n(
+      trigger: /* @__PURE__ */ a(
         "button",
         {
           title: "Locale Select",
           "aria-label": "Locale Select",
           className: e.locale,
-          children: /* @__PURE__ */ n(We, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ a(We, { size: 16, "aria-hidden": "true" })
         }
       ),
-      content: de
+      content: me
     }
-  ) }) }), O = L(() => {
-    E.current && be(E.current.getBoundingClientRect().width);
-  }, []), ye = () => {
-    J((a) => {
-      const l = !a;
-      return l || (I([]), B("forward"), g(null)), l;
+  ) }) }), W = _(() => {
+    y.current && ve(y.current.getBoundingClientRect().width);
+  }, []), ae = () => {
+    Q((n) => {
+      const l = !n;
+      return l || (I([]), O("forward"), N(null)), l;
     });
-  }, T = L((a) => {
-    const l = j.current.get(a);
-    if (l && E.current) {
-      const d = l.getBoundingClientRect(), f = E.current.getBoundingClientRect();
-      ge(d.left - f.left + d.width / 2);
+  }, le = _((n) => {
+    const l = q.current.get(n);
+    if (l && y.current) {
+      const s = l.getBoundingClientRect(), o = y.current.getBoundingClientRect();
+      ye(s.left - o.left + s.width / 2);
     }
-  }, []), we = L((a) => {
-    g((l) => l === a ? null : a);
-  }, []), G = L((a) => {
-    U.current && !U.current.contains(a.target) && g(null);
-  }, []), P = L(() => {
-    O(), typeof window < "u" && window.innerWidth > 768 && (J(!1), g(null));
-  }, [O]), Ce = () => I([]), Ie = (a) => {
-    B("forward"), I([
+  }, []), Ce = _((n) => {
+    N((l) => l === n ? null : n);
+  }, []), H = _((n) => {
+    P.current && !P.current.contains(n.target) && N(null);
+  }, []), X = _(() => {
+    W(), typeof window < "u" && window.innerWidth > 768 && (Q(!1), N(null));
+  }, [W]), Ee = () => I([]), Ie = (n) => {
+    O("forward"), I([
       {
-        title: a.title,
-        primary: a.primaryItems ?? [],
-        secondary: a.secondaryItems ?? [],
+        title: n.title,
+        primary: n.primaryItems ?? [],
+        secondary: n.secondaryItems ?? [],
         description: ""
       }
     ]);
-  }, ee = (a) => {
-    B("forward"), I((l) => [
+  }, ie = (n) => {
+    O("forward"), I((l) => [
       ...l,
       {
-        title: a.label,
-        primary: a.sublinks ?? [],
+        title: n.label,
+        primary: n.sublinks ?? [],
         secondary: [],
-        description: a.description
+        description: n.description
       }
     ]);
   }, Me = () => {
-    B("backward"), I((a) => a.slice(0, -1));
+    O("backward"), I((n) => n.slice(0, -1));
   };
-  H(() => {
+  U(() => {
     if (typeof window > "u") return;
-    const a = () => $e(window.innerWidth < 768);
-    return a(), window.addEventListener("resize", a), () => window.removeEventListener("resize", a);
-  }, []), H(() => {
-    const a = typeof window < "u", l = typeof document < "u";
-    return a && window.addEventListener("resize", P), l && document.addEventListener("click", G), O(), ve(!0), () => {
-      a && window.removeEventListener("resize", P), l && document.removeEventListener("click", G);
+    const n = () => we(window.innerWidth < 768);
+    return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
+  }, []), U(() => {
+    const n = typeof window < "u", l = typeof document < "u";
+    return n && window.addEventListener("resize", X), l && document.addEventListener("click", H), W(), ge(!0), () => {
+      n && window.removeEventListener("resize", X), l && document.removeEventListener("click", H);
     };
-  }, [P, G, O]), H(() => {
+  }, [X, H, W]), U(() => {
     if (!(typeof document > "u"))
-      return b ? setTimeout(() => ze(), 0) : re(), () => re();
-  }, [b]);
-  const W = (a, l = "") => a.map((d, f) => {
-    const w = `${l}/${d._key ?? d.label}-${f}`;
-    return /* @__PURE__ */ n(
-      Se,
+      return f ? setTimeout(() => xe(), 0) : ce(), () => ce();
+  }, [f]), U(() => {
+    var s;
+    if (!f) return;
+    const n = (s = y.current) == null ? void 0 : s.querySelector(
+      'a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])'
+    );
+    n == null || n.focus();
+    const l = (o) => {
+      var S;
+      if (o.key === "Escape") {
+        ae(), (S = T.current) == null || S.focus();
+        return;
+      }
+      if (o.key !== "Tab" || !y.current) return;
+      const p = Array.from(
+        y.current.querySelectorAll(
+          'a[href], button:not([disabled]), input, select, textarea, [tabindex]:not([tabindex="-1"])'
+        )
+      ).filter((i) => !i.closest("[aria-hidden=true]"));
+      if (p.length === 0) return;
+      const b = p[0], L = p[p.length - 1];
+      o.shiftKey ? document.activeElement === b && (o.preventDefault(), L.focus()) : document.activeElement === L && (o.preventDefault(), b.focus());
+    };
+    return document.addEventListener("keydown", l), () => document.removeEventListener("keydown", l);
+  }, [f]);
+  const D = (n, l = "") => n.map((s, o) => {
+    const p = `${l}/${s._key ?? s.label}-${o}`;
+    return /* @__PURE__ */ a(
+      ze,
       {
-        link: d,
-        path: w,
+        link: s,
+        path: p,
         parentPath: l,
-        openPath: K,
-        togglePath: we,
-        updateTriangleIndicator: T,
-        setOpenPath: g,
-        renderLinks: W,
-        buttonRefs: j
+        openPath: Y,
+        togglePath: Ce,
+        updateTriangleIndicator: le,
+        setOpenPath: N,
+        renderLinks: D,
+        buttonRefs: q
       },
-      w
+      p
     );
-  }), Ee = (a) => a.map((l, d) => {
-    var ne, ae;
-    const f = `group-${d}`, w = Ne === d, v = (ne = l.primaryItems) == null ? void 0 : ne[R ?? 0];
-    return /* @__PURE__ */ i(
+  }), Le = (n) => n.map((l, s) => {
+    var L, S;
+    const o = `group-${s}`, p = $e === s, b = (L = l.primaryItems) == null ? void 0 : L[R ?? 0];
+    return /* @__PURE__ */ t(
       "div",
       {
         className: `${e.linkWrapper} ${e.parent}`,
         onMouseEnter: () => {
-          Q(d), g(f), T(f);
+          Z(s), N(o), le(o);
         },
         children: [
-          /* @__PURE__ */ n("div", { className: e.linkItem, children: /* @__PURE__ */ i(
+          /* @__PURE__ */ a("div", { className: e.linkItem, children: /* @__PURE__ */ t(
             "button",
             {
-              ref: (s) => {
-                j.current.set(f, s);
+              ref: (i) => {
+                q.current.set(o, i);
               },
               "aria-haspopup": !0,
-              "aria-expanded": w,
-              "aria-controls": `submenu-${d}`,
-              className: `${e.sublinkToggle} ${w ? e.open : ""}`,
+              "aria-expanded": p,
+              "aria-controls": `submenu-${s}`,
+              className: `${e.sublinkToggle} ${p ? e.open : ""}`,
               children: [
                 l.title,
-                /* @__PURE__ */ n(
+                /* @__PURE__ */ a(
                   Be,
                   {
                     size: 18,
@@ -246,47 +270,47 @@ function en({
               ]
             }
           ) }),
-          /* @__PURE__ */ n(
+          /* @__PURE__ */ a(
             "div",
             {
-              id: `submenu-${d}`,
-              className: `${e.sublinks} ${w ? e.show : ""}`,
+              id: `submenu-${s}`,
+              className: `${e.sublinks} ${p ? e.show : ""}`,
               role: "menu",
               "aria-label": `${l.title} submenu`,
               onMouseLeave: () => {
-                Q(null), F(0), g(null);
+                Z(null), G(0), N(null);
               },
-              children: /* @__PURE__ */ n("div", { children: /* @__PURE__ */ i(
+              children: /* @__PURE__ */ a("div", { children: /* @__PURE__ */ t(
                 "div",
                 {
                   className: `${e.sublinksInner} ${l.spotlight ? e.withSpotlight : e.withoutSpotlight}`,
                   children: [
-                    /* @__PURE__ */ i(
+                    /* @__PURE__ */ t(
                       "div",
                       {
                         className: `${e.sublinksColumn} ${e.primaryColumn}`,
                         children: [
-                          /* @__PURE__ */ n("div", { className: e.linkItem }),
-                          (ae = l.primaryItems) == null ? void 0 : ae.map(
-                            (s, C) => s.href ? /* @__PURE__ */ n("div", { role: "menuitem", children: /* @__PURE__ */ i(
+                          /* @__PURE__ */ a("div", { className: e.linkItem }),
+                          (S = l.primaryItems) == null ? void 0 : S.map(
+                            (i, E) => i.href ? /* @__PURE__ */ a("div", { role: "menuitem", children: /* @__PURE__ */ t(
                               "a",
                               {
-                                href: s.href,
-                                className: `${e.link} ${R === C ? e.open : ""}`,
-                                target: s.isExternal ? "_blank" : "_self",
-                                rel: s.isExternal ? "noopener noreferrer" : void 0,
+                                href: i.href,
+                                className: `${e.link} ${R === E ? e.open : ""}`,
+                                target: i.isExternal ? "_blank" : "_self",
+                                rel: i.isExternal ? "noopener noreferrer" : void 0,
                                 onClick: () => {
-                                  var le;
-                                  g(null), (le = s.onClick) == null || le.call(s);
+                                  var te;
+                                  N(null), (te = i.onClick) == null || te.call(i);
                                 },
-                                onMouseEnter: () => F(C),
+                                onMouseEnter: () => G(E),
                                 children: [
-                                  /* @__PURE__ */ i("span", { className: e.linkContent, children: [
-                                    s.label,
-                                    s.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: s.subtitle })
+                                  /* @__PURE__ */ t("span", { className: e.linkContent, children: [
+                                    i.label,
+                                    i.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: i.subtitle })
                                   ] }),
-                                  s.isExternal && /* @__PURE__ */ n(
-                                    X,
+                                  i.isExternal && /* @__PURE__ */ a(
+                                    K,
                                     {
                                       className: e.newTabIcon,
                                       size: 16,
@@ -295,48 +319,48 @@ function en({
                                   )
                                 ]
                               }
-                            ) }, s._key ?? C) : /* @__PURE__ */ n("div", { role: "menuitem", children: /* @__PURE__ */ n(
+                            ) }, i._key ?? E) : /* @__PURE__ */ a("div", { role: "menuitem", children: /* @__PURE__ */ a(
                               "button",
                               {
-                                className: `${e.sublinkToggle} ${R === C ? e.open : ""}`,
-                                onMouseEnter: () => F(C),
-                                children: /* @__PURE__ */ i("span", { className: e.linkContent, children: [
-                                  s.label,
-                                  s.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: s.subtitle })
+                                className: `${e.sublinkToggle} ${R === E ? e.open : ""}`,
+                                onMouseEnter: () => G(E),
+                                children: /* @__PURE__ */ t("span", { className: e.linkContent, children: [
+                                  i.label,
+                                  i.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: i.subtitle })
                                 ] })
                               }
-                            ) }, s._key ?? C)
+                            ) }, i._key ?? E)
                           )
                         ]
                       }
                     ),
-                    (v == null ? void 0 : v.sublinks) && v.sublinks.length > 0 && /* @__PURE__ */ i(
+                    (b == null ? void 0 : b.sublinks) && b.sublinks.length > 0 && /* @__PURE__ */ t(
                       "div",
                       {
                         className: `${e.sublinksColumn} ${e.fadeInFromLeft}`,
                         children: [
-                          v.description && /* @__PURE__ */ n("div", { className: e.sublinksDescription, children: r == null ? void 0 : r(v.description) }),
-                          W(
-                            v.sublinks,
-                            `${f}-${R}`
+                          b.description && /* @__PURE__ */ a("div", { className: e.sublinksDescription, children: r == null ? void 0 : r(b.description) }),
+                          D(
+                            b.sublinks,
+                            `${o}-${R}`
                           )
                         ]
                       },
-                      `${v.label}-${v.sublinks.length}`
+                      `${b.label}-${b.sublinks.length}`
                     ),
-                    l.secondaryItems && l.secondaryItems.length > 0 && /* @__PURE__ */ n(
+                    l.secondaryItems && l.secondaryItems.length > 0 && /* @__PURE__ */ a(
                       "div",
                       {
                         className: `${e.sublinksColumn} ${e.secondaryColumn}`,
-                        children: W(l.secondaryItems, `${f}-secondary`)
+                        children: D(l.secondaryItems, `${o}-secondary`)
                       }
                     ),
-                    l.spotlight && /* @__PURE__ */ n(
+                    l.spotlight && /* @__PURE__ */ a(
                       "div",
                       {
                         className: `${e.sublinksColumn} ${e.spotlightColumn}`,
-                        children: /* @__PURE__ */ n(
-                          De,
+                        children: /* @__PURE__ */ a(
+                          Ge,
                           {
                             spotlight: l.spotlight,
                             renderText: r
@@ -351,52 +375,53 @@ function en({
           )
         ]
       },
-      l._key ?? `group-${d}`
+      l._key ?? `group-${s}`
     );
-  }), Le = [
+  }), Se = [
     e.navbar,
-    je[x],
-    Ue[ce],
-    _ ? e.sticky : "",
+    je[j],
+    Ue[de],
+    z ? e.sticky : "",
     m != null && m.length ? e.advanced : e.default,
-    me ?? ""
-  ].filter(Boolean).join(" "), o = h && h.length > 0 ? h[Math.min(1, h.length - 1)] : null;
-  return /* @__PURE__ */ n(
+    he ?? ""
+  ].filter(Boolean).join(" "), u = h && h.length > 0 ? h[Math.min(1, h.length - 1)] : null;
+  return /* @__PURE__ */ a(
     "header",
     {
-      ref: U,
-      className: Le,
-      style: he,
+      ref: P,
+      className: Se,
+      style: fe,
       "aria-label": "Site header",
-      ...ue,
-      children: /* @__PURE__ */ i(
+      ...be,
+      children: /* @__PURE__ */ t(
         "div",
         {
-          className: `${e.container} ${(!h || h.length === 0) && x !== "center" ? e.twoColumn : ""}`,
+          className: `${e.container} ${(!h || h.length === 0) && j !== "center" ? e.twoColumn : ""}`,
           children: [
-            t ? /* @__PURE__ */ n("div", { className: e.logo, children: t }) : p ? /* @__PURE__ */ n("div", { className: e.title, children: p }) : null,
-            /* @__PURE__ */ n(
+            c ? /* @__PURE__ */ a("div", { className: e.logo, children: c }) : k ? /* @__PURE__ */ a("div", { className: e.title, children: k }) : null,
+            /* @__PURE__ */ a(
               "nav",
               {
-                ref: E,
+                ref: y,
                 style: {
-                  left: x === "center" ? `calc(50% - ${pe / 2}px)` : "0"
+                  left: j === "center" ? `calc(50% - ${pe / 2}px)` : "0"
                 },
-                className: `${e.nav} ${b ? e.open : ""} ${fe ? e.visible : e.hidden}`,
+                "aria-modal": f ? "true" : void 0,
+                className: `${e.nav} ${f ? e.open : ""} ${ke ? e.visible : e.hidden}`,
                 id: "main-menu",
                 "aria-label": "Primary navigation",
-                children: /* @__PURE__ */ i("div", { className: e.navInner, children: [
-                  /* @__PURE__ */ n(
+                children: /* @__PURE__ */ t("div", { className: e.navInner, children: [
+                  /* @__PURE__ */ a(
                     "svg",
                     {
-                      style: { left: `${ke}px` },
-                      className: `${e.triangle} ${K ? e.show : ""}`,
+                      style: { left: `${Ne}px` },
+                      className: `${e.triangle} ${Y ? e.show : ""}`,
                       width: 16,
                       height: 12,
                       viewBox: "0 0 100 75",
                       xmlns: "http://www.w3.org/2000/svg",
                       "aria-hidden": "true",
-                      children: /* @__PURE__ */ n(
+                      children: /* @__PURE__ */ a(
                         "polygon",
                         {
                           points: "50,5 95,70 5,70",
@@ -407,87 +432,87 @@ function en({
                       )
                     }
                   ),
-                  z === "default" && N && /* @__PURE__ */ i("div", { className: e.grid, role: "menubar", children: [
-                    N.length > 0 && W(N),
-                    (k || $ || y) && /* @__PURE__ */ n("span", { className: e.separator, "aria-hidden": "true" }),
-                    y && /* @__PURE__ */ n(Y, {}),
-                    k && !M && /* @__PURE__ */ n(D, {}),
-                    $ && /* @__PURE__ */ n(Z, {})
+                  A === "default" && $ && /* @__PURE__ */ t("div", { className: e.grid, role: "menubar", children: [
+                    $.length > 0 && D($),
+                    (g || w || C) && /* @__PURE__ */ a("span", { className: e.separator, "aria-hidden": "true" }),
+                    C && /* @__PURE__ */ a(ee, {}),
+                    g && !M && /* @__PURE__ */ a(V, {}),
+                    w && /* @__PURE__ */ a(ne, {})
                   ] }),
-                  !M && z === "advanced" && m && /* @__PURE__ */ i("div", { className: e.grid, children: [
-                    m.length > 0 && Ee(m),
-                    (k || $ || y) && /* @__PURE__ */ n("span", { className: e.separator, "aria-hidden": "true" }),
-                    y && /* @__PURE__ */ n(Y, {}),
-                    k && /* @__PURE__ */ n(D, {}),
-                    $ && /* @__PURE__ */ n(Z, {})
+                  !M && A === "advanced" && m && /* @__PURE__ */ t("div", { className: e.grid, children: [
+                    m.length > 0 && Le(m),
+                    (g || w || C) && /* @__PURE__ */ a("span", { className: e.separator, "aria-hidden": "true" }),
+                    C && /* @__PURE__ */ a(ee, {}),
+                    g && /* @__PURE__ */ a(V, {}),
+                    w && /* @__PURE__ */ a(ne, {})
                   ] }),
-                  M && z === "advanced" && b && c.length === 0 && m && /* @__PURE__ */ n("div", { className: e.mobileMenu, children: m.map((a, l) => /* @__PURE__ */ n(
+                  M && A === "advanced" && f && d.length === 0 && m && /* @__PURE__ */ a("div", { className: e.mobileMenu, children: m.map((n, l) => /* @__PURE__ */ a(
                     "div",
                     {
-                      className: `${e.mobileMenuItem} ${A === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
-                      children: /* @__PURE__ */ n(
+                      className: `${e.mobileMenuItem} ${B === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
+                      children: /* @__PURE__ */ a(
                         "button",
                         {
                           className: e.sublinkToggle,
-                          onClick: () => Ie(a),
-                          children: a.title
+                          onClick: () => Ie(n),
+                          children: n.title
                         }
                       )
                     },
-                    a._key ?? l
+                    n._key ?? l
                   )) }),
-                  M && z === "advanced" && b && c.length > 0 && /* @__PURE__ */ i(
+                  M && A === "advanced" && f && d.length > 0 && /* @__PURE__ */ t(
                     "div",
                     {
                       className: e.mobileMenuSlide,
                       children: [
-                        /* @__PURE__ */ n(
+                        /* @__PURE__ */ a(
                           "button",
                           {
                             className: e.back,
                             "aria-label": "Go back",
-                            onClick: c.length === 1 ? Ce : Me,
-                            children: /* @__PURE__ */ n(Re, { size: 18, "aria-hidden": "true" })
+                            onClick: d.length === 1 ? Ee : Me,
+                            children: /* @__PURE__ */ a(Ae, { size: 18, "aria-hidden": "true" })
                           }
                         ),
-                        c[c.length - 1].description && /* @__PURE__ */ n(
+                        d[d.length - 1].description && /* @__PURE__ */ a(
                           "div",
                           {
-                            className: `${e.sublinksDescription} ${A === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
+                            className: `${e.sublinksDescription} ${B === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
                             children: r == null ? void 0 : r(
-                              c[c.length - 1].description
+                              d[d.length - 1].description
                             )
                           }
                         ),
-                        c[c.length - 1].primary.map((a, l) => /* @__PURE__ */ n(
+                        d[d.length - 1].primary.map((n, l) => /* @__PURE__ */ a(
                           "div",
                           {
                             role: "menuitem",
-                            className: `${e.mobileMenuItem} ${A === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
-                            children: a.sublinks ? /* @__PURE__ */ n(
+                            className: `${e.mobileMenuItem} ${B === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
+                            children: n.sublinks ? /* @__PURE__ */ a(
                               "button",
                               {
                                 className: e.sublinkToggle,
-                                onClick: () => ee(a),
-                                children: /* @__PURE__ */ i("span", { className: e.linkContent, children: [
-                                  a.label,
-                                  a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
+                                onClick: () => ie(n),
+                                children: /* @__PURE__ */ t("span", { className: e.linkContent, children: [
+                                  n.label,
+                                  n.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: n.subtitle })
                                 ] })
                               }
-                            ) : /* @__PURE__ */ i(
+                            ) : /* @__PURE__ */ t(
                               "a",
                               {
-                                href: a.href,
+                                href: n.href,
                                 className: e.link,
-                                target: a.isExternal ? "_blank" : "_self",
-                                rel: a.isExternal ? "noopener noreferrer" : void 0,
+                                target: n.isExternal ? "_blank" : "_self",
+                                rel: n.isExternal ? "noopener noreferrer" : void 0,
                                 children: [
-                                  /* @__PURE__ */ i("span", { className: e.linkContent, children: [
-                                    a.label,
-                                    a.subtitle && /* @__PURE__ */ n("span", { className: e.subtitle, children: a.subtitle })
+                                  /* @__PURE__ */ t("span", { className: e.linkContent, children: [
+                                    n.label,
+                                    n.subtitle && /* @__PURE__ */ a("span", { className: e.subtitle, children: n.subtitle })
                                   ] }),
-                                  a.isExternal && /* @__PURE__ */ n(
-                                    X,
+                                  n.isExternal && /* @__PURE__ */ a(
+                                    K,
                                     {
                                       className: e.newTabIcon,
                                       size: 16,
@@ -498,33 +523,33 @@ function en({
                               }
                             )
                           },
-                          a._key ?? `primary-${l}`
+                          n._key ?? `primary-${l}`
                         )),
-                        c[c.length - 1].secondary.length > 0 && /* @__PURE__ */ n("hr", { className: e.groupDivider }),
-                        c[c.length - 1].secondary.map(
-                          (a, l) => /* @__PURE__ */ n(
+                        d[d.length - 1].secondary.length > 0 && /* @__PURE__ */ a("hr", { className: e.groupDivider }),
+                        d[d.length - 1].secondary.map(
+                          (n, l) => /* @__PURE__ */ a(
                             "div",
                             {
                               role: "menuitem",
-                              className: `${e.mobileMenuItem} ${A === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
-                              children: a.sublinks ? /* @__PURE__ */ n(
+                              className: `${e.mobileMenuItem} ${B === "forward" ? e.fadeInFromLeft : e.fadeInFromRight}`,
+                              children: n.sublinks ? /* @__PURE__ */ a(
                                 "button",
                                 {
                                   className: e.sublinkToggle,
-                                  onClick: () => ee(a),
-                                  children: a.label
+                                  onClick: () => ie(n),
+                                  children: n.label
                                 }
-                              ) : /* @__PURE__ */ i(
+                              ) : /* @__PURE__ */ t(
                                 "a",
                                 {
-                                  href: a.href,
+                                  href: n.href,
                                   className: e.link,
-                                  target: a.isExternal ? "_blank" : "_self",
-                                  rel: a.isExternal ? "noopener noreferrer" : void 0,
+                                  target: n.isExternal ? "_blank" : "_self",
+                                  rel: n.isExternal ? "noopener noreferrer" : void 0,
                                   children: [
-                                    a.label,
-                                    a.isExternal && /* @__PURE__ */ n(
-                                      X,
+                                    n.label,
+                                    n.isExternal && /* @__PURE__ */ a(
+                                      K,
                                       {
                                         className: e.newTabIcon,
                                         size: 16,
@@ -535,77 +560,78 @@ function en({
                                 }
                               )
                             },
-                            a._key ?? `secondary-${l}`
+                            n._key ?? `secondary-${l}`
                           )
                         )
                       ]
                     },
-                    `stack-${c.length}`
+                    `stack-${d.length}`
                   )
                 ] })
               }
             ),
-            h && h.length > 0 && /* @__PURE__ */ n("nav", { className: e.utility, "aria-label": "Utility navigation", children: /* @__PURE__ */ n(se, { children: h.map((a, l) => /* @__PURE__ */ n(
-              q,
+            h && h.length > 0 && /* @__PURE__ */ a("nav", { className: e.utility, "aria-label": "Utility navigation", children: /* @__PURE__ */ a(se, { children: h.map((n, l) => /* @__PURE__ */ a(
+              J,
               {
                 as: "a",
-                href: a.href ?? "/",
-                variant: a.variant ?? "primary",
-                displayType: a.displayType ?? "text",
-                imageSrc: a.imageSrc,
-                imageAlt: a.imageAlt,
-                "aria-label": a.ariaLabel,
-                icon: a.icon,
-                iconAlignment: a.iconAlignment,
-                children: a.imageSrc ? /* @__PURE__ */ n(
+                href: n.href ?? "/",
+                variant: n.variant ?? "primary",
+                displayType: n.displayType ?? "text",
+                imageSrc: n.imageSrc,
+                imageAlt: n.imageAlt,
+                "aria-label": n.ariaLabel,
+                icon: n.icon,
+                iconAlignment: n.iconAlignment,
+                children: n.imageSrc ? /* @__PURE__ */ a(
                   "img",
                   {
-                    src: a.imageSrc,
-                    alt: a.imageAlt ?? a.ariaLabel
+                    src: n.imageSrc,
+                    alt: n.imageAlt ?? n.ariaLabel
                   }
-                ) : a.label
+                ) : n.label
               },
-              a._key ?? l
+              n._key ?? l
             )) }) }),
-            o && /* @__PURE__ */ n(
+            u && /* @__PURE__ */ a(
               "nav",
               {
                 "aria-label": "Utility navigation",
-                className: `${e.utilityMobile} ${b ? e.open : ""}`,
-                children: /* @__PURE__ */ n(se, { alignment: "center", children: /* @__PURE__ */ n(
-                  q,
+                className: `${e.utilityMobile} ${f ? e.open : ""}`,
+                children: /* @__PURE__ */ a(se, { alignment: "center", children: /* @__PURE__ */ a(
+                  J,
                   {
                     as: "a",
-                    href: o.href ?? "/",
-                    variant: o.variant ?? "primary",
-                    displayType: o.displayType ?? "text",
-                    imageSrc: o.imageSrc,
-                    imageAlt: o.imageAlt,
-                    "aria-label": o.ariaLabel,
-                    icon: o.icon,
-                    iconAlignment: o.iconAlignment,
-                    children: o.imageSrc ? /* @__PURE__ */ n(
+                    href: u.href ?? "/",
+                    variant: u.variant ?? "primary",
+                    displayType: u.displayType ?? "text",
+                    imageSrc: u.imageSrc,
+                    imageAlt: u.imageAlt,
+                    "aria-label": u.ariaLabel,
+                    icon: u.icon,
+                    iconAlignment: u.iconAlignment,
+                    children: u.imageSrc ? /* @__PURE__ */ a(
                       "img",
                       {
-                        src: o.imageSrc,
-                        alt: o.imageAlt ?? o.ariaLabel
+                        src: u.imageSrc,
+                        alt: u.imageAlt ?? u.ariaLabel
                       }
-                    ) : o.label
+                    ) : u.label
                   }
                 ) })
               }
             ),
-            /* @__PURE__ */ i("div", { className: e.mobileButtons, children: [
-              M && k && /* @__PURE__ */ n(D, {}),
-              /* @__PURE__ */ n(
+            /* @__PURE__ */ t("div", { className: e.mobileButtons, children: [
+              M && g && /* @__PURE__ */ a(V, {}),
+              /* @__PURE__ */ a(
                 "button",
                 {
+                  ref: T,
                   className: e.menuToggle,
-                  onClick: ye,
-                  "aria-label": b ? "Close menu" : "Open menu",
-                  "aria-expanded": b,
+                  onClick: ae,
+                  "aria-label": f ? "Close menu" : "Open menu",
+                  "aria-expanded": f,
                   "aria-controls": "main-menu",
-                  children: b ? /* @__PURE__ */ n(Ae, { size: 24, "aria-hidden": "true" }) : /* @__PURE__ */ n(_e, { size: 24, "aria-hidden": "true" })
+                  children: f ? /* @__PURE__ */ a(Re, { size: 24, "aria-hidden": "true" }) : /* @__PURE__ */ a(_e, { size: 24, "aria-hidden": "true" })
                 }
               )
             ] })
@@ -616,5 +642,5 @@ function en({
   );
 }
 export {
-  en as Navbar
+  nn as Navbar
 };