@sinequa/atomic-angular 1.8.0 → 1.9.1

package/fesm2022/sinequa-atomic-angular.mjs

@@ -1854,42 +1854,49 @@ async function withFetch(callback, injector) {
     }
 }
 
+/**
+ * Canonical default shape of the query params state.
+ *
+ * Shared between `withState()` (initial value) and `reset()` (replacement state) so the
+ * two cannot drift apart. Keep in sync with `QueryParamsState`.
+ */
+const QUERY_PARAMS_DEFAULTS = {
+    // QueryParams specific properties
+    path: "",
+    filters: [],
+    id: "",
+    // Query properties (all optional due to Partial<>)
+    name: "",
+    text: "",
+    action: "",
+    select: [],
+    open: [],
+    page: undefined,
+    pageSize: undefined,
+    tab: "",
+    scope: "",
+    sort: "",
+    basket: "",
+    isFirstPage: undefined,
+    strictRefine: undefined,
+    globalRelevance: undefined,
+    questionLanguage: "",
+    questionDefaultLanguage: "",
+    spellingCorrectionMode: undefined,
+    spellingCorrectionFilter: "",
+    documentWeight: "",
+    textPartWeights: "",
+    relevanceTransforms: "",
+    removeDuplicates: undefined,
+    queryId: "",
+    aggregations: undefined,
+    orderBy: "",
+    groupBy: "",
+    neuralSearch: undefined
+};
 const QueryParamsStore = signalStore({ providedIn: "root" }, withDevtools("QueryParams"), withQueryParamsFeatures());
 function withQueryParamsFeatures() {
-    return signalStoreFeature(withState({
-        // QueryParams specific properties
-        path: "",
-        filters: [],
-        id: "",
-        // Query properties (all optional due to Partial<>)
-        name: "",
-        text: "",
-        action: "",
-        select: [],
-        open: [],
-        page: undefined,
-        pageSize: undefined,
-        tab: "",
-        scope: "",
-        sort: "",
-        basket: "",
-        isFirstPage: undefined,
-        strictRefine: undefined,
-        globalRelevance: undefined,
-        questionLanguage: "",
-        questionDefaultLanguage: "",
-        spellingCorrectionMode: undefined,
-        spellingCorrectionFilter: "",
-        documentWeight: "",
-        textPartWeights: "",
-        relevanceTransforms: "",
-        removeDuplicates: undefined,
-        queryId: "",
-        aggregations: undefined,
-        orderBy: "",
-        groupBy: "",
-        neuralSearch: undefined
-    }), withMethods((store, injector = inject(Injector), router = inject(Router), route = inject(ActivatedRoute), appStore = inject(AppStore)) => ({
+    return signalStoreFeature(withState(QUERY_PARAMS_DEFAULTS), withMethods((store, injector = inject(Injector), router = inject(Router), route = inject(ActivatedRoute), appStore = inject(AppStore)) => ({
         /**
          * Sets the state from the given URL by extracting query parameters and updating the store.
          *
@@ -2127,6 +2134,18 @@ function withQueryParamsFeatures() {
                 return newState;
             });
         },
+        /**
+         * Resets the query params to their default state.
+         *
+         * Called on every application (re-)initialization (first login, sign-in, and user
+         * override/impersonation) so that a previous user's search text/filters/sort/etc. don't
+         * leak into the next user's session — `QueryParamsStore` is a root-level singleton that
+         * otherwise survives across logins. See ES-32053.
+         */
+        reset(options) {
+            patchState(store, QUERY_PARAMS_DEFAULTS);
+            this._updateUrlQueryParams(QUERY_PARAMS_DEFAULTS, undefined, options);
+        },
         /**
          * Retrieves a filter object based on the provided field or name.
          *
@@ -3540,16 +3559,33 @@ class AggregationsService {
     }
     /* aggregations helpers fot the filters components */
     getAuthorizedFilters(aggregations, includedFilters = [], excludedFilters = [], homepageOnly = false) {
+        // An explicit list is a deliberate developer choice: it bypasses the `hidden`
+        // admin rule. The rule only applies to the default, config-driven path.
+        const explicit = aggregations !== undefined;
         const agg = aggregations || this.appStore.getAuthorizedFilters();
         const authorizedFilters = agg
             .filter((f) => this.getFilterCriteria()(f)) // filter only the filters present
             .filter((f) => !homepageOnly || this.getHomepageFilterCriteria()(f)) // when requested, keep only filters flagged `homepage: true`
             .filter((f) => !this.getLeftOnlyFilterCriteria()(f)) // exclude left-only filters (rendered in the left drawer, not the bar)
+            .filter((f) => explicit || !this.getHiddenFilterCriteria()(f)) // exclude admin-hidden filters (default path only)
             .filter((f) => !excludedFilters.includes(f.name))
             .filter((f) => !includedFilters.length || includedFilters.includes(f.name))
             .map((f) => ({ field: f.column, column: f.column, name: f.name })); // field is needed for filters constructions
         return authorizedFilters;
     }
+    /**
+     * Removes the aggregations flagged `hidden: true` in the `filters` custom JSON
+     * configuration (the administrator does not want them displayed).
+     *
+     * Exposed for consumers that build their own aggregation list without going through
+     * {@link getAuthorizedFilters} (e.g. the aside filters drawer).
+     *
+     * @param aggregations - The aggregations to filter.
+     * @returns The aggregations that are not flagged hidden.
+     */
+    rejectHidden(aggregations) {
+        return aggregations.filter((agg) => !this.getHiddenFilterCriteria()(agg));
+    }
     /**
      * Determines whether a custom JSON filter refers to the given aggregation.
      *
@@ -3593,6 +3629,10 @@ class AggregationsService {
         // `position: 'both'` (and an undefined position) stay in the bar.
         return (agg) => this.appStore.filters().some((filter) => filter.position === "left" && this.matchesAggregation(filter, agg));
     };
+    getHiddenFilterCriteria = () => {
+        // an aggregation is hidden when a matching filter in the custom JSON has `hidden: true`
+        return (agg) => this.appStore.filters().some((filter) => filter.hidden && this.matchesAggregation(filter, agg));
+    };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AggregationsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AggregationsService, providedIn: "root" });
 }
@@ -3721,6 +3761,7 @@ class ApplicationService {
     userSettingsStore = inject(UserSettingsStore);
     principalStore = inject(PrincipalStore);
     appStore = inject(AppStore);
+    queryParamsStore = inject(QueryParamsStore);
     router = inject(Router);
     titleService = inject(Title);
     components = inject(ROUTE_COMPONENTS);
@@ -3771,6 +3812,8 @@ class ApplicationService {
      * Initializes the application stores.
      * - Fetches the application configuration.
      * - Sets the fetched application configuration in the app store.
+     * - Resets the query params store (runs on first login as well as on every subsequent
+     *   re-initialization, e.g. user override, so no previous user's search state leaks in).
      * - Loads the user settings and logs the state of the user settings store.
      */
     async initializeStores() {
@@ -3781,6 +3824,9 @@ class ApplicationService {
             // Load the principal (user information)
             await this.principalStore.initialize();
             info("principalStore", getState(this.principalStore));
+            // Reset the query params (search text, filters, sort, ...) so a previous user's
+            // in-memory search state doesn't leak into the next user's session. ES-32053.
+            this.queryParamsStore.reset();
             // Load the user settings
             await this.userSettingsStore.initialize();
             info("userSettingsStore", getState(this.userSettingsStore));
@@ -14693,7 +14739,7 @@ class AggregationTreeComponent {
         return false;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AggregationTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AggregationTreeComponent, isStandalone: true, selector: "AggregationTree, aggregation-tree, aggregationtree", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, showFiltersCount: { classPropertyName: "showFiltersCount", publicName: "showFiltersCount", isSignal: true, isRequired: false, transformFunction: null }, showCheckbox: { classPropertyName: "showCheckbox", publicName: "showCheckbox", isSignal: true, isRequired: false, transformFunction: null }, expandedLevel: { classPropertyName: "expandedLevel", publicName: "expandedLevel", isSignal: true, isRequired: false, transformFunction: null }, syncUrl: { classPropertyName: "syncUrl", publicName: "syncUrl", isSignal: true, isRequired: false, transformFunction: null }, controlledQuery: { classPropertyName: "controlledQuery", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, controlledAggregation: { classPropertyName: "controlledAggregation", publicName: "aggregation", isSignal: true, isRequired: false, transformFunction: null }, controlledSelection: { classPropertyName: "controlledSelection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, itemTemplateInput: { classPropertyName: "itemTemplateInput", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null }, searchText: { classPropertyName: "searchText", publicName: "searchText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelect: "onSelect", onApply: "onApply", onClear: "onClear", selectionChange: "selectionChange", filtersChange: "filtersChange", searchText: "searchTextChange" }, host: { properties: { "class": "cn(\"block h-[inherit] max-h-[inherit] w-[inherit]\", class())" } }, queries: [{ propertyName: "itemDirective", first: true, predicate: AggregationItemDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "virtualItems", predicate: ["virtualItem"], descendants: true, isSignal: true }, { propertyName: "scrollElement", first: true, predicate: ["scrollElement"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (!aggregation()?.isTree) {\r\n  <div class=\"p-2 text-sm text-red-500\">\r\n    <triangle-alert-icon class=\"mr-1\" />\r\n    The aggregationTree component does not support list aggregations. Please use\r\n    the &lt;Aggregation /&gt; component instead.\r\n  </div>\r\n}\r\n<aggregation-panel\r\n  [id]=\"id()\"\r\n  [collapsible]=\"collapsible()\"\r\n  [collapsed]=\"collapsed()\"\r\n  [isEmpty]=\"isEmpty()\"\r\n  [isDate]=\"isDate()\"\r\n  [aggregation]=\"aggregation()\"\r\n  [showFiltersCount]=\"showFiltersCount()\"\r\n  [filtersCount]=\"filtersCount()\"\r\n  [hasFilters]=\"hasFilters()\"\r\n  [selection]=\"selection()\"\r\n  [isAllSelected]=\"isAllSelected()\"\r\n  [(searchText)]=\"searchText\"\r\n  [itemsLength]=\"items().length\"\r\n  [hasMore]=\"aggregation()?.$hasMore ?? false\"\r\n  [searchedItemsLength]=\"searchedItems().length\"\r\n  (cleared)=\"clear()\"\r\n  (applied)=\"apply()\"\r\n  (allSelected)=\"selectAll()\"\r\n  (allUnselected)=\"unselectAll()\"\r\n  (loadedMore)=\"loadMore()\">\r\n  <div\r\n    #scrollElement\r\n    class=\"max-h-(--scroll-height,20rem) w-full scrollbar-thin overflow-auto\">\r\n    <div\r\n      class=\"relative w-full\"\r\n      [style.height]=\"virtualizer.getTotalSize() + 'px'\"\r\n      role=\"tree\"\r\n      [attr.aria-label]=\"aggregation()?.display | syslang | transloco\">\r\n      <div\r\n        class=\"absolute top-0 left-0 w-full\"\r\n        [style.transform]=\"\r\n          'translateY(' +\r\n          (virtualizer.getVirtualItems()[0]\r\n            ? virtualizer.getVirtualItems()[0].start\r\n            : 0) +\r\n          'px)'\r\n        \">\r\n        @for (vItem of virtualizer.getVirtualItems(); track vItem.index) {\r\n          @let item = items()[vItem.index];\r\n          <div #virtualItem [attr.data-index]=\"vItem.index\">\r\n            <ng-container\r\n              [ngTemplateOutlet]=\"treeItemTpl\"\r\n              [ngTemplateOutletContext]=\"{\r\n                node: item,\r\n                path: [],\r\n                field: aggregation()?.column,\r\n                tpl: treeItemTpl,\r\n                parent: null\r\n              }\">\r\n            </ng-container>\r\n          </div>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</aggregation-panel>\r\n\r\n<ng-template\r\n  #treeItemTpl\r\n  let-node=\"node\"\r\n  let-path=\"path\"\r\n  let-field=\"field\"\r\n  let-tpl=\"tpl\"\r\n  let-parent=\"parent\">\r\n  <div\r\n    role=\"treeitem\"\r\n    [style.--level]=\"treeItemLevel(node)\"\r\n    [attr.aria-selected]=\"node.$selected ?? false\"\r\n    [attr.aria-expanded]=\"\r\n      node.hasChildren !== false ? (node.$opened ?? false) : null\r\n    \"\r\n    [attr.aria-disabled]=\"node.count === 0 ? 'true' : null\"\r\n    [attr.disabled]=\"node.count === 0 ? 'disabled' : null\">\r\n    <a\r\n      [attr.aria-label]=\"treeItemName(node) | syslang\"\r\n      [class]=\"\r\n        cn(\r\n          'flex grow items-center gap-2 p-1 leading-7',\r\n          node.count === 0 && 'disabled pointer-events-none',\r\n          (node.$selected || node.$selectedVisually) && ''\r\n        )\r\n      \"\r\n      (click)=\"selectTreeItem(node, parent, $event, true)\">\r\n      <button\r\n        variant=\"none\"\r\n        [iconOnly]=\"true\"\r\n        (click)=\"toggleTreeNode($event, node)\"\r\n        class=\"transition-transform ease-in hover:scale-125\"\r\n        aria-label=\"Open\">\r\n        <ChevronRight\r\n          [class]=\"\r\n            cn(\r\n              'size-4 translate-x-1',\r\n              node.$opened && 'rotate-90',\r\n              !node.hasChildren && 'hidden'\r\n            )\r\n          \"\r\n          width=\"16\"\r\n          height=\"16\" />\r\n      </button>\r\n      @if (showCheckbox()) {\r\n        <input\r\n          type=\"checkbox\"\r\n          role=\"checkbox\"\r\n          value=\"{{ node.value }}\"\r\n          [attr.disabled]=\"node.count === 0 ? true : null\"\r\n          [attr.aria-disabled]=\"node.count === 0\"\r\n          (keydown.enter)=\"selectTreeItem(node, parent, $event)\"\r\n          [checked]=\"node.$selected || node.$selectedVisually\" />\r\n      }\r\n      @if (resolvedItemTemplate(); as tpl) {\r\n        <ng-container\r\n          [ngTemplateOutlet]=\"tpl\"\r\n          [ngTemplateOutletContext]=\"{\r\n            $implicit: node,\r\n            field: field,\r\n            selected: node.$selected || node.$selectedVisually || false,\r\n            count: node.count,\r\n            name: (treeItemName(node) | syslang) ?? '',\r\n            searchText: searchText(),\r\n            level: treeItemLevel(node),\r\n            expanded: node.$opened ?? false,\r\n            hasChildren: node.hasChildren ?? false\r\n          }\" />\r\n      } @else {\r\n        @let icon = node.icon;\r\n        @if (icon) {\r\n          <FaIcon [faClass]=\"icon\" class=\"self-center justify-self-center\" />\r\n        }\r\n        <span\r\n          [class]=\"\r\n            cn(\r\n              'line-clamp-1 break-all text-ellipsis',\r\n              quickFilter() && 'hover:underline'\r\n            )\r\n          \"\r\n          [title]=\"\r\n            quickFilter()\r\n              ? ((isTreeItemFiltered(node, field)\r\n                  ? 'filters.removeFilter'\r\n                  : 'filters.addFilter'\r\n                ) | transloco) +\r\n                ': ' +\r\n                (treeItemName(node) | syslang)\r\n              : (treeItemName(node) | syslang)\r\n          \"\r\n          (click)=\"onTreeItemTextClick(node, parent, $event)\">\r\n          @for (\r\n            chunk of (treeItemName(node) | syslang) ?? \"\"\r\n              | highlightWord: searchText() : 10;\r\n            track $index\r\n          ) {\r\n            <span [class]=\"{ 'font-bold': chunk.match }\" aria-hidden=\"true\">{{\r\n              chunk.text\r\n            }}</span>\r\n          }\r\n        </span>\r\n        @if (showCount() && node.count > 0) {\r\n          <span class=\"ml-auto px-1 text-xs empty:hidden\" aria-hidden=\"true\">{{\r\n            node.count\r\n          }}</span>\r\n        }\r\n      }\r\n    </a>\r\n    @if (node.hasChildren && node.$opened) {\r\n      <div role=\"group\">\r\n        @for (child of node.items; track $index) {\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"tpl\"\r\n            [ngTemplateOutletContext]=\"{\r\n              node: child,\r\n              path: treeChildrenPath(node, path),\r\n              field: field,\r\n              tpl: tpl,\r\n              parent: node\r\n            }\">\r\n          </ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["div[role=treeitem]:has(+div[role=treeitem]){margin-bottom:var(--agg-item-gap, 0)}div[role=treeitem]{display:block;-webkit-user-select:none;user-select:none}div[role=treeitem] a{padding-left:calc(var(--agg-tree-indent, .5rem) * var(--level, 0));line-height:var(--agg-item-height, inherit)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: ButtonComponent, selector: "button", inputs: ["class", "variant", "decoration", "scheme", "iconOnly", "size", "solid"] }, { kind: "component", type: ChevronRightIcon, selector: "chevron-right, ChevronRight, chevronright, ChevronRightIcon, chevron-right-icon, chevronrighticon", inputs: ["class"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon, FaIcon", inputs: ["faClass", "class"] }, { kind: "component", type: TriangleAlertIcon, selector: "triangle-alert-icon, TriangleAlertIcon", inputs: ["class"] }, { kind: "component", type: AggregationPanelComponent, selector: "AggregationPanel, aggregation-panel", inputs: ["id", "collapsible", "collapsed", "isDate", "isEmpty", "aggregation", "showFiltersCount", "filtersCount", "hasFilters", "selection", "isAllSelected", "searchText", "itemsLength", "hasMore", "searchedItemsLength"], outputs: ["searchTextChange", "cleared", "applied", "allSelected", "allUnselected", "loadedMore"] }, { kind: "pipe", type: SyslangPipe, name: "syslang" }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "pipe", type: HighlightWordPipe, name: "highlightWord" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AggregationTreeComponent, isStandalone: true, selector: "AggregationTree, aggregation-tree, aggregationtree", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: true, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, showFiltersCount: { classPropertyName: "showFiltersCount", publicName: "showFiltersCount", isSignal: true, isRequired: false, transformFunction: null }, showCheckbox: { classPropertyName: "showCheckbox", publicName: "showCheckbox", isSignal: true, isRequired: false, transformFunction: null }, expandedLevel: { classPropertyName: "expandedLevel", publicName: "expandedLevel", isSignal: true, isRequired: false, transformFunction: null }, syncUrl: { classPropertyName: "syncUrl", publicName: "syncUrl", isSignal: true, isRequired: false, transformFunction: null }, controlledQuery: { classPropertyName: "controlledQuery", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, controlledAggregation: { classPropertyName: "controlledAggregation", publicName: "aggregation", isSignal: true, isRequired: false, transformFunction: null }, controlledSelection: { classPropertyName: "controlledSelection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, itemTemplateInput: { classPropertyName: "itemTemplateInput", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null }, searchText: { classPropertyName: "searchText", publicName: "searchText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelect: "onSelect", onApply: "onApply", onClear: "onClear", selectionChange: "selectionChange", filtersChange: "filtersChange", searchText: "searchTextChange" }, host: { properties: { "class": "cn(\"block h-[inherit] max-h-[inherit] w-[inherit]\", class())" } }, queries: [{ propertyName: "itemDirective", first: true, predicate: AggregationItemDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "virtualItems", predicate: ["virtualItem"], descendants: true, isSignal: true }, { propertyName: "scrollElement", first: true, predicate: ["scrollElement"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (!aggregation()?.isTree) {\r\n  <div class=\"p-2 text-sm text-red-500\">\r\n    <triangle-alert-icon class=\"mr-1\" />\r\n    The aggregationTree component does not support list aggregations. Please use\r\n    the &lt;Aggregation /&gt; component instead.\r\n  </div>\r\n}\r\n<aggregation-panel\r\n  [id]=\"id()\"\r\n  [collapsible]=\"collapsible()\"\r\n  [collapsed]=\"collapsed()\"\r\n  [isEmpty]=\"isEmpty()\"\r\n  [isDate]=\"isDate()\"\r\n  [aggregation]=\"aggregation()\"\r\n  [showFiltersCount]=\"showFiltersCount()\"\r\n  [filtersCount]=\"filtersCount()\"\r\n  [hasFilters]=\"hasFilters()\"\r\n  [selection]=\"selection()\"\r\n  [isAllSelected]=\"isAllSelected()\"\r\n  [(searchText)]=\"searchText\"\r\n  [itemsLength]=\"items().length\"\r\n  [hasMore]=\"aggregation()?.$hasMore ?? false\"\r\n  [searchedItemsLength]=\"searchedItems().length\"\r\n  (cleared)=\"clear()\"\r\n  (applied)=\"apply()\"\r\n  (allSelected)=\"selectAll()\"\r\n  (allUnselected)=\"unselectAll()\"\r\n  (loadedMore)=\"loadMore()\">\r\n  <div\r\n    #scrollElement\r\n    class=\"max-h-(--scroll-height,20rem) w-full scrollbar-thin overflow-auto\">\r\n    <div\r\n      class=\"relative w-full\"\r\n      [style.height]=\"virtualizer.getTotalSize() + 'px'\"\r\n      role=\"tree\"\r\n      [attr.aria-label]=\"aggregation()?.display | syslang | transloco\">\r\n      <div\r\n        class=\"absolute top-0 left-0 w-full\"\r\n        [style.transform]=\"\r\n          'translateY(' +\r\n          (virtualizer.getVirtualItems()[0]\r\n            ? virtualizer.getVirtualItems()[0].start\r\n            : 0) +\r\n          'px)'\r\n        \">\r\n        @for (vItem of virtualizer.getVirtualItems(); track vItem.index) {\r\n          @let item = items()[vItem.index];\r\n          <div #virtualItem [attr.data-index]=\"vItem.index\">\r\n            <ng-container\r\n              [ngTemplateOutlet]=\"treeItemTpl\"\r\n              [ngTemplateOutletContext]=\"{\r\n                node: item,\r\n                path: [],\r\n                field: aggregation()?.column,\r\n                tpl: treeItemTpl,\r\n                parent: null\r\n              }\">\r\n            </ng-container>\r\n          </div>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</aggregation-panel>\r\n\r\n<ng-template\r\n  #treeItemTpl\r\n  let-node=\"node\"\r\n  let-path=\"path\"\r\n  let-field=\"field\"\r\n  let-tpl=\"tpl\"\r\n  let-parent=\"parent\">\r\n  <div\r\n    role=\"treeitem\"\r\n    [style.--level]=\"treeItemLevel(node)\"\r\n    [attr.aria-selected]=\"node.$selected ?? false\"\r\n    [attr.aria-expanded]=\"\r\n      node.hasChildren !== false ? (node.$opened ?? false) : null\r\n    \"\r\n    [attr.aria-disabled]=\"node.count === 0 ? 'true' : null\"\r\n    [attr.disabled]=\"node.count === 0 ? 'disabled' : null\">\r\n    <a\r\n      [attr.aria-label]=\"treeItemName(node) | syslang\"\r\n      [class]=\"\r\n        cn(\r\n          'flex grow items-center gap-2 p-1 leading-7',\r\n          node.count === 0 && 'disabled pointer-events-none',\r\n          (node.$selected || node.$selectedVisually) && ''\r\n        )\r\n      \"\r\n      (click)=\"selectTreeItem(node, parent, $event, true)\">\r\n      <button\r\n        variant=\"none\"\r\n        [iconOnly]=\"true\"\r\n        (click)=\"toggleTreeNode($event, node)\"\r\n        class=\"transition-transform ease-in hover:scale-125\"\r\n        aria-label=\"Open\">\r\n        <ChevronRight\r\n          [class]=\"\r\n            cn(\r\n              'size-4 translate-x-1',\r\n              node.$opened && 'rotate-90',\r\n              !node.hasChildren && 'hidden'\r\n            )\r\n          \"\r\n          width=\"16\"\r\n          height=\"16\" />\r\n      </button>\r\n      @if (showCheckbox()) {\r\n        <input\r\n          type=\"checkbox\"\r\n          role=\"checkbox\"\r\n          value=\"{{ node.value }}\"\r\n          [attr.disabled]=\"node.count === 0 ? true : null\"\r\n          [attr.aria-disabled]=\"node.count === 0\"\r\n          (keydown.enter)=\"selectTreeItem(node, parent, $event, true)\"\r\n          [checked]=\"node.$selected || node.$selectedVisually\" />\r\n      }\r\n      @if (resolvedItemTemplate(); as tpl) {\r\n        <ng-container\r\n          [ngTemplateOutlet]=\"tpl\"\r\n          [ngTemplateOutletContext]=\"{\r\n            $implicit: node,\r\n            field: field,\r\n            selected: node.$selected || node.$selectedVisually || false,\r\n            count: node.count,\r\n            name: (treeItemName(node) | syslang) ?? '',\r\n            searchText: searchText(),\r\n            level: treeItemLevel(node),\r\n            expanded: node.$opened ?? false,\r\n            hasChildren: node.hasChildren ?? false\r\n          }\" />\r\n      } @else {\r\n        @let icon = node.icon;\r\n        @if (icon) {\r\n          <FaIcon [faClass]=\"icon\" class=\"self-center justify-self-center\" />\r\n        }\r\n        <span\r\n          [class]=\"\r\n            cn(\r\n              'line-clamp-1 break-all text-ellipsis',\r\n              quickFilter() && 'hover:underline'\r\n            )\r\n          \"\r\n          [title]=\"\r\n            quickFilter()\r\n              ? ((isTreeItemFiltered(node, field)\r\n                  ? 'filters.removeFilter'\r\n                  : 'filters.addFilter'\r\n                ) | transloco) +\r\n                ': ' +\r\n                (treeItemName(node) | syslang)\r\n              : (treeItemName(node) | syslang)\r\n          \"\r\n          (click)=\"onTreeItemTextClick(node, parent, $event)\">\r\n          @for (\r\n            chunk of (treeItemName(node) | syslang) ?? \"\"\r\n              | highlightWord: searchText() : 10;\r\n            track $index\r\n          ) {\r\n            <span [class]=\"{ 'font-bold': chunk.match }\" aria-hidden=\"true\">{{\r\n              chunk.text\r\n            }}</span>\r\n          }\r\n        </span>\r\n        @if (showCount() && node.count > 0) {\r\n          <span class=\"ml-auto px-1 text-xs empty:hidden\" aria-hidden=\"true\">{{\r\n            node.count\r\n          }}</span>\r\n        }\r\n      }\r\n    </a>\r\n    @if (node.hasChildren && node.$opened) {\r\n      <div role=\"group\">\r\n        @for (child of node.items; track $index) {\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"tpl\"\r\n            [ngTemplateOutletContext]=\"{\r\n              node: child,\r\n              path: treeChildrenPath(node, path),\r\n              field: field,\r\n              tpl: tpl,\r\n              parent: node\r\n            }\">\r\n          </ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["div[role=treeitem]:has(+div[role=treeitem]){margin-bottom:var(--agg-item-gap, 0)}div[role=treeitem]{display:block;-webkit-user-select:none;user-select:none}div[role=treeitem] a{padding-left:calc(var(--agg-tree-indent, .5rem) * var(--level, 0));line-height:var(--agg-item-height, inherit)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: ButtonComponent, selector: "button", inputs: ["class", "variant", "decoration", "scheme", "iconOnly", "size", "solid"] }, { kind: "component", type: ChevronRightIcon, selector: "chevron-right, ChevronRight, chevronright, ChevronRightIcon, chevron-right-icon, chevronrighticon", inputs: ["class"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon, FaIcon", inputs: ["faClass", "class"] }, { kind: "component", type: TriangleAlertIcon, selector: "triangle-alert-icon, TriangleAlertIcon", inputs: ["class"] }, { kind: "component", type: AggregationPanelComponent, selector: "AggregationPanel, aggregation-panel", inputs: ["id", "collapsible", "collapsed", "isDate", "isEmpty", "aggregation", "showFiltersCount", "filtersCount", "hasFilters", "selection", "isAllSelected", "searchText", "itemsLength", "hasMore", "searchedItemsLength"], outputs: ["searchTextChange", "cleared", "applied", "allSelected", "allUnselected", "loadedMore"] }, { kind: "pipe", type: SyslangPipe, name: "syslang" }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "pipe", type: HighlightWordPipe, name: "highlightWord" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AggregationTreeComponent, decorators: [{
             type: Component,
@@ -14711,7 +14757,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         AggregationPanelComponent,
                     ], standalone: true, host: {
                         "[class]": 'cn("block h-[inherit] max-h-[inherit] w-[inherit]", class())',
-                    }, template: "@if (!aggregation()?.isTree) {\r\n  <div class=\"p-2 text-sm text-red-500\">\r\n    <triangle-alert-icon class=\"mr-1\" />\r\n    The aggregationTree component does not support list aggregations. Please use\r\n    the &lt;Aggregation /&gt; component instead.\r\n  </div>\r\n}\r\n<aggregation-panel\r\n  [id]=\"id()\"\r\n  [collapsible]=\"collapsible()\"\r\n  [collapsed]=\"collapsed()\"\r\n  [isEmpty]=\"isEmpty()\"\r\n  [isDate]=\"isDate()\"\r\n  [aggregation]=\"aggregation()\"\r\n  [showFiltersCount]=\"showFiltersCount()\"\r\n  [filtersCount]=\"filtersCount()\"\r\n  [hasFilters]=\"hasFilters()\"\r\n  [selection]=\"selection()\"\r\n  [isAllSelected]=\"isAllSelected()\"\r\n  [(searchText)]=\"searchText\"\r\n  [itemsLength]=\"items().length\"\r\n  [hasMore]=\"aggregation()?.$hasMore ?? false\"\r\n  [searchedItemsLength]=\"searchedItems().length\"\r\n  (cleared)=\"clear()\"\r\n  (applied)=\"apply()\"\r\n  (allSelected)=\"selectAll()\"\r\n  (allUnselected)=\"unselectAll()\"\r\n  (loadedMore)=\"loadMore()\">\r\n  <div\r\n    #scrollElement\r\n    class=\"max-h-(--scroll-height,20rem) w-full scrollbar-thin overflow-auto\">\r\n    <div\r\n      class=\"relative w-full\"\r\n      [style.height]=\"virtualizer.getTotalSize() + 'px'\"\r\n      role=\"tree\"\r\n      [attr.aria-label]=\"aggregation()?.display | syslang | transloco\">\r\n      <div\r\n        class=\"absolute top-0 left-0 w-full\"\r\n        [style.transform]=\"\r\n          'translateY(' +\r\n          (virtualizer.getVirtualItems()[0]\r\n            ? virtualizer.getVirtualItems()[0].start\r\n            : 0) +\r\n          'px)'\r\n        \">\r\n        @for (vItem of virtualizer.getVirtualItems(); track vItem.index) {\r\n          @let item = items()[vItem.index];\r\n          <div #virtualItem [attr.data-index]=\"vItem.index\">\r\n            <ng-container\r\n              [ngTemplateOutlet]=\"treeItemTpl\"\r\n              [ngTemplateOutletContext]=\"{\r\n                node: item,\r\n                path: [],\r\n                field: aggregation()?.column,\r\n                tpl: treeItemTpl,\r\n                parent: null\r\n              }\">\r\n            </ng-container>\r\n          </div>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</aggregation-panel>\r\n\r\n<ng-template\r\n  #treeItemTpl\r\n  let-node=\"node\"\r\n  let-path=\"path\"\r\n  let-field=\"field\"\r\n  let-tpl=\"tpl\"\r\n  let-parent=\"parent\">\r\n  <div\r\n    role=\"treeitem\"\r\n    [style.--level]=\"treeItemLevel(node)\"\r\n    [attr.aria-selected]=\"node.$selected ?? false\"\r\n    [attr.aria-expanded]=\"\r\n      node.hasChildren !== false ? (node.$opened ?? false) : null\r\n    \"\r\n    [attr.aria-disabled]=\"node.count === 0 ? 'true' : null\"\r\n    [attr.disabled]=\"node.count === 0 ? 'disabled' : null\">\r\n    <a\r\n      [attr.aria-label]=\"treeItemName(node) | syslang\"\r\n      [class]=\"\r\n        cn(\r\n          'flex grow items-center gap-2 p-1 leading-7',\r\n          node.count === 0 && 'disabled pointer-events-none',\r\n          (node.$selected || node.$selectedVisually) && ''\r\n        )\r\n      \"\r\n      (click)=\"selectTreeItem(node, parent, $event, true)\">\r\n      <button\r\n        variant=\"none\"\r\n        [iconOnly]=\"true\"\r\n        (click)=\"toggleTreeNode($event, node)\"\r\n        class=\"transition-transform ease-in hover:scale-125\"\r\n        aria-label=\"Open\">\r\n        <ChevronRight\r\n          [class]=\"\r\n            cn(\r\n              'size-4 translate-x-1',\r\n              node.$opened && 'rotate-90',\r\n              !node.hasChildren && 'hidden'\r\n            )\r\n          \"\r\n          width=\"16\"\r\n          height=\"16\" />\r\n      </button>\r\n      @if (showCheckbox()) {\r\n        <input\r\n          type=\"checkbox\"\r\n          role=\"checkbox\"\r\n          value=\"{{ node.value }}\"\r\n          [attr.disabled]=\"node.count === 0 ? true : null\"\r\n          [attr.aria-disabled]=\"node.count === 0\"\r\n          (keydown.enter)=\"selectTreeItem(node, parent, $event)\"\r\n          [checked]=\"node.$selected || node.$selectedVisually\" />\r\n      }\r\n      @if (resolvedItemTemplate(); as tpl) {\r\n        <ng-container\r\n          [ngTemplateOutlet]=\"tpl\"\r\n          [ngTemplateOutletContext]=\"{\r\n            $implicit: node,\r\n            field: field,\r\n            selected: node.$selected || node.$selectedVisually || false,\r\n            count: node.count,\r\n            name: (treeItemName(node) | syslang) ?? '',\r\n            searchText: searchText(),\r\n            level: treeItemLevel(node),\r\n            expanded: node.$opened ?? false,\r\n            hasChildren: node.hasChildren ?? false\r\n          }\" />\r\n      } @else {\r\n        @let icon = node.icon;\r\n        @if (icon) {\r\n          <FaIcon [faClass]=\"icon\" class=\"self-center justify-self-center\" />\r\n        }\r\n        <span\r\n          [class]=\"\r\n            cn(\r\n              'line-clamp-1 break-all text-ellipsis',\r\n              quickFilter() && 'hover:underline'\r\n            )\r\n          \"\r\n          [title]=\"\r\n            quickFilter()\r\n              ? ((isTreeItemFiltered(node, field)\r\n                  ? 'filters.removeFilter'\r\n                  : 'filters.addFilter'\r\n                ) | transloco) +\r\n                ': ' +\r\n                (treeItemName(node) | syslang)\r\n              : (treeItemName(node) | syslang)\r\n          \"\r\n          (click)=\"onTreeItemTextClick(node, parent, $event)\">\r\n          @for (\r\n            chunk of (treeItemName(node) | syslang) ?? \"\"\r\n              | highlightWord: searchText() : 10;\r\n            track $index\r\n          ) {\r\n            <span [class]=\"{ 'font-bold': chunk.match }\" aria-hidden=\"true\">{{\r\n              chunk.text\r\n            }}</span>\r\n          }\r\n        </span>\r\n        @if (showCount() && node.count > 0) {\r\n          <span class=\"ml-auto px-1 text-xs empty:hidden\" aria-hidden=\"true\">{{\r\n            node.count\r\n          }}</span>\r\n        }\r\n      }\r\n    </a>\r\n    @if (node.hasChildren && node.$opened) {\r\n      <div role=\"group\">\r\n        @for (child of node.items; track $index) {\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"tpl\"\r\n            [ngTemplateOutletContext]=\"{\r\n              node: child,\r\n              path: treeChildrenPath(node, path),\r\n              field: field,\r\n              tpl: tpl,\r\n              parent: node\r\n            }\">\r\n          </ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["div[role=treeitem]:has(+div[role=treeitem]){margin-bottom:var(--agg-item-gap, 0)}div[role=treeitem]{display:block;-webkit-user-select:none;user-select:none}div[role=treeitem] a{padding-left:calc(var(--agg-tree-indent, .5rem) * var(--level, 0));line-height:var(--agg-item-height, inherit)}\n"] }]
+                    }, template: "@if (!aggregation()?.isTree) {\r\n  <div class=\"p-2 text-sm text-red-500\">\r\n    <triangle-alert-icon class=\"mr-1\" />\r\n    The aggregationTree component does not support list aggregations. Please use\r\n    the &lt;Aggregation /&gt; component instead.\r\n  </div>\r\n}\r\n<aggregation-panel\r\n  [id]=\"id()\"\r\n  [collapsible]=\"collapsible()\"\r\n  [collapsed]=\"collapsed()\"\r\n  [isEmpty]=\"isEmpty()\"\r\n  [isDate]=\"isDate()\"\r\n  [aggregation]=\"aggregation()\"\r\n  [showFiltersCount]=\"showFiltersCount()\"\r\n  [filtersCount]=\"filtersCount()\"\r\n  [hasFilters]=\"hasFilters()\"\r\n  [selection]=\"selection()\"\r\n  [isAllSelected]=\"isAllSelected()\"\r\n  [(searchText)]=\"searchText\"\r\n  [itemsLength]=\"items().length\"\r\n  [hasMore]=\"aggregation()?.$hasMore ?? false\"\r\n  [searchedItemsLength]=\"searchedItems().length\"\r\n  (cleared)=\"clear()\"\r\n  (applied)=\"apply()\"\r\n  (allSelected)=\"selectAll()\"\r\n  (allUnselected)=\"unselectAll()\"\r\n  (loadedMore)=\"loadMore()\">\r\n  <div\r\n    #scrollElement\r\n    class=\"max-h-(--scroll-height,20rem) w-full scrollbar-thin overflow-auto\">\r\n    <div\r\n      class=\"relative w-full\"\r\n      [style.height]=\"virtualizer.getTotalSize() + 'px'\"\r\n      role=\"tree\"\r\n      [attr.aria-label]=\"aggregation()?.display | syslang | transloco\">\r\n      <div\r\n        class=\"absolute top-0 left-0 w-full\"\r\n        [style.transform]=\"\r\n          'translateY(' +\r\n          (virtualizer.getVirtualItems()[0]\r\n            ? virtualizer.getVirtualItems()[0].start\r\n            : 0) +\r\n          'px)'\r\n        \">\r\n        @for (vItem of virtualizer.getVirtualItems(); track vItem.index) {\r\n          @let item = items()[vItem.index];\r\n          <div #virtualItem [attr.data-index]=\"vItem.index\">\r\n            <ng-container\r\n              [ngTemplateOutlet]=\"treeItemTpl\"\r\n              [ngTemplateOutletContext]=\"{\r\n                node: item,\r\n                path: [],\r\n                field: aggregation()?.column,\r\n                tpl: treeItemTpl,\r\n                parent: null\r\n              }\">\r\n            </ng-container>\r\n          </div>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</aggregation-panel>\r\n\r\n<ng-template\r\n  #treeItemTpl\r\n  let-node=\"node\"\r\n  let-path=\"path\"\r\n  let-field=\"field\"\r\n  let-tpl=\"tpl\"\r\n  let-parent=\"parent\">\r\n  <div\r\n    role=\"treeitem\"\r\n    [style.--level]=\"treeItemLevel(node)\"\r\n    [attr.aria-selected]=\"node.$selected ?? false\"\r\n    [attr.aria-expanded]=\"\r\n      node.hasChildren !== false ? (node.$opened ?? false) : null\r\n    \"\r\n    [attr.aria-disabled]=\"node.count === 0 ? 'true' : null\"\r\n    [attr.disabled]=\"node.count === 0 ? 'disabled' : null\">\r\n    <a\r\n      [attr.aria-label]=\"treeItemName(node) | syslang\"\r\n      [class]=\"\r\n        cn(\r\n          'flex grow items-center gap-2 p-1 leading-7',\r\n          node.count === 0 && 'disabled pointer-events-none',\r\n          (node.$selected || node.$selectedVisually) && ''\r\n        )\r\n      \"\r\n      (click)=\"selectTreeItem(node, parent, $event, true)\">\r\n      <button\r\n        variant=\"none\"\r\n        [iconOnly]=\"true\"\r\n        (click)=\"toggleTreeNode($event, node)\"\r\n        class=\"transition-transform ease-in hover:scale-125\"\r\n        aria-label=\"Open\">\r\n        <ChevronRight\r\n          [class]=\"\r\n            cn(\r\n              'size-4 translate-x-1',\r\n              node.$opened && 'rotate-90',\r\n              !node.hasChildren && 'hidden'\r\n            )\r\n          \"\r\n          width=\"16\"\r\n          height=\"16\" />\r\n      </button>\r\n      @if (showCheckbox()) {\r\n        <input\r\n          type=\"checkbox\"\r\n          role=\"checkbox\"\r\n          value=\"{{ node.value }}\"\r\n          [attr.disabled]=\"node.count === 0 ? true : null\"\r\n          [attr.aria-disabled]=\"node.count === 0\"\r\n          (keydown.enter)=\"selectTreeItem(node, parent, $event, true)\"\r\n          [checked]=\"node.$selected || node.$selectedVisually\" />\r\n      }\r\n      @if (resolvedItemTemplate(); as tpl) {\r\n        <ng-container\r\n          [ngTemplateOutlet]=\"tpl\"\r\n          [ngTemplateOutletContext]=\"{\r\n            $implicit: node,\r\n            field: field,\r\n            selected: node.$selected || node.$selectedVisually || false,\r\n            count: node.count,\r\n            name: (treeItemName(node) | syslang) ?? '',\r\n            searchText: searchText(),\r\n            level: treeItemLevel(node),\r\n            expanded: node.$opened ?? false,\r\n            hasChildren: node.hasChildren ?? false\r\n          }\" />\r\n      } @else {\r\n        @let icon = node.icon;\r\n        @if (icon) {\r\n          <FaIcon [faClass]=\"icon\" class=\"self-center justify-self-center\" />\r\n        }\r\n        <span\r\n          [class]=\"\r\n            cn(\r\n              'line-clamp-1 break-all text-ellipsis',\r\n              quickFilter() && 'hover:underline'\r\n            )\r\n          \"\r\n          [title]=\"\r\n            quickFilter()\r\n              ? ((isTreeItemFiltered(node, field)\r\n                  ? 'filters.removeFilter'\r\n                  : 'filters.addFilter'\r\n                ) | transloco) +\r\n                ': ' +\r\n                (treeItemName(node) | syslang)\r\n              : (treeItemName(node) | syslang)\r\n          \"\r\n          (click)=\"onTreeItemTextClick(node, parent, $event)\">\r\n          @for (\r\n            chunk of (treeItemName(node) | syslang) ?? \"\"\r\n              | highlightWord: searchText() : 10;\r\n            track $index\r\n          ) {\r\n            <span [class]=\"{ 'font-bold': chunk.match }\" aria-hidden=\"true\">{{\r\n              chunk.text\r\n            }}</span>\r\n          }\r\n        </span>\r\n        @if (showCount() && node.count > 0) {\r\n          <span class=\"ml-auto px-1 text-xs empty:hidden\" aria-hidden=\"true\">{{\r\n            node.count\r\n          }}</span>\r\n        }\r\n      }\r\n    </a>\r\n    @if (node.hasChildren && node.$opened) {\r\n      <div role=\"group\">\r\n        @for (child of node.items; track $index) {\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"tpl\"\r\n            [ngTemplateOutletContext]=\"{\r\n              node: child,\r\n              path: treeChildrenPath(node, path),\r\n              field: field,\r\n              tpl: tpl,\r\n              parent: node\r\n            }\">\r\n          </ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["div[role=treeitem]:has(+div[role=treeitem]){margin-bottom:var(--agg-item-gap, 0)}div[role=treeitem]{display:block;-webkit-user-select:none;user-select:none}div[role=treeitem] a{padding-left:calc(var(--agg-tree-indent, .5rem) * var(--level, 0));line-height:var(--agg-item-height, inherit)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], showFiltersCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFiltersCount", required: false }] }], showCheckbox: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCheckbox", required: false }] }], expandedLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedLevel", required: false }] }], syncUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "syncUrl", required: false }] }], controlledQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }], controlledAggregation: [{ type: i0.Input, args: [{ isSignal: true, alias: "aggregation", required: false }] }], controlledSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], onSelect: [{ type: i0.Output, args: ["onSelect"] }], onApply: [{ type: i0.Output, args: ["onApply"] }], onClear: [{ type: i0.Output, args: ["onClear"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], filtersChange: [{ type: i0.Output, args: ["filtersChange"] }], virtualItems: [{ type: i0.ViewChildren, args: ["virtualItem", { isSignal: true }] }], scrollElement: [{ type: i0.ViewChild, args: ["scrollElement", { isSignal: true }] }], itemDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => AggregationItemDirective), { isSignal: true }] }], itemTemplateInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], searchText: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchText", required: false }] }, { type: i0.Output, args: ["searchTextChange"] }] } });
 
 class AggregationListComponent {
@@ -15392,28 +15438,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
 class AsideFiltersComponent {
     cn = cn;
     class = input(...(ngDevMode ? [undefined, { debugName: "class" }] : []));
-    position = input(...(ngDevMode ? [undefined, { debugName: "position" }] : []));
+    /**
+     * Explicit, developer-defined list of aggregations to display.
+     *
+     * Each entry is an aggregation **name** (preferred) or **column** — e.g.
+     * `['Authors', 'Sources', 'Geo']`. Although typed as `string[]`, this is the list of
+     * aggregations to render, not a list of raw column keys.
+     *
+     * When provided, it fully bypasses the JSON `filters` configuration (neither
+     * `position`, `getAuthorized`, nor the admin `hidden` rule are applied): the listed
+     * aggregations are rendered as-is, in the given order, provided they exist in the
+     * {@link AggregationsStore}. When empty (default), the component falls back to the
+     * JSON-driven behavior (`position: 'left' | 'both'`, excluding `hidden` aggregations).
+     *
+     * Resolution tries by `name` first — the canonical, unambiguous identifier, since a
+     * `column` can be shared by several aggregations with distinct names — then falls back
+     * to the first aggregation matching the given column. Prefer passing names.
+     */
+    aggregations = input([], ...(ngDevMode ? [{ debugName: "aggregations" }] : []));
+    /**
+     * When `true` (default), every section shares the same `id`, producing a native
+     * `<details name>` accordion where a single section is open at a time. When `false`,
+     * each section gets a unique id (based on the aggregation `name`) and expands
+     * independently — closer to a typical SBA v2 "Facets List".
+     */
+    exclusive = input(true, ...(ngDevMode ? [{ debugName: "exclusive", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     appStore = inject(AppStore);
+    aggregationsStore = inject(AggregationsStore);
+    aggregationsService = inject(AggregationsService);
     asideFilters = computed(() => {
-        // `left` filters live only in the drawer, `both` filters live in the drawer and the bar
+        const explicit = this.aggregations();
+        // Explicit developer-defined list → render exactly as passed, bypassing the JSON config.
+        if (explicit.length > 0) {
+            return explicit
+                .map((key) => this.aggregationsStore.getAggregation(key, "name") ?? this.aggregationsStore.getAggregation(key, "column"))
+                .filter((agg) => !!agg)
+                .map((agg) => ({ name: agg.name, column: agg.column }));
+        }
+        // Default JSON-driven behavior:
+        // `left` filters live only in the drawer, `both` filters live in the drawer and the bar.
+        // Admin-hidden aggregations are excluded (the rule lives in the service).
         const asideFilters = this.appStore.filters().filter((f) => f.position === "left" || f.position === "both");
-        return this.appStore.getAuthorized(asideFilters);
+        return this.aggregationsService.rejectHidden(this.appStore.getAuthorized(asideFilters));
     }, ...(ngDevMode ? [{ debugName: "asideFilters" }] : []));
-    /**
-     * Checks if the specified column is a date filter.
-     *
-     * @param column The column name to check.
-     * @returns True if the column is a date filter, false otherwise.
-     */
-    isDate(column) {
-        return this.appStore.isDateColumn(column);
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AsideFiltersComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AsideFiltersComponent, isStandalone: true, selector: "aside-filters, AsideFilters, asidefilters", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cn('flex flex-col gap-2 overflow-auto', class())" } }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AsideFiltersComponent, isStandalone: true, selector: "aside-filters, AsideFilters, asidefilters", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, aggregations: { classPropertyName: "aggregations", publicName: "aggregations", isSignal: true, isRequired: false, transformFunction: null }, exclusive: { classPropertyName: "exclusive", publicName: "exclusive", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cn('flex flex-col gap-2 overflow-auto', class())" } }, ngImport: i0, template: `
   <div class="flex flex-col gap-2">
     @for (agg of asideFilters(); track agg.name) {
       <Aggregation
-        id="aside-filters"
+        [id]="exclusive() ? 'aside-filters' : 'aside-filters-' + agg.name"
         [name]="agg.name"
         [column]="agg.column"
         [collapsible]="true"
@@ -15432,7 +15505,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
   <div class="flex flex-col gap-2">
     @for (agg of asideFilters(); track agg.name) {
       <Aggregation
-        id="aside-filters"
+        [id]="exclusive() ? 'aside-filters' : 'aside-filters-' + agg.name"
         [name]="agg.name"
         [column]="agg.column"
         [collapsible]="true"
@@ -15445,7 +15518,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         "[class]": "cn('flex flex-col gap-2 overflow-auto', class())"
                     }
                 }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }] } });
+        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], aggregations: [{ type: i0.Input, args: [{ isSignal: true, alias: "aggregations", required: false }] }], exclusive: [{ type: i0.Input, args: [{ isSignal: true, alias: "exclusive", required: false }] }] } });
 
 class FilterButtonComponent {
     name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
@@ -15656,92 +15729,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
 const FILTERS_BREAKPOINT = new InjectionToken('FILTERS_BREAKPOINT', { factory: () => 5 });
 
 class MoreComponent {
-    cn = cn;
     count = input(2, ...(ngDevMode ? [{ debugName: "count" }] : []));
     includedFilters = input([], ...(ngDevMode ? [{ debugName: "includedFilters" }] : []));
     excludedFilters = input([], ...(ngDevMode ? [{ debugName: "excludedFilters" }] : []));
     aggregations = input(...(ngDevMode ? [undefined, { debugName: "aggregations" }] : []));
     homepage = input(false, ...(ngDevMode ? [{ debugName: "homepage", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
-    appStore = inject(AppStore);
-    aggregationsStore = inject(AggregationsStore);
-    queryParamsStore = inject(QueryParamsStore);
     aggregationsService = inject(AggregationsService);
     /**
-     * Signal containing an array of extended filter objects.
+     * The overflow filters rendered as accordions: the authorized filters beyond the
+     * first `count` (which are already shown in the bar).
      *
      * @remarks
-     * This signal holds the current state of filters that can be applied to data.
-     * The filters are of type CFilterEx[], which extends the base filter functionality.
-     *
-     */
-    filters = signal([], ...(ngDevMode ? [{ debugName: "filters" }] : []));
-    /**
-     * Computed property that returns an array of filters that are currently visible.
-     * Filters out any filters where the `hidden` property is set to true.
-     *
-     * @returns An array of filters that are not hidden
-     */
-    visibleFilters = computed(() => {
-        const filters = this.filters().filter((f) => !f.hidden);
-        return filters;
-    }, ...(ngDevMode ? [{ debugName: "visibleFilters" }] : []));
-    constructor() {
-        effect(() => {
-            const count = this.count();
-            const authorizedFilters = this.aggregationsService
-                .getAuthorizedFilters(this.aggregations(), this.includedFilters(), this.excludedFilters(), this.homepage())
-                .toSpliced(0, count);
-            const f = authorizedFilters.map((agg) => {
-                const { icon = "far fa-list", hidden = false } = this.appStore.getAggregationCustomization(agg.column, agg.name) || {};
-                return {
-                    name: agg.name,
-                    column: agg.column,
-                    icon,
-                    count: 0,
-                    isTree: false,
-                    disabled: false,
-                    hidden
-                };
-            });
-            this.filters.set(f);
-            this.updateFilters();
-        });
-    }
-    clearFilter(field) {
-        this.queryParamsStore.removeFilter(field);
-    }
-    updateFilters() {
-        this.filters.update((filters) => {
-            return filters.map((filter) => {
-                const agg = this.aggregationsStore.getAggregation(filter.name);
-                const f = this.queryParamsStore.getFilter({ name: agg?.name, field: agg?.column });
-                const count = f?.count || 0;
-                const { display = agg?.isTree ? undefined : filter.display } = this.appStore.getAggregationCustomization(filter.column) || {};
-                return {
-                    ...filter,
-                    name: agg?.name || filter.name,
-                    display,
-                    isTree: agg?.isTree || false,
-                    count,
-                    disabled: !!(!agg?.items || agg.items?.length === 0) // Disable if no items
-                };
-            });
-        });
-    }
-    /**
-     * Checks whether there are active filters for the current aggregation column.
-     *
-     * if True, the clear button is shown.
-     *
-     * @returns {boolean} `true` if the filter count for the aggregation column is greater than 0, otherwise `false`.
+     * Pure display wiring — authorization (and the admin `hidden` rule) is handled by
+     * {@link AggregationsService.getAuthorizedFilters}; `toSpliced` just drops the
+     * filters already shown in the bar.
      */
-    hasFilters(aggregation) {
-        const { count = 0 } = this.queryParamsStore.getFilter({ field: aggregation.column, name: aggregation.name }) || {};
-        return count > 0;
-    }
+    filters = computed(() => this.aggregationsService
+        .getAuthorizedFilters(this.aggregations(), this.includedFilters(), this.excludedFilters(), this.homepage())
+        .toSpliced(0, this.count()), ...(ngDevMode ? [{ debugName: "filters" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: MoreComponent, isStandalone: true, selector: "more, More", inputs: { count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, includedFilters: { classPropertyName: "includedFilters", publicName: "includedFilters", isSignal: true, isRequired: false, transformFunction: null }, excludedFilters: { classPropertyName: "excludedFilters", publicName: "excludedFilters", isSignal: true, isRequired: false, transformFunction: null }, aggregations: { classPropertyName: "aggregations", publicName: "aggregations", isSignal: true, isRequired: false, transformFunction: null }, homepage: { classPropertyName: "homepage", publicName: "homepage", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "divide-y divide-muted-foreground/18" }, ngImport: i0, template: `
-    @for (filter of visibleFilters(); track $index) {
+    @for (filter of filters(); track $index) {
       <Aggregation
         class="w-60 max-w-80 px-1 [--height:15lh]"
         id="more-filters"
@@ -15757,7 +15765,7 @@ class MoreComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: MoreComponent, decorators: [{
             type: Component,
             args: [{ selector: "more, More", standalone: true, imports: [AggregationComponent, TranslocoPipe], template: `
-    @for (filter of visibleFilters(); track $index) {
+    @for (filter of filters(); track $index) {
       <Aggregation
         class="w-60 max-w-80 px-1 [--height:15lh]"
         id="more-filters"
@@ -15771,7 +15779,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
   `, host: {
                         class: "divide-y divide-muted-foreground/18"
                     }, styles: [":host{scrollbar-width:none}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { count: [{ type: i0.Input, args: [{ isSignal: true, alias: "count", required: false }] }], includedFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "includedFilters", required: false }] }], excludedFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "excludedFilters", required: false }] }], aggregations: [{ type: i0.Input, args: [{ isSignal: true, alias: "aggregations", required: false }] }], homepage: [{ type: i0.Input, args: [{ isSignal: true, alias: "homepage", required: false }] }] } });
+        }], propDecorators: { count: [{ type: i0.Input, args: [{ isSignal: true, alias: "count", required: false }] }], includedFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "includedFilters", required: false }] }], excludedFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "excludedFilters", required: false }] }], aggregations: [{ type: i0.Input, args: [{ isSignal: true, alias: "aggregations", required: false }] }], homepage: [{ type: i0.Input, args: [{ isSignal: true, alias: "homepage", required: false }] }] } });
 
 class MoreButtonComponent {
     appStore = inject(AppStore);