@rakun-kit/manager-react 1.5.10 → 1.6.0

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

@@ -2,74 +2,70 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslations } from '../../../../../i18n/index.js';
 import { DYNAMIC_QUERY_CURRENT_VALUE_KEY, DYNAMIC_QUERY_DOCUMENT_VALUE_KEY, ITERATOR_FIELD_NAME, getListField, isDynamicDataSourceContentTypeAllowed, isTranslatableObject, } from '@rakun-kit/core/client';
-import { Cable, ChevronRight, HelpCircle, Link2, ListFilter, Plus, Trash2, X, } from 'lucide-react';
+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';
-import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from '../../../../../components/ui/collapsible.js';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../../../../../components/ui/collapsible.js';
 import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from '../../../../../components/ui/dialog.js';
 import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, } from '../../../../../components/ui/select.js';
-import { Tooltip, TooltipContent, TooltipTrigger, } from '../../../../../components/ui/tooltip.js';
+import { Tooltip, TooltipContent, TooltipTrigger } from '../../../../../components/ui/tooltip.js';
 import { Input } from '../../../../../components/ui/input.js';
 import { Label } from '../../../../../components/ui/label.js';
 import { useManagerQuery } from '../../../../../client/react.js';
 import { useLanguage } from '../../../../../lib/providers/language/LanguageClientProvider.js';
 export const isDynamicFallbackRequired = (field, binding) => field.isRequired && !binding;
 const CURRENT_DOCUMENT_ID = '__rakun_current_document__';
-const cloneDynamicBindings = (bindings) => (bindings ? structuredClone(bindings) : undefined);
+const cloneDynamicBindings = (bindings) => bindings ? structuredClone(bindings) : undefined;
 const cleanDynamicBindings = (bindings) => {
     if (!bindings)
         return undefined;
-    const fields = bindings.fields && Object.keys(bindings.fields).length > 0
-        ? bindings.fields
-        : undefined;
-    const lists = bindings.lists && Object.keys(bindings.lists).length > 0
-        ? bindings.lists
-        : undefined;
+    const fields = bindings.fields && Object.keys(bindings.fields).length > 0 ? bindings.fields : undefined;
+    const lists = bindings.lists && Object.keys(bindings.lists).length > 0 ? bindings.lists : undefined;
     return fields || lists ? { fields, lists } : undefined;
 };
 const isRecord = (value) => !!value && typeof value === 'object' && !Array.isArray(value);
-const isListField = (field) => field.config.ui === 'List' || field.config.ui === 'Iterator';
+const isListField = (field) => field.config.capabilities.dynamic?.collection === 'heterogeneous';
+export const isMappableDynamicListField = (field) => {
+    if (isListField(field))
+        return true;
+    if (field.config.capabilities.dynamic?.collection !== 'homogeneous' || !('field' in field))
+        return false;
+    const itemField = field.field;
+    return !!(itemField.config.capabilities.dynamic?.relation ||
+        itemField.config.capabilities.dynamic?.mapProperties);
+};
 const isRelatedCollectionSource = (source) => !!source && 'kind' in source && source.kind === 'relatedCollection';
 const isNestedListSource = (source) => !!source && 'kind' in source && source.kind === 'list';
-const asListField = (field) => field.config.ui === 'List' || field.config.ui === 'Iterator'
-    ? field
-    : undefined;
+const asMappableListField = (field) => isMappableDynamicListField(field) ? field : undefined;
 const isDynamicVisibleField = (field) => (field.visibility ?? 'all') === 'all' && field.isDynamic !== false;
 const isSelectableDynamicField = (name, field) => name !== ITERATOR_FIELD_NAME && isDynamicVisibleField(field);
