themelia-react-ui 2.0.6 → 3.0.0

package/dist/features/global-search.js

@@ -1,28 +1,28 @@
 "use client";
 import { interpolateString as e, useStrings as t } from "../lib/strings.js";
-import { t as n } from "../utils-DhuoqFy4.js";
-import { t as r } from "../buttons-DeW0bQeK.js";
-import { c as i } from "../typography-C7-YMW1S.js";
-import { t as a } from "../focus-recipes-B653VaLq.js";
-import { t as o } from "../structure-DZJ2wbAU.js";
+import { t as n } from "../utils-BVbAG2J6.js";
+import { c as r } from "../typography-C0dELqYV.js";
+import { t as i } from "../focus-recipes-DSkiUvUp.js";
+import { t as a } from "../buttons-pZVgPTZn.js";
+import { t as o } from "../structure-DElaQwwN.js";
 import { i as s, n as c } from "../tone-recipes-BPsRAvhu.js";
-import { a as l, n as u } from "../surface-recipes-C8mNycaY.js";
-import { a as d, n as f, r as p } from "../popover.recipes-DJ0AkUan.js";
-import { r as m } from "../overlays-CC8zI3Du.js";
-import { t as h } from "../interaction-recipes-4wZ2tvfb.js";
-import { _ as g, g as _ } from "../primitives-BkkQjYl7.js";
-import { i as v, n as y, s as b } from "../avatar-B9Jnp-T-.js";
-import { t as x } from "../badge-wWauMgAt.js";
-import { n as S, t as C } from "../field-affordance-recipes-D6H7tVJi.js";
-import { a as w, c as T, o as E } from "../text-inputs-jdkS3ReG.js";
-import { i as D, r as O, t as k } from "../tabs-C4Kr_hCr.js";
-import { s as A } from "../data-display-Cmj-xZYl.js";
+import { r as l, s as u } from "../surface-recipes-DV6rrOFq.js";
+import { a as d, n as f, r as p } from "../popover.recipes-BqkdvlZn.js";
+import { r as m } from "../overlays-D-gAIfPF.js";
+import { t as h } from "../interaction-recipes-DmuS1ase.js";
+import { _ as g, g as _ } from "../primitives-BlC1lXBr.js";
+import { i as v, n as y, s as b } from "../avatar-Ca3Ihrq4.js";
+import { t as x } from "../badge-oGiXblW7.js";
+import { n as S, t as C } from "../field-affordance-recipes-DfbMadot.js";
+import { a as w, c as T, o as E } from "../text-inputs-ljyBYaCd.js";
+import { i as D, r as O, t as k } from "../tabs-WnHfV2pM.js";
+import { s as A } from "../data-display-CWe9SOYh.js";
 import * as j from "react";
-import { useEffect as M, useMemo as N, useRef as P, useState as F } from "react";
-import { Fragment as ee, jsx as I, jsxs as L } from "react/jsx-runtime";
-import { ArrowRight as te, Loader2 as ne, Search as R } from "lucide-react";
+import { useCallback as M, useEffect as N, useMemo as P, useRef as F, useState as I } from "react";
+import { Fragment as L, jsx as R, jsxs as z } from "react/jsx-runtime";
+import { ArrowRight as B, Loader2 as V, Search as H } from "lucide-react";
 //#region src/components/features/global-search/global-search.strings.ts
