@acorex-platform/framework-client 0.0.46 → 0.0.49

package/fesm2022/acorex-platform-framework-client-layout-components.mjs

@@ -71,13 +71,13 @@ import { resolveFileViewerFileType, AXFileViewerContainerComponent, AXFileViewer
 export { provideFileViewer, resolveFileViewerFileType } from '@acorex/components/file-viewer';
 import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { from, Subject, filter, BehaviorSubject, timer, Subscription, map, distinctUntilChanged } from 'rxjs';
-import * as i10 from '@acorex/cdk/list-navigation';
+import * as i11 from '@acorex/cdk/list-navigation';
 import { AXListNavigationModule } from '@acorex/cdk/list-navigation';
-import * as i3$6 from '@acorex/components/button-group';
+import * as i4$3 from '@acorex/components/button-group';
 import { AXButtonGroupModule } from '@acorex/components/button-group';
 import { AXKBDComponent, AXKBDItemComponent } from '@acorex/components/kbd';
 import { AXSelectionListModule } from '@acorex/components/selection-list';
-import * as i8 from '@acorex/components/tag-box';
+import * as i9 from '@acorex/components/tag-box';
 import { AXTagBoxModule } from '@acorex/components/tag-box';
 import { AXCalendarService } from '@acorex/core/date-time';
 import { AXPQueryService, AXPCommandExecutor, AXPCommandService } from '@acorex-platform/framework-client/runtime';
@@ -1702,6 +1702,8 @@ class AXPQueryColumnsComponent {
     constructor() {
         this.columns = model([], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+        this.constrainHeight = input(true, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "constrainHeight" }] : /* istanbul ignore next */ []));
     }
     handleVisibilityChange(e, name) {
         if (e.isUserInteraction) {
@@ -1718,7 +1720,7 @@ class AXPQueryColumnsComponent {
         this.columns.set(columns);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQueryColumnsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQueryColumnsComponent, isStandalone: true, selector: "axp-query-columns", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange" }, ngImport: i0, template: "<div\n  class=\"flex flex-col gap-4 select-none\"\n  cdkDropList\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <div\n    class=\"flex flex-col gap-3 w-full ax-sorted-list max-h-[calc(100vh-280px)] overflow-x-hidden overflow-y-auto\"\n  >\n    @for (item of columns(); track item.name) {\n      <div\n        class=\"flex py-1 items-center justify-between\"\n        cdkDrag\n        cdkDragBoundary=\".ax-sorted-list\"\n      >\n        <div class=\"flex items-center gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move\"></ax-icon>\n          <p class=\"font-medium text-sm\">\n            {{ item.title | translate | async }}\n          </p>\n        </div>\n        <ax-switch\n          class=\"ax-sm\"\n          [ngModel]=\"item.visible\"\n          (onValueChanged)=\"handleVisibilityChange($event, item.name)\"\n        ></ax-switch>\n      </div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "component", type: i3$3.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQueryColumnsComponent, isStandalone: true, selector: "axp-query-columns", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, constrainHeight: { classPropertyName: "constrainHeight", publicName: "constrainHeight", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange" }, ngImport: i0, template: "<div\n  class=\"flex flex-col gap-4 select-none\"\n  cdkDropList\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <div\n    class=\"flex flex-col gap-3 w-full ax-sorted-list overflow-x-hidden\"\n    [class.overflow-y-auto]=\"constrainHeight()\"\n    [style.max-height]=\"constrainHeight() ? 'calc(100vh - 280px)' : 'none'\"\n  >\n    @for (item of columns(); track item.name) {\n      <div\n        class=\"flex py-1 items-center justify-between\"\n        cdkDrag\n        cdkDragBoundary=\".ax-sorted-list\"\n      >\n        <div class=\"flex items-center gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move\"></ax-icon>\n          <p class=\"font-medium text-sm\">\n            {{ item.title | translate | async }}\n          </p>\n        </div>\n        <ax-switch\n          class=\"ax-sm\"\n          [ngModel]=\"item.visible\"\n          (onValueChanged)=\"handleVisibilityChange($event, item.name)\"\n        ></ax-switch>\n      </div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "component", type: i3$3.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQueryColumnsComponent, decorators: [{
             type: Component,
@@ -1732,8 +1734,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                         AXDecoratorModule,
                         AXSwitchModule,
                         AXTranslationModule,
-                    ], template: "<div\n  class=\"flex flex-col gap-4 select-none\"\n  cdkDropList\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <div\n    class=\"flex flex-col gap-3 w-full ax-sorted-list max-h-[calc(100vh-280px)] overflow-x-hidden overflow-y-auto\"\n  >\n    @for (item of columns(); track item.name) {\n      <div\n        class=\"flex py-1 items-center justify-between\"\n        cdkDrag\n        cdkDragBoundary=\".ax-sorted-list\"\n      >\n        <div class=\"flex items-center gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move\"></ax-icon>\n          <p class=\"font-medium text-sm\">\n            {{ item.title | translate | async }}\n          </p>\n        </div>\n        <ax-switch\n          class=\"ax-sm\"\n          [ngModel]=\"item.visible\"\n          (onValueChanged)=\"handleVisibilityChange($event, item.name)\"\n        ></ax-switch>\n      </div>\n    }\n  </div>\n</div>\n" }]
-        }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }, { type: i0.Output, args: ["columnsChange"] }] } });
+                    ], template: "<div\n  class=\"flex flex-col gap-4 select-none\"\n  cdkDropList\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <div\n    class=\"flex flex-col gap-3 w-full ax-sorted-list overflow-x-hidden\"\n    [class.overflow-y-auto]=\"constrainHeight()\"\n    [style.max-height]=\"constrainHeight() ? 'calc(100vh - 280px)' : 'none'\"\n  >\n    @for (item of columns(); track item.name) {\n      <div\n        class=\"flex py-1 items-center justify-between\"\n        cdkDrag\n        cdkDragBoundary=\".ax-sorted-list\"\n      >\n        <div class=\"flex items-center gap-3\" cdkDragHandle>\n          <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move\"></ax-icon>\n          <p class=\"font-medium text-sm\">\n            {{ item.title | translate | async }}\n          </p>\n        </div>\n        <ax-switch\n          class=\"ax-sm\"\n          [ngModel]=\"item.visible\"\n          (onValueChanged)=\"handleVisibilityChange($event, item.name)\"\n        ></ax-switch>\n      </div>\n    }\n  </div>\n</div>\n" }]
+        }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }, { type: i0.Output, args: ["columnsChange"] }], constrainHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "constrainHeight", required: false }] }] } });
 
 //#endregion
 //#region ----   Text Command Column   ----
@@ -5979,6 +5981,25 @@ class AXPQueryFiltersComponent {
         ...(ngDevMode ? [{ debugName: "isMobileFilterModeLocked" }] : /* istanbul ignore next */ []));
         this.isMobileSearchModeLocked = computed(() => this.hasAppliedAdvanceFilter(), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "isMobileSearchModeLocked" }] : /* istanbul ignore next */ []));