+const propertyTargetField = (field, valueKind) => ({
+    ...field,
+    config: {
+        ...field.config,
+        capabilities: { valueKind },
+    },
+});
+const propertyMappingFields = (field) => Object.entries(field.config.capabilities.dynamic?.properties ?? {}).map(([property, valueKind]) => [property, propertyTargetField(field, valueKind)]);
+export const targetMappingFields = (contentType) => contentType
+    ? Object.entries(contentType.fields).flatMap(([name, field]) => {
+        if (!isSelectableDynamicField(name, field))
+            return [];
+        const properties = field.config.capabilities.dynamic?.mapProperties
+            ? propertyMappingFields(field)
+            : [];
+        if (properties.length > 0) {
+            return properties.map(([property, propertyField]) => [`${name}.${property}`, propertyField]);
+        }
+        return [[name, field]];
+    })
+    : [];
 export const isDynamicFieldEnabled = (contentType, field) => {
-    return (contentType.dynamicData !== false &&
-        isDynamicVisibleField(field));
+    return contentType.dynamicData !== false && isDynamicVisibleField(field);
 };
 const getFieldKind = (field) => {
-    if (field.config.type === 'String') {
-        return field.config.ui === 'RichText' ? 'richText' : 'string';
-    }
-    if (field.config.type === 'Link')
-        return 'string';
-    if (field.config.type === 'Number')
-        return 'number';
-    if (field.config.type === 'Boolean')
-        return 'boolean';
-    if (field.config.type === 'Date') {
-        return field.config.ui === 'Time' ? 'string' : 'date';
-    }
-    if (field.config.type === 'Select') {
-        return field.isMultiple ? 'array' : 'string';
-    }
-    if (field.config.type === 'ContentReference') {
-        return field.isMultiple ? 'array' : 'string';
-    }
-    if (field.config.type === 'File') {
-        return field.isMultiple ? 'array' : 'object';
-    }
-    if (field.config.type === 'Relation')
-        return 'object';
-    if (field.config.ui === 'SimpleList')
-        return 'array';
-    if (isListField(field))
-        return 'array';
-    return 'unknown';
+    return field.config.capabilities.valueKind;
 };
 const isCompatibleSourceKind = (sourceKind, targetField) => {
     if (!targetField)
@@ -97,35 +93,12 @@ const areFieldKindsCompatible = (sourceField, targetField) => {
 };
 const fieldLabel = (path) => path.startsWith('_seo.') ? `seo.${path.slice('_seo.'.length)}` : path;
 const isSeoPath = (path) => path.split('.').some((segment) => segment === '_seo' || segment === 'seo');
-const fileFieldOptions = (path, targetField) => {
-    const options = [
-        { label: fieldLabel(`${path}.url`), value: `${path}.url`, kind: 'string' },
-        {
-            label: fieldLabel(`${path}.previewUrl`),
-            value: `${path}.previewUrl`,
-            kind: 'string',
-        },
-        { label: fieldLabel(`${path}.name`), value: `${path}.name`, kind: 'string' },
-        {
-            label: fieldLabel(`${path}.title`),
-            value: `${path}.title`,
-            kind: 'string',
-        },
-        { label: fieldLabel(`${path}.alt`), value: `${path}.alt`, kind: 'string' },
-        { label: fieldLabel(`${path}.mime`), value: `${path}.mime`, kind: 'string' },
-        {
-            label: fieldLabel(`${path}.srcSet`),
-            value: `${path}.srcSet`,
-            kind: 'string',
-        },
-        { label: fieldLabel(`${path}.width`), value: `${path}.width`, kind: 'number' },
-        {
-            label: fieldLabel(`${path}.height`),
-            value: `${path}.height`,
-            kind: 'number',
-        },
-        { label: fieldLabel(`${path}.size`), value: `${path}.size`, kind: 'number' },
-    ];
+const propertyFieldOptions = (path, field, targetField) => {
+    const options = Object.entries(field.config.capabilities.dynamic?.properties ?? {}).map(([property, kind]) => ({
+        label: fieldLabel(`${path}.${property}`),
+        value: `${path}.${property}`,
+        kind,
+    }));
     return options.filter((option) => isCompatibleSourceKind(option.kind, targetField));
 };
 const nestedSourceFieldOptions = ({ contentType, prefix = '', targetField, depth = 0, }) => Object.entries(contentType.fields).flatMap(([name, field]) => {
@@ -135,7 +108,7 @@ const nestedSourceFieldOptions = ({ contentType, prefix = '', targetField, depth
     const kind = getFieldKind(field);
     if (isSeoPath(path))
         return [];
-    if (field.config.type === 'Relation' && depth < 3) {
+    if (field.config.capabilities.dynamic?.relation && depth < 3) {
         const relationContentType = field.contentType;
         const idOption = isCompatibleSourceKind('string', targetField)
             ? [
@@ -156,7 +129,8 @@ const nestedSourceFieldOptions = ({ contentType, prefix = '', targetField, depth
             }),
         ];
     }
-    if (field.config.type === 'File') {
+    const properties = field.config.capabilities.dynamic?.properties;
+    if (properties) {
         const fieldOption = areFieldKindsCompatible(field, targetField)
             ? [
                 {
@@ -166,25 +140,9 @@ const nestedSourceFieldOptions = ({ contentType, prefix = '', targetField, depth
                 },
             ]
             : [];
-        if (field.isMultiple)
-            return fieldOption;
-        return [...fieldOption, ...fileFieldOptions(path, targetField)];
-    }
-    if (field.config.type === 'Link') {
-        const fieldOption = targetField?.config.type === 'Link' &&
-            areFieldKindsCompatible(field, targetField)
-            ? [{ label: fieldLabel(path), value: path, kind }]
-            : [];
-        const propertyOptions = ['href', 'title'].flatMap((property) => isCompatibleSourceKind('string', targetField)
-            ? [
-                {
-                    label: fieldLabel(`${path}.${property}`),
-                    value: `${path}.${property}`,
-                    kind: 'string',
-                },
-            ]
-            : []);
-        return [...fieldOption, ...propertyOptions];
+        return kind === 'object'
+            ? [...fieldOption, ...propertyFieldOptions(path, field, targetField)]
+            : fieldOption;
     }
     if (!areFieldKindsCompatible(field, targetField))
         return [];
@@ -202,17 +160,14 @@ export const sourceFieldOptions = (contentType, targetField) => {
     const fields = nestedSourceFieldOptions({ contentType, targetField });
     const includeHref = contentType.routes?.some((route) => route.hasPage) &&
         isCompatibleSourceKind('string', targetField);
-    return includeHref
-        ? [{ label: 'href', value: '$href', kind: 'string' }, ...fields]
-        : fields;
+    return includeHref ? [{ label: 'href', value: '$href', kind: 'string' }, ...fields] : fields;
 };
 const currentDocumentListSourceValue = (path, itemName) => `current-document:${path}:${itemName ?? ''}`;
 export const currentDocumentListSourceOptions = (contentType) => Object.entries(contentType.fields).flatMap(([name, field]) => {
     if (!isSelectableDynamicField(name, field) || field.isTranslatable)
         return [];
-    if (field.config.ui === 'List' || field.config.ui === 'Iterator') {
-        const relationEntries = field.fields.filter((entry) => entry.name !== ITERATOR_FIELD_NAME &&
-            entry.field.config.type === 'Relation');
+    if (field.config.capabilities.dynamic?.collection === 'heterogeneous' && 'fields' in field) {
+        const relationEntries = field.fields.filter((entry) => entry.name !== ITERATOR_FIELD_NAME && entry.field.config.capabilities.dynamic?.relation);
         return relationEntries.map((entry) => ({
             label: relationEntries.length === 1
                 ? `Current document · ${name}`
@@ -223,9 +178,9 @@ export const currentDocumentListSourceOptions = (contentType) => Object.entries(
             itemName: entry.name,
         }));
     }
-    if (field.config.ui === 'SimpleList') {
+    if (field.config.capabilities.dynamic?.collection === 'homogeneous' && 'field' in field) {
         const itemField = field.field;
-        if (itemField.config.type !== 'Relation')
+        if (!itemField.config.capabilities.dynamic?.relation)
             return [];
         return [
             {
@@ -238,9 +193,7 @@ export const currentDocumentListSourceOptions = (contentType) => Object.entries(
     }
     return [];
 });
-const createSource = (contentType, value, id) => value === '$href'
-    ? { contentType, id, virtual: 'href' }
-    : { contentType, id, path: value };
+const createSource = (contentType, value, id) => value === '$href' ? { contentType, id, virtual: 'href' } : { contentType, id, path: value };
 const sourceValue = (source) => source?.virtual === 'href' ? '$href' : source?.path || '';
 const sourceLabel = (source) => source?.virtual === 'href' ? 'href' : fieldLabel(source?.path || '');
 const mappingSourceSummary = (source, currentSourceName) => {
@@ -285,15 +238,13 @@ const operatorByMongoOperator = {
     $lte: 'lessThanOrEqual',
 };
 const readFilterOperand = (value) => {
-    if (isRecord(value) &&
-        typeof value[DYNAMIC_QUERY_CURRENT_VALUE_KEY] === 'string') {
+    if (isRecord(value) && typeof value[DYNAMIC_QUERY_CURRENT_VALUE_KEY] === 'string') {
         return {
             value: value[DYNAMIC_QUERY_CURRENT_VALUE_KEY],
             valueSource: 'current',
         };
     }
-    if (isRecord(value) &&
-        typeof value[DYNAMIC_QUERY_DOCUMENT_VALUE_KEY] === 'string') {
+    if (isRecord(value) && typeof value[DYNAMIC_QUERY_DOCUMENT_VALUE_KEY] === 'string') {
         return {
             value: value[DYNAMIC_QUERY_DOCUMENT_VALUE_KEY],
             valueSource: 'document',
@@ -309,8 +260,7 @@ const filterConditionFromEntry = (field, value) => {
     if (value === false)
         return { field, operator: 'false', value: '' };
     const directOperand = readFilterOperand(value);
-    if (directOperand.valueSource === 'current' ||
-        directOperand.valueSource === 'document') {
+    if (directOperand.valueSource === 'current' || directOperand.valueSource === 'document') {
         return { field, operator: 'equals', ...directOperand };
     }
     if (isRecord(value)) {
@@ -405,9 +355,7 @@ const buildFilterCondition = (condition, fieldOptions) => {
         lessThanOrEqual: '$lte',
     };
     const operator = mongoOperator[condition.operator];
-    return operator
-        ? { [condition.field]: { [operator]: value } }
-        : { [condition.field]: value };
+    return operator ? { [condition.field]: { [operator]: value } } : { [condition.field]: value };
 };
 export const buildFilter = (state, fieldOptions = []) => {
     const conditions = state.conditions.flatMap((condition) => {
@@ -477,8 +425,8 @@ const bindingSummary = ({ list, fieldBinding, listBinding, documentContentTypeNa
         return '';
     return `${sourceContentTypeLabel(fieldBinding, documentContentTypeName)} -> ${sourceLabel(fieldBinding)}`;
 };
-const PanelSection = ({ title, children, }) => (_jsxs("div", { className: 'grid gap-3 rounded-md border border-border bg-muted/20 p-3', children: [_jsx("div", { className: 'text-xs font-semibold uppercase text-muted-foreground', children: title }), children] }));
-const ControlLabel = ({ children, help, }) => (_jsxs("div", { className: 'flex items-center gap-1.5', children: [_jsx(Label, { children: children }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: 'button', className: 'rounded-sm text-muted-foreground outline-none hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring', "aria-label": help, children: _jsx(HelpCircle, { className: 'h-3.5 w-3.5' }) }) }), _jsx(TooltipContent, { side: 'top', sideOffset: 6, className: 'max-w-xs', children: help })] })] }));
+const PanelSection = ({ title, children }) => (_jsxs("div", { className: "grid gap-3 rounded-md border border-border bg-muted/20 p-3", children: [_jsx("div", { className: "text-xs font-semibold uppercase text-muted-foreground", children: title }), children] }));
+const ControlLabel = ({ children, help }) => (_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Label, { children: children }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", className: "rounded-sm text-muted-foreground outline-none hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring", "aria-label": help, children: _jsx(HelpCircle, { className: "h-3.5 w-3.5" }) }) }), _jsx(TooltipContent, { side: "top", sideOffset: 6, className: "max-w-xs", children: help })] })] }));
 const FieldBindingEditor = ({ contentTypes, documentContentType, currentDocumentSourceEnabled, targetField, binding, onChange, }) => {
     const t = useTranslations();
     const { language } = useLanguage();
@@ -504,9 +452,7 @@ const FieldBindingEditor = ({ contentTypes, documentContentType, currentDocument
                 },
             },
         },
-        enabled: !!sourceType &&
-            !usesCurrentDocumentSource &&
-            selectedContentType?.dynamicDataSource === true,
+        enabled: !!sourceType && !usesCurrentDocumentSource && selectedContentType?.dynamicDataSource === true,
     });
     const items = (sourceItemsQuery.data?.items ?? []);
     const hasCurrentDocumentItem = currentDocumentSourceEnabled && sourceType === documentContentType.name;
@@ -522,48 +468,72 @@ const FieldBindingEditor = ({ contentTypes, documentContentType, currentDocument
         }
         onChange(createSource(nextType, nextPath, usesCurrentDocument ? undefined : nextId));
     };
-    return (_jsx(PanelSection, { title: 'Source value', children: _jsxs("div", { className: 'grid gap-3 md:grid-cols-[1fr_1.4fr_1fr]', children: [_jsxs(Label, { className: 'grid gap-1.5', children: [t('dynamicData.source'), _jsxs(Select, { disabled: contentTypes.length === 0, value: sourceType, onValueChange: (value) => {
-                                const nextId = currentDocumentSourceEnabled &&
-                                    value === documentContentType.name
+    return (_jsx(PanelSection, { title: "Source value", children: _jsxs("div", { className: "grid gap-3 md:grid-cols-[1fr_1.4fr_1fr]", children: [_jsxs(Label, { className: "grid gap-1.5", children: [t('dynamicData.source'), _jsxs(Select, { disabled: contentTypes.length === 0, value: sourceType, onValueChange: (value) => {
+                                const nextId = currentDocumentSourceEnabled && value === documentContentType.name
                                     ? CURRENT_DOCUMENT_ID
                                     : '';
                                 setSourceType(value);
                                 setSourceId(nextId);
                                 setFieldPath('');
                                 onChange(undefined);
-                            }, 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: currentDocumentSourceEnabled &&
-                                                ct.name === documentContentType.name
+                            }, 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: currentDocumentSourceEnabled && ct.name === documentContentType.name
                                                 ? `${ct.name} (current document)`
-                                                : ct.name }, ct.name))) }) })] })] }), _jsxs(Label, { className: 'grid gap-1.5', children: [t('dynamicData.item'), _jsxs(Select, { disabled: !sourceType || !hasItemOptions, value: sourceId, onValueChange: (value) => {
+                                                : ct.name }, ct.name))) }) })] })] }), _jsxs(Label, { className: "grid gap-1.5", children: [t('dynamicData.item'), _jsxs(Select, { disabled: !sourceType || !hasItemOptions, value: sourceId, onValueChange: (value) => {
                                 setSourceId(value);
                                 emit(sourceType, value, fieldPath);
-                            }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: hasItemOptions ? 'Item' : 'No items available' }) }), _jsx(SelectContent, { children: _jsxs(SelectGroup, { children: [hasCurrentDocumentItem ? (_jsx(SelectItem, { value: CURRENT_DOCUMENT_ID, children: t('dynamicData.currentDocument') })) : null, items.map((item) => {
+                            }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: hasItemOptions ? 'Item' : 'No items available' }) }), _jsx(SelectContent, { children: _jsxs(SelectGroup, { children: [hasCurrentDocumentItem ? (_jsx(SelectItem, { value: CURRENT_DOCUMENT_ID, children: t('dynamicData.currentDocument') })) : null, items.map((item) => {
                                                 const label = selectedContentType
                                                     ? getListField(item, selectedContentType.listFields ?? [])
                                                     : item._id;
                                                 return (_jsx(SelectItem, { value: item._id, children: isTranslatableObject(label)
                                                         ? label[language.code]
                                                         : String(label || item._id) }, item._id));
-                                            })] }) })] })] }), _jsxs(Label, { className: 'grid gap-1.5', children: [t('dynamicData.field'), _jsxs(Select, { disabled: !sourceType || !sourceId || fieldOptions.length === 0, value: fieldPath, onValueChange: (value) => {
+                                            })] }) })] })] }), _jsxs(Label, { className: "grid gap-1.5", children: [t('dynamicData.field'), _jsxs(Select, { disabled: !sourceType || !sourceId || fieldOptions.length === 0, value: fieldPath, onValueChange: (value) => {
                                 setFieldPath(value);
                                 emit(sourceType, sourceId, value);
-                            }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: fieldOptions.length > 0 ? 'Field' : 'No compatible fields' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: fieldOptions.map((field) => (_jsx(SelectItem, { value: field.value, children: field.label }, field.value))) }) })] })] })] }) }));
+                            }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: fieldOptions.length > 0 ? 'Field' : 'No compatible fields' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: fieldOptions.map((field) => (_jsx(SelectItem, { value: field.value, children: field.label }, field.value))) }) })] })] })] }) }));
 };
 const getListTargetContentType = (field, itemName) => {
-    const entry = field.fields.find((item) => item.name === itemName);
-    if (!entry || entry.field.config.type !== 'Relation')
+    if (field.config.capabilities.dynamic?.collection === 'homogeneous') {
+        const itemField = field.field;
+        return itemField.config.capabilities.dynamic?.relation
+            ? itemField.contentType
+            : undefined;
+    }
+    const listField = field;
+    const entry = listField.fields.find((item) => item.name === itemName);
+    if (!entry || !entry.field.config.capabilities.dynamic?.relation)
         return undefined;
     return entry.field.contentType;
 };
