@acorex/platform 21.0.0-next.65 → 21.0.0-next.67

package/fesm2022/acorex-platform-layout-entity.mjs

@@ -1,20 +1,20 @@
 import { AXToastService } from '@acorex/components/toast';
 import * as i6 from '@acorex/core/translation';
-import { AXTranslationService, AXTranslationModule, resolveMultiLanguageString } from '@acorex/core/translation';
+import { AXTranslationService, AXTranslationModule, resolveMultiLanguageString, translateSync } from '@acorex/core/translation';
 import * as i4$4 from '@acorex/platform/common';
-import { AXPEntityCommandScope, AXPSettingsService, AXPCommonSettings, AXPFilterOperatorMiddlewareService, getEntityInfo, AXPRefreshEvent, AXPReloadEvent, AXPCleanNestedFilters, AXPDefaultMultiLanguageConfigService, withDefaultMultiLanguageOnWidgetNodeTree, AXPEntityQueryType, AXPWorkflowNavigateAction, AXPToastAction, AXP_SEARCH_DEFINITION_PROVIDER, AXPMenuItemsDataSourceDefinition } from '@acorex/platform/common';
+import { AXPEntityCommandScope, AXPSettingsService, AXPCommonSettings, AXPFilterOperatorMiddlewareService, isCardFieldBadgeDisplay, resolveCardFieldBadgeColor, getEntityInfo, resolveEnabledMasterListLayouts, resolveDefaultMasterListLayout, AXPRefreshEvent, AXPReloadEvent, AXPCleanNestedFilters, AXPFileTypeProviderService, AXPFileStorageService, AXPFileActionsService, AXPDefaultMultiLanguageConfigService, withDefaultMultiLanguageOnWidgetNodeTree, AXPEntityQueryType, AXPWorkflowNavigateAction, AXPToastAction, AXP_SEARCH_DEFINITION_PROVIDER, AXPMenuItemsDataSourceDefinition } from '@acorex/platform/common';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injector, runInInjectionContext, Injectable, input, viewChild, signal, computed, ElementRef, ChangeDetectionStrategy, Component, ApplicationRef, EnvironmentInjector, createComponent, ChangeDetectorRef, effect, Input, afterNextRender, untracked, ViewEncapsulation, viewChildren, linkedSignal, HostBinding, output, NgModule, makeEnvironmentProviders } from '@angular/core';
+import { InjectionToken, inject, Injector, runInInjectionContext, Injectable, input, viewChild, signal, computed, ElementRef, ChangeDetectionStrategy, Component, ApplicationRef, EnvironmentInjector, createComponent, NgModule, ChangeDetectorRef, effect, Input, afterNextRender, untracked, ViewEncapsulation, viewChildren, linkedSignal, HostBinding, output, makeEnvironmentProviders } from '@angular/core';
 import { Subject, takeUntil } from 'rxjs';
 import { AXPLayoutBuilderService, LayoutBuilderModule } from '@acorex/platform/layout/builder';
 import * as i3 from '@acorex/platform/layout/widget-core';
-import { AXPWidgetsCatalog, AXPWidgetCoreModule, AXPPageStatus, AXPWidgetRegistryService, AXPColumnWidgetComponent, AXPValueWidgetComponent, AXPWidgetGroupEnum, createBooleanProperty, AXPWidgetRendererDirective, createSelectProperty, createStringProperty, AXP_WIDGETS_EDITOR_CATEGORY, AXP_WIDGET_DEFINITION_PROVIDER } from '@acorex/platform/layout/widget-core';
-import { AXPSystemActionType, AXPDeviceService, AXPExpressionEvaluatorService, AXPBroadcastEventService, applyFilterArray, applySortArray, resolveActionLook, AXPDistributedEventListenerService, AXPPlatformScope, AXHighlightService, extractValue, setSmart, getChangedPaths, objectKeyValueTransforms, AXPColumnWidthService, AXPModuleManifestRegistry, defaultColumnWidthProvider, AXP_COLUMN_WIDTH_PROVIDER, AXP_DATASOURCE_DEFINITION_PROVIDER, AXPModuleManifestsDataSourceDefinition } from '@acorex/platform/core';
-import { cloneDeep, merge, get, castArray, set, orderBy, omit, isNil, isEmpty, isEqual as isEqual$1 } from 'lodash-es';
+import { AXPWidgetsCatalog, AXPWidgetCoreModule, AXPPageStatus, AXPWidgetRegistryService, AXPColumnWidgetComponent, AXPValueWidgetComponent, AXPWidgetGroupEnum, createBooleanProperty, AXPWidgetRendererDirective, createStringProperty, createNumberProperty, AXP_WIDGETS_ADVANCE_SUB_MEDIA, AXP_WIDGETS_ADVANCE_CATEGORY, createSelectProperty, AXP_WIDGETS_EDITOR_CATEGORY, AXP_WIDGET_DEFINITION_PROVIDER } from '@acorex/platform/layout/widget-core';
+import { AXPSystemActionType, AXPDeviceService, AXPExpressionEvaluatorService, AXPBroadcastEventService, applyFilterArray, applySortArray, resolveActionLook, AXPDistributedEventListenerService, AXPPlatformScope, AXHighlightService, extractValue, setSmart, getChangedPaths, objectKeyValueTransforms, AXPHookService, AXPDataGenerator, AXPComponentSlotModule, AXPColumnWidthService, AXPModuleManifestRegistry, defaultColumnWidthProvider, AXP_COLUMN_WIDTH_PROVIDER, AXP_DATASOURCE_DEFINITION_PROVIDER, AXPModuleManifestsDataSourceDefinition } from '@acorex/platform/core';
+import { cloneDeep, merge, get, castArray, set, orderBy, omit, isNil, isEmpty, isEqual as isEqual$1, isArray, isString } from 'lodash-es';
 import { transform, isEqual } from 'lodash';
 import { AXPSessionService, AXPAuthGuard, AXPPermissionDefinitionsDataSourceDefinition } from '@acorex/platform/auth';
 import { Router, ActivatedRoute, RouterModule, ROUTES } from '@angular/router';
-import { defineCommand, AXP_COMMAND_DEFINITION_CATEGORY_ENTITY, AXPCommandService, AXPQueryService, AXPQueryExecutor, provideCommandSetups, provideQuerySetups, AXPCommandRegistry, AXPQueryRegistry } from '@acorex/platform/runtime';
+import { defineCommand, AXP_COMMAND_DEFINITION_CATEGORY_ENTITY, AXPCommandService, AXPQueryService, AXPQueryExecutor, AXPCommandExecutor, provideCommandSetups, provideQuerySetups, AXPCommandRegistry, AXPQueryRegistry } from '@acorex/platform/runtime';
 import * as i1 from '@acorex/components/button';
 import { AXButtonModule } from '@acorex/components/button';
 import * as i4 from '@acorex/components/skeleton';
@@ -24,7 +24,7 @@ import { AXPopoverModule } from '@acorex/components/popover';
 import { AXFormatService } from '@acorex/core/format';
 import * as i5 from '@angular/common';
 import { CommonModule, AsyncPipe } from '@angular/common';
-import { AXPThemeLayoutBlockComponent, AXPPreloadFiltersComponent, AXPStateMessageComponent, AXPColumnItemListComponent, AXPDataSelectorService, AXPPageComponentRegistryService } from '@acorex/platform/layout/components';
+import { AXPThemeLayoutBlockComponent, AXPPreloadFiltersComponent, AXP_PAGE_COMPONENT_PROVIDER, AXPStateMessageComponent, AXPColumnItemListComponent, AXPDataSelectorService, AXPPageComponentRegistryService } from '@acorex/platform/layout/components';
 import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageComponentInstanceRegistryService } from '@acorex/platform/layout/views';
 import { AXDataSource } from '@acorex/cdk/common';
 import * as i1$3 from '@acorex/platform/workflow';
@@ -57,19 +57,22 @@ import { AXLoadingModule } from '@acorex/components/loading';
 import * as i6$1 from '@acorex/components/tag-box';
 import { AXTagBoxModule } from '@acorex/components/tag-box';
 import { AXValidationModule } from '@acorex/core/validation';
-import { AXP_DISABLED_PROPERTY, AXP_ALLOW_CLEAR_PROPERTY, AXP_DATA_PATH_PROPERTY, AXP_DATA_PROPERTY_GROUP, AXP_ALLOW_MULTIPLE_PROPERTY, AXP_NAME_PROPERTY, AXP_READONLY_PROPERTY, AXP_PLACEHOLDER_PROPERTY, AXP_BEHAVIOR_PROPERTY_GROUP, AXPProviderSelectWidgetEditBase, AXP_ROW_EXPR_PREFIX, AXPFileUploaderWidgetService } from '@acorex/platform/layout/widgets';
+import { AXP_DISABLED_PROPERTY, AXP_ALLOW_CLEAR_PROPERTY, AXP_DATA_PATH_PROPERTY, AXP_DATA_PROPERTY_GROUP, AXP_ALLOW_MULTIPLE_PROPERTY, AXP_NAME_PROPERTY, AXP_READONLY_PROPERTY, AXP_PLACEHOLDER_PROPERTY, AXP_BEHAVIOR_PROPERTY_GROUP, AXPProviderSelectWidgetEditBase, AXP_ROW_EXPR_PREFIX, AXP_DOWNLOADABLE_PROPERTY, AXP_DESCRIPTION_PROPERTY } from '@acorex/platform/layout/widgets';
 import * as i2$2 from '@acorex/components/select-box';
 import { AXSelectBoxModule } from '@acorex/components/select-box';
 import * as i4$2 from '@acorex/components/dropdown';
 import { AXDropdownModule } from '@acorex/components/dropdown';
 import * as i2$3 from '@acorex/components/tabs';
 import { AXTabsModule } from '@acorex/components/tabs';
-import * as i4$3 from '@acorex/components/collapse';
-import { AXCollapseModule } from '@acorex/components/collapse';
 import * as i5$2 from '@acorex/components/label';
 import { AXLabelModule } from '@acorex/components/label';
 import * as i7 from '@acorex/components/text-box';
 import { AXTextBoxModule } from '@acorex/components/text-box';