+        /** Desktop keeps inline search on the All chip; mobile shows that same value in the search box. */
+        this.#syncAllFilterToMobileSearchEffect = effect(() => {
+            if (!this.deviceService.isSmall()) {
+                return;
+            }
+            const inlineValue = this.getInlineSearchValue();
+            if (!inlineValue) {
+                return;
+            }
+            untracked(() => {
+                if (this.mobileSearchText() !== inlineValue) {
+                    this.mobileSearchText.set(inlineValue);
+                }
+                if (!this.mobileSearchOpen()) {
+                    this.mobileSearchOpen.set(true);
+                }
+            });
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#syncAllFilterToMobileSearchEffect" }] : /* istanbul ignore next */ []));
         this.disabledByField = signal({}, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "disabledByField" }] : /* istanbul ignore next */ []));
         this.hasMultipleFilterGroups = computed(() => {
@@ -6487,6 +6508,8 @@ class AXPQueryFiltersComponent {
         this.destroyRef.onDestroy(() => this.endChipsPan());
     }
     #activeFilterTitleEffect;
+    /** Desktop keeps inline search on the All chip; mobile shows that same value in the search box. */
+    #syncAllFilterToMobileSearchEffect;
     setMobileSearchOpen(isOpen) {
         if (this.mobileSearchOpen() === isOpen) {
             return;
@@ -7107,7 +7130,12 @@ class AXPQueryFiltersComponent {
     }
     getInlineSearchValue() {
         const allFilter = this.selectedFilters().find((filter) => filter.field === 'all');
-        return allFilter?.value == null ? '' : String(allFilter.value);
+        const fromFilter = allFilter?.value;
+        if (fromFilter != null && String(fromFilter).trim() !== '') {
+            return String(fromFilter);
+        }
+        const fromContext = this.unwrapFilterContextEntry(this.context()?.['all'])?.value;
+        return fromContext == null || String(fromContext).trim() === '' ? '' : String(fromContext);
     }
     applyInlineSearch(value) {
         const trimmed = value.trim();
@@ -7693,11 +7721,11 @@ class AXPQueryFiltersComponent {
      */
     #focusEffect;
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQueryFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQueryFiltersComponent, isStandalone: true, selector: "axp-query-filters", inputs: { filtersDefinitions: { classPropertyName: "filtersDefinitions", publicName: "filtersDefinitions", isSignal: true, isRequired: false, transformFunction: null }, initialFilters: { classPropertyName: "initialFilters", publicName: "initialFilters", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, quickSearch: { classPropertyName: "quickSearch", publicName: "quickSearch", isSignal: true, isRequired: false, transformFunction: null }, sortPresets: { classPropertyName: "sortPresets", publicName: "sortPresets", isSignal: true, isRequired: false, transformFunction: null }, activeSortPresetName: { classPropertyName: "activeSortPresetName", publicName: "activeSortPresetName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onFiltersChanged: "onFiltersChanged", onSortPresetSelected: "onSortPresetSelected" }, viewQueries: [{ propertyName: "tagBox", first: true, predicate: ["tagBox"], descendants: true, isSignal: true }, { propertyName: "mobileFilterTrigger", first: true, predicate: ["mobileFilterTrigger"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "widgetsContainer", first: true, predicate: AXPWidgetContainerComponent, descendants: true, isSignal: true }, { propertyName: "widgetRenderers", predicate: AXPWidgetRendererDirective, descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }, { propertyName: "listItems", predicate: ["caseItem"], descendants: true }], ngImport: i0, template: "<div\n  class=\"flex w-full min-w-0 items-center gap-2 p-2\"\n  [class.axp-query-filters__bar--toggle-collapsed]=\"deviceService.isSmall() && mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n  (keydown.control.space)=\"openFilterPopover()\"\n>\n  @if (deviceService.isSmall()) {\n    <!-- ----- Inline search replaces the chip row ----- -->\n    @if (mobileSearchOpen()) {\n      <div id=\"axp-query-filters-mobile-search\" class=\"axp-query-filters__mobile-search\">\n        <ax-search-box\n          class=\"ax-sm\"\n          [value]=\"mobileSearchText()\"\n          [delayTime]=\"300\"\n          [placeholder]=\"('@general:terms.interface.filter.search-placeholder' | translate | async) ?? ''\"\n          (onValueChanged)=\"handleMobileSearchChanged($event)\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <!-- ----- Compact pill row instead of the desktop tag-box toolbar ----- -->\n    @else {\n      <div\n        #mobileFilterTrigger\n        class=\"axp-query-filters__mobile-row\"\n        [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n        (wheel)=\"handleChipsWheel($event)\"\n        (pointerdown)=\"handleChipsPointerDown($event)\"\n        (scroll)=\"handleMobileChipsScroll($event)\"\n      >\n      @for (chip of mobileFilterChips(); track chip.id) {\n        <!--->\n        <!-- ----- Applied filter chip keeps the field title, with a primary border ----- -->\n        @if (chip.kind === 'applied') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--applied\"\n            [class.axp-query-filters__mobile-chip--search]=\"chip.tag.field === 'all'\"\n            (click)=\"handleTagClick(chip.tag, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ mobileChipLabel(chip.tag) }}</span>\n            <!--->\n            <!-- ----- Remove this applied filter ----- -->\n            @if (!chip.tag.readOnly) {\n              <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, chip.tagIndex)\" type=\"button\">\n                <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n              </button>\n            }\n          </div>\n        }\n        <!-- ----- Unused filter field as an outline chip ----- -->\n        @else if (chip.kind === 'available') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--available\"\n            [class.axp-query-filters__mobile-chip--disabled]=\"isFilterDisabled(chip.definition)\"\n            [attr.aria-disabled]=\"isFilterDisabled(chip.definition) ? 'true' : null\"\n            (click)=\"openMobileAvailableFilter(chip.definition, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ chip.definition.title | translate | async }}</span>\n            <ax-icon class=\"fa-light fa-angle-down axp-query-filters__mobile-chip-caret\"></ax-icon>\n          </div>\n        }\n      }\n      @for (preset of sortPresets(); track preset.name) {\n        <!--------------------------------------------------------------->\n        <!-- ----- Sort preset pill in the same row as advance filters ----- -->\n        <div\n          class=\"axp-query-filters__mobile-chip\"\n          [class.axp-query-filters__mobile-chip--applied]=\"isMobileSortPresetActive(preset)\"\n          [class.axp-query-filters__mobile-chip--available]=\"!isMobileSortPresetActive(preset)\"\n          [attr.aria-pressed]=\"isMobileSortPresetActive(preset)\"\n          (click)=\"applyMobileSortPreset(preset, $event)\"\n        >\n          <span class=\"axp-query-filters__mobile-chip-text\">{{ preset.title | translate | async }}</span>\n          <!--------------------------------------------------------------->\n          <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n          @if (preset.icon) {\n            <ax-icon [class]=\"preset.icon + ' axp-query-filters__mobile-chip-caret'\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Descending hint when the first sort is descending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'desc') {\n            <ax-icon class=\"fa-solid fa-arrow-down-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Ascending hint when the first sort is ascending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'asc') {\n            <ax-icon class=\"fa-solid fa-arrow-up-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n        </div>\n      }\n    </div>\n    }\n    <div\n      class=\"axp-query-filters__mode-toggle\"\n      [class.axp-query-filters__mode-toggle--collapsed]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.aria-hidden]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.inert]=\"mobileModeToggleCollapsed() && !mobileSearchOpen() ? true : null\"\n      role=\"tablist\"\n      [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n    >\n      <div class=\"axp-query-filters__mode-toggle-inner\">\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"!mobileSearchOpen()\"\n          [disabled]=\"isMobileFilterModeLocked()\"\n          [attr.aria-selected]=\"!mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(false)\"\n        >\n          <ax-icon class=\"fa-light fa-filter\"></ax-icon>\n        </button>\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"mobileSearchOpen()\"\n          [disabled]=\"isMobileSearchModeLocked()\"\n          [attr.aria-selected]=\"mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:actions.search.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(true)\"\n        >\n          <ax-icon class=\"fa-light fa-magnifying-glass\"></ax-icon>\n        </button>\n      </div>\n    </div>\n  } @else {\n    <!-- ----- Root AND/OR when more than one visible chip, including All ----- -->\n    @if (isAdvanced() && hasMultipleFilterGroups()) {\n      <ax-button-group\n        class=\"axp-query-filters__logic-toggle ax-sm shrink-0\"\n        [selection]=\"'single'\"\n        [look]=\"'outline'\"\n        [color]=\"'primary'\"\n      >\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-and' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'and'\" (onClick)=\"setRootLogic('and')\"></ax-button-group-item>\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-or' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'or'\" (onClick)=\"setRootLogic('or')\"></ax-button-group-item>\n      </ax-button-group>\n    }\n    <!-- ----- Filter picker when root AND/OR is hidden ----- -->\n    @else {\n      <ax-button (keydown)=\"handleButtonKeyDown($event)\" (onClick)=\"isAdvanced() ? openNewFilterGroup() : openFilterPopover()\" #filterButton [look]=\"'blank'\">\n        <ax-icon class=\"far fa-bars-filter cursor-pointer\"></ax-icon>\n      </ax-button>\n    }\n  }\n  <div\n    class=\"axp-query-filters__chips min-w-0\"\n    [class.flex-1]=\"!deviceService.isSmall()\"\n    [class.hidden]=\"deviceService.isSmall()\"\n    [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n    (click)=\"handleTagBoxClick($event)\"\n    (wheel)=\"handleChipsWheel($event)\"\n    (pointerdown)=\"handleChipsPointerDown($event)\"\n  >\n    <ax-tag-box\n      #tagBoxComponent\n      [ngModel]=\"asyncTags()\"\n      (onValueChanged)=\"handleSelectFilters($event)\"\n      [textField]=\"'query'\"\n      [valueField]=\"'id'\"\n      [readonly]=\"filtersDefinitions().length === 0\"\n      [look]=\"'none'\"\n      [readonlyField]=\"'readOnly'\"\n      [tagTemplate]=\"tagTemplate\"\n      (onKeyDown)=\"handleKeyDown($event)\"\n      [addOnEnter]=\"false\"\n      [allowDuplicateValues]=\"true\"\n      [placeholder]=\"(filtersDefinitions().length === 0 ? '@general:terms.interface.filter.no-filter-definitions' : '@general:terms.interface.filter.placeholder') | translate | async\"\n      #tagBox\n    >\n      <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n        <ax-kbd look=\"blank\">\n          <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n        </ax-kbd>\n      </ax-suffix>\n    </ax-tag-box>\n  </div>\n\n  <ng-template #tagTemplate let-item let-index=\"index\">\n    <div class=\"axp-query-filters__chip\" [class.axp-query-filters__chip--active]=\"item.id === activeChipId()\" [class.axp-query-filters__chip--search]=\"item.field === 'all'\" (click)=\"handleTagClick(item, $event)\">\n      <!-- ----- Quick search chip keeps a single text label ----- -->\n      @if (item.chipMode === 'search') {\n        <span class=\"axp-query-filters__chip-text\">{{ item.query }}</span>\n      } @else if (item.chipMode === 'summary') {\n        <!-- ----- Summary chip when more than two conditions ----- -->\n        @if (item.titleLabel) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}:</span>\n        }\n        <span class=\"axp-query-filters__chip-text\">{{ item.summaryText }}</span>\n      } @else {\n        <!-- ----- One or two conditions: field + operator + quoted value ----- -->\n        @if (item.titleLabel && !item.mixed) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}</span>\n        }\n        @for (cond of item.chipConditions; track $index) {\n          <!--->\n          <!-- ----- Logic connector between conditions ----- -->\n          @if ($index > 0) {\n            <span class=\"axp-query-filters__chip-logic\">{{ item.logicLabel }}</span>\n          }\n          <!--->\n          <!-- ----- Field title on mixed-field chips ----- -->\n          @if (item.mixed && cond.title) {\n            <span class=\"axp-query-filters__chip-title\">{{ cond.title }}</span>\n          }\n          <span class=\"axp-query-filters__chip-operator\">{{ cond.operator }}</span>\n          <!--->\n          <!-- ----- Quoted value badge when the operator has a display value ----- -->\n          @if (cond.value) {\n            <span class=\"axp-query-filters__chip-value\">'{{ cond.value }}'</span>\n          }\n        }\n      }\n      @if (!item.readOnly) {\n        <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n          <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n        </button>\n      }\n    </div>\n  </ng-template>\n</div>\n\n<ax-popover [offsetY]=\"activeFilter() ? -30 : 0\" [openOn]=\"'toggle'\" (onOpened)=\"onPopoverOpened($event)\" [closeOn]=\"'clickOut'\" (onClosed)=\"handlePopoverClosed($event)\" [adaptivityEnabled]=\"true\" #popover>\n  <div class=\"axp-query-filters__popover md:min-w-72 w-full rounded-md md:max-h-[min(32rem,80vh)] lg:w-[520px] md:overflow-auto\">\n    <axp-widgets-container #widgetsContainer [context]=\"context()\" (onContextChanged)=\"onContextChanged($event)\">\n      @if (activeFilter()) {\n        <div class=\"flex flex-col lightest-surface shadow-md\" (keydown.enter)=\"onEnterKeyPressed($event)\">\n          <ax-header class=\"axp-query-filters__editor-header border-b border-border-light px-4 py-2\">\n            <div class=\"flex min-w-0 items-center gap-2 font-semibold\">\n              <!--->\n              <!-- ----- Field icon when the group is a single field ----- -->\n              @if (!isMixedEditingGroup() && activeFilter()?.icon) {\n                <ax-icon class=\"w-5 shrink-0\" [class]=\"'fa-light ' + activeFilter()!.icon\"></ax-icon>\n              }\n              <span class=\"min-w-0 truncate\">\n                {{ isMixedEditingGroup() ? ('@general:terms.interface.filter.filter-group' | translate | async) : ('@general:terms.interface.filter.filter-on' | translate: { params: { title: activeFilterTitle() } } | async) }}\n              </span>\n            </div>\n            <!--->\n            <!-- ----- Condition logic AND/OR stays on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <ax-button-group class=\"axp-query-filters__logic-toggle ax-sm shrink-0\" [selection]=\"'single'\" [look]=\"'outline'\" [color]=\"'primary'\">\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-and-all' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'and'\" (onClick)=\"setEditingLogic('and')\"></ax-button-group-item>\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-or-any' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'or'\" (onClick)=\"setEditingLogic('or')\"></ax-button-group-item>\n              </ax-button-group>\n            }\n          </ax-header>\n          <ax-content class=\"p-4\">\n            @for (condition of editingConditions(); track condition.id; let i = $index) {\n              <!--->\n              <!-- ----- Numbered condition row with the field widget ----- -->\n              @if (i > 0 && !deviceService.isSmall()) {\n                <div class=\"axp-query-filters__logic-split\">\n                  <span class=\"axp-query-filters__logic-split-label\">{{ (editingLogic() === 'or' ? '@general:terms.interface.filter.chip-logic-or' : '@general:terms.interface.filter.chip-logic-and') | translate | async }}</span>\n                </div>\n              }\n              <div class=\"axp-query-filters__condition\">\n                <div class=\"axp-query-filters__condition-head\">\n                  <div class=\"axp-query-filters__condition-heading\">\n                    <!--->\n                    <!-- ----- Field picker for mixed-field groups in advanced mode ----- -->\n                    @if (isAdvanced()) {\n                      <ax-dropdown-button class=\"ax-sm\" [text]=\"(getConditionDefinition(condition.field)?.title | translate | async) ?? ''\" [mode]=\"'dropdown'\" [look]=\"'outline'\">\n                        <ax-button-item-list>\n                          @for (def of advancedFieldOptions(); track def.field) {\n                            <ax-button-item [text]=\"(def.title | translate | async) ?? ''\" [selected]=\"condition.field === def.field\" [disabled]=\"isFilterDisabled(def)\" (onClick)=\"setConditionField(condition.id, def.field ?? '')\"></ax-button-item>\n                          }\n                        </ax-button-item-list>\n                      </ax-dropdown-button>\n                    }\n                    <!--->\n                    <!-- ----- Active operator for this condition ----- -->\n                    @if (getConditionOperatorKey(condition.id); as operatorKey) {\n                      <ax-badge [text]=\"(operatorKey | translate | async) || ''\"></ax-badge>\n                    }\n                  </div>\n                  <button type=\"button\" class=\"axp-query-filters__condition-remove\" (click)=\"handleRemoveCondition(condition.id)\">\n                    <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n                  </button>\n                </div>\n                <ng-container\n                  axp-widget-renderer\n                  [node]=\"{\n                    type: getConditionWidget(condition)?.type || 'text-editor',\n                    path: resolveEditingConditionContextField(condition.id),\n                    options: $safeNavigationMigration(getConditionWidget(condition)?.options),\n                  }\"\n                  [mode]=\"'edit'\"\n                ></ng-container>\n              </div>\n            }\n            <!--->\n            <!-- ----- Extra conditions stay on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <button type=\"button\" class=\"axp-query-filters__add-condition\" (click)=\"handleAddCondition()\">\n                <ax-icon class=\"fa-light fa-plus\"></ax-icon>\n                <span>{{ (isAdvanced() ? '@general:terms.interface.filter.add-condition-generic' : '@general:terms.interface.filter.add-condition') | translate: { params: { title: activeFilterTitle() } } | async }}</span>\n              </button>\n            }\n          </ax-content>\n          <ax-footer class=\"border-t flex justify-end gap-2 border-border-light w-full px-4 py-2\">\n            <ax-button class=\"ax-sm\" [look]=\"'blank'\" [text]=\"'@general:actions.cancel.title' | translate | async\" (onClick)=\"handleCancelFilter()\"></ax-button>\n            <ax-button class=\"ax-sm\" [color]=\"'primary'\" [disabled]=\"!canApplyFilter()\" [text]=\"'@general:terms.interface.filter.apply-filter' | translate | async\" (onClick)=\"handleApplyFilter()\"></ax-button>\n          </ax-footer>\n        </div>\n      } @else {\n        <!-- ----- Field picker when no filter is being edited ----- -->\n        <div class=\"flex flex-col lightest-surface\">\n          <div axListNavigation #list=\"axListNavigation\" class=\"axp-list-items border-none\">\n          @for (field of filterFields(); track field.field) {\n            <div\n              axListNavigationItem\n              #caseItem=\"axListNavigationItem\"\n              [class.axp-state-focused]=\"caseItem.isActive() && !isFilterDisabled(field)\"\n              [class.axp-query-filters__advance-item--disabled]=\"isFilterDisabled(field)\"\n              [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n              [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n              (click)=\"handleSelectField(field)\"\n              (keydown)=\"handleFieldKeyDown($event, field)\"\n            >\n              <div class=\"flex items-end gap-2\">\n                <ax-icon class=\"w-5\" [class]=\"'fa-light ' + field.icon\"></ax-icon>\n                {{ field.title | translate | async }}\n              </div>\n            </div>\n          }\n        </div>\n        </div>\n      }\n    </axp-widgets-container>\n  </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{display:block;width:100%;min-width:0px;overflow:hidden}axp-query-filters>.flex{min-width:0px;flex-wrap:nowrap}axp-query-filters ax-tag-box{width:100%;min-width:0px}axp-query-filters ax-tag-box .editor-container,axp-query-filters ax-tag-box .ax-editor-container{display:flex;width:100%;min-width:0px;flex-wrap:nowrap;align-items:center;background-color:transparent}axp-query-filters ax-tag-box .ax-tags-container{display:flex;flex:1 1 0%;min-width:0;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container{scrollbar-width:none;-ms-overflow-style:none}:is(.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container)::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__chips{min-width:0px;cursor:grab;overflow-x:auto;overflow-y:hidden}.axp-query-filters__chips.axp-query-filters__chips--panning,.axp-query-filters__chips.axp-query-filters__chips--panning *{cursor:grabbing;-webkit-user-select:none;user-select:none}.axp-query-filters__chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--radius-lg, .5rem);background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));white-space:nowrap}.axp-query-filters__chip:hover{background-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-query-filters__chip--search,.axp-query-filters__chip--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}:is(.axp-query-filters__chip--search,.axp-query-filters__chip--active):hover{background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__chip-title{flex-shrink:0;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip-text,.axp-query-filters__chip-operator{min-width:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__chip-logic{flex-shrink:0;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__chip--active .axp-query-filters__chip-logic,.axp-query-filters__chip--search .axp-query-filters__chip-logic{color:var(--color-white, #fff)}.axp-query-filters__chip-value{display:inline-flex;max-width:12rem;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in srgb,#fff 20%,transparent);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axp-query-filters__chip-remove{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;justify-content:center;opacity:70%}.axp-query-filters__chip-remove:hover{opacity:100%}.axp-query-filters__mode-toggle{flex:0 0 auto;max-width:6rem;overflow:visible;transition:max-width .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed{max-width:0;pointer-events:none}.axp-query-filters__mode-toggle-inner{position:relative;z-index:10;margin-inline-start:var(--spacing, .25rem);display:inline-flex;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-light-surface));--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);width:max-content;transform:translate(0);transition:transform .32s cubic-bezier(.32,.72,0,1),margin .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{margin-inline-start:0;transform:translate(5rem)}[dir=rtl] .axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{transform:translate(-5rem)}.axp-query-filters__mode-toggle-btn{display:inline-flex;align-items:center;justify-content:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));width:2rem;height:1.75rem}.axp-query-filters__mode-toggle-btn:first-child{border-start-start-radius:calc(infinity * 1px);border-end-start-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn:last-child{border-start-end-radius:calc(infinity * 1px);border-end-end-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}.axp-query-filters__mode-toggle-btn:disabled:not(.axp-query-filters__mode-toggle-btn--active){cursor:not-allowed;opacity:40%}.axp-query-filters__mobile-search{min-width:0px;flex:1}.axp-query-filters__mobile-search ax-search-box,.axp-query-filters__mobile-search ax-search-box .ax-editor,.axp-query-filters__mobile-search ax-search-box .ax-editor-container,.axp-query-filters__mobile-search ax-search-box .editor-container{min-height:2rem;height:2rem}.axp-query-filters__mobile-search ax-search-box input{min-height:2rem;height:2rem;font-size:.875rem;line-height:1.25rem}.axp-query-filters__mobile-row{display:flex;min-width:0px;flex:1;flex-wrap:nowrap;align-items:center;gap:var(--spacing, .25rem);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.axp-query-filters__mobile-row::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__mobile-chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:var(--spacing, .25rem);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);border-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap}.axp-query-filters__mobile-chip--available{cursor:pointer;background-color:transparent}.axp-query-filters__mobile-chip--disabled{cursor:not-allowed;opacity:50%}.axp-query-filters__mobile-chip--applied{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:transparent;color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__mobile-chip-text{max-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__mobile-chip-caret{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}.axp-query-filters__editor-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-query-filters__logic-toggle ax-button-group-item.ax-state-selected ax-button button,.axp-query-filters__logic-toggle ax-button button.ax-state-selected{background-image:none;box-shadow:none;background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}@media(max-width:600px){axp-query-filters{overflow:hidden}axp-query-filters>.flex{gap:.5rem;padding-block:0;padding-inline:.125rem;overflow:hidden}axp-query-filters>.flex.axp-query-filters__bar--toggle-collapsed{gap:0}.axp-query-filters__logic-toggle{flex-wrap:nowrap}.axp-query-filters__logic-toggle ax-button>button{min-height:2rem;height:2rem;padding-inline:.5rem;padding-block:0;font-size:.875rem;line-height:1.25rem;font-weight:600}.axp-query-filters__chip{gap:.375rem;padding-inline:.75rem;padding-block:.25rem;font-size:.875rem}.axp-query-filters__chip-value{max-width:none;font-size:.875rem}}.axp-query-filters__condition{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-head{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-heading{display:flex;min-width:0px;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-title{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-remove{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove:hover{color:rgba(var(--ax-sys-color-danger-surface))}.axp-query-filters__logic-split{position:relative;margin-block:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:center}.axp-query-filters__logic-split:before,.axp-query-filters__logic-split:after{content:\"\";height:1px;flex:1;background-color:rgba(var(--ax-sys-color-border-light-surface))}.axp-query-filters__logic-split-label{margin-inline:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:10px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__add-condition{margin-top:calc(var(--spacing, .25rem) * 3);display:inline-flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__add-condition:hover{text-decoration-line:underline}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@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-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$2.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: i2$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i3$6.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "fitParent", "color", "look", "class", "selection"], outputs: ["onBlur", "onFocus", "disabledChange", "colorChange", "lookChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i3$6.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["disabled", "color", "text", "class", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange", "classChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i3$5.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "text", "color", "look", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: AXKBDComponent, selector: "ax-kbd", inputs: ["look"] }, { kind: "component", type: AXKBDItemComponent, selector: "ax-kbd-item", inputs: ["keys", "join", "look"], outputs: ["lookChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2$3.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: AXSearchBoxModule }, { kind: "component", type: i3$2.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: AXSelectionListModule }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i8.AXTagBoxComponent, selector: "ax-tag-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "allowNull", "type", "look", "addOnComma", "addOnEnter", "valueField", "textField", "readonlyField", "allowDuplicateValues", "tagTemplate"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onTagClick", "onTagDblClick", "onTagContextMenu"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1$4.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i1$4.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i10.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i10.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i1$2.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.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: AXPQueryFiltersComponent, isStandalone: true, selector: "axp-query-filters", inputs: { filtersDefinitions: { classPropertyName: "filtersDefinitions", publicName: "filtersDefinitions", isSignal: true, isRequired: false, transformFunction: null }, initialFilters: { classPropertyName: "initialFilters", publicName: "initialFilters", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, quickSearch: { classPropertyName: "quickSearch", publicName: "quickSearch", isSignal: true, isRequired: false, transformFunction: null }, sortPresets: { classPropertyName: "sortPresets", publicName: "sortPresets", isSignal: true, isRequired: false, transformFunction: null }, activeSortPresetName: { classPropertyName: "activeSortPresetName", publicName: "activeSortPresetName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onFiltersChanged: "onFiltersChanged", onSortPresetSelected: "onSortPresetSelected" }, viewQueries: [{ propertyName: "tagBox", first: true, predicate: ["tagBox"], descendants: true, isSignal: true }, { propertyName: "mobileFilterTrigger", first: true, predicate: ["mobileFilterTrigger"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "widgetsContainer", first: true, predicate: AXPWidgetContainerComponent, descendants: true, isSignal: true }, { propertyName: "widgetRenderers", predicate: AXPWidgetRendererDirective, descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }, { propertyName: "listItems", predicate: ["caseItem"], descendants: true }], ngImport: i0, template: "<div\n  class=\"flex w-full min-w-0 items-center gap-2 px-1.5 py-1\"\n  [class.axp-query-filters__bar--toggle-collapsed]=\"deviceService.isSmall() && mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n  (keydown.control.space)=\"openFilterPopover()\"\n>\n  @if (deviceService.isSmall()) {\n    <!-- ----- Inline search replaces the chip row ----- -->\n    @if (mobileSearchOpen()) {\n      <div id=\"axp-query-filters-mobile-search\" class=\"axp-query-filters__mobile-search\">\n        <ax-search-box\n          class=\"ax-sm\"\n          [value]=\"mobileSearchText()\"\n          [delayTime]=\"300\"\n          [placeholder]=\"('@general:terms.interface.filter.search-placeholder' | translate | async) ?? ''\"\n          (onValueChanged)=\"handleMobileSearchChanged($event)\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <!-- ----- Compact pill row instead of the desktop tag-box toolbar ----- -->\n    @else {\n      <div\n        #mobileFilterTrigger\n        class=\"axp-query-filters__mobile-row\"\n        [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n        (wheel)=\"handleChipsWheel($event)\"\n        (pointerdown)=\"handleChipsPointerDown($event)\"\n        (scroll)=\"handleMobileChipsScroll($event)\"\n      >\n      @for (chip of mobileFilterChips(); track chip.id) {\n        <!--->\n        <!-- ----- Applied filter chip keeps the field title, with a primary border ----- -->\n        @if (chip.kind === 'applied') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--applied\"\n            [class.axp-query-filters__mobile-chip--search]=\"chip.tag.field === 'all'\"\n            (click)=\"handleTagClick(chip.tag, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ mobileChipLabel(chip.tag) }}</span>\n            <!--->\n            <!-- ----- Remove this applied filter ----- -->\n            @if (!chip.tag.readOnly) {\n              <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, chip.tagIndex)\" type=\"button\">\n                <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n              </button>\n            }\n          </div>\n        }\n        <!-- ----- Unused filter field as an outline chip ----- -->\n        @else if (chip.kind === 'available') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--available\"\n            [class.axp-query-filters__mobile-chip--disabled]=\"isFilterDisabled(chip.definition)\"\n            [attr.aria-disabled]=\"isFilterDisabled(chip.definition) ? 'true' : null\"\n            (click)=\"openMobileAvailableFilter(chip.definition, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ chip.definition.title | translate | async }}</span>\n            <ax-icon class=\"fa-light fa-angle-down axp-query-filters__mobile-chip-caret\"></ax-icon>\n          </div>\n        }\n      }\n      @for (preset of sortPresets(); track preset.name) {\n        <!--------------------------------------------------------------->\n        <!-- ----- Sort preset pill in the same row as advance filters ----- -->\n        <div\n          class=\"axp-query-filters__mobile-chip\"\n          [class.axp-query-filters__mobile-chip--applied]=\"isMobileSortPresetActive(preset)\"\n          [class.axp-query-filters__mobile-chip--available]=\"!isMobileSortPresetActive(preset)\"\n          [attr.aria-pressed]=\"isMobileSortPresetActive(preset)\"\n          (click)=\"applyMobileSortPreset(preset, $event)\"\n        >\n          <span class=\"axp-query-filters__mobile-chip-text\">{{ preset.title | translate | async }}</span>\n          <!--------------------------------------------------------------->\n          <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n          @if (preset.icon) {\n            <ax-icon [class]=\"preset.icon + ' axp-query-filters__mobile-chip-caret'\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Descending hint when the first sort is descending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'desc') {\n            <ax-icon class=\"fa-solid fa-arrow-down-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Ascending hint when the first sort is ascending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'asc') {\n            <ax-icon class=\"fa-solid fa-arrow-up-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n        </div>\n      }\n    </div>\n    }\n    <div\n      class=\"axp-query-filters__mode-toggle\"\n      [class.axp-query-filters__mode-toggle--collapsed]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.aria-hidden]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.inert]=\"mobileModeToggleCollapsed() && !mobileSearchOpen() ? true : null\"\n      role=\"tablist\"\n      [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n    >\n      <div class=\"axp-query-filters__mode-toggle-inner\">\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"!mobileSearchOpen()\"\n          [disabled]=\"isMobileFilterModeLocked()\"\n          [attr.aria-selected]=\"!mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(false)\"\n        >\n          <ax-icon class=\"fa-light fa-filter\"></ax-icon>\n        </button>\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"mobileSearchOpen()\"\n          [disabled]=\"isMobileSearchModeLocked()\"\n          [attr.aria-selected]=\"mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:actions.search.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(true)\"\n        >\n          <ax-icon class=\"fa-light fa-magnifying-glass\"></ax-icon>\n        </button>\n      </div>\n    </div>\n  } @else {\n    <!-- ----- Root AND/OR when more than one visible chip, including All ----- -->\n    @if (isAdvanced() && hasMultipleFilterGroups()) {\n      <ax-button-group\n        class=\"axp-query-filters__logic-toggle ax-sm shrink-0\"\n        [selection]=\"'single'\"\n        [look]=\"'outline'\"\n        [color]=\"'primary'\"\n      >\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-and' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'and'\" (onClick)=\"setRootLogic('and')\"></ax-button-group-item>\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-or' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'or'\" (onClick)=\"setRootLogic('or')\"></ax-button-group-item>\n      </ax-button-group>\n    }\n    <!-- ----- Filter picker when root AND/OR is hidden ----- -->\n    @else {\n      <ax-button (keydown)=\"handleButtonKeyDown($event)\" (onClick)=\"isAdvanced() ? openNewFilterGroup() : openFilterPopover()\" #filterButton [look]=\"'blank'\">\n        <ax-icon class=\"far fa-bars-filter cursor-pointer\"></ax-icon>\n      </ax-button>\n    }\n  }\n  <div\n    class=\"axp-query-filters__chips min-w-0\"\n    [class.flex-1]=\"!deviceService.isSmall()\"\n    [class.hidden]=\"deviceService.isSmall()\"\n    [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n    (click)=\"handleTagBoxClick($event)\"\n    (wheel)=\"handleChipsWheel($event)\"\n    (pointerdown)=\"handleChipsPointerDown($event)\"\n  >\n    <ax-tag-box\n      #tagBoxComponent\n      [ngModel]=\"asyncTags()\"\n      (onValueChanged)=\"handleSelectFilters($event)\"\n      [textField]=\"'query'\"\n      [valueField]=\"'id'\"\n      [readonly]=\"filtersDefinitions().length === 0\"\n      [look]=\"'none'\"\n      [readonlyField]=\"'readOnly'\"\n      [tagTemplate]=\"tagTemplate\"\n      (onKeyDown)=\"handleKeyDown($event)\"\n      [addOnEnter]=\"false\"\n      [allowDuplicateValues]=\"true\"\n      [placeholder]=\"(filtersDefinitions().length === 0 ? '@general:terms.interface.filter.no-filter-definitions' : '@general:terms.interface.filter.placeholder') | translate | async\"\n      #tagBox\n    >\n      <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n        <ax-kbd look=\"blank\">\n          <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n        </ax-kbd>\n      </ax-suffix>\n    </ax-tag-box>\n  </div>\n\n  <ng-template #tagTemplate let-item let-index=\"index\">\n    <div class=\"axp-query-filters__chip\" [class.axp-query-filters__chip--active]=\"item.id === activeChipId()\" [class.axp-query-filters__chip--search]=\"item.field === 'all'\" (click)=\"handleTagClick(item, $event)\">\n      <!-- ----- Quick search chip keeps a single text label ----- -->\n      @if (item.chipMode === 'search') {\n        <span class=\"axp-query-filters__chip-text\">{{ item.query }}</span>\n      } @else if (item.chipMode === 'summary') {\n        <!-- ----- Summary chip when more than two conditions ----- -->\n        @if (item.titleLabel) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}:</span>\n        }\n        <span class=\"axp-query-filters__chip-text\">{{ item.summaryText }}</span>\n      } @else {\n        <!-- ----- One or two conditions: field + operator + quoted value ----- -->\n        @if (item.titleLabel && !item.mixed) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}</span>\n        }\n        @for (cond of item.chipConditions; track $index) {\n          <!--->\n          <!-- ----- Logic connector between conditions ----- -->\n          @if ($index > 0) {\n            <span class=\"axp-query-filters__chip-logic\">{{ item.logicLabel }}</span>\n          }\n          <!--->\n          <!-- ----- Field title on mixed-field chips ----- -->\n          @if (item.mixed && cond.title) {\n            <span class=\"axp-query-filters__chip-title\">{{ cond.title }}</span>\n          }\n          <span class=\"axp-query-filters__chip-operator\">{{ cond.operator }}</span>\n          <!--->\n          <!-- ----- Quoted value badge when the operator has a display value ----- -->\n          @if (cond.value) {\n            <span class=\"axp-query-filters__chip-value\">'{{ cond.value }}'</span>\n          }\n        }\n      }\n      @if (!item.readOnly) {\n        <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n          <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n        </button>\n      }\n    </div>\n  </ng-template>\n</div>\n\n<ax-popover [offsetY]=\"activeFilter() ? -30 : 0\" [openOn]=\"'toggle'\" (onOpened)=\"onPopoverOpened($event)\" [closeOn]=\"'clickOut'\" (onClosed)=\"handlePopoverClosed($event)\" [adaptivityEnabled]=\"true\" #popover>\n  <div class=\"axp-query-filters__popover md:min-w-72 w-full rounded-md md:max-h-[min(32rem,80vh)] lg:w-[520px] md:overflow-auto\">\n    <axp-widgets-container #widgetsContainer [context]=\"context()\" (onContextChanged)=\"onContextChanged($event)\">\n      @if (activeFilter()) {\n        <div class=\"flex flex-col lightest-surface shadow-md\" (keydown.enter)=\"onEnterKeyPressed($event)\">\n          <ax-header class=\"axp-query-filters__editor-header border-b border-border-light px-4 py-2\">\n            <div class=\"flex min-w-0 items-center gap-2 font-semibold\">\n              <!--->\n              <!-- ----- Field icon when the group is a single field ----- -->\n              @if (!isMixedEditingGroup() && activeFilter()?.icon) {\n                <ax-icon class=\"w-5 shrink-0\" [class]=\"'fa-light ' + activeFilter()!.icon\"></ax-icon>\n              }\n              <span class=\"min-w-0 truncate\">\n                {{ isMixedEditingGroup() ? ('@general:terms.interface.filter.filter-group' | translate | async) : ('@general:terms.interface.filter.filter-on' | translate: { params: { title: activeFilterTitle() } } | async) }}\n              </span>\n            </div>\n            <!--->\n            <!-- ----- Condition logic AND/OR stays on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <ax-button-group class=\"axp-query-filters__logic-toggle ax-sm shrink-0\" [selection]=\"'single'\" [look]=\"'outline'\" [color]=\"'primary'\">\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-and-all' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'and'\" (onClick)=\"setEditingLogic('and')\"></ax-button-group-item>\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-or-any' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'or'\" (onClick)=\"setEditingLogic('or')\"></ax-button-group-item>\n              </ax-button-group>\n            }\n          </ax-header>\n          <ax-content class=\"p-4\">\n            @for (condition of editingConditions(); track condition.id; let i = $index) {\n              <!--->\n              <!-- ----- Numbered condition row with the field widget ----- -->\n              @if (i > 0 && !deviceService.isSmall()) {\n                <div class=\"axp-query-filters__logic-split\">\n                  <span class=\"axp-query-filters__logic-split-label\">{{ (editingLogic() === 'or' ? '@general:terms.interface.filter.chip-logic-or' : '@general:terms.interface.filter.chip-logic-and') | translate | async }}</span>\n                </div>\n              }\n              <div class=\"axp-query-filters__condition\">\n                <div class=\"axp-query-filters__condition-head\">\n                  <div class=\"axp-query-filters__condition-heading\">\n                    <!--->\n                    <!-- ----- Field picker for mixed-field groups in advanced mode ----- -->\n                    @if (isAdvanced()) {\n                      <ax-dropdown-button class=\"ax-sm\" [text]=\"(getConditionDefinition(condition.field)?.title | translate | async) ?? ''\" [mode]=\"'dropdown'\" [look]=\"'outline'\">\n                        <ax-button-item-list>\n                          @for (def of advancedFieldOptions(); track def.field) {\n                            <ax-button-item [text]=\"(def.title | translate | async) ?? ''\" [selected]=\"condition.field === def.field\" [disabled]=\"isFilterDisabled(def)\" (onClick)=\"setConditionField(condition.id, def.field ?? '')\"></ax-button-item>\n                          }\n                        </ax-button-item-list>\n                      </ax-dropdown-button>\n                    }\n                    <!--->\n                    <!-- ----- Active operator for this condition ----- -->\n                    @if (getConditionOperatorKey(condition.id); as operatorKey) {\n                      <ax-badge [text]=\"(operatorKey | translate | async) || ''\"></ax-badge>\n                    }\n                  </div>\n                  <button type=\"button\" class=\"axp-query-filters__condition-remove\" (click)=\"handleRemoveCondition(condition.id)\">\n                    <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n                  </button>\n                </div>\n                <ng-container\n                  axp-widget-renderer\n                  [node]=\"{\n                    type: getConditionWidget(condition)?.type || 'text-editor',\n                    path: resolveEditingConditionContextField(condition.id),\n                    options: $safeNavigationMigration(getConditionWidget(condition)?.options),\n                  }\"\n                  [mode]=\"'edit'\"\n                ></ng-container>\n              </div>\n            }\n            <!--->\n            <!-- ----- Extra conditions stay on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <button type=\"button\" class=\"axp-query-filters__add-condition\" (click)=\"handleAddCondition()\">\n                <ax-icon class=\"fa-light fa-plus\"></ax-icon>\n                <span>{{ (isAdvanced() ? '@general:terms.interface.filter.add-condition-generic' : '@general:terms.interface.filter.add-condition') | translate: { params: { title: activeFilterTitle() } } | async }}</span>\n              </button>\n            }\n          </ax-content>\n          <ax-footer class=\"border-t flex justify-end gap-2 border-border-light w-full px-4 py-2\">\n            <ax-button class=\"ax-sm\" [look]=\"'blank'\" [text]=\"'@general:actions.cancel.title' | translate | async\" (onClick)=\"handleCancelFilter()\"></ax-button>\n            <ax-button class=\"ax-sm\" [color]=\"'primary'\" [disabled]=\"!canApplyFilter()\" [text]=\"'@general:terms.interface.filter.apply-filter' | translate | async\" (onClick)=\"handleApplyFilter()\"></ax-button>\n          </ax-footer>\n        </div>\n      } @else {\n        <!-- ----- Field picker when no filter is being edited ----- -->\n        <div class=\"flex flex-col lightest-surface\">\n          <div axListNavigation #list=\"axListNavigation\" class=\"axp-list-items border-none\">\n          @for (field of filterFields(); track field.field) {\n            <div\n              axListNavigationItem\n              #caseItem=\"axListNavigationItem\"\n              [class.axp-state-focused]=\"caseItem.isActive() && !isFilterDisabled(field)\"\n              [class.axp-query-filters__advance-item--disabled]=\"isFilterDisabled(field)\"\n              [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n              [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n              (click)=\"handleSelectField(field)\"\n              (keydown)=\"handleFieldKeyDown($event, field)\"\n            >\n              <div class=\"flex items-center gap-2\">\n                <ax-icon class=\"axp-query-filters__field-icon\" [ngClass]=\"'fa-light ' + field.icon\"></ax-icon>\n                <span class=\"leading-none\">{{ field.title | translate | async }}</span>\n              </div>\n            </div>\n          }\n        </div>\n        </div>\n      }\n    </axp-widgets-container>\n  </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{display:block;width:100%;min-width:0px;overflow:hidden}axp-query-filters>.flex{min-width:0px;flex-wrap:nowrap}axp-query-filters ax-tag-box{width:100%;min-width:0px}axp-query-filters ax-tag-box .editor-container,axp-query-filters ax-tag-box .ax-editor-container{display:flex;width:100%;min-width:0px;flex-wrap:nowrap;align-items:center;background-color:transparent;min-height:2.25rem}axp-query-filters ax-tag-box .ax-tags-container{display:flex;flex:1 1 0%;min-width:0;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}axp-query-filters>.flex>ax-button button{min-height:var(--ax-sys-size-base);height:var(--ax-sys-size-base);padding-block:0}.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container{scrollbar-width:none;-ms-overflow-style:none}:is(.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container)::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__chips{min-width:0px;cursor:grab;overflow-x:auto;overflow-y:hidden}.axp-query-filters__chips.axp-query-filters__chips--panning,.axp-query-filters__chips.axp-query-filters__chips--panning *{cursor:grabbing;-webkit-user-select:none;user-select:none}.axp-query-filters__chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:var(--spacing, .25rem);border-radius:var(--radius-md, .375rem);background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));white-space:nowrap}.axp-query-filters__chip:hover{background-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-query-filters__chip--search,.axp-query-filters__chip--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}:is(.axp-query-filters__chip--search,.axp-query-filters__chip--active):hover{background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__chip-title{flex-shrink:0;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip-text,.axp-query-filters__chip-operator{min-width:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__chip-logic{flex-shrink:0;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__chip--active .axp-query-filters__chip-logic,.axp-query-filters__chip--search .axp-query-filters__chip-logic{color:var(--color-white, #fff)}.axp-query-filters__chip-value{display:inline-flex;max-width:12rem;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in srgb,#fff 20%,transparent);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axp-query-filters__chip-remove{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;justify-content:center;opacity:70%}.axp-query-filters__chip-remove:hover{opacity:100%}.axp-query-filters__mode-toggle{flex:0 0 auto;max-width:6rem;overflow:visible;transition:max-width .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed{max-width:0;pointer-events:none}.axp-query-filters__mode-toggle-inner{position:relative;z-index:10;margin-inline-start:var(--spacing, .25rem);display:inline-flex;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-light-surface));--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);width:max-content;transform:translate(0);transition:transform .32s cubic-bezier(.32,.72,0,1),margin .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{margin-inline-start:0;transform:translate(5rem)}[dir=rtl] .axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{transform:translate(-5rem)}.axp-query-filters__mode-toggle-btn{display:inline-flex;align-items:center;justify-content:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));width:1.875rem;height:1.625rem}.axp-query-filters__mode-toggle-btn:first-child{border-start-start-radius:calc(infinity * 1px);border-end-start-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn:last-child{border-start-end-radius:calc(infinity * 1px);border-end-end-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}.axp-query-filters__mode-toggle-btn:disabled:not(.axp-query-filters__mode-toggle-btn--active){cursor:not-allowed;opacity:40%}.axp-query-filters__mobile-search{min-width:0px;flex:1}.axp-query-filters__mobile-search ax-search-box,.axp-query-filters__mobile-search ax-search-box .ax-editor,.axp-query-filters__mobile-search ax-search-box .ax-editor-container,.axp-query-filters__mobile-search ax-search-box .editor-container{min-height:1.875rem;height:1.875rem}.axp-query-filters__mobile-search ax-search-box input{min-height:1.875rem;height:1.875rem;font-size:.8125rem;line-height:1.125rem}.axp-query-filters__mobile-row{display:flex;min-width:0px;flex:1;flex-wrap:nowrap;align-items:center;gap:var(--spacing, .25rem);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.axp-query-filters__mobile-row::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__mobile-chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:var(--spacing, .25rem);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);border-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap}.axp-query-filters__mobile-chip--available{cursor:pointer;background-color:transparent}.axp-query-filters__mobile-chip--disabled{cursor:not-allowed;opacity:50%}.axp-query-filters__mobile-chip--applied{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:transparent;color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__mobile-chip-text{max-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__mobile-chip-caret{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}.axp-query-filters__editor-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-query-filters__logic-toggle ax-button-group-item.ax-state-selected ax-button button,.axp-query-filters__logic-toggle ax-button button.ax-state-selected{background-image:none;box-shadow:none;background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}.axp-query-filters__logic-toggle ax-button>button{min-height:2rem;height:2rem;padding-inline:.5rem;padding-block:0;font-size:.8125rem;line-height:1.125rem;font-weight:600}@media(max-width:600px){axp-query-filters{overflow:hidden}axp-query-filters>.flex{gap:.5rem;padding-block:0;padding-inline:.125rem;overflow:hidden}axp-query-filters>.flex.axp-query-filters__bar--toggle-collapsed{gap:0}.axp-query-filters__logic-toggle{flex-wrap:nowrap}.axp-query-filters__chip{gap:.375rem;padding-inline:.625rem;padding-block:.25rem;font-size:.8125rem}.axp-query-filters__chip-value{max-width:none;font-size:.8125rem}}.axp-query-filters__condition{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-head{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-heading{display:flex;min-width:0px;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-title{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-remove{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove:hover{color:rgba(var(--ax-sys-color-danger-surface))}.axp-query-filters__logic-split{position:relative;margin-block:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:center}.axp-query-filters__logic-split:before,.axp-query-filters__logic-split:after{content:\"\";height:1px;flex:1;background-color:rgba(var(--ax-sys-color-border-light-surface))}.axp-query-filters__logic-split-label{margin-inline:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:10px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__add-condition{margin-top:calc(var(--spacing, .25rem) * 3);display:inline-flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__add-condition:hover{text-decoration-line:underline}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}.axp-query-filters__field-icon{display:inline-flex;height:calc(var(--spacing, .25rem) * 4);width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;align-items:center;justify-content:center;--tw-leading: 1;line-height:1}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@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-leading: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$2.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: i2$2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i2$2.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXButtonGroupModule }, { kind: "component", type: i4$3.AXButtonGroupComponent, selector: "ax-button-group", inputs: ["disabled", "fitParent", "color", "look", "class", "selection"], outputs: ["onBlur", "onFocus", "disabledChange", "colorChange", "lookChange", "onClick", "selectionChange", "selectedButtonChange"] }, { kind: "component", type: i4$3.AXButtonGroupItemComponent, selector: "ax-button-group-item", inputs: ["disabled", "color", "text", "class", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange", "classChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "component", type: i3$5.AXDropdownButtonComponent, selector: "ax-dropdown-button", inputs: ["disabled", "size", "text", "color", "look", "type", "mode"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: AXKBDComponent, selector: "ax-kbd", inputs: ["look"] }, { kind: "component", type: AXKBDItemComponent, selector: "ax-kbd-item", inputs: ["keys", "join", "look"], outputs: ["lookChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPopoverModule }, { kind: "component", type: i2$3.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: AXSearchBoxModule }, { kind: "component", type: i3$2.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: AXSelectionListModule }, { kind: "ngmodule", type: AXTagBoxModule }, { kind: "component", type: i9.AXTagBoxComponent, selector: "ax-tag-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "allowNull", "type", "look", "addOnComma", "addOnEnter", "valueField", "textField", "readonlyField", "allowDuplicateValues", "tagTemplate"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onTagClick", "onTagDblClick", "onTagContextMenu"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1$4.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i1$4.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i11.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i11.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "component", type: i1$2.AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQueryFiltersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-query-filters', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, FormsModule, AXButtonModule, AXButtonGroupModule, AXDecoratorModule, AXDropdownButtonModule, AXKBDComponent, AXKBDItemComponent, AXTranslationModule, AXPopoverModule, AXSearchBoxModule, AXSelectionListModule, AXTagBoxModule, AXPWidgetCoreModule, AXListNavigationModule, AXBadgeModule], template: "<div\n  class=\"flex w-full min-w-0 items-center gap-2 p-2\"\n  [class.axp-query-filters__bar--toggle-collapsed]=\"deviceService.isSmall() && mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n  (keydown.control.space)=\"openFilterPopover()\"\n>\n  @if (deviceService.isSmall()) {\n    <!-- ----- Inline search replaces the chip row ----- -->\n    @if (mobileSearchOpen()) {\n      <div id=\"axp-query-filters-mobile-search\" class=\"axp-query-filters__mobile-search\">\n        <ax-search-box\n          class=\"ax-sm\"\n          [value]=\"mobileSearchText()\"\n          [delayTime]=\"300\"\n          [placeholder]=\"('@general:terms.interface.filter.search-placeholder' | translate | async) ?? ''\"\n          (onValueChanged)=\"handleMobileSearchChanged($event)\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <!-- ----- Compact pill row instead of the desktop tag-box toolbar ----- -->\n    @else {\n      <div\n        #mobileFilterTrigger\n        class=\"axp-query-filters__mobile-row\"\n        [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n        (wheel)=\"handleChipsWheel($event)\"\n        (pointerdown)=\"handleChipsPointerDown($event)\"\n        (scroll)=\"handleMobileChipsScroll($event)\"\n      >\n      @for (chip of mobileFilterChips(); track chip.id) {\n        <!--->\n        <!-- ----- Applied filter chip keeps the field title, with a primary border ----- -->\n        @if (chip.kind === 'applied') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--applied\"\n            [class.axp-query-filters__mobile-chip--search]=\"chip.tag.field === 'all'\"\n            (click)=\"handleTagClick(chip.tag, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ mobileChipLabel(chip.tag) }}</span>\n            <!--->\n            <!-- ----- Remove this applied filter ----- -->\n            @if (!chip.tag.readOnly) {\n              <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, chip.tagIndex)\" type=\"button\">\n                <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n              </button>\n            }\n          </div>\n        }\n        <!-- ----- Unused filter field as an outline chip ----- -->\n        @else if (chip.kind === 'available') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--available\"\n            [class.axp-query-filters__mobile-chip--disabled]=\"isFilterDisabled(chip.definition)\"\n            [attr.aria-disabled]=\"isFilterDisabled(chip.definition) ? 'true' : null\"\n            (click)=\"openMobileAvailableFilter(chip.definition, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ chip.definition.title | translate | async }}</span>\n            <ax-icon class=\"fa-light fa-angle-down axp-query-filters__mobile-chip-caret\"></ax-icon>\n          </div>\n        }\n      }\n      @for (preset of sortPresets(); track preset.name) {\n        <!--------------------------------------------------------------->\n        <!-- ----- Sort preset pill in the same row as advance filters ----- -->\n        <div\n          class=\"axp-query-filters__mobile-chip\"\n          [class.axp-query-filters__mobile-chip--applied]=\"isMobileSortPresetActive(preset)\"\n          [class.axp-query-filters__mobile-chip--available]=\"!isMobileSortPresetActive(preset)\"\n          [attr.aria-pressed]=\"isMobileSortPresetActive(preset)\"\n          (click)=\"applyMobileSortPreset(preset, $event)\"\n        >\n          <span class=\"axp-query-filters__mobile-chip-text\">{{ preset.title | translate | async }}</span>\n          <!--------------------------------------------------------------->\n          <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n          @if (preset.icon) {\n            <ax-icon [class]=\"preset.icon + ' axp-query-filters__mobile-chip-caret'\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Descending hint when the first sort is descending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'desc') {\n            <ax-icon class=\"fa-solid fa-arrow-down-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Ascending hint when the first sort is ascending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'asc') {\n            <ax-icon class=\"fa-solid fa-arrow-up-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n        </div>\n      }\n    </div>\n    }\n    <div\n      class=\"axp-query-filters__mode-toggle\"\n      [class.axp-query-filters__mode-toggle--collapsed]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.aria-hidden]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.inert]=\"mobileModeToggleCollapsed() && !mobileSearchOpen() ? true : null\"\n      role=\"tablist\"\n      [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n    >\n      <div class=\"axp-query-filters__mode-toggle-inner\">\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"!mobileSearchOpen()\"\n          [disabled]=\"isMobileFilterModeLocked()\"\n          [attr.aria-selected]=\"!mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(false)\"\n        >\n          <ax-icon class=\"fa-light fa-filter\"></ax-icon>\n        </button>\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"mobileSearchOpen()\"\n          [disabled]=\"isMobileSearchModeLocked()\"\n          [attr.aria-selected]=\"mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:actions.search.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(true)\"\n        >\n          <ax-icon class=\"fa-light fa-magnifying-glass\"></ax-icon>\n        </button>\n      </div>\n    </div>\n  } @else {\n    <!-- ----- Root AND/OR when more than one visible chip, including All ----- -->\n    @if (isAdvanced() && hasMultipleFilterGroups()) {\n      <ax-button-group\n        class=\"axp-query-filters__logic-toggle ax-sm shrink-0\"\n        [selection]=\"'single'\"\n        [look]=\"'outline'\"\n        [color]=\"'primary'\"\n      >\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-and' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'and'\" (onClick)=\"setRootLogic('and')\"></ax-button-group-item>\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-or' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'or'\" (onClick)=\"setRootLogic('or')\"></ax-button-group-item>\n      </ax-button-group>\n    }\n    <!-- ----- Filter picker when root AND/OR is hidden ----- -->\n    @else {\n      <ax-button (keydown)=\"handleButtonKeyDown($event)\" (onClick)=\"isAdvanced() ? openNewFilterGroup() : openFilterPopover()\" #filterButton [look]=\"'blank'\">\n        <ax-icon class=\"far fa-bars-filter cursor-pointer\"></ax-icon>\n      </ax-button>\n    }\n  }\n  <div\n    class=\"axp-query-filters__chips min-w-0\"\n    [class.flex-1]=\"!deviceService.isSmall()\"\n    [class.hidden]=\"deviceService.isSmall()\"\n    [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n    (click)=\"handleTagBoxClick($event)\"\n    (wheel)=\"handleChipsWheel($event)\"\n    (pointerdown)=\"handleChipsPointerDown($event)\"\n  >\n    <ax-tag-box\n      #tagBoxComponent\n      [ngModel]=\"asyncTags()\"\n      (onValueChanged)=\"handleSelectFilters($event)\"\n      [textField]=\"'query'\"\n      [valueField]=\"'id'\"\n      [readonly]=\"filtersDefinitions().length === 0\"\n      [look]=\"'none'\"\n      [readonlyField]=\"'readOnly'\"\n      [tagTemplate]=\"tagTemplate\"\n      (onKeyDown)=\"handleKeyDown($event)\"\n      [addOnEnter]=\"false\"\n      [allowDuplicateValues]=\"true\"\n      [placeholder]=\"(filtersDefinitions().length === 0 ? '@general:terms.interface.filter.no-filter-definitions' : '@general:terms.interface.filter.placeholder') | translate | async\"\n      #tagBox\n    >\n      <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n        <ax-kbd look=\"blank\">\n          <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n        </ax-kbd>\n      </ax-suffix>\n    </ax-tag-box>\n  </div>\n\n  <ng-template #tagTemplate let-item let-index=\"index\">\n    <div class=\"axp-query-filters__chip\" [class.axp-query-filters__chip--active]=\"item.id === activeChipId()\" [class.axp-query-filters__chip--search]=\"item.field === 'all'\" (click)=\"handleTagClick(item, $event)\">\n      <!-- ----- Quick search chip keeps a single text label ----- -->\n      @if (item.chipMode === 'search') {\n        <span class=\"axp-query-filters__chip-text\">{{ item.query }}</span>\n      } @else if (item.chipMode === 'summary') {\n        <!-- ----- Summary chip when more than two conditions ----- -->\n        @if (item.titleLabel) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}:</span>\n        }\n        <span class=\"axp-query-filters__chip-text\">{{ item.summaryText }}</span>\n      } @else {\n        <!-- ----- One or two conditions: field + operator + quoted value ----- -->\n        @if (item.titleLabel && !item.mixed) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}</span>\n        }\n        @for (cond of item.chipConditions; track $index) {\n          <!--->\n          <!-- ----- Logic connector between conditions ----- -->\n          @if ($index > 0) {\n            <span class=\"axp-query-filters__chip-logic\">{{ item.logicLabel }}</span>\n          }\n          <!--->\n          <!-- ----- Field title on mixed-field chips ----- -->\n          @if (item.mixed && cond.title) {\n            <span class=\"axp-query-filters__chip-title\">{{ cond.title }}</span>\n          }\n          <span class=\"axp-query-filters__chip-operator\">{{ cond.operator }}</span>\n          <!--->\n          <!-- ----- Quoted value badge when the operator has a display value ----- -->\n          @if (cond.value) {\n            <span class=\"axp-query-filters__chip-value\">'{{ cond.value }}'</span>\n          }\n        }\n      }\n      @if (!item.readOnly) {\n        <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n          <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n        </button>\n      }\n    </div>\n  </ng-template>\n</div>\n\n<ax-popover [offsetY]=\"activeFilter() ? -30 : 0\" [openOn]=\"'toggle'\" (onOpened)=\"onPopoverOpened($event)\" [closeOn]=\"'clickOut'\" (onClosed)=\"handlePopoverClosed($event)\" [adaptivityEnabled]=\"true\" #popover>\n  <div class=\"axp-query-filters__popover md:min-w-72 w-full rounded-md md:max-h-[min(32rem,80vh)] lg:w-[520px] md:overflow-auto\">\n    <axp-widgets-container #widgetsContainer [context]=\"context()\" (onContextChanged)=\"onContextChanged($event)\">\n      @if (activeFilter()) {\n        <div class=\"flex flex-col lightest-surface shadow-md\" (keydown.enter)=\"onEnterKeyPressed($event)\">\n          <ax-header class=\"axp-query-filters__editor-header border-b border-border-light px-4 py-2\">\n            <div class=\"flex min-w-0 items-center gap-2 font-semibold\">\n              <!--->\n              <!-- ----- Field icon when the group is a single field ----- -->\n              @if (!isMixedEditingGroup() && activeFilter()?.icon) {\n                <ax-icon class=\"w-5 shrink-0\" [class]=\"'fa-light ' + activeFilter()!.icon\"></ax-icon>\n              }\n              <span class=\"min-w-0 truncate\">\n                {{ isMixedEditingGroup() ? ('@general:terms.interface.filter.filter-group' | translate | async) : ('@general:terms.interface.filter.filter-on' | translate: { params: { title: activeFilterTitle() } } | async) }}\n              </span>\n            </div>\n            <!--->\n            <!-- ----- Condition logic AND/OR stays on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <ax-button-group class=\"axp-query-filters__logic-toggle ax-sm shrink-0\" [selection]=\"'single'\" [look]=\"'outline'\" [color]=\"'primary'\">\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-and-all' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'and'\" (onClick)=\"setEditingLogic('and')\"></ax-button-group-item>\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-or-any' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'or'\" (onClick)=\"setEditingLogic('or')\"></ax-button-group-item>\n              </ax-button-group>\n            }\n          </ax-header>\n          <ax-content class=\"p-4\">\n            @for (condition of editingConditions(); track condition.id; let i = $index) {\n              <!--->\n              <!-- ----- Numbered condition row with the field widget ----- -->\n              @if (i > 0 && !deviceService.isSmall()) {\n                <div class=\"axp-query-filters__logic-split\">\n                  <span class=\"axp-query-filters__logic-split-label\">{{ (editingLogic() === 'or' ? '@general:terms.interface.filter.chip-logic-or' : '@general:terms.interface.filter.chip-logic-and') | translate | async }}</span>\n                </div>\n              }\n              <div class=\"axp-query-filters__condition\">\n                <div class=\"axp-query-filters__condition-head\">\n                  <div class=\"axp-query-filters__condition-heading\">\n                    <!--->\n                    <!-- ----- Field picker for mixed-field groups in advanced mode ----- -->\n                    @if (isAdvanced()) {\n                      <ax-dropdown-button class=\"ax-sm\" [text]=\"(getConditionDefinition(condition.field)?.title | translate | async) ?? ''\" [mode]=\"'dropdown'\" [look]=\"'outline'\">\n                        <ax-button-item-list>\n                          @for (def of advancedFieldOptions(); track def.field) {\n                            <ax-button-item [text]=\"(def.title | translate | async) ?? ''\" [selected]=\"condition.field === def.field\" [disabled]=\"isFilterDisabled(def)\" (onClick)=\"setConditionField(condition.id, def.field ?? '')\"></ax-button-item>\n                          }\n                        </ax-button-item-list>\n                      </ax-dropdown-button>\n                    }\n                    <!--->\n                    <!-- ----- Active operator for this condition ----- -->\n                    @if (getConditionOperatorKey(condition.id); as operatorKey) {\n                      <ax-badge [text]=\"(operatorKey | translate | async) || ''\"></ax-badge>\n                    }\n                  </div>\n                  <button type=\"button\" class=\"axp-query-filters__condition-remove\" (click)=\"handleRemoveCondition(condition.id)\">\n                    <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n                  </button>\n                </div>\n                <ng-container\n                  axp-widget-renderer\n                  [node]=\"{\n                    type: getConditionWidget(condition)?.type || 'text-editor',\n                    path: resolveEditingConditionContextField(condition.id),\n                    options: $safeNavigationMigration(getConditionWidget(condition)?.options),\n                  }\"\n                  [mode]=\"'edit'\"\n                ></ng-container>\n              </div>\n            }\n            <!--->\n            <!-- ----- Extra conditions stay on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <button type=\"button\" class=\"axp-query-filters__add-condition\" (click)=\"handleAddCondition()\">\n                <ax-icon class=\"fa-light fa-plus\"></ax-icon>\n                <span>{{ (isAdvanced() ? '@general:terms.interface.filter.add-condition-generic' : '@general:terms.interface.filter.add-condition') | translate: { params: { title: activeFilterTitle() } } | async }}</span>\n              </button>\n            }\n          </ax-content>\n          <ax-footer class=\"border-t flex justify-end gap-2 border-border-light w-full px-4 py-2\">\n            <ax-button class=\"ax-sm\" [look]=\"'blank'\" [text]=\"'@general:actions.cancel.title' | translate | async\" (onClick)=\"handleCancelFilter()\"></ax-button>\n            <ax-button class=\"ax-sm\" [color]=\"'primary'\" [disabled]=\"!canApplyFilter()\" [text]=\"'@general:terms.interface.filter.apply-filter' | translate | async\" (onClick)=\"handleApplyFilter()\"></ax-button>\n          </ax-footer>\n        </div>\n      } @else {\n        <!-- ----- Field picker when no filter is being edited ----- -->\n        <div class=\"flex flex-col lightest-surface\">\n          <div axListNavigation #list=\"axListNavigation\" class=\"axp-list-items border-none\">\n          @for (field of filterFields(); track field.field) {\n            <div\n              axListNavigationItem\n              #caseItem=\"axListNavigationItem\"\n              [class.axp-state-focused]=\"caseItem.isActive() && !isFilterDisabled(field)\"\n              [class.axp-query-filters__advance-item--disabled]=\"isFilterDisabled(field)\"\n              [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n              [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n              (click)=\"handleSelectField(field)\"\n              (keydown)=\"handleFieldKeyDown($event, field)\"\n            >\n              <div class=\"flex items-end gap-2\">\n                <ax-icon class=\"w-5\" [class]=\"'fa-light ' + field.icon\"></ax-icon>\n                {{ field.title | translate | async }}\n              </div>\n            </div>\n          }\n        </div>\n        </div>\n      }\n    </axp-widgets-container>\n  </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{display:block;width:100%;min-width:0px;overflow:hidden}axp-query-filters>.flex{min-width:0px;flex-wrap:nowrap}axp-query-filters ax-tag-box{width:100%;min-width:0px}axp-query-filters ax-tag-box .editor-container,axp-query-filters ax-tag-box .ax-editor-container{display:flex;width:100%;min-width:0px;flex-wrap:nowrap;align-items:center;background-color:transparent}axp-query-filters ax-tag-box .ax-tags-container{display:flex;flex:1 1 0%;min-width:0;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container{scrollbar-width:none;-ms-overflow-style:none}:is(.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container)::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__chips{min-width:0px;cursor:grab;overflow-x:auto;overflow-y:hidden}.axp-query-filters__chips.axp-query-filters__chips--panning,.axp-query-filters__chips.axp-query-filters__chips--panning *{cursor:grabbing;-webkit-user-select:none;user-select:none}.axp-query-filters__chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--radius-lg, .5rem);background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));white-space:nowrap}.axp-query-filters__chip:hover{background-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-query-filters__chip--search,.axp-query-filters__chip--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}:is(.axp-query-filters__chip--search,.axp-query-filters__chip--active):hover{background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__chip-title{flex-shrink:0;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip-text,.axp-query-filters__chip-operator{min-width:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__chip-logic{flex-shrink:0;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__chip--active .axp-query-filters__chip-logic,.axp-query-filters__chip--search .axp-query-filters__chip-logic{color:var(--color-white, #fff)}.axp-query-filters__chip-value{display:inline-flex;max-width:12rem;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in srgb,#fff 20%,transparent);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axp-query-filters__chip-remove{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;justify-content:center;opacity:70%}.axp-query-filters__chip-remove:hover{opacity:100%}.axp-query-filters__mode-toggle{flex:0 0 auto;max-width:6rem;overflow:visible;transition:max-width .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed{max-width:0;pointer-events:none}.axp-query-filters__mode-toggle-inner{position:relative;z-index:10;margin-inline-start:var(--spacing, .25rem);display:inline-flex;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-light-surface));--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);width:max-content;transform:translate(0);transition:transform .32s cubic-bezier(.32,.72,0,1),margin .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{margin-inline-start:0;transform:translate(5rem)}[dir=rtl] .axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{transform:translate(-5rem)}.axp-query-filters__mode-toggle-btn{display:inline-flex;align-items:center;justify-content:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));width:2rem;height:1.75rem}.axp-query-filters__mode-toggle-btn:first-child{border-start-start-radius:calc(infinity * 1px);border-end-start-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn:last-child{border-start-end-radius:calc(infinity * 1px);border-end-end-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}.axp-query-filters__mode-toggle-btn:disabled:not(.axp-query-filters__mode-toggle-btn--active){cursor:not-allowed;opacity:40%}.axp-query-filters__mobile-search{min-width:0px;flex:1}.axp-query-filters__mobile-search ax-search-box,.axp-query-filters__mobile-search ax-search-box .ax-editor,.axp-query-filters__mobile-search ax-search-box .ax-editor-container,.axp-query-filters__mobile-search ax-search-box .editor-container{min-height:2rem;height:2rem}.axp-query-filters__mobile-search ax-search-box input{min-height:2rem;height:2rem;font-size:.875rem;line-height:1.25rem}.axp-query-filters__mobile-row{display:flex;min-width:0px;flex:1;flex-wrap:nowrap;align-items:center;gap:var(--spacing, .25rem);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.axp-query-filters__mobile-row::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__mobile-chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:var(--spacing, .25rem);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);border-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:var(--spacing, .25rem);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap}.axp-query-filters__mobile-chip--available{cursor:pointer;background-color:transparent}.axp-query-filters__mobile-chip--disabled{cursor:not-allowed;opacity:50%}.axp-query-filters__mobile-chip--applied{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:transparent;color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__mobile-chip-text{max-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__mobile-chip-caret{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}.axp-query-filters__editor-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-query-filters__logic-toggle ax-button-group-item.ax-state-selected ax-button button,.axp-query-filters__logic-toggle ax-button button.ax-state-selected{background-image:none;box-shadow:none;background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}@media(max-width:600px){axp-query-filters{overflow:hidden}axp-query-filters>.flex{gap:.5rem;padding-block:0;padding-inline:.125rem;overflow:hidden}axp-query-filters>.flex.axp-query-filters__bar--toggle-collapsed{gap:0}.axp-query-filters__logic-toggle{flex-wrap:nowrap}.axp-query-filters__logic-toggle ax-button>button{min-height:2rem;height:2rem;padding-inline:.5rem;padding-block:0;font-size:.875rem;line-height:1.25rem;font-weight:600}.axp-query-filters__chip{gap:.375rem;padding-inline:.75rem;padding-block:.25rem;font-size:.875rem}.axp-query-filters__chip-value{max-width:none;font-size:.875rem}}.axp-query-filters__condition{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-head{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-heading{display:flex;min-width:0px;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-title{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-remove{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove:hover{color:rgba(var(--ax-sys-color-danger-surface))}.axp-query-filters__logic-split{position:relative;margin-block:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:center}.axp-query-filters__logic-split:before,.axp-query-filters__logic-split:after{content:\"\";height:1px;flex:1;background-color:rgba(var(--ax-sys-color-border-light-surface))}.axp-query-filters__logic-split-label{margin-inline:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:10px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__add-condition{margin-top:calc(var(--spacing, .25rem) * 3);display:inline-flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__add-condition:hover{text-decoration-line:underline}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@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-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+            args: [{ selector: 'axp-query-filters', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, FormsModule, AXButtonModule, AXButtonGroupModule, AXDecoratorModule, AXDropdownButtonModule, AXKBDComponent, AXKBDItemComponent, AXTranslationModule, AXPopoverModule, AXSearchBoxModule, AXSelectionListModule, AXTagBoxModule, AXPWidgetCoreModule, AXListNavigationModule, AXBadgeModule], template: "<div\n  class=\"flex w-full min-w-0 items-center gap-2 px-1.5 py-1\"\n  [class.axp-query-filters__bar--toggle-collapsed]=\"deviceService.isSmall() && mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n  (keydown.control.space)=\"openFilterPopover()\"\n>\n  @if (deviceService.isSmall()) {\n    <!-- ----- Inline search replaces the chip row ----- -->\n    @if (mobileSearchOpen()) {\n      <div id=\"axp-query-filters-mobile-search\" class=\"axp-query-filters__mobile-search\">\n        <ax-search-box\n          class=\"ax-sm\"\n          [value]=\"mobileSearchText()\"\n          [delayTime]=\"300\"\n          [placeholder]=\"('@general:terms.interface.filter.search-placeholder' | translate | async) ?? ''\"\n          (onValueChanged)=\"handleMobileSearchChanged($event)\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <!-- ----- Compact pill row instead of the desktop tag-box toolbar ----- -->\n    @else {\n      <div\n        #mobileFilterTrigger\n        class=\"axp-query-filters__mobile-row\"\n        [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n        (wheel)=\"handleChipsWheel($event)\"\n        (pointerdown)=\"handleChipsPointerDown($event)\"\n        (scroll)=\"handleMobileChipsScroll($event)\"\n      >\n      @for (chip of mobileFilterChips(); track chip.id) {\n        <!--->\n        <!-- ----- Applied filter chip keeps the field title, with a primary border ----- -->\n        @if (chip.kind === 'applied') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--applied\"\n            [class.axp-query-filters__mobile-chip--search]=\"chip.tag.field === 'all'\"\n            (click)=\"handleTagClick(chip.tag, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ mobileChipLabel(chip.tag) }}</span>\n            <!--->\n            <!-- ----- Remove this applied filter ----- -->\n            @if (!chip.tag.readOnly) {\n              <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, chip.tagIndex)\" type=\"button\">\n                <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n              </button>\n            }\n          </div>\n        }\n        <!-- ----- Unused filter field as an outline chip ----- -->\n        @else if (chip.kind === 'available') {\n          <div\n            class=\"axp-query-filters__mobile-chip axp-query-filters__mobile-chip--available\"\n            [class.axp-query-filters__mobile-chip--disabled]=\"isFilterDisabled(chip.definition)\"\n            [attr.aria-disabled]=\"isFilterDisabled(chip.definition) ? 'true' : null\"\n            (click)=\"openMobileAvailableFilter(chip.definition, $event)\"\n          >\n            <span class=\"axp-query-filters__mobile-chip-text\">{{ chip.definition.title | translate | async }}</span>\n            <ax-icon class=\"fa-light fa-angle-down axp-query-filters__mobile-chip-caret\"></ax-icon>\n          </div>\n        }\n      }\n      @for (preset of sortPresets(); track preset.name) {\n        <!--------------------------------------------------------------->\n        <!-- ----- Sort preset pill in the same row as advance filters ----- -->\n        <div\n          class=\"axp-query-filters__mobile-chip\"\n          [class.axp-query-filters__mobile-chip--applied]=\"isMobileSortPresetActive(preset)\"\n          [class.axp-query-filters__mobile-chip--available]=\"!isMobileSortPresetActive(preset)\"\n          [attr.aria-pressed]=\"isMobileSortPresetActive(preset)\"\n          (click)=\"applyMobileSortPreset(preset, $event)\"\n        >\n          <span class=\"axp-query-filters__mobile-chip-text\">{{ preset.title | translate | async }}</span>\n          <!--------------------------------------------------------------->\n          <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n          @if (preset.icon) {\n            <ax-icon [class]=\"preset.icon + ' axp-query-filters__mobile-chip-caret'\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Descending hint when the first sort is descending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'desc') {\n            <ax-icon class=\"fa-solid fa-arrow-down-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n          <!--------------------------------------------------------------->\n          <!-- ----- Ascending hint when the first sort is ascending ----- -->\n          @else if (mobileSortPresetDir(preset) === 'asc') {\n            <ax-icon class=\"fa-solid fa-arrow-up-long axp-query-filters__mobile-chip-caret\"></ax-icon>\n          }\n        </div>\n      }\n    </div>\n    }\n    <div\n      class=\"axp-query-filters__mode-toggle\"\n      [class.axp-query-filters__mode-toggle--collapsed]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.aria-hidden]=\"mobileModeToggleCollapsed() && !mobileSearchOpen()\"\n      [attr.inert]=\"mobileModeToggleCollapsed() && !mobileSearchOpen() ? true : null\"\n      role=\"tablist\"\n      [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n    >\n      <div class=\"axp-query-filters__mode-toggle-inner\">\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"!mobileSearchOpen()\"\n          [disabled]=\"isMobileFilterModeLocked()\"\n          [attr.aria-selected]=\"!mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:terms.interface.filter.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(false)\"\n        >\n          <ax-icon class=\"fa-light fa-filter\"></ax-icon>\n        </button>\n        <button\n          type=\"button\"\n          role=\"tab\"\n          class=\"axp-query-filters__mode-toggle-btn\"\n          [class.axp-query-filters__mode-toggle-btn--active]=\"mobileSearchOpen()\"\n          [disabled]=\"isMobileSearchModeLocked()\"\n          [attr.aria-selected]=\"mobileSearchOpen()\"\n          [attr.aria-label]=\"('@general:actions.search.title' | translate | async) ?? ''\"\n          (click)=\"setMobileSearchOpen(true)\"\n        >\n          <ax-icon class=\"fa-light fa-magnifying-glass\"></ax-icon>\n        </button>\n      </div>\n    </div>\n  } @else {\n    <!-- ----- Root AND/OR when more than one visible chip, including All ----- -->\n    @if (isAdvanced() && hasMultipleFilterGroups()) {\n      <ax-button-group\n        class=\"axp-query-filters__logic-toggle ax-sm shrink-0\"\n        [selection]=\"'single'\"\n        [look]=\"'outline'\"\n        [color]=\"'primary'\"\n      >\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-and' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'and'\" (onClick)=\"setRootLogic('and')\"></ax-button-group-item>\n        <ax-button-group-item [text]=\"('@general:terms.interface.filter.chip-logic-or' | translate | async) ?? ''\" [selected]=\"rootLogic() === 'or'\" (onClick)=\"setRootLogic('or')\"></ax-button-group-item>\n      </ax-button-group>\n    }\n    <!-- ----- Filter picker when root AND/OR is hidden ----- -->\n    @else {\n      <ax-button (keydown)=\"handleButtonKeyDown($event)\" (onClick)=\"isAdvanced() ? openNewFilterGroup() : openFilterPopover()\" #filterButton [look]=\"'blank'\">\n        <ax-icon class=\"far fa-bars-filter cursor-pointer\"></ax-icon>\n      </ax-button>\n    }\n  }\n  <div\n    class=\"axp-query-filters__chips min-w-0\"\n    [class.flex-1]=\"!deviceService.isSmall()\"\n    [class.hidden]=\"deviceService.isSmall()\"\n    [class.axp-query-filters__chips--panning]=\"isChipsPanning()\"\n    (click)=\"handleTagBoxClick($event)\"\n    (wheel)=\"handleChipsWheel($event)\"\n    (pointerdown)=\"handleChipsPointerDown($event)\"\n  >\n    <ax-tag-box\n      #tagBoxComponent\n      [ngModel]=\"asyncTags()\"\n      (onValueChanged)=\"handleSelectFilters($event)\"\n      [textField]=\"'query'\"\n      [valueField]=\"'id'\"\n      [readonly]=\"filtersDefinitions().length === 0\"\n      [look]=\"'none'\"\n      [readonlyField]=\"'readOnly'\"\n      [tagTemplate]=\"tagTemplate\"\n      (onKeyDown)=\"handleKeyDown($event)\"\n      [addOnEnter]=\"false\"\n      [allowDuplicateValues]=\"true\"\n      [placeholder]=\"(filtersDefinitions().length === 0 ? '@general:terms.interface.filter.no-filter-definitions' : '@general:terms.interface.filter.placeholder') | translate | async\"\n      #tagBox\n    >\n      <ax-suffix class=\"hidden shrink-0 whitespace-nowrap md:flex text-gray-500\">\n        <ax-kbd look=\"blank\">\n          <ax-kbd-item [keys]=\"filterFocusShortcutKeys\"></ax-kbd-item>\n        </ax-kbd>\n      </ax-suffix>\n    </ax-tag-box>\n  </div>\n\n  <ng-template #tagTemplate let-item let-index=\"index\">\n    <div class=\"axp-query-filters__chip\" [class.axp-query-filters__chip--active]=\"item.id === activeChipId()\" [class.axp-query-filters__chip--search]=\"item.field === 'all'\" (click)=\"handleTagClick(item, $event)\">\n      <!-- ----- Quick search chip keeps a single text label ----- -->\n      @if (item.chipMode === 'search') {\n        <span class=\"axp-query-filters__chip-text\">{{ item.query }}</span>\n      } @else if (item.chipMode === 'summary') {\n        <!-- ----- Summary chip when more than two conditions ----- -->\n        @if (item.titleLabel) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}:</span>\n        }\n        <span class=\"axp-query-filters__chip-text\">{{ item.summaryText }}</span>\n      } @else {\n        <!-- ----- One or two conditions: field + operator + quoted value ----- -->\n        @if (item.titleLabel && !item.mixed) {\n          <span class=\"axp-query-filters__chip-title\">{{ item.titleLabel }}</span>\n        }\n        @for (cond of item.chipConditions; track $index) {\n          <!--->\n          <!-- ----- Logic connector between conditions ----- -->\n          @if ($index > 0) {\n            <span class=\"axp-query-filters__chip-logic\">{{ item.logicLabel }}</span>\n          }\n          <!--->\n          <!-- ----- Field title on mixed-field chips ----- -->\n          @if (item.mixed && cond.title) {\n            <span class=\"axp-query-filters__chip-title\">{{ cond.title }}</span>\n          }\n          <span class=\"axp-query-filters__chip-operator\">{{ cond.operator }}</span>\n          <!--->\n          <!-- ----- Quoted value badge when the operator has a display value ----- -->\n          @if (cond.value) {\n            <span class=\"axp-query-filters__chip-value\">'{{ cond.value }}'</span>\n          }\n        }\n      }\n      @if (!item.readOnly) {\n        <button class=\"axp-query-filters__chip-remove\" (click)=\"handleRemoveTag($event, index)\" type=\"button\">\n          <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n        </button>\n      }\n    </div>\n  </ng-template>\n</div>\n\n<ax-popover [offsetY]=\"activeFilter() ? -30 : 0\" [openOn]=\"'toggle'\" (onOpened)=\"onPopoverOpened($event)\" [closeOn]=\"'clickOut'\" (onClosed)=\"handlePopoverClosed($event)\" [adaptivityEnabled]=\"true\" #popover>\n  <div class=\"axp-query-filters__popover md:min-w-72 w-full rounded-md md:max-h-[min(32rem,80vh)] lg:w-[520px] md:overflow-auto\">\n    <axp-widgets-container #widgetsContainer [context]=\"context()\" (onContextChanged)=\"onContextChanged($event)\">\n      @if (activeFilter()) {\n        <div class=\"flex flex-col lightest-surface shadow-md\" (keydown.enter)=\"onEnterKeyPressed($event)\">\n          <ax-header class=\"axp-query-filters__editor-header border-b border-border-light px-4 py-2\">\n            <div class=\"flex min-w-0 items-center gap-2 font-semibold\">\n              <!--->\n              <!-- ----- Field icon when the group is a single field ----- -->\n              @if (!isMixedEditingGroup() && activeFilter()?.icon) {\n                <ax-icon class=\"w-5 shrink-0\" [class]=\"'fa-light ' + activeFilter()!.icon\"></ax-icon>\n              }\n              <span class=\"min-w-0 truncate\">\n                {{ isMixedEditingGroup() ? ('@general:terms.interface.filter.filter-group' | translate | async) : ('@general:terms.interface.filter.filter-on' | translate: { params: { title: activeFilterTitle() } } | async) }}\n              </span>\n            </div>\n            <!--->\n            <!-- ----- Condition logic AND/OR stays on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <ax-button-group class=\"axp-query-filters__logic-toggle ax-sm shrink-0\" [selection]=\"'single'\" [look]=\"'outline'\" [color]=\"'primary'\">\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-and-all' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'and'\" (onClick)=\"setEditingLogic('and')\"></ax-button-group-item>\n                <ax-button-group-item [text]=\"('@general:terms.interface.filter.logic-or-any' | translate | async) ?? ''\" [selected]=\"editingLogic() === 'or'\" (onClick)=\"setEditingLogic('or')\"></ax-button-group-item>\n              </ax-button-group>\n            }\n          </ax-header>\n          <ax-content class=\"p-4\">\n            @for (condition of editingConditions(); track condition.id; let i = $index) {\n              <!--->\n              <!-- ----- Numbered condition row with the field widget ----- -->\n              @if (i > 0 && !deviceService.isSmall()) {\n                <div class=\"axp-query-filters__logic-split\">\n                  <span class=\"axp-query-filters__logic-split-label\">{{ (editingLogic() === 'or' ? '@general:terms.interface.filter.chip-logic-or' : '@general:terms.interface.filter.chip-logic-and') | translate | async }}</span>\n                </div>\n              }\n              <div class=\"axp-query-filters__condition\">\n                <div class=\"axp-query-filters__condition-head\">\n                  <div class=\"axp-query-filters__condition-heading\">\n                    <!--->\n                    <!-- ----- Field picker for mixed-field groups in advanced mode ----- -->\n                    @if (isAdvanced()) {\n                      <ax-dropdown-button class=\"ax-sm\" [text]=\"(getConditionDefinition(condition.field)?.title | translate | async) ?? ''\" [mode]=\"'dropdown'\" [look]=\"'outline'\">\n                        <ax-button-item-list>\n                          @for (def of advancedFieldOptions(); track def.field) {\n                            <ax-button-item [text]=\"(def.title | translate | async) ?? ''\" [selected]=\"condition.field === def.field\" [disabled]=\"isFilterDisabled(def)\" (onClick)=\"setConditionField(condition.id, def.field ?? '')\"></ax-button-item>\n                          }\n                        </ax-button-item-list>\n                      </ax-dropdown-button>\n                    }\n                    <!--->\n                    <!-- ----- Active operator for this condition ----- -->\n                    @if (getConditionOperatorKey(condition.id); as operatorKey) {\n                      <ax-badge [text]=\"(operatorKey | translate | async) || ''\"></ax-badge>\n                    }\n                  </div>\n                  <button type=\"button\" class=\"axp-query-filters__condition-remove\" (click)=\"handleRemoveCondition(condition.id)\">\n                    <ax-icon class=\"ax-icon ax-icon-close\"></ax-icon>\n                  </button>\n                </div>\n                <ng-container\n                  axp-widget-renderer\n                  [node]=\"{\n                    type: getConditionWidget(condition)?.type || 'text-editor',\n                    path: resolveEditingConditionContextField(condition.id),\n                    options: $safeNavigationMigration(getConditionWidget(condition)?.options),\n                  }\"\n                  [mode]=\"'edit'\"\n                ></ng-container>\n              </div>\n            }\n            <!--->\n            <!-- ----- Extra conditions stay on desktop ----- -->\n            @if (!deviceService.isSmall()) {\n              <button type=\"button\" class=\"axp-query-filters__add-condition\" (click)=\"handleAddCondition()\">\n                <ax-icon class=\"fa-light fa-plus\"></ax-icon>\n                <span>{{ (isAdvanced() ? '@general:terms.interface.filter.add-condition-generic' : '@general:terms.interface.filter.add-condition') | translate: { params: { title: activeFilterTitle() } } | async }}</span>\n              </button>\n            }\n          </ax-content>\n          <ax-footer class=\"border-t flex justify-end gap-2 border-border-light w-full px-4 py-2\">\n            <ax-button class=\"ax-sm\" [look]=\"'blank'\" [text]=\"'@general:actions.cancel.title' | translate | async\" (onClick)=\"handleCancelFilter()\"></ax-button>\n            <ax-button class=\"ax-sm\" [color]=\"'primary'\" [disabled]=\"!canApplyFilter()\" [text]=\"'@general:terms.interface.filter.apply-filter' | translate | async\" (onClick)=\"handleApplyFilter()\"></ax-button>\n          </ax-footer>\n        </div>\n      } @else {\n        <!-- ----- Field picker when no filter is being edited ----- -->\n        <div class=\"flex flex-col lightest-surface\">\n          <div axListNavigation #list=\"axListNavigation\" class=\"axp-list-items border-none\">\n          @for (field of filterFields(); track field.field) {\n            <div\n              axListNavigationItem\n              #caseItem=\"axListNavigationItem\"\n              [class.axp-state-focused]=\"caseItem.isActive() && !isFilterDisabled(field)\"\n              [class.axp-query-filters__advance-item--disabled]=\"isFilterDisabled(field)\"\n              [attr.aria-disabled]=\"isFilterDisabled(field) ? 'true' : null\"\n              [attr.tabindex]=\"isFilterDisabled(field) ? -1 : 0\"\n              (click)=\"handleSelectField(field)\"\n              (keydown)=\"handleFieldKeyDown($event, field)\"\n            >\n              <div class=\"flex items-center gap-2\">\n                <ax-icon class=\"axp-query-filters__field-icon\" [ngClass]=\"'fa-light ' + field.icon\"></ax-icon>\n                <span class=\"leading-none\">{{ field.title | translate | async }}</span>\n              </div>\n            </div>\n          }\n        </div>\n        </div>\n      }\n    </axp-widgets-container>\n  </div>\n</ax-popover>\n", styles: ["@layer properties;axp-query-filters{display:block;width:100%;min-width:0px;overflow:hidden}axp-query-filters>.flex{min-width:0px;flex-wrap:nowrap}axp-query-filters ax-tag-box{width:100%;min-width:0px}axp-query-filters ax-tag-box .editor-container,axp-query-filters ax-tag-box .ax-editor-container{display:flex;width:100%;min-width:0px;flex-wrap:nowrap;align-items:center;background-color:transparent;min-height:2.25rem}axp-query-filters ax-tag-box .ax-tags-container{display:flex;flex:1 1 0%;min-width:0;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden}axp-query-filters ax-tag-box ax-suffix{flex-shrink:0;white-space:nowrap}axp-query-filters>.flex>ax-button button{min-height:var(--ax-sys-size-base);height:var(--ax-sys-size-base);padding-block:0}.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container{scrollbar-width:none;-ms-overflow-style:none}:is(.axp-query-filters__chips,axp-query-filters ax-tag-box .ax-tags-container)::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__chips{min-width:0px;cursor:grab;overflow-x:auto;overflow-y:hidden}.axp-query-filters__chips.axp-query-filters__chips--panning,.axp-query-filters__chips.axp-query-filters__chips--panning *{cursor:grabbing;-webkit-user-select:none;user-select:none}.axp-query-filters__chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:var(--spacing, .25rem);border-radius:var(--radius-md, .375rem);background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));white-space:nowrap}.axp-query-filters__chip:hover{background-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-query-filters__chip--search,.axp-query-filters__chip--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}:is(.axp-query-filters__chip--search,.axp-query-filters__chip--active):hover{background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__chip-title{flex-shrink:0;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip-text,.axp-query-filters__chip-operator{min-width:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__chip-logic{flex-shrink:0;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__chip--active .axp-query-filters__chip-logic,.axp-query-filters__chip--search .axp-query-filters__chip-logic{color:var(--color-white, #fff)}.axp-query-filters__chip-value{display:inline-flex;max-width:12rem;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:.25rem;background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 1.5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in srgb,#fff 20%,transparent);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__chip--active .axp-query-filters__chip-value,.axp-query-filters__chip--search .axp-query-filters__chip-value{background-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axp-query-filters__chip-remove{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;justify-content:center;opacity:70%}.axp-query-filters__chip-remove:hover{opacity:100%}.axp-query-filters__mode-toggle{flex:0 0 auto;max-width:6rem;overflow:visible;transition:max-width .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed{max-width:0;pointer-events:none}.axp-query-filters__mode-toggle-inner{position:relative;z-index:10;margin-inline-start:var(--spacing, .25rem);display:inline-flex;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-light-surface));--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);width:max-content;transform:translate(0);transition:transform .32s cubic-bezier(.32,.72,0,1),margin .32s cubic-bezier(.32,.72,0,1)}.axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{margin-inline-start:0;transform:translate(5rem)}[dir=rtl] .axp-query-filters__mode-toggle--collapsed .axp-query-filters__mode-toggle-inner{transform:translate(-5rem)}.axp-query-filters__mode-toggle-btn{display:inline-flex;align-items:center;justify-content:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));width:1.875rem;height:1.625rem}.axp-query-filters__mode-toggle-btn:first-child{border-start-start-radius:calc(infinity * 1px);border-end-start-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn:last-child{border-start-end-radius:calc(infinity * 1px);border-end-end-radius:calc(infinity * 1px)}.axp-query-filters__mode-toggle-btn--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}.axp-query-filters__mode-toggle-btn:disabled:not(.axp-query-filters__mode-toggle-btn--active){cursor:not-allowed;opacity:40%}.axp-query-filters__mobile-search{min-width:0px;flex:1}.axp-query-filters__mobile-search ax-search-box,.axp-query-filters__mobile-search ax-search-box .ax-editor,.axp-query-filters__mobile-search ax-search-box .ax-editor-container,.axp-query-filters__mobile-search ax-search-box .editor-container{min-height:1.875rem;height:1.875rem}.axp-query-filters__mobile-search ax-search-box input{min-height:1.875rem;height:1.875rem;font-size:.8125rem;line-height:1.125rem}.axp-query-filters__mobile-row{display:flex;min-width:0px;flex:1;flex-wrap:nowrap;align-items:center;gap:var(--spacing, .25rem);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.axp-query-filters__mobile-row::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}.axp-query-filters__mobile-chip{display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;gap:var(--spacing, .25rem);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);border-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);white-space:nowrap}.axp-query-filters__mobile-chip--available{cursor:pointer;background-color:transparent}.axp-query-filters__mobile-chip--disabled{cursor:not-allowed;opacity:50%}.axp-query-filters__mobile-chip--applied{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:transparent;color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__mobile-chip-text{max-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.axp-query-filters__mobile-chip-caret{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}.axp-query-filters__editor-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3)}.axp-query-filters__logic-toggle ax-button-group-item.ax-state-selected ax-button button,.axp-query-filters__logic-toggle ax-button button.ax-state-selected{background-image:none;box-shadow:none;background-color:rgba(var(--ax-sys-color-primary-surface));color:var(--color-white, #fff)}.axp-query-filters__logic-toggle ax-button>button{min-height:2rem;height:2rem;padding-inline:.5rem;padding-block:0;font-size:.8125rem;line-height:1.125rem;font-weight:600}@media(max-width:600px){axp-query-filters{overflow:hidden}axp-query-filters>.flex{gap:.5rem;padding-block:0;padding-inline:.125rem;overflow:hidden}axp-query-filters>.flex.axp-query-filters__bar--toggle-collapsed{gap:0}.axp-query-filters__logic-toggle{flex-wrap:nowrap}.axp-query-filters__chip{gap:.375rem;padding-inline:.625rem;padding-block:.25rem;font-size:.8125rem}.axp-query-filters__chip-value{max-width:none;font-size:.8125rem}}.axp-query-filters__condition{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-head{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-heading{display:flex;min-width:0px;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.axp-query-filters__condition-title{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-text-default));text-transform:uppercase}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-title{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;color:rgba(var(--ax-sys-color-text-default))}@supports (color: color-mix(in lab,red,red)){.axp-query-filters__condition-remove{color:color-mix(in oklab,rgba(var(--ax-sys-color-text-default)) 80%,transparent)}}.axp-query-filters__condition-remove:hover{color:rgba(var(--ax-sys-color-danger-surface))}.axp-query-filters__logic-split{position:relative;margin-block:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:center}.axp-query-filters__logic-split:before,.axp-query-filters__logic-split:after{content:\"\";height:1px;flex:1;background-color:rgba(var(--ax-sys-color-border-light-surface))}.axp-query-filters__logic-split-label{margin-inline:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:10px;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}.axp-query-filters__add-condition{margin-top:calc(var(--spacing, .25rem) * 3);display:inline-flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-filters__add-condition:hover{text-decoration-line:underline}.axp-list-items{display:flex;min-width:calc(var(--spacing, .25rem) * 40);flex-direction:column;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);padding-block:calc(var(--spacing, .25rem) * 4);--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-list-items>div{min-width:calc(var(--spacing, .25rem) * 28);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start}.axp-list-items>div:focus{outline:none}.axp-list-items>div.axp-state-focused,.axp-list-items>div:hover{background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface)}.axp-list-items>div.axp-query-filters__advance-item--disabled{cursor:not-allowed;opacity:50%}.axp-list-items>div.axp-query-filters__advance-item--disabled.axp-state-focused,.axp-list-items>div.axp-query-filters__advance-item--disabled:hover{background-color:transparent}.axp-query-filters__field-icon{display:inline-flex;height:calc(var(--spacing, .25rem) * 4);width:calc(var(--spacing, .25rem) * 5);flex-shrink:0;align-items:center;justify-content:center;--tw-leading: 1;line-height:1}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@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-leading: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-tracking: initial}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { filtersDefinitions: [{ type: i0.Input, args: [{ isSignal: true, alias: "filtersDefinitions", required: false }] }], initialFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFilters", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], quickSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "quickSearch", required: false }] }], sortPresets: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortPresets", required: false }] }], activeSortPresetName: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeSortPresetName", required: false }] }], onFiltersChanged: [{ type: i0.Output, args: ["onFiltersChanged"] }], onSortPresetSelected: [{ type: i0.Output, args: ["onSortPresetSelected"] }], tagBox: [{ type: i0.ViewChild, args: ['tagBox', { isSignal: true }] }], mobileFilterTrigger: [{ type: i0.ViewChild, args: ['mobileFilterTrigger', { ...{ read: ElementRef }, isSignal: true }] }], widgetsContainer: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPWidgetContainerComponent), { isSignal: true }] }], widgetRenderers: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AXPWidgetRendererDirective), { isSignal: true }] }], listItems: [{
                 type: ViewChildren,
                 args: ['caseItem']
@@ -8080,8 +8108,11 @@ class AXPSignatureEditorService {
                     name: SIGNATURE_WIDGET_NAME,
                     path: 'value',
                     disabled,
+                    captureMode: 'inline',
                     showOverlay: false,
                     editMode: true,
+                    showClear: false,
+                    signatureProvider: options.signatureProvider,
                 });
             })
                 .setActions((actions) => {
@@ -8135,6 +8166,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             args: [{ providedIn: 'root' }]
         }] });
 
