@acorex-platform/framework-client 2.0.0-next.2 → 2.0.0-next.21

package/fesm2022/acorex-platform-framework-client-themes-default.mjs

@@ -48,7 +48,7 @@ import { RouterModule, Router, ActivatedRoute, NavigationStart, NavigationEnd, R
 import { Subject, takeUntil, filter, combineLatest, firstValueFrom, take } from 'rxjs';
 import { runtimeCommandPayloadData, isThemeSurfaceClass, isRuntimeHexSurfaceClass, AXP_THEME_SURFACE_STYLES, createRandomUuid, AXPKeyboardShortcutPriority } from '@acorex-platform/framework-shared/core';
 import * as i1$2 from '@acorex/core/platform';
-import { AXPSettingsService, AXPCommonSettings, axpIsEntityListRoute, axpReplaceEntityListRouteQueryParams, axpIsEntityListPath, AXPTabNavigationService, AXPTabPreviewService, AXP_HOME_TAB_KEY, axpResolveTabTitleParts, AXPMenuService, AXPMenuVisibilityService, axpMenuPathsMatch, AXPPlatformBrandingService, AXPTabRouteCacheRegistry, axpResolveTabKeyFromSnapshot, axpHasTabScope, axpPathFromSnapshot, axpIsTabEligibleUrl, axpResolveTabKeyFromRouteConfig, AXP_PROTECTED_ROUTE_GUARDS, AXPCommonModule } from '@acorex-platform/framework-client/common';
+import { AXPSettingsService, AXPCommonSettings, axpIsEntityListRoute, axpReplaceEntityListRouteQueryParams, axpIsEntityListPath, AXPTabNavigationService, AXPTabPreviewService, AXP_HOME_TAB_KEY, axpResolveTabTitleParts, AXPMenuService, AXPMenuVisibilityService, axpMenuPathsMatch, AXPPlatformBrandingService, AXPTabRouteCacheRegistry, axpResolveTabKeyFromSnapshot, axpSnapshotDeclaresTabScope, axpPathFromSnapshot, axpEntityListNavigationTabKey, axpIsTabEligibleUrl, axpResolveTabKeyFromRouteConfig, AXP_PROTECTED_ROUTE_GUARDS, AXPCommonModule } from '@acorex-platform/framework-client/common';
 import { DragDropModule, CdkDropList, CdkDrag, CdkDragHandle, CdkDragPreview } from '@angular/cdk/drag-drop';
 import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
 import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex-platform/framework-client/layout/views';
@@ -619,7 +619,7 @@ class AXPEntityDetailListViewComponent {
         this.destroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPEntityDetailListViewComponent, deps: [{ token: i1$1.AXActionSheetService }, { token: i2$1.AXUnsubscriber }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPEntityDetailListViewComponent, isStandalone: true, selector: "axp-entity-detail-list-view", inputs: { vm: ["viewModel", "vm"] }, providers: [AXUnsubscriber], viewQueries: [{ propertyName: "listDisplayModePopover", first: true, predicate: ["listDisplayModePopover"], descendants: true, isSignal: true }, { propertyName: "grid", first: true, predicate: ["grid"], descendants: true }], ngImport: i0, template: "<div class=\"flex p-2\">\n  <div class=\"flex flex-col items-stretch gap-3 flex-1 overflow-auto min-h-72\">\n    <div class=\"flex justify-between items-center w-full\">\n      <div class=\"flex justify-between items-center\">\n        <div class=\"flex justify-start items-center gap-4\">\n          @if (vm.hasSelectedItems()) {\n            <div class=\"flex gap-3 items-center h-10\">\n              <span class=\"text-xl font-bold\">\n                {{ vm.selectedItems().length }}\n                {{ '@general:terms.items-selected' | translate | async }}\n              </span>\n              <span\n                (click)=\"vm.clearSelection()\"\n                class=\"text-sm text-primary-500 underline cursor-pointer\"\n                >{{ '@general:actions.unselect.title' | translate | async }}</span\n              >\n            </div>\n          } @else {\n            @if (vm.hasInlineFilters() && !deviceService.isSmall()) {\n              <div class=\"w-72\">\n                <ax-search-box\n                  [placeholder]=\"\n                    ('@general:widgets.lookup.search' | translate | async) + vm.inlineFiltersPlaceholders().join(', ')\n                  \"\n                  (onValueChanged)=\"handleChangeSearchValue($event)\"\n                  ><ax-clear-button></ax-clear-button\n                ></ax-search-box>\n              </div>\n            }\n          }\n        </div>\n      </div>\n      <div class=\"flex items-center gap-3\">\n        @if (showListDisplayModeControl()) {\n          <div>\n            <ax-button [iconOnly]=\"true\" #listDisplayButton [color]=\"'default'\">\n              <i [class]=\"listDisplayModeButtonIcon()\"></i>\n            </ax-button>\n            <ax-popover\n              [adaptivityEnabled]=\"true\"\n              [offsetY]=\"10\"\n              [target]=\"listDisplayButton\"\n              [openOn]=\"'toggle'\"\n              [closeOn]=\"'clickOut'\"\n              #listDisplayModePopover\n            >\n              <div class=\"lightest-surface shadow-md border md:w-72 w-full rounded-md\">\n                <ax-header class=\"border-b lighter-surface rounded-t-md p-4 font-bold\">\n                  {{ '@general:terms.interface.list-display' | translate | async }}\n                </ax-header>\n                <div class=\"py-2 px-2\">\n                  <ax-button-item-list>\n                    @if (hasTableListDisplayOption()) {\n                      <ax-button-item\n                        [text]=\"('@general:terms.interface.table-view' | translate | async)!\"\n                        [selected]=\"listDisplayMode() === 'table'\"\n                        (onClick)=\"setListDisplayMode('table')\"\n                      >\n                        <ax-prefix>\n                          <i class=\"fa-light fa-table\"></i>\n                        </ax-prefix>\n                      </ax-button-item>\n                    }\n                    @if (hasTableListDisplayOption() && (hasCardListDisplayOption() || hasRowListDisplayOption())) {\n                      <ax-divider />\n                    }\n                    @if (hasCardListDisplayOption()) {\n                      <!-- ----- Card grid presentation ----- -->\n                      <ax-button-item\n                        [text]=\"('@general:terms.interface.card-view' | translate | async)!\"\n                        [selected]=\"listDisplayMode() === 'card'\"\n                        (onClick)=\"setListDisplayMode('card')\"\n                      >\n                        <ax-prefix>\n                          <i class=\"fa-light fa-grid-2\"></i>\n                        </ax-prefix>\n                      </ax-button-item>\n                    }\n                    @if (hasRowListDisplayOption()) {\n                      <!-- ----- Horizontal row-list presentation ----- -->\n                      <ax-button-item\n                        [text]=\"('@general:terms.interface.row-view' | translate | async)!\"\n                        [selected]=\"listDisplayMode() === 'row'\"\n                        (onClick)=\"setListDisplayMode('row')\"\n                      >\n                        <ax-prefix>\n                          <i class=\"fa-light fa-grip-lines\"></i>\n                        </ax-prefix>\n                      </ax-button-item>\n                    }\n                  </ax-button-item-list>\n                </div>\n              </div>\n            </ax-popover>\n          </div>\n        }\n        @for (tr of toolbarPrimaryActions(); track $index) {\n          <ax-button\n            [text]=\"(tr.title | translate | async)!\"\n            [color]=\"tr.color\"\n            [disabled]=\"tr.disabled\"\n            (onClick)=\"vm.executeCommand(tr.name)\"\n          >\n            <ax-prefix>\n              <ax-icon [icon]=\"tr.icon\"> </ax-icon>\n            </ax-prefix>\n          </ax-button>\n        }\n        @if (toolbarSecondaryActions().length) {\n          <ax-button\n            [text]=\"deviceService.isSmall() ? null : ('@general:terms.interface.actions' | translate | async)\"\n            [color]=\"'default'\"\n          >\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n            <ax-dropdown-panel>\n              <ax-button-item-list>\n                @for (tr of toolbarSecondaryActions(); track $index) {\n                  <ng-container>\n                    @if (tr.separated && !$first) {\n                      <ax-divider></ax-divider>\n                    }\n                    <ax-button-item\n                      [text]=\"(tr.title | translate | async)!\"\n                      class=\"font-semibold text-{{ tr.color }}\"\n                      (onClick)=\"vm.executeCommand(tr.name)\"\n                    >\n                      <ax-prefix>\n                        <ax-icon [icon]=\"tr.icon\"> </ax-icon>\n                      </ax-prefix>\n                    </ax-button-item>\n                  </ng-container>\n                }\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        }\n      </div>\n    </div>\n\n    @if (vm.enabledListLayouts().includes('table')) {\n      <div class=\"flex flex-1 pt-0 overflow-auto max-w-full w-full\" [class.hidden]=\"vm.activeListLayout() !== 'table'\">\n      <ax-data-table\n        #grid\n        [showFooter]=\"false\"\n        class=\"flex-1\"\n        [paging]=\"true\"\n        [fetchDataMode]=\"'manual'\"\n        [parentField]=\"vm.parentKey()\"\n        [loading]=\"{ enabled: true, animation: true }\"\n        [dataSource]=\"vm.dataSource\"\n        (selectedRowsChange)=\"handleSelectedRowsChange($event)\"\n        (onRowDbClick)=\"handleRowDbClick($event)\"\n      >\n        @if (vm.showIndexColumn()) {\n          <ax-index-column\n            [caption]=\"('@general:terms.common.row-number' | translate | async)!\"\n            fixed=\"start\"\n            [width]=\"'80px'\"\n            [padZero]=\"false\"\n          ></ax-index-column>\n        }\n        @if (vm.selectedScopeActionsCount()) {\n          <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n        }\n        @for (col of vm.columns(); track col.name) {\n          @if (col.visible) {\n            <axp-widget-column-renderer\n              [expandHandler]=\"$index === 0 && vm.parentKey() ? true : false\"\n              [caption]=\"(col.title | translate | async)!\"\n              [node]=\"col.node()\"\n            ></axp-widget-column-renderer>\n          }\n        }\n        @if (getCommandRowItems().length) {\n          <ax-command-column\n            fixed=\"end\"\n            [width]=\"getCommandRowItems().length * 60 + 'px'\"\n            [items]=\"getCommandRowItems()\"\n            (onItemClick)=\"handleRowCommandClick($event)\"\n          ></ax-command-column>\n        }\n        @if (dropdownRowItems().length) {\n          <ax-dropdown-command-column\n            fixed=\"end\"\n            [width]=\"'60px'\"\n            [items]=\"getDropdownRowItems\"\n            (onItemClick)=\"handleRowCommandClick($event)\"\n          ></ax-dropdown-command-column>\n        }\n      </ax-data-table>\n      </div>\n    }\n    @if (vm.enabledListLayouts().includes('card') || vm.enabledListLayouts().includes('row')) {\n      <axp-entity-master-list-card-list\n        class=\"axp-entity-list-host w-full min-h-0 flex-1\"\n        [class.hidden]=\"!vm.isCardHostLayout()\"\n        [vm]=\"vm\"\n      ></axp-entity-master-list-card-list>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i3.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i3.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$2.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i2$2.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: AXBadgeModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "closeOnNavigation", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "ngmodule", type: AXActionSheetModule }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "ngmodule", type: AXDialogModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTabsModule }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i7.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i8.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "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: i8.AXRowIndexColumnComponent, selector: "ax-index-column", inputs: ["width", "caption", "fixed", "footerTemplate", "padZero"] }, { kind: "component", type: i8.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed", "advanceSelect"] }, { kind: "component", type: i8.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i8.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "emptyStateTemplate", "emptyStateText", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPEntityDetailListViewComponent, isStandalone: true, selector: "axp-entity-detail-list-view", inputs: { vm: ["viewModel", "vm"] }, providers: [AXUnsubscriber], viewQueries: [{ propertyName: "listDisplayModePopover", first: true, predicate: ["listDisplayModePopover"], descendants: true, isSignal: true }, { propertyName: "grid", first: true, predicate: ["grid"], descendants: true }], ngImport: i0, template: "<div class=\"flex p-2\">\n  <div class=\"flex flex-col items-stretch gap-3 flex-1 overflow-auto min-h-72\">\n    <div class=\"flex justify-between items-center w-full\">\n      <div class=\"flex justify-between items-center\">\n        <div class=\"flex justify-start items-center gap-4\">\n          @if (vm.hasSelectedItems()) {\n            <div class=\"flex gap-3 items-center h-10\">\n              <span class=\"text-xl font-bold\">\n                {{ vm.selectedItems().length }}\n                {{ '@general:terms.items-selected' | translate | async }}\n              </span>\n              <span\n                (click)=\"vm.clearSelection()\"\n                class=\"text-sm text-primary-500 underline cursor-pointer\"\n                >{{ '@general:actions.unselect.title' | translate | async }}</span\n              >\n            </div>\n          } @else {\n            @if (vm.hasInlineFilters() && !deviceService.isSmall()) {\n              <div class=\"w-72\">\n                <ax-search-box\n                  [placeholder]=\"\n                    ('@general:widgets.lookup.search' | translate | async) + vm.inlineFiltersPlaceholders().join(', ')\n                  \"\n                  (onValueChanged)=\"handleChangeSearchValue($event)\"\n                  ><ax-clear-button></ax-clear-button\n                ></ax-search-box>\n              </div>\n            }\n          }\n        </div>\n      </div>\n      <div class=\"flex items-center gap-3\">\n        @if (showListDisplayModeControl()) {\n          <div>\n            <ax-button [iconOnly]=\"true\" #listDisplayButton [color]=\"'default'\">\n              <i [class]=\"listDisplayModeButtonIcon()\"></i>\n            </ax-button>\n            <ax-popover\n              [adaptivityEnabled]=\"true\"\n              [offsetY]=\"10\"\n              [target]=\"listDisplayButton\"\n              [openOn]=\"'toggle'\"\n              [closeOn]=\"'clickOut'\"\n              #listDisplayModePopover\n            >\n              <div class=\"lightest-surface shadow-md border md:w-72 w-full rounded-md\">\n                <ax-header class=\"border-b lighter-surface rounded-t-md p-4 font-bold\">\n                  {{ '@general:terms.interface.list-display' | translate | async }}\n                </ax-header>\n                <div class=\"py-2 px-2\">\n                  <ax-button-item-list>\n                    @if (hasTableListDisplayOption()) {\n                      <ax-button-item\n                        [text]=\"('@general:terms.interface.table-view' | translate | async)!\"\n                        [selected]=\"listDisplayMode() === 'table'\"\n                        (onClick)=\"setListDisplayMode('table')\"\n                      >\n                        <ax-prefix>\n                          <i class=\"fa-light fa-table\"></i>\n                        </ax-prefix>\n                      </ax-button-item>\n                    }\n                    @if (hasTableListDisplayOption() && (hasCardListDisplayOption() || hasRowListDisplayOption())) {\n                      <ax-divider />\n                    }\n                    @if (hasCardListDisplayOption()) {\n                      <!-- ----- Card grid presentation ----- -->\n                      <ax-button-item\n                        [text]=\"('@general:terms.interface.card-view' | translate | async)!\"\n                        [selected]=\"listDisplayMode() === 'card'\"\n                        (onClick)=\"setListDisplayMode('card')\"\n                      >\n                        <ax-prefix>\n                          <i class=\"fa-light fa-grid-2\"></i>\n                        </ax-prefix>\n                      </ax-button-item>\n                    }\n                    @if (hasRowListDisplayOption()) {\n                      <!-- ----- Horizontal row-list presentation ----- -->\n                      <ax-button-item\n                        [text]=\"('@general:terms.interface.row-view' | translate | async)!\"\n                        [selected]=\"listDisplayMode() === 'row'\"\n                        (onClick)=\"setListDisplayMode('row')\"\n                      >\n                        <ax-prefix>\n                          <i class=\"fa-light fa-grip-lines\"></i>\n                        </ax-prefix>\n                      </ax-button-item>\n                    }\n                  </ax-button-item-list>\n                </div>\n              </div>\n            </ax-popover>\n          </div>\n        }\n        @for (tr of toolbarPrimaryActions(); track $index) {\n          <ax-button\n            [text]=\"(tr.title | translate | async)!\"\n            [color]=\"tr.color\"\n            [disabled]=\"tr.disabled\"\n            (onClick)=\"vm.executeCommand(tr.name)\"\n          >\n            <ax-prefix>\n              <ax-icon [icon]=\"tr.icon\"> </ax-icon>\n            </ax-prefix>\n          </ax-button>\n        }\n        @if (toolbarSecondaryActions().length) {\n          <ax-button\n            [text]=\"deviceService.isSmall() ? null : ('@general:terms.interface.actions' | translate | async)\"\n            [color]=\"'default'\"\n          >\n            <ax-prefix>\n              <i class=\"fa-solid fa-ellipsis-vertical\"></i>\n            </ax-prefix>\n            <ax-dropdown-panel>\n              <ax-button-item-list>\n                @for (tr of toolbarSecondaryActions(); track $index) {\n                  <ng-container>\n                    @if (tr.separated && !$first) {\n                      <ax-divider></ax-divider>\n                    }\n                    <ax-button-item\n                      [text]=\"(tr.title | translate | async)!\"\n                      class=\"font-semibold text-{{ tr.color }}\"\n                      (onClick)=\"vm.executeCommand(tr.name)\"\n                    >\n                      <ax-prefix>\n                        <ax-icon [icon]=\"tr.icon\"> </ax-icon>\n                      </ax-prefix>\n                    </ax-button-item>\n                  </ng-container>\n                }\n              </ax-button-item-list>\n            </ax-dropdown-panel>\n          </ax-button>\n        }\n      </div>\n    </div>\n\n    @if (vm.enabledListLayouts().includes('table')) {\n      <div class=\"flex flex-1 pt-0 overflow-auto max-w-full w-full\" [class.hidden]=\"vm.activeListLayout() !== 'table'\">\n      <ax-data-table\n        #grid\n        [showFooter]=\"false\"\n        class=\"flex-1\"\n        [paging]=\"true\"\n        [fetchDataMode]=\"'manual'\"\n        [parentField]=\"vm.parentKey()\"\n        [loading]=\"{ enabled: true, animation: true }\"\n        [dataSource]=\"vm.dataSource\"\n        (selectedRowsChange)=\"handleSelectedRowsChange($event)\"\n        (onRowDbClick)=\"handleRowDbClick($event)\"\n      >\n        @if (vm.showIndexColumn()) {\n          <ax-index-column\n            [caption]=\"('@general:terms.common.row-number' | translate | async)!\"\n            fixed=\"start\"\n            [width]=\"'80px'\"\n            [padZero]=\"false\"\n          ></ax-index-column>\n        }\n        @if (vm.selectedScopeActionsCount()) {\n          <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n        }\n        @for (col of vm.columns(); track col.name) {\n          @if (col.visible) {\n            <axp-widget-column-renderer\n              [expandHandler]=\"$index === 0 && vm.parentKey() ? true : false\"\n              [caption]=\"(col.title | translate | async)!\"\n              [node]=\"col.node()\"\n            ></axp-widget-column-renderer>\n          }\n        }\n        @if (getCommandRowItems().length) {\n          <ax-command-column\n            fixed=\"end\"\n            [width]=\"getCommandRowItems().length * 60 + 'px'\"\n            [items]=\"getCommandRowItems()\"\n            (onItemClick)=\"handleRowCommandClick($event)\"\n          ></ax-command-column>\n        }\n        @if (dropdownRowItems().length) {\n          <ax-dropdown-command-column\n            fixed=\"end\"\n            [width]=\"'60px'\"\n            [items]=\"getDropdownRowItems\"\n            (onItemClick)=\"handleRowCommandClick($event)\"\n          ></ax-dropdown-command-column>\n        }\n      </ax-data-table>\n      </div>\n    }\n    @if (vm.enabledListLayouts().includes('card') || vm.enabledListLayouts().includes('row')) {\n      <axp-entity-master-list-card-list\n        class=\"axp-entity-list-host w-full min-h-0 flex-1\"\n        [class.hidden]=\"!vm.isCardHostLayout()\"\n        [vm]=\"vm\"\n      ></axp-entity-master-list-card-list>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i3.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i3.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$2.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i2$2.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: AXBadgeModule }, { kind: "ngmodule", type: AXDropdownModule }, { kind: "component", type: i5.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "placement", "_target", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "restoreFocusOnClose", "openAfter", "closeAfter", "closeOnScroll", "closeOnNavigation", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "ngmodule", type: AXActionSheetModule }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "ngmodule", type: AXDialogModule }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTabsModule }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i7.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i8.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "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: i8.AXRowIndexColumnComponent, selector: "ax-index-column", inputs: ["width", "caption", "fixed", "footerTemplate", "padZero"] }, { kind: "component", type: i8.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed", "advanceSelect"] }, { kind: "component", type: i8.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i8.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "emptyStateTemplate", "emptyStateText", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: 
                 //
                 AXPWidgetCoreModule }, { kind: "component", type: i7$1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "columnKey", "node", "footerTemplate", "expandHandler", "sortEnabled", "headerSortDirection", "headerSortPriority", "columnFixed", "cellTemplate", "headerTemplate"], outputs: ["sortToggle"] }, { kind: "ngmodule", type: AXPWidgetsModule }, { kind: "ngmodule", type: AXPAuthModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXPEntityMasterListCardListComponent, selector: "axp-entity-master-list-card-list", inputs: ["vm", "userStylingRules"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
@@ -2165,7 +2165,7 @@ class AXPEntityMasterToolbarViewComponent {
             .join('|');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPEntityMasterToolbarViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPEntityMasterToolbarViewComponent, isStandalone: true, selector: "axp-entity-master-toolbar-view", inputs: { vm: ["viewModel", "vm"] }, host: { classAttribute: "w-full" }, viewQueries: [{ propertyName: "viewPopover", first: true, predicate: ["viewPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "<axp-query-view-tabs\n  id=\"axp-toolbar-view-selector\"\n  [views]=\"viewQueries()\"\n  [selectedView]=\"selectedViewQuery()\"\n  (selectedViewChange)=\"onViewChanged($event)\"\n  (edit)=\"onEditQueryView($event)\"\n  (remove)=\"onDeleteQueryView($event)\"\n></axp-query-view-tabs>\n<div\n  class=\"axp-entity-master-toolbar__row flex w-full flex-wrap items-center border-b border-light\"\n  [class.min-w-0]=\"deviceService.isSmall()\"\n  [class.gap-2]=\"!deviceService.isSmall()\"\n  [class.gap-1]=\"deviceService.isSmall()\"\n>\n  <!-- ----- Filter chips, search, and Ctrl+F stay on the leading edge ----- -->\n  @if (filtersReady()) {\n    <axp-query-filters\n      id=\"axp-toolbar-filters\"\n      class=\"min-w-0 flex-1\"\n      [filtersDefinitions]=\"filtersDefinitions()\"\n      [initialFilters]=\"initialFilters()\"\n      [quickSearch]=\"true\"\n      [mode]=\"vm.filterMode()\"\n      [sortPresets]=\"mobileSortPresets()\"\n      [activeSortPresetName]=\"activeSortPresetName()\"\n      (onFiltersChanged)=\"onFiltersChanged($event)\"\n      (onSortPresetSelected)=\"onSortPresetSelected($event)\"\n    ></axp-query-filters>\n  }\n\n  <div\n    class=\"axp-toolbar-list-tools ms-auto flex shrink-0 items-center gap-1\"\n  >\n    <!-- ----- Apply pending filters when the list is in manual apply mode ----- -->\n    @if (filterTriggerMode === 'manual' && isFiltersDirty()) {\n      <ax-button\n        id=\"axp-toolbar-btn-filter\"\n        [title]=\"'@general:actions.apply.title'\"\n        [iconOnly]=\"true\"\n        [color]=\"'primary'\"\n        (onClick)=\"applyFilters()\"\n      >\n        <ax-prefix>\n          <i class=\"fa-light fa-search\" aria-hidden=\"true\"></i>\n        </ax-prefix>\n      </ax-button>\n    }\n    <!-- ----- Save View appears when the list layout is dirty ----- -->\n    <axp-query-view-save-button\n      [visible]=\"vm.canSaveActiveQueryView()\"\n      (save)=\"onSaveQueryView()\"\n    ></axp-query-view-save-button>\n\n    <!-- ----- Sort stays a direct button on larger screens ----- -->\n    @if (vm.canSort() && !deviceService.isSmall()) {\n      <div class=\"axp-toolbar-btn-host\">\n        <ax-button\n          id=\"axp-toolbar-btn-sort\"\n          class=\"axp-toolbar-btn axp-toolbar-btn-sort\"\n          [class.axp-toolbar-btn--active]=\"activeSortCount() > 0\"\n          [look]=\"'outline'\"\n          [iconOnly]=\"true\"\n          [color]=\"activeSortCount() > 0 ? 'primary' : 'default'\"\n          [attr.aria-expanded]=\"sortMenuOpen()\"\n          [attr.aria-haspopup]=\"'dialog'\"\n          [title]=\"\n            (activeSortCount() > 0\n              ? ('@general:terms.interface.sort.button-active' | translate: { params: { count: activeSortCount() } } | async)\n              : ('@general:actions.sort.title' | translate | async)) ?? ''\n          \"\n          #sortButton\n        >\n          <ax-prefix>\n            <i class=\"fa-light fa-sort-amount-up\" aria-hidden=\"true\"></i>\n          </ax-prefix>\n        </ax-button>\n        <ax-popover\n          id=\"axp-popover-sort\"\n          [adaptivityEnabled]=\"true\"\n          [offsetY]=\"8\"\n          [target]=\"sortButton\"\n          [openOn]=\"'toggle'\"\n          [closeOn]=\"'clickOut'\"\n          (onOpened)=\"sortMenuOpen.set(true)\"\n          (onClosed)=\"sortMenuOpen.set(false)\"\n          #sortPopover\n        >\n          <div class=\"axp-toolbar-popover lightest-surface shadow-md border md:w-96 w-full rounded-md overflow-hidden\">\n            <axp-query-sorts\n              [sortDefinitions]=\"sortDefinitions()\"\n              [sortPresets]=\"vm.sortPresets()\"\n              [defaultSortQueries]=\"defaultSortQueries()\"\n              (sortQueriesChange)=\"onSortQueriesChange($event)\"\n              [initialSortQueries]=\"sortQueries()\"\n            ></axp-query-sorts>\n          </div>\n        </ax-popover>\n      </div>\n    }\n\n    <!-- ----- On small screens this button also holds sort and category ----- -->\n    <div class=\"axp-toolbar-btn-host\">\n      <ax-button\n        id=\"axp-toolbar-btn-view\"\n        class=\"axp-toolbar-btn axp-toolbar-btn-view\"\n        [class.axp-toolbar-btn--open]=\"viewMenuOpen()\"\n        [class.axp-toolbar-btn--active]=\"deviceService.isSmall() && activeSortCount() > 0\"\n        [look]=\"'outline'\"\n        [iconOnly]=\"true\"\n        [color]=\"deviceService.isSmall() && activeSortCount() > 0 ? 'primary' : 'default'\"\n        [attr.aria-expanded]=\"viewMenuOpen()\"\n        [attr.aria-haspopup]=\"'menu'\"\n        [title]=\"((deviceService.isSmall()\n          ? '@general:terms.interface.view.list-options'\n          : '@general:terms.interface.view.menu-button') | translate | async) ?? ''\"\n        #viewButton\n      >\n        <ax-prefix>\n          <i class=\"fa-light fa-sliders\" aria-hidden=\"true\"></i>\n        </ax-prefix>\n      </ax-button>\n      <ax-popover\n        id=\"axp-popover-view\"\n        [adaptivityEnabled]=\"true\"\n        [offsetY]=\"8\"\n        [target]=\"viewButton\"\n        [openOn]=\"'toggle'\"\n        [closeOn]=\"'clickOut'\"\n        (onOpened)=\"onViewMenuOpened()\"\n        (onClosed)=\"onViewMenuClosed()\"\n        #viewPopover\n      >\n        <div\n          class=\"axp-toolbar-popover axp-toolbar-view-menu lightest-surface shadow-md border max-w-full overflow-hidden\"\n          [class.w-72]=\"!deviceService.isSmall()\"\n          [class.rounded-md]=\"!deviceService.isSmall()\"\n          [class.w-full]=\"deviceService.isSmall()\"\n          [class.axp-toolbar-view-menu--sheet]=\"deviceService.isSmall()\"\n        >\n          <!-- ----- Nested sort panel on small screens ----- -->\n          @if (viewMenuPanel() === 'sort') {\n            <div class=\"axp-toolbar-view-menu__header flex items-center justify-between gap-2 border-b border-light px-3 py-2\">\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'default'\"\n                [title]=\"('@general:actions.back.title' | translate | async) ?? ''\"\n                (onClick)=\"viewMenuPanel.set('root')\"\n              >\n                <ax-prefix>\n                  <i class=\"fa-light fa-chevron-left rtl:rotate-180\" aria-hidden=\"true\"></i>\n                </ax-prefix>\n              </ax-button>\n              <span class=\"min-w-0 flex-1 truncate font-bold\">\n                {{ '@general:terms.interface.sort.title' | translate | async }}\n              </span>\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'primary'\"\n                [disabled]=\"!canResetSorts()\"\n                [text]=\"'@general:terms.interface.sort.clear' | translate | async\"\n                (onClick)=\"resetSortsFromMenu()\"\n              ></ax-button>\n            </div>\n            <div class=\"axp-toolbar-view-menu__body axp-toolbar-sort-panel\">\n              <axp-query-sorts\n                [sortDefinitions]=\"sortDefinitions()\"\n                [sortPresets]=\"vm.sortPresets()\"\n                [defaultSortQueries]=\"defaultSortQueries()\"\n                (sortQueriesChange)=\"onSortQueriesChange($event)\"\n                [initialSortQueries]=\"sortQueries()\"\n              ></axp-query-sorts>\n            </div>\n          }\n          <!-- ----- Nested column visibility panel ----- -->\n          @else if (viewMenuPanel() === 'columns') {\n            <div class=\"axp-toolbar-view-menu__header flex items-center justify-between gap-2 border-b border-light px-3 py-2\">\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'default'\"\n                [title]=\"('@general:actions.back.title' | translate | async) ?? ''\"\n                (onClick)=\"viewMenuPanel.set('root')\"\n              >\n                <ax-prefix>\n                  <i class=\"fa-light fa-chevron-left rtl:rotate-180\" aria-hidden=\"true\"></i>\n                </ax-prefix>\n              </ax-button>\n              <span class=\"min-w-0 flex-1 truncate font-bold\">\n                {{ '@general:terms.common.columns' | translate | async }}\n              </span>\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'primary'\"\n                [text]=\"'@general:actions.reset.title' | translate | async\"\n                (onClick)=\"resetViewColumns()\"\n              ></ax-button>\n            </div>\n            <div class=\"axp-toolbar-view-menu__body px-4 py-3\">\n              <axp-query-columns\n                [columns]=\"vm.columns()\"\n                [constrainHeight]=\"false\"\n                (columnsChange)=\"onColumnsChange($event)\"\n              ></axp-query-columns>\n            </div>\n          }\n          <!-- ----- Root presentation menu ----- -->\n          @else {\n            <div class=\"axp-toolbar-view-menu__header border-b border-light px-4 py-3 font-bold\">\n              {{ (deviceService.isSmall()\n                ? '@general:terms.interface.view.list-options'\n                : '@general:terms.interface.view.menu-title') | translate | async }}\n            </div>\n            <div class=\"axp-toolbar-view-menu__body py-2\">\n              <!--------------------------------------------------------------->\n              <!-- ----- Sort opens the sort panel on small screens ----- -->\n              @if (deviceService.isSmall() && vm.canSort()) {\n                <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                  {{ '@general:actions.sort.title' | translate | async }}\n                </div>\n                <ax-button-item-list>\n                  <ax-button-item\n                    [text]=\"(activeSortCount() > 0\n                      ? ('@general:terms.interface.sort.button-active' | translate: { params: { count: activeSortCount() } } | async)\n                      : ('@general:terms.interface.sort.title' | translate | async))!\"\n                    (onClick)=\"openViewSortPanel()\"\n                  >\n                    <ax-prefix>\n                      <i class=\"fa-light fa-sort-amount-up\" aria-hidden=\"true\"></i>\n                    </ax-prefix>\n                    <ax-suffix>\n                      <i class=\"fa-light fa-chevron-right rtl:rotate-180\" aria-hidden=\"true\"></i>\n                    </ax-suffix>\n                  </ax-button-item>\n                </ax-button-item-list>\n                <ax-divider />\n              }\n              <!-- ----- Display mode ----- -->\n              @if (showListDisplayModeControl()) {\n                <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                  {{ '@general:terms.interface.view.display-mode' | translate | async }}\n                </div>\n                <ax-button-item-list>\n                  @if (hasTableListDisplayOption()) {\n                    <ax-button-item\n                      [text]=\"('@general:terms.interface.table-view' | translate | async)!\"\n                      [selected]=\"listDisplayMode() === 'table'\"\n                      (onClick)=\"setListDisplayMode('table')\"\n                    >\n                      <ax-prefix>\n                        <i class=\"fa-light fa-table\" aria-hidden=\"true\"></i>\n                      </ax-prefix>\n                      <!--->\n                      <!-- ----- Selected table layout ----- -->\n                      @if (listDisplayMode() === 'table') {\n                        <ax-suffix>\n                          <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n                        </ax-suffix>\n                      }\n                    </ax-button-item>\n                  }\n                  @if (hasCardListDisplayOption()) {\n                    <!-- ----- Card grid presentation ----- -->\n                    <ax-button-item\n                      [text]=\"('@general:terms.interface.card-view' | translate | async)!\"\n                      [selected]=\"listDisplayMode() === 'card'\"\n                      (onClick)=\"setListDisplayMode('card')\"\n                    >\n                      <ax-prefix>\n                        <i class=\"fa-light fa-grid-2\" aria-hidden=\"true\"></i>\n                      </ax-prefix>\n                      <!--->\n                      <!-- ----- Selected card layout ----- -->\n                      @if (listDisplayMode() === 'card') {\n                        <ax-suffix>\n                          <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n                        </ax-suffix>\n                      }\n                    </ax-button-item>\n                  }\n                  @if (hasRowListDisplayOption()) {\n                    <!-- ----- Horizontal row-list presentation ----- -->\n                    <ax-button-item\n                      [text]=\"('@general:terms.interface.row-view' | translate | async)!\"\n                      [selected]=\"listDisplayMode() === 'row'\"\n                      (onClick)=\"setListDisplayMode('row')\"\n                    >\n                      <ax-prefix>\n                        <i class=\"fa-light fa-grip-lines\" aria-hidden=\"true\"></i>\n                      </ax-prefix>\n                      <!--->\n                      <!-- ----- Selected row layout ----- -->\n                      @if (listDisplayMode() === 'row') {\n                        <ax-suffix>\n                          <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n                        </ax-suffix>\n                      }\n                    </ax-button-item>\n                  }\n                </ax-button-item-list>\n              }\n\n              <!-- ----- Columns ----- -->\n              @if (showColumnsControl()) {\n                <!--->\n                <!-- ----- Divider when a display-mode section is already shown ----- -->\n                @if (showListDisplayModeControl()) {\n                  <ax-divider />\n                }\n                <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                  {{ '@general:terms.common.columns' | translate | async }}\n                </div>\n                <ax-button-item-list>\n                  <ax-button-item\n                    [text]=\"('@general:terms.interface.view.manage-columns' | translate | async)!\"\n                    (onClick)=\"openViewColumnsPanel()\"\n                  >\n                    <ax-prefix>\n                      <i class=\"fa-light fa-table-columns\" aria-hidden=\"true\"></i>\n                    </ax-prefix>\n                    <ax-suffix>\n                      <i class=\"fa-light fa-chevron-right rtl:rotate-180\" aria-hidden=\"true\"></i>\n                    </ax-suffix>\n                  </ax-button-item>\n                </ax-button-item-list>\n              }\n\n              <!-- ----- Appearance / row highlight ----- -->\n              <!--->\n              <!-- ----- Divider when earlier presentation sections are present ----- -->\n              @if (showListDisplayModeControl() || showColumnsControl()) {\n                <ax-divider />\n              }\n              <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                {{ '@general:terms.interface.appearance' | translate | async }}\n              </div>\n              <ax-button-item-list>\n                <ax-button-item\n                  [text]=\"('@general:terms.interface.styling.title' | translate | async)!\"\n                  (onClick)=\"openListStylingFromViewMenu()\"\n                >\n                  <ax-prefix>\n                    <i class=\"fa-light fa-palette\" aria-hidden=\"true\"></i>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n              <!--------------------------------------------------------------->\n              <!-- ----- Category opens the navigation drawer on small screens ----- -->\n              @if (deviceService.isSmall() && vm.entityDef.category) {\n                <ax-divider />\n                <ax-button-item-list>\n                  <ax-button-item\n                    [text]=\"('@general:terms.interface.category.title' | translate | async)!\"\n                    (onClick)=\"openCategoryFromViewMenu()\"\n                  >\n                    <ax-prefix>\n                      <i class=\"fa-light fa-bars\" aria-hidden=\"true\"></i>\n                    </ax-prefix>\n                  </ax-button-item>\n                </ax-button-item-list>\n              }\n            </div>\n          }\n        </div>\n      </ax-popover>\n    </div>\n  </div>\n</div>\n", styles: ["@layer properties;.axp-entity-master-toolbar__row{box-sizing:border-box;min-height:2.875rem;padding-block:.1875rem}.axp-toolbar-list-tools{width:max-content;flex:0 0 auto}.axp-toolbar-btn-host{display:inline-flex;width:max-content;flex:0 0 auto;position:relative}.axp-toolbar-btn.ax-button,.axp-toolbar-btn{flex:0 0 auto;width:max-content}.axp-toolbar-btn.ax-button-icon,.axp-toolbar-btn.ax-button-icon button{box-sizing:border-box;height:var(--ax-sys-size-base);min-height:var(--ax-sys-size-base);max-height:var(--ax-sys-size-base);min-width:var(--ax-sys-size-base);max-width:var(--ax-sys-size-base);width:var(--ax-sys-size-base)}.axp-toolbar-btn-sort.ax-button-icon button i{font-size:1em}.axp-toolbar-btn--active button{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){.axp-toolbar-btn--active button{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-toolbar-view-menu__section-label{padding-inline:var(--spacing, .25rem);padding-top:var(--spacing, .25rem);padding-bottom:var(--spacing, .25rem);font-size:10px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wider, .05em);letter-spacing:var(--tracking-wider, .05em);color:var(--color-neutral-400, oklch(70.8% 0 none));text-transform:uppercase}.axp-toolbar-popover{display:flex;max-height:min(28rem,70vh);flex-direction:column;overflow:hidden}.axp-toolbar-view-menu__header{flex-shrink:0}.axp-toolbar-view-menu__body{min-height:0px;flex:1;overflow-x:hidden;overflow-y:auto}.axp-toolbar-view-menu__body .ax-sorted-list{max-height:none;overflow:visible}.axp-toolbar-sort-panel .axp-query-sorts__header{display:none}.axp-toolbar-view-menu--sheet{width:100%;max-width:100%;border-radius:0;border-inline:0}@media(max-width:600px){.axp-entity-master-toolbar__row{padding-block:.375rem;padding-inline:.25rem}axp-query-filters>.flex{padding-block:0}.axp-toolbar-list-tools{justify-content:flex-end}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i3.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i3.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$2.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: AXTranslationModule }, { kind: "component", type: AXPQueryFiltersComponent, selector: "axp-query-filters", inputs: ["filtersDefinitions", "initialFilters", "mode", "quickSearch", "sortPresets", "activeSortPresetName"], outputs: ["onFiltersChanged", "onSortPresetSelected"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "closeOnNavigation", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXPQuerySortsComponent, selector: "axp-query-sorts", inputs: ["sortDefinitions", "sortPresets", "initialSortQueries", "defaultSortQueries"], outputs: ["sortDefinitionsChange", "sortQueriesChange"] }, { kind: "component", type: AXPQueryViewSaveButtonComponent, selector: "axp-query-view-save-button", inputs: ["visible"], outputs: ["save"] }, { kind: "component", type: AXPQueryViewTabsComponent, selector: "axp-query-view-tabs", inputs: ["views", "selectedView"], outputs: ["selectedViewChange", "edit", "remove"] }, { kind: "component", type: AXPQueryColumnsComponent, selector: "axp-query-columns", inputs: ["columns", "constrainHeight"], outputs: ["columnsChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPEntityMasterToolbarViewComponent, isStandalone: true, selector: "axp-entity-master-toolbar-view", inputs: { vm: ["viewModel", "vm"] }, host: { classAttribute: "w-full" }, viewQueries: [{ propertyName: "viewPopover", first: true, predicate: ["viewPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "<axp-query-view-tabs\n  id=\"axp-toolbar-view-selector\"\n  [views]=\"viewQueries()\"\n  [selectedView]=\"selectedViewQuery()\"\n  (selectedViewChange)=\"onViewChanged($event)\"\n  (edit)=\"onEditQueryView($event)\"\n  (remove)=\"onDeleteQueryView($event)\"\n></axp-query-view-tabs>\n<div\n  class=\"axp-entity-master-toolbar__row flex w-full flex-wrap items-center border-b border-light\"\n  [class.min-w-0]=\"deviceService.isSmall()\"\n  [class.gap-2]=\"!deviceService.isSmall()\"\n  [class.gap-1]=\"deviceService.isSmall()\"\n>\n  <!-- ----- Filter chips, search, and Ctrl+F stay on the leading edge ----- -->\n  @if (filtersReady()) {\n    <axp-query-filters\n      id=\"axp-toolbar-filters\"\n      class=\"min-w-0 flex-1\"\n      [filtersDefinitions]=\"filtersDefinitions()\"\n      [initialFilters]=\"initialFilters()\"\n      [quickSearch]=\"true\"\n      [mode]=\"vm.filterMode()\"\n      [sortPresets]=\"mobileSortPresets()\"\n      [activeSortPresetName]=\"activeSortPresetName()\"\n      (onFiltersChanged)=\"onFiltersChanged($event)\"\n      (onSortPresetSelected)=\"onSortPresetSelected($event)\"\n    ></axp-query-filters>\n  }\n\n  <div\n    class=\"axp-toolbar-list-tools ms-auto flex shrink-0 items-center gap-1\"\n  >\n    <!-- ----- Apply pending filters when the list is in manual apply mode ----- -->\n    @if (filterTriggerMode === 'manual' && isFiltersDirty()) {\n      <ax-button\n        id=\"axp-toolbar-btn-filter\"\n        [title]=\"'@general:actions.apply.title'\"\n        [iconOnly]=\"true\"\n        [color]=\"'primary'\"\n        (onClick)=\"applyFilters()\"\n      >\n        <ax-prefix>\n          <i class=\"fa-light fa-search\" aria-hidden=\"true\"></i>\n        </ax-prefix>\n      </ax-button>\n    }\n    <!-- ----- Save View appears when the list layout is dirty ----- -->\n    <axp-query-view-save-button\n      [visible]=\"vm.canSaveActiveQueryView()\"\n      (save)=\"onSaveQueryView()\"\n    ></axp-query-view-save-button>\n\n    <!-- ----- Sort stays a direct button on larger screens ----- -->\n    @if (vm.canSort() && !deviceService.isSmall()) {\n      <div class=\"axp-toolbar-btn-host\">\n        <ax-button\n          id=\"axp-toolbar-btn-sort\"\n          class=\"axp-toolbar-btn axp-toolbar-btn-sort\"\n          [class.axp-toolbar-btn--active]=\"activeSortCount() > 0\"\n          [look]=\"'outline'\"\n          [iconOnly]=\"true\"\n          [color]=\"activeSortCount() > 0 ? 'primary' : 'default'\"\n          [attr.aria-expanded]=\"sortMenuOpen()\"\n          [attr.aria-haspopup]=\"'dialog'\"\n          [title]=\"\n            (activeSortCount() > 0\n              ? ('@general:terms.interface.sort.button-active' | translate: { params: { count: activeSortCount() } } | async)\n              : ('@general:actions.sort.title' | translate | async)) ?? ''\n          \"\n          #sortButton\n        >\n          <ax-prefix>\n            <i class=\"fa-light fa-sort-amount-up\" aria-hidden=\"true\"></i>\n          </ax-prefix>\n        </ax-button>\n        <ax-popover\n          id=\"axp-popover-sort\"\n          [adaptivityEnabled]=\"true\"\n          [offsetY]=\"8\"\n          [target]=\"sortButton\"\n          [openOn]=\"'toggle'\"\n          [closeOn]=\"'clickOut'\"\n          (onOpened)=\"sortMenuOpen.set(true)\"\n          (onClosed)=\"sortMenuOpen.set(false)\"\n          #sortPopover\n        >\n          <div class=\"axp-toolbar-popover lightest-surface shadow-md border md:w-96 w-full rounded-md overflow-hidden\">\n            <axp-query-sorts\n              [sortDefinitions]=\"sortDefinitions()\"\n              [sortPresets]=\"vm.sortPresets()\"\n              [defaultSortQueries]=\"defaultSortQueries()\"\n              (sortQueriesChange)=\"onSortQueriesChange($event)\"\n              [initialSortQueries]=\"sortQueries()\"\n            ></axp-query-sorts>\n          </div>\n        </ax-popover>\n      </div>\n    }\n\n    <!-- ----- On small screens this button also holds sort and category ----- -->\n    <div class=\"axp-toolbar-btn-host\">\n      <ax-button\n        id=\"axp-toolbar-btn-view\"\n        class=\"axp-toolbar-btn axp-toolbar-btn-view\"\n        [class.axp-toolbar-btn--open]=\"viewMenuOpen()\"\n        [class.axp-toolbar-btn--active]=\"deviceService.isSmall() && activeSortCount() > 0\"\n        [look]=\"'outline'\"\n        [iconOnly]=\"true\"\n        [color]=\"deviceService.isSmall() && activeSortCount() > 0 ? 'primary' : 'default'\"\n        [attr.aria-expanded]=\"viewMenuOpen()\"\n        [attr.aria-haspopup]=\"'menu'\"\n        [title]=\"((deviceService.isSmall()\n          ? '@general:terms.interface.view.list-options'\n          : '@general:terms.interface.view.menu-button') | translate | async) ?? ''\"\n        #viewButton\n      >\n        <ax-prefix>\n          <i class=\"fa-light fa-sliders\" aria-hidden=\"true\"></i>\n        </ax-prefix>\n      </ax-button>\n      <ax-popover\n        id=\"axp-popover-view\"\n        [adaptivityEnabled]=\"true\"\n        [offsetY]=\"8\"\n        [target]=\"viewButton\"\n        [openOn]=\"'toggle'\"\n        [closeOn]=\"'clickOut'\"\n        (onOpened)=\"onViewMenuOpened()\"\n        (onClosed)=\"onViewMenuClosed()\"\n        #viewPopover\n      >\n        <div\n          class=\"axp-toolbar-popover axp-toolbar-view-menu lightest-surface shadow-md border max-w-full overflow-hidden\"\n          [class.w-72]=\"!deviceService.isSmall()\"\n          [class.rounded-md]=\"!deviceService.isSmall()\"\n          [class.w-full]=\"deviceService.isSmall()\"\n          [class.axp-toolbar-view-menu--sheet]=\"deviceService.isSmall()\"\n        >\n          <!-- ----- Nested sort panel on small screens ----- -->\n          @if (viewMenuPanel() === 'sort') {\n            <div class=\"axp-toolbar-view-menu__header flex items-center justify-between gap-2 border-b border-light px-3 py-2\">\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'default'\"\n                [title]=\"('@general:actions.back.title' | translate | async) ?? ''\"\n                (onClick)=\"viewMenuPanel.set('root')\"\n              >\n                <ax-prefix>\n                  <i class=\"fa-light fa-chevron-left rtl:rotate-180\" aria-hidden=\"true\"></i>\n                </ax-prefix>\n              </ax-button>\n              <span class=\"min-w-0 flex-1 truncate font-bold\">\n                {{ '@general:terms.interface.sort.title' | translate | async }}\n              </span>\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'primary'\"\n                [disabled]=\"!canResetSorts()\"\n                [text]=\"'@general:terms.interface.sort.clear' | translate | async\"\n                (onClick)=\"resetSortsFromMenu()\"\n              ></ax-button>\n            </div>\n            <div class=\"axp-toolbar-view-menu__body axp-toolbar-sort-panel\">\n              <axp-query-sorts\n                [sortDefinitions]=\"sortDefinitions()\"\n                [sortPresets]=\"vm.sortPresets()\"\n                [defaultSortQueries]=\"defaultSortQueries()\"\n                (sortQueriesChange)=\"onSortQueriesChange($event)\"\n                [initialSortQueries]=\"sortQueries()\"\n              ></axp-query-sorts>\n            </div>\n          }\n          <!-- ----- Nested column visibility panel ----- -->\n          @else if (viewMenuPanel() === 'columns') {\n            <div class=\"axp-toolbar-view-menu__header flex items-center justify-between gap-2 border-b border-light px-3 py-2\">\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'default'\"\n                [title]=\"('@general:actions.back.title' | translate | async) ?? ''\"\n                (onClick)=\"viewMenuPanel.set('root')\"\n              >\n                <ax-prefix>\n                  <i class=\"fa-light fa-chevron-left rtl:rotate-180\" aria-hidden=\"true\"></i>\n                </ax-prefix>\n              </ax-button>\n              <span class=\"min-w-0 flex-1 truncate font-bold\">\n                {{ '@general:terms.common.columns' | translate | async }}\n              </span>\n              <ax-button\n                class=\"ax-sm\"\n                [look]=\"'blank'\"\n                [color]=\"'primary'\"\n                [text]=\"'@general:actions.reset.title' | translate | async\"\n                (onClick)=\"resetViewColumns()\"\n              ></ax-button>\n            </div>\n            <div class=\"axp-toolbar-view-menu__body px-4 py-3\">\n              <axp-query-columns\n                [columns]=\"vm.columns()\"\n                [constrainHeight]=\"false\"\n                (columnsChange)=\"onColumnsChange($event)\"\n              ></axp-query-columns>\n            </div>\n          }\n          <!-- ----- Root presentation menu ----- -->\n          @else {\n            <div class=\"axp-toolbar-view-menu__header border-b border-light px-4 py-3 font-bold\">\n              {{ (deviceService.isSmall()\n                ? '@general:terms.interface.view.list-options'\n                : '@general:terms.interface.view.menu-title') | translate | async }}\n            </div>\n            <div class=\"axp-toolbar-view-menu__body py-2\">\n              <!--------------------------------------------------------------->\n              <!-- ----- Sort opens the sort panel on small screens ----- -->\n              @if (deviceService.isSmall() && vm.canSort()) {\n                <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                  {{ '@general:actions.sort.title' | translate | async }}\n                </div>\n                <ax-button-item-list>\n                  <ax-button-item\n                    [text]=\"(activeSortCount() > 0\n                      ? ('@general:terms.interface.sort.button-active' | translate: { params: { count: activeSortCount() } } | async)\n                      : ('@general:terms.interface.sort.title' | translate | async))!\"\n                    (onClick)=\"openViewSortPanel()\"\n                  >\n                    <ax-prefix>\n                      <i class=\"fa-light fa-sort-amount-up\" aria-hidden=\"true\"></i>\n                    </ax-prefix>\n                    <ax-suffix>\n                      <i class=\"fa-light fa-chevron-right rtl:rotate-180\" aria-hidden=\"true\"></i>\n                    </ax-suffix>\n                  </ax-button-item>\n                </ax-button-item-list>\n                <ax-divider />\n              }\n              <!-- ----- Display mode ----- -->\n              @if (showListDisplayModeControl()) {\n                <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                  {{ '@general:terms.interface.view.display-mode' | translate | async }}\n                </div>\n                <ax-button-item-list>\n                  @if (hasTableListDisplayOption()) {\n                    <ax-button-item\n                      [text]=\"('@general:terms.interface.table-view' | translate | async)!\"\n                      [selected]=\"listDisplayMode() === 'table'\"\n                      (onClick)=\"setListDisplayMode('table')\"\n                    >\n                      <ax-prefix>\n                        <i class=\"fa-light fa-table\" aria-hidden=\"true\"></i>\n                      </ax-prefix>\n                      <!--->\n                      <!-- ----- Selected table layout ----- -->\n                      @if (listDisplayMode() === 'table') {\n                        <ax-suffix>\n                          <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n                        </ax-suffix>\n                      }\n                    </ax-button-item>\n                  }\n                  @if (hasCardListDisplayOption()) {\n                    <!-- ----- Card grid presentation ----- -->\n                    <ax-button-item\n                      [text]=\"('@general:terms.interface.card-view' | translate | async)!\"\n                      [selected]=\"listDisplayMode() === 'card'\"\n                      (onClick)=\"setListDisplayMode('card')\"\n                    >\n                      <ax-prefix>\n                        <i class=\"fa-light fa-grid-2\" aria-hidden=\"true\"></i>\n                      </ax-prefix>\n                      <!--->\n                      <!-- ----- Selected card layout ----- -->\n                      @if (listDisplayMode() === 'card') {\n                        <ax-suffix>\n                          <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n                        </ax-suffix>\n                      }\n                    </ax-button-item>\n                  }\n                  @if (hasRowListDisplayOption()) {\n                    <!-- ----- Horizontal row-list presentation ----- -->\n                    <ax-button-item\n                      [text]=\"('@general:terms.interface.row-view' | translate | async)!\"\n                      [selected]=\"listDisplayMode() === 'row'\"\n                      (onClick)=\"setListDisplayMode('row')\"\n                    >\n                      <ax-prefix>\n                        <i class=\"fa-light fa-grip-lines\" aria-hidden=\"true\"></i>\n                      </ax-prefix>\n                      <!--->\n                      <!-- ----- Selected row layout ----- -->\n                      @if (listDisplayMode() === 'row') {\n                        <ax-suffix>\n                          <i class=\"fa-light fa-check\" aria-hidden=\"true\"></i>\n                        </ax-suffix>\n                      }\n                    </ax-button-item>\n                  }\n                </ax-button-item-list>\n              }\n\n              <!-- ----- Columns ----- -->\n              @if (showColumnsControl()) {\n                <!--->\n                <!-- ----- Divider when a display-mode section is already shown ----- -->\n                @if (showListDisplayModeControl()) {\n                  <ax-divider />\n                }\n                <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                  {{ '@general:terms.common.columns' | translate | async }}\n                </div>\n                <ax-button-item-list>\n                  <ax-button-item\n                    [text]=\"('@general:terms.interface.view.manage-columns' | translate | async)!\"\n                    (onClick)=\"openViewColumnsPanel()\"\n                  >\n                    <ax-prefix>\n                      <i class=\"fa-light fa-table-columns\" aria-hidden=\"true\"></i>\n                    </ax-prefix>\n                    <ax-suffix>\n                      <i class=\"fa-light fa-chevron-right rtl:rotate-180\" aria-hidden=\"true\"></i>\n                    </ax-suffix>\n                  </ax-button-item>\n                </ax-button-item-list>\n              }\n\n              <!-- ----- Appearance / row highlight ----- -->\n              <!--->\n              <!-- ----- Divider when earlier presentation sections are present ----- -->\n              @if (showListDisplayModeControl() || showColumnsControl()) {\n                <ax-divider />\n              }\n              <div class=\"axp-toolbar-view-menu__section-label px-4\">\n                {{ '@general:terms.interface.appearance' | translate | async }}\n              </div>\n              <ax-button-item-list>\n                <ax-button-item\n                  [text]=\"('@general:terms.interface.styling.title' | translate | async)!\"\n                  (onClick)=\"openListStylingFromViewMenu()\"\n                >\n                  <ax-prefix>\n                    <i class=\"fa-light fa-palette\" aria-hidden=\"true\"></i>\n                  </ax-prefix>\n                </ax-button-item>\n              </ax-button-item-list>\n              <!--------------------------------------------------------------->\n              <!-- ----- Category opens the navigation drawer on small screens ----- -->\n              @if (deviceService.isSmall() && vm.entityDef.category) {\n                <ax-divider />\n                <ax-button-item-list>\n                  <ax-button-item\n                    [text]=\"('@general:terms.interface.category.title' | translate | async)!\"\n                    (onClick)=\"openCategoryFromViewMenu()\"\n                  >\n                    <ax-prefix>\n                      <i class=\"fa-light fa-bars\" aria-hidden=\"true\"></i>\n                    </ax-prefix>\n                  </ax-button-item>\n                </ax-button-item-list>\n              }\n            </div>\n          }\n        </div>\n      </ax-popover>\n    </div>\n  </div>\n</div>\n", styles: ["@layer properties;.axp-entity-master-toolbar__row{box-sizing:border-box;min-height:2.875rem;padding-block:.1875rem}.axp-toolbar-list-tools{width:max-content;flex:0 0 auto}.axp-toolbar-btn-host{display:inline-flex;width:max-content;flex:0 0 auto;position:relative}.axp-toolbar-btn.ax-button,.axp-toolbar-btn{flex:0 0 auto;width:max-content}.axp-toolbar-btn.ax-button-icon,.axp-toolbar-btn.ax-button-icon button{box-sizing:border-box;height:var(--ax-sys-size-base);min-height:var(--ax-sys-size-base);max-height:var(--ax-sys-size-base);min-width:var(--ax-sys-size-base);max-width:var(--ax-sys-size-base);width:var(--ax-sys-size-base)}.axp-toolbar-btn-sort.ax-button-icon button i{font-size:1em}.axp-toolbar-btn--active button{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){.axp-toolbar-btn--active button{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-toolbar-view-menu__section-label{padding-inline:var(--spacing, .25rem);padding-top:var(--spacing, .25rem);padding-bottom:var(--spacing, .25rem);font-size:10px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wider, .05em);letter-spacing:var(--tracking-wider, .05em);color:var(--color-neutral-400, oklch(70.8% 0 none));text-transform:uppercase}.axp-toolbar-popover{display:flex;max-height:min(28rem,70vh);flex-direction:column;overflow:hidden}.axp-toolbar-view-menu__header{flex-shrink:0}.axp-toolbar-view-menu__body{min-height:0px;flex:1;overflow-x:hidden;overflow-y:auto}.axp-toolbar-view-menu__body .ax-sorted-list{max-height:none;overflow:visible}.axp-toolbar-sort-panel .axp-query-sorts__header{display:none}.axp-toolbar-view-menu--sheet{width:100%;max-width:100%;border-radius:0;border-inline:0}@media(max-width:600px){.axp-entity-master-toolbar__row{padding-block:.375rem;padding-inline:.25rem}axp-query-filters>.flex{padding-block:0}.axp-toolbar-list-tools{justify-content:flex-end}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i3.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i3.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$2.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: AXTranslationModule }, { kind: "component", type: AXPQueryFiltersComponent, selector: "axp-query-filters", inputs: ["filtersDefinitions", "initialFilters", "mode", "quickSearch", "sortPresets", "activeSortPresetName"], outputs: ["onFiltersChanged", "onSortPresetSelected"] }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i6.AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "restoreFocusOnClose", "openAfter", "closeAfter", "closeOnScroll", "closeOnNavigation", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXPQuerySortsComponent, selector: "axp-query-sorts", inputs: ["sortDefinitions", "sortPresets", "initialSortQueries", "defaultSortQueries"], outputs: ["sortDefinitionsChange", "sortQueriesChange"] }, { kind: "component", type: AXPQueryViewSaveButtonComponent, selector: "axp-query-view-save-button", inputs: ["visible"], outputs: ["save"] }, { kind: "component", type: AXPQueryViewTabsComponent, selector: "axp-query-view-tabs", inputs: ["views", "selectedView"], outputs: ["selectedViewChange", "edit", "remove"] }, { kind: "component", type: AXPQueryColumnsComponent, selector: "axp-query-columns", inputs: ["columns", "constrainHeight"], outputs: ["columnsChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i2.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPEntityMasterToolbarViewComponent, decorators: [{
             type: Component,
@@ -2433,6 +2433,8 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
         this.listHostReady = signal(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "listHostReady" }] : /* istanbul ignore next */ []));
         this.previousAppTabActive = false;
+        /** List refresh that arrived while this route tab was cached in the background. */
+        this.pendingBackgroundListRefresh = null;
         this.lastEvaluatedViewName = null;
         this.componentDestroyed = new Subject();
         this.isRestoringExpandedRows = false;
@@ -2450,33 +2452,10 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
             const highlightRowId = e.meta?.highlightRowId;
             const resetPagination = e.meta?.resetPagination === true || (highlightRowId != null && refreshTargetId == null);
             if (e.action == 'refresh') {
-                traceEntityMasterList('list-view', 'refresh event received', () => ({
-                    viewName: this.vm.view().name,
-                    activeListLayout: this.vm.activeListLayout(),
-                    resetPagination,
-                    refreshTargetId,
-                    highlightRowId,
-                    hasGrid: !!this.grid(),
-                    hasCardList: !!this.cardList(),
-                    dataSource: buildDataSourceTraceSnapshot(this.vm.dataSource),
-                }));
-                if (highlightRowId == null) {
-                    this.cardList()?.clearCardHighlight();
-                }
-                if (resetPagination) {
-                    this.vm.resetListPagingSkip();
-                }
-                if (refreshTargetId) {
-                    await this.grid()?.refreshItemChildren(refreshTargetId);
-                    this.updateParentHasChildAfterRefresh(refreshTargetId);
-                }
-                else {
-                    await this.reloadListData(resetPagination);
-                }
-                if (highlightRowId != null) {
-                    await this.highlightRowById(highlightRowId);
+                if (this.deferListRefreshUntilTabVisible(resetPagination, refreshTargetId, highlightRowId)) {
+                    return;
                 }
-                traceEntityMasterList('list-view', 'refresh event handled', () => this.buildListHostTraceSnapshot());
+                await this.applyVisibleListRefresh(resetPagination, refreshTargetId, highlightRowId);
             }
         });
         effect(() => {
@@ -2553,9 +2532,11 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
                 activeTabKey,
                 viewName: this.vm.view().name,
                 activeListLayout: this.vm.activeListLayout(),
+                pendingRefresh: this.pendingBackgroundListRefresh != null,
                 ...this.buildListHostTraceSnapshot(),
             }));
             this.pageContextRegistry.activate(this.pageContextRegistrationId);
+            this.flushBackgroundListRefresh();
         });
         this.registerPageContext();
     }
@@ -2784,6 +2765,81 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
             axpReplaceEntityListRouteQueryParams(this.router, { view: viewName });
         });
     }
+    /** True when this cached list is not the visible route tab. */
+    isListTabInBackground() {
+        if (this.tabNavigation.effectiveMode() !== 'tabular') {
+            return false;
+        }
+        const pageTabKey = this.getPageTabKey();
+        if (!pageTabKey) {
+            return false;
+        }
+        return this.tabNavigation.activeKey() !== pageTabKey;
+    }
+    /**
+     * A detached list keeps its grid, but a refresh while it is off-screen does not
+     * repaint when the tab is shown again. Hold the latest refresh until then.
+     */
+    deferListRefreshUntilTabVisible(resetPagination, refreshTargetId, highlightRowId) {
+        if (!this.isListTabInBackground()) {
+            return false;
+        }
+        const previous = this.pendingBackgroundListRefresh;
+        this.pendingBackgroundListRefresh = {
+            resetPagination: resetPagination || (previous?.resetPagination ?? false),
+            refreshTargetId,
+            highlightRowId: highlightRowId ?? previous?.highlightRowId,
+        };
+        return true;
+    }
+    /** Applies a refresh that was queued while this list tab was in the background. */
+    flushBackgroundListRefresh() {
+        const pending = this.pendingBackgroundListRefresh;
+        if (!pending) {
+            return;
+        }
+        this.pendingBackgroundListRefresh = null;
+        queueMicrotask(() => {
+            if (this.listQueryParamSyncDisabled) {
+                return;
+            }
+            if (this.isListTabInBackground()) {
+                this.pendingBackgroundListRefresh = pending;
+                return;
+            }
+            void this.applyVisibleListRefresh(pending.resetPagination, pending.refreshTargetId, pending.highlightRowId);
+        });
+    }
+    async applyVisibleListRefresh(resetPagination, refreshTargetId, highlightRowId) {
+        traceEntityMasterList('list-view', 'refresh event received', () => ({
+            viewName: this.vm.view().name,
+            activeListLayout: this.vm.activeListLayout(),
+            resetPagination,
+            refreshTargetId,
+            highlightRowId,
+            hasGrid: !!this.grid(),
+            hasCardList: !!this.cardList(),
+            dataSource: buildDataSourceTraceSnapshot(this.vm.dataSource),
+        }));
+        if (highlightRowId == null) {
+            this.cardList()?.clearCardHighlight();
+        }
+        if (resetPagination) {
+            this.vm.resetListPagingSkip();
+        }
+        if (typeof refreshTargetId === 'string' || typeof refreshTargetId === 'number') {
+            const parentId = String(refreshTargetId);
+            await this.grid()?.refreshItemChildren(parentId);
+            this.updateParentHasChildAfterRefresh(parentId);
+        }
+        else {
+            await this.reloadListData(resetPagination);
+        }
+        if (typeof highlightRowId === 'string' || typeof highlightRowId === 'number') {
+            await this.highlightRowById(highlightRowId);
+        }
+        traceEntityMasterList('list-view', 'refresh event handled', () => this.buildListHostTraceSnapshot());
+    }
     async reloadListData(resetPagination = false) {
         traceEntityMasterList('list-view', 'reloadListData start', () => ({
             resetPagination,
@@ -4478,12 +4534,19 @@ class AXPEntityReuseStrategy {
         if (reuseConfig === false) {
             return false;
         }
+        // Same component route under a different scoped tab (settings user ↔ tenant) must remount.
+        // Otherwise one page instance keeps the first scope's tab key and overwrites every scope title.
+        if (this.routeCache.isEnabled() &&
+            future.routeConfig &&
+            future.routeConfig === curr.routeConfig &&
+            axpResolveTabKeyFromSnapshot(future) !== axpResolveTabKeyFromSnapshot(curr)) {
+            return false;
+        }
         // `reuse: true` on sibling routes under the same scoped tab (e.g. chat '' ↔ :id).
         if (reuseConfig === true) {
-            // Same route node re-activated (e.g. settings `:scope` change reusing its `setting-page`).
-            // Use config reference equality, not path strings: different tabs can share a path (e.g. the
-            // empty-path child of both settings and chat), and once the root-layout shell is reused those
-            // siblings get compared directly — a path-only match would wrongly keep the previous content.
+            // Same route node inside one scoped tab (settings group changes keep `setting-page`).
+            // Config reference equality: an empty-path child of settings and of chat can share a path
+            // string, and a path-only match would keep the previous content.
             if (future.routeConfig && future.routeConfig === curr.routeConfig) {
                 return true;
             }
@@ -4498,6 +4561,11 @@ class AXPEntityReuseStrategy {
         if (future.routeConfig !== curr.routeConfig) {
             return false;
         }
+        // Simple mode keeps one list component and swaps navigation query params in place.
+        // Tabular mode caches each menu, so a different `mode` or `list` must not reuse that component.
+        if (this.routeCache.isEnabled() && this.entityListNavigationChanged(future, curr)) {
+            return false;
+        }
         if (typeof reuseConfig === 'string') {
             const paramsChanged = this.haveParamsChanged(future, curr);
             const queryParamsChanged = this.haveQueryParamsChanged(future, curr);
@@ -4551,11 +4619,11 @@ class AXPEntityReuseStrategy {
         const config = shell.routeConfig;
         return !!(config?.children?.length || config?.loadChildren);
     }
-    /** Nearest ancestor route that declares `data.tab = true`. */
+    /** Nearest ancestor whose own route config declares `data.tab = true` (not inherited data). */
     findScopedAncestor(route) {
         for (let index = route.pathFromRoot.length - 1; index >= 0; index--) {
             const snapshot = route.pathFromRoot[index];
-            if (axpHasTabScope(snapshot.data)) {
+            if (axpSnapshotDeclaresTabScope(snapshot)) {
                 return snapshot;
             }
         }
@@ -4594,12 +4662,13 @@ class AXPEntityReuseStrategy {
         const config = route.routeConfig;
         return !!(route.component || config?.component || config?.loadComponent);
     }
-    /** Cache key — scoped tab path for shells, full leaf path otherwise. */
+    /** Cache key — scoped tab path for shells, full leaf path otherwise, plus entity-list `list`. */
     routeCacheKeyFor(route) {
         if (!this.isTabCacheRoute(route)) {
             return null;
         }
-        const path = this.findScopedShellRoute(route) ? axpResolveTabKeyFromSnapshot(route) : axpPathFromSnapshot(route);
+        const basePath = this.findScopedShellRoute(route) ? axpResolveTabKeyFromSnapshot(route) : axpPathFromSnapshot(route);
+        const path = axpEntityListNavigationTabKey(basePath, route.queryParams);
         return axpIsTabEligibleUrl(path) ? path : null;
     }
     /** Scoped tab key — matches open tab descriptors (`data.tab = true`). */
@@ -4622,11 +4691,23 @@ class AXPEntityReuseStrategy {
         if (!navigation?.finalUrl) {
             return true;
         }
-        const targetPath = router.serializeUrl(navigation.finalUrl).split('?')[0].split('#')[0];
-        const futureScoped = axpResolveTabKeyFromRouteConfig(router.config, targetPath) ??
+        const targetUrl = router.serializeUrl(navigation.finalUrl);
+        const targetPath = targetUrl.split('?')[0].split('#')[0];
+        const futureBase = axpResolveTabKeyFromRouteConfig(router.config, targetPath) ??
             (targetPath.startsWith('/') ? targetPath : `/${targetPath}`);
+        const futureScoped = axpEntityListNavigationTabKey(futureBase, targetUrl);
         return currentScoped !== futureScoped;
     }
+    /** True when two activations of the entity list route belong to different menus (`mode`, `list`, …). */
+    entityListNavigationChanged(future, curr) {
+        const futurePath = axpPathFromSnapshot(future);
+        const currPath = axpPathFromSnapshot(curr);
+        if (!axpIsEntityListPath(futurePath) && !axpIsEntityListPath(currPath)) {
+            return false;
+        }
+        return (axpEntityListNavigationTabKey(futurePath, future.queryParams) !==
+            axpEntityListNavigationTabKey(currPath, curr.queryParams));
+    }
     haveParamsChanged(future, curr) {
         const futureParams = future.params;
         const currParams = curr.params;
@@ -4725,9 +4806,9 @@ class AXPDefaultThemeModule {
                                 single: () => import('./acorex-platform-framework-client-themes-default-entity-master-single-view.component-2Re1-MvA.mjs').then((c) => c.AXPEntityMasterSingleViewComponent),
                                 details: () => import('@acorex-platform/framework-client/layout/views').then((c) => c.AXPLayoutDetailsViewComponent),
                                 ///
-                                create: () => import('./acorex-platform-framework-client-themes-default-entity-master-create-view.component-DwCoz2Du.mjs').then((c) => c.AXPEntityMasterCreateViewComponent),
+                                create: () => import('./acorex-platform-framework-client-themes-default-entity-master-create-view.component-DPU6jTDk.mjs').then((c) => c.AXPEntityMasterCreateViewComponent),
                                 ///
-                                modify: () => import('./acorex-platform-framework-client-themes-default-entity-master-modify-view.component-BCyFK60f.mjs').then((c) => c.AXPEntityMasterModifyViewComponent),
+                                modify: () => import('./acorex-platform-framework-client-themes-default-entity-master-modify-view.component-CLdQJ8e8.mjs').then((c) => c.AXPEntityMasterModifyViewComponent),
                                 //
                                 list: () => Promise.resolve().then(function () { return entityMasterListView_component; }).then((c) => c.AXPEntityMasterListViewComponent),
                             },
@@ -4762,9 +4843,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                                             single: () => import('./acorex-platform-framework-client-themes-default-entity-master-single-view.component-2Re1-MvA.mjs').then((c) => c.AXPEntityMasterSingleViewComponent),
                                             details: () => import('@acorex-platform/framework-client/layout/views').then((c) => c.AXPLayoutDetailsViewComponent),
                                             ///
-                                            create: () => import('./acorex-platform-framework-client-themes-default-entity-master-create-view.component-DwCoz2Du.mjs').then((c) => c.AXPEntityMasterCreateViewComponent),
+                                            create: () => import('./acorex-platform-framework-client-themes-default-entity-master-create-view.component-DPU6jTDk.mjs').then((c) => c.AXPEntityMasterCreateViewComponent),
                                             ///
-                                            modify: () => import('./acorex-platform-framework-client-themes-default-entity-master-modify-view.component-BCyFK60f.mjs').then((c) => c.AXPEntityMasterModifyViewComponent),
+                                            modify: () => import('./acorex-platform-framework-client-themes-default-entity-master-modify-view.component-CLdQJ8e8.mjs').then((c) => c.AXPEntityMasterModifyViewComponent),
                                             //
                                             list: () => Promise.resolve().then(function () { return entityMasterListView_component; }).then((c) => c.AXPEntityMasterListViewComponent),
                                         },