@acorex/platform 20.2.3 → 20.2.4-next.0

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

@@ -1,16 +1,16 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injectable, computed, signal, Injector, EnvironmentInjector, runInInjectionContext, makeEnvironmentProviders, effect, HostBinding, ChangeDetectionStrategy, Component, viewChild, ViewChild, NgModule } from '@angular/core';
+import { InjectionToken, inject, Injectable, computed, signal, Injector, EnvironmentInjector, runInInjectionContext, viewChild, viewChildren, untracked, ChangeDetectionStrategy, Component, effect, HostBinding, ViewChild, NgModule } from '@angular/core';
 import { castArray, get, cloneDeep, set, merge, isNil, isEmpty, sortBy } from 'lodash-es';
 import * as i1$2 from '@acorex/cdk/common';
 import { AXDataSource, AXCommonModule } from '@acorex/cdk/common';
 import { AXFormatService } from '@acorex/core/format';
-import { resolveActionLook, AXPFilterOperatorMiddlewareService, AXPEntityCommandScope, getEntityInfo, AXPSettingService, AXPRefreshEvent, AXPLockService, AXPCleanNestedFilters, AXPWorkflowNavigateAction, AXPToastAction, AXP_SEARCH_DEFINITION_PROVIDER } from '@acorex/platform/common';
+import { resolveActionLook, AXPFilterOperatorMiddlewareService, AXPEntityCommandScope, getEntityInfo, AXPSettingService, AXPRefreshEvent, AXPReloadEvent, AXPCleanNestedFilters, AXPWorkflowNavigateAction, AXPToastAction, AXP_SEARCH_DEFINITION_PROVIDER } from '@acorex/platform/common';
 import * as i1$4 from '@acorex/platform/core';
-import { AXPExpressionEvaluatorService, AXPPlatformScope, extractValue, setSmart } from '@acorex/platform/core';
+import { AXPExpressionEvaluatorService, AXPPlatformScope, AXPDistributedEventListenerService, getSmart, getChangedPaths, extractValue, setSmart } from '@acorex/platform/core';
 import * as i2$2 from '@acorex/platform/workflow';
 import { AXPWorkflowService, ofType, createWorkFlowEvent, AXPWorkflowAction, AXPWorkflowModule } from '@acorex/platform/workflow';
-import * as i6 from '@acorex/platform/layout/builder';
-import { AXPPageStatus, AXPWidgetRegistryService, AXPValueWidgetComponent, AXPLayoutBuilderModule, AXPColumnWidgetComponent, AXPWidgetsCatalog, AXPWidgetGroupEnum, AXP_WIDGETS_EDITOR_CATEGORY, AXPLayoutWidgetComponent } from '@acorex/platform/layout/builder';
+import * as i2 from '@acorex/platform/layout/builder';
+import { AXPPageStatus, AXPWidgetRegistryService, AXPWidgetsCatalog, AXPValueWidgetComponent, AXPWidgetRendererDirective, AXPLayoutBuilderModule, AXPWidgetGroupEnum, AXPLayoutWidgetComponent, AXPColumnWidgetComponent, AXP_WIDGETS_EDITOR_CATEGORY } from '@acorex/platform/layout/builder';
 import { AXPLayoutThemeService } from '@acorex/platform/themes/shared';
 import { AXPSessionService, AXPAuthGuard } from '@acorex/platform/auth';
 import { Subject, takeUntil } from 'rxjs';
@@ -21,35 +21,38 @@ import { AXLoadingDialogService } from '@acorex/components/loading-dialog';
 import { AXPopupService } from '@acorex/components/popup';
 import { AXPlatform } from '@acorex/core/platform';
 import { RouterModule, ROUTES } from '@angular/router';
-import * as i1 from '@acorex/components/loading';
-import { AXLoadingModule } from '@acorex/components/loading';
-import * as i1$1 from '@acorex/components/badge';
-import { AXBadgeModule } from '@acorex/components/badge';
-import * as i2 from '@acorex/components/button';
+import * as i3$1 from '@acorex/components/button';
 import { AXButtonModule } from '@acorex/components/button';
 import * as i3 from '@acorex/components/decorators';
 import { AXDecoratorModule } from '@acorex/components/decorators';
-import * as i5$1 from '@acorex/components/form';
-import { AXFormModule } from '@acorex/components/form';
-import * as i6$1 from '@acorex/components/tag-box';
-import { AXTagBoxComponent, AXTagBoxModule } from '@acorex/components/tag-box';
-import { AXValidationModule } from '@acorex/core/validation';
+import * as i4 from '@acorex/components/dropdown';
+import { AXDropdownModule } from '@acorex/components/dropdown';
 import * as i7 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import { AXP_NAME_PROPERTY, AXP_DATA_PATH_PROPERTY, AXP_DISABLED_PROPERTY, AXP_ALLOW_CLEAR_PROPERTY, AXP_DATA_PROPERTY_GROUP, AXP_ALLOW_MULTIPLE_PROPERTY, AXPFileUploaderWidgetService } from '@acorex/platform/widgets';
 import * as i1$3 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
-import * as i4 from '@acorex/components/data-table';
-import { AXDataTableModule } from '@acorex/components/data-table';
-import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
-import { AXBasePageComponent } from '@acorex/components/page';
+import * as i1 from '@acorex/components/loading';
+import { AXLoadingModule } from '@acorex/components/loading';
+import * as i1$1 from '@acorex/components/badge';
+import { AXBadgeModule } from '@acorex/components/badge';
+import * as i5$1 from '@acorex/components/form';
+import { AXFormModule } from '@acorex/components/form';
 import * as i5 from '@acorex/components/search-box';
 import { AXSearchBoxModule, AXSearchBoxComponent } from '@acorex/components/search-box';
 import * as i7$1 from '@acorex/components/select-box';
 import { AXSelectBoxModule } from '@acorex/components/select-box';
-import { AXP_DISABLED_PROPERTY, AXP_DATA_PATH_PROPERTY, AXP_DATA_PROPERTY_GROUP, AXP_ALLOW_MULTIPLE_PROPERTY, AXP_NAME_PROPERTY, AXPFileUploaderWidgetService } from '@acorex/platform/widgets';
+import * as i6 from '@acorex/components/tag-box';
+import { AXTagBoxComponent, AXTagBoxModule } from '@acorex/components/tag-box';
+import { AXValidationModule } from '@acorex/core/validation';
+import * as i4$1 from '@acorex/components/data-table';
+import { AXDataTableModule } from '@acorex/components/data-table';
+import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
+import { AXBasePageComponent } from '@acorex/components/page';
 import * as i2$1 from '@acorex/components/text-box';
 import { AXTextBoxModule, AXTextBoxComponent } from '@acorex/components/text-box';
 import { AXPWidgetPropertyViewerComponent } from '@acorex/platform/layout/designer';
+import { transform, isEqual } from 'lodash';
 
 const AXP_DATA_SEEDER_TOKEN = new InjectionToken('AXP_DATA_SEEDER_TOKEN');
 class AXPDataSeederService {
@@ -576,25 +579,97 @@ function createModifierContext(entity) {
 
 const AXP_ENTITY_MODIFIER = new InjectionToken('AXP_ENTITY_MODIFIER');
 
+function ensureListActions(ctx) {
+    ctx.interfaces.update((i) => {
+        const next = i ?? {};
+        next.master = next.master ?? {};
+        next.master.list = next.master.list ?? { actions: [], views: [] };
+        next.master.list.actions = next.master.list.actions ?? [];
+        return next;
+    });
+}
+function actionExists(actions, commandName, name) {
+    if (!actions)
+        return false;
+    return actions.some((a) => {
+        const cmd = typeof a.command === 'object' ? a.command?.name : a.command;
+        if (name && a.name) {
+            return a.name === name;
+        }
+        return cmd === commandName;
+    });
+}
+
+const AXP_ENTITY_ACTION_PLUGIN = new InjectionToken('AXP_ENTITY_ACTION_PLUGIN');
+
 class AXPEntityMiddleware {
+    //#endregion
+    //#region ----   Constructor   ----
     constructor() {
-        this.modifiers = new Map();
+        //#region ----   Fields   ----
+        this.exactModifiers = new Map();
+        this.patternModifiers = [];
         this.providedModifiers = inject(AXP_ENTITY_MODIFIER, { optional: true }) || [];
+        this.providedActionPlugins = inject(AXP_ENTITY_ACTION_PLUGIN, { optional: true }) || [];
         for (const { entityName, modifier } of this.providedModifiers) {
             this.register(entityName, modifier);
         }
     }
+    //#endregion
+    //#region ----   Registration Methods   ----
     register(entityName, modifier) {
-        this.modifiers.set(entityName, modifier);
+        if (entityName instanceof RegExp) {
+            this.patternModifiers.push({ pattern: this.normalizeRegExp(entityName), modifier });
+            return;
+        }
+        if (entityName.includes('*')) {
+            const pattern = this.wildcardToRegExp(entityName);
+            this.patternModifiers.push({ pattern, modifier });
+            return;
+        }
+        this.exactModifiers.set(entityName, modifier);
     }
+    //#endregion
+    //#region ----   Processing   ----
     process(entity) {
-        const modifier = this.modifiers.get(entity.name);
-        if (!modifier)
-            return entity;
+        // First, expand action plugins if entity.plugins exists
         const context = createModifierContext(entity);
+        const plugins = entity.plugins;
+        if (plugins && plugins.length) {
+            const sorted = [...this.providedActionPlugins].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+            for (const p of plugins) {
+                const contrib = sorted.find((x) => x.name === p.name);
+                if (contrib) {
+                    try {
+                        contrib.apply(context, p.options);
+                    }
+                    catch (err) {
+                        console.error('[AXPEntityMiddleware] action plugin failed:', p.name, err);
+                    }
+                }
+            }
+        }
+        // Then apply entity-specific modifiers
+        // Exact match first
+        const exact = this.exactModifiers.get(entity.name);
+        const modifier = exact ?? this.patternModifiers.find((x) => x.pattern.test(entity.name))?.modifier;
+        if (!modifier) {
+            return context.toEntity();
+        }
         modifier(context);
         return context.toEntity();
     }
+    //#endregion
+    //#region ----   Helpers   ----
+    wildcardToRegExp(pattern) {
+        const escaped = pattern.replace(/[.+?^${}()|\[\]\\]/g, '\\$&');
+        const regexStr = `^${escaped.replace(/\*/g, '.*')}$`;
+        return new RegExp(regexStr);
+    }
+    normalizeRegExp(rx) {
+        const flags = rx.flags.replace('g', '');
+        return new RegExp(rx.source, flags);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityMiddleware, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityMiddleware, providedIn: 'root' }); }
 }
