@optimum-intelligence/opti-ui 0.0.0-stage → 0.2.0

package/dist/components/combobox/Combobox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.js","names":["React","Combobox","BaseCombobox","withClass","usePortalContainer","CheckIcon","ChevronDownIcon","XIcon","Field","ControlSize","ComboboxInputGroupProps","InputGroup","Props","size","ComboboxInputGroup","t0","$","_c","className","props","ref","t1","undefined","t2","t3","ComboboxInput","ComboboxTrigger","children","ComboboxClear","ComboboxContentProps","Popup","side","Positioner","align","sideOffset","positionerProps","ComboboxContent","container","t4","t5","ComboboxList","ComboboxItem","Symbol","for","ComboboxEmpty","ComboboxChips","ComboboxChip","removeLabel","ComboboxGroupLabel","ComboboxOption","value","label","disabled","RootProps","Omit","Root","ComboboxProps","items","ReactNode","description","error","placeholder","emptyText","hideClear","inputProps","Input","ComboboxComponent","multiple","name","required","rootProps","t6","t7","map","_temp","length","t8","t9","t10","t11","t12","t13","_temp2","t14","t15","t16","t17","t18","item_0","item","Object","assign","Trigger","Clear","Value","Chips","Chip","Content","List","Item","Empty","Group","GroupLabel","Collection","useFilter","_c","BaseCombobox","Combobox"],"sources":["../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Combobox as BaseCombobox } from '@base-ui/react/combobox';\nimport { withClass } from '../../utils/cx';\nimport { usePortalContainer } from '../../utils/portal';\nimport { CheckIcon, ChevronDownIcon, XIcon } from '../../icons';\nimport { Field } from '../field/Field';\nimport type { ControlSize } from '../input/Input';\n\n// ─── Parts ───────────────────────────────────────────────────────────────────\n\nexport interface ComboboxInputGroupProps extends BaseCombobox.InputGroup.Props {\n  size?: ControlSize;\n}\n\nfunction ComboboxInputGroup({ size = 'md', className, ref, ...props }: ComboboxInputGroupProps) {\n  return (\n    <BaseCombobox.InputGroup\n      ref={ref}\n      className={withClass('oui-combobox__group', className)}\n      data-size={size}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxInput({ className, ref, ...props }: BaseCombobox.Input.Props) {\n  return <BaseCombobox.Input ref={ref} className={withClass('oui-combobox__input', className)} {...props} />;\n}\n\nfunction ComboboxTrigger({ className, children, ref, ...props }: BaseCombobox.Trigger.Props) {\n  return (\n    <BaseCombobox.Trigger\n      ref={ref}\n      aria-label=\"Open list\"\n      className={withClass('oui-combobox__action', className)}\n      {...props}\n    >\n      {children ?? <ChevronDownIcon />}\n    </BaseCombobox.Trigger>\n  );\n}\n\nfunction ComboboxClear({ className, children, ref, ...props }: BaseCombobox.Clear.Props) {\n  return (\n    <BaseCombobox.Clear\n      ref={ref}\n      aria-label=\"Clear selection\"\n      className={withClass('oui-combobox__action', className)}\n      {...props}\n    >\n      {children ?? <XIcon />}\n    </BaseCombobox.Clear>\n  );\n}\n\nexport interface ComboboxContentProps extends BaseCombobox.Popup.Props {\n  side?: BaseCombobox.Positioner.Props['side'];\n  align?: BaseCombobox.Positioner.Props['align'];\n  sideOffset?: BaseCombobox.Positioner.Props['sideOffset'];\n  positionerProps?: BaseCombobox.Positioner.Props;\n}\n\nfunction ComboboxContent({\n  side,\n  align,\n  sideOffset = 6,\n  positionerProps,\n  className,\n  ref,\n  ...props\n}: ComboboxContentProps) {\n  const container = usePortalContainer();\n  return (\n    <BaseCombobox.Portal container={container}>\n      <BaseCombobox.Positioner\n        className=\"oui-combobox__positioner\"\n        side={side}\n        align={align}\n        sideOffset={sideOffset}\n        {...positionerProps}\n      >\n        <BaseCombobox.Popup ref={ref} className={withClass('oui-combobox__popup', className)} {...props} />\n      </BaseCombobox.Positioner>\n    </BaseCombobox.Portal>\n  );\n}\n\nfunction ComboboxList({ className, ref, ...props }: BaseCombobox.List.Props) {\n  return <BaseCombobox.List ref={ref} className={withClass('oui-combobox__list', className)} {...props} />;\n}\n\nfunction ComboboxItem({ className, children, ref, ...props }: BaseCombobox.Item.Props) {\n  return (\n    <BaseCombobox.Item ref={ref} className={withClass('oui-combobox__item', className)} {...props}>\n      <span className=\"oui-combobox__item-text\">{children}</span>\n      <BaseCombobox.ItemIndicator className=\"oui-combobox__item-indicator\">\n        <CheckIcon />\n      </BaseCombobox.ItemIndicator>\n    </BaseCombobox.Item>\n  );\n}\n\nfunction ComboboxEmpty({ className, ref, ...props }: BaseCombobox.Empty.Props) {\n  return <BaseCombobox.Empty ref={ref} className={withClass('oui-combobox__empty', className)} {...props} />;\n}\n\nfunction ComboboxChips({ className, ref, ...props }: BaseCombobox.Chips.Props) {\n  return <BaseCombobox.Chips ref={ref} className={withClass('oui-combobox__chips', className)} {...props} />;\n}\n\nfunction ComboboxChip({\n  className,\n  children,\n  removeLabel = 'Remove',\n  ref,\n  ...props\n}: BaseCombobox.Chip.Props & { removeLabel?: string }) {\n  return (\n    <BaseCombobox.Chip ref={ref} className={withClass('oui-combobox__chip', className)} {...props}>\n      {children}\n      <BaseCombobox.ChipRemove className=\"oui-combobox__chip-remove\" aria-label={removeLabel}>\n        <XIcon />\n      </BaseCombobox.ChipRemove>\n    </BaseCombobox.Chip>\n  );\n}\n\nfunction ComboboxGroupLabel({ className, ref, ...props }: BaseCombobox.GroupLabel.Props) {\n  return <BaseCombobox.GroupLabel ref={ref} className={withClass('oui-select__group-label', className)} {...props} />;\n}\n\n// ─── Convenience component ───────────────────────────────────────────────────\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\ntype RootProps = Omit<BaseCombobox.Root.Props<ComboboxOption, boolean | undefined>, 'items' | 'children'>;\n\nexport interface ComboboxProps extends RootProps {\n  items: ComboboxOption[];\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n  error?: React.ReactNode;\n  placeholder?: string;\n  /** Shown when the filter matches nothing. */\n  emptyText?: React.ReactNode;\n  size?: ControlSize;\n  /** Hide the clear button. */\n  hideClear?: boolean;\n  inputProps?: BaseCombobox.Input.Props;\n}\n\nfunction ComboboxComponent({\n  items,\n  label,\n  description,\n  error,\n  placeholder,\n  emptyText = 'No results found.',\n  size = 'md',\n  hideClear,\n  inputProps,\n  name,\n  disabled,\n  required,\n  multiple,\n  ...rootProps\n}: ComboboxProps) {\n  return (\n    <Field.Root name={name} disabled={disabled} invalid={error ? true : undefined}>\n      <BaseCombobox.Root\n        items={items}\n        multiple={multiple}\n        disabled={disabled}\n        required={required}\n        {...(rootProps as BaseCombobox.Root.Props<ComboboxOption, boolean | undefined>)}\n      >\n        {label && <Field.Label required={required}>{label}</Field.Label>}\n        <ComboboxInputGroup size={size} data-multiple={multiple || undefined}>\n          {multiple ? (\n            <BaseCombobox.Value>\n              {(value: ComboboxOption[]) => (\n                <ComboboxChips>\n                  {value.map((item) => (\n                    <ComboboxChip key={item.value} removeLabel={`Remove ${item.label}`}>\n                      {item.label}\n                    </ComboboxChip>\n                  ))}\n                  <ComboboxInput placeholder={value.length ? undefined : placeholder} {...inputProps} />\n                </ComboboxChips>\n              )}\n            </BaseCombobox.Value>\n          ) : (\n            <ComboboxInput placeholder={placeholder} {...inputProps} />\n          )}\n          <span className=\"oui-combobox__actions\">\n            {!hideClear && <ComboboxClear />}\n            <ComboboxTrigger />\n          </span>\n        </ComboboxInputGroup>\n        <ComboboxContent>\n          <ComboboxEmpty>{emptyText}</ComboboxEmpty>\n          <ComboboxList>\n            {(item: ComboboxOption) => (\n              <ComboboxItem key={item.value} value={item} disabled={item.disabled}>\n                {item.label}\n              </ComboboxItem>\n            )}\n          </ComboboxList>\n        </ComboboxContent>\n      </BaseCombobox.Root>\n      {description && <Field.Description>{description}</Field.Description>}\n      {error ? <Field.Error match>{error}</Field.Error> : <Field.Error />}\n    </Field.Root>\n  );\n}\n\n/**\n * Searchable select. `<Combobox items={…} />` covers single and `multiple`\n * (chips) selection; compose the parts for anything custom.\n */\nexport const Combobox = Object.assign(ComboboxComponent, {\n  Root: BaseCombobox.Root,\n  InputGroup: ComboboxInputGroup,\n  Input: ComboboxInput,\n  Trigger: ComboboxTrigger,\n  Clear: ComboboxClear,\n  Value: BaseCombobox.Value,\n  Chips: ComboboxChips,\n  Chip: ComboboxChip,\n  Content: ComboboxContent,\n  List: ComboboxList,\n  Item: ComboboxItem,\n  Empty: ComboboxEmpty,\n  Group: BaseCombobox.Group,\n  GroupLabel: ComboboxGroupLabel,\n  Collection: BaseCombobox.Collection,\n  useFilter: BaseCombobox.useFilter,\n});\n"],"mappings":"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"}

