@rinzai/zen 0.10.3 → 0.13.0

package/dist/combobox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/combobox/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/combobox/index.tsx"],"names":[],"mappings":"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"}

package/dist/combobox/index.js

@@ -1,163 +1,174 @@
 "use client";
 import { cx as e } from "../utils/cx.js";
-import { anchoredStyle as t, useAnchoredPopup as n } from "../utils/useAnchoredPopup.js";
-import r from "../badge/index.js";
-import i from "../button/index.js";
-import { PLACEHOLDER as a, POPUP as o, TRIGGER as s } from "../utils/styles.js";
-import c from "../collapse/index.js";
-import { CheckIcon as l } from "../utils/status-icons.js";
-import { useField as u } from "../field/index.js";
-import d from "../icons/search.js";
-import f from "../icons/x-mark.js";
-import { InputGroupAddon as p, InputGroupInput as m } from "../input-group/index.js";
-import { FieldChevron as h } from "../utils/field-chevron.js";
-import { useVirtualList as g } from "../utils/useVirtualList.js";
-import { createContext as _, useContext as v, useEffect as y, useMemo as b, useRef as x, useState as S } from "react";
-import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { useControllable as t } from "../utils/useControllable.js";
+import { anchoredStyle as n, useAnchoredPopup as r } from "../utils/useAnchoredPopup.js";
+import { useMessages as i } from "../locale-provider/index.js";
+import a from "../badge/index.js";
+import o from "../button/index.js";
+import { CheckIcon as s } from "../utils/status-icons.js";
+import { useField as c } from "../field/index.js";
+import { FIELD_SIZE as l, PLACEHOLDER as u, POPUP as d, TRIGGER as f } from "../utils/styles.js";
+import { FormValue as p } from "../utils/form-value.js";
+import { FieldChevron as m } from "../utils/field-chevron.js";
+import h from "../collapse/index.js";
+import g from "../icons/search.js";
+import _ from "../icons/x-mark.js";
+import { InputGroupAddon as v, InputGroupInput as y } from "../input-group/index.js";
+import { useVirtualList as b } from "../utils/useVirtualList.js";
+import { createContext as x, useContext as S, useEffect as C, useMemo as w, useRef as T, useState as E } from "react";
+import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
 //#region packages/combobox/index.tsx