+const AXP_SIGNATURE_PROVIDER = new InjectionToken('AXP_SIGNATURE_PROVIDER');
+//#endregion
+
 //#region ----- Imports -----
 //#endregion
 //#region ----- Merge -----
@@ -11307,11 +11341,11 @@ class AXPQuerySortsComponent {
         this.sortQueriesChange.emit(sorts);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQuerySortsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQuerySortsComponent, isStandalone: true, selector: "axp-query-sorts", inputs: { sortDefinitions: { classPropertyName: "sortDefinitions", publicName: "sortDefinitions", isSignal: true, isRequired: false, transformFunction: null }, sortPresets: { classPropertyName: "sortPresets", publicName: "sortPresets", isSignal: true, isRequired: false, transformFunction: null }, initialSortQueries: { classPropertyName: "initialSortQueries", publicName: "initialSortQueries", isSignal: true, isRequired: false, transformFunction: null }, defaultSortQueries: { classPropertyName: "defaultSortQueries", publicName: "defaultSortQueries", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortDefinitions: "sortDefinitionsChange", sortQueriesChange: "sortQueriesChange" }, ngImport: i0, template: "<div class=\"axp-query-sorts flex flex-col select-none\">\n  <div class=\"axp-query-sorts__header flex items-center justify-between gap-2 border-b border-border-light px-4 py-3\">\n    <div class=\"flex min-w-0 items-center gap-2 font-bold\">\n      <ax-icon class=\"fa-light fa-sort-amount-up\"></ax-icon>\n      <span class=\"min-w-0 truncate\">{{ '@general:terms.interface.sort.title' | translate | async }}</span>\n    </div>\n    <ax-button\n      class=\"ax-sm\"\n      [look]=\"'blank'\"\n      [color]=\"'primary'\"\n      [disabled]=\"!canReset()\"\n      [text]=\"'@general:actions.reset.title' | translate | async\"\n      (onClick)=\"resetSorts()\"\n    ></ax-button>\n  </div>\n\n  <div class=\"axp-query-sorts__body flex flex-col gap-3 px-4 py-2\">\n    @if (hasPresets()) {\n      <!-- ----- Named recipes from entity.interfaces.master.list.sortPresets ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <div class=\"axp-query-sorts__section-label\">\n          {{ '@general:terms.interface.sort.quick-presets' | translate | async }}\n        </div>\n        <div class=\"flex flex-col\">\n          @for (preset of sortPresets(); track preset.name) {\n            <button\n              type=\"button\"\n              class=\"axp-query-sorts__preset\"\n              [class.axp-query-sorts__preset--active]=\"isPresetActive(preset)\"\n              (click)=\"applyPreset(preset)\"\n            >\n              <span class=\"flex min-w-0 items-center gap-2\">\n                <span\n                  class=\"axp-query-sorts__radio\"\n                  [class.axp-query-sorts__radio--on]=\"isPresetActive(preset)\"\n                ></span>\n                <span class=\"min-w-0 truncate font-medium text-sm\">\n                  {{ preset.title | translate | async }}\n                  <!--->\n                  <!-- ----- Optional subtitle from the entity preset ----- -->\n                  @if (preset.description) {\n                    <span class=\"text-neutral-400 font-normal\">\n                      ({{ preset.description | translate | async }})\n                    </span>\n                  }\n                </span>\n              </span>\n              <span class=\"axp-query-sorts__hint shrink-0\">\n                <!--->\n                <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n                @if (preset.icon) {\n                  <ax-icon [class]=\"preset.icon\"></ax-icon>\n                }\n                <!-- ----- Direction arrow when the recipe has no custom icon ----- -->\n                @else if (presetFirstDir(preset) === 'desc') {\n                  <ax-icon class=\"fa-solid fa-arrow-down-long\"></ax-icon>\n                }\n                <!-- ----- Ascending hint when the first sort is ascending ----- -->\n                @else if (presetFirstDir(preset) === 'asc') {\n                  <ax-icon class=\"fa-solid fa-arrow-up-long\"></ax-icon>\n                }\n                <!--->\n                <!-- ----- Optional hint label from the entity preset ----- -->\n                @if (preset.hint) {\n                  <span dir=\"ltr\">{{ preset.hint | translate | async }}</span>\n                }\n              </span>\n            </button>\n          }\n        </div>\n      </section>\n    }\n\n    @if (sortQueries().length) {\n      <!-- ----- Per-field sort toggles from property options.sort ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <!--->\n        <!-- ----- Section title only when quick presets are also shown ----- -->\n        @if (hasPresets()) {\n          <div class=\"axp-query-sorts__section-label\">\n            {{ '@general:terms.interface.sort.custom-fields' | translate | async }}\n          </div>\n        }\n        <div\n          class=\"flex flex-col w-full ax-sorted-list overflow-x-hidden\"\n          cdkDropList\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          @for (item of sortQueries(); track item.name) {\n            <div\n              class=\"axp-query-sorts__field\"\n              cdkDrag\n              cdkDragBoundary=\".ax-sorted-list\"\n            >\n              <div class=\"flex min-w-0 items-center gap-3\" cdkDragHandle>\n                <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move text-neutral-400\"></ax-icon>\n                <p class=\"font-medium text-sm truncate\">\n                  {{ item.title | translate | async }}\n                </p>\n              </div>\n              <ax-button [color]=\"'blank'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'asc'\"\n                  class=\"fa-solid fa-arrow-up-long text-neutral-400\"\n                ></ax-icon>\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'desc'\"\n                  class=\"fa-solid fa-arrow-down-long text-neutral-400\"\n                ></ax-icon>\n              </ax-button>\n            </div>\n          }\n        </div>\n      </section>\n    }\n  </div>\n</div>\n", styles: ["@layer properties;.axp-query-sorts{display:flex;max-height:min(28rem,70vh);min-width:0px;flex-direction:column}.axp-query-sorts__header{flex-shrink:0}.axp-query-sorts__body{min-height:0px;overflow-y:auto}.axp-query-sorts__section-label{padding-inline:var(--spacing, .25rem);padding-bottom:calc(var(--spacing, .25rem) * .5);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-query-sorts__preset{display:flex;width:100%;cursor:pointer;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);text-align:start}.axp-query-sorts__preset:hover:not(.axp-query-sorts__preset--active){background-color:var(--color-neutral-100, oklch(97% 0 none))}.axp-query-sorts__preset--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){.axp-query-sorts__preset--active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-query-sorts__field{display:flex;cursor:pointer;align-items:center;justify-content:space-between;padding-block:calc(var(--spacing, .25rem) * .5)}.axp-query-sorts__radio{display:inline-block;height:calc(var(--spacing, .25rem) * 2.5);width:calc(var(--spacing, .25rem) * 2.5);flex-shrink:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-300, oklch(87% 0 none))}.axp-query-sorts__radio--on{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-sorts__hint{display:flex;align-items:center;gap:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-400, oklch(70.8% 0 none))}.axp-query-sorts__preset--active .axp-query-sorts__hint{color:rgba(var(--ax-sys-color-primary-surface))}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$2.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: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQuerySortsComponent, isStandalone: true, selector: "axp-query-sorts", inputs: { sortDefinitions: { classPropertyName: "sortDefinitions", publicName: "sortDefinitions", isSignal: true, isRequired: false, transformFunction: null }, sortPresets: { classPropertyName: "sortPresets", publicName: "sortPresets", isSignal: true, isRequired: false, transformFunction: null }, initialSortQueries: { classPropertyName: "initialSortQueries", publicName: "initialSortQueries", isSignal: true, isRequired: false, transformFunction: null }, defaultSortQueries: { classPropertyName: "defaultSortQueries", publicName: "defaultSortQueries", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortDefinitions: "sortDefinitionsChange", sortQueriesChange: "sortQueriesChange" }, ngImport: i0, template: "<div class=\"axp-query-sorts flex flex-col select-none\">\n  <div class=\"axp-query-sorts__header flex items-center justify-between gap-2 border-b border-border-light px-4 py-3\">\n    <div class=\"flex min-w-0 items-center gap-2 font-bold\">\n      <ax-icon class=\"fa-light fa-sort-amount-up\"></ax-icon>\n      <span class=\"min-w-0 truncate\">{{ '@general:terms.interface.sort.title' | translate | async }}</span>\n    </div>\n    <ax-button\n      class=\"ax-sm\"\n      [look]=\"'blank'\"\n      [color]=\"'primary'\"\n      [disabled]=\"!canReset()\"\n      [text]=\"'@general:terms.interface.sort.clear' | translate | async\"\n      (onClick)=\"resetSorts()\"\n    ></ax-button>\n  </div>\n\n  <div class=\"axp-query-sorts__body flex flex-col gap-3 px-4 py-2\">\n    @if (hasPresets()) {\n      <!-- ----- Named recipes from entity.interfaces.master.list.sortPresets ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <div class=\"axp-query-sorts__section-label\">\n          {{ '@general:terms.interface.sort.quick-presets' | translate | async }}\n        </div>\n        <div class=\"flex flex-col\">\n          @for (preset of sortPresets(); track preset.name) {\n            <button\n              type=\"button\"\n              class=\"axp-query-sorts__preset\"\n              [class.axp-query-sorts__preset--active]=\"isPresetActive(preset)\"\n              (click)=\"applyPreset(preset)\"\n            >\n              <span class=\"flex min-w-0 items-center gap-2\">\n                <span\n                  class=\"axp-query-sorts__radio\"\n                  [class.axp-query-sorts__radio--on]=\"isPresetActive(preset)\"\n                ></span>\n                <span class=\"min-w-0 truncate font-medium text-sm\">\n                  {{ preset.title | translate | async }}\n                  <!--->\n                  <!-- ----- Optional subtitle from the entity preset ----- -->\n                  @if (preset.description) {\n                    <span class=\"text-neutral-400 font-normal\">\n                      ({{ preset.description | translate | async }})\n                    </span>\n                  }\n                </span>\n              </span>\n              <span class=\"axp-query-sorts__hint shrink-0\">\n                <!--->\n                <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n                @if (preset.icon) {\n                  <ax-icon [class]=\"preset.icon\"></ax-icon>\n                }\n                <!-- ----- Direction arrow when the recipe has no custom icon ----- -->\n                @else if (presetFirstDir(preset) === 'desc') {\n                  <ax-icon class=\"fa-solid fa-arrow-down-long\"></ax-icon>\n                }\n                <!-- ----- Ascending hint when the first sort is ascending ----- -->\n                @else if (presetFirstDir(preset) === 'asc') {\n                  <ax-icon class=\"fa-solid fa-arrow-up-long\"></ax-icon>\n                }\n                <!--->\n                <!-- ----- Optional hint label from the entity preset ----- -->\n                @if (preset.hint) {\n                  <span dir=\"ltr\">{{ preset.hint | translate | async }}</span>\n                }\n              </span>\n            </button>\n          }\n        </div>\n      </section>\n    }\n\n    @if (sortQueries().length) {\n      <!-- ----- Per-field sort toggles from property options.sort ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <!--->\n        <!-- ----- Section title only when quick presets are also shown ----- -->\n        @if (hasPresets()) {\n          <div class=\"axp-query-sorts__section-label\">\n            {{ '@general:terms.interface.sort.custom-fields' | translate | async }}\n          </div>\n        }\n        <div\n          class=\"flex flex-col w-full ax-sorted-list overflow-x-hidden\"\n          cdkDropList\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          @for (item of sortQueries(); track item.name) {\n            <div\n              class=\"axp-query-sorts__field\"\n              cdkDrag\n              cdkDragBoundary=\".ax-sorted-list\"\n            >\n              <div class=\"flex min-w-0 items-center gap-3\" cdkDragHandle>\n                <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move text-neutral-400\"></ax-icon>\n                <p class=\"font-medium text-sm truncate\">\n                  {{ item.title | translate | async }}\n                </p>\n              </div>\n              <ax-button [color]=\"'blank'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'asc'\"\n                  class=\"fa-solid fa-arrow-up-long text-neutral-400\"\n                ></ax-icon>\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'desc'\"\n                  class=\"fa-solid fa-arrow-down-long text-neutral-400\"\n                ></ax-icon>\n              </ax-button>\n            </div>\n          }\n        </div>\n      </section>\n    }\n  </div>\n</div>\n", styles: ["@layer properties;.axp-query-sorts{display:flex;max-height:min(28rem,70vh);min-width:0px;flex-direction:column}.axp-query-sorts__header{flex-shrink:0}.axp-query-sorts__body{min-height:0px;overflow-y:auto}.axp-query-sorts__section-label{padding-inline:var(--spacing, .25rem);padding-bottom:calc(var(--spacing, .25rem) * .5);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-query-sorts__preset{display:flex;width:100%;cursor:pointer;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);text-align:start}.axp-query-sorts__preset:hover:not(.axp-query-sorts__preset--active){background-color:var(--color-neutral-100, oklch(97% 0 none))}.axp-query-sorts__preset--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){.axp-query-sorts__preset--active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-query-sorts__field{display:flex;cursor:pointer;align-items:center;justify-content:space-between;padding-block:calc(var(--spacing, .25rem) * .5)}.axp-query-sorts__radio{display:inline-block;height:calc(var(--spacing, .25rem) * 2.5);width:calc(var(--spacing, .25rem) * 2.5);flex-shrink:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-300, oklch(87% 0 none))}.axp-query-sorts__radio--on{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-sorts__hint{display:flex;align-items:center;gap:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-400, oklch(70.8% 0 none))}.axp-query-sorts__preset--active .axp-query-sorts__hint{color:rgba(var(--ax-sys-color-primary-surface))}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$2.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: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQuerySortsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axp-query-sorts', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CdkDropList, CdkDrag, CdkDragHandle, AXTranslationModule, CommonModule, AXDecoratorModule, AXButtonModule], template: "<div class=\"axp-query-sorts flex flex-col select-none\">\n  <div class=\"axp-query-sorts__header flex items-center justify-between gap-2 border-b border-border-light px-4 py-3\">\n    <div class=\"flex min-w-0 items-center gap-2 font-bold\">\n      <ax-icon class=\"fa-light fa-sort-amount-up\"></ax-icon>\n      <span class=\"min-w-0 truncate\">{{ '@general:terms.interface.sort.title' | translate | async }}</span>\n    </div>\n    <ax-button\n      class=\"ax-sm\"\n      [look]=\"'blank'\"\n      [color]=\"'primary'\"\n      [disabled]=\"!canReset()\"\n      [text]=\"'@general:actions.reset.title' | translate | async\"\n      (onClick)=\"resetSorts()\"\n    ></ax-button>\n  </div>\n\n  <div class=\"axp-query-sorts__body flex flex-col gap-3 px-4 py-2\">\n    @if (hasPresets()) {\n      <!-- ----- Named recipes from entity.interfaces.master.list.sortPresets ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <div class=\"axp-query-sorts__section-label\">\n          {{ '@general:terms.interface.sort.quick-presets' | translate | async }}\n        </div>\n        <div class=\"flex flex-col\">\n          @for (preset of sortPresets(); track preset.name) {\n            <button\n              type=\"button\"\n              class=\"axp-query-sorts__preset\"\n              [class.axp-query-sorts__preset--active]=\"isPresetActive(preset)\"\n              (click)=\"applyPreset(preset)\"\n            >\n              <span class=\"flex min-w-0 items-center gap-2\">\n                <span\n                  class=\"axp-query-sorts__radio\"\n                  [class.axp-query-sorts__radio--on]=\"isPresetActive(preset)\"\n                ></span>\n                <span class=\"min-w-0 truncate font-medium text-sm\">\n                  {{ preset.title | translate | async }}\n                  <!--->\n                  <!-- ----- Optional subtitle from the entity preset ----- -->\n                  @if (preset.description) {\n                    <span class=\"text-neutral-400 font-normal\">\n                      ({{ preset.description | translate | async }})\n                    </span>\n                  }\n                </span>\n              </span>\n              <span class=\"axp-query-sorts__hint shrink-0\">\n                <!--->\n                <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n                @if (preset.icon) {\n                  <ax-icon [class]=\"preset.icon\"></ax-icon>\n                }\n                <!-- ----- Direction arrow when the recipe has no custom icon ----- -->\n                @else if (presetFirstDir(preset) === 'desc') {\n                  <ax-icon class=\"fa-solid fa-arrow-down-long\"></ax-icon>\n                }\n                <!-- ----- Ascending hint when the first sort is ascending ----- -->\n                @else if (presetFirstDir(preset) === 'asc') {\n                  <ax-icon class=\"fa-solid fa-arrow-up-long\"></ax-icon>\n                }\n                <!--->\n                <!-- ----- Optional hint label from the entity preset ----- -->\n                @if (preset.hint) {\n                  <span dir=\"ltr\">{{ preset.hint | translate | async }}</span>\n                }\n              </span>\n            </button>\n          }\n        </div>\n      </section>\n    }\n\n    @if (sortQueries().length) {\n      <!-- ----- Per-field sort toggles from property options.sort ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <!--->\n        <!-- ----- Section title only when quick presets are also shown ----- -->\n        @if (hasPresets()) {\n          <div class=\"axp-query-sorts__section-label\">\n            {{ '@general:terms.interface.sort.custom-fields' | translate | async }}\n          </div>\n        }\n        <div\n          class=\"flex flex-col w-full ax-sorted-list overflow-x-hidden\"\n          cdkDropList\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          @for (item of sortQueries(); track item.name) {\n            <div\n              class=\"axp-query-sorts__field\"\n              cdkDrag\n              cdkDragBoundary=\".ax-sorted-list\"\n            >\n              <div class=\"flex min-w-0 items-center gap-3\" cdkDragHandle>\n                <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move text-neutral-400\"></ax-icon>\n                <p class=\"font-medium text-sm truncate\">\n                  {{ item.title | translate | async }}\n                </p>\n              </div>\n              <ax-button [color]=\"'blank'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'asc'\"\n                  class=\"fa-solid fa-arrow-up-long text-neutral-400\"\n                ></ax-icon>\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'desc'\"\n                  class=\"fa-solid fa-arrow-down-long text-neutral-400\"\n                ></ax-icon>\n              </ax-button>\n            </div>\n          }\n        </div>\n      </section>\n    }\n  </div>\n</div>\n", styles: ["@layer properties;.axp-query-sorts{display:flex;max-height:min(28rem,70vh);min-width:0px;flex-direction:column}.axp-query-sorts__header{flex-shrink:0}.axp-query-sorts__body{min-height:0px;overflow-y:auto}.axp-query-sorts__section-label{padding-inline:var(--spacing, .25rem);padding-bottom:calc(var(--spacing, .25rem) * .5);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-query-sorts__preset{display:flex;width:100%;cursor:pointer;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);text-align:start}.axp-query-sorts__preset:hover:not(.axp-query-sorts__preset--active){background-color:var(--color-neutral-100, oklch(97% 0 none))}.axp-query-sorts__preset--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){.axp-query-sorts__preset--active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-query-sorts__field{display:flex;cursor:pointer;align-items:center;justify-content:space-between;padding-block:calc(var(--spacing, .25rem) * .5)}.axp-query-sorts__radio{display:inline-block;height:calc(var(--spacing, .25rem) * 2.5);width:calc(var(--spacing, .25rem) * 2.5);flex-shrink:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-300, oklch(87% 0 none))}.axp-query-sorts__radio--on{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-sorts__hint{display:flex;align-items:center;gap:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-400, oklch(70.8% 0 none))}.axp-query-sorts__preset--active .axp-query-sorts__hint{color:rgba(var(--ax-sys-color-primary-surface))}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+            args: [{ selector: 'axp-query-sorts', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CdkDropList, CdkDrag, CdkDragHandle, AXTranslationModule, CommonModule, AXDecoratorModule, AXButtonModule], template: "<div class=\"axp-query-sorts flex flex-col select-none\">\n  <div class=\"axp-query-sorts__header flex items-center justify-between gap-2 border-b border-border-light px-4 py-3\">\n    <div class=\"flex min-w-0 items-center gap-2 font-bold\">\n      <ax-icon class=\"fa-light fa-sort-amount-up\"></ax-icon>\n      <span class=\"min-w-0 truncate\">{{ '@general:terms.interface.sort.title' | translate | async }}</span>\n    </div>\n    <ax-button\n      class=\"ax-sm\"\n      [look]=\"'blank'\"\n      [color]=\"'primary'\"\n      [disabled]=\"!canReset()\"\n      [text]=\"'@general:terms.interface.sort.clear' | translate | async\"\n      (onClick)=\"resetSorts()\"\n    ></ax-button>\n  </div>\n\n  <div class=\"axp-query-sorts__body flex flex-col gap-3 px-4 py-2\">\n    @if (hasPresets()) {\n      <!-- ----- Named recipes from entity.interfaces.master.list.sortPresets ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <div class=\"axp-query-sorts__section-label\">\n          {{ '@general:terms.interface.sort.quick-presets' | translate | async }}\n        </div>\n        <div class=\"flex flex-col\">\n          @for (preset of sortPresets(); track preset.name) {\n            <button\n              type=\"button\"\n              class=\"axp-query-sorts__preset\"\n              [class.axp-query-sorts__preset--active]=\"isPresetActive(preset)\"\n              (click)=\"applyPreset(preset)\"\n            >\n              <span class=\"flex min-w-0 items-center gap-2\">\n                <span\n                  class=\"axp-query-sorts__radio\"\n                  [class.axp-query-sorts__radio--on]=\"isPresetActive(preset)\"\n                ></span>\n                <span class=\"min-w-0 truncate font-medium text-sm\">\n                  {{ preset.title | translate | async }}\n                  <!--->\n                  <!-- ----- Optional subtitle from the entity preset ----- -->\n                  @if (preset.description) {\n                    <span class=\"text-neutral-400 font-normal\">\n                      ({{ preset.description | translate | async }})\n                    </span>\n                  }\n                </span>\n              </span>\n              <span class=\"axp-query-sorts__hint shrink-0\">\n                <!--->\n                <!-- ----- Custom icon when the recipe does not use a direction arrow ----- -->\n                @if (preset.icon) {\n                  <ax-icon [class]=\"preset.icon\"></ax-icon>\n                }\n                <!-- ----- Direction arrow when the recipe has no custom icon ----- -->\n                @else if (presetFirstDir(preset) === 'desc') {\n                  <ax-icon class=\"fa-solid fa-arrow-down-long\"></ax-icon>\n                }\n                <!-- ----- Ascending hint when the first sort is ascending ----- -->\n                @else if (presetFirstDir(preset) === 'asc') {\n                  <ax-icon class=\"fa-solid fa-arrow-up-long\"></ax-icon>\n                }\n                <!--->\n                <!-- ----- Optional hint label from the entity preset ----- -->\n                @if (preset.hint) {\n                  <span dir=\"ltr\">{{ preset.hint | translate | async }}</span>\n                }\n              </span>\n            </button>\n          }\n        </div>\n      </section>\n    }\n\n    @if (sortQueries().length) {\n      <!-- ----- Per-field sort toggles from property options.sort ----- -->\n      <section class=\"flex flex-col gap-1\">\n        <!--->\n        <!-- ----- Section title only when quick presets are also shown ----- -->\n        @if (hasPresets()) {\n          <div class=\"axp-query-sorts__section-label\">\n            {{ '@general:terms.interface.sort.custom-fields' | translate | async }}\n          </div>\n        }\n        <div\n          class=\"flex flex-col w-full ax-sorted-list overflow-x-hidden\"\n          cdkDropList\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          @for (item of sortQueries(); track item.name) {\n            <div\n              class=\"axp-query-sorts__field\"\n              cdkDrag\n              cdkDragBoundary=\".ax-sorted-list\"\n            >\n              <div class=\"flex min-w-0 items-center gap-3\" cdkDragHandle>\n                <ax-icon class=\"fa-solid fa-grip-dots-vertical cursor-move text-neutral-400\"></ax-icon>\n                <p class=\"font-medium text-sm truncate\">\n                  {{ item.title | translate | async }}\n                </p>\n              </div>\n              <ax-button [color]=\"'blank'\" class=\"ax-sm\" (click)=\"changeItemSort(item)\">\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'asc'\"\n                  class=\"fa-solid fa-arrow-up-long text-neutral-400\"\n                ></ax-icon>\n                <ax-icon\n                  [class.text-primary]=\"getSortDirection(item) === 'desc'\"\n                  class=\"fa-solid fa-arrow-down-long text-neutral-400\"\n                ></ax-icon>\n              </ax-button>\n            </div>\n          }\n        </div>\n      </section>\n    }\n  </div>\n</div>\n", styles: ["@layer properties;.axp-query-sorts{display:flex;max-height:min(28rem,70vh);min-width:0px;flex-direction:column}.axp-query-sorts__header{flex-shrink:0}.axp-query-sorts__body{min-height:0px;overflow-y:auto}.axp-query-sorts__section-label{padding-inline:var(--spacing, .25rem);padding-bottom:calc(var(--spacing, .25rem) * .5);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-query-sorts__preset{display:flex;width:100%;cursor:pointer;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);text-align:start}.axp-query-sorts__preset:hover:not(.axp-query-sorts__preset--active){background-color:var(--color-neutral-100, oklch(97% 0 none))}.axp-query-sorts__preset--active{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){.axp-query-sorts__preset--active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}.axp-query-sorts__field{display:flex;cursor:pointer;align-items:center;justify-content:space-between;padding-block:calc(var(--spacing, .25rem) * .5)}.axp-query-sorts__radio{display:inline-block;height:calc(var(--spacing, .25rem) * 2.5);width:calc(var(--spacing, .25rem) * 2.5);flex-shrink:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-neutral-300, oklch(87% 0 none))}.axp-query-sorts__radio--on{border-color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}.axp-query-sorts__hint{display:flex;align-items:center;gap:var(--spacing, .25rem);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-neutral-400, oklch(70.8% 0 none))}.axp-query-sorts__preset--active .axp-query-sorts__hint{color:rgba(var(--ax-sys-color-primary-surface))}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { sortDefinitions: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortDefinitions", required: false }] }, { type: i0.Output, args: ["sortDefinitionsChange"] }], sortPresets: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortPresets", required: false }] }], initialSortQueries: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialSortQueries", required: false }] }], defaultSortQueries: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSortQueries", required: false }] }], sortQueriesChange: [{ type: i0.Output, args: ["sortQueriesChange"] }] } });
 
 //#endregion