package/dist/components/command-palette/CommandPalette.d.ts

@@ -0,0 +1,52 @@
+import * as React from 'react';
+export interface CommandItem {
+    id: string;
+    label: string;
+    /** Secondary text next to the label. */
+    description?: React.ReactNode;
+    /** Heading the item is listed under. Groups appear in first-seen order. */
+    group?: string;
+    icon?: React.ReactNode;
+    /** Extra search terms that are not displayed. */
+    keywords?: string;
+    /** Hint shown on the right, e.g. `<kbd>G</kbd>` or an arrow icon. */
+    shortcut?: React.ReactNode;
+    disabled?: boolean;
+    onSelect?: () => void;
+}
+export interface CommandPaletteProps<T extends CommandItem = CommandItem> {
+    items: T[];
+    /** Called for any chosen item, after the item's own `onSelect`. */
+    onSelect?: (item: T) => void;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    search?: string;
+    defaultSearch?: string;
+    onSearchChange?: (search: string) => void;
+    /**
+     * Custom match function, or `false` when `items` are already filtered (server-side search).
+     * By default every term must occur in the label, keywords or group.
+     */
+    filter?: ((item: T, search: string) => boolean) | false;
+    /** Cap on rendered results. */
+    maxResults?: number;
+    /** Key that toggles the palette together with Ctrl / ⌘. `false` disables the shortcut. */
+    hotkey?: string | false;
+    /** Keep the palette open after choosing an item. */
+    keepOpenOnSelect?: boolean;
+    /** Accessible name of the dialog. */
+    title?: string;
+    placeholder?: string;
+    emptyText?: React.ReactNode;
+    /** Show a spinner in the search row while results load. */
+    loading?: boolean;
+    /** Content below the results (key hints, a retry button…). */
+    footer?: React.ReactNode;
+    className?: string;
+}
+/**
+ * Searchable command menu in a dialog (Ctrl / ⌘ + K) for navigation and quick
+ * actions. Keyboard: arrows move, Enter chooses, Esc closes.
+ */
+export declare function CommandPalette<T extends CommandItem = CommandItem>({ items, onSelect, open: openProp, defaultOpen, onOpenChange, search: searchProp, defaultSearch, onSearchChange, filter, maxResults, hotkey, keepOpenOnSelect, title, placeholder, emptyText, loading, footer, className, }: CommandPaletteProps<T>): React.JSX.Element;

