@devalok/shilp-sutra 0.38.0 → 0.40.0

package/dist/ai/command-bar.js

@@ -1,22 +1,24 @@
 "use client";
-import { springs as e, tweens as t } from "../ui/lib/motion.js";
-import { cn as n } from "../ui/lib/utils.js";
-import { Icon as r } from "../ui/icon.js";
-import { Dialog as i, DialogContentRaw as a, DialogDescription as o, DialogOverlay as ee, DialogPortal as te, DialogTitle as ne } from "../ui/dialog.js";
-import { VisuallyHidden as re } from "../ui/visually-hidden.js";
-import { n as ie } from "../_chunks/motion-provider.js";
+import { IconProvider as e } from "../ui/icon-context.js";
+import { springs as t, tweens as n } from "../ui/lib/motion.js";
+import { cn as r } from "../ui/lib/utils.js";
+import { Icon as i } from "../ui/icon.js";
+import { t as a } from "../_chunks/normalize-icon.js";
+import { Dialog as o, DialogContentRaw as s, DialogDescription as ee, DialogOverlay as te, DialogPortal as ne, DialogTitle as re } from "../ui/dialog.js";
+import { VisuallyHidden as ie } from "../ui/visually-hidden.js";
+import { n as c } from "../_chunks/motion-provider.js";
 import { n as ae, r as oe, t as se } from "../_chunks/keybinding.js";
-import * as s from "react";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { IconArrowDown as ce, IconArrowUp as le, IconCornerDownLeft as d, IconLoader2 as ue, IconSearch as de, IconX as fe } from "@tabler/icons-react";
-import { AnimatePresence as f, motion as p } from "framer-motion";
+import * as l from "react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { IconArrowDown as ce, IconArrowUp as le, IconCornerDownLeft as ue, IconLoader2 as de, IconSearch as fe, IconX as pe } from "@tabler/icons-react";
+import { AnimatePresence as p, motion as m } from "framer-motion";
 //#region src/ai/command-bar.tsx
