@ilo-org/react 0.25.0 → 0.26.0

package/lib/esm/_store/MainNav-chunk-DrgCIgDB.js

@@ -0,0 +1,776 @@
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import { memo as U, forwardRef as M, useRef as L, useImperativeHandle as B, useCallback as q, useEffect as S, useId as R, useState as O } from "react";
+import { u as C } from "./useGlobalSettings-chunk-BhfWlTcd.js";
+import { L as D } from "./LanguageToggle-chunk-C51Ysq9D.js";
+import { c as f } from "./index-chunk-CY3PQDr4.js";
+import { a as H, u as V } from "./useOutsideClick-chunk-CWy5z-7S.js";
+import { createPortal as J } from "react-dom";
+import { u as K } from "./useFocusTrap-chunk-YNgJEwcj.js";
+import { m as W } from "./ContextMenu-chunk-CX3zW2yD.js";
+import { S as Q } from "./SearchField-chunk-CZ2F5vv2.js";
+const Y = M(({ isOpen: n, className: o, navRef: s, children: a, onClose: l, ...d }, p) => {
+  const { prefix: t } = C(), $ = K({
+    isActive: n,
+    onEscape: l
+  }), u = L(null);
+  B(p, () => u.current, []), H(
+    u,
+    () => {
+      n && l && l();
+    },
+    {
+      exceptions: [document.querySelector(`[aria-controls="${d.id}"]`)]
+    }
+  );
+  const i = `${t}--nav-dropdown`, b = q(() => {
+    if (!(u != null && u.current) || !(s != null && s.current))
+      return;
+    const _ = s.current.getBoundingClientRect();
+    u.current.style.top = `${_.bottom}px`, u.current.style.width = `${_.width}px`;
+  }, [s]);
+  return S(() => (b(), window.addEventListener("resize", b), () => {
+    window.removeEventListener("resize", b);
+  }), [b]), typeof document > "u" ? null : J(
+    /* @__PURE__ */ e(
+      "div",
+      {
+        ref: W($, u),
+        className: f(
+          {
+            [i]: !0,
+            [`${i}--open`]: n
+          },
+          o
+        ),
+        "aria-hidden": !n,
+        role: "menu",
+        ...d,
+        children: /* @__PURE__ */ e("div", { className: `${i}__container`, children: a })
+      }
+    ),
+    document.body
+  );
+}), y = U(Y), I = (n) => {
+  const { label: o, component: s, ...a } = n;
+  return s ? /* @__PURE__ */ e(s, { ...a, children: o }) : /* @__PURE__ */ e("a", { ...a, children: o });
+}, T = ({ menu: n }) => {
+  const { prefix: o } = C(), s = `${o}--nav-menu-grid`, a = [];
+  for (let l = 0; l < n.length; l += 5)
+    a.push(n.slice(l, l + 5));
+  return /* @__PURE__ */ e("div", { className: s, children: a.map((l, d) => /* @__PURE__ */ e("div", { className: `${s}__column`, children: l.map((p) => {
+    var t;
+    return /* @__PURE__ */ e(
+      I,
+      {
+        className: `${s}__item`,
+        href: p.href,
+        label: p.label
+      },
+      (t = p.label) == null ? void 0 : t.toString()
+    );
+  }) }, d)) });
+}, A = ({
+  menu: n
+}) => {
+  const { prefix: o } = C(), s = `${o}--nav-mobile-menu`;
+  return /* @__PURE__ */ e("ul", { className: `${s}`, children: n.map((a, l) => {
+    const d = typeof a.isActive == "function" ? a.isActive() : a.isActive;
+    return /* @__PURE__ */ m("li", { className: `${s}__item`, children: [
+      /* @__PURE__ */ e(
+        I,
+        {
+          label: a.label,
+          href: a.href,
+          className: `${s}__link`
+        }
+      ),
+      d && /* @__PURE__ */ e("span", { className: `${s}__marked` })
+    ] }, l);
+  }) });
+}, G = ({
+  isOpen: n,
+  onClose: o,
+  header: s,
+  widgets: a,
+  children: l,
+  className: d,
+  isNestedOpen: p = !1
+}) => {
+  const { prefix: t } = C(), $ = R(), u = K({
+    isActive: n && !p,
+    onEscape: () => {
+      o && o();
+    }
+  }), i = `${t}--nav-mobile-drawer`;
+  return typeof document > "u" ? null : J(
+    /* @__PURE__ */ m(
+      "div",
+      {
+        id: `${i}__${$}`,
+        className: f(i, d, {
+          [`${i}--open`]: n
+        }),
+        ref: u,
+        "aria-hidden": !n,
+        "aria-modal": "true",
+        role: "dialog",
+        tabIndex: n ? -1 : void 0,
+        children: [
+          /* @__PURE__ */ m("div", { className: `${i}__header`, children: [
+            /* @__PURE__ */ e("div", { className: `${i}__header-main`, children: s }),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                className: `${i}__header-close`,
+                onClick: o,
+                "aria-label": "Close navigation",
+                children: /* @__PURE__ */ e("span", { className: `${i}__header-close__icon` })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ m("div", { className: `${i}__container`, children: [
+            /* @__PURE__ */ e("div", { className: `${i}__widgets`, children: a }),
+            l
+          ] })
+        ]
+      }
+    ),
+    document.body
+  );
+}, Z = ({
+  options: n,
+  selected: o
+}) => {
+  const s = (n == null ? void 0 : n.map((l) => ({
+    label: l.label,
+    href: l.url
+  }))) || [], a = [{ label: o, href: "#", isActive: !0 }, ...s];
+  return /* @__PURE__ */ e(A, { menu: a });
+}, P = ({
+  isOpen: n,
+  navigationProps: {
+    branding: o,
+    menu: { items: s, labels: a },
+    widgets: l
+  },
+  onClose: d
+}) => {
+  var c, k, g, x, r;
+  const { prefix: p } = C(), [t, $] = O(!1), [u, i] = O(!1), b = q(() => {
+    $(!1), i(!1);
+  }, []), _ = `${p}--nav-mobile`, N = t || u, v = s.slice(0, 5), h = s.slice(5);
+  return /* @__PURE__ */ m(
+    G,
+    {
+      isOpen: n,
+      isNestedOpen: N,
+      onClose: d,
+      header: /* @__PURE__ */ e("div", { className: `${_}__branding`, children: /* @__PURE__ */ e("div", { className: `${_}__logo`, children: o.logo.drawer || o.logo.main }) }),
+      widgets: /* @__PURE__ */ m("div", { className: `${_}__widgets`, children: [
+        ((c = l == null ? void 0 : l.search) == null ? void 0 : c.type) === "redirect" && /* @__PURE__ */ m(
+          "a",
+          {
+            className: `${_}__widgets-search`,
+            href: l.search.url,
+            "aria-label": "Search",
+            children: [
+              /* @__PURE__ */ e("span", { className: `${_}__widgets-search__label`, children: l.search.label }),
+              /* @__PURE__ */ e("span", { className: `${_}__widgets-search__icon` })
+            ]
+          }
+        ),
+        ((k = l == null ? void 0 : l.search) == null ? void 0 : k.type) === "input" && /* @__PURE__ */ e("div", { className: `${_}__widgets-search-input`, children: l.search.field ? /* @__PURE__ */ e(Q, { ...l.search.field }) : l.search.component }),
+        (l == null ? void 0 : l.link) && /* @__PURE__ */ e(
+          I,
+          {
+            className: `${_}__widgets-link`,
+            href: l.link.href,
+            "aria-label": l.link.label,
+            label: l.link.label
+          }
+        ),
+        (l == null ? void 0 : l.language) && /* @__PURE__ */ m(
+          "button",
+          {
+            className: `${_}__widgets-language`,
+            onClick: () => i(!0),
+            "aria-expanded": u,
+            "aria-controls": "language-list",
+            "aria-label": "Select language",
+            children: [
+              /* @__PURE__ */ m("span", { className: `${_}__widgets-language__label`, children: [
+                l.language.label,
+                ": ",
+                l.language.language
+              ] }),
+              /* @__PURE__ */ e("span", { className: `${_}__widgets-language__icon` })
+            ]
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ e(A, { menu: v }),
+        !!h.length && /* @__PURE__ */ m(
+          "button",
+          {
+            className: `${_}__more`,
+            onClick: () => $(!0),
+            "aria-expanded": t,
+            "aria-controls": "more-items",
+            "aria-label": "More items",
+            children: [
+              a.more,
+              /* @__PURE__ */ e("span", { className: `${_}__more__icon` })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(
+          G,
+          {
+            className: `${_}__nested`,
+            header: /* @__PURE__ */ m(
+              "button",
+              {
+                className: `${_}__nested__header`,
+                onClick: b,
+                "aria-label": "Back to menu",
+                children: [
+                  /* @__PURE__ */ e("span", { className: `${_}__nested__header__icon` }),
+                  a.backToMenu
+                ]
+              }
+            ),
+            widgets: /* @__PURE__ */ e("span", { className: `${_}__nested__title`, children: t ? a.more : (g = l == null ? void 0 : l.language) == null ? void 0 : g.label }),
+            isOpen: N,
+            onClose: b,
+            "aria-modal": "true",
+            children: t ? /* @__PURE__ */ e(A, { menu: h, id: "more-items" }) : /* @__PURE__ */ e(
+              Z,
+              {
+                selected: ((x = l == null ? void 0 : l.language) == null ? void 0 : x.language) || "",
+                options: (r = l == null ? void 0 : l.language) == null ? void 0 : r.options,
+                id: "language-list"
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+};
+function E({ menu: n, split: o }) {
+  const { breakpoint: s } = V(), [a, l] = O(!1), [d, p] = O(!1), [t, $] = O(!1), u = L(null), i = ["xl", "xxl"].includes(s || "md"), b = i ? o.desktop : o.mobile, _ = n.slice(0, b), N = n.slice(b);
+  return S(() => {
+    $(!0);
+  }, []), S(() => {
+    i || l(!1);
+  }, [i]), {
+    menu: { facade: _, more: N },
+    more: [a, l],
+    mobile: [d, p],
+    isDesktop: i,
+    isClient: t,
+    ref: u
+  };
+}
+const X = ({
+  className: n,
+  menu: o,
+  more: s,
+  light: a = !1
+}) => {
+  const { prefix: l } = C(), d = `${l}--nav-menu`;
+  return /* @__PURE__ */ m(
+    "div",
+    {
+      className: f(d, n, {
+        [`${d}--light`]: a
+      }),
+      children: [
+        /* @__PURE__ */ e("ul", { className: `${d}__list`, children: o.map(({ isActive: p, ...t }) => {
+          var u;
+          const $ = typeof p == "function" ? p() : p;
+          return /* @__PURE__ */ e("li", { className: `${d}__item`, children: /* @__PURE__ */ e(
+            I,
+            {
+              ...t,
+              className: f({
+                [`${d}__link`]: !0,
+                [`${d}__link--active`]: $,
+                [t.className || ""]: t.className
+              })
+            }
+          ) }, (u = t.label) == null ? void 0 : u.toString());
+        }) }),
+        s && /* @__PURE__ */ m(
+          "button",
+          {
+            onClick: s.onClick,
+            className: f({
+              [`${d}__more`]: !0,
+              [`${d}__more--open`]: s.isOpen
+            }),
+            "aria-expanded": s.isOpen,
+            "aria-controls": s.controls,
+            children: [
+              s.label,
+              /* @__PURE__ */ e("span", { className: `${d}__more-icon` })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}, w = M(
+  ({
+    props: {
+      branding: n,
+      menu: { items: o, labels: s },
+      widgets: a
+    }
+  }, l) => {
+    const { prefix: d } = C(), {
+      menu: { facade: p, more: t },
+      more: [$, u],
+      mobile: [i, b],
+      isDesktop: _,
+      ref: N,
+      isClient: v
+    } = E({ menu: o, split: { desktop: 4, mobile: 2 } });
+    B(l, () => N.current);
+    const h = `${d}--subsite-nav-compact`;
+    return /* @__PURE__ */ m("header", { ref: N, className: h, children: [
+      /* @__PURE__ */ m("div", { className: `${h}__container`, children: [
+        /* @__PURE__ */ m("nav", { className: `${h}__nav`, children: [
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: `${h}__branding`,
+              onClick: n == null ? void 0 : n.onClick,
+              role: "button",
+              "aria-label": "Branding",
+              tabIndex: 0,
+              children: /* @__PURE__ */ e("div", { className: `${h}__branding-logo`, children: n.logo.main })
+            }
+          ),
+          /* @__PURE__ */ e(
+            X,
+            {
+              className: `${h}__menu`,
+              menu: p,
+              more: t.length ? {
+                label: s.more,
+                onClick: () => u(!$),
+                isOpen: $
+              } : void 0
+            }
+          )
+        ] }),
+        a && /* @__PURE__ */ m("div", { className: `${h}__widget-bar`, children: [
+          /* @__PURE__ */ e("span", { className: `${h}__widget-bar-corner` }),
+          /* @__PURE__ */ m("div", { className: `${h}__widget-bar-content`, children: [
+            a.link && /* @__PURE__ */ e(
+              I,
+              {
+                className: `${h}__widget-bar-link`,
+                href: a.link.href,
+                label: a.link.label
+              }
+            ),
+            a.language && v && /* @__PURE__ */ e("div", { className: `${h}__widget-bar-language`, children: /* @__PURE__ */ e(
+              D,
+              {
+                theme: "dark",
+                ...a.language,
+                hideIcon: !_
+              }
+            ) }),
+            a.search && /* @__PURE__ */ e(
+              I,
+              {
+                href: a.search.url,
+                className: `${h}__widget-bar-search`,
+                label: "",
+                "aria-label": a.search.label
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            className: `${h}__burger`,
+            "aria-label": "Toggle navigation",
+            "aria-expanded": i,
+            onClick: () => b(!i),
+            children: /* @__PURE__ */ e("span", { className: `${h}__burger-icon` })
+          }
+        )
+      ] }),
+      t && v && /* @__PURE__ */ e(y, { isOpen: $, navRef: N, children: /* @__PURE__ */ e(T, { menu: t }) }),
+      v && /* @__PURE__ */ e(
+        P,
+        {
+          isOpen: i,
+          onClose: () => {
+            b(!1);
+          },
+          navigationProps: {
+            widgets: a,
+            branding: n,
+            menu: {
+              items: o,
+              labels: s
+            }
+          }
+        }
+      )
+    ] });
+  }
+), ee = M(
+  ({
+    props: {
+      branding: n,
+      menu: { items: o, labels: s },
+      widgets: a
+    }
+  }, l) => {
+    var k, g, x;
+    const { prefix: d } = C(), {
+      menu: { facade: p, more: t },
+      more: [$, u],
+      mobile: [i, b],
+      isDesktop: _,
+      ref: N,
+      isClient: v
+    } = E({ menu: o, split: { desktop: 6, mobile: 5 } }), h = R();
+    B(l, () => N.current);
+    const c = `${d}--subsite-nav-complex`;
+    return /* @__PURE__ */ m("header", { ref: N, className: c, children: [
+      /* @__PURE__ */ e("div", { className: f(`${c}-bg--light`), children: /* @__PURE__ */ m(
+        "div",
+        {
+          className: f(
+            `${c}__widgets`,
+            `${c}__container`
+          ),
+          children: [
+            /* @__PURE__ */ e("span", { className: `${c}__widgets-bar-corner` }),
+            /* @__PURE__ */ m("span", { className: `${c}__widgets-bar`, children: [
+              (a == null ? void 0 : a.link) && /* @__PURE__ */ e(
+                I,
+                {
+                  href: a.link.href,
+                  label: a.link.label,
+                  className: `${c}__widgets-bar__link`
+                }
+              ),
+              (a == null ? void 0 : a.language) && v && /* @__PURE__ */ e(
+                D,
+                {
+                  className: `${c}__widgets-bar__language`,
+                  ...a.language,
+                  hideIcon: !_
+                }
+              )
+            ] })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ e("div", { className: f(`${c}-bg--light`), children: /* @__PURE__ */ m(
+        "div",
+        {
+          className: f(
+            `${c}__branding`,
+            `${c}__container`
+          ),
+          children: [
+            /* @__PURE__ */ e("div", { className: `${c}__branding-main`, children: /* @__PURE__ */ e(
+              "div",
+              {
+                className: `${c}__branding-main__logo`,
+                onClick: n == null ? void 0 : n.onClick,
+                role: "button",
+                "aria-label": "Branding",
+                tabIndex: 0,
+                children: n.logo.main
+              }
+            ) }),
+            /* @__PURE__ */ m("div", { className: `${c}__branding-tag`, children: [
+              /* @__PURE__ */ e("h4", { className: `${c}__branding-tag__main`, children: (k = n.tag) == null ? void 0 : k.main }),
+              ((g = n.tag) == null ? void 0 : g.sub) && /* @__PURE__ */ e("span", { className: `${c}__branding-tag__sub`, children: (x = n.tag) == null ? void 0 : x.sub })
+            ] })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ e("div", { className: f(`${c}-bg--dark`), children: /* @__PURE__ */ m(
+        "nav",
+        {
+          className: f(
+            `${c}__nav`,
+            `${c}__container`
+          ),
+          children: [
+            /* @__PURE__ */ e("div", { className: `${c}__nav-mobile`, children: /* @__PURE__ */ e(
+              "div",
+              {
+                className: `${c}__nav-mobile__logo`,
+                onClick: n == null ? void 0 : n.onClick,
+                role: "button",
+                "aria-label": "Branding",
+                tabIndex: 0,
+                children: n.logo.mobile
+              }
+            ) }),
+            p && /* @__PURE__ */ e(
+              X,
+              {
+                className: `${c}__nav-menu`,
+                menu: p,
+                more: t.length ? {
+                  label: s.more,
+                  onClick: () => u(!$),
+                  isOpen: $,
+                  controls: `${c}_${h}_dropdown`
+                } : void 0
+              }
+            ),
+            (a == null ? void 0 : a.search) && /* @__PURE__ */ e(
+              "a",
+              {
+                className: `${c}__nav-search`,
+                href: a.search.url,
+                "aria-label": a.search.label,
+                children: /* @__PURE__ */ e("span", { className: `${c}__nav-search__icon` })
+              }
+            ),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                className: `${c}__nav-burger`,
+                "aria-label": "Toggle navigation",
+                "aria-expanded": i,
+                onClick: () => b(!i),
+                children: /* @__PURE__ */ e("span", { className: `${c}__nav-burger__icon` })
+              }
+            )
+          ]
+        }
+      ) }),
+      t && v && /* @__PURE__ */ e(
+        y,
+        {
+          id: `${c}_${h}_dropdown`,
+          isOpen: $,
+          navRef: N,
+          onClose: () => u(!1),
+          children: /* @__PURE__ */ e(T, { menu: t })
+        }
+      ),
+      v && /* @__PURE__ */ e(
+        P,
+        {
+          isOpen: i,
+          onClose: () => {
+            b(!1);
+          },
+          navigationProps: {
+            widgets: a,
+            branding: n,
+            menu: {
+              items: o,
+              labels: s
+            }
+          }
+        }
+      )
+    ] });
+  }
+), ae = {
+  complex: ee,
+  compact: w
+}, de = M(
+  ({ type: n = "compact", props: o }, s) => {
+    const a = ae[n];
+    return /* @__PURE__ */ e(a, { ref: s, props: o });
+  }
+), ue = M(
+  ({ branding: n, menu: { items: o, labels: s }, widgets: a }, l) => {
+    var j, z, F;
+    const { prefix: d } = C(), {
+      menu: { facade: p, more: t },
+      more: [$, u],
+      mobile: [i, b],
+      isDesktop: _,
+      ref: N,
+      isClient: v
+    } = E({ menu: o, split: { desktop: 5, mobile: 5 } }), h = R(), [c, k] = O(!1), g = L(null), x = L(null);
+    H(
+      g,
+      () => {
+        c && k(!1);
+      },
+      {
+        exceptions: [x]
+      }
+    ), B(l, () => N.current), S(() => {
+      _ || k(!1);
+    }, [_]);
+    const r = `${d}--main-nav`;
+    return /* @__PURE__ */ m("header", { ref: N, className: r, children: [
+      /* @__PURE__ */ e("div", { className: f(`${r}-bg--dark`), children: /* @__PURE__ */ m(
+        "div",
+        {
+          className: f(
+            `${r}__widgets`,
+            `${r}__container`
+          ),
+          children: [
+            /* @__PURE__ */ e("span", { className: `${r}__widgets-bar-corner` }),
+            /* @__PURE__ */ e("span", { className: `${r}__widgets-bar`, children: (a == null ? void 0 : a.language) && v && /* @__PURE__ */ e(
+              D,
+              {
+                className: `${r}__widgets-bar__language`,
+                hideIcon: !_,
+                theme: "dark-blue",
+                ...a.language
+              }
+            ) })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ e("div", { className: f(`${r}-bg--dark`), children: /* @__PURE__ */ m(
+        "div",
+        {
+          className: f(
+            `${r}__branding`,
+            `${r}__container`
+          ),
+          children: [
+            /* @__PURE__ */ e("div", { className: `${r}__branding-main`, children: /* @__PURE__ */ e(
+              "div",
+              {
+                className: `${r}__branding-main__logo`,
+                onClick: n == null ? void 0 : n.onClick,
+                role: "button",
+                "aria-label": "Branding",
+                tabIndex: 0,
+                children: n.logo.main
+              }
+            ) }),
+            /* @__PURE__ */ m("div", { className: `${r}__branding-tag`, children: [
+              /* @__PURE__ */ e("h4", { className: `${r}__branding-tag__main`, children: (j = n.tag) == null ? void 0 : j.main }),
+              ((z = n.tag) == null ? void 0 : z.sub) && /* @__PURE__ */ e("span", { className: `${r}__branding-tag__sub`, children: (F = n.tag) == null ? void 0 : F.sub })
+            ] })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ e("div", { className: f(`${r}-bg--darker`), children: /* @__PURE__ */ m(
+        "nav",
+        {
+          className: f(
+            `${r}__nav`,
+            `${r}__container`
+          ),
+          children: [
+            /* @__PURE__ */ e("div", { className: `${r}__nav-mobile`, children: /* @__PURE__ */ e(
+              "div",
+              {
+                className: `${r}__nav-mobile__logo`,
+                onClick: n == null ? void 0 : n.onClick,
+                role: "button",
+                "aria-label": "Branding",
+                tabIndex: 0,
+                children: n.logo.mobile
+              }
+            ) }),
+            p && /* @__PURE__ */ e(
+              X,
+              {
+                light: !0,
+                className: `${r}__nav-menu`,
+                menu: p,
+                more: t.length ? {
+                  id: `${r}_${h}_more_button`,
+                  label: s.more,
+                  onClick: () => {
+                    c && k(!1), u(!$);
+                  },
+                  isOpen: $,
+                  controls: `${r}_${h}_dropdown`
+                } : void 0
+              }
+            ),
+            (a == null ? void 0 : a.search) && /* @__PURE__ */ e(
+              "button",
+              {
+                id: `${r}_${h}_search_button`,
+                className: `${r}__nav-search`,
+                ref: g,
+                onClick: () => {
+                  $ && u(!1), k(!c);
+                },
+                "aria-controls": `${r}_${h}_search_dropdown`,
+                "aria-expanded": c,
+                children: /* @__PURE__ */ e("span", { className: `${r}__nav-search__icon` })
+              }
+            ),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                className: `${r}__nav-burger`,
+                "aria-label": "Toggle navigation",
+                "aria-expanded": i,
+                onClick: () => b(!i),
+                children: /* @__PURE__ */ e("span", { className: `${r}__nav-burger__icon` })
+              }
+            )
+          ]
+        }
+      ) }),
+      t && v && /* @__PURE__ */ e(
+        y,
+        {
+          isOpen: $,
+          navRef: N,
+          onClose: () => u(!1),
+          id: `${r}_${h}_dropdown`,
+          children: /* @__PURE__ */ e(T, { menu: t })
+        }
+      ),
+      /* @__PURE__ */ e(
+        y,
+        {
+          ref: x,
+          isOpen: c,
+          navRef: N,
+          className: `${r}__nav-search-dropdown`,
+          id: `${r}_${h}_search_dropdown`,
+          onClose: () => k(!1),
+          children: a.search.field ? /* @__PURE__ */ e(Q, { ...a.search.field }) : a.search.component
+        }
+      ),
+      v && /* @__PURE__ */ e(
+        P,
+        {
+          isOpen: i,
+          onClose: () => {
+            b(!1);
+          },
+          navigationProps: {
+            widgets: a,
+            branding: n,
+            menu: {
+              items: o,
+              labels: s
+            }
+          }
+        }
+      )
+    ] });
+  }
+);
+export {
+  ue as M,
+  de as S
+};