@psnext/design-system 2.4.0 → 2.6.0

package/dist/primitives/CircularProgress/index.js

@@ -0,0 +1,105 @@
+import { t as cn } from "../../cn.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/primitives/CircularProgress/CircularProgress.tsx
+const indicatorVariants = {
+	default: "text-primary-invert-bg",
+	brand: "text-brand-500-primary",
+	success: "text-success-txt",
+	warning: "text-warning-txt",
+	info: "text-info-txt",
+	destructive: "text-danger-txt",
+	analyzing: "text-[var(--progress-analyzing)]",
+	ingesting: "text-[var(--progress-ingesting)]"
+};
+const trackVariants = {
+	default: "text-primary-border",
+	brand: "text-brand-500-primary/20",
+	success: "text-success-txt/20",
+	warning: "text-warning-txt/20",
+	info: "text-info-txt/20",
+	destructive: "text-danger-txt/20",
+	analyzing: "text-primary-invert-bg/20",
+	ingesting: "text-primary-invert-bg/20"
+};
+function clamp(value, min, max) {
+	return Math.min(max, Math.max(min, value));
+}
+/** Circular progress indicator supporting determinate and indeterminate states. */
+function CircularProgress({ className, value, min = 0, max = 100, size = 48, strokeWidth = 4, variant = "default", trackVariant, progressColor, trackColor, label, showValueLabel = false, indeterminateLabel = "Loading", style, "aria-label": ariaLabelProp, "aria-valuetext": ariaValueTextProp, ...props }) {
+	const normalizedMax = max > min ? max : min + 100;
+	const boundedValue = value == null ? void 0 : clamp(value, min, normalizedMax);
+	const indeterminate = boundedValue == null;
+	const percent = indeterminate ? void 0 : (boundedValue - min) / (normalizedMax - min) * 100;
+	const roundedPercent = percent == null ? void 0 : Math.round(percent);
+	const normalizedSize = Math.max(size, 12);
+	const normalizedStrokeWidth = clamp(strokeWidth, 1, normalizedSize / 2);
+	const radius = (normalizedSize - normalizedStrokeWidth) / 2;
+	const circumference = 2 * Math.PI * radius;
+	const centerLabel = label ?? (showValueLabel && roundedPercent != null ? `${roundedPercent}%` : null);
+	const ariaValueText = ariaValueTextProp ?? (indeterminate ? indeterminateLabel : `${roundedPercent}% complete`);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "circular-progress",
+		"data-state": indeterminate ? "indeterminate" : "determinate",
+		role: "progressbar",
+		"aria-label": ariaLabelProp ?? "Progress",
+		"aria-valuemin": min,
+		"aria-valuemax": normalizedMax,
+		"aria-valuenow": indeterminate ? void 0 : boundedValue,
+		"aria-valuetext": ariaValueText,
+		className: cn("relative inline-flex shrink-0 items-center justify-center rounded-full text-primary-txt outline-none focus-visible:ring-3 focus-visible:ring-focus", className),
+		style: {
+			width: normalizedSize,
+			height: normalizedSize,
+			...style
+		},
+		...props,
+		children: [
+			/* @__PURE__ */ jsxs("svg", {
+				"data-slot": "circular-progress-svg",
+				width: normalizedSize,
+				height: normalizedSize,
+				viewBox: `0 0 ${normalizedSize} ${normalizedSize}`,
+				className: cn("size-full -rotate-90", indeterminate && "motion-safe:animate-spin"),
+				children: [/* @__PURE__ */ jsx("circle", {
+					"data-slot": "circular-progress-track",
+					cx: normalizedSize / 2,
+					cy: normalizedSize / 2,
+					r: radius,
+					fill: "none",
+					strokeWidth: normalizedStrokeWidth,
+					className: cn("stroke-current", trackColor ? void 0 : trackVariants[trackVariant ?? variant]),
+					style: trackColor ? { stroke: trackColor } : void 0
+				}), /* @__PURE__ */ jsx("circle", {
+					"data-slot": "circular-progress-indicator",
+					cx: normalizedSize / 2,
+					cy: normalizedSize / 2,
+					r: radius,
+					fill: "none",
+					strokeWidth: normalizedStrokeWidth,
+					strokeLinecap: "round",
+					className: cn("stroke-current motion-reduce:transition-none", progressColor ? void 0 : indicatorVariants[variant], indeterminate ? void 0 : "transition-[stroke-dashoffset] duration-500 ease-out"),
+					style: {
+						strokeDasharray: indeterminate ? `${circumference * .35} ${circumference}` : `${circumference}`,
+						strokeDashoffset: indeterminate ? `${circumference * .1}` : `${circumference - (percent ?? 0) / 100 * circumference}`,
+						...progressColor ? { stroke: progressColor } : {}
+					}
+				})]
+			}),
+			centerLabel ? /* @__PURE__ */ jsx("span", {
+				"data-slot": "circular-progress-label",
+				"aria-hidden": "true",
+				className: "pointer-events-none absolute inset-0 flex items-center justify-center font-medium text-[11px] leading-none",
+				children: centerLabel
+			}) : null,
+			/* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				"aria-live": "polite",
+				children: indeterminate ? indeterminateLabel : `${roundedPercent}% complete`
+			})
+		]
+	});
+}
+//#endregion
+export { CircularProgress };
+
+//# sourceMappingURL=index.js.map

package/dist/primitives/CircularProgress/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/CircularProgress/CircularProgress.tsx"],"sourcesContent":["import type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst indicatorVariants = {\n  default: \"text-primary-invert-bg\",\n  brand: \"text-brand-500-primary\",\n  success: \"text-success-txt\",\n  warning: \"text-warning-txt\",\n  info: \"text-info-txt\",\n  destructive: \"text-danger-txt\",\n  analyzing: \"text-[var(--progress-analyzing)]\",\n  ingesting: \"text-[var(--progress-ingesting)]\",\n} as const;\n\nconst trackVariants = {\n  default: \"text-primary-border\",\n  brand: \"text-brand-500-primary/20\",\n  success: \"text-success-txt/20\",\n  warning: \"text-warning-txt/20\",\n  info: \"text-info-txt/20\",\n  destructive: \"text-danger-txt/20\",\n  analyzing: \"text-primary-invert-bg/20\",\n  ingesting: \"text-primary-invert-bg/20\",\n} as const;\n\ntype CircularProgressVariant = keyof typeof indicatorVariants;\n\ntype CircularProgressProps = Omit<React.ComponentProps<\"div\">, \"children\"> & {\n  /** Determinate value. Omit for indeterminate/loading state. */\n  value?: number;\n  /** Lower bound used for ARIA/value normalization. */\n  min?: number;\n  /** Upper bound used for ARIA/value normalization. */\n  max?: number;\n  /** Rendered diameter in px. */\n  size?: number;\n  /** Stroke thickness in px. */\n  strokeWidth?: number;\n  /** Semantic colour variant for the progress stroke. */\n  variant?: CircularProgressVariant;\n  /** Semantic colour variant for the track stroke. Defaults to `variant`. */\n  trackVariant?: CircularProgressVariant;\n  /** Explicit progress stroke colour (CSS colour value). Overrides `variant`. */\n  progressColor?: string;\n  /** Explicit track stroke colour (CSS colour value). Overrides `trackVariant`. */\n  trackColor?: string;\n  /** Optional centered label content. */\n  label?: React.ReactNode;\n  /** Render computed percentage text in the center when determinate. */\n  showValueLabel?: boolean;\n  /** Accessible text for indeterminate/loading state. */\n  indeterminateLabel?: string;\n};\n\nfunction clamp(value: number, min: number, max: number) {\n  return Math.min(max, Math.max(min, value));\n}\n\n/** Circular progress indicator supporting determinate and indeterminate states. */\nfunction CircularProgress({\n  className,\n  value,\n  min = 0,\n  max = 100,\n  size = 48,\n  strokeWidth = 4,\n  variant = \"default\",\n  trackVariant,\n  progressColor,\n  trackColor,\n  label,\n  showValueLabel = false,\n  indeterminateLabel = \"Loading\",\n  style,\n  \"aria-label\": ariaLabelProp,\n  \"aria-valuetext\": ariaValueTextProp,\n  ...props\n}: CircularProgressProps) {\n  const normalizedMax = max > min ? max : min + 100;\n  const boundedValue = value == null ? undefined : clamp(value, min, normalizedMax);\n  const indeterminate = boundedValue == null;\n\n  const percent = indeterminate ? undefined : ((boundedValue - min) / (normalizedMax - min)) * 100;\n  const roundedPercent = percent == null ? undefined : Math.round(percent);\n\n  const normalizedSize = Math.max(size, 12);\n  const normalizedStrokeWidth = clamp(strokeWidth, 1, normalizedSize / 2);\n  const radius = (normalizedSize - normalizedStrokeWidth) / 2;\n  const circumference = 2 * Math.PI * radius;\n\n  const centerLabel =\n    label ?? (showValueLabel && roundedPercent != null ? `${roundedPercent}%` : null);\n  const ariaValueText =\n    ariaValueTextProp ?? (indeterminate ? indeterminateLabel : `${roundedPercent}% complete`);\n\n  return (\n    <div\n      data-slot=\"circular-progress\"\n      data-state={indeterminate ? \"indeterminate\" : \"determinate\"}\n      role=\"progressbar\"\n      aria-label={ariaLabelProp ?? \"Progress\"}\n      aria-valuemin={min}\n      aria-valuemax={normalizedMax}\n      aria-valuenow={indeterminate ? undefined : boundedValue}\n      aria-valuetext={ariaValueText}\n      className={cn(\n        \"relative inline-flex shrink-0 items-center justify-center rounded-full text-primary-txt outline-none focus-visible:ring-3 focus-visible:ring-focus\",\n        className,\n      )}\n      style={{ width: normalizedSize, height: normalizedSize, ...style }}\n      {...props}\n    >\n      <svg\n        data-slot=\"circular-progress-svg\"\n        width={normalizedSize}\n        height={normalizedSize}\n        viewBox={`0 0 ${normalizedSize} ${normalizedSize}`}\n        className={cn(\"size-full -rotate-90\", indeterminate && \"motion-safe:animate-spin\")}\n      >\n        <circle\n          data-slot=\"circular-progress-track\"\n          cx={normalizedSize / 2}\n          cy={normalizedSize / 2}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={normalizedStrokeWidth}\n          className={cn(\n            \"stroke-current\",\n            trackColor ? undefined : trackVariants[trackVariant ?? variant],\n          )}\n          style={trackColor ? { stroke: trackColor } : undefined}\n        />\n        <circle\n          data-slot=\"circular-progress-indicator\"\n          cx={normalizedSize / 2}\n          cy={normalizedSize / 2}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={normalizedStrokeWidth}\n          strokeLinecap=\"round\"\n          className={cn(\n            \"stroke-current motion-reduce:transition-none\",\n            progressColor ? undefined : indicatorVariants[variant],\n            indeterminate ? undefined : \"transition-[stroke-dashoffset] duration-500 ease-out\",\n          )}\n          style={{\n            strokeDasharray: indeterminate\n              ? `${circumference * 0.35} ${circumference}`\n              : `${circumference}`,\n            strokeDashoffset: indeterminate\n              ? `${circumference * 0.1}`\n              : `${circumference - ((percent ?? 0) / 100) * circumference}`,\n            ...(progressColor ? { stroke: progressColor } : {}),\n          }}\n        />\n      </svg>\n\n      {centerLabel ? (\n        <span\n          data-slot=\"circular-progress-label\"\n          aria-hidden=\"true\"\n          className=\"pointer-events-none absolute inset-0 flex items-center justify-center font-medium text-[11px] leading-none\"\n        >\n          {centerLabel}\n        </span>\n      ) : null}\n\n      <span className=\"sr-only\" aria-live=\"polite\">\n        {indeterminate ? indeterminateLabel : `${roundedPercent}% complete`}\n      </span>\n    </div>\n  );\n}\n\nexport { CircularProgress, type CircularProgressProps, type CircularProgressVariant };\n"],"mappings":";;;AAIA,MAAM,oBAAoB;CACxB,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CACb,WAAW;CACX,WAAW;AACb;AAEA,MAAM,gBAAgB;CACpB,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CACb,WAAW;CACX,WAAW;AACb;AA+BA,SAAS,MAAM,OAAe,KAAa,KAAa;CACtD,OAAO,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,KAAK,CAAC;AAC3C;;AAGA,SAAS,iBAAiB,EACxB,WACA,OACA,MAAM,GACN,MAAM,KACN,OAAO,IACP,cAAc,GACd,UAAU,WACV,cACA,eACA,YACA,OACA,iBAAiB,OACjB,qBAAqB,WACrB,OACA,cAAc,eACd,kBAAkB,mBAClB,GAAG,SACqB;CACxB,MAAM,gBAAgB,MAAM,MAAM,MAAM,MAAM;CAC9C,MAAM,eAAe,SAAS,OAAO,KAAA,IAAY,MAAM,OAAO,KAAK,aAAa;CAChF,MAAM,gBAAgB,gBAAgB;CAEtC,MAAM,UAAU,gBAAgB,KAAA,KAAc,eAAe,QAAQ,gBAAgB,OAAQ;CAC7F,MAAM,iBAAiB,WAAW,OAAO,KAAA,IAAY,KAAK,MAAM,OAAO;CAEvE,MAAM,iBAAiB,KAAK,IAAI,MAAM,EAAE;CACxC,MAAM,wBAAwB,MAAM,aAAa,GAAG,iBAAiB,CAAC;CACtE,MAAM,UAAU,iBAAiB,yBAAyB;CAC1D,MAAM,gBAAgB,IAAI,KAAK,KAAK;CAEpC,MAAM,cACJ,UAAU,kBAAkB,kBAAkB,OAAO,GAAG,eAAe,KAAK;CAC9E,MAAM,gBACJ,sBAAsB,gBAAgB,qBAAqB,GAAG,eAAe;CAE/E,OACE,qBAAC,OAAD;EACE,aAAU;EACV,cAAY,gBAAgB,kBAAkB;EAC9C,MAAK;EACL,cAAY,iBAAiB;EAC7B,iBAAe;EACf,iBAAe;EACf,iBAAe,gBAAgB,KAAA,IAAY;EAC3C,kBAAgB;EAChB,WAAW,GACT,sJACA,SACF;EACA,OAAO;GAAE,OAAO;GAAgB,QAAQ;GAAgB,GAAG;EAAM;EACjE,GAAI;YAdN;GAgBE,qBAAC,OAAD;IACE,aAAU;IACV,OAAO;IACP,QAAQ;IACR,SAAS,OAAO,eAAe,GAAG;IAClC,WAAW,GAAG,wBAAwB,iBAAiB,0BAA0B;cALnF,CAOE,oBAAC,UAAD;KACE,aAAU;KACV,IAAI,iBAAiB;KACrB,IAAI,iBAAiB;KACrB,GAAG;KACH,MAAK;KACL,aAAa;KACb,WAAW,GACT,kBACA,aAAa,KAAA,IAAY,cAAc,gBAAgB,QACzD;KACA,OAAO,aAAa,EAAE,QAAQ,WAAW,IAAI,KAAA;IAC9C,CAAA,GACD,oBAAC,UAAD;KACE,aAAU;KACV,IAAI,iBAAiB;KACrB,IAAI,iBAAiB;KACrB,GAAG;KACH,MAAK;KACL,aAAa;KACb,eAAc;KACd,WAAW,GACT,gDACA,gBAAgB,KAAA,IAAY,kBAAkB,UAC9C,gBAAgB,KAAA,IAAY,sDAC9B;KACA,OAAO;MACL,iBAAiB,gBACb,GAAG,gBAAgB,IAAK,GAAG,kBAC3B,GAAG;MACP,kBAAkB,gBACd,GAAG,gBAAgB,OACnB,GAAG,iBAAkB,WAAW,KAAK,MAAO;MAChD,GAAI,gBAAgB,EAAE,QAAQ,cAAc,IAAI,CAAC;KACnD;IACD,CAAA,CACE;;GAEJ,cACC,oBAAC,QAAD;IACE,aAAU;IACV,eAAY;IACZ,WAAU;cAET;GACG,CAAA,IACJ;GAEJ,oBAAC,QAAD;IAAM,WAAU;IAAU,aAAU;cACjC,gBAAgB,qBAAqB,GAAG,eAAe;GACpD,CAAA;EACH;;AAET"}

package/dist/primitives/Collapsible/index.d.cts

@@ -1,2 +1,2 @@
-import { n as CollapsibleContent, r as CollapsibleTrigger, t as Collapsible } from "../../index17.cjs";
+import { n as CollapsibleContent, r as CollapsibleTrigger, t as Collapsible } from "../../index18.cjs";
 export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/primitives/Collapsible/index.d.ts

@@ -1,2 +1,2 @@
-import { n as CollapsibleContent, r as CollapsibleTrigger, t as Collapsible } from "../../index17.js";
+import { n as CollapsibleContent, r as CollapsibleTrigger, t as Collapsible } from "../../index18.js";
 export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/primitives/Combobox/index.cjs

@@ -0,0 +1,210 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_chunk = require("../../chunk.cjs");
+const require_cn = require("../../cn.cjs");
+const require_Icon = require("../../Icon.cjs");
+const require_primitives_Command_index = require("../Command/index.cjs");
+const require_primitives_Input_index = require("../Input/index.cjs");
+const require_primitives_Popover_index = require("../Popover/index.cjs");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let cmdk = require("cmdk");
+//#region src/primitives/Combobox/Combobox.tsx
+const ComboboxContext = react.createContext(null);
+function useComboboxContext(caller) {
+	const ctx = react.useContext(ComboboxContext);
+	if (!ctx) throw new Error(`${caller} must be used within <Combobox>`);
+	return ctx;
+}
+/** Derive a plain-text label from item children (used for search keywords and the trigger display). */
+function textLabel(children) {
+	if (typeof children === "string") return children;
+	if (typeof children === "number") return String(children);
+	if (Array.isArray(children) && children.every((c) => typeof c === "string" || typeof c === "number")) return children.join("");
+}
+/**
+* Searchable single-select dropdown (the shadcn "combobox" recipe): a Popover
+* holding a filterable Command list. Holds the selected value and open state,
+* and closes on selection. Search state resets automatically on close because
+* the content unmounts.
+*/
+function Combobox({ value, defaultValue, onValueChange, open, defaultOpen, onOpenChange, modal, children }) {
+	const [uncontrolledValue, setUncontrolledValue] = react.useState(defaultValue ?? "");
+	const [uncontrolledOpen, setUncontrolledOpen] = react.useState(defaultOpen ?? false);
+	const currentValue = value ?? uncontrolledValue;
+	const currentOpen = open ?? uncontrolledOpen;
+	const setOpen = react.useCallback((next) => {
+		setUncontrolledOpen(next);
+		onOpenChange?.(next);
+	}, [onOpenChange]);
+	const select = react.useCallback((next) => {
+		setUncontrolledValue(next);
+		onValueChange?.(next);
+		setOpen(false);
+	}, [onValueChange, setOpen]);
+	const [labels, setLabels] = react.useState(/* @__PURE__ */ new Map());
+	const registerItem = react.useCallback((itemValue, label) => {
+		setLabels((prev) => prev.get(itemValue) === label ? prev : new Map(prev).set(itemValue, label));
+	}, []);
+	const ctx = react.useMemo(() => ({
+		value: currentValue,
+		select,
+		registerItem,
+		labels
+	}), [
+		currentValue,
+		select,
+		registerItem,
+		labels
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ComboboxContext.Provider, {
+		value: ctx,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Popover_index.Popover, {
+			open: currentOpen,
+			onOpenChange: setOpen,
+			modal,
+			children
+		})
+	});
+}
+const PILL = "flex min-h-8 items-center gap-1 rounded-12 border border-primary-border bg-input-bg px-3 py-1 text-xs leading-4";
+/**
+* Pill-shaped trigger showing the current selection. With no `children`, it
+* renders the selected item's label (or `placeholder` when nothing is
+* selected); pass `children` to fully control the display — e.g. when the
+* selected label comes from data the items haven't mounted with yet.
+*/
+function ComboboxTrigger({ className, label, placeholder, children, ...props }) {
+	const { value, labels } = useComboboxContext("ComboboxTrigger");
+	const display = children ?? (value ? labels.get(value) ?? value : void 0);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_primitives_Popover_index.PopoverTrigger, {
+		"data-slot": "combobox-trigger",
+		className: require_cn.cn(PILL, "text-left transition-colors hover:border-focus/60", className),
+		...props,
+		children: [
+			label && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: "shrink-0 text-muted-txt",
+				children: [label, ":"]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: require_cn.cn("min-w-0 truncate", display != null ? "font-medium" : "text-muted-txt"),
+				children: display ?? placeholder
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Icon.Icon, {
+				as: lucide_react.ChevronDown,
+				className: "ml-1 size-4 shrink-0 text-muted-txt"
+			})
+		]
+	});
+}
+/** The dropdown panel: a Command (filterable list) inside a PopoverContent. */
+function ComboboxContent({ className, align = "start", children, filter, shouldFilter, loop, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Popover_index.PopoverContent, {
+		"data-slot": "combobox-content",
+		align,
+		className: require_cn.cn("w-64 p-0", className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Command_index.Command, {
+			filter,
+			shouldFilter,
+			loop,
+			className: "bg-transparent",
+			children
+		})
+	});
+}
+/** Bordered search field pinned above the list; typing filters the items. */
+function ComboboxInput({ className, wrapperClassName, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-slot": "combobox-input-wrapper",
+		className: require_cn.cn("border-b p-2", wrapperClassName),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Icon.Icon, {
+				as: lucide_react.Search,
+				className: "absolute top-1/2 left-2.5 size-3.5 -translate-y-1/2 text-muted-txt"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(cmdk.Command.Input, {
+				"data-slot": "combobox-input",
+				className: require_cn.cn(require_primitives_Input_index.inputVariants({ size: "sm" }), "pl-8", className),
+				...props
+			})]
+		})
+	});
+}
+/** Scrollable container for the option rows. */
+function ComboboxList({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Command_index.CommandList, {
+		"data-slot": "combobox-list",
+		className: require_cn.cn("max-h-64 py-1", className),
+		...props
+	});
+}
+/** Placeholder row shown when the search matches no items. */
+function ComboboxEmpty({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(cmdk.Command.Empty, {
+		"data-slot": "combobox-empty",
+		className: require_cn.cn("px-3 py-2 text-sm text-muted-txt", className),
+		...props
+	});
+}
+/** A labelled group of related options, with an optional `heading`. */
+function ComboboxGroup({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Command_index.CommandGroup, {
+		"data-slot": "combobox-group",
+		className: require_cn.cn("p-0 [&_[cmdk-group-heading]]:px-3", className),
+		...props
+	});
+}
+/** A thin divider line between option groups. */
+function ComboboxSeparator({ className, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_primitives_Command_index.CommandSeparator, {
+		"data-slot": "combobox-separator",
+		className: require_cn.cn("mx-0", className),
+		...props
+	});
+}
+/**
+* A selectable option. `value` is what the combobox reports on selection;
+* search matches the visible text (or explicit `keywords`), not the `value`.
+*/
+function ComboboxItem({ value, keywords, className, children, onSelect, ...props }) {
+	const ctx = useComboboxContext("ComboboxItem");
+	const isSelected = value === ctx.value;
+	const label = textLabel(children);
+	const { registerItem, select } = ctx;
+	react.useEffect(() => {
+		if (label !== void 0) registerItem(value, label);
+	}, [
+		value,
+		label,
+		registerItem
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_primitives_Command_index.CommandItem, {
+		"data-slot": "combobox-item",
+		value,
+		keywords: keywords ?? (label !== void 0 ? [label] : void 0),
+		onSelect: (selected) => {
+			select(value);
+			onSelect?.(selected);
+		},
+		className: require_cn.cn("cursor-pointer rounded-none px-3 py-2 hover:bg-ghost-hover-bg active:bg-ghost-hover-bg data-[selected=true]:bg-ghost-hover-bg", isSelected && "bg-secondary-bg font-medium data-[selected=true]:bg-secondary-bg", className),
+		...props,
+		children: [children, isSelected && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Icon.Icon, {
+			as: lucide_react.Check,
+			className: "ml-auto size-3.5 shrink-0 text-primary"
+		})]
+	});
+}
+//#endregion
+exports.Combobox = Combobox;
+exports.ComboboxContent = ComboboxContent;
+exports.ComboboxEmpty = ComboboxEmpty;
+exports.ComboboxGroup = ComboboxGroup;
+exports.ComboboxInput = ComboboxInput;
+exports.ComboboxItem = ComboboxItem;
+exports.ComboboxList = ComboboxList;
+exports.ComboboxSeparator = ComboboxSeparator;
+exports.ComboboxTrigger = ComboboxTrigger;
+
+//# sourceMappingURL=index.cjs.map

package/dist/primitives/Combobox/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["React","Popover","PopoverTrigger","cn","Icon","ChevronDown","PopoverContent","Command","Search","CommandPrimitive","inputVariants","CommandList","CommandGroup","CommandSeparator","CommandItem","Check"],"sources":["../../../src/primitives/Combobox/Combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport { Check, ChevronDown, Search } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {\n  Command,\n  CommandGroup,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from \"@/primitives/Command\";\nimport { Icon } from \"@/primitives/Icon\";\nimport { inputVariants } from \"@/primitives/Input\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/primitives/Popover\";\nimport { cn } from \"@/utils\";\n\ninterface ComboboxContextValue {\n  value: string;\n  select: (value: string) => void;\n  registerItem: (value: string, label: string) => void;\n  labels: ReadonlyMap<string, string>;\n}\n\nconst ComboboxContext = React.createContext<ComboboxContextValue | null>(null);\n\nfunction useComboboxContext(caller: string) {\n  const ctx = React.useContext(ComboboxContext);\n  if (!ctx) throw new Error(`${caller} must be used within <Combobox>`);\n  return ctx;\n}\n\n/** Derive a plain-text label from item children (used for search keywords and the trigger display). */\nfunction textLabel(children: React.ReactNode): string | undefined {\n  if (typeof children === \"string\") return children;\n  if (typeof children === \"number\") return String(children);\n  if (\n    Array.isArray(children) &&\n    children.every((c) => typeof c === \"string\" || typeof c === \"number\")\n  )\n    return children.join(\"\");\n  return undefined;\n}\n\ninterface ComboboxProps {\n  /** Controlled selected value. */\n  value?: string;\n  /** Initial selected value (uncontrolled). */\n  defaultValue?: string;\n  /** Called with the item's `value` when a selection is made. */\n  onValueChange?: (value: string) => void;\n  /** Controlled open state of the dropdown. */\n  open?: boolean;\n  /** Initially open (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Called when the dropdown opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /** Forwarded to the underlying Popover root. */\n  modal?: boolean;\n  children?: React.ReactNode;\n}\n\n/**\n * Searchable single-select dropdown (the shadcn \"combobox\" recipe): a Popover\n * holding a filterable Command list. Holds the selected value and open state,\n * and closes on selection. Search state resets automatically on close because\n * the content unmounts.\n */\nfunction Combobox({\n  value,\n  defaultValue,\n  onValueChange,\n  open,\n  defaultOpen,\n  onOpenChange,\n  modal,\n  children,\n}: Readonly<ComboboxProps>) {\n  const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue ?? \"\");\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen ?? false);\n  const currentValue = value ?? uncontrolledValue;\n  const currentOpen = open ?? uncontrolledOpen;\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      setUncontrolledOpen(next);\n      onOpenChange?.(next);\n    },\n    [onOpenChange],\n  );\n\n  const select = React.useCallback(\n    (next: string) => {\n      setUncontrolledValue(next);\n      onValueChange?.(next);\n      setOpen(false);\n    },\n    [onValueChange, setOpen],\n  );\n\n  // value → display-label cache fed by mounted items. Labels are kept after the\n  // content unmounts (popover close) so the trigger can keep showing them.\n  const [labels, setLabels] = React.useState<ReadonlyMap<string, string>>(new Map());\n  const registerItem = React.useCallback((itemValue: string, label: string) => {\n    setLabels((prev) =>\n      prev.get(itemValue) === label ? prev : new Map(prev).set(itemValue, label),\n    );\n  }, []);\n\n  const ctx = React.useMemo(\n    () => ({ value: currentValue, select, registerItem, labels }),\n    [currentValue, select, registerItem, labels],\n  );\n\n  return (\n    <ComboboxContext.Provider value={ctx}>\n      <Popover open={currentOpen} onOpenChange={setOpen} modal={modal}>\n        {children}\n      </Popover>\n    </ComboboxContext.Provider>\n  );\n}\n\n// Pill chrome shared with the Header project picker — keeps the lockup consistent.\nconst PILL =\n  \"flex min-h-8 items-center gap-1 rounded-12 border border-primary-border bg-input-bg px-3 py-1 text-xs leading-4\";\n\n/**\n * Pill-shaped trigger showing the current selection. With no `children`, it\n * renders the selected item's label (or `placeholder` when nothing is\n * selected); pass `children` to fully control the display — e.g. when the\n * selected label comes from data the items haven't mounted with yet.\n */\nfunction ComboboxTrigger({\n  className,\n  /** Muted prefix rendered as `label:` before the value (e.g. `Project:`). */\n  label,\n  /** Muted text shown while nothing is selected. */\n  placeholder,\n  children,\n  ...props\n}: React.ComponentProps<typeof PopoverTrigger> & { label?: string; placeholder?: string }) {\n  const { value, labels } = useComboboxContext(\"ComboboxTrigger\");\n  const display = children ?? (value ? (labels.get(value) ?? value) : undefined);\n\n  return (\n    <PopoverTrigger\n      data-slot=\"combobox-trigger\"\n      className={cn(PILL, \"text-left transition-colors hover:border-focus/60\", className)}\n      {...props}\n    >\n      {label && <span className=\"shrink-0 text-muted-txt\">{label}:</span>}\n      <span className={cn(\"min-w-0 truncate\", display != null ? \"font-medium\" : \"text-muted-txt\")}>\n        {display ?? placeholder}\n      </span>\n      <Icon as={ChevronDown} className=\"ml-1 size-4 shrink-0 text-muted-txt\" />\n    </PopoverTrigger>\n  );\n}\n\n/** The dropdown panel: a Command (filterable list) inside a PopoverContent. */\nfunction ComboboxContent({\n  className,\n  align = \"start\",\n  children,\n  filter,\n  shouldFilter,\n  loop,\n  ...props\n}: React.ComponentProps<typeof PopoverContent> &\n  Pick<React.ComponentProps<typeof CommandPrimitive>, \"filter\" | \"shouldFilter\" | \"loop\">) {\n  return (\n    <PopoverContent\n      data-slot=\"combobox-content\"\n      align={align}\n      className={cn(\"w-64 p-0\", className)}\n      {...props}\n    >\n      <Command filter={filter} shouldFilter={shouldFilter} loop={loop} className=\"bg-transparent\">\n        {children}\n      </Command>\n    </PopoverContent>\n  );\n}\n\n/** Bordered search field pinned above the list; typing filters the items. */\nfunction ComboboxInput({\n  className,\n  /** Extra classes for the padded, bottom-bordered section around the field. */\n  wrapperClassName,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Input> & { wrapperClassName?: string }) {\n  return (\n    <div data-slot=\"combobox-input-wrapper\" className={cn(\"border-b p-2\", wrapperClassName)}>\n      <div className=\"relative\">\n        <Icon\n          as={Search}\n          className=\"absolute top-1/2 left-2.5 size-3.5 -translate-y-1/2 text-muted-txt\"\n        />\n        <CommandPrimitive.Input\n          data-slot=\"combobox-input\"\n          className={cn(inputVariants({ size: \"sm\" }), \"pl-8\", className)}\n          {...props}\n        />\n      </div>\n    </div>\n  );\n}\n\n/** Scrollable container for the option rows. */\nfunction ComboboxList({ className, ...props }: React.ComponentProps<typeof CommandList>) {\n  return (\n    <CommandList data-slot=\"combobox-list\" className={cn(\"max-h-64 py-1\", className)} {...props} />\n  );\n}\n\n/** Placeholder row shown when the search matches no items. */\nfunction ComboboxEmpty({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Empty>) {\n  return (\n    <CommandPrimitive.Empty\n      data-slot=\"combobox-empty\"\n      className={cn(\"px-3 py-2 text-sm text-muted-txt\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A labelled group of related options, with an optional `heading`. */\nfunction ComboboxGroup({ className, ...props }: React.ComponentProps<typeof CommandGroup>) {\n  return (\n    <CommandGroup\n      data-slot=\"combobox-group\"\n      className={cn(\"p-0 [&_[cmdk-group-heading]]:px-3\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A thin divider line between option groups. */\nfunction ComboboxSeparator({ className, ...props }: React.ComponentProps<typeof CommandSeparator>) {\n  return (\n    <CommandSeparator data-slot=\"combobox-separator\" className={cn(\"mx-0\", className)} {...props} />\n  );\n}\n\n/**\n * A selectable option. `value` is what the combobox reports on selection;\n * search matches the visible text (or explicit `keywords`), not the `value`.\n */\nfunction ComboboxItem({\n  /** The value reported by `onValueChange` when this item is chosen. */\n  value,\n  /** Extra strings the search should match; defaults to the item's text content. */\n  keywords,\n  className,\n  children,\n  onSelect,\n  ...props\n}: Omit<React.ComponentProps<typeof CommandItem>, \"value\"> & { value: string }) {\n  const ctx = useComboboxContext(\"ComboboxItem\");\n  const isSelected = value === ctx.value;\n  const label = textLabel(children);\n  const { registerItem, select } = ctx;\n\n  React.useEffect(() => {\n    if (label !== undefined) registerItem(value, label);\n  }, [value, label, registerItem]);\n\n  return (\n    <CommandItem\n      data-slot=\"combobox-item\"\n      value={value}\n      keywords={keywords ?? (label !== undefined ? [label] : undefined)}\n      onSelect={(selected) => {\n        select(value);\n        onSelect?.(selected);\n      }}\n      className={cn(\n        // Header project-picker row: hover/highlight ghost, chosen bg/secondary + medium.\n        \"cursor-pointer rounded-none px-3 py-2 hover:bg-ghost-hover-bg active:bg-ghost-hover-bg data-[selected=true]:bg-ghost-hover-bg\",\n        isSelected && \"bg-secondary-bg font-medium data-[selected=true]:bg-secondary-bg\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {isSelected && <Icon as={Check} className=\"ml-auto size-3.5 shrink-0 text-primary\" />}\n    </CommandItem>\n  );\n}\n\nexport {\n  Combobox,\n  ComboboxTrigger,\n  ComboboxContent,\n  ComboboxInput,\n  ComboboxList,\n  ComboboxEmpty,\n  ComboboxGroup,\n  ComboboxItem,\n  ComboboxSeparator,\n};\n"],"mappings":"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"}

