@rakun-kit/manager-react 1.4.5 → 1.4.6

package/dist/esm/router/dashboard/[contentType]/[edit]/_fields/DynamicDataControl.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getListField, isDynamicDataSourceContentTypeAllowed, isTranslatableObject, } from '@rakun-kit/core/client';
-import { Cable, ChevronRight, HelpCircle, Link2, ListFilter, X } from 'lucide-react';
+import { DYNAMIC_QUERY_CURRENT_VALUE_KEY, getListField, isDynamicDataSourceContentTypeAllowed, isTranslatableObject, } from '@rakun-kit/core/client';
+import { Cable, ChevronRight, HelpCircle, Link2, ListFilter, Plus, Trash2, X, } from 'lucide-react';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { Badge } from '../../../../../components/ui/badge.js';
 import { Button } from '../../../../../components/ui/button.js';
@@ -130,12 +130,24 @@ const nestedSourceFieldOptions = ({ contentType, prefix = '', targetField, depth
         return [];
     if (field.config.type === 'Relation' && depth < 3) {
         const relationContentType = field.contentType;
-        return nestedSourceFieldOptions({
-            contentType: relationContentType,
-            prefix: path,
-            targetField,
-            depth: depth + 1,
-        });
+        const idOption = isCompatibleSourceKind('string', targetField)
+            ? [
+                {
+                    label: fieldLabel(`${path}._id`),
+                    value: `${path}._id`,
+                    kind: 'string',
+                },
+            ]
+            : [];
+        return [
+            ...idOption,
+            ...nestedSourceFieldOptions({
+                contentType: relationContentType,
+                prefix: path,
+                targetField,
+                depth: depth + 1,
+            }),
+        ];
     }
     if (field.config.type === 'File') {
         const fieldOption = areFieldKindsCompatible(field, targetField)
@@ -200,17 +212,55 @@ const sourceContentTypeLabel = (source, documentContentTypeName) => source.conte
     ? 'Current document'
     : source.contentType;
 const getSourceContentTypes = (contentTypes) => contentTypes.filter((sourceContentType) => isDynamicDataSourceContentTypeAllowed(sourceContentType));
-const readFilterState = (filter) => {
-    const entry = filter ? Object.entries(filter)[0] : undefined;
-    if (!entry)
-        return undefined;
-    const [field, value] = entry;
+const operatorByMongoOperator = {
+    $eq: 'equals',
+    $ne: 'notEquals',
+    $contains: 'contains',
+    $in: 'in',
+    $nin: 'notIn',
+    $gt: 'greaterThan',
+    $gte: 'greaterThanOrEqual',
+    $lt: 'lessThan',
+    $lte: 'lessThanOrEqual',
+};
+const readFilterOperand = (value) => {
+    if (isRecord(value) &&
+        typeof value[DYNAMIC_QUERY_CURRENT_VALUE_KEY] === 'string') {
+        return {
+            value: value[DYNAMIC_QUERY_CURRENT_VALUE_KEY],
+            valueSource: 'current',
+        };
+    }
+    return {
+        value: Array.isArray(value) ? value.join(', ') : String(value ?? ''),
+    };
+};
+const filterConditionFromEntry = (field, value) => {
     if (value === true)
         return { field, operator: 'true', value: '' };
     if (value === false)
         return { field, operator: 'false', value: '' };
-    if (isRecord(value) && typeof value.$contains === 'string') {
-        return { field, operator: 'contains', value: value.$contains };
+    const directOperand = readFilterOperand(value);
+    if (directOperand.valueSource === 'current') {
+        return { field, operator: 'equals', ...directOperand };
+    }
+    if (isRecord(value)) {
+        if (typeof value.$exists === 'boolean') {
+            return {
+                field,
+                operator: value.$exists ? 'exists' : 'notExists',
+                value: '',
+            };
+        }
+        const operatorEntry = Object.entries(value).find(([operator]) => operator in operatorByMongoOperator);
+        if (operatorEntry) {
+            const [operator, operatorValue] = operatorEntry;
+            return {
+                field,
+                operator: operatorByMongoOperator[operator],
+                ...readFilterOperand(operatorValue),
+            };
+        }
     }
     return {
         field,
@@ -218,31 +268,122 @@ const readFilterState = (filter) => {
         value: typeof value === 'string' ? value : String(value ?? ''),
     };
 };
-const buildFilter = (state) => {
-    if (!state?.field)
-        return undefined;
-    if (state.operator === 'true')
-        return { [state.field]: true };
-    if (state.operator === 'false')
-        return { [state.field]: false };
-    if (!state.value.trim())
+export const readFilterState = (filter) => {
+    if (!filter)
+        return { combinator: 'and', conditions: [] };
+    const logicalEntry = ['$and', '$or'].find((key) => Array.isArray(filter[key]));
+    if (logicalEntry) {
+        const conditions = filter[logicalEntry].flatMap((item) => isRecord(item)
+            ? Object.entries(item)
+                .filter(([field]) => !field.startsWith('$'))
+                .map(([field, value]) => filterConditionFromEntry(field, value))
+            : []);
+        return {
+            combinator: logicalEntry === '$or' ? 'or' : 'and',
+            conditions,
+        };
+    }
+    return {
+        combinator: 'and',
+        conditions: Object.entries(filter)
+            .filter(([field]) => !field.startsWith('$'))
+            .map(([field, value]) => filterConditionFromEntry(field, value)),
+    };
+};
+const operatorNeedsValue = (operator) => !['true', 'false', 'exists', 'notExists'].includes(operator);
+const parseFilterValue = (condition, fieldOptions) => {
+    const kind = fieldOptions.find((option) => option.value === condition.field)?.kind;
+    const parseValue = (value) => kind === 'number' && value.trim() !== '' && Number.isFinite(Number(value))
+        ? Number(value)
+        : value.trim();
+    if (condition.operator === 'in' || condition.operator === 'notIn') {
+        return condition.value
+            .split(',')
+            .map((value) => value.trim())
+            .filter(Boolean)
+            .map(parseValue);
+    }
+    return parseValue(condition.value);
+};
+const buildFilterCondition = (condition, fieldOptions) => {
+    if (!condition.field)
         return undefined;
-    if (state.operator === 'contains') {
-        return { [state.field]: { $contains: state.value } };
+    if (condition.operator === 'true')
+        return { [condition.field]: true };
+    if (condition.operator === 'false')
+        return { [condition.field]: false };
+    if (condition.operator === 'exists') {
+        return { [condition.field]: { $exists: true } };
+    }
+    if (condition.operator === 'notExists') {
+        return { [condition.field]: { $exists: false } };
     }
-    return { [state.field]: state.value };
+    if (!condition.value.trim())
+        return undefined;
+    const value = condition.valueSource === 'current'
+        ? { [DYNAMIC_QUERY_CURRENT_VALUE_KEY]: condition.value }
+        : parseFilterValue(condition, fieldOptions);
+    const mongoOperator = {
+        notEquals: '$ne',
+        contains: '$contains',
+        in: '$in',
+        notIn: '$nin',
+        greaterThan: '$gt',
+        greaterThanOrEqual: '$gte',
+        lessThan: '$lt',
+        lessThanOrEqual: '$lte',
+    };
+    const operator = mongoOperator[condition.operator];
+    return operator
+        ? { [condition.field]: { [operator]: value } }
+        : { [condition.field]: value };
+};
+export const buildFilter = (state, fieldOptions = []) => {
+    const conditions = state.conditions.flatMap((condition) => {
+        const builtCondition = buildFilterCondition(condition, fieldOptions);
+        return builtCondition ? [builtCondition] : [];
+    });
+    if (conditions.length === 0)
+        return undefined;
+    if (conditions.length === 1)
+        return conditions[0];
+    return { [state.combinator === 'or' ? '$or' : '$and']: conditions };
 };
 const filterSummary = (filter) => {
     const state = readFilterState(filter);
-    if (!state)
+    if (state.conditions.length === 0)
         return '';
-    if (state.operator === 'true')
-        return `${state.field} = true`;
-    if (state.operator === 'false')
-        return `${state.field} = false`;
-    if (state.operator === 'contains')
-        return `${state.field} contains ${state.value}`;
-    return `${state.field} = ${state.value}`;
+    const first = state.conditions[0];
+    const operatorLabels = {
+        equals: '=',
+        notEquals: '!=',
+        contains: 'contains',
+        in: 'in',
+        notIn: 'not in',
+        greaterThan: '>',
+        greaterThanOrEqual: '>=',
+        lessThan: '<',
+        lessThanOrEqual: '<=',
+        true: '= true',
+        false: '= false',
+        exists: 'is set',
+        notExists: 'is not set',
+    };
+    const firstSummary = [
+        first.field,
+        operatorLabels[first.operator],
+        operatorNeedsValue(first.operator)
+            ? first.valueSource === 'current'
+                ? `Current document.${first.value}`
+                : first.value
+            : '',
+    ]
+        .filter(Boolean)
+        .join(' ');
+    const remaining = state.conditions.length - 1;
+    return remaining > 0
+        ? `${firstSummary} + ${remaining} ${remaining === 1 ? 'condition' : 'conditions'}`
+        : firstSummary;
 };
 const bindingSummary = ({ list, fieldBinding, listBinding, documentContentTypeName, }) => {
     if (list) {
@@ -377,6 +518,57 @@ const getSortFieldOptions = (contentType) => Object.entries(contentType.fields).
         isSingleSelect;
     return isSortable ? [{ label: fieldLabel(name), value: name, kind }] : [];
 });
+const filterOperatorOptions = {
+    equals: { label: 'Equals', value: 'equals' },
+    notEquals: { label: 'Does not equal', value: 'notEquals' },
+    contains: { label: 'Contains', value: 'contains' },
+    in: { label: 'Is one of', value: 'in' },
+    notIn: { label: 'Is not one of', value: 'notIn' },
+    greaterThan: { label: 'Greater than', value: 'greaterThan' },
+    greaterThanOrEqual: {
+        label: 'Greater than or equal',
+        value: 'greaterThanOrEqual',
+    },
+    lessThan: { label: 'Less than', value: 'lessThan' },
+    lessThanOrEqual: {
+        label: 'Less than or equal',
+        value: 'lessThanOrEqual',
+    },
+    true: { label: 'Is true', value: 'true' },
+    false: { label: 'Is false', value: 'false' },
+    exists: { label: 'Is set', value: 'exists' },
+    notExists: { label: 'Is not set', value: 'notExists' },
+};
+const getFilterOperatorOptions = (kind) => {
+    const operators = kind === 'boolean'
+        ? ['true', 'false', 'exists', 'notExists']
+        : kind === 'number' || kind === 'date'
+            ? [
+                'equals',
+                'notEquals',
+                'greaterThan',
+                'greaterThanOrEqual',
+                'lessThan',
+                'lessThanOrEqual',
+                'in',
+                'notIn',
+                'exists',
+                'notExists',
+            ]
+            : kind === 'string' || kind === 'richText'
+                ? [
+                    'equals',
+                    'notEquals',
+                    'contains',
+                    'in',
+                    'notIn',
+                    'exists',
+                    'notExists',
+                ]
+                : ['equals', 'notEquals', 'exists', 'notExists'];
+    return operators.map((operator) => filterOperatorOptions[operator]);
+};
+const defaultFilterOperator = (kind) => (kind === 'boolean' ? 'true' : 'equals');
 const createRelatedCollectionSource = ({ contentType, currentSource, targetField, }) => {
     const relation = getRelatedRelationOptions(contentType, currentSource)[0];
     const path = getRelatedPathOptions(contentType, targetField)[0]?.value;
@@ -457,7 +649,7 @@ const MappingSourceEditor = ({ contentTypes, currentSource, targetField, source,
                                     })
                                     : undefined, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'asc', children: "Ascending" }), _jsx(SelectItem, { value: 'desc', children: "Descending" })] })] })] })] })] }));
 };
