@vielzeug/refine 3.0.0 → 3.2.0

package/dist/navbar.js

@@ -6,23 +6,23 @@ import { computeSafeRel as o } from "./utils/link.js";
 import s from "./layout/navbar/navbar.css.js";
 import { bind as c, createContext as l, define as u, getHost as d, html as f, inject as p, onCleanup as m, onMounted as h, prop as g, provide as _, useEmit as v, useSlots as y } from "@vielzeug/ore";
 import { computed as b, fromSubscribable as x, signal as S, untrack as C, watch as w } from "@vielzeug/ripple";
-import { SentinelUnavailableError as T, createElementSize as E, createMediaQuery as D } from "@vielzeug/sentinel";
+import { SentinelUnavailableError as T, createElementSize as E, createMediaQuery as ee } from "@vielzeug/sentinel";
 //#region src/layout/navbar/navbar.ts
-var O = (e, t, n, r) => e ? (e.addEventListener(t, n, r), () => e.removeEventListener(t, n, r)) : () => {}, k = (e) => !(e instanceof HTMLElement) || e.tagName.includes("-") || e.childElementCount > 0 ? !0 : (e.textContent ?? "").trim().length > 0, A = (e) => {
+var D = (e, t, n, r) => e ? (e.addEventListener(t, n, r), () => e.removeEventListener(t, n, r)) : () => {}, O = (e) => !(e instanceof HTMLElement) || e.tagName.includes("-") || e.childElementCount > 0 ? !0 : (e.textContent ?? "").trim().length > 0, k = (e) => {
 	let t = String(e ?? "").trim();
 	if (!t) return;
 	let n = /max-width\s*:\s*([0-9]+(?:\.[0-9]+)?)px/i.exec(t);
 	if (!n) return;
 	let r = Number.parseFloat(n[1]);
 	return Number.isFinite(r) ? r : void 0;
-}, j = (e) => {
+}, A = (e) => {
 	let t = e.parentElement;
 	for (; t?.tagName.toLowerCase() === "ore-grid-item";) t = t.parentElement;
 	return t;
-}, M = (e) => {
-	let t = j(e)?.clientWidth ?? 0;
+}, j = (e) => {
+	let t = A(e)?.clientWidth ?? 0;
 	return t > 0 ? t : e.offsetWidth;
-}, N = (e) => {
+}, M = (e) => {
 	let t = e.parentElement;
 	for (; t;) {
 		let e = window.getComputedStyle(t).overflowY;
@@ -30,8 +30,8 @@ var O = (e, t, n, r) => e ? (e.addEventListener(t, n, r), () => e.removeEventLis
 		t = t.parentElement;
 	}
 	return null;
-}, P = l("NavbarContext"), F = "ore-navbar";
-u(F, {
+}, N = l("NavbarContext"), P = "ore-navbar";
+u(P, {
 	props: {
 		breakpoint: g.string("(max-width: 768px)"),
 		color: g.string(),
@@ -39,7 +39,9 @@ u(F, {
 		elevation: g.number(),
 		floating: g.bool(!1),
 		label: g.string("Main navigation"),
+		"menu-close-icon": g.string("x"),
 		"menu-close-label": g.string("Close navigation menu"),
+		"menu-icon": g.string("menu"),
 		"menu-open-label": g.string("Open navigation menu"),
 		"mobile-sidebar": g.string(),
 		rounded: g.string(),
@@ -48,136 +50,136 @@ u(F, {
 		variant: g.string()
 	},
 	setup(e) {
-		let t = d(), n = v(), r = y(), i = r.has("logo"), a = r.elements("mobile-menu"), o = S(!1), s = S(null), l = S(!1), u = S(!1), p = S(!1), g = S(!1), F = S(!1), I = S(!1), L = S(0), R = S(!1), z = S(!1), B = S(A(e.breakpoint.value)), V = S(!1), H = () => {
+		let t = d(), n = v(), r = y(), i = r.has("logo"), a = r.has("start"), o = r.has(), s = r.has("end"), l = r.elements("mobile-menu"), u = S(!1), p = S(null), g = S(!1), P = S(!1), F = S(!1), I = S(!1), L = S(!1), R = S(!1), z = S(0), B = S(!1), V = S(!1), H = S(k(e.breakpoint.value)), U = S(!1), W = () => {
 			let n = String(e["mobile-sidebar"].value ?? "").trim();
 			if (!n) return null;
 			let r = t.getRootNode();
 			return (r instanceof ShadowRoot || r instanceof Document ? r.querySelector(n) : null) ?? document.querySelector(n);
 		};
-		_(P, {
-			closeMobileMenu: () => G(),
-			isMobile: b(() => p.value),
-			mobileMenuOpen: b(() => g.value)
+		_(N, {
+			closeMobileMenu: () => q(),
+			isMobile: b(() => F.value),
+			mobileMenuOpen: b(() => I.value)
 		});
-		let U = () => {
-			if (e.floating.value && e.sticky.value) return I.value ? "sticky" : "floating";
+		let G = () => {
+			if (e.floating.value && e.sticky.value) return R.value ? "sticky" : "floating";
 			if (e.floating.value) return "floating";
 			if (e.sticky.value) return "sticky";
-		}, W = (e) => {
+		}, K = (e) => {
 			let t = !!e;
-			if (!o.value) {
-				let e = s.value ?? H();
+			if (!u.value) {
+				let e = p.value ?? W();
 				if (e) {
 					t ? e.openMobile?.() : e.closeMobile?.();
 					return;
 				}
 			}
-			(!t || o.value) && g.value !== t && (g.value = t, n("mobile-menu-change", { open: t }));
-		}, G = () => W(!1), K = () => W(!0), q = () => {
-			if (!o.value) {
-				let e = s.value ?? H();
+			(!t || u.value) && I.value !== t && (I.value = t, n("mobile-menu-change", { open: t }));
+		}, q = () => K(!1), J = () => K(!0), Y = () => {
+			if (!u.value) {
+				let e = p.value ?? W();
 				if (e) {
 					typeof e.toggleMobile == "function" ? e.toggleMobile() : typeof e.openMobile == "function" && typeof e.closeMobile == "function" && (e.hasAttribute("data-mobile-open") ? e.closeMobile() : e.openMobile());
 					return;
 				}
 			}
-			W(!g.value);
-		}, J = () => {
-			let t = (s.value && !o.value ? l.value : !1) || R.value || !!e["container-breakpoints"].value && z.value;
-			p.value = t, t || G();
-		}, Y = (e) => e ? e.scrollTop || 0 : window.scrollY || document.documentElement.scrollTop || 0, X = (e) => {
-			L.value = Y(e);
-		}, Z = (t = null) => {
+			K(!I.value);
+		}, X = () => {
+			let t = (p.value && !u.value ? g.value : !1) || B.value || !!e["container-breakpoints"].value && V.value;
+			F.value = t, t || q();
+		}, Z = (e) => e ? e.scrollTop || 0 : window.scrollY || document.documentElement.scrollTop || 0, Q = (e) => {
+			z.value = Z(e);
+		}, $ = (t = null) => {
 			if (!(e.floating.value && e.sticky.value)) {
-				I.value &&= !1;
+				R.value &&= !1;
 				return;
 			}
-			let n = Math.max(0, Number(e["scroll-threshold"].value) || 0), r = Y(t) - L.value;
-			I.value = r > n;
+			let n = Math.max(0, Number(e["scroll-threshold"].value) || 0), r = Z(t) - z.value;
+			R.value = r > n;
 		};
 		return c({ attr: {
-			"data-mobile": () => p.value ? !0 : void 0,
-			"data-mobile-open": () => p.value && g.value ? !0 : void 0,
-			"data-mode": () => U() ?? null,
-			"data-mode-transitioning": () => F.value ? !0 : void 0,
-			"data-preview-mode": () => V.value ? !0 : void 0,
-			"data-scrolled": () => e.floating.value && e.sticky.value && I.value ? !0 : void 0
+			"data-mobile": () => F.value ? !0 : void 0,
+			"data-mobile-open": () => F.value && I.value ? !0 : void 0,
+			"data-mode": () => G() ?? null,
+			"data-mode-transitioning": () => L.value ? !0 : void 0,
+			"data-preview-mode": () => U.value ? !0 : void 0,
+			"data-scrolled": () => e.floating.value && e.sticky.value && R.value ? !0 : void 0
 		} }), h(() => {
-			let n = t, r = N(t);
-			n.closeMobileMenu = G, n.openMobileMenu = K, n.toggleMobileMenu = q;
-			let i = O(window, "scroll", () => {
-				Z(r);
-			}, { passive: !0 }), c = r ? O(r, "scroll", () => {
-				Z(r);
-			}, { passive: !0 }) : void 0, d = O(t, "keydown", (e) => {
-				e.key === "Escape" && g.value && G();
-			}), f, p, h, _, v = () => {
-				if (p?.(), p = void 0, s.value = null, l.value = !1, u.value = !1, !String(e["mobile-sidebar"].value ?? "").trim()) return;
-				let n = H();
+			let n = t, r = M(t);
+			n.closeMobileMenu = q, n.openMobileMenu = J, n.toggleMobileMenu = Y;
+			let i = D(window, "scroll", () => {
+				$(r);
+			}, { passive: !0 }), a = r ? D(r, "scroll", () => {
+				$(r);
+			}, { passive: !0 }) : void 0, o = D(t, "keydown", (e) => {
+				e.key === "Escape" && I.value && q();
+			}), s, c, d, f, h = () => {
+				if (c?.(), c = void 0, p.value = null, g.value = !1, P.value = !1, !String(e["mobile-sidebar"].value ?? "").trim()) return;
+				let n = W();
 				if (!n) {
 					let e = t.getRootNode(), n = e instanceof Document || e instanceof ShadowRoot ? e : document, r = new MutationObserver(() => {
-						H() && v();
+						W() && h();
 					});
 					r.observe(n, {
 						childList: !0,
 						subtree: !0
-					}), p = () => r.disconnect();
+					}), c = () => r.disconnect();
 					return;
 				}
 				let r = (e) => {
 					let t = n.hasAttribute("data-bottom-nav"), r = n.hasAttribute("data-mobile-open");
-					l.value = t, u.value = e?.detail ? e.detail.open : r, u.value && !l.value && (l.value = !0), J();
+					g.value = t, P.value = e?.detail ? e.detail.open : r, P.value && !g.value && (g.value = !0), X();
 				}, i = new MutationObserver(() => {
 					r();
 				});
 				r(), i.observe(n, {
 					attributeFilter: ["data-bottom-nav", "data-mobile-open"],
 					attributes: !0
-				}), n.addEventListener("mobile-open-change", r), p = () => {
+				}), n.addEventListener("mobile-open-change", r), c = () => {
 					i.disconnect(), n.removeEventListener("mobile-open-change", r);
-				}, s.value = n;
-			}, y = () => {
-				F.value = !0, h != null && clearTimeout(h), h = setTimeout(() => {
-					F.value = !1, h = void 0;
+				}, p.value = n;
+			}, _ = () => {
+				L.value = !0, d != null && clearTimeout(d), d = setTimeout(() => {
+					L.value = !1, d = void 0;
 				}, 220);
-			}, S = w(b(() => e.floating.value && e.sticky.value), (e) => {
+			}, v = w(b(() => e.floating.value && e.sticky.value), (e) => {
 				if (!e) {
-					I.value &&= !1, F.value &&= !1, _ = void 0, h != null && (clearTimeout(h), h = void 0);
+					R.value &&= !1, L.value &&= !1, f = void 0, d != null && (clearTimeout(d), d = void 0);
 					return;
 				}
-				X(r), Z(r), _ = U();
-			}, { immediate: !0 }), P = w(e["mobile-sidebar"], () => {
-				v();
-			}, { immediate: !0 }), L = w(b(() => U()), (t) => {
+				Q(r), $(r), f = G();
+			}, { immediate: !0 }), y = w(e["mobile-sidebar"], () => {
+				h();
+			}, { immediate: !0 }), S = w(b(() => G()), (t) => {
 				if (!(e.floating.value && e.sticky.value)) {
-					_ = t ?? void 0;
+					f = t ?? void 0;
 					return;
 				}
 				let n = t ?? void 0;
-				_ && n && _ !== n && y(), _ = n;
-			}, { immediate: !0 }), W = w(o, (e) => {
-				!e && g.value && G();
-			}, { immediate: !0 }), Y = () => {
-				o.value = a.value.some(k);
-			}, Q = w(a, Y, { immediate: !0 }), $ = new MutationObserver(() => {
-				Y();
+				f && n && f !== n && _(), f = n;
+			}, { immediate: !0 }), N = w(u, (e) => {
+				!e && I.value && q();
+			}, { immediate: !0 }), F = () => {
+				u.value = l.value.some(O);
+			}, z = w(l, F, { immediate: !0 }), K = new MutationObserver(() => {
+				F();
 			});
-			$.observe(t, {
+			K.observe(t, {
 				childList: !0,
 				subtree: !0
 			}), w(e.breakpoint, (n) => {
 				C(() => {
-					f?.(), f = void 0;
+					s?.(), s = void 0;
 					let r = String(n ?? "").trim();
-					B.value = A(r), R.value = !1;
-					let i = M(t);
-					if (z.value = i > 0 && B.value != null && i <= B.value, J(), !(e["container-breakpoints"].value && B.value != null) && r) try {
-						let e = D(r), t = (e) => {
-							e && (R.value = e.matches, J());
+					H.value = k(r), B.value = !1;
+					let i = j(t);
+					if (V.value = i > 0 && H.value != null && i <= H.value, X(), !(e["container-breakpoints"].value && H.value != null) && r) try {
+						let e = ee(r), t = (e) => {
+							e && (B.value = e.matches, X());
 						};
 						t(e.getSnapshot());
 						let n = w(x(e, { signal: e.disposalSignal }), t);
-						f = () => {
+						s = () => {
 							n.dispose(), e.dispose();
 						};
 					} catch (e) {
@@ -185,10 +187,10 @@ u(F, {
 					}
 				});
 			}, { immediate: !0 });
-			let ee = typeof ResizeObserver == "function" ? (() => {
+			let Z = typeof ResizeObserver == "function" ? (() => {
 				let e = E(t);
 				m(() => e.dispose());
-				let n = x(e, { signal: e.disposalSignal }), r = t.parentElement, i = j(t), a = r ? E(r) : void 0, o = i && i !== r ? E(i) : void 0;
+				let n = x(e, { signal: e.disposalSignal }), r = t.parentElement, i = A(t), a = r ? E(r) : void 0, o = i && i !== r ? E(i) : void 0;
 				a && m(() => a.dispose()), o && m(() => o.dispose());
 				let s = a ? x(a, { signal: a.disposalSignal }) : void 0, c = o ? x(o, { signal: o.disposalSignal }) : void 0;
 				return w(b(() => [
@@ -199,12 +201,12 @@ u(F, {
 					c?.value?.width,
 					c?.value?.height
 				]), () => {
-					let e = M(t), n = j(t)?.clientWidth ?? 0;
-					z.value = e > 0 && B.value != null && e <= B.value, V.value = n > 0 && n < window.innerWidth, J();
+					let e = j(t), n = A(t)?.clientWidth ?? 0;
+					V.value = e > 0 && H.value != null && e <= H.value, U.value = n > 0 && n < window.innerWidth, X();
 				});
 			})() : void 0;
 			return () => {
-				d?.(), i?.(), c?.(), S?.dispose(), L?.dispose(), W?.dispose(), Q?.dispose(), P?.dispose(), $.disconnect(), f?.(), p?.(), ee?.dispose(), h != null && (clearTimeout(h), h = void 0);
+				o?.(), i?.(), a?.(), v?.dispose(), S?.dispose(), N?.dispose(), z?.dispose(), y?.dispose(), K.disconnect(), s?.(), c?.(), Z?.dispose(), d != null && (clearTimeout(d), d = void 0);
 			};
 		}), f`
       <nav part="nav" aria-label="${e.label}">
@@ -213,15 +215,15 @@ u(F, {
             <slot name="logo"></slot>
           </div>
 
-          <div class="navbar-start" part="start">
+          <div class="navbar-start" part="start" ?hidden=${() => !a.value}>
             <slot name="start"></slot>
           </div>
 
-          <div class="navbar-center" part="center">
+          <div class="navbar-center" part="center" ?hidden=${() => !o.value}>
             <slot></slot>
           </div>
 
-          <div class="navbar-end" part="end">
+          <div class="navbar-end" part="end" ?hidden=${() => !s.value}>
             <slot name="end"></slot>
           </div>
 
@@ -229,13 +231,13 @@ u(F, {
             class="mobile-toggle"
             part="mobile-toggle"
             type="button"
-            aria-label="${() => (o.value ? g.value : u.value) ? e["menu-close-label"].value : e["menu-open-label"].value}"
+            aria-label="${() => (u.value ? I.value : P.value) ? e["menu-close-label"].value : e["menu-open-label"].value}"
             aria-controls="mobile-menu-panel"
-            aria-expanded="${() => String(o.value ? g.value : u.value)}"
-            ?hidden=${() => !p.value || !o.value && !s.value}
-            @click="${q}">
+            aria-expanded="${() => String(u.value ? I.value : P.value)}"
+            ?hidden=${() => !F.value || !u.value && !p.value}
+            @click="${Y}">
             <ore-icon
-              name="${() => (o.value ? g.value : u.value) ? "x" : "menu"}"
+              name="${() => (u.value ? I.value : P.value) ? e["menu-close-icon"].value : e["menu-icon"].value}"
               size="18"
               stroke-width="2.5"
               aria-hidden="true"></ore-icon>
@@ -248,7 +250,7 @@ u(F, {
           part="mobile-menu"
           role="navigation"
           aria-label="${() => `${e.label.value} mobile menu`}"
-          ?hidden=${() => !p.value || !g.value || !o.value}>
+          ?hidden=${() => !F.value || !I.value || !u.value}>
           <slot name="mobile-menu"></slot>
         </div>
       </nav>
@@ -264,8 +266,8 @@ u(F, {
 		s
 	]
 });
-var I = "ore-navbar-item";
-u(I, {
+var F = "ore-navbar-item";
+u(F, {
 	props: {
 		active: g.bool(!1),
 		disabled: g.bool(!1),
@@ -275,7 +277,7 @@ u(I, {
 		target: g.string()
 	},
 	setup(e) {
-		let t = y(), n = () => t.has("icon").value, r = () => t.has("end").value, i = p(P);
+		let t = y(), n = () => t.has("icon").value, r = () => t.has("end").value, i = p(N);
 		c({ attr: {
 			"navbar-mobile": () => i?.isMobile.value ? !0 : void 0,
 			"navbar-mobile-open": () => i?.mobileMenuOpen.value ? !0 : void 0
@@ -313,6 +315,6 @@ u(I, {
 	styles: [e, s]
 });
 //#endregion
-export { P as NAVBAR_CTX, I as NAVBAR_ITEM_TAG, F as NAVBAR_TAG };
+export { N as NAVBAR_CTX, F as NAVBAR_ITEM_TAG, P as NAVBAR_TAG };
 
 //# sourceMappingURL=navbar.js.map

package/dist/navbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar.js","names":[],"sources":["../src/layout/navbar/navbar.ts"],"sourcesContent":["import {\n  bind,\n  createContext,\n  define,\n  getHost,\n  html,\n  inject,\n  onCleanup,\n  onMounted,\n  prop,\n  provide,\n  useEmit,\n  useSlots,\n} from '@vielzeug/ore';\nimport { computed, fromSubscribable, type Readable, signal, untrack, watch } from '@vielzeug/ripple';\nimport { createElementSize, createMediaQuery, SentinelUnavailableError } from '@vielzeug/sentinel';\n\nimport type { ElevationLevel, RoundedSize, ThemeColor, VisualVariant } from '../../types';\n\nimport '../../content/icon/icon';\nimport {\n  coarsePointerMixin,\n  colorThemeMixin,\n  elevationMixin,\n  frostVariantMixin,\n  reducedMotionMixin,\n  roundedVariantMixin,\n} from '../../styles';\nimport { computeSafeRel } from '../../utils';\nimport navbarStyles from './navbar.css?inline';\n\nconst listen = <E extends Event = Event>(\n  el: EventTarget | null | undefined,\n  name: string,\n  handler: (e: E) => void,\n  options?: AddEventListenerOptions,\n): (() => void) => {\n  if (!el) return () => {};\n\n  el.addEventListener(name, handler as EventListener, options);\n\n  return () => el.removeEventListener(name, handler as EventListener, options);\n};\n\ntype NavbarMode = 'floating' | 'sticky';\n\nconst hasElementContent = (el: Element): boolean => {\n  if (!(el instanceof HTMLElement)) return true;\n\n  if (el.tagName.includes('-')) return true;\n\n  if (el.childElementCount > 0) return true;\n\n  return (el.textContent ?? '').trim().length > 0;\n};\n\nconst parseMaxWidthPx = (query: string | undefined): number | undefined => {\n  const value = String(query ?? '').trim();\n\n  if (!value) return undefined;\n\n  const match = /max-width\\s*:\\s*([0-9]+(?:\\.[0-9]+)?)px/i.exec(value);\n\n  if (!match) return undefined;\n\n  const parsed = Number.parseFloat(match[1]);\n\n  return Number.isFinite(parsed) ? parsed : undefined;\n};\n\nconst resolveContainerElement = (el: HTMLElement): HTMLElement | null => {\n  let container = el.parentElement;\n\n  while (container?.tagName.toLowerCase() === 'ore-grid-item') {\n    container = container.parentElement;\n  }\n\n  return container;\n};\n\nconst readContainerWidth = (el: HTMLElement): number => {\n  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n  if (parentWidth > 0) return parentWidth;\n\n  return el.offsetWidth;\n};\n\nconst findScrollContainer = (start: HTMLElement): HTMLElement | null => {\n  let current: HTMLElement | null = start.parentElement;\n\n  while (current) {\n    const styles = window.getComputedStyle(current);\n    const overflowY = styles.overflowY;\n\n    if (overflowY === 'auto' || overflowY === 'scroll' || overflowY === 'overlay') {\n      return current;\n    }\n\n    current = current.parentElement;\n  }\n\n  return null;\n};\n\n/** Context provided by `ore-navbar` to `ore-navbar-item` children. */\nexport type NavbarContext = {\n  closeMobileMenu: () => void;\n  isMobile: Readable<boolean>;\n  mobileMenuOpen: Readable<boolean>;\n};\n\n/** Injection key for navbar context. */\nexport const NAVBAR_CTX = createContext<NavbarContext>('NavbarContext');\n\n/** Navbar component events */\nexport type OreNavbarEvents = {\n  'mobile-menu-change': { open: boolean };\n};\n\n/** Navbar component element interface */\nexport type NavbarElement = HTMLElement &\n  OreNavbarProps & {\n    closeMobileMenu(): void;\n    openMobileMenu(): void;\n    toggleMobileMenu(): void;\n  };\n\ntype MobileSidebarElement = HTMLElement & {\n  closeMobile?: () => void;\n  openMobile?: () => void;\n  toggleMobile?: () => void;\n};\n\n/** Navbar component properties */\nexport type OreNavbarProps = {\n  /** CSS media query used for mobile layout switching */\n  breakpoint?: string;\n  /** Theme color */\n  color?: ThemeColor;\n  /** Evaluate mobile breakpoint against container width only when possible. */\n  'container-breakpoints'?: boolean;\n  /** Shadow elevation level (0-5) */\n  elevation?: ElevationLevel;\n  /** Start as detached floating navbar */\n  floating?: boolean;\n  /** Accessible nav landmark label */\n  label?: string;\n  'menu-close-label'?: string;\n  'menu-open-label'?: string;\n  /** CSS selector for an external sidebar toggled by the mobile button */\n  'mobile-sidebar'?: string;\n  /** Border radius size */\n  rounded?: RoundedSize;\n  /** Scroll threshold in px used by floating+sticky transition */\n  'scroll-threshold'?: number;\n  /** Stick to top of viewport */\n  sticky?: boolean;\n  /** Visual style variant */\n  variant?: Exclude<VisualVariant, 'ghost' | 'text'>;\n};\n\n/** Navbar item properties */\nexport type OreNavbarItemProps = {\n  /** Whether this item represents the current page */\n  active?: boolean;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Link target URL. Renders an anchor when provided. */\n  href?: string;\n  /**\n   * Icon-only mode — hides the (empty) label region and switches to compact, symmetric\n   * padding instead of the icon+label layout's wider horizontal padding. Set this whenever\n   * the default slot is intentionally left empty (name conveyed via `aria-label` instead),\n   * otherwise the empty label still reserves its inter-element gap and the item ends up\n   * with lopsided padding around the icon.\n   */\n  'icon-only'?: boolean;\n  /** Relationship of linked URL (anchor-only) */\n  rel?: string;\n  /** Browsing context for link (anchor-only) */\n  target?: string;\n};\n\n/**\n * `ore-navbar` — Responsive navigation with sticky/floating modes and a mobile overflow panel.\n *\n * @element ore-navbar\n * @element ore-navbar-item - Navigation link or button placed in the default or mobile-menu slot\n *\n * @attr {string} label - Accessible nav landmark label\n * @attr {boolean} sticky - Makes navbar sticky at top\n * @attr {boolean} floating - Makes navbar detached and floating\n * @attr {number} scroll-threshold - Scroll threshold for floating+sticky transition\n * @attr {string} breakpoint - CSS media query used for mobile mode\n * @attr {boolean} container-breakpoints - Evaluates parseable max-width breakpoints against container width\n * @attr {string} variant - Visual variant: 'flat' | 'solid' | 'bordered' | 'outline' | 'frost'\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} elevation - Shadow elevation: '0' | '1' | '2' | '3' | '4' | '5'\n *\n * @fires mobile-menu-change - Emitted when mobile menu open state changes. detail: { open: boolean }\n *\n * @slot logo - Brand/logo content rendered at the leading edge\n * @slot start - Content rendered in the left/start region\n * @slot - Center navigation content rendered between the start and end regions\n * @slot end - Content rendered in the right/end region\n * @slot mobile-menu - Controls and links rendered inside the mobile overflow panel\n *\n * @cssprop --navbar-height - Navbar bar height\n * @cssprop --navbar-width - Max width of the navbar content\n * @cssprop --navbar-offset - Horizontal offset for floating/sticky positioning\n * @cssprop --navbar-bg - Navbar background color\n * @cssprop --navbar-color - Navbar text color\n * @cssprop --navbar-border-color - Navbar border color\n * @cssprop --navbar-shadow - Navbar box shadow\n * @cssprop --navbar-radius - Border radius (floating/sticky modes)\n * @cssprop --navbar-backdrop-filter - Backdrop filter for blur effect\n * @cssprop --navbar-item-color - Nav item text color\n * @cssprop --navbar-item-hover-color - Nav item hover text color\n * @cssprop --navbar-item-hover-bg - Nav item hover background\n * @cssprop --navbar-item-active-color - Nav item active/current text color\n * @cssprop --navbar-item-active-bg - Nav item active/current background\n * @part nav - Outer navigation landmark\n * @part bar - Main navbar row container\n * @part logo - Logo slot container\n * @part start - Leading action/content region\n * @part center - Center content region\n * @part end - Trailing action/content region\n * @part mobile-toggle - Mobile menu toggle button\n * @part mobile-menu - Mobile overflow panel\n * @part item-icon - Leading icon inside navbar items\n * @part item-label - Label text inside navbar items\n * @part item-end - Trailing content inside navbar items\n * @part item - Clickable navbar item root\n * @example\n * ```html\n * <ore-navbar sticky elevation=\"1\">\n *   <a href=\"/\" slot=\"logo\"><strong>MyApp</strong></a>\n *   <ore-navbar-item href=\"/dashboard\">Dashboard</ore-navbar-item>\n *   <ore-navbar-item href=\"/docs\">Docs</ore-navbar-item>\n *   <ore-button slot=\"end\" variant=\"solid\" color=\"primary\" size=\"sm\">Sign in</ore-button>\n * </ore-navbar>\n * ```\n */\nexport const NAVBAR_TAG = 'ore-navbar' as const;\ndefine<OreNavbarProps>(NAVBAR_TAG, {\n  props: {\n    breakpoint: prop.string('(max-width: 768px)'),\n    color: prop.string<ThemeColor>(),\n    'container-breakpoints': prop.bool(false),\n    elevation: prop.number<ElevationLevel>(),\n    floating: prop.bool(false),\n    label: prop.string('Main navigation'),\n    'menu-close-label': prop.string('Close navigation menu'),\n    'menu-open-label': prop.string('Open navigation menu'),\n    'mobile-sidebar': prop.string(),\n    rounded: prop.string<RoundedSize>(),\n    'scroll-threshold': prop.number(80),\n    sticky: prop.bool(false),\n    variant: prop.string<Exclude<VisualVariant, 'ghost' | 'text'>>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreNavbarEvents>();\n    const slots = useSlots();\n\n    const hasLogo = slots.has('logo');\n    const mobileMenuElements = slots.elements('mobile-menu');\n    const hasMobileMenu = signal(false);\n    const mobileSidebarTarget = signal<MobileSidebarElement | null>(null);\n    const isExternalMobileMode = signal(false);\n    const isExternalMobileOpen = signal(false);\n    const isMobile = signal(false);\n    const isMobileMenuOpen = signal(false);\n    const isModeTransitioning = signal(false);\n    const isScrolled = signal(false);\n    const scrollBase = signal(0);\n    const mediaMatches = signal(false);\n    const sizeMatches = signal(false);\n    const maxWidthPx = signal<number | undefined>(parseMaxWidthPx(props.breakpoint.value));\n    const isPreviewMode = signal(false);\n\n    const getExternalSidebar = () => {\n      const selector = String(props['mobile-sidebar'].value ?? '').trim();\n\n      if (!selector) return null;\n\n      const root = el.getRootNode();\n      const scopedTarget =\n        root instanceof ShadowRoot || root instanceof Document\n          ? (root.querySelector(selector) as MobileSidebarElement | null)\n          : null;\n\n      return scopedTarget ?? (document.querySelector(selector) as MobileSidebarElement | null);\n    };\n\n    provide(NAVBAR_CTX, {\n      // Wrapped, not passed directly — `closeMobileMenu` (below) isn't defined yet at this point\n      // in `setup()`; by the time `ore-navbar-item` actually calls this (a later click), it is.\n      closeMobileMenu: () => closeMobileMenu(),\n      isMobile: computed(() => isMobile.value) as Readable<boolean>,\n      mobileMenuOpen: computed(() => isMobileMenuOpen.value) as Readable<boolean>,\n    });\n\n    const computeMode = (): NavbarMode | undefined => {\n      if (props.floating.value && props.sticky.value) {\n        return isScrolled.value ? 'sticky' : 'floating';\n      }\n\n      if (props.floating.value) return 'floating';\n\n      if (props.sticky.value) return 'sticky';\n\n      return undefined;\n    };\n\n    const setMobileMenu = (next: boolean) => {\n      const open = Boolean(next);\n\n      if (!hasMobileMenu.value) {\n        const target = mobileSidebarTarget.value ?? getExternalSidebar();\n\n        if (target) {\n          if (open) {\n            target.openMobile?.();\n          } else {\n            target.closeMobile?.();\n          }\n\n          return;\n        }\n      }\n\n      if (open && !hasMobileMenu.value) return;\n\n      if (isMobileMenuOpen.value === open) return;\n\n      isMobileMenuOpen.value = open;\n      emit('mobile-menu-change', { open });\n    };\n\n    const closeMobileMenu = () => setMobileMenu(false);\n    const openMobileMenu = () => setMobileMenu(true);\n    const toggleMobileMenu = () => {\n      if (!hasMobileMenu.value) {\n        const target = mobileSidebarTarget.value ?? getExternalSidebar();\n\n        if (target) {\n          if (typeof target.toggleMobile === 'function') {\n            target.toggleMobile();\n          } else if (typeof target.openMobile === 'function' && typeof target.closeMobile === 'function') {\n            const isOpen = target.hasAttribute('data-mobile-open');\n\n            if (isOpen) target.closeMobile();\n            else target.openMobile();\n          }\n\n          return;\n        }\n      }\n\n      setMobileMenu(!isMobileMenuOpen.value);\n    };\n\n    const syncMobileMode = () => {\n      const next =\n        (mobileSidebarTarget.value && !hasMobileMenu.value ? isExternalMobileMode.value : false) ||\n        mediaMatches.value ||\n        (Boolean(props['container-breakpoints'].value) && sizeMatches.value);\n\n      isMobile.value = next;\n\n      if (!next) closeMobileMenu();\n    };\n\n    const readScrollOffset = (scrollContainer: HTMLElement | null): number => {\n      if (scrollContainer) {\n        return scrollContainer.scrollTop || 0;\n      }\n\n      return window.scrollY || document.documentElement.scrollTop || 0;\n    };\n\n    const resetScrollBase = (scrollContainer: HTMLElement | null) => {\n      scrollBase.value = readScrollOffset(scrollContainer);\n    };\n\n    const updateScrolled = (scrollContainer: HTMLElement | null = null) => {\n      if (!(props.floating.value && props.sticky.value)) {\n        if (isScrolled.value) isScrolled.value = false;\n\n        return;\n      }\n\n      const threshold = Math.max(0, Number(props['scroll-threshold'].value) || 0);\n      const currentOffset = readScrollOffset(scrollContainer);\n      const delta = currentOffset - scrollBase.value;\n\n      isScrolled.value = delta > threshold;\n    };\n\n    bind({\n      attr: {\n        'data-mobile': () => (isMobile.value ? true : undefined),\n        'data-mobile-open': () => (isMobile.value && isMobileMenuOpen.value ? true : undefined),\n        'data-mode': () => computeMode() ?? null,\n        'data-mode-transitioning': () => (isModeTransitioning.value ? true : undefined),\n        'data-preview-mode': () => (isPreviewMode.value ? true : undefined),\n        'data-scrolled': () => (props.floating.value && props.sticky.value && isScrolled.value ? true : undefined),\n      },\n    });\n\n    onMounted(() => {\n      const navbarEl = el as NavbarElement;\n      const scrollContainer = findScrollContainer(el);\n\n      navbarEl.closeMobileMenu = closeMobileMenu;\n      navbarEl.openMobileMenu = openMobileMenu;\n      navbarEl.toggleMobileMenu = toggleMobileMenu;\n\n      const stopScroll = listen(\n        window,\n        'scroll',\n        () => {\n          updateScrolled(scrollContainer);\n        },\n        { passive: true },\n      );\n      const stopContainerScroll = scrollContainer\n        ? listen(\n            scrollContainer,\n            'scroll',\n            () => {\n              updateScrolled(scrollContainer);\n            },\n            { passive: true },\n          )\n        : undefined;\n      const stopEscape = listen(el, 'keydown', (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !isMobileMenuOpen.value) return;\n\n        closeMobileMenu();\n      });\n\n      let mediaCleanup: (() => void) | undefined;\n      let mobileSidebarCleanup: (() => void) | undefined;\n      let modeTransitionTimeout: ReturnType<typeof setTimeout> | undefined;\n      let previousMode: NavbarMode | undefined;\n\n      const resolveMobileSidebarTarget = () => {\n        mobileSidebarCleanup?.();\n        mobileSidebarCleanup = undefined;\n        mobileSidebarTarget.value = null;\n        isExternalMobileMode.value = false;\n        isExternalMobileOpen.value = false;\n\n        if (!String(props['mobile-sidebar'].value ?? '').trim()) return;\n\n        const target = getExternalSidebar();\n\n        if (!target) {\n          const root = el.getRootNode();\n          const discoveryRoot = root instanceof Document || root instanceof ShadowRoot ? root : document;\n          const discoveryObserver = new MutationObserver(() => {\n            if (getExternalSidebar()) resolveMobileSidebarTarget();\n          });\n\n          discoveryObserver.observe(discoveryRoot, { childList: true, subtree: true });\n          mobileSidebarCleanup = () => discoveryObserver.disconnect();\n\n          return;\n        }\n\n        const syncTargetState = (event?: CustomEvent<{ open: boolean }>) => {\n          const hasBottomNav = target.hasAttribute('data-bottom-nav');\n          const hasMobileOpen = target.hasAttribute('data-mobile-open');\n\n          isExternalMobileMode.value = hasBottomNav;\n          isExternalMobileOpen.value = event?.detail ? event.detail.open : hasMobileOpen;\n\n          // If the sidebar is reporting it's open, it must be in bottom-nav mode\n          // (either natural or forced). We honor this to avoid race conditions\n          // where attributes haven't reflected yet.\n          if (isExternalMobileOpen.value && !isExternalMobileMode.value) {\n            isExternalMobileMode.value = true;\n          }\n\n          syncMobileMode();\n        };\n\n        const targetObserver = new MutationObserver(() => {\n          syncTargetState();\n        });\n\n        syncTargetState();\n        targetObserver.observe(target, {\n          attributeFilter: ['data-bottom-nav', 'data-mobile-open'],\n          attributes: true,\n        });\n        target.addEventListener('mobile-open-change', syncTargetState as EventListener);\n        mobileSidebarCleanup = () => {\n          targetObserver.disconnect();\n          target.removeEventListener('mobile-open-change', syncTargetState as EventListener);\n        };\n        mobileSidebarTarget.value = target;\n      };\n\n      const triggerModeTransition = () => {\n        isModeTransitioning.value = true;\n\n        if (modeTransitionTimeout != null) clearTimeout(modeTransitionTimeout);\n\n        modeTransitionTimeout = setTimeout(() => {\n          isModeTransitioning.value = false;\n          modeTransitionTimeout = undefined;\n        }, 220);\n      };\n\n      const stopModeWatch = watch(\n        computed(() => props.floating.value && props.sticky.value),\n        (enabled) => {\n          if (!enabled) {\n            if (isScrolled.value) isScrolled.value = false;\n\n            if (isModeTransitioning.value) isModeTransitioning.value = false;\n\n            previousMode = undefined;\n\n            if (modeTransitionTimeout != null) {\n              clearTimeout(modeTransitionTimeout);\n              modeTransitionTimeout = undefined;\n            }\n\n            return;\n          }\n\n          resetScrollBase(scrollContainer);\n          updateScrolled(scrollContainer);\n\n          const currentMode = computeMode();\n\n          previousMode = currentMode;\n        },\n        { immediate: true },\n      );\n\n      const stopMobileSidebarWatch = watch(\n        props['mobile-sidebar'],\n        () => {\n          resolveMobileSidebarTarget();\n        },\n        { immediate: true },\n      );\n\n      const stopModeTransitionWatch = watch(\n        computed(() => computeMode()),\n        (nextMode) => {\n          const comboEnabled = props.floating.value && props.sticky.value;\n\n          if (!comboEnabled) {\n            previousMode = nextMode ?? undefined;\n\n            return;\n          }\n\n          const next = nextMode ?? undefined;\n\n          if (previousMode && next && previousMode !== next) {\n            triggerModeTransition();\n          }\n\n          previousMode = next;\n        },\n        { immediate: true },\n      );\n\n      const stopMobileMenuSlotWatch = watch(\n        hasMobileMenu,\n        (hasContent) => {\n          if (!hasContent && isMobileMenuOpen.value) {\n            closeMobileMenu();\n          }\n        },\n        { immediate: true },\n      );\n      const syncMobileMenuContent = () => {\n        hasMobileMenu.value = mobileMenuElements.value.some(hasElementContent);\n      };\n      const stopMobileMenuElementsWatch = watch(mobileMenuElements, syncMobileMenuContent, { immediate: true });\n      const mobileMenuContentObserver = new MutationObserver(() => {\n        syncMobileMenuContent();\n      });\n\n      // Parser-created demo content can populate an already-assigned slot wrapper after this\n      // custom element connects; `slotchange` alone does not observe that nested content.\n      mobileMenuContentObserver.observe(el, { childList: true, subtree: true });\n\n      watch(\n        props.breakpoint,\n        (query) => {\n          // Untrack the callback body: the watch already tracks `props.breakpoint` via\n          // its internal `read()`. Without untrack, signals read inside (e.g.\n          // `mediaMatches` via `syncMobileMode()`) become dependencies of this watch\n          // effect. When the sentinel updates `mediaMatches` on a viewport change, the\n          // effect re-runs — `EffectNode.run()` disposes the previous scope (killing the\n          // mediaHandle and its MediaQueryList listener) but the callback is NOT invoked\n          // (source unchanged), so no new handle is created. The navbar is then deaf to\n          // further MQ changes and stays stuck in mobile mode after resizing back to\n          // desktop.\n          untrack(() => {\n            mediaCleanup?.();\n            mediaCleanup = undefined;\n\n            const mediaQuery = String(query ?? '').trim();\n\n            maxWidthPx.value = parseMaxWidthPx(mediaQuery);\n            mediaMatches.value = false;\n\n            const width = readContainerWidth(el);\n\n            sizeMatches.value = width > 0 && maxWidthPx.value != null ? width <= maxWidthPx.value : false;\n            syncMobileMode();\n\n            if (props['container-breakpoints'].value && maxWidthPx.value != null) {\n              return;\n            }\n\n            if (!mediaQuery) {\n              return;\n            }\n\n            try {\n              const mediaHandle = createMediaQuery(mediaQuery);\n              const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n                if (state) {\n                  mediaMatches.value = state.matches;\n                  syncMobileMode();\n                }\n              };\n\n              syncMedia(mediaHandle.getSnapshot());\n\n              const mediaCleanupFn = watch(\n                fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n                syncMedia,\n              );\n              mediaCleanup = () => {\n                mediaCleanupFn.dispose();\n                mediaHandle.dispose();\n              };\n            } catch (error) {\n              if (!(error instanceof SentinelUnavailableError)) throw error;\n            }\n          });\n        },\n        { immediate: true },\n      );\n\n      const stopResizeEffect =\n        typeof ResizeObserver === 'function'\n          ? (() => {\n              const hostSize = createElementSize(el);\n              onCleanup(() => hostSize.dispose());\n              const hostSizeSignal = fromSubscribable(hostSize, { signal: hostSize.disposalSignal });\n\n              const wrapperEl = el.parentElement;\n              const containerEl = resolveContainerElement(el);\n              const wrapperSize = wrapperEl ? createElementSize(wrapperEl) : undefined;\n              const parentSize = containerEl && containerEl !== wrapperEl ? createElementSize(containerEl) : undefined;\n\n              if (wrapperSize) {\n                onCleanup(() => wrapperSize.dispose());\n              }\n              if (parentSize) {\n                onCleanup(() => parentSize.dispose());\n              }\n\n              const wrapperSizeSignal = wrapperSize\n                ? fromSubscribable(wrapperSize, { signal: wrapperSize.disposalSignal })\n                : undefined;\n              const parentSizeSignal = parentSize\n                ? fromSubscribable(parentSize, { signal: parentSize.disposalSignal })\n                : undefined;\n\n              return watch(\n                computed(() => [\n                  hostSizeSignal.value?.width,\n                  hostSizeSignal.value?.height,\n                  wrapperSizeSignal?.value?.width,\n                  wrapperSizeSignal?.value?.height,\n                  parentSizeSignal?.value?.width,\n                  parentSizeSignal?.value?.height,\n                ]),\n                () => {\n                  const width = readContainerWidth(el);\n                  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n                  sizeMatches.value = width > 0 && maxWidthPx.value != null ? width <= maxWidthPx.value : false;\n                  isPreviewMode.value = parentWidth > 0 && parentWidth < window.innerWidth;\n                  syncMobileMode();\n                },\n              );\n            })()\n          : undefined;\n\n      return () => {\n        stopEscape?.();\n        stopScroll?.();\n        stopContainerScroll?.();\n        stopModeWatch?.dispose();\n        stopModeTransitionWatch?.dispose();\n        stopMobileMenuSlotWatch?.dispose();\n        stopMobileMenuElementsWatch?.dispose();\n        stopMobileSidebarWatch?.dispose();\n        mobileMenuContentObserver.disconnect();\n        mediaCleanup?.();\n        mobileSidebarCleanup?.();\n        stopResizeEffect?.dispose();\n\n        if (modeTransitionTimeout != null) {\n          clearTimeout(modeTransitionTimeout);\n          modeTransitionTimeout = undefined;\n        }\n      };\n    });\n\n    return html`\n      <nav part=\"nav\" aria-label=\"${props.label}\">\n        <div class=\"navbar\" part=\"bar\">\n          <div class=\"navbar-logo\" part=\"logo\" ?hidden=${() => !hasLogo.value}>\n            <slot name=\"logo\"></slot>\n          </div>\n\n          <div class=\"navbar-start\" part=\"start\">\n            <slot name=\"start\"></slot>\n          </div>\n\n          <div class=\"navbar-center\" part=\"center\">\n            <slot></slot>\n          </div>\n\n          <div class=\"navbar-end\" part=\"end\">\n            <slot name=\"end\"></slot>\n          </div>\n\n          <button\n            class=\"mobile-toggle\"\n            part=\"mobile-toggle\"\n            type=\"button\"\n            aria-label=\"${() =>\n              (hasMobileMenu.value ? isMobileMenuOpen.value : isExternalMobileOpen.value)\n                ? props['menu-close-label'].value\n                : props['menu-open-label'].value}\"\n            aria-controls=\"mobile-menu-panel\"\n            aria-expanded=\"${() => String(hasMobileMenu.value ? isMobileMenuOpen.value : isExternalMobileOpen.value)}\"\n            ?hidden=${() => !isMobile.value || (!hasMobileMenu.value && !mobileSidebarTarget.value)}\n            @click=\"${toggleMobileMenu}\">\n            <ore-icon\n              name=\"${() => ((hasMobileMenu.value ? isMobileMenuOpen.value : isExternalMobileOpen.value) ? 'x' : 'menu')}\"\n              size=\"18\"\n              stroke-width=\"2.5\"\n              aria-hidden=\"true\"></ore-icon>\n          </button>\n        </div>\n\n        <div\n          id=\"mobile-menu-panel\"\n          class=\"mobile-menu-panel\"\n          part=\"mobile-menu\"\n          role=\"navigation\"\n          aria-label=\"${() => `${props.label.value} mobile menu`}\"\n          ?hidden=${() => !isMobile.value || !isMobileMenuOpen.value || !hasMobileMenu.value}>\n          <slot name=\"mobile-menu\"></slot>\n        </div>\n      </nav>\n    `;\n  },\n  styles: [\n    colorThemeMixin,\n    elevationMixin,\n    roundedVariantMixin,\n    coarsePointerMixin,\n    reducedMotionMixin,\n    frostVariantMixin('.navbar'),\n    navbarStyles,\n  ],\n});\n\n/**\n * `ore-navbar-item` — Navigation item for navbar slots.\n *\n * Renders as an anchor when `href` is provided and item is not disabled.\n *\n * @element ore-navbar-item\n *\n * @attr {boolean} active - Marks item as the current active route\n * @attr {boolean} disabled - Disables interaction\n * @attr {string} href - Link URL; renders as `<a>` when set\n * @attr {boolean} icon-only - Compact, symmetric padding for items with no visible label\n * @attr {string} rel - Anchor `rel` attribute (links only)\n * @attr {string} target - Anchor `target` attribute (links only)\n *\n * @slot - Item label\n * @slot icon - Optional icon before the label\n *\n * @part item - Root clickable element (anchor or button).\n * @part item-icon - Leading icon container.\n * @part item-label - Label text container.\n * @part item-end - Trailing content container.\n *\n * @example\n * ```html\n * <ore-navbar-item href=\"/home\">Home</ore-navbar-item>\n * <ore-navbar-item href=\"/docs\" active>Docs</ore-navbar-item>\n * <ore-navbar-item href=\"/about\" target=\"_blank\" rel=\"noopener\">About</ore-navbar-item>\n * <ore-navbar-item disabled>Disabled</ore-navbar-item>\n * <ore-navbar-item icon-only aria-label=\"Search\"><ore-icon slot=\"icon\" name=\"search\"></ore-icon></ore-navbar-item>\n * ```\n */\nexport const NAVBAR_ITEM_TAG = 'ore-navbar-item' as const;\ndefine<OreNavbarItemProps>(NAVBAR_ITEM_TAG, {\n  props: {\n    active: prop.bool(false),\n    disabled: prop.bool(false),\n    href: prop.string(),\n    'icon-only': prop.bool(false),\n    rel: prop.string(),\n    target: prop.string(),\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const hasEnd = () => slots.has('end').value;\n    const navbarCtx = inject(NAVBAR_CTX);\n\n    bind({\n      attr: {\n        'navbar-mobile': () => (navbarCtx?.isMobile.value ? true : undefined),\n        'navbar-mobile-open': () => (navbarCtx?.mobileMenuOpen.value ? true : undefined),\n      },\n    });\n\n    const isLink = () => Boolean(props.href.value) && !props.disabled.value;\n\n    // Prevent reverse tabnapping: auto-inject noopener + noreferrer for _blank links.\n    const effectiveRel = computed(() => computeSafeRel(props.rel.value, props.target.value));\n\n    // Closes the mobile overflow panel when one of its items is activated — otherwise picking a\n    // destination (or firing any other action placed in the `mobile-menu` slot) leaves the panel\n    // open over the page until the user separately taps the toggle again. Only matters while\n    // actually in mobile mode; on desktop `navbarCtx.mobileMenuOpen` is never true to begin with,\n    // so `closeMobileMenu()` (idempotent — see `setMobileMenu`'s equality check) is a no-op there.\n    const closeMobileMenuIfOpen = (): void => {\n      if (navbarCtx?.mobileMenuOpen.value) navbarCtx.closeMobileMenu();\n    };\n\n    const renderItemContent = () => html`\n      <span class=\"item-icon\" part=\"item-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n        <slot name=\"icon\"></slot>\n      </span>\n      <span class=\"item-label\" part=\"item-label\"><slot></slot></span>\n      <span class=\"item-end\" part=\"item-end\" ?hidden=${() => !hasEnd()}>\n        <slot name=\"end\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${() => {\n        if (isLink()) {\n          return html`\n            <a\n              class=\"item\"\n              part=\"item\"\n              href=\"${props.href}\"\n              rel=\"${effectiveRel}\"\n              target=\"${props.target}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n              @click=${closeMobileMenuIfOpen}>\n              ${renderItemContent()}\n            </a>\n          `;\n        }\n\n        if (props.disabled.value) {\n          return html`\n            <div class=\"item\" part=\"item\" tabindex=\"-1\" aria-disabled=\"true\">${renderItemContent()}</div>\n          `;\n        }\n\n        return html`\n          <button class=\"item\" part=\"item\" type=\"button\" @click=${closeMobileMenuIfOpen}>${renderItemContent()}</button>\n        `;\n      }}\n    `;\n  },\n  styles: [coarsePointerMixin, navbarStyles],\n});\n"],"mappings":"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"}
+{"version":3,"file":"navbar.js","names":[],"sources":["../src/layout/navbar/navbar.ts"],"sourcesContent":["import {\n  bind,\n  createContext,\n  define,\n  getHost,\n  html,\n  inject,\n  onCleanup,\n  onMounted,\n  prop,\n  provide,\n  useEmit,\n  useSlots,\n} from '@vielzeug/ore';\nimport { computed, fromSubscribable, type Readable, signal, untrack, watch } from '@vielzeug/ripple';\nimport { createElementSize, createMediaQuery, SentinelUnavailableError } from '@vielzeug/sentinel';\n\nimport type { ElevationLevel, RoundedSize, ThemeColor, VisualVariant } from '../../types';\n\nimport '../../content/icon/icon';\nimport {\n  coarsePointerMixin,\n  colorThemeMixin,\n  elevationMixin,\n  frostVariantMixin,\n  reducedMotionMixin,\n  roundedVariantMixin,\n} from '../../styles';\nimport { computeSafeRel } from '../../utils';\nimport navbarStyles from './navbar.css?inline';\n\nconst listen = <E extends Event = Event>(\n  el: EventTarget | null | undefined,\n  name: string,\n  handler: (e: E) => void,\n  options?: AddEventListenerOptions,\n): (() => void) => {\n  if (!el) return () => {};\n\n  el.addEventListener(name, handler as EventListener, options);\n\n  return () => el.removeEventListener(name, handler as EventListener, options);\n};\n\ntype NavbarMode = 'floating' | 'sticky';\n\nconst hasElementContent = (el: Element): boolean => {\n  if (!(el instanceof HTMLElement)) return true;\n\n  if (el.tagName.includes('-')) return true;\n\n  if (el.childElementCount > 0) return true;\n\n  return (el.textContent ?? '').trim().length > 0;\n};\n\nconst parseMaxWidthPx = (query: string | undefined): number | undefined => {\n  const value = String(query ?? '').trim();\n\n  if (!value) return undefined;\n\n  const match = /max-width\\s*:\\s*([0-9]+(?:\\.[0-9]+)?)px/i.exec(value);\n\n  if (!match) return undefined;\n\n  const parsed = Number.parseFloat(match[1]);\n\n  return Number.isFinite(parsed) ? parsed : undefined;\n};\n\nconst resolveContainerElement = (el: HTMLElement): HTMLElement | null => {\n  let container = el.parentElement;\n\n  while (container?.tagName.toLowerCase() === 'ore-grid-item') {\n    container = container.parentElement;\n  }\n\n  return container;\n};\n\nconst readContainerWidth = (el: HTMLElement): number => {\n  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n  if (parentWidth > 0) return parentWidth;\n\n  return el.offsetWidth;\n};\n\nconst findScrollContainer = (start: HTMLElement): HTMLElement | null => {\n  let current: HTMLElement | null = start.parentElement;\n\n  while (current) {\n    const styles = window.getComputedStyle(current);\n    const overflowY = styles.overflowY;\n\n    if (overflowY === 'auto' || overflowY === 'scroll' || overflowY === 'overlay') {\n      return current;\n    }\n\n    current = current.parentElement;\n  }\n\n  return null;\n};\n\n/** Context provided by `ore-navbar` to `ore-navbar-item` children. */\nexport type NavbarContext = {\n  closeMobileMenu: () => void;\n  isMobile: Readable<boolean>;\n  mobileMenuOpen: Readable<boolean>;\n};\n\n/** Injection key for navbar context. */\nexport const NAVBAR_CTX = createContext<NavbarContext>('NavbarContext');\n\n/** Navbar component events */\nexport type OreNavbarEvents = {\n  'mobile-menu-change': { open: boolean };\n};\n\n/** Navbar component element interface */\nexport type NavbarElement = HTMLElement &\n  OreNavbarProps & {\n    closeMobileMenu(): void;\n    openMobileMenu(): void;\n    toggleMobileMenu(): void;\n  };\n\ntype MobileSidebarElement = HTMLElement & {\n  closeMobile?: () => void;\n  openMobile?: () => void;\n  toggleMobile?: () => void;\n};\n\n/** Navbar component properties */\nexport type OreNavbarProps = {\n  /** CSS media query used for mobile layout switching */\n  breakpoint?: string;\n  /** Theme color */\n  color?: ThemeColor;\n  /** Evaluate mobile breakpoint against container width only when possible. */\n  'container-breakpoints'?: boolean;\n  /** Shadow elevation level (0-5) */\n  elevation?: ElevationLevel;\n  /** Start as detached floating navbar */\n  floating?: boolean;\n  /** Accessible nav landmark label */\n  label?: string;\n  /** Icon shown while the mobile menu is open */\n  'menu-close-icon'?: string;\n  'menu-close-label'?: string;\n  /** Icon shown while the mobile menu is closed */\n  'menu-icon'?: string;\n  'menu-open-label'?: string;\n  /** CSS selector for an external sidebar toggled by the mobile button */\n  'mobile-sidebar'?: string;\n  /** Border radius size */\n  rounded?: RoundedSize;\n  /** Scroll threshold in px used by floating+sticky transition */\n  'scroll-threshold'?: number;\n  /** Stick to top of viewport */\n  sticky?: boolean;\n  /** Visual style variant */\n  variant?: Exclude<VisualVariant, 'ghost' | 'text'>;\n};\n\n/** Navbar item properties */\nexport type OreNavbarItemProps = {\n  /** Whether this item represents the current page */\n  active?: boolean;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Link target URL. Renders an anchor when provided. */\n  href?: string;\n  /**\n   * Icon-only mode — hides the (empty) label region and switches to compact, symmetric\n   * padding instead of the icon+label layout's wider horizontal padding. Set this whenever\n   * the default slot is intentionally left empty (name conveyed via `aria-label` instead),\n   * otherwise the empty label still reserves its inter-element gap and the item ends up\n   * with lopsided padding around the icon.\n   */\n  'icon-only'?: boolean;\n  /** Relationship of linked URL (anchor-only) */\n  rel?: string;\n  /** Browsing context for link (anchor-only) */\n  target?: string;\n};\n\n/**\n * `ore-navbar` — Responsive navigation with sticky/floating modes and a mobile overflow panel.\n *\n * @element ore-navbar\n * @element ore-navbar-item - Navigation link or button placed in the default or mobile-menu slot\n *\n * @attr {string} label - Accessible nav landmark label\n * @attr {string} menu-icon - Icon shown while the mobile menu is closed\n * @attr {string} menu-close-icon - Icon shown while the mobile menu is open\n * @attr {boolean} sticky - Makes navbar sticky at top\n * @attr {boolean} floating - Makes navbar detached and floating\n * @attr {number} scroll-threshold - Scroll threshold for floating+sticky transition\n * @attr {string} breakpoint - CSS media query used for mobile mode\n * @attr {boolean} container-breakpoints - Evaluates parseable max-width breakpoints against container width\n * @attr {string} variant - Visual variant: 'flat' | 'solid' | 'bordered' | 'outline' | 'frost'\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} elevation - Shadow elevation: '0' | '1' | '2' | '3' | '4' | '5'\n *\n * @fires mobile-menu-change - Emitted when mobile menu open state changes. detail: { open: boolean }\n *\n * @slot logo - Brand/logo content rendered at the leading edge\n * @slot start - Content rendered in the left/start region\n * @slot - Center navigation content rendered between the start and end regions\n * @slot end - Content rendered in the right/end region\n * @slot mobile-menu - Controls and links rendered inside the mobile overflow panel\n *\n * @cssprop --navbar-height - Navbar bar height\n * @cssprop --navbar-width - Max width of the navbar content\n * @cssprop --navbar-offset - Horizontal offset for floating/sticky positioning\n * @cssprop --navbar-bg - Navbar background color\n * @cssprop --navbar-color - Navbar text color\n * @cssprop --navbar-border-color - Navbar border color\n * @cssprop --navbar-shadow - Navbar box shadow\n * @cssprop --navbar-radius - Border radius (floating/sticky modes)\n * @cssprop --navbar-backdrop-filter - Backdrop filter for blur effect\n * @cssprop --navbar-item-color - Nav item text color\n * @cssprop --navbar-item-hover-color - Nav item hover text color\n * @cssprop --navbar-item-hover-bg - Nav item hover background\n * @cssprop --navbar-item-active-color - Nav item active/current text color\n * @cssprop --navbar-item-active-bg - Nav item active/current background\n * @part nav - Outer navigation landmark\n * @part bar - Main navbar row container\n * @part logo - Logo slot container\n * @part start - Leading action/content region\n * @part center - Center content region\n * @part end - Trailing action/content region\n * @part mobile-toggle - Mobile menu toggle button\n * @part mobile-menu - Mobile overflow panel\n * @part item-icon - Leading icon inside navbar items\n * @part item-label - Label text inside navbar items\n * @part item-end - Trailing content inside navbar items\n * @part item - Clickable navbar item root\n * @example\n * ```html\n * <ore-navbar sticky elevation=\"1\">\n *   <a href=\"/\" slot=\"logo\"><strong>MyApp</strong></a>\n *   <ore-navbar-item href=\"/dashboard\">Dashboard</ore-navbar-item>\n *   <ore-navbar-item href=\"/docs\">Docs</ore-navbar-item>\n *   <ore-button slot=\"end\" variant=\"solid\" color=\"primary\" size=\"sm\">Sign in</ore-button>\n * </ore-navbar>\n * ```\n */\nexport const NAVBAR_TAG = 'ore-navbar' as const;\ndefine<OreNavbarProps>(NAVBAR_TAG, {\n  props: {\n    breakpoint: prop.string('(max-width: 768px)'),\n    color: prop.string<ThemeColor>(),\n    'container-breakpoints': prop.bool(false),\n    elevation: prop.number<ElevationLevel>(),\n    floating: prop.bool(false),\n    label: prop.string('Main navigation'),\n    'menu-close-icon': prop.string('x'),\n    'menu-close-label': prop.string('Close navigation menu'),\n    'menu-icon': prop.string('menu'),\n    'menu-open-label': prop.string('Open navigation menu'),\n    'mobile-sidebar': prop.string(),\n    rounded: prop.string<RoundedSize>(),\n    'scroll-threshold': prop.number(80),\n    sticky: prop.bool(false),\n    variant: prop.string<Exclude<VisualVariant, 'ghost' | 'text'>>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreNavbarEvents>();\n    const slots = useSlots();\n\n    const hasLogo = slots.has('logo');\n    const hasStart = slots.has('start');\n    const hasCenter = slots.has();\n    const hasEnd = slots.has('end');\n    const mobileMenuElements = slots.elements('mobile-menu');\n    const hasMobileMenu = signal(false);\n    const mobileSidebarTarget = signal<MobileSidebarElement | null>(null);\n    const isExternalMobileMode = signal(false);\n    const isExternalMobileOpen = signal(false);\n    const isMobile = signal(false);\n    const isMobileMenuOpen = signal(false);\n    const isModeTransitioning = signal(false);\n    const isScrolled = signal(false);\n    const scrollBase = signal(0);\n    const mediaMatches = signal(false);\n    const sizeMatches = signal(false);\n    const maxWidthPx = signal<number | undefined>(parseMaxWidthPx(props.breakpoint.value));\n    const isPreviewMode = signal(false);\n\n    const getExternalSidebar = () => {\n      const selector = String(props['mobile-sidebar'].value ?? '').trim();\n\n      if (!selector) return null;\n\n      const root = el.getRootNode();\n      const scopedTarget =\n        root instanceof ShadowRoot || root instanceof Document\n          ? (root.querySelector(selector) as MobileSidebarElement | null)\n          : null;\n\n      return scopedTarget ?? (document.querySelector(selector) as MobileSidebarElement | null);\n    };\n\n    provide(NAVBAR_CTX, {\n      // Wrapped, not passed directly — `closeMobileMenu` (below) isn't defined yet at this point\n      // in `setup()`; by the time `ore-navbar-item` actually calls this (a later click), it is.\n      closeMobileMenu: () => closeMobileMenu(),\n      isMobile: computed(() => isMobile.value) as Readable<boolean>,\n      mobileMenuOpen: computed(() => isMobileMenuOpen.value) as Readable<boolean>,\n    });\n\n    const computeMode = (): NavbarMode | undefined => {\n      if (props.floating.value && props.sticky.value) {\n        return isScrolled.value ? 'sticky' : 'floating';\n      }\n\n      if (props.floating.value) return 'floating';\n\n      if (props.sticky.value) return 'sticky';\n\n      return undefined;\n    };\n\n    const setMobileMenu = (next: boolean) => {\n      const open = Boolean(next);\n\n      if (!hasMobileMenu.value) {\n        const target = mobileSidebarTarget.value ?? getExternalSidebar();\n\n        if (target) {\n          if (open) {\n            target.openMobile?.();\n          } else {\n            target.closeMobile?.();\n          }\n\n          return;\n        }\n      }\n\n      if (open && !hasMobileMenu.value) return;\n\n      if (isMobileMenuOpen.value === open) return;\n\n      isMobileMenuOpen.value = open;\n      emit('mobile-menu-change', { open });\n    };\n\n    const closeMobileMenu = () => setMobileMenu(false);\n    const openMobileMenu = () => setMobileMenu(true);\n    const toggleMobileMenu = () => {\n      if (!hasMobileMenu.value) {\n        const target = mobileSidebarTarget.value ?? getExternalSidebar();\n\n        if (target) {\n          if (typeof target.toggleMobile === 'function') {\n            target.toggleMobile();\n          } else if (typeof target.openMobile === 'function' && typeof target.closeMobile === 'function') {\n            const isOpen = target.hasAttribute('data-mobile-open');\n\n            if (isOpen) target.closeMobile();\n            else target.openMobile();\n          }\n\n          return;\n        }\n      }\n\n      setMobileMenu(!isMobileMenuOpen.value);\n    };\n\n    const syncMobileMode = () => {\n      const next =\n        (mobileSidebarTarget.value && !hasMobileMenu.value ? isExternalMobileMode.value : false) ||\n        mediaMatches.value ||\n        (Boolean(props['container-breakpoints'].value) && sizeMatches.value);\n\n      isMobile.value = next;\n\n      if (!next) closeMobileMenu();\n    };\n\n    const readScrollOffset = (scrollContainer: HTMLElement | null): number => {\n      if (scrollContainer) {\n        return scrollContainer.scrollTop || 0;\n      }\n\n      return window.scrollY || document.documentElement.scrollTop || 0;\n    };\n\n    const resetScrollBase = (scrollContainer: HTMLElement | null) => {\n      scrollBase.value = readScrollOffset(scrollContainer);\n    };\n\n    const updateScrolled = (scrollContainer: HTMLElement | null = null) => {\n      if (!(props.floating.value && props.sticky.value)) {\n        if (isScrolled.value) isScrolled.value = false;\n\n        return;\n      }\n\n      const threshold = Math.max(0, Number(props['scroll-threshold'].value) || 0);\n      const currentOffset = readScrollOffset(scrollContainer);\n      const delta = currentOffset - scrollBase.value;\n\n      isScrolled.value = delta > threshold;\n    };\n\n    bind({\n      attr: {\n        'data-mobile': () => (isMobile.value ? true : undefined),\n        'data-mobile-open': () => (isMobile.value && isMobileMenuOpen.value ? true : undefined),\n        'data-mode': () => computeMode() ?? null,\n        'data-mode-transitioning': () => (isModeTransitioning.value ? true : undefined),\n        'data-preview-mode': () => (isPreviewMode.value ? true : undefined),\n        'data-scrolled': () => (props.floating.value && props.sticky.value && isScrolled.value ? true : undefined),\n      },\n    });\n\n    onMounted(() => {\n      const navbarEl = el as NavbarElement;\n      const scrollContainer = findScrollContainer(el);\n\n      navbarEl.closeMobileMenu = closeMobileMenu;\n      navbarEl.openMobileMenu = openMobileMenu;\n      navbarEl.toggleMobileMenu = toggleMobileMenu;\n\n      const stopScroll = listen(\n        window,\n        'scroll',\n        () => {\n          updateScrolled(scrollContainer);\n        },\n        { passive: true },\n      );\n      const stopContainerScroll = scrollContainer\n        ? listen(\n            scrollContainer,\n            'scroll',\n            () => {\n              updateScrolled(scrollContainer);\n            },\n            { passive: true },\n          )\n        : undefined;\n      const stopEscape = listen(el, 'keydown', (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !isMobileMenuOpen.value) return;\n\n        closeMobileMenu();\n      });\n\n      let mediaCleanup: (() => void) | undefined;\n      let mobileSidebarCleanup: (() => void) | undefined;\n      let modeTransitionTimeout: ReturnType<typeof setTimeout> | undefined;\n      let previousMode: NavbarMode | undefined;\n\n      const resolveMobileSidebarTarget = () => {\n        mobileSidebarCleanup?.();\n        mobileSidebarCleanup = undefined;\n        mobileSidebarTarget.value = null;\n        isExternalMobileMode.value = false;\n        isExternalMobileOpen.value = false;\n\n        if (!String(props['mobile-sidebar'].value ?? '').trim()) return;\n\n        const target = getExternalSidebar();\n\n        if (!target) {\n          const root = el.getRootNode();\n          const discoveryRoot = root instanceof Document || root instanceof ShadowRoot ? root : document;\n          const discoveryObserver = new MutationObserver(() => {\n            if (getExternalSidebar()) resolveMobileSidebarTarget();\n          });\n\n          discoveryObserver.observe(discoveryRoot, { childList: true, subtree: true });\n          mobileSidebarCleanup = () => discoveryObserver.disconnect();\n\n          return;\n        }\n\n        const syncTargetState = (event?: CustomEvent<{ open: boolean }>) => {\n          const hasBottomNav = target.hasAttribute('data-bottom-nav');\n          const hasMobileOpen = target.hasAttribute('data-mobile-open');\n\n          isExternalMobileMode.value = hasBottomNav;\n          isExternalMobileOpen.value = event?.detail ? event.detail.open : hasMobileOpen;\n\n          // If the sidebar is reporting it's open, it must be in bottom-nav mode\n          // (either natural or forced). We honor this to avoid race conditions\n          // where attributes haven't reflected yet.\n          if (isExternalMobileOpen.value && !isExternalMobileMode.value) {\n            isExternalMobileMode.value = true;\n          }\n\n          syncMobileMode();\n        };\n\n        const targetObserver = new MutationObserver(() => {\n          syncTargetState();\n        });\n\n        syncTargetState();\n        targetObserver.observe(target, {\n          attributeFilter: ['data-bottom-nav', 'data-mobile-open'],\n          attributes: true,\n        });\n        target.addEventListener('mobile-open-change', syncTargetState as EventListener);\n        mobileSidebarCleanup = () => {\n          targetObserver.disconnect();\n          target.removeEventListener('mobile-open-change', syncTargetState as EventListener);\n        };\n        mobileSidebarTarget.value = target;\n      };\n\n      const triggerModeTransition = () => {\n        isModeTransitioning.value = true;\n\n        if (modeTransitionTimeout != null) clearTimeout(modeTransitionTimeout);\n\n        modeTransitionTimeout = setTimeout(() => {\n          isModeTransitioning.value = false;\n          modeTransitionTimeout = undefined;\n        }, 220);\n      };\n\n      const stopModeWatch = watch(\n        computed(() => props.floating.value && props.sticky.value),\n        (enabled) => {\n          if (!enabled) {\n            if (isScrolled.value) isScrolled.value = false;\n\n            if (isModeTransitioning.value) isModeTransitioning.value = false;\n\n            previousMode = undefined;\n\n            if (modeTransitionTimeout != null) {\n              clearTimeout(modeTransitionTimeout);\n              modeTransitionTimeout = undefined;\n            }\n\n            return;\n          }\n\n          resetScrollBase(scrollContainer);\n          updateScrolled(scrollContainer);\n\n          const currentMode = computeMode();\n\n          previousMode = currentMode;\n        },\n        { immediate: true },\n      );\n\n      const stopMobileSidebarWatch = watch(\n        props['mobile-sidebar'],\n        () => {\n          resolveMobileSidebarTarget();\n        },\n        { immediate: true },\n      );\n\n      const stopModeTransitionWatch = watch(\n        computed(() => computeMode()),\n        (nextMode) => {\n          const comboEnabled = props.floating.value && props.sticky.value;\n\n          if (!comboEnabled) {\n            previousMode = nextMode ?? undefined;\n\n            return;\n          }\n\n          const next = nextMode ?? undefined;\n\n          if (previousMode && next && previousMode !== next) {\n            triggerModeTransition();\n          }\n\n          previousMode = next;\n        },\n        { immediate: true },\n      );\n\n      const stopMobileMenuSlotWatch = watch(\n        hasMobileMenu,\n        (hasContent) => {\n          if (!hasContent && isMobileMenuOpen.value) {\n            closeMobileMenu();\n          }\n        },\n        { immediate: true },\n      );\n      const syncMobileMenuContent = () => {\n        hasMobileMenu.value = mobileMenuElements.value.some(hasElementContent);\n      };\n      const stopMobileMenuElementsWatch = watch(mobileMenuElements, syncMobileMenuContent, { immediate: true });\n      const mobileMenuContentObserver = new MutationObserver(() => {\n        syncMobileMenuContent();\n      });\n\n      // Parser-created demo content can populate an already-assigned slot wrapper after this\n      // custom element connects; `slotchange` alone does not observe that nested content.\n      mobileMenuContentObserver.observe(el, { childList: true, subtree: true });\n\n      watch(\n        props.breakpoint,\n        (query) => {\n          // Untrack the callback body: the watch already tracks `props.breakpoint` via\n          // its internal `read()`. Without untrack, signals read inside (e.g.\n          // `mediaMatches` via `syncMobileMode()`) become dependencies of this watch\n          // effect. When the sentinel updates `mediaMatches` on a viewport change, the\n          // effect re-runs — `EffectNode.run()` disposes the previous scope (killing the\n          // mediaHandle and its MediaQueryList listener) but the callback is NOT invoked\n          // (source unchanged), so no new handle is created. The navbar is then deaf to\n          // further MQ changes and stays stuck in mobile mode after resizing back to\n          // desktop.\n          untrack(() => {\n            mediaCleanup?.();\n            mediaCleanup = undefined;\n\n            const mediaQuery = String(query ?? '').trim();\n\n            maxWidthPx.value = parseMaxWidthPx(mediaQuery);\n            mediaMatches.value = false;\n\n            const width = readContainerWidth(el);\n\n            sizeMatches.value = width > 0 && maxWidthPx.value != null ? width <= maxWidthPx.value : false;\n            syncMobileMode();\n\n            if (props['container-breakpoints'].value && maxWidthPx.value != null) {\n              return;\n            }\n\n            if (!mediaQuery) {\n              return;\n            }\n\n            try {\n              const mediaHandle = createMediaQuery(mediaQuery);\n              const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n                if (state) {\n                  mediaMatches.value = state.matches;\n                  syncMobileMode();\n                }\n              };\n\n              syncMedia(mediaHandle.getSnapshot());\n\n              const mediaCleanupFn = watch(\n                fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n                syncMedia,\n              );\n              mediaCleanup = () => {\n                mediaCleanupFn.dispose();\n                mediaHandle.dispose();\n              };\n            } catch (error) {\n              if (!(error instanceof SentinelUnavailableError)) throw error;\n            }\n          });\n        },\n        { immediate: true },\n      );\n\n      const stopResizeEffect =\n        typeof ResizeObserver === 'function'\n          ? (() => {\n              const hostSize = createElementSize(el);\n              onCleanup(() => hostSize.dispose());\n              const hostSizeSignal = fromSubscribable(hostSize, { signal: hostSize.disposalSignal });\n\n              const wrapperEl = el.parentElement;\n              const containerEl = resolveContainerElement(el);\n              const wrapperSize = wrapperEl ? createElementSize(wrapperEl) : undefined;\n              const parentSize = containerEl && containerEl !== wrapperEl ? createElementSize(containerEl) : undefined;\n\n              if (wrapperSize) {\n                onCleanup(() => wrapperSize.dispose());\n              }\n              if (parentSize) {\n                onCleanup(() => parentSize.dispose());\n              }\n\n              const wrapperSizeSignal = wrapperSize\n                ? fromSubscribable(wrapperSize, { signal: wrapperSize.disposalSignal })\n                : undefined;\n              const parentSizeSignal = parentSize\n                ? fromSubscribable(parentSize, { signal: parentSize.disposalSignal })\n                : undefined;\n\n              return watch(\n                computed(() => [\n                  hostSizeSignal.value?.width,\n                  hostSizeSignal.value?.height,\n                  wrapperSizeSignal?.value?.width,\n                  wrapperSizeSignal?.value?.height,\n                  parentSizeSignal?.value?.width,\n                  parentSizeSignal?.value?.height,\n                ]),\n                () => {\n                  const width = readContainerWidth(el);\n                  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n                  sizeMatches.value = width > 0 && maxWidthPx.value != null ? width <= maxWidthPx.value : false;\n                  isPreviewMode.value = parentWidth > 0 && parentWidth < window.innerWidth;\n                  syncMobileMode();\n                },\n              );\n            })()\n          : undefined;\n\n      return () => {\n        stopEscape?.();\n        stopScroll?.();\n        stopContainerScroll?.();\n        stopModeWatch?.dispose();\n        stopModeTransitionWatch?.dispose();\n        stopMobileMenuSlotWatch?.dispose();\n        stopMobileMenuElementsWatch?.dispose();\n        stopMobileSidebarWatch?.dispose();\n        mobileMenuContentObserver.disconnect();\n        mediaCleanup?.();\n        mobileSidebarCleanup?.();\n        stopResizeEffect?.dispose();\n\n        if (modeTransitionTimeout != null) {\n          clearTimeout(modeTransitionTimeout);\n          modeTransitionTimeout = undefined;\n        }\n      };\n    });\n\n    return html`\n      <nav part=\"nav\" aria-label=\"${props.label}\">\n        <div class=\"navbar\" part=\"bar\">\n          <div class=\"navbar-logo\" part=\"logo\" ?hidden=${() => !hasLogo.value}>\n            <slot name=\"logo\"></slot>\n          </div>\n\n          <div class=\"navbar-start\" part=\"start\" ?hidden=${() => !hasStart.value}>\n            <slot name=\"start\"></slot>\n          </div>\n\n          <div class=\"navbar-center\" part=\"center\" ?hidden=${() => !hasCenter.value}>\n            <slot></slot>\n          </div>\n\n          <div class=\"navbar-end\" part=\"end\" ?hidden=${() => !hasEnd.value}>\n            <slot name=\"end\"></slot>\n          </div>\n\n          <button\n            class=\"mobile-toggle\"\n            part=\"mobile-toggle\"\n            type=\"button\"\n            aria-label=\"${() =>\n              (hasMobileMenu.value ? isMobileMenuOpen.value : isExternalMobileOpen.value)\n                ? props['menu-close-label'].value\n                : props['menu-open-label'].value}\"\n            aria-controls=\"mobile-menu-panel\"\n            aria-expanded=\"${() => String(hasMobileMenu.value ? isMobileMenuOpen.value : isExternalMobileOpen.value)}\"\n            ?hidden=${() => !isMobile.value || (!hasMobileMenu.value && !mobileSidebarTarget.value)}\n            @click=\"${toggleMobileMenu}\">\n            <ore-icon\n              name=\"${() =>\n                (hasMobileMenu.value ? isMobileMenuOpen.value : isExternalMobileOpen.value)\n                  ? props['menu-close-icon'].value\n                  : props['menu-icon'].value}\"\n              size=\"18\"\n              stroke-width=\"2.5\"\n              aria-hidden=\"true\"></ore-icon>\n          </button>\n        </div>\n\n        <div\n          id=\"mobile-menu-panel\"\n          class=\"mobile-menu-panel\"\n          part=\"mobile-menu\"\n          role=\"navigation\"\n          aria-label=\"${() => `${props.label.value} mobile menu`}\"\n          ?hidden=${() => !isMobile.value || !isMobileMenuOpen.value || !hasMobileMenu.value}>\n          <slot name=\"mobile-menu\"></slot>\n        </div>\n      </nav>\n    `;\n  },\n  styles: [\n    colorThemeMixin,\n    elevationMixin,\n    roundedVariantMixin,\n    coarsePointerMixin,\n    reducedMotionMixin,\n    frostVariantMixin('.navbar'),\n    navbarStyles,\n  ],\n});\n\n/**\n * `ore-navbar-item` — Navigation item for navbar slots.\n *\n * Renders as an anchor when `href` is provided and item is not disabled.\n *\n * @element ore-navbar-item\n *\n * @attr {boolean} active - Marks item as the current active route\n * @attr {boolean} disabled - Disables interaction\n * @attr {string} href - Link URL; renders as `<a>` when set\n * @attr {boolean} icon-only - Compact, symmetric padding for items with no visible label\n * @attr {string} rel - Anchor `rel` attribute (links only)\n * @attr {string} target - Anchor `target` attribute (links only)\n *\n * @slot - Item label\n * @slot icon - Optional icon before the label\n *\n * @part item - Root clickable element (anchor or button).\n * @part item-icon - Leading icon container.\n * @part item-label - Label text container.\n * @part item-end - Trailing content container.\n *\n * @example\n * ```html\n * <ore-navbar-item href=\"/home\">Home</ore-navbar-item>\n * <ore-navbar-item href=\"/docs\" active>Docs</ore-navbar-item>\n * <ore-navbar-item href=\"/about\" target=\"_blank\" rel=\"noopener\">About</ore-navbar-item>\n * <ore-navbar-item disabled>Disabled</ore-navbar-item>\n * <ore-navbar-item icon-only aria-label=\"Search\"><ore-icon slot=\"icon\" name=\"search\"></ore-icon></ore-navbar-item>\n * ```\n */\nexport const NAVBAR_ITEM_TAG = 'ore-navbar-item' as const;\ndefine<OreNavbarItemProps>(NAVBAR_ITEM_TAG, {\n  props: {\n    active: prop.bool(false),\n    disabled: prop.bool(false),\n    href: prop.string(),\n    'icon-only': prop.bool(false),\n    rel: prop.string(),\n    target: prop.string(),\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const hasEnd = () => slots.has('end').value;\n    const navbarCtx = inject(NAVBAR_CTX);\n\n    bind({\n      attr: {\n        'navbar-mobile': () => (navbarCtx?.isMobile.value ? true : undefined),\n        'navbar-mobile-open': () => (navbarCtx?.mobileMenuOpen.value ? true : undefined),\n      },\n    });\n\n    const isLink = () => Boolean(props.href.value) && !props.disabled.value;\n\n    // Prevent reverse tabnapping: auto-inject noopener + noreferrer for _blank links.\n    const effectiveRel = computed(() => computeSafeRel(props.rel.value, props.target.value));\n\n    // Closes the mobile overflow panel when one of its items is activated — otherwise picking a\n    // destination (or firing any other action placed in the `mobile-menu` slot) leaves the panel\n    // open over the page until the user separately taps the toggle again. Only matters while\n    // actually in mobile mode; on desktop `navbarCtx.mobileMenuOpen` is never true to begin with,\n    // so `closeMobileMenu()` (idempotent — see `setMobileMenu`'s equality check) is a no-op there.\n    const closeMobileMenuIfOpen = (): void => {\n      if (navbarCtx?.mobileMenuOpen.value) navbarCtx.closeMobileMenu();\n    };\n\n    const renderItemContent = () => html`\n      <span class=\"item-icon\" part=\"item-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n        <slot name=\"icon\"></slot>\n      </span>\n      <span class=\"item-label\" part=\"item-label\"><slot></slot></span>\n      <span class=\"item-end\" part=\"item-end\" ?hidden=${() => !hasEnd()}>\n        <slot name=\"end\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${() => {\n        if (isLink()) {\n          return html`\n            <a\n              class=\"item\"\n              part=\"item\"\n              href=\"${props.href}\"\n              rel=\"${effectiveRel}\"\n              target=\"${props.target}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n              @click=${closeMobileMenuIfOpen}>\n              ${renderItemContent()}\n            </a>\n          `;\n        }\n\n        if (props.disabled.value) {\n          return html`\n            <div class=\"item\" part=\"item\" tabindex=\"-1\" aria-disabled=\"true\">${renderItemContent()}</div>\n          `;\n        }\n\n        return html`\n          <button class=\"item\" part=\"item\" type=\"button\" @click=${closeMobileMenuIfOpen}>${renderItemContent()}</button>\n        `;\n      }}\n    `;\n  },\n  styles: [coarsePointerMixin, navbarStyles],\n});\n"],"mappings":"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"}

package/dist/overlay/menu/menu.css.cjs

@@ -1,2 +1,2 @@
-var e=`@layer refine.base{:host{--_menu-panel-bg:var(--menu-panel-bg,var(--color-canvas));--_menu-panel-border-color:var(--menu-panel-border-color,var(--color-divider));--_menu-panel-blur:var(--menu-panel-blur,var(--blur-md));--_menu-panel-shadow:var(--menu-panel-shadow,var(--shadow-xl));display:inline-block;position:relative}.menu-panel{z-index:calc(var(--z-popover) + 1);box-sizing:border-box;min-width:var(--menu-panel-min-width,10rem);max-height:var(--menu-panel-max-height,min(70vh, 32rem));padding:var(--_panel-padding,var(--size-1));pointer-events:none;background:var(--_menu-panel-bg);border:var(--border) solid var(--_menu-panel-border-color);border-radius:var(--menu-panel-radius,var(--rounded-lg));box-shadow:var(--_menu-panel-shadow);opacity:0;-webkit-backdrop-filter:blur(var(--_menu-panel-blur));backdrop-filter:blur(var(--_menu-panel-blur));transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));transform-origin:0 0;transition:opacity .1s var(--ease-spring), transform .1s var(--ease-spring), display .1s allow-discrete, overlay .1s allow-discrete;margin:0;position:fixed;top:0;overflow-y:auto}.menu-panel:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.menu-panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.menu-panel[data-placement=top-start],.menu-panel[data-placement=top],.menu-panel[data-placement=top-end]{transform-origin:0 100%}.menu-panel[data-placement=bottom-end],.menu-panel[data-placement=right-start],.menu-panel[data-placement=right]{transform-origin:100% 0}.menu-panel[data-open]{pointer-events:auto;opacity:1;transition:opacity .15s var(--ease-spring), transform .15s var(--ease-spring), display .15s allow-discrete, overlay .15s allow-discrete;transform:translateY(0)scale(1)}@starting-style{.menu-panel[data-open]{opacity:0;transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale))}}::slotted(ore-menu-item),::slotted(ore-menu-separator){display:block}}`;exports.default=e;
+var e=`@layer refine.base{:host{--_menu-panel-bg:var(--menu-panel-bg,var(--color-canvas));--_menu-panel-color:var(--menu-panel-color,var(--color-contrast-900));--_menu-panel-border-color:var(--menu-panel-border-color,var(--color-divider));--_menu-panel-blur:var(--menu-panel-blur,var(--blur-md));--_menu-panel-shadow:var(--menu-panel-shadow,var(--shadow-xl));display:inline-block;position:relative}.menu-panel{z-index:calc(var(--z-popover) + 1);box-sizing:border-box;min-width:var(--menu-panel-min-width,10rem);max-height:var(--menu-panel-max-height,min(70vh, 32rem));padding:var(--_panel-padding,var(--size-1));color:var(--_menu-panel-color);pointer-events:none;background:var(--_menu-panel-bg);border:var(--border) solid var(--_menu-panel-border-color);border-radius:var(--menu-panel-radius,var(--rounded-lg));box-shadow:var(--_menu-panel-shadow);opacity:0;-webkit-backdrop-filter:blur(var(--_menu-panel-blur));backdrop-filter:blur(var(--_menu-panel-blur));transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));transform-origin:0 0;transition:opacity .1s var(--ease-spring), transform .1s var(--ease-spring), display .1s allow-discrete, overlay .1s allow-discrete;margin:0;position:fixed;top:0;overflow-y:auto}.menu-panel:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.menu-panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.menu-panel[data-placement=top-start],.menu-panel[data-placement=top],.menu-panel[data-placement=top-end]{transform-origin:0 100%}.menu-panel[data-placement=bottom-end],.menu-panel[data-placement=right-start],.menu-panel[data-placement=right]{transform-origin:100% 0}.menu-panel[data-open]{pointer-events:auto;opacity:1;transition:opacity .15s var(--ease-spring), transform .15s var(--ease-spring), display .15s allow-discrete, overlay .15s allow-discrete;transform:translateY(0)scale(1)}@starting-style{.menu-panel[data-open]{opacity:0;transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale))}}::slotted(ore-menu-item),::slotted(ore-menu-separator){display:block}}`;exports.default=e;
 //# sourceMappingURL=menu.css.cjs.map

package/dist/overlay/menu/menu.css.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu.css.cjs","names":[],"sources":["../../../src/overlay/menu/menu.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_menu-panel-bg: var(--menu-panel-bg, var(--color-canvas));\n    --_menu-panel-border-color: var(--menu-panel-border-color, var(--color-divider));\n    --_menu-panel-blur: var(--menu-panel-blur, var(--blur-md));\n    --_menu-panel-shadow: var(--menu-panel-shadow, var(--shadow-xl));\n\n    position: relative;\n    display: inline-block;\n  }\n\n  /* ========================================\n       Menu Panel\n       ======================================== */\n\n  .menu-panel {\n    position: fixed;\n    inset-inline-start: 0;\n    top: 0;\n    z-index: calc(var(--z-popover) + 1);\n    box-sizing: border-box;\n    min-width: var(--menu-panel-min-width, 10rem);\n    max-height: var(--menu-panel-max-height, min(70vh, 32rem));\n    padding: var(--_panel-padding, var(--size-1));\n    margin: 0;\n    overflow-y: auto;\n    pointer-events: none;\n    background: var(--_menu-panel-bg);\n    border: var(--border) solid var(--_menu-panel-border-color);\n    border-radius: var(--menu-panel-radius, var(--rounded-lg));\n    box-shadow: var(--_menu-panel-shadow);\n    opacity: 0;\n    backdrop-filter: blur(var(--_menu-panel-blur));\n    transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    transform-origin: top left;\n    transition:\n      opacity 100ms var(--ease-spring),\n      transform 100ms var(--ease-spring),\n      display 100ms allow-discrete,\n      overlay 100ms allow-discrete;\n  }\n\n  .menu-panel[data-placement='top-start'],\n  .menu-panel[data-placement='top'],\n  .menu-panel[data-placement='top-end'] {\n    transform-origin: bottom left;\n  }\n\n  .menu-panel[data-placement='bottom-end'],\n  .menu-panel[data-placement='right-start'],\n  .menu-panel[data-placement='right'] {\n    transform-origin: top right;\n  }\n\n  .menu-panel[data-open] {\n    pointer-events: auto;\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    transition:\n      opacity 150ms var(--ease-spring),\n      transform 150ms var(--ease-spring),\n      display 150ms allow-discrete,\n      overlay 150ms allow-discrete;\n\n    @starting-style {\n      opacity: 0;\n      transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    }\n  }\n\n  /* ========================================\n       Menu Items (slotted ore-menu-item)\n       ======================================== */\n\n  ::slotted(ore-menu-item) {\n    display: block;\n  }\n\n  ::slotted(ore-menu-separator) {\n    display: block;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"menu.css.cjs","names":[],"sources":["../../../src/overlay/menu/menu.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_menu-panel-bg: var(--menu-panel-bg, var(--color-canvas));\n    --_menu-panel-color: var(--menu-panel-color, var(--color-contrast-900));\n    --_menu-panel-border-color: var(--menu-panel-border-color, var(--color-divider));\n    --_menu-panel-blur: var(--menu-panel-blur, var(--blur-md));\n    --_menu-panel-shadow: var(--menu-panel-shadow, var(--shadow-xl));\n\n    position: relative;\n    display: inline-block;\n  }\n\n  /* ========================================\n       Menu Panel\n       ======================================== */\n\n  .menu-panel {\n    position: fixed;\n    inset-inline-start: 0;\n    top: 0;\n    z-index: calc(var(--z-popover) + 1);\n    box-sizing: border-box;\n    min-width: var(--menu-panel-min-width, 10rem);\n    max-height: var(--menu-panel-max-height, min(70vh, 32rem));\n    padding: var(--_panel-padding, var(--size-1));\n    margin: 0;\n    overflow-y: auto;\n    color: var(--_menu-panel-color);\n    pointer-events: none;\n    background: var(--_menu-panel-bg);\n    border: var(--border) solid var(--_menu-panel-border-color);\n    border-radius: var(--menu-panel-radius, var(--rounded-lg));\n    box-shadow: var(--_menu-panel-shadow);\n    opacity: 0;\n    backdrop-filter: blur(var(--_menu-panel-blur));\n    transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    transform-origin: top left;\n    transition:\n      opacity 100ms var(--ease-spring),\n      transform 100ms var(--ease-spring),\n      display 100ms allow-discrete,\n      overlay 100ms allow-discrete;\n  }\n\n  .menu-panel[data-placement='top-start'],\n  .menu-panel[data-placement='top'],\n  .menu-panel[data-placement='top-end'] {\n    transform-origin: bottom left;\n  }\n\n  .menu-panel[data-placement='bottom-end'],\n  .menu-panel[data-placement='right-start'],\n  .menu-panel[data-placement='right'] {\n    transform-origin: top right;\n  }\n\n  .menu-panel[data-open] {\n    pointer-events: auto;\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    transition:\n      opacity 150ms var(--ease-spring),\n      transform 150ms var(--ease-spring),\n      display 150ms allow-discrete,\n      overlay 150ms allow-discrete;\n\n    @starting-style {\n      opacity: 0;\n      transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    }\n  }\n\n  /* ========================================\n       Menu Items (slotted ore-menu-item)\n       ======================================== */\n\n  ::slotted(ore-menu-item) {\n    display: block;\n  }\n\n  ::slotted(ore-menu-separator) {\n    display: block;\n  }\n}\n"],"mappings":""}