package/dist/components/command-palette/CommandPalette.js

@@ -0,0 +1,328 @@
+"use client";
+import { usePortalContainer } from "../../utils/portal.js";
+import { cx } from "../../utils/cx.js";
+import { SearchIcon } from "../../icons/index.js";
+import { Spinner } from "../spinner/Spinner.js";
+import { matchesQuery } from "../../utils/search.js";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Dialog } from "@base-ui/react/dialog";
+//#region src/components/command-palette/CommandPalette.tsx
+function useControlled(value, initial, onChange) {
+	const $ = c(5);
+	const [inner, setInner] = React.useState(initial);
+	let t0;
+	if ($[0] !== onChange) {
+		t0 = (next) => {
+			setInner(next);
+			onChange?.(next);
+		};
+		$[0] = onChange;
+		$[1] = t0;
+	} else t0 = $[1];
+	const set = t0;
+	const t1 = value === void 0 ? inner : value;
+	let t2;
+	if ($[2] !== set || $[3] !== t1) {
+		t2 = [t1, set];
+		$[2] = set;
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
+	return t2;
+}
+/**
+* Searchable command menu in a dialog (Ctrl / ⌘ + K) for navigation and quick
+* actions. Keyboard: arrows move, Enter chooses, Esc closes.
+*/
+function CommandPalette(t0) {
+	const $ = c(36);
+	const { items, onSelect, open: openProp, defaultOpen: t1, onOpenChange, search: searchProp, defaultSearch: t2, onSearchChange, filter, maxResults: t3, hotkey: t4, keepOpenOnSelect, title: t5, placeholder: t6, emptyText: t7, loading, footer, className } = t0;
+	const defaultOpen = t1 === void 0 ? false : t1;
+	const defaultSearch = t2 === void 0 ? "" : t2;
+	const maxResults = t3 === void 0 ? 50 : t3;
+	const hotkey = t4 === void 0 ? "k" : t4;
+	const title = t5 === void 0 ? "Command palette" : t5;
+	const placeholder = t6 === void 0 ? "Search…" : t6;
+	const emptyText = t7 === void 0 ? "No results found." : t7;
+	const [open, setOpen] = useControlled(openProp, defaultOpen, onOpenChange);
+	const [search, setSearch] = useControlled(searchProp, defaultSearch, onSearchChange);
+	const [active, setActive] = React.useState(0);
+	const container = usePortalContainer();
+	const inputRef = React.useRef(null);
+	const listRef = React.useRef(null);
+	const baseId = React.useId();
+	const toggle = React.useRef(_temp);
+	let t8;
+	if ($[0] !== open || $[1] !== setOpen) {
+		t8 = () => {
+			toggle.current = () => setOpen(!open);
+		};
+		$[0] = open;
+		$[1] = setOpen;
+		$[2] = t8;
+	} else t8 = $[2];
+	React.useEffect(t8);
+	let t10;
+	let t9;
+	if ($[3] !== hotkey) {
+		t9 = () => {
+			if (!hotkey) return;
+			const onKeyDown = (event) => {
+				if ((event.metaKey || event.ctrlKey) && !event.altKey && event.key.toLowerCase() === hotkey.toLowerCase()) {
+					event.preventDefault();
+					toggle.current();
+				}
+			};
+			window.addEventListener("keydown", onKeyDown);
+			return () => window.removeEventListener("keydown", onKeyDown);
+		};
+		t10 = [hotkey];
+		$[3] = hotkey;
+		$[4] = t10;
+		$[5] = t9;
+	} else {
+		t10 = $[4];
+		t9 = $[5];
+	}
+	React.useEffect(t9, t10);
+	const matched = filter === false ? items : items.filter((item) => filter ? filter(item, search) : matchesQuery(`${item.label} ${item.keywords ?? ""} ${item.group ?? ""}`, search));
+	const byGroup = /* @__PURE__ */ new Map();
+	for (const item_0 of matched.slice(0, maxResults)) {
+		const key = item_0.group ?? "";
+		byGroup.set(key, [...byGroup.get(key) ?? [], item_0]);
+	}
+	const groups = [...byGroup].map(_temp2);
+	const results = groups.flatMap(_temp3);
+	const activeIndex = Math.min(active, Math.max(0, results.length - 1));
+	let t11;
+	if ($[6] !== baseId) {
+		t11 = (index) => `${baseId}-option-${index}`;
+		$[6] = baseId;
+		$[7] = t11;
+	} else t11 = $[7];
+	const optionId = t11;
+	let t12;
+	if ($[8] !== keepOpenOnSelect || $[9] !== onSelect || $[10] !== setOpen) {
+		t12 = (item_1) => {
+			if (!item_1 || item_1.disabled) return;
+			item_1.onSelect?.();
+			onSelect?.(item_1);
+			if (!keepOpenOnSelect) setOpen(false);
+		};
+		$[8] = keepOpenOnSelect;
+		$[9] = onSelect;
+		$[10] = setOpen;
+		$[11] = t12;
+	} else t12 = $[11];
+	const choose = t12;
+	const move = (step) => {
+		if (!results.length) return;
+		let next = activeIndex;
+		for (let i = 0; i < results.length; i++) {
+			next = (next + step + results.length) % results.length;
+			if (!results[next].disabled) break;
+		}
+		setActive(next);
+		listRef.current?.querySelector(`[data-index="${next}"]`)?.scrollIntoView({ block: "nearest" });
+	};
+	const onKeyDown_0 = (event_0) => {
+		if (event_0.key === "ArrowDown" || event_0.key === "ArrowUp") {
+			event_0.preventDefault();
+			move(event_0.key === "ArrowDown" ? 1 : -1);
+		} else if (event_0.key === "Enter" && !event_0.nativeEvent.isComposing) {
+			event_0.preventDefault();
+			choose(results[activeIndex]);
+		}
+	};
+	let index_0 = -1;
+	let t13;
+	if ($[12] !== setOpen) {
+		t13 = (next_0) => setOpen(next_0);
+		$[12] = setOpen;
+		$[13] = t13;
+	} else t13 = $[13];
+	let t14;
+	if ($[14] !== search || $[15] !== setSearch) {
+		t14 = (next_1) => {
+			if (!next_1) {
+				setActive(0);
+				if (search) setSearch("");
+			}
+		};
+		$[14] = search;
+		$[15] = setSearch;
+		$[16] = t14;
+	} else t14 = $[16];
+	let t15;
+	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+		t15 = /* @__PURE__ */ jsx(Dialog.Backdrop, { className: "oui-dialog__backdrop" });
+		$[17] = t15;
+	} else t15 = $[17];
+	let t16;
+	if ($[18] !== className) {
+		t16 = cx("oui-command", className);
+		$[18] = className;
+		$[19] = t16;
+	} else t16 = $[19];
+	let t17;
+	if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+		t17 = /* @__PURE__ */ jsx(SearchIcon, {});
+		$[20] = t17;
+	} else t17 = $[20];
+	let t18;
+	if ($[21] !== setSearch) {
+		t18 = (event_1) => {
+			setSearch(event_1.target.value);
+			setActive(0);
+		};
+		$[21] = setSearch;
+		$[22] = t18;
+	} else t18 = $[22];
+	let t19;
+	if ($[23] !== loading) {
+		t19 = loading && /* @__PURE__ */ jsx(Spinner, { size: "1rem" });
+		$[23] = loading;
+		$[24] = t19;
+	} else t19 = $[24];
+	const t20 = `${baseId}-list`;
+	const t21 = "listbox";
+	const t22 = "oui-command__list";
+	const t23 = groups.map((group_0, groupIndex) => /* @__PURE__ */ jsxs("div", {
+		role: "group",
+		"aria-labelledby": group_0.heading ? `${baseId}-group-${groupIndex}` : void 0,
+		className: "oui-command__group",
+		children: [group_0.heading && /* @__PURE__ */ jsx("div", {
+			id: `${baseId}-group-${groupIndex}`,
+			className: "oui-command__group-label",
+			children: group_0.heading
+		}), group_0.items.map((item_2) => {
+			index_0 = index_0 + 1;
+			const itemIndex = index_0;
+			return /* @__PURE__ */ jsxs("div", {
+				id: optionId(itemIndex),
+				role: "option",
+				className: "oui-command__item",
+				"aria-selected": itemIndex === activeIndex,
+				"aria-disabled": item_2.disabled || void 0,
+				"data-index": itemIndex,
+				"data-highlighted": itemIndex === activeIndex ? "" : void 0,
+				"data-disabled": item_2.disabled ? "" : void 0,
+				onPointerMove: () => !item_2.disabled && itemIndex !== activeIndex && setActive(itemIndex),
+				onClick: () => choose(item_2),
+				children: [
+					item_2.icon && /* @__PURE__ */ jsx("span", {
+						className: "oui-command__item-icon",
+						children: item_2.icon
+					}),
+					/* @__PURE__ */ jsxs("span", {
+						className: "oui-command__item-text",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "oui-command__item-label",
+							children: item_2.label
+						}), item_2.description && /* @__PURE__ */ jsx("span", {
+							className: "oui-command__item-description",
+							children: item_2.description
+						})]
+					}),
+					item_2.shortcut && /* @__PURE__ */ jsx("span", {
+						className: "oui-command__item-shortcut",
+						children: item_2.shortcut
+					})
+				]
+			}, item_2.id);
+		})]
+	}, group_0.heading));
+	let t24;
+	if ($[25] !== emptyText || $[26] !== results.length) {
+		t24 = !results.length && /* @__PURE__ */ jsx("div", {
+			className: "oui-command__empty",
+			children: emptyText
+		});
+		$[25] = emptyText;
+		$[26] = results.length;
+		$[27] = t24;
+	} else t24 = $[27];
+	let t25;
+	if ($[28] !== listRef || $[29] !== t20 || $[30] !== t23 || $[31] !== t24 || $[32] !== title) {
+		t25 = /* @__PURE__ */ jsxs("div", {
+			ref: listRef,
+			id: t20,
+			role: t21,
+			"aria-label": title,
+			className: t22,
+			children: [t23, t24]
+		});
+		$[28] = listRef;
+		$[29] = t20;
+		$[30] = t23;
+		$[31] = t24;
+		$[32] = title;
+		$[33] = t25;
+	} else t25 = $[33];
+	let t26;
+	if ($[34] !== footer) {
+		t26 = footer && /* @__PURE__ */ jsx("div", {
+			className: "oui-command__footer",
+			children: footer
+		});
+		$[34] = footer;
+		$[35] = t26;
+	} else t26 = $[35];
+	return /* @__PURE__ */ jsx(Dialog.Root, {
+		open,
+		onOpenChange: t13,
+		onOpenChangeComplete: t14,
+		children: /* @__PURE__ */ jsxs(Dialog.Portal, {
+			container,
+			children: [t15, /* @__PURE__ */ jsxs(Dialog.Popup, {
+				className: t16,
+				"aria-label": title,
+				initialFocus: inputRef,
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "oui-command__search",
+						children: [
+							t17,
+							/* @__PURE__ */ jsx("input", {
+								ref: inputRef,
+								className: "oui-command__input",
+								role: "combobox",
+								"aria-expanded": true,
+								"aria-autocomplete": "list",
+								"aria-controls": `${baseId}-list`,
+								"aria-activedescendant": results.length ? optionId(activeIndex) : void 0,
+								"aria-label": placeholder,
+								placeholder,
+								autoComplete: "off",
+								spellCheck: false,
+								value: search,
+								onChange: t18,
+								onKeyDown: onKeyDown_0
+							}),
+							t19
+						]
+					}),
+					t25,
+					t26
+				]
+			})]
+		})
+	});
+}
+function _temp3(group) {
+	return group.items;
+}
+function _temp2(t0) {
+	const [heading, groupItems] = t0;
+	return {
+		heading,
+		items: groupItems
+	};
+}
+function _temp() {}
+//#endregion
+export { CommandPalette };
+
+//# sourceMappingURL=CommandPalette.js.map

