@acorex-platform/framework-client 2.0.0-next.1 → 2.0.0-next.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/acorex-platform-framework-client-common.mjs +320 -166
- package/fesm2022/acorex-platform-framework-client-common.mjs.map +1 -1
- package/fesm2022/acorex-platform-framework-client-core.mjs +7 -2
- package/fesm2022/acorex-platform-framework-client-core.mjs.map +1 -1
- package/fesm2022/acorex-platform-framework-client-layout-components.mjs +108 -16
- package/fesm2022/acorex-platform-framework-client-layout-components.mjs.map +1 -1
- package/fesm2022/{acorex-platform-framework-client-layout-entity-acorex-platform-framework-client-layout-entity-DToXUL54.mjs → acorex-platform-framework-client-layout-entity-acorex-platform-framework-client-layout-entity-BUUIRvjv.mjs} +538 -172
- package/fesm2022/acorex-platform-framework-client-layout-entity-acorex-platform-framework-client-layout-entity-BUUIRvjv.mjs.map +1 -0
- package/fesm2022/{acorex-platform-framework-client-layout-entity-attachments-page.component-DqssRhIG.mjs → acorex-platform-framework-client-layout-entity-attachments-page.component-Bvu_DFae.mjs} +2 -2
- package/fesm2022/{acorex-platform-framework-client-layout-entity-attachments-page.component-DqssRhIG.mjs.map → acorex-platform-framework-client-layout-entity-attachments-page.component-Bvu_DFae.mjs.map} +1 -1
- package/fesm2022/{acorex-platform-framework-client-layout-entity-bulk-entity.command-Deq-a9MQ.mjs → acorex-platform-framework-client-layout-entity-bulk-entity.command-AQyQql3E.mjs} +2 -2
- package/fesm2022/{acorex-platform-framework-client-layout-entity-bulk-entity.command-Deq-a9MQ.mjs.map → acorex-platform-framework-client-layout-entity-bulk-entity.command-AQyQql3E.mjs.map} +1 -1
- package/fesm2022/{acorex-platform-framework-client-layout-entity-file-list-popup.component-J30yrJMo.mjs → acorex-platform-framework-client-layout-entity-file-list-popup.component-BIlmfAGh.mjs} +4 -4
- package/fesm2022/{acorex-platform-framework-client-layout-entity-file-list-popup.component-J30yrJMo.mjs.map → acorex-platform-framework-client-layout-entity-file-list-popup.component-BIlmfAGh.mjs.map} +1 -1
- package/fesm2022/{acorex-platform-framework-client-layout-entity-gallery-page.component-BqqxD8cX.mjs → acorex-platform-framework-client-layout-entity-gallery-page.component-C9VXr6zx.mjs} +2 -2
- package/fesm2022/{acorex-platform-framework-client-layout-entity-gallery-page.component-BqqxD8cX.mjs.map → acorex-platform-framework-client-layout-entity-gallery-page.component-C9VXr6zx.mjs.map} +1 -1
- package/fesm2022/acorex-platform-framework-client-layout-entity.mjs +1 -1
- package/fesm2022/acorex-platform-framework-client-layout-views.mjs +12 -0
- package/fesm2022/acorex-platform-framework-client-layout-views.mjs.map +1 -1
- package/fesm2022/acorex-platform-framework-client-layout-widget-core.mjs +105 -13
- package/fesm2022/acorex-platform-framework-client-layout-widget-core.mjs.map +1 -1
- package/fesm2022/{acorex-platform-framework-client-layout-widgets-acorex-platform-framework-client-layout-widgets-BYPl8uyp.mjs → acorex-platform-framework-client-layout-widgets-acorex-platform-framework-client-layout-widgets-CzhP4_OE.mjs} +113 -50
- package/fesm2022/acorex-platform-framework-client-layout-widgets-acorex-platform-framework-client-layout-widgets-CzhP4_OE.mjs.map +1 -0
- package/fesm2022/{acorex-platform-framework-client-layout-widgets-repeater-widget-column.component-IU_-eHQS.mjs → acorex-platform-framework-client-layout-widgets-repeater-widget-column.component-BIl416zF.mjs} +3 -3
- package/fesm2022/{acorex-platform-framework-client-layout-widgets-repeater-widget-column.component-IU_-eHQS.mjs.map → acorex-platform-framework-client-layout-widgets-repeater-widget-column.component-BIl416zF.mjs.map} +1 -1
- package/fesm2022/{acorex-platform-framework-client-layout-widgets-text-block-widget-designer.component-ET8ZuuCj.mjs → acorex-platform-framework-client-layout-widgets-text-block-widget-designer.component-DK8XXQuT.mjs} +2 -2
- package/fesm2022/{acorex-platform-framework-client-layout-widgets-text-block-widget-designer.component-ET8ZuuCj.mjs.map → acorex-platform-framework-client-layout-widgets-text-block-widget-designer.component-DK8XXQuT.mjs.map} +1 -1
- package/fesm2022/acorex-platform-framework-client-layout-widgets.mjs +1 -1
- package/fesm2022/acorex-platform-framework-client-themes-default.mjs +25 -7
- package/fesm2022/acorex-platform-framework-client-themes-default.mjs.map +1 -1
- package/fesm2022/acorex-platform-framework-client-themes-shared.mjs +1 -1
- package/fesm2022/acorex-platform-framework-client-themes-shared.mjs.map +1 -1
- package/layout/widget-core/README.md +1 -1
- package/layout/widgets/README.md +2 -2
- package/package.json +2 -2
- package/types/acorex-platform-framework-client-common.d.ts +35 -4
- package/types/acorex-platform-framework-client-layout-components.d.ts +26 -1
- package/types/acorex-platform-framework-client-layout-entity.d.ts +64 -30
- package/types/acorex-platform-framework-client-layout-widget-core.d.ts +27 -2
- package/types/acorex-platform-framework-client-layout-widgets.d.ts +13 -7
- package/fesm2022/acorex-platform-framework-client-layout-entity-acorex-platform-framework-client-layout-entity-DToXUL54.mjs.map +0 -1
- package/fesm2022/acorex-platform-framework-client-layout-widgets-acorex-platform-framework-client-layout-widgets-BYPl8uyp.mjs.map +0 -1
|
@@ -48,7 +48,7 @@ import { RouterModule, Router, ActivatedRoute, NavigationStart, NavigationEnd, R
|
|
|
48
48
|
import { Subject, takeUntil, filter, combineLatest, firstValueFrom, take } from 'rxjs';
|
|
49
49
|
import { runtimeCommandPayloadData, isThemeSurfaceClass, isRuntimeHexSurfaceClass, AXP_THEME_SURFACE_STYLES, createRandomUuid, AXPKeyboardShortcutPriority } from '@acorex-platform/framework-shared/core';
|
|
50
50
|
import * as i1$2 from '@acorex/core/platform';
|
|
51
|
-
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';
|
|
51
|
+
import { AXPSettingsService, AXPCommonSettings, axpIsEntityListRoute, axpReplaceEntityListRouteQueryParams, axpIsEntityListPath, AXPTabNavigationService, AXPTabPreviewService, AXP_HOME_TAB_KEY, axpResolveTabTitleParts, AXPMenuService, AXPMenuVisibilityService, axpMenuPathsMatch, AXPPlatformBrandingService, AXPTabRouteCacheRegistry, axpResolveTabKeyFromSnapshot, axpHasTabScope, axpPathFromSnapshot, axpEntityListNavigationTabKey, axpIsTabEligibleUrl, axpResolveTabKeyFromRouteConfig, AXP_PROTECTED_ROUTE_GUARDS, AXPCommonModule } from '@acorex-platform/framework-client/common';
|
|
52
52
|
import { DragDropModule, CdkDropList, CdkDrag, CdkDragHandle, CdkDragPreview } from '@angular/cdk/drag-drop';
|
|
53
53
|
import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
|
|
54
54
|
import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex-platform/framework-client/layout/views';
|
|
@@ -619,7 +619,7 @@ class AXPEntityDetailListViewComponent {
|
|
|
619
619
|
this.destroy();
|
|
620
620
|
}
|
|
621
621
|
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 }); }
|
|
622
|
-
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:
|
|
622
|
+
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:
|
|
623
623
|
//
|
|
624
624
|
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 }); }
|
|
625
625
|
}
|
|
@@ -2165,7 +2165,7 @@ class AXPEntityMasterToolbarViewComponent {
|
|
|
2165
2165
|
.join('|');
|
|
2166
2166
|
}
|
|
2167
2167
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPEntityMasterToolbarViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2168
|
-
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 }); }
|
|
2168
|
+
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 }); }
|
|
2169
2169
|
}
|
|
2170
2170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPEntityMasterToolbarViewComponent, decorators: [{
|
|
2171
2171
|
type: Component,
|
|
@@ -4498,6 +4498,11 @@ class AXPEntityReuseStrategy {
|
|
|
4498
4498
|
if (future.routeConfig !== curr.routeConfig) {
|
|
4499
4499
|
return false;
|
|
4500
4500
|
}
|
|
4501
|
+
// Simple mode keeps one list component and swaps navigation query params in place.
|
|
4502
|
+
// Tabular mode caches each menu, so a different `mode` or `list` must not reuse that component.
|
|
4503
|
+
if (this.routeCache.isEnabled() && this.entityListNavigationChanged(future, curr)) {
|
|
4504
|
+
return false;
|
|
4505
|
+
}
|
|
4501
4506
|
if (typeof reuseConfig === 'string') {
|
|
4502
4507
|
const paramsChanged = this.haveParamsChanged(future, curr);
|
|
4503
4508
|
const queryParamsChanged = this.haveQueryParamsChanged(future, curr);
|
|
@@ -4594,12 +4599,13 @@ class AXPEntityReuseStrategy {
|
|
|
4594
4599
|
const config = route.routeConfig;
|
|
4595
4600
|
return !!(route.component || config?.component || config?.loadComponent);
|
|
4596
4601
|
}
|
|
4597
|
-
/** Cache key — scoped tab path for shells, full leaf path otherwise
|
|
4602
|
+
/** Cache key — scoped tab path for shells, full leaf path otherwise, plus entity-list `list`. */
|
|
4598
4603
|
routeCacheKeyFor(route) {
|
|
4599
4604
|
if (!this.isTabCacheRoute(route)) {
|
|
4600
4605
|
return null;
|
|
4601
4606
|
}
|
|
4602
|
-
const
|
|
4607
|
+
const basePath = this.findScopedShellRoute(route) ? axpResolveTabKeyFromSnapshot(route) : axpPathFromSnapshot(route);
|
|
4608
|
+
const path = axpEntityListNavigationTabKey(basePath, route.queryParams);
|
|
4603
4609
|
return axpIsTabEligibleUrl(path) ? path : null;
|
|
4604
4610
|
}
|
|
4605
4611
|
/** Scoped tab key — matches open tab descriptors (`data.tab = true`). */
|
|
@@ -4622,11 +4628,23 @@ class AXPEntityReuseStrategy {
|
|
|
4622
4628
|
if (!navigation?.finalUrl) {
|
|
4623
4629
|
return true;
|
|
4624
4630
|
}
|
|
4625
|
-
const
|
|
4626
|
-
const
|
|
4631
|
+
const targetUrl = router.serializeUrl(navigation.finalUrl);
|
|
4632
|
+
const targetPath = targetUrl.split('?')[0].split('#')[0];
|
|
4633
|
+
const futureBase = axpResolveTabKeyFromRouteConfig(router.config, targetPath) ??
|
|
4627
4634
|
(targetPath.startsWith('/') ? targetPath : `/${targetPath}`);
|
|
4635
|
+
const futureScoped = axpEntityListNavigationTabKey(futureBase, targetUrl);
|
|
4628
4636
|
return currentScoped !== futureScoped;
|
|
4629
4637
|
}
|
|
4638
|
+
/** True when two activations of the entity list route belong to different menus (`mode`, `list`, …). */
|
|
4639
|
+
entityListNavigationChanged(future, curr) {
|
|
4640
|
+
const futurePath = axpPathFromSnapshot(future);
|
|
4641
|
+
const currPath = axpPathFromSnapshot(curr);
|
|
4642
|
+
if (!axpIsEntityListPath(futurePath) && !axpIsEntityListPath(currPath)) {
|
|
4643
|
+
return false;
|
|
4644
|
+
}
|
|
4645
|
+
return (axpEntityListNavigationTabKey(futurePath, future.queryParams) !==
|
|
4646
|
+
axpEntityListNavigationTabKey(currPath, curr.queryParams));
|
|
4647
|
+
}
|
|
4630
4648
|
haveParamsChanged(future, curr) {
|
|
4631
4649
|
const futureParams = future.params;
|
|
4632
4650
|
const currParams = curr.params;
|