-var z = {
+var U = {
 	dialogTitle: "Search",
 	placeholder: "Search…",
 	clear: "Clear search",
@@ -31,6 +31,7 @@ var z = {
 	emptyHint: "Try a shorter keyword or check the spelling.",
 	idleRecent: "Recent",
 	idleSuggestions: "Suggestions",
+	idleHint: "Type at least {{count}} characters to search.",
 	tabAll: "All",
 	footerNavigate: "navigate",
 	footerOpen: "open",
@@ -38,29 +39,32 @@ var z = {
 	resultsCount: "{{count}} results",
 	seeAll: "See all"
 };
+function ee(e, t) {
+	return e.formatResultsCount ? e.formatResultsCount(t) : (t === 1 && e.resultsCount === U.resultsCount ? "{{count}} result" : e.resultsCount).replace(/\{\{\s*count\s*\}\}/g, String(t));
+}
 //#endregion
 //#region src/components/features/global-search/hooks/use-global-search.ts
-function B({ results: e, query: t, onResultSelect: n, onClose: r }) {
-	let [i, a] = F("all"), [o, s] = F(0);
-	M(() => {
+function W({ results: e, query: t, onResultSelect: n, onClose: r }) {
+	let [i, a] = I("all"), [o, s] = I(0);
+	N(() => {
 		a("all"), s(0);
 	}, [t]);
-	let c = N(() => {
+	let c = P(() => {
 		let t = {};
 		for (let n of e) (t[n.group] ??= []).push(n);
 		return t;
-	}, [e]), l = N(() => {
+	}, [e]), l = P(() => {
 		let t = { all: e.length };
 		for (let [e, n] of Object.entries(c)) t[e] = n.length;
 		return t;
-	}, [e.length, c]), u = N(() => {
+	}, [e.length, c]), u = P(() => {
 		if (i === "all") return c;
 		let e = c[i];
 		return e ? { [i]: e } : {};
-	}, [c, i]), d = N(() => Object.values(u).flat(), [u]), f = P(o);
-	f.current = o;
-	let p = P(d);
-	return p.current = d, {
+	}, [c, i]), d = P(() => Object.values(u).flat(), [u]), f = Math.min(Math.max(o, 0), Math.max(d.length - 1, 0)), p = F(f);
+	p.current = f;
+	let m = F(d);
+	return m.current = d, {
 		grouped: c,
 		tabCounts: l,
 		activeTab: i,
@@ -69,33 +73,33 @@ function B({ results: e, query: t, onResultSelect: n, onClose: r }) {
 		},
 		visibleGrouped: u,
 		flat: d,
-		activeIdx: o,
+		activeIdx: f,
 		setActiveIdx: s,
 		setActiveById: (e) => {
-			let t = p.current.findIndex((t) => t.id === e);
+			let t = m.current.findIndex((t) => t.id === e);
 			t >= 0 && s(t);
 		},
 		onKeyDown: (e) => {
-			if (e.key === "ArrowDown") e.preventDefault(), s((e) => Math.min(e + 1, p.current.length - 1));
-			else if (e.key === "ArrowUp") e.preventDefault(), s((e) => Math.max(e - 1, 0));
+			if (e.key === "ArrowDown") e.preventDefault(), s(Math.min(p.current + 1, Math.max(m.current.length - 1, 0)));
+			else if (e.key === "ArrowUp") e.preventDefault(), s(Math.max(p.current - 1, 0));
 			else if (e.key === "Enter") {
-				let t = p.current[f.current];
+				let t = m.current[p.current];
 				t && (e.preventDefault(), n?.(t));
 			} else e.key === "Escape" && r?.();
 		},
 		selectActive: () => {
-			let e = p.current[f.current];
+			let e = m.current[p.current];
 			e && n?.(e);
 		}
 	};
 }
 //#endregion
 //#region src/components/features/global-search/partials/global-search-empty-state.tsx
-function V({ title: e, hint: t }) {
-	return /* @__PURE__ */ I(A, {
+function G({ title: e, hint: t }) {
+	return /* @__PURE__ */ R(A, {
 		title: e,
 		description: t,
-		media: /* @__PURE__ */ I(R, {
+		media: /* @__PURE__ */ R(H, {
 			className: "size-icon",
 			"aria-hidden": "true"
 		}),
@@ -106,13 +110,13 @@ function V({ title: e, hint: t }) {
 }
 //#endregion
 //#region src/components/features/global-search/partials/global-search-footer.tsx
-function H({ keys: e, label: t }) {
-	return /* @__PURE__ */ L("span", {
+function K({ keys: e, label: t }) {
+	return /* @__PURE__ */ z("span", {
 		className: "global-search-footer--shortcut inline-flex items-center gap-space-xs",
-		children: [/* @__PURE__ */ I("kbd", {
-			className: u,
+		children: [/* @__PURE__ */ R("kbd", {
+			className: l,
 			children: e
-		}), /* @__PURE__ */ I(i, {
+		}), /* @__PURE__ */ R(r, {
 			tag: "span",
 			size: "xs",
 			type: "secondary",
@@ -120,28 +124,28 @@ function H({ keys: e, label: t }) {
 		})]
 	});
 }
-function U({ navigateLabel: e, openLabel: t, closeLabel: r, trailing: i, className: a }) {
-	return /* @__PURE__ */ I("div", {
-		className: n("global-search-footer--component", p.menuRegion, l.anchored.footer, a),
-		children: /* @__PURE__ */ L("div", {
+function q({ navigateLabel: e, openLabel: t, closeLabel: r, trailing: i, className: a }) {
+	return /* @__PURE__ */ R("div", {
+		className: n("global-search-footer--component", p.menuRegion, u.anchored.footer, a),
+		children: /* @__PURE__ */ z("div", {
 			className: n("global-search-footer--body flex flex-col items-stretch gap-space-xs", p.menuCopyInset, "@sm/global-search:flex-row @sm/global-search:items-center @sm/global-search:justify-between"),
-			children: [/* @__PURE__ */ L("span", {
+			children: [/* @__PURE__ */ z("span", {
 				className: "global-search-footer--shortcuts flex flex-wrap items-center gap-x-space-lg gap-y-space-xs",
 				children: [
-					/* @__PURE__ */ I(H, {
+					/* @__PURE__ */ R(K, {
 						keys: "↑↓",
 						label: e
 					}),
-					/* @__PURE__ */ I(H, {
+					/* @__PURE__ */ R(K, {
 						keys: "↵",
 						label: t
 					}),
-					/* @__PURE__ */ I(H, {
+					/* @__PURE__ */ R(K, {
 						keys: "esc",
 						label: r
 					})
 				]
-			}), i ? /* @__PURE__ */ I("span", {
+			}), i ? /* @__PURE__ */ R("span", {
 				className: "global-search-footer--trailing shrink-0 self-end whitespace-nowrap @sm/global-search:self-auto",
 				children: i
 			}) : null]
@@ -150,15 +154,15 @@ function U({ navigateLabel: e, openLabel: t, closeLabel: r, trailing: i, classNa
 }
 //#endregion
 //#region src/components/features/global-search/partials/global-search-group-heading.tsx
-function W({ label: e, icon: t, action: n }) {
-	return /* @__PURE__ */ L("div", {
+function J({ label: e, icon: t, action: n }) {
+	return /* @__PURE__ */ z("div", {
 		className: "global-search-group--heading flex items-center justify-between gap-space-sm px-row-x pt-space-md pb-space-xs",
-		children: [/* @__PURE__ */ L("span", {
+		children: [/* @__PURE__ */ z("span", {
 			className: "inline-flex min-w-0 items-center gap-space-sm",
-			children: [!!t && /* @__PURE__ */ I(t, {
+			children: [!!t && /* @__PURE__ */ R(t, {
 				className: "size-icon-sm shrink-0 text-muted-foreground",
 				"aria-hidden": "true"
-			}), /* @__PURE__ */ I(i, {
+			}), /* @__PURE__ */ R(r, {
 				tag: "span",
 				size: "xs",
 				type: "secondary",
@@ -172,26 +176,26 @@ function W({ label: e, icon: t, action: n }) {
 }
 //#endregion
 //#region src/components/features/global-search/partials/global-search-idle-state.tsx
-function G({ sections: e, fallbackIcons: t }) {
-	return /* @__PURE__ */ I("div", {
+function Y({ sections: e, fallbackIcons: t, fallbackLabels: a }) {
+	return /* @__PURE__ */ R("div", {
 		className: n("global-search-idle-state--component", d.compact),
-		children: e.map((e, r) => /* @__PURE__ */ L("div", {
+		children: e.map((e, o) => /* @__PURE__ */ z("div", {
 			className: "global-search-idle-state--section",
-			children: [/* @__PURE__ */ I(W, {
-				label: e.label,
-				icon: e.icon ?? (r === 0 ? t?.recent : t?.suggestions)
-			}), /* @__PURE__ */ I("ul", {
+			children: [/* @__PURE__ */ R(J, {
+				label: e.label ?? (o === 0 ? a?.recent : a?.suggestions),
+				icon: e.icon ?? (o === 0 ? t?.recent : t?.suggestions)
+			}), /* @__PURE__ */ R("ul", {
 				className: "m-0 flex list-none flex-col p-0",
 				children: e.items.map((e) => {
-					let t = e.icon ?? R;
-					return /* @__PURE__ */ I("li", { children: /* @__PURE__ */ L("button", {
+					let t = e.icon ?? H;
+					return /* @__PURE__ */ R("li", { children: /* @__PURE__ */ z("button", {
 						type: "button",
 						onClick: e.onSelect,
-						className: n(`${h.nativeButtonReset} flex w-full cursor-pointer items-center justify-start text-inherit outline-none ${a.inset} text-left transition-colors`, f(), h.rowHover),
-						children: [/* @__PURE__ */ I(t, {
+						className: n(`${h.nativeButtonReset} flex w-full cursor-pointer items-center justify-start text-inherit outline-none ${i.inset} text-left transition-colors`, f(), h.rowHover),
+						children: [/* @__PURE__ */ R(t, {
 							className: "size-icon shrink-0 text-muted-foreground",
 							"aria-hidden": "true"
-						}), /* @__PURE__ */ I(i, {
+						}), /* @__PURE__ */ R(r, {
 							tag: "span",
 							type: "inherit",
 							weight: "medium",
@@ -207,18 +211,18 @@ function G({ sections: e, fallbackIcons: t }) {
 }
 //#endregion
 //#region src/components/features/global-search/partials/global-search-input.tsx
-var K = j.forwardRef(function({ value: e, onValueChange: t, onKeyDown: r, placeholder: i, clearLabel: a = "Clear search", loading: o = !1, autoFocus: s = !1, expanded: c, controls: l, activeDescendant: u }, d) {
-	let f = j.useRef(null);
-	return j.useImperativeHandle(d, () => f.current), j.useEffect(() => {
-		s && f.current?.focus();
-	}, [s]), /* @__PURE__ */ I("div", {
+var X = j.forwardRef(function({ value: e, onValueChange: t, onKeyDown: r, placeholder: i, clearLabel: a = "Clear search", loading: o = !1, autoFocus: s = !1, expanded: c, controls: l, activeDescendant: u, className: d }, f) {
+	let m = j.useRef(null);
+	return j.useImperativeHandle(f, () => m.current), j.useEffect(() => {
+		s && m.current?.focus();
+	}, [s]), /* @__PURE__ */ R("div", {
 		"data-component": "global-search-input",
 		"data-slot": "global-search-input",
-		className: n("global-search-input--component pt-surface-xs pb-space-xs", p.menuInline),
-		children: /* @__PURE__ */ L(w, { children: [
-			/* @__PURE__ */ I(E, { children: /* @__PURE__ */ I(R, { "aria-hidden": "true" }) }),
-			/* @__PURE__ */ I(T, {
-				ref: f,
+		className: n("global-search-input--component pt-surface-xs pb-space-xs", p.menuInline, d),
+		children: /* @__PURE__ */ z(w, { children: [
+			/* @__PURE__ */ R(E, { children: /* @__PURE__ */ R(H, { "aria-hidden": "true" }) }),
+			/* @__PURE__ */ R(T, {
+				ref: m,
 				type: "text",
 				value: e,
 				onChange: (e) => t(e.target.value),
@@ -235,19 +239,19 @@ var K = j.forwardRef(function({ value: e, onValueChange: t, onKeyDown: r, placeh
 				autoComplete: "off",
 				spellCheck: !1
 			}),
-			(o || !!e) && /* @__PURE__ */ I(E, {
+			(o || !!e) && /* @__PURE__ */ R(E, {
 				align: "inline-end",
-				children: o ? /* @__PURE__ */ I(ne, {
+				children: o ? /* @__PURE__ */ R(V, {
 					className: "animate-spin",
 					"aria-hidden": "true"
-				}) : /* @__PURE__ */ I("button", {
+				}) : /* @__PURE__ */ R("button", {
 					type: "button",
 					onClick: () => {
-						t(""), f.current?.focus();
+						t(""), m.current?.focus();
 					},
 					"aria-label": a,
 					className: n(S.target, S.focus, S.clear),
-					children: /* @__PURE__ */ I(C, {
+					children: /* @__PURE__ */ R(C, {
 						className: S.icon,
 						"aria-hidden": "true"
 					})
@@ -255,32 +259,32 @@ var K = j.forwardRef(function({ value: e, onValueChange: t, onKeyDown: r, placeh
 			})
 		] })
 	});
-}), q = (e) => `${s[e].tint} ${s[e].ink}`, J = {
+}), Z = (e) => `${s[e].tint} ${s[e].ink}`, Q = {
 	neutral: "bg-muted text-muted-foreground",
-	primary: q("primary"),
-	success: q("success"),
-	warning: q("warning"),
-	info: q("info"),
-	destructive: q("destructive")
-}, re = { ...J };
+	primary: Z("primary"),
+	success: Z("success"),
+	warning: Z("warning"),
+	info: Z("info"),
+	destructive: Z("destructive")
+}, te = { ...Q };
 //#endregion
 //#region src/components/features/global-search/partials/global-search-result-row.tsx
-function Y(e, t) {
+function $(e, t) {
 	let n = (t ?? "").trim();
 	if (!n) return e;
 	let r = e.toLowerCase(), i = n.toLowerCase(), a = r.indexOf(i);
-	return a < 0 ? e : /* @__PURE__ */ L(ee, { children: [
+	return a < 0 ? e : /* @__PURE__ */ z(L, { children: [
 		e.slice(0, a),
-		/* @__PURE__ */ I("mark", {
+		/* @__PURE__ */ R("mark", {
 			className: c.match,
 			children: e.slice(a, a + n.length)
 		}),
 		e.slice(a + n.length)
 	] });
 }
-function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter: c, optionId: l, className: u }) {
-	let d = e.thumbnail?.icon, p = J, m = re, S = (e) => (e ?? "neutral") === "neutral" && (t ? "bg-card" : "group-hover/row:bg-card");
-	return /* @__PURE__ */ L("button", {
+function ne({ result: e, active: t = !1, query: a = "", onSelect: s, onMouseEnter: c, optionId: l, className: u }) {
+	let d = e.thumbnail?.icon, p = Q, m = te, S = (e) => (e ?? "neutral") === "neutral" && (t ? "bg-card" : "group-hover/row:bg-card");
+	return /* @__PURE__ */ z("button", {
 		type: "button",
 		"data-component": "global-search-result-row",
 		"data-slot": "global-search-result-row",
@@ -292,40 +296,40 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 		} : {},
 		onMouseEnter: c,
 		onClick: s,
-		className: n(`${h.nativeButtonReset} group/row relative flex w-full cursor-pointer items-center justify-start text-inherit outline-none ${a.inset} text-left transition-colors`, f(), "global-search-result-row--component", t ? h.rowSelected : h.rowHover, u),
+		className: n(`${h.nativeButtonReset} group/row relative flex w-full cursor-pointer items-center justify-start text-inherit outline-none ${i.inset} text-left transition-colors`, f(), "global-search-result-row--component", t ? h.rowSelected : h.rowHover, u),
 		children: [
-			/* @__PURE__ */ I("div", {
+			/* @__PURE__ */ R("div", {
 				className: "flex shrink-0 items-center",
-				children: e.avatar ? /* @__PURE__ */ L(y, {
+				children: e.avatar ? /* @__PURE__ */ z(y, {
 					className: n("size-avatar-sm", m[e.avatar.tone ?? "neutral"], S(e.avatar.tone)),
-					children: [e.avatar.src && /* @__PURE__ */ I(b, {
+					children: [e.avatar.src && /* @__PURE__ */ R(b, {
 						src: e.avatar.src,
 						alt: e.title
-					}), /* @__PURE__ */ I(v, {
-						className: n("text-xs font-semibold", m[e.avatar.tone ?? "neutral"], S(e.avatar.tone)),
+					}), /* @__PURE__ */ R(v, {
+						className: n(m[e.avatar.tone ?? "neutral"], S(e.avatar.tone)),
 						children: e.avatar.initials
 					})]
-				}) : d ? /* @__PURE__ */ I("span", {
+				}) : d ? /* @__PURE__ */ R("span", {
 					className: n("inline-flex size-avatar-sm items-center justify-center rounded-radius", p[e.thumbnail?.tone ?? "neutral"], S(e.thumbnail?.tone)),
-					children: /* @__PURE__ */ I(d, {
+					children: /* @__PURE__ */ R(d, {
 						className: "size-icon-sm",
 						"aria-hidden": "true"
 					})
 				}) : null
 			}),
-			/* @__PURE__ */ L(o, {
+			/* @__PURE__ */ z(o, {
 				gap: "dense",
 				className: "min-w-0 flex-1",
-				children: [/* @__PURE__ */ L("div", {
+				children: [/* @__PURE__ */ z("div", {
 					className: "flex min-w-0 items-center gap-space-sm",
-					children: [/* @__PURE__ */ I(i, {
+					children: [/* @__PURE__ */ R(r, {
 						tag: "span",
 						type: "inherit",
 						weight: "medium",
 						lineHeight: "tight",
 						className: "truncate",
-						children: Y(e.title, r)
-					}), !!e.badge && /* @__PURE__ */ I(x, {
+						children: $(e.title, a)
+					}), !!e.badge && /* @__PURE__ */ R(x, {
 						tone: e.badge.tone === "destructive" ? "destructive" : e.badge.tone,
 						children: e.badge.label
 					})]
@@ -333,23 +337,23 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 					let t = [];
 					return e.subtitle && t.push({
 						key: "subtitle",
-						node: /* @__PURE__ */ I(i, {
+						node: /* @__PURE__ */ R(r, {
 							tag: "span",
 							size: "xs",
 							type: "secondary",
 							className: "min-w-0 break-words",
-							children: Y(e.subtitle, r)
+							children: $(e.subtitle, a)
 						})
-					}), e.meta?.forEach((e, r) => {
+					}), e.meta?.forEach((e, i) => {
 						let a = e.icon;
 						t.push({
-							key: `m-${r}`,
-							node: /* @__PURE__ */ L(i, {
+							key: `m-${i}`,
+							node: /* @__PURE__ */ z(r, {
 								tag: "span",
 								size: "xs",
 								type: "secondary",
 								className: n("inline-flex min-w-0 items-center gap-space-xs break-words", e.mono && "font-mono tabular-nums"),
-								children: [!!a && /* @__PURE__ */ I(a, {
+								children: [!!a && /* @__PURE__ */ R(a, {
 									className: "size-icon-sm shrink-0",
 									"aria-hidden": "true"
 								}), e.label]
@@ -357,14 +361,14 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 						});
 					}), e.timestamp && t.push({
 						key: "ts",
-						node: /* @__PURE__ */ I(_, {
+						node: /* @__PURE__ */ R(_, {
 							size: "xs",
 							className: "tabular-nums",
 							children: e.timestamp
 						})
 					}), e.tags?.forEach((e) => t.push({
 						key: `t-${e}`,
-						node: /* @__PURE__ */ I(i, {
+						node: /* @__PURE__ */ R(r, {
 							tag: "span",
 							size: "xs",
 							type: "secondary",
@@ -373,22 +377,22 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 						})
 					})), e.rightValue && t.push({
 						key: "rv",
-						node: /* @__PURE__ */ L(g, {
+						node: /* @__PURE__ */ z(g, {
 							type: "inherit",
 							weight: "medium",
 							className: "inline-flex flex-wrap items-baseline gap-space-xs tabular-nums",
-							children: [e.rightValue, !!e.rightLabel && /* @__PURE__ */ I(i, {
+							children: [e.rightValue, !!e.rightLabel && /* @__PURE__ */ R(r, {
 								tag: "span",
 								size: "inherit",
 								type: "secondary",
 								children: e.rightLabel.toLowerCase()
 							})]
 						})
-					}), t.length === 0 ? null : /* @__PURE__ */ I("div", {
+					}), t.length === 0 ? null : /* @__PURE__ */ R("div", {
 						className: "flex min-w-0 flex-wrap items-baseline gap-x-space-sm gap-y-dense break-words",
-						children: t.map((e, t) => /* @__PURE__ */ L("span", {
+						children: t.map((e, t) => /* @__PURE__ */ z("span", {
 							className: n("inline-flex min-w-0 max-w-full items-baseline gap-space-sm", e.key === "rv" && "@xl/global-search:hidden"),
-							children: [t > 0 && /* @__PURE__ */ I(i, {
+							children: [t > 0 && /* @__PURE__ */ R(r, {
 								tag: "span",
 								size: "xs",
 								type: "secondary",
@@ -400,18 +404,18 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 					});
 				})()]
 			}),
-			!!(e.rightValue || e.rightLabel) && /* @__PURE__ */ I("div", {
+			!!(e.rightValue || e.rightLabel) && /* @__PURE__ */ R("div", {
 				className: "hidden shrink-0 items-center self-stretch @xl/global-search:flex",
-				children: /* @__PURE__ */ L(o, {
+				children: /* @__PURE__ */ z(o, {
 					gap: "dense",
 					align: "end",
 					className: "text-right leading-tight",
-					children: [!!e.rightValue && /* @__PURE__ */ I(g, {
+					children: [!!e.rightValue && /* @__PURE__ */ R(g, {
 						type: "inherit",
 						weight: "semibold",
 						className: "whitespace-nowrap tabular-nums",
 						children: e.rightValue
-					}), !!e.rightLabel && /* @__PURE__ */ I(i, {
+					}), !!e.rightLabel && /* @__PURE__ */ R(r, {
 						tag: "span",
 						size: "xs",
 						type: "secondary",
@@ -420,7 +424,7 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 					})]
 				})
 			}),
-			/* @__PURE__ */ I(te, {
+			/* @__PURE__ */ R(B, {
 				"aria-hidden": "true",
 				className: n("size-icon shrink-0 transition-opacity", t ? "text-inherit opacity-100" : "text-muted-foreground opacity-0 group-hover/row:opacity-100")
 			})
@@ -429,26 +433,26 @@ function X({ result: e, active: t = !1, query: r = "", onSelect: s, onMouseEnter
 }
 //#endregion
 //#region src/components/features/global-search/partials/global-search-tabs.tsx
-function Z({ value: e, onValueChange: t, tabs: r, counts: a }) {
-	return /* @__PURE__ */ I("div", {
-		className: n("global-search-tabs--component", l.anchored.header),
-		children: /* @__PURE__ */ I("div", {
+function re({ value: e, onValueChange: t, tabs: i, counts: a }) {
+	return /* @__PURE__ */ R("div", {
+		className: n("global-search-tabs--component", u.anchored.header),
+		children: /* @__PURE__ */ R("div", {
 			className: n("global-search-tabs--scroller overflow-x-auto pt-space-xs pb-space-md [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", p.menuInline),
-			children: /* @__PURE__ */ I(k, {
+			children: /* @__PURE__ */ R(k, {
 				value: e,
 				onValueChange: (e) => t(e),
 				className: "min-w-max",
-				children: /* @__PURE__ */ I(O, {
+				children: /* @__PURE__ */ R(O, {
 					className: "global-search-tabs--list h-action-sm w-max min-w-max",
-					children: r.map((e) => {
+					children: i.map((e) => {
 						let t = a[e.value] ?? 0;
-						return /* @__PURE__ */ L(D, {
+						return /* @__PURE__ */ z(D, {
 							value: e.value,
 							className: "global-search-tabs--trigger shrink-0 gap-space-sm px-control-sm text-foreground",
-							children: [/* @__PURE__ */ I(i, {
+							children: [/* @__PURE__ */ R(r, {
 								tag: "span",
 								children: e.label
-							}), /* @__PURE__ */ I(x, {
+							}), /* @__PURE__ */ R(x, {
 								size: "sm",
 								tone: "secondary",
 								className: "global-search-tabs--count tabular-nums",
@@ -463,105 +467,139 @@ function Z({ value: e, onValueChange: t, tabs: r, counts: a }) {
 }
 //#endregion
 //#region src/components/features/global-search/global-search.tsx
-function Q({ results: a = [], query: o, onQueryChange: s, onResultSelect: c, onClose: l, loading: u = !1, idleSections: f, groupLabels: p, autoFocus: m = !1, strings: h, slots: g, tabs: _, className: v }) {
-	let y = t(z, h), b = B({
-		results: a,
+function ie({ results: i = [], query: o, onQueryChange: s, onResultSelect: c, onClose: l, loading: u = !1, minQueryLength: f = 2, idleSections: p, groupLabels: m, autoFocus: h = !1, strings: g, slots: _, tabs: v, className: y }) {
+	let b = t(U, g), x = W({
+		results: i,
 		query: o,
 		onResultSelect: c,
 		onClose: l
-	}), x = !u && o.trim().length > 1 && a.length === 0, S = !u && o.trim().length <= 1, C = j.useId(), w = !u && a.length > 0, T = new Map(b.flat.map((e, t) => [e.id, t])), E = (e) => `${C}-option-${e}`, D = Object.keys(b.visibleGrouped), O = (e) => `${C}-group-${e}`, k = w && b.flat[b.activeIdx] ? E(b.activeIdx) : void 0, A = j.useMemo(() => {
-		if (_) return _;
-		let e = Object.keys(b.grouped);
+	}), S = o.trim().length, C = !u && S >= f && i.length === 0, w = !u && S < f, T = j.useId(), E = !u && i.length > 0, D = new Map(x.flat.map((e, t) => [e.id, t])), O = (e) => `${T}-option-${e}`, k = Object.keys(x.visibleGrouped), A = (e) => `${T}-group-${e}`, M = E && x.flat[x.activeIdx] ? O(x.activeIdx) : void 0, N = k.map((e, t) => A(t)).join(" "), P = E ? ee(b, i.length) : "", [F, I] = j.useState(0), L = j.useRef(!1), B = (e) => {
+		(e.key === "ArrowDown" || e.key === "ArrowUp") && (L.current = !0, I((e) => e + 1)), x.onKeyDown(e);
+	};
+	j.useEffect(() => {
+		if (!L.current) return;
+		L.current = !1;
+		let e = M ? document.getElementById(M) : null;
+		typeof e?.scrollIntoView == "function" && e.scrollIntoView({ block: "nearest" });
+	}, [F, M]);
+	let V = j.useMemo(() => {
+		if (v) return v;
+		let e = Object.keys(x.grouped);
 		return [{
 			value: "all",
-			label: y.tabAll
+			label: b.tabAll
 		}, ...e.map((e) => ({
 			value: e,
-			label: p?.[e] ?? e
+			label: m?.[e] ?? e
 		}))];
 	}, [
-		_,
-		b.grouped,
-		y.tabAll,
-		p
+		v,
+		x.grouped,
+		b.tabAll,
+		m
 	]);
-	return /* @__PURE__ */ L("div", {
+	return /* @__PURE__ */ z("div", {
 		"data-component": "global-search",
 		"data-slot": "global-search",
-		className: n("global-search--component", "@container/global-search overflow-hidden rounded-surface border border-border bg-card text-card-foreground shadow-xl", v),
+		className: n("global-search--component", "@container/global-search overflow-hidden rounded-surface border border-border bg-card text-card-foreground shadow-xl", y),
 		children: [
-			g?.input ?? /* @__PURE__ */ I(K, {
+			typeof _?.input == "function" ? _.input({
+				query: o,
+				onQueryChange: s,
+				onKeyDown: B,
+				expanded: E,
+				controls: N,
+				activeDescendant: M,
+				loading: u
+			}) : _?.input ?? /* @__PURE__ */ R(X, {
 				value: o,
 				onValueChange: s,
-				onKeyDown: b.onKeyDown,
-				placeholder: y.placeholder,
-				clearLabel: y.clear,
+				onKeyDown: B,
+				placeholder: b.placeholder,
+				clearLabel: b.clear,
 				loading: u,
-				autoFocus: m,
-				expanded: w,
-				controls: D.map((e, t) => O(t)).join(" "),
-				activeDescendant: k
+				autoFocus: h,
+				expanded: E,
+				controls: N,
+				activeDescendant: M
 			}),
-			!u && a.length > 0 && (g?.tabs ?? /* @__PURE__ */ I(Z, {
-				value: b.activeTab,
-				onValueChange: b.setActiveTab,
-				tabs: A,
-				counts: b.tabCounts
+			/* @__PURE__ */ R("span", {
+				role: "status",
+				"aria-live": "polite",
+				className: "global-search--status sr-only",
+				children: u ? b.loading : P
+			}),
+			!u && i.length > 0 && (_?.tabs ?? /* @__PURE__ */ R(re, {
+				value: x.activeTab,
+				onValueChange: x.setActiveTab,
+				tabs: V,
+				counts: x.tabCounts
 			})),
-			/* @__PURE__ */ L("div", {
+			/* @__PURE__ */ z("div", {
 				className: "global-search--viewport max-h-130 overflow-y-auto",
 				children: [
-					!!S && (g?.idle ?? (f && f.length > 0 ? /* @__PURE__ */ I(G, { sections: f }) : null)),
-					!!u && (g?.loading ?? /* @__PURE__ */ I("div", {
+					!!w && (_?.idle ?? (p && p.length > 0 ? /* @__PURE__ */ R(Y, {
+						sections: p,
+						fallbackLabels: {
+							recent: b.idleRecent,
+							suggestions: b.idleSuggestions
+						}
+					}) : S > 0 && i.length === 0 && b.idleHint ? /* @__PURE__ */ R("div", {
+						className: "global-search--hint flex items-center justify-center px-row-x py-space-xl",
+						children: /* @__PURE__ */ R(r, {
+							type: "secondary",
+							children: e(b.idleHint, { count: f })
+						})
+					}) : null)),
+					!!u && (_?.loading ?? /* @__PURE__ */ R("div", {
 						className: "global-search--loading flex items-center justify-center px-row-x py-space-xl",
-						role: "status",
-						children: /* @__PURE__ */ I(i, {
+						children: /* @__PURE__ */ R(r, {
 							type: "secondary",
-							children: y.loading
+							children: b.loading
 						})
 					})),
-					!!x && (g?.empty ?? /* @__PURE__ */ I(V, {
-						title: e(y.emptyTitle, { query: o }),
-						hint: y.emptyHint
+					!!C && (_?.empty ?? /* @__PURE__ */ R(G, {
+						title: e(b.emptyTitle, { query: o }),
+						hint: b.emptyHint
 					})),
-					!u && a.length > 0 && /* @__PURE__ */ I("div", {
+					!u && i.length > 0 && /* @__PURE__ */ R("div", {
 						className: n("global-search--results", d.compact),
-						children: Object.entries(b.visibleGrouped).map(([e, t], n) => /* @__PURE__ */ L("div", {
+						children: Object.entries(x.visibleGrouped).map(([e, t], n) => /* @__PURE__ */ z("div", {
 							className: "global-search--group",
-							children: [/* @__PURE__ */ I(W, {
-								label: p?.[e] ?? e,
-								action: b.activeTab === "all" && t.length > 0 ? /* @__PURE__ */ I(r, {
+							children: [/* @__PURE__ */ R(J, {
+								label: m?.[e] ?? e,
+								action: x.activeTab === "all" && t.length > 0 ? /* @__PURE__ */ R(a, {
 									type: "button",
 									size: "sm",
-									onClick: () => b.setActiveTab(e),
+									onClick: () => x.setActiveTab(e),
 									className: "shrink-0",
-									children: y.seeAll
+									children: b.seeAll
 								}) : null
-							}), /* @__PURE__ */ I("ul", {
-								id: O(n),
+							}), /* @__PURE__ */ R("ul", {
+								id: A(n),
 								role: "listbox",
-								"aria-label": p?.[e] ?? e,
+								"aria-label": m?.[e] ?? e,
 								className: "m-0 flex list-none flex-col p-0",
 								children: t.map((e) => {
-									let t = b.flat[b.activeIdx]?.id === e.id, n = E(T.get(e.id) ?? -1), r = {
+									let t = x.flat[x.activeIdx]?.id === e.id, n = O(D.get(e.id) ?? -1), r = {
 										isActive: t,
 										query: o,
 										onSelect: () => c?.(e),
 										optionId: n
 									};
-									return g?.renderResult ? /* @__PURE__ */ I("li", {
+									return _?.renderResult ? /* @__PURE__ */ R("li", {
 										id: n,
 										role: "option",
 										"aria-selected": t,
-										children: g.renderResult(e, r)
-									}, e.id) : /* @__PURE__ */ I("li", {
+										children: _.renderResult(e, r)
+									}, e.id) : /* @__PURE__ */ R("li", {
 										role: "none",
-										children: /* @__PURE__ */ I(X, {
+										children: /* @__PURE__ */ R(ne, {
 											result: e,
 											active: t,
 											query: o,
 											onSelect: r.onSelect,
-											onMouseEnter: () => b.setActiveById(e.id),
+											onMouseEnter: () => x.setActiveById(e.id),
 											optionId: n
 										})
 									}, e.id);
@@ -571,16 +609,16 @@ function Q({ results: a = [], query: o, onQueryChange: s, onResultSelect: c, onC
 					})
 				]
 			}),
-			g?.footer ?? /* @__PURE__ */ I(U, {
-				navigateLabel: y.footerNavigate,
-				openLabel: y.footerOpen,
-				closeLabel: y.footerClose,
-				trailing: !S && !x && a.length > 0 ? /* @__PURE__ */ I(i, {
+			_?.footer ?? /* @__PURE__ */ R(q, {
+				navigateLabel: b.footerNavigate,
+				openLabel: b.footerOpen,
+				closeLabel: b.footerClose,
+				trailing: !w && !C && i.length > 0 ? /* @__PURE__ */ R(r, {
 					tag: "span",
 					size: "xs",
 					type: "secondary",
 					className: "tabular-nums",
-					children: e(y.resultsCount, { count: a.length })
+					children: P
 				}) : void 0
 			})
 		]
@@ -588,29 +626,35 @@ function Q({ results: a = [], query: o, onQueryChange: s, onResultSelect: c, onC
 }
 //#endregion
 //#region src/components/features/global-search/global-search-dialog.tsx
-function $({ open: e, onOpenChange: r, contentClassName: i, className: a, strings: o, autoFocus: s = !0, ...c }) {
-	let l = t(z, o), u = N(() => () => r(!1), [r]);
-	return /* @__PURE__ */ I(m, {
+function ae({ open: e, onOpenChange: r, contentClassName: i, className: a, strings: o, autoFocus: s = !0, closeOnSelect: c = !0, onResultSelect: l, ...u }) {
+	let d = t(U, o), f = M((e) => {
+		l?.(e), c && r(!1);
+	}, [
+		c,
+		r,
+		l
+	]);
+	return /* @__PURE__ */ R(m, {
 		open: e,
 		onOpenChange: r,
-		title: l.dialogTitle,
+		title: d.dialogTitle,
 		visuallyHideHeader: !0,
 		showCloseButton: !1,
 		showCancel: !1,
 		showConfirm: !1,
 		className: n("global-search-dialog--component", "w-full max-w-2xl overflow-visible border-0 bg-transparent p-0 shadow-none sm:max-w-2xl", "top-24 translate-y-0", i),
 		contentClassName: "p-0",
-		children: /* @__PURE__ */ I(Q, {
-			...c,
+		children: /* @__PURE__ */ R(ie, {
+			...u,
 			strings: o,
 			autoFocus: s,
-			onClose: u,
+			onResultSelect: f,
 			className: a
 		})
 	});
 }
-$.displayName = "GlobalSearchDialog";
+ae.displayName = "GlobalSearchDialog";
 //#endregion
-export { Q as GlobalSearch, $ as GlobalSearchDialog, V as GlobalSearchEmptyState, U as GlobalSearchFooter, G as GlobalSearchIdleState, K as GlobalSearchInput, X as GlobalSearchResultRow, Z as GlobalSearchTabs, z as defaultGlobalSearchStrings, B as useGlobalSearch };
+export { ie as GlobalSearch, ae as GlobalSearchDialog, G as GlobalSearchEmptyState, q as GlobalSearchFooter, Y as GlobalSearchIdleState, X as GlobalSearchInput, ne as GlobalSearchResultRow, re as GlobalSearchTabs, U as defaultGlobalSearchStrings, W as useGlobalSearch };
 
 //# sourceMappingURL=global-search.js.map