+const getListItemOptions = (field) => {
+    if (field.config.capabilities.dynamic?.collection !== 'homogeneous') {
+        return field.fields.filter((item) => item.name !== ITERATOR_FIELD_NAME);
+    }
+    const itemField = field.field;
+    const name = itemField.config.capabilities.dynamic?.relation
+        ? itemField.contentType.name
+        : (itemField.config.editor ?? itemField.config.type);
+    return [{ name, field: itemField }];
+};
+export const listItemTargetFields = (field, itemName) => {
+    if (field.config.capabilities.dynamic?.collection === 'homogeneous') {
+        const itemField = field.field;
+        if (itemField.config.capabilities.dynamic?.mapProperties) {
+            return propertyMappingFields(itemField);
+        }
+    }
+    return targetMappingFields(getListTargetContentType(field, itemName));
+};
 const getRelationContentType = (field) => {
     if (field.isTranslatable)
         return undefined;
-    if (field.config.type === 'Relation') {
+    if (field.config.capabilities.dynamic?.relation) {
         return field.contentType;
     }
-    if (field.config.ui === 'SimpleList') {
+    if (field.config.capabilities.dynamic?.collection === 'homogeneous' && 'field' in field) {
         const itemField = field.field;
-        if (itemField.config.type === 'Relation') {
+        if (itemField.config.capabilities.dynamic?.relation) {
             return itemField.contentType;
         }
     }
@@ -584,13 +554,7 @@ const getSortFieldOptions = (contentType) => Object.entries(contentType.fields).
         return [];
     }
     const kind = getFieldKind(field);
-    const isSingleSelect = field.config.type === 'Select' &&
-        !field.isMultiple;
-    const isSortable = (field.config.type === 'String' && field.config.ui !== 'RichText') ||
-        field.config.type === 'Number' ||
-        field.config.type === 'Boolean' ||
-        field.config.type === 'Date' ||
-        isSingleSelect;
+    const isSortable = ['string', 'number', 'boolean', 'date'].includes(kind);
     return isSortable ? [{ label: fieldLabel(name), value: name, kind }] : [];
 });
 const filterOperatorOptions = {
@@ -631,19 +595,11 @@ const getFilterOperatorOptions = (kind) => {
                 'notExists',
             ]
             : kind === 'string' || kind === 'richText'
-                ? [
-                    'equals',
-                    'notEquals',
-                    'contains',
-                    'in',
-                    'notIn',
-                    'exists',
-                    'notExists',
-                ]
+                ? ['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 defaultFilterOperator = (kind) => kind === 'boolean' ? 'true' : 'equals';
 const createRelatedCollectionSource = ({ contentType, currentSource, targetField, }) => {
     const relation = getRelatedRelationOptions(contentType, currentSource)[0];
     const path = getRelatedPathOptions(contentType, targetField)[0]?.value;
@@ -659,12 +615,10 @@ const createRelatedCollectionSource = ({ contentType, currentSource, targetField
 };
 const MappingSourceEditor = ({ contentTypes, rootDocumentContentType, currentSource, targetField, source, onChange, }) => {
     const t = useTranslations();
-    const nestedListTarget = asListField(targetField);
+    const nestedListTarget = asMappableListField(targetField);
     const nestedSource = isNestedListSource(source) ? source : undefined;
     const relatedSource = isRelatedCollectionSource(source) ? source : undefined;
-    const directSource = source && !isRelatedCollectionSource(source) && !isNestedListSource(source)
-        ? source
-        : undefined;
+    const directSource = source && !isRelatedCollectionSource(source) && !isNestedListSource(source) ? source : undefined;
     const directFieldOptions = sourceFieldOptions(currentSource, targetField);
     const relatedContentTypes = contentTypes.filter((contentType) => getRelatedRelationOptions(contentType, currentSource).length > 0 &&
         getRelatedPathOptions(contentType, targetField).length > 0);
@@ -684,7 +638,9 @@ const MappingSourceEditor = ({ contentTypes, rootDocumentContentType, currentSou
     const sortField = sortEntry?.[0] ?? '';
     const sortDirection = sortEntry?.[1] ?? 'desc';
     const createNestedSource = () => {
-        const nestedItemName = nestedListTarget?.fields.find((item) => item.name !== ITERATOR_FIELD_NAME)?.name;
+        const nestedItemName = nestedListTarget
+            ? getListItemOptions(nestedListTarget)[0]?.name
+            : undefined;
         if (!nestedItemName)
             return undefined;
         return {
@@ -696,13 +652,13 @@ const MappingSourceEditor = ({ contentTypes, rootDocumentContentType, currentSou
         };
     };
     if (nestedSource && nestedListTarget) {
-        return (_jsxs("div", { className: 'grid gap-3', children: [_jsxs("div", { className: 'grid max-w-sm content-start gap-1.5', children: [_jsx(ControlLabel, { help: t('dynamicData.nestedListHelp'), children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: 'list', onValueChange: (value) => {
+        return (_jsxs("div", { className: "grid gap-3", children: [_jsxs("div", { className: "grid max-w-sm content-start gap-1.5", children: [_jsx(ControlLabel, { help: t('dynamicData.nestedListHelp'), children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: "list", onValueChange: (value) => {
                                 if (value === 'field')
                                     onChange(undefined);
-                            }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'field', children: t('dynamicData.directField') }), _jsx(SelectItem, { value: 'list', children: t('dynamicData.nestedList') })] })] })] }), _jsx(ListBindingEditor, { contentTypes: contentTypes, documentContentType: currentSource, rootDocumentContentType: rootDocumentContentType, currentItemContentType: currentSource, currentDocumentSourceEnabled: true, field: nestedListTarget, binding: nestedSource, onChange: (binding) => onChange(binding ? { ...binding, kind: 'list' } : undefined) })] }));
+                            }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "field", children: t('dynamicData.directField') }), _jsx(SelectItem, { value: "list", children: t('dynamicData.nestedList') })] })] })] }), _jsx(ListBindingEditor, { contentTypes: contentTypes, documentContentType: currentSource, rootDocumentContentType: rootDocumentContentType, currentItemContentType: currentSource, currentDocumentSourceEnabled: true, field: nestedListTarget, binding: nestedSource, onChange: (binding) => onChange(binding ? { ...binding, kind: 'list' } : undefined) })] }));
     }
     if (!relatedSource) {
-        return (_jsxs("div", { className: 'grid gap-3 md:grid-cols-[0.7fr_1.3fr]', children: [_jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: 'Choose a direct field or query a related collection.', children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: 'field', onValueChange: (value) => {
+        return (_jsxs("div", { className: "grid gap-3 md:grid-cols-[0.7fr_1.3fr]", children: [_jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: "Choose a direct field or query a related collection.", children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: "field", onValueChange: (value) => {
                                 if (value === 'list') {
                                     onChange(createNestedSource());
                                     return;
@@ -717,11 +673,9 @@ const MappingSourceEditor = ({ contentTypes, rootDocumentContentType, currentSou
                                 }))
                                     .find(Boolean);
                                 onChange(next);
-                            }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'field', children: t('dynamicData.directField') }), relatedContentTypes.length > 0 ? (_jsx(SelectItem, { value: 'relatedCollection', children: t('dynamicData.relatedCollection') })) : null, nestedListTarget ? (_jsx(SelectItem, { value: 'list', children: t('dynamicData.nestedList') })) : null] })] })] }), _jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsxs(ControlLabel, { help: 'Its value will be assigned to this mapped property.', children: [t('dynamicData.fieldOn'), " ", currentSource.name] }), _jsxs(Select, { disabled: directFieldOptions.length === 0, value: sourceValue(directSource), onValueChange: (value) => onChange(createSource(currentSource.name, value)), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: directFieldOptions.length > 0
-                                            ? 'Select a source field'
-                                            : 'No compatible fields' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: directFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) }) })] })] })] }));
+                            }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "field", children: t('dynamicData.directField') }), relatedContentTypes.length > 0 ? (_jsx(SelectItem, { value: "relatedCollection", children: t('dynamicData.relatedCollection') })) : null, nestedListTarget ? (_jsx(SelectItem, { value: "list", children: t('dynamicData.nestedList') })) : null] })] })] }), _jsxs("div", { className: "grid content-start gap-1.5", children: [_jsxs(ControlLabel, { help: "Its value will be assigned to this mapped property.", children: [t('dynamicData.fieldOn'), " ", currentSource.name] }), _jsxs(Select, { disabled: directFieldOptions.length === 0, value: sourceValue(directSource), onValueChange: (value) => onChange(createSource(currentSource.name, value)), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: directFieldOptions.length > 0 ? 'Select a source field' : 'No compatible fields' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: directFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value))) }) })] })] })] }));
     }
