@mortenbrudvik/waveui 0.10.0 → 0.12.0

package/dist/components/navigation/Nav.context.mjs

@@ -0,0 +1,137 @@
+"use client";
+import { getElementType as e } from "../../lib/children.mjs";
+import { hasWarned as t, isDev as n, reportMissingContext as r, warnOnce as i } from "../../lib/dev.mjs";
+import * as a from "react";
+//#region src/components/navigation/Nav.context.ts
+function o() {
+	let e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Set(), n = () => t.forEach((e) => e());
+	return {
+		record(t, r) {
+			(e.get(t) ?? null) !== r && (r === null ? e.delete(t) : e.set(t, r), n());
+		},
+		forget(t, r) {
+			e.get(t) === r && (e.delete(t), n());
+		},
+		get: (t) => e.get(t),
+		subscribe(e) {
+			return t.add(e), () => {
+				t.delete(e);
+			};
+		}
+	};
+}
+var s = a.createContext(null);
+s.displayName = "NavContext";
+var c = () => {}, l = {
+	value: "",
+	select: c,
+	openCategories: [],
+	toggleCategory: c,
+	registerValue: () => c,
+	currentCategory: void 0,
+	categoryStore: {
+		record: c,
+		forget: c,
+		get: () => void 0,
+		subscribe: () => c
+	}
+}, u = a.createContext(null);
+u.displayName = "NavCategoryValueContext";
+function d(e) {
+	return a.useContext(s) || (r(e, "Nav"), l);
+}
+function f(e, t, n) {
+	let { registerValue: r } = e;
+	a.useEffect(() => r(t, n), [
+		r,
+		t,
+		n
+	]);
+}
+function p(e, t) {
+	let n = a.useContext(u), { categoryStore: r } = e;
+	a.useLayoutEffect(() => {
+		r.record(t, n);
+	}, [
+		r,
+		t,
+		n
+	]);
+}
+var m = a.createContext(null);
+m.displayName = "NavRovingContext";
+var h = Symbol.for("wave.navPart");
+function g(e, t) {
+	return e[h] = t, e;
+}
+function _(t) {
+	let n = e(t, { suspend: !1 });
+	if (typeof n != "function" && typeof n != "object" || n === null) return null;
+	let r = n[h];
+	return r === "entry" || r === "category" ? r : null;
+}
+function v(e) {
+	let { children: t } = e.props;
+	return typeof t == "function" ? void 0 : t;
+}
+function y(e) {
+	return (typeof e == "object" || typeof e == "function") && e !== null && typeof e.then == "function";
+}
+function b(e, t) {
+	if (Array.isArray(e)) {
+		for (let n of e) b(n, t);
+		return;
+	}
+	try {
+		a.Children.forEach(e, (e) => {
+			a.isValidElement(e) && t(e);
+		});
+	} catch (e) {
+		if (!y(e)) throw e;
+	}
+}
+function x(e, t) {
+	let n = !1;
+	return b(e, (e) => {
+		n ||= _(e) === "entry" && e.props.value === t || x(v(e), t);
+	}), n;
+}
+function S(e, t) {
+	let n = [];
+	if (!t) return n;
+	let r = (e) => {
+		b(e, (e) => {
+			let i = v(e);
+			_(e) === "category" && typeof e.props.value == "string" && x(i, t) && n.push(e.props.value), r(i);
+		});
+	};
+	return r(e), n;
+}
+var C = {
+	items: "Use the Nav parts (Nav.Item, Nav.Category, Nav.SectionHeader, Nav.Divider, Nav.AppItem, Nav.AppItemStatic) as its children, or wrap your own content in an <li>.",
+	"sub-items": "Use Nav.SubItem, Nav.SectionHeader and Nav.Divider as its children, or wrap your own content in an <li>."
+}, w = /* @__PURE__ */ new Set([
+	"li",
+	"script",
+	"template"
+]);
+function T(e) {
+	for (let t of Array.from(e.childNodes)) if (t.nodeType === Node.ELEMENT_NODE) {
+		let e = t.localName.toLowerCase();
+		if (!w.has(e)) return `a <${e}> element`;
+	} else if (t.nodeType === Node.TEXT_NODE && (t.textContent ?? "").trim() !== "") return "text";
+	return null;
+}
+function E(e, r, o) {
+	a.useEffect(() => {
+		if (!n) return;
+		let a = `${r}:list-child`, s = e.current;
+		if (!s || t(a)) return;
+		let c = T(s);
+		c !== null && i(a, `${r}: its list holds ${c}, but a list can hold only <li> elements. ${C[o]}`);
+	});
+}
+//#endregion
+export { u as NavCategoryValueContext, s as NavContext, m as NavRovingContext, x as containsValue, o as createCategoryStore, S as findCategoriesContaining, _ as getNavPartKind, g as markNavPart, d as useNavContext, E as useNavListChildCheck, f as useNavValue, p as useRecordCategory };
+
+//# sourceMappingURL=Nav.context.mjs.map