-function pe({ active: e, rounded: t, reducedMotion: r, children: i }) {
-	return e ? r ? /* @__PURE__ */ l("div", {
-		className: n("p-[1.5px] bg-accent-9", t),
+function me({ active: e, rounded: t, reducedMotion: n, children: i }) {
+	return e ? n ? /* @__PURE__ */ d("div", {
+		className: r("p-[1.5px] bg-accent-9", t),
 		children: i
-	}) : /* @__PURE__ */ u(p.div, {
-		className: n("relative p-[1.5px]", t),
+	}) : /* @__PURE__ */ f(m.div, {
+		className: r("relative p-[1.5px]", t),
 		style: {
 			background: "linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)",
 			backgroundSize: "300% 300%"
@@ -31,8 +33,8 @@ function pe({ active: e, rounded: t, reducedMotion: r, children: i }) {
 			repeat: Infinity,
 			ease: "linear"
 		} },
-		children: [/* @__PURE__ */ l(p.div, {
-			className: n("absolute inset-0 -z-10", t),
+		children: [/* @__PURE__ */ d(m.div, {
+			className: r("absolute inset-0 -z-10", t),
 			style: {
 				background: "linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)",
 				backgroundSize: "300% 300%",
@@ -63,32 +65,32 @@ function pe({ active: e, rounded: t, reducedMotion: r, children: i }) {
 				}
 			}
 		}), i]
-	}) : /* @__PURE__ */ l(c, { children: i });
+	}) : /* @__PURE__ */ d(u, { children: i });
 }
-function me(e) {
+function he(e) {
 	return e.filterValue ? e.filterValue : typeof e.label == "string" ? e.label : "";
 }
-function he(e) {
+function ge(e) {
 	return typeof e.description == "string" ? e.description : "";
 }
-function ge({ placeholders: e, interval: n, paused: r }) {
-	let [i, a] = s.useState(0), { reducedMotion: o } = ie();
-	return s.useEffect(() => {
+function _e({ placeholders: e, interval: t, paused: r }) {
+	let [i, a] = l.useState(0), { reducedMotion: o } = c();
+	return l.useEffect(() => {
 		if (r || e.length <= 1) return;
-		let t = setInterval(() => {
+		let n = setInterval(() => {
 			a((t) => (t + 1) % e.length);
-		}, n);
-		return () => clearInterval(t);
+		}, t);
+		return () => clearInterval(n);
 	}, [
 		r,
 		e.length,
-		n
-	]), o ? /* @__PURE__ */ l("span", {
+		t
+	]), o ? /* @__PURE__ */ d("span", {
 		className: "pointer-events-none absolute text-surface-fg-subtle",
 		children: e[i]
-	}) : /* @__PURE__ */ l(f, {
+	}) : /* @__PURE__ */ d(p, {
 		mode: "wait",
-		children: /* @__PURE__ */ l(p.span, {
+		children: /* @__PURE__ */ d(m.span, {
 			initial: {
 				opacity: 0,
 				y: -4
@@ -101,203 +103,203 @@ function ge({ placeholders: e, interval: n, paused: r }) {
 				opacity: 0,
 				y: 4
 			},
-			transition: t.fade,
+			transition: n.fade,
 			className: "pointer-events-none absolute text-surface-fg-subtle",
 			children: e[i]
 		}, e[i])
 	});
 }
-var m = s.forwardRef(function({ onSubmit: c, state: m = "idle", groups: h = [], onSearch: _e, emptyMessage: ve = "No results found.", emptyState: ye, variant: g = "hero", placeholder: _ = "Ask anything...", placeholderInterval: be = 5e3, greeting: v, hints: y, agentName: b, agentIcon: xe, open: x, defaultOpen: Se, onOpenChange: S, keybinding: C = "mod+j", disabled: w = !1, maxHeight: T = "320px", children: E, className: D, ...O }, k) {
-	let A = x !== void 0, [Ce, we] = s.useState(Se ?? !1), j = A ? x : Ce, M = s.useRef(j);
-	M.current = j;
-	let N = s.useCallback((e) => {
-		let t = typeof e == "function" ? e(M.current) : e;
-		A || we(t), S?.(t);
-	}, [A, S]), [P, F] = s.useState(""), [I, L] = s.useState(-1), [Te, Ee] = s.useState(""), [R, De] = s.useState(!1), [z, Oe] = s.useState(!1), B = s.useRef(null), ke = s.useRef(null), V = s.useId(), Ae = `command-bar-listbox-${V}`, { reducedMotion: H } = ie(), U = { duration: 0 }, je = s.useMemo(() => se(), []), W = s.useMemo(() => Array.isArray(_) ? _ : [_], [_]), G = h.length > 0, K = s.useMemo(() => {
+var h = l.forwardRef(function({ onSubmit: u, state: h = "idle", groups: g = [], onSearch: _, emptyMessage: ve = "No results found.", emptyState: ye, variant: v = "hero", placeholder: y = "Ask anything...", placeholderInterval: be = 5e3, greeting: b, hints: x, agentName: xe, agentIcon: Se, open: Ce, defaultOpen: we, onOpenChange: Te, keybinding: S = "mod+j", disabled: C = !1, maxHeight: w = "320px", children: T, className: E, ...D }, O) {
+	let k = Ce !== void 0, [Ee, De] = l.useState(we ?? !1), A = k ? Ce : Ee, j = l.useRef(A);
+	j.current = A;
+	let M = l.useCallback((e) => {
+		let t = typeof e == "function" ? e(j.current) : e;
+		k || De(t), Te?.(t);
+	}, [k, Te]), [N, P] = l.useState(""), [F, I] = l.useState(-1), [L, Oe] = l.useState(""), [R, ke] = l.useState(!1), [z, Ae] = l.useState(!1), B = l.useRef(null), je = l.useRef(null), V = l.useId(), Me = `command-bar-listbox-${V}`, { reducedMotion: H } = c(), U = { duration: 0 }, Ne = l.useMemo(() => se(), []), W = l.useMemo(() => Array.isArray(y) ? y : [y], [y]), G = g.length > 0, K = l.useMemo(() => {
 		if (!G) return [];
-		if (!P.trim()) return h;
-		let e = P.toLowerCase();
-		return h.map((t) => ({
+		if (!N.trim()) return g;
+		let e = N.toLowerCase();
+		return g.map((t) => ({
 			...t,
-			items: t.items.filter((t) => me(t).toLowerCase().includes(e) || he(t).toLowerCase().includes(e))
+			items: t.items.filter((t) => he(t).toLowerCase().includes(e) || ge(t).toLowerCase().includes(e))
 		})).filter((e) => e.items.length > 0);
 	}, [
-		h,
-		P,
+		g,
+		N,
 		G
-	]), q = s.useMemo(() => K.flatMap((e) => e.items), [K]), Me = s.useMemo(() => {
+	]), q = l.useMemo(() => K.flatMap((e) => e.items), [K]), Pe = l.useMemo(() => {
 		let e = /* @__PURE__ */ new Map(), t = 0;
 		for (let n of K) for (let r of n.items) e.set(r.id, t++);
 		return e;
-	}, [K]), Ne = typeof T == "number" ? `${T}px` : T;
-	s.useEffect(() => {
-		if (g !== "floating" || C === !1) return;
-		let e = Array.isArray(C) ? C : [C];
+	}, [K]), Fe = typeof w == "number" ? `${w}px` : w;
+	l.useEffect(() => {
+		if (v !== "floating" || S === !1) return;
+		let e = Array.isArray(S) ? S : [S];
 		function t(t) {
 			for (let n of e) if (oe(t, n)) {
-				t.preventDefault(), N((e) => !e);
+				t.preventDefault(), M((e) => !e);
 				return;
 			}
 		}
 		return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
 	}, [
-		g,
-		C,
-		N
-	]), s.useEffect(() => {
-		g === "floating" && j && (F(""), L(-1), requestAnimationFrame(() => {
+		v,
+		S,
+		M
+	]), l.useEffect(() => {
+		v === "floating" && A && (P(""), I(-1), requestAnimationFrame(() => {
 			B.current?.focus();
 		}));
-	}, [g, j]), s.useEffect(() => {
-		I < 0 || (ke.current?.querySelector(`[data-command-index="${I}"]`))?.scrollIntoView({ block: "nearest" });
-	}, [I]);
-	let Pe = (e) => {
-		F(e), L(G && e.trim() ? 0 : -1), _e?.(e);
-	}, Fe = s.useCallback(() => {
-		!P.trim() || w || (Ee(P), c?.(P));
+	}, [v, A]), l.useEffect(() => {
+		F < 0 || (je.current?.querySelector(`[data-command-index="${F}"]`))?.scrollIntoView({ block: "nearest" });
+	}, [F]);
+	let Ie = (e) => {
+		P(e), I(G && e.trim() ? 0 : -1), _?.(e);
+	}, Le = l.useCallback(() => {
+		!N.trim() || C || (Oe(N), u?.(N));
 	}, [
-		P,
-		w,
-		c
-	]), Ie = (e) => {
+		N,
+		C,
+		u
+	]), Re = (e) => {
 		switch (e.key) {
 			case "ArrowDown":
 				if (!G || q.length === 0) return;
-				e.preventDefault(), L((e) => e < q.length - 1 ? e + 1 : 0);
+				e.preventDefault(), I((e) => e < q.length - 1 ? e + 1 : 0);
 				break;
 			case "ArrowUp":
-				G && q.length > 0 ? (e.preventDefault(), L((e) => e > 0 ? e - 1 : q.length - 1)) : !G && !P && Te && (e.preventDefault(), F(Te));
+				G && q.length > 0 ? (e.preventDefault(), I((e) => e > 0 ? e - 1 : q.length - 1)) : !G && !N && L && (e.preventDefault(), P(L));
 				break;
 			case "Enter":
-				e.preventDefault(), e.metaKey || e.ctrlKey ? Fe() : G && I >= 0 && q[I] ? (q[I].onSelect(), g === "floating" && N(!1)) : Fe();
+				e.preventDefault(), e.metaKey || e.ctrlKey ? Le() : G && F >= 0 && q[F] ? (q[F].onSelect(), v === "floating" && M(!1)) : Le();
 				break;
 			case "Escape":
-				e.preventDefault(), m === "responded" ? F("") : g === "floating" ? N(!1) : B.current?.blur();
+				e.preventDefault(), h === "responded" ? P("") : v === "floating" ? M(!1) : B.current?.blur();
 				break;
 		}
-	}, Le = () => {
-		F(""), L(-1), B.current?.focus();
+	}, ze = () => {
+		P(""), I(-1), B.current?.focus();
 	};
-	s.useEffect(() => {
+	l.useEffect(() => {
 		if (z) {
-			let e = setTimeout(() => Oe(!1), 500);
+			let e = setTimeout(() => Ae(!1), 500);
 			return () => clearTimeout(e);
 		}
-	}, [z]), H || e.snappy;
-	let J = H ? U : t.fade, Y = H ? {
+	}, [z]), H || t.snappy;
+	let J = H ? U : n.fade, Y = H ? {
 		opacity: 1,
 		scale: 1,
 		y: 0
-	} : void 0, X = g === "inline", Z = m === "processing", Re = m === "responded", Q = () => /* @__PURE__ */ l(pe, {
+	} : void 0, X = v === "inline", Z = h === "processing", Be = h === "responded", Q = () => /* @__PURE__ */ d(me, {
 		active: Z,
-		rounded: X ? "rounded-ds-md" : "rounded-ds-lg",
+		rounded: X ? "rounded-control" : "rounded-surface",
 		reducedMotion: H,
-		children: /* @__PURE__ */ u("div", {
-			className: n("flex items-center gap-ds-04 border bg-surface-overlay transition-colors transition-shadow duration-fast-02 ease-productive-standard", X ? "rounded-ds-md px-ds-04" : "rounded-ds-lg px-ds-05", Z ? "border-transparent" : "border-surface-border-strong", R && !Z && "border-accent-7 shadow-ring", z && "animate-shake"),
+		children: /* @__PURE__ */ f("div", {
+			className: r("flex items-center gap-ds-04 border bg-surface-overlay transition-colors transition-shadow duration-fast-02 ease-productive-standard", X ? "rounded-control px-ds-04" : "rounded-surface px-ds-05", Z ? "border-transparent" : "border-surface-border-strong", R && !Z && "border-accent-7 shadow-ring", z && "animate-shake"),
 			children: [
-				/* @__PURE__ */ l(r, {
-					icon: de,
+				/* @__PURE__ */ d(i, {
+					icon: fe,
 					size: X ? "xs" : "sm",
 					stroke: "light",
-					className: n("shrink-0 transition-colors duration-fast-02 ease-productive-standard", R ? "text-accent-9" : "text-surface-fg-subtle")
+					className: r("shrink-0 transition-colors duration-fast-02 ease-productive-standard", R ? "text-accent-9" : "text-surface-fg-subtle")
 				}),
-				/* @__PURE__ */ u("div", {
+				/* @__PURE__ */ f("div", {
 					className: "relative flex flex-1 items-center",
-					children: [!P && !R && W.length > 1 && /* @__PURE__ */ l(ge, {
+					children: [!N && !R && W.length > 1 && /* @__PURE__ */ d(_e, {
 						placeholders: W,
 						interval: be,
-						paused: R || !!P
-					}), /* @__PURE__ */ l("input", {
+						paused: R || !!N
+					}), /* @__PURE__ */ d("input", {
 						ref: B,
-						value: P,
-						onChange: (e) => Pe(e.target.value),
-						onFocus: () => De(!0),
-						onBlur: () => De(!1),
-						onKeyDown: Ie,
+						value: N,
+						onChange: (e) => Ie(e.target.value),
+						onFocus: () => ke(!0),
+						onBlur: () => ke(!1),
+						onKeyDown: Re,
 						placeholder: W.length === 1 || R ? W[0] : "",
 						readOnly: Z,
-						disabled: w,
+						disabled: C,
 						role: "combobox",
 						"aria-expanded": G && q.length > 0,
-						"aria-controls": G ? Ae : void 0,
-						"aria-activedescendant": G && I >= 0 && q[I] ? `command-bar-item-${V}-${q[I].id}` : void 0,
+						"aria-controls": G ? Me : void 0,
+						"aria-activedescendant": G && F >= 0 && q[F] ? `command-bar-item-${V}-${q[F].id}` : void 0,
 						"aria-autocomplete": G ? "list" : void 0,
-						"aria-label": b ? `Ask ${b}` : "AI Command Bar",
-						className: n("flex-1 bg-transparent text-surface-fg outline-hidden", "placeholder:text-surface-fg-subtle", X ? "h-9 text-ds-sm" : "h-12 text-ds-base", Z && "cursor-wait", w && "cursor-not-allowed opacity-50"),
+						"aria-label": xe ? `Ask ${xe}` : "AI Command Bar",
+						className: r("flex-1 bg-transparent text-surface-fg outline-hidden", "placeholder:text-surface-fg-subtle", X ? "h-9 text-ds-sm" : "h-12 text-ds-base", Z && "cursor-wait", C && "cursor-not-allowed opacity-50"),
 						autoComplete: "off",
 						autoCorrect: "off",
 						spellCheck: !1
 					})]
 				}),
-				Z ? /* @__PURE__ */ l("span", {
+				Z ? /* @__PURE__ */ d("span", {
 					"data-testid": "command-bar-spinner",
 					className: "shrink-0",
-					children: /* @__PURE__ */ l(r, {
-						icon: ue,
+					children: /* @__PURE__ */ d(i, {
+						icon: de,
 						size: X ? "xs" : "sm",
 						stroke: "light",
 						animate: "spin",
 						className: "text-accent-9"
 					})
-				}) : Re ? /* @__PURE__ */ l("button", {
+				}) : Be ? /* @__PURE__ */ d("button", {
 					type: "button",
-					onClick: Le,
-					className: "shrink-0 rounded-ds-sm p-ds-01 text-surface-fg-subtle transition-colors duration-fast-01 hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
+					onClick: ze,
+					className: "shrink-0 rounded-control-inner p-ds-01 text-surface-fg-subtle transition-colors duration-fast-01 hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9",
 					"aria-label": "Clear",
 					title: "Clear",
-					children: /* @__PURE__ */ l(r, {
-						icon: fe,
+					children: /* @__PURE__ */ d(i, {
+						icon: pe,
 						size: X ? "xs" : "sm",
 						stroke: "light"
 					})
-				}) : g === "hero" ? /* @__PURE__ */ l(f, { children: !R && /* @__PURE__ */ u(p.kbd, {
+				}) : v === "hero" ? /* @__PURE__ */ d(p, { children: !R && /* @__PURE__ */ f(m.kbd, {
 					initial: Y ?? { opacity: 0 },
 					animate: { opacity: 1 },
 					exit: H ? void 0 : { opacity: 0 },
 					transition: J,
-					className: "hidden shrink-0 select-none rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02b py-ds-01 text-ds-sm font-medium text-surface-fg-subtle shadow-kbd sm:inline-flex",
-					children: [ae(je), "J"]
+					className: "hidden shrink-0 select-none rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b py-ds-01 text-ds-sm font-medium text-surface-fg-subtle shadow-kbd sm:inline-flex",
+					children: [ae(Ne), "J"]
 				}) }) : null
 			]
 		})
-	}), $ = () => !G || !(q.length > 0 || P.trim() && K.length === 0) && !P.trim() ? null : /* @__PURE__ */ u("div", {
-		ref: ke,
-		id: Ae,
+	}), $ = () => !G || !(q.length > 0 || N.trim() && K.length === 0) && !N.trim() ? null : /* @__PURE__ */ f("div", {
+		ref: je,
+		id: Me,
 		role: "listbox",
 		"aria-label": "Command results",
 		className: "overflow-y-auto px-ds-03 py-ds-03",
-		style: { maxHeight: Ne },
-		children: [K.length === 0 && P.trim() && /* @__PURE__ */ l(p.div, {
+		style: { maxHeight: Fe },
+		children: [K.length === 0 && N.trim() && /* @__PURE__ */ d(m.div, {
 			initial: Y ?? { opacity: 0 },
 			animate: { opacity: 1 },
 			transition: J,
 			className: "flex items-center justify-center py-ds-07",
-			children: ye ?? /* @__PURE__ */ l("p", {
+			children: ye ?? /* @__PURE__ */ d("p", {
 				className: "text-ds-md text-surface-fg-subtle",
 				children: ve
 			})
-		}), K.map((i, a) => /* @__PURE__ */ u(p.div, {
+		}), K.map((o, s) => /* @__PURE__ */ f(m.div, {
 			initial: Y ?? { opacity: 0 },
 			animate: { opacity: 1 },
 			transition: H ? U : {
-				...t.fade,
-				delay: a * .06
+				...n.fade,
+				delay: s * .06
 			},
 			className: "mb-ds-02",
-			children: [/* @__PURE__ */ l("div", {
+			children: [/* @__PURE__ */ d("div", {
 				className: "px-ds-03 pb-ds-02 pt-ds-03",
-				children: /* @__PURE__ */ l("span", {
+				children: /* @__PURE__ */ d("span", {
 					className: "text-ds-xs font-semibold uppercase tracking-wider text-surface-fg-subtle",
-					children: i.label
+					children: o.label
 				})
-			}), i.items.map((t) => {
-				let i = Me.get(t.id) ?? 0, a = i === I;
-				return /* @__PURE__ */ u(p.button, {
-					id: `command-bar-item-${V}-${t.id}`,
+			}), o.items.map((n) => {
+				let o = Pe.get(n.id) ?? 0, s = o === F;
+				return /* @__PURE__ */ f(m.button, {
+					id: `command-bar-item-${V}-${n.id}`,
 					type: "button",
 					role: "option",
-					"aria-selected": a,
-					"data-command-index": i,
+					"aria-selected": s,
+					"data-command-index": o,
 					initial: Y ?? {
 						opacity: 0,
 						y: 4
@@ -307,159 +309,162 @@ var m = s.forwardRef(function({ onSubmit: c, state: m = "idle", groups: h = [],
 						y: 0
 					},
 					transition: H ? U : {
-						...e.snappy,
-						delay: i * .03
+						...t.snappy,
+						delay: o * .03
 					},
 					onClick: () => {
-						t.onSelect(), g === "floating" && N(!1);
+						n.onSelect(), v === "floating" && M(!1);
 					},
-					onMouseEnter: () => L(i),
-					className: n("flex w-full items-center gap-ds-04 rounded-ds-lg px-ds-03 py-ds-03 text-left transition-[color,background-color] duration-fast-02 ease-productive-standard", a ? "bg-surface-raised-hover text-surface-fg" : "text-surface-fg-muted hover:bg-surface-raised"),
+					onMouseEnter: () => I(o),
+					className: r("flex w-full items-center gap-ds-04 rounded-surface px-ds-03 py-ds-03 text-left transition-[color,background-color] duration-fast-02 ease-productive-standard", s ? "bg-surface-raised-hover text-surface-fg" : "text-surface-fg-muted hover:bg-surface-raised"),
 					children: [
-						t.icon && /* @__PURE__ */ l("span", {
-							className: n("[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0 transition-colors duration-fast-02 ease-productive-standard", a ? "text-accent-11" : "text-surface-fg-subtle"),
+						n.icon && /* @__PURE__ */ d("span", {
+							className: r("[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0 transition-colors duration-fast-02 ease-productive-standard", s ? "text-accent-11" : "text-surface-fg-subtle"),
 							"aria-hidden": "true",
-							children: t.icon
+							children: /* @__PURE__ */ d(e, {
+								size: "sm",
+								children: a(n.icon)
+							})
 						}),
-						/* @__PURE__ */ u("div", {
+						/* @__PURE__ */ f("div", {
 							className: "flex flex-1 flex-col",
-							children: [/* @__PURE__ */ l("span", {
+							children: [/* @__PURE__ */ d("span", {
 								className: "text-ds-md",
-								children: t.renderLabel ? t.renderLabel(P) : t.label
-							}), t.description && /* @__PURE__ */ l("span", {
+								children: n.renderLabel ? n.renderLabel(N) : n.label
+							}), n.description && /* @__PURE__ */ d("span", {
 								className: "text-ds-sm text-surface-fg-subtle",
-								children: t.description
+								children: n.description
 							})]
 						}),
-						/* @__PURE__ */ l(f, { children: a && /* @__PURE__ */ l(p.span, {
+						/* @__PURE__ */ d(p, { children: s && /* @__PURE__ */ d(m.span, {
 							initial: H ? void 0 : { opacity: 0 },
 							animate: { opacity: 1 },
 							exit: H ? void 0 : { opacity: 0 },
 							transition: J,
 							className: "inline-flex shrink-0",
-							children: /* @__PURE__ */ l(r, {
-								icon: d,
+							children: /* @__PURE__ */ d(i, {
+								icon: ue,
 								size: "sm",
 								stroke: "light",
 								className: "text-surface-fg-subtle"
 							})
 						}) })
 					]
-				}, t.id);
+				}, n.id);
 			})]
-		}, i.label))]
+		}, o.label))]
 	});
-	return g === "hero" ? /* @__PURE__ */ u("div", {
-		ref: k,
+	return v === "hero" ? /* @__PURE__ */ f("div", {
+		ref: O,
 		role: "search",
-		className: n("bg-surface-raised rounded-ds-xl shadow-raised p-ds-07", D),
-		...O,
+		className: r("bg-surface-raised rounded-overlay-lg shadow-raised p-ds-07", E),
+		...D,
 		children: [
-			v && /* @__PURE__ */ l("p", {
+			b && /* @__PURE__ */ d("p", {
 				className: "text-ds-lg text-surface-fg-muted mb-ds-04",
-				children: v
+				children: b
 			}),
 			Q(),
 			$(),
-			y && y.length > 0 && /* @__PURE__ */ l("div", {
+			x && x.length > 0 && /* @__PURE__ */ d("div", {
 				className: "mt-ds-04 flex flex-wrap gap-ds-02b",
-				children: y.map((e) => /* @__PURE__ */ l("button", {
+				children: x.map((e) => /* @__PURE__ */ d("button", {
 					type: "button",
 					onClick: () => {
-						F(e), _e?.(e), B.current?.focus();
+						P(e), _?.(e), B.current?.focus();
 					},
-					className: "rounded-ds-md border border-surface-border-strong bg-surface-overlay px-ds-03 py-ds-01 text-ds-sm text-surface-fg-subtle transition-colors duration-fast-02 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted",
+					className: "rounded-control border border-surface-border-strong bg-surface-overlay px-ds-03 py-ds-01 text-ds-sm text-surface-fg-subtle transition-colors duration-fast-02 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted",
 					children: e
 				}, e))
 			}),
-			E && /* @__PURE__ */ l("div", {
+			T && /* @__PURE__ */ d("div", {
 				className: "mt-ds-05",
-				children: E
+				children: T
 			})
 		]
-	}) : g === "inline" ? /* @__PURE__ */ u("div", {
-		ref: k,
+	}) : v === "inline" ? /* @__PURE__ */ f("div", {
+		ref: O,
 		role: "search",
-		className: n("w-full", D),
-		...O,
+		className: r("w-full", E),
+		...D,
 		children: [
 			Q(),
 			$(),
-			E && /* @__PURE__ */ l("div", {
+			T && /* @__PURE__ */ d("div", {
 				className: "mt-ds-03",
-				children: E
+				children: T
 			})
 		]
-	}) : /* @__PURE__ */ l(i, {
-		open: j,
+	}) : /* @__PURE__ */ d(o, {
+		open: A,
 		onOpenChange: (e) => {
-			N(e);
+			M(e);
 		},
-		children: /* @__PURE__ */ u(te, { children: [/* @__PURE__ */ l(ee, { className: "fixed inset-0 z-overlay bg-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0" }), /* @__PURE__ */ u(a, {
-			ref: k,
-			...O,
-			className: n("fixed left-1/2 top-[20%] z-modal w-full max-w-[560px] -translate-x-1/2", "overflow-hidden rounded-ds-xl border border-surface-border-strong bg-surface-overlay shadow-overlay", "duration-moderate-02 data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2", "data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2", D),
+		children: /* @__PURE__ */ f(ne, { children: [/* @__PURE__ */ d(te, { className: "fixed inset-0 z-overlay bg-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0" }), /* @__PURE__ */ f(s, {
+			ref: O,
+			...D,
+			className: r("fixed left-1/2 top-[20%] z-modal w-full max-w-[560px] -translate-x-1/2", "overflow-hidden rounded-overlay-lg border border-surface-border-strong bg-surface-overlay shadow-overlay", "duration-moderate-02 data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2", "data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2", E),
 			children: [
-				/* @__PURE__ */ u(re, { children: [/* @__PURE__ */ l(ne, { children: "AI Command Bar" }), /* @__PURE__ */ l(o, { children: "Search commands or ask a question" })] }),
-				/* @__PURE__ */ l("div", {
+				/* @__PURE__ */ f(ie, { children: [/* @__PURE__ */ d(re, { children: "AI Command Bar" }), /* @__PURE__ */ d(ee, { children: "Search commands or ask a question" })] }),
+				/* @__PURE__ */ d("div", {
 					className: "p-ds-04",
 					children: Q()
 				}),
 				$(),
-				E && /* @__PURE__ */ l("div", {
+				T && /* @__PURE__ */ d("div", {
 					className: "border-t border-surface-border-strong p-ds-04",
-					children: E
+					children: T
 				}),
-				/* @__PURE__ */ u(p.div, {
+				/* @__PURE__ */ f(m.div, {
 					initial: Y ?? { opacity: 0 },
 					animate: { opacity: 1 },
 					transition: J,
 					className: "flex items-center gap-ds-05 border-t border-surface-border-strong px-ds-05 py-ds-03",
 					children: [
-						G && /* @__PURE__ */ u("div", {
+						G && /* @__PURE__ */ f("div", {
 							className: "flex items-center gap-ds-02b",
-							children: [/* @__PURE__ */ u("div", {
+							children: [/* @__PURE__ */ f("div", {
 								className: "flex items-center gap-ds-01",
-								children: [/* @__PURE__ */ l("kbd", {
+								children: [/* @__PURE__ */ d("kbd", {
 									className: "inline-flex h-ico-md w-ico-md items-center justify-center rounded border border-surface-border-strong bg-surface-raised shadow-kbd",
-									children: /* @__PURE__ */ l(r, {
+									children: /* @__PURE__ */ d(i, {
 										icon: le,
 										size: "xs",
 										className: "text-surface-fg-subtle"
 									})
-								}), /* @__PURE__ */ l("kbd", {
+								}), /* @__PURE__ */ d("kbd", {
 									className: "inline-flex h-ico-md w-ico-md items-center justify-center rounded border border-surface-border-strong bg-surface-raised shadow-kbd",
-									children: /* @__PURE__ */ l(r, {
+									children: /* @__PURE__ */ d(i, {
 										icon: ce,
 										size: "xs",
 										className: "text-surface-fg-subtle"
 									})
 								})]
-							}), /* @__PURE__ */ l("span", {
+							}), /* @__PURE__ */ d("span", {
 								className: "text-ds-xs text-surface-fg-subtle",
 								children: "Navigate"
 							})]
 						}),
-						/* @__PURE__ */ u("div", {
+						/* @__PURE__ */ f("div", {
 							className: "flex items-center gap-ds-02b",
-							children: [/* @__PURE__ */ l("kbd", {
-								className: "inline-flex h-[20px] items-center justify-center rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02b shadow-kbd",
-								children: /* @__PURE__ */ l(r, {
-									icon: d,
+							children: [/* @__PURE__ */ d("kbd", {
+								className: "inline-flex h-[20px] items-center justify-center rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b shadow-kbd",
+								children: /* @__PURE__ */ d(i, {
+									icon: ue,
 									size: "xs",
 									className: "text-surface-fg-subtle"
 								})
-							}), /* @__PURE__ */ l("span", {
+							}), /* @__PURE__ */ d("span", {
 								className: "text-ds-xs text-surface-fg-subtle",
 								children: "Submit"
 							})]
 						}),
-						/* @__PURE__ */ u("div", {
+						/* @__PURE__ */ f("div", {
 							className: "flex items-center gap-ds-02b",
-							children: [/* @__PURE__ */ l("kbd", {
-								className: "inline-flex h-[20px] items-center justify-center rounded-ds-md border border-surface-border-strong bg-surface-raised px-ds-02b text-ds-xs font-medium text-surface-fg-subtle shadow-kbd",
+							children: [/* @__PURE__ */ d("kbd", {
+								className: "inline-flex h-[20px] items-center justify-center rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b text-ds-xs font-medium text-surface-fg-subtle shadow-kbd",
 								children: "Esc"
-							}), /* @__PURE__ */ l("span", {
+							}), /* @__PURE__ */ d("span", {
 								className: "text-ds-xs text-surface-fg-subtle",
 								children: "Close"
 							})]
@@ -470,6 +475,6 @@ var m = s.forwardRef(function({ onSubmit: c, state: m = "idle", groups: h = [],
 		})] })
 	});
 });
-m.displayName = "CommandBar";
+h.displayName = "CommandBar";
 //#endregion
-export { m as CommandBar };
+export { h as CommandBar };