-    return (_jsxs("div", { className: 'grid gap-3', children: [_jsxs("div", { className: 'grid gap-3 sm:grid-cols-2 lg:grid-cols-4', children: [_jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: 'Query records related to the current source item.', children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: 'relatedCollection', onValueChange: (value) => onChange(value === 'list' ? createNestedSource() : undefined), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'field', children: t('dynamicData.directField') }), _jsx(SelectItem, { value: 'relatedCollection', children: t('dynamicData.relatedCollection') }), nestedListTarget ? (_jsx(SelectItem, { value: 'list', children: t('dynamicData.nestedList') })) : null] })] })] }), _jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: 'Content type whose records will be searched.', children: t('dynamicData.collectionToQuery') }), _jsxs(Select, { disabled: relatedContentTypes.length === 0, value: relatedSource.contentType, onValueChange: (value) => {
+    return (_jsxs("div", { className: "grid gap-3", children: [_jsxs("div", { className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-4", children: [_jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: "Query records related to the current source item.", children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: "relatedCollection", onValueChange: (value) => onChange(value === 'list' ? createNestedSource() : undefined), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "field", children: t('dynamicData.directField') }), _jsx(SelectItem, { value: "relatedCollection", children: t('dynamicData.relatedCollection') }), nestedListTarget ? (_jsx(SelectItem, { value: "list", children: t('dynamicData.nestedList') })) : null] })] })] }), _jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: "Content type whose records will be searched.", children: t('dynamicData.collectionToQuery') }), _jsxs(Select, { disabled: relatedContentTypes.length === 0, value: relatedSource.contentType, onValueChange: (value) => {
                                     const contentType = relatedContentTypes.find((item) => item.name === value);
                                     if (!contentType)
                                         return;
@@ -730,66 +684,49 @@ const MappingSourceEditor = ({ contentTypes, rootDocumentContentType, currentSou
                                         currentSource,
                                         targetField,
                                     }));
-                                }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: relatedContentTypes.length > 0
+                                }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: relatedContentTypes.length > 0
                                                 ? 'Select a content type'
-                                                : 'No compatible collections' }) }), _jsx(SelectContent, { children: relatedContentTypes.map((contentType) => (_jsx(SelectItem, { value: contentType.name, children: contentType.name }, contentType.name))) })] })] }), _jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsxs(ControlLabel, { help: `Field on ${relatedSource.contentType} that points to ${currentSource.name}.`, children: [t('dynamicData.relationTo'), " ", currentSource.name] }), _jsxs(Select, { disabled: relationOptions.length === 0, value: relatedSource.relation, onValueChange: (relation) => onChange({ ...relatedSource, relation }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: relationOptions.length > 0
-                                                ? 'Select a relation field'
-                                                : 'No compatible relations' }) }), _jsx(SelectContent, { children: relationOptions.map((relation) => (_jsx(SelectItem, { value: relation, children: relation }, relation))) })] })] }), _jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: 'Arrays from matching records are flattened into one result.', children: t('dynamicData.arrayFieldToCollect') }), _jsxs(Select, { disabled: pathOptions.length === 0, value: relatedSource.path, onValueChange: (path) => onChange({ ...relatedSource, path }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: pathOptions.length > 0
-                                                ? 'Select an array field'
-                                                : 'No compatible array fields' }) }), _jsx(SelectContent, { children: pathOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) })] })] })] }), _jsxs("div", { className: 'grid gap-3 sm:grid-cols-[0.7fr_1fr_0.7fr]', children: [_jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: `Number of ${relatedSource.contentType} records queried per ${currentSource.name}. Minimum 1, maximum 100.`, children: t('dynamicData.maximumRelatedRecords') }), _jsx(Input, { type: 'number', min: 1, max: 100, value: String(relatedSource.limit), onChange: (event) => onChange({
+                                                : 'No compatible collections' }) }), _jsx(SelectContent, { children: relatedContentTypes.map((contentType) => (_jsx(SelectItem, { value: contentType.name, children: contentType.name }, contentType.name))) })] })] }), _jsxs("div", { className: "grid content-start gap-1.5", children: [_jsxs(ControlLabel, { help: `Field on ${relatedSource.contentType} that points to ${currentSource.name}.`, children: [t('dynamicData.relationTo'), " ", currentSource.name] }), _jsxs(Select, { disabled: relationOptions.length === 0, value: relatedSource.relation, onValueChange: (relation) => onChange({ ...relatedSource, relation }), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: relationOptions.length > 0 ? 'Select a relation field' : 'No compatible relations' }) }), _jsx(SelectContent, { children: relationOptions.map((relation) => (_jsx(SelectItem, { value: relation, children: relation }, relation))) })] })] }), _jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: "Arrays from matching records are flattened into one result.", children: t('dynamicData.arrayFieldToCollect') }), _jsxs(Select, { disabled: pathOptions.length === 0, value: relatedSource.path, onValueChange: (path) => onChange({ ...relatedSource, path }), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: pathOptions.length > 0 ? 'Select an array field' : 'No compatible array fields' }) }), _jsx(SelectContent, { children: pathOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) })] })] })] }), _jsxs("div", { className: "grid gap-3 sm:grid-cols-[0.7fr_1fr_0.7fr]", children: [_jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: `Number of ${relatedSource.contentType} records queried per ${currentSource.name}. Minimum 1, maximum 100.`, children: t('dynamicData.maximumRelatedRecords') }), _jsx(Input, { type: "number", min: 1, max: 100, value: String(relatedSource.limit), onChange: (event) => onChange({
                                     ...relatedSource,
                                     limit: Math.min(100, Math.max(1, Number(event.target.value || 10))),
-                                }) })] }), _jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: 'Optional. Only direct scalar fields can be used.', children: t('dynamicData.sortRelatedRecordsBy') }), _jsxs(Select, { value: sortField || '__none__', onValueChange: (value) => onChange({
+                                }) })] }), _jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: "Optional. Only direct scalar fields can be used.", children: t('dynamicData.sortRelatedRecordsBy') }), _jsxs(Select, { value: sortField || '__none__', onValueChange: (value) => onChange({
                                     ...relatedSource,
-                                    sort: value === '__none__'
-                                        ? undefined
-                                        : { [value]: sortDirection },
-                                }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: t('dynamicData.noSort') }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: '__none__', children: t('dynamicData.noSort') }), sortOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value)))] })] })] }), _jsxs("div", { className: 'grid content-start gap-1.5', children: [_jsx(ControlLabel, { help: 'Applied before collecting and flattening the arrays.', children: t('dynamicData.sortDirection') }), _jsxs(Select, { disabled: !sortField, value: sortDirection, onValueChange: (direction) => sortField
+                                    sort: value === '__none__' ? undefined : { [value]: sortDirection },
+                                }), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: t('dynamicData.noSort') }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "__none__", children: t('dynamicData.noSort') }), sortOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value)))] })] })] }), _jsxs("div", { className: "grid content-start gap-1.5", children: [_jsx(ControlLabel, { help: "Applied before collecting and flattening the arrays.", children: t('dynamicData.sortDirection') }), _jsxs(Select, { disabled: !sortField, value: sortDirection, onValueChange: (direction) => sortField
                                     ? onChange({
                                         ...relatedSource,
                                         sort: { [sortField]: direction },
                                     })
-                                    : undefined, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'asc', children: t('dynamicData.ascending') }), _jsx(SelectItem, { value: 'desc', children: t('dynamicData.descending') })] })] })] })] })] }));
+                                    : undefined, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "asc", children: t('dynamicData.ascending') }), _jsx(SelectItem, { value: "desc", children: t('dynamicData.descending') })] })] })] })] })] }));
 };
 const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentContentType, currentItemContentType, currentDocumentSourceEnabled, field, binding, onChange, }) => {
     const t = useTranslations();
-    const itemOptions = field.fields.filter((item) => item.name !== ITERATOR_FIELD_NAME);
+    const itemOptions = getListItemOptions(field);
     const documentSourceOptions = currentDocumentSourceEnabled
         ? currentDocumentListSourceOptions(documentContentType)
         : [];
     const initialDocumentSource = binding?.source
-        ? documentSourceOptions.find((option) => option.path === binding.source?.path &&
-            option.itemName === binding.source?.itemName)
+        ? documentSourceOptions.find((option) => option.path === binding.source?.path && option.itemName === binding.source?.itemName)
         : undefined;
     const [sourceType, setSourceType] = useState(initialDocumentSource?.value || binding?.contentType || '');
     const [itemName, setItemName] = useState(binding?.itemName || itemOptions[0]?.name || '');
     const [filterState, setFilterState] = useState(readFilterState(binding?.query?.filter));
     const [openMappingField, setOpenMappingField] = useState(null);
     const selectedDocumentSource = documentSourceOptions.find((option) => option.value === sourceType);
-    const selectedSource = selectedDocumentSource?.contentType ??
-        contentTypes.find((ct) => ct.name === sourceType);
-    const targetContentType = getListTargetContentType(field, itemName);
-    const targetFields = useMemo(() => targetContentType
-        ? Object.entries(targetContentType.fields).filter(([targetFieldName, targetField]) => isSelectableDynamicField(targetFieldName, targetField))
-        : [], [targetContentType]);
-    const sortFieldOptions = selectedSource
-        ? getSortFieldOptions(selectedSource)
-        : [];
+    const selectedSource = selectedDocumentSource?.contentType ?? contentTypes.find((ct) => ct.name === sourceType);
+    const targetFields = useMemo(() => listItemTargetFields(field, itemName), [field, itemName]);
+    const sortFieldOptions = selectedSource ? getSortFieldOptions(selectedSource) : [];
     const filterFieldOptions = selectedSource
         ? sourceFieldOptions(selectedSource).filter((item) => item.value !== '$href')
         : [];
     const currentDocumentFieldOptions = [
         { label: '_id', value: '_id', kind: 'string' },
-        ...sourceFieldOptions(rootDocumentContentType).filter((item) => item.value !== '$href' &&
-            item.kind !== 'object' &&
-            item.kind !== 'array'),
+        ...sourceFieldOptions(rootDocumentContentType).filter((item) => item.value !== '$href' && item.kind !== 'object' && item.kind !== 'array'),
     ];
     const currentItemFieldOptions = currentItemContentType
         ? [
             { label: '_id', value: '_id', kind: 'string' },
-            ...sourceFieldOptions(currentItemContentType).filter((item) => item.value !== '$href' &&
-                item.kind !== 'object' &&
-                item.kind !== 'array'),
+            ...sourceFieldOptions(currentItemContentType).filter((item) => item.value !== '$href' && item.kind !== 'object' && item.kind !== 'array'),
         ]
         : [];
     const sortEntry = Object.entries(binding?.query?.options?.sort ?? {})[0];
@@ -809,9 +746,7 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
             source,
             itemName,
             map: binding?.map ?? {},
-            query: source
-                ? undefined
-                : (binding?.query ?? { options: { limit: 10 } }),
+            query: source ? undefined : (binding?.query ?? { options: { limit: 10 } }),
             ...patch,
         };
         if (!next.contentType || !next.itemName) {
@@ -834,7 +769,7 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
         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: [t('dynamicData.source'), _jsxs(Select, { disabled: contentTypes.length === 0 && documentSourceOptions.length === 0, value: sourceType, onValueChange: (value) => {
+    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: [t('dynamicData.source'), _jsxs(Select, { disabled: contentTypes.length === 0 && documentSourceOptions.length === 0, value: sourceType, onValueChange: (value) => {
                                         const documentSource = documentSourceOptions.find((option) => option.value === value);
                                         setSourceType(value);
                                         const nextFilterState = {
@@ -862,12 +797,12 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
                                                     },
                                                 },
                                         });
-                                    }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: contentTypes.length > 0 || documentSourceOptions.length > 0
+                                    }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: contentTypes.length > 0 || documentSourceOptions.length > 0
                                                     ? 'Content type or document list'
-                                                    : 'No compatible sources' }) }), _jsx(SelectContent, { children: _jsxs(SelectGroup, { children: [documentSourceOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))), contentTypes.map((ct) => (_jsx(SelectItem, { value: ct.name, children: ct.name }, ct.name)))] }) })] })] }), _jsxs(Label, { className: 'grid gap-1.5', children: [t('dynamicData.item'), _jsxs(Select, { disabled: !sourceType || itemOptions.length === 0, value: itemName, onValueChange: (value) => {
+                                                    : 'No compatible sources' }) }), _jsx(SelectContent, { children: _jsxs(SelectGroup, { children: [documentSourceOptions.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))), contentTypes.map((ct) => (_jsx(SelectItem, { value: ct.name, children: ct.name }, ct.name)))] }) })] })] }), _jsxs(Label, { className: "grid gap-1.5", children: [t('dynamicData.item'), _jsxs(Select, { disabled: !sourceType || itemOptions.length === 0, value: itemName, onValueChange: (value) => {
                                         setItemName(value);
                                         emit({ itemName: value, map: {} });
-                                    }, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: itemOptions.length > 0 ? 'Item type' : 'No item types' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: itemOptions.map((item) => (_jsx(SelectItem, { value: item.name, children: item.name }, item.name))) }) })] })] })] }) }), selectedDocumentSource ? null : (_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: [t('dynamicData.limit'), _jsx(Input, { type: 'number', min: 1, max: 100, value: String(binding?.query?.options?.limit ?? 10), onChange: (event) => emit({
+                                    }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: itemOptions.length > 0 ? 'Item type' : 'No item types' }) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: itemOptions.map((item) => (_jsx(SelectItem, { value: item.name, children: item.name }, item.name))) }) })] })] })] }) }), selectedDocumentSource ? null : (_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: [t('dynamicData.limit'), _jsx(Input, { type: "number", min: 1, max: 100, value: String(binding?.query?.options?.limit ?? 10), onChange: (event) => emit({
                                             query: {
                                                 ...binding?.query,
                                                 options: {
@@ -875,19 +810,15 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
                                                     limit: Math.min(100, Math.max(1, Number(event.target.value || 10))),
                                                 },
                                             },
-                                        }) })] }), _jsxs(Label, { className: 'grid min-w-0 gap-1.5', children: [t('dynamicData.sortBy'), _jsxs(Select, { disabled: sortFieldOptions.length === 0, value: sortField || '__none__', onValueChange: (value) => emit({
+                                        }) })] }), _jsxs(Label, { className: "grid min-w-0 gap-1.5", children: [t('dynamicData.sortBy'), _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 },
+                                                    sort: value === '__none__' ? undefined : { [value]: sortDirection },
                                                 },
                                             },
