@primer/react-brand 0.75.1 → 0.76.0-rc.16d4997d

package/esm/SubdomainNavBar/SubdomainNavBar.js

@@ -6,26 +6,26 @@ import { useKeyboardEscape as i } from "../hooks/useKeyboardEscape.js";
 import { ArrowUpRightIcon as a } from "../node_modules/@primer/octicons-react/dist/icons/ArrowUpRightIcon.js";
 import { ChevronLeftIcon as o } from "../node_modules/@primer/octicons-react/dist/icons/ChevronLeftIcon.js";
 import { LinkExternalIcon as s } from "../node_modules/@primer/octicons-react/dist/icons/LinkExternalIcon.js";
-import { MarkGithubIcon as ee } from "../node_modules/@primer/octicons-react/dist/icons/MarkGithubIcon.js";
-import { SearchIcon as c } from "../node_modules/@primer/octicons-react/dist/icons/SearchIcon.js";
-import { useWindowSize as l } from "../hooks/useWindowSize.js";
-import u from "./SubdomainNavBar.module.js";
-import { SubdomainNavBarLinkContext as d, useSubdomainNavBarLinkContext as f } from "./SubdomainNavBarLinkContext.js";
-import { NavigationVisbilityObserver as te } from "./NavigationVisbilityObserver.js";
-import { useFocusTrap as ne } from "../hooks/useFocusTrap.js";
+import { MarkGithubIcon as c } from "../node_modules/@primer/octicons-react/dist/icons/MarkGithubIcon.js";
+import { SearchIcon as l } from "../node_modules/@primer/octicons-react/dist/icons/SearchIcon.js";
+import { useWindowSize as u } from "../hooks/useWindowSize.js";
+import d from "./SubdomainNavBar.module.js";
+import { SubdomainNavBarLinkContext as ee, useSubdomainNavBarLinkContext as te } from "./SubdomainNavBarLinkContext.js";
+import { NavigationVisbilityObserver as ne } from "./NavigationVisbilityObserver.js";
+import { useFocusTrap as re } from "../hooks/useFocusTrap.js";
 import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/subdomain-nav-bar/colors-with-modes-BGj0AiDW.css';/* empty css                                                                                                               */
-import { useSearchKeyboardShortcut as re } from "./useSearchKeyboardShortcut.js";
-import { useSearchResults as ie } from "./useSearchResults.js";
+import { useSearchKeyboardShortcut as ie } from "./useSearchKeyboardShortcut.js";
+import { useSearchResults as f } from "./useSearchResults.js";
 import { TextInput as ae } from "../forms/TextInput/TextInput.js";
-import { FormControl as p } from "../forms/FormControl/FormControl.js";
-import m, { forwardRef as h, useCallback as g, useEffect as _, useImperativeHandle as v, useMemo as y, useRef as b, useState as x } from "react";
-import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
+import { FormControl as oe } from "../forms/FormControl/FormControl.js";
+import p, { forwardRef as m, useCallback as h, useEffect as g, useImperativeHandle as _, useMemo as v, useRef as y, useState as b } from "react";
+import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
 //#region src/SubdomainNavBar/SubdomainNavBar.tsx
