@acorex/platform 19.2.17-next.0 → 19.2.19

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

@@ -1,9 +1,9 @@
 import { applySortArray, applyFilterArray, AXPExpressionEvaluatorService } from '@acorex/platform/core';
 import Dexie from 'dexie';
 import * as i1$4 from '@acorex/platform/common';
-import { AXPDataGenerator, resolveActionLook, AXPFilterOperatorMiddlewareService, AXPEntityCommandScope, getEntityInfo, AXPSettingService, AXPRefreshEvent, AXPSettingScope, AXPWorkflowNavigateAction, AXP_SEARCH_DEFINITION_PROVIDER, AXPToastAction } from '@acorex/platform/common';
+import { AXPDataGenerator, resolveActionLook, AXPFilterOperatorMiddlewareService, AXPEntityCommandScope, getEntityInfo, AXPSettingService, AXPRefreshEvent, AXPSettingScope, AXPCleanNestedFilters, AXPWorkflowNavigateAction, AXPToastAction, AXP_SEARCH_DEFINITION_PROVIDER } from '@acorex/platform/common';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injectable, computed, signal, Injector, effect, Component, ChangeDetectionStrategy, HostBinding, DestroyRef, ViewChild, NgModule } from '@angular/core';
+import { InjectionToken, inject, Injectable, computed, signal, Injector, effect, HostBinding, ChangeDetectionStrategy, Component, DestroyRef, ViewChild, NgModule } from '@angular/core';
 import * as i2 from '@acorex/components/common';
 import { AXDataSource, AXCommonModule } from '@acorex/components/common';
 import { AXFormatService } from '@acorex/core/format';
@@ -11,7 +11,7 @@ import * as i2$2 from '@acorex/platform/workflow';
 import { AXPWorkflowService, ofType, createWorkFlowEvent, AXPWorkflowAction, AXPWorkflowModule } from '@acorex/platform/workflow';
 import { get, cloneDeep, set, merge, isNil, sortBy } from 'lodash-es';
 import * as i7 from '@acorex/platform/layout/builder';
-import { AXPPageStatus, AXPWidgetRegistryService, AXPWidgetComponent, AXPLayoutBuilderModule, AXPColumnWidgetComponent, AXP_WIDGETS_EDITOR_GROUP, AXPWidgetsCatalog } from '@acorex/platform/layout/builder';
+import { AXPPageStatus, AXPWidgetRegistryService, AXPWidgetComponent, AXPLayoutBuilderModule, AXPColumnWidgetComponent, AXPWidgetsCatalog, AXP_WIDGETS_EDITOR_GROUP } from '@acorex/platform/layout/builder';
 import { AXPLayoutThemeService } from '@acorex/platform/themes/shared';
 import { AXPSessionService, AXPAuthGuard } from '@acorex/platform/auth';
 import { Subject, takeUntil } from 'rxjs';
@@ -37,7 +37,7 @@ import { AXFormModule } from '@acorex/components/form';
 import * as i5$1 from '@acorex/components/select-box';
 import { AXSelectBoxModule } from '@acorex/components/select-box';
 import * as i2$1 from '@acorex/components/text-box';
-import { AXTextBoxComponent, AXTextBoxModule } from '@acorex/components/text-box';
+import { AXTextBoxModule, AXTextBoxComponent } from '@acorex/components/text-box';
 import { AXValidationModule } from '@acorex/core/validation';
 import * as i1$3 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
@@ -1131,7 +1131,7 @@ class AXPEntityMasterListViewModel {
             this.inlineFilters.filters?.length && this.inlineFilters,
             this.simpleFilters().filters?.length && this.simpleFilters(),
         ].filter(Boolean);
-        const cleanedAllFilters = this.cleanNestedFilters(allFilters);
+        const cleanedAllFilters = AXPCleanNestedFilters(allFilters);
         this.lastFiltersApplied.set(this.simpleFilters());
         this.dataSource.filter(this.filterOperatorMiddleware.transformFilter({
             field: null,
@@ -1141,28 +1141,6 @@ class AXPEntityMasterListViewModel {
         }));
         this.dataSource.refresh();
     }
