@burojs/ui-shadcn 0.3.0 → 0.5.0

package/dist/filter-builder-DOnaXNfP.js

@@ -0,0 +1,1605 @@
+import { l as cn } from "./use-theme-dnE3Od3I.js";
+import { f as Popover, g as PopoverTrigger, h as PopoverContent, o as loadLanguage } from "./toaster-CfCRLgR-.js";
+import { t as Button } from "./button-MWVeZaqj.js";
+import { t as Input } from "./input-CUPStzZO.js";
+import { S as CommandList, b as CommandInput, f as useRowTitle, g as Command, n as narrowSearchDecl, v as CommandEmpty, x as CommandItem, y as CommandGroup } from "./search-access-CURsWn-U.js";
+import { EMPTY_FILTER_GROUP, convertValueForOp, isCompletePredicate, isFilterGroup, opArity, resolveEnumLabel } from "@burojs/core";
+import { useApp, useEnumValues, useI18nCaps, useList, useListAccess, useOptionalT, useRelatedRecord } from "@burojs/react";
+import { IconCheck, IconChevronDown, IconChevronUp, IconFilter, IconFolderPlus, IconLoader2, IconPlus, IconX } from "@tabler/icons-react";
+import * as React from "react";
+import { Fragment, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import * as SelectPrimitive from "@radix-ui/react-select";
+//#region src/primitives/badge.tsx
+const badgeVariants = cva("inline-flex max-w-full items-center truncate rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2", {
+	variants: { variant: {
+		default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+		secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+		destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+		outline: "text-foreground",
+		success: "border-success/20 bg-success/15 text-success-emphasis hover:bg-success/20",
+		warning: "border-warning/20 bg-warning/15 text-warning-emphasis hover:bg-warning/20",
+		info: "border-info/20 bg-info/15 text-info-emphasis hover:bg-info/20"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function Badge({ className, variant, children, ...props }) {
+	return jsx("div", {
+		className: cn(badgeVariants({ variant }), className),
+		...props,
+		children: jsx("span", {
+			className: "min-w-0 truncate",
+			children
+		})
+	});
+}
+//#endregion
+//#region src/primitives/table.tsx
+const Table = React.forwardRef(({ className, ...props }, ref) => jsx("div", {
+	className: "relative w-full overflow-auto",
+	children: jsx("table", {
+		ref,
+		className: cn("w-full caption-bottom text-sm", className),
+		...props
+	})
+}));
+Table.displayName = "Table";
+const TableHeader = React.forwardRef(({ className, ...props }, ref) => jsx("thead", {
+	ref,
+	className: cn("[&_tr]:border-b", className),
+	...props
+}));
+TableHeader.displayName = "TableHeader";
+const TableBody = React.forwardRef(({ className, ...props }, ref) => jsx("tbody", {
+	ref,
+	className: cn("[&_tr:last-child]:border-0", className),
+	...props
+}));
+TableBody.displayName = "TableBody";
+const TableRow = React.forwardRef(({ className, ...props }, ref) => jsx("tr", {
+	ref,
+	className: cn("group/row border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-primary/10 data-[state=selected]:hover:bg-primary/15", className),
+	...props
+}));
+TableRow.displayName = "TableRow";
+const TableHead = React.forwardRef(({ className, ...props }, ref) => jsx("th", {
+	ref,
+	className: cn("h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0", className),
+	...props
+}));
+TableHead.displayName = "TableHead";
+const TableCell = React.forwardRef(({ className, ...props }, ref) => jsx("td", {
+	ref,
+	className: cn("p-2 align-middle [&:has([role=checkbox])]:pr-0", className),
+	...props
+}));
+TableCell.displayName = "TableCell";
+const TableCaption = React.forwardRef(({ className, ...props }, ref) => jsx("caption", {
+	ref,
+	className: cn("mt-4 text-sm text-muted-foreground", className),
+	...props
+}));
+TableCaption.displayName = "TableCaption";
+//#endregion
+//#region src/primitives/select.tsx
+const Select = SelectPrimitive.Root;
+const SelectGroup = SelectPrimitive.Group;
+const SelectValue = SelectPrimitive.Value;
+const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => jsxs(SelectPrimitive.Trigger, {
+	ref,
+	className: cn("flex h-9 w-full items-center justify-between rounded-md border border-input bg-background text-foreground px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-input-disabled [&>span]:line-clamp-1", className),
+	...props,
+	children: [children, jsx(SelectPrimitive.Icon, {
+		asChild: true,
+		children: jsx(IconChevronDown, { className: "h-4 w-4 opacity-50" })
+	})]
+}));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) => jsx(SelectPrimitive.ScrollUpButton, {
+	ref,
+	className: cn("flex cursor-default items-center justify-center py-1", className),
+	...props,
+	children: jsx(IconChevronUp, { className: "h-4 w-4" })
+}));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) => jsx(SelectPrimitive.ScrollDownButton, {
+	ref,
+	className: cn("flex cursor-default items-center justify-center py-1", className),
+	...props,
+	children: jsx(IconChevronDown, { className: "h-4 w-4" })
+}));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
+const SelectContent = React.forwardRef(({ className, children, position = "popper", ...props }, ref) => jsx(SelectPrimitive.Portal, { children: jsxs(SelectPrimitive.Content, {
+	ref,
+	className: cn("relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md duration-[var(--duration-overlay)] ease-[var(--ease-overlay)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className),
+	position,
+	...props,
+	children: [
+		jsx(SelectScrollUpButton, {}),
+		jsx(SelectPrimitive.Viewport, {
+			className: cn("p-1", position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"),
+			children
+		}),
+		jsx(SelectScrollDownButton, {})
+	]
+}) }));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+const SelectLabel = React.forwardRef(({ className, ...props }, ref) => jsx(SelectPrimitive.Label, {
+	ref,
+	className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
+	...props
+}));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => jsxs(SelectPrimitive.Item, {
+	ref,
+	className: cn("relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className),
+	...props,
+	children: [jsx("span", {
+		className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center",
+		children: jsx(SelectPrimitive.ItemIndicator, { children: jsx(IconCheck, { className: "h-4 w-4" }) })
+	}), jsx(SelectPrimitive.ItemText, { children })]
+}));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+const SelectSeparator = React.forwardRef(({ className, ...props }, ref) => jsx(SelectPrimitive.Separator, {
+	ref,
+	className: cn("-mx-1 my-1 h-px bg-muted", className),
+	...props
+}));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+//#endregion
+//#region src/fields/format.ts
+const LOCALE_TAG = {
+	ru: "ru-RU",
+	en: "en-US"
+};
+function localeTag(locale) {
+	if (locale) return LOCALE_TAG[locale] ?? locale;
+	return LOCALE_TAG[loadLanguage()] ?? "en-US";
+}
+const dateCache = new Map();
+const dateTimeCache = new Map();
+const numberCache = new Map();
+function cached(cache, key, make) {
+	const hit = cache.get(key);
+	if (hit) return hit;
+	let made;
+	try {
+		made = make(key);
+	} catch {
+		made = make("en-US");
+	}
+	cache.set(key, made);
+	return made;
+}
+function formatDate(d, locale) {
+	const tag = localeTag(locale);
+	return cached(dateCache, tag, (t) => new Intl.DateTimeFormat(t, {
+		year: "numeric",
+		month: "short",
+		day: "numeric"
+	})).format(d);
+}
+function formatDateTime(d, locale) {
+	const tag = localeTag(locale);
+	return cached(dateTimeCache, tag, (t) => new Intl.DateTimeFormat(t, {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit"
+	})).format(d);
+}
+function formatNumber(n, locale) {
+	const tag = localeTag(locale);
+	return cached(numberCache, tag, (t) => new Intl.NumberFormat(t)).format(n);
+}
+//#endregion
+//#region src/list-kit/filter-builder/describe-row.ts
+const MAX_DESCRIBE_DEPTH = 2;
+function describeValue(value, t, spec, formatValue) {
+	if (value === void 0) return null;
+	if (Array.isArray(value)) return t("filters.selectedCount", { count: value.length }, `${value.length} selected`);
+	const optionLabel = spec?.options?.find((o) => o.value === String(value))?.label;
+	if (optionLabel !== void 0) return optionLabel;
+	if (spec && formatValue) {
+		const formatted = formatValue(spec.kind, value);
+		if (formatted !== void 0) return formatted;
+	}
+	return String(value);
+}
+function describeAt(row, available, t, depth, formatValue) {
+	if (isFilterGroup(row)) {
+		if (depth > MAX_DESCRIBE_DEPTH) return "…";
+		const joinLabel = t(`filters.${row.join}`, void 0, row.join);
+		return `(${row.rows.map((child) => describeAt(child, available, t, depth + 1, formatValue)).join(` ${joinLabel} `)})`;
+	}
+	const spec = available.find((s) => s.field === row.field);
+	const label = spec?.label ?? row.field;
+	const opLabel = t(`filters.operators.${row.op}`, void 0, row.op);
+	const valueText = opArity(row.op) === "none" ? null : describeValue(row.value, t, spec, formatValue);
+	return valueText === null ? `${label} ${opLabel}` : `${label} ${opLabel} ${valueText}`;
+}
+function describeRow(row, available, t, formatValue) {
+	return describeAt(row, available, t, 1, formatValue);
+}
+function relationLabelKey(to, by, value) {
+	return `${by === void 0 ? to : `${to}#${by}`}::${value}`;
+}
+function collectFormatRefs(rows, available) {
+	const enumNames = new Set();
+	const relationRefs = new Map();
+	const walk = (nodes) => {
+		for (const row of nodes) {
+			if (isFilterGroup(row)) {
+				walk(row.rows);
+				continue;
+			}
+			if (row.value === void 0 || Array.isArray(row.value)) continue;
+			const spec = available.find((s) => s.field === row.field);
+			if (!spec) continue;
+			if (spec.kind.kind === "enum") enumNames.add(spec.kind.enumName);
+			else if (spec.kind.kind === "relation") {
+				const id = String(row.value);
+				const { to, by } = spec.kind;
+				relationRefs.set(relationLabelKey(to, by, id), by === void 0 ? {
+					to,
+					id
+				} : {
+					to,
+					id,
+					by
+				});
+			}
+		}
+	};
+	walk(rows);
+	return {
+		enumNames: Array.from(enumNames),
+		relationRefs: Array.from(relationRefs.values())
+	};
+}
+//#endregion
+//#region src/list-kit/filter-builder/describe-value-resolvers.tsx
+function EnumLabelResolver(props) {
+	const { enumName, onResolve } = props;
+	const { values } = useEnumValues(enumName);
+	const caps = useI18nCaps();
+	useEffect(() => {
+		if (!values) return;
+		const labels = {};
+		for (const entry of values) labels[entry.value] = resolveEnumLabel(caps, enumName, entry.value, entry.label);
+		onResolve(enumName, labels);
+	}, [
+		values,
+		enumName,
+		caps,
+		onResolve
+	]);
+	return null;
+}
+function RelationLabelResolver(props) {
+	const { to, id, by, onResolve } = props;
+	const targetDef = useApp().registry.get(to);
+	const { record } = useRelatedRecord(to, id, by === void 0 ? void 0 : { by });
+	const rowTitle = useRowTitle(to, targetDef?.displayField);
+	useEffect(() => {
+		if (!record) return;
+		onResolve(relationLabelKey(to, by, id), rowTitle(record));
+	}, [
+		record,
+		to,
+		by,
+		id,
+		rowTitle,
+		onResolve
+	]);
+	return null;
+}
+function FormatResolvers(props) {
+	const { refs, onEnumResolved, onRelationResolved } = props;
+	return jsxs(Fragment$1, { children: [refs.enumNames.map((name) => jsx(EnumLabelResolver, {
+		enumName: name,
+		onResolve: onEnumResolved
+	}, `enum:${name}`)), refs.relationRefs.map(({ to, id, by }) => jsx(RelationLabelResolver, {
+		to,
+		id,
+		...by === void 0 ? {} : { by },
+		onResolve: onRelationResolved
+	}, `relation:${relationLabelKey(to, by, id)}`))] });
+}
+function useFormatValueMaps() {
+	const [enumLabels, setEnumLabels] = useState({});
+	const [relationLabels, setRelationLabels] = useState({});
+	return {
+		enumLabels,
+		relationLabels,
+		onEnumResolved: useCallback((enumName, labels) => {
+			setEnumLabels((prev) => prev[enumName] === labels ? prev : {
+				...prev,
+				[enumName]: labels
+			});
+		}, []),
+		onRelationResolved: useCallback((key, label) => {
+			setRelationLabels((prev) => prev[key] === label ? prev : {
+				...prev,
+				[key]: label
+			});
+		}, [])
+	};
+}
+//#endregion
+//#region src/list-kit/filter-builder/pinned-ownership.ts
+function isFilterPredicateExpr(expr) {
+	return "field" in expr;
+}
+function findOwnedIndex(value, spec) {
+	const op = spec.operators[0] ?? "eq";
+	return value.findIndex((expr) => isFilterPredicateExpr(expr) && expr.field === spec.field && expr.op === op);
+}
+function claimedPinnedIndices(value, pinnedFields) {
+	const claimed = new Set();
+	for (const spec of pinnedFields) {
+		const op = spec.operators[0] ?? "eq";
+		const index = value.findIndex((expr, i) => !claimed.has(i) && isFilterPredicateExpr(expr) && expr.field === spec.field && expr.op === op);
+		if (index >= 0) claimed.add(index);
+	}
+	return claimed;
+}
+//#endregion
+//#region src/list-kit/filter-builder/filter-badges.tsx
+function badgeKey(row, index) {
+	if (isFilterGroup(row)) return `${index}:group:${row.join}`;
+	return `${index}:${row.field}:${row.op}`;
+}
+function FilterBadges(props) {
+	const { group, setGroup, available, fixed, testIdBase, onOpenAt, onRemoved, pinnedFields = [], pinnedValue = [], setPinnedValue } = props;
+	const t = useOptionalT();
+	const tt = (key, params, fallback) => t(key, {
+		params,
+		...typeof params?.count === "number" ? { count: params.count } : {},
+		defaultValue: fallback
+	});
+	const removeLabel = t("filters.removeRow", { defaultValue: "Remove filter" });
+	const { enumLabels, relationLabels, onEnumResolved, onRelationResolved } = useFormatValueMaps();
+	const formatValue = (kind, value) => {
+		if (kind.kind === "enum") return enumLabels[kind.enumName]?.[String(value)];
+		if (kind.kind === "relation") return relationLabels[relationLabelKey(kind.to, kind.by, String(value))];
+		if (kind.kind === "date") {
+			const d = new Date(String(value));
+			if (Number.isNaN(d.getTime())) return void 0;
+			return kind.time ? formatDateTime(d) : formatDate(d);
+		}
+	};
+	const orphanPinned = useMemo(() => {
+		const claimed = claimedPinnedIndices(pinnedValue, pinnedFields);
+		return pinnedValue.map((expr, index) => ({
+			expr,
+			index
+		})).filter(({ expr, index }) => !claimed.has(index) && isFilterPredicateExpr(expr));
+	}, [pinnedValue, pinnedFields]);
+	const refs = useMemo(() => collectFormatRefs([...group.rows, ...orphanPinned.map(({ expr }) => expr)], available), [
+		group,
+		orphanPinned,
+		available
+	]);
+	const handleRemove = (index) => {
+		setGroup({
+			...group,
+			rows: group.rows.filter((_, i) => i !== index)
+		});
+		onRemoved?.(index);
+	};
+	const handleRemovePinned = (index) => {
+		setPinnedValue?.(pinnedValue.filter((_, i) => i !== index));
+	};
+	const labelledFixed = fixed.filter((entry) => entry.label !== void 0);
+	return jsxs("div", {
+		className: "flex flex-wrap items-center gap-1",
+		children: [
+			jsx(FormatResolvers, {
+				refs,
+				onEnumResolved,
+				onRelationResolved
+			}),
+			group.rows.map((row, index) => jsxs(Badge, {
+				variant: "secondary",
+				className: "gap-1 py-1 pr-1",
+				children: [jsx("button", {
+					type: "button",
+					"data-testid": `${testIdBase}:badge:${index}`,
+					onClick: () => onOpenAt([index]),
+					className: "max-w-full cursor-pointer truncate bg-transparent p-0 text-left",
+					children: describeRow(row, available, tt, formatValue)
+				}), jsx("button", {
+					type: "button",
+					"data-testid": `${testIdBase}:badge:${index}:remove`,
+					"aria-label": removeLabel,
+					onClick: () => handleRemove(index),
+					className: "rounded-sm hover:bg-accent",
+					children: jsx(IconX, {
+						className: "h-3 w-3",
+						"aria-hidden": "true"
+					})
+				})]
+			}, badgeKey(row, index))),
+			labelledFixed.map((entry, index) => jsx(Badge, {
+				variant: "outline",
+				"data-testid": `${testIdBase}:badge:fixed:${index}`,
+				children: entry.label
+			}, `fixed-${index}`)),
+			orphanPinned.map(({ expr, index }) => jsxs(Badge, {
+				variant: "secondary",
+				className: "gap-1 py-1",
+				children: [jsx("span", {
+					"data-testid": `${testIdBase}:badge:pinned:${index}`,
+					children: describeRow(expr, available, tt, formatValue)
+				}), jsx("button", {
+					type: "button",
+					"data-testid": `${testIdBase}:badge:pinned:${index}:remove`,
+					"aria-label": removeLabel,
+					onClick: () => handleRemovePinned(index),
+					className: "rounded-sm hover:bg-accent",
+					children: jsx(IconX, {
+						className: "h-3 w-3",
+						"aria-hidden": "true"
+					})
+				})]
+			}, `pinned-${index}`))
+		]
+	});
+}
+let counter = 0;
+function nextId() {
+	counter += 1;
+	return `r${counter}`;
+}
+function isDraftGroup(node) {
+	return Object.hasOwn(node, "rows");
+}
+function toDraft(group) {
+	return {
+		rowId: nextId(),
+		join: group.join,
+		rows: group.rows.map(toDraftNode)
+	};
+}
+function toDraftNode(row) {
+	if (isFilterGroup(row)) return toDraft(row);
+	const predicate = row;
+	return {
+		rowId: nextId(),
+		field: predicate.field,
+		op: predicate.op,
+		...Object.hasOwn(predicate, "value") ? { value: predicate.value } : {}
+	};
+}
+function fromDraft(draft) {
+	return {
+		join: draft.join,
+		rows: draft.rows.map((node) => isDraftGroup(node) ? fromDraft(node) : {
+			field: node.field,
+			op: node.op,
+			...Object.hasOwn(node, "value") ? { value: node.value } : {}
+		})
+	};
+}
+function pruneIncompleteRows(group) {
+	const rows = [];
+	for (const row of group.rows) if (isFilterGroup(row)) {
+		const pruned = pruneIncompleteRows(row);
+		if (pruned.rows.length > 0) rows.push(pruned);
+	} else if (isCompletePredicate(row)) rows.push(row);
+	return {
+		join: group.join,
+		rows
+	};
+}
+function mapGroupAt(draft, path, replace) {
+	if (path.length === 0) return replace(draft);
+	const [head, ...rest] = path;
+	const child = draft.rows[head];
+	if (child === void 0 || !isDraftGroup(child)) return draft;
+	const next = mapGroupAt(child, rest, replace);
+	if (next === child) return draft;
+	const rows = draft.rows.slice();
+	rows[head] = next;
+	return {
+		...draft,
+		rows
+	};
+}
+function depthOf(path) {
+	return path.length + 1;
+}
+function defaultValueForOp(op) {
+	const arity = opArity(op);
+	if (arity === "none") return void 0;
+	if (arity === "multi") return [];
+	return "";
+}
+function addRow(draft, path, available) {
+	const spec = available[0];
+	if (!spec) return draft;
+	const op = spec.operators[0] ?? "eq";
+	const value = defaultValueForOp(op);
+	const row = {
+		rowId: nextId(),
+		field: spec.field,
+		op,
+		...value === void 0 ? {} : { value }
+	};
+	return mapGroupAt(draft, path, (group) => ({
+		...group,
+		rows: [...group.rows, row]
+	}));
+}
+function addGroup(draft, path) {
+	if (depthOf(path) >= 3) return draft;
+	const group = {
+		rowId: nextId(),
+		join: "and",
+		rows: []
+	};
+	return mapGroupAt(draft, path, (parent) => ({
+		...parent,
+		rows: [...parent.rows, group]
+	}));
+}
+function removeAt(draft, path) {
+	if (path.length === 0) return draft;
+	const parentPath = path.slice(0, -1);
+	const index = path[path.length - 1];
+	return mapGroupAt(draft, parentPath, (group) => {
+		if (group.rows[index] === void 0) return group;
+		const rows = group.rows.slice();
+		rows.splice(index, 1);
+		return {
+			...group,
+			rows
+		};
+	});
+}
+function setJoin(draft, path, join) {
+	return mapGroupAt(draft, path, (group) => group.join === join ? group : {
+		...group,
+		join
+	});
+}
+function updateRow(draft, path, patch) {
+	if (path.length === 0) return draft;
+	const parentPath = path.slice(0, -1);
+	const index = path[path.length - 1];
+	return mapGroupAt(draft, parentPath, (group) => {
+		const current = group.rows[index];
+		if (current === void 0 || isDraftGroup(current)) return group;
+		const fieldChanged = patch.field !== void 0 && patch.field !== current.field;
+		const op = patch.op ?? current.op;
+		let value;
+		if (fieldChanged) value = defaultValueForOp(op);
+		else if (patch.op !== void 0 && patch.op !== current.op) value = convertValueForOp(current.value, current.op, patch.op);
+		else value = Object.hasOwn(patch, "value") ? patch.value : current.value;
+		const next = {
+			rowId: current.rowId,
+			field: patch.field ?? current.field,
+			op,
+			...value === void 0 ? {} : { value }
+		};
+		const rows = group.rows.slice();
+		rows[index] = next;
+		return {
+			...group,
+			rows
+		};
+	});
+}
+const EMPTY_DRAFT = () => toDraft(EMPTY_FILTER_GROUP);
+//#endregion
+//#region src/list-kit/filter-builder/values/use-selectable-value-control.ts
+function useSelectableValueControl(options) {
+	const { value, arity, onChange, emitSingle = (token) => token } = options;
+	const [open, setOpen] = useState(false);
+	const selected = arity === "multi" ? new Set(Array.isArray(value) ? value.map(String) : []) : new Set(value === void 0 || value === null ? [] : [String(value)]);
+	const select = (token) => {
+		if (arity === "single") {
+			onChange(emitSingle(token));
+			setOpen(false);
+			return;
+		}
+		const next = new Set(selected);
+		if (next.has(token)) next.delete(token);
+		else next.add(token);
+		onChange(next.size === 0 ? void 0 : Array.from(next));
+	};
+	const triggerLabel = (labelOf, placeholder) => {
+		const picked = Array.from(selected);
+		return picked.length === 0 ? placeholder : picked.map(labelOf).join(", ");
+	};
+	const clear = () => {
+		onChange(void 0);
+		setOpen(false);
+	};
+	return {
+		open,
+		setOpen,
+		selected,
+		select,
+		triggerLabel,
+		clear
+	};
+}
+//#endregion
+//#region src/list-kit/filter-builder/values/boolean-value-control.tsx
+const OPTIONS = ["true", "false"];
+function BooleanValueControl(props) {
+	const { value, onChange, testId, arity, autoFocus, fieldLabel, fill } = props;
+	const t = useOptionalT();
+	const ariaLabel = fieldLabel ? t("filters.valueFor", {
+		defaultValue: `Value for ${fieldLabel}`,
+		params: { field: fieldLabel }
+	}) : t("filters.value", { defaultValue: "Value" });
+	const yesLabel = t("boolean.yes", { defaultValue: "Yes" });
+	const noLabel = t("boolean.no", { defaultValue: "No" });
+	const labelOf = (token) => token === "true" ? yesLabel : noLabel;
+	const clearLabel = t("filters.clear", { defaultValue: "Clear" });
+	const { open, setOpen, selected, select, triggerLabel, clear } = useSelectableValueControl({
+		value,
+		arity,
+		onChange,
+		emitSingle: (token) => token === "true"
+	});
+	return jsxs(Popover, {
+		open,
+		onOpenChange: setOpen,
+		children: [jsx(PopoverTrigger, {
+			asChild: true,
+			children: jsx(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				autoFocus,
+				"data-testid": testId,
+				"aria-label": ariaLabel,
+				className: cn("h-8 justify-between", fill && "w-full"),
+				children: triggerLabel(labelOf, ariaLabel)
+			})
+		}), jsx(PopoverContent, {
+			className: "w-[140px] p-0",
+			align: "start",
+			children: jsx(Command, { children: jsx(CommandList, { children: jsxs(CommandGroup, { children: [arity === "single" && selected.size > 0 && jsxs(CommandItem, {
+				"data-testid": `${testId}:clear`,
+				value: "__clear__",
+				onSelect: () => clear(),
+				children: [jsx(IconX, {
+					className: "mr-2 h-4 w-4",
+					"aria-hidden": "true"
+				}), clearLabel]
+			}), OPTIONS.map((token) => {
+				const isSelected = selected.has(token);
+				return jsxs(CommandItem, {
+					value: labelOf(token),
+					"data-testid": `${testId}:option:${token}`,
+					onSelect: () => select(token),
+					children: [jsx(IconCheck, {
+						className: cn("mr-2 h-4 w-4", isSelected ? "opacity-100" : "opacity-0"),
+						"aria-hidden": "true"
+					}), labelOf(token)]
+				}, token);
+			})] }) }) })
+		})]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/values/select-list-value-control.tsx
+function SelectListValueControl(props) {
+	const { options, value, onChange, testId, arity, autoFocus, fieldLabel, isLoading = false } = props;
+	const t = useOptionalT();
+	const ariaLabel = fieldLabel ? t("filters.valueFor", {
+		defaultValue: `Value for ${fieldLabel}`,
+		params: { field: fieldLabel }
+	}) : t("filters.value", { defaultValue: "Value" });
+	const loadingLabel = t("table.loading", { defaultValue: "Loading…" });
+	const clearLabel = t("filters.clear", { defaultValue: "Clear" });
+	const labelFor = props.labelFor ?? ((raw) => options.find((o) => o.value === raw)?.label ?? raw);
+	const { open, setOpen, selected, select, triggerLabel, clear } = useSelectableValueControl({
+		value,
+		arity,
+		onChange
+	});
+	return jsxs(Popover, {
+		open,
+		onOpenChange: setOpen,
+		children: [jsx(PopoverTrigger, {
+			asChild: true,
+			children: jsx(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				autoFocus,
+				"data-testid": testId,
+				"aria-label": ariaLabel,
+				className: cn("h-8 justify-between truncate", props.fill ? "w-full" : "max-w-[200px]"),
+				children: jsx("span", {
+					className: "truncate",
+					children: isLoading ? loadingLabel : triggerLabel(labelFor, ariaLabel)
+				})
+			})
+		}), jsx(PopoverContent, {
+			className: "w-[220px] p-0",
+			align: "start",
+			children: jsxs(Command, { children: [jsx(CommandInput, {
+				placeholder: ariaLabel,
+				"data-testid": `${testId}:search`
+			}), jsxs(CommandList, { children: [
+				isLoading && jsxs("div", {
+					className: "flex items-center justify-center gap-2 py-6 text-sm text-muted-foreground",
+					"data-testid": `${testId}:loading`,
+					children: [jsx(IconLoader2, {
+						className: "h-4 w-4 animate-spin",
+						"aria-hidden": "true"
+					}), loadingLabel]
+				}),
+				!isLoading && jsx(CommandEmpty, { children: t("relation.noResults", { defaultValue: "No results." }) }),
+				!isLoading && jsxs(CommandGroup, { children: [arity === "single" && selected.size > 0 && jsxs(CommandItem, {
+					"data-testid": `${testId}:clear`,
+					value: "__clear__",
+					onSelect: () => clear(),
+					children: [jsx(IconX, {
+						className: "mr-2 h-4 w-4",
+						"aria-hidden": "true"
+					}), clearLabel]
+				}), options.map((entry) => {
+					const isSelected = selected.has(entry.value);
+					const label = labelFor(entry.value);
+					return jsxs(CommandItem, {
+						value: label,
+						"data-testid": `${testId}:option:${entry.value}`,
+						onSelect: () => select(entry.value),
+						children: [jsx(IconCheck, {
+							className: cn("mr-2 h-4 w-4", isSelected ? "opacity-100" : "opacity-0"),
+							"aria-hidden": "true"
+						}), label]
+					}, entry.value);
+				})] })
+			] })] })
+		})]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/values/enum-value-control.tsx
+function EnumValueControl(props) {
+	const { enumName, value, onChange, testId, arity, autoFocus, fieldLabel, fill } = props;
+	const caps = useI18nCaps();
+	const { values, isLoading } = useEnumValues(enumName);
+	const labelFor = (raw) => resolveEnumLabel(caps, enumName, raw, values?.find((v) => v.value === raw)?.label);
+	const options = (values ?? []).map((entry) => ({
+		value: entry.value,
+		label: entry.value
+	}));
+	return jsx(SelectListValueControl, {
+		value,
+		onChange,
+		testId,
+		arity,
+		autoFocus,
+		fieldLabel,
+		options,
+		labelFor,
+		isLoading,
+		fill
+	});
+}
+//#endregion
+//#region src/list-kit/use-related-labels.ts
+function useRelatedLabels(to, ids, by) {
+	const targetDef = useApp().registry.get(to);
+	const idField = (targetDef?.data)?.idField;
+	const rowTitle = useRowTitle(to, targetDef?.displayField);
+	const field = by ?? (typeof idField === "string" && idField.length > 0 ? idField : "id");
+	const query = useList(to, {
+		pagination: {
+			kind: "offset",
+			page: 1,
+			pageSize: Math.min(Math.max(1, ids.length), 100)
+		},
+		...ids.length ? { filter: {
+			field,
+			op: "in",
+			value: ids
+		} } : {},
+		enabled: ids.length > 0
+	});
+	return useMemo(() => {
+		const out = {};
+		for (const row of query.data?.data ?? []) {
+			const key = row[field];
+			if (key !== null && key !== void 0) out[String(key)] = rowTitle(row);
+		}
+		return out;
+	}, [
+		query.data,
+		rowTitle,
+		field
+	]);
+}
+//#endregion
+//#region src/list-kit/filter-builder/values/relation-value-control.tsx
+function RelationValueControl(props) {
+	const { to, by, value, onChange, testId, arity, autoFocus, fieldLabel } = props;
+	const app = useApp();
+	const t = useOptionalT();
+	const targetDef = app.registry.get(to);
+	const displayField = targetDef?.displayField ?? "name";
+	const [search, setSearch] = useState("");
+	const { open, setOpen, selected, select, triggerLabel, clear } = useSelectableValueControl({
+		value,
+		arity,
+		onChange
+	});
+	const rowTitle = useRowTitle(to, targetDef?.displayField);
+	const access = useListAccess(to);
+	const searchable = useMemo(() => access.status === "ready" && narrowSearchDecl({ fields: [displayField] }, (name) => access.fieldVisible(name)) !== void 0, [access, displayField]);
+	const listQuery = useList(to, {
+		pagination: {
+			kind: "offset",
+			page: 1,
+			pageSize: 10
+		},
+		...searchable && search.trim() ? { filter: {
+			field: displayField,
+			op: "contains",
+			value: search.trim()
+		} } : {},
+		enabled: open && access.status === "ready"
+	});
+	const rows = listQuery.data?.data ?? [];
+	const fallbackLabels = useRelatedLabels(to, Array.from(selected), by);
+	const idField = (targetDef?.data)?.idField;
+	const valueField = by ?? (typeof idField === "string" && idField.length > 0 ? idField : "id");
+	const keyOf = (row) => {
+		const key = row[valueField];
+		return key === null || key === void 0 || key === "" ? void 0 : String(key);
+	};
+	const labelFor = (id) => {
+		const fromRows = rows.find((r) => keyOf(r) === id);
+		if (fromRows) return rowTitle(fromRows);
+		return fallbackLabels[id] ?? id;
+	};
+	const ariaLabel = fieldLabel ? t("filters.valueFor", {
+		defaultValue: `Value for ${fieldLabel}`,
+		params: { field: fieldLabel }
+	}) : t("filters.value", { defaultValue: "Value" });
+	const clearLabel = t("filters.clear", { defaultValue: "Clear" });
+	return jsxs(Popover, {
+		open,
+		onOpenChange: setOpen,
+		children: [jsx(PopoverTrigger, {
+			asChild: true,
+			children: jsx(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				autoFocus,
+				"data-testid": testId,
+				"aria-label": ariaLabel,
+				className: cn("h-8 justify-between truncate", props.fill ? "w-full" : "max-w-[220px]"),
+				children: jsx("span", {
+					className: "truncate",
+					children: triggerLabel(labelFor, ariaLabel)
+				})
+			})
+		}), jsx(PopoverContent, {
+			className: "w-[240px] p-0",
+			align: "start",
+			children: jsxs(Command, {
+				shouldFilter: false,
+				children: [searchable && jsx(CommandInput, {
+					value: search,
+					onValueChange: setSearch,
+					placeholder: ariaLabel,
+					"data-testid": `${testId}:search`
+				}), jsxs(CommandList, { children: [
+					listQuery.isLoading && jsxs("div", {
+						className: "flex items-center justify-center gap-2 py-6 text-sm text-muted-foreground",
+						"data-testid": `${testId}:loading`,
+						children: [jsx(IconLoader2, {
+							className: "h-4 w-4 animate-spin",
+							"aria-hidden": "true"
+						}), t("table.loading", { defaultValue: "Loading…" })]
+					}),
+					!listQuery.isLoading && rows.length === 0 && jsx(CommandEmpty, { children: t("relation.noResults", { defaultValue: "No results." }) }),
+					!listQuery.isLoading && arity === "single" && selected.size > 0 && jsxs(CommandItem, {
+						"data-testid": `${testId}:clear`,
+						value: "__clear__",
+						onSelect: () => clear(),
+						children: [jsx(IconX, {
+							className: "mr-2 h-4 w-4",
+							"aria-hidden": "true"
+						}), clearLabel]
+					}),
+					!listQuery.isLoading && rows.map((row) => {
+						const id = keyOf(row);
+						if (id === void 0) return null;
+						const label = rowTitle(row);
+						const isSelected = selected.has(id);
+						return jsxs(CommandItem, {
+							value: `${label} ${id}`,
+							"data-testid": `${testId}:option:${id}`,
+							onSelect: () => select(id),
+							children: [jsx(IconCheck, {
+								className: cn("mr-2 h-4 w-4", isSelected ? "opacity-100" : "opacity-0"),
+								"aria-hidden": "true"
+							}), jsx("span", {
+								className: "truncate",
+								children: label
+							})]
+						}, id);
+					})
+				] })]
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/values/scalar-value-input.tsx
+function isDateTime(kind) {
+	return kind.kind === "date" && kind.time === true;
+}
+function inputTypeFor(kind) {
+	switch (kind.kind) {
+		case "number": return "number";
+		case "date": return isDateTime(kind) ? "datetime-local" : "date";
+		default: return "text";
+	}
+}
+function toText(kind, value) {
+	if (value === void 0 || value === null || value === "") return "";
+	if (!isDateTime(kind)) return String(value);
+	const d = new Date(String(value));
+	if (Number.isNaN(d.getTime())) return "";
+	const pad = (n) => String(n).padStart(2, "0");
+	return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}T${pad(d.getHours())}:${pad(d.getMinutes())}`;
+}
+function parseOne(kind, raw) {
+	if (raw === "") return void 0;
+	if (kind.kind === "number") {
+		const n = Number(raw);
+		return Number.isFinite(n) ? n : void 0;
+	}
+	if (isDateTime(kind)) {
+		const d = new Date(raw);
+		return Number.isNaN(d.getTime()) ? void 0 : d.toISOString();
+	}
+	return raw;
+}
+function ScalarValueInput(props) {
+	const t = useOptionalT();
+	const inputType = inputTypeFor(props.kind);
+	const ariaLabel = props.fieldLabel ? t("filters.valueFor", {
+		defaultValue: `Value for ${props.fieldLabel}`,
+		params: { field: props.fieldLabel }
+	}) : t("filters.value", { defaultValue: "Value" });
+	if (props.arity === "multi") return jsx(ScalarMultiInput, {
+		...props,
+		inputType,
+		ariaLabel
+	});
+	return jsx(ScalarSingleInput, {
+		...props,
+		inputType,
+		ariaLabel
+	});
+}
+function ScalarSingleInput(props) {
+	const { value, onChange, kind, testId, autoFocus, inputType, ariaLabel, debounceMs = 300 } = props;
+	const storedText = toText(kind, value);
+	const [text, setText] = useState(storedText);
+	const lastPushedRef = useRef(storedText);
+	const timerRef = useRef(null);
+	const pendingRawRef = useRef(null);
+	const commitRef = useRef(() => {});
+	useEffect(() => {
+		commitRef.current = (raw) => {
+			const parsed = parseOne(kind, raw);
+			lastPushedRef.current = toText(kind, parsed);
+			pendingRawRef.current = null;
+			onChange(parsed);
+		};
+	});
+	useEffect(() => {
+		if (storedText !== lastPushedRef.current) {
+			setText(storedText);
+			lastPushedRef.current = storedText;
+			if (timerRef.current) {
+				clearTimeout(timerRef.current);
+				timerRef.current = null;
+			}
+			pendingRawRef.current = null;
+		}
+	}, [storedText]);
+	useEffect(() => () => {
+		if (timerRef.current) clearTimeout(timerRef.current);
+		if (pendingRawRef.current !== null) commitRef.current(pendingRawRef.current);
+	}, []);
+	const handleChange = (raw) => {
+		setText(raw);
+		if (timerRef.current) {
+			clearTimeout(timerRef.current);
+			timerRef.current = null;
+		}
+		if (debounceMs <= 0) {
+			pendingRawRef.current = null;
+			commitRef.current(raw);
+			return;
+		}
+		pendingRawRef.current = raw;
+		timerRef.current = setTimeout(() => commitRef.current(raw), debounceMs);
+	};
+	return jsx(Input, {
+		type: inputType,
+		value: text,
+		autoFocus,
+		"aria-label": ariaLabel,
+		placeholder: props.placeholder,
+		"data-testid": testId,
+		onChange: (event) => handleChange(event.target.value),
+		className: cn("h-8", props.fill ? "w-full" : "w-[150px]")
+	});
+}
+function ScalarMultiInput(props) {
+	const { value, onChange, kind, testId, autoFocus, inputType, ariaLabel } = props;
+	const chips = Array.isArray(value) ? value.map((v) => String(v)) : [];
+	const [draft, setDraft] = useState("");
+	const addChip = () => {
+		const parsed = parseOne(kind, draft.trim());
+		if (parsed === void 0) return;
+		const text = String(parsed);
+		setDraft("");
+		if (chips.includes(text)) return;
+		onChange([...chips, text]);
+	};
+	const removeChip = (chip) => {
+		const next = chips.filter((c) => c !== chip);
+		onChange(next.length === 0 ? void 0 : next);
+	};
+	return jsxs("div", {
+		className: cn("flex flex-wrap items-center gap-1", props.fill && "w-full"),
+		children: [chips.map((chip) => jsxs(Badge, {
+			variant: "secondary",
+			"data-testid": `${testId}:chip:${chip}`,
+			className: "gap-1 rounded-sm px-1 font-normal",
+			children: [chip, jsx("button", {
+				type: "button",
+				"data-testid": `${testId}:chip:${chip}:remove`,
+				"aria-label": `Remove ${chip}`,
+				onClick: () => removeChip(chip),
+				className: "rounded-sm hover:bg-accent",
+				children: jsx(IconX, {
+					className: "h-3 w-3",
+					"aria-hidden": "true"
+				})
+			})]
+		}, chip)), jsx(Input, {
+			type: inputType,
+			value: draft,
+			autoFocus,
+			"aria-label": ariaLabel,
+			placeholder: props.placeholder,
+			"data-testid": testId,
+			onChange: (event) => setDraft(event.target.value),
+			onKeyDown: (event) => {
+				if (event.key !== "Enter") return;
+				event.preventDefault();
+				addChip();
+			},
+			className: cn("h-8", props.fill ? "min-w-[8rem] flex-1" : "w-[120px]")
+		})]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/values/filter-value-control.tsx
+function FilterValueControl(props) {
+	const arity = opArity(props.op);
+	if (arity === "none") return null;
+	if (props.options && props.options.length > 0) return jsx(SelectListValueControl, {
+		value: props.value,
+		onChange: props.onChange,
+		testId: props.testId,
+		arity,
+		autoFocus: props.autoFocus,
+		fieldLabel: props.fieldLabel,
+		options: props.options,
+		fill: props.fill
+	});
+	switch (props.kind.kind) {
+		case "enum": return jsx(EnumValueControl, {
+			...props,
+			enumName: props.kind.enumName,
+			arity
+		});
+		case "enum-values": return jsx(SelectListValueControl, {
+			value: props.value,
+			onChange: props.onChange,
+			testId: props.testId,
+			arity,
+			autoFocus: props.autoFocus,
+			fieldLabel: props.fieldLabel,
+			options: props.kind.values.map((entry) => ({
+				value: entry,
+				label: entry
+			}))
+		});
+		case "relation": return jsx(RelationValueControl, {
+			...props,
+			to: props.kind.to,
+			...props.kind.by === void 0 ? {} : { by: props.kind.by },
+			arity
+		});
+		case "boolean": return jsx(BooleanValueControl, {
+			...props,
+			arity
+		});
+		default: return jsx(ScalarValueInput, {
+			...props,
+			arity
+		});
+	}
+}
+//#endregion
+//#region src/list-kit/filter-builder/filter-row.tsx
+const ROW_CLASS = "flex min-w-0 items-center gap-2";
+const FIELD_CLASS = "h-8 min-w-0 shrink basis-40";
+const OPERATOR_CLASS = "h-8 min-w-0 shrink basis-[9.5rem]";
+function FilterRow(props) {
+	const { row, path, available, onPatch, onRemove, testIdBase, debounceMs } = props;
+	const t = useOptionalT();
+	const base = `${testIdBase}:row:${path.join("-")}`;
+	const spec = available.find((s) => s.field === row.field);
+	const removeLabel = t("filters.removeRow", { defaultValue: "Remove filter" });
+	if (!spec) return jsxs("div", {
+		className: ROW_CLASS,
+		children: [
+			jsx(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				disabled: true,
+				"data-testid": `${base}:field`,
+				className: cn(FIELD_CLASS, "justify-start truncate opacity-60"),
+				children: row.field
+			}),
+			jsx("div", { className: "flex-1" }),
+			jsx(Button, {
+				type: "button",
+				variant: "ghost",
+				size: "icon",
+				"aria-label": removeLabel,
+				"data-testid": `${base}:remove`,
+				onClick: () => onRemove(path),
+				className: "shrink-0",
+				children: jsx(IconX, {
+					className: "h-4 w-4",
+					"aria-hidden": "true"
+				})
+			})
+		]
+	});
+	const fieldTestId = `${base}:field`;
+	const opTestId = `${base}:op`;
+	const handleFieldChange = (field) => {
+		const op = available.find((s) => s.field === field)?.operators[0] ?? row.op;
+		onPatch(path, {
+			field,
+			op
+		});
+	};
+	const handleOpChange = (op) => onPatch(path, { op });
+	const handleValueChange = (value) => onPatch(path, { value });
+	const fieldAriaLabel = t("filters.field", { defaultValue: "Field" });
+	const operatorAriaLabel = t("filters.operator", { defaultValue: "Operator" });
+	return jsxs("div", {
+		className: ROW_CLASS,
+		children: [
+			jsxs(Select, {
+				value: row.field,
+				onValueChange: handleFieldChange,
+				children: [jsx(SelectTrigger, {
+					"data-testid": fieldTestId,
+					"aria-label": fieldAriaLabel,
+					className: FIELD_CLASS,
+					children: jsx(SelectValue, {})
+				}), jsx(SelectContent, { children: available.map((s) => jsx(SelectItem, {
+					value: s.field,
+					"data-testid": `${fieldTestId}:option:${s.field}`,
+					children: s.label
+				}, s.field)) })]
+			}),
+			jsxs(Select, {
+				value: row.op,
+				onValueChange: handleOpChange,
+				children: [jsx(SelectTrigger, {
+					"data-testid": opTestId,
+					"aria-label": operatorAriaLabel,
+					className: OPERATOR_CLASS,
+					children: jsx(SelectValue, {})
+				}), jsx(SelectContent, { children: spec.operators.map((op) => jsx(SelectItem, {
+					value: op,
+					"data-testid": `${opTestId}:option:${op}`,
+					children: t(`filters.operators.${op}`, { defaultValue: op })
+				}, op)) })]
+			}),
+			jsx("div", {
+				className: "min-w-0 flex-1",
+				children: jsx(FilterValueControl, {
+					kind: spec.kind,
+					op: row.op,
+					value: row.value,
+					onChange: handleValueChange,
+					testId: `${base}:value`,
+					debounceMs,
+					fieldLabel: spec.label,
+					options: spec.options,
+					fill: true
+				})
+			}),
+			jsx(Button, {
+				type: "button",
+				variant: "ghost",
+				size: "icon",
+				"aria-label": removeLabel,
+				"data-testid": `${base}:remove`,
+				onClick: () => onRemove(path),
+				className: "shrink-0",
+				children: jsx(IconX, {
+					className: "h-4 w-4",
+					"aria-hidden": "true"
+				})
+			})
+		]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/filter-group-editor.tsx
+const JOIN_VALUES = ["and", "or"];
+const GROUP_CLASS = "grid grid-cols-[auto_minmax(0,1fr)] items-start gap-2";
+const CONNECTOR_CLASS = "pt-1.5 text-right text-sm text-muted-foreground";
+function FilterGroupEditor(props) {
+	const { group, onChange } = props;
+	const addGroupAt = (targetPath) => onChange(addGroup(group, targetPath));
+	return jsx(GroupEditorInner, {
+		...props,
+		addGroupAt
+	});
+}
+function GroupEditorInner(props) {
+	const { group, path, available, onChange, testIdBase, onRemove, addGroupAt, debounceMs } = props;
+	const t = useOptionalT();
+	const base = `${testIdBase}:group:${path.join("-")}`;
+	const canNestGroup = depthOf(path) < 3;
+	const joinLabel = (join) => t(`filters.${join}`, { defaultValue: join });
+	const handlePatch = (rowPath, patch) => {
+		const index = rowPath[rowPath.length - 1];
+		if (index === void 0) return;
+		onChange(updateRow(group, [index], patch));
+	};
+	const handleRemove = (nodePath) => {
+		const index = nodePath[nodePath.length - 1];
+		if (index === void 0) return;
+		onChange(removeAt(group, [index]));
+	};
+	const handleChildGroupChange = (index, next) => {
+		if (next === group.rows[index]) return;
+		const rows = group.rows.slice();
+		rows[index] = next;
+		onChange({
+			...group,
+			rows
+		});
+	};
+	const handleAddRow = () => onChange(addRow(group, [], available));
+	const handleAddGroup = () => addGroupAt(path);
+	const handleSetJoin = (join) => onChange(setJoin(group, [], join));
+	const otherJoin = group.join === "and" ? "or" : "and";
+	return jsxs("div", {
+		className: GROUP_CLASS,
+		"data-testid": base,
+		children: [
+			group.rows.map((node, index) => {
+				const childPath = [...path, index];
+				return jsxs(Fragment, { children: [jsxs("div", {
+					className: CONNECTOR_CLASS,
+					children: [
+						index === 0 && t("filters.where", { defaultValue: "Where" }),
+						index === 1 && jsx("button", {
+							type: "button",
+							"data-testid": `${base}:join`,
+							"aria-label": t("filters.toggleJoin", {
+								defaultValue: `Join: ${joinLabel(group.join)} — activate to switch to ${joinLabel(otherJoin)}`,
+								params: {
+									current: joinLabel(group.join),
+									next: joinLabel(otherJoin)
+								}
+							}),
+							"aria-pressed": group.join === "or",
+							onClick: () => handleSetJoin(otherJoin),
+							className: "inline-grid justify-items-end rounded-xs font-medium text-foreground underline underline-offset-2 hover:no-underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
+							children: JOIN_VALUES.map((j) => jsx("span", {
+								className: cn("col-start-1 row-start-1", j !== group.join && "invisible"),
+								children: joinLabel(j)
+							}, j))
+						}),
+						index >= 2 && joinLabel(group.join)
+					]
+				}), isDraftGroup(node) ? jsx("div", {
+					className: "min-w-0 rounded-md border bg-muted/30 p-2",
+					children: jsx(GroupEditorInner, {
+						group: node,
+						path: childPath,
+						available,
+						onChange: (next) => handleChildGroupChange(index, next),
+						testIdBase,
+						onRemove: handleRemove,
+						addGroupAt,
+						debounceMs
+					})
+				}) : jsx(FilterRow, {
+					row: node,
+					path: childPath,
+					available,
+					onPatch: handlePatch,
+					onRemove: handleRemove,
+					testIdBase,
+					debounceMs
+				})] }, node.rowId);
+			}),
+			jsx("div", { "aria-hidden": "true" }),
+			jsxs("div", {
+				className: "flex items-center gap-2",
+				children: [
+					jsxs(Button, {
+						type: "button",
+						variant: "ghost",
+						size: "sm",
+						"data-testid": `${base}:add-row`,
+						onClick: handleAddRow,
+						children: [jsx(IconPlus, {
+							className: "h-4 w-4",
+							"aria-hidden": "true"
+						}), t("filters.addRow", { defaultValue: "Add filter" })]
+					}),
+					canNestGroup && jsxs(Button, {
+						type: "button",
+						variant: "ghost",
+						size: "sm",
+						"data-testid": `${base}:add-group`,
+						onClick: handleAddGroup,
+						children: [jsx(IconFolderPlus, {
+							className: "h-4 w-4",
+							"aria-hidden": "true"
+						}), t("filters.addGroup", { defaultValue: "Add group" })]
+					}),
+					onRemove && jsxs(Button, {
+						type: "button",
+						variant: "ghost",
+						size: "sm",
+						"data-testid": `${base}:remove`,
+						onClick: () => onRemove(path),
+						children: [jsx(IconX, {
+							className: "h-4 w-4",
+							"aria-hidden": "true"
+						}), t("filters.removeGroup", { defaultValue: "Remove group" })]
+					})
+				]
+			})
+		]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/filter-panel.tsx
+function countGroupRows(group) {
+	let total = 0;
+	for (const row of group.rows) total += "rows" in row ? countGroupRows(row) : 1;
+	return total;
+}
+function FilterPanel(props) {
+	const { group, setGroup, available, setPage, testIdBase, open, onOpenChange, focusPath, externalRemoval } = props;
+	const t = useOptionalT();
+	const [draft, setDraft] = useState(() => toDraft(group));
+	const wasOpenRef = useRef(open);
+	const topLevelIdsRef = useRef([]);
+	const panelRef = useRef(null);
+	useEffect(() => {
+		if (open && !wasOpenRef.current) {
+			const seeded = toDraft(group);
+			setDraft(seeded);
+			topLevelIdsRef.current = seeded.rows.map((node) => node.rowId);
+			if (focusPath && focusPath.length > 0) {
+				const targetTestId = `${testIdBase}:row:${focusPath.join("-")}:field`;
+				requestAnimationFrame(() => {
+					panelRef.current?.querySelector(`[data-testid="${targetTestId}"]`)?.focus();
+				});
+			}
+		}
+		wasOpenRef.current = open;
+	}, [open]);
+	useEffect(() => {
+		if (!externalRemoval) return;
+		const { index } = externalRemoval;
+		const rowId = topLevelIdsRef.current[index];
+		topLevelIdsRef.current = topLevelIdsRef.current.filter((_, i) => i !== index);
+		if (rowId === void 0) return;
+		setDraft((current) => {
+			const foundIndex = current.rows.findIndex((node) => node.rowId === rowId);
+			return foundIndex < 0 ? current : removeAt(current, [foundIndex]);
+		});
+	}, [externalRemoval]);
+	const handleApply = () => {
+		setGroup(pruneIncompleteRows(fromDraft(draft)));
+		setPage(1);
+		onOpenChange(false);
+	};
+	const handleReset = () => setDraft(EMPTY_DRAFT());
+	const appliedCount = countGroupRows(group);
+	return jsxs(Popover, {
+		open,
+		onOpenChange,
+		children: [jsx(PopoverTrigger, {
+			asChild: true,
+			children: jsxs(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				"data-testid": `${testIdBase}:button`,
+				children: [
+					jsx(IconFilter, {
+						className: "h-4 w-4",
+						"aria-hidden": "true"
+					}),
+					t("filters.title", { defaultValue: "Filters" }),
+					appliedCount > 0 && jsx("span", {
+						"data-testid": `${testIdBase}:count`,
+						className: "ml-1 rounded-full bg-primary px-1.5 text-xs text-primary-foreground",
+						children: appliedCount
+					})
+				]
+			})
+		}), jsxs(PopoverContent, {
+			ref: panelRef,
+			"data-testid": `${testIdBase}:panel`,
+			align: "start",
+			className: "w-[min(46rem,calc(100vw-2rem))]",
+			children: [jsx(FilterGroupEditor, {
+				group: draft,
+				path: [],
+				available,
+				onChange: setDraft,
+				testIdBase,
+				debounceMs: 0
+			}), jsxs("div", {
+				className: "mt-3 flex justify-end gap-2 border-t pt-3",
+				children: [jsx(Button, {
+					type: "button",
+					variant: "ghost",
+					size: "sm",
+					"data-testid": `${testIdBase}:reset`,
+					onClick: handleReset,
+					children: t("filters.reset", { defaultValue: "Reset" })
+				}), jsx(Button, {
+					type: "button",
+					size: "sm",
+					"data-testid": `${testIdBase}:apply`,
+					onClick: handleApply,
+					children: t("filters.apply", { defaultValue: "Apply" })
+				})]
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/pinned-filter-controls.tsx
+function isEmptyValue(value) {
+	return value === void 0 || value === "" || Array.isArray(value) && value.length === 0;
+}
+function PinnedFilterControls(props) {
+	const { pinnedFields, value, set, testIdBase } = props;
+	return jsx(Fragment$1, { children: pinnedFields.map((spec) => jsx(PinnedControl, {
+		spec,
+		value,
+		set,
+		testIdBase
+	}, spec.field)) });
+}
+function PinnedControl(props) {
+	const { spec, value, set, testIdBase } = props;
+	const op = spec.operators[0] ?? "eq";
+	const index = findOwnedIndex(value, spec);
+	const owned = index >= 0 ? value[index] : void 0;
+	const handleChange = (next) => {
+		if (isEmptyValue(next)) {
+			if (index < 0) return;
+			set(value.filter((_, i) => i !== index));
+			return;
+		}
+		const predicate = {
+			field: spec.field,
+			op,
+			value: next
+		};
+		if (index < 0) set([...value, predicate]);
+		else {
+			const nextValue = value.slice();
+			nextValue[index] = predicate;
+			set(nextValue);
+		}
+	};
+	return jsx(FilterValueControl, {
+		kind: spec.kind,
+		op,
+		value: owned?.value,
+		onChange: handleChange,
+		testId: `${testIdBase}:pinned:${spec.field}`,
+		fieldLabel: spec.label,
+		placeholder: spec.label,
+		options: spec.options
+	});
+}
+//#endregion
+//#region src/list-kit/filter-builder/filter-builder.tsx
+const EMPTY_PINNED_FIELDS = Object.freeze([]);
+const EMPTY_PINNED_VALUE = Object.freeze([]);
+function FilterBuilder(props) {
+	const { group, setGroup, available, fixed, pinnedFields = EMPTY_PINNED_FIELDS, pinnedValue = EMPTY_PINNED_VALUE, setPinnedValue, setPage, testIdBase } = props;
+	const [open, setOpen] = useState(false);
+	const [focusPath, setFocusPath] = useState(void 0);
+	const [externalRemoval, setExternalRemoval] = useState(void 0);
+	const handleOpenChange = (next) => {
+		setOpen(next);
+		if (!next) setFocusPath(void 0);
+	};
+	const setGroupResettingPage = (next) => {
+		setPage(1);
+		setGroup(next);
+	};
+	const setPinnedResettingPage = (next) => {
+		setPage(1);
+		setPinnedValue?.(next);
+	};
+	return jsxs(Fragment$1, { children: [
+		jsx(PinnedFilterControls, {
+			pinnedFields,
+			value: pinnedValue,
+			set: setPinnedResettingPage,
+			testIdBase
+		}),
+		available.length > 0 && jsx(FilterPanel, {
+			group,
+			setGroup,
+			available,
+			setPage,
+			testIdBase,
+			open,
+			onOpenChange: handleOpenChange,
+			focusPath,
+			externalRemoval
+		}),
+		jsx(FilterBadges, {
+			group,
+			setGroup: setGroupResettingPage,
+			available,
+			fixed,
+			pinnedFields,
+			pinnedValue,
+			setPinnedValue: setPinnedResettingPage,
+			testIdBase,
+			onOpenAt: (path) => {
+				setFocusPath(path);
+				setOpen(true);
+			},
+			onRemoved: (index) => setExternalRemoval({ index })
+		})
+	] });
+}
+//#endregion
+export { TableHeader as C, badgeVariants as E, TableHead as S, Badge as T, SelectValue as _, FilterBadges as a, TableCaption as b, Select as c, SelectItem as d, SelectLabel as f, SelectTrigger as g, SelectSeparator as h, FilterValueControl as i, SelectContent as l, SelectScrollUpButton as m, PinnedFilterControls as n, formatDate as o, SelectScrollDownButton as p, FilterPanel as r, formatNumber as s, FilterBuilder as t, SelectGroup as u, Table as v, TableRow as w, TableCell as x, TableBody as y };
+
+//# sourceMappingURL=filter-builder-DOnaXNfP.js.map