package/dist/components/navigation/Nav.context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Nav.context.mjs","names":["React","createCategoryStore","categories","listeners","notify","listener","value","category","NavContext","noop","INERT_NAV_CONTEXT","NavCategoryValueContext","useNavContext","reportMissingContext","componentName","useNavValue","context","registerValue","kind","useRecordCategory","categoryStore","NavRovingContext","NAV_PART","markNavPart","component","getNavPartKind","type","getElementType","node","childrenOf","element","children","isThenable","forEachElement","nodes","visit","child","error","containsValue","found","selected","findCategoriesContaining","result","current","inner","LIST_CHILD_ADVICE","ALLOWED_LIST_CHILDREN","describeInvalidListChild","list","tag","useNavListChildCheck","isDev","key","owner","hasWarned","invalid","warnOnce","contents"],"sources":["../../../src/components/navigation/Nav.context.ts"],"sourcesContent":["import * as React from 'react';\nimport { getElementType } from '../../lib/children';\nimport { hasWarned, isDev, reportMissingContext, warnOnce } from '../../lib/dev';\n\n/*\n * The contexts of a Nav root (Nav, NavDrawer) and its parts: the root's state (`NavContext`), the\n * category a sub-item renders in and the roving bookkeeping of an arrow-key body; the category\n * store; the part markers and the children walks that find the current page; the development check\n * of a Nav list's children; and the link-only attributes mask of the button items. Internal; it\n * imports no component, so a root reaches the parts through their markers, never through an import.\n */\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\n/** The two value namespaces of a Nav: items (Nav.Item and Nav.SubItem) and categories. */\nexport type NavValueKind = 'item' | 'category';\n\n/**\n * The category each sub-item was last shown in, by sub-item value: written from layout effects by\n * the mounted sub-items and by a closed category whose children hold the current value, read by\n * the categories with `useSyncExternalStore`. An entry outlives its sub-item, so a category closed\n * after its current sub-item was shown still knows it contains the current page.\n */\nexport interface NavCategoryStore {\n  /**\n   * Records the category a mounted item renders in, or a closed category whose children hold the\n   * value; `null` (an item outside any category) forgets an earlier entry, so a value moved out of\n   * a category no longer marks it.\n   */\n  record(value: string, category: string | null): void;\n  /** Forgets the entry of `value` while it is still `category`. */\n  forget(value: string, category: string): void;\n  /** The category last recorded for a sub-item value. */\n  get(value: string): string | undefined;\n  /** Subscribes to every change of an entry; returns the unsubscribe function. */\n  subscribe(listener: () => void): () => void;\n}\n\n/** A new, empty category store (one per Nav root, created once). */\nexport function createCategoryStore(): NavCategoryStore {\n  const categories = new Map<string, string>();\n  const listeners = new Set<() => void>();\n  const notify = () => listeners.forEach((listener) => listener());\n  return {\n    record(value, category) {\n      if ((categories.get(value) ?? null) === category) return;\n      if (category === null) categories.delete(value);\n      else categories.set(value, category);\n      notify();\n    },\n    forget(value, category) {\n      if (categories.get(value) !== category) return;\n      categories.delete(value);\n      notify();\n    },\n    get: (value) => categories.get(value),\n    subscribe(listener) {\n      listeners.add(listener);\n      return () => {\n        listeners.delete(listener);\n      };\n    },\n  };\n}\n\n/** The context a Nav root (Nav, NavDrawer) provides to its parts (0.10's fields, unchanged). */\nexport interface NavContextValue {\n  /** The selected item value (`''` when nothing is selected). */\n  value: string;\n  /**\n   * Activation of an item: sets the value, then calls the root's `onActivate` (every activation,\n   * re-selection included; Nav's deprecated `onNavItemSelect`).\n   */\n  select: (value: string) => void;\n  /** The values of the open categories. */\n  openCategories: readonly string[];\n  /** Opens a closed category, closes an open one. */\n  toggleCategory: (value: string) => void;\n  /** Registers a mounted item or category value (duplicate warning); returns the cleanup. */\n  registerValue: (kind: NavValueKind, value: string) => () => void;\n  /** The `currentCategory` hint of the root. */\n  currentCategory: string | undefined;\n  /** The categories the sub-items were last shown in. */\n  categoryStore: NavCategoryStore;\n}\n\n/** The state of the Nav root around a part (`null` outside one). */\nexport const NavContext = React.createContext<NavContextValue | null>(null);\nNavContext.displayName = 'NavContext';\n\nconst noop = () => {};\nconst INERT_NAV_CONTEXT: NavContextValue = {\n  value: '',\n  select: noop,\n  openCategories: [],\n  toggleCategory: noop,\n  registerValue: () => noop,\n  currentCategory: undefined,\n  categoryStore: { record: noop, forget: noop, get: () => undefined, subscribe: () => noop },\n};\n\n/**\n * The value of the Nav.Category a sub-item renders in (`null` outside a category). It renders no\n * element; a sub-item outside a category is valid, so there is no missing-context error.\n */\nexport const NavCategoryValueContext = React.createContext<string | null>(null);\nNavCategoryValueContext.displayName = 'NavCategoryValueContext';\n\n/**\n * The Nav root's context for the part `componentName` (C-CONTEXT): outside a Nav it throws\n * `[WaveUI] <componentName> must be used within Nav` in development, and in production logs once\n * and returns an inert value.\n */\nexport function useNavContext(componentName: string): NavContextValue {\n  const context = React.useContext(NavContext);\n  if (context) return context;\n  reportMissingContext(componentName, 'Nav');\n  return INERT_NAV_CONTEXT;\n}\n\n/** Registers the value of a mounted item or category, so the root can warn about duplicates. */\nexport function useNavValue(context: NavContextValue, kind: NavValueKind, value: string): void {\n  const { registerValue } = context;\n  React.useEffect(() => registerValue(kind, value), [registerValue, kind, value]);\n}\n\n/**\n * Records the category a mounted item renders in, which the category reads once closed (`null`\n * outside a category, which forgets a stale entry for the value).\n */\nexport function useRecordCategory(context: NavContextValue, value: string): void {\n  const category = React.useContext(NavCategoryValueContext);\n  const { categoryStore } = context;\n  React.useLayoutEffect(() => {\n    categoryStore.record(value, category);\n  }, [categoryStore, value, category]);\n}\n\n// ---------------------------------------------------------------------------\n// Roving bookkeeping (an arrow-key body)\n// ---------------------------------------------------------------------------\n\n/** What an arrow-key body (NavDrawer.Body `focusMode=\"arrow\"`) gives the Nav parts inside it. */\nexport interface NavRovingContextValue {\n  /**\n   * Called by every Nav.Category from a layout effect keyed on `[context, value, containsCurrent]`:\n   * `(value, true)` while it is a closed category that holds the current page, `(value, false)`\n   * when it stops being one and in the effect's cleanup (an unmount, StrictMode's double mount).\n   * Must be stable (memoised by the provider).\n   */\n  reportCurrentCategory: (category: string, holdsCurrent: boolean) => void;\n}\n\n/**\n * Provided (non-null) inside an arrow-key body: every Nav.Item and Nav.SubItem renders\n * `data-roving-value={value}` on its link or button (after the consumer's attributes: the\n * bookkeeping wins), and every category toggle `data-roving-value={'wave-nav-category:' + value}`\n * (stable, also while open), and reports as {@link NavRovingContextValue} says. `null` (the\n * default, every plain Nav): nothing is rendered or reported, so a Nav's server HTML is 0.10's.\n */\nexport const NavRovingContext = React.createContext<NavRovingContextValue | null>(null);\nNavRovingContext.displayName = 'NavRovingContext';\n\n// ---------------------------------------------------------------------------\n// Part markers and the children walks\n// ---------------------------------------------------------------------------\n\n/** What a marked Nav part is to the walks: an entry (Nav.Item, Nav.SubItem) or a category. */\nexport type NavPartKind = 'entry' | 'category';\n\n/**\n * The marker property of a Nav part, read only by {@link getNavPartKind}. A registry symbol\n * (`Symbol.for`), as Field's label marker (`fieldLabel.ts`): the ESM and CJS copies of the package\n * share it, so a part marked by one copy is recognised by the other.\n */\nconst NAV_PART: symbol = Symbol.for('wave.navPart');\n\n/**\n * Marks `component` as a Nav part of `kind`, so the walks of a Nav root recognise its elements\n * without importing it; call it next to `displayName`. Returns `component`.\n */\nexport function markNavPart<T extends object>(component: T, kind: NavPartKind): T {\n  (component as Record<symbol, unknown>)[NAV_PART] = kind;\n  return component;\n}\n\n/**\n * The kind of Nav part `node` is an element of, or `null` for anything else. The type is resolved\n * with `getElementType(node, { suspend: false })`: a lazy client reference (a part written in a\n * Server Component) is recognised, and a lazy type still loading is no part (it never suspends).\n */\nexport function getNavPartKind(node: React.ReactNode): NavPartKind | null {\n  const type = getElementType(node, { suspend: false });\n  if ((typeof type !== 'function' && typeof type !== 'object') || type === null) return null;\n  const kind = (type as Record<symbol, unknown>)[NAV_PART];\n  return kind === 'entry' || kind === 'category' ? kind : null;\n}\n\ntype ElementWithChildren = React.ReactElement<{ value?: unknown; children?: React.ReactNode }>;\n\nfunction childrenOf(element: ElementWithChildren): React.ReactNode {\n  const { children } = element.props;\n  return typeof children === 'function' ? undefined : children;\n}\n\n/** Whether a thrown value suspends rendering (a loading lazy chunk, a pending promise). */\nfunction isThenable(value: unknown): boolean {\n  return (\n    (typeof value === 'object' || typeof value === 'function') &&\n    value !== null &&\n    typeof (value as { then?: unknown }).then === 'function'\n  );\n}\n\n/*\n * The walks below run during the render of a Nav root and of a category, and reach consumer\n * content at any depth. Content that is still loading inside the consumer's own <Suspense> (a\n * promise child, a lazy node, a `React.lazy` component) suspends that boundary when React renders\n * it; walking it must never suspend the Nav itself, which would hide the whole Nav behind an outer\n * boundary. So a child that cannot be read yet is skipped, and a lazy type that is still loading is\n * not a part (its children are still walked). Parts written in a Server Component arrive as loaded\n * client references and are recognized.\n */\n\n/** Calls `visit` with each element of `nodes` (as `React.Children.forEach`), skipping pending ones. */\nfunction forEachElement(nodes: React.ReactNode, visit: (child: ElementWithChildren) => void): void {\n  if (Array.isArray(nodes)) {\n    for (const node of nodes as React.ReactNode[]) forEachElement(node, visit);\n    return;\n  }\n  try {\n    React.Children.forEach(nodes, (child) => {\n      if (React.isValidElement<ElementWithChildren['props']>(child)) visit(child);\n    });\n  } catch (error) {\n    if (!isThenable(error)) throw error;\n  }\n}\n\n/**\n * Whether `nodes` contain a Nav.Item/Nav.SubItem element with `value === selected` (parts written\n * in a Server Component, lazy client references, included). Called during render only; never\n * suspends.\n */\nexport function containsValue(nodes: React.ReactNode, selected: string): boolean {\n  let found = false;\n  forEachElement(nodes, (child) => {\n    if (found) return;\n    if (getNavPartKind(child) === 'entry' && child.props.value === selected) {\n      found = true;\n    } else {\n      found = containsValue(childrenOf(child), selected);\n    }\n  });\n  return found;\n}\n\n/** The values of the Nav.Category elements (at any depth of JSX) that contain `selected`. */\nexport function findCategoriesContaining(nodes: React.ReactNode, selected: string): string[] {\n  const result: string[] = [];\n  if (!selected) return result;\n  const visit = (current: React.ReactNode) => {\n    forEachElement(current, (child) => {\n      const inner = childrenOf(child);\n      if (\n        getNavPartKind(child) === 'category' &&\n        typeof child.props.value === 'string' &&\n        containsValue(inner, selected)\n      ) {\n        result.push(child.props.value);\n      }\n      visit(inner);\n    });\n  };\n  visit(nodes);\n  return result;\n}\n\n// ---------------------------------------------------------------------------\n// The list-child check\n// ---------------------------------------------------------------------------\n\n/** The advice of the list-child warning, by what the list holds. */\nconst LIST_CHILD_ADVICE = {\n  items:\n    'Use the Nav parts (Nav.Item, Nav.Category, Nav.SectionHeader, Nav.Divider, Nav.AppItem, Nav.AppItemStatic) as its children, or wrap your own content in an <li>.',\n  'sub-items':\n    'Use Nav.SubItem, Nav.SectionHeader and Nav.Divider as its children, or wrap your own content in an <li>.',\n} as const;\n\n/** Element children a list may hold besides `<li>`: script-supporting elements (React's streaming placeholders). */\nconst ALLOWED_LIST_CHILDREN = new Set(['li', 'script', 'template']);\n\n/**\n * What the first child node of `list` that a list cannot hold is (`a <div> element`, `text`), or\n * `null` when every child is an `<li>`, a script-supporting element, whitespace text or a comment.\n */\nfunction describeInvalidListChild(list: HTMLElement): string | null {\n  for (const node of Array.from(list.childNodes)) {\n    if (node.nodeType === Node.ELEMENT_NODE) {\n      const tag = (node as Element).localName.toLowerCase();\n      if (!ALLOWED_LIST_CHILDREN.has(tag)) return `a <${tag}> element`;\n    } else if (node.nodeType === Node.TEXT_NODE && (node.textContent ?? '').trim() !== '') {\n      return 'text';\n    }\n  }\n  return null;\n}\n\n/**\n * Development only: after every commit of the calling component, warns once per `owner`\n * (`${owner}:list-child`) at the first child node of `list` that is neither an `<li>`, `<script>`\n * nor `<template>` element nor whitespace text (comments, and the nothing that `null`, Fragments\n * and Suspense boundaries render, never warn). `contents` picks the advice: `'items'` the Nav\n * parts, `'sub-items'` Nav.SubItem, Nav.SectionHeader and Nav.Divider.\n */\nexport function useNavListChildCheck(\n  list: React.RefObject<HTMLUListElement | null>,\n  owner: string,\n  contents: 'items' | 'sub-items',\n): void {\n  React.useEffect(() => {\n    if (!isDev) return;\n    const key = `${owner}:list-child`;\n    const element = list.current;\n    if (!element || hasWarned(key)) return;\n    const invalid = describeInvalidListChild(element);\n    if (invalid === null) return;\n    warnOnce(\n      key,\n      `${owner}: its list holds ${invalid}, but a list can hold only <li> elements. ${LIST_CHILD_ADVICE[contents]}`,\n    );\n  });\n}\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\n/**\n * The attributes only a link has (`target`, `download`, `hrefLang`, `ping`, …). Button items\n * declare them as `undefined`, so they are a type error without `href` instead of landing on the\n * `<button>`. `rel` cannot be listed (React types it on every element, RDFa); a button item drops\n * it at run time instead.\n */\nexport type NoAnchorOnlyAttributes = {\n  [\n    K in Exclude<\n      keyof React.AnchorHTMLAttributes<HTMLAnchorElement>,\n      keyof React.ButtonHTMLAttributes<HTMLButtonElement>\n    >\n  ]?: undefined;\n};\n"],"mappings":"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"}

