@jfrader/ui 0.5.0 → 0.5.1

package/dist/command-palette-BQ5LleGb.js

@@ -1,384 +0,0 @@
-'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { t as n } from "./focus-ring-BK5W5_NY.js";
-import { t as r } from "./use-controlled-state-DpeVQZNR.js";
-import { t as i } from "./visually-hidden-BJdvqqvn.js";
-import { t as a } from "./renderable-DzcIj1Lo.js";
-import { n as o, t as s } from "./surface-DZ4d-2aL.js";
-import { t as c } from "./trigger-style-B1KVC8O1.js";
-import { t as l } from "./overlay-layer-SeUyyEPD.js";
-import { i as u, r as d, t as f } from "./use-native-dialog-DWpIUVO1.js";
-import { n as p } from "./listbox-style-WX-RASp1.js";
-import { a as m, r as h, t as g } from "./collection-registry-k6JcD3Jr.js";
-import { createContext as _, useCallback as v, useContext as y, useId as b, useMemo as x, useRef as S, useState as C } from "react";
-import { vars as w } from "@jfrader/tokens/vars";
-import { jsx as T, jsxs as E } from "@emotion/react/jsx-runtime";
-import { FloatingList as D, useFloatingRootContext as O, useInteractions as ee, useListNavigation as te, useMergeRefs as k } from "@floating-ui/react";
-//#region src/components/command-palette/command-palette.styles.ts
-var A = e({
-	...s,
-	marginBlockStart: w.space[12]
-}), j = e({
-	...o,
-	display: "flex",
-	flexDirection: "column",
-	borderRadius: w.radius.lg,
-	boxShadow: w.shadow.floating,
-	inlineSize: "min(560px, calc(100vw - 32px))"
-}), M = e({
-	boxSizing: "border-box",
-	inlineSize: "100%",
-	blockSize: "48px",
-	margin: 0,
-	border: 0,
-	borderBlockEnd: `1px solid ${w.color.borderControl}`,
-	borderStartStartRadius: w.radius.lg,
-	borderStartEndRadius: w.radius.lg,
-	backgroundColor: "transparent",
-	paddingInline: w.space[4],
-	font: "inherit",
-	fontSize: w.textSize.md,
-	color: w.color.text,
-	"&::placeholder": { color: w.color.textSubtle },
-	"&:focus-visible": { ...n }
-}), N = e({
-	boxSizing: "border-box",
-	display: "flex",
-	flexDirection: "column",
-	maxBlockSize: "320px",
-	overflow: "auto",
-	padding: w.space[1],
-	"&[hidden]": { display: "none" }
-}), P = e({
-	display: "flex",
-	flexDirection: "column",
-	"&[hidden]": { display: "none" }
-}), F = e({
-	paddingBlock: w.space[1],
-	paddingInline: w.space[2],
-	fontSize: w.textSize.xs,
-	fontWeight: w.fontWeight.medium,
-	color: w.color.textMuted
-}), I = e({
-	"&:hover, &[data-active]": { backgroundColor: w.color.surfaceHover },
-	"&[hidden]": { display: "none" }
-}), L = e({
-	paddingBlock: w.space[6],
-	paddingInline: w.space[4],
-	textAlign: "center",
-	fontSize: w.textSize.sm,
-	color: w.color.textMuted
-}), ne = "Command palette", re = "No results", R = new Intl.PluralRules("en"), ie = (e, t) => e.toLocaleLowerCase().includes(t.toLocaleLowerCase()), ae = (e) => `${e} ${R.select(e) === "one" ? "result" : "results"}`, z = _(null), B = _(null);
-function V(e) {
-	let t = y(z);
-	if (!t) throw Error(`CommandPalette.${e} must be rendered inside <CommandPalette>.`);
-	return t;
-}
-var H = (e) => {
-	e?.setAttribute("autofocus", "");
-};
-function U({ open: e, defaultOpen: t = !1, onOpenChange: n, label: i = ne, filter: a = ie, emptyMessage: o = re, formatResultCount: s = ae, children: c }) {
-	let l = b(), [d = !1, f] = r(e, t, n), { dialogElementRef: p, setDialogElement: h, setOpen: g, requestClose: _, repairToken: y } = u(d, f), [w, E] = C(""), [D, k] = C(!1), [A, j] = C(null), [M, N] = m(), [P, F] = C(null), [I, L] = C(null), [R, B] = C(d), V = S([]);
-	d !== R && (B(d), d && (E(""), k(!1), j(null)));
-	let H = v(() => {
-		g(!(d && p.current?.open));
-	}, [
-		d,
-		g,
-		p
-	]), { matchedValues: U, matchedIndices: W, visibleGroupIds: G } = x(() => {
-		let e = /* @__PURE__ */ new Set(), t = [], n = /* @__PURE__ */ new Set();
-		return M.forEach((r, i) => {
-			r.index !== -1 && (w === "" || a(r.label, w) || r.keywords !== void 0 && a(r.keywords, w)) && (e.add(i), t.push(r.index), r.groupId !== null && n.add(r.groupId));
-		}), t.sort((e, t) => e - t), {
-			matchedValues: e,
-			matchedIndices: t,
-			visibleGroupIds: n
-		};
-	}, [
-		M,
-		w,
-		a
-	]), K = x(() => new Set(W), [W]), q = A !== null && K.has(A) ? A : W[0] ?? null, J = O({
-		open: d,
-		onOpenChange: (e) => g(e),
-		elements: {
-			reference: P,
-			floating: I
-		}
-	}), Y = te(J, {
-		listRef: V,
-		activeIndex: q,
-		onNavigate: (e) => {
-			e !== null && j(e);
-		},
-		virtual: !0,
-		loop: !0,
-		focusItemOnOpen: !1,
-		disabledIndices: (e) => !K.has(e)
-	}), { getReferenceProps: X, getFloatingProps: Z, getItemProps: Q } = ee([Y]), $ = W.length, oe = D ? s($) : "", se = x(() => ({
-		open: d,
-		setOpen: g,
-		toggleOpen: H,
-		requestClose: _,
-		repairToken: y,
-		setDialogElement: h,
-		label: i,
-		emptyMessage: o,
-		baseId: l,
-		listId: `${l}-list`,
-		query: w,
-		announcement: oe,
-		matchCount: $,
-		matchedValues: U,
-		visibleGroupIds: G,
-		activeIndex: q,
-		elementsRef: V,
-		setInputElement: F,
-		setListElement: L,
-		getReferenceProps: X,
-		getFloatingProps: Z,
-		getItemProps: Q,
-		changeQuery: (e) => {
-			E(e), k(!0), j(null);
-		},
-		moveToEdge: (e) => {
-			let t = e === "first" ? W[0] : W[W.length - 1];
-			t !== void 0 && j(t);
-		},
-		registration: N
-	}), [
-		d,
-		g,
-		H,
-		_,
-		y,
-		h,
-		i,
-		o,
-		l,
-		w,
-		oe,
-		$,
-		U,
-		W,
-		G,
-		q,
-		X,
-		Z,
-		Q,
-		N
-	]);
-	return /* @__PURE__ */ T(z.Provider, {
-		value: se,
-		children: c
-	});
-}
-function W(e) {
-	return /* @__PURE__ */ T(l, { children: /* @__PURE__ */ T(U, { ...e }) });
-}
-W.displayName = "CommandPalette";
-function G({ ref: e, onClick: n, className: r, sx: i, ...a }) {
-	let { open: o, toggleOpen: s } = V("Trigger"), l = (e) => {
-		n?.(e), e.defaultPrevented || s();
-	};
-	return /* @__PURE__ */ T(t, {
-		className: r,
-		styles: c,
-		sx: i,
-		children: (t) => /* @__PURE__ */ T("button", {
-			type: "button",
-			...a,
-			ref: e,
-			"data-ui": "command-palette-trigger",
-			"aria-haspopup": "dialog",
-			"aria-expanded": o,
-			onClick: l,
-			className: t
-		})
-	});
-}
-G.displayName = "CommandPalette.Trigger";
-function K({ ref: e, className: n, sx: r, ...a }) {
-	let { children: o, onCancel: s, onClick: c, onClose: l, ...u } = f(a), p = V("Content"), { label: m, announcement: h } = p, g = d(p, {
-		onCancel: s,
-		onClick: c,
-		onClose: l
-	}, e);
-	return /* @__PURE__ */ T(t, {
-		className: n,
-		styles: A,
-		sx: r,
-		children: (e) => /* @__PURE__ */ T("dialog", {
-			"aria-label": m,
-			...u,
-			...g,
-			"data-ui": "command-palette",
-			"aria-modal": "true",
-			className: e,
-			children: /* @__PURE__ */ E("div", {
-				css: j,
-				children: [o, /* @__PURE__ */ T("div", {
-					role: "status",
-					"aria-live": "polite",
-					"aria-atomic": "true",
-					css: i,
-					children: h
-				})]
-			})
-		})
-	});
-}
-K.displayName = "CommandPalette.Content";
-function q({ ref: e, onChange: n, onKeyDown: r, className: i, sx: a, ...o }) {
-	let { label: s, listId: c, query: l, matchCount: u, activeIndex: d, elementsRef: f, requestClose: p, setInputElement: m, getReferenceProps: h, changeQuery: g, moveToEdge: _ } = V("Input"), v = k([
-		m,
-		H,
-		e
-	]), y = (e) => {
-		n?.(e), g(e.currentTarget.value);
-	}, b = (e) => {
-		r?.(e), !(e.defaultPrevented || e.nativeEvent.isComposing) && (e.key === "Escape" ? (e.preventDefault(), p()) : (e.key === "Home" || e.key === "End") && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey ? (e.preventDefault(), _(e.key === "Home" ? "first" : "last")) : e.key === "Enter" && d !== null && (e.preventDefault(), f.current[d]?.click()));
-	};
-	return /* @__PURE__ */ T(t, {
-		className: i,
-		styles: M,
-		sx: a,
-		children: (e) => /* @__PURE__ */ T("input", {
-			"aria-label": s,
-			autoComplete: "off",
-			spellCheck: !1,
-			...h({
-				...o,
-				onChange: y,
-				onKeyDown: b
-			}),
-			ref: v,
-			type: "text",
-			value: l,
-			role: "combobox",
-			"aria-autocomplete": "list",
-			"aria-expanded": u > 0,
-			"aria-controls": c,
-			"data-ui": "command-palette-input",
-			className: e
-		})
-	});
-}
-q.displayName = "CommandPalette.Input";
-function J({ ref: e, onMouseDown: n, children: r, className: i, sx: a, ...o }) {
-	let { label: s, listId: c, matchCount: l, elementsRef: u, setListElement: d, getFloatingProps: f } = V("List"), p = k([d, e]), m = (e) => {
-		n?.(e), e.preventDefault();
-	};
-	return /* @__PURE__ */ T(t, {
-		className: i,
-		styles: N,
-		sx: a,
-		children: (e) => /* @__PURE__ */ T("div", {
-			"aria-label": s,
-			...f({
-				...o,
-				onMouseDown: m
-			}),
-			ref: p,
-			id: c,
-			role: "listbox",
-			hidden: l === 0,
-			"data-ui": "command-palette-list",
-			className: e,
-			children: /* @__PURE__ */ T(D, {
-				elementsRef: u,
-				children: r
-			})
-		})
-	});
-}
-J.displayName = "CommandPalette.List";
-function Y({ ref: e, children: n, className: r, sx: i, ...o }) {
-	let { matchCount: s, emptyMessage: c } = V("Empty");
-	return s > 0 ? null : /* @__PURE__ */ T(t, {
-		className: r,
-		styles: L,
-		sx: i,
-		children: (t) => /* @__PURE__ */ T("div", {
-			...o,
-			ref: e,
-			"data-ui": "command-palette-empty",
-			className: t,
-			children: a(n) ? n : c
-		})
-	});
-}
-Y.displayName = "CommandPalette.Empty";
-function X({ ref: e, label: n, children: r, "aria-labelledby": i, className: a, sx: o, ...s }) {
-	let { visibleGroupIds: c } = V("Group"), l = b(), u = `${l}-heading`;
-	return /* @__PURE__ */ T(t, {
-		className: a,
-		styles: P,
-		sx: o,
-		children: (t) => /* @__PURE__ */ E("div", {
-			...s,
-			ref: e,
-			role: "group",
-			"aria-labelledby": [i, u].filter(Boolean).join(" "),
-			hidden: !c.has(l),
-			"data-ui": "command-palette-group",
-			className: t,
-			children: [/* @__PURE__ */ T("div", {
-				id: u,
-				css: F,
-				children: n
-			}), /* @__PURE__ */ T(B.Provider, {
-				value: l,
-				children: r
-			})]
-		})
-	});
-}
-X.displayName = "CommandPalette.Group";
-function Z({ ref: e, value: n, onSelect: r, keywords: i, onClick: a, children: o, className: s, sx: c, ...l }) {
-	let { baseId: u, activeIndex: d, matchedValues: f, getItemProps: m, setOpen: _, registration: v } = V("Item"), b = y(B), x = S(null), { ref: C, index: w } = h(n, v, x, (e, t) => ({
-		index: e,
-		label: t,
-		keywords: i,
-		groupId: b
-	})), E = k([
-		C,
-		x,
-		e
-	]), D = w !== -1 && d === w, O = (e) => {
-		a?.(e), !e.defaultPrevented && (r?.(), _(!1));
-	};
-	return /* @__PURE__ */ T(t, {
-		className: s,
-		styles: [p, I],
-		sx: c,
-		children: (e) => /* @__PURE__ */ T("div", {
-			...m({
-				id: g(u, n),
-				...l,
-				onClick: O
-			}),
-			ref: E,
-			role: "option",
-			"aria-selected": D,
-			hidden: !f.has(n),
-			"data-active": D || void 0,
-			"data-ui": "command-palette-item",
-			className: e,
-			children: o
-		})
-	});
-}
-Z.displayName = "CommandPalette.Item";
-var Q = Object.assign(W, {
-	Trigger: G,
-	Content: K,
-	Input: q,
-	List: J,
-	Empty: Y,
-	Group: X,
-	Item: Z
-});
-//#endregion
-export { Q as t };