-var T = {
+var w = {
 	menuLabel: "Menu",
 	closeLabel: "Close",
 	overflowMenuLabel: "More"
-}, E = m.createContext("small"), D = {
+}, T = p.createContext("small"), E = {
 	root: "SubdomainNavBar",
 	get innerContainer() {
 		return `${this.root}-inner-container`;
@@ -40,7 +40,7 @@ var T = {
 		return `${this.root}-search-live-region`;
 	}
 };
-function O(e) {
+function D(e) {
 	if (e.closest("[hidden], [inert], [aria-hidden=\"true\"]")) return !1;
 	for (let t = e; t; t = t.parentElement) {
 		let e = window.getComputedStyle(t);
@@ -48,250 +48,248 @@ function O(e) {
 	}
 	return !0;
 }
-var k = h(function({ children: a, className: s, fixed: c = !0, fullWidth: f = !1, logoHref: ie = "https://github.com", style: ae, title: p, titleHref: h = "/", leadingComponent: k, trailingComponent: j, onNarrowMenuToggle: F, menuLabels: oe, skipToContentTargetId: I, ...se }, ce) {
-	let [L, le] = x(!0), [ue, R] = x(!1), [de, fe] = x(0), { isMedium: pe, isLarge: z } = l(), [me, he] = x(!1), [ge, B] = x(), V = b(null), _e = b(null), ve = t(), ye = `${ve}-main`, be = t(), H = {
-		...T,
-		...oe
-	}, U = g(() => {
-		fe(Math.max(0, V.current?.getBoundingClientRect().top ?? 0));
-	}, []), W = g(() => {
-		L || (le(!0), F?.(!1));
-	}, [L, F]), xe = () => {
-		if (!L) {
-			W();
+var O = m(function({ children: a, className: s, fixed: l = !0, fullWidth: te = !1, variant: f = "default", logoHref: ae = "https://github.com", style: oe, title: m, titleHref: O = "/", leadingComponent: A, trailingComponent: P, onNarrowMenuToggle: F, menuLabels: I, skipToContentTargetId: L, ...se }, ce) {
+	let [R, le] = b(!0), [ue, z] = b(!1), [de, fe] = b(0), { isMedium: pe, isLarge: B } = u(), [me, he] = b(!1), [ge, V] = b(), H = y(null), _e = y(null), ve = t(), ye = `${ve}-main`, be = t(), U = {
+		...w,
+		...I
+	}, xe = f === "featured", W = h(() => {
+		fe(Math.max(0, H.current?.getBoundingClientRect().top ?? 0));
+	}, []), G = h(() => {
+		R || (le(!0), F?.(!1));
+	}, [R, F]), Se = () => {
+		if (!R) {
+			G();
 			return;
 		}
-		R(!1), U(), le(!1), F?.(!0);
-	}, Se = b(null), Ce = g(() => {
-		let e = Array.from(document.querySelectorAll("main")).find(O);
+		z(!1), W(), le(!1), F?.(!0);
+	}, Ce = y(null), we = h(() => {
+		let e = Array.from(document.querySelectorAll("main")).find(D);
 		return e ? (e.id ||= document.getElementById("start-of-content") ? ye : "start-of-content", e) : _e.current;
-	}, [ye]), G = g(() => {
-		if (I) {
-			let e = document.getElementById(I);
-			if (e && O(e)) return e;
+	}, [ye]), K = h(() => {
+		if (L) {
+			let e = document.getElementById(L);
+			if (e && D(e)) return e;
 		}
-		return Ce();
-	}, [Ce, I]), we = g(() => {
+		return we();
+	}, [we, L]), Te = h(() => {
 		he(!0);
-		let e = G();
-		e && B(e.id);
-	}, [G]), Te = g((e) => {
+		let e = K();
+		e && V(e.id);
+	}, [K]), Ee = h((e) => {
 		if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
-		let t = I ? document.getElementById(I) : null, n = I && (!t || !O(t)), r = G();
-		if (n && console.warn(`SubdomainNavBar could not find the skip-to-content target "${I}". Falling back to the page's main content.`), !r) return;
+		let t = L ? document.getElementById(L) : null, n = L && (!t || !D(t)), r = K();
+		if (n && console.warn(`SubdomainNavBar could not find the skip-to-content target "${L}". Falling back to the page's main content.`), !r) return;
 		let i = `#${encodeURIComponent(r.id)}`;
-		e.currentTarget.setAttribute("href", i), B(r.id);
+		e.currentTarget.setAttribute("href", i), V(r.id);
 		let a = r.tabIndex < 0 && !r.hasAttribute("tabindex");
 		a && (r.tabIndex = -1);
 		let o = r.style.scrollMarginBlockStart;
-		if (c) {
-			let e = V.current?.getBoundingClientRect().height ?? 0;
+		if (l) {
+			let e = H.current?.getBoundingClientRect().height ?? 0;
 			r.style.scrollMarginBlockStart = `${e}px`;
 		}
 		r.addEventListener("blur", () => {
 			a && r.removeAttribute("tabindex"), r.style.scrollMarginBlockStart = o;
 		}, { once: !0 }), r.focus({ preventScroll: !0 });
 	}, [
-		c,
-		G,
-		I
+		l,
+		K,
+		L
 	]);
-	_(() => {
-		let e = G();
-		e && B(e.id);
-	}, [G]), ne({
-		containerRef: Se,
+	g(() => {
+		let e = K();
+		e && V(e.id);
+	}, [K]), re({
+		containerRef: Ce,
 		restoreFocusOnCleanUp: !0,
-		disabled: L
-	}), i(W), _(() => {
-		z && W();
-	}, [W, z]), _(() => {
-		if (L || z) return;
-		U();
-		let e = new ResizeObserver(U), t = V.current;
+		disabled: R
+	}), i(G), g(() => {
+		B && G();
+	}, [G, B]), g(() => {
+		if (R || B) return;
+		W();
+		let e = new ResizeObserver(W), t = H.current;
 		return t && e.observe(t), e.observe(document.documentElement), () => e.disconnect();
 	}, [
-		z,
-		L,
-		U
-	]), _(() => {
-		if (L) return;
+		B,
+		R,
+		W
+	]), g(() => {
+		if (R) return;
 		let e = document.body.style.overflow;
 		return document.body.style.overflow = "hidden", () => {
 			document.body.style.overflow = e;
 		};
-	}, [L]);
-	let Ee = g(() => he(!1), []), K = y(() => m.Children.toArray(a).filter((e) => m.isValidElement(e) && typeof e.type != "string" && e.type === A), []).length > 0, q = y(() => m.Children.toArray(a).map((e, t) => m.isValidElement(e) && e.type === A ? m.cloneElement(e, {
+	}, [R]);
+	let De = h(() => he(!1), []), q = v(() => p.Children.toArray(a).filter((e) => p.isValidElement(e) && typeof e.type != "string" && e.type === k), []).length > 0, Oe = v(() => p.Children.toArray(a).map((e, t) => p.isValidElement(e) && e.type === k ? p.cloneElement(e, {
 		href: e.props.href,
 		children: e.props.children,
 		style: { "--animation-order": t }
-	}) : null).filter(Boolean), [a]), J = y(() => m.Children.toArray(a).filter((e) => m.isValidElement(e) && (e.type === N || e.type === P)), [a]), De = y(() => J.map((e) => m.cloneElement(e, { onClick: (t) => {
-		e.props.onClick?.(t), t.defaultPrevented || W();
-	} })), [J, W]), Y = J.length > 0, Oe = y(() => m.Children.toArray(a).find((e) => m.isValidElement(e) && e.type === M), [a]), ke = !!Oe, X = g(() => {
-		ke && (W(), R(!0));
-	}, [W, ke]), Z = g(() => R(!1), []);
-	v(ce, () => V.current ? Object.assign(V.current, {
+	}) : null).filter(Boolean), [a]), J = v(() => p.Children.toArray(a).filter((e) => p.isValidElement(e) && (e.type === M || e.type === N)), [a]), ke = v(() => J.map((e) => p.cloneElement(e, { onClick: (t) => {
+		e.props.onClick?.(t), t.defaultPrevented || G();
+	} })), [J, G]), Y = J.length > 0, Ae = v(() => p.Children.toArray(a).find((e) => p.isValidElement(e) && e.type === j), [a]), je = !!Ae, X = h(() => {
+		je && (G(), z(!0));
+	}, [G, je]), Z = h(() => z(!1), []);
+	_(ce, () => H.current ? Object.assign(H.current, {
 		openSearch: X,
 		closeSearch: Z
 	}) : {
 		openSearch: X,
 		closeSearch: Z
-	}, [Z, X]), re({
+	}, [Z, X]), ie({
 		disabled: ue,
-		keyboardShortcut: Oe?.props.keyboardShortcut,
+		keyboardShortcut: Ae?.props.keyboardShortcut,
 		onTrigger: X
 	});
-	let Q = k != null, $ = j != null, Ae = K || Y || Q || $, je = {
-		...ae,
+	let Q = A != null, $ = P != null, Me = q || Y || Q || $, Ne = {
+		...oe,
 		"--SubdomainNavBar-menu-offset-block-start": `${de}px`
 	};
-	return /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ w("div", {
-		className: e(u["SubdomainNavBar-outer-container"], c && u["SubdomainNavBar-outer-container--fixed"]),
-		children: [/* @__PURE__ */ C(r, {
+	return /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ C("div", {
+		className: e(d["SubdomainNavBar-outer-container"], l && d["SubdomainNavBar-outer-container--fixed"]),
+		children: [/* @__PURE__ */ S(r, {
 			as: "a",
-			href: `#${ge || I || ve}`,
+			href: `#${ge || L || ve}`,
 			variant: "primary",
 			size: "small",
-			className: e(u["SubdomainNavBar-skip-to-content"], !me && "visually-hidden"),
-			onFocus: we,
-			onBlur: Ee,
-			onClick: Te,
+			className: e(d["SubdomainNavBar-skip-to-content"], !me && "visually-hidden"),
+			onFocus: Te,
+			onBlur: De,
+			onClick: Ee,
 			children: "Skip to content"
-		}), /* @__PURE__ */ w("header", {
-			ref: V,
-			className: e(u.SubdomainNavBar, s),
-			"data-testid": D.root,
-			style: je,
+		}), /* @__PURE__ */ C("header", {
+			ref: H,
+			className: e(d.SubdomainNavBar, d[`SubdomainNavBar--variant-${f}`], m && d["SubdomainNavBar--has-title"], q && d["SubdomainNavBar--has-primary-nav"], s),
+			"data-testid": E.root,
+			style: Ne,
 			...se,
-			children: [/* @__PURE__ */ w("div", {
-				ref: Se,
-				className: e(u["SubdomainNavBar-inner-container"], ue && u["SubdomainNavBar-inner-container--search-open"], !f && u["SubdomainNavBar-inner-container--centered"]),
-				"data-testid": D.innerContainer,
+			children: [/* @__PURE__ */ C("div", {
+				ref: Ce,
+				className: e(d["SubdomainNavBar-inner-container"], ue && d["SubdomainNavBar-inner-container--search-open"], !te && d["SubdomainNavBar-inner-container--centered"]),
+				"data-testid": E.innerContainer,
 				children: [
-					/* @__PURE__ */ C("nav", {
+					/* @__PURE__ */ S("nav", {
 						"aria-label": "Header logo and title",
-						children: /* @__PURE__ */ w("ol", {
-							className: u["SubdomainNavBar-title-area"],
-							children: [/* @__PURE__ */ C("li", { children: /* @__PURE__ */ w("a", {
-								href: ie,
-								"aria-label": "Github Home",
-								className: u["SubdomainNavBar-logo-mark"],
-								children: [/* @__PURE__ */ C("span", {
-									className: u["SubdomainNavBar-back-arrow"],
-									children: /* @__PURE__ */ C(o, {
+						className: d["SubdomainNavBar-title-navigation"],
+						children: /* @__PURE__ */ C("ol", {
+							className: d["SubdomainNavBar-title-area"],
+							children: [/* @__PURE__ */ S("li", { children: /* @__PURE__ */ C("a", {
+								href: ae,
+								"aria-label": "GitHub Home",
+								className: d["SubdomainNavBar-logo-mark"],
+								children: [/* @__PURE__ */ S("span", {
+									className: d["SubdomainNavBar-back-arrow"],
+									children: /* @__PURE__ */ S(o, {
 										fill: "currentColor",
 										size: 24
 									})
-								}), /* @__PURE__ */ C(ee, {
+								}), /* @__PURE__ */ S(c, {
 									fill: "currentColor",
 									size: 24
 								})]
-							}) }), p && /* @__PURE__ */ C(S, { children: /* @__PURE__ */ C("li", { children: /* @__PURE__ */ C("a", {
-								href: h,
-								"aria-label": `${p} home`,
-								className: e(u["SubdomainNavBar-title"]),
-								children: /* @__PURE__ */ w(n, {
+							}) }), m && /* @__PURE__ */ S("li", { children: /* @__PURE__ */ S("a", {
+								href: O,
+								"aria-label": `${m} home`,
+								className: d["SubdomainNavBar-title"],
+								children: /* @__PURE__ */ C(n, {
 									size: "400",
+									variant: "muted",
 									weight: "medium",
-									children: [
-										/* @__PURE__ */ C("span", {
-											className: u["SubdomainNavBar-title-prefix"],
-											children: "GitHub"
-										}),
-										" ",
-										/* @__PURE__ */ C("span", {
-											className: u["SubdomainNavBar-title-label"],
-											children: p
-										})
-									]
+									children: [xe && /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S("span", {
+										className: d["SubdomainNavBar-title-prefix"],
+										children: "GitHub"
+									}), " "] }), /* @__PURE__ */ S("span", {
+										className: d["SubdomainNavBar-title-label"],
+										children: m
+									})]
 								})
-							}) }) })]
+							}) })]
 						})
 					}),
-					K && /* @__PURE__ */ C("nav", {
+					q && /* @__PURE__ */ S("nav", {
 						id: "menu-navigation",
-						"aria-label": p,
-						className: u["SubdomainNavBar-primary-nav"],
-						"data-testid": D.menuLinks,
-						children: /* @__PURE__ */ C(te, {
-							className: e(u["SubdomainNavBar-primary-nav-list--invisible"]),
-							overflowMenuLabel: H.overflowMenuLabel,
-							children: q
+						"aria-label": m,
+						className: d["SubdomainNavBar-primary-nav"],
+						"data-testid": E.menuLinks,
+						children: /* @__PURE__ */ S(ne, {
+							className: d["SubdomainNavBar-primary-nav-list--invisible"],
+							overflowMenuLabel: U.overflowMenuLabel,
+							children: Oe
 						})
 					}),
-					z && Q && /* @__PURE__ */ C("div", {
-						className: u["SubdomainNavBar-leading-component"],
-						children: k
+					B && Q && /* @__PURE__ */ S("div", {
+						className: d["SubdomainNavBar-leading-component"],
+						children: A
 					}),
-					/* @__PURE__ */ w("div", {
-						className: e(u["SubdomainNavBar-secondary-nav"]),
+					/* @__PURE__ */ C("div", {
+						className: e(d["SubdomainNavBar-secondary-nav"]),
 						children: [
-							m.Children.toArray(a).map((t) => m.isValidElement(t) && t.type === M ? m.cloneElement(t, {
+							p.Children.toArray(a).map((t) => p.isValidElement(t) && t.type === j ? p.cloneElement(t, {
 								active: ue,
-								className: e(t.props.className, z && (Y || $) && u["SubdomainNavBar-search-trigger--has-trailing-item"]),
+								className: e(t.props.className, B && (Y || $) && d["SubdomainNavBar-search-trigger--has-trailing-item"]),
 								onSearchOpen: X,
 								onSearchClose: Z,
-								title: p
+								title: m
 							}) : null).filter(Boolean),
-							Ae && /* @__PURE__ */ w("button", {
-								"aria-expanded": !L,
-								"aria-label": L ? H.menuLabel : H.closeLabel,
+							Me && /* @__PURE__ */ C("button", {
+								"aria-expanded": !R,
+								"aria-label": R ? U.menuLabel : U.closeLabel,
 								"aria-controls": be,
-								className: e(u["SubdomainNavBar-menu-button"], u["SubdomainNavBar-mobile-menu-button"], !L && u["SubdomainNavBar-menu-button--close"]),
-								"data-testid": D.menuButton,
-								onClick: xe,
-								children: [/* @__PURE__ */ w("span", {
-									className: u["SubdomainNavBar-menu-button-icon"],
+								className: e(d["SubdomainNavBar-menu-button"], d["SubdomainNavBar-mobile-menu-button"], !R && d["SubdomainNavBar-menu-button--close"]),
+								"data-testid": E.menuButton,
+								onClick: Se,
+								children: [/* @__PURE__ */ C("span", {
+									className: d["SubdomainNavBar-menu-button-icon"],
 									"aria-hidden": "true",
 									children: [
-										/* @__PURE__ */ C("span", { className: u["SubdomainNavBar-menu-button-bar"] }),
-										/* @__PURE__ */ C("span", { className: u["SubdomainNavBar-menu-button-bar"] }),
-										/* @__PURE__ */ C("span", { className: u["SubdomainNavBar-menu-button-bar"] })
+										/* @__PURE__ */ S("span", { className: d["SubdomainNavBar-menu-button-bar"] }),
+										/* @__PURE__ */ S("span", { className: d["SubdomainNavBar-menu-button-bar"] }),
+										/* @__PURE__ */ S("span", { className: d["SubdomainNavBar-menu-button-bar"] })
 									]
-								}), /* @__PURE__ */ C("span", {
-									className: u["SubdomainNavBar-menu-button-label"],
-									children: L ? H.menuLabel : H.closeLabel
+								}), /* @__PURE__ */ S("span", {
+									className: d["SubdomainNavBar-menu-button-label"],
+									children: R ? U.menuLabel : U.closeLabel
 								})]
 							}),
-							z && $ && /* @__PURE__ */ C("div", {
-								className: u["SubdomainNavBar-trailing-component"],
-								children: j
+							B && $ && /* @__PURE__ */ S("div", {
+								className: d["SubdomainNavBar-trailing-component"],
+								children: P
 							}),
-							z && Y && /* @__PURE__ */ C("div", {
-								className: e(u["SubdomainNavBar-button-area"], u["SubdomainNavBar-button-area--visible"], $ && u["SubdomainNavBar-button-area--has-leading-item"]),
-								children: /* @__PURE__ */ C("div", {
-									className: u["SubdomainNavBar-button-area-inner"],
+							B && Y && /* @__PURE__ */ S("div", {
+								className: e(d["SubdomainNavBar-button-area"], d["SubdomainNavBar-button-area--visible"], $ && d["SubdomainNavBar-button-area--has-leading-item"]),
+								children: /* @__PURE__ */ S("div", {
+									className: d["SubdomainNavBar-button-area-inner"],
 									children: J
 								})
 							}),
-							!z && /* @__PURE__ */ w("div", {
+							!B && /* @__PURE__ */ C("div", {
 								id: be,
-								className: e(u["SubdomainNavBar-menu-wrapper"], L && u["SubdomainNavBar-menu-wrapper--close"]),
-								children: [!L && /* @__PURE__ */ w("div", { children: [Q && /* @__PURE__ */ C("div", {
-									className: u["SubdomainNavBar-leading-component"],
-									children: k
-								}), K && /* @__PURE__ */ C(d.Provider, {
-									value: { onLinkClick: W },
-									children: pe ? /* @__PURE__ */ C("ul", {
-										className: u["SubdomainNavBar-primary-nav-list--visible"],
-										children: q
-									}) : /* @__PURE__ */ C(te, {
-										className: e(u["SubdomainNavBar-primary-nav-list--visible"]),
-										overflowMenuLabel: H.overflowMenuLabel,
-										children: q
+								className: e(d["SubdomainNavBar-menu-wrapper"], R && d["SubdomainNavBar-menu-wrapper--close"]),
+								children: [!R && /* @__PURE__ */ C("div", { children: [Q && /* @__PURE__ */ S("div", {
+									className: d["SubdomainNavBar-leading-component"],
+									children: A
+								}), q && /* @__PURE__ */ S(ee.Provider, {
+									value: { onLinkClick: G },
+									children: pe ? /* @__PURE__ */ S("ul", {
+										className: d["SubdomainNavBar-primary-nav-list--visible"],
+										children: Oe
+									}) : /* @__PURE__ */ S(ne, {
+										className: e(d["SubdomainNavBar-primary-nav-list--visible"]),
+										overflowMenuLabel: U.overflowMenuLabel,
+										children: Oe
 									})
-								})] }), !L && (Y || $) && /* @__PURE__ */ w("div", {
-									className: e(u["SubdomainNavBar-menu-wrapper-footer"], (K || Q) && u["SubdomainNavBar-menu-wrapper-footer--has-leading-item"]),
-									children: [$ && /* @__PURE__ */ C("div", {
-										className: u["SubdomainNavBar-trailing-component"],
-										children: j
-									}), Y && /* @__PURE__ */ C("div", {
-										className: e(u["SubdomainNavBar-button-area"], u["SubdomainNavBar-button-area--visible"]),
-										children: /* @__PURE__ */ C("div", {
-											className: u["SubdomainNavBar-button-area-inner"],
-											children: /* @__PURE__ */ C(E.Provider, {
+								})] }), !R && (Y || $) && /* @__PURE__ */ C("div", {
+									className: e(d["SubdomainNavBar-menu-wrapper-footer"], (q || Q) && d["SubdomainNavBar-menu-wrapper-footer--has-leading-item"]),
+									children: [$ && /* @__PURE__ */ S("div", {
+										className: d["SubdomainNavBar-trailing-component"],
+										children: P
+									}), Y && /* @__PURE__ */ S("div", {
+										className: e(d["SubdomainNavBar-button-area"], d["SubdomainNavBar-button-area--visible"]),
+										children: /* @__PURE__ */ S("div", {
+											className: d["SubdomainNavBar-button-area-inner"],
+											children: /* @__PURE__ */ S(T.Provider, {
 												value: pe ? "small" : "medium",
-												children: De
+												children: ke
 											})
 										})
 									})]
@@ -300,36 +298,36 @@ var k = h(function({ children: a, className: s, fixed: c = !0, fullWidth: f = !1
 						]
 					})
 				]
-			}), !z && !L && /* @__PURE__ */ C("div", {
-				className: u["SubdomainNavBar-menu-backdrop"],
+			}), !B && !R && /* @__PURE__ */ S("div", {
+				className: d["SubdomainNavBar-menu-backdrop"],
 				"aria-hidden": "true"
 			})]
 		})]
-	}), /* @__PURE__ */ C("div", {
+	}), /* @__PURE__ */ S("div", {
 		ref: _e,
 		id: ve,
 		tabIndex: -1
 	})] });
 });
-function A({ href: t, className: n, children: r, isExternal: i, "aria-current": a, "aria-hidden": o, tabIndex: ee, ...c }) {
-	let { isOverflowed: l, onLinkClick: d } = f();
-	return /* @__PURE__ */ C("li", {
-		...c,
-		"aria-hidden": l ? !0 : o,
-		className: e(u["SubdomainNavBar-primary-nav-list-item"], n),
-		tabIndex: l ? -1 : ee,
-		children: /* @__PURE__ */ C("a", {
+function k({ href: t, className: n, children: r, isExternal: i, "aria-current": a, "aria-hidden": o, tabIndex: c, ...l }) {
+	let { isOverflowed: u, onLinkClick: ee } = te();
+	return /* @__PURE__ */ S("li", {
+		...l,
+		"aria-hidden": u ? !0 : o,
+		className: e(d["SubdomainNavBar-primary-nav-list-item"], n),
+		tabIndex: u ? -1 : c,
+		children: /* @__PURE__ */ S("a", {
 			href: t,
 			"aria-current": a,
-			className: u["SubdomainNavBar-link"],
-			onClick: d,
-			tabIndex: l ? -1 : void 0,
-			children: /* @__PURE__ */ w("span", {
-				className: u["SubdomainNavBar-link-content"],
-				children: [/* @__PURE__ */ C("span", {
-					className: u["SubdomainNavBar-link-text"],
+			className: d["SubdomainNavBar-link"],
+			onClick: ee,
+			tabIndex: u ? -1 : void 0,
+			children: /* @__PURE__ */ C("span", {
+				className: d["SubdomainNavBar-link-content"],
+				children: [/* @__PURE__ */ S("span", {
+					className: d["SubdomainNavBar-link-text"],
 					children: r
-				}), i && /* @__PURE__ */ C(s, {
+				}), i && /* @__PURE__ */ S(s, {
 					size: 16,
 					"aria-label": "External link"
 				})]
@@ -337,7 +335,7 @@ function A({ href: t, className: n, children: r, isExternal: i, "aria-current":
 		})
 	});
 }
-var j = {
+var A = {
 	searchLabel: "Search",
 	closeLabel: "Close",
 	resultsLabel: "Results",
@@ -347,33 +345,33 @@ var j = {
 	formatResultsHeading: (e) => `Results for “${e}”`,
 	formatResultsLabel: (e) => `Results for ${e}`,
 	formatSuggestions: (e) => `${e} suggestions.`
-}, M = h(({ active: t, className: r, title: i, searchResults: o, searchTerm: s, onSearchOpen: ee, onSearchClose: l, onSubmit: d, onChange: f, placeholder: te, shortcutLabel: ne, keyboardShortcut: re, labels: m }, h) => {
-	let v = b(null), y = b(null), x = {
-		...j,
-		...m
-	}, T = te ?? (i ? x.formatSearchWithTitle(i) : x.searchLabel), E = i ? x.formatSearchWithTitle(i) : x.searchLabel, O = ne ?? (re || ""), { activeDescendant: k, handleSearchResultKeyDown: A, hasGroupedSearchResults: M, hasSearchResults: N, normalizedSearchResultGroups: P, resetActiveDescendant: F, searchResultsLength: oe } = ie({
-		dialogRef: v,
+}, j = m(({ active: t, className: r, title: i, searchResults: o, searchTerm: s, onSearchOpen: c, onSearchClose: u, onSubmit: ee, onChange: te, placeholder: ne, shortcutLabel: re, keyboardShortcut: ie, labels: p }, m) => {
+	let _ = y(null), v = y(null), b = {
+		...A,
+		...p
+	}, w = ne ?? (i ? b.formatSearchWithTitle(i) : b.searchLabel), T = i ? b.formatSearchWithTitle(i) : b.searchLabel, D = re ?? (ie || ""), { activeDescendant: O, handleSearchResultKeyDown: k, hasGroupedSearchResults: j, hasSearchResults: M, normalizedSearchResultGroups: N, resetActiveDescendant: P, searchResultsLength: F } = f({
+		dialogRef: _,
 		searchResults: o
-	}), I = g(() => {
-		l?.(), F();
-	}, [l, F]), se = g((e) => {
-		if (y.current = e, typeof h == "function") {
-			h(e);
+	}), I = h(() => {
+		u?.(), P();
+	}, [u, P]), L = h((e) => {
+		if (v.current = e, typeof m == "function") {
+			m(e);
 			return;
 		}
-		h && (h.current = e);
-	}, [h]);
-	_(() => {
-		let e = v.current;
+		m && (m.current = e);
+	}, [m]);
+	g(() => {
+		let e = _.current;
 		if (e) {
 			if (t) {
-				e.open || (typeof e.showModal == "function" ? e.showModal() : e.setAttribute("open", "")), y.current?.focus();
+				e.open || (typeof e.showModal == "function" ? e.showModal() : e.setAttribute("open", "")), v.current?.focus();
 				return;
 			}
 			e.open && (typeof e.close == "function" ? e.close() : e.removeAttribute("open"));
 		}
-	}, [t, y]), _(() => {
-		let e = v.current;
+	}, [t, v]), g(() => {
+		let e = _.current;
 		if (!e) return;
 		let t = (t) => {
 			if (t.target !== e) return;
@@ -382,194 +380,197 @@ var j = {
 		};
 		return e.addEventListener("click", t), () => e.removeEventListener("click", t);
 	}, [I]);
-	let ce = g((e) => {
+	let se = h((e) => {
 		e.preventDefault(), I();
-	}, [I]), L = ({ result: e, index: t }) => /* @__PURE__ */ w("li", {
-		className: u["SubdomainNavBar-search-result-item"],
+	}, [I]), ce = ({ result: e, index: t }) => /* @__PURE__ */ C("li", {
+		className: d["SubdomainNavBar-search-result-item"],
 		role: "presentation",
 		children: [
-			/* @__PURE__ */ C("div", {
-				className: u["SubdomainNavBar-search-result-item-container"],
-				children: /* @__PURE__ */ w("a", {
+			/* @__PURE__ */ S("div", {
+				className: d["SubdomainNavBar-search-result-item-container"],
+				children: /* @__PURE__ */ C("a", {
 					id: `subdomainnavbar-search-result-${t}`,
 					href: e.url,
 					role: "option",
-					"aria-selected": t === k,
-					children: [/* @__PURE__ */ C("span", { children: e.title }), M && e.isExternal && /* @__PURE__ */ C(a, {
+					"aria-selected": t === O,
+					children: [/* @__PURE__ */ S("span", { children: e.title }), j && e.isExternal && /* @__PURE__ */ S(a, {
 						size: 20,
 						"aria-hidden": "true"
 					})]
 				})
 			}),
-			/* @__PURE__ */ C(n, {
+			/* @__PURE__ */ S(n, {
 				as: "p",
 				size: "200",
 				id: `subdomainnavbar-search-result-item-desc${t}`,
-				className: u["SubdomainNavBar-search-result-item-desc"],
+				className: d["SubdomainNavBar-search-result-item-desc"],
 				children: e.description
 			}),
-			/* @__PURE__ */ w("div", {
-				className: u["SubdomainNavBar-search-result-item-meta"],
-				children: [/* @__PURE__ */ C(n, {
+			/* @__PURE__ */ C("div", {
+				className: d["SubdomainNavBar-search-result-item-meta"],
+				children: [/* @__PURE__ */ S(n, {
 					size: "100",
-					className: u["SubdomainNavBar-search-result-item-desc"],
+					className: d["SubdomainNavBar-search-result-item-desc"],
 					children: e.date
-				}), e.category && /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ w(n, {
+				}), e.category && /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ C(n, {
 					size: "100",
-					className: u["SubdomainNavBar-search-result-item-desc"],
+					className: d["SubdomainNavBar-search-result-item-desc"],
 					children: [
 						" ",
 						"•",
 						" "
 					]
-				}), /* @__PURE__ */ C(n, {
+				}), /* @__PURE__ */ S(n, {
 					size: "100",
-					className: u["SubdomainNavBar-search-result-item-desc"],
+					className: d["SubdomainNavBar-search-result-item-desc"],
 					children: e.category
 				})] })]
 			})
 		]
 	}, `${e.title}-${t}`);
-	return /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C("div", {
-		className: e(u["SubdomainNavBar-search-trigger"], r),
-		children: /* @__PURE__ */ w("button", {
-			"aria-label": x.formatSearchTrigger(T),
-			className: u["SubdomainNavBar-search-input-button"],
-			onClick: ee,
+	return /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S("div", {
+		className: e(d["SubdomainNavBar-search-trigger"], r),
+		children: /* @__PURE__ */ C("button", {
+			"aria-label": b.formatSearchTrigger(w),
+			className: d["SubdomainNavBar-search-input-button"],
+			onClick: c,
 			"data-testid": "toggle-search",
 			type: "button",
-			children: [/* @__PURE__ */ w("span", {
-				className: u["SubdomainNavBar-search-input-button-placeholder"],
-				children: [/* @__PURE__ */ C(c, {
+			children: [/* @__PURE__ */ C("span", {
+				className: d["SubdomainNavBar-search-input-button-placeholder"],
+				children: [/* @__PURE__ */ S(l, {
 					"aria-hidden": "true",
 					size: 16
-				}), /* @__PURE__ */ C("span", { children: T })]
-			}), O && /* @__PURE__ */ C("span", {
-				className: u["SubdomainNavBar-search-input-button-shortcut"],
-				children: O
+				}), /* @__PURE__ */ S("span", {
+					className: d["SubdomainNavBar-search-input-button-placeholder-text"],
+					children: w
+				})]
+			}), D && /* @__PURE__ */ S("span", {
+				className: d["SubdomainNavBar-search-input-button-shortcut"],
+				children: D
 			})]
 		})
-	}), /* @__PURE__ */ C("dialog", {
-		ref: v,
-		"aria-label": E,
-		className: e(u["SubdomainNavBar-search-dialog"], N && u["SubdomainNavBar-search-dialog--has-results"]),
-		onCancel: ce,
-		children: t && /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C("div", {
-			className: e(u["SubdomainNavBar-search-dialog-control-area"]),
-			children: /* @__PURE__ */ w("div", {
-				className: u["SubdomainNavBar-search-input-area"],
-				children: [/* @__PURE__ */ C("form", {
-					className: e(u["SubdomainNavBar-search-form"]),
-					onSubmit: d,
+	}), /* @__PURE__ */ S("dialog", {
+		ref: _,
+		"aria-label": T,
+		className: e(d["SubdomainNavBar-search-dialog"], M && d["SubdomainNavBar-search-dialog--has-results"]),
+		onCancel: se,
+		children: t && /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S("div", {
+			className: e(d["SubdomainNavBar-search-dialog-control-area"]),
+			children: /* @__PURE__ */ C("div", {
+				className: d["SubdomainNavBar-search-input-area"],
+				children: [/* @__PURE__ */ S("form", {
+					className: e(d["SubdomainNavBar-search-form"]),
+					onSubmit: ee,
 					role: "search",
-					children: /* @__PURE__ */ w(p, {
+					children: /* @__PURE__ */ C(oe, {
 						fullWidth: !0,
 						size: "medium",
-						children: [/* @__PURE__ */ C(p.Label, {
+						children: [/* @__PURE__ */ S(oe.Label, {
 							visuallyHidden: !0,
-							children: x.searchLabel
-						}), /* @__PURE__ */ C(ae, {
-							ref: se,
-							className: e(u["SubdomainNavBar-search-text-input"]),
+							children: b.searchLabel
+						}), /* @__PURE__ */ S(ae, {
+							ref: L,
+							className: e(d["SubdomainNavBar-search-text-input"]),
 							name: "search",
 							role: "combobox",
 							autoComplete: "off",
 							"aria-autocomplete": "list",
-							"aria-expanded": N,
+							"aria-expanded": M,
 							"aria-controls": "listbox-search-results",
-							placeholder: T,
-							onChange: f,
+							placeholder: w,
+							onChange: te,
 							defaultValue: s,
 							invisible: !0,
-							leadingVisual: /* @__PURE__ */ C(c, { size: 16 }),
-							"aria-activedescendant": k === -1 ? void 0 : `subdomainnavbar-search-result-${k}`,
-							onKeyDown: A
+							leadingVisual: /* @__PURE__ */ S(l, { size: 16 }),
+							"aria-activedescendant": O === -1 ? void 0 : `subdomainnavbar-search-result-${O}`,
+							onKeyDown: k
 						})]
 					})
-				}), /* @__PURE__ */ C("button", {
-					"aria-label": x.closeLabel,
-					className: u["SubdomainNavBar-search-close-button"],
+				}), /* @__PURE__ */ S("button", {
+					"aria-label": b.closeLabel,
+					className: d["SubdomainNavBar-search-close-button"],
 					onClick: I,
 					type: "button",
-					children: x.closeLabel
+					children: b.closeLabel
 				})]
 			})
-		}), /* @__PURE__ */ w("div", {
+		}), /* @__PURE__ */ C("div", {
 			id: "listbox-search-results",
-			className: e(u["SubdomainNavBar-search-results-area"], N && u["SubdomainNavBar-search-results-area--visible"]),
-			children: [N && /* @__PURE__ */ w("div", {
-				className: e(u["SubdomainNavBar-search-results-container"]),
-				children: [!M && /* @__PURE__ */ C(n, {
+			className: e(d["SubdomainNavBar-search-results-area"], M && d["SubdomainNavBar-search-results-area--visible"]),
+			children: [M && /* @__PURE__ */ C("div", {
+				className: e(d["SubdomainNavBar-search-results-container"]),
+				children: [!j && /* @__PURE__ */ S(n, {
 					id: "subdomainnavbar-search-results-heading",
-					className: u["SubdomainNavBar-search-results-heading"],
-					children: x.formatResultsHeading(s ?? "")
-				}), /* @__PURE__ */ C("ul", {
+					className: d["SubdomainNavBar-search-results-heading"],
+					children: b.formatResultsHeading(s ?? "")
+				}), /* @__PURE__ */ S("ul", {
 					role: "listbox",
 					tabIndex: 0,
-					"aria-labelledby": M ? void 0 : "subdomainnavbar-search-results-heading",
-					"aria-label": M ? s ? x.formatResultsLabel(s) : x.searchResultsLabel : void 0,
-					className: e(u["SubdomainNavBar-search-results"]),
-					children: M ? P.map((e, t) => {
+					"aria-labelledby": j ? void 0 : "subdomainnavbar-search-results-heading",
+					"aria-label": j ? s ? b.formatResultsLabel(s) : b.searchResultsLabel : void 0,
+					className: e(d["SubdomainNavBar-search-results"]),
+					children: j ? N.map((e, t) => {
 						let r = `subdomainnavbar-search-result-group-${t}`;
-						return /* @__PURE__ */ w("li", {
-							className: u["SubdomainNavBar-search-result-group"],
+						return /* @__PURE__ */ C("li", {
+							className: d["SubdomainNavBar-search-result-group"],
 							role: "presentation",
-							children: [e.title && /* @__PURE__ */ C(n, {
+							children: [e.title && /* @__PURE__ */ S(n, {
 								id: r,
-								className: u["SubdomainNavBar-search-result-group-heading"],
+								className: d["SubdomainNavBar-search-result-group-heading"],
 								children: e.title
-							}), /* @__PURE__ */ C("ul", {
-								className: u["SubdomainNavBar-search-result-group-list"],
+							}), /* @__PURE__ */ S("ul", {
+								className: d["SubdomainNavBar-search-result-group-list"],
 								role: "group",
 								"aria-labelledby": e.title ? r : void 0,
-								"aria-label": e.title ? void 0 : x.resultsLabel,
-								children: e.results.map(L)
+								"aria-label": e.title ? void 0 : b.resultsLabel,
+								children: e.results.map(ce)
 							})]
 						}, e.title ?? `ungrouped-${t}`);
-					}) : P.flatMap((e) => e.results.map(L))
+					}) : N.flatMap((e) => e.results.map(ce))
 				})]
-			}), /* @__PURE__ */ w("div", {
+			}), /* @__PURE__ */ C("div", {
 				"aria-live": "polite",
 				"aria-atomic": "true",
-				"data-testid": D.liveRegion,
+				"data-testid": E.liveRegion,
 				className: "visually-hidden",
-				children: [x.formatSuggestions(oe), /* @__PURE__ */ C("span", { children: "\xA0" })]
+				children: [b.formatSuggestions(F), /* @__PURE__ */ S("span", { children: "\xA0" })]
 			})]
 		})] })
 	})] });
 });
-k.displayName = "SubdomainNavBar";
-function N({ children: t, href: n, ...i }) {
-	let a = m.useContext(E);
-	return /* @__PURE__ */ C(r, {
+O.displayName = "SubdomainNavBar";
+function M({ children: t, href: n, ...i }) {
+	let a = p.useContext(T);
+	return /* @__PURE__ */ S(r, {
 		as: "a",
 		href: n,
-		className: e(u["SubdomainNavBar-cta-button"]),
+		className: e(d["SubdomainNavBar-cta-button"]),
 		variant: "primary",
 		size: a,
 		...i,
 		children: t
 	});
 }
-function P({ children: t, href: n, ...i }) {
-	let a = m.useContext(E);
-	return /* @__PURE__ */ C(r, {
+function N({ children: t, href: n, ...i }) {
+	let a = p.useContext(T);
+	return /* @__PURE__ */ S(r, {
 		as: "a",
 		href: n,
-		className: e(u["SubdomainNavBar-cta-button"], u["SubdomainNavBar-cta-button--secondary"]),
+		className: e(d["SubdomainNavBar-cta-button"], d["SubdomainNavBar-cta-button--secondary"]),
 		size: a,
 		...i,
 		children: t
 	});
 }
-var F = Object.assign(k, {
-	Link: A,
-	Search: M,
-	PrimaryAction: N,
-	SecondaryAction: P,
-	testIds: D
+var P = Object.assign(O, {
+	Link: k,
+	Search: j,
+	PrimaryAction: M,
+	SecondaryAction: N,
+	testIds: E
 });
 //#endregion
-export { F as SubdomainNavBar };
+export { P as SubdomainNavBar };
 
 //# sourceMappingURL=SubdomainNavBar.js.map