package/dist/components/navigation/Nav.mjs

@@ -1,291 +1,184 @@
 "use client";
 import { cn as e } from "../../lib/cn.mjs";
-import { getElementType as t } from "../../lib/children.mjs";
-import { reportMissingContext as n, resolveDeprecatedProp as r, warnDeprecated as i, warnOnce as a } from "../../lib/dev.mjs";
-import { renderSlot as o, slotRendersContent as s } from "../../lib/slot.mjs";
-import { navCategoryClassNames as c, navClassNames as l, navItemClassNames as u, navSubItemClassNames as d } from "../../lib/classNames.mjs";
-import { useEventCallback as f } from "../../hooks/useEventCallback.mjs";
-import { useControllable as p } from "../../hooks/useControllable.mjs";
-import { useId as m } from "../../hooks/useId.mjs";
-import { disabledStyles as h, focusRingInset as g } from "../../lib/styles.mjs";
-import { ChevronDownIcon as _ } from "../../lib/icons.mjs";
-import * as v from "react";
-import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { warnDeprecated as t } from "../../lib/dev.mjs";
+import { materialiseSlotContent as n, renderSlot as r, slotRendersContent as i } from "../../lib/slot.mjs";
+import { navCategoryClassNames as a, navItemClassNames as o, navSubItemClassNames as s } from "../../lib/classNames.mjs";
+import { useId as c } from "../../hooks/useId.mjs";
+import { disabledStyles as l, focusRingInset as u } from "../../lib/styles.mjs";
+import { ChevronDownIcon as d } from "../../lib/icons.mjs";
+import { NavCategoryValueContext as f, NavRovingContext as p, containsValue as m, markNavPart as h, useNavContext as g, useNavListChildCheck as _, useNavValue as v, useRecordCategory as y } from "./Nav.context.mjs";
+import { NavAppItem as b, NavAppItemStatic as x, NavDivider as S, NavSectionHeader as C } from "./Nav.parts.mjs";
+import { NavRoot as w } from "./Nav.root.mjs";
+import * as T from "react";
+import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
 //#region src/components/navigation/Nav.tsx