-    cleanNestedFilters(filters) {
-        return filters
-            .map((filter) => {
-            if (!filter)
-                return undefined;
-            if (filter.filters?.length) {
-                const cleanedNestedFilters = this.cleanNestedFilters(filter.filters);
-                if (!filter.field && !filter.operator && cleanedNestedFilters.length === 0) {
-                    return undefined;
-                }
-                return {
-                    ...filter,
-                    filters: cleanedNestedFilters.filter(Boolean),
-                };
-            }
-            if (!filter.value || filter.value === 'unknown') {
-                return undefined;
-            }
-            return filter;
-        })
-            .filter(Boolean);
-    }
     resetColumns() {
         this.applyViewColumns();
     }
@@ -1275,25 +1253,42 @@ class AXPEntityPerformDeleteAction extends AXPWorkflowAction {
     }
     async execute(context) {
         const moduleEntity = context.getVariable('entity');
-        const [moduleName, entityName] = moduleEntity.split('.');
         const data = context.getVariable('data');
         const meta = context.getVariable('meta');
         const options = context.getVariable('options');
         const process = options?.['process'];
         const showResult = process?.showResult ?? true;
-        const ids = Array.isArray(data) ? data.map((c) => c.id) : [data.id];
-        const entity = await this.entityRegistery.resolve(moduleName, entityName);
-        if (entity.parentKey && data[entity.parentKey]) {
-            context.setVariable('meta', { ...meta, refreshTargetId: data[entity.parentKey] });
+        const entities = [];
+        if (moduleEntity != null) {
+            const ids = Array.isArray(data) ? data.map((c) => c.id) : [data.id];
+            entities.push({
+                source: moduleEntity,
+                ids: ids,
+            });
         }
+        else {
+            const listEntities = context.getVariable('entities');
+            entities.push(...listEntities);
+        }
+        const entityDefinitions = {};
         let deletedCount = 0;
         context.setVariable('deleteSuccessful', false);
+        for await (const entity of entities) {
+            const [moduleName, entityName] = entity.source.split('.');
+            const entityDefinition = await this.entityRegistery.resolve(moduleName, entityName);
+            if (entityDefinition.parentKey && data[entityDefinition.parentKey]) {
+                context.setVariable('meta', { ...meta, refreshTargetId: data[entityDefinition.parentKey] });
+            }
+            entityDefinitions[entity.source] = entityDefinition;
+        }
+        // Compute consolidated ids from all entities
+        const idLength = entities.reduce((acc, curr) => acc + curr.ids.length, 0);
         const dialog = this.loadingDialog.show({
             title: await this.translationService.translateAsync('workflow.deleting'),
             mode: 'determinate',
             status: 'Deleting...',
             progressValue: 0,
-            text: `0/${ids.length}`,
+            text: `0/${idLength}`,
             buttons: [
                 {
                     text: await this.translationService.translateAsync('cancel'),
@@ -1304,68 +1299,75 @@ class AXPEntityPerformDeleteAction extends AXPWorkflowAction {
                 },
             ],
         });
-        if (entity.commands?.delete != null) {
-            const deleteExec = entity.commands?.delete?.execute;
-            const wrappedPromises = ids
-                .map((id, i) => {
-                return new Promise((resolve) => {
-                    setTimeout(() => {
-                        resolve(deleteExec(id));
-                    }, i * 200);
-                });
-            })
-                .map((p) => p?.then((value) => {
-                deletedCount++;
-                dialog.setProgressText(`${deletedCount}/${ids.length}`);
-                dialog.setProgressValue((deletedCount / ids.length) * 100);
-                return { status: 'fulfilled', value };
-            }, (reason) => ({ status: 'rejected', reason })));
-            const results = await Promise.all(wrappedPromises);
-            const successfulPromises = results.filter((result) => result?.status === 'fulfilled').length;
-            const failedPromises = results.filter((result) => result?.status === 'rejected').length;
-            setTimeout(() => {
-                dialog.close();
-            }, 300);
-            // Handle different scenarios for alerts
-            if (successfulPromises > 0 && failedPromises === 0) {
-                // All items deleted successfully
-                if (showResult) {
-                    await this.dialogService.alert(await this.translationService.translateAsync('workflow.success-delete-title'), await this.translationService.translateAsync('workflow.success-delete-body', {
-                        params: { item: successfulPromises },
-                    }), //TODO test translation
-                    'success');
-                }
-                // Dispatch actions
-                this.dispatch(AXPEntityDeletedEvent({ entity: moduleEntity, ids: ids, meta: meta }));
-                this.dispatch(AXPRefreshEvent({ entity: moduleEntity, meta: context.getVariable('meta') }));
+        let allPromises = [];
+        for (const entity of entities) {
+            const entityDefinition = entityDefinitions[entity.source];
+            if (entityDefinition.commands?.delete != null) {
+                const deleteExec = entityDefinition.commands?.delete?.execute;
+                const entityPromises = entity.ids
+                    .map((id, i) => {
+                    return new Promise((resolve) => {
+                        setTimeout(() => {
+                            resolve(deleteExec(id));
+                        }, i * 200);
+                    });
+                })
+                    .map((p) => p?.then((value) => {
+                    deletedCount++;
+                    dialog.setProgressText(`${deletedCount}/${idLength}`);
+                    dialog.setProgressValue((deletedCount / idLength) * 100);
+                    return { status: 'fulfilled', value };
+                }, (reason) => ({ status: 'rejected', reason })));
+                allPromises = allPromises.concat(entityPromises);
             }
-            else if (successfulPromises > 0 && failedPromises > 0) {
-                // Some items deleted successfully, some failed
-                if (showResult) {
-                    await this.dialogService.alert(await this.translationService.translateAsync('workflow.success-partial-delete-title'), await this.translationService.translateAsync('workflow.partial-delete-body', {
-                        params: { success: successfulPromises, fail: failedPromises },
-                    }), 'warning');
-                }
-                // Dispatch actions
-                this.dispatch(AXPEntityDeletedEvent({ entity: moduleEntity, ids: ids, meta: meta }));
+            else {
+                throw new Error(`The delete operation cannot be performed on ${entityDefinition.title}. This action might be restricted or not applicable for the selected item.`);
             }
-            else if (successfulPromises === 0 && failedPromises > 0) {
-                // No items deleted, all failed
-                if (showResult) {
-                    await this.dialogService.alert(await this.translationService.translateAsync('workflow.fail-delete-title'), await this.translationService.translateAsync('workflow.fail-delete-body', {
-                        params: { item: failedPromises },
-                    }), 'danger');
-                }
+        }
+        const results = await Promise.all(allPromises);
+        const successfulPromises = results.filter((result) => result?.status === 'fulfilled').length;
+        const failedPromises = results.filter((result) => result?.status === 'rejected').length;
+        setTimeout(() => {
+            dialog.close();
+        }, 300);
+        // Store the last entity for use in event dispatching
+        const lastEntity = entities[entities.length - 1];
+        // Handle different scenarios for alerts
+        if (successfulPromises > 0 && failedPromises === 0) {
+            // All items deleted successfully
+            if (showResult) {
+                await this.dialogService.alert(await this.translationService.translateAsync('workflow.success-delete-title'), await this.translationService.translateAsync('workflow.success-delete-body', {
+                    params: { item: successfulPromises },
+                }), //TODO test translation
+                'success');
             }
-            else {
-                // No items to delete (no successful or failed promises)
-                if (showResult) {
-                    await this.dialogService.alert(await this.translationService.translateAsync('workflow.no-need'), await this.translationService.translateAsync('workflow.no-item'), 'primary');
-                }
+            // Dispatch actions
+            this.dispatch(AXPEntityDeletedEvent({ entity: lastEntity.source, ids: lastEntity.ids, meta: meta }));
+            this.dispatch(AXPRefreshEvent({ entity: lastEntity.source, meta: context.getVariable('meta') }));
+        }
+        else if (successfulPromises > 0 && failedPromises > 0) {
+            // Some items deleted successfully, some failed
+            if (showResult) {
+                await this.dialogService.alert(await this.translationService.translateAsync('workflow.success-partial-delete-title'), await this.translationService.translateAsync('workflow.partial-delete-body', {
+                    params: { success: successfulPromises, fail: failedPromises },
+                }), 'warning');
+            }
+            // Dispatch actions
+            this.dispatch(AXPEntityDeletedEvent({ entity: lastEntity.source, ids: lastEntity.ids, meta: meta }));
+        }
+        else if (successfulPromises === 0 && failedPromises > 0) {
+            // No items deleted, all failed
+            if (showResult) {
+                await this.dialogService.alert(await this.translationService.translateAsync('workflow.fail-delete-title'), await this.translationService.translateAsync('workflow.fail-delete-body', {
+                    params: { item: failedPromises },
+                }), 'danger');
             }
         }
         else {
-            throw new Error(`The delete operation cannot be performed on ${entity.title}. This action might be restricted or not applicable for the selected item.`);
+            // No items to delete (no successful or failed promises)
+            if (showResult) {
+                await this.dialogService.alert(await this.translationService.translateAsync('workflow.no-need'), await this.translationService.translateAsync('workflow.no-item'), 'primary');
+            }
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPEntityPerformDeleteAction, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -2047,9 +2049,6 @@ var lookupWidgetView_component = /*#__PURE__*/Object.freeze({
 });
 
 class AXPLookupWidgetSelectorComponent extends AXBasePageComponent {
-    // protected override ngOnInit(): void {
-    //   super.ngOnInit();
-    // }
     ngAfterViewInit() {
         if (this.searchTerm) {
             this.vm.applyInlineFilter(this.searchTerm);
@@ -2152,7 +2151,7 @@ class AXPLookupWidgetSelectorComponent extends AXBasePageComponent {
         }
       </ax-suffix>
     </ax-footer>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXCommonModule }, { kind: "directive", type: i2.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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: i5.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "parentField", "rowTemplate", "emptyTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i6.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: i7.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXCommonModule }, { kind: "directive", type: i2.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.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: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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: i5.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "parentField", "rowTemplate", "emptyTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i6.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: i7.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPLookupWidgetSelectorComponent, decorators: [{
             type: Component,
@@ -2243,11 +2242,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
         }] });
 
 class AXPLookupWidgetSelectorViewModel {
-    constructor(injector, entityDef, parentFilters = null) {
+    constructor(injector, entityDef, parentFilters = null, customFilter = null) {
         this.injector = injector;
         this.entityDef = entityDef;
         this.parentFilters = parentFilters;
+        this.customFilter = customFilter;
         this.workflow = this.injector.get(AXPWorkflowService);
+        this.filterOperatorMiddleware = this.injector.get(AXPFilterOperatorMiddlewareService);
         this.dataSource = new AXDataSource({
             byKey: (key) => {
                 const func = this.entityDef.queries.byKey.execute;
@@ -2317,7 +2318,7 @@ class AXPLookupWidgetSelectorViewModel {
             this.applyFilterAndSort();
     }
     applyFilterAndSort() {
-        this.dataSource.clearFilter();
+        // this.dataSource.clearFilter();
         //
         //this.dataSource.sort(...this.sortedFields().map(s => ({ dir: s.dir, field: s.name } as AXDataSourceSortOption)));
         //
@@ -2326,6 +2327,11 @@ class AXPLookupWidgetSelectorViewModel {
         const hasParentFilters = (this.parentFilters?.filters?.length ?? 0) > 0;
         // Construct the filters array based on the presence of filters
         const filters = [];
+        console.log(this.customFilter);
+        if (this.customFilter) {
+            const cleanedFilters = AXPCleanNestedFilters([this.customFilter]);
+            filters.push(this.filterOperatorMiddleware.transformFilter(cleanedFilters[0]));
+        }
         if (hasInlineFilters) {
             filters.push(this.inlineFilters);
         }
@@ -2360,6 +2366,7 @@ class AXPLookupWidgetEditComponent extends AXPWidgetComponent {
         this.translateService = inject(AXTranslationService);
         this.expose = computed(() => this.options()['expose']);
         this.entity = computed(() => this.options()['entity']);
+        this.customFilter = computed(() => this.options()['filter']);
         this.textField = computed(() => {
             return (this.entityDef()?.formats.lookup ?? this.entityDef()?.properties.find((c) => c.name != 'id')?.name ?? 'title');
         });
@@ -2421,7 +2428,7 @@ class AXPLookupWidgetEditComponent extends AXPWidgetComponent {
             title: `${this.translateService.translateSync('widget.lookup.search')} ${this.translateService.translateSync(this.entityDef()?.formats.plural ?? '')}`,
             size: (this.vm()?.columns().length ?? 0) > 3 ? 'lg' : 'md',
             data: {
-                vm: new AXPLookupWidgetSelectorViewModel(this.injector, this.entityDef(), this.filter),
+                vm: new AXPLookupWidgetSelectorViewModel(this.injector, this.entityDef(), this.filter, this.customFilter()),
                 searchTerm: this.searchTerm() == this.displayText() ? null : this.searchTerm(),
             },
         })
@@ -2535,7 +2542,7 @@ class AXPLookupWidgetEditComponent extends AXPWidgetComponent {
         </ax-button>
       </ax-suffix>
     </ax-text-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: 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.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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: i6$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, 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: 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.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: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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: i6$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPLookupWidgetEditComponent, decorators: [{
             type: Component,
@@ -2848,7 +2855,9 @@ class AXPTagableBoxWidgetEditComponent extends AXPWidgetComponent {
         </ax-prefix>
       </ax-button>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: i6$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXSelectBoxModule }, { kind: "component", type: i5$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", "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: i6.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: CommonModule }, { 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: i6$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i4.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.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: 
+                //  AXTagBoxModule,
+                AXSelectBoxModule }, { kind: "component", type: i5$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", "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: i6.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: "19.0.3", ngImport: i0, type: AXPTagableBoxWidgetEditComponent, decorators: [{
             type: Component,
@@ -2901,6 +2910,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
                         AXDecoratorModule,
                         AXValidationModule,
                         AXButtonModule,
+                        //  AXTagBoxModule,
                         AXSelectBoxModule,
                         AXSearchBoxModule,
                     ],
@@ -3143,7 +3153,7 @@ class AXPWidgetSelectorWidgetEditComponent extends AXPWidgetComponent {
     <axp-widget-property-viewer [widget]="selectedWidgetNode()!" (onChanged)="handleChangeWidget($event)">
     </axp-widget-property-viewer>
     }
-  `, 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: 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.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.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: i6$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message"] }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget"], outputs: ["onChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, 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: 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.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: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.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: i6$1.AXValidationRuleDirective, selector: "ax-validation-rule", inputs: ["rule", "options", "message"] }, { kind: "component", type: AXPWidgetPropertyViewerComponent, selector: "axp-widget-property-viewer", inputs: ["widget"], outputs: ["onChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXPWidgetSelectorWidgetEditComponent, decorators: [{
             type: Component,
@@ -3484,7 +3494,9 @@ function routesFacory() {
     routes = [
         {
             path: ':app/m',
-            component: config.viewers.root(),
+            loadComponent: () => {
+                return config.viewers.root();
+            },
             canActivate: [AXPAuthGuard],
             children: [
                 {