-const ListBindingEditor = ({ contentTypes, field, binding, onChange, }) => {
+const ListBindingEditor = ({ contentTypes, documentContentType, field, binding, onChange, }) => {
     const [sourceType, setSourceType] = useState(binding?.contentType || '');
     const [itemName, setItemName] = useState(binding?.itemName || field.fields[0]?.name || '');
     const [filterState, setFilterState] = useState(readFilterState(binding?.query?.filter));
@@ -473,6 +665,15 @@ const ListBindingEditor = ({ contentTypes, field, binding, onChange, }) => {
     const filterFieldOptions = selectedSource
         ? sourceFieldOptions(selectedSource).filter((item) => item.value !== '$href')
         : [];
+    const currentDocumentFieldOptions = [
+        { label: '_id', value: '_id', kind: 'string' },
+        ...sourceFieldOptions(documentContentType).filter((item) => item.value !== '$href' &&
+            item.kind !== 'object' &&
+            item.kind !== 'array'),
+    ];
+    const sortEntry = Object.entries(binding?.query?.options?.sort ?? {})[0];
+    const sortField = sortEntry?.[0] ?? '';
+    const sortDirection = sortEntry?.[1] ?? 'desc';
     const emit = (patch) => {
         const next = {
             contentType: sourceType,
@@ -492,57 +693,124 @@ const ListBindingEditor = ({ contentTypes, field, binding, onChange, }) => {
         emit({
             query: {
                 ...binding?.query,
-                filter: buildFilter(nextFilterState),
+                filter: buildFilter(nextFilterState, filterFieldOptions),
             },
         });
     };
+    const updateFilterCondition = (index, nextCondition) => {
+        const conditions = [...filterState.conditions];
+        conditions[index] = nextCondition;
+        updateFilter({ ...filterState, conditions });
+    };
     return (_jsxs("div", { className: 'grid gap-3', children: [_jsx(PanelSection, { title: 'Collection', children: _jsxs("div", { className: 'grid gap-3 md:grid-cols-2', children: [_jsxs(Label, { className: 'grid gap-1.5', children: ["Source", _jsxs(Select, { disabled: contentTypes.length === 0, value: sourceType, onValueChange: (value) => {
                                         setSourceType(value);
-                                        emit({ contentType: value, map: {} });
+                                        const nextFilterState = {
+                                            combinator: 'and',
+                                            conditions: [],
+                                        };
+                                        setFilterState(nextFilterState);
+                                        emit({
+                                            contentType: value,
+                                            map: {},
+                                            query: {
+                                                options: {
+                                                    limit: binding?.query?.options?.limit ?? 10,
+                                                },
+                                            },
+                                        });
                                     }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: contentTypes.length > 0 ? 'Content type' : 'No content types' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: contentTypes.map((ct) => (_jsx(SelectItem, { value: ct.name, children: ct.name }, ct.name))) }) })] })] }), _jsxs(Label, { className: 'grid gap-1.5', children: ["Item", _jsxs(Select, { disabled: !sourceType || field.fields.length === 0, value: itemName, onValueChange: (value) => {
                                         setItemName(value);
                                         emit({ itemName: value, map: {} });
-                                    }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: field.fields.length > 0 ? 'Item type' : 'No item types' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: field.fields.map((item) => (_jsx(SelectItem, { value: item.name, children: item.name }, item.name))) }) })] })] })] }) }), _jsx(PanelSection, { title: 'Query', children: _jsxs("div", { className: 'grid gap-3 md:grid-cols-[0.7fr_1fr_1.1fr]', children: [_jsxs(Label, { className: 'grid gap-1.5', children: ["Limit", _jsx(Input, { type: 'number', min: 1, value: String(binding?.query?.options?.limit ?? 10), onChange: (event) => emit({
-                                        query: {
-                                            ...binding?.query,
-                                            options: {
-                                                ...binding?.query?.options,
-                                                limit: Number(event.target.value || 10),
+                                    }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: field.fields.length > 0 ? 'Item type' : 'No item types' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: field.fields.map((item) => (_jsx(SelectItem, { value: item.name, children: item.name }, item.name))) }) })] })] })] }) }), _jsxs(PanelSection, { title: 'Query', children: [_jsxs("div", { className: 'grid grid-cols-[minmax(5rem,0.4fr)_minmax(0,1.2fr)_minmax(8rem,0.6fr)] items-end gap-3', children: [_jsxs(Label, { className: 'grid gap-1.5', children: ["Limit", _jsx(Input, { type: 'number', min: 1, max: 100, value: String(binding?.query?.options?.limit ?? 10), onChange: (event) => emit({
+                                            query: {
+                                                ...binding?.query,
+                                                options: {
+                                                    ...binding?.query?.options,
+                                                    limit: Math.min(100, Math.max(1, Number(event.target.value || 10))),
+                                                },
                                             },
-                                        },
-                                    }) })] }), _jsxs(Label, { className: 'grid gap-1.5', children: ["Sort", _jsxs(Select, { disabled: sortFieldOptions.length === 0, value: Object.keys(binding?.query?.options?.sort ?? {})[0] ?? '', onValueChange: (value) => emit({
-                                        query: {
-                                            ...binding?.query,
-                                            options: {
-                                                ...binding?.query?.options,
-                                                sort: value ? { [value]: 'desc' } : undefined,
+                                        }) })] }), _jsxs(Label, { className: 'grid min-w-0 gap-1.5', children: ["Sort by", _jsxs(Select, { disabled: sortFieldOptions.length === 0, value: sortField || '__none__', onValueChange: (value) => emit({
+                                            query: {
+                                                ...binding?.query,
+                                                options: {
+                                                    ...binding?.query?.options,
+                                                    sort: value === '__none__'
+                                                        ? undefined
+                                                        : { [value]: sortDirection },
+                                                },
                                             },
-                                        },
-                                    }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: sortFieldOptions.length > 0
-                                                    ? 'Field'
-                                                    : 'No sortable fields' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: sortFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) }) })] })] }), _jsxs("div", { className: 'grid gap-1.5', children: [_jsxs("div", { className: 'flex items-center justify-between gap-2', children: [_jsx("span", { className: 'text-sm font-medium', children: "Filter" }), _jsxs(Button, { type: 'button', size: 'icon', variant: 'ghost', className: 'size-7', onClick: () => updateFilter(undefined), children: [_jsx(X, { className: 'h-4 w-4' }), _jsx("span", { className: 'sr-only', children: "Clear filter" })] })] }), _jsxs("div", { className: 'grid gap-2 sm:grid-cols-[1fr_0.9fr_1fr]', children: [_jsxs(Select, { disabled: filterFieldOptions.length === 0, value: filterState?.field || '', onValueChange: (value) => updateFilter(value
-                                                ? {
-                                                    field: value,
-                                                    operator: filterState?.operator ?? 'equals',
-                                                    value: filterState?.value ?? '',
-                                                }
-                                                : undefined), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: filterFieldOptions.length > 0
-                                                            ? 'Field'
-                                                            : 'No filterable fields' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: filterFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) }) })] }), _jsxs(Select, { disabled: !filterState?.field, value: filterState?.operator || 'equals', onValueChange: (value) => filterState
-                                                ? updateFilter({
+                                        }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: sortFieldOptions.length > 0
+                                                        ? 'Sort by field'
+                                                        : 'No sortable fields' }) }), _jsx(SelectContent, { children: _jsxs(SelectGroup, { children: [_jsx(SelectItem, { value: '__none__', children: "No sort" }), sortFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value)))] }) })] })] }), _jsxs(Label, { className: 'grid gap-1.5', children: ["Direction", _jsxs(Select, { disabled: !sortField, value: sortDirection, onValueChange: (direction) => sortField
+                                            ? emit({
+                                                query: {
+                                                    ...binding?.query,
+                                                    options: {
+                                                        ...binding?.query?.options,
+                                                        sort: {
+                                                            [sortField]: direction,
+                                                        },
+                                                    },
+                                                },
+                                            })
+                                            : undefined, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'asc', children: "Ascending" }), _jsx(SelectItem, { value: 'desc', children: "Descending" })] })] })] })] }), _jsxs("div", { className: 'grid gap-3 rounded-md border border-border bg-background/60 p-3', children: [_jsxs("div", { className: 'flex flex-wrap items-center justify-between gap-2', children: [_jsxs("div", { children: [_jsx("div", { className: 'text-sm font-medium', children: "Conditions" }), _jsx("div", { className: 'text-xs text-muted-foreground', children: "Filter the records used to build this list." })] }), _jsxs("div", { className: 'flex items-center gap-2', children: [filterState.conditions.length > 1 ? (_jsxs(Select, { value: filterState.combinator, onValueChange: (combinator) => updateFilter({
+                                                    ...filterState,
+                                                    combinator: combinator,
+                                                }), children: [_jsx(SelectTrigger, { className: 'h-8 w-36', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'and', children: "Match all" }), _jsx(SelectItem, { value: 'or', children: "Match any" })] })] })) : null, _jsxs(Button, { type: 'button', size: 'sm', variant: 'outline', disabled: filterFieldOptions.length === 0 ||
+                                                    filterState.conditions.length >= 25, onClick: () => updateFilter({
                                                     ...filterState,
-                                                    operator: value,
-                                                    value: value === 'true' || value === 'false'
-                                                        ? ''
-                                                        : filterState.value,
-                                                })
-                                                : undefined, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: 'Operator' }) }), _jsx(SelectContent, { children: _jsxs(SelectGroup, { children: [_jsx(SelectItem, { value: 'equals', children: "equals" }), _jsx(SelectItem, { value: 'contains', children: "contains" }), _jsx(SelectItem, { value: 'true', children: "true" }), _jsx(SelectItem, { value: 'false', children: "false" })] }) })] }), filterState?.operator === 'true' ||
-                                            filterState?.operator === 'false' ? (_jsx("div", { className: 'h-9 rounded-md border border-dashed border-border bg-background/60' })) : (_jsx(Input, { value: filterState?.value ?? '', disabled: !filterState?.field, onChange: (event) => filterState
-                                                ? updateFilter({
+                                                    conditions: [
+                                                        ...filterState.conditions,
+                                                        { field: '', operator: 'equals', value: '' },
+                                                    ],
+                                                }), children: [_jsx(Plus, { className: 'h-4 w-4' }), "Add condition"] })] })] }), filterState.conditions.length === 0 ? (_jsx("div", { className: 'rounded-md border border-dashed border-border px-3 py-5 text-center text-sm text-muted-foreground', children: "No conditions. All records from this collection will match." })) : (_jsx("div", { className: 'grid gap-2', children: filterState.conditions.map((condition, index) => {
+                                    const fieldOption = filterFieldOptions.find((option) => option.value === condition.field);
+                                    const operatorOptions = getFilterOperatorOptions(fieldOption?.kind);
+                                    const needsValue = operatorNeedsValue(condition.operator);
+                                    const currentValueOptions = currentDocumentFieldOptions.filter((option) => !fieldOption || option.kind === fieldOption.kind);
+                                    const allowsCurrentValue = condition.operator !== 'in' &&
+                                        condition.operator !== 'notIn' &&
+                                        currentValueOptions.length > 0;
+                                    return (_jsxs("div", { className: 'grid items-center gap-2 rounded-md border border-border bg-background p-2 sm:grid-cols-[1.2fr_1fr_1.8fr_auto]', children: [_jsxs(Select, { disabled: filterFieldOptions.length === 0, value: condition.field, onValueChange: (value) => {
+                                                    const kind = filterFieldOptions.find((option) => option.value === value)?.kind;
+                                                    updateFilterCondition(index, {
+                                                        field: value,
+                                                        operator: defaultFilterOperator(kind),
+                                                        value: '',
+                                                    });
+                                                }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: 'Field' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: filterFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) }) })] }), _jsxs(Select, { disabled: !condition.field, value: condition.operator, onValueChange: (operator) => updateFilterCondition(index, {
+                                                    ...condition,
+                                                    operator: operator,
+                                                    valueSource: operator === 'in' || operator === 'notIn'
+                                                        ? 'literal'
+                                                        : condition.valueSource,
+                                                    value: operatorNeedsValue(operator)
+                                                        ? operator === 'in' || operator === 'notIn'
+                                                            ? ''
+                                                            : condition.value
+                                                        : '',
+                                                }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: 'Operator' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: operatorOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) }) })] }), needsValue ? (_jsxs("div", { className: 'grid grid-cols-[minmax(7rem,0.7fr)_minmax(0,1fr)] gap-2', children: [_jsxs(Select, { value: condition.valueSource ?? 'literal', onValueChange: (valueSource) => updateFilterCondition(index, {
+                                                            ...condition,
+                                                            valueSource: valueSource,
+                                                            value: '',
+                                                        }), children: [_jsx(SelectTrigger, { className: 'w-full', "aria-label": 'Value source', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'literal', children: "Fixed value" }), allowsCurrentValue ? (_jsx(SelectItem, { value: 'current', children: "Current document" })) : null] })] }), condition.valueSource === 'current' ? (_jsxs(Select, { disabled: !condition.field, value: condition.value, onValueChange: (value) => updateFilterCondition(index, {
+                                                            ...condition,
+                                                            value,
+                                                        }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: 'Current field' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: currentValueOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) }) })] })) : (_jsx(Input, { type: fieldOption?.kind === 'number' &&
+                                                            condition.operator !== 'in' &&
+                                                            condition.operator !== 'notIn'
+                                                            ? 'number'
+                                                            : 'text', value: condition.value, disabled: !condition.field, placeholder: condition.operator === 'in' ||
+                                                            condition.operator === 'notIn'
+                                                            ? 'Comma-separated values'
+                                                            : 'Value', onChange: (event) => updateFilterCondition(index, {
+                                                            ...condition,
+                                                            value: event.target.value,
+                                                        }) }))] })) : (_jsx("div", { className: 'h-9 rounded-md border border-dashed border-border bg-muted/30' })), _jsxs(Button, { type: 'button', size: 'icon', variant: 'ghost', className: 'size-9 text-muted-foreground hover:text-destructive', onClick: () => updateFilter({
                                                     ...filterState,
-                                                    value: event.target.value,
-                                                })
-                                                : undefined }))] })] })] }) }), _jsx(PanelSection, { title: 'Mapping', children: _jsx("div", { className: 'grid gap-2', children: targetFields.map(([targetField, targetFieldConfig]) => {
+                                                    conditions: filterState.conditions.filter((_, conditionIndex) => conditionIndex !== index),
+                                                }), children: [_jsx(Trash2, { className: 'h-4 w-4' }), _jsx("span", { className: 'sr-only', children: "Remove condition" })] })] }, `${index}-${condition.field}`));
+                                }) }))] })] }), _jsx(PanelSection, { title: 'Mapping', children: _jsx("div", { className: 'grid gap-2', children: targetFields.map(([targetField, targetFieldConfig]) => {
                         const source = binding?.map?.[targetField];
                         const summary = mappingSourceSummary(source, selectedSource?.name ?? 'Source');
                         const isOpen = openMappingField === targetField;
@@ -641,7 +909,7 @@ export const DynamicDataControl = ({ contentType, documentContentType, fieldName
         setOpen(false);
     };
     const trigger = (_jsxs("div", { className: 'flex min-w-0 items-center gap-1.5', children: [_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: 'button', className: 'min-w-0 cursor-pointer rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', onClick: () => setOpen((value) => !value), children: bound && summary ? (_jsxs(Badge, { variant: 'secondary', className: 'max-w-80 min-w-0 gap-1.5 rounded-md px-2 py-1 hover:bg-secondary/80', children: [list ? (_jsx(ListFilter, { className: 'h-3.5 w-3.5 shrink-0' })) : (_jsx(Link2, { className: 'h-3.5 w-3.5 shrink-0' })), _jsx("span", { className: 'truncate', children: summary })] })) : (_jsxs(Badge, { variant: 'outline', className: 'gap-1.5 rounded-md px-2 py-1 text-muted-foreground', children: [_jsx(Cable, { className: 'h-3.5 w-3.5' }), "Not linked"] })) }) }), _jsx(TooltipContent, { side: 'top', sideOffset: 6, children: triggerLabel })] }), bound ? (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs(Button, { type: 'button', size: 'icon', variant: 'ghost', className: 'size-6', onClick: clearBinding, children: [_jsx(X, { className: 'h-4 w-4' }), _jsx("span", { className: 'sr-only', children: "Clear dynamic data" })] }) }), _jsx(TooltipContent, { side: 'top', sideOffset: 6, children: "Clear dynamic data link" })] })) : null] }));
-    const editor = list ? (_jsx(ListBindingEditor, { contentTypes: sourceContentTypes, field: field, binding: listBinding, onChange: updateListBinding })) : (_jsx(FieldBindingEditor, { contentTypes: fieldSourceContentTypes, documentContentType: currentDocumentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, targetField: field, binding: fieldBinding, onChange: updateFieldBinding }));
+    const editor = list ? (_jsx(ListBindingEditor, { contentTypes: sourceContentTypes, documentContentType: currentDocumentContentType, field: field, binding: listBinding, onChange: updateListBinding })) : (_jsx(FieldBindingEditor, { contentTypes: fieldSourceContentTypes, documentContentType: currentDocumentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, targetField: field, binding: fieldBinding, onChange: updateFieldBinding }));
     const panel = isOpen ? (_jsx("div", { className: 'rounded-md border border-border bg-background p-4 shadow-sm', children: editor })) : null;
     const dialog = (_jsx(Dialog, { open: isOpen, onOpenChange: (value) => {
             if (value) {