+import { AXFileService } from '@acorex/core/file';
+import { AXUploaderZoneDirective } from '@acorex/cdk/uploader';
+import { AXUploaderModule } from '@acorex/components/uploader';
+import * as i4$3 from '@acorex/components/collapse';
+import { AXCollapseModule } from '@acorex/components/collapse';
 
 function ensureListActions(ctx) {
     ctx.interfaces.update((i) => {
@@ -116,6 +119,18 @@ function ensureLayoutPropertyView(layout, prop) {
 
 const AXP_ENTITY_ACTION_PLUGIN = new InjectionToken('AXP_ENTITY_ACTION_PLUGIN');
 
+function ensureMasterListView(entity) {
+    entity.interfaces ??= {};
+    entity.interfaces.master ??= {};
+    if (!entity.interfaces.master.list) {
+        entity.interfaces.master.list = { views: [] };
+    }
+    return entity.interfaces.master.list;
+}
+function ensureMasterListLayouts(list) {
+    list.layouts ??= {};
+    return list.layouts;
+}
 function createModifierContext(entity) {
     const ctx = {
         entity,
@@ -293,6 +308,27 @@ function createModifierContext(entity) {
                         entity.interfaces.master.list = updater(entity.interfaces.master.list);
                         return ctx;
                     },
+                    card: {
+                        get: () => entity.interfaces?.master?.list?.layouts?.card,
+                        set: (layout) => {
+                            const list = ensureMasterListView(entity);
+                            ensureMasterListLayouts(list).card = layout;
+                            return ctx;
+                        },
+                        update: (updater) => {
+                            const list = ensureMasterListView(entity);
+                            const layouts = ensureMasterListLayouts(list);
+                            layouts.card = updater(layouts.card);
+                            return ctx;
+                        },
+                        remove: () => {
+                            const layouts = entity.interfaces?.master?.list?.layouts;
+                            if (layouts?.card) {
+                                delete layouts.card;
+                            }
+                            return ctx;
+                        },
+                    },
                 },
                 create: {
                     get: () => entity.interfaces?.master?.create,
@@ -1173,7 +1209,7 @@ function isTruthyVisible(value) {
  * Resolves `AXPRelatedEntity.columns` for `entity-list`:
  * - `string[]` → `includeColumns` only (legacy).
  * - `AXPEntityTableColumn[]` → evaluates `options.visible` when it is a string (parent detail context),
- *   drops hidden / invisible columns, and returns `relatedTableColumns` + matching `includeColumns`.
+ *   drops invisible columns, and returns `relatedTableColumns` + matching `includeColumns`.
  */
 async function resolveRelatedEntityColumns(columns, expressionEvaluator, scope) {
     if (!columns?.length) {
@@ -1185,9 +1221,6 @@ async function resolveRelatedEntityColumns(columns, expressionEvaluator, scope)
     const relatedTableColumns = [];
     for (const raw of columns) {
         const col = cloneDeep(raw);
-        if (col.hidden === true) {
-            continue;
-        }
         let visible = col.options?.visible;
         if (visible === undefined) {
             visible = true;
@@ -4112,6 +4145,47 @@ class AXPEntityListViewColumnViewModel {
         }, ...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
     }
 }
+class AXPEntityListViewCardFieldViewModel {
+    constructor(property, field) {
+        this.property = property;
+        this.field = field;
+        this.name = this.property.name;
+        this.title = this.field.title ?? this.property.title;
+        this.visible = this.field?.options?.visible ?? true;
+        this.layout = this.field.layout;
+        this.display = isCardFieldBadgeDisplay(this.field.display) ? 'badge' : 'simple';
+        this.isBadgeDisplay = isCardFieldBadgeDisplay(this.field.display);
+        this.badgeColor = resolveCardFieldBadgeColor(this.field);
+        this.isStatusWidget = this.property.schema?.interface?.type === 'status-widget';
+        this.node = computed(() => {
+            const widget = this.property.schema.interface;
+            return {
+                path: this.field.options?.dataPath ?? this.name,
+                type: widget.type,
+                options: {
+                    ...widget?.options,
+                    ...this.field?.options,
+                    columnName: this.name,
+                    ...(widget.children ? { children: widget.children } : {}),
+                },
+            };
+        }, ...(ngDevMode ? [{ debugName: "node" }] : /* istanbul ignore next */ []));
+        /** Readonly column node for status fields shown as header badges. */
+        this.headerBadgeNode = computed(() => {
+            const base = this.node();
+            if (!this.isStatusWidget) {
+                return base;
+            }
+            return {
+                ...base,
+                options: {
+                    ...base.options,
+                    readonly: true,
+                },
+            };
+        }, ...(ngDevMode ? [{ debugName: "headerBadgeNode" }] : /* istanbul ignore next */ []));
+    }
+}
 
 class AXPEntityDetailListViewModel {
     constructor(injector, detailEntityConfig, parent) {
@@ -4816,6 +4890,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             args: [{ providedIn: 'root' }]
         }] });
 
+/** Built-in card list row action that toggles multi-select mode via {@link AXPEntityMasterListViewModel.selectedItems}. */
+const AXPEntityMasterListCardSelectActionName = 'axp-entity-card:select';
 class AXPEntityMasterListViewQueryViewModel {
     constructor(entity, section, view) {
         this.entity = entity;
@@ -4831,6 +4907,83 @@ class AXPEntityMasterListViewQueryViewModel {
     }
 }
 class AXPEntityMasterListViewModel {
+    /**
+     * Sets global card body visibility for card layout.
+     */
+    setCardContentExpanded(expanded) {
+        if (this.activeListLayout() !== 'card' || this.cardContentExpanded() === expanded) {
+            return;
+        }
+        this.cardContentExpanded.set(expanded);
+        void this.saveSettings('cardContentExpanded', expanded);
+    }
+    /**
+     * Switches table vs compact/expanded card presentation.
+     */
+    setListDisplayMode(mode) {
+        if (mode === 'table') {
+            if (this.enabledListLayouts().includes('table')) {
+                this.setListLayout('table');
+            }
+            return;
+        }
+        if (!this.enabledListLayouts().includes('card')) {
+            return;
+        }
+        const expanded = mode === 'card-expanded';
+        if (this.activeListLayout() !== 'card') {
+            this.setListLayout('card');
+        }
+        if (this.cardContentExpanded() !== expanded) {
+            this.cardContentExpanded.set(expanded);
+            void this.saveSettings('cardContentExpanded', expanded);
+        }
+    }
+    static { this.LAYOUT_META = {
+        table: { title: '@general:terms.interface.table-view', icon: 'fa-table' },
+        card: { title: '@general:terms.interface.card-view', icon: 'fa-grid-2' },
+    }; }
+    /**
+     * Switches to the given layout when it is enabled.
+     * Persists the choice at entity list level (shared across all views).
+     */
+    setListLayout(layout) {
+        if (!this.enabledListLayouts().includes(layout) || this.activeListLayout() === layout) {
+            return;
+        }
+        this.activeListLayout.set(layout);
+        void this.saveSettings('listLayout', layout);
+    }
+    /**
+     * Cycles to the next enabled layout (table → card → table …).
+     * No-op when only one layout is enabled.
+     */
+    switchListLayout() {
+        const enabled = this.enabledListLayouts();
+        if (enabled.length <= 1) {
+            return this.activeListLayout();
+        }
+        const currentIndex = enabled.indexOf(this.activeListLayout());
+        const nextIndex = currentIndex < 0 ? 0 : (currentIndex + 1) % enabled.length;
+        const next = enabled[nextIndex];
+        this.setListLayout(next);
+        return next;
+    }
+    resolveActiveListLayout(preferred) {
+        const enabled = this.enabledListLayouts();
+        const layout = preferred && enabled.includes(preferred) ? preferred : enabled[0];
+        this.activeListLayout.set(layout);
+    }
+    applyListLayoutFromSettings(entitySetting) {
+        const savedLayout = entitySetting.list?.layout;
+        if (savedLayout) {
+            this.resolveActiveListLayout(savedLayout);
+        }
+        if (typeof entitySetting.list?.cardContentExpanded === 'boolean') {
+            this.cardContentExpanded.set(entitySetting.list.cardContentExpanded);
+        }
+    }
+    //#endregion
     createExpressionScope(data) {
         return {
             context: {
@@ -4860,6 +5013,62 @@ class AXPEntityMasterListViewModel {
         const resolved = result?.value;
         return typeof resolved === 'string' && resolved.trim() !== '' ? resolved : title;
     }
+    /**
+     * Resolves a card header value (title, description, icon) from a property path, expression, or literal.
+     * Supports multiple `{{ ... }}` segments in one string (e.g. `{{context.eval("a")}} - {{context.eval("b")}}`).
+     * Multi-language maps (e.g. `{ "en-US": "...", "fa-IR": "..." }`) are returned as-is for the translate pipe.
+     */
+    async resolveCardHeaderValue(value, rowData) {
+        if (!value) {
+            return '';
+        }
+        if (value.includes('{{')) {
+            const scope = this.createExpressionScope(rowData);
+            const result = await this.expressionEvaluator.evaluate(value, scope);
+            if (result === false) {
+                return '';
+            }
+            return this.normalizeCardHeaderDisplayValue(result);
+        }
+        const resolved = get(rowData, value);
+        return this.normalizeCardHeaderDisplayValue(resolved);
+    }
+    /**
+     * Keeps i18n payloads intact for `translate`; coerces only plain scalars to string.
+     */
+    normalizeCardHeaderDisplayValue(value) {
+        if (value == null || value === false) {
+            return '';
+        }
+        if (typeof value === 'string') {
+            return value;
+        }
+        if (typeof value === 'number' || typeof value === 'boolean') {
+            return String(value);
+        }
+        if (typeof value === 'object' && !Array.isArray(value) && this.translation.isValidMultiLanguageObject(value)) {
+            return value;
+        }
+        return '';
+    }
+    /**
+     * Resolves badge color for a card header field (semantic token or expression per row).
+     */
+    async resolveCardBadgeColor(field, rowData) {
+        return this.resolveCardBadgeColorValue(field.badgeColor, rowData);
+    }
+    async resolveCardBadgeColorValue(color, rowData) {
+        if (color == null || color === '') {
+            return 'default';
+        }
+        const scope = this.createExpressionScope(rowData);
+        const result = await this.expressionEvaluator.evaluate(color, scope);
+        if (result === false || result == null) {
+            return 'default';
+        }
+        const resolved = String(result).trim();
+        return resolved !== '' ? resolved : 'default';
+    }
     async resolveTriggerName(triggerName, data) {
         if (!triggerName) {
             return triggerName;
@@ -4883,6 +5092,7 @@ class AXPEntityMasterListViewModel {
             this.view.set(this.views().find((c) => c.name == (viewName || selectedViewName)) ?? this.views()[0]);
             this.applyViewSorts();
             this.applyViewColumns();
+            this.applyCardFields();
             this.applyViewFilters();
             this.resolvedListPaging.set(null);
             await this.applySettings();
@@ -4899,10 +5109,12 @@ class AXPEntityMasterListViewModel {
         this.settings = this.injector.get(AXPSettingsService);
         this.widgetResolver = this.injector.get(AXPWidgetRegistryService);
         this.expressionEvaluator = this.injector.get(AXPExpressionEvaluatorService);
+        this.translation = this.injector.get(AXTranslationService);
         this.commandService = this.injector.get(AXPCommandService);
         this.eventService = this.injector.get(AXPBroadcastEventService);
         this.queryExecutor = this.injector.get(AXPQueryExecutor);
         this.filterOperatorMiddleware = this.injector.get(AXPFilterOperatorMiddlewareService);
+        this.entityDefinitionRegistry = this.injector.get(AXPEntityDefinitionRegistryService);
         this.settingEntityKey = `${this.config.module}:${this.config.name}`;
         this.destroyed = new Subject();
         this.lastAppliedSortKey = null;
@@ -4938,6 +5150,32 @@ class AXPEntityMasterListViewModel {
             }
             return this.showRowIndexColumnEnabled();
         }, ...(ngDevMode ? [{ debugName: "showIndexColumn" }] : /* istanbul ignore next */ []));
+        //#region ---- List Layouts (table / card) ----
+        /** Layouts enabled via `interfaces.master.list.layouts.*.enabled`. */
+        this.enabledListLayouts = computed(() => resolveEnabledMasterListLayouts(this._viewDef?.layouts), ...(ngDevMode ? [{ debugName: "enabledListLayouts" }] : /* istanbul ignore next */ []));
+        /** True when the user can switch between multiple enabled layouts. */
+        this.canSwitchListLayout = computed(() => this.enabledListLayouts().length > 1, ...(ngDevMode ? [{ debugName: "canSwitchListLayout" }] : /* istanbul ignore next */ []));
+        /** Active list layout for the current view. */
+        this.activeListLayout = signal(resolveDefaultMasterListLayout(this._viewDef?.layouts), ...(ngDevMode ? [{ debugName: "activeListLayout" }] : /* istanbul ignore next */ []));
+        this.tableLayout = computed(() => this._viewDef?.layouts?.table, ...(ngDevMode ? [{ debugName: "tableLayout" }] : /* istanbul ignore next */ []));
+        this.cardLayout = computed(() => this._viewDef?.layouts?.card, ...(ngDevMode ? [{ debugName: "cardLayout" }] : /* istanbul ignore next */ []));
+        /** Global expanded state for all card bodies in card layout. */
+        this.cardContentExpanded = signal(true, ...(ngDevMode ? [{ debugName: "cardContentExpanded" }] : /* istanbul ignore next */ []));
+        /** Current presentation mode (table, compact cards, or expanded cards). */
+        this.listDisplayMode = computed(() => {
+            if (this.activeListLayout() === 'table') {
+                return 'table';
+            }
+            return this.cardContentExpanded() ? 'card-expanded' : 'card-compact';
+        }, ...(ngDevMode ? [{ debugName: "listDisplayMode" }] : /* istanbul ignore next */ []));
+        /** Enabled layouts with display metadata for the title layout switcher. */
+        this.availableListLayouts = computed(() => this.enabledListLayouts().map((id) => ({
+            id,
+            title: AXPEntityMasterListViewModel.LAYOUT_META[id].title,
+            icon: AXPEntityMasterListViewModel.LAYOUT_META[id].icon,
+        })), ...(ngDevMode ? [{ debugName: "availableListLayouts" }] : /* istanbul ignore next */ []));
+        /** Active layout option (for title icon and switcher selection state). */
+        this.currentListLayout = computed(() => this.availableListLayouts().find((layout) => layout.id === this.activeListLayout()) ?? null, ...(ngDevMode ? [{ debugName: "currentListLayout" }] : /* istanbul ignore next */ []));
         this.dataSource = new AXDataSource({
             byKey: async (key) => {
                 const execute = this.entityDef.queries?.byKey?.execute;
@@ -5031,7 +5269,7 @@ class AXPEntityMasterListViewModel {
             // const visibleProperties = properties.filter(({ schema }) => schema?.visible !== false);
             const propNames = new Set(properties.map(({ name }) => name));
             return columns
-                .filter(({ name, showAs, hidden }) => (propNames.has(name) || showAs) && !hidden)
+                .filter(({ name, showAs, options }) => (propNames.has(name) || showAs) && options?.visible !== false)
                 .map((column) => {
                 if (column.showAs) {
                     const widgetConfig = this.widgetResolver.resolve(column.showAs.type);
@@ -5060,6 +5298,13 @@ class AXPEntityMasterListViewModel {
             return this.columns().filter((c) => c.visible == true).length;
         };
         this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+        this.allAvailableCardFields = () => {
+            const fields = this.cardLayout()?.fields ?? [];
+            return fields
+                .map((field) => this.resolveCardField(field))
+                .filter((field) => field != null);
+        };
+        this.cardFields = signal([], ...(ngDevMode ? [{ debugName: "cardFields" }] : /* istanbul ignore next */ []));
         //****************** Sort ******************//
         this.sortableFields = () => {
             const props = this.entityDef.properties.filter((c) => c.options?.sort?.enabled);
@@ -5182,12 +5427,17 @@ class AXPEntityMasterListViewModel {
             this.saveSettings('view');
         }
         if (!(await this.shouldLoadPersistedListState())) {
+            const entitySetting = await this.settings.get(this.settingEntityKey);
+            if (entitySetting) {
+                this.applyListLayoutFromSettings(entitySetting);
+            }
             this.loadListPagingFromViewSettings(null);
             this.expandedRowIds.set([]);
             return;
         }
         const listViewSetting = await this.settings.get(this.settingEntityKey);
         if (listViewSetting) {
+            this.applyListLayoutFromSettings(listViewSetting);
             const columns = listViewSetting.list?.views?.[this.view().name]?.columns;
             const sorts = listViewSetting.list?.views?.[this.view().name]?.sorts;
             const filters = listViewSetting.list?.views?.[this.view().name]?.filters;
@@ -5438,6 +5688,24 @@ class AXPEntityMasterListViewModel {
                     },
                 }));
                 break;
+            case 'listLayout':
+                updateSettings((prev) => ({
+                    ...prev,
+                    list: {
+                        ...prev?.list,
+                        layout: data,
+                    },
+                }));
+                break;
+            case 'cardContentExpanded':
+                updateSettings((prev) => ({
+                    ...prev,
+                    list: {
+                        ...prev?.list,
+                        cardContentExpanded: data,
+                    },
+                }));
+                break;
             default:
                 break;
         }
@@ -5501,6 +5769,32 @@ class AXPEntityMasterListViewModel {
         }));
         return actions.filter(Boolean);
     }
+    /**
+     * Secondary actions for card layout rows, with the built-in Select action last (divider above it).
+     */
+    async cardSecondaryRowActions(rowData) {
+        const actions = await this.secondaryRowActions(rowData);
+        const items = actions
+            .filter((a) => a.name !== AXPEntityMasterListCardSelectActionName)
+            .map((a) => ({
+            name: a.name,
+            title: a.title,
+            icon: a.icon,
+            color: a.color,
+            disabled: a.disabled,
+            divided: a.separated,
+        }));
+        items.push({
+            name: AXPEntityMasterListCardSelectActionName,
+            title: '@general:actions.select.title',
+            icon: 'fa-square-check',
+            color: 'default',
+            disabled: false,
+            divided: items.length > 0,
+            isCardSelect: true,
+        });
+        return items;
+    }
     static { this.URL_FILTER_OPERATOR_TYPES = new Set([
         'equal',
         'isNull',
@@ -5725,6 +6019,141 @@ class AXPEntityMasterListViewModel {
         this.columns.set(columns);
         this.saveSettings('columnOrders', columns);
     }
+    //****************** Card fields ******************//
+    mergeDisplayFieldWithColumn(field, column) {
+        if (!column) {
+            return field;
+        }
+        return {
+            ...field,
+            title: field.title ?? column.title,
+            showAs: field.showAs ?? column.showAs,
+            options: { ...column.options, ...field.options },
+        };
+    }
+    buildVirtualDisplayProperty(name, title, showAs) {
+        const widgetConfig = this.widgetResolver.resolve(showAs.type);
+        const { title: _wcTitle, description: _wcDescription, ...widgetRest } = widgetConfig;
+        return {
+            ...widgetRest,
+            name,
+            title: title ?? '',
+            schema: {
+                dataType: 'string',
+                interface: {
+                    type: showAs.type,
+                    options: showAs.options,
+                },
+            },
+        };
+    }
+    normalizeRelatedColumnNames(columns) {
+        if (!columns?.length) {
+            return [];
+        }
+        return columns.map((column) => (typeof column === 'string' ? column : column.name));
+    }
+    findRelatedEntityForField(fieldName) {
+        for (const related of this.entityDef.relatedEntities ?? []) {
+            const columnNames = this.normalizeRelatedColumnNames(related.columns);
+            if (columnNames.includes(fieldName)) {
+                return { entity: related.entity };
+            }
+        }
+        return null;
+    }
+    getRegisteredEntity(fullName) {
+        return this.entityDefinitionRegistry
+            .getAll()
+            .find((entity) => `${entity.module}.${entity.name}` === fullName);
+    }
+    resolveRelatedEntityProperty(fieldName) {
+        const relatedRef = this.findRelatedEntityForField(fieldName);
+        if (!relatedRef) {
+            return null;
+        }
+        const relatedDef = this.getRegisteredEntity(relatedRef.entity);
+        return relatedDef?.properties?.find((property) => property.name === fieldName) ?? null;
+    }
+    resolveRelatedEntityColumnDataPath(relatedEntityKey, fieldName) {
+        const relatedDef = this.getRegisteredEntity(relatedEntityKey);
+        const column = relatedDef?.columns?.find(({ name }) => name === fieldName);
+        return column?.options?.dataPath;
+    }
+    deriveDataPathFromLookupProperty(property) {
+        const iface = property.schema?.interface;
+        if (iface?.type !== 'lookup-editor') {
+            return undefined;
+        }
+        const textField = iface.options?.['textField'] ?? 'title';
+        const expose = iface.options?.['expose'];
+        return expose?.find((entry) => entry.source === textField)?.target;
+    }
+    resolveParentDataPathForRelatedField(fieldName, relatedEntityKey, relatedProperty) {
+        const parentColumn = this.entityDef.columns?.find(({ name }) => name === fieldName);
+        if (parentColumn?.options?.dataPath) {
+            return parentColumn.options.dataPath;
+        }
+        const relatedDataPath = this.resolveRelatedEntityColumnDataPath(relatedEntityKey, fieldName) ??
+            this.deriveDataPathFromLookupProperty(relatedProperty);
+        if (!relatedDataPath) {
+            return undefined;
+        }
+        const relatedLeaf = relatedDataPath.split('.').pop();
+        for (const property of this.entityDef.properties ?? []) {
+            const expose = property.schema?.interface?.options?.['expose'];
+            if (!expose) {
+                continue;
+            }
+            const match = expose.find((entry) => entry.target === relatedDataPath ||
+                entry.target.endsWith(`.${relatedDataPath}`) ||
+                (relatedLeaf != null && entry.source === relatedLeaf));
+            if (match) {
+                return match.target;
+            }
+        }
+        return relatedDataPath;
+    }
+    resolveDisplayFieldProperty(field, column) {
+        const showAs = field.showAs ?? column?.showAs;
+        if (showAs) {
+            return this.buildVirtualDisplayProperty(field.name, field.title ?? column?.title, showAs);
+        }
+        const property = this.entityDef.properties.find(({ name }) => name === field.name);
+        if (property) {
+            return property;
+        }
+        return this.resolveRelatedEntityProperty(field.name);
+    }
+    resolveCardField(field) {
+        const column = this.entityDef.columns?.find(({ name }) => name === field.name);
+        const mergedField = this.mergeDisplayFieldWithColumn(field, column);
+        if (field.options?.visible === false) {
+            return null;
+        }
+        const property = this.resolveDisplayFieldProperty(mergedField, column);
+        if (!property) {
+            return null;
+        }
+        const isOwnProperty = this.entityDef.properties.some(({ name }) => name === field.name);
+        let resolvedField = mergedField;
+        if (!isOwnProperty && !resolvedField.options?.dataPath) {
+            const relatedRef = this.findRelatedEntityForField(field.name);
+            if (relatedRef) {
+                const dataPath = this.resolveParentDataPathForRelatedField(field.name, relatedRef.entity, property);
+                if (dataPath) {
+                    resolvedField = {
+                        ...resolvedField,
+                        options: { ...resolvedField.options, dataPath },
+                    };
+                }
+            }
+        }
+        return new AXPEntityListViewCardFieldViewModel(property, resolvedField);
+    }
+    applyCardFields() {
+        this.cardFields.set(this.allAvailableCardFields());
+    }
     resetSorts() {
         this.applyViewSorts();
     }
@@ -7263,6 +7692,234 @@ function resolveEntityPluginDetailPageOrder(input, slot, options) {
  * Consumers that only need the token/interface can import from @acorex/platform/domain.
  */
 
+/** Component key used when display is 'page'. Register a page component with this key via AXP_PAGE_COMPONENT_PROVIDER. */
+const ATTACHMENTS_PAGE_COMPONENT_KEY = 'entity-attachments-page';
+/** Default section order for attachments when display is 'section' (after meta-data-form). */
+const DEFAULT_ATTACHMENTS_SECTION_ORDER = 200;
+const DEFAULT_ATTACHMENTS_PAGE_ICON = 'fa-light fa-paperclip';
+function buildAttachmentsFileUploaderOptions(opts, displayMode) {
+    return {
+        multiple: opts.multiple ?? true,
+        accept: opts.accept,
+        readonly: opts['readonly'] ?? false,
+        fileEditable: opts.fileEditable ?? true,
+        editDialog: opts.editDialog,
+        plugins: opts.plugins ?? [],
+        showBorder: opts.showBorder ?? false,
+        showAddItemButton: opts.showAddItemButton ?? displayMode !== 'page',
+    };
+}
+function buildAttachmentsListActionCommandOptions(opts, field) {
+    const base = buildAttachmentsFileUploaderOptions(opts, 'section');
+    return {
+        id: '{{ context.eval("id") }}',
+        key: field,
+        ...base,
+        accept: opts.accept ?? '.jpg,.jpeg,.png,.gif,.webp',
+        showAddItemButton: true,
+    };
+}
+function applyAttachmentsFileUploaderOptions(ctx, field, opts, displayMode) {
+    const fileUploaderOptions = {
+        ...buildAttachmentsFileUploaderOptions(opts, displayMode),
+        entityName: `${ctx.entity.module}.${ctx.entity.name}`,
+        entityId: '{{ context.eval("id") }}',
+        entityField: field,
+    };
+    const prop = (ctx.properties.list() ?? []).find((p) => p.name === field);
+    if (prop?.schema?.interface?.type === 'attachments') {
+        prop.schema.interface.options = {
+            ...(prop.schema.interface.options ?? {}),
+            ...fileUploaderOptions,
+        };
+    }
+}
+/**
+ * Attachments plugin.
+ * - Always ensures an attachments group and property; when display is 'section' (default), adds a section to single/create/update layouts.
+ * - When display is 'page', adds a page to entity.pages with ATTACHMENTS_PAGE_COMPONENT_KEY; register a page component with that key via AXP_PAGE_COMPONENT_PROVIDER.
+ * - List column and list upload action can be turned off with `showListColumn` / `showListAction` (both default true).
+ * - Uses provided accept/multiple/fileEditable; others are fixed.
+ */
+const attachmentsPlugin = {
+    name: 'attachments',
+    order: 50,
+    apply: (ctx, options) => {
+        const opts = options ?? {};
+        const field = opts.field && opts.field.trim().length > 0 ? opts.field : 'attachments';
+        const displayTitle = opts.title ?? '@document-management:terms.common.attachments';
+        const displayMode = opts.display ?? 'section';
+        const sectionTitle = opts.section?.title ?? displayTitle;
+        // Ensure group and section ids (unique per field)
+        const sectionId = `attachments-${field}`;
+        const groupIdForProperty = `attachments-${field}`;
+        const existingGroups = ctx.groups.list() ?? [];
+        if (!existingGroups.some((g) => g.id === groupIdForProperty)) {
+            ctx.groups.add({ id: groupIdForProperty, title: displayTitle });
+        }
+        // Ensure property exists (using a generic file-uploader interface)
+        const props = ctx.properties.list();
+        if (!props.some((p) => p.name === field)) {
+            ctx.properties.add({
+                name: field,
+                title: displayTitle,
+                groupId: groupIdForProperty,
+                schema: {
+                    dataType: 'string',
+                    interface: {
+                        type: 'attachments',
+                        options: {
+                            ...buildAttachmentsFileUploaderOptions({ ...opts, field }, displayMode),
+                            entityName: `${ctx.entity.module}.${ctx.entity.name}`,
+                            entityId: '{{ context.eval("id") }}',
+                            entityField: field,
+                        },
+                    },
+                },
+            });
+        }
+        applyAttachmentsFileUploaderOptions(ctx, field, opts, displayMode);
+        // Ensure column exists (optional)
+        const showListColumn = opts.showListColumn ?? true;
+        if (showListColumn) {
+            const cols = ctx.columns.list() ?? [];
+            if (!cols?.some((c) => c.name === field)) {
+                ctx.columns.add({ name: field });
+            }
+        }
+        if (displayMode === 'section') {
+            const propertyLayoutOrder = 8;
+            const layoutSectionOrder = opts.section?.order ?? DEFAULT_ATTACHMENTS_SECTION_ORDER;
+            const colSpan = 12;
+            ctx.interfaces.master.single.update((single) => {
+                const next = cloneLayoutArrays((single ?? { title: ctx.entity.title, sections: [], properties: [] }));
+                ensureLayoutSection(next, { id: sectionId, title: sectionTitle, order: layoutSectionOrder });
+                ensureLayoutPropertyView(next, {
+                    name: field,
+                    layout: { label: { visible: false }, positions: { lg: { colSpan, order: propertyLayoutOrder } } },
+                });
+                return next;
+            });
+            ctx.interfaces.master.create.update((create) => {
+                const next = cloneLayoutArrays((create ?? { sections: [], properties: [] }));
+                ensureLayoutSection(next, { id: sectionId, title: sectionTitle, order: layoutSectionOrder });
+                ensureLayoutPropertyView(next, {
+                    name: field,
+                    layout: { label: { visible: false }, positions: { lg: { colSpan, order: 6 } } },
+                });
+                return next;
+            });
+            ctx.interfaces.master.modify.update((modify) => {
+                const next = cloneLayoutArrays((modify ?? { sections: [], properties: [] }));
+                ensureLayoutSection(next, { id: sectionId, title: sectionTitle, order: layoutSectionOrder });
+                ensureLayoutPropertyView(next, {
+                    name: field,
+                    layout: { label: { visible: false }, positions: { lg: { colSpan, order: 6 } } },
+                });
+                return next;
+            });
+        }
+        else {
+            ctx.entity.pages ??= [];
+            const pageExists = ctx.entity.pages.some((p) => p.componentKey === ATTACHMENTS_PAGE_COMPONENT_KEY && p.field === field);
+            const pageOrder = resolveEntityPluginDetailPageOrder({ relatedEntities: ctx.entity.relatedEntities, pages: ctx.entity.pages }, 'attachments', {
+                componentKey: ATTACHMENTS_PAGE_COMPONENT_KEY,
+                field,
+                skipPage: pageExists
+                    ? { componentKey: ATTACHMENTS_PAGE_COMPONENT_KEY, field }
+                    : undefined,
+            });
+            const page = {
+                componentKey: ATTACHMENTS_PAGE_COMPONENT_KEY,
+                title: displayTitle,
+                icon: DEFAULT_ATTACHMENTS_PAGE_ICON,
+                layout: { order: pageOrder },
+                field,
+            };
+            if (!pageExists) {
+                ctx.entity.pages.push(page);
+            }
+            else {
+                const pages = ctx.entity.pages;
+                const index = pages.findIndex((p) => p.componentKey === ATTACHMENTS_PAGE_COMPONENT_KEY && p.field === field);
+                if (index >= 0) {
+                    pages[index] = { ...pages[index], ...page };
+                }
+            }
+        }
+        // Ensure list action to open file uploader popup exists (optional)
+        const showListAction = opts.showListAction ?? true;
+        if (showListAction) {
+            ensureListActions(ctx);
+            ctx.interfaces.update((i) => {
+                const actions = i.master.list.actions;
+                const cmdName = 'show-file-uploader-popup';
+                const actionName = `attachments-${field}`;
+                if (!actionExists(actions, cmdName, actionName)) {
+                    actions.push({
+                        name: actionName,
+                        title: '@document-management:actions.upload-files',
+                        command: {
+                            name: cmdName,
+                            options: { ...buildAttachmentsListActionCommandOptions(opts, field),
+                                entity: {
+                                    name: `${ctx.entity.module}.${ctx.entity.name}`,
+                                    id: '{{ context.eval("id") }}',
+                                    field: field,
+                                },
+                            },
+                        },
+                        priority: 'secondary',
+                        type: 'upload',
+                        scope: AXPEntityCommandScope.Individual,
+                    });
+                }
+                return i;
+            });
+        }
+        // Stamp normalized config for middleware
+        ctx.entity.extensions ??= {};
+        ctx.entity.extensions.attachments ??= {};
+        ctx.entity.extensions.attachments[field] = { title: displayTitle, display: displayMode };
+    },
+};
+
+//#region ----   Attachments Page Component Provider   ----
+class AXMAttachmentsPageComponentProvider {
+    async components() {
+        return [
+            {
+                key: ATTACHMENTS_PAGE_COMPONENT_KEY,
+                loader: () => import('./acorex-platform-layout-entity-attachments-page.component-BaTS183I.mjs').then((m) => m.AXMAttachmentsPageComponent),
+            },
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXMAttachmentsPageComponentProvider, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXMAttachmentsPageComponentProvider }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXMAttachmentsPageComponentProvider, decorators: [{
+            type: Injectable
+        }] });
+
+class AXPAttachmentsPluginModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPAttachmentsPluginModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: AXPAttachmentsPluginModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPAttachmentsPluginModule, providers: [{ provide: AXP_ENTITY_ACTION_PLUGIN, multi: true, useValue: attachmentsPlugin },
+            { provide: AXP_PAGE_COMPONENT_PROVIDER, multi: true, useClass: AXMAttachmentsPageComponentProvider },
+        ] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPAttachmentsPluginModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [],
+                    exports: [],
+                    providers: [{ provide: AXP_ENTITY_ACTION_PLUGIN, multi: true, useValue: attachmentsPlugin },
+                        { provide: AXP_PAGE_COMPONENT_PROVIDER, multi: true, useClass: AXMAttachmentsPageComponentProvider },
+                    ],
+                }]
+        }] });
+
 //#region ----   Constants   ----
 /**
  * i18n key for the synthetic root node ("all categories"). Resolve in templates with the translate pipe.
@@ -11339,14 +11996,22 @@ function mapPropertyToWidgetColumn(property) {
  */
 function mapEntityColumnToWidgetColumn(entity, column) {
     const property = entity.properties.find((p) => p.name === column.name);
+    const interfaceType = property?.schema?.interface?.type;
     const widgetFromProperty = property?.schema?.interface
         ? {
-            type: property.schema.interface.type || 'text-editor',
+            type: interfaceType || 'text-editor',
             path: column.options?.dataPath || column.name,
             options: {
                 readonly: true,
                 columnName: column.name,
                 ...property.schema.interface.options,
+                ...(interfaceType === 'attachments'
+                    ? {
+                        entityName: property.schema.interface.options?.['entityName'] ??
+                            `${entity.module}.${entity.name}`,
+                        entityField: property.schema.interface.options?.['entityField'] ?? column.name,
+                    }
+                    : {}),
                 ...(property.schema.interface.children?.length && { children: property.schema.interface.children }),
             },
         }
@@ -12859,54 +13524,352 @@ var lookupWidgetView_component = /*#__PURE__*/Object.freeze({
 });
 
 //#endregion
-class AXPEntityDataSelectorService {
+class AXPEntityDataSelectorRowActionsService {
     constructor() {
         //#region ----   Services & Dependencies   ----
-        this.dataSelectorService = inject(AXPDataSelectorService);
-        this.filterOperatorMiddleware = inject(AXPFilterOperatorMiddlewareService);
-        this.widgetResolver = inject(AXPWidgetRegistryService);
-        this.entityResolver = inject(AXPEntityDefinitionRegistryService);
+        this.expressionEvaluator = inject(AXPExpressionEvaluatorService);
+        this.workflow = inject(AXPWorkflowService);
         this.commandService = inject(AXPCommandService);
     }
     //#endregion
     //#region ----   Public Methods   ----
     /**
-     * Open entity data selector popup
+     * Build a row-actions handler for {@link AXPDataSelectorComponent} from entity list actions.
      */
-    async open(options) {
-        const config = this.createDataSelectorConfig(options);
-        // Handle category filter
-        if (options.categoryFilter) {
-            // Use provided category filter config
-            config.categoryFilter = {
-                enabled: true,
-                ...options.categoryFilter,
-            };
+    createHandler(entity, config) {
+        const primaryFilters = config.primary ?? [];
+        const secondaryFilters = config.secondary ?? [];
+        if (primaryFilters.length === 0 && secondaryFilters.length === 0) {
+            return undefined;
         }
-        else {
-            // Auto-detect category filter from entity plugin if enabled
-            const showCategoryFilter = options.showCategoryFilter ?? true;
-            if (showCategoryFilter) {
-                const categoryExt = options.entity?.extensions?.category;
-                if (categoryExt) {
-                    const categoryTreeDataSource = await this.createCategoryTreeDataSource(categoryExt.entity);
-                    if (categoryTreeDataSource) {
-                        const propertyName = categoryExt.propertyName || 'categoryIds';
-                        const filterOperator = 'contains';
-                        config.categoryFilter = {
-                            enabled: true,
-                            title: '@general:terms.classification.categories',
-                            dataSource: categoryTreeDataSource,
-                            filterField: propertyName,
-                            filterOperator,
-                        };
-                    }
-                }
-            }
+        const allActions = this.buildIndividualActions(entity);
+        const primaryActions = this.filterActions(allActions, primaryFilters);
+        const secondaryActions = this.filterActions(allActions, secondaryFilters);
+        if (primaryActions.length === 0 && secondaryActions.length === 0) {
+            return undefined;
         }
-        const result = (await this.dataSelectorService.open(config));
-        return result;
-    }
+        const flattenedActions = this.flattenActions([...primaryActions, ...secondaryActions]);
+        return {
+            hasPrimary: () => primaryActions.length > 0,
+            hasDropdown: () => secondaryActions.length > 0,
+            getPrimaryItems: () => this.toRowCommandItems(primaryActions),
+            getDropdownItems: async (rowData) => {
+                const evaluated = await this.evaluateActionsForRow(secondaryActions, rowData);
+                return this.toRowCommandItems(evaluated);
+            },
+            execute: async (commandName, rowData) => {
+                await this.executeCommand(entity, flattenedActions, commandName, rowData);
+            },
+        };
+    }
+    //#endregion
+    //#region ----   Private Methods   ----
+    buildIndividualActions(entity) {
+        const listActions = entity.interfaces?.master?.list?.actions ?? [];
+        const individualActions = listActions.filter((action) => action.scope === AXPEntityCommandScope.Individual);
+        return orderBy(individualActions.map((action) => new AXPEntityCommandTriggerViewModel(entity, action)), 'order', 'asc');
+    }
+    filterActions(actions, filters) {
+        if (!filters.length) {
+            return [];
+        }
+        return actions.filter((action) => this.matchesActionFilter(action, filters));
+    }
+    matchesActionFilter(action, filters) {
+        const commandName = this.getCommandNameFromTrigger(action.name);
+        return filters.some((filter) => {
+            const normalizedFilter = filter.trim();
+            if (!normalizedFilter) {
+                return false;
+            }
+            return (commandName === normalizedFilter ||
+                action.name === normalizedFilter ||
+                commandName.endsWith(normalizedFilter) ||
+                action.name.endsWith(normalizedFilter) ||
+                action.name.startsWith(`${normalizedFilter}&`));
+        });
+    }
+    getCommandNameFromTrigger(triggerName) {
+        const ampIndex = triggerName.indexOf('&');
+        return ampIndex >= 0 ? triggerName.slice(0, ampIndex) : triggerName;
+    }
+    flattenActions(actions) {
+        const result = [];
+        const visit = (items) => {
+            for (const item of items) {
+                result.push(item);
+                if (item.items?.length) {
+                    visit(item.items);
+                }
+            }
+        };
+        visit(actions);
+        return result;
+    }
+    toRowCommandItems(actions) {
+        return actions.map((action) => ({
+            name: action.name,
+            text: translateSync(action.title),
+            icon: action.icon ?? '',
+            color: action.color,
+            disabled: action.disabled,
+            default: action.default,
+        }));
+    }
+    async evaluateActionsForRow(actions, rowData) {
+        const scope = this.createExpressionScope(rowData);
+        const evaluated = await Promise.all(actions.map(async (action) => {
+            const isHidden = await this.expressionEvaluator.evaluate(action.hidden, scope);
+            if (isHidden) {
+                return null;
+            }
+            const disabled = await this.expressionEvaluator.evaluate(action.disabled, scope);
+            const name = await this.resolveTriggerName(action.name, rowData);
+            const title = await this.resolveTitleExpression(action.title, rowData);
+            return { ...action, disabled, name, title };
+        }));
+        return evaluated.filter(Boolean);
+    }
+    createExpressionScope(data) {
+        return {
+            context: {
+                eval: (path) => get(data, path),
+            },
+        };
+    }
+    async resolveTriggerName(triggerName, data) {
+        if (!triggerName) {
+            return triggerName;
+        }
+        const ampIndex = triggerName.indexOf('&');
+        if (ampIndex < 0) {
+            return this.resolveCommandNameExpression(triggerName, data);
+        }
+        const commandPart = triggerName.slice(0, ampIndex);
+        const suffix = triggerName.slice(ampIndex);
+        const resolvedCommand = await this.resolveCommandNameExpression(commandPart, data);
+        return `${resolvedCommand}${suffix}`;
+    }
+    async resolveCommandNameExpression(commandName, data) {
+        if (!commandName || !commandName.includes('{{')) {
+            return commandName;
+        }
+        const scope = this.createExpressionScope(data);
+        const result = await this.expressionEvaluator.evaluate({ value: commandName }, scope);
+        const resolved = result?.value;
+        return typeof resolved === 'string' && resolved.trim() !== '' ? resolved : commandName;
+    }
+    async resolveTitleExpression(title, data) {
+        if (!title || !title.includes('{{')) {
+            return title;
+        }
+        const scope = this.createExpressionScope(data);
+        const result = await this.expressionEvaluator.evaluate({ value: title }, scope);
+        const resolved = result?.value;
+        return typeof resolved === 'string' && resolved.trim() !== '' ? resolved : title;
+    }
+    async executeCommand(entity, actions, commandName, rowData) {
+        const action = actions.find((candidate) => candidate.name === commandName);
+        if (!action) {
+            return;
+        }
+        const resolvedTriggerName = await this.resolveTriggerName(commandName, rowData);
+        const command = resolvedTriggerName.split('&')[0];
+        const options = await this.evaluateActionOptions(action.options, rowData);
+        if (this.workflow.exists(command)) {
+            await this.workflow.execute(command, {
+                entity: getEntityInfo(entity).source,
+                entityInfo: {
+                    name: entity.name,
+                    module: entity.module,
+                    title: entity.title,
+                    parentKey: entity.parentKey,
+                    source: `${entity.module}.${entity.name}`,
+                },
+                data: rowData,
+                options,
+                metadata: action.metadata,
+            });
+            return;
+        }
+        await this.commandService.execute(command, {
+            __context__: {
+                data: rowData,
+                entity: getEntityInfo(entity).source,
+                entityInfo: {
+                    name: entity.name,
+                    module: entity.module,
+                    title: entity.title,
+                    parentKey: entity.parentKey,
+                },
+                options,
+            },
+            __metadata__: action.metadata,
+        });
+    }
+    async evaluateActionOptions(options, rowData) {
+        if (!options || typeof options !== 'object') {
+            return {};
+        }
+        const scope = this.createExpressionScope(rowData);
+        const evaluated = await this.expressionEvaluator.evaluate(options, scope);
+        return evaluated ?? {};
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityDataSelectorRowActionsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityDataSelectorRowActionsService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityDataSelectorRowActionsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+const LEGACY_ENTITY_DATA_SELECTOR_OPTION_KEYS = [
+    'allowMultiple',
+    'allowUnselect',
+    'filters',
+    'parentFilters',
+    'columns',
+    'sortedFields',
+    'allowCreate',
+    'searchFields',
+    'initialSearchTerm',
+    'selectedItemIds',
+    'categoryFilter',
+    'showCategoryFilter',
+];
+//#endregion
+//#region ----   Normalization   ----
+/**
+ * Returns true when flat (legacy) option fields are present on the input object.
+ */
+function isLegacyEntityDataSelectorOptions(options) {
+    const legacy = options;
+    return LEGACY_ENTITY_DATA_SELECTOR_OPTION_KEYS.some((key) => legacy[key] !== undefined);
+}
+/**
+ * Maps deprecated flat options to {@link AXPEntityDataSelectorOpenOptions}.
+ */
+function mapLegacyEntityDataSelectorOptions(legacy) {
+    const normalized = {
+        entity: legacy.entity,
+        title: legacy.title,
+    };
+    if (legacy.allowMultiple !== undefined ||
+        legacy.selectedItemIds !== undefined ||
+        legacy.allowUnselect !== undefined) {
+        normalized.selection = {
+            ...(legacy.allowMultiple !== undefined && { multiple: legacy.allowMultiple }),
+            ...(legacy.selectedItemIds !== undefined && { selectedItemIds: legacy.selectedItemIds }),
+            ...(legacy.allowUnselect !== undefined && { allowUnselect: legacy.allowUnselect }),
+        };
+    }
+    if (legacy.columns !== undefined) {
+        normalized.grid = { columns: legacy.columns };
+    }
+    if (legacy.filters !== undefined || legacy.parentFilters !== undefined) {
+        normalized.filter = {
+            ...(legacy.filters !== undefined && { value: legacy.filters }),
+            ...(legacy.parentFilters !== undefined && { parent: legacy.parentFilters }),
+        };
+    }
+    if (legacy.searchFields !== undefined || legacy.initialSearchTerm !== undefined) {
+        normalized.search = {
+            ...(legacy.searchFields !== undefined && { fields: legacy.searchFields }),
+            ...(legacy.initialSearchTerm !== undefined && { initial: legacy.initialSearchTerm }),
+        };
+    }
+    if (legacy.sortedFields !== undefined) {
+        normalized.sort = { fields: legacy.sortedFields };
+    }
+    if (legacy.categoryFilter) {
+        normalized.category = {
+            enabled: true,
+            title: legacy.categoryFilter.title,
+            width: legacy.categoryFilter.width,
+            dataSource: legacy.categoryFilter.dataSource,
+            filter: {
+                field: legacy.categoryFilter.filterField,
+                operator: legacy.categoryFilter.filterOperator,
+            },
+        };
+    }
+    else if (legacy.showCategoryFilter !== undefined) {
+        normalized.category = { enabled: legacy.showCategoryFilter };
+    }
+    if (legacy.allowCreate !== undefined) {
+        normalized.create = { mode: legacy.allowCreate };
+    }
+    if (legacy.rowActions !== undefined) {
+        normalized.rowActions = legacy.rowActions;
+    }
+    return normalized;
+}
+/**
+ * Normalizes legacy flat or nested options to {@link AXPEntityDataSelectorOpenOptions}.
+ * When both shapes are mixed, nested groups take precedence over mapped legacy values.
+ */
+function normalizeEntityDataSelectorOptions(options) {
+    const normalized = isLegacyEntityDataSelectorOptions(options)
+        ? mapLegacyEntityDataSelectorOptions(options)
+        : { ...options };
+    const nested = options;
+    if (nested.selection) {
+        normalized.selection = { ...normalized.selection, ...nested.selection };
+    }
+    if (nested.grid) {
+        normalized.grid = { ...normalized.grid, ...nested.grid };
+    }
+    if (nested.filter) {
+        normalized.filter = { ...normalized.filter, ...nested.filter };
+    }
+    if (nested.search) {
+        normalized.search = { ...normalized.search, ...nested.search };
+    }
+    if (nested.sort) {
+        normalized.sort = { ...normalized.sort, ...nested.sort };
+    }
+    if (nested.category) {
+        normalized.category = { ...normalized.category, ...nested.category };
+        if (nested.category.filter) {
+            normalized.category.filter = { ...normalized.category?.filter, ...nested.category.filter };
+        }
+    }
+    if (nested.create) {
+        normalized.create = { ...normalized.create, ...nested.create };
+    }
+    if (nested.rowActions !== undefined) {
+        normalized.rowActions = nested.rowActions;
+    }
+    return normalized;
+}
+//#endregion
+class AXPEntityDataSelectorService {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.dataSelectorService = inject(AXPDataSelectorService);
+        this.filterOperatorMiddleware = inject(AXPFilterOperatorMiddlewareService);
+        this.widgetResolver = inject(AXPWidgetRegistryService);
+        this.entityResolver = inject(AXPEntityDefinitionRegistryService);
+        this.commandService = inject(AXPCommandService);
+        this.categoryTreeService = inject(AXPCategoryTreeService);
+        this.translationService = inject(AXTranslationService);
+        this.rowActionsService = inject(AXPEntityDataSelectorRowActionsService);
+    }
+    //#endregion
+    //#region ----   Public Methods   ----
+    /**
+     * Open entity data selector popup.
+     * Accepts nested {@link AXPEntityDataSelectorOpenOptions} or deprecated flat {@link AXPEntityDataSelectorOptions}.
+     */
+    async open(options) {
+        const normalized = normalizeEntityDataSelectorOptions(options);
+        const config = this.createDataSelectorConfig(normalized);
+        await this.applyCategoryFilter(normalized, config);
+        const result = (await this.dataSelectorService.open(config));
+        return result;
+    }
     /**
      * Execute Entity:Create and return created item.
      * Used by lookup widget and data selector for inline create.
@@ -12923,6 +13886,51 @@ class AXPEntityDataSelectorService {
     }
     //#endregion
     //#region ----   Private Methods   ----
+    /**
+     * Apply category sidebar config from normalized options or entity plugin auto-detection.
+     */
+    async applyCategoryFilter(options, config) {
+        const category = options.category;
+        if (category?.dataSource) {
+            config.category = {
+                enabled: category.enabled ?? true,
+                title: category.title ?? '@general:terms.classification.categories',
+                dataSource: category.dataSource,
+                filter: {
+                    field: category.filter?.field ?? 'categoryIds',
+                    operator: category.filter?.operator,
+                },
+                width: category.width,
+            };
+            return;
+        }
+        if (category?.enabled === false) {
+            return;
+        }
+        const categoryExt = options.entity?.extensions?.category;
+        if (!categoryExt) {
+            return;
+        }
+        const categoryTreeDataSource = await this.createCategoryTreeDataSource(categoryExt.entity, {
+            textField: categoryExt.textField,
+            valueField: categoryExt.valueField,
+            parentKey: categoryExt.parentKey,
+        });
+        if (!categoryTreeDataSource) {
+            return;
+        }
+        const propertyName = categoryExt.propertyName || 'categoryIds';
+        config.category = {
+            enabled: true,
+            title: category?.title ?? '@general:terms.classification.categories',
+            dataSource: categoryTreeDataSource,
+            filter: {
+                field: category?.filter?.field ?? propertyName,
+                operator: category?.filter?.operator ?? 'contains',
+            },
+            width: category?.width,
+        };
+    }
     /**
      * Create data selector configuration from entity options
      */
@@ -12930,27 +13938,43 @@ class AXPEntityDataSelectorService {
         const dataSource = this.createDataSource(options);
         const columns = this.createColumns(options);
         const searchFields = this.getSearchFields(options);
-        const allowCreate = options.allowCreate ?? this.getAllowCreate(options.entity);
+        const allowCreate = options.create?.mode ?? this.getAllowCreate(options.entity);
+        const rowActions = options.rowActions
+            ? this.rowActionsService.createHandler(options.entity, options.rowActions)
+            : undefined;
         return {
             title: options.title,
             dataSource,
-            columns,
-            selectionMode: options.allowMultiple ? 'multiple' : 'single',
-            searchFields,
-            initialSearchTerm: options.initialSearchTerm,
-            parentField: options.entity.parentKey,
-            filters: options.filters || undefined,
-            allowCreate,
-            onCreate: allowCreate !== 'none' ? (mode) => this.executeCreate(options.entity, mode) : undefined,
-            selectedItemIds: options.selectedItemIds,
-            // Note: Custom filters will be applied to the dataSource in createDataSource
+            grid: {
+                columns,
+                parentField: options.entity.parentKey,
+            },
+            selection: {
+                mode: options.selection?.multiple ? 'multiple' : 'single',
+                selectedItemIds: options.selection?.selectedItemIds,
+                allowUnselect: options.selection?.allowUnselect ?? true,
+            },
+            search: searchFields.length > 0 || options.search?.initial
+                ? {
+                    fields: searchFields,
+                    initial: options.search?.initial,
+                }
+                : undefined,
+            filter: options.filter?.value ? { value: options.filter.value } : undefined,
+            create: {
+                mode: allowCreate,
+                onCreate: allowCreate !== 'none' ? (mode) => this.executeCreate(options.entity, mode) : undefined,
+            },
+            rowActions,
         };
     }
     /**
      * Create data source from entity definition
      */
     createDataSource(options) {
-        const { entity, filters, parentFilters } = options;
+        const { entity } = options;
+        const filters = options.filter?.value;
+        const parentFilters = options.filter?.parent;
         return new AXDataSource({
             byKey: (key) => {
                 const func = entity.queries?.byKey?.execute;
@@ -12964,7 +13988,7 @@ class AXPEntityDataSelectorService {
                 this.mergeFilters(e, filters, parentFilters);
                 return func(e);
             },
-            pageSize: 10,
+            pageSize: options.grid?.pageSize ?? 10,
             key: 'id',
         });
     }
@@ -12972,7 +13996,8 @@ class AXPEntityDataSelectorService {
      * Create columns configuration from entity definition
      */
     createColumns(options) {
-        const { entity, columns = [] } = options;
+        const { entity } = options;
+        const columns = options.grid?.columns ?? [];
         const { columns: entityColumns = [], properties } = entity;
         const visibleProperties = properties.filter(({ schema }) => schema?.visible !== false);
         const visiblePropNames = new Set(visibleProperties.map(({ name }) => name));
@@ -13013,12 +14038,18 @@ class AXPEntityDataSelectorService {
                         dataType: 'string',
                         interface: {
                             type: column.showAs.type,
-                            options: { ...column.showAs.options, disableDetailPopover: true },
+                            options: {
+                                ...column.showAs.options,
+                                popover: { ...column.showAs.options?.['popover'], enabled: false },
+                            },
                         },
                     },
                 };
                 widgetType = column.showAs.type;
-                widgetOptions = { ...column.showAs.options, disableDetailPopover: true };
+                widgetOptions = {
+                    ...column.showAs.options,
+                    popover: { ...column.showAs.options?.['popover'], enabled: false },
+                };
             }
             else {
                 // Use entity property configuration - same columns, title, and interface as entity
@@ -13028,7 +14059,7 @@ class AXPEntityDataSelectorService {
                 widgetOptions = {
                     ...(iface?.options ?? {}),
                     ...(iface?.children?.length && { children: iface.children }),
-                    disableDetailPopover: true, // Column content is visible in lookup popup - no need for detail popover
+                    popover: { ...iface?.options?.['popover'], enabled: false },
                 };
             }
             // Get width from column options (set by middleware)
@@ -13052,7 +14083,8 @@ class AXPEntityDataSelectorService {
      * Get searchable fields from entity properties
      */
     getSearchFields(options) {
-        const { entity, searchFields } = options;
+        const { entity } = options;
+        const searchFields = options.search?.fields;
         const searchableFields = entity.properties
             .filter((p) => p.options?.filter?.inline?.enabled)
             .map((p) => {
@@ -13149,89 +14181,26 @@ class AXPEntityDataSelectorService {
         return normalized;
     }
     /**
-     * Create category tree data source from category entity key
+     * Create category tree data source from category entity key.
+     * Uses the same {@link AXPCategoryTreeService} as the entity master list category sidebar.
      */
-    async createCategoryTreeDataSource(categoryEntityKey) {
+    async createCategoryTreeDataSource(categoryEntityKey, categoryOptions) {
         try {
-            const [module, entity] = categoryEntityKey.split('.');
-            if (!module || !entity) {
-                return null;
-            }
-            const categoryEntity = await this.entityResolver.resolve(module, entity);
-            if (!categoryEntity?.queries?.list?.execute || typeof categoryEntity.queries.list.execute !== 'function') {
+            const treeConfig = {
+                entityKey: categoryEntityKey,
+                textField: categoryOptions?.textField,
+                valueField: categoryOptions?.valueField,
+                parentKey: categoryOptions?.parentKey,
+            };
+            const treeData = await this.categoryTreeService.initializeCategoryTree(treeConfig);
+            if (!treeData) {
                 return null;
             }
-            const listQuery = categoryEntity.queries.list.execute;
-            const parentKey = categoryEntity.parentKey || 'parentId';
-            const categoryTreeDataSource = {
-                loadRootNodes: async () => {
-                    const result = await listQuery({
-                        skip: 0,
-                        take: 1000,
-                        filter: {
-                            field: parentKey,
-                            operator: { type: 'isNull' },
-                        },
-                        sort: [{ field: 'title', dir: 'asc' }],
-                    });
-                    return (result?.items || []).map((item) => ({
-                        id: item.id,
-                        title: item.title || item.name,
-                        description: item.description || '',
-                        parentId: item[parentKey],
-                        childrenCount: item.childrenCount || 0,
-                    }));
-                },
-                loadChildNodes: async (parentId) => {
-                    const result = await listQuery({
-                        skip: 0,
-                        take: 1000,
-                        filter: {
-                            field: parentKey,
-                            operator: { type: 'equal' },
-                            value: parentId,
-                        },
-                        sort: [{ field: 'title', dir: 'asc' }],
-                    });
-                    return (result?.items || []).map((item) => ({
-                        id: item.id,
-                        title: item.title || item.name,
-                        description: item.description || '',
-                        parentId: item[parentKey],
-                        childrenCount: item.childrenCount || 0,
-                    }));
-                },
-                searchNodes: async (searchValue) => {
-                    const result = await listQuery({
-                        skip: 0,
-                        take: 1000,
-                        filter: {
-                            filters: [
-                                {
-                                    field: 'title',
-                                    operator: { type: 'contains' },
-                                    value: searchValue,
-                                },
-                                {
-                                    field: 'name',
-                                    operator: { type: 'contains' },
-                                    value: searchValue,
-                                },
-                            ],
-                            logic: 'or',
-                        },
-                        sort: [{ field: 'title', dir: 'asc' }],
-                    });
-                    return (result?.items || []).map((item) => ({
-                        id: item.id,
-                        title: item.title || item.name,
-                        description: item.description || '',
-                        parentId: item[parentKey],
-                        childrenCount: item.childrenCount || 0,
-                    }));
-                },
-            };
-            return categoryTreeDataSource;
+            const parentKey = treeConfig.parentKey || treeData.categoryEntityDef?.parentKey || 'parentId';
+            treeConfig.parentKey = parentKey;
+            treeConfig.textField = treeConfig.textField ?? 'title';
+            treeConfig.valueField = treeConfig.valueField ?? 'id';
+            return this.buildCategoryTreeDataSource(treeData, treeConfig, parentKey);
         }
         catch (error) {
             console.error('Error creating category tree data source:', error);
@@ -13239,28 +14208,109 @@ class AXPEntityDataSelectorService {
         }
     }
     /**
-     * Merge custom and parent filters into data source query
+     * Build category tree data source callbacks backed by shared category tree service.
      */
-    mergeFilters(request, customFilter, parentFilters) {
-        if (!customFilter && !parentFilters) {
-            return request;
-        }
-        const filters = [];
-        // Add custom filter
-        if (customFilter) {
-            const cleanedFilters = AXPCleanNestedFilters([customFilter]);
-            if (cleanedFilters.length > 0) {
-                filters.push(this.filterOperatorMiddleware.transformFilter(cleanedFilters[0]));
-            }
+    buildCategoryTreeDataSource(treeData, treeConfig, parentKey) {
+        return {
+            loadRootNodes: async () => {
+                const items = await this.categoryTreeService.loadRootCategories(treeData, treeConfig);
+                if (!items) {
+                    return [];
+                }
+                return items
+                    .filter((item) => isNil(item[parentKey]) || item[parentKey] === '')
+                    .map((item) => this.mapCategoryItemToEntity(item, treeConfig, parentKey));
+            },
+            loadChildNodes: async (parentId) => {
+                const targetNode = { id: parentId, title: '', data: {} };
+                const children = await this.categoryTreeService.loadChildren(targetNode, treeData, treeConfig);
+                return children.map((node) => this.mapCategoryTreeNodeToEntity(node, parentKey));
+            },
+            searchNodes: async (searchValue) => {
+                const items = await this.categoryTreeService.searchCategories(searchValue, treeData, treeConfig);
+                if (!items) {
+                    return [];
+                }
+                return items.map((item) => this.mapCategoryItemToEntity(item, treeConfig, parentKey));
+            },
+        };
+    }
+    /**
+     * Map a category entity row to {@link AXPCategoryEntity} for the reusable category tree component.
+     */
+    mapCategoryItemToEntity(item, config, parentKey) {
+        const textField = config.textField ?? 'title';
+        const valueField = config.valueField ?? 'id';
+        let childrenCount = 0;
+        if (typeof item['childrenCount'] === 'number') {
+            childrenCount = item['childrenCount'];
         }
-        // Add parent filters
-        if (parentFilters) {
-            filters.push(parentFilters);
+        else if (Array.isArray(item['children'])) {
+            childrenCount = item['children'].length;
         }
-        // Merge with existing filter
-        if (request.filter) {
-            request.filter = {
-                logic: 'and',
+        return {
+            id: String(item[valueField] ?? ''),
+            title: this.resolveCategoryText(item[textField] ?? item['name']),
+            description: this.resolveCategoryText(item['description']),
+            parentId: item[parentKey],
+            childrenCount,
+        };
+    }
+    /**
+     * Map a lazy-loaded tree node to {@link AXPCategoryEntity}.
+     */
+    mapCategoryTreeNodeToEntity(node, parentKey) {
+        const data = node['data'] ?? {};
+        let childrenCount = 0;
+        if (typeof node['childrenCount'] === 'number') {
+            childrenCount = node['childrenCount'];
+        }
+        else if (typeof data['childrenCount'] === 'number') {
+            childrenCount = data['childrenCount'];
+        }
+        return {
+            id: String(node['id'] ?? ''),
+            title: String(node['title'] ?? ''),
+            description: this.resolveCategoryText(data['description']),
+            parentId: data[parentKey],
+            childrenCount,
+        };
+    }
+    /**
+     * Resolve category display text, including multi-language titles.
+     */
+    resolveCategoryText(value) {
+        if (isNil(value)) {
+            return '';
+        }
+        if (typeof value === 'object') {
+            return resolveMultiLanguageString(value, this.translationService.getActiveLang());
+        }
+        return String(value);
+    }
+    /**
+     * Merge custom and parent filters into data source query
+     */
+    mergeFilters(request, customFilter, parentFilters) {
+        if (!customFilter && !parentFilters) {
+            return request;
+        }
+        const filters = [];
+        // Add custom filter
+        if (customFilter) {
+            const cleanedFilters = AXPCleanNestedFilters([customFilter]);
+            if (cleanedFilters.length > 0) {
+                filters.push(this.filterOperatorMiddleware.transformFilter(cleanedFilters[0]));
+            }
+        }
+        // Add parent filters
+        if (parentFilters) {
+            filters.push(parentFilters);
+        }
+        // Merge with existing filter
+        if (request.filter) {
+            request.filter = {
+                logic: 'and',
                 filters: [...[request.filter], ...filters],
             };
         }
@@ -13573,11 +14623,13 @@ class AXPLookupWidgetTagboxComponent extends LookupWidgetLookBase {
         this.placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
         this.hasClearButton = input(false, ...(ngDevMode ? [{ debugName: "hasClearButton" }] : /* istanbul ignore next */ []));
         this.allowCreate = input('none', ...(ngDevMode ? [{ debugName: "allowCreate" }] : /* istanbul ignore next */ []));
+        this.allowUnselect = input(true, ...(ngDevMode ? [{ debugName: "allowUnselect" }] : /* istanbul ignore next */ []));
         // Entity and configuration data (for showSelector and searchByValue)
         this.entityDef = input.required(...(ngDevMode ? [{ debugName: "entityDef" }] : /* istanbul ignore next */ []));
         this.customFilter = input.required(...(ngDevMode ? [{ debugName: "customFilter" }] : /* istanbul ignore next */ []));
         this.columns = input.required(...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
         this.parentFilters = input(null, ...(ngDevMode ? [{ debugName: "parentFilters" }] : /* istanbul ignore next */ []));
+        this.rowActions = input(undefined, ...(ngDevMode ? [{ debugName: "rowActions" }] : /* istanbul ignore next */ []));
         // Business logic callbacks
         this.onSetLoading = input.required(...(ngDevMode ? [{ debugName: "onSetLoading" }] : /* istanbul ignore next */ []));
         //#endregion
@@ -13757,12 +14809,14 @@ class AXPLookupWidgetTagboxComponent extends LookupWidgetLookBase {
                 entity,
                 title: `${this.translateService.translateSync(entity.formats.plural ?? '')}`,
                 allowMultiple: this.multiple()(),
+                allowUnselect: this.allowUnselect(),
                 filters: this.customFilter()(),
                 parentFilters: this.parentFilters(),
                 columns: this.columns()(),
                 allowCreate: this.allowCreate(),
                 initialSearchTerm: searchTerm,
                 selectedItemIds: selectedItemIds.length > 0 ? selectedItemIds : undefined,
+                rowActions: this.rowActions(),
             });
             if (result && 'items' in result) {
                 this.valueChanged.emit(result.items);
@@ -13785,7 +14839,7 @@ class AXPLookupWidgetTagboxComponent extends LookupWidgetLookBase {
         this.clear();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLookupWidgetTagboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPLookupWidgetTagboxComponent, isStandalone: true, selector: "axp-lookup-widget-tagbox", inputs: { selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: true, transformFunction: null }, displayField: { classPropertyName: "displayField", publicName: "displayField", isSignal: true, isRequired: true, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: true, transformFunction: null }, displayFormat: { classPropertyName: "displayFormat", publicName: "displayFormat", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, validationRules: { classPropertyName: "validationRules", publicName: "validationRules", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hasClearButton: { classPropertyName: "hasClearButton", publicName: "hasClearButton", isSignal: true, isRequired: false, transformFunction: null }, allowCreate: { classPropertyName: "allowCreate", publicName: "allowCreate", isSignal: true, isRequired: false, transformFunction: null }, entityDef: { classPropertyName: "entityDef", publicName: "entityDef", isSignal: true, isRequired: true, transformFunction: null }, customFilter: { classPropertyName: "customFilter", publicName: "customFilter", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, parentFilters: { classPropertyName: "parentFilters", publicName: "parentFilters", isSignal: true, isRequired: false, transformFunction: null }, onSetLoading: { classPropertyName: "onSetLoading", publicName: "onSetLoading", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPLookupWidgetTagboxComponent, isStandalone: true, selector: "axp-lookup-widget-tagbox", inputs: { selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: true, transformFunction: null }, displayField: { classPropertyName: "displayField", publicName: "displayField", isSignal: true, isRequired: true, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: true, transformFunction: null }, displayFormat: { classPropertyName: "displayFormat", publicName: "displayFormat", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, validationRules: { classPropertyName: "validationRules", publicName: "validationRules", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hasClearButton: { classPropertyName: "hasClearButton", publicName: "hasClearButton", isSignal: true, isRequired: false, transformFunction: null }, allowCreate: { classPropertyName: "allowCreate", publicName: "allowCreate", isSignal: true, isRequired: false, transformFunction: null }, allowUnselect: { classPropertyName: "allowUnselect", publicName: "allowUnselect", isSignal: true, isRequired: false, transformFunction: null }, entityDef: { classPropertyName: "entityDef", publicName: "entityDef", isSignal: true, isRequired: true, transformFunction: null }, customFilter: { classPropertyName: "customFilter", publicName: "customFilter", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, parentFilters: { classPropertyName: "parentFilters", publicName: "parentFilters", isSignal: true, isRequired: false, transformFunction: null }, rowActions: { classPropertyName: "rowActions", publicName: "rowActions", isSignal: true, isRequired: false, transformFunction: null }, onSetLoading: { classPropertyName: "onSetLoading", publicName: "onSetLoading", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, providers: [
             {
                 provide: LookupWidgetLookBase,
                 useExisting: AXPLookupWidgetTagboxComponent,
@@ -13924,7 +14978,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                         },
                     ],
                 }]
-        }], propDecorators: { selectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItems", required: true }] }], displayField: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayField", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: true }] }], displayFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayFormat", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: true }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: true }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: true }] }], validationRules: [{ type: i0.Input, args: [{ isSignal: true, alias: "validationRules", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hasClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasClearButton", required: false }] }], allowCreate: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCreate", required: false }] }], entityDef: [{ type: i0.Input, args: [{ isSignal: true, alias: "entityDef", required: true }] }], customFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "customFilter", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], parentFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentFilters", required: false }] }], onSetLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "onSetLoading", required: true }] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }], tagBox: [{ type: i0.ViewChild, args: ['tagBoxComponent', { isSignal: true }] }] } });
+        }], propDecorators: { selectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItems", required: true }] }], displayField: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayField", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: true }] }], displayFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayFormat", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: true }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: true }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: true }] }], validationRules: [{ type: i0.Input, args: [{ isSignal: true, alias: "validationRules", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hasClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasClearButton", required: false }] }], allowCreate: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCreate", required: false }] }], allowUnselect: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowUnselect", required: false }] }], entityDef: [{ type: i0.Input, args: [{ isSignal: true, alias: "entityDef", required: true }] }], customFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "customFilter", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], parentFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentFilters", required: false }] }], rowActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowActions", required: false }] }], onSetLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "onSetLoading", required: true }] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }], tagBox: [{ type: i0.ViewChild, args: ['tagBoxComponent', { isSignal: true }] }] } });
 
 class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
     constructor() {
@@ -13964,9 +15018,11 @@ class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
         this.placeholder = computed(() => this.options()['placeholder'] ?? '', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
         this.filterMode = computed(() => this.options()['filterMode'], ...(ngDevMode ? [{ debugName: "filterMode" }] : /* istanbul ignore next */ []));
         this.multiple = computed(() => (this.options()['multiple'] ?? false), ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+        this.allowUnselect = computed(() => this.options()['allowUnselect'] ?? true, ...(ngDevMode ? [{ debugName: "allowUnselect" }] : /* istanbul ignore next */ []));
         this.look = computed(() => this.options()['look'] ?? 'lookup', ...(ngDevMode ? [{ debugName: "look" }] : /* istanbul ignore next */ []));
         this.displayField = computed(() => resolveLookupDisplayField(this.entityDef(), { textField: this.textField() }), ...(ngDevMode ? [{ debugName: "displayField" }] : /* istanbul ignore next */ []));
         this.allowCreate = computed(() => this.options()['allowCreate'] ?? 'none', ...(ngDevMode ? [{ debugName: "allowCreate" }] : /* istanbul ignore next */ []));
+        this.selectorRowActions = computed(() => this.options()['selectorRowActions'], ...(ngDevMode ? [{ debugName: "selectorRowActions" }] : /* istanbul ignore next */ []));
         this.valueField = computed(() => this.entityDef()?.properties.find((c) => c.name == 'id')?.name ?? 'id', ...(ngDevMode ? [{ debugName: "valueField" }] : /* istanbul ignore next */ []));
         this.displayFormat = computed(() => resolveLookupDisplayTemplate(this.entityDef(), {
             displayFormat: this.options()['displayFormat'],
@@ -14247,10 +15303,12 @@ class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
               [validationRules]="validationRules"
               [hasClearButton]="hasClearButton()"
               [allowCreate]="allowCreate()"
+              [allowUnselect]="allowUnselect()"
               [entityDef]="entityDef"
               [customFilter]="customFilter"
               [columns]="columns"
               [parentFilters]="filter"
+              [rowActions]="selectorRowActions()"
               [onSetLoading]="setLoading.bind(this)"
               (valueChanged)="handleComponentValueChanged($event)"
             />
@@ -14271,7 +15329,7 @@ class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
         }
       </div>
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPLookupWidgetSelectComponent, selector: "axp-lookup-widget-select", inputs: ["entityDef", "customFilter", "selectedItems", "displayField", "valueField", "disabled", "multiple", "validationRules", "placeholder", "hasClearButton", "allowCreate", "showItemTooltip", "isItemTruncated"], outputs: ["valueChanged"] }, { kind: "component", type: AXPLookupWidgetTagboxComponent, selector: "axp-lookup-widget-tagbox", inputs: ["selectedItems", "displayField", "valueField", "displayFormat", "disabled", "multiple", "isLoading", "validationRules", "placeholder", "hasClearButton", "allowCreate", "entityDef", "customFilter", "columns", "parentFilters", "onSetLoading"], outputs: ["valueChanged"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPLookupWidgetSelectComponent, selector: "axp-lookup-widget-select", inputs: ["entityDef", "customFilter", "selectedItems", "displayField", "valueField", "disabled", "multiple", "validationRules", "placeholder", "hasClearButton", "allowCreate", "showItemTooltip", "isItemTruncated"], outputs: ["valueChanged"] }, { kind: "component", type: AXPLookupWidgetTagboxComponent, selector: "axp-lookup-widget-tagbox", inputs: ["selectedItems", "displayField", "valueField", "displayFormat", "disabled", "multiple", "isLoading", "validationRules", "placeholder", "hasClearButton", "allowCreate", "allowUnselect", "entityDef", "customFilter", "columns", "parentFilters", "rowActions", "onSetLoading"], outputs: ["valueChanged"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLookupWidgetEditComponent, decorators: [{
             type: Component,
@@ -14314,10 +15372,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
               [validationRules]="validationRules"
               [hasClearButton]="hasClearButton()"
               [allowCreate]="allowCreate()"
+              [allowUnselect]="allowUnselect()"
               [entityDef]="entityDef"
               [customFilter]="customFilter"
               [columns]="columns"
               [parentFilters]="filter"
+              [rowActions]="selectorRowActions()"
               [onSetLoading]="setLoading.bind(this)"
               (valueChanged)="handleComponentValueChanged($event)"
             />
@@ -14393,6 +15453,10 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
             return this.columnResolve()?.strategy ?? 'hydrated';
         }, ...(ngDevMode ? [{ debugName: "resolveStrategy" }] : /* istanbul ignore next */ []));
         this.isHydratedStrategy = computed(() => this.resolveStrategy() === 'hydrated', ...(ngDevMode ? [{ debugName: "isHydratedStrategy" }] : /* istanbul ignore next */ []));
+        this.detailPopoverEnabled = computed(() => {
+            const popover = this.options.popover;
+            return popover?.enabled !== false;
+        }, ...(ngDevMode ? [{ debugName: "detailPopoverEnabled" }] : /* istanbul ignore next */ []));
         //#endregion
         //#region ---- Signals ----
         this.isMorePopoverOpen = signal(false, ...(ngDevMode ? [{ debugName: "isMorePopoverOpen" }] : /* istanbul ignore next */ []));
@@ -14519,8 +15583,7 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
                 return;
             }
             const values = castArray(raw).filter((value) => value != null && value !== '');
-            const needsHydrate = values.length > 0 &&
-                values.every((value) => typeof value !== 'object' && this.isLikelyEntityId(value));
+            const needsHydrate = values.length > 0 && values.every((value) => typeof value !== 'object' && this.isLikelyEntityId(value));
             if (!needsHydrate) {
                 this.hydratedDisplayItems.set(null);
                 return;
@@ -14549,7 +15612,7 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
         }
     }
     async showItemDetail(item, index) {
-        if (this.options['disableDetailPopover']) {
+        if (!this.detailPopoverEnabled()) {
             return;
         }
         this.selectedItemIndex.set(index);
@@ -14581,9 +15644,7 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
         let resolvedTitle = '';
         if (headerItem != null && this.hasDisplayTextOnLookupValue(headerItem)) {
             resolvedTitle =
-                typeof headerItem === 'object'
-                    ? this.renderLookupLabel(headerItem)
-                    : this.formatDisplayValue(headerItem);
+                typeof headerItem === 'object' ? this.renderLookupLabel(headerItem) : this.formatDisplayValue(headerItem);
         }
         else if (!this.isMultiValueLookup()) {
             const rowText = this.getRowDisplayTextFromTextField();
@@ -14608,7 +15669,7 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
         });
     }
     handleItemClick(index) {
-        if (this.options['disableDetailPopover']) {
+        if (!this.detailPopoverEnabled()) {
             return;
         }
         const items = this.allItems();
@@ -14617,7 +15678,7 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
         }
     }
     handleResolvedItemClick(index) {
-        if (this.options['disableDetailPopover']) {
+        if (!this.detailPopoverEnabled()) {
             return;
         }
         const items = this.resolvedPopoverItems();
@@ -14643,9 +15704,7 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
             return values.length > 0 && values.every((value) => this.hasDisplayTextOnLookupValue(value));
         }
         const rowText = this.getRowDisplayTextFromTextField();
-        if (!isNil(rowText) &&
-            rowText !== '' &&
-            (typeof rowText !== 'string' || !this.isLikelyEntityId(rowText))) {
+        if (!isNil(rowText) && rowText !== '' && (typeof rowText !== 'string' || !this.isLikelyEntityId(rowText))) {
             return true;
         }
         const raw = this.rawValue;
@@ -14991,11 +16050,11 @@ class AXPLookupWidgetColumnComponent extends AXPColumnWidgetComponent {
         return /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(value) || /^\d+$/.test(value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLookupWidgetColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPLookupWidgetColumnComponent, isStandalone: true, selector: "ng-component", inputs: { rawValue: "rawValue", rowData: "rowData" }, viewQueries: [{ propertyName: "moreButton", first: true, predicate: ["moreButton"], descendants: true, isSignal: true }, { propertyName: "lazyTrigger", first: true, predicate: ["lazyTrigger"], descendants: true, isSignal: true }, { propertyName: "morePopover", first: true, predicate: ["morePopover"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (isHydratedStrategy()) {\n<div class=\"ax-relative ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @for (item of visibleItems(); track $index) {\n  @let label = getDisplayRaw(item);\n  <span\n    [class.ax-cursor-pointer]=\"!options['disableDetailPopover']\"\n    [class.hover:ax-text-primary]=\"!options['disableDetailPopover']\"\n    [class.hover:ax-underline]=\"!options['disableDetailPopover']\"\n    (click)=\"handleItemClick($index)\"\n  >\n    {{ label }}\n  </span>\n  @if ($index < visibleItems().length - 1) {\n  <span class=\"ax-text-muted\">\u2022</span>\n  }\n  } @empty {\n  <span class=\"ax-text-muted\">---</span>\n  }\n  @if (hasMoreItems()) {\n  <span\n    class=\"ax-absolute ax-end-0 ax-flex ax-h-full ax-cursor-pointer ax-items-center ax-px-1 hover:ax-primary-lighter\"\n    (click)=\"showMoreItems(); $event.stopPropagation()\"\n    #moreButton\n  >\n    <i class=\"fa-light fa-ellipsis-vertical\"></i>\n  </span>\n  }\n</div>\n} @else {\n<div class=\"ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @if (displayCount() > 0) {\n  <span\n    class=\"ax-cursor-pointer ax-text-primary hover:ax-underline\"\n    (click)=\"openLazyPopover(); $event.stopPropagation()\"\n    #lazyTrigger\n  >\n    {{ summaryLabel() }}\n  </span>\n  } @else {\n  <span class=\"ax-text-muted\">---</span>\n  }\n</div>\n}\n\n<ax-popover [openOn]=\"'manual'\" #morePopover (openChange)=\"onPopoverOpenChange($event)\">\n  <div class=\"ax-lightest-surface ax-min-w-[280px] ax-rounded-lg ax-border ax-p-4 ax-shadow-lg\">\n    <div class=\"ax-mb-4 ax-border-b ax-pb-2\">\n      <h3 class=\"ax-text-base ax-font-semibold\">{{ popoverHeader() }}</h3>\n    </div>\n\n    @if (!isHydratedStrategy() && resolveStatus() === 'loading') {\n    <div class=\"ax-flex ax-min-h-[120px] ax-items-center ax-justify-center\">\n      <ax-loading></ax-loading>\n    </div>\n    } @else if (!isHydratedStrategy() && resolveStatus() === 'error') {\n    <div class=\"ax-text-danger ax-text-sm\">{{ resolveError() }}</div>\n    } @else {\n    <div class=\"ax-flex ax-max-h-64 ax-flex-col ax-gap-3\">\n      @for (item of popoverListItems(); track $index) {\n      @let label = getDisplayRaw(item);\n      <span\n        [class.ax-cursor-pointer]=\"!options['disableDetailPopover']\"\n        [class.hover:ax-text-primary]=\"!options['disableDetailPopover']\"\n        [class.hover:ax-underline]=\"!options['disableDetailPopover']\"\n        (click)=\"handlePopoverItemClick($index)\"\n      >\n        {{ label }}\n      </span>\n      } @empty {\n      <span class=\"ax-text-muted\">---</span>\n      }\n    </div>\n    }\n  </div>\n</ax-popover>\n", dependencies: [{ kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i1$2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPLookupWidgetColumnComponent, isStandalone: true, selector: "ng-component", inputs: { rawValue: "rawValue", rowData: "rowData" }, viewQueries: [{ propertyName: "moreButton", first: true, predicate: ["moreButton"], descendants: true, isSignal: true }, { propertyName: "lazyTrigger", first: true, predicate: ["lazyTrigger"], descendants: true, isSignal: true }, { propertyName: "morePopover", first: true, predicate: ["morePopover"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (isHydratedStrategy()) {\n<div class=\"ax-relative ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @for (item of visibleItems(); track $index) {\n  @let label = getDisplayRaw(item);\n  <span\n    [class.ax-cursor-pointer]=\"detailPopoverEnabled()\"\n    [class.hover:ax-text-primary]=\"detailPopoverEnabled()\"\n    [class.hover:ax-underline]=\"detailPopoverEnabled()\"\n    (click)=\"handleItemClick($index)\"\n  >\n    {{ label }}\n  </span>\n  @if ($index < visibleItems().length - 1) {\n  <span class=\"ax-text-muted\">\u2022</span>\n  }\n  } @empty {\n  <span class=\"ax-text-muted\">---</span>\n  }\n  @if (hasMoreItems()) {\n  <span\n    class=\"ax-absolute ax-end-0 ax-flex ax-h-full ax-cursor-pointer ax-items-center ax-px-1 hover:ax-primary-lighter\"\n    (click)=\"showMoreItems(); $event.stopPropagation()\"\n    #moreButton\n  >\n    <i class=\"fa-light fa-ellipsis-vertical\"></i>\n  </span>\n  }\n</div>\n} @else {\n<div class=\"ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @if (displayCount() > 0) {\n  <span\n    class=\"ax-cursor-pointer ax-text-primary hover:ax-underline\"\n    (click)=\"openLazyPopover(); $event.stopPropagation()\"\n    #lazyTrigger\n  >\n    {{ summaryLabel() }}\n  </span>\n  } @else {\n  <span class=\"ax-text-muted\">---</span>\n  }\n</div>\n}\n\n<ax-popover [openOn]=\"'manual'\" #morePopover (openChange)=\"onPopoverOpenChange($event)\">\n  <div class=\"ax-lightest-surface ax-min-w-[280px] ax-rounded-lg ax-border ax-p-4 ax-shadow-lg\">\n    <div class=\"ax-mb-4 ax-border-b ax-pb-2\">\n      <h3 class=\"ax-text-base ax-font-semibold\">{{ popoverHeader() }}</h3>\n    </div>\n\n    @if (!isHydratedStrategy() && resolveStatus() === 'loading') {\n    <div class=\"ax-flex ax-min-h-[120px] ax-items-center ax-justify-center\">\n      <ax-loading></ax-loading>\n    </div>\n    } @else if (!isHydratedStrategy() && resolveStatus() === 'error') {\n    <div class=\"ax-text-danger ax-text-sm\">{{ resolveError() }}</div>\n    } @else {\n    <div class=\"ax-flex ax-max-h-64 ax-flex-col ax-gap-3\">\n      @for (item of popoverListItems(); track $index) {\n      @let label = getDisplayRaw(item);\n      <span\n        [class.ax-cursor-pointer]=\"detailPopoverEnabled()\"\n        [class.hover:ax-text-primary]=\"detailPopoverEnabled()\"\n        [class.hover:ax-underline]=\"detailPopoverEnabled()\"\n        (click)=\"handlePopoverItemClick($index)\"\n      >\n        {{ label }}\n      </span>\n      } @empty {\n      <span class=\"ax-text-muted\">---</span>\n      }\n    </div>\n    }\n  </div>\n</ax-popover>\n", dependencies: [{ kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i1$2.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLookupWidgetColumnComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXLoadingModule, AXPopoverModule], inputs: ['rawValue', 'rowData'], template: "@if (isHydratedStrategy()) {\n<div class=\"ax-relative ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @for (item of visibleItems(); track $index) {\n  @let label = getDisplayRaw(item);\n  <span\n    [class.ax-cursor-pointer]=\"!options['disableDetailPopover']\"\n    [class.hover:ax-text-primary]=\"!options['disableDetailPopover']\"\n    [class.hover:ax-underline]=\"!options['disableDetailPopover']\"\n    (click)=\"handleItemClick($index)\"\n  >\n    {{ label }}\n  </span>\n  @if ($index < visibleItems().length - 1) {\n  <span class=\"ax-text-muted\">\u2022</span>\n  }\n  } @empty {\n  <span class=\"ax-text-muted\">---</span>\n  }\n  @if (hasMoreItems()) {\n  <span\n    class=\"ax-absolute ax-end-0 ax-flex ax-h-full ax-cursor-pointer ax-items-center ax-px-1 hover:ax-primary-lighter\"\n    (click)=\"showMoreItems(); $event.stopPropagation()\"\n    #moreButton\n  >\n    <i class=\"fa-light fa-ellipsis-vertical\"></i>\n  </span>\n  }\n</div>\n} @else {\n<div class=\"ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @if (displayCount() > 0) {\n  <span\n    class=\"ax-cursor-pointer ax-text-primary hover:ax-underline\"\n    (click)=\"openLazyPopover(); $event.stopPropagation()\"\n    #lazyTrigger\n  >\n    {{ summaryLabel() }}\n  </span>\n  } @else {\n  <span class=\"ax-text-muted\">---</span>\n  }\n</div>\n}\n\n<ax-popover [openOn]=\"'manual'\" #morePopover (openChange)=\"onPopoverOpenChange($event)\">\n  <div class=\"ax-lightest-surface ax-min-w-[280px] ax-rounded-lg ax-border ax-p-4 ax-shadow-lg\">\n    <div class=\"ax-mb-4 ax-border-b ax-pb-2\">\n      <h3 class=\"ax-text-base ax-font-semibold\">{{ popoverHeader() }}</h3>\n    </div>\n\n    @if (!isHydratedStrategy() && resolveStatus() === 'loading') {\n    <div class=\"ax-flex ax-min-h-[120px] ax-items-center ax-justify-center\">\n      <ax-loading></ax-loading>\n    </div>\n    } @else if (!isHydratedStrategy() && resolveStatus() === 'error') {\n    <div class=\"ax-text-danger ax-text-sm\">{{ resolveError() }}</div>\n    } @else {\n    <div class=\"ax-flex ax-max-h-64 ax-flex-col ax-gap-3\">\n      @for (item of popoverListItems(); track $index) {\n      @let label = getDisplayRaw(item);\n      <span\n        [class.ax-cursor-pointer]=\"!options['disableDetailPopover']\"\n        [class.hover:ax-text-primary]=\"!options['disableDetailPopover']\"\n        [class.hover:ax-underline]=\"!options['disableDetailPopover']\"\n        (click)=\"handlePopoverItemClick($index)\"\n      >\n        {{ label }}\n      </span>\n      } @empty {\n      <span class=\"ax-text-muted\">---</span>\n      }\n    </div>\n    }\n  </div>\n</ax-popover>\n" }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXLoadingModule, AXPopoverModule], inputs: ['rawValue', 'rowData'], template: "@if (isHydratedStrategy()) {\n<div class=\"ax-relative ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @for (item of visibleItems(); track $index) {\n  @let label = getDisplayRaw(item);\n  <span\n    [class.ax-cursor-pointer]=\"detailPopoverEnabled()\"\n    [class.hover:ax-text-primary]=\"detailPopoverEnabled()\"\n    [class.hover:ax-underline]=\"detailPopoverEnabled()\"\n    (click)=\"handleItemClick($index)\"\n  >\n    {{ label }}\n  </span>\n  @if ($index < visibleItems().length - 1) {\n  <span class=\"ax-text-muted\">\u2022</span>\n  }\n  } @empty {\n  <span class=\"ax-text-muted\">---</span>\n  }\n  @if (hasMoreItems()) {\n  <span\n    class=\"ax-absolute ax-end-0 ax-flex ax-h-full ax-cursor-pointer ax-items-center ax-px-1 hover:ax-primary-lighter\"\n    (click)=\"showMoreItems(); $event.stopPropagation()\"\n    #moreButton\n  >\n    <i class=\"fa-light fa-ellipsis-vertical\"></i>\n  </span>\n  }\n</div>\n} @else {\n<div class=\"ax-flex ax-min-w-0 ax-items-center ax-gap-1\">\n  @if (displayCount() > 0) {\n  <span\n    class=\"ax-cursor-pointer ax-text-primary hover:ax-underline\"\n    (click)=\"openLazyPopover(); $event.stopPropagation()\"\n    #lazyTrigger\n  >\n    {{ summaryLabel() }}\n  </span>\n  } @else {\n  <span class=\"ax-text-muted\">---</span>\n  }\n</div>\n}\n\n<ax-popover [openOn]=\"'manual'\" #morePopover (openChange)=\"onPopoverOpenChange($event)\">\n  <div class=\"ax-lightest-surface ax-min-w-[280px] ax-rounded-lg ax-border ax-p-4 ax-shadow-lg\">\n    <div class=\"ax-mb-4 ax-border-b ax-pb-2\">\n      <h3 class=\"ax-text-base ax-font-semibold\">{{ popoverHeader() }}</h3>\n    </div>\n\n    @if (!isHydratedStrategy() && resolveStatus() === 'loading') {\n    <div class=\"ax-flex ax-min-h-[120px] ax-items-center ax-justify-center\">\n      <ax-loading></ax-loading>\n    </div>\n    } @else if (!isHydratedStrategy() && resolveStatus() === 'error') {\n    <div class=\"ax-text-danger ax-text-sm\">{{ resolveError() }}</div>\n    } @else {\n    <div class=\"ax-flex ax-max-h-64 ax-flex-col ax-gap-3\">\n      @for (item of popoverListItems(); track $index) {\n      @let label = getDisplayRaw(item);\n      <span\n        [class.ax-cursor-pointer]=\"detailPopoverEnabled()\"\n        [class.hover:ax-text-primary]=\"detailPopoverEnabled()\"\n        [class.hover:ax-underline]=\"detailPopoverEnabled()\"\n        (click)=\"handlePopoverItemClick($index)\"\n      >\n        {{ label }}\n      </span>\n      } @empty {\n      <span class=\"ax-text-muted\">---</span>\n      }\n    </div>\n    }\n  </div>\n</ax-popover>\n" }]
         }], ctorParameters: () => [], propDecorators: { moreButton: [{ type: i0.ViewChild, args: ['moreButton', { isSignal: true }] }], lazyTrigger: [{ type: i0.ViewChild, args: ['lazyTrigger', { isSignal: true }] }], morePopover: [{ type: i0.ViewChild, args: ['morePopover', { isSignal: true }] }] } });
 
 var lookupWidgetColumn_component = /*#__PURE__*/Object.freeze({
@@ -15044,6 +16103,13 @@ const AXPLookupWidget = {
             visible: true,
         },
         AXP_ALLOW_MULTIPLE_PROPERTY,
+        createBooleanProperty({
+            name: 'popoverEnabled',
+            title: 'Entity Detail Popover',
+            path: 'options.popover.enabled',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+            defaultValue: true,
+        }),
         {
             name: 'displayFormat',
             title: 'Display Format',
@@ -16350,105 +17416,1921 @@ class AXPMultiSourceSelectorWidgetColumnComponent extends AXPColumnWidgetCompone
             const def = await this.definitionService.getDefinition(this.providerName);
             this.definition.set(def);
         }
-        catch (error) {
-            console.error(`[MultiSourceSelectorColumn] Error loading definition '${this.providerName}':`, error);
+        catch (error) {
+            console.error(`[MultiSourceSelectorColumn] Error loading definition '${this.providerName}':`, error);
+        }
+    }
+    extractDisplayItem(ref) {
+        if (!ref) {
+            return null;
+        }
+        const def = this.definition();
+        // If ref is already AXPMultiSourceRef format
+        if (ref.sourceKey && ref.displayName) {
+            return {
+                id: ref.refId || ref.sourceKey,
+                text: ref.displayName,
+            };
+        }
+        // If ref is object with id
+        if (typeof ref === 'object' && ref.id) {
+            const sourceKey = ref.sourceKey;
+            if (sourceKey && def) {
+                const source = def.sources.find((s) => s.key === sourceKey);
+                if (source) {
+                    const displayText = this.getDisplayText(ref, source);
+                    return {
+                        id: ref.id,
+                        text: displayText,
+                    };
+                }
+            }
+            // Fallback
+            const displayText = ref.displayName || ref.title || ref.id || String(ref);
+            return {
+                id: ref.id,
+                text: displayText,
+            };
+        }
+        // If ref is primitive
+        return {
+            id: String(ref),
+            text: String(ref),
+        };
+    }
+    getDisplayText(item, source) {
+        if (!item) {
+            return '';
+        }
+        const template = source.displayFormat || this.displayFormat();
+        if (template) {
+            const formatted = this.formatService.format(template, 'string', item);
+            if (formatted) {
+                return formatted;
+            }
+        }
+        // Fallback to common display fields
+        return get(item, 'displayName') || get(item, 'title') || get(item, 'name') || String(item.id || item);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMultiSourceSelectorWidgetColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPMultiSourceSelectorWidgetColumnComponent, isStandalone: true, selector: "axp-multi-source-selector-widget-column", inputs: { rawValue: "rawValue", rowData: "rowData" }, usesInheritance: true, ngImport: i0, template: `
+    @if (displayItems().length > 0) {
+      <div class="ax-flex ax-flex-wrap ax-gap-1">
+        @for (item of visibleItems(); track item.id) {
+          <ax-badge class="ax-p-0.5 ax-accent1" [text]="item.text"></ax-badge>
+        }
+        @if (hasMoreItems()) {
+          <ax-badge class="ax-p-0.5 ax-accent2" [text]="'+' + remainingItemsCount()"></ax-badge>
+        }
+      </div>
+    } @else {
+      <span class="ax-text-muted">---</span>
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i2$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMultiSourceSelectorWidgetColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'axp-multi-source-selector-widget-column',
+                    template: `
+    @if (displayItems().length > 0) {
+      <div class="ax-flex ax-flex-wrap ax-gap-1">
+        @for (item of visibleItems(); track item.id) {
+          <ax-badge class="ax-p-0.5 ax-accent1" [text]="item.text"></ax-badge>
+        }
+        @if (hasMoreItems()) {
+          <ax-badge class="ax-p-0.5 ax-accent2" [text]="'+' + remainingItemsCount()"></ax-badge>
+        }
+      </div>
+    } @else {
+      <span class="ax-text-muted">---</span>
+    }
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [AXBadgeModule],
+                    inputs: ['rawValue', 'rowData'],
+                }]
+        }], ctorParameters: () => [] });
+
+var multiSourceSelectorWidgetColumn_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPMultiSourceSelectorWidgetColumnComponent: AXPMultiSourceSelectorWidgetColumnComponent
+});
+
+const FileUploaderWebhookKeys = {
+    Actions: 'file-uploader.actions',
+    Configure: 'file-uploader.configure',
+    BeforeFilesAdded: 'file-uploader.beforeFilesAdded',
+    AfterFilesAdded: 'file-uploader.afterFilesAdded',
+    FileItem: {
+        Actions: 'file-uploader.fileItem.actions',
+        BeforeDownload: 'file-uploader.fileItem.before-download',
+        AfterDownload: 'file-uploader.fileItem.after-download',
+        AfterEdit: 'file-uploader.fileItem.after-edit',
+        AfterRemove: 'file-uploader.fileItem.after-remove',
+        DownloadReference: 'file-uploader.fileItem.download-reference',
+    },
+    EditDialog: {
+        Params: {
+            BeforeRename: 'file-uploader.edit-dialog.params.before-rename',
+            AfterRename: 'file-uploader.edit-dialog.params.after-rename',
+        },
+        Groups: {
+            BeforeForm: 'file-uploader.edit-dialog.groups.before-form',
+            AfterForm: 'file-uploader.edit-dialog.groups.after-form',
+        },
+    },
+};
+
+class AXPEditFileUploaderCommand {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.layoutBuilder = inject(AXPLayoutBuilderService);
+        this.translationService = inject(AXTranslationService);
+        this.hooks = inject(AXPHookService);
+    }
+    //#endregion
+    //#region ----   Command Execution   ----
+    async execute(input) {
+        if (input.file.readOnly === true && !input.isNewFile) {
+            const text = await this.translationService.translateAsync('@general:terms.common.readonly');
+            return {
+                success: false,
+                message: { text: `${text}.` },
+            };
+        }
+        try {
+            const updatedFile = await this.showEditDialog(input.file, input.plugins ?? [], input.excludePlugins ?? [], input.enableTitleDescription ?? false, input.isNewFile ?? false);
+            return {
+                success: true,
+                data: updatedFile
+            };
+        }
+        catch (error) {
+            return {
+                success: false,
+                message: {
+                    text: error instanceof Error ? error.message : 'Failed to edit file'
+                }
+            };
+        }
+    }
+    //#endregion
+    //#region ----   Dialog Logic   ----
+    async showEditDialog(file, plugins, excludePlugins, enableTitleDescription, isNewFile) {
+        const titleKey = isNewFile ? '@general:widgets.file-uploader.edit-dialog.add-title' : '@general:widgets.file-uploader.edit-dialog.title';
+        const title = await this.translationService.translateAsync(titleKey);
+        const nameLabel = await this.translationService.translateAsync('@general:terms.common.name');
+        const namePlaceholder = await this.translationService.translateAsync('@general:terms.common.name');
+        const titleLabel = await this.translationService.translateAsync('@general:terms.common.title');
+        const descriptionLabel = await this.translationService.translateAsync('@general:terms.common.description');
+        const submitLabel = await this.translationService.translateAsync('@general:actions.submit.title');
+        // Hooks: parameter insertion points
+        const beforeRenamePayload = await this.hooks.runAsync(FileUploaderWebhookKeys.EditDialog.Params.BeforeRename, {
+            file: file,
+            plugins,
+            excludePlugins,
+            items: [],
+        });
+        const afterRenamePayload = await this.hooks.runAsync(FileUploaderWebhookKeys.EditDialog.Params.AfterRename, {
+            file: file,
+            plugins,
+            excludePlugins,
+            items: [],
+        });
+        // Hooks: group insertion points around 'form'
+        const groupsBeforePayload = await this.hooks.runAsync(FileUploaderWebhookKeys.EditDialog.Groups.BeforeForm, {
+            file: file,
+            plugins,
+            excludePlugins,
+            groups: [],
+        });
+        const groupsAfterPayload = await this.hooks.runAsync(FileUploaderWebhookKeys.EditDialog.Groups.AfterForm, {
+            file: file,
+            plugins,
+            excludePlugins,
+            groups: [],
+        });
+        const dialogRef = await this.layoutBuilder
+            .create()
+            .dialog(dialog => {
+            dialog
+                .setTitle(title)
+                .setContext({ ...file })
+                .content(contentBuilder => {
+                // Add groups before form
+                this.buildGroups(contentBuilder, groupsBeforePayload?.groups ?? []);
+                // Main form container with rename field and hook items
+                contentBuilder.flex(formFlex => {
+                    formFlex
+                        .setDirection('column')
+                        .setGap('16px');
+                    // Add items before rename
+                    this.buildFormFields(formFlex, beforeRenamePayload?.items ?? []);
+                    // Name field (label "Name" when enableTitleDescription, else "Rename")
+                    formFlex.formField(nameLabel, field => {
+                        field.path('name');
+                        field.textBox({
+                            placeholder: namePlaceholder,
+                            validations: [
+                                { rule: 'maxLength', options: { value: 256 } }
+                            ]
+                        });
+                    });
+                    // Title and description fields when enableTitleDescription is true
+                    if (enableTitleDescription) {
+                        formFlex.formField(titleLabel, field => {
+                            field.path('title');
+                            field.textBox({
+                                placeholder: titleLabel,
+                                validations: [
+                                    { rule: 'maxLength', options: { value: 256 } }
+                                ]
+                            });
+                        });
+                        formFlex.formField(descriptionLabel, field => {
+                            field.path('description');
+                            field.largeTextBox({
+                                placeholder: descriptionLabel,
+                                validations: [
+                                    { rule: 'maxLength', options: { value: 1024 } }
+                                ]
+                            });
+                        });
+                    }
+                    // Add items after rename
+                    this.buildFormFields(formFlex, afterRenamePayload?.items ?? []);
+                });
+                // Add groups after form
+                this.buildGroups(contentBuilder, groupsAfterPayload?.groups ?? []);
+            })
+                .setCloseButton(true)
+                .setActions(actions => {
+                actions.custom({
+                    title: submitLabel,
+                    icon: 'fa-check',
+                    color: 'primary',
+                    command: { name: 'submit', options: { validate: true } }
+                });
+            });
+        })
+            .show();
+        const result = dialogRef.context();
+        dialogRef.close();
+        return result;
+    }
+    //#endregion
+    //#region ----   Helper Methods   ----
+    /**
+     * Build form fields from hook items (old format parameters)
+     */
+    buildFormFields(builder, items) {
+        for (const item of items) {
+            if (!item || !item.path) {
+                continue;
+            }
+            const label = item.title || item.path;
+            const widgetType = item.widget?.type || 'text-editor';
+            const widgetOptions = item.widget?.options || {};
+            builder.formField(label, field => {
+                field.path(item.path);
+                // Apply mode if specified
+                if (item.mode) {
+                    field.mode(item.mode);
+                }
+                // Apply visibility if specified
+                if (item.visible !== undefined) {
+                    field.visible(item.visible);
+                }
+                // Apply readonly if specified
+                if (item.readonly !== undefined) {
+                    field.readonly(item.readonly);
+                }
+                // Apply disabled if specified
+                if (item.disabled !== undefined) {
+                    field.disabled(item.disabled);
+                }
+                // Convert widget based on type
+                this.applyWidget(field, widgetType, widgetOptions, item.validations);
+            });
+        }
+    }
+    /**
+     * Build groups/containers from hook groups (old format groups)
+     */
+    buildGroups(containerBuilder, groups) {
+        for (const group of groups) {
+            if (!group) {
+                continue;
+            }
+            // Use fieldset for groups with title, otherwise use flex
+            if (group.title) {
+                containerBuilder.fieldset(fieldset => {
+                    fieldset.setTitle(group.title);
+                    if (group.description) {
+                        fieldset.setDescription(group.description);
+                    }
+                    if (group.mode) {
+                        fieldset.mode(group.mode);
+                    }
+                    if (group.cols) {
+                        fieldset.setCols(group.cols);
+                    }
+                    // Build form fields from group parameters
+                    if (group.parameters && Array.isArray(group.parameters)) {
+                        this.buildFormFields(fieldset, group.parameters);
+                    }
+                });
+            }
+            else {
+                containerBuilder.flex(flex => {
+                    flex.setDirection('column');
+                    flex.setGap('16px');
+                    if (group.mode) {
+                        flex.mode(group.mode);
+                    }
+                    // Build form fields from group parameters
+                    if (group.parameters && Array.isArray(group.parameters)) {
+                        this.buildFormFields(flex, group.parameters);
+                    }
+                });
+            }
+        }
+    }
+    /**
+     * Apply widget configuration to field based on widget type
+     */
+    applyWidget(field, widgetType, options, validations) {
+        // Convert validations from old format if needed
+        const fieldValidations = validations || options.validations || [];
+        // Handle different widget types
+        switch (widgetType) {
+            case 'text-editor':
+            case 'text-box':
+                field.textBox({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'large-text-editor':
+            case 'large-text-box':
+                field.largeTextBox({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'rich-text-editor':
+            case 'rich-text':
+                field.richText({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'number-editor':
+            case 'number-box':
+                field.numberBox({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'date-time-editor':
+            case 'date-time-box':
+                field.dateTimeBox({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'select-box':
+            case 'select-editor':
+                field.selectBox({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'lookup-box':
+            case 'lookup-editor':
+                field.lookupBox({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            case 'toggle-switch':
+            case 'boolean-editor':
+                field.toggleSwitch({
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+            default:
+                // For custom widgets or unknown types, use customWidget
+                field.customWidget(widgetType, {
+                    ...options,
+                    validations: fieldValidations
+                });
+                break;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEditFileUploaderCommand, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEditFileUploaderCommand, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEditFileUploaderCommand, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class AXPFileListComponent {
+    constructor() {
+        this.fileTypeService = inject(AXPFileTypeProviderService);
+        this.fileStorageService = inject(AXPFileStorageService);
+        this.commandExecutor = inject(AXPCommandExecutor);
+        this.hooks = inject(AXPHookService);
+        this.isLoading = signal(true, ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
+        this.fileTypes = signal([], ...(ngDevMode ? [{ debugName: "fileTypes" }] : /* istanbul ignore next */ []));
+        this.onRemove = output();
+        this.onRevert = output();
+        this.onRename = output();
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.fileEditable = input(true, ...(ngDevMode ? [{ debugName: "fileEditable" }] : /* istanbul ignore next */ []));
+        /** When true, edit dialog shows name, title and description fields. Default false. */
+        this.enableTitleDescription = input(false, ...(ngDevMode ? [{ debugName: "enableTitleDescription" }] : /* istanbul ignore next */ []));
+        this.multiple = input(true, ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+        this.files = input([], ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
+        // Plugin context (passed from parent widget)
+        this.plugins = input(undefined, ...(ngDevMode ? [{ debugName: "plugins" }] : /* istanbul ignore next */ []));
+        this.excludePlugins = input(undefined, ...(ngDevMode ? [{ debugName: "excludePlugins" }] : /* istanbul ignore next */ []));
+        // Capabilities API for file operations (passed from parent widget)
+        this.capabilities = input(undefined, ...(ngDevMode ? [{ debugName: "capabilities" }] : /* istanbul ignore next */ []));
+        /**
+         * All files should be displayed, even those with `deleted` status.
+         * The template will handle the visual differences based on the status.
+         */
+        this.displayFiles = computed(() => this.files(), ...(ngDevMode ? [{ debugName: "displayFiles" }] : /* istanbul ignore next */ []));
+        // Cache for per-file actions provided by hooks
+        this.fileIdToActions = signal({}, ...(ngDevMode ? [{ debugName: "fileIdToActions" }] : /* istanbul ignore next */ []));
+        // Global actions from FileUploaderWebhookKeys.Actions hook
+        this.globalActions = signal([], ...(ngDevMode ? [{ debugName: "globalActions" }] : /* istanbul ignore next */ []));
+        // Clear cache when files change to reload actions
+        this.filesChangeEffect = effect(() => {
+            // Track files changes to clear cache
+            this.files();
+            this.fileIdToActions.set({});
+        }, ...(ngDevMode ? [{ debugName: "filesChangeEffect" }] : /* istanbul ignore next */ []));
+    }
+    // Default actions that can be removed via hooks
+    getDefaultActions(file) {
+        const defaultActions = [];
+        // Download action (always available, including in readonly mode)
+        defaultActions.push({
+            id: 'attachments.default.download',
+            plugin: 'attachments',
+            global: true,
+            textKey: '@general:actions.download.title',
+            icon: 'fa-light fa-download',
+            run: async (ctx) => {
+                await this.handleFileDownload({ nativeEvent: { preventDefault: () => { }, stopPropagation: () => { } } }, file);
+            },
+        });
+        // Edit and Remove actions (if editable and not widget/item readonly)
+        if (!this.isItemInteractionLocked(file) &&
+            (this.fileEditable() || (!this.fileEditable() && file.status === 'attached'))) {
+            defaultActions.push({
+                id: 'attachments.default.edit',
+                plugin: 'attachments',
+                global: true,
+                textKey: '@general:actions.edit.title',
+                icon: 'fa-light fa-pencil',
+                run: async (ctx) => {
+                    await this.handleFileEdit({ stopPropagation: () => { }, preventDefault: () => { } }, file);
+                },
+            });
+            defaultActions.push({
+                id: 'attachments.default.remove',
+                plugin: 'attachments',
+                global: true,
+                textKey: '@general:actions.delete.title',
+                icon: 'fa-light fa-trash-can',
+                run: async (ctx) => {
+                    await this.handleFileRemove({ nativeEvent: { preventDefault: () => { }, stopPropagation: () => { } } }, file);
+                },
+            });
+        }
+        return defaultActions;
+    }
+    /** True when the widget is readonly or this file row is locked (`readOnly`). */
+    isItemInteractionLocked(file) {
+        return this.readonly() || file.readOnly === true;
+    }
+    actionsFor(file, index) {
+        const key = file.id ?? String(index);
+        const map = this.fileIdToActions();
+        if (map[key]) {
+            return map[key];
+        }
+        // Lazy-load actions via hooks
+        this.loadActionsFor(file, index).catch(console.error);
+        return [];
+    }
+    async loadActionsFor(file, index) {
+        const key = file.id ?? String(index);
+        // Start with default actions
+        const defaultActions = this.getDefaultActions(file);
+        // Get per-file actions from FileUploaderWebhookKeys.FileItem.Actions hook
+        // Note: globalActions are only for toolbar, not for per-file actions
+        const fileItemPayload = await this.hooks.runAsync(FileUploaderWebhookKeys.FileItem.Actions, {
+            item: file,
+            index,
+            itemReadOnly: file.readOnly === true,
+            itemInteractionLocked: this.isItemInteractionLocked(file),
+            plugins: this.plugins() ?? [],
+            excludePlugins: this.excludePlugins() ?? [],
+            capabilities: this.capabilities(),
+            actions: [],
+        });
+        // Combine all actions: default + file-item specific (exclude globalActions from per-file items)
+        const allActions = [...defaultActions, ...(fileItemPayload?.actions ?? [])];
+        // Filter actions based on plugins and excludePlugins
+        const enabledPlugins = this.plugins()?.map((p) => p.name) ?? [];
+        const excludedPlugins = this.excludePlugins() ?? [];
+        const filteredActions = allActions.filter((action) => {
+            // If action has an id and is in excluded list, remove it
+            if (action.id && excludedPlugins.some((excluded) => action.id?.includes(excluded))) {
+                return false;
+            }
+            // If plugin is excluded, remove it
+            if (excludedPlugins.includes(action.plugin)) {
+                return false;
+            }
+            // If no enabled plugins, only show global actions
+            if (!enabledPlugins || enabledPlugins.length === 0) {
+                return action.global === true;
+            }
+            // Show if plugin is enabled or action is global
+            return enabledPlugins.includes(action.plugin) || action.global === true;
+        });
+        const next = { ...this.fileIdToActions() };
+        next[key] = filteredActions;
+        this.fileIdToActions.set(next);
+    }
+    async ngOnInit() {
+        this.fileTypes.set(await this.fileTypeService.items());
+        await this.loadGlobalActions();
+        this.isLoading.set(false);
+    }
+    async loadGlobalActions() {
+        try {
+            const payload = await this.hooks.runAsync(FileUploaderWebhookKeys.Actions, {
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                capabilities: this.capabilities(),
+                actions: [],
+            });
+            this.globalActions.set(payload?.actions ?? []);
+        }
+        catch (error) {
+            console.error('Error loading global actions:', error);
+            this.globalActions.set([]);
+        }
+    }
+    getFileInfo(fileName) {
+        const extension = fileName.split('.').pop()?.toLowerCase() || '';
+        const extensions = this.fileTypes().flatMap((t) => t.extensions);
+        const fileType = extensions.find((e) => e.name === extension);
+        return {
+            icon: fileType?.icon || 'fa-light fa-file',
+            type: fileType?.name || 'Unknown',
+        };
+    }
+    async handleFileDownload(event, file) {
+        event.nativeEvent.preventDefault();
+        event.nativeEvent.stopPropagation();
+        try {
+            await this.hooks.runAsync(FileUploaderWebhookKeys.FileItem.BeforeDownload, {
+                file,
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                capabilities: this.capabilities(),
+            });
+        }
+        catch { }
+        if (!file.source) {
+            console.error('File source is undefined, cannot download.', file);
+            return;
+        }
+        const triggerDownload = (blob, fileName) => {
+            const url = URL.createObjectURL(blob);
+            const link = document.createElement('a');
+            link.href = url;
+            link.download = fileName;
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            URL.revokeObjectURL(url);
+        };
+        switch (file.source.kind) {
+            case 'blob':
+                if (file.source.value instanceof Blob) {
+                    triggerDownload(file.source.value, file.name ?? 'download');
+                }
+                else {
+                    console.error('Source kind is blob, but value is not a Blob.', file);
+                }
+                break;
+            case 'fileId':
+                if (typeof file.source.value === 'string') {
+                    try {
+                        const fileInfo = await this.fileStorageService.getInfo(file.source.value);
+                        if (fileInfo && fileInfo.url) {
+                            const link = document.createElement('a');
+                            link.href = fileInfo.url;
+                            link.download = file.name ?? fileInfo.name ?? 'download';
+                            link.target = '_blank';
+                            document.body.appendChild(link);
+                            link.click();
+                            document.body.removeChild(link);
+                        }
+                        else if (fileInfo && fileInfo.binary instanceof Blob) {
+                            triggerDownload(fileInfo.binary, file.name ?? fileInfo.name ?? 'download');
+                        }
+                        else {
+                            console.error('Could not retrieve file for download from fileId:', fileInfo);
+                        }
+                    }
+                    catch (error) {
+                        console.error('Error downloading file by fileId:', file.source.value, error);
+                    }
+                }
+                else {
+                    console.error('Source kind is fileId, but value is not a string ID.', file);
+                }
+                break;
+            case 'url':
+                if (typeof file.source.value === 'string') {
+                    const link = document.createElement('a');
+                    link.href = file.source.value;
+                    link.download = file.name ?? 'download';
+                    link.target = '_blank';
+                    document.body.appendChild(link);
+                    link.click();
+                    document.body.removeChild(link);
+                }
+                else {
+                    console.error('Source kind is url, but value is not a string URL.', file);
+                }
+                break;
+            case 'reference':
+                if (file.source.value &&
+                    typeof file.source.value === 'object' &&
+                    'id' in file.source.value &&
+                    'type' in file.source.value) {
+                    try {
+                        const result = await this.hooks.runAsync(FileUploaderWebhookKeys.FileItem.DownloadReference, {
+                            file,
+                            reference: file.source.value,
+                            plugins: this.plugins() ?? [],
+                            excludePlugins: this.excludePlugins() ?? [],
+                            capabilities: this.capabilities(),
+                            fileInfo: undefined,
+                        });
+                        if (result?.fileInfo) {
+                            if (result.fileInfo.url) {
+                                const link = document.createElement('a');
+                                link.href = result.fileInfo.url;
+                                link.download = file.name ?? result.fileInfo.name ?? 'download';
+                                link.target = '_blank';
+                                document.body.appendChild(link);
+                                link.click();
+                                document.body.removeChild(link);
+                            }
+                            else if (result.fileInfo.binary instanceof Blob) {
+                                triggerDownload(result.fileInfo.binary, file.name ?? result.fileInfo.name ?? 'download');
+                            }
+                            else {
+                                console.error('Could not retrieve file for download from reference:', result.fileInfo);
+                            }
+                        }
+                        else {
+                            console.error('Hook did not return fileInfo for reference download.', file);
+                        }
+                    }
+                    catch (error) {
+                        console.error('Error downloading file by reference:', file.source.value, error);
+                    }
+                }
+                else {
+                    console.error('Source kind is reference, but value is not a valid AXPEntityReference.', file);
+                }
+                break;
+            case 'preview':
+            case 'none':
+            default:
+                console.error(`Download not supported for source kind: ${file.source.kind}`, file);
+                break;
+        }
+        try {
+            await this.hooks.runAsync(FileUploaderWebhookKeys.FileItem.AfterDownload, {
+                file,
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                capabilities: this.capabilities(),
+            });
+        }
+        catch { }
+    }
+    async handleFileRemove(event, file) {
+        event.nativeEvent.preventDefault();
+        event.nativeEvent.stopPropagation();
+        this.onRemove.emit(file);
+        try {
+            await this.hooks.runAsync(FileUploaderWebhookKeys.FileItem.AfterRemove, {
+                file,
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                capabilities: this.capabilities(),
+            });
+        }
+        catch { }
+    }
+    /**
+     * Handle revert action – emit the file so parent components can update the status.
+     */
+    handleFileRevert(event, file) {
+        if (this.isItemInteractionLocked(file)) {
+            return;
+        }
+        event.nativeEvent.preventDefault();
+        event.nativeEvent.stopPropagation();
+        this.onRevert.emit(file);
+    }
+    /**
+     * Handle file edit action – open rename popup
+     */
+    async handleFileEdit(event, file) {
+        //   if (event instanceof MouseEvent) {
+        event.stopPropagation();
+        event.preventDefault();
+        // } else {
+        //   event.nativeEvent.preventDefault();
+        //   event.nativeEvent.stopPropagation();
+        // }
+        if (this.isItemInteractionLocked(file)) {
+            return;
+        }
+        const commandResult = await this.commandExecutor.execute('FileUploader:Edit', {
+            file,
+            plugins: this.plugins() ?? [],
+            excludePlugins: this.excludePlugins() ?? [],
+            enableTitleDescription: this.enableTitleDescription(),
+        });
+        if (!commandResult?.success || !commandResult.data) {
+            return;
+        }
+        const newFile = commandResult.data;
+        this.onRename.emit(newFile);
+        try {
+            await this.hooks.runAsync(FileUploaderWebhookKeys.FileItem.AfterEdit, {
+                file: newFile ?? file,
+                previous: file,
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                capabilities: this.capabilities(),
+            });
+        }
+        catch { }
+    }
+    ngOnDestroy() { }
+    async runAction(action) {
+        try {
+            await action.run(this.capabilities());
+        }
+        catch (e) {
+            console.error(e);
+        }
+    }
+    getActionColor(action) {
+        // Map default action IDs to colors
+        if (action.id === 'attachments.default.download') {
+            return 'primary';
+        }
+        if (action.id === 'attachments.default.edit') {
+            return 'secondary';
+        }
+        if (action.id === 'attachments.default.remove') {
+            return 'danger';
+        }
+        // Default color for custom actions
+        return action.color ?? 'primary';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFileListComponent, isStandalone: true, selector: "axp-file-list", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, fileEditable: { classPropertyName: "fileEditable", publicName: "fileEditable", isSignal: true, isRequired: false, transformFunction: null }, enableTitleDescription: { classPropertyName: "enableTitleDescription", publicName: "enableTitleDescription", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, files: { classPropertyName: "files", publicName: "files", isSignal: true, isRequired: false, transformFunction: null }, plugins: { classPropertyName: "plugins", publicName: "plugins", isSignal: true, isRequired: false, transformFunction: null }, excludePlugins: { classPropertyName: "excludePlugins", publicName: "excludePlugins", isSignal: true, isRequired: false, transformFunction: null }, capabilities: { classPropertyName: "capabilities", publicName: "capabilities", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onRemove: "onRemove", onRevert: "onRevert", onRename: "onRename" }, providers: [], ngImport: i0, template: "@for (file of displayFiles(); track $index) {\n  <div\n    class=\"__item\"\n    [ngClass]=\"{\n      '--removed': file.status === 'deleted',\n      '--attached': file.status === 'attached',\n      '--with-meta': enableTitleDescription(),\n      '--item-readonly': file.readOnly === true,\n    }\"\n  >\n    <div class=\"__icon\">\n      <i class=\"fa-fw {{ getFileInfo(file.name).icon }} fa-solid\"></i>\n    </div>\n    @if (enableTitleDescription()) {\n      <div class=\"__content\">\n        <div class=\"__primary\">{{ file.name }}{{ file.title?.trim() ? ' - ' + file.title : '' }}</div>\n        @if (file.description?.trim()) {\n          <div class=\"__secondary\">{{ file.description }}</div>\n        }\n      </div>\n    } @else {\n      <div class=\"__name\">{{ file.name }}</div>\n    }\n    <div class=\"__actions\">\n      @if (file.status === 'deleted' && multiple() && !isItemInteractionLocked(file)) {\n        <!-- Revert button - only show when multiple is true -->\n        <ax-button [look]=\"'blank'\" class=\"ax-sm\" color=\"warning\" (onClick)=\"handleFileRevert($event,file)\">\n          <ax-icon class=\"fa-light fa-rotate-left\"></ax-icon>\n        </ax-button>\n      } @else if (file.status !== 'deleted') {\n        <!-- Default + hook actions; readonly still shows download (edit/remove omitted in component logic). -->\n        @for (action of actionsFor(file, $index); track action.id ?? action.textKey ?? action.text ?? $index) {\n          <ax-button\n            [look]=\"'blank'\"\n            class=\"ax-sm\"\n            [color]=\"getActionColor(action)\"\n            (onClick)=\"runAction(action)\"\n          >\n            @if (action.icon) {\n              <ax-icon class=\"{{ action.icon }}\"></ax-icon>\n            }\n          </ax-button>\n        }\n      }\n    </div>\n  </div>\n} @empty {\n  <div class=\"__empty-state\">\n    <axp-state-message\n      icon=\"fa-light fa-folder-open\"\n      [title]=\"'@general:widgets.file-uploader.empty-state.title'\"\n      [description]=\"'@general:widgets.file-uploader.empty-state.description'\"\n    >\n    </axp-state-message>\n  </div>\n}\n", styles: [":host{display:flex;width:100%;flex-direction:column;gap:.125rem;padding-top:.5rem;padding-bottom:.5rem}:host .__item{display:flex;cursor:pointer;align-items:center;gap:.75rem;border-left-width:4px;border-color:transparent;padding:.5rem}:host .__item:hover{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}:host .__item.--removed{--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-danger-500),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-danger-50),var(--tw-bg-opacity, 1))}:host .__item.--attached{--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-success-500),var(--tw-border-opacity, 1));animation:attached-flash 1s ease-out forwards}:host .__item.--item-readonly:not(.--removed){opacity:.85}:host .__item .__icon{width:1.5rem;flex-shrink:0}:host .__item .__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;font-size:.875rem;line-height:1.25rem;font-weight:500}:host .__item .__content{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}:host .__item .__primary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;font-size:.875rem;line-height:1.25rem;font-weight:500}:host .__item .__secondary{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:start;font-size:.75rem;line-height:1rem;color:var(--ax-sys-color-text-secondary)}:host .__item.--with-meta .__content{justify-content:center}:host .__item .__actions{margin-left:auto;display:flex;flex-shrink:0}@keyframes attached-flash{0%{background-color:rgb(var(--ax-sys-color-success-50))}to{background-color:transparent}}.__empty-state{cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;animation-duration:.2s}.__empty-state:hover{opacity:.8}\n"], dependencies: [{ kind: "ngmodule", type: 
+                // Angular
+                CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: 
+                // ACoreX
+                AXFormModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXLabelModule }, { kind: "ngmodule", type: AXCheckBoxModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: 
+                // Platform
+                AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "look"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axp-file-list', imports: [
+                        // Angular
+                        CommonModule,
+                        // ACoreX
+                        AXFormModule,
+                        AXTextBoxModule,
+                        AXButtonModule,
+                        AXLabelModule,
+                        AXCheckBoxModule,
+                        AXDecoratorModule,
+                        AXTranslationModule,
+                        // Platform
+                        AXPStateMessageComponent,
+                    ], providers: [], template: "@for (file of displayFiles(); track $index) {\n  <div\n    class=\"__item\"\n    [ngClass]=\"{\n      '--removed': file.status === 'deleted',\n      '--attached': file.status === 'attached',\n      '--with-meta': enableTitleDescription(),\n      '--item-readonly': file.readOnly === true,\n    }\"\n  >\n    <div class=\"__icon\">\n      <i class=\"fa-fw {{ getFileInfo(file.name).icon }} fa-solid\"></i>\n    </div>\n    @if (enableTitleDescription()) {\n      <div class=\"__content\">\n        <div class=\"__primary\">{{ file.name }}{{ file.title?.trim() ? ' - ' + file.title : '' }}</div>\n        @if (file.description?.trim()) {\n          <div class=\"__secondary\">{{ file.description }}</div>\n        }\n      </div>\n    } @else {\n      <div class=\"__name\">{{ file.name }}</div>\n    }\n    <div class=\"__actions\">\n      @if (file.status === 'deleted' && multiple() && !isItemInteractionLocked(file)) {\n        <!-- Revert button - only show when multiple is true -->\n        <ax-button [look]=\"'blank'\" class=\"ax-sm\" color=\"warning\" (onClick)=\"handleFileRevert($event,file)\">\n          <ax-icon class=\"fa-light fa-rotate-left\"></ax-icon>\n        </ax-button>\n      } @else if (file.status !== 'deleted') {\n        <!-- Default + hook actions; readonly still shows download (edit/remove omitted in component logic). -->\n        @for (action of actionsFor(file, $index); track action.id ?? action.textKey ?? action.text ?? $index) {\n          <ax-button\n            [look]=\"'blank'\"\n            class=\"ax-sm\"\n            [color]=\"getActionColor(action)\"\n            (onClick)=\"runAction(action)\"\n          >\n            @if (action.icon) {\n              <ax-icon class=\"{{ action.icon }}\"></ax-icon>\n            }\n          </ax-button>\n        }\n      }\n    </div>\n  </div>\n} @empty {\n  <div class=\"__empty-state\">\n    <axp-state-message\n      icon=\"fa-light fa-folder-open\"\n      [title]=\"'@general:widgets.file-uploader.empty-state.title'\"\n      [description]=\"'@general:widgets.file-uploader.empty-state.description'\"\n    >\n    </axp-state-message>\n  </div>\n}\n", styles: [":host{display:flex;width:100%;flex-direction:column;gap:.125rem;padding-top:.5rem;padding-bottom:.5rem}:host .__item{display:flex;cursor:pointer;align-items:center;gap:.75rem;border-left-width:4px;border-color:transparent;padding:.5rem}:host .__item:hover{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}:host .__item.--removed{--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-danger-500),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgba(var(--ax-sys-color-danger-50),var(--tw-bg-opacity, 1))}:host .__item.--attached{--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-success-500),var(--tw-border-opacity, 1));animation:attached-flash 1s ease-out forwards}:host .__item.--item-readonly:not(.--removed){opacity:.85}:host .__item .__icon{width:1.5rem;flex-shrink:0}:host .__item .__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;font-size:.875rem;line-height:1.25rem;font-weight:500}:host .__item .__content{display:flex;min-width:0px;flex:1 1 0%;flex-direction:column;gap:.125rem}:host .__item .__primary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start;font-size:.875rem;line-height:1.25rem;font-weight:500}:host .__item .__secondary{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:start;font-size:.75rem;line-height:1rem;color:var(--ax-sys-color-text-secondary)}:host .__item.--with-meta .__content{justify-content:center}:host .__item .__actions{margin-left:auto;display:flex;flex-shrink:0}@keyframes attached-flash{0%{background-color:rgb(var(--ax-sys-color-success-50))}to{background-color:transparent}}.__empty-state{cursor:pointer;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;animation-duration:.2s}.__empty-state:hover{opacity:.8}\n"] }]
+        }], propDecorators: { onRemove: [{ type: i0.Output, args: ["onRemove"] }], onRevert: [{ type: i0.Output, args: ["onRevert"] }], onRename: [{ type: i0.Output, args: ["onRename"] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], fileEditable: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileEditable", required: false }] }], enableTitleDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableTitleDescription", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], files: [{ type: i0.Input, args: [{ isSignal: true, alias: "files", required: false }] }], plugins: [{ type: i0.Input, args: [{ isSignal: true, alias: "plugins", required: false }] }], excludePlugins: [{ type: i0.Input, args: [{ isSignal: true, alias: "excludePlugins", required: false }] }], capabilities: [{ type: i0.Input, args: [{ isSignal: true, alias: "capabilities", required: false }] }] } });
+
+//#region ----   Attachment fingerprint (no blob comparison)   ----
+/** Stable fingerprint for one file row; ignores Blob binary content. */
+function fingerprintAttachmentItem(item) {
+    if (!item || typeof item !== 'object') {
+        return '';
+    }
+    const file = item;
+    const source = file['source'];
+    const kind = source?.['kind'];
+    let sourceToken = '';
+    if (kind === 'blob') {
+        const blob = source?.['value'];
+        const size = blob instanceof Blob ? blob.size : file['size'];
+        sourceToken = `blob:${size ?? 0}`;
+    }
+    else if (kind === 'fileId') {
+        sourceToken = `fileId:${String(source?.['value'] ?? '')}`;
+    }
+    else {
+        sourceToken = `${String(kind ?? '')}:${String(source?.['value'] ?? '')}`;
+    }
+    return [
+        String(file['id'] ?? ''),
+        String(file['name'] ?? ''),
+        String(file['status'] ?? ''),
+        String(file['size'] ?? ''),
+        sourceToken,
+        String(file['title'] ?? ''),
+        String(file['description'] ?? ''),
+    ].join('|');
+}
+/** Order-independent fingerprint for attachment lists. */
+function fingerprintAttachments(value) {
+    if (!isArray(value) || value.length === 0) {
+        return '';
+    }
+    return value.map(fingerprintAttachmentItem).sort().join(';');
+}
+/** Identity key for semantic compare (ignores blob/source shape differences on load, includes status). */
+function attachmentIdentityKey(item) {
+    if (!item || typeof item !== 'object') {
+        return '';
+    }
+    const file = item;
+    const source = file['source'];
+    const persistedId = source?.['kind'] === 'fileId' ? String(source['value'] ?? '') : String(file['id'] ?? '');
+    return [persistedId, String(file['name'] ?? ''), String(file['status'] ?? '')].join('|');
+}
+/** True when lists represent the same attachments regardless of blob vs fileId shape. */
+function attachmentsSemanticallyEqual(a, b) {
+    const listA = isArray(a) ? a : [];
+    const listB = isArray(b) ? b : [];
+    if (listA.length !== listB.length) {
+        return false;
+    }
+    const keysA = listA.map(attachmentIdentityKey).sort();
+    const keysB = listB.map(attachmentIdentityKey).sort();
+    return keysA.every((key, index) => key === keysB[index]);
+}
+/** Attachment rows that remain after a successful save (drops soft-deleted rows). */
+function committedAttachments(value) {
+    if (!isArray(value)) {
+        return [];
+    }
+    return value.filter((item) => {
+        if (!item || typeof item !== 'object') {
+            return false;
+        }
+        return item.status !== 'deleted';
+    });
+}
+/**
+ * Post-save attachment list: drops soft-deleted rows and promotes pending `attached` rows to `uploaded`
+ * so deferred-save pages get the same delete/revert behavior as after a full reload.
+ */
+function persistedAttachments(value) {
+    return committedAttachments(value).map((item) => item.status === 'attached' ? { ...item, status: 'uploaded' } : item);
+}
+//#endregion
+
+//#endregion
+//#region ----   Helpers   ----
+function isFileListItem(value) {
+    return value != null && typeof value === 'object' && typeof get(value, 'name') === 'string';
+}
+/** Whether a list-row value represents one attachment (file item, id reference, or fileId source). */
+function isAttachmentListEntry(value) {
+    if (isFileListItem(value)) {
+        return true;
+    }
+    if (isString(value) && value.trim().length > 0) {
+        return true;
+    }
+    if (value != null && typeof value === 'object') {
+        const id = get(value, 'id');
+        if (typeof id === 'string' && id.trim().length > 0) {
+            return true;
+        }
+        const fileId = get(value, 'source.value');
+        if (get(value, 'source.kind') === 'fileId' && typeof fileId === 'string' && fileId.trim().length > 0) {
+            return true;
+        }
+        const entryName = get(value, 'name');
+        if (typeof entryName === 'string' && entryName.trim().length > 0) {
+            return true;
+        }
+    }
+    return false;
+}
+function parseAttachmentFieldEntries(fieldValue) {
+    if (fieldValue == null) {
+        return [];
+    }
+    if (isString(fieldValue)) {
+        const trimmed = fieldValue.trim();
+        if (!trimmed) {
+            return [];
+        }
+        if (trimmed.startsWith('[') || trimmed.startsWith('{')) {
+            try {
+                const parsed = JSON.parse(trimmed);
+                return castArray(parsed);
+            }
+            catch {
+                return [trimmed];
+            }
+        }
+        return [trimmed];
+    }
+    return castArray(fieldValue);
+}
+function attachmentFieldCount(fieldValue) {
+    return parseAttachmentFieldEntries(fieldValue).filter(isAttachmentListEntry).length;
+}
+function normalizeEntityFieldToFileList(fieldValue) {
+    return parseAttachmentFieldEntries(fieldValue).filter(isFileListItem);
+}
+/** Resolve entity scope for column popup / load when widget options carry list-row expressions. */
+function resolveEntityId(entityIdOption, rowData) {
+    if (isString(entityIdOption) && entityIdOption.trim() && !entityIdOption.includes('{{')) {
+        return entityIdOption.trim();
+    }
+    const rowId = get(rowData, 'id') ?? get(rowData, 'Id');
+    if (rowId != null && String(rowId).trim()) {
+        return String(rowId).trim();
+    }
+    return undefined;
+}
+function resolveFileUploaderEntityScope(options, rowData, fieldFallback) {
+    const entityBlock = get(options, 'entity');
+    if (entityBlock != null && typeof entityBlock === 'object') {
+        const name = get(entityBlock, 'name');
+        const field = get(entityBlock, 'field') ?? fieldFallback;
+        const entityId = resolveEntityId(get(entityBlock, 'id'), rowData);
+        if (typeof name === 'string' &&
+            name.trim() &&
+            entityId &&
+            typeof field === 'string' &&
+            field.trim()) {
+            return { name: name.trim(), id: entityId, field: field.trim() };
+        }
+    }
+    const entityName = get(options, 'entityName') ?? get(options, 'entityRef');
+    const field = get(options, 'entityField') ?? fieldFallback;
+    const entityId = resolveEntityId(get(options, 'entityId'), rowData);
+    if (typeof entityName !== 'string' ||
+        !entityName.trim() ||
+        !entityId ||
+        typeof field !== 'string' ||
+        !field.trim()) {
+        return undefined;
+    }
+    return { name: entityName.trim(), id: entityId, field: field.trim() };
+}
+//#endregion
+
+class AXPFileUploaderLoadFilesQuery {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.injector = inject(Injector);
+    }
+    //#endregion
+    //#region ----   Query Execution   ----
+    async fetch(input) {
+        const { name: entityRef, id: entityId, field } = input;
+        if (!entityRef?.trim() || !entityId?.trim() || !field?.trim()) {
+            throw new Error('entityRef, entityId, and field are required.');
+        }
+        const record = await runInInjectionContext(this.injector, () => {
+            const dataService = new AXMEntityCrudServiceImpl(entityRef);
+            return dataService.getOne(entityId);
+        });
+        const fieldValue = get(record, field);
+        const files = normalizeEntityFieldToFileList(fieldValue);
+        const count = attachmentFieldCount(fieldValue);
+        return { files, count };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderLoadFilesQuery, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderLoadFilesQuery, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderLoadFilesQuery, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class AXPFileUploaderSaveFilesCommand {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.injector = inject(Injector);
+        //#endregion
+    }
+    //#endregion
+    //#region ----   Command Execution   ----
+    async execute(input) {
+        const { name: entityRef, id: entityId, field } = input;
+        const files = (input.files ?? []).filter(isFileListItem);
+        if (!entityRef?.trim() || !entityId?.trim() || !field?.trim()) {
+            return {
+                success: false,
+                message: { text: 'entityRef, entityId, and field are required.' },
+            };
+        }
+        try {
+            const entityData = await runInInjectionContext(this.injector, async () => {
+                const dataService = new AXMEntityCrudServiceImpl(entityRef);
+                return dataService.updateOne(entityId, { [field]: files });
+            });
+            return {
+                success: true,
+                data: { entityData: { ...entityData, [field]: files } },
+            };
+        }
+        catch (error) {
+            return {
+                success: false,
+                message: {
+                    text: error instanceof Error ? error.message : 'Failed to save files.',
+                },
+            };
+        }
+    }
+}
+
+//#region ----   File uploader widget API types   ----
+function resolveFileUploaderEditDialog(options) {
+    return options?.['editDialog'];
+}
+function isFileUploaderEditDialogAuto(editDialog) {
+    return editDialog?.mode === 'auto';
+}
+function hasFileUploaderTitleOrDescriptionFields(editDialog) {
+    return !!(editDialog?.fields?.title || editDialog?.fields?.description);
+}
+//#endregion
+
+class AXPFileUploaderWidgetService {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.popupService = inject(AXPopupService);
+        this.translate = inject(AXTranslationService);
+        this.commandExecutor = inject(AXPCommandExecutor);
+        this.queryExecutor = inject(AXPQueryExecutor);
+    }
+    //#endregion
+    //#region ----   Public API   ----
+    async showFileList(options) {
+        const entity = options?.entity;
+        let files = options?.files;
+        if (entity) {
+            const filesResult = await this.queryExecutor.fetch('FileUploader:LoadFiles', entity);
+            if (!filesResult) {
+                return undefined;
+            }
+            files = filesResult.files ?? [];
+        }
+        const resolved = {
+            files: files ?? [],
+            readonly: options?.readonly ?? false,
+            multiple: options?.multiple ?? false,
+            accept: options?.accept ?? '*',
+            fileEditable: options?.fileEditable ?? true,
+            maxFileSize: options?.maxFileSize ?? 1024 * 1024 * 10,
+            showAddItemButton: options?.showAddItemButton ?? true,
+            plugins: options?.plugins ?? [],
+            editDialog: options?.editDialog,
+        };
+        const component = await import('./acorex-platform-layout-entity-file-list-popup.component-_yrP5SQe.mjs').then((m) => m.AXPFileListPopupComponent);
+        const result = await this.popupService.open(component, {
+            title: await this.translate.translateAsync('@document-management:terms.common.file'),
+            data: {
+                files: signal(resolved.files),
+                isReadonly: signal(resolved.readonly),
+                multiple: signal(resolved.multiple),
+                accept: signal(resolved.accept),
+                maxFileSize: signal(resolved.maxFileSize),
+                fileEditable: signal(resolved.fileEditable),
+                showAddItemButton: signal(resolved.showAddItemButton),
+                plugins: signal(resolved.plugins),
+                editDialog: signal(resolved.editDialog),
+            },
+        });
+        const updatedFiles = result?.data?.data?.files;
+        if (!updatedFiles) {
+            return undefined;
+        }
+        if (!entity) {
+            return updatedFiles;
+        }
+        const saveResult = await this.commandExecutor.execute('FileUploader:SaveFiles', {
+            ...entity,
+            files: updatedFiles,
+        });
+        if (!saveResult?.success) {
+            return undefined;
+        }
+        return updatedFiles;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class AXPFileUploaderWidgetColumnComponent extends AXPColumnWidgetComponent {
+    //#endregion
+    //#region ----   Lifecycle   ----
+    constructor() {
+        super();
+        //#region ----   State   ----
+        this.fileCount = signal(0, ...(ngDevMode ? [{ debugName: "fileCount" }] : /* istanbul ignore next */ []));
+        this.loadRequestId = 0;
+        //#endregion
+        //#region ----   Services & Dependencies   ----
+        this.fileService = inject(AXPFileUploaderWidgetService);
+        this.queryExecutor = inject(AXPQueryExecutor);
+        effect(() => {
+            const raw = this.rawValue;
+            const row = this.rowData;
+            const opts = this.options ?? {};
+            const path = this.path;
+            const inlineCount = attachmentFieldCount(raw);
+            if (inlineCount > 0) {
+                untracked(() => this.fileCount.set(inlineCount));
+                return;
+            }
+            const entity = resolveFileUploaderEntityScope(opts, row, path);
+            if (!entity) {
+                untracked(() => this.fileCount.set(0));
+                return;
+            }
+            const requestId = ++this.loadRequestId;
+            untracked(() => {
+                console.log('loadFiles for count', entity);
+                void this.queryExecutor
+                    .fetch('FileUploader:LoadFiles', entity)
+                    .then((result) => {
+                    if (requestId !== this.loadRequestId) {
+                        return;
+                    }
+                    const count = result?.count ?? result?.files?.length ?? 0;
+                    this.fileCount.set(count);
+                })
+                    .catch(() => {
+                    if (requestId === this.loadRequestId) {
+                        this.fileCount.set(0);
+                    }
+                });
+            });
+        });
+    }
+    //#endregion
+    //#region ----   UI Handlers   ----
+    async openFileList() {
+        const entity = resolveFileUploaderEntityScope(this.options ?? {}, this.rowData, this.path);
+        await this.fileService.showFileList({
+            entity,
+            readonly: true,
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFileUploaderWidgetColumnComponent, isStandalone: true, selector: "axp-file-uploader-widget-column", inputs: { rawValue: "rawValue", rowData: "rowData" }, usesInheritance: true, ngImport: i0, template: `
+    @if (fileCount() > 0) {
+      <span
+        class="ax-cursor-pointer ax-text-primary ax-underline"
+        (click)="openFileList()"
+      >
+        {{ fileCount() }} {{ '@document-management:file' | translate | async }}
+      </span>
+    } @else {
+      <span class="ax-text-muted">---</span>
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'axp-file-uploader-widget-column',
+                    template: `
+    @if (fileCount() > 0) {
+      <span
+        class="ax-cursor-pointer ax-text-primary ax-underline"
+        (click)="openFileList()"
+      >
+        {{ fileCount() }} {{ '@document-management:file' | translate | async }}
+      </span>
+    } @else {
+      <span class="ax-text-muted">---</span>
+    }
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [AXTranslationModule, AsyncPipe],
+                    inputs: ['rawValue', 'rowData'],
+                }]
+        }], ctorParameters: () => [] });
+
+var fileUploaderWidgetColumn_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPFileUploaderWidgetColumnComponent: AXPFileUploaderWidgetColumnComponent
+});
+
+class AXPFileUploaderWidgetEditComponent extends AXPValueWidgetComponent {
+    constructor() {
+        super(...arguments);
+        this.fileService = inject(AXFileService);
+        this.hooks = inject(AXPHookService);
+        this.fileActionsService = inject(AXPFileActionsService);
+        this.commandExecutor = inject(AXPCommandExecutor);
+        //#region ----   Dirty tracking (deferred save pages)   ----
+        this.dirtyChangeSubject = new Subject();
+        this.uploadActionsChangeSubject = new Subject();
+        this.savedSnapshot = signal(undefined, ...(ngDevMode ? [{ debugName: "savedSnapshot" }] : /* istanbul ignore next */ []));
+        this.baselineFingerprint = signal('', ...(ngDevMode ? [{ debugName: "baselineFingerprint" }] : /* istanbul ignore next */ []));
+        this.baselinePendingReconcile = signal(true, ...(ngDevMode ? [{ debugName: "baselinePendingReconcile" }] : /* istanbul ignore next */ []));
+        this.isDirtySignal = signal(false, ...(ngDevMode ? [{ debugName: "isDirtySignal" }] : /* istanbul ignore next */ []));
+        this.skipDirtyEvaluation = false;
+        /** Status before soft-delete; used for restore when baseline was not synced (section layout). */
+        this.statusBeforeDelete = new Map();
+        this.autoBaselineSynced = signal(false, ...(ngDevMode ? [{ debugName: "autoBaselineSynced" }] : /* istanbul ignore next */ []));
+        /** Sync baseline from context when not wired by a deferred-save page (section layout). */
+        this.baselineInitEffect = effect(() => {
+            if (this.autoBaselineSynced()) {
+                return;
+            }
+            const value = this.getValue();
+            if (value == null) {
+                return;
+            }
+            this.syncBaseline(value);
+        }, ...(ngDevMode ? [{ debugName: "baselineInitEffect" }] : /* istanbul ignore next */ []));
+        //#endregion
+        this.multiple = computed(() => this.options()['multiple'], ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
+        this.acceptOverride = signal(undefined, ...(ngDevMode ? [{ debugName: "acceptOverride" }] : /* istanbul ignore next */ []));
+        this.accept = computed(() => this.acceptOverride() ?? this.options()['accept'], ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
+        this.plugins = computed(() => this.options()['plugins'] ?? [], ...(ngDevMode ? [{ debugName: "plugins" }] : /* istanbul ignore next */ []));
+        this.pluginNames = computed(() => (this.plugins() ?? []).map((p) => p.name), ...(ngDevMode ? [{ debugName: "pluginNames" }] : /* istanbul ignore next */ []));
+        this.excludePlugins = computed(() => this.options()['excludePlugins'], ...(ngDevMode ? [{ debugName: "excludePlugins" }] : /* istanbul ignore next */ []));
+        this.fileEditable = computed(() => {
+            if (this.options()['readonly']) {
+                return false;
+            }
+            return this.options()['fileEditable'];
+        }, ...(ngDevMode ? [{ debugName: "fileEditable" }] : /* istanbul ignore next */ []));
+        this.editDialog = computed(() => resolveFileUploaderEditDialog(this.options()), ...(ngDevMode ? [{ debugName: "editDialog" }] : /* istanbul ignore next */ []));
+        this.enableTitleDescription = computed(() => hasFileUploaderTitleOrDescriptionFields(this.editDialog()), ...(ngDevMode ? [{ debugName: "enableTitleDescription" }] : /* istanbul ignore next */ []));
+        /** When mode is `auto`, show the edit dialog after each file select. */
+        this.showEditDialogAfterSelect = computed(() => isFileUploaderEditDialogAuto(this.editDialog()), ...(ngDevMode ? [{ debugName: "showEditDialogAfterSelect" }] : /* istanbul ignore next */ []));
+        this.readonly = computed(() => Boolean(this.options()['readonly']), ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.showBorder = computed(() => this.options()['showBorder'] ?? true, ...(ngDevMode ? [{ debugName: "showBorder" }] : /* istanbul ignore next */ []));
+        this.showAddItemButton = computed(() => this.options()['showAddItemButton'] ?? true, ...(ngDevMode ? [{ debugName: "showAddItemButton" }] : /* istanbul ignore next */ []));
+        this.maxFileSize = computed(() => this.options()['maxFileSize'], ...(ngDevMode ? [{ debugName: "maxFileSize" }] : /* istanbul ignore next */ []));
+        // Drag and drop state
+        this.isDragOver = signal(false, ...(ngDevMode ? [{ debugName: "isDragOver" }] : /* istanbul ignore next */ []));
+        this.innerActions = signal([], ...(ngDevMode ? [{ debugName: "innerActions" }] : /* istanbul ignore next */ []));
+        this.fileActions = computed(() => {
+            const enabledPlugins = this.pluginNames() ?? [];
+            const excludedPlugins = this.excludePlugins() ?? [];
+            const all = this.innerActions() ?? [];
+            return all.filter((a) => {
+                if (excludedPlugins.includes(a.plugin)) {
+                    return false;
+                }
+                if (!enabledPlugins || enabledPlugins.length === 0) {
+                    return a.global === true;
+                }
+                return enabledPlugins.includes(a.plugin) || a.global === true;
+            });
+        }, ...(ngDevMode ? [{ debugName: "fileActions" }] : /* istanbul ignore next */ []));
+        this.files = computed(() => (this.getValue() ?? []).map((file) => ({
+            ...file,
+        })) ?? [], ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
+        this.capabilities = {
+            getFiles: () => this.files(),
+            setFiles: (files) => this.setValue(files),
+            addFiles: (files) => {
+                if (this.readonly()) {
+                    return;
+                }
+                if (this.showEditDialogAfterSelect()) {
+                    this.addFilesWithEditDialogAsync(files);
+                }
+                else {
+                    this.setValue([...(this.getValue() ?? []), ...files]);
+                }
+            },
+            updateFile: (predicate, updater) => {
+                const current = this.getValue() ?? [];
+                const next = current.map((f) => (predicate(f) ? updater(f) : f));
+                this.setValue(next);
+            },
+            removeFile: (file) => this.removeFile(file),
+            clear: () => this.clear(),
+            getFileById: (id) => (this.getValue() ?? []).find((f) => f.id === id),
+            updateFileById: (id, next) => {
+                const current = this.getValue() ?? [];
+                const idx = current.findIndex((f) => f.id === id);
+                if (idx === -1) {
+                    return;
+                }
+                const updated = { ...current[idx], ...next };
+                const cloned = [...current];
+                cloned[idx] = updated;
+                this.setValue(cloned);
+            },
+        };
+    }
+    ngOnInit() {
+        super.ngOnInit();
+        this.configureFromHooks();
+        this.loadActions();
+    }
+    setValue(value) {
+        super.setValue(value);
+        if (this.skipDirtyEvaluation) {
+            return;
+        }
+        this.evaluateDirty();
+    }
+    /** Align dirty baseline with persisted attachments (call when record loads or after discard remount). */
+    syncBaseline(saved) {
+        this.savedSnapshot.set(cloneDeep(saved));
+        this.baselineFingerprint.set(fingerprintAttachments(saved));
+        this.baselinePendingReconcile.set(true);
+        this.statusBeforeDelete.clear();
+        this.autoBaselineSynced.set(true);
+        this.evaluateDirty();
+    }
+    /** Mark current list as saved; clears dirty and drops soft-deleted rows from the UI. */
+    markSaved() {
+        const attachments = persistedAttachments(this.getValue() ?? []);
+        this.skipDirtyEvaluation = true;
+        this.setValue(cloneDeep(attachments));
+        this.skipDirtyEvaluation = false;
+        this.savedSnapshot.set(cloneDeep(attachments));
+        this.baselineFingerprint.set(fingerprintAttachments(attachments));
+        this.baselinePendingReconcile.set(false);
+        this.statusBeforeDelete.clear();
+        this.setDirty(false);
+    }
+    /** Revert widget value to last saved baseline. */
+    discardToBaseline() {
+        const saved = this.savedSnapshot();
+        this.skipDirtyEvaluation = true;
+        this.setValue(cloneDeep(saved ?? []));
+        this.skipDirtyEvaluation = false;
+        this.baselineFingerprint.set(fingerprintAttachments(saved));
+        this.baselinePendingReconcile.set(false);
+        this.statusBeforeDelete.clear();
+        this.setDirty(false);
+    }
+    api() {
+        return {
+            onDirtyChange: this.dirtyChangeSubject,
+            onUploadActionsChanged: this.uploadActionsChangeSubject,
+            getUploadActions: () => this.getUploadActionDescriptors(),
+            runUploadAction: (plugin) => this.runUploadActionByPlugin(plugin),
+            markSaved: () => this.markSaved(),
+            syncBaseline: (saved) => this.syncBaseline(saved),
+            discardToBaseline: () => this.discardToBaseline(),
+            isDirty: () => this.isDirtySignal(),
+        };
+    }
+    /** Current upload actions for host pages (always read via api; list may change after plugins load). */
+    getUploadActionDescriptors() {
+        return this.fileActions().map((action) => ({
+            plugin: action.plugin,
+            text: action.text,
+            textKey: action.textKey,
+            icon: action.icon,
+        }));
+    }
+    async runUploadActionByPlugin(plugin) {
+        if (this.readonly()) {
+            return;
+        }
+        const action = this.fileActions().find((item) => item.plugin === plugin);
+        if (!action) {
+            return;
+        }
+        await action.run(this.capabilities);
+    }
+    notifyUploadActionsChanged() {
+        this.uploadActionsChangeSubject.next();
+    }
+    evaluateDirty() {
+        const attachments = this.getValue() ?? [];
+        const fingerprint = fingerprintAttachments(attachments);
+        const baseline = this.baselineFingerprint();
+        if (this.baselinePendingReconcile()) {
+            this.baselinePendingReconcile.set(false);
+            const normalizedOnly = attachmentsSemanticallyEqual(attachments, this.savedSnapshot());
+            if (normalizedOnly) {
+                this.baselineFingerprint.set(fingerprint);
+                this.setDirty(false);
+                return;
+            }
+        }
+        this.setDirty(fingerprint !== baseline);
+    }
+    setDirty(dirty) {
+        if (this.isDirtySignal() === dirty) {
+            return;
+        }
+        this.isDirtySignal.set(dirty);
+        this.dirtyChangeSubject.next(dirty);
+    }
+    //#endregion
+    async loadActions() {
+        const payload = {
+            plugins: this.plugins() ?? [],
+            excludePlugins: this.excludePlugins() ?? [],
+            capabilities: this.capabilities,
+            actions: [],
+            options: {
+                multiple: this.multiple(),
+                accept: this.accept(),
+            },
+        };
+        const actions = await this.fileActionsService.getActions(payload);
+        this.innerActions.set(actions);
+        this.notifyUploadActionsChanged();
+    }
+    async configureFromHooks() {
+        const payload = await this.hooks.runAsync(FileUploaderWebhookKeys.Configure, {
+            plugins: this.plugins() ?? [],
+            excludePlugins: this.excludePlugins() ?? [],
+            capabilities: this.capabilities,
+            overrides: {},
+        });
+        if (payload?.overrides?.accept) {
+            this.acceptOverride.set(payload.overrides.accept);
+        }
+    }
+    /**
+     * Process files from various sources (file picker, drag-drop, etc.)
+     * When showEditDialogAfterSelect is true, the edit dialog (with plugin hooks) is shown per file before adding; otherwise files are added and user can edit via Edit button.
+     */
+    async processFiles(files) {
+        if (this.readonly()) {
+            return;
+        }
+        if (files.length === 0) {
+            return;
+        }
+        if (!this.multiple()) {
+            this.clear();
+        }
+        const showDialog = this.showEditDialogAfterSelect();
+        const fileUploadRequests = files.map((file) => ({
+            id: AXPDataGenerator.uuid(),
+            name: file.name,
+            size: file.size,
+            type: file.type,
+            status: 'attached',
+            source: {
+                kind: 'blob',
+                value: file,
+            },
+        }));
+        if (showDialog) {
+            await this.addFilesWithEditDialogAsync(fileUploadRequests);
+            return;
+        }
+        // Default: run BeforeFilesAdded (plugins may transform), then add all, then AfterFilesAdded
+        await this.hooks.runAsync(FileUploaderWebhookKeys.BeforeFilesAdded, {
+            plugins: this.plugins() ?? [],
+            excludePlugins: this.excludePlugins() ?? [],
+            capabilities: this.capabilities,
+            newFiles: fileUploadRequests,
+        });
+        this.setValue([...(this.getValue() ?? []), ...fileUploadRequests]);
+        await this.hooks.runAsync(FileUploaderWebhookKeys.AfterFilesAdded, {
+            plugins: this.plugins() ?? [],
+            excludePlugins: this.excludePlugins() ?? [],
+            capabilities: this.capabilities,
+            newFiles: fileUploadRequests,
+        });
+    }
+    /**
+     * Show edit dialog per file and add only those submitted. Used when showEditDialogAfterSelect is true (both from zone and from dropdown actions).
+     */
+    async addFilesWithEditDialogAsync(fileItems) {
+        const added = [];
+        for (const fileItem of fileItems) {
+            const result = await this.commandExecutor.execute('FileUploader:Edit', {
+                file: fileItem,
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                enableTitleDescription: this.enableTitleDescription(),
+                isNewFile: true,
+            });
+            if (result?.success && result.data) {
+                added.push(result.data);
+            }
+        }
+        if (added.length > 0) {
+            this.setValue([...(this.getValue() ?? []), ...added]);
+            await this.hooks.runAsync(FileUploaderWebhookKeys.AfterFilesAdded, {
+                plugins: this.plugins() ?? [],
+                excludePlugins: this.excludePlugins() ?? [],
+                capabilities: this.capabilities,
+                newFiles: added,
+            });
         }
     }
-    extractDisplayItem(ref) {
-        if (!ref) {
-            return null;
+    handleFileRemove(file) {
+        this.removeFile(file);
+    }
+    removeFile(file) {
+        if (file.readOnly === true || !file.id) {
+            return;
         }
-        const def = this.definition();
-        // If ref is already AXPMultiSourceRef format
-        if (ref.sourceKey && ref.displayName) {
-            return {
-                id: ref.refId || ref.sourceKey,
-                text: ref.displayName,
-            };
+        // If multiple is false, always remove the file directly (no redo capability)
+        if (!this.multiple()) {
+            this.setValue((this.getValue() ?? []).filter((f) => f.id !== file.id) ?? []);
+            return;
         }
-        // If ref is object with id
-        if (typeof ref === 'object' && ref.id) {
-            const sourceKey = ref.sourceKey;
-            if (sourceKey && def) {
-                const source = def.sources.find((s) => s.key === sourceKey);
-                if (source) {
-                    const displayText = this.getDisplayText(ref, source);
-                    return {
-                        id: ref.id,
-                        text: displayText,
-                    };
-                }
-            }
-            // Fallback
-            const displayText = ref.displayName || ref.title || ref.id || String(ref);
-            return {
-                id: ref.id,
-                text: displayText,
-            };
+        // If multiple is true, use the existing logic (mark as deleted for redo)
+        if (file.status === 'attached') {
+            this.statusBeforeDelete.delete(file.id);
+            this.setValue((this.getValue() ?? []).filter((f) => f.id !== file.id) ?? []);
+        }
+        else {
+            this.statusBeforeDelete.set(file.id, file.status);
+            this.setValue((this.getValue() ?? []).map((f) => (f.id === file.id ? { ...f, status: 'deleted' } : f)) ?? []);
         }
-        // If ref is primitive
-        return {
-            id: String(ref),
-            text: String(ref),
-        };
     }
-    getDisplayText(item, source) {
-        if (!item) {
-            return '';
+    /**
+     * Revert a deleted file back to its pre-delete status.
+     */
+    handleFileRevert(file) {
+        if (file.readOnly === true || !file.id) {
+            return;
         }
-        const template = source.displayFormat || this.displayFormat();
-        if (template) {
-            const formatted = this.formatService.format(template, 'string', item);
-            if (formatted) {
-                return formatted;
-            }
+        const restoredStatus = this.resolveRestoredStatus(file);
+        if (!restoredStatus) {
+            return;
         }
-        // Fallback to common display fields
-        return get(item, 'displayName') || get(item, 'title') || get(item, 'name') || String(item.id || item);
+        this.statusBeforeDelete.delete(file.id);
+        this.setValue((this.getValue() ?? []).map((f) => (f.id === file.id ? { ...f, status: restoredStatus } : f)) ?? []);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMultiSourceSelectorWidgetColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPMultiSourceSelectorWidgetColumnComponent, isStandalone: true, selector: "axp-multi-source-selector-widget-column", inputs: { rawValue: "rawValue", rowData: "rowData" }, usesInheritance: true, ngImport: i0, template: `
-    @if (displayItems().length > 0) {
-      <div class="ax-flex ax-flex-wrap ax-gap-1">
-        @for (item of visibleItems(); track item.id) {
-          <ax-badge class="ax-p-0.5 ax-accent1" [text]="item.text"></ax-badge>
+    resolveRestoredStatus(file) {
+        if (!file.id) {
+            return undefined;
         }
-        @if (hasMoreItems()) {
-          <ax-badge class="ax-p-0.5 ax-accent2" [text]="'+' + remainingItemsCount()"></ax-badge>
+        const fileId = file.id;
+        const baselineFile = (this.savedSnapshot() ?? []).find((f) => f.id === fileId);
+        const fromBaseline = baselineFile?.status;
+        if (fromBaseline && fromBaseline !== 'deleted') {
+            return fromBaseline;
+        }
+        const fromDelete = this.statusBeforeDelete.get(fileId);
+        if (fromDelete && fromDelete !== 'deleted') {
+            return fromDelete;
+        }
+        return 'uploaded';
+    }
+    /**
+     * Handle file rename action. Persists name/title/description to file storage immediately when edited
+     * so they are saved even if the entity payload does not carry these fields.
+     */
+    handleFileRename(file) {
+        if (file.readOnly === true) {
+            return;
         }
+        const currentFiles = this.getValue() ?? [];
+        const previousFile = currentFiles.find((f) => f.id === file.id);
+        const nameChanged = previousFile && previousFile.name !== file.name;
+        const titleChanged = previousFile && previousFile.title !== file.title;
+        const descriptionChanged = previousFile && previousFile.description !== file.description;
+        const anyMetadataChanged = nameChanged || titleChanged || descriptionChanged;
+        const shouldChangeStatus = anyMetadataChanged &&
+            previousFile &&
+            (previousFile.status === 'uploaded' || previousFile.status === 'remote');
+        const updatedFile = {
+            ...file,
+            status: shouldChangeStatus ? 'editing' : file.status,
+        };
+        this.setValue(currentFiles.map((f) => (f.id === file.id ? updatedFile : f)) ?? []);
+    }
+    clear() {
+        const current = this.getValue() ?? [];
+        const locked = current.filter((f) => f.readOnly === true);
+        this.setValue(locked);
+    }
+    //#region ----   Drag & Drop Handlers   ----
+    onFileChange(event) {
+        this.processFiles(event.files);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPFileUploaderWidgetEditComponent, isStandalone: true, selector: "axp-file-uploader-widget-edit", host: { properties: { "class.axp-file-uploader-widget-edit--borderless": "!showBorder()", "class.ax-block": "true", "class.ax-flex-1": "true", "class.ax-border": "showBorder()", "class.ax-rounded-md": "showBorder()", "class.ax-lightest-surface": "showBorder()" } }, usesInheritance: true, ngImport: i0, template: `
+    @if (showAddItemButton() && !readonly()) {
+      <div class="ax-flex ax-justify-end ax-p-2" [class.ax-border-b]="showBorder()" *translate="let t">
+        <!-- Add Item Button -->
+        <ax-button class="ax-sm" [text]="t('@general:actions.add-item.title') | async" [color]="'primary'">
+          <ax-prefix>
+            <ax-icon icon="fa-light  fa-plus"></ax-icon>
+          </ax-prefix>
+          <ax-dropdown-panel>
+            <!-- Upload Dropdown -->
+            <ax-button-item-list>
+              @for (action of fileActions(); track action.plugin) {
+                <ax-button-item
+                  (onClick)="action.run(capabilities)"
+                  [text]="action.text ?? (action.textKey ? (t(action.textKey) | async)! : '')"
+                >
+                  @if (action.icon) {
+                    <ax-prefix>
+                      <ax-icon [icon]="action.icon"></ax-icon>
+                    </ax-prefix>
+                  }
+                </ax-button-item>
+              }
+            </ax-button-item-list>
+          </ax-dropdown-panel>
+        </ax-button>
       </div>
-    } @else {
-      <span class="ax-text-muted">---</span>
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i2$1.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    <div
+      [class.ax-p-2]="showBorder()"
+      axUploaderZone
+      (fileChange)="onFileChange($event)"
+      [disableBrowse]="readonly() || ((getValue() ?? []).length) > 0"
+    >
+      <axp-file-list
+        [files]="files()"
+        [readonly]="readonly()"
+        [fileEditable]="fileEditable()"
+        [enableTitleDescription]="enableTitleDescription()"
+        [plugins]="plugins()"
+        [excludePlugins]="excludePlugins()"
+        [capabilities]="capabilities"
+        [multiple]="multiple()"
+        (onRemove)="handleFileRemove($event)"
+        (onRevert)="handleFileRevert($event)"
+        (onRename)="handleFileRename($event)"
+      ></axp-file-list>
+    </div>
+  `, isInline: true, styles: [":host{border-color:rgba(var(--ax-comp-editor-border-color))}:host.axp-file-uploader-widget-edit--borderless{border:none!important}.__drag-over{background-color:rgba(var(--ax-sys-color-primary-50),.1);border:2px dashed rgb(var(--ax-sys-color-primary-500));border-radius:.375rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "directive", type: AXUploaderZoneDirective, selector: "[axUploaderZone]", inputs: ["multiple", "accept", "overlayTemplate", "disableBrowse", "disableDragDrop"], outputs: ["fileChange", "onChanged", "dragEnter", "dragLeave", "dragOver", "onFileUploadComplete", "onFilesUploadComplete"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i4$2.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXPComponentSlotModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i6.AXTranslatorDirective, selector: "[translate]" }, { kind: "component", type: AXPFileListComponent, selector: "axp-file-list", inputs: ["readonly", "fileEditable", "enableTitleDescription", "multiple", "files", "plugins", "excludePlugins", "capabilities"], outputs: ["onRemove", "onRevert", "onRename"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPMultiSourceSelectorWidgetColumnComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetEditComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: 'axp-multi-source-selector-widget-column',
-                    template: `
-    @if (displayItems().length > 0) {
-      <div class="ax-flex ax-flex-wrap ax-gap-1">
-        @for (item of visibleItems(); track item.id) {
-          <ax-badge class="ax-p-0.5 ax-accent1" [text]="item.text"></ax-badge>
-        }
-        @if (hasMoreItems()) {
-          <ax-badge class="ax-p-0.5 ax-accent2" [text]="'+' + remainingItemsCount()"></ax-badge>
-        }
+            args: [{ selector: 'axp-file-uploader-widget-edit', template: `
+    @if (showAddItemButton() && !readonly()) {
+      <div class="ax-flex ax-justify-end ax-p-2" [class.ax-border-b]="showBorder()" *translate="let t">
+        <!-- Add Item Button -->
+        <ax-button class="ax-sm" [text]="t('@general:actions.add-item.title') | async" [color]="'primary'">
+          <ax-prefix>
+            <ax-icon icon="fa-light  fa-plus"></ax-icon>
+          </ax-prefix>
+          <ax-dropdown-panel>
+            <!-- Upload Dropdown -->
+            <ax-button-item-list>
+              @for (action of fileActions(); track action.plugin) {
+                <ax-button-item
+                  (onClick)="action.run(capabilities)"
+                  [text]="action.text ?? (action.textKey ? (t(action.textKey) | async)! : '')"
+                >
+                  @if (action.icon) {
+                    <ax-prefix>
+                      <ax-icon [icon]="action.icon"></ax-icon>
+                    </ax-prefix>
+                  }
+                </ax-button-item>
+              }
+            </ax-button-item-list>
+          </ax-dropdown-panel>
+        </ax-button>
       </div>
-    } @else {
-      <span class="ax-text-muted">---</span>
     }
+    <div
+      [class.ax-p-2]="showBorder()"
+      axUploaderZone
+      (fileChange)="onFileChange($event)"
+      [disableBrowse]="readonly() || ((getValue() ?? []).length) > 0"
+    >
+      <axp-file-list
+        [files]="files()"
+        [readonly]="readonly()"
+        [fileEditable]="fileEditable()"
+        [enableTitleDescription]="enableTitleDescription()"
+        [plugins]="plugins()"
+        [excludePlugins]="excludePlugins()"
+        [capabilities]="capabilities"
+        [multiple]="multiple()"
+        (onRemove)="handleFileRemove($event)"
+        (onRevert)="handleFileRevert($event)"
+        (onRename)="handleFileRename($event)"
+      ></axp-file-list>
+    </div>
+  `, host: {
+                        '[class.axp-file-uploader-widget-edit--borderless]': '!showBorder()',
+                        '[class.ax-block]': 'true',
+                        '[class.ax-flex-1]': 'true',
+                        '[class.ax-border]': 'showBorder()',
+                        '[class.ax-rounded-md]': 'showBorder()',
+                        '[class.ax-lightest-surface]': 'showBorder()',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        CommonModule,
+                        FormsModule,
+                        AXButtonModule,
+                        AXUploaderZoneDirective,
+                        AXDecoratorModule,
+                        AXLoadingModule,
+                        AXDropdownModule,
+                        AXPComponentSlotModule,
+                        AXTranslationModule,
+                        AXPFileListComponent,
+                    ], styles: [":host{border-color:rgba(var(--ax-comp-editor-border-color))}:host.axp-file-uploader-widget-edit--borderless{border:none!important}.__drag-over{background-color:rgba(var(--ax-sys-color-primary-50),.1);border:2px dashed rgb(var(--ax-sys-color-primary-500));border-radius:.375rem}\n"] }]
+        }] });
+
+var fileUploaderWidgetEdit_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPFileUploaderWidgetEditComponent: AXPFileUploaderWidgetEditComponent
+});
+
+class AXPFileUploaderWidgetViewComponent extends AXPValueWidgetComponent {
+    constructor() {
+        super(...arguments);
+        this.files = computed(() => (this.getValue() ?? []).filter(file => file.status !== 'deleted') ?? [], ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
+    }
+    get __class() {
+        const cls = {};
+        cls[`ax-block`] = true;
+        cls[`ax-flex-1`] = true;
+        return cls;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: AXPFileUploaderWidgetViewComponent, isStandalone: true, selector: "axp-file-uploader-widget-view", host: { properties: { "class": "this.__class" } }, usesInheritance: true, ngImport: i0, template: `
+  <axp-file-list [files]="files()" [readonly]="true"></axp-file-list>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXUploaderModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPFileListComponent, selector: "axp-file-list", inputs: ["readonly", "fileEditable", "enableTitleDescription", "multiple", "files", "plugins", "excludePlugins", "capabilities"], outputs: ["onRemove", "onRevert", "onRename"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPFileUploaderWidgetViewComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'axp-file-uploader-widget-view',
+                    template: `
+  <axp-file-list [files]="files()" [readonly]="true"></axp-file-list>
   `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [AXBadgeModule],
-                    inputs: ['rawValue', 'rowData'],
+                    standalone: true,
+                    imports: [
+                        FormsModule,
+                        AXButtonModule,
+                        AXDecoratorModule,
+                        AXUploaderModule,
+                        AXLoadingModule,
+                        AXTranslationModule,
+                        AXPFileListComponent
+                    ],
+                    inputs: [],
                 }]
-        }], ctorParameters: () => [] });
+        }], propDecorators: { __class: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
 
-var multiSourceSelectorWidgetColumn_component = /*#__PURE__*/Object.freeze({
+var fileUploaderWidgetView_component = /*#__PURE__*/Object.freeze({
     __proto__: null,
-    AXPMultiSourceSelectorWidgetColumnComponent: AXPMultiSourceSelectorWidgetColumnComponent
+    AXPFileUploaderWidgetViewComponent: AXPFileUploaderWidgetViewComponent
+});
+
+const AXPFileUploaderWidget = {
+    name: 'attachments',
+    title: '@platform-layout-widgets:widgets.attachments.title',
+    description: '@platform-layout-widgets:widgets.attachments.description',
+    icon: 'fa-light fa-files',
+    categories: [AXP_WIDGETS_ADVANCE_CATEGORY],
+    subCategory: AXP_WIDGETS_ADVANCE_SUB_MEDIA,
+    groups: [AXPWidgetGroupEnum.EntityWidget, 'form-element'],
+    type: 'editor',
+    properties: [
+        AXP_NAME_PROPERTY,
+        AXP_DATA_PATH_PROPERTY,
+        AXP_ALLOW_MULTIPLE_PROPERTY,
+        AXP_DOWNLOADABLE_PROPERTY,
+        AXP_READONLY_PROPERTY,
+        AXP_DESCRIPTION_PROPERTY,
+        createStringProperty({
+            name: 'accept',
+            title: 'Accept',
+            path: 'options.accept',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+        createBooleanProperty({
+            name: 'fileEditable',
+            title: 'File Editable',
+            path: 'options.fileEditable',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+        createBooleanProperty({
+            name: 'enableTitleDescription',
+            title: 'Enable Title & Description',
+            path: 'options.enableTitleDescription',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+        createBooleanProperty({
+            name: 'showEditDialogAfterSelect',
+            title: 'Show Edit Dialog After File Select',
+            path: 'options.showEditDialogAfterSelect',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+        createBooleanProperty({
+            name: 'showBorder',
+            title: 'Show Border',
+            path: 'options.showBorder',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+        createBooleanProperty({
+            name: 'showAddItemButton',
+            title: 'Show Add Item Button',
+            path: 'options.showAddItemButton',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+        createNumberProperty({
+            name: 'maxFileSize',
+            title: 'Max File Size (bytes)',
+            path: 'options.maxFileSize',
+            group: AXP_BEHAVIOR_PROPERTY_GROUP,
+        }),
+    ],
+    components: {
+        view: {
+            component: () => Promise.resolve().then(function () { return fileUploaderWidgetView_component; }).then((c) => c.AXPFileUploaderWidgetViewComponent),
+        },
+        edit: {
+            component: () => Promise.resolve().then(function () { return fileUploaderWidgetEdit_component; }).then((c) => c.AXPFileUploaderWidgetEditComponent),
+        },
+        column: {
+            component: () => Promise.resolve().then(function () { return fileUploaderWidgetColumn_component; }).then((c) => c.AXPFileUploaderWidgetColumnComponent),
+        },
+        designer: {
+            component: () => Promise.resolve().then(function () { return fileUploaderWidgetEdit_component; }).then((c) => c.AXPFileUploaderWidgetEditComponent),
+        },
+    },
+};
+
+var index = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEditFileUploaderCommand: AXPEditFileUploaderCommand,
+    AXPFileListComponent: AXPFileListComponent,
+    AXPFileUploaderLoadFilesQuery: AXPFileUploaderLoadFilesQuery,
+    AXPFileUploaderSaveFilesCommand: AXPFileUploaderSaveFilesCommand,
+    AXPFileUploaderWidget: AXPFileUploaderWidget,
+    AXPFileUploaderWidgetColumnComponent: AXPFileUploaderWidgetColumnComponent,
+    AXPFileUploaderWidgetEditComponent: AXPFileUploaderWidgetEditComponent,
+    AXPFileUploaderWidgetService: AXPFileUploaderWidgetService,
+    AXPFileUploaderWidgetViewComponent: AXPFileUploaderWidgetViewComponent,
+    attachmentFieldCount: attachmentFieldCount,
+    attachmentsSemanticallyEqual: attachmentsSemanticallyEqual,
+    committedAttachments: committedAttachments,
+    fingerprintAttachmentItem: fingerprintAttachmentItem,
+    fingerprintAttachments: fingerprintAttachments,
+    hasFileUploaderTitleOrDescriptionFields: hasFileUploaderTitleOrDescriptionFields,
+    isAttachmentListEntry: isAttachmentListEntry,
+    isFileListItem: isFileListItem,
+    isFileUploaderEditDialogAuto: isFileUploaderEditDialogAuto,
+    normalizeEntityFieldToFileList: normalizeEntityFieldToFileList,
+    persistedAttachments: persistedAttachments,
+    resolveFileUploaderEditDialog: resolveFileUploaderEditDialog,
+    resolveFileUploaderEntityScope: resolveFileUploaderEntityScope
 });
 
 //#region ---- Imports ----
@@ -17697,6 +20579,7 @@ const ENTITY_WIDGETS = [
     AXPEntityCategoryWidget,
     AXPMultiSourceSelectorWidget,
     AXPEntityDefinitionProviderWidget,
+    AXPFileUploaderWidget,
 ];
 const ENTITY_EXTENDED_WIDGETS = [
     {
@@ -20402,6 +23285,127 @@ const defaultMultiLanguageMiddlewareProvider = {
 };
 //#endregion
 
+//#region ---- Smart card layout builders ----
+const TITLE_FIELD_CANDIDATES = ['title', 'name'];
+const DESCRIPTION_FIELD_CANDIDATES = ['description'];
+const ICON_FIELD_CANDIDATES = ['icon'];
+const STATUS_FIELD_CANDIDATES = ['status', 'statusId'];
+function findPropertyName(properties, candidates) {
+    const names = new Set(properties.map((p) => p.name));
+    return candidates.find((candidate) => names.has(candidate));
+}
+function findColumnName(columnNames, candidates) {
+    return candidates.find((candidate) => columnNames.includes(candidate));
+}
+function findNestedColumnName(columnNames, suffix) {
+    return columnNames.find((name) => name === suffix || name.endsWith(`.${suffix}`));
+}
+function resolveTitleField(properties, columnNames) {
+    return (findPropertyName(properties, TITLE_FIELD_CANDIDATES) ??
+        findColumnName(columnNames, TITLE_FIELD_CANDIDATES) ??
+        findNestedColumnName(columnNames, 'fullName') ??
+        findNestedColumnName(columnNames, 'displayName') ??
+        columnNames[0] ??
+        'name');
+}
+function resolveDescriptionField(properties, columnNames) {
+    return (findPropertyName(properties, DESCRIPTION_FIELD_CANDIDATES) ??
+        findColumnName(columnNames, DESCRIPTION_FIELD_CANDIDATES) ??
+        findNestedColumnName(columnNames, 'description'));
+}
+function resolveIconField(properties, columnNames) {
+    return findPropertyName(properties, ICON_FIELD_CANDIDATES) ?? findColumnName(columnNames, ICON_FIELD_CANDIDATES);
+}
+function resolveStatusField(properties, columnNames) {
+    return (findPropertyName(properties, STATUS_FIELD_CANDIDATES) ??
+        findColumnName(columnNames, STATUS_FIELD_CANDIDATES) ??
+        findNestedColumnName(columnNames, 'status'));
+}
+function resolveListColumnNames(entityColumns, tableColumns) {
+    const names = new Set();
+    const ordered = [];
+    const append = (columns) => {
+        for (const column of columns ?? []) {
+            if (!column.name || names.has(column.name)) {
+                continue;
+            }
+            if (column.options?.visible === false) {
+                continue;
+            }
+            names.add(column.name);
+            ordered.push(column.name);
+        }
+    };
+    append(entityColumns);
+    append(tableColumns);
+    return ordered;
+}
+function buildCardFields(columnNames, headerFields, statusField) {
+    return columnNames
+        .filter((name) => !headerFields.has(name))
+        .map((name) => {
+        const field = { name };
+        if (statusField && name === statusField) {
+            field.display = 'badge';
+        }
+        return field;
+    });
+}
+function buildDefaultCardLayout(entity, entityColumns) {
+    const properties = entity.properties ?? [];
+    const tableColumns = entity.interfaces?.master?.list?.layouts?.table?.columns;
+    const columnNames = resolveListColumnNames(entityColumns, tableColumns);
+    if (columnNames.length === 0) {
+        return null;
+    }
+    const titleField = resolveTitleField(properties, columnNames);
+    const descriptionField = resolveDescriptionField(properties, columnNames);
+    const iconField = resolveIconField(properties, columnNames);
+    const statusField = resolveStatusField(properties, columnNames);
+    const headerFields = new Set([titleField, descriptionField, iconField].filter((field) => !!field));
+    const fields = buildCardFields(columnNames, headerFields, statusField);
+    if (fields.length === 0 && !titleField) {
+        return null;
+    }
+    return {
+        enabled: true,
+        header: {
+            title: titleField,
+            ...(descriptionField ? { description: descriptionField } : {}),
+            ...(iconField ? { icon: iconField } : {}),
+        },
+        fields,
+    };
+}
+//#endregion
+//#region ---- Default card layout middleware ----
+/**
+ * When an entity has no `interfaces.master.list.layouts.card`, creates a sensible default
+ * from list columns and property names (title, description, remaining columns as card fields).
+ */
+const defaultCardLayoutMiddleware = (context) => {
+    const existingCard = context.interfaces.master.list.card.get();
+    if (existingCard !== undefined) {
+        return;
+    }
+    if (!context.interfaces.master.list.get()) {
+        return;
+    }
+    const layout = buildDefaultCardLayout(context.entity, context.columns.list());
+    if (!layout) {
+        return;
+    }
+    context.interfaces.master.list.card.set(layout);
+};
+//#endregion
+//#region ---- Provider registration ----
+const defaultCardLayoutMiddlewareProvider = {
+    entityName: '*',
+    modifier: defaultCardLayoutMiddleware,
+    order: 600,
+};
+//#endregion
+
 /**
  * Factory to create a column width middleware using provided config map.
  * Sets width for columns defined in the map if not already defined on the column.
@@ -20456,8 +23460,9 @@ const AXPCrudModifier = {
             if (!queries?.list) {
                 queries.list = {
                     execute: async (e) => {
-                        console.log('query', ctx.module.get() + '.' + ctx.name.get(), e);
-                        return await dataService.query(e);
+                        const res = await dataService.query(e);
+                        console.log('query', res, ctx.module.get() + '.' + ctx.name.get(), e);
+                        return res;
                     },
                     type: AXPEntityQueryType.List,
                 };
@@ -21074,54 +24079,50 @@ const AXPShowDetailsViewWorkflow = {
 class AXPShowFileUploaderPopupAction extends AXPWorkflowAction {
     constructor() {
         super(...arguments);
+        //#region ----   Services & Dependencies   ----
         this.fileUploaderWidgetService = inject(AXPFileUploaderWidgetService);
-        this.entityRegistryService = inject(AXPEntityDefinitionRegistryService);
     }
+    //#endregion
+    //#region ----   Workflow Action   ----
     async execute(context) {
-        // *********** get options ***********
-        const key = context.getVariable('options.key');
+        const field = context.getVariable('options.key');
         const rawReadonly = context.getVariable('options.readonly') ??
             context.getVariable('options.readOnly');
         const isReadonly = rawReadonly === true || rawReadonly === 'true';
         const multiple = context.getVariable('options.multiple');
         const accept = context.getVariable('options.accept');
         const maxFileSize = context.getVariable('options.maxFileSize');
-        const files = context.getVariable('options.files');
         const fileEditable = context.getVariable('options.fileEditable');
-        const enableTitleDescription = context.getVariable('options.enableTitleDescription');
-        const showEditDialogAfterSelect = context.getVariable('options.showEditDialogAfterSelect');
-        const correctFiles = (files ?? []).filter((item) => item != null && typeof item === 'object' && typeof item.name === 'string');
-        // *********** show file list ***********
-        const res = await this.fileUploaderWidgetService.showFileList({
-            files: correctFiles,
+        const showAddItemButton = context.getVariable('options.showAddItemButton');
+        const editDialog = context.getVariable('options.editDialog');
+        const plugins = context.getVariable('options.plugins');
+        const entityOption = context.getVariable('options.entity');
+        const entityRef = entityOption?.name ??
+            context.getVariable('entity') ??
+            context.getVariable('options.entityName');
+        const entityId = entityOption?.id ?? context.getVariable('options.id');
+        const resolvedField = entityOption?.field ?? field;
+        if (!entityRef || !entityId || !resolvedField) {
+            context.setOutput('result', false);
+            return;
+        }
+        const files = await this.fileUploaderWidgetService.showFileList({
+            entity: { name: entityRef, id: entityId, field: resolvedField },
             readonly: isReadonly,
-            multiple: multiple,
-            accept: accept,
-            fileEditable: fileEditable,
-            enableTitleDescription: enableTitleDescription ?? false,
-            showEditDialogAfterSelect: showEditDialogAfterSelect ?? false,
-            // maxFileSize: maxFileSize,
+            multiple,
+            accept,
+            fileEditable,
+            maxFileSize,
+            showAddItemButton: showAddItemButton ?? true,
+            plugins: plugins ?? [],
+            editDialog,
         });
-        // Handle case when result is undefined or empty array
-        if (!res) {
+        if (!files) {
             context.setOutput('result', false);
             return;
         }
-        // *********** save files to entity ***********
-        const [module, entity] = context.getVariable('entity').split('.');
-        const entityDefinition = await this.entityRegistryService.resolve(module, entity);
-        if (entityDefinition) {
-            const updateExec = entityDefinition.commands?.update?.execute;
-            const entityData = await updateExec({
-                id: context.getVariable('options.id'),
-                [key]: res,
-            });
-            context.setOutput('result', true);
-            // Merge full file list (name, title, description) from popup into returned data so
-            // workflow output includes title/description when enableTitleDescription is used
-            const dataWithFiles = { ...entityData, [key]: res };
-            context.setVariable('data', cloneDeep(dataWithFiles));
-        }
+        context.setOutput('result', true);
+        context.setVariable('data', cloneDeep({ id: entityId, [resolvedField]: files }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPShowFileUploaderPopupAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPShowFileUploaderPopupAction }); }
@@ -21291,7 +24292,8 @@ function routesFacory() {
 }
 class AXPEntityModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityModule, imports: [RouterModule, i1$3.AXPWorkflowModule, AXPWidgetCoreModule,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityModule, imports: [RouterModule,
+            AXPAttachmentsPluginModule, i1$3.AXPWorkflowModule, AXPWidgetCoreModule,
             LayoutBuilderModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPEntityModule, providers: [
             { provide: AXP_WIDGET_DEFINITION_PROVIDER, useClass: AXPEntityWidgetsProvider, multi: true },
@@ -21322,6 +24324,11 @@ class AXPEntityModule {
                 useValue: columnOrderingMiddlewareProvider,
                 multi: true,
             },
+            {
+                provide: AXP_ENTITY_MODIFIER,
+                useValue: defaultCardLayoutMiddlewareProvider,
+                multi: true,
+            },
             {
                 provide: AXP_ENTITY_MODIFIER,
                 useValue: AXPCrudModifier,
@@ -21386,14 +24393,27 @@ class AXPEntityModule {
                     key: 'Entity:View',
                     command: () => Promise.resolve().then(function () { return viewEntityDetails_command; }).then((c) => c.AXPViewEntityDetailsCommand),
                 },
+                {
+                    key: 'FileUploader:Edit',
+                    command: () => Promise.resolve().then(function () { return index; }).then((c) => c.AXPEditFileUploaderCommand),
+                },
+                {
+                    key: 'FileUploader:SaveFiles',
+                    command: () => Promise.resolve().then(function () { return index; }).then((c) => c.AXPFileUploaderSaveFilesCommand),
+                },
             ]),
             provideQuerySetups([
                 {
                     key: 'Entity:GetDetails',
                     loader: () => Promise.resolve().then(function () { return getEntityDetails_query; }).then((c) => c.AXPGetEntityDetailsQuery),
                 },
+                {
+                    key: 'FileUploader:LoadFiles',
+                    loader: () => Promise.resolve().then(function () { return index; }).then((c) => c.AXPFileUploaderLoadFilesQuery),
+                },
             ]),
         ], imports: [RouterModule,
+            AXPAttachmentsPluginModule,
             AXPWorkflowModule.forChild({
                 actions: {
                     AXPEntityCreatePopupAction,
@@ -21429,6 +24449,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             args: [{
                     imports: [
                         RouterModule,
+                        AXPAttachmentsPluginModule,
                         AXPWorkflowModule.forChild({
                             actions: {
                                 AXPEntityCreatePopupAction,
@@ -21490,6 +24511,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                             useValue: columnOrderingMiddlewareProvider,
                             multi: true,
                         },
+                        {
+                            provide: AXP_ENTITY_MODIFIER,
+                            useValue: defaultCardLayoutMiddlewareProvider,
+                            multi: true,
+                        },
                         {
                             provide: AXP_ENTITY_MODIFIER,
                             useValue: AXPCrudModifier,
@@ -21554,12 +24580,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                                 key: 'Entity:View',
                                 command: () => Promise.resolve().then(function () { return viewEntityDetails_command; }).then((c) => c.AXPViewEntityDetailsCommand),
                             },
+                            {
+                                key: 'FileUploader:Edit',
+                                command: () => Promise.resolve().then(function () { return index; }).then((c) => c.AXPEditFileUploaderCommand),
+                            },
+                            {
+                                key: 'FileUploader:SaveFiles',
+                                command: () => Promise.resolve().then(function () { return index; }).then((c) => c.AXPFileUploaderSaveFilesCommand),
+                            },
                         ]),
                         provideQuerySetups([
                             {
                                 key: 'Entity:GetDetails',
                                 loader: () => Promise.resolve().then(function () { return getEntityDetails_query; }).then((c) => c.AXPGetEntityDetailsQuery),
                             },
+                            {
+                                key: 'FileUploader:LoadFiles',
+                                loader: () => Promise.resolve().then(function () { return index; }).then((c) => c.AXPFileUploaderLoadFilesQuery),
+                            },
                         ]),
                     ],
                 }]
@@ -21800,5 +24838,5 @@ var getEntityDetails_query = /*#__PURE__*/Object.freeze({
  * Generated bundle index. Do not edit.
  */
 
-export { AXMEntityCrudService, AXMEntityCrudServiceImpl, AXPCategoryTreeService, AXPCreateEntityCommand, AXPCreateEntityWorkflow, AXPDataSeederService, AXPDeleteEntityWorkflow, AXPEntitiesListDataSourceDefinition, AXPEntityApplyUpdatesAction, AXPEntityCategoryTreeSelectorComponent, AXPEntityCategoryWidget, AXPEntityCategoryWidgetColumnComponent, AXPEntityCategoryWidgetEditComponent, AXPEntityCategoryWidgetViewComponent, AXPEntityCommandTriggerViewModel, AXPEntityCreateEvent, AXPEntityCreatePopupAction, AXPEntityCreateSubmittedAction, AXPEntityCreateViewElementViewModel, AXPEntityCreateViewModelFactory, AXPEntityCreateViewSectionViewModel, AXPEntityDataProvider, AXPEntityDataProviderImpl, AXPEntityDataSelectorService, AXPEntityDefinitionProviderWidget, AXPEntityDefinitionProviderWidgetEditComponent, AXPEntityDefinitionRegistryService, AXPEntityDeletedEvent, AXPEntityDetailListViewModel, AXPEntityDetailPopoverComponent, AXPEntityDetailPopoverService, AXPEntityDetailViewModelFactory, AXPEntityDetailViewModelResolver, AXPEntityEventDispatcherService, AXPEntityEventsKeys, AXPEntityFormBuilderService, AXPEntityListPersistenceModeDefault, AXPEntityListTableService, AXPEntityListToolbarService, AXPEntityListViewColumnViewModel, AXPEntityListViewModelFactory, AXPEntityListViewModelResolver, AXPEntityListWidget, AXPEntityListWidgetViewComponent, AXPEntityMasterCreateViewModel, AXPEntityMasterListViewModel, AXPEntityMasterListViewQueryViewModel, AXPEntityMasterSingleElementViewModel, AXPEntityMasterSingleViewGroupViewModel, AXPEntityMasterSingleViewModel, AXPEntityMasterUpdateElementViewModel, AXPEntityMasterUpdateViewModel, AXPEntityMasterUpdateViewModelFactory, AXPEntityMiddleware, AXPEntityModifyConfirmedAction, AXPEntityModifyEvent, AXPEntityModifySectionPopupAction, AXPEntityModule, AXPEntityPerformDeleteAction, AXPEntityPreloadFiltersContainerComponent, AXPEntityPreloadFiltersViewModel, AXPEntityPreloadFiltersViewModelResolver, AXPEntityResolver, AXPEntityService, AXPEntityStorageService, AXPEntityUpdateViewSectionViewModel, AXPGetEntityDetailsQuery, AXPLayoutOrderingConfigService, AXPLookupWidget, AXPLookupWidgetColumnComponent, AXPLookupWidgetEditComponent, AXPLookupWidgetViewComponent, AXPMiddlewareAbortError, AXPMiddlewareEntityStorageService, AXPModifyEntitySectionWorkflow, AXPMultiSourceDefinitionProviderContext, AXPMultiSourceDefinitionProviderService, AXPMultiSourceFederatedSearchService, AXPMultiSourceSelectorComponent, AXPMultiSourceSelectorService, AXPMultiSourceSelectorWidget, AXPMultiSourceSelectorWidgetColumnComponent, AXPMultiSourceSelectorWidgetEditComponent, AXPMultiSourceSelectorWidgetViewComponent, AXPMultiSourceType, AXPOpenEntityDetailsCommand, AXPQuickEntityModifyPopupAction, AXPQuickModifyEntityWorkflow, AXPRelatedColumnEnrichmentService, AXPRelatedColumnMetadataResolver, AXPSelectorStructureWidget, AXPSelectorStructureWidgetColumnComponent, AXPSelectorStructureWidgetEditComponent, AXPSelectorStructureWidgetViewComponent, AXPShowDetailViewAction, AXPShowDetailsViewWorkflow, AXPShowListViewAction, AXPShowListViewWorkflow, AXPTruncatedBreadcrumbComponent, AXPUpdateEntityCommand, AXPViewEntityDetailsCommand, AXP_CATEGORY_TREE_ROOT_TITLE_I18N_KEY, AXP_DATA_SEEDER_TOKEN, AXP_ENTITY_ACTION_PLUGIN, AXP_ENTITY_CONFIG_TOKEN, AXP_ENTITY_DEFINITION_LOADER, AXP_ENTITY_MODIFIER, AXP_ENTITY_STORAGE_BACKEND, AXP_ENTITY_STORAGE_MIDDLEWARE, AXP_MULTI_SOURCE_DEFINITION_PROVIDER, AXP_RECORD_WORKFLOW_INFO_CORRELATION_ID_FIELD, AXP_RECORD_WORKFLOW_INFO_DEFINITION_ID_FIELD, AXP_RECORD_WORKFLOW_INFO_INSTANCE_ID_FIELD, DEFAULT_COLUMN_ORDER, DEFAULT_PAIR_SPAN_RULES, DEFAULT_PROPERTY_ORDER, DEFAULT_SECTION_ORDER, ENTITY_LIST_ROUTE_CONTEXT_SESSION_KEY, EntityBuilder, EntityDataAccessor, actionExists, applyDataSourcePagingWithoutLoad, axpCreateEntityAiToolInputDefaults, axpCreateEntityCommandDefinition, buildAXPRecordWorkflowInfo, canPersistEntityListState, cloneLayoutArrays, collectEntityQuickSearchFieldPaths, collectNestedCreateHiddenProperties, collectNestedFieldPathsFromEntityColumns, collectQuickSearchPathsFromSingleEntityDefinition, columnOrderingMiddleware, columnOrderingMiddlewareProvider, columnWidthMiddleware, columnWidthMiddlewareProvider, computeEntityAggregates, createColumnOrderingMiddlewareProvider, createLayoutOrderingMiddlewareProvider, createModifierContext, defaultMultiLanguageMiddleware, defaultMultiLanguageMiddlewareProvider, detectEntityChanges, ensureLayoutPropertyView, ensureLayoutSection, ensureListActions, entityDetailsCreateActions, entityDetailsCreateActionsDeferredParent, entityDetailsCrudActions, entityDetailsEditAction, entityDetailsNewEditAction, entityDetailsReferenceCondition, entityDetailsReferenceCreateActions, entityDetailsSimpleCondition, entityMasterBulkDeleteAction, entityMasterCreateAction, entityMasterCrudActions, entityMasterDeleteAction, entityMasterEditAction, entityMasterRecordActions, entityMasterViewAction, entityOverrideDetailsViewAction, eventDispatchMiddleware, filterSortEntityRows, findEntityListRowDataInTree, formatLookupItemDisplay, getDataSourcePageIndex, getEntityListRowId, getMasterInterfacePropertySortKey, getRecordWorkflowCorrelationId, getRecordWorkflowInstanceId, isAXPMiddlewareAbortError, isCategoryEntity, isCategoryFilter, isUnresolvedLookupDisplayTemplate, layoutOrderingMiddlewareFactory, layoutOrderingMiddlewareProvider, mergeForeignKeyFieldIntoCreateActions, normalizeEntityListPersistenceMode, normalizeListPaging, normalizeLookupDisplayTemplate, provideEntity, resolveEntityPluginDetailPageOrder, resolveLookupDisplayField, resolveLookupDisplayTemplate, restoreEntityListExpandedRows, runEntityQuery, searchResultDescriptionMiddleware, searchResultDescriptionMiddlewareProvider, shouldLoadEntityListStateFromStorage, shouldResetEntityListStateOnRouteEntry };
+export { ATTACHMENTS_PAGE_COMPONENT_KEY, AXMEntityCrudService, AXMEntityCrudServiceImpl, AXPCategoryTreeService, AXPCreateEntityCommand, AXPCreateEntityWorkflow, AXPDataSeederService, AXPDeleteEntityWorkflow, AXPEditFileUploaderCommand, AXPEntitiesListDataSourceDefinition, AXPEntityApplyUpdatesAction, AXPEntityCategoryTreeSelectorComponent, AXPEntityCategoryWidget, AXPEntityCategoryWidgetColumnComponent, AXPEntityCategoryWidgetEditComponent, AXPEntityCategoryWidgetViewComponent, AXPEntityCommandTriggerViewModel, AXPEntityCreateEvent, AXPEntityCreatePopupAction, AXPEntityCreateSubmittedAction, AXPEntityCreateViewElementViewModel, AXPEntityCreateViewModelFactory, AXPEntityCreateViewSectionViewModel, AXPEntityDataProvider, AXPEntityDataProviderImpl, AXPEntityDataSelectorRowActionsService, AXPEntityDataSelectorService, AXPEntityDefinitionProviderWidget, AXPEntityDefinitionProviderWidgetEditComponent, AXPEntityDefinitionRegistryService, AXPEntityDeletedEvent, AXPEntityDetailListViewModel, AXPEntityDetailPopoverComponent, AXPEntityDetailPopoverService, AXPEntityDetailViewModelFactory, AXPEntityDetailViewModelResolver, AXPEntityEventDispatcherService, AXPEntityEventsKeys, AXPEntityFormBuilderService, AXPEntityListPersistenceModeDefault, AXPEntityListTableService, AXPEntityListToolbarService, AXPEntityListViewCardFieldViewModel, AXPEntityListViewColumnViewModel, AXPEntityListViewModelFactory, AXPEntityListViewModelResolver, AXPEntityListWidget, AXPEntityListWidgetViewComponent, AXPEntityMasterCreateViewModel, AXPEntityMasterListCardSelectActionName, AXPEntityMasterListViewModel, AXPEntityMasterListViewQueryViewModel, AXPEntityMasterSingleElementViewModel, AXPEntityMasterSingleViewGroupViewModel, AXPEntityMasterSingleViewModel, AXPEntityMasterUpdateElementViewModel, AXPEntityMasterUpdateViewModel, AXPEntityMasterUpdateViewModelFactory, AXPEntityMiddleware, AXPEntityModifyConfirmedAction, AXPEntityModifyEvent, AXPEntityModifySectionPopupAction, AXPEntityModule, AXPEntityPerformDeleteAction, AXPEntityPreloadFiltersContainerComponent, AXPEntityPreloadFiltersViewModel, AXPEntityPreloadFiltersViewModelResolver, AXPEntityResolver, AXPEntityService, AXPEntityStorageService, AXPEntityUpdateViewSectionViewModel, AXPFileListComponent, AXPFileUploaderLoadFilesQuery, AXPFileUploaderSaveFilesCommand, AXPFileUploaderWidget, AXPFileUploaderWidgetColumnComponent, AXPFileUploaderWidgetEditComponent, AXPFileUploaderWidgetService, AXPFileUploaderWidgetViewComponent, AXPGetEntityDetailsQuery, AXPLayoutOrderingConfigService, AXPLookupWidget, AXPLookupWidgetColumnComponent, AXPLookupWidgetEditComponent, AXPLookupWidgetViewComponent, AXPMiddlewareAbortError, AXPMiddlewareEntityStorageService, AXPModifyEntitySectionWorkflow, AXPMultiSourceDefinitionProviderContext, AXPMultiSourceDefinitionProviderService, AXPMultiSourceFederatedSearchService, AXPMultiSourceSelectorComponent, AXPMultiSourceSelectorService, AXPMultiSourceSelectorWidget, AXPMultiSourceSelectorWidgetColumnComponent, AXPMultiSourceSelectorWidgetEditComponent, AXPMultiSourceSelectorWidgetViewComponent, AXPMultiSourceType, AXPOpenEntityDetailsCommand, AXPQuickEntityModifyPopupAction, AXPQuickModifyEntityWorkflow, AXPRelatedColumnEnrichmentService, AXPRelatedColumnMetadataResolver, AXPSelectorStructureWidget, AXPSelectorStructureWidgetColumnComponent, AXPSelectorStructureWidgetEditComponent, AXPSelectorStructureWidgetViewComponent, AXPShowDetailViewAction, AXPShowDetailsViewWorkflow, AXPShowListViewAction, AXPShowListViewWorkflow, AXPTruncatedBreadcrumbComponent, AXPUpdateEntityCommand, AXPViewEntityDetailsCommand, AXP_CATEGORY_TREE_ROOT_TITLE_I18N_KEY, AXP_DATA_SEEDER_TOKEN, AXP_ENTITY_ACTION_PLUGIN, AXP_ENTITY_CONFIG_TOKEN, AXP_ENTITY_DEFINITION_LOADER, AXP_ENTITY_MODIFIER, AXP_ENTITY_STORAGE_BACKEND, AXP_ENTITY_STORAGE_MIDDLEWARE, AXP_MULTI_SOURCE_DEFINITION_PROVIDER, AXP_RECORD_WORKFLOW_INFO_CORRELATION_ID_FIELD, AXP_RECORD_WORKFLOW_INFO_DEFINITION_ID_FIELD, AXP_RECORD_WORKFLOW_INFO_INSTANCE_ID_FIELD, DEFAULT_COLUMN_ORDER, DEFAULT_PAIR_SPAN_RULES, DEFAULT_PROPERTY_ORDER, DEFAULT_SECTION_ORDER, ENTITY_LIST_ROUTE_CONTEXT_SESSION_KEY, EntityBuilder, EntityDataAccessor, actionExists, applyDataSourcePagingWithoutLoad, attachmentFieldCount, attachmentsPlugin, attachmentsSemanticallyEqual, axpCreateEntityAiToolInputDefaults, axpCreateEntityCommandDefinition, buildAXPRecordWorkflowInfo, canPersistEntityListState, cloneLayoutArrays, collectEntityQuickSearchFieldPaths, collectNestedCreateHiddenProperties, collectNestedFieldPathsFromEntityColumns, collectQuickSearchPathsFromSingleEntityDefinition, columnOrderingMiddleware, columnOrderingMiddlewareProvider, columnWidthMiddleware, columnWidthMiddlewareProvider, committedAttachments, computeEntityAggregates, createColumnOrderingMiddlewareProvider, createLayoutOrderingMiddlewareProvider, createModifierContext, defaultCardLayoutMiddleware, defaultCardLayoutMiddlewareProvider, defaultMultiLanguageMiddleware, defaultMultiLanguageMiddlewareProvider, detectEntityChanges, ensureLayoutPropertyView, ensureLayoutSection, ensureListActions, entityDetailsCreateActions, entityDetailsCreateActionsDeferredParent, entityDetailsCrudActions, entityDetailsEditAction, entityDetailsNewEditAction, entityDetailsReferenceCondition, entityDetailsReferenceCreateActions, entityDetailsSimpleCondition, entityMasterBulkDeleteAction, entityMasterCreateAction, entityMasterCrudActions, entityMasterDeleteAction, entityMasterEditAction, entityMasterRecordActions, entityMasterViewAction, entityOverrideDetailsViewAction, eventDispatchMiddleware, filterSortEntityRows, findEntityListRowDataInTree, fingerprintAttachmentItem, fingerprintAttachments, formatLookupItemDisplay, getDataSourcePageIndex, getEntityListRowId, getMasterInterfacePropertySortKey, getRecordWorkflowCorrelationId, getRecordWorkflowInstanceId, hasFileUploaderTitleOrDescriptionFields, isAXPMiddlewareAbortError, isAttachmentListEntry, isCategoryEntity, isCategoryFilter, isFileListItem, isFileUploaderEditDialogAuto, isLegacyEntityDataSelectorOptions, isUnresolvedLookupDisplayTemplate, layoutOrderingMiddlewareFactory, layoutOrderingMiddlewareProvider, mapLegacyEntityDataSelectorOptions, mergeForeignKeyFieldIntoCreateActions, normalizeEntityDataSelectorOptions, normalizeEntityFieldToFileList, normalizeEntityListPersistenceMode, normalizeListPaging, normalizeLookupDisplayTemplate, persistedAttachments, provideEntity, resolveEntityPluginDetailPageOrder, resolveFileUploaderEditDialog, resolveFileUploaderEntityScope, resolveLookupDisplayField, resolveLookupDisplayTemplate, restoreEntityListExpandedRows, runEntityQuery, searchResultDescriptionMiddleware, searchResultDescriptionMiddlewareProvider, shouldLoadEntityListStateFromStorage, shouldResetEntityListStateOnRouteEntry };
 //# sourceMappingURL=acorex-platform-layout-entity.mjs.map