@@ -778,6 +853,7 @@ class AXPEntityCreateViewElementViewModel {
                 children: widget.children,
                 formula: widget.formula,
                 triggers: widget.triggers,
+                defaultValue: schema.defaultValue,
                 valueTransforms: widget.valueTransforms,
                 options: merge(schema.interface?.options, {
                     validations: this.property.validations?.map((c) => ({ rule: c.rule, message: c.message, options: c.options })),
@@ -820,22 +896,6 @@ class AXPEntityMasterCreateViewModel {
                 },
             },
         };
-        const processDefault = async (value) => {
-            if (typeof value == 'function') {
-                return value();
-            }
-            else if (typeof value == 'string' && value.startsWith('{{')) {
-                return await this.expressionEvaluator.evaluate(value, scope);
-            }
-            return value;
-        };
-        this.config.properties
-            .filter((c) => !isNil(c.schema.defaultValue))
-            .forEach(async (p) => {
-            const value = await processDefault(p.schema.defaultValue);
-            set(initialData, p.name, value);
-        });
-        //
         this.context.set(initialData);
         this.options.set(commandOptions);
         //
@@ -1048,7 +1108,7 @@ class AXPEntityMasterListViewModel {
             return await this.expressionEvaluator.evaluate(options, scope);
         };
         this.workflow.events$
-            .pipe(ofType(AXPRefreshEvent))
+            .pipe(ofType(AXPRefreshEvent, AXPReloadEvent))
             .pipe(takeUntil(this.destroyed))
             .subscribe((event) => {
             if (event.payload.entity == getEntityInfo(this.entityDef).source) {
@@ -1596,7 +1656,6 @@ class AXPEntityMasterUpdateViewModel {
         this.props = props;
         this.entityDef = cloneDeep(this.config);
         this.workflow = this.injector.get(AXPWorkflowService);
-        this.lockService = this.injector.get(AXPLockService);
         this.sessionService = this.injector.get(AXPSessionService);
         this.isInProgress = signal(false, ...(ngDevMode ? [{ debugName: "isInProgress" }] : []));
         this.context = signal(cloneDeep(this.entityData), ...(ngDevMode ? [{ debugName: "context" }] : []));
@@ -1606,19 +1665,6 @@ class AXPEntityMasterUpdateViewModel {
                 return new AXPEntityMasterUpdateElementViewModel(this.entityDef, e);
             });
         }, ...(ngDevMode ? [{ debugName: "elements" }] : []));
-        // Lock the record on creation
-        if (this.entityId) {
-            this.lockService.lock({
-                refId: this.entityId,
-                refType: `${this.moduleName}.${this.entityName}`,
-                type: 'user',
-                date: new Date().toISOString(),
-                lockedBy: {
-                    id: this.sessionService.user?.id ?? 'system',
-                    type: 'oidc.users',
-                },
-            });
-        }
     }
     async save() {
         this.isInProgress.set(true);
@@ -1643,15 +1689,6 @@ class AXPEntityMasterUpdateViewModel {
     reset() {
         this.context.set(cloneDeep(this.entityData));
     }
-    async unlock() {
-        if (this.entityId) {
-            await this.lockService.unlock({
-                refId: this.entityId,
-                refType: `${this.moduleName}.${this.entityName}`,
-                type: 'user',
-            });
-        }
-    }
 }
 class AXPEntityMasterUpdateViewModelFactory {
     constructor() {
@@ -2030,6 +2067,9 @@ const AXPEntityDetailViewModelResolver = (route, state, service = inject(AXPEnti
     return service.create(moduleName, entityName, id);
 };
 
+const AXP_ENTITY_STORAGE_BACKEND = new InjectionToken('AXP_ENTITY_STORAGE_BACKEND');
+const AXP_ENTITY_STORAGE_MIDDLEWARE = new InjectionToken('AXP_ENTITY_STORAGE_MIDDLEWARE');
+
 class AXPEntityStorageService {
 }
 class AXPEntityDataProvider {
@@ -2153,734 +2193,689 @@ class AXMEntityCrudServiceImpl {
     }
 }
 
-/**
- * Compose entity storage middlewares into a pipeline
- */
-function composeEntityStorageMiddlewares(middlewares) {
-    return (handler) => {
-        let composed = handler;
-        // Reverse order composition for proper middleware chain
-        for (let i = middlewares.length - 1; i >= 0; i--) {
-            const mw = middlewares[i];
-            const next = composed;
-            composed = (context) => mw(context, next);
-        }
-        return composed;
-    };
-}
-/**
- * Helper function to generate unique request ID
- */
-function generateRequestId() {
-    return `req_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
-}
-
-/**
- * Registry for managing entity storage middlewares
- */
-class AXPEntityStorageRegistry {
+class AXPMiddlewareEntityStorageService extends AXPEntityStorageService {
     constructor() {
-        this.globalMiddlewares = [];
-        this.entitySpecificMiddlewares = new Map();
-        this.operationSpecificMiddlewares = new Map();
-    }
-    /**
-     * Add a global middleware that applies to all operations
-     */
-    useGlobal(middleware) {
-        this.globalMiddlewares.push(middleware);
-    }
-    /**
-     * Add middleware for specific entity
-     */
-    useForEntity(entityName, middleware) {
-        if (!this.entitySpecificMiddlewares.has(entityName)) {
-            this.entitySpecificMiddlewares.set(entityName, []);
-        }
-        this.entitySpecificMiddlewares.get(entityName).push(middleware);
-    }
-    /**
-     * Add middleware for specific operation (getOne, insertOne, etc.)
-     */
-    useForOperation(operation, middleware) {
-        if (!this.operationSpecificMiddlewares.has(operation)) {
-            this.operationSpecificMiddlewares.set(operation, []);
-        }
-        this.operationSpecificMiddlewares.get(operation).push(middleware);
-    }
-    /**
-     * Get all applicable middlewares for a given context
-     */
-    getMiddlewares(entityName, operation) {
-        const middlewares = [];
-        // Add global middlewares
-        middlewares.push(...this.globalMiddlewares);
-        // Add entity-specific middlewares
-        const entityMiddlewares = this.entitySpecificMiddlewares.get(entityName);
-        if (entityMiddlewares) {
-            middlewares.push(...entityMiddlewares);
-        }
-        // Add operation-specific middlewares
-        const operationMiddlewares = this.operationSpecificMiddlewares.get(operation);
-        if (operationMiddlewares) {
-            middlewares.push(...operationMiddlewares);
-        }
-        return middlewares;
-    }
-    /**
-     * Get all global middlewares
-     */
-    getGlobalMiddlewares() {
-        return [...this.globalMiddlewares];
-    }
-    /**
-     * Remove middleware from global middlewares
-     */
-    removeGlobalMiddleware(middleware) {
-        const index = this.globalMiddlewares.indexOf(middleware);
-        if (index > -1) {
-            this.globalMiddlewares.splice(index, 1);
-            return true;
-        }
-        return false;
-    }
-    /**
-     * Clear all middlewares
-     */
-    clear() {
-        this.globalMiddlewares.length = 0;
-        this.entitySpecificMiddlewares.clear();
-        this.operationSpecificMiddlewares.clear();
-    }
-    /**
-     * Get registered entity names that have specific middlewares
-     */
-    getRegisteredEntityNames() {
-        return Array.from(this.entitySpecificMiddlewares.keys());
-    }
-    /**
-     * Get registered operation names that have specific middlewares
-     */
-    getRegisteredOperations() {
-        return Array.from(this.operationSpecificMiddlewares.keys());
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageRegistry, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageRegistry, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageRegistry, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-/**
- * Executor that wraps entity storage operations with middleware pipeline
- */
-class AXPEntityStorageExecutor {
-    constructor(storageService) {
-        this.storageService = storageService;
+        super(...arguments);
+        this.backend = inject(AXP_ENTITY_STORAGE_BACKEND);
+        this.allMiddlewares = (inject(AXP_ENTITY_STORAGE_MIDDLEWARE, { optional: true }) || []).slice();
         this.injector = inject(EnvironmentInjector);
-        this.registry = inject(AXPEntityStorageRegistry);
-    }
-    /**
-     * Execute getOne operation with middleware pipeline
-     */
-    async getOne(entityName, id) {
-        const context = {
-            operation: 'getOne',
-            entityName,
-            dbName: this.storageService.dbName,
-            input: { id },
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
-            },
-        };
-        const handler = async (ctx) => {
-            return this.storageService.getOne(ctx.entityName, ctx.input.id);
-        };
-        return this.executeWithMiddleware(context, handler);
-    }
-    /**
-     * Execute getAll operation with middleware pipeline
-     */
-    async getAll(entityName) {
-        const context = {
-            operation: 'getAll',
-            entityName,
-            dbName: this.storageService.dbName,
-            input: {},
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
-            },
-        };
-        const handler = async (ctx) => {
-            return this.storageService.getAll(ctx.entityName);
-        };
-        return this.executeWithMiddleware(context, handler);
-    }
-    /**
-     * Execute insertOne operation with middleware pipeline
-     */
-    async insertOne(entityName, entity) {
-        const context = {
-            operation: 'insertOne',
-            entityName,
-            dbName: this.storageService.dbName,
-            input: { entity },
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
-            },
-        };
-        const handler = async (ctx) => {
-            return this.storageService.insertOne(ctx.entityName, ctx.input.entity);
-        };
-        return this.executeWithMiddleware(context, handler);
-    }
-    /**
-     * Execute updateOne operation with middleware pipeline
-     */
-    async updateOne(entityName, id, keyValues) {
-        const context = {
-            operation: 'updateOne',
-            entityName,
-            dbName: this.storageService.dbName,
-            input: { id, keyValues },
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
-            },
-        };
-        const handler = async (ctx) => {
-            return this.storageService.updateOne(ctx.entityName, ctx.input.id, ctx.input.keyValues);
-        };
-        return this.executeWithMiddleware(context, handler);
-    }
-    /**
-     * Execute deleteOne operation with middleware pipeline
-     */
-    async deleteOne(entityName, id) {
-        const context = {
-            operation: 'deleteOne',
-            entityName,
-            dbName: this.storageService.dbName,
-            input: { id },
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
-            },
-        };
-        const handler = async (ctx) => {
-            return this.storageService.deleteOne(ctx.entityName, ctx.input.id);
-        };
-        return this.executeWithMiddleware(context, handler);
-    }
-    /**
-     * Execute query operation with middleware pipeline
-     */
-    async query(entityName, request) {
-        const context = {
-            operation: 'query',
-            entityName,
-            dbName: this.storageService.dbName,
-            input: { request },
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
-            },
-        };
-        const handler = async (ctx) => {
-            return this.storageService.query(ctx.entityName, ctx.input.request);
-        };
-        return this.executeWithMiddleware(context, handler);
     }
-    /**
-     * Execute initial operation with middleware pipeline
-     */
-    async initial(entityName, collection, options) {
-        const context = {
-            operation: 'initial',
+    get dbName() {
+        return this.backend.dbName;
+    }
+    filterMiddlewares(ctx) {
+        return this.allMiddlewares
+            .filter((mw) => {
+            const t = mw.target;
+            if (!t)
+                return true;
+            if (t.ops && !t.ops.includes(ctx.op))
+                return false;
+            if (t.entity) {
+                if (typeof t.entity === 'string' && t.entity !== ctx.entityName)
+                    return false;
+                if (t.entity instanceof RegExp && !t.entity.test(ctx.entityName))
+                    return false;
+            }
+            if (t.predicate && !t.predicate(ctx))
+                return false;
+            return true;
+        })
+            .sort((a, b) => (a.target?.order ?? 0) - (b.target?.order ?? 0));
+    }
+    compose(mws, leaf, ctx) {
+        return mws
+            .slice()
+            .reverse()
+            .reduce((next, mw) => {
+            return async () => runInInjectionContext(this.injector, () => mw.execute(ctx, next));
+        }, leaf);
+    }
+    async run(ctx, delegate) {
+        const chain = this.compose(this.filterMiddlewares(ctx), async () => {
+            ctx.result = await delegate();
+        }, ctx);
+        await chain();
+        return ctx.result;
+    }
+    createCtx(op, entityName, init) {
+        return {
+            op,
             entityName,
-            dbName: this.storageService.dbName,
-            input: { collection, options },
-            metadata: {
-                startTime: Date.now(),
-                requestId: generateRequestId(),
+            locals: new Map(),
+            backend: {
+                getOneRaw: (name, id) => this.backend.getOne(name, id),
+                insertOneRaw: (name, e) => this.backend.insertOne(name, e),
             },
+            ...init,
         };
-        const handler = async (ctx) => {
-            return this.storageService.initial(ctx.entityName, ctx.input.collection, ctx.input.options);
-        };
-        return this.executeWithMiddleware(context, handler);
-    }
-    /**
-     * Execute operation with middleware pipeline
-     */
-    async executeWithMiddleware(context, handler) {
-        const middlewares = this.registry.getMiddlewares(context.entityName, context.operation);
-        // Wrap middlewares with injection context
-        const wrappedMiddlewares = middlewares.map(middleware => {
-            return (ctx, next) => runInInjectionContext(this.injector, () => middleware(ctx, next));
-        });
-        const composed = composeEntityStorageMiddlewares(wrappedMiddlewares)(handler);
-        return composed(context);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageExecutor, deps: [{ token: AXPEntityStorageService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageExecutor, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageExecutor, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: AXPEntityStorageService }] });
-
-/**
- * Entity Storage Service with middleware support
- *
- * This service wraps the original AXPEntityStorageService and adds middleware pipeline support.
- * It delegates all operations to the middleware executor which applies the middleware chain.
- */
-class AXPEntityStorageWithMiddlewareService extends AXPEntityStorageService {
-    constructor(originalStorageService, registry) {
-        super();
-        this.originalStorageService = originalStorageService;
-        this.registry = registry;
-        this.executor = new AXPEntityStorageExecutor(originalStorageService);
-    }
-    get dbName() {
-        return this.originalStorageService.dbName;
-    }
-    // Middleware Management Methods
-    /**
-     * Add a global middleware that applies to all operations
-     */
-    useGlobal(middleware) {
-        this.registry.useGlobal(middleware);
     }
-    /**
-     * Add middleware for specific entity
-     */
-    useForEntity(entityName, middleware) {
-        this.registry.useForEntity(entityName, middleware);
-    }
-    /**
-     * Add middleware for specific operation
-     */
-    useForOperation(operation, middleware) {
-        this.registry.useForOperation(operation, middleware);
-    }
-    // Storage Operations with Middleware Pipeline
     async initial(entityName, collection, options) {
-        return this.executor.initial(entityName, collection, options);
+        const ctx = this.createCtx('initial', entityName, { data: collection });
+        return this.run(ctx, () => this.backend.initial(entityName, ctx.data, options));
     }
     async getOne(entityName, id) {
-        return this.executor.getOne(entityName, id);
+        const ctx = this.createCtx('getOne', entityName, { id });
+        return this.run(ctx, () => this.backend.getOne(entityName, id));
     }
     async updateOne(entityName, id, keyValues) {
-        return this.executor.updateOne(entityName, id, keyValues);
+        const ctx = this.createCtx('update', entityName, { id, data: keyValues });
+        return this.run(ctx, () => this.backend.updateOne(entityName, id, ctx.data));
     }
     async deleteOne(entityName, id) {
-        return this.executor.deleteOne(entityName, id);
+        const ctx = this.createCtx('delete', entityName, { id });
+        return this.run(ctx, () => this.backend.deleteOne(entityName, id));
     }
     async insertOne(entityName, entity) {
-        return this.executor.insertOne(entityName, entity);
+        const ctx = this.createCtx('create', entityName, { data: entity });
+        return this.run(ctx, () => this.backend.insertOne(entityName, ctx.data));
     }
     async getAll(entityName) {
-        return this.executor.getAll(entityName);
+        const ctx = this.createCtx('getAll', entityName);
+        return this.run(ctx, () => this.backend.getAll(entityName));
     }
     async query(entityName, request) {
-        return this.executor.query(entityName, request);
-    }
-    // Direct access to original service (bypass middleware)
-    get originalService() {
-        return this.originalStorageService;
-    }
-    // Access to registry for advanced middleware management
-    get middlewareRegistry() {
-        return this.registry;
+        const ctx = this.createCtx('query', entityName, { request });
+        return this.run(ctx, () => this.backend.query(entityName, request));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageWithMiddlewareService, deps: [{ token: AXPEntityStorageService }, { token: AXPEntityStorageRegistry }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageWithMiddlewareService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPMiddlewareEntityStorageService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPMiddlewareEntityStorageService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityStorageWithMiddlewareService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPMiddlewareEntityStorageService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: AXPEntityStorageService }, { type: AXPEntityStorageRegistry }] });
-
-/**
- * Injection token for entity storage middleware setup
- */
-const AXP_ENTITY_STORAGE_MIDDLEWARE_SETUP = new InjectionToken('AXP_ENTITY_STORAGE_MIDDLEWARE_SETUP');
-/**
- * Injection token for entity storage middleware extensions
- */
-const AXP_ENTITY_STORAGE_EXTENSION = new InjectionToken('AXP_ENTITY_STORAGE_EXTENSION');
-/**
- * Provide entity storage middleware configuration
- */
-function provideEntityStorageMiddleware(config) {
-    const providers = [];
-    // Register extension middlewares
-    if (config.extensions) {
-        providers.push(...config.extensions.map(ext => ({
-            provide: AXP_ENTITY_STORAGE_EXTENSION,
-            useValue: ext,
-            multi: true,
-        })));
-    }
-    // Main setup provider
-    providers.push({
-        provide: AXP_ENTITY_STORAGE_MIDDLEWARE_SETUP,
-        useFactory: () => {
-            const registry = inject(AXPEntityStorageRegistry);
-            // Register global middlewares
-            if (config.global) {
-                for (const middleware of config.global) {
-                    registry.useGlobal(middleware);
-                }
-            }
-            // Register entity-specific middlewares
-            if (config.entities) {
-                for (const [entityName, middlewares] of Object.entries(config.entities)) {
-                    for (const middleware of middlewares) {
-                        registry.useForEntity(entityName, middleware);
-                    }
-                }
-            }
-            // Register operation-specific middlewares
-            if (config.operations) {
-                for (const [operation, middlewares] of Object.entries(config.operations)) {
-                    for (const middleware of middlewares) {
-                        registry.useForOperation(operation, middleware);
-                    }
-                }
-            }
-            return true;
-        },
-        multi: true,
-    });
-    return makeEnvironmentProviders(providers);
-}
-/**
- * Simplified provider for global middleware only
- */
-function provideGlobalEntityStorageMiddleware(middlewares) {
-    return provideEntityStorageMiddleware({ global: middlewares });
-}
-/**
- * Provider for entity-specific middlewares
- */
-function provideEntitySpecificMiddleware(entityName, middlewares) {
-    return provideEntityStorageMiddleware({
-        entities: { [entityName]: middlewares }
-    });
-}
-/**
- * Provider for operation-specific middlewares
- */
-function provideOperationSpecificMiddleware(operation, middlewares) {
-    return provideEntityStorageMiddleware({
-        operations: { [operation]: middlewares }
-    });
-}
+        }] });
 
 /**
- * Logging middleware for entity storage operations
+ * Entity Event Dispatcher - A wrapper for entity-specific events
+ * Handles pattern-based dispatching for entity operations with wildcard support
  */
-const loggingMiddleware = async (context, next) => {
-    const startTime = Date.now();
-    console.group(`🔄 Entity Storage Operation: ${context.operation}`);
-    console.log('📋 Entity:', context.entityName);
-    console.log('🗄️ Database:', context.dbName);
-    console.log('📨 Input:', context.input);
-    console.log('🆔 Request ID:', context.metadata.requestId);
-    try {
-        const result = await next(context);
-        const duration = Date.now() - startTime;
-        console.log('✅ Success');
-        console.log('⏱️ Duration:', `${duration}ms`);
-        console.log('📤 Result:', result);
-        console.groupEnd();
-        return result;
-    }
-    catch (error) {
-        const duration = Date.now() - startTime;
-        console.error('❌ Error');
-        console.error('⏱️ Duration:', `${duration}ms`);
-        console.error('💥 Error:', error);
-        console.groupEnd();
-        throw error;
+class AXPEntityEventDispatcherService {
+    constructor() {
+        this.eventService = inject(AXPDistributedEventListenerService);
     }
-};
-/**
- * Performance monitoring middleware
- */
-const performanceMiddleware = async (context, next) => {
-    const startTime = performance.now();
-    try {
-        const result = await next(context);
-        const duration = performance.now() - startTime;
-        // Log slow operations (> 1000ms)
-        if (duration > 1000) {
-            console.warn(`⚠️ Slow operation detected: ${context.operation} on ${context.entityName} took ${duration.toFixed(2)}ms`);
-        }
-        // Add performance metrics to context
-        context.metadata['performanceMetrics'] = {
-            duration,
-            operation: context.operation,
-            entityName: context.entityName,
+    async dispatchEntityEvent(operation, entityName, data) {
+        const enhancedData = {
+            ...data,
+            entityName,
+            operation,
+            timestamp: new Date(),
+            source: 'entity-dispatcher',
         };
-        return result;
-    }
-    catch (error) {
-        const duration = performance.now() - startTime;
-        console.error(`❌ Failed operation: ${context.operation} on ${context.entityName} failed after ${duration.toFixed(2)}ms`);
-        throw error;
-    }
-};
-/**
- * Error handling middleware with retry logic
- */
-const errorHandlingMiddleware = async (context, next) => {
-    const maxRetries = 3;
-    let attempt = 0;
-    while (attempt < maxRetries) {
-        try {
-            const result = await next(context);
-            if (attempt > 0) {
-                console.log(`✅ Operation succeeded on retry ${attempt}/${maxRetries}`);
-            }
-            return result;
-        }
-        catch (error) {
-            attempt++;
-            // Don't retry for certain operations or error types
-            if (context.operation === 'deleteOne' ||
-                error?.code === 'VALIDATION_ERROR' ||
-                attempt >= maxRetries) {
-                console.error(`❌ Operation failed after ${attempt} attempts:`, error);
-                throw error;
+        const eventKeysToDispatch = await this.getAllMatchingEventKeys(operation, entityName);
+        const dispatchPromises = eventKeysToDispatch.map((key) => this.eventService.dispatch(key, enhancedData));
+        await Promise.all(dispatchPromises);
+    }
+    async getAllMatchingEventKeys(operation, entityName) {
+        const eventKeys = new Set();
+        const exactKeys = this.generateEventKeys(operation, entityName);
+        exactKeys.forEach((key) => eventKeys.add(key));
+        const wildcardKeys = await this.findMatchingWildcardKeys(operation, entityName);
+        wildcardKeys.forEach((key) => eventKeys.add(key));
+        return Array.from(eventKeys);
+    }
+    async findMatchingWildcardKeys(operation, entityName) {
+        const matchingKeys = [];
+        const allListenerKeys = await this.eventService.getRegisteredKeys();
+        const actualEventKey = `entity.${operation}.${entityName}`;
+        for (const listenerKey of allListenerKeys) {
+            if (listenerKey.includes('*') && this.matchesEntityPattern(actualEventKey, listenerKey)) {
+                matchingKeys.push(listenerKey);
             }
-            console.warn(`⚠️ Attempt ${attempt}/${maxRetries} failed, retrying...`, error.message);
-            // Wait before retry (exponential backoff)
-            await new Promise(resolve => setTimeout(resolve, Math.pow(2, attempt) * 1000));
         }
+        return matchingKeys;
     }
-    throw new Error('Max retries exceeded');
-};
-/**
- * Validation middleware
- */
-const validationMiddleware = async (context, next) => {
-    // Validate input based on operation
-    switch (context.operation) {
-        case 'insertOne':
-            if (!context.input.entity) {
-                throw new Error('Entity is required for insertOne operation');
-            }
-            break;
-        case 'updateOne':
-            if (!context.input.id) {
-                throw new Error('ID is required for updateOne operation');
-            }
-            if (!context.input.keyValues) {
-                throw new Error('Key values are required for updateOne operation');
-            }
-            break;
-        case 'deleteOne':
-        case 'getOne':
-            if (!context.input.id) {
-                throw new Error(`ID is required for ${context.operation} operation`);
-            }
-            break;
-        case 'query':
-            if (!context.input.request) {
-                throw new Error('Request is required for query operation');
-            }
-            break;
-        case 'initial':
-            if (!context.input.collection || !Array.isArray(context.input.collection)) {
-                throw new Error('Collection array is required for initial operation');
-            }
-            break;
-    }
-    return next(context);
-};
-/**
- * Caching middleware (simple in-memory cache)
- */
-const cachingMiddleware = (() => {
-    const cache = new Map();
-    const DEFAULT_TTL = 5 * 60 * 1000; // 5 minutes
-    return async (context, next) => {
-        // Only cache read operations
-        if (!['getOne', 'getAll', 'query'].includes(context.operation)) {
-            // Clear cache for write operations on the same entity
-            const keysToDelete = Array.from(cache.keys()).filter(key => key.includes(`${context.entityName}:`));
-            keysToDelete.forEach(key => cache.delete(key));
-            return next(context);
+    matchesEntityPattern(eventKey, pattern) {
+        if (!pattern.startsWith('entity.') || !pattern.includes('*')) {
+            return false;
         }
-        // Generate cache key
-        const cacheKey = `${context.entityName}:${context.operation}:${JSON.stringify(context.input)}`;
-        // Check cache
-        const cached = cache.get(cacheKey);
-        if (cached && Date.now() - cached.timestamp < cached.ttl) {
-            console.log(`💾 Cache hit for ${cacheKey}`);
-            return cached.data;
+        const regexPattern = pattern.replace(/\./g, '\\.').replace(/\*/g, '.*');
+        const regex = new RegExp(`^${regexPattern}$`);
+        return regex.test(eventKey);
+    }
+    generateEventKeys(operation, entityName) {
+        const keys = [];
+        keys.push(`entity.${operation}`);
+        keys.push(`entity.${operation}.${entityName}`);
+        const entityParts = entityName.split('.');
+        if (entityParts.length > 1) {
+            const moduleName = entityParts[0];
+            keys.push(`entity.${operation}.${moduleName}`);
         }
-        // Execute and cache result
-        const result = await next(context);
-        cache.set(cacheKey, {
-            data: result,
-            timestamp: Date.now(),
-            ttl: DEFAULT_TTL,
-        });
-        console.log(`💾 Cached result for ${cacheKey}`);
-        return result;
-    };
-})();
-
-/**
- * Simple in-memory audit storage (for demo purposes)
- */
-class InMemoryAuditStorage {
-    constructor() {
-        this.entries = [];
-    }
-    async save(entry) {
-        this.entries.push(entry);
-        console.log('📋 Audit entry saved:', entry);
+        return keys;
     }
-    getEntries() {
-        return [...this.entries];
+    async dispatchInserted(entityName, data) {
+        await this.dispatchEntityEvent('inserted', entityName, data);
     }
-    getEntriesForEntity(entityName) {
-        return this.entries.filter(entry => entry.entityName === entityName);
+    async dispatchUpdated(entityName, data) {
+        await this.dispatchEntityEvent('updated', entityName, data);
     }
-    clear() {
-        this.entries.length = 0;
+    async dispatchDeleted(entityName, data) {
+        await this.dispatchEntityEvent('deleted', entityName, data);
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityEventDispatcherService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityEventDispatcherService, providedIn: 'root' }); }
 }
-// Global audit storage instance
-const auditStorage = new InMemoryAuditStorage();
-/**
- * Audit middleware that tracks all entity operations
- */
-const auditMiddleware = async (context, next) => {
-    const auditEntry = {
-        id: `audit_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
-        entityName: context.entityName,
-        operation: context.operation,
-        user: context.metadata.user?.id || 'system',
-        timestamp: new Date(),
-        requestId: context.metadata.requestId,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityEventDispatcherService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+async function entityRelatedEntityPageDetails(relatedEntity, entityResolver) {
+    const moduleName = relatedEntity.entity.split('.')[0];
+    const entityName = relatedEntity.entity.split('.')[1];
+    const entityDef = await entityResolver.get(moduleName, entityName);
+    if (!entityDef) {
+        throw new Error(`Entity ${relatedEntity.entity} not found`);
+    }
+    const groups = entityDef?.groups ?? [];
+    const singleInterface = entityDef?.interfaces?.master?.single;
+    const getGroupById = (id) => {
+        return groups.find((s) => s.id === id);
+    };
+    const getPropertyByGroupId = (groupId) => {
+        return entityDef?.properties.filter((p) => p.groupId === groupId) ?? [];
     };
-    // Add operation-specific data
-    switch (context.operation) {
-        case 'insertOne':
-            auditEntry.changes = { created: context.input.entity };
-            break;
-        case 'updateOne':
-            auditEntry.entityId = context.input.id;
-            auditEntry.changes = { updated: context.input.keyValues };
-            break;
-        case 'deleteOne':
-            auditEntry.entityId = context.input.id;
-            auditEntry.changes = { deleted: true };
-            break;
-        case 'getOne':
-            auditEntry.entityId = context.input.id;
-            break;
-        case 'query':
-            auditEntry.metadata = { queryRequest: context.input.request };
-            break;
-        case 'initial':
-            auditEntry.metadata = {
-                collectionSize: context.input.collection?.length,
-                options: context.input.options
+    const getPropertyLayout = (name) => {
+        return singleInterface?.properties?.find((p) => p.name === name)?.layout;
+    };
+    return {
+        id: entityDef?.name ?? '',
+        title: relatedEntity.title ?? entityDef?.title ?? '',
+        icon: relatedEntity.icon,
+        settings: {
+            commands: {
+                reject: {
+                    title: 't("discard")',
+                    color: 'default',
+                    visible: '{{context.isDirty()}}',
+                    command: {
+                        name: 'discard',
+                    },
+                },
+                accept: {
+                    title: 't("confirm")',
+                    color: 'secondary',
+                    visible: '{{context.isDirty()}}',
+                    command: {
+                        name: 'update-entity',
+                    },
+                },
+            },
+        },
+        load: async (context) => {
+            const fn = entityDef?.queries.byKey?.execute;
+            const conditionNames = relatedEntity.conditions?.map((c) => c.name) ?? [];
+            const id = getSmart(context, conditionNames[0]);
+            const result = await fn(id);
+            return {
+                success: true,
+                result: result,
             };
-            break;
-    }
-    try {
-        const result = await next(context);
-        // For insert operations, capture the generated ID
-        if (context.operation === 'insertOne' && result) {
-            auditEntry.entityId = result;
-        }
-        // Save audit entry
-        await auditStorage.save(auditEntry);
-        return result;
-    }
-    catch (error) {
-        // Save audit entry even for failed operations
-        auditEntry.metadata = {
-            ...auditEntry.metadata,
-            error: error instanceof Error ? error.message : 'Unknown error'
-        };
-        await auditStorage.save(auditEntry);
-        throw error;
-    }
-};
-/**
- * User context middleware - adds user information to context
- */
-const userContextMiddleware = async (context, next) => {
-    // In a real application, you would inject your auth service here
-    // const authService = inject(AuthService);
-    // const user = authService.getCurrentUser();
-    // For demo purposes, we'll use a mock user
-    const mockUser = {
-        id: 'user123',
-        name: 'John Doe',
-        role: 'admin',
+        },
+        execute: async (e, context) => {
+            if (e.name == 'update-entity') {
+                const fn = entityDef?.commands?.update?.execute;
+                const result = await fn(context);
+                return {
+                    success: true,
+                    result: result,
+                };
+            }
+            else {
+                return {
+                    success: false,
+                    error: {
+                        code: 'invalid_command',
+                        message: 'Invalid command',
+                    },
+                };
+            }
+        },
+        content: [
+            {
+                type: 'grid-layout',
+                mode: 'edit',
+                options: {
+                    grid: {
+                        default: {
+                            gridTemplateColumns: 'repeat(12, 1fr)',
+                            gridTemplateRows: 'repeat(1, 1fr)',
+                            gap: '20px',
+                        },
+                    },
+                },
+                children: singleInterface?.sections.map((s) => {
+                    console.log('s', s);
+                    return {
+                        type: 'grid-item-layout',
+                        name: s.id,
+                        options: {
+                            colSpan: s.layout?.positions?.lg?.colSpan ?? 12,
+                            colStart: s.layout?.positions?.lg?.colStart,
+                            colEnd: s.layout?.positions?.lg?.colEnd,
+                        },
+                        children: [
+                            {
+                                type: 'fieldset-layout',
+                                options: {
+                                    title: getGroupById(s.id)?.title ?? '',
+                                    collapsible: true,
+                                },
+                                children: [
+                                    {
+                                        type: 'grid-layout',
+                                        options: {
+                                            grid: {
+                                                default: {
+                                                    gridTemplateColumns: 'repeat(12, 1fr)',
+                                                    gridTemplateRows: 'repeat(1, 1fr)',
+                                                    gap: '20px',
+                                                },
+                                            },
+                                        },
+                                        children: getPropertyByGroupId(s.id)
+                                            .filter((property) => !property.schema.hidden)
+                                            .map((p) => {
+                                            const layout = getPropertyLayout(p.name);
+                                            return {
+                                                type: 'grid-item-layout',
+                                                name: p.name,
+                                                options: {
+                                                    colSpan: layout?.positions?.lg?.colSpan ?? 12,
+                                                    colStart: layout?.positions?.lg?.colStart,
+                                                    colEnd: layout?.positions?.lg?.colEnd,
+                                                },
+                                                children: [
+                                                    {
+                                                        type: 'form-field',
+                                                        options: {
+                                                            label: p.title,
+                                                        },
+                                                        children: [
+                                                            {
+                                                                type: p.schema.interface?.type ?? '',
+                                                                path: p.name,
+                                                                name: p.name,
+                                                                defaultValue: p.schema.defaultValue,
+                                                                children: p.schema.interface?.children,
+                                                                options: p.schema.interface?.options,
+                                                                triggers: p.schema.interface?.triggers,
+                                                                valueTransforms: p.schema.interface?.valueTransforms,
+                                                            },
+                                                        ],
+                                                    },
+                                                ],
+                                            };
+                                        }),
+                                    },
+                                ],
+                            },
+                        ],
+                    };
+                }),
+            },
+        ],
     };
-    context.metadata.user = mockUser;
-    return next(context);
-};
-/**
- * Data sanitization middleware - removes sensitive data from logs
- */
-const dataSanitizationMiddleware = async (context, next) => {
-    const sensitiveFields = ['password', 'ssn', 'creditCard', 'apiKey', 'token'];
-    // Sanitize input data
-    if (context.input.entity) {
-        context.input.entity = sanitizeObject(context.input.entity, sensitiveFields);
-    }
-    if (context.input.keyValues) {
-        context.input.keyValues = sanitizeObject(context.input.keyValues, sensitiveFields);
-    }
-    const result = await next(context);
-    // Sanitize result data if needed
-    if (result && typeof result === 'object') {
-        return sanitizeObject(result, sensitiveFields);
-    }
-    return result;
-};
-/**
- * Helper function to sanitize objects by removing sensitive fields
- */
-function sanitizeObject(obj, sensitiveFields) {
-    if (!obj || typeof obj !== 'object') {
-        return obj;
-    }
-    if (Array.isArray(obj)) {
-        return obj.map(item => sanitizeObject(item, sensitiveFields));
-    }
-    const sanitized = { ...obj };
-    for (const field of sensitiveFields) {
-        if (field in sanitized) {
-            sanitized[field] = '[REDACTED]';
-        }
+}
+
+async function entityRelatedEntityPageList(relatedEntity, entityResolver) {
+    const moduleName = relatedEntity.entity.split('.')[0];
+    const entityName = relatedEntity.entity.split('.')[1];
+    const entityDef = await entityResolver.get(moduleName, entityName);
+    if (!entityDef) {
+        throw new Error(`Entity ${relatedEntity.entity} not found`);
     }
-    // Recursively sanitize nested objects
-    for (const [key, value] of Object.entries(sanitized)) {
-        if (value && typeof value === 'object') {
-            sanitized[key] = sanitizeObject(value, sensitiveFields);
-        }
+    return {
+        id: entityDef?.name ?? '',
+        title: relatedEntity.title || '',
+        icon: relatedEntity.icon,
+        content: [
+            {
+                type: AXPWidgetsCatalog.entityList,
+                name: 'page-list',
+                options: {
+                    entity: relatedEntity.entity,
+                },
+            },
+        ],
+    };
+}
+
+async function entityRelatedEntityTabDetails(relatedEntity, entityResolver) {
+    const moduleName = relatedEntity.entity.split('.')[0];
+    const entityName = relatedEntity.entity.split('.')[1];
+    const entityDef = await entityResolver.get(moduleName, entityName);
+    if (!entityDef) {
+        throw new Error(`Entity ${relatedEntity.entity} not found`);
+    }
+    const groups = entityDef?.groups ?? [];
+    const singleInterface = entityDef?.interfaces?.master?.single;
+    const getGroupById = (id) => {
+        return groups.find((s) => s.id === id);
+    };
+    const getPropertyByGroupId = (groupId) => {
+        return entityDef?.properties.filter((p) => p.groupId === groupId) ?? [];
+    };
+    const getPropertyLayout = (name) => {
+        return singleInterface?.properties?.find((p) => p.name === name)?.layout;
+    };
+    return {
+        id: entityDef?.name ?? '',
+        title: relatedEntity.title ?? entityDef?.title ?? '',
+        icon: relatedEntity.icon,
+        content: [
+            {
+                type: 'grid-layout',
+                mode: 'edit',
+                options: {
+                    grid: {
+                        default: {
+                            gridTemplateColumns: 'repeat(12, 1fr)',
+                            gridTemplateRows: 'repeat(1, 1fr)',
+                            gap: '20px',
+                        },
+                    },
+                },
+                children: singleInterface?.sections.map((s) => {
+                    console.log('s', s);
+                    return {
+                        type: 'grid-item-layout',
+                        name: s.id,
+                        options: {
+                            colSpan: s.layout?.positions?.lg?.colSpan ?? 12,
+                            colStart: s.layout?.positions?.lg?.colStart,
+                            colEnd: s.layout?.positions?.lg?.colEnd,
+                        },
+                        children: [
+                            {
+                                type: 'fieldset-layout',
+                                options: {
+                                    title: getGroupById(s.id)?.title ?? '',
+                                    collapsible: true,
+                                },
+                                children: [
+                                    {
+                                        type: 'grid-layout',
+                                        options: {
+                                            grid: {
+                                                default: {
+                                                    gridTemplateColumns: 'repeat(12, 1fr)',
+                                                    gridTemplateRows: 'repeat(1, 1fr)',
+                                                    gap: '20px',
+                                                },
+                                            },
+                                        },
+                                        children: getPropertyByGroupId(s.id)
+                                            .filter((property) => !property.schema.hidden)
+                                            .map((p) => {
+                                            const layout = getPropertyLayout(p.name);
+                                            return {
+                                                type: 'grid-item-layout',
+                                                name: p.name,
+                                                options: {
+                                                    colSpan: layout?.positions?.lg?.colSpan ?? 12,
+                                                    colStart: layout?.positions?.lg?.colStart,
+                                                    colEnd: layout?.positions?.lg?.colEnd,
+                                                },
+                                                children: [
+                                                    {
+                                                        type: 'form-field',
+                                                        options: {
+                                                            label: p.title,
+                                                        },
+                                                        children: [
+                                                            {
+                                                                type: p.schema.interface?.type ?? '',
+                                                                path: p.name,
+                                                                name: p.name,
+                                                                defaultValue: p.schema.defaultValue,
+                                                                children: p.schema.interface?.children,
+                                                                options: p.schema.interface?.options,
+                                                                triggers: p.schema.interface?.triggers,
+                                                                valueTransforms: p.schema.interface?.valueTransforms,
+                                                            },
+                                                        ],
+                                                    },
+                                                ],
+                                            };
+                                        }),
+                                    },
+                                ],
+                            },
+                        ],
+                    };
+                }),
+            },
+        ],
+    };
+}
+
+async function entityRelatedEntityTabList(relatedEntity, entityResolver) {
+    const moduleName = relatedEntity.entity.split('.')[0];
+    const entityName = relatedEntity.entity.split('.')[1];
+    const entityDef = await entityResolver.get(moduleName, entityName);
+    if (!entityDef) {
+        throw new Error(`Entity ${relatedEntity.entity} not found`);
     }
-    return sanitized;
+    return {
+        id: entityDef?.name ?? '',
+        title: relatedEntity.title || '',
+        icon: relatedEntity.icon,
+        content: [
+            {
+                type: AXPWidgetsCatalog.entityList,
+                name: 'tab-list',
+                options: {
+                    entity: relatedEntity.entity,
+                },
+            },
+        ],
+    };
 }
 
-// Core middleware types and utilities
+const AXPLayoutDetailsViewRouteResolver = async (route, state, entityResolver = inject(AXPEntityResolver), session = inject(AXPSessionService)) => {
+    const moduleName = route.parent?.paramMap.get('module');
+    const entityName = route.paramMap.get('entity');
+    const entity = await entityResolver.get(moduleName, entityName);
+    const id = route.paramMap.get('id');
+    const groups = entity?.groups ?? [];
+    const singleInterface = entity?.interfaces?.master?.single;
+    const getGroupById = (id) => {
+        return groups.find((s) => s.id === id);
+    };
+    const getPropertyByGroupId = (groupId) => {
+        return entity?.properties.filter((p) => p.groupId === groupId) ?? [];
+    };
+    const getPropertyLayout = (name) => {
+        return singleInterface?.properties?.find((p) => p.name === name)?.layout;
+    };
+    const getRelatedEntities = (type) => {
+        return entity?.relatedEntities?.filter((re) => !re.hidden && re.layoutType === type);
+    };
+    //
+    const adapter = {
+        title: entity?.title,
+        // description: entity?.description,
+        actions: [],
+        breadcrumbs: [
+            {
+                title: entity?.formats.plural ?? '',
+                command: {
+                    name: 'navigate',
+                    options: {
+                        path: `/${session.application?.name}/m/${moduleName}/e/${entityName}/list`,
+                    },
+                },
+            },
+            {
+                title: entity?.interfaces?.master?.single?.title ?? '',
+            },
+        ],
+        execute: (command, context) => {
+            console.log('layout execute', command, context);
+            return Promise.resolve({ success: true });
+        },
+        load: async () => {
+            const fn = entity?.queries.byKey?.execute;
+            const result = await fn(id);
+            return {
+                success: true,
+                result: result,
+            };
+        },
+        pages: [
+            {
+                id: entity?.name ?? '',
+                // title: singleInterface?.title ?? entity?.formats.individual ?? '',
+                title: entity?.formats.individual ?? '',
+                icon: entity?.icon,
+                settings: {
+                    commands: {
+                        reject: {
+                            title: 't("discard")',
+                            color: 'default',
+                            visible: '{{context.isDirty()}}',
+                            command: {
+                                name: 'discard',
+                            },
+                        },
+                        accept: {
+                            title: 't("confirm")',
+                            color: 'secondary',
+                            visible: '{{context.isDirty()}}',
+                            command: {
+                                name: 'update-entity',
+                            },
+                        },
+                    },
+                },
+                load: async () => {
+                    const fn = entity?.queries.byKey?.execute;
+                    const result = await fn(id);
+                    return {
+                        success: true,
+                        result: result,
+                    };
+                },
+                execute: async (e, context) => {
+                    if (e.name == 'update-entity') {
+                        const fn = entity?.commands?.update?.execute;
+                        const result = await fn(context);
+                        return {
+                            success: true,
+                            result: result,
+                        };
+                    }
+                    else {
+                        return {
+                            success: false,
+                            error: {
+                                code: 'invalid_command',
+                                message: 'Invalid command',
+                            },
+                        };
+                    }
+                },
+                tabs: [
+                    ...(await Promise.all(getRelatedEntities('tab-detail')?.map(async (e) => await entityRelatedEntityTabDetails(e, entityResolver)) ?? [])),
+                    ...(await Promise.all(getRelatedEntities('tab-list')?.map(async (e) => await entityRelatedEntityTabList(e, entityResolver)) ?? [])),
+                ],
+                content: [
+                    {
+                        type: 'grid-layout',
+                        mode: 'edit',
+                        options: {
+                            grid: {
+                                default: {
+                                    gridTemplateColumns: 'repeat(12, 1fr)',
+                                    gridTemplateRows: 'repeat(1, 1fr)',
+                                    gap: '20px',
+                                },
+                            },
+                        },
+                        children: singleInterface?.sections.map((s) => ({
+                            type: 'grid-item-layout',
+                            name: s.id,
+                            options: {
+                                colSpan: s.layout?.positions?.lg?.colSpan ?? 12,
+                                colStart: s.layout?.positions?.lg?.colStart ?? 1,
+                                colEnd: s.layout?.positions?.lg?.colEnd ?? 13,
+                            },
+                            children: [
+                                {
+                                    type: 'fieldset-layout',
+                                    options: {
+                                        title: getGroupById(s.id)?.title ?? '',
+                                        collapsible: true,
+                                    },
+                                    children: [
+                                        {
+                                            type: 'grid-layout',
+                                            options: {
+                                                grid: {
+                                                    default: {
+                                                        gridTemplateColumns: 'repeat(12, 1fr)',
+                                                        gridTemplateRows: 'repeat(1, 1fr)',
+                                                        gap: '20px',
+                                                    },
+                                                },
+                                            },
+                                            children: getPropertyByGroupId(s.id)
+                                                .filter((property) => !property.schema.hidden)
+                                                .map((p) => {
+                                                const layout = getPropertyLayout(p.name);
+                                                return {
+                                                    type: 'grid-item-layout',
+                                                    name: p.name,
+                                                    options: {
+                                                        colSpan: layout?.positions?.lg?.colSpan,
+                                                        colStart: layout?.positions?.lg?.colStart,
+                                                        colEnd: layout?.positions?.lg?.colEnd,
+                                                    },
+                                                    children: [
+                                                        {
+                                                            type: 'form-field',
+                                                            options: {
+                                                                label: p.title,
+                                                            },
+                                                            children: [
+                                                                {
+                                                                    type: p.schema.interface?.type ?? '',
+                                                                    path: p.name,
+                                                                    name: p.name,
+                                                                    defaultValue: p.schema.defaultValue,
+                                                                    children: p.schema.interface?.children,
+                                                                    options: p.schema.interface?.options,
+                                                                    triggers: p.schema.interface?.triggers,
+                                                                    valueTransforms: p.schema.interface?.valueTransforms,
+                                                                },
+                                                            ],
+                                                        },
+                                                    ],
+                                                };
+                                            }),
+                                        },
+                                    ],
+                                },
+                            ],
+                        })),
+                    },
+                ],
+            },
+            ...(await Promise.all(getRelatedEntities('page-detail')?.map(async (e) => await entityRelatedEntityPageDetails(e, entityResolver)) ??
+                [])),
+            ...(await Promise.all(getRelatedEntities('page-list')?.map(async (e) => await entityRelatedEntityPageList(e, entityResolver)) ?? [])),
+        ],
+    };
+    //
+    return new Promise((resolve) => {
+        setTimeout(() => {
+            resolve(adapter);
+        }, 200);
+    });
+};
 
 class AXPEntityCommandSearchDefinitionProvider {
     async provide(context) {
@@ -2922,7 +2917,849 @@ class AXPEntitySearchDefinitionProvider {
             });
         });
     }
-}
+}
+
+class AXPEntityListConverterService {
+    constructor() {
+        //#region ----   Services & Dependencies   ----
+        this.entityResolver = inject(AXPEntityResolver);
+        this.workflow = inject(AXPWorkflowService);
+        this.expressionEvaluator = inject(AXPExpressionEvaluatorService);
+        this.widgetResolver = inject(AXPWidgetRegistryService);
+        this.evaluateExpressions = async (options, data) => {
+            const scope = {
+                context: {
+                    eval: (path) => {
+                        return get(data, path);
+                    },
+                },
+            };
+            return await this.expressionEvaluator.evaluate(options, scope);
+        };
+    }
+    //#endregion
+    //#region ----   Public Methods   ----
+    async convertEntityToolbarOptions(entity, options) {
+        const toolbarOptions = {
+            filterDefinitions: this.createFilterDefinitions(entity),
+            columnDefinitions: this.createColumnDefinitions(entity, options),
+            sortDefinitions: this.createSortDefinitions(entity),
+        };
+        return toolbarOptions;
+    }
+    /**
+     * Convert Entity to List Widget Options
+     */
+    async convertEntityToListOptions(entity, options) {
+        const allActions = entity.interfaces?.master?.list?.actions?.map((tr) => new AXPEntityCommandTriggerViewModel(entity, tr)) ?? [];
+        const listOptions = {
+            // 📊 Data Source
+            dataSource: this.createDataSource(entity),
+            // 📋 Columns from Properties
+            columns: this.createColumnsFromProperties(entity, options),
+            // 🎯 Row Commands from Actions
+            primaryCommands: this.createRowCommands(allActions, 'primary'),
+            secondaryCommands: this.createRowCommands(allActions, 'secondary'),
+            // ⚙️ Table Features
+            showIndex: entity.interfaces?.master?.list?.views?.[0]?.indexCol ?? false,
+            allowSelection: this.hasSelectedScopeActions(entity),
+            paging: true,
+            showHeader: true,
+            showFooter: false,
+            // 🔗 Entity Configuration
+            parentField: entity.parentKey,
+            // 🎪 Events
+            ...this.createDefaultEvents(entity, allActions),
+        };
+        return listOptions;
+    }
+    //#endregion
+    //#region ----   Private Methods   ----
+    /**
+     * Create DataSource for Entity
+     */
+    createDataSource(entity) {
+        return new AXDataSource({
+            byKey: (key) => {
+                const func = entity.queries.byKey.execute;
+                return func(key);
+            },
+            load: (e) => {
+                const func = entity.queries.list?.execute;
+                if (!func) {
+                    throw new Error(`Entity ${entity.name} does not have a list query`);
+                }
+                return func(e);
+            },
+            pageSize: entity.interfaces?.master?.list?.views?.[0]?.pageSize || 10,
+            key: 'id',
+        });
+    }
+    /**
+     * Convert Properties to Columns
+     */
+    createColumnsFromProperties(entity, options) {
+        const excludeColumns = options?.excludeColumns || [];
+        const includeColumns = options?.includeColumns || [];
+        let columns = [];
+        // If columns are defined, use them
+        if (entity.columns && entity.columns.length > 0) {
+            columns = entity.columns.map((col) => this.mapEntityColumnToWidgetColumn(entity, col));
+        }
+        else {
+            // Otherwise use properties
+            columns = entity.properties
+                .filter((prop) => !prop.schema.hidden) // Only visible properties
+                .map((prop) => ({
+                name: prop.name,
+                title: prop.title,
+                visible: true,
+                widget: prop.schema.interface
+                    ? {
+                        type: prop.schema.interface.type || 'text-editor',
+                        path: prop.name,
+                        options: {
+                            readonly: true,
+                            ...prop.schema.interface.options,
+                        },
+                    }
+                    : {
+                        type: 'text-editor',
+                        path: prop.name,
+                        options: { readonly: true },
+                    },
+            }));
+        }
+        // Apply include/exclude filters
+        if (includeColumns.length > 0) {
+            // If includeColumns is specified, only include those columns
+            columns = columns.filter((col) => includeColumns.includes(col.name));
+        }
+        if (excludeColumns.length > 0) {
+            // If excludeColumns is specified, exclude those columns
+            columns = columns.filter((col) => !excludeColumns.includes(col.name));
+        }
+        return columns;
+    }
+    /**
+     * Map EntityTableColumn to ListWidgetColumn
+     */
+    mapEntityColumnToWidgetColumn(entity, column) {
+        // Find corresponding property
+        const property = entity.properties.find((p) => p.name === column.name);
+        return {
+            name: column.name,
+            title: column.title || property?.title || column.name,
+            width: column.options?.width,
+            visible: column.options?.visible !== false,
+            widget: property?.schema.interface
+                ? {
+                    type: property.schema.interface.type || 'text-editor',
+                    path: column.options?.dataPath || column.name,
+                    options: {
+                        readonly: true,
+                        ...property.schema.interface.options,
+                    },
+                }
+                : {
+                    type: 'text-editor',
+                    path: column.options?.dataPath || column.name,
+                    options: { readonly: true },
+                },
+        };
+    }
+    /**
+     * Convert Entity Actions to Row Commands
+     */
+    createRowCommands(actions, priority) {
+        return actions
+            .filter((action) => action.scope === AXPEntityCommandScope.Individual && // Only individual actions
+            action.priority === priority && // Matching priority
+            !action.hidden)
+            .map((action) => ({
+            name: action.name,
+            text: action.title,
+            icon: action.icon,
+            color: action.color,
+            look: 'outline',
+            visible: action.hidden,
+            disabled: action.disabled,
+        }));
+    }
+    /**
+     * Check if entity has Selected Scope Actions
+     */
+    hasSelectedScopeActions(entity) {
+        const actions = entity.interfaces?.master?.list?.actions || [];
+        return actions.some((action) => action.scope === AXPEntityCommandScope.Selected);
+    }
+    /**
+     * Create default events
+     */
+    createDefaultEvents(entity, allActions) {
+        return {
+            onRowClick: (row) => {
+                console.log('Entity List - Row clicked:', row);
+            },
+            onRowDoubleClick: (row) => {
+                console.log('Entity List - Row double clicked:', row);
+            },
+            onSelectionChange: (selectedRows) => {
+                console.log('Entity List - Selection changed:', selectedRows);
+            },
+            onRowCommand: async (e, selectedRows) => {
+                const data = e.data;
+                const commandName = e.name;
+                const action = allActions.find((c) => {
+                    return (c.name == e.name &&
+                        ((selectedRows?.length
+                            ? c.scope == AXPEntityCommandScope.Selected
+                            : c.scope == AXPEntityCommandScope.Individual) ||
+                            c.scope == AXPEntityCommandScope.TypeLevel));
+                });
+                const command = commandName.split('&')[0];
+                const options = await this.evaluateExpressions(action?.options, data);
+                await this.workflow.execute(command, {
+                    entity: getEntityInfo(entity).source,
+                    entityInfo: {
+                        name: entity.name,
+                        module: entity.module,
+                        title: entity.title,
+                        parentKey: entity.parentKey,
+                        source: entity.source,
+                    },
+                    data: action?.scope == AXPEntityCommandScope.Selected ? selectedRows : data,
+                    options: options,
+                    metadata: action?.metadata,
+                });
+                console.log('Entity List - Row command:', e.name, e.data);
+            },
+        };
+    }
+    createFilterDefinitions(entity) {
+        const props = entity.properties.filter((c) => c.options?.filter?.advance?.enabled || c.options?.filter?.inline?.enabled);
+        return props.map((e) => {
+            const widgetConfig = this.widgetResolver.resolve(e.schema.interface?.type);
+            const type = (e.options?.filter?.advance?.widgetType ||
+                widgetConfig?.defaultFilterWidgetName ||
+                e.schema.interface?.type);
+            return {
+                title: e.title,
+                field: e.name,
+                operator: {
+                    type: 'contains',
+                },
+                widget: { ...e.schema.interface, path: e.name, type },
+                filters: [],
+                isParametric: false,
+                icon: widgetConfig?.icon,
+                filterType: {
+                    advance: e.options?.filter?.advance?.enabled ?? false,
+                    inline: e.options?.filter?.inline?.enabled ?? false,
+                },
+            };
+        });
+    }
+    createColumnDefinitions(entity, options) {
+        const { columns = [], properties } = entity;
+        const excludeColumns = options?.excludeColumns || [];
+        const includeColumns = options?.includeColumns || [];
+        const visibleProperties = properties.filter(({ schema }) => !schema?.hidden);
+        const visiblePropNames = new Set(visibleProperties.map(({ name }) => name));
+        let filteredColumns = columns.filter(({ name }) => visiblePropNames.has(name));
+        // Apply include/exclude filters
+        if (includeColumns.length > 0) {
+            // If includeColumns is specified, only include those columns
+            filteredColumns = filteredColumns.filter((col) => includeColumns.includes(col.name));
+        }
+        if (excludeColumns.length > 0) {
+            // If excludeColumns is specified, exclude those columns
+            filteredColumns = filteredColumns.filter((col) => !excludeColumns.includes(col.name));
+        }
+        return filteredColumns.map((column) => {
+            const property = visibleProperties.find(({ name }) => name === column.name);
+            return {
+                name: column.name,
+                title: property?.title,
+                visible: column?.options?.visible ?? true,
+            };
+        });
+    }
+    createSortDefinitions(entity) {
+        const props = entity.properties.filter((c) => c.options?.sort?.enabled);
+        return props.map((e) => {
+            return {
+                name: e.name,
+                title: e.title,
+            };
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityListConverterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityListConverterService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityListConverterService, decorators: [{
+            type: Injectable
+        }] });
+
+class AXPEntityListWidgetViewComponent extends AXPValueWidgetComponent {
+    constructor() {
+        super(...arguments);
+        this.entityResolver = inject(AXPEntityResolver);
+        this.workflow = inject(AXPWorkflowService);
+        this.entityListService = inject(AXPEntityListConverterService);
+        this.layoutThemeService = inject(AXPLayoutThemeService);
+        this.entity = signal(null, ...(ngDevMode ? [{ debugName: "entity" }] : []));
+        this.listNode = signal(null, ...(ngDevMode ? [{ debugName: "listNode" }] : []));
+        this.list = viewChild('list', ...(ngDevMode ? [{ debugName: "list" }] : []));
+        this.allWidgets = viewChildren(AXPWidgetRendererDirective, ...(ngDevMode ? [{ debugName: "allWidgets" }] : []));
+        this.listWidget = computed(() => this.allWidgets().find((widget) => widget.node()?.type === AXPWidgetsCatalog.list), ...(ngDevMode ? [{ debugName: "listWidget" }] : []));
+        this.toolbarWidget = computed(() => this.allWidgets().find((widget) => widget.node()?.type === AXPWidgetsCatalog.listToolbar), ...(ngDevMode ? [{ debugName: "toolbarWidget" }] : []));
+        this.selectedItems = computed(() => this.contextService.getValue(`${this.fullPath()}.table`) || [], ...(ngDevMode ? [{ debugName: "selectedItems" }] : []));
+        this.toolbarNode = signal(null, ...(ngDevMode ? [{ debugName: "toolbarNode" }] : []));
+        this.destroyed = new Subject();
+        //options
+        this.entitySource = computed(() => this.options()['entity'], ...(ngDevMode ? [{ debugName: "entitySource" }] : []));
+        this.excludeColumns = computed(() => this.options()['excludeColumns'], ...(ngDevMode ? [{ debugName: "excludeColumns" }] : []));
+        this.includeColumns = computed(() => this.options()['includeColumns'], ...(ngDevMode ? [{ debugName: "includeColumns" }] : []));
+        //actions
+        this.allActions = computed(() => {
+            const list = this.entity()?.interfaces?.master?.list?.actions ?? [];
+            return list.map((tr) => new AXPEntityCommandTriggerViewModel(this.entity(), tr)) ?? [];
+        }, ...(ngDevMode ? [{ debugName: "allActions" }] : []));
+        this.primaryActions = computed(() => {
+            const actions = this.allActions()
+                .filter((a) => a.priority == 'primary' &&
+                ((a.scope == AXPEntityCommandScope.Selected && this.selectedItems().length) ||
+                    (a.scope == AXPEntityCommandScope.TypeLevel && !this.selectedItems().length)))
+                .map((tr) => ({
+                name: tr.name,
+                title: tr.title,
+                icon: tr.icon,
+                color: tr.color,
+                disabled: tr.disabled,
+                command: {
+                    name: tr.name,
+                    options: tr.options,
+                    metadata: tr.metadata,
+                },
+            }));
+            return actions;
+        }, ...(ngDevMode ? [{ debugName: "primaryActions" }] : []));
+        this.secondaryActions = computed(() => {
+            const actions = this.allActions()
+                .filter((a) => a.priority == 'secondary' && a.scope == AXPEntityCommandScope.TypeLevel)
+                .map((tr) => ({
+                name: tr.name,
+                title: tr.title,
+                icon: tr.icon,
+                color: tr.color,
+                disabled: tr.disabled,
+                separated: tr.separated,
+                command: {
+                    name: tr.name,
+                    options: tr.options,
+                    metadata: tr.metadata,
+                },
+            }));
+            return actions;
+        }, ...(ngDevMode ? [{ debugName: "secondaryActions" }] : []));
+        this.context = {};
+        this.previousQueries = null;
+    }
+    handleActionClick(item) {
+        if (item.command && (item.items?.length ?? 0) == 0) {
+            this.execute(item.command.name, null);
+        }
+    }
+    handleSecondaryActionClick(item) {
+        if (item.command) {
+            this.execute(item.command.name, null);
+        }
+    }
+    async execute(commandName, data) {
+        const action = this.allActions().find((c) => {
+            return (c.name == commandName &&
+                ((this.selectedItems().length
+                    ? c.scope == AXPEntityCommandScope.Selected
+                    : c.scope == AXPEntityCommandScope.Individual) ||
+                    c.scope == AXPEntityCommandScope.TypeLevel));
+        });
+        const command = commandName.split('&')[0];
+        // const options = await this.evaluateExpressions(action?.options, data);
+        await this.workflow.execute(command, {
+            entity: this.entitySource(),
+            entityInfo: {
+                name: this.entity()?.name,
+                module: this.entity()?.module,
+                title: this.entity()?.title,
+                parentKey: this.entity()?.parentKey,
+                source: this.entity()?.source,
+            },
+            data: action?.scope == AXPEntityCommandScope.Selected ? this.selectedItems() : data,
+            options: action?.options,
+            metadata: action?.metadata,
+        });
+    }
+    onContextChanged(context) {
+        const queries = context.data.list.toolbar;
+        const changes = getChangedPaths(queries, this.previousQueries);
+        console.log('changes', changes, queries);
+        const listInstance = untracked(() => this.listWidget()?.instance);
+        const isFilterChanged = changes.includes('filters');
+        const isSortChanged = changes.includes('sorts');
+        const isColumnsChanged = changes.includes('columns');
+        untracked(() => {
+            this.previousQueries = queries;
+            const dataSource = listInstance?.options()['dataSource'];
+            if (isFilterChanged) {
+                dataSource.filter({
+                    filters: queries.filters,
+                });
+                listInstance?.call('refresh');
+            }
+            if (isSortChanged) {
+                dataSource.sort(...queries.sorts);
+                listInstance?.call('refresh');
+            }
+            // if(isColumnsChanged){
+            // }
+        });
+    }
+    async ngOnInit() {
+        super.ngOnInit();
+        const [moduleName, entityName] = this.entitySource().split('.');
+        if (!moduleName || !entityName) {
+            throw new Error('Invalid entity source');
+        }
+        // Resolve entity and set it in the signal
+        const resolvedEntity = await this.entityResolver.get(moduleName, entityName);
+        if (!resolvedEntity) {
+            throw new Error(`Entity not found: ${this.entitySource()}`);
+        }
+        this.entity.set(resolvedEntity);
+        const options = {
+            excludeColumns: this.excludeColumns(),
+            includeColumns: this.includeColumns(),
+        };
+        const listOptions = await this.entityListService.convertEntityToListOptions(resolvedEntity, options);
+        const toolbarOptions = await this.entityListService.convertEntityToolbarOptions(resolvedEntity, options);
+        this.listNode.set({
+            type: AXPWidgetsCatalog.list,
+            options: listOptions,
+            path: `table`,
+            mode: 'view',
+            defaultValue: this.getValue(),
+        });
+        this.toolbarNode.set({
+            type: AXPWidgetsCatalog.listToolbar,
+            path: `toolbar`,
+            options: toolbarOptions,
+            mode: 'view',
+            defaultValue: this.getValue(),
+        });
+    }
+    ngAfterViewInit() {
+        this.workflow.events$
+            .pipe(ofType(AXPRefreshEvent))
+            .pipe(takeUntil(this.destroyed))
+            .subscribe((event) => {
+            if (event.payload.entity == this.entitySource()) {
+                this.listWidget()?.instance.call('refresh');
+            }
+        });
+    }
+    destroy() {
+        this.destroyed.next();
+        this.destroyed.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityListWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPEntityListWidgetViewComponent, isStandalone: true, selector: "ng-component", providers: [AXPEntityListConverterService], viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true, isSignal: true }, { propertyName: "allWidgets", predicate: AXPWidgetRendererDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
+    <axp-widgets-container [context]="context" (onContextChanged)="onContextChanged($event)">
+      <div class="ax-flex ax-gap-2 ax-justify-end ax-mb-4">
+        @for (action of primaryActions(); track $index) {
+          @if (action.visible != false) {
+            <ax-button
+              [class.ax-sm]="layoutThemeService.isSmall()"
+              [iconOnly]="layoutThemeService.isSmall()"
+              [disabled]="action.disabled"
+              [text]="action.title"
+              [look]="'solid'"
+              [color]="action.color"
+              (onClick)="handleActionClick(action)"
+            >
+              <ax-prefix>
+                <i class="{{ action.icon }}"></i>
+              </ax-prefix>
+              @if (action?.items) {
+                <ax-dropdown-panel #panel>
+                  <ax-button-item-list>
+                    @for (sub of action?.items; track $index) {
+                      @if (sub.visible != false) {
+                        <ax-button-item
+                          [text]="sub.title"
+                          [color]="sub.color"
+                          [disabled]="sub.disabled"
+                          (onClick)="handleActionClick(sub)"
+                        >
+                          <ax-prefix>
+                            <ax-icon icon="fa-light {{ sub.icon }}"></ax-icon>
+                          </ax-prefix>
+                        </ax-button-item>
+                        @if (sub.break) {
+                          <ax-divider></ax-divider>
+                        }
+                      }
+                    }
+                  </ax-button-item-list>
+                </ax-dropdown-panel>
+              }
+            </ax-button>
+          }
+        }
+        @if (secondaryActions().length) {
+          <ax-button
+            [class.ax-sm]="layoutThemeService.isSmall()"
+            [iconOnly]="layoutThemeService.isSmall()"
+            [text]="'actions'"
+            [look]="layoutThemeService.isSmall() ? 'blank' : 'solid'"
+            [color]="'default'"
+          >
+            <ax-prefix>
+              <i class="fa-solid fa-ellipsis-vertical"></i>
+            </ax-prefix>
+            <ax-dropdown-panel #panel>
+              <ax-button-item-list>
+                @for (item of secondaryActions(); track $index) {
+                  @if (item.visible != false) {
+                    <ax-button-item
+                      [text]="item.title"
+                      [color]="item.color"
+                      [disabled]="item.disabled"
+                      (onClick)="handleSecondaryActionClick(item)"
+                    >
+                      <ax-prefix>
+                        <ax-icon icon="fa-light {{ item.icon }}"></ax-icon>
+                      </ax-prefix>
+                    </ax-button-item>
+                    @if (item.break) {
+                      <ax-divider></ax-divider>
+                    }
+                  }
+                }
+              </ax-button-item-list>
+            </ax-dropdown-panel>
+          </ax-button>
+        }
+      </div>
+
+      <div class="ax-flex ax-flex-col ax-gap-2">
+        @if (toolbarNode() != null) {
+          <ng-container
+            #toolbar
+            axp-widget-renderer
+            [node]="toolbarNode()!"
+            [parentNode]="this"
+            [index]="index"
+            [mode]="this.mode"
+          ></ng-container>
+        }
+        @if (listNode() != null) {
+          <ng-container
+            #list
+            axp-widget-renderer
+            [node]="listNode()!"
+            [parentNode]="this"
+            [index]="index"
+            [mode]="this.mode"
+          ></ng-container>
+        }
+      </div>
+    </axp-widgets-container>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.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: AXPLayoutBuilderModule }, { kind: "component", type: i2.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i2.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3$1.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: i3$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i3$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i4.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityListWidgetViewComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: `
+    <axp-widgets-container [context]="context" (onContextChanged)="onContextChanged($event)">
+      <div class="ax-flex ax-gap-2 ax-justify-end ax-mb-4">
+        @for (action of primaryActions(); track $index) {
+          @if (action.visible != false) {
+            <ax-button
+              [class.ax-sm]="layoutThemeService.isSmall()"
+              [iconOnly]="layoutThemeService.isSmall()"
+              [disabled]="action.disabled"
+              [text]="action.title"
+              [look]="'solid'"
+              [color]="action.color"
+              (onClick)="handleActionClick(action)"
+            >
+              <ax-prefix>
+                <i class="{{ action.icon }}"></i>
+              </ax-prefix>
+              @if (action?.items) {
+                <ax-dropdown-panel #panel>
+                  <ax-button-item-list>
+                    @for (sub of action?.items; track $index) {
+                      @if (sub.visible != false) {
+                        <ax-button-item
+                          [text]="sub.title"
+                          [color]="sub.color"
+                          [disabled]="sub.disabled"
+                          (onClick)="handleActionClick(sub)"
+                        >
+                          <ax-prefix>
+                            <ax-icon icon="fa-light {{ sub.icon }}"></ax-icon>
+                          </ax-prefix>
+                        </ax-button-item>
+                        @if (sub.break) {
+                          <ax-divider></ax-divider>
+                        }
+                      }
+                    }
+                  </ax-button-item-list>
+                </ax-dropdown-panel>
+              }
+            </ax-button>
+          }
+        }
+        @if (secondaryActions().length) {
+          <ax-button
+            [class.ax-sm]="layoutThemeService.isSmall()"
+            [iconOnly]="layoutThemeService.isSmall()"
+            [text]="'actions'"
+            [look]="layoutThemeService.isSmall() ? 'blank' : 'solid'"
+            [color]="'default'"
+          >
+            <ax-prefix>
+              <i class="fa-solid fa-ellipsis-vertical"></i>
+            </ax-prefix>
+            <ax-dropdown-panel #panel>
+              <ax-button-item-list>
+                @for (item of secondaryActions(); track $index) {
+                  @if (item.visible != false) {
+                    <ax-button-item
+                      [text]="item.title"
+                      [color]="item.color"
+                      [disabled]="item.disabled"
+                      (onClick)="handleSecondaryActionClick(item)"
+                    >
+                      <ax-prefix>
+                        <ax-icon icon="fa-light {{ item.icon }}"></ax-icon>
+                      </ax-prefix>
+                    </ax-button-item>
+                    @if (item.break) {
+                      <ax-divider></ax-divider>
+                    }
+                  }
+                }
+              </ax-button-item-list>
+            </ax-dropdown-panel>
+          </ax-button>
+        }
+      </div>
+
+      <div class="ax-flex ax-flex-col ax-gap-2">
+        @if (toolbarNode() != null) {
+          <ng-container
+            #toolbar
+            axp-widget-renderer
+            [node]="toolbarNode()!"
+            [parentNode]="this"
+            [index]="index"
+            [mode]="this.mode"
+          ></ng-container>
+        }
+        @if (listNode() != null) {
+          <ng-container
+            #list
+            axp-widget-renderer
+            [node]="listNode()!"
+            [parentNode]="this"
+            [index]="index"
+            [mode]="this.mode"
+          ></ng-container>
+        }
+      </div>
+    </axp-widgets-container>
+  `,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [AXPEntityListConverterService],
+                    imports: [CommonModule, AXDecoratorModule, AXPLayoutBuilderModule, AXButtonModule, AXDropdownModule],
+                }]
+        }] });
+
+var entityListWidgetView_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEntityListWidgetViewComponent: AXPEntityListWidgetViewComponent
+});
+
+const AXPEntityListWidget = {
+    name: 'entity-list',
+    title: 'Entity List',
+    description: 'Displays entity data in a table format',
+    type: 'view',
+    categories: [],
+    groups: [AXPWidgetGroupEnum.EntityWidget],
+    icon: 'fa-solid fa-square',
+    properties: [AXP_NAME_PROPERTY, AXP_DATA_PATH_PROPERTY],
+    components: {
+        view: {
+            component: () => Promise.resolve().then(function () { return entityListWidgetView_component; }).then((c) => c.AXPEntityListWidgetViewComponent),
+        },
+        edit: {
+            component: () => Promise.resolve().then(function () { return entityListWidgetView_component; }).then((c) => c.AXPEntityListWidgetViewComponent),
+        },
+        print: {
+            component: () => Promise.resolve().then(function () { return entityListWidgetView_component; }).then((c) => c.AXPEntityListWidgetViewComponent),
+        },
+        designer: {
+            component: () => Promise.resolve().then(function () { return entityListWidgetView_component; }).then((c) => c.AXPEntityListWidgetViewComponent),
+        },
+    },
+};
+
+class AXPEntityReferenceWidgetViewComponent extends AXPLayoutWidgetComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetViewComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetViewComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: ``,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [CommonModule]
+                }]
+        }] });
+
+var entityReferenceWidgetView_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEntityReferenceWidgetViewComponent: AXPEntityReferenceWidgetViewComponent
+});
+
+class AXPEntityReferenceWidgetEditComponent extends AXPLayoutWidgetComponent {
+    constructor() {
+        super(...arguments);
+        this.injector = inject(Injector);
+        this.entityResolver = inject(AXPEntityResolver);
+        this.entity = computed(() => this.options()['entity'], ...(ngDevMode ? [{ debugName: "entity" }] : []));
+        this.entityDef = signal(null, ...(ngDevMode ? [{ debugName: "entityDef" }] : []));
+        this.#efEntity = effect(async () => {
+            const [module, entity] = this.entity().split('.');
+            this.entityDef.set(await this.entityResolver.get(module, entity));
+            console.log(this.entityDef());
+        }, ...(ngDevMode ? [{ debugName: "#efEntity" }] : []));
+    }
+    #efEntity;
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetEditComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetEditComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: ``,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [CommonModule, FormsModule],
+                }]
+        }] });
+
+var entityReferenceWidgetEdit_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEntityReferenceWidgetEditComponent: AXPEntityReferenceWidgetEditComponent
+});
+
+class AXPEntityReferenceWidgetColumnComponent extends AXPColumnWidgetComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetColumnComponent, isStandalone: true, selector: "ng-component", inputs: { rawValue: "rawValue" }, usesInheritance: true, ngImport: i0, template: `{{rawValue}}`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: `{{rawValue}}`,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [CommonModule],
+                    inputs: ['rawValue']
+                }]
+        }] });
+
+var entityReferenceWidgetColumn_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEntityReferenceWidgetColumnComponent: AXPEntityReferenceWidgetColumnComponent
+});
+
+class AXPEntityReferenceWidgetPrintComponent extends AXPLayoutWidgetComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetPrintComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetPrintComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetPrintComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: ``,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [CommonModule],
+                    inputs: []
+                }]
+        }] });
+
+var entityReferenceWidgetPrint_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEntityReferenceWidgetPrintComponent: AXPEntityReferenceWidgetPrintComponent
+});
+
+class AXPEntityReferenceWidgetDesignerComponent extends AXPLayoutWidgetComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetDesignerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetDesignerComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetDesignerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    template: ``,
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [CommonModule]
+                }]
+        }] });
+
+var entityReferenceWidgetDesigner_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    AXPEntityReferenceWidgetDesignerComponent: AXPEntityReferenceWidgetDesignerComponent
+});
+
+const AXPEntityReferenceWidget = {
+    name: "entity-reference",
+    title: "Entity Reference",
+    description: '',
+    type: 'view',
+    categories: [],
+    groups: [AXPWidgetGroupEnum.FormElement],
+    icon: "fa-solid fa-square",
+    properties: [
+        AXP_NAME_PROPERTY,
+        AXP_DATA_PATH_PROPERTY,
+    ],
+    components: {
+        view: {
+            component: () => Promise.resolve().then(function () { return entityReferenceWidgetView_component; }).then((c) => c.AXPEntityReferenceWidgetViewComponent),
+        },
+        edit: {
+            component: () => Promise.resolve().then(function () { return entityReferenceWidgetEdit_component; }).then((c) => c.AXPEntityReferenceWidgetEditComponent),
+        },
+        column: {
+            component: () => Promise.resolve().then(function () { return entityReferenceWidgetColumn_component; }).then((c) => c.AXPEntityReferenceWidgetColumnComponent),
+        },
+        print: {
+            component: () => Promise.resolve().then(function () { return entityReferenceWidgetPrint_component; }).then((c) => c.AXPEntityReferenceWidgetPrintComponent),
+        },
+        designer: {
+            component: () => Promise.resolve().then(function () { return entityReferenceWidgetDesigner_component; }).then((c) => c.AXPEntityReferenceWidgetDesignerComponent),
+        },
+    }
+};
 
 class AXPLookupWidgetViewComponent extends AXPValueWidgetComponent {
     constructor() {
@@ -3169,7 +4006,7 @@ class AXPLookupWidgetSelectorComponent extends AXBasePageComponent {
         }
       </ax-suffix>
     </ax-footer>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXCommonModule }, { kind: "directive", type: i1$2.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.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: AXFormModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i3.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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i4.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i4.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i6.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXCommonModule }, { kind: "directive", type: i1$2.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3$1.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: AXFormModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i3.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: AXDropdownButtonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i4$1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i4$1.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXPLayoutBuilderModule }, { kind: "component", type: i2.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPLookupWidgetSelectorComponent, decorators: [{
             type: Component,
@@ -3418,6 +4255,7 @@ class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
         this.customFilter = computed(() => this.options()['filter'], ...(ngDevMode ? [{ debugName: "customFilter" }] : []));
         this.multiple = computed(() => (this.options()['multiple'] ?? false), ...(ngDevMode ? [{ debugName: "multiple" }] : []));
         this.look = computed(() => this.options()['look'] ?? 'lookup', ...(ngDevMode ? [{ debugName: "look" }] : []));
+        this.allowClear = computed(() => (this.options()['allowClear'] ?? false), ...(ngDevMode ? [{ debugName: "allowClear" }] : []));
         this.textField = computed(() => {
             return (this.entityDef()?.formats.lookup ?? this.entityDef()?.properties.find((c) => c.name != 'id')?.name ?? 'title');
         }, ...(ngDevMode ? [{ debugName: "textField" }] : []));
@@ -3485,11 +4323,11 @@ class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
     }
     showSelector() {
         this.isOpen.set(true);
-        const columnsCount = this.columns().length > 0 ? this.columns().length : this.vm()?.columns().length ?? 0;
+        const columnsCount = this.columns().length > 0 ? this.columns().length : (this.vm()?.columns().length ?? 0);
         this.popupService
             .open(AXPLookupWidgetSelectorComponent, {
             title: `${this.translateService.translateSync('widget.lookup.search')} ${this.translateService.translateSync(this.entityDef()?.formats.plural ?? '')}`,
-            size: columnsCount < 4 ? 'md' : 'lg',
+            size: columnsCount < 3 ? 'md' : 'lg',
             data: {
                 vm: new AXPLookupWidgetSelectorViewModel(this.injector, this.entityDef(), {
                     customFilter: this.customFilter(),
@@ -3621,47 +4459,56 @@ class AXPLookupWidgetEditComponent extends AXPValueWidgetComponent {
         [multiple]="multiple()"
         (onValueChanged)="selectBoxValueChange($event)"
       >
-      <ax-search-box>
-      </ax-search-box>
-    </ax-select-box>
+        <ax-search-box>
+          <ax-clear-button></ax-clear-button>
+        </ax-search-box>
+        @if (allowClear()) {
+          <ax-clear-button (click)="handleClearClick()"></ax-clear-button>
+        }
+      </ax-select-box>
     } @else {
-    <ax-tag-box
-      [ngModel]="selectedItems()"
-      [textField]="textField()"
-      [valueField]="valueField()"
-      (onValueChanged)="handleValueChange($event)"
-      [placeholder]="placeholder() | translate | async"
-      [addOnEnter]="false"
-      [addOnComma]="false"
-      [disabled]="disabled()"
-      (onKeyUp)="handleKeyUp($event)"
-      (onBlur)="handleOnBlur($event)"
-    >
-      @for (validation of validationRules(); track $index) {
-        <ax-validation-rule
-          [rule]="validation.rule"
-          [message]="validation.options?.message"
-          [options]="validation.options"
-        ></ax-validation-rule>
-      }
-      @if (selectedItems().length > 1) {
-        <ax-clear-button (click)="handleClearClick()"></ax-clear-button>
-      }
+      <ax-tag-box
+        [ngModel]="selectedItems()"
+        [textField]="textField()"
+        [valueField]="valueField()"
+        (onValueChanged)="handleValueChange($event)"
+        [placeholder]="placeholder() | translate | async"
+        [addOnEnter]="false"
+        [addOnComma]="false"
+        [disabled]="disabled()"
+        (onKeyUp)="handleKeyUp($event)"
+        (onBlur)="handleOnBlur($event)"
+      >
+        @for (validation of validationRules(); track $index) {
+          <ax-validation-rule
+            [rule]="validation.rule"
+            [message]="validation.options?.message"
+            [options]="validation.options"
+          ></ax-validation-rule>
+        }
+        @if (selectedItems().length > 1 || allowClear()) {
+          <ax-clear-button (click)="handleClearClick()"></ax-clear-button>
+        }
 
-      <ax-suffix>
-        <ax-button color="ghost" look="blank" [disabled]="isLoading() || disabled()" (onClick)="handleOnClick($event)">
-          @if (isLoading()) {
-            <ax-loading></ax-loading>
-          } @else {
-            <ax-icon icon="far fa-search"> </ax-icon>
-          }
-        </ax-button>
-      </ax-suffix>
-    </ax-tag-box>
-  }
+        <ax-suffix>
+          <ax-button
+            color="ghost"
+            look="blank"
+            [disabled]="isLoading() || disabled()"
+            (onClick)="handleOnClick($event)"
+          >
+            @if (isLoading()) {
+              <ax-loading></ax-loading>
+            } @else {
+              <ax-icon icon="far fa-search"> </ax-icon>
+            }
+          </ax-button>
+        </ax-suffix>
+      </ax-tag-box>
+    }
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: 
                 //
-                AXButtonModule }, { kind: "component", type: i2.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.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i3.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: "component", type: i1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i5$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i6$1.AXTagBoxComponent, selector: "ax-tag-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "allowNull", "type", "look", "addOnComma", "addOnEnter", "valueField", "textField", "readonlyField", "allowDuplicateValues"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i7$1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+                AXButtonModule }, { kind: "component", type: i3$1.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.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i3.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: "component", type: i1.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i5$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i6.AXTagBoxComponent, selector: "ax-tag-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "allowNull", "type", "look", "addOnComma", "addOnEnter", "valueField", "textField", "readonlyField", "allowDuplicateValues"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i7$1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPLookupWidgetEditComponent, decorators: [{
             type: Component,
@@ -3678,44 +4525,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
         [multiple]="multiple()"
         (onValueChanged)="selectBoxValueChange($event)"
       >
-      <ax-search-box>
-      </ax-search-box>
-    </ax-select-box>
+        <ax-search-box>
+          <ax-clear-button></ax-clear-button>
+        </ax-search-box>
+        @if (allowClear()) {
+          <ax-clear-button (click)="handleClearClick()"></ax-clear-button>
+        }
+      </ax-select-box>
     } @else {
-    <ax-tag-box
-      [ngModel]="selectedItems()"
-      [textField]="textField()"
-      [valueField]="valueField()"
-      (onValueChanged)="handleValueChange($event)"
-      [placeholder]="placeholder() | translate | async"
-      [addOnEnter]="false"
-      [addOnComma]="false"
-      [disabled]="disabled()"
-      (onKeyUp)="handleKeyUp($event)"
-      (onBlur)="handleOnBlur($event)"
-    >
-      @for (validation of validationRules(); track $index) {
-        <ax-validation-rule
-          [rule]="validation.rule"
-          [message]="validation.options?.message"
-          [options]="validation.options"
-        ></ax-validation-rule>
-      }
-      @if (selectedItems().length > 1) {
-        <ax-clear-button (click)="handleClearClick()"></ax-clear-button>
-      }
+      <ax-tag-box
+        [ngModel]="selectedItems()"
+        [textField]="textField()"
+        [valueField]="valueField()"
+        (onValueChanged)="handleValueChange($event)"
+        [placeholder]="placeholder() | translate | async"
+        [addOnEnter]="false"
+        [addOnComma]="false"
+        [disabled]="disabled()"
+        (onKeyUp)="handleKeyUp($event)"
+        (onBlur)="handleOnBlur($event)"
+      >
+        @for (validation of validationRules(); track $index) {
+          <ax-validation-rule
+            [rule]="validation.rule"
+            [message]="validation.options?.message"
+            [options]="validation.options"
+          ></ax-validation-rule>
+        }
+        @if (selectedItems().length > 1 || allowClear()) {
+          <ax-clear-button (click)="handleClearClick()"></ax-clear-button>
+        }
 
-      <ax-suffix>
-        <ax-button color="ghost" look="blank" [disabled]="isLoading() || disabled()" (onClick)="handleOnClick($event)">
-          @if (isLoading()) {
-            <ax-loading></ax-loading>
-          } @else {
-            <ax-icon icon="far fa-search"> </ax-icon>
-          }
-        </ax-button>
-      </ax-suffix>
-    </ax-tag-box>
-  }
+        <ax-suffix>
+          <ax-button
+            color="ghost"
+            look="blank"
+            [disabled]="isLoading() || disabled()"
+            (onClick)="handleOnClick($event)"
+          >
+            @if (isLoading()) {
+              <ax-loading></ax-loading>
+            } @else {
+              <ax-icon icon="far fa-search"> </ax-icon>
+            }
+          </ax-button>
+        </ax-suffix>
+      </ax-tag-box>
+    }
   `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [
@@ -3730,7 +4586,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
                         AXTagBoxModule,
                         AXTranslationModule,
                         AXSelectBoxModule,
-                        AXSearchBoxComponent
+                        AXSearchBoxComponent,
                     ],
                 }]
         }] });
@@ -3809,6 +4665,7 @@ const AXPLookupWidget = {
     type: 'editor',
     properties: [
         AXP_DISABLED_PROPERTY,
+        AXP_ALLOW_CLEAR_PROPERTY,
         AXP_DATA_PATH_PROPERTY,
         {
             name: 'expose',
@@ -3992,7 +4849,7 @@ class AXPTagableBoxWidgetEditComponent extends AXPValueWidgetComponent {
         </ax-prefix>
       </ax-button>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i5$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i3.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: AXValidationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.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: AXSelectBoxModule }, { kind: "component", type: i7$1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AXTextBoxModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i5$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i3.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: AXValidationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3$1.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: AXSelectBoxModule }, { kind: "component", type: i7$1.AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i5.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPTagableBoxWidgetEditComponent, decorators: [{
             type: Component,
@@ -4288,7 +5145,7 @@ class AXPWidgetSelectorWidgetEditComponent extends AXPValueWidgetComponent {
     <axp-widget-property-viewer [widget]="selectedWidgetNode()!" (onChanged)="handleChangeWidget($event)">
     </axp-widget-property-viewer>
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i2$1.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2.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.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.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: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i5$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget", "mode"], outputs: ["onChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "ngmodule", type: AXTextBoxModule }, { kind: "component", type: i2$1.AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "mask-options", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3$1.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.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.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: AXValidationModule }, { kind: "ngmodule", type: AXFormModule }, { kind: "directive", type: i5$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message", "disabled"] }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget", "mode"], outputs: ["onChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPWidgetSelectorWidgetEditComponent, decorators: [{
             type: Component,
@@ -4730,147 +5587,6 @@ const AXPShowListViewWorkflow = {
     },
 };
 
-class AXPEntityReferenceWidgetViewComponent extends AXPLayoutWidgetComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetViewComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: ``,
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule]
-                }]
-        }] });
-
-var entityReferenceWidgetView_component = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    AXPEntityReferenceWidgetViewComponent: AXPEntityReferenceWidgetViewComponent
-});
-
-class AXPEntityReferenceWidgetEditComponent extends AXPLayoutWidgetComponent {
-    constructor() {
-        super(...arguments);
-        this.injector = inject(Injector);
-        this.entityResolver = inject(AXPEntityResolver);
-        this.entity = computed(() => this.options()['entity'], ...(ngDevMode ? [{ debugName: "entity" }] : []));
-        this.entityDef = signal(null, ...(ngDevMode ? [{ debugName: "entityDef" }] : []));
-        this.#efEntity = effect(async () => {
-            const [module, entity] = this.entity().split('.');
-            this.entityDef.set(await this.entityResolver.get(module, entity));
-            console.log(this.entityDef());
-        }, ...(ngDevMode ? [{ debugName: "#efEntity" }] : []));
-    }
-    #efEntity;
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetEditComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetEditComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetEditComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: ``,
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule, FormsModule],
-                }]
-        }] });
-
-var entityReferenceWidgetEdit_component = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    AXPEntityReferenceWidgetEditComponent: AXPEntityReferenceWidgetEditComponent
-});
-
-class AXPEntityReferenceWidgetColumnComponent extends AXPColumnWidgetComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetColumnComponent, isStandalone: true, selector: "ng-component", inputs: { rawValue: "rawValue" }, usesInheritance: true, ngImport: i0, template: `{{rawValue}}`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetColumnComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: `{{rawValue}}`,
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule],
-                    inputs: ['rawValue']
-                }]
-        }] });
-
-var entityReferenceWidgetColumn_component = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    AXPEntityReferenceWidgetColumnComponent: AXPEntityReferenceWidgetColumnComponent
-});
-
-class AXPEntityReferenceWidgetPrintComponent extends AXPLayoutWidgetComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetPrintComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetPrintComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetPrintComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: ``,
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule],
-                    inputs: []
-                }]
-        }] });
-
-var entityReferenceWidgetPrint_component = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    AXPEntityReferenceWidgetPrintComponent: AXPEntityReferenceWidgetPrintComponent
-});
-
-class AXPEntityReferenceWidgetDesignerComponent extends AXPLayoutWidgetComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetDesignerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: AXPEntityReferenceWidgetDesignerComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityReferenceWidgetDesignerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    template: ``,
-                    standalone: true,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [CommonModule]
-                }]
-        }] });
-
-var entityReferenceWidgetDesigner_component = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    AXPEntityReferenceWidgetDesignerComponent: AXPEntityReferenceWidgetDesignerComponent
-});
-
-const AXPEntityReferenceWidget = {
-    name: "entity-reference",
-    title: "Entity Reference",
-    description: '',
-    type: 'view',
-    categories: [],
-    groups: [AXPWidgetGroupEnum.FormElement],
-    icon: "fa-solid fa-square",
-    properties: [
-        AXP_NAME_PROPERTY,
-        AXP_DATA_PATH_PROPERTY,
-    ],
-    components: {
-        view: {
-            component: () => Promise.resolve().then(function () { return entityReferenceWidgetView_component; }).then((c) => c.AXPEntityReferenceWidgetViewComponent),
-        },
-        edit: {
-            component: () => Promise.resolve().then(function () { return entityReferenceWidgetEdit_component; }).then((c) => c.AXPEntityReferenceWidgetEditComponent),
-        },
-        column: {
-            component: () => Promise.resolve().then(function () { return entityReferenceWidgetColumn_component; }).then((c) => c.AXPEntityReferenceWidgetColumnComponent),
-        },
-        print: {
-            component: () => Promise.resolve().then(function () { return entityReferenceWidgetPrint_component; }).then((c) => c.AXPEntityReferenceWidgetPrintComponent),
-        },
-        designer: {
-            component: () => Promise.resolve().then(function () { return entityReferenceWidgetDesigner_component; }).then((c) => c.AXPEntityReferenceWidgetDesignerComponent),
-        },
-    }
-};
-
 function routesFacory() {
     const config = inject(AXP_ENTITY_CONFIG_TOKEN);
     let routes = [];
@@ -4903,6 +5619,14 @@ function routesFacory() {
                             },
                             data: { reuse: false },
                         },
+                        {
+                            path: 'e/:entity/:id/new-view',
+                            resolve: { adapter: AXPLayoutDetailsViewRouteResolver },
+                            loadComponent: () => {
+                                return config.viewers.master.details();
+                            },
+                            data: { reuse: false },
+                        },
                         {
                             path: 'e/:entity/:id',
                             redirectTo: 'e/:entity/:id/view',
@@ -4934,7 +5658,7 @@ class AXPEntityModule {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityModule, deps: [{ token: i1$4.AXPAppStartUpService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityModule, imports: [RouterModule, i2$2.AXPWorkflowModule, i6.AXPLayoutBuilderModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityModule, imports: [RouterModule, i2$2.AXPWorkflowModule, i2.AXPLayoutBuilderModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityModule, providers: [
             {
                 provide: ROUTES,
@@ -4980,7 +5704,13 @@ class AXPEntityModule {
                 functions: {},
             }),
             AXPLayoutBuilderModule.forChild({
-                widgets: [AXPLookupWidget, AXPWidgetSelectorWidget, AXPTagableBoxWidget, AXPEntityReferenceWidget],
+                widgets: [
+                    AXPLookupWidget,
+                    AXPWidgetSelectorWidget,
+                    AXPTagableBoxWidget,
+                    AXPEntityListWidget,
+                    AXPEntityReferenceWidget,
+                ],
             })] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPEntityModule, decorators: [{
@@ -5016,7 +5746,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
                             functions: {},
                         }),
                         AXPLayoutBuilderModule.forChild({
-                            widgets: [AXPLookupWidget, AXPWidgetSelectorWidget, AXPTagableBoxWidget, AXPEntityReferenceWidget],
+                            widgets: [
+                                AXPLookupWidget,
+                                AXPWidgetSelectorWidget,
+                                AXPTagableBoxWidget,
+                                AXPEntityListWidget,
+                                AXPEntityReferenceWidget,
+                            ],
                         }),
                     ],
                     exports: [],
@@ -5087,9 +5823,7 @@ function entityMasterCrudActions() {
     ];
 }
 function entityMasterRecordActions() {
-    return [
-        entityMasterDeleteAction(),
-    ];
+    return [entityMasterDeleteAction()];
 }
 // #endregion
 // #region Details
@@ -5121,7 +5855,8 @@ function entityDetailsSimpleCondition(fk) {
     };
 }
 function entityDetailsReferenceCondition() {
-    return [{
+    return [
+        {
             name: 'reference.id',
             operator: { type: 'equal' },
             value: '{{context.eval("id")}}',
@@ -5130,7 +5865,7 @@ function entityDetailsReferenceCondition() {
             name: 'reference.type',
             operator: { type: 'equal' },
             value: '{{context.eval("entityName")}}',
-        }
+        },
     ];
 }
 function entityDetailsEditAction() {
@@ -5153,11 +5888,7 @@ function entityOverrideDetailsViewAction() {
     };
 }
 function entityDetailsCrudActions(parentId) {
-    return [
-        entityDetailsCreateActions(parentId),
-        entityDetailsEditAction(),
-        entityOverrideDetailsViewAction(),
-    ];
+    return [entityDetailsCreateActions(parentId), entityDetailsEditAction(), entityOverrideDetailsViewAction()];
 }
 function entityDetailsReferenceCreateActions() {
     return [
@@ -5170,10 +5901,10 @@ function entityDetailsReferenceCreateActions() {
                         redirect: false,
                         canCreateNewOne: true,
                         data: {
-                            'reference': {
-                                'id': '{{context.eval("id")}}',
-                                'type': '{{context.eval("entityName")}}'
-                            }
+                            reference: {
+                                id: '{{context.eval("id")}}',
+                                type: '{{context.eval("entityName")}}',
+                            },
                         },
                     },
                 },
@@ -5186,11 +5917,66 @@ function entityDetailsReferenceCreateActions() {
         entityOverrideDetailsViewAction(),
     ];
 }
-// #endregion
+/**
+ * Computes a diff between two plain objects with array-aware semantics.
+ * - For arrays of objects with an id field, computes added/removed by id.
+ * - For arrays of primitives or objects without id, uses deep equality.
+ * - For scalars/objects, reports oldValue/newValue when changed.
+ */
+function detectEntityChanges(oldObj, newObj) {
+    return transform(newObj, (result, value, key) => {
+        if (!isEqual(value, oldObj[key])) {
+            const oldValue = oldObj[key];
+            if (Array.isArray(value) || Array.isArray(oldValue)) {
+                const oldArray = Array.isArray(oldValue) ? oldValue : [];
+                const newArray = Array.isArray(value) ? value : [];
+                const hasId = newArray.length > 0 && typeof newArray[0] === 'object' && newArray[0] !== null && 'id' in newArray[0];
+                if (hasId) {
+                    const added = newArray.filter((item) => !oldArray.some((oldItem) => oldItem.id === item.id));
+                    const removed = oldArray.filter((item) => !newArray.some((newItem) => newItem.id === item.id));
+                    result[key] = { oldValue, newValue: value, added, removed };
+                }
+                else {
+                    const added = newArray.filter((item) => !oldArray.some((oldItem) => isEqual(item, oldItem)));
+                    const removed = oldArray.filter((item) => !newArray.some((newItem) => isEqual(item, newItem)));
+                    result[key] = { oldValue, newValue: value, added, removed };
+                }
+            }
+            else {
+                result[key] = { oldValue, newValue: value };
+            }
+        }
+    }, {});
+}
+//#endregion
+
+const eventDispatchMiddleware = {
+    target: { ops: ['create', 'update', 'delete'], order: 90 },
+    execute: async (ctx, next) => {
+        const dispatcher = inject(AXPEntityEventDispatcherService);
+        console.log(ctx);
+        await next();
+        if (ctx.op === 'create') {
+            const createdData = ctx.result ? { ...ctx.data, id: ctx.result } : ctx.data;
+            await dispatcher.dispatchInserted(ctx.entityName, { refType: ctx.entityName, data: createdData });
+        }
+        else if (ctx.op === 'update') {
+            await dispatcher.dispatchUpdated(ctx.entityName, {
+                refType: ctx.entityName,
+                data: ctx.result,
+                changes: ctx.locals.get('changes'),
+            });
+        }
+        else if (ctx.op === 'delete') {
+            // For delete, prefer previous entity if available
+            await dispatcher.dispatchDeleted(ctx.entityName, { refType: ctx.entityName, data: ctx.result ?? ctx.previous });
+        }
+    },
+};
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AXMEntityCrudService, AXMEntityCrudServiceImpl, AXPCreateEntityWorkflow, AXPDataSeederService, AXPDeleteEntityWorkflow, AXPEntityApplyUpdatesAction, AXPEntityCommandTriggerViewModel, AXPEntityCreateEvent, AXPEntityCreatePopupAction, AXPEntityCreateSubmittedAction, AXPEntityCreateViewElementViewModel, AXPEntityCreateViewModelFactory, AXPEntityCreateViewSectionViewModel, AXPEntityDataProvider, AXPEntityDataProviderImpl, AXPEntityDefinitionRegistryService, AXPEntityDeletedEvent, AXPEntityDetailListViewModel, AXPEntityDetailViewModelFactory, AXPEntityDetailViewModelResolver, AXPEntityListViewColumnViewModel, AXPEntityListViewModelFactory, AXPEntityListViewModelResolver, AXPEntityMasterCreateViewModel, AXPEntityMasterListViewModel, AXPEntityMasterListViewQueryViewModel, AXPEntityMasterSingleElementViewModel, AXPEntityMasterSingleViewGroupViewModel, AXPEntityMasterSingleViewModel, AXPEntityMasterUpdateElementViewModel, AXPEntityMasterUpdateViewModel, AXPEntityMasterUpdateViewModelFactory, AXPEntityMiddleware, AXPEntityModifyConfirmedAction, AXPEntityModifyEvent, AXPEntityModifySectionPopupAction, AXPEntityModule, AXPEntityPerformDeleteAction, AXPEntityResolver, AXPEntityService, AXPEntityStorageExecutor, AXPEntityStorageRegistry, AXPEntityStorageService, AXPEntityStorageWithMiddlewareService, AXPModifyEntitySectionWorkflow, AXPQuickEntityModifyPopupAction, AXPQuickModifyEntityWorkflow, AXPShowDetailViewAction, AXPShowDetailsViewWorkflow, AXPShowListViewAction, AXPShowListViewWorkflow, AXP_DATA_SEEDER_TOKEN, AXP_ENTITY_CONFIG_TOKEN, AXP_ENTITY_DEFINITION_LOADER, AXP_ENTITY_MODIFIER, AXP_ENTITY_STORAGE_EXTENSION, AXP_ENTITY_STORAGE_MIDDLEWARE_SETUP, auditMiddleware, auditStorage, cachingMiddleware, composeEntityStorageMiddlewares, createModifierContext, dataSanitizationMiddleware, entityDetailsCreateActions, entityDetailsCrudActions, entityDetailsEditAction, entityDetailsReferenceCondition, entityDetailsReferenceCreateActions, entityDetailsSimpleCondition, entityMasterBulkDeleteAction, entityMasterCreateAction, entityMasterCrudActions, entityMasterDeleteAction, entityMasterRecordActions, entityMasterViewAction, entityOverrideDetailsViewAction, errorHandlingMiddleware, generateRequestId, loggingMiddleware, performanceMiddleware, provideEntitySpecificMiddleware, provideEntityStorageMiddleware, provideGlobalEntityStorageMiddleware, provideOperationSpecificMiddleware, userContextMiddleware, validationMiddleware };
+export { AXMEntityCrudService, AXMEntityCrudServiceImpl, AXPCreateEntityWorkflow, AXPDataSeederService, AXPDeleteEntityWorkflow, AXPEntityApplyUpdatesAction, AXPEntityCommandTriggerViewModel, AXPEntityCreateEvent, AXPEntityCreatePopupAction, AXPEntityCreateSubmittedAction, AXPEntityCreateViewElementViewModel, AXPEntityCreateViewModelFactory, AXPEntityCreateViewSectionViewModel, AXPEntityDataProvider, AXPEntityDataProviderImpl, AXPEntityDefinitionRegistryService, AXPEntityDeletedEvent, AXPEntityDetailListViewModel, AXPEntityDetailViewModelFactory, AXPEntityDetailViewModelResolver, AXPEntityEventDispatcherService, AXPEntityListViewColumnViewModel, AXPEntityListViewModelFactory, AXPEntityListViewModelResolver, AXPEntityMasterCreateViewModel, AXPEntityMasterListViewModel, AXPEntityMasterListViewQueryViewModel, AXPEntityMasterSingleElementViewModel, AXPEntityMasterSingleViewGroupViewModel, AXPEntityMasterSingleViewModel, AXPEntityMasterUpdateElementViewModel, AXPEntityMasterUpdateViewModel, AXPEntityMasterUpdateViewModelFactory, AXPEntityMiddleware, AXPEntityModifyConfirmedAction, AXPEntityModifyEvent, AXPEntityModifySectionPopupAction, AXPEntityModule, AXPEntityPerformDeleteAction, AXPEntityResolver, AXPEntityService, AXPEntityStorageService, AXPMiddlewareEntityStorageService, AXPModifyEntitySectionWorkflow, AXPQuickEntityModifyPopupAction, AXPQuickModifyEntityWorkflow, AXPShowDetailViewAction, AXPShowDetailsViewWorkflow, AXPShowListViewAction, AXPShowListViewWorkflow, 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, actionExists, createModifierContext, detectEntityChanges, ensureListActions, entityDetailsCreateActions, entityDetailsCrudActions, entityDetailsEditAction, entityDetailsReferenceCondition, entityDetailsReferenceCreateActions, entityDetailsSimpleCondition, entityMasterBulkDeleteAction, entityMasterCreateAction, entityMasterCrudActions, entityMasterDeleteAction, entityMasterRecordActions, entityMasterViewAction, entityOverrideDetailsViewAction, eventDispatchMiddleware };
 //# sourceMappingURL=acorex-platform-layout-entity.mjs.map