@@ -15674,13 +15708,13 @@ class AXPQueryViewSaveButtonComponent {
         this.save.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQueryViewSaveButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQueryViewSaveButtonComponent, isStandalone: true, selector: "axp-query-view-save-button", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save" }, host: { classAttribute: "axp-query-view-save-button-host" }, ngImport: i0, template: "<!-- ----- Save current list layout as a named view ----- -->\n@if (visible()) {\n  <div\n    class=\"axp-query-view-save-button\"\n    animate.enter=\"axp-query-view-save-button--enter\"\n    animate.leave=\"axp-query-view-save-button--leave\"\n  >\n    <ax-button\n      [title]=\"'@general:terms.interface.view.save-as'\"\n      [iconOnly]=\"true\"\n      [color]=\"'primary'\"\n      [look]=\"'outline'\"\n      (onClick)=\"onSave()\"\n    >\n      <ax-prefix>\n        <i class=\"fa-light fa-floppy-disk\"></i>\n      </ax-prefix>\n    </ax-button>\n  </div>\n}\n", styles: [".axp-query-view-save-button-host{display:contents}.axp-query-view-save-button{display:flex;flex:0 0 auto;align-items:center;overflow:hidden;max-width:2.5rem}.axp-query-view-save-button--enter{animation:axp-query-view-save-button-in .22s ease-out both}.axp-query-view-save-button--leave{animation:axp-query-view-save-button-out .18s ease-in both}@keyframes axp-query-view-save-button-in{0%{opacity:0;max-width:0;transform:scale(.92)}to{opacity:1;max-width:2.5rem;transform:scale(1)}}@keyframes axp-query-view-save-button-out{0%{opacity:1;max-width:2.5rem;transform:scale(1)}to{opacity:0;max-width:0;transform:scale(.92)}}.axp-query-view-save-button ax-button,.axp-query-view-save-button ax-button button{min-width:2.25rem;width:2.25rem;height:2.25rem;padding:0}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$2.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: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPQueryViewSaveButtonComponent, isStandalone: true, selector: "axp-query-view-save-button", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save" }, host: { classAttribute: "axp-query-view-save-button-host" }, ngImport: i0, template: "<!-- ----- Save current list layout as a named view ----- -->\n@if (visible()) {\n  <div\n    class=\"axp-query-view-save-button\"\n    animate.enter=\"axp-query-view-save-button--enter\"\n    animate.leave=\"axp-query-view-save-button--leave\"\n  >\n    <ax-button\n      [title]=\"'@general:terms.interface.view.save-as'\"\n      [iconOnly]=\"true\"\n      [color]=\"'primary'\"\n      [look]=\"'outline'\"\n      (onClick)=\"onSave()\"\n    >\n      <ax-prefix>\n        <i class=\"fa-light fa-floppy-disk\"></i>\n      </ax-prefix>\n    </ax-button>\n  </div>\n}\n", styles: [".axp-query-view-save-button-host{display:contents}.axp-query-view-save-button{display:flex;flex:0 0 auto;align-items:center;overflow:hidden;max-width:var(--ax-sys-size-base)}.axp-query-view-save-button--enter{animation:axp-query-view-save-button-in .22s ease-out both}.axp-query-view-save-button--leave{animation:axp-query-view-save-button-out .18s ease-in both}@keyframes axp-query-view-save-button-in{0%{opacity:0;max-width:0;transform:scale(.92)}to{opacity:1;max-width:var(--ax-sys-size-base);transform:scale(1)}}@keyframes axp-query-view-save-button-out{0%{opacity:1;max-width:var(--ax-sys-size-base);transform:scale(1)}to{opacity:0;max-width:0;transform:scale(.92)}}.axp-query-view-save-button ax-button,.axp-query-view-save-button ax-button button{min-width:var(--ax-sys-size-base);width:var(--ax-sys-size-base);height:var(--ax-sys-size-base);padding:0}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$2.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: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPQueryViewSaveButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'axp-query-view-save-button', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXButtonModule, AXDecoratorModule], host: {
                         class: 'axp-query-view-save-button-host',
-                    }, template: "<!-- ----- Save current list layout as a named view ----- -->\n@if (visible()) {\n  <div\n    class=\"axp-query-view-save-button\"\n    animate.enter=\"axp-query-view-save-button--enter\"\n    animate.leave=\"axp-query-view-save-button--leave\"\n  >\n    <ax-button\n      [title]=\"'@general:terms.interface.view.save-as'\"\n      [iconOnly]=\"true\"\n      [color]=\"'primary'\"\n      [look]=\"'outline'\"\n      (onClick)=\"onSave()\"\n    >\n      <ax-prefix>\n        <i class=\"fa-light fa-floppy-disk\"></i>\n      </ax-prefix>\n    </ax-button>\n  </div>\n}\n", styles: [".axp-query-view-save-button-host{display:contents}.axp-query-view-save-button{display:flex;flex:0 0 auto;align-items:center;overflow:hidden;max-width:2.5rem}.axp-query-view-save-button--enter{animation:axp-query-view-save-button-in .22s ease-out both}.axp-query-view-save-button--leave{animation:axp-query-view-save-button-out .18s ease-in both}@keyframes axp-query-view-save-button-in{0%{opacity:0;max-width:0;transform:scale(.92)}to{opacity:1;max-width:2.5rem;transform:scale(1)}}@keyframes axp-query-view-save-button-out{0%{opacity:1;max-width:2.5rem;transform:scale(1)}to{opacity:0;max-width:0;transform:scale(.92)}}.axp-query-view-save-button ax-button,.axp-query-view-save-button ax-button button{min-width:2.25rem;width:2.25rem;height:2.25rem;padding:0}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+                    }, template: "<!-- ----- Save current list layout as a named view ----- -->\n@if (visible()) {\n  <div\n    class=\"axp-query-view-save-button\"\n    animate.enter=\"axp-query-view-save-button--enter\"\n    animate.leave=\"axp-query-view-save-button--leave\"\n  >\n    <ax-button\n      [title]=\"'@general:terms.interface.view.save-as'\"\n      [iconOnly]=\"true\"\n      [color]=\"'primary'\"\n      [look]=\"'outline'\"\n      (onClick)=\"onSave()\"\n    >\n      <ax-prefix>\n        <i class=\"fa-light fa-floppy-disk\"></i>\n      </ax-prefix>\n    </ax-button>\n  </div>\n}\n", styles: [".axp-query-view-save-button-host{display:contents}.axp-query-view-save-button{display:flex;flex:0 0 auto;align-items:center;overflow:hidden;max-width:var(--ax-sys-size-base)}.axp-query-view-save-button--enter{animation:axp-query-view-save-button-in .22s ease-out both}.axp-query-view-save-button--leave{animation:axp-query-view-save-button-out .18s ease-in both}@keyframes axp-query-view-save-button-in{0%{opacity:0;max-width:0;transform:scale(.92)}to{opacity:1;max-width:var(--ax-sys-size-base);transform:scale(1)}}@keyframes axp-query-view-save-button-out{0%{opacity:1;max-width:var(--ax-sys-size-base);transform:scale(1)}to{opacity:0;max-width:0;transform:scale(.92)}}.axp-query-view-save-button ax-button,.axp-query-view-save-button ax-button button{min-width:var(--ax-sys-size-base);width:var(--ax-sys-size-base);height:var(--ax-sys-size-base);padding:0}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], propDecorators: { visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }], save: [{ type: i0.Output, args: ["save"] }] } });
 
 //#region ----- Imports -----
@@ -16313,5 +16347,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AXPActivityLogComponent, AXPAvatarComponent, AXPCategoryTreeComponent, AXPColorChooserComponent, AXPColorPalettePickerComponent, AXPColumnItemListComponent, AXPCompareViewComponent, AXPConditionBuilderComponent, AXPConditionBuilderConditionComponent, AXPDataSelectorComponent, AXPDataSelectorService, AXPDragDropListComponent, AXPEntityListStylingDialogService, AXPEntityListStylingPopupComponent, AXPExpressionFieldDefinitions, AXPFileChooserCompressImagesHook, AXPFileChooserDirective, AXPFileChooserHookKeys, AXPFileChooserService, AXPFileChooserZipFilesHook, AXPFileUploaderDirective, AXPFileUploaderHookKeys, AXPFileUploaderService, AXPFileViewerComponent, AXPFileViewerFallbackContentComponent, AXPFileViewerService, AXPImageEditorPopupComponent, AXPImageEditorService, AXPInfiniteScrollDirective, AXPItemConfiguratorComponent, AXPLayoutFloatingZoomBarComponent, AXPLayoutSideDetailPanelComponent, AXPLayoutSideDetailPanelSectionDirective, AXPLocalDataSourceEditorDialogService, AXPMarkdownTemplateDirective, AXPMarkdownViewerComponent, AXPMenuBadgeHelper, AXPMenuCustomizerComponent, AXPMenuCustomizerService, AXPOutcomeResultsViewerComponent, AXPPageComponentRegistryService, AXPPreloadFiltersComponent, AXPPropertyViewerComponent, AXPPropertyViewerPopupComponent, AXPPropertyViewerService, AXPQueryColumnsComponent, AXPQueryFiltersComponent, AXPQuerySortsComponent, AXPQueryViewSaveButtonComponent, AXPQueryViewSaveDialogService, AXPQueryViewTabsComponent, AXPQueryViewsComponent, AXPRepeaterRowsLayoutComponent, AXPResourceAppointmentBoardProvider, AXPResourceAppointmentComponent, AXPResourceAppointmentService, AXPSectionItemsBuilderComponent, AXPSignatureEditorService, AXPSpreadsheetComponent, AXPStandardSectionItemsBuilderComponent, AXPStopwatchComponent, AXPTableColumnsEditorComponent, AXPTableColumnsEditorPopupComponent, AXPTableColumnsEditorService, AXPTableDataEditorComponent, AXPTableDataEditorPopupComponent, AXPTableDataEditorService, AXPTaskBadgeDirective, AXPTaskBadgeProvider, AXPTaskBadgeService, AXPTemplateViewerComponent, AXPTemplateViewerService, AXPTextCommandColumnComponent, AXPThemeLayoutActionsComponent, AXPThemeLayoutBlockComponent, AXPThemeLayoutContainerComponent, AXPThemeLayoutEndSideComponent, AXPThemeLayoutFooterComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutListComponent, AXPThemeLayoutListItemComponent, AXPThemeLayoutListItemsGroupComponent, AXPThemeLayoutPageHeaderComponent, AXPThemeLayoutPagePrimaryActionsComponent, AXPThemeLayoutPageSecondaryActionsComponent, AXPThemeLayoutSectionComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutToolbarComponent, AXPUserAvatarComponent, AXPUserAvatarService, AXPUserCardComponent, AXPUserCardDirective, AXPUserCardService, AXPVirtualKeypadComponent, AXPWidgetFieldConfiguratorComponent, AXPWidgetItemComponent, AXPWidgetPropertyViewerComponent, AXPWidgetPropertyViewerPopupComponent, AXPWidgetPropertyViewerService, AXP_EXPRESSION_LOGIC_DEFINITIONS, AXP_EXPRESSION_OPERATION_DEFINITIONS, AXP_FILE_CHOOSER_DEFAULT_ZIP_ARCHIVE_NAME, AXP_FILE_CHOOSER_HOOK_PROVIDERS, AXP_FILE_CHOOSER_OPTION_KEYS, AXP_FILE_CHOOSER_PROVIDERS, AXP_FILE_UPLOADER_PROVIDERS, AXP_IMAGE_FILE_CHOOSER_ACCEPT, AXP_INFINITE_SCROLL_DEFAULT_ROOT_MARGIN, AXP_MENU_CUSTOMIZER_SERVICE, AXP_PAGE_COMPONENT_PROVIDER, AXP_PAGE_LAYOUT_ELEMENT_ID, AXP_PROFILE_PHOTO_GRAVATAR_SOURCE_KEY, AXP_RESOURCE_APPOINTMENT_PROVIDER, AXP_SPREADSHEET_COLUMN_WIDGET_TYPES, AXP_SYSTEM_FILE_CHOOSER_PROVIDER, AXP_SYSTEM_FILE_UPLOADER_PROVIDER, AXP_TASK_BADGE_PROVIDERS, AXP_USER_AVATAR_PROVIDER, PROPERTY_VIEWER_EXPRESSION_EDITOR_MIN_LINES, SPREADSHEET_COLUMN_NAME_PATH, SPREADSHEET_COLUMN_TITLE_PATH, STANDARD_SECTION_ITEMS_SECTION_TABS, USER_CARD_HOVER_OPEN_DELAY_MS, USER_CARD_ITEMS_HOOK, USER_CARD_ITEMS_SKELETON_DELAY_MS, asSpreadsheetColumnTitle, buildEntityListStylingRulesLayout, buildFileChooserOptions, buildGravatarAvatarUrl, buildPropertyViewerInitialContextFromProperties, buildPropertyViewerTabsFromProperties, buildTableColumnsEditorLayout, compressImageFile, createAttachedFileProviderMenu, createZipArchive, fetchGravatarImageFile, fileListItemToFileViewerItem, fileListItemToImageFile, fileMatchesAccept, fileNameMatchesAccept, filterFileProvidersByContext, filterFilesByAcceptAndMaxSize, formatAcceptForDisplay, formatMaxFileSizeForDisplay, getFieldDefinitions, getLogicDefinition, getOperationDefinition, isPropertyBindingExpressionFormValue, isUnrestrictedFileAccept, mapFileListToViewerItems, md5Hex, mergeInfiniteScrollPage, mergeObjectsReplacingArrays, normalizeFileViewerBoundValue, normalizeSpreadsheetColumnName, notifyFileAcceptRejections, observeInfiniteScroll, pickImageFileViaFileChooser, pickProfilePhotoImageFile, preparePropertyForViewer, preparePropertyViewerTabs, provideFileChooserHooks, readSpreadsheetColumnIdentity, readSpreadsheetColumnWidth, registerFieldDefinitions, resolveExcludedFileProviderKeys, resolveFileChooserAccept, resolveFileChooserExtension, resolveFileListItemUrl, resolveFileUploaderEmptyStateDescription, resolveInfiniteScrollRoot, sortUserCardActions, sortUserCardRows, spreadsheetColumnIdentityProperties, toSpreadsheetColumnWidget, validateFileChooserItems, visibleUserCardActions, withValidationsOnEditorNode };
+export { AXPActivityLogComponent, AXPAvatarComponent, AXPCategoryTreeComponent, AXPColorChooserComponent, AXPColorPalettePickerComponent, AXPColumnItemListComponent, AXPCompareViewComponent, AXPConditionBuilderComponent, AXPConditionBuilderConditionComponent, AXPDataSelectorComponent, AXPDataSelectorService, AXPDragDropListComponent, AXPEntityListStylingDialogService, AXPEntityListStylingPopupComponent, AXPExpressionFieldDefinitions, AXPFileChooserCompressImagesHook, AXPFileChooserDirective, AXPFileChooserHookKeys, AXPFileChooserService, AXPFileChooserZipFilesHook, AXPFileUploaderDirective, AXPFileUploaderHookKeys, AXPFileUploaderService, AXPFileViewerComponent, AXPFileViewerFallbackContentComponent, AXPFileViewerService, AXPImageEditorPopupComponent, AXPImageEditorService, AXPInfiniteScrollDirective, AXPItemConfiguratorComponent, AXPLayoutFloatingZoomBarComponent, AXPLayoutSideDetailPanelComponent, AXPLayoutSideDetailPanelSectionDirective, AXPLocalDataSourceEditorDialogService, AXPMarkdownTemplateDirective, AXPMarkdownViewerComponent, AXPMenuBadgeHelper, AXPMenuCustomizerComponent, AXPMenuCustomizerService, AXPOutcomeResultsViewerComponent, AXPPageComponentRegistryService, AXPPreloadFiltersComponent, AXPPropertyViewerComponent, AXPPropertyViewerPopupComponent, AXPPropertyViewerService, AXPQueryColumnsComponent, AXPQueryFiltersComponent, AXPQuerySortsComponent, AXPQueryViewSaveButtonComponent, AXPQueryViewSaveDialogService, AXPQueryViewTabsComponent, AXPQueryViewsComponent, AXPRepeaterRowsLayoutComponent, AXPResourceAppointmentBoardProvider, AXPResourceAppointmentComponent, AXPResourceAppointmentService, AXPSectionItemsBuilderComponent, AXPSignatureEditorService, AXPSpreadsheetComponent, AXPStandardSectionItemsBuilderComponent, AXPStopwatchComponent, AXPTableColumnsEditorComponent, AXPTableColumnsEditorPopupComponent, AXPTableColumnsEditorService, AXPTableDataEditorComponent, AXPTableDataEditorPopupComponent, AXPTableDataEditorService, AXPTaskBadgeDirective, AXPTaskBadgeProvider, AXPTaskBadgeService, AXPTemplateViewerComponent, AXPTemplateViewerService, AXPTextCommandColumnComponent, AXPThemeLayoutActionsComponent, AXPThemeLayoutBlockComponent, AXPThemeLayoutContainerComponent, AXPThemeLayoutEndSideComponent, AXPThemeLayoutFooterComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutListComponent, AXPThemeLayoutListItemComponent, AXPThemeLayoutListItemsGroupComponent, AXPThemeLayoutPageHeaderComponent, AXPThemeLayoutPagePrimaryActionsComponent, AXPThemeLayoutPageSecondaryActionsComponent, AXPThemeLayoutSectionComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutToolbarComponent, AXPUserAvatarComponent, AXPUserAvatarService, AXPUserCardComponent, AXPUserCardDirective, AXPUserCardService, AXPVirtualKeypadComponent, AXPWidgetFieldConfiguratorComponent, AXPWidgetItemComponent, AXPWidgetPropertyViewerComponent, AXPWidgetPropertyViewerPopupComponent, AXPWidgetPropertyViewerService, AXP_EXPRESSION_LOGIC_DEFINITIONS, AXP_EXPRESSION_OPERATION_DEFINITIONS, AXP_FILE_CHOOSER_DEFAULT_ZIP_ARCHIVE_NAME, AXP_FILE_CHOOSER_HOOK_PROVIDERS, AXP_FILE_CHOOSER_OPTION_KEYS, AXP_FILE_CHOOSER_PROVIDERS, AXP_FILE_UPLOADER_PROVIDERS, AXP_IMAGE_FILE_CHOOSER_ACCEPT, AXP_INFINITE_SCROLL_DEFAULT_ROOT_MARGIN, AXP_MENU_CUSTOMIZER_SERVICE, AXP_PAGE_COMPONENT_PROVIDER, AXP_PAGE_LAYOUT_ELEMENT_ID, AXP_PROFILE_PHOTO_GRAVATAR_SOURCE_KEY, AXP_RESOURCE_APPOINTMENT_PROVIDER, AXP_SIGNATURE_PROVIDER, AXP_SPREADSHEET_COLUMN_WIDGET_TYPES, AXP_SYSTEM_FILE_CHOOSER_PROVIDER, AXP_SYSTEM_FILE_UPLOADER_PROVIDER, AXP_TASK_BADGE_PROVIDERS, AXP_USER_AVATAR_PROVIDER, PROPERTY_VIEWER_EXPRESSION_EDITOR_MIN_LINES, SPREADSHEET_COLUMN_NAME_PATH, SPREADSHEET_COLUMN_TITLE_PATH, STANDARD_SECTION_ITEMS_SECTION_TABS, USER_CARD_HOVER_OPEN_DELAY_MS, USER_CARD_ITEMS_HOOK, USER_CARD_ITEMS_SKELETON_DELAY_MS, asSpreadsheetColumnTitle, buildEntityListStylingRulesLayout, buildFileChooserOptions, buildGravatarAvatarUrl, buildPropertyViewerInitialContextFromProperties, buildPropertyViewerTabsFromProperties, buildTableColumnsEditorLayout, compressImageFile, createAttachedFileProviderMenu, createZipArchive, fetchGravatarImageFile, fileListItemToFileViewerItem, fileListItemToImageFile, fileMatchesAccept, fileNameMatchesAccept, filterFileProvidersByContext, filterFilesByAcceptAndMaxSize, formatAcceptForDisplay, formatMaxFileSizeForDisplay, getFieldDefinitions, getLogicDefinition, getOperationDefinition, isPropertyBindingExpressionFormValue, isUnrestrictedFileAccept, mapFileListToViewerItems, md5Hex, mergeInfiniteScrollPage, mergeObjectsReplacingArrays, normalizeFileViewerBoundValue, normalizeSpreadsheetColumnName, notifyFileAcceptRejections, observeInfiniteScroll, pickImageFileViaFileChooser, pickProfilePhotoImageFile, preparePropertyForViewer, preparePropertyViewerTabs, provideFileChooserHooks, readSpreadsheetColumnIdentity, readSpreadsheetColumnWidth, registerFieldDefinitions, resolveExcludedFileProviderKeys, resolveFileChooserAccept, resolveFileChooserExtension, resolveFileListItemUrl, resolveFileUploaderEmptyStateDescription, resolveInfiniteScrollRoot, sortUserCardActions, sortUserCardRows, spreadsheetColumnIdentityProperties, toSpreadsheetColumnWidget, validateFileChooserItems, visibleUserCardActions, withValidationsOnEditorNode };
 //# sourceMappingURL=acorex-platform-framework-client-layout-components.mjs.map