package/dist/components/command-palette/CommandPalette.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommandPalette.js","names":["React","Dialog","BaseDialog","cx","usePortalContainer","matchesQuery","SearchIcon","Spinner","CommandItem","id","label","description","ReactNode","group","icon","keywords","shortcut","disabled","onSelect","CommandPaletteProps","items","T","item","open","defaultOpen","onOpenChange","search","defaultSearch","onSearchChange","filter","maxResults","hotkey","keepOpenOnSelect","title","placeholder","emptyText","loading","footer","className","useControlled","value","initial","onChange","$","_c","inner","setInner","useState","t0","next","set","t1","undefined","t2","const","CommandPalette","openProp","searchProp","t3","t4","t5","t6","t7","setOpen","setSearch","active","setActive","container","inputRef","useRef","listRef","baseId","useId","toggle","_temp","t8","current","useEffect","t10","t9","onKeyDown","event","metaKey","ctrlKey","altKey","key","toLowerCase","preventDefault","window","addEventListener","removeEventListener","matched","byGroup","Map","item_0","slice","get","groups","map","_temp2","results","flatMap","_temp3","activeIndex","Math","min","max","length","t11","index","optionId","t12","item_1","choose","move","step","i","querySelector","scrollIntoView","block","onKeyDown_0","event_0","nativeEvent","isComposing","index_0","t13","next_0","t14","next_1","t15","Symbol","for","t16","t17","t18","event_1","target","t19","t20","t21","t22","t23","group_0","groupIndex","heading","item_2","itemIndex","t24","t25","t26","groupItems","_c","BaseDialog"],"sources":["../../../src/components/command-palette/CommandPalette.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as BaseDialog } from '@base-ui/react/dialog';\nimport { cx } from '../../utils/cx';\nimport { usePortalContainer } from '../../utils/portal';\nimport { matchesQuery } from '../../utils/search';\nimport { SearchIcon } from '../../icons';\nimport { Spinner } from '../spinner/Spinner';\n\nexport interface CommandItem {\n  id: string;\n  label: string;\n  /** Secondary text next to the label. */\n  description?: React.ReactNode;\n  /** Heading the item is listed under. Groups appear in first-seen order. */\n  group?: string;\n  icon?: React.ReactNode;\n  /** Extra search terms that are not displayed. */\n  keywords?: string;\n  /** Hint shown on the right, e.g. `<kbd>G</kbd>` or an arrow icon. */\n  shortcut?: React.ReactNode;\n  disabled?: boolean;\n  onSelect?: () => void;\n}\n\nexport interface CommandPaletteProps<T extends CommandItem = CommandItem> {\n  items: T[];\n  /** Called for any chosen item, after the item's own `onSelect`. */\n  onSelect?: (item: T) => void;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  search?: string;\n  defaultSearch?: string;\n  onSearchChange?: (search: string) => void;\n  /**\n   * Custom match function, or `false` when `items` are already filtered (server-side search).\n   * By default every term must occur in the label, keywords or group.\n   */\n  filter?: ((item: T, search: string) => boolean) | false;\n  /** Cap on rendered results. */\n  maxResults?: number;\n  /** Key that toggles the palette together with Ctrl / ⌘. `false` disables the shortcut. */\n  hotkey?: string | false;\n  /** Keep the palette open after choosing an item. */\n  keepOpenOnSelect?: boolean;\n  /** Accessible name of the dialog. */\n  title?: string;\n  placeholder?: string;\n  emptyText?: React.ReactNode;\n  /** Show a spinner in the search row while results load. */\n  loading?: boolean;\n  /** Content below the results (key hints, a retry button…). */\n  footer?: React.ReactNode;\n  className?: string;\n}\n\nfunction useControlled<V>(value: V | undefined, initial: V, onChange?: (value: V) => void) {\n  const [inner, setInner] = React.useState(initial);\n  const set = (next: V) => {\n    setInner(next);\n    onChange?.(next);\n  };\n  return [value === undefined ? inner : value, set] as const;\n}\n\n/**\n * Searchable command menu in a dialog (Ctrl / ⌘ + K) for navigation and quick\n * actions. Keyboard: arrows move, Enter chooses, Esc closes.\n */\nexport function CommandPalette<T extends CommandItem = CommandItem>({\n  items,\n  onSelect,\n  open: openProp,\n  defaultOpen = false,\n  onOpenChange,\n  search: searchProp,\n  defaultSearch = '',\n  onSearchChange,\n  filter,\n  maxResults = 50,\n  hotkey = 'k',\n  keepOpenOnSelect,\n  title = 'Command palette',\n  placeholder = 'Search…',\n  emptyText = 'No results found.',\n  loading,\n  footer,\n  className,\n}: CommandPaletteProps<T>) {\n  const [open, setOpen] = useControlled(openProp, defaultOpen, onOpenChange);\n  const [search, setSearch] = useControlled(searchProp, defaultSearch, onSearchChange);\n  const [active, setActive] = React.useState(0);\n  const container = usePortalContainer();\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const listRef = React.useRef<HTMLDivElement>(null);\n  const baseId = React.useId();\n\n  // Latest state for the global shortcut without re-subscribing on every render.\n  const toggle = React.useRef(() => {});\n  React.useEffect(() => {\n    toggle.current = () => setOpen(!open);\n  });\n  React.useEffect(() => {\n    if (!hotkey) return;\n    const onKeyDown = (event: KeyboardEvent) => {\n      if ((event.metaKey || event.ctrlKey) && !event.altKey && event.key.toLowerCase() === hotkey.toLowerCase()) {\n        event.preventDefault();\n        toggle.current();\n      }\n    };\n    window.addEventListener('keydown', onKeyDown);\n    return () => window.removeEventListener('keydown', onKeyDown);\n  }, [hotkey]);\n\n  // Grouped, in first-seen group order; `results` is the flat keyboard order.\n  const matched =\n    filter === false\n      ? items\n      : items.filter((item) =>\n          filter ? filter(item, search) : matchesQuery(`${item.label} ${item.keywords ?? ''} ${item.group ?? ''}`, search),\n        );\n  const byGroup = new Map<string, T[]>();\n  for (const item of matched.slice(0, maxResults)) {\n    const key = item.group ?? '';\n    byGroup.set(key, [...(byGroup.get(key) ?? []), item]);\n  }\n  const groups = [...byGroup].map(([heading, groupItems]) => ({ heading, items: groupItems }));\n  const results = groups.flatMap((group) => group.items);\n\n  const activeIndex = Math.min(active, Math.max(0, results.length - 1));\n  const optionId = (index: number) => `${baseId}-option-${index}`;\n\n  const choose = (item: T | undefined) => {\n    if (!item || item.disabled) return;\n    item.onSelect?.();\n    onSelect?.(item);\n    if (!keepOpenOnSelect) setOpen(false);\n  };\n\n  const move = (step: 1 | -1) => {\n    if (!results.length) return;\n    let next = activeIndex;\n    for (let i = 0; i < results.length; i++) {\n      next = (next + step + results.length) % results.length;\n      if (!results[next].disabled) break;\n    }\n    setActive(next);\n    listRef.current?.querySelector(`[data-index=\"${next}\"]`)?.scrollIntoView({ block: 'nearest' });\n  };\n\n  const onKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n      event.preventDefault();\n      move(event.key === 'ArrowDown' ? 1 : -1);\n    } else if (event.key === 'Enter' && !event.nativeEvent.isComposing) {\n      event.preventDefault();\n      choose(results[activeIndex]);\n    }\n  };\n\n  let index = -1;\n  return (\n    <BaseDialog.Root\n      open={open}\n      onOpenChange={(next) => setOpen(next)}\n      onOpenChangeComplete={(next) => {\n        // Start fresh next time, once the closing animation is done.\n        if (!next) {\n          setActive(0);\n          if (search) setSearch('');\n        }\n      }}\n    >\n      <BaseDialog.Portal container={container}>\n        <BaseDialog.Backdrop className=\"oui-dialog__backdrop\" />\n        <BaseDialog.Popup className={cx('oui-command', className)} aria-label={title} initialFocus={inputRef}>\n          <div className=\"oui-command__search\">\n            <SearchIcon />\n            <input\n              ref={inputRef}\n              className=\"oui-command__input\"\n              role=\"combobox\"\n              aria-expanded\n              aria-autocomplete=\"list\"\n              aria-controls={`${baseId}-list`}\n              aria-activedescendant={results.length ? optionId(activeIndex) : undefined}\n              aria-label={placeholder}\n              placeholder={placeholder}\n              autoComplete=\"off\"\n              spellCheck={false}\n              value={search}\n              onChange={(event) => {\n                setSearch(event.target.value);\n                setActive(0);\n              }}\n              onKeyDown={onKeyDown}\n            />\n            {loading && <Spinner size=\"1rem\" />}\n          </div>\n          <div ref={listRef} id={`${baseId}-list`} role=\"listbox\" aria-label={title} className=\"oui-command__list\">\n            {groups.map((group, groupIndex) => (\n              <div\n                key={group.heading}\n                role=\"group\"\n                aria-labelledby={group.heading ? `${baseId}-group-${groupIndex}` : undefined}\n                className=\"oui-command__group\"\n              >\n                {group.heading && (\n                  <div id={`${baseId}-group-${groupIndex}`} className=\"oui-command__group-label\">\n                    {group.heading}\n                  </div>\n                )}\n                {group.items.map((item) => {\n                  index += 1;\n                  const itemIndex = index;\n                  return (\n                    <div\n                      key={item.id}\n                      id={optionId(itemIndex)}\n                      role=\"option\"\n                      className=\"oui-command__item\"\n                      aria-selected={itemIndex === activeIndex}\n                      aria-disabled={item.disabled || undefined}\n                      data-index={itemIndex}\n                      data-highlighted={itemIndex === activeIndex ? '' : undefined}\n                      data-disabled={item.disabled ? '' : undefined}\n                      onPointerMove={() => !item.disabled && itemIndex !== activeIndex && setActive(itemIndex)}\n                      onClick={() => choose(item)}\n                    >\n                      {item.icon && <span className=\"oui-command__item-icon\">{item.icon}</span>}\n                      <span className=\"oui-command__item-text\">\n                        <span className=\"oui-command__item-label\">{item.label}</span>\n                        {item.description && <span className=\"oui-command__item-description\">{item.description}</span>}\n                      </span>\n                      {item.shortcut && <span className=\"oui-command__item-shortcut\">{item.shortcut}</span>}\n                    </div>\n                  );\n                })}\n              </div>\n            ))}\n            {!results.length && <div className=\"oui-command__empty\">{emptyText}</div>}\n          </div>\n          {footer && <div className=\"oui-command__footer\">{footer}</div>}\n        </BaseDialog.Popup>\n      </BaseDialog.Portal>\n    </BaseDialog.Root>\n  );\n}\n"],"mappings":"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"}

package/dist/components/data-table/DataTable.d.ts

@@ -0,0 +1,111 @@
+import * as React from 'react';
+import { type PaginationLabels } from '../pagination/Pagination';
+import { type TableProps } from '../table/Table';
+export interface DataTableColumn<T> {
+    /** Unique key. Also the property read from the row when there is no `accessor`. */
+    id: string;
+    header: React.ReactNode;
+    /** Value used for sorting, searching and the default cell. Defaults to `row[id]`. */
+    accessor?: (row: T) => unknown;
+    /** Custom cell content. */
+    cell?: (row: T) => React.ReactNode;
+    /** Defaults to `true`, or `false` for columns that only define `cell` (actions, icons). */
+    sortable?: boolean;
+    /** Include this column in the built-in search. Same default as `sortable`. */
+    searchable?: boolean;
+    /** Custom ascending comparison. */
+    compare?: (a: T, b: T) => number;
+    align?: 'start' | 'center' | 'end';
+    /** Right-align with tabular figures. */
+    numeric?: boolean;
+    width?: number | string;
+}
+export interface DataTableSort {
+    id: string;
+    direction: 'asc' | 'desc';
+}
+export interface DataTableLabels extends PaginationLabels {
+    search: string;
+    clearSearch: string;
+    selectAll: string;
+    selectRow: (label: string) => string;
+    count: (count: number) => React.ReactNode;
+    selected: (count: number) => React.ReactNode;
+    emptyTitle: React.ReactNode;
+    emptyDescription: React.ReactNode;
+    noMatchTitle: React.ReactNode;
+    noMatchDescription: React.ReactNode;
+    loading: string;
+    errorTitle: React.ReactNode;
+    retry: string;
+}
+export interface DataTableToolbarContext<T> {
+    /** Rows after search and sorting, across all pages. In server mode: the current page. */
+    rows: T[];
+    /** Ids of the selected rows. */
+    selection: string[];
+}
+export interface DataTableProps<T> extends Pick<TableProps, 'density' | 'striped' | 'stickyHeader'> {
+    /** All rows, or in server mode the rows of the current page. */
+    data: T[];
+    columns: DataTableColumn<T>[];
+    /**
+     * `server` renders `data` as it is: search, sorting and pagination are left to
+     * the API, driven by the `search` / `sort` / `page` / `pageSize` callbacks.
+     */
+    mode?: 'client' | 'server';
+    /** Server mode: number of rows across all pages. */
+    total?: number;
+    /** Shows placeholder rows when there is no data yet, and dims the rows during a refetch. */
+    loading?: boolean;
+    /** Error message shown in place of the rows. */
+    error?: React.ReactNode;
+    /** Adds a retry button to the error message. */
+    onRetry?: () => void;
+    /** Stable id per row, needed for selection. Defaults to `row.id`, then the index. */
+    getRowId?: (row: T, index: number) => string;
+    /** Show the search box (default `true`). */
+    searchable?: boolean;
+    search?: string;
+    defaultSearch?: string;
+    onSearchChange?: (search: string) => void;
+    /** Replaces the built-in search, which matches every term against the searchable columns. */
+    filter?: (row: T, search: string) => boolean;
+    sort?: DataTableSort | null;
+    defaultSort?: DataTableSort | null;
+    onSortChange?: (sort: DataTableSort | null) => void;
+    /** Paginate rows (default `true`). */
+    paginated?: boolean;
+    page?: number;
+    onPageChange?: (page: number) => void;
+    pageSize?: number;
+    defaultPageSize?: number;
+    onPageSizeChange?: (pageSize: number) => void;
+    pageSizeOptions?: number[];
+    /**
+     * Selected row ids. Passing `onSelectionChange` adds the checkbox column.
+     * Select-all covers every filtered row, or in server mode the current page.
+     */
+    selection?: string[];
+    onSelectionChange?: (selection: string[]) => void;
+    /** Makes rows clickable and keyboard-activatable (Enter). */
+    onRowClick?: (row: T) => void;
+    /** Accessible name of a row, used by row selection and clickable rows. */
+    rowLabel?: (row: T) => string;
+    /** Extra toolbar content (filters, export…). A function receives the processed rows. */
+    toolbar?: React.ReactNode | ((context: DataTableToolbarContext<T>) => React.ReactNode);
+    /** Replaces the default empty state. */
+    empty?: React.ReactNode;
+    /** Override texts for localisation. */
+    labels?: Partial<DataTableLabels>;
+    className?: string;
+    tableProps?: Omit<TableProps, 'children'>;
+}
+/**
+ * Table with built-in search, sorting, pagination and row selection. Every
+ * piece of state works uncontrolled or controlled (`search` / `sort` / `page` /
+ * `selection`), e.g. to persist it in the URL. With `mode="server"` the same
+ * state drives an API instead: pass the fetched page as `data`, plus `total`
+ * and `loading`. For custom layouts compose `Table` and `Pagination`.
+ */
+export declare function DataTable<T>({ data, columns, mode, total, loading, error, onRetry, getRowId, searchable, search: searchProp, defaultSearch, onSearchChange, filter, sort: sortProp, defaultSort, onSortChange, paginated, page: pageProp, onPageChange, pageSize: pageSizeProp, defaultPageSize, onPageSizeChange, pageSizeOptions, selection, onSelectionChange, onRowClick, rowLabel, toolbar, empty, labels, density, striped, stickyHeader, className, tableProps, }: DataTableProps<T>): React.JSX.Element;