-function S() {
-	let e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Set(), n = () => t.forEach((e) => e());
-	return {
-		record(t, r) {
-			(e.get(t) ?? null) !== r && (r === null ? e.delete(t) : e.set(t, r), n());
-		},
-		forget(t, r) {
-			e.get(t) === r && (e.delete(t), n());
-		},
-		get: (t) => e.get(t),
-		subscribe(e) {
-			return t.add(e), () => {
-				t.delete(e);
-			};
-		}
-	};
-}
-var C = v.createContext(null);
-C.displayName = "NavContext";
-var w = () => {}, T = {
-	value: "",
-	select: w,
-	openCategories: [],
-	toggleCategory: w,
-	registerValue: () => w,
-	currentCategory: void 0,
-	categoryStore: {
-		record: w,
-		forget: w,
-		get: () => void 0,
-		subscribe: () => w
-	}
-}, E = v.createContext(null);
-E.displayName = "NavCategoryValueContext";
-function D(e) {
-	return v.useContext(C) || (n(e, "Nav"), T);
-}
-function O(e, t) {
-	a(`Nav:duplicate-${e}:${t}`, e === "item" ? `Nav: several items share the value "${t}". Nav.Item and Nav.SubItem values must be unique within a Nav; every item with the current value is marked as the current page.` : `Nav: several categories share the value "${t}". Nav.Category values must be unique within a Nav; they open and close together.`);
+var k = "flex h-5 w-5 shrink-0 items-center justify-center";
+function A(t, n) {
+	return t && i(t) ? r(t, "span", e(n, k), { "aria-hidden": !0 }) : null;
 }
-function k(e, t, n) {
-	let { registerValue: r } = e;
-	v.useEffect(() => r(t, n), [
-		r,
-		t,
-		n
-	]);
-}
-function A(e, t) {
-	let n = v.useContext(E), { categoryStore: r } = e;
-	v.useLayoutEffect(() => {
-		r.record(t, n);
-	}, [
-		r,
-		t,
-		n
-	]);
-}
-var j = "flex h-5 w-5 shrink-0 items-center justify-center";
-function M(t, n) {
-	return t && s(t) ? o(t, "span", e(n, j), { "aria-hidden": !0 }) : null;
-}
-var N = {
-	base: e("flex w-full items-center gap-2 px-4 py-2 text-body-1 text-start no-underline transition-colors motion-reduce:transition-none", g, h),
+var j = {
+	base: e("flex w-full items-center gap-2 px-4 py-2 text-body-1 text-start no-underline transition-colors motion-reduce:transition-none", u, l),
 	selected: "bg-subtle-selected text-primary font-semibold border-s-2 border-s-primary",
-	idle: "text-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover"
-}, P = {
-	base: e("flex w-full items-center ps-11 pe-4 py-1.5 text-body-1 text-start no-underline transition-colors motion-reduce:transition-none", g, h),
+	idle: "text-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover",
+	selectedInRow: "text-primary font-semibold",
+	rowSelected: "bg-subtle-selected border-s-2 border-s-primary"
+}, M = {
+	base: e("flex w-full items-center ps-11 pe-4 py-1.5 text-body-1 text-start no-underline transition-colors motion-reduce:transition-none", u, l),
 	selected: "text-primary font-semibold",
-	idle: "text-muted-foreground not-disabled:not-aria-disabled:hover:text-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover"
-}, F = e("flex w-full items-center gap-2 px-4 py-2 text-body-1 font-semibold text-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover transition-colors motion-reduce:transition-none", "data-[contains-current]:bg-subtle-selected data-[contains-current]:text-primary data-[contains-current]:border-s-2 data-[contains-current]:border-s-primary", g);
-function I(e) {
-	let { children: t } = e.props;
-	return typeof t == "function" ? void 0 : t;
-}
+	idle: "text-muted-foreground not-disabled:not-aria-disabled:hover:text-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover",
+	selectedInRow: "text-primary font-semibold",
+	rowSelected: void 0
+}, N = "group/nav-row flex items-center transition-colors motion-reduce:transition-none", P = "hover:bg-subtle-hover", F = e("flex shrink-0 items-center gap-1 pe-2", "*:opacity-0 group-hover/nav-row:*:opacity-100 group-focus-within/nav-row:*:opacity-100", "forced-colors:*:opacity-100 [@media(hover:none)]:*:opacity-100", "*:has-[[aria-pressed=true]]:opacity-100 *:has-[[aria-expanded=true]]:opacity-100", "[&>[aria-pressed=true]]:opacity-100 [&>[aria-expanded=true]]:opacity-100"), I = e("flex w-full items-center gap-2 px-4 py-2 text-body-1 font-semibold text-foreground not-disabled:not-aria-disabled:hover:bg-subtle-hover transition-colors motion-reduce:transition-none", "data-[contains-current]:bg-subtle-selected data-[contains-current]:text-primary data-[contains-current]:border-s-2 data-[contains-current]:border-s-primary", u);
 function L(e) {
-	return (typeof e == "object" || typeof e == "function") && e !== null && typeof e.then == "function";
-}
-function R(e, t) {
-	if (Array.isArray(e)) {
-		for (let n of e) R(n, t);
-		return;
-	}
-	try {
-		v.Children.forEach(e, (e) => {
-			v.isValidElement(e) && t(e);
-		});
-	} catch (e) {
-		if (!L(e)) throw e;
-	}
-}
-function z(e, ...n) {
-	return n.includes(t(e, { suspend: !1 }));
-}
-function B(e, t) {
-	let n = !1;
-	return R(e, (e) => {
-		n ||= z(e, G, K) && e.props.value === t ? !0 : B(I(e), t);
-	}), n;
-}
-function V(e, t) {
-	let n = [];
-	if (!t) return n;
-	let r = (e) => {
-		R(e, (e) => {
-			let i = I(e);
-			z(e, W) && typeof e.props.value == "string" && B(i, t) && n.push(e.props.value), r(i);
-		});
-	};
-	return r(e), n;
-}
-function H(e) {
 	if (e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return !0;
 	let t = e.currentTarget, n = t.getAttribute("target");
 	return !!n && n.toLowerCase() !== "_self" || t.hasAttribute("download");
 }
-function U(t, n, r, i, a) {
-	let { value: o, icon: s, disabled: c = !1, href: l, className: u, children: d, onClick: f, ref: p, ...m } = t, h = n.value === o, g = l !== void 0, _ = (e) => {
-		if (c) {
+function R(t, r, a, o, s, c, l) {
+	let { value: u, icon: d, disabled: f = !1, href: p, className: m, children: h, onClick: g, actions: _, ref: v, ...y } = t, b = r.value === u, x = p !== void 0, S = a ? { "data-roving-value": u } : void 0, C = i(_), w = y.id ?? l, T = C ? { id: w } : void 0, k = (e) => {
+		if (f) {
 			e.preventDefault();
 			return;
 		}
-		f?.(e), !(g ? !e.defaultPrevented && H(e) : e.defaultPrevented) && n.select(o);
-	}, v = /* @__PURE__ */ x(y, { children: [a && M(s, i.icon), a ? /* @__PURE__ */ b("span", {
-		className: e(i.content, "flex-1 text-start"),
-		children: d
-	}) : d] }), S = e(i.root, r.base, h ? r.selected : r.idle, u);
-	if (g) return /* @__PURE__ */ b("li", {
-		className: i.listItem,
-		children: /* @__PURE__ */ b("a", {
-			...m,
-			ref: p,
-			href: c ? void 0 : l,
-			role: c ? "link" : m.role,
-			"aria-disabled": c ? !0 : m["aria-disabled"],
-			"aria-current": h ? "page" : void 0,
-			onClick: _,
-			className: S,
-			children: v
-		})
+		g?.(e), !(x ? !e.defaultPrevented && L(e) : e.defaultPrevented) && r.select(u);
+	}, j = /* @__PURE__ */ O(E, { children: [c && A(d, s.icon), c ? /* @__PURE__ */ D("span", {
+		className: e(s.content, "flex-1 text-start"),
+		children: h
+	}) : h] }), M = e(s.root, o.base, b ? C ? o.selectedInRow : o.selected : o.idle, C && "min-w-0 flex-1", m), I = C ? e(s.listItem, N, b && o.rowSelected ? o.rowSelected : !f && P) : s.listItem, R = C ? /* @__PURE__ */ D("span", {
+		role: "group",
+		"aria-labelledby": w,
+		"data-wave-nav-actions": "",
+		className: e(s.actions, F),
+		children: n(_)
+	}) : null;
+	if (x) return /* @__PURE__ */ O("li", {
+		className: I,
+		children: [/* @__PURE__ */ D("a", {
+			...y,
+			...T,
+			...S,
+			ref: v,
+			href: f ? void 0 : p,
+			role: f ? "link" : y.role,
+			"aria-disabled": f ? !0 : y["aria-disabled"],
+			"aria-current": b ? "page" : void 0,
+			onClick: k,
+			className: M,
+			children: j
+		}), R]
 	});
-	let { rel: C, ...w } = m;
-	return /* @__PURE__ */ b("li", {
-		className: i.listItem,
-		children: /* @__PURE__ */ b("button", {
+	let { rel: z, ...B } = y;
+	return /* @__PURE__ */ O("li", {
+		className: I,
+		children: [/* @__PURE__ */ D("button", {
 			type: "button",
-			...w,
-			ref: p,
-			disabled: c,
-			"aria-current": h ? "page" : void 0,
-			onClick: _,
-			className: S,
-			children: v
-		})
+			...B,
+			...T,
+			...S,
+			ref: v,
+			disabled: f,
+			"aria-current": b ? "page" : void 0,
+			onClick: k,
+			className: M,
+			children: j
+		}), R]
 	});
 }
-var W = ({ value: t, label: n, icon: r, className: a, children: o, ref: s, ...l }) => {
-	let u = D("Nav.Category"), { value: d, openCategories: f, toggleCategory: p, currentCategory: h, categoryStore: g } = u;
-	k(u, "category", t);
-	let y = m("wave-nav-category"), S = f.includes(t), C = !S && d !== "" && B(o, d), w = v.useSyncExternalStore(g.subscribe, () => d !== "" && g.get(d) === t, () => !1);
-	v.useLayoutEffect(() => {
-		if (C) return g.record(d, t), () => g.forget(d, t);
+var z = ({ value: n, label: r, icon: i, className: o, children: s, ref: l, ...u }) => {
+	let h = g("Nav.Category"), y = T.useContext(p), { value: b, openCategories: x, toggleCategory: S, currentCategory: C, categoryStore: w } = h;
+	v(h, "category", n);
+	let E = c("wave-nav-category"), k = x.includes(n), j = !k && b !== "" && m(s, b), M = T.useSyncExternalStore(w.subscribe, () => b !== "" && w.get(b) === n, () => !1);
+	T.useLayoutEffect(() => {
+		if (j) return w.record(b, n), () => w.forget(b, n);
+	}, [
+		w,
+		j,
+		b,
+		n
+	]);
+	let N = !k && (C === n || M || j);
+	T.useLayoutEffect(() => {
+		if (y) return y.reportCurrentCategory(n, N), () => y.reportCurrentCategory(n, !1);
 	}, [
-		g,
-		C,
-		d,
-		t
+		y,
+		n,
+		N
 	]);
-	let T = !S && (h === t || w || C), O = n, A = o;
-	if (n === void 0) {
-		i("Nav.Category", "text children as the label", "label", "Pass the category label in `label` and only the sub-items as children.");
-		let e = v.Children.toArray(o), t = (e) => typeof e == "string" || typeof e == "number";
-		O = e.filter(t).join(""), A = e.filter((e) => !t(e));
+	let P = T.useRef(null);
+	_(P, "Nav.Category", "sub-items");
+	let F = r, L = s;
+	if (r === void 0) {
+		t("Nav.Category", "text children as the label", "label", "Pass the category label in `label` and only the sub-items as children.");
+		let e = T.Children.toArray(s), n = (e) => typeof e == "string" || typeof e == "number";
+		F = e.filter(n).join(""), L = e.filter((e) => !n(e));
 	}
-	return /* @__PURE__ */ x("li", {
-		ref: s,
-		...l,
-		className: e(c.root, a),
-		children: [/* @__PURE__ */ x("button", {
+	return /* @__PURE__ */ O("li", {
+		ref: l,
+		...u,
+		className: e(a.root, o),
+		children: [/* @__PURE__ */ O("button", {
 			type: "button",
-			"aria-expanded": S,
-			"aria-controls": S ? y : void 0,
-			"aria-current": T ? !0 : void 0,
-			"data-contains-current": T ? "" : void 0,
-			onClick: () => p(t),
-			className: e(c.button, F),
+			"aria-expanded": k,
+			"aria-controls": k ? E : void 0,
+			"aria-current": N ? !0 : void 0,
+			"data-contains-current": N ? "" : void 0,
+			"data-roving-value": y ? `wave-nav-category:${n}` : void 0,
+			onClick: () => S(n),
+			className: e(a.button, I),
 			children: [
-				M(r, c.icon),
-				/* @__PURE__ */ b("span", {
-					className: e(c.label, "flex-1 text-start"),
-					children: O
+				A(i, a.icon),
+				/* @__PURE__ */ D("span", {
+					className: e(a.label, "flex-1 text-start"),
+					children: F
 				}),
-				/* @__PURE__ */ b(_, { className: e(c.expandIcon, "shrink-0 transition-transform motion-reduce:transition-none", S && "rotate-180") })
+				/* @__PURE__ */ D(d, { className: e(a.expandIcon, "shrink-0 transition-transform motion-reduce:transition-none", k && "rotate-180") })
 			]
-		}), S && /* @__PURE__ */ b(E.Provider, {
-			value: t,
-			children: /* @__PURE__ */ b("ul", {
-				id: y,
-				className: e(c.list, "m-0 list-none p-0"),
-				children: A
+		}), k && /* @__PURE__ */ D(f.Provider, {
+			value: n,
+			children: /* @__PURE__ */ D("ul", {
+				ref: P,
+				id: E,
+				className: e(a.list, "m-0 list-none p-0"),
+				children: L
 			})
 		})]
 	});
 };
-W.displayName = "NavCategory";
-function G(e) {
-	let t = D("Nav.Item");
-	return k(t, "item", e.value), A(t, e.value), U(e, t, N, {
-		root: u.root,
-		listItem: u.listItem,
-		icon: u.icon,
-		content: u.content
-	}, !0);
-}
-G.displayName = "NavItem";
-function K(e) {
-	let t = D("Nav.SubItem");
-	return k(t, "item", e.value), A(t, e.value), U(e, t, P, {
-		root: d.root,
-		listItem: d.listItem
-	}, !1);
-}
-K.displayName = "NavSubItem";
-var q = ({ value: t, defaultValue: n, onValueChange: a, selectedValue: o, defaultSelectedValue: s, onNavItemSelect: c, openCategories: u, defaultOpenCategories: d, onOpenCategoriesChange: m, currentCategory: h, className: g, children: _, ref: y, ...x }) => {
-	let w = r("Nav", t, o, "selectedValue", "value"), T = r("Nav", n, s, "defaultSelectedValue", "defaultValue") ?? "";
-	c !== void 0 && i("Nav", "onNavItemSelect", "onValueChange");
-	let [E, D] = p(w, T, a), k = f(c), A = v.useCallback((e) => {
-		D(e), k(e);
-	}, [D, k]), [j] = v.useState(() => d ?? V(_, w ?? T)), [M, N] = p(u, j, (e) => m?.([...e])), P = v.useCallback((e) => {
-		N((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
-	}, [N]), F = v.useRef(null), I = v.useCallback((e, t) => {
-		let n = F.current ??= /* @__PURE__ */ new Map(), r = `${e}:${t}`, i = (n.get(r) ?? 0) + 1;
-		return n.set(r, i), i > 1 && O(e, t), () => {
-			let e = (n.get(r) ?? 1) - 1;
-			e > 0 ? n.set(r, e) : n.delete(r);
-		};
-	}, []), [L] = v.useState(S), R = v.useMemo(() => ({
-		value: E,
-		select: A,
-		openCategories: M,
-		toggleCategory: P,
-		registerValue: I,
-		currentCategory: h,
-		categoryStore: L
-	}), [
-		E,
-		A,
-		M,
-		P,
-		I,
-		h,
-		L
-	]);
-	return /* @__PURE__ */ b(C.Provider, {
-		value: R,
-		children: /* @__PURE__ */ b("nav", {
-			"aria-label": "Navigation",
-			...x,
-			ref: y,
-			className: e(l.root, "w-60 border-e border-border bg-background py-2", g),
-			children: /* @__PURE__ */ b("ul", {
-				className: e(l.list, "m-0 list-none p-0"),
-				children: _
-			})
-		})
-	});
-};
-q.displayName = "Nav";
-var J = /* @__PURE__ */ Object.assign(q, {
-	Category: W,
-	Item: G,
-	SubItem: K
+z.displayName = "NavCategory", h(z, "category");
+function B(e) {
+	let t = g("Nav.Item");
+	v(t, "item", e.value), y(t, e.value);
+	let n = T.useContext(p), r = c("wave-nav-item");
+	return R(e, t, n, j, {
+		root: o.root,
+		listItem: o.listItem,
+		actions: o.actions,
+		icon: o.icon,
+		content: o.content
+	}, !0, r);
+}
+B.displayName = "NavItem", h(B, "entry");
+function V(e) {
+	let t = g("Nav.SubItem");
+	v(t, "item", e.value), y(t, e.value);
+	let n = T.useContext(p), r = c("wave-nav-item");
+	return R(e, t, n, M, {
+		root: s.root,
+		listItem: s.listItem,
+		actions: s.actions
+	}, !1, r);
+}
+V.displayName = "NavSubItem", h(V, "entry");
+var H = /* @__PURE__ */ Object.assign(w, {
+	Category: z,
+	Item: B,
+	SubItem: V,
+	SectionHeader: C,
+	Divider: S,
+	AppItem: b,
+	AppItemStatic: x
 });
 //#endregion
-export { J as Nav, W as NavCategory, G as NavItem, K as NavSubItem };
+export { H as Nav, b as NavAppItem, x as NavAppItemStatic, z as NavCategory, S as NavDivider, B as NavItem, C as NavSectionHeader, V as NavSubItem };
 
 //# sourceMappingURL=Nav.mjs.map