-                                        }), 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: t('dynamicData.noSort') }), sortFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value)))] }) })] })] }), _jsxs(Label, { className: 'grid gap-1.5', children: [t('dynamicData.direction'), _jsxs(Select, { disabled: !sortField, value: sortDirection, onValueChange: (direction) => sortField
+                                        }), 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: t('dynamicData.noSort') }), sortFieldOptions.map((item) => (_jsx(SelectItem, { value: item.value, children: item.label }, item.value)))] }) })] })] }), _jsxs(Label, { className: "grid gap-1.5", children: [t('dynamicData.direction'), _jsxs(Select, { disabled: !sortField, value: sortDirection, onValueChange: (direction) => sortField
                                             ? emit({
                                                 query: {
                                                     ...binding?.query,
@@ -899,17 +830,16 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
                                                     },
                                                 },
                                             })
-                                            : undefined, children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: 'asc', children: t('dynamicData.ascending') }), _jsx(SelectItem, { value: 'desc', children: t('dynamicData.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: t('dynamicData.conditions') }), _jsx("div", { className: 'text-xs text-muted-foreground', children: t('dynamicData.conditionsDescription') })] }), _jsxs("div", { className: 'flex items-center gap-2', children: [filterState.conditions.length > 1 ? (_jsxs(Select, { value: filterState.combinator, onValueChange: (combinator) => updateFilter({
+                                            : undefined, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "asc", children: t('dynamicData.ascending') }), _jsx(SelectItem, { value: "desc", children: t('dynamicData.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: t('dynamicData.conditions') }), _jsx("div", { className: "text-xs text-muted-foreground", children: t('dynamicData.conditionsDescription') })] }), _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: t('dynamicData.matchAll') }), _jsx(SelectItem, { value: 'or', children: t('dynamicData.matchAny') })] })] })) : null, _jsxs(Button, { type: 'button', size: 'sm', variant: 'outline', disabled: filterFieldOptions.length === 0 ||
-                                                    filterState.conditions.length >= 25, onClick: () => updateFilter({
+                                                }), children: [_jsx(SelectTrigger, { className: "h-8 w-36", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "and", children: t('dynamicData.matchAll') }), _jsx(SelectItem, { value: "or", children: t('dynamicData.matchAny') })] })] })) : null, _jsxs(Button, { type: "button", size: "sm", variant: "outline", disabled: filterFieldOptions.length === 0 || filterState.conditions.length >= 25, onClick: () => updateFilter({
                                                     ...filterState,
                                                     conditions: [
                                                         ...filterState.conditions,
                                                         { field: '', operator: 'equals', value: '' },
                                                     ],
-                                                }), children: [_jsx(Plus, { className: 'h-4 w-4' }), t('dynamicData.addCondition')] })] })] }), 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: t('dynamicData.noConditions') })) : (_jsx("div", { className: 'grid gap-2', children: filterState.conditions.map((condition, index) => {
+                                                }), children: [_jsx(Plus, { className: "h-4 w-4" }), t('dynamicData.addCondition')] })] })] }), 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: t('dynamicData.noConditions') })) : (_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);
@@ -927,14 +857,14 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
                                         condition.operator !== 'in' &&
                                         condition.operator !== 'notIn' &&
                                         currentItemValueOptions.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) => {
+                                    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: t('dynamicData.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, {
+                                                }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: t('dynamicData.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'
@@ -945,40 +875,35 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
                                                             ? ''
                                                             : condition.value
                                                         : '',
-                                                }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: t('dynamicData.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, {
+                                                }), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: t('dynamicData.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: t('dynamicData.fixedValue') }), allowsCurrentDocumentValue ? (_jsx(SelectItem, { value: currentItemContentType
-                                                                            ? 'document'
-                                                                            : 'current', children: t('dynamicData.currentDocument') })) : null, allowsCurrentItemValue ? (_jsx(SelectItem, { value: 'current', children: t('dynamicData.currentItem') })) : null] })] }), condition.valueSource === 'current' ||
+                                                        }), children: [_jsx(SelectTrigger, { className: "w-full", "aria-label": "Value source", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "literal", children: t('dynamicData.fixedValue') }), allowsCurrentDocumentValue ? (_jsx(SelectItem, { value: currentItemContentType ? 'document' : 'current', children: t('dynamicData.currentDocument') })) : null, allowsCurrentItemValue ? (_jsx(SelectItem, { value: "current", children: t('dynamicData.currentItem') })) : null] })] }), condition.valueSource === 'current' ||
                                                         condition.valueSource === 'document' ? (_jsxs(Select, { disabled: !condition.field, value: condition.value, onValueChange: (value) => updateFilterCondition(index, {
                                                             ...condition,
                                                             value,
-                                                        }), children: [_jsx(SelectTrigger, { className: 'w-full', children: _jsx(SelectValue, { placeholder: t('dynamicData.currentField') }) }), _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' &&
+                                                        }), children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: t('dynamicData.currentField') }) }), _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'
+                                                            : '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({
+                                                        }) }))] })) : (_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,
                                                     conditions: filterState.conditions.filter((_, conditionIndex) => conditionIndex !== index),
-                                                }), children: [_jsx(Trash2, { className: 'h-4 w-4' }), _jsx("span", { className: 'sr-only', children: t('dynamicData.removeCondition') })] })] }, `${index}-${condition.field}`));
-                                }) }))] })] })), _jsx(PanelSection, { title: 'Mapping', children: _jsx("div", { className: 'grid gap-2', children: targetFields.map(([targetField, targetFieldConfig]) => {
+                                                }), children: [_jsx(Trash2, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: t('dynamicData.removeCondition') })] })] }, `${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 summaryMode = isNestedListSource(source)
                             ? t('dynamicData.nestedList')
                             : summary.mode;
                         const isOpen = openMappingField === targetField;
-                        return (_jsx(Collapsible, { open: isOpen, onOpenChange: (open) => setOpenMappingField(open ? targetField : null), children: _jsxs("div", { className: 'overflow-hidden rounded-md border border-border bg-background/70 transition-colors hover:border-foreground/20', children: [_jsx(CollapsibleTrigger, { asChild: true, children: _jsxs("button", { type: 'button', disabled: !selectedSource, className: 'group grid w-full grid-cols-[minmax(6rem,0.45fr)_auto_minmax(0,1fr)_auto] items-center gap-3 px-3 py-2.5 text-left outline-none transition-colors hover:bg-muted/50 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50', children: [_jsx("span", { className: 'truncate text-sm font-semibold', children: targetField }), _jsx(Badge, { variant: source ? 'secondary' : 'outline', className: 'max-w-40 truncate', children: summaryMode }), _jsx("span", { className: 'truncate text-sm text-muted-foreground', children: selectedSource
-                                                        ? summary.detail
-                                                        : 'Select a source collection first' }), _jsx(ChevronRight, { className: 'h-4 w-4 text-muted-foreground transition-transform group-data-[state=open]:rotate-90' }), _jsx("span", { className: 'sr-only', children: t('dynamicData.configureMapping', { name: targetField }) })] }) }), _jsx(CollapsibleContent, { children: _jsx("div", { className: 'border-t border-border bg-muted/20 p-3', children: selectedSource ? (_jsx(MappingSourceEditor, { contentTypes: contentTypes, rootDocumentContentType: rootDocumentContentType, currentSource: selectedSource, targetField: targetFieldConfig, source: source, onChange: (nextSource) => {
+                        return (_jsx(Collapsible, { open: isOpen, onOpenChange: (open) => setOpenMappingField(open ? targetField : null), children: _jsxs("div", { className: "overflow-hidden rounded-md border border-border bg-background/70 transition-colors hover:border-foreground/20", children: [_jsx(CollapsibleTrigger, { asChild: true, children: _jsxs("button", { type: "button", disabled: !selectedSource, className: "group grid w-full grid-cols-[minmax(6rem,0.45fr)_auto_minmax(0,1fr)_auto] items-center gap-3 px-3 py-2.5 text-left outline-none transition-colors hover:bg-muted/50 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50", children: [_jsx("span", { className: "truncate text-sm font-semibold", children: targetField }), _jsx(Badge, { variant: source ? 'secondary' : 'outline', className: "max-w-40 truncate", children: summaryMode }), _jsx("span", { className: "truncate text-sm text-muted-foreground", children: selectedSource ? summary.detail : 'Select a source collection first' }), _jsx(ChevronRight, { className: "h-4 w-4 text-muted-foreground transition-transform group-data-[state=open]:rotate-90" }), _jsx("span", { className: "sr-only", children: t('dynamicData.configureMapping', { name: targetField }) })] }) }), _jsx(CollapsibleContent, { children: _jsx("div", { className: "border-t border-border bg-muted/20 p-3", children: selectedSource ? (_jsx(MappingSourceEditor, { contentTypes: contentTypes, rootDocumentContentType: rootDocumentContentType, currentSource: selectedSource, targetField: targetFieldConfig, source: source, onChange: (nextSource) => {
                                                     const map = { ...(binding?.map ?? {}) };
                                                     if (nextSource)
                                                         map[targetField] = nextSource;
@@ -988,12 +913,32 @@ const ListBindingEditor = ({ contentTypes, documentContentType, rootDocumentCont
                                                 } })) : null }) })] }) }, targetField));
                     }) }) })] }));
 };
+const StructuredArrayBindingEditor = ({ contentTypes, fieldContentTypes, documentContentType, currentDocumentSourceEnabled, field, fieldBinding, listBinding, onFieldChange, onListChange, }) => {
+    const t = useTranslations();
+    const [mode, setMode] = useState(listBinding ? 'list' : 'field');
+    useEffect(() => {
+        if (listBinding)
+            setMode('list');
+        else if (fieldBinding)
+            setMode('field');
+    }, [fieldBinding, listBinding]);
+    return (_jsxs("div", { className: "grid gap-3", children: [_jsxs("div", { className: "grid max-w-sm content-start gap-1.5", children: [_jsx(ControlLabel, { help: t('dynamicData.nestedListHelp'), children: t('dynamicData.mappingMode') }), _jsxs(Select, { value: mode, onValueChange: (value) => {
+                            if (value === 'list') {
+                                setMode('list');
+                                onListChange(undefined);
+                                return;
+                            }
+                            setMode('field');
+                            onFieldChange(undefined);
+                        }, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "field", children: t('dynamicData.directField') }), _jsx(SelectItem, { value: "list", children: t('dynamicData.nestedList') })] })] })] }), mode === 'list' ? (_jsx(ListBindingEditor, { contentTypes: contentTypes, documentContentType: documentContentType, rootDocumentContentType: documentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, field: field, binding: listBinding, onChange: onListChange })) : (_jsx(FieldBindingEditor, { contentTypes: fieldContentTypes, documentContentType: documentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, targetField: field, binding: fieldBinding, onChange: onFieldChange }))] }));
+};
 export const DynamicDataControl = ({ contentType, documentContentType, fieldName, field, contentTypes, bindings, onChange, open, onOpenChange, mode = 'full', }) => {
     const t = useTranslations();
     const [internalOpen, setInternalOpen] = useState(false);
     const [draftBindings, setDraftBindings] = useState(() => cloneDynamicBindings(bindings));
     const wasOpenRef = useRef(open ?? internalOpen);
-    const list = isListField(field);
+    const list = isMappableDynamicListField(field);
+    const structuredArray = list && field.config.capabilities.dynamic?.collection === 'homogeneous';
     const isOpen = open ?? internalOpen;
     useEffect(() => {
         if (mode !== 'dialog')
@@ -1029,9 +974,14 @@ export const DynamicDataControl = ({ contentType, documentContentType, fieldName
         : sourceContentTypes.filter((sourceContentType) => sourceContentType.name !== contentType.name);
     const fieldBinding = activeBindings?.fields?.[fieldName];
     const listBinding = activeBindings?.lists?.[fieldName];
-    const bound = list ? !!listBinding : !!fieldBinding;
+    const bound = structuredArray
+        ? !!fieldBinding || !!listBinding
+        : list
+            ? !!listBinding
+            : !!fieldBinding;
+    const usesListBinding = list && !!listBinding;
     const summary = bindingSummary({
-        list,
+        list: usesListBinding,
         fieldBinding,
         listBinding,
         documentContentTypeName: currentDocumentContentType.name,
@@ -1058,7 +1008,44 @@ export const DynamicDataControl = ({ contentType, documentContentType, fieldName
             lists: Object.keys(lists).length ? lists : undefined,
         });
     };
-    const clearBinding = () => list ? updateListBinding(undefined) : updateFieldBinding(undefined);
+    const updateStructuredFieldBinding = (binding) => {
+        const fields = { ...(activeBindings?.fields ?? {}) };
+        const lists = { ...(activeBindings?.lists ?? {}) };
+        if (binding)
+            fields[fieldName] = binding;
+        else
+            delete fields[fieldName];
+        delete lists[fieldName];
+        commitBindings({
+            ...(activeBindings ?? {}),
+            fields: Object.keys(fields).length ? fields : undefined,
+            lists: Object.keys(lists).length ? lists : undefined,
+        });
+    };
+    const updateStructuredListBinding = (binding) => {
+        const fields = { ...(activeBindings?.fields ?? {}) };
+        const lists = { ...(activeBindings?.lists ?? {}) };
+        delete fields[fieldName];
+        if (binding)
+            lists[fieldName] = binding;
+        else
+            delete lists[fieldName];
+        commitBindings({
+            ...(activeBindings ?? {}),
+            fields: Object.keys(fields).length ? fields : undefined,
+            lists: Object.keys(lists).length ? lists : undefined,
+        });
+    };
+    const clearBinding = () => {
+        if (structuredArray) {
+            updateStructuredListBinding(undefined);
+            return;
+        }
+        if (list)
+            updateListBinding(undefined);
+        else
+            updateFieldBinding(undefined);
+    };
     const triggerLabel = bound ? 'Edit dynamic data link' : 'Link dynamic data';
     const helpDescription = list
         ? 'Dynamic data fills this list from another content source. Use it when modules should stay synced with page, route, or related content instead of being edited manually here.'
@@ -1071,22 +1058,22 @@ export const DynamicDataControl = ({ contentType, documentContentType, fieldName
         onChange(cleanDynamicBindings(draftBindings));
         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' }), t('dynamicData.notLinked')] })) }) }), _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: t('dynamicData.clear') })] }) }), _jsx(TooltipContent, { side: 'top', sideOffset: 6, children: t('dynamicData.clearLink') })] })) : null] }));
-    const editor = list ? (_jsx(ListBindingEditor, { contentTypes: sourceContentTypes, documentContentType: currentDocumentContentType, rootDocumentContentType: currentDocumentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, 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 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: [usesListBinding ? (_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" }), t('dynamicData.notLinked')] })) }) }), _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: t('dynamicData.clear') })] }) }), _jsx(TooltipContent, { side: "top", sideOffset: 6, children: t('dynamicData.clearLink') })] })) : null] }));
+    const editor = structuredArray ? (_jsx(StructuredArrayBindingEditor, { contentTypes: sourceContentTypes, fieldContentTypes: fieldSourceContentTypes, documentContentType: currentDocumentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, field: field, fieldBinding: fieldBinding, listBinding: listBinding, onFieldChange: updateStructuredFieldBinding, onListChange: updateStructuredListBinding })) : list ? (_jsx(ListBindingEditor, { contentTypes: sourceContentTypes, documentContentType: currentDocumentContentType, rootDocumentContentType: currentDocumentContentType, currentDocumentSourceEnabled: currentDocumentSourceEnabled, 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) {
                 setOpen(true);
                 return;
             }
             cancelDialogChanges();
-        }, children: _jsxs(DialogContent, { className: 'max-h-[85vh] w-screen max-w-5xl! overflow-y-auto', children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: 'flex items-center gap-2', children: [t('dynamicData.title'), _jsx(HelpCircle, { className: 'h-4 w-4 text-muted-foreground' })] }), _jsx(DialogDescription, { className: 'max-w-2xl leading-relaxed', children: helpDescription })] }), editor, _jsxs(DialogFooter, { children: [_jsx(Button, { type: 'button', variant: 'outline', onClick: cancelDialogChanges, children: t('common.cancel') }), _jsx(Button, { type: 'button', onClick: saveDialogChanges, children: t('common.save') })] })] }) }));
+        }, children: _jsxs(DialogContent, { className: "max-h-[85vh] w-screen max-w-5xl! overflow-y-auto", children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center gap-2", children: [t('dynamicData.title'), _jsx(HelpCircle, { className: "h-4 w-4 text-muted-foreground" })] }), _jsx(DialogDescription, { className: "max-w-2xl leading-relaxed", children: helpDescription })] }), editor, _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "outline", onClick: cancelDialogChanges, children: t('common.cancel') }), _jsx(Button, { type: "button", onClick: saveDialogChanges, children: t('common.save') })] })] }) }));
     if (mode === 'trigger')
         return trigger;
     if (mode === 'panel')
         return panel;
     if (mode === 'dialog')
         return dialog;
-    return (_jsxs("div", { className: 'grid min-w-0 gap-2', children: [_jsx("div", { className: 'flex min-w-0 justify-end', children: trigger }), panel] }));
+    return (_jsxs("div", { className: "grid min-w-0 gap-2", children: [_jsx("div", { className: "flex min-w-0 justify-end", children: trigger }), panel] }));
 };
 //# sourceMappingURL=DynamicDataControl.js.map