-var E = _(null), D = () => {
-	let e = v(E);
+var A = x(null), j = () => {
+	let e = S(A);
 	if (!e) throw Error("Combobox parts must be inside a Combobox");
 	return e;
 };
-function O(e) {
-	let { items: t, itemKey: r = (e) => e.key, itemText: i = (e) => e.text, filter: a = (e, t) => i(e).toLowerCase().includes(t.toLowerCase()), selectedItems: o = [], children: s } = e, c = e.multiple === !0, l = c ? e.value : e.value === null ? [] : [e.value], [u, d] = S(""), [f, p] = S(null), m = x(null), h = x(null), g = x(null), _ = x(35), v = b(() => u ? t.filter((e) => a(e, u)) : t, [
-		t,
-		u,
-		a
-	]), y = n({ onOpenChange: (e) => {
-		e || (p(null), d(""), y.popupRef.current?.contains(document.activeElement) && h.current?.focus());
-	} }), C = {
-		multiple: c,
-		keyOf: r,
-		textOf: i,
-		items: t,
-		selectedItems: o,
-		matches: v,
-		chosen: l,
-		toggle: (t) => {
-			if (e.multiple === !0) {
-				let n = e.value.includes(t);
-				e.onValueChange(n ? e.value.filter((e) => e !== t) : [...e.value, t]);
-			} else e.onValueChange(t), y.setOpen(!1);
+function M(e) {
+	let { items: n, itemKey: i = (e) => e.key, itemText: a = (e) => e.text, filter: o = (e, t) => a(e).toLowerCase().includes(t.toLowerCase()), selectedItems: s = [], name: c, children: l } = e, u = e.multiple === !0, [d, f, m] = t(e.value, e.defaultValue ?? (u ? [] : null), e.onValueChange), h = typeof d == "string" ? [d] : d ?? [], [g, _] = E(""), [v, y] = E(null), [b, x] = E(), S = T(null), C = T(null), D = T(null), j = T(35), M = w(() => g ? n.filter((e) => o(e, g)) : n, [
+		n,
+		g,
+		o
+	]), N = r({ onOpenChange: (e) => {
+		e || (y(null), _(""), N.popupRef.current?.contains(document.activeElement) && C.current?.focus());
+	} }), P = {
+		multiple: u,
+		keyOf: i,
+		textOf: a,
+		items: n,
+		selectedItems: s,
+		matches: M,
+		chosen: h,
+		toggle: (e) => {
+			if (u) {
+				let t = h.includes(e);
+				f(t ? h.filter((t) => t !== e) : [...h, e]);
+			} else f(e), N.setOpen(!1);
 		},
-		query: u,
-		setQuery: d,
-		active: f,
-		setActive: p,
-		create: m,
-		popup: y,
-		triggerRef: h,
-		listRef: g,
-		optionId: (e) => `${y.id}-option-${e}`,
-		itemHeight: _
+		query: g,
+		setQuery: _,
+		active: v,
+		setActive: y,
+		create: S,
+		popup: N,
+		triggerRef: C,
+		listRef: D,
+		optionId: (e) => `${N.id}-option-${e}`,
+		itemHeight: j,
+		listLabelledBy: b,
+		setListLabelledBy: x
 	};
-	return /* @__PURE__ */ w(E.Provider, {
-		value: C,
-		children: s
+	return /* @__PURE__ */ k(A.Provider, {
+		value: P,
+		children: [l, /* @__PURE__ */ O(p, {
+			name: c,
+			value: u ? h : h[0] ?? "",
+			onReset: m
+		})]
 	});
 }
-function k({ placeholder: t = "Select an Item", disabled: n, className: r, style: i, children: a, ...o }) {
-	let c = D(), { popup: l } = c, d = u(), f = x(!1), p = () => !n && l.setOpen(!0);
-	return /* @__PURE__ */ T("div", {
-		id: d?.id,
-		"aria-labelledby": o["aria-label"] ? void 0 : d?.labelId,
-		"aria-invalid": d?.["aria-invalid"],
-		...o,
-		"aria-describedby": e(d?.["aria-describedby"], o["aria-describedby"]).trim() || void 0,
-		ref: c.triggerRef,
+function N({ placeholder: t, disabled: n, size: r = "default", className: a, style: o, children: s, ...u }) {
+	let d = i(), p = t ?? d.selectPlaceholder, h = j(), { popup: g } = h, _ = c(), v = u.id ?? _?.id ?? `${g.id}-field`, y = u["aria-labelledby"] ?? (u["aria-label"] ? v : _?.labelId), { setListLabelledBy: b } = h;
+	C(() => b(y), [y, b]);
+	let x = T(!1), S = () => !n && g.setOpen(!0);
+	return /* @__PURE__ */ k("div", {
+		id: v,
+		"aria-labelledby": u["aria-label"] ? void 0 : _?.labelId,
+		"aria-invalid": _?.["aria-invalid"],
+		...u,
+		"aria-describedby": e(_?.["aria-describedby"], u["aria-describedby"]).trim() || void 0,
+		ref: h.triggerRef,
 		role: "combobox",
 		tabIndex: n ? -1 : 0,
 		"aria-haspopup": "listbox",
-		"aria-expanded": l.open,
-		"aria-controls": l.id,
+		"aria-expanded": g.open,
+		"aria-controls": g.id,
 		"aria-disabled": n || void 0,
-		"data-popup-open": l.triggerProps["data-popup-open"],
-		"data-zen-anchor": l.triggerProps["data-zen-anchor"],
+		"data-popup-open": g.triggerProps["data-popup-open"],
+		"data-zen-anchor": g.triggerProps["data-zen-anchor"],
 		style: {
-			...l.triggerProps.style,
-			...i
+			...g.triggerProps.style,
+			...o
 		},
 		onPointerDown: (e) => {
-			o.onPointerDown?.(e), f.current = l.open;
+			u.onPointerDown?.(e), x.current = g.open;
 		},
 		onClick: (e) => {
-			o.onClick?.(e), e.preventDefault(), f.current ? l.setOpen(!1) : p(), f.current = !1;
+			u.onClick?.(e), e.preventDefault(), x.current ? g.setOpen(!1) : S(), x.current = !1;
 		},
 		onKeyDown: (e) => {
-			o.onKeyDown?.(e), [
+			u.onKeyDown?.(e), [
 				"Enter",
 				" ",
 				"ArrowDown"
-			].includes(e.key) && (e.preventDefault(), p());
+			].includes(e.key) && (e.preventDefault(), S());
 		},
-		className: e(s, "w-56 shrink-0", n ? "cursor-not-allowed opacity-50" : "cursor-pointer", l.open && "border-glow/60 [--glow-border-color:transparent] shadow-glow-focus", r),
-		children: [/* @__PURE__ */ w("div", {
+		className: e(f, l[r], "w-56 shrink-0", n ? "cursor-not-allowed opacity-50" : "cursor-pointer", g.open && "border-glow/60 [--glow-border-color:transparent] shadow-glow-focus", a),
+		children: [/* @__PURE__ */ O("div", {
 			className: e("flex min-w-0 flex-1 items-center gap-1 overflow-hidden text-sm", n ? "text-muted-foreground" : "text-foreground"),
-			children: a ?? /* @__PURE__ */ w(A, { placeholder: t })
-		}), /* @__PURE__ */ w(h, { open: l.open })]
+			children: s ?? /* @__PURE__ */ O(P, { placeholder: p })
+		}), /* @__PURE__ */ O(m, { open: g.open })]
 	});
 }
-function A({ placeholder: e }) {
-	let t = D(), n = new Map([...t.selectedItems, ...t.items].map((e) => [t.keyOf(e), e])), o = t.chosen.flatMap((e) => {
-		let r = n.has(e) ? t.textOf(n.get(e)) : void 0;
-		return r ? [{
+function P({ placeholder: e }) {
+	let t = j(), n = i(), r = new Map([...t.selectedItems, ...t.items].map((e) => [t.keyOf(e), e])), s = t.chosen.flatMap((e) => {
+		let n = r.has(e) ? t.textOf(r.get(e)) : void 0;
+		return n ? [{
 			key: e,
-			text: r
+			text: n
 		}] : [];
 	});
-	return o.length ? t.multiple ? /* @__PURE__ */ w(c, {
-		items: o.map((e) => e.text),
-		data: o,
+	return s.length ? t.multiple ? /* @__PURE__ */ O(h, {
+		items: s.map((e) => e.text),
+		data: s,
 		badgeVariant: "secondary",
 		badgeClassName: "h-6 min-w-min gap-2",
 		className: "w-full gap-1",
-		children: (e, n, a) => /* @__PURE__ */ T(r, {
-			className: "flex h-6 min-w-min gap-2 pr-1",
+		children: (e, r, i) => /* @__PURE__ */ k(a, {
+			className: "flex h-6 min-w-min gap-2 pe-1",
 			variant: "secondary",
-			children: [e, /* @__PURE__ */ w(i, {
-				"aria-label": `Remove ${e}`,
+			children: [e, /* @__PURE__ */ O(o, {
+				"aria-label": n.remove(e),
 				onClick: (e) => {
-					e.stopPropagation(), a && t.toggle(a.key);
+					e.stopPropagation(), i && t.toggle(i.key);
 				},
-				variant: "icon",
+				variant: "ghost",
 				size: "icon",
 				className: "group relative -top-px size-4 rounded-sm p-0.5",
-				children: /* @__PURE__ */ w(f, { className: "zen__combobox-remove-icon size-3 transition duration-300 group-hover:rotate-90" })
+				children: /* @__PURE__ */ O(_, { className: "zen__combobox-remove-icon size-3 transition duration-300 group-hover:rotate-90" })
 			})]
-		}, a?.key ?? n)
-	}) : /* @__PURE__ */ w(C, { children: o[0].text }) : /* @__PURE__ */ w("span", {
-		className: a,
+		}, i?.key ?? r)
+	}) : /* @__PURE__ */ O(D, { children: s[0].text }) : /* @__PURE__ */ O("span", {
+		className: u,
 		children: e
 	});
 }
-function j({ className: n, children: r }) {
-	let { popup: i } = D();
-	return /* @__PURE__ */ w("div", {
+function F({ className: t, children: r }) {
+	let { popup: i } = j();
+	return /* @__PURE__ */ O("div", {
 		...i.popupProps,
-		style: t(i.id, {
+		style: n(i.id, {
 			offset: 5,
 			width: "match"
 		}),
-		className: e("zen__popover", o, "overflow-visible p-0", n),
-		children: /* @__PURE__ */ w("div", {
+		className: e("zen__popover", d, "overflow-visible p-0", t),
+		children: /* @__PURE__ */ O("div", {
 			className: "divide-tint/10 flex w-full flex-col divide-y overflow-hidden rounded-xl",
 			children: r
 		})
 	});
 }
-function M({ placeholder: e = "Search", "aria-label": t = "Search options" }) {
-	let n = D(), r = x(null);
-	y(() => {
-		n.popup.open && r.current?.focus();
+function I({ placeholder: e, "aria-label": t }) {
+	let n = j(), r = i(), a = T(null);
+	C(() => {
+		n.popup.open && a.current?.focus();
 	}, [n.popup.open]);
-	let i = n.matches.map(n.keyOf);
-	return /* @__PURE__ */ T("div", {
+	let o = n.matches.map(n.keyOf);
+	return /* @__PURE__ */ k("div", {
 		className: "flex h-10 grow items-center gap-2 px-3",
-		children: [/* @__PURE__ */ w(p, { children: /* @__PURE__ */ w(d, {}) }), /* @__PURE__ */ w(m, {
-			ref: r,
-			placeholder: e,
-			"aria-label": t,
+		children: [/* @__PURE__ */ O(v, { children: /* @__PURE__ */ O(g, {}) }), /* @__PURE__ */ O(y, {
+			ref: a,
+			placeholder: e ?? r.search,
+			"aria-label": t ?? r.searchOptions,
 			"aria-controls": `${n.popup.id}-list`,
 			"aria-activedescendant": n.active === null ? void 0 : n.optionId(n.active),
 			value: n.query,
@@ -165,38 +176,39 @@ function M({ placeholder: e = "Search", "aria-label": t = "Search options" }) {
 				n.setQuery(e.target.value), n.setActive(null);
 			},
 			onKeyDown: (e) => {
-				let t = n.active === null ? -1 : i.indexOf(n.active), r = (t) => {
-					if (e.preventDefault(), !i.length) return;
-					let r = i[(t + i.length) % i.length];
-					n.setActive(r), N(n.listRef.current, i.indexOf(r), n.itemHeight.current);
+				let t = n.active === null ? -1 : o.indexOf(n.active), r = (t) => {
+					if (e.preventDefault(), !o.length) return;
+					let r = o[(t + o.length) % o.length];
+					n.setActive(r), L(n.listRef.current, o.indexOf(r), n.itemHeight.current);
 				};
-				e.key === "ArrowDown" ? r(t + 1) : e.key === "ArrowUp" ? r(t === -1 ? i.length - 1 : t - 1) : e.key === "Enter" && (e.preventDefault(), n.active === null ? !i.length && n.query && n.create.current && (n.create.current(n.query), n.setQuery("")) : n.toggle(n.active));
+				e.key === "ArrowDown" ? r(t + 1) : e.key === "ArrowUp" ? r(t === -1 ? o.length - 1 : t - 1) : e.key === "Enter" && (e.preventDefault(), n.active === null ? !o.length && n.query && n.create.current && (n.create.current(n.query), n.setQuery("")) : n.toggle(n.active));
 			}
 		})]
 	});
 }
-var N = (e, t, n) => {
+var L = (e, t, n) => {
 	if (!e || t < 0) return;
 	let r = t * n;
 	r < e.scrollTop ? e.scrollTop = r : r + n > e.scrollTop + e.clientHeight && (e.scrollTop = r + n - e.clientHeight);
-}, P = _(null);
-function F({ renderItem: e, itemHeight: t = 35, children: n }) {
-	let r = D();
+}, R = x(null);
+function z({ renderItem: e, itemHeight: t = 35, children: n }) {
+	let r = j();
 	r.itemHeight.current = t;
-	let i = g({
+	let i = b({
 		count: r.matches.length,
 		itemHeight: t,
 		scrollRef: r.listRef
 	});
-	return y(() => {
+	return C(() => {
 		r.listRef.current && (r.listRef.current.scrollTop = 0);
-	}, [r.query, r.listRef]), /* @__PURE__ */ T("ul", {
+	}, [r.query, r.listRef]), /* @__PURE__ */ k("ul", {
 		id: `${r.popup.id}-list`,
 		role: "listbox",
+		"aria-labelledby": r.listLabelledBy,
 		"aria-multiselectable": r.multiple || void 0,
 		className: "max-h-72 grow overflow-y-auto py-1 focus:ring-0 focus:outline-hidden",
 		ref: r.listRef,
-		children: [/* @__PURE__ */ w("div", {
+		children: [/* @__PURE__ */ O("div", {
 			style: {
 				height: `${i.totalSize}px`,
 				width: "100%",
@@ -204,23 +216,23 @@ function F({ renderItem: e, itemHeight: t = 35, children: n }) {
 			},
 			children: i.items.map((t) => {
 				let n = r.matches[t.index];
-				return /* @__PURE__ */ w(P.Provider, {
+				return /* @__PURE__ */ O(R.Provider, {
 					value: {
 						start: t.start,
 						size: t.size
 					},
-					children: e ? e(n) : /* @__PURE__ */ w(I, { item: n })
+					children: e ? e(n) : /* @__PURE__ */ O(B, { item: n })
 				}, r.keyOf(n));
 			})
 		}), n]
 	});
 }
-function I({ item: t, className: n, children: r }) {
-	let i = D(), a = v(P), o = i.keyOf(t), s = i.chosen.includes(o);
-	return /* @__PURE__ */ T("li", {
+function B({ item: t, className: n, children: r }) {
+	let i = j(), a = S(R), o = i.keyOf(t), c = i.chosen.includes(o);
+	return /* @__PURE__ */ k("li", {
 		id: i.optionId(o),
 		role: "option",
-		"aria-selected": s,
+		"aria-selected": c,
 		"data-highlighted": i.active === o || void 0,
 		style: a ? {
 			height: `${a.size}px`,
@@ -229,36 +241,36 @@ function I({ item: t, className: n, children: r }) {
 		onMouseMove: () => i.active !== o && i.setActive(o),
 		onClick: () => i.toggle(o),
 		className: e("hover:bg-muted data-highlighted:bg-muted grid w-full cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 px-3 py-2 text-sm outline-hidden select-none", a && "absolute top-0 left-0", n),
-		children: [/* @__PURE__ */ w("span", {
+		children: [/* @__PURE__ */ O("span", {
 			className: "text-primary col-start-1",
 			"aria-hidden": !0,
-			children: s && /* @__PURE__ */ w(l, {})
-		}), /* @__PURE__ */ w("span", {
+			children: c && /* @__PURE__ */ O(s, {})
+		}), /* @__PURE__ */ O("span", {
 			className: "col-start-2 truncate",
 			children: r ?? i.textOf(t)
 		})]
 	});
 }
-function L({ children: e = "No results found" }) {
-	let t = D();
-	return !t.query || t.matches.length ? null : /* @__PURE__ */ w("li", {
+function V({ children: e }) {
+	let t = j(), n = i();
+	return !t.query || t.matches.length ? null : /* @__PURE__ */ O("li", {
 		className: "text-muted-foreground cursor-not-allowed px-3 py-2 text-sm",
-		children: e
+		children: e ?? n.noResults
 	});
 }
-function R({ onCreate: e, children: t = (e) => `Add ${e}` }) {
-	let n = D(), { create: r } = n;
-	return y(() => (r.current = e, () => {
-		r.current = null;
-	}), [r, e]), !n.query || n.matches.length ? null : /* @__PURE__ */ w("li", {
+function H({ onCreate: e, children: t }) {
+	let n = j(), r = i(), { create: a } = n;
+	return C(() => (a.current = e, () => {
+		a.current = null;
+	}), [a, e]), !n.query || n.matches.length ? null : /* @__PURE__ */ O("li", {
 		role: "option",
 		"aria-selected": !1,
 		className: "hover:bg-muted cursor-pointer px-3 py-2 text-sm select-none",
 		onClick: () => {
 			e(n.query), n.setQuery("");
 		},
-		children: t(n.query)
+		children: (t ?? r.add)(n.query)
 	});
 }
 //#endregion
-export { R as ComboboxCreate, L as ComboboxEmpty, I as ComboboxItem, F as ComboboxList, j as ComboboxPopup, M as ComboboxSearch, k as ComboboxTrigger, O as default };
+export { H as ComboboxCreate, V as ComboboxEmpty, B as ComboboxItem, z as ComboboxList, F as ComboboxPopup, I as ComboboxSearch, N as ComboboxTrigger, M as default };

package/dist/command-palette/index.d.ts

@@ -1,11 +1,11 @@
-import { ReactNode } from 'react';
+import { ComponentProps, ReactNode } from 'react';
 /**
  * Search everything and act on it (pages, commands, records): a field over a
  * list that narrows as you type. Arrow keys move, Enter runs the item and
  * closes. Open it from a button, or anywhere with ⌘K / Ctrl+K
  * (useCommandPaletteShortcut).
  */
-export default function CommandPalette({ open, onOpenChange, items, placeholder, empty, label, className, }: CommandPaletteProps): import('react').JSX.Element;
+export default function CommandPalette({ open, onOpenChange, items, placeholder: placeholderProp, empty: emptyProp, label: labelProp, className, ref: refProp, ...rest }: CommandPaletteProps): import('react').JSX.Element;
 /** The items matching `query`: each of its words is in the label or keywords. Labels starting with it come first. */
 export declare function search(items: CommandItem[], query: string): CommandItem[];
 /** Calls `open` on ⌘K (Mac) or Ctrl+K, anywhere on the page. */
@@ -23,7 +23,8 @@ export interface CommandItem {
     hint?: ReactNode;
     onSelect: () => void;
 }
-export interface CommandPaletteProps {
+/** Other props (data-*, an id) go on the <dialog>. */
+export interface CommandPaletteProps extends Omit<ComponentProps<'dialog'>, 'open' | 'children'> {
     open: boolean;
     onOpenChange: (open: boolean) => void;
     items: CommandItem[];

package/dist/command-palette/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/command-palette/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAA+C,MAAM,OAAO,CAAC;AAE9F;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACnC,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,WAAuB,EACvB,KAAoB,EACpB,KAAkB,EAClB,SAAS,GACZ,EAAE,mBAAmB,+BAoIrB;AAED,qHAAqH;AACrH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,EAAE,KAAK,EAAE,MAAM,GAAG,WAAW,EAAE,CAUzE;AAED,gEAAgE;AAChE,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,MAAM,IAAI,EAAE,GAAG,SAAM,GAAG,IAAI,CAc3E;AAED,MAAM,WAAW,WAAW;IACxB,oDAAoD;IACpD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,mBAAmB;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0DAA0D;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/command-palette/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAiB,SAAS,EAA+C,MAAM,OAAO,CAAC;AAE9G;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACnC,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,WAAW,EAAE,eAAe,EAC5B,KAAK,EAAE,SAAS,EAChB,KAAK,EAAE,SAAS,EAChB,SAAS,EACT,GAAG,EAAE,OAAO,EACZ,GAAG,IAAI,EACV,EAAE,mBAAmB,+BA0IrB;AAED,qHAAqH;AACrH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,EAAE,KAAK,EAAE,MAAM,GAAG,WAAW,EAAE,CAUzE;AAED,gEAAgE;AAChE,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,MAAM,IAAI,EAAE,GAAG,SAAM,GAAG,IAAI,CAc3E;AAED,MAAM,WAAW,WAAW;IACxB,oDAAoD;IACpD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,sDAAsD;AACtD,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC5F,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0DAA0D;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB"}