package/dist/primitives/Combobox/index.d.cts

@@ -0,0 +1,2 @@
+import { a as ComboboxInput, c as ComboboxSeparator, i as ComboboxGroup, l as ComboboxTrigger, n as ComboboxContent, o as ComboboxItem, r as ComboboxEmpty, s as ComboboxList, t as Combobox } from "../../index22.cjs";
+export { Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxList, ComboboxSeparator, ComboboxTrigger };

package/dist/primitives/Combobox/index.d.ts

@@ -0,0 +1,2 @@
+import { a as ComboboxInput, c as ComboboxSeparator, i as ComboboxGroup, l as ComboboxTrigger, n as ComboboxContent, o as ComboboxItem, r as ComboboxEmpty, s as ComboboxList, t as Combobox } from "../../index22.js";
+export { Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxList, ComboboxSeparator, ComboboxTrigger };

package/dist/primitives/Combobox/index.js

@@ -0,0 +1,199 @@
+import { t as cn } from "../../cn.js";
+import { t as Icon } from "../../Icon.js";
+import { Command as Command$1, CommandGroup, CommandItem, CommandList, CommandSeparator } from "../Command/index.js";
+import { inputVariants } from "../Input/index.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../Popover/index.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check, ChevronDown, Search } from "lucide-react";
+import { Command } from "cmdk";
+//#region src/primitives/Combobox/Combobox.tsx
+const ComboboxContext = React.createContext(null);
+function useComboboxContext(caller) {
+	const ctx = React.useContext(ComboboxContext);
+	if (!ctx) throw new Error(`${caller} must be used within <Combobox>`);
+	return ctx;
+}
+/** Derive a plain-text label from item children (used for search keywords and the trigger display). */
+function textLabel(children) {
+	if (typeof children === "string") return children;
+	if (typeof children === "number") return String(children);
+	if (Array.isArray(children) && children.every((c) => typeof c === "string" || typeof c === "number")) return children.join("");
+}
+/**
+* Searchable single-select dropdown (the shadcn "combobox" recipe): a Popover
+* holding a filterable Command list. Holds the selected value and open state,
+* and closes on selection. Search state resets automatically on close because
+* the content unmounts.
+*/
+function Combobox({ value, defaultValue, onValueChange, open, defaultOpen, onOpenChange, modal, children }) {
+	const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue ?? "");
+	const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen ?? false);
+	const currentValue = value ?? uncontrolledValue;
+	const currentOpen = open ?? uncontrolledOpen;
+	const setOpen = React.useCallback((next) => {
+		setUncontrolledOpen(next);
+		onOpenChange?.(next);
+	}, [onOpenChange]);
+	const select = React.useCallback((next) => {
+		setUncontrolledValue(next);
+		onValueChange?.(next);
+		setOpen(false);
+	}, [onValueChange, setOpen]);
+	const [labels, setLabels] = React.useState(/* @__PURE__ */ new Map());
+	const registerItem = React.useCallback((itemValue, label) => {
+		setLabels((prev) => prev.get(itemValue) === label ? prev : new Map(prev).set(itemValue, label));
+	}, []);
+	const ctx = React.useMemo(() => ({
+		value: currentValue,
+		select,
+		registerItem,
+		labels
+	}), [
+		currentValue,
+		select,
+		registerItem,
+		labels
+	]);
+	return /* @__PURE__ */ jsx(ComboboxContext.Provider, {
+		value: ctx,
+		children: /* @__PURE__ */ jsx(Popover, {
+			open: currentOpen,
+			onOpenChange: setOpen,
+			modal,
+			children
+		})
+	});
+}
+const PILL = "flex min-h-8 items-center gap-1 rounded-12 border border-primary-border bg-input-bg px-3 py-1 text-xs leading-4";
+/**
+* Pill-shaped trigger showing the current selection. With no `children`, it
+* renders the selected item's label (or `placeholder` when nothing is
+* selected); pass `children` to fully control the display — e.g. when the
+* selected label comes from data the items haven't mounted with yet.
+*/
+function ComboboxTrigger({ className, label, placeholder, children, ...props }) {
+	const { value, labels } = useComboboxContext("ComboboxTrigger");
+	const display = children ?? (value ? labels.get(value) ?? value : void 0);
+	return /* @__PURE__ */ jsxs(PopoverTrigger, {
+		"data-slot": "combobox-trigger",
+		className: cn(PILL, "text-left transition-colors hover:border-focus/60", className),
+		...props,
+		children: [
+			label && /* @__PURE__ */ jsxs("span", {
+				className: "shrink-0 text-muted-txt",
+				children: [label, ":"]
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: cn("min-w-0 truncate", display != null ? "font-medium" : "text-muted-txt"),
+				children: display ?? placeholder
+			}),
+			/* @__PURE__ */ jsx(Icon, {
+				as: ChevronDown,
+				className: "ml-1 size-4 shrink-0 text-muted-txt"
+			})
+		]
+	});
+}
+/** The dropdown panel: a Command (filterable list) inside a PopoverContent. */
+function ComboboxContent({ className, align = "start", children, filter, shouldFilter, loop, ...props }) {
+	return /* @__PURE__ */ jsx(PopoverContent, {
+		"data-slot": "combobox-content",
+		align,
+		className: cn("w-64 p-0", className),
+		...props,
+		children: /* @__PURE__ */ jsx(Command$1, {
+			filter,
+			shouldFilter,
+			loop,
+			className: "bg-transparent",
+			children
+		})
+	});
+}
+/** Bordered search field pinned above the list; typing filters the items. */
+function ComboboxInput({ className, wrapperClassName, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "combobox-input-wrapper",
+		className: cn("border-b p-2", wrapperClassName),
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ jsx(Icon, {
+				as: Search,
+				className: "absolute top-1/2 left-2.5 size-3.5 -translate-y-1/2 text-muted-txt"
+			}), /* @__PURE__ */ jsx(Command.Input, {
+				"data-slot": "combobox-input",
+				className: cn(inputVariants({ size: "sm" }), "pl-8", className),
+				...props
+			})]
+		})
+	});
+}
+/** Scrollable container for the option rows. */
+function ComboboxList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(CommandList, {
+		"data-slot": "combobox-list",
+		className: cn("max-h-64 py-1", className),
+		...props
+	});
+}
+/** Placeholder row shown when the search matches no items. */
+function ComboboxEmpty({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command.Empty, {
+		"data-slot": "combobox-empty",
+		className: cn("px-3 py-2 text-sm text-muted-txt", className),
+		...props
+	});
+}
+/** A labelled group of related options, with an optional `heading`. */
+function ComboboxGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(CommandGroup, {
+		"data-slot": "combobox-group",
+		className: cn("p-0 [&_[cmdk-group-heading]]:px-3", className),
+		...props
+	});
+}
+/** A thin divider line between option groups. */
+function ComboboxSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(CommandSeparator, {
+		"data-slot": "combobox-separator",
+		className: cn("mx-0", className),
+		...props
+	});
+}
+/**
+* A selectable option. `value` is what the combobox reports on selection;
+* search matches the visible text (or explicit `keywords`), not the `value`.
+*/
+function ComboboxItem({ value, keywords, className, children, onSelect, ...props }) {
+	const ctx = useComboboxContext("ComboboxItem");
+	const isSelected = value === ctx.value;
+	const label = textLabel(children);
+	const { registerItem, select } = ctx;
+	React.useEffect(() => {
+		if (label !== void 0) registerItem(value, label);
+	}, [
+		value,
+		label,
+		registerItem
+	]);
+	return /* @__PURE__ */ jsxs(CommandItem, {
+		"data-slot": "combobox-item",
+		value,
+		keywords: keywords ?? (label !== void 0 ? [label] : void 0),
+		onSelect: (selected) => {
+			select(value);
+			onSelect?.(selected);
+		},
+		className: cn("cursor-pointer rounded-none px-3 py-2 hover:bg-ghost-hover-bg active:bg-ghost-hover-bg data-[selected=true]:bg-ghost-hover-bg", isSelected && "bg-secondary-bg font-medium data-[selected=true]:bg-secondary-bg", className),
+		...props,
+		children: [children, isSelected && /* @__PURE__ */ jsx(Icon, {
+			as: Check,
+			className: "ml-auto size-3.5 shrink-0 text-primary"
+		})]
+	});
+}
+//#endregion
+export { Combobox, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxList, ComboboxSeparator, ComboboxTrigger };
+
+//# sourceMappingURL=index.js.map

package/dist/primitives/Combobox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Command","CommandPrimitive"],"sources":["../../../src/primitives/Combobox/Combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport { Check, ChevronDown, Search } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {\n  Command,\n  CommandGroup,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from \"@/primitives/Command\";\nimport { Icon } from \"@/primitives/Icon\";\nimport { inputVariants } from \"@/primitives/Input\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/primitives/Popover\";\nimport { cn } from \"@/utils\";\n\ninterface ComboboxContextValue {\n  value: string;\n  select: (value: string) => void;\n  registerItem: (value: string, label: string) => void;\n  labels: ReadonlyMap<string, string>;\n}\n\nconst ComboboxContext = React.createContext<ComboboxContextValue | null>(null);\n\nfunction useComboboxContext(caller: string) {\n  const ctx = React.useContext(ComboboxContext);\n  if (!ctx) throw new Error(`${caller} must be used within <Combobox>`);\n  return ctx;\n}\n\n/** Derive a plain-text label from item children (used for search keywords and the trigger display). */\nfunction textLabel(children: React.ReactNode): string | undefined {\n  if (typeof children === \"string\") return children;\n  if (typeof children === \"number\") return String(children);\n  if (\n    Array.isArray(children) &&\n    children.every((c) => typeof c === \"string\" || typeof c === \"number\")\n  )\n    return children.join(\"\");\n  return undefined;\n}\n\ninterface ComboboxProps {\n  /** Controlled selected value. */\n  value?: string;\n  /** Initial selected value (uncontrolled). */\n  defaultValue?: string;\n  /** Called with the item's `value` when a selection is made. */\n  onValueChange?: (value: string) => void;\n  /** Controlled open state of the dropdown. */\n  open?: boolean;\n  /** Initially open (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Called when the dropdown opens or closes. */\n  onOpenChange?: (open: boolean) => void;\n  /** Forwarded to the underlying Popover root. */\n  modal?: boolean;\n  children?: React.ReactNode;\n}\n\n/**\n * Searchable single-select dropdown (the shadcn \"combobox\" recipe): a Popover\n * holding a filterable Command list. Holds the selected value and open state,\n * and closes on selection. Search state resets automatically on close because\n * the content unmounts.\n */\nfunction Combobox({\n  value,\n  defaultValue,\n  onValueChange,\n  open,\n  defaultOpen,\n  onOpenChange,\n  modal,\n  children,\n}: Readonly<ComboboxProps>) {\n  const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue ?? \"\");\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen ?? false);\n  const currentValue = value ?? uncontrolledValue;\n  const currentOpen = open ?? uncontrolledOpen;\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      setUncontrolledOpen(next);\n      onOpenChange?.(next);\n    },\n    [onOpenChange],\n  );\n\n  const select = React.useCallback(\n    (next: string) => {\n      setUncontrolledValue(next);\n      onValueChange?.(next);\n      setOpen(false);\n    },\n    [onValueChange, setOpen],\n  );\n\n  // value → display-label cache fed by mounted items. Labels are kept after the\n  // content unmounts (popover close) so the trigger can keep showing them.\n  const [labels, setLabels] = React.useState<ReadonlyMap<string, string>>(new Map());\n  const registerItem = React.useCallback((itemValue: string, label: string) => {\n    setLabels((prev) =>\n      prev.get(itemValue) === label ? prev : new Map(prev).set(itemValue, label),\n    );\n  }, []);\n\n  const ctx = React.useMemo(\n    () => ({ value: currentValue, select, registerItem, labels }),\n    [currentValue, select, registerItem, labels],\n  );\n\n  return (\n    <ComboboxContext.Provider value={ctx}>\n      <Popover open={currentOpen} onOpenChange={setOpen} modal={modal}>\n        {children}\n      </Popover>\n    </ComboboxContext.Provider>\n  );\n}\n\n// Pill chrome shared with the Header project picker — keeps the lockup consistent.\nconst PILL =\n  \"flex min-h-8 items-center gap-1 rounded-12 border border-primary-border bg-input-bg px-3 py-1 text-xs leading-4\";\n\n/**\n * Pill-shaped trigger showing the current selection. With no `children`, it\n * renders the selected item's label (or `placeholder` when nothing is\n * selected); pass `children` to fully control the display — e.g. when the\n * selected label comes from data the items haven't mounted with yet.\n */\nfunction ComboboxTrigger({\n  className,\n  /** Muted prefix rendered as `label:` before the value (e.g. `Project:`). */\n  label,\n  /** Muted text shown while nothing is selected. */\n  placeholder,\n  children,\n  ...props\n}: React.ComponentProps<typeof PopoverTrigger> & { label?: string; placeholder?: string }) {\n  const { value, labels } = useComboboxContext(\"ComboboxTrigger\");\n  const display = children ?? (value ? (labels.get(value) ?? value) : undefined);\n\n  return (\n    <PopoverTrigger\n      data-slot=\"combobox-trigger\"\n      className={cn(PILL, \"text-left transition-colors hover:border-focus/60\", className)}\n      {...props}\n    >\n      {label && <span className=\"shrink-0 text-muted-txt\">{label}:</span>}\n      <span className={cn(\"min-w-0 truncate\", display != null ? \"font-medium\" : \"text-muted-txt\")}>\n        {display ?? placeholder}\n      </span>\n      <Icon as={ChevronDown} className=\"ml-1 size-4 shrink-0 text-muted-txt\" />\n    </PopoverTrigger>\n  );\n}\n\n/** The dropdown panel: a Command (filterable list) inside a PopoverContent. */\nfunction ComboboxContent({\n  className,\n  align = \"start\",\n  children,\n  filter,\n  shouldFilter,\n  loop,\n  ...props\n}: React.ComponentProps<typeof PopoverContent> &\n  Pick<React.ComponentProps<typeof CommandPrimitive>, \"filter\" | \"shouldFilter\" | \"loop\">) {\n  return (\n    <PopoverContent\n      data-slot=\"combobox-content\"\n      align={align}\n      className={cn(\"w-64 p-0\", className)}\n      {...props}\n    >\n      <Command filter={filter} shouldFilter={shouldFilter} loop={loop} className=\"bg-transparent\">\n        {children}\n      </Command>\n    </PopoverContent>\n  );\n}\n\n/** Bordered search field pinned above the list; typing filters the items. */\nfunction ComboboxInput({\n  className,\n  /** Extra classes for the padded, bottom-bordered section around the field. */\n  wrapperClassName,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Input> & { wrapperClassName?: string }) {\n  return (\n    <div data-slot=\"combobox-input-wrapper\" className={cn(\"border-b p-2\", wrapperClassName)}>\n      <div className=\"relative\">\n        <Icon\n          as={Search}\n          className=\"absolute top-1/2 left-2.5 size-3.5 -translate-y-1/2 text-muted-txt\"\n        />\n        <CommandPrimitive.Input\n          data-slot=\"combobox-input\"\n          className={cn(inputVariants({ size: \"sm\" }), \"pl-8\", className)}\n          {...props}\n        />\n      </div>\n    </div>\n  );\n}\n\n/** Scrollable container for the option rows. */\nfunction ComboboxList({ className, ...props }: React.ComponentProps<typeof CommandList>) {\n  return (\n    <CommandList data-slot=\"combobox-list\" className={cn(\"max-h-64 py-1\", className)} {...props} />\n  );\n}\n\n/** Placeholder row shown when the search matches no items. */\nfunction ComboboxEmpty({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Empty>) {\n  return (\n    <CommandPrimitive.Empty\n      data-slot=\"combobox-empty\"\n      className={cn(\"px-3 py-2 text-sm text-muted-txt\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A labelled group of related options, with an optional `heading`. */\nfunction ComboboxGroup({ className, ...props }: React.ComponentProps<typeof CommandGroup>) {\n  return (\n    <CommandGroup\n      data-slot=\"combobox-group\"\n      className={cn(\"p-0 [&_[cmdk-group-heading]]:px-3\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A thin divider line between option groups. */\nfunction ComboboxSeparator({ className, ...props }: React.ComponentProps<typeof CommandSeparator>) {\n  return (\n    <CommandSeparator data-slot=\"combobox-separator\" className={cn(\"mx-0\", className)} {...props} />\n  );\n}\n\n/**\n * A selectable option. `value` is what the combobox reports on selection;\n * search matches the visible text (or explicit `keywords`), not the `value`.\n */\nfunction ComboboxItem({\n  /** The value reported by `onValueChange` when this item is chosen. */\n  value,\n  /** Extra strings the search should match; defaults to the item's text content. */\n  keywords,\n  className,\n  children,\n  onSelect,\n  ...props\n}: Omit<React.ComponentProps<typeof CommandItem>, \"value\"> & { value: string }) {\n  const ctx = useComboboxContext(\"ComboboxItem\");\n  const isSelected = value === ctx.value;\n  const label = textLabel(children);\n  const { registerItem, select } = ctx;\n\n  React.useEffect(() => {\n    if (label !== undefined) registerItem(value, label);\n  }, [value, label, registerItem]);\n\n  return (\n    <CommandItem\n      data-slot=\"combobox-item\"\n      value={value}\n      keywords={keywords ?? (label !== undefined ? [label] : undefined)}\n      onSelect={(selected) => {\n        select(value);\n        onSelect?.(selected);\n      }}\n      className={cn(\n        // Header project-picker row: hover/highlight ghost, chosen bg/secondary + medium.\n        \"cursor-pointer rounded-none px-3 py-2 hover:bg-ghost-hover-bg active:bg-ghost-hover-bg data-[selected=true]:bg-ghost-hover-bg\",\n        isSelected && \"bg-secondary-bg font-medium data-[selected=true]:bg-secondary-bg\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {isSelected && <Icon as={Check} className=\"ml-auto size-3.5 shrink-0 text-primary\" />}\n    </CommandItem>\n  );\n}\n\nexport {\n  Combobox,\n  ComboboxTrigger,\n  ComboboxContent,\n  ComboboxInput,\n  ComboboxList,\n  ComboboxEmpty,\n  ComboboxGroup,\n  ComboboxItem,\n  ComboboxSeparator,\n};\n"],"mappings":"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"}

package/dist/primitives/Command/index.d.cts

@@ -1,2 +1,2 @@
-import { a as CommandInput, c as CommandSeparator, i as CommandGroup, l as CommandShortcut, n as CommandDialog, o as CommandItem, r as CommandEmpty, s as CommandList, t as Command } from "../../index19.cjs";
+import { a as CommandInput, c as CommandSeparator, i as CommandGroup, l as CommandShortcut, n as CommandDialog, o as CommandItem, r as CommandEmpty, s as CommandList, t as Command } from "../../index20.cjs";
 export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/primitives/Command/index.d.ts

@@ -1,2 +1,2 @@
-import { a as CommandInput, c as CommandSeparator, i as CommandGroup, l as CommandShortcut, n as CommandDialog, o as CommandItem, r as CommandEmpty, s as CommandList, t as Command } from "../../index19.js";
+import { a as CommandInput, c as CommandSeparator, i as CommandGroup, l as CommandShortcut, n as CommandDialog, o as CommandItem, r as CommandEmpty, s as CommandList, t as Command } from "../../index20.js";
 export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/primitives/ContextMenu/index.d.cts

@@ -1,2 +1,2 @@
-import { a as ContextMenuItem, c as ContextMenuRadioGroup, d as ContextMenuShortcut, f as ContextMenuSub, h as ContextMenuTrigger, i as ContextMenuGroup, l as ContextMenuRadioItem, m as ContextMenuSubTrigger, n as ContextMenuCheckboxItem, o as ContextMenuLabel, p as ContextMenuSubContent, r as ContextMenuContent, s as ContextMenuPortal, t as ContextMenu, u as ContextMenuSeparator } from "../../index20.cjs";
+import { a as ContextMenuItem, c as ContextMenuRadioGroup, d as ContextMenuShortcut, f as ContextMenuSub, h as ContextMenuTrigger, i as ContextMenuGroup, l as ContextMenuRadioItem, m as ContextMenuSubTrigger, n as ContextMenuCheckboxItem, o as ContextMenuLabel, p as ContextMenuSubContent, r as ContextMenuContent, s as ContextMenuPortal, t as ContextMenu, u as ContextMenuSeparator } from "../../index23.cjs";
 export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };

package/dist/primitives/ContextMenu/index.d.ts

@@ -1,2 +1,2 @@
-import { a as ContextMenuItem, c as ContextMenuRadioGroup, d as ContextMenuShortcut, f as ContextMenuSub, h as ContextMenuTrigger, i as ContextMenuGroup, l as ContextMenuRadioItem, m as ContextMenuSubTrigger, n as ContextMenuCheckboxItem, o as ContextMenuLabel, p as ContextMenuSubContent, r as ContextMenuContent, s as ContextMenuPortal, t as ContextMenu, u as ContextMenuSeparator } from "../../index20.js";
+import { a as ContextMenuItem, c as ContextMenuRadioGroup, d as ContextMenuShortcut, f as ContextMenuSub, h as ContextMenuTrigger, i as ContextMenuGroup, l as ContextMenuRadioItem, m as ContextMenuSubTrigger, n as ContextMenuCheckboxItem, o as ContextMenuLabel, p as ContextMenuSubContent, r as ContextMenuContent, s as ContextMenuPortal, t as ContextMenu, u as ContextMenuSeparator } from "../../index23.js";
 export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };