ng-hub-ui-paginable 22.1.2 → 22.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3069,7 +3069,7 @@ class ListComponent {
3069
3069
  useExisting: ListComponent,
3070
3070
  multi: true
3071
3071
  }
3072
- ], queries: [{ propertyName: "itemTpt", first: true, predicate: PaginableListItemDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "noResultsTpt", first: true, predicate: PaginableNoResultsDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "loadingTpt", first: true, predicate: PaginableLoadingDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "errorTpt", first: true, predicate: PaginableErrorDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "placeholderTpt", first: true, predicate: HubListDragPlaceholderDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "previewTpt", first: true, predicate: HubListDragPreviewDirective, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "@if (batchActions.length || options.searchable) {\n\t<div class=\"hub-list__top-bar\">\n\t\t@if (batchActions.length) {\n\t\t\t<div class=\"hub-list__batch-actions\">\n\t\t\t\t@for (action of batchActions; track $index) {\n\t\t\t\t\t@if (!$any(action).buttons?.length) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-list__batch-action-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(action)\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(action)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (action.icon) {\n\t\t\t\t\t\t\t\t<i class=\"{{ action.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{{ action.title }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (options.searchable) {\n\t\t\t<div class=\"hub-list__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n@if (loading()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (error()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t[context]=\"{ error: error() }\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (!getVisibleItems(items, true).length) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--empty\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else {\n\t<ng-container\n\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t[ngTemplateOutletContext]=\"{\n\t\t\tcontrols: getVisibleControls(form.controls, true),\n\t\t\tcontrolsForm: form,\n\t\t\titemsFull: items,\n\t\t\titems: getVisibleItems(items, true),\n\t\t\tparentItem: null,\n\t\t\tisRoot: true,\n\t\t\tdepth: 0\n\t\t}\"\n\t></ng-container>\n}\n\n<ng-template\n\t#containerTpt\n\tlet-controls=\"controls\"\n\tlet-controlsForm=\"controlsForm\"\n\tlet-itemsFull=\"itemsFull\"\n\tlet-isRoot=\"isRoot\"\n\tlet-items=\"items\"\n\tlet-parentItem=\"parentItem\"\n\tlet-depth=\"depth\"\n>\n\t@let containerRef = makeContainerRef(controlsForm, itemsFull, parentItem, depth);\n\t<ul\n\t\tclass=\"hub-list__items\"\n\t\t[class.hub-list__items--root]=\"isRoot\"\n\t\t[class.hub-list__items--cards]=\"isRoot && isCardsDisplay()\"\n\t\t[attr.data-hub-container-key]=\"containerRef.key\"\n\t\t(dragover)=\"onContainerDragOver($event, containerRef)\"\n\t\t(drop)=\"onContainerDrop($event)\"\n\t>\n\t\t@for (formGroup of controls; track getTrackKey(formGroup.get('data')?.value, $index); let index = $index) {\n\t\t\t@let absIndex = absoluteIndex(index, isRoot);\n\t\t\t@if (sortable() && showPlaceholderBefore(controlsForm, absIndex)) {\n\t\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t\t></ng-container>\n\t\t\t\t</li>\n\t\t\t}\n\t\t\t<li\n\t\t\t\tclass=\"hub-list__item\"\n\t\t\t\t[ngClass]=\"_getRowClass(items[index])\"\n\t\t\t\t[class.hub-list__item--clickable]=\"clickFn()\"\n\t\t\t\t[class.hub-list__item--selected]=\"formGroup.get('selected')?.value\"\n\t\t\t\t[class.hub-list__item--dragging]=\"isRowDragging(items[index])\"\n\t\t\t\t[class.hub-list__item--drag-disabled]=\"sortable() && isRowDisabled(items[index])\"\n\t\t\t\t[attr.draggable]=\"isDragEnabled(items[index]) ? true : null\"\n\t\t\t\t[attr.data-hub-index]=\"absIndex\"\n\t\t\t\t[attr.tabindex]=\"keyboardSortable() && isDragEnabled(items[index]) ? 0 : null\"\n\t\t\t\t[attr.aria-roledescription]=\"sortable() ? ('DRAG_SORTABLE_ITEM' | translate) : null\"\n\t\t\t\t[attr.aria-grabbed]=\"sortable() ? isRowDragging(items[index]) : null\"\n\t\t\t\t[formGroup]=\"formGroup\"\n\t\t\t\t(click)=\"onItemClick(formGroup.value, depth, index, $event); $event.preventDefault(); $event.stopPropagation()\"\n\t\t\t\t(dragstart)=\"onDragStart($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(dragenter)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(dragover)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(drop)=\"onDrop($event)\"\n\t\t\t\t(dragend)=\"onDragEnd()\"\n\t\t\t\t(pointerdown)=\"onPointerDown($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(keydown)=\"onItemKeydown($event, containerRef, absIndex, items[index])\"\n\t\t\t>\n\t\t\t\t@if (formGroup.value; as item) {\n\t\t\t\t\t<div class=\"hub-list__item-content\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass=\"hub-list__checkbox\"\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\tformControlName=\"selected\"\n\t\t\t\t\t\t\t\t(change)=\"onSelectionChange()\"\n\t\t\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<div class=\"hub-list__label\">\n\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"itemTpt() || defaultItemtTpt\"\n\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\tdata: items[index],\n\t\t\t\t\t\t\t\t\tdepth,\n\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\tcollapsed: !!formGroup.get('collapsed').value,\n\t\t\t\t\t\t\t\t\tselected: formGroup.get('selected').value\n\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@if (item[bindChildren()]?.length) {\n\t\t\t\t\t\t\t<div class=\"hub-list__actions\">\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tclass=\"hub-list__chevron\"\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\t\t(click)=\"\n\t\t\t\t\t\t\t\t\t\ttoggleCollapsed(formGroup.get('collapsed'));\n\t\t\t\t\t\t\t\t\t\t$event.preventDefault();\n\t\t\t\t\t\t\t\t\t\t$event.stopPropagation()\n\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t[ngClass]=\"\n\t\t\t\t\t\t\t\t\t\t\titem.collapsed ? 'hub-table__icon--chevron-down' : 'hub-table__icon--chevron-up'\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t@if (item[bindChildren()]?.length && !item.collapsed) {\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\tcontrols: formGroup.get('children')?.controls,\n\t\t\t\t\t\t\t\tcontrolsForm: formGroup.get('children'),\n\t\t\t\t\t\t\t\titemsFull: items[index][bindChildren()],\n\t\t\t\t\t\t\t\titems: items[index][bindChildren()],\n\t\t\t\t\t\t\t\tparentItem: items[index],\n\t\t\t\t\t\t\t\tisRoot: false,\n\t\t\t\t\t\t\t\tdepth: depth + 1\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t></ng-container>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</li>\n\t\t}\n\t\t@if (sortable() && showPlaceholderAtEnd(controlsForm, isRoot, controls.length)) {\n\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t<ng-container\n\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t></ng-container>\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n\n@if (sortable() && keyboardSortable()) {\n\t<div class=\"hub-list__sr-only\" role=\"status\" aria-live=\"polite\">\n\t\t@if (announcement(); as message) {\n\t\t\t{{ message.key | translate: message.params }}\n\t\t}\n\t</div>\n}\n\n@if (paginate()) {\n\t<div class=\"hub-list__bottom-bar\">\n\t\t<hub-paginator\n\t\t\tclass=\"hub-list__bottom-bar-paginator\"\n\t\t\t[(page)]=\"page\"\n\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t[rtl]=\"isRtl()\"\n\t\t></hub-paginator>\n\t\t<div class=\"hub-list__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"onPerPageChange($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t<p class=\"hub-list__bottom-bar-info hub-paginator__info\">\n\t\t\t{{\n\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t| translate\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tamount: getVisibleItems(items, true).length,\n\t\t\t\t\t\t\t\ttotal: getEffectiveTotalItems()\n\t\t\t\t\t\t }\n\t\t\t\t\t| ucfirst\n\t\t\t}}\n\t\t</p>\n\t</div>\n}\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-list__no-results\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-list__loading\" role=\"status\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'LOADING' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-list__error text-danger\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'ERROR_OCURRED' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultPlaceholderTpt>\n\t<div class=\"hub-list__placeholder-inner\" aria-hidden=\"true\"></div>\n</ng-template>\n\n<ng-template #defaultItemtTpt let-data=\"data\">\n\t{{ data[bindLabel()] }}\n</ng-template>\n", styles: [":root,:host{--hub-list-checkbox-size: 1rem;--hub-list-chevron-size: var(--hub-ref-icon-size, 1em);--hub-list-bg: transparent;--hub-list-border-radius: var(--hub-ref-radius-md, .375rem);--hub-list-padding-x: var(--hub-ref-space-0, 0);--hub-list-padding-y: var(--hub-ref-space-0, 0);--hub-list-gap: var(--hub-ref-space-4, 1.5rem);--hub-list-items-bg: transparent;--hub-list-items-gap: var(--hub-ref-space-2, .5rem);--hub-list-empty-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-empty-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-empty-color: var(--hub-sys-text-muted, #6c757d);--hub-list-empty-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-empty-padding-y: var(--hub-ref-space-3, 1rem);--hub-list-item-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-item-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-item-border-width: 1px;--hub-list-item-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-item-color: var(--hub-sys-text-primary, #212529);--hub-list-item-gap: var(--hub-ref-space-2, .5rem);--hub-list-item-hover-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-item-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-item-padding-y: var(--hub-ref-space-2, .5rem);--hub-list-children-gap: var(--hub-list-item-padding-y);--hub-list-accent: var(--hub-sys-color-primary, #0d6efd);--hub-list-item-selected-bg: var(--hub-list-accent);--hub-list-item-selected-color: var(--hub-ref-color-white, #fff);--hub-list-cards-min-column-width: 18rem;--hub-list-cards-gap: var(--hub-list-items-gap);--hub-list-cards-columns: auto-fit;--hub-list-cards-row-gap: var(--hub-list-cards-gap);--hub-list-cards-column-gap: var(--hub-list-cards-gap);--hub-list-cards-bg: var(--hub-list-item-bg, transparent);--hub-list-cards-color: var(--hub-list-item-color);--hub-list-cards-padding-x: var(--hub-list-item-padding-x);--hub-list-cards-padding-y: var(--hub-list-item-padding-y);--hub-list-cards-border-color: var(--hub-list-item-border-color);--hub-list-cards-border-width: var(--hub-list-item-border-width, 1px);--hub-list-cards-border-radius: var(--hub-list-item-border-radius);--hub-list-cards-shadow: none;--hub-list-cards-hover-bg: var(--hub-list-item-hover-bg);--hub-list-cards-hover-shadow: var(--hub-list-cards-shadow);--hub-list-cards-transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;--hub-list-top-bar-gap: var(--hub-ref-space-2, .5rem);--hub-list-top-bar-justify-content: end;--hub-list-top-bar-align-items: center;--hub-list-top-bar-wrap: wrap;--hub-list-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-list-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-list-bottom-bar-justify-content: space-around;--hub-list-bottom-bar-align-items: center;--hub-list-bottom-bar-wrap: wrap;--hub-list-bottom-bar-paginator-order: 1;--hub-list-bottom-bar-settings-order: 2;--hub-list-bottom-bar-info-order: 3;--hub-list-bottom-bar-paginator-flex: 0 0 auto;--hub-list-bottom-bar-settings-flex: 0 0 auto;--hub-list-bottom-bar-info-flex: 0 0 auto;--hub-list-search-btn-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-search-btn-color: var(--hub-sys-text-primary, #212529);--hub-list-search-button-min-width: 2.75rem;--hub-list-search-input-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-search-input-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-search-input-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-search-input-color: var(--hub-sys-text-primary, #212529);--hub-list-search-border-color: var(--hub-list-search-input-border-color);--hub-list-search-border-width: 1px;--hub-list-search-border-radius: var(--hub-list-search-input-border-radius);--hub-list-search-input-padding-x: .75rem;--hub-list-search-input-padding-y: .375rem;--hub-list-search-input-font-size: 1rem;--hub-list-action-btn-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-action-btn-color: var(--hub-list-item-color);--hub-list-action-btn-border-color: var(--hub-list-item-border-color);--hub-list-action-btn-border-radius: var(--hub-list-item-border-radius);--hub-list-action-btn-padding-y: .375rem;--hub-list-action-btn-padding-x: .75rem;--hub-list-action-btn-hover-bg: var(--hub-list-item-hover-bg);--hub-list-drag-handle-color: var(--hub-sys-text-muted, #6c757d);--hub-list-drag-handle-cursor: grab;--hub-list-drag-handle-size: var(--hub-ref-icon-size, 1em);--hub-list-item-dragging-opacity: .5;--hub-list-item-dragging-cursor: grabbing;--hub-list-drop-target-outline-color: var(--hub-list-accent);--hub-list-drop-target-outline-width: 2px;--hub-list-placeholder-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-placeholder-border-color: var(--hub-list-accent);--hub-list-placeholder-border-width: 2px;--hub-list-placeholder-border-style: dashed;--hub-list-placeholder-border-radius: var(--hub-list-item-border-radius);--hub-list-placeholder-min-height: 2.5rem;--hub-list-ghost-opacity: .85;--hub-list-ghost-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15)}:host{display:flex;flex-direction:column;gap:var(--hub-list-gap);padding:var(--hub-list-padding-y) var(--hub-list-padding-x);background-color:var(--hub-list-bg);border-radius:var(--hub-list-border-radius)}:host .hub-list__bottom-bar{display:flex;justify-content:var(--hub-list-bottom-bar-justify-content);align-items:var(--hub-list-bottom-bar-align-items);flex-wrap:var(--hub-list-bottom-bar-wrap);gap:var(--hub-list-bottom-bar-gap)}:host .hub-list__bottom-bar-paginator{order:var(--hub-list-bottom-bar-paginator-order);flex:var(--hub-list-bottom-bar-paginator-flex);overflow:auto;margin:0}:host .hub-list__bottom-bar-settings{order:var(--hub-list-bottom-bar-settings-order);flex:var(--hub-list-bottom-bar-settings-flex);margin:0}:host .hub-list__bottom-bar-info{order:var(--hub-list-bottom-bar-info-order);flex:var(--hub-list-bottom-bar-info-flex);margin:0}:host .hub-list__top-bar{display:flex;align-items:var(--hub-list-top-bar-align-items);justify-content:var(--hub-list-top-bar-justify-content);flex-wrap:var(--hub-list-top-bar-wrap);gap:var(--hub-list-top-bar-gap);direction:ltr}:host .hub-list__batch-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-list-batch-actions-gap)}:host .hub-list__batch-action-btn{display:inline-flex;align-items:center;gap:.35rem}:host .hub-list__batch-action-btn--default{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:var(--hub-list-action-btn-padding-y) var(--hub-list-action-btn-padding-x);color:var(--hub-list-action-btn-color);background-color:var(--hub-list-action-btn-bg);border:1px solid var(--hub-list-action-btn-border-color);border-radius:var(--hub-list-action-btn-border-radius);transition:background-color .15s ease-in-out,border-color .15s ease-in-out,color .15s ease-in-out}:host .hub-list__batch-action-btn--default:hover:not(:disabled){background-color:var(--hub-list-action-btn-hover-bg)}:host .hub-list__search{margin-left:auto}:host.hub-list--rtl{direction:rtl}:host.hub-list--rtl .hub-list__items .hub-list__items{padding-left:0;padding-right:var(--hub-list-item-padding-x)}:host.hub-list--rtl .hub-list__search{direction:ltr;order:1;margin-left:0;margin-right:auto}:host.hub-list--rtl .hub-list__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important}:host.hub-list--rtl .hub-list__search-btn{border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}:host.hub-list--rtl .hub-list__batch-actions{order:2;flex-direction:row-reverse;margin-left:auto;margin-right:0}.hub-list__items{display:flex;flex-direction:column;gap:var(--hub-list-items-gap);background-color:var(--hub-list-items-bg);list-style:none;margin:0;padding:0}.hub-list__items .hub-list__items{margin-top:var(--hub-list-children-gap);padding-left:var(--hub-list-item-padding-x);padding-right:0;padding-top:0;padding-bottom:0;border-radius:0}.hub-list__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}.hub-list__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);font-size:var(--hub-list-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);background-color:var(--hub-list-search-input-bg);border-color:var(--hub-list-search-border-color)!important;color:var(--hub-list-search-input-color);border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}.hub-list__search-btn{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-list-search-button-min-width);padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);background-color:var(--hub-list-search-btn-bg)!important;color:var(--hub-list-search-btn-color)!important;border-color:var(--hub-list-search-border-color)!important;border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important;cursor:pointer}.hub-list__search-icon{display:inline-block;width:var(--hub-ref-icon-size, 1em);height:var(--hub-ref-icon-size, 1em);background-color:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}.hub-list__item{display:flex;flex-direction:column;padding:var(--hub-list-item-padding-y) var(--hub-list-item-padding-x);background-color:var(--hub-list-item-bg);color:var(--hub-list-item-color);border-radius:var(--hub-list-item-border-radius);transition:background-color .15s ease-in-out;position:relative;border:var(--hub-list-item-border-width) solid var(--hub-list-item-border-color)}.hub-list__item--clickable{cursor:pointer}.hub-list__item--clickable:hover{background-color:var(--hub-list-item-hover-bg)}.hub-list__item--selected{background-color:var(--hub-list-item-selected-bg)!important;color:var(--hub-list-item-selected-color);border-color:var(--hub-list-item-selected-bg)}.hub-list__item--selected .hub-list__label,.hub-list__item--selected .hub-list__actions button{color:var(--hub-list-item-selected-color)}.hub-list__item--empty{background-color:var(--hub-list-empty-bg);color:var(--hub-list-empty-color);padding:var(--hub-list-empty-padding-y, var(--hub-ref-space-3, 1rem)) var(--hub-list-empty-padding-x, var(--hub-ref-space-3, 1rem));border-color:var(--hub-list-empty-border-color);text-align:center}.hub-list__items--cards{display:grid;grid-template-columns:repeat(var(--hub-list-cards-columns),minmax(min(100%,var(--hub-list-cards-min-column-width)),1fr));gap:var(--hub-list-cards-row-gap) var(--hub-list-cards-column-gap)}.hub-list__items--cards>.hub-list__item{height:100%;background-color:var(--hub-list-cards-bg);color:var(--hub-list-cards-color);padding:var(--hub-list-cards-padding-y) var(--hub-list-cards-padding-x);border:var(--hub-list-cards-border-width) solid var(--hub-list-cards-border-color);border-radius:var(--hub-list-cards-border-radius);box-shadow:var(--hub-list-cards-shadow);transition:var(--hub-list-cards-transition)}.hub-list__items--cards>.hub-list__item.hub-list__item--clickable:hover{background-color:var(--hub-list-cards-hover-bg);box-shadow:var(--hub-list-cards-hover-shadow)}.hub-list__items--cards .hub-list__item-content{align-items:flex-start}.hub-list__items--cards .hub-list__label{overflow:visible;text-overflow:initial;white-space:normal}.hub-list__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.hub-list__item-content{display:flex;justify-content:space-between;align-items:center;gap:var(--hub-list-item-gap);width:100%}.hub-list__checkbox{width:var(--hub-list-checkbox-size);height:var(--hub-list-checkbox-size);flex-shrink:0;cursor:pointer}.hub-list__actions{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__chevron{padding:0;font-size:var(--hub-list-chevron-size);display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer}.hub-list__no-results{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__drag-handle{display:inline-flex;align-items:center;justify-content:center;font-size:var(--hub-list-drag-handle-size);color:var(--hub-list-drag-handle-color);cursor:var(--hub-list-drag-handle-cursor);touch-action:none;-webkit-user-select:none;user-select:none}.hub-list__item--dragging{opacity:var(--hub-list-item-dragging-opacity);cursor:var(--hub-list-item-dragging-cursor)}.hub-list__item--drag-disabled .hub-list__drag-handle{cursor:not-allowed;opacity:.4}.hub-list__placeholder{list-style:none;pointer-events:none;min-height:var(--hub-list-placeholder-min-height);background-color:var(--hub-list-placeholder-bg);border:var(--hub-list-placeholder-border-width) var(--hub-list-placeholder-border-style) var(--hub-list-placeholder-border-color);border-radius:var(--hub-list-placeholder-border-radius)}.hub-list__items--cards>.hub-list__placeholder{height:100%}.hub-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host([data-variant=primary]),.hub-list[data-variant=primary]{--hub-list-accent: var(--hub-sys-color-primary)}:host([data-variant=success]),.hub-list[data-variant=success]{--hub-list-accent: var(--hub-sys-color-success)}:host([data-variant=danger]),.hub-list[data-variant=danger]{--hub-list-accent: var(--hub-sys-color-danger)}:host([data-variant=warning]),.hub-list[data-variant=warning]{--hub-list-accent: var(--hub-sys-color-warning)}:host([data-variant=info]),.hub-list[data-variant=info]{--hub-list-accent: var(--hub-sys-color-info)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PaginatorComponent, selector: "hub-paginator, paginable-table-paginator", inputs: ["rtl", "page", "numberOfPages"], outputs: ["pageChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PaginableStateOutlet, selector: "hub-state-outlet", inputs: ["template", "instanceDefault", "globalDefault", "fallback", "context"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UcfirstPipe, name: "ucfirst" }] });
3072
+ ], queries: [{ propertyName: "itemTpt", first: true, predicate: PaginableListItemDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "noResultsTpt", first: true, predicate: PaginableNoResultsDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "loadingTpt", first: true, predicate: PaginableLoadingDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "errorTpt", first: true, predicate: PaginableErrorDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "placeholderTpt", first: true, predicate: HubListDragPlaceholderDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "previewTpt", first: true, predicate: HubListDragPreviewDirective, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "@if (batchActions.length || options.searchable) {\n\t<div class=\"hub-list__top-bar\">\n\t\t@if (batchActions.length) {\n\t\t\t<div class=\"hub-list__batch-actions\">\n\t\t\t\t@for (action of batchActions; track $index) {\n\t\t\t\t\t@if (!$any(action).buttons?.length) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-list__batch-action-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(action)\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(action)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (action.icon) {\n\t\t\t\t\t\t\t\t<i class=\"{{ action.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{{ action.title }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (options.searchable) {\n\t\t\t<div class=\"hub-list__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n@if (loading()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (error()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t[context]=\"{ error: error() }\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (!getVisibleItems(items, true).length) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--empty\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else {\n\t<ng-container\n\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t[ngTemplateOutletContext]=\"{\n\t\t\tcontrols: getVisibleControls(form.controls, true),\n\t\t\tcontrolsForm: form,\n\t\t\titemsFull: items,\n\t\t\titems: getVisibleItems(items, true),\n\t\t\tparentItem: null,\n\t\t\tisRoot: true,\n\t\t\tdepth: 0\n\t\t}\"\n\t></ng-container>\n}\n\n<ng-template\n\t#containerTpt\n\tlet-controls=\"controls\"\n\tlet-controlsForm=\"controlsForm\"\n\tlet-itemsFull=\"itemsFull\"\n\tlet-isRoot=\"isRoot\"\n\tlet-items=\"items\"\n\tlet-parentItem=\"parentItem\"\n\tlet-depth=\"depth\"\n>\n\t@let containerRef = makeContainerRef(controlsForm, itemsFull, parentItem, depth);\n\t<ul\n\t\tclass=\"hub-list__items\"\n\t\t[class.hub-list__items--root]=\"isRoot\"\n\t\t[class.hub-list__items--cards]=\"isRoot && isCardsDisplay()\"\n\t\t[attr.data-hub-container-key]=\"containerRef.key\"\n\t\t(dragover)=\"onContainerDragOver($event, containerRef)\"\n\t\t(drop)=\"onContainerDrop($event)\"\n\t>\n\t\t@for (formGroup of controls; track getTrackKey(formGroup.get('data')?.value, $index); let index = $index) {\n\t\t\t@let absIndex = absoluteIndex(index, isRoot);\n\t\t\t@if (sortable() && showPlaceholderBefore(controlsForm, absIndex)) {\n\t\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t\t></ng-container>\n\t\t\t\t</li>\n\t\t\t}\n\t\t\t<li\n\t\t\t\tclass=\"hub-list__item\"\n\t\t\t\t[ngClass]=\"_getRowClass(items[index])\"\n\t\t\t\t[class.hub-list__item--clickable]=\"clickFn()\"\n\t\t\t\t[class.hub-list__item--selected]=\"formGroup.get('selected')?.value\"\n\t\t\t\t[class.hub-list__item--dragging]=\"isRowDragging(items[index])\"\n\t\t\t\t[class.hub-list__item--drag-disabled]=\"sortable() && isRowDisabled(items[index])\"\n\t\t\t\t[attr.draggable]=\"isDragEnabled(items[index]) ? true : null\"\n\t\t\t\t[attr.data-hub-index]=\"absIndex\"\n\t\t\t\t[attr.tabindex]=\"keyboardSortable() && isDragEnabled(items[index]) ? 0 : null\"\n\t\t\t\t[attr.aria-roledescription]=\"sortable() ? ('DRAG_SORTABLE_ITEM' | translate) : null\"\n\t\t\t\t[attr.aria-grabbed]=\"sortable() ? isRowDragging(items[index]) : null\"\n\t\t\t\t[formGroup]=\"formGroup\"\n\t\t\t\t(click)=\"onItemClick(formGroup.value, depth, index, $event); $event.preventDefault(); $event.stopPropagation()\"\n\t\t\t\t(dragstart)=\"onDragStart($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(dragenter)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(dragover)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(drop)=\"onDrop($event)\"\n\t\t\t\t(dragend)=\"onDragEnd()\"\n\t\t\t\t(pointerdown)=\"onPointerDown($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(keydown)=\"onItemKeydown($event, containerRef, absIndex, items[index])\"\n\t\t\t>\n\t\t\t\t@if (formGroup.value; as item) {\n\t\t\t\t\t<div class=\"hub-list__item-content\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass=\"hub-list__checkbox\"\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\tformControlName=\"selected\"\n\t\t\t\t\t\t\t\t(change)=\"onSelectionChange()\"\n\t\t\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<div class=\"hub-list__label\">\n\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"itemTpt() || defaultItemtTpt\"\n\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\tdata: items[index],\n\t\t\t\t\t\t\t\t\tdepth,\n\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\tcollapsed: !!formGroup.get('collapsed').value,\n\t\t\t\t\t\t\t\t\tselected: formGroup.get('selected').value\n\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@if (item[bindChildren()]?.length) {\n\t\t\t\t\t\t\t<div class=\"hub-list__actions\">\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tclass=\"hub-list__chevron\"\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\t\t(click)=\"\n\t\t\t\t\t\t\t\t\t\ttoggleCollapsed(formGroup.get('collapsed'));\n\t\t\t\t\t\t\t\t\t\t$event.preventDefault();\n\t\t\t\t\t\t\t\t\t\t$event.stopPropagation()\n\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t[ngClass]=\"\n\t\t\t\t\t\t\t\t\t\t\titem.collapsed ? 'hub-table__icon--chevron-down' : 'hub-table__icon--chevron-up'\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t@if (item[bindChildren()]?.length && !item.collapsed) {\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\tcontrols: formGroup.get('children')?.controls,\n\t\t\t\t\t\t\t\tcontrolsForm: formGroup.get('children'),\n\t\t\t\t\t\t\t\titemsFull: items[index][bindChildren()],\n\t\t\t\t\t\t\t\titems: items[index][bindChildren()],\n\t\t\t\t\t\t\t\tparentItem: items[index],\n\t\t\t\t\t\t\t\tisRoot: false,\n\t\t\t\t\t\t\t\tdepth: depth + 1\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t></ng-container>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</li>\n\t\t}\n\t\t@if (sortable() && showPlaceholderAtEnd(controlsForm, isRoot, controls.length)) {\n\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t<ng-container\n\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t></ng-container>\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n\n@if (sortable() && keyboardSortable()) {\n\t<div class=\"hub-list__sr-only\" role=\"status\" aria-live=\"polite\">\n\t\t@if (announcement(); as message) {\n\t\t\t{{ message.key | translate: message.params }}\n\t\t}\n\t</div>\n}\n\n@if (paginate()) {\n\t<div class=\"hub-list__bottom-bar\">\n\t\t<hub-paginator\n\t\t\tclass=\"hub-list__bottom-bar-paginator\"\n\t\t\t[(page)]=\"page\"\n\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t[rtl]=\"isRtl()\"\n\t\t></hub-paginator>\n\t\t<div class=\"hub-list__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"onPerPageChange($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t<p class=\"hub-list__bottom-bar-info hub-paginator__info\">\n\t\t\t{{\n\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t| translate\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tamount: getVisibleItems(items, true).length,\n\t\t\t\t\t\t\t\ttotal: getEffectiveTotalItems()\n\t\t\t\t\t\t }\n\t\t\t\t\t| ucfirst\n\t\t\t}}\n\t\t</p>\n\t</div>\n}\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-list__no-results\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-list__loading\" role=\"status\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'LOADING' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-list__error text-danger\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'ERROR_OCURRED' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultPlaceholderTpt>\n\t<div class=\"hub-list__placeholder-inner\" aria-hidden=\"true\"></div>\n</ng-template>\n\n<ng-template #defaultItemtTpt let-data=\"data\">\n\t{{ data[bindLabel()] }}\n</ng-template>\n", styles: [":root,:host{--hub-list-checkbox-size: 1rem;--hub-list-chevron-size: var(--hub-ref-icon-size, 1em);--hub-list-bg: transparent;--hub-list-border-radius: var(--hub-ref-radius-md, .375rem);--hub-list-padding-x: var(--hub-ref-space-0, 0);--hub-list-padding-y: var(--hub-ref-space-0, 0);--hub-list-gap: var(--hub-ref-space-4, 1.5rem);--hub-list-items-bg: transparent;--hub-list-items-gap: var(--hub-ref-space-2, .5rem);--hub-list-empty-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-empty-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-empty-color: var(--hub-sys-text-muted, #6c757d);--hub-list-empty-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-empty-padding-y: var(--hub-ref-space-3, 1rem);--hub-list-item-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-item-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-item-border-width: 1px;--hub-list-item-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-item-color: var(--hub-sys-text-primary, #212529);--hub-list-item-gap: var(--hub-ref-space-2, .5rem);--hub-list-item-hover-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-item-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-item-padding-y: var(--hub-ref-space-2, .5rem);--hub-list-children-gap: var(--hub-list-item-padding-y);--hub-list-accent: var(--hub-sys-color-primary, #0d6efd);--hub-list-accent-emphasis: color-mix(in oklch, var(--hub-list-accent) 80%, var(--hub-sys-color-ink, #212529));--hub-list-accent-subtle: color-mix(in oklch, var(--hub-list-accent) 12%, var(--hub-sys-surface-page, #ffffff));--hub-list-accent-on: oklch(from var(--hub-list-accent) clamp(0, (.62 - l) * 1000, 1) 0 h);--hub-list-item-selected-bg: var(--hub-list-accent);--hub-list-item-selected-color: var(--hub-list-accent-on);--hub-list-cards-min-column-width: 18rem;--hub-list-cards-gap: var(--hub-list-items-gap);--hub-list-cards-columns: auto-fit;--hub-list-cards-row-gap: var(--hub-list-cards-gap);--hub-list-cards-column-gap: var(--hub-list-cards-gap);--hub-list-cards-bg: var(--hub-list-item-bg, transparent);--hub-list-cards-color: var(--hub-list-item-color);--hub-list-cards-padding-x: var(--hub-list-item-padding-x);--hub-list-cards-padding-y: var(--hub-list-item-padding-y);--hub-list-cards-border-color: var(--hub-list-item-border-color);--hub-list-cards-border-width: var(--hub-list-item-border-width, 1px);--hub-list-cards-border-radius: var(--hub-list-item-border-radius);--hub-list-cards-shadow: none;--hub-list-cards-hover-bg: var(--hub-list-item-hover-bg);--hub-list-cards-hover-shadow: var(--hub-list-cards-shadow);--hub-list-cards-transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;--hub-list-top-bar-gap: var(--hub-ref-space-2, .5rem);--hub-list-top-bar-justify-content: end;--hub-list-top-bar-align-items: center;--hub-list-top-bar-wrap: wrap;--hub-list-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-list-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-list-bottom-bar-justify-content: space-around;--hub-list-bottom-bar-align-items: center;--hub-list-bottom-bar-wrap: wrap;--hub-list-bottom-bar-paginator-order: 1;--hub-list-bottom-bar-settings-order: 2;--hub-list-bottom-bar-info-order: 3;--hub-list-bottom-bar-paginator-flex: 0 0 auto;--hub-list-bottom-bar-settings-flex: 0 0 auto;--hub-list-bottom-bar-info-flex: 0 0 auto;--hub-list-search-btn-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-search-btn-color: var(--hub-sys-text-primary, #212529);--hub-list-search-button-min-width: 2.75rem;--hub-list-search-input-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-search-input-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-search-input-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-search-input-color: var(--hub-sys-text-primary, #212529);--hub-list-search-border-color: var(--hub-list-search-input-border-color);--hub-list-search-border-width: 1px;--hub-list-search-border-radius: var(--hub-list-search-input-border-radius);--hub-list-search-input-padding-x: .75rem;--hub-list-search-input-padding-y: .375rem;--hub-list-search-input-font-size: 1rem;--hub-list-action-btn-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-action-btn-color: var(--hub-list-item-color);--hub-list-action-btn-border-color: var(--hub-list-item-border-color);--hub-list-action-btn-border-radius: var(--hub-list-item-border-radius);--hub-list-action-btn-padding-y: .375rem;--hub-list-action-btn-padding-x: .75rem;--hub-list-action-btn-hover-bg: var(--hub-list-item-hover-bg);--hub-list-drag-handle-color: var(--hub-sys-text-muted, #6c757d);--hub-list-drag-handle-cursor: grab;--hub-list-drag-handle-size: var(--hub-ref-icon-size, 1em);--hub-list-item-dragging-opacity: .5;--hub-list-item-dragging-cursor: grabbing;--hub-list-drop-target-outline-color: var(--hub-list-accent);--hub-list-drop-target-outline-width: 2px;--hub-list-placeholder-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-placeholder-border-color: var(--hub-list-accent);--hub-list-placeholder-border-width: 2px;--hub-list-placeholder-border-style: dashed;--hub-list-placeholder-border-radius: var(--hub-list-item-border-radius);--hub-list-placeholder-min-height: 2.5rem;--hub-list-ghost-opacity: .85;--hub-list-ghost-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15)}:host{display:flex;flex-direction:column;gap:var(--hub-list-gap);padding:var(--hub-list-padding-y) var(--hub-list-padding-x);background-color:var(--hub-list-bg);border-radius:var(--hub-list-border-radius)}:host .hub-list__bottom-bar{display:flex;justify-content:var(--hub-list-bottom-bar-justify-content);align-items:var(--hub-list-bottom-bar-align-items);flex-wrap:var(--hub-list-bottom-bar-wrap);gap:var(--hub-list-bottom-bar-gap)}:host .hub-list__bottom-bar-paginator{order:var(--hub-list-bottom-bar-paginator-order);flex:var(--hub-list-bottom-bar-paginator-flex);overflow:auto;margin:0}:host .hub-list__bottom-bar-settings{order:var(--hub-list-bottom-bar-settings-order);flex:var(--hub-list-bottom-bar-settings-flex);margin:0}:host .hub-list__bottom-bar-info{order:var(--hub-list-bottom-bar-info-order);flex:var(--hub-list-bottom-bar-info-flex);margin:0}:host .hub-list__top-bar{display:flex;align-items:var(--hub-list-top-bar-align-items);justify-content:var(--hub-list-top-bar-justify-content);flex-wrap:var(--hub-list-top-bar-wrap);gap:var(--hub-list-top-bar-gap);direction:ltr}:host .hub-list__batch-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-list-batch-actions-gap)}:host .hub-list__batch-action-btn{display:inline-flex;align-items:center;gap:.35rem}:host .hub-list__batch-action-btn--default{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:var(--hub-list-action-btn-padding-y) var(--hub-list-action-btn-padding-x);color:var(--hub-list-action-btn-color);background-color:var(--hub-list-action-btn-bg);border:1px solid var(--hub-list-action-btn-border-color);border-radius:var(--hub-list-action-btn-border-radius);transition:background-color .15s ease-in-out,border-color .15s ease-in-out,color .15s ease-in-out}:host .hub-list__batch-action-btn--default:hover:not(:disabled){background-color:var(--hub-list-action-btn-hover-bg)}:host .hub-list__search{margin-left:auto}:host.hub-list--rtl{direction:rtl}:host.hub-list--rtl .hub-list__items .hub-list__items{padding-left:0;padding-right:var(--hub-list-item-padding-x)}:host.hub-list--rtl .hub-list__search{direction:ltr;order:1;margin-left:0;margin-right:auto}:host.hub-list--rtl .hub-list__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important}:host.hub-list--rtl .hub-list__search-btn{border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}:host.hub-list--rtl .hub-list__batch-actions{order:2;flex-direction:row-reverse;margin-left:auto;margin-right:0}.hub-list__items{display:flex;flex-direction:column;gap:var(--hub-list-items-gap);background-color:var(--hub-list-items-bg);list-style:none;margin:0;padding:0}.hub-list__items .hub-list__items{margin-top:var(--hub-list-children-gap);padding-left:var(--hub-list-item-padding-x);padding-right:0;padding-top:0;padding-bottom:0;border-radius:0}.hub-list__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}.hub-list__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);font-size:var(--hub-list-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);background-color:var(--hub-list-search-input-bg);border-color:var(--hub-list-search-border-color)!important;color:var(--hub-list-search-input-color);border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}.hub-list__search-btn{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-list-search-button-min-width);padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);background-color:var(--hub-list-search-btn-bg)!important;color:var(--hub-list-search-btn-color)!important;border-color:var(--hub-list-search-border-color)!important;border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important;cursor:pointer}.hub-list__search-icon{display:inline-block;width:var(--hub-ref-icon-size, 1em);height:var(--hub-ref-icon-size, 1em);background-color:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}.hub-list__item{display:flex;flex-direction:column;padding:var(--hub-list-item-padding-y) var(--hub-list-item-padding-x);background-color:var(--hub-list-item-bg);color:var(--hub-list-item-color);border-radius:var(--hub-list-item-border-radius);transition:background-color .15s ease-in-out;position:relative;border:var(--hub-list-item-border-width) solid var(--hub-list-item-border-color)}.hub-list__item--clickable{cursor:pointer}.hub-list__item--clickable:hover{background-color:var(--hub-list-item-hover-bg)}.hub-list__item--selected{background-color:var(--hub-list-item-selected-bg)!important;color:var(--hub-list-item-selected-color);border-color:var(--hub-list-item-selected-bg)}.hub-list__item--selected .hub-list__label,.hub-list__item--selected .hub-list__actions button{color:var(--hub-list-item-selected-color)}.hub-list__item--empty{background-color:var(--hub-list-empty-bg);color:var(--hub-list-empty-color);padding:var(--hub-list-empty-padding-y, var(--hub-ref-space-3, 1rem)) var(--hub-list-empty-padding-x, var(--hub-ref-space-3, 1rem));border-color:var(--hub-list-empty-border-color);text-align:center}.hub-list__items--cards{display:grid;grid-template-columns:repeat(var(--hub-list-cards-columns),minmax(min(100%,var(--hub-list-cards-min-column-width)),1fr));gap:var(--hub-list-cards-row-gap) var(--hub-list-cards-column-gap)}.hub-list__items--cards>.hub-list__item{height:100%;background-color:var(--hub-list-cards-bg);color:var(--hub-list-cards-color);padding:var(--hub-list-cards-padding-y) var(--hub-list-cards-padding-x);border:var(--hub-list-cards-border-width) solid var(--hub-list-cards-border-color);border-radius:var(--hub-list-cards-border-radius);box-shadow:var(--hub-list-cards-shadow);transition:var(--hub-list-cards-transition)}.hub-list__items--cards>.hub-list__item.hub-list__item--clickable:hover{background-color:var(--hub-list-cards-hover-bg);box-shadow:var(--hub-list-cards-hover-shadow)}.hub-list__items--cards .hub-list__item-content{align-items:flex-start}.hub-list__items--cards .hub-list__label{overflow:visible;text-overflow:initial;white-space:normal}.hub-list__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.hub-list__item-content{display:flex;justify-content:space-between;align-items:center;gap:var(--hub-list-item-gap);width:100%}.hub-list__checkbox{width:var(--hub-list-checkbox-size);height:var(--hub-list-checkbox-size);flex-shrink:0;cursor:pointer}.hub-list__actions{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__chevron{padding:0;font-size:var(--hub-list-chevron-size);display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer}.hub-list__no-results{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__drag-handle{display:inline-flex;align-items:center;justify-content:center;font-size:var(--hub-list-drag-handle-size);color:var(--hub-list-drag-handle-color);cursor:var(--hub-list-drag-handle-cursor);touch-action:none;-webkit-user-select:none;user-select:none}.hub-list__item--dragging{opacity:var(--hub-list-item-dragging-opacity);cursor:var(--hub-list-item-dragging-cursor)}.hub-list__item--drag-disabled .hub-list__drag-handle{cursor:not-allowed;opacity:.4}.hub-list__placeholder{list-style:none;pointer-events:none;min-height:var(--hub-list-placeholder-min-height);background-color:var(--hub-list-placeholder-bg);border:var(--hub-list-placeholder-border-width) var(--hub-list-placeholder-border-style) var(--hub-list-placeholder-border-color);border-radius:var(--hub-list-placeholder-border-radius)}.hub-list__items--cards>.hub-list__placeholder{height:100%}.hub-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host([data-variant=primary]),.hub-list[data-variant=primary]{--hub-list-accent: var(--hub-sys-color-primary)}:host([data-variant=secondary]),.hub-list[data-variant=secondary]{--hub-list-accent: var(--hub-sys-color-secondary)}:host([data-variant=success]),.hub-list[data-variant=success]{--hub-list-accent: var(--hub-sys-color-success)}:host([data-variant=danger]),.hub-list[data-variant=danger]{--hub-list-accent: var(--hub-sys-color-danger)}:host([data-variant=warning]),.hub-list[data-variant=warning]{--hub-list-accent: var(--hub-sys-color-warning)}:host([data-variant=info]),.hub-list[data-variant=info]{--hub-list-accent: var(--hub-sys-color-info)}:host([data-variant=neutral]),.hub-list[data-variant=neutral]{--hub-list-accent: var(--hub-sys-color-neutral)}:host([data-variant=light]),.hub-list[data-variant=light]{--hub-list-accent: var(--hub-sys-color-light)}:host([data-variant=dark]),.hub-list[data-variant=dark]{--hub-list-accent: var(--hub-sys-color-dark)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PaginatorComponent, selector: "hub-paginator, paginable-table-paginator", inputs: ["rtl", "page", "numberOfPages"], outputs: ["pageChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PaginableStateOutlet, selector: "hub-state-outlet", inputs: ["template", "instanceDefault", "globalDefault", "fallback", "context"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UcfirstPipe, name: "ucfirst" }] });
3073
3073
  }
3074
3074
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: ListComponent, decorators: [{
3075
3075
  type: Component,
@@ -3093,7 +3093,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
3093
3093
  NgTemplateOutlet,
3094
3094
  NgClass,
3095
3095
  PaginableStateOutlet
3096
- ], standalone: true, template: "@if (batchActions.length || options.searchable) {\n\t<div class=\"hub-list__top-bar\">\n\t\t@if (batchActions.length) {\n\t\t\t<div class=\"hub-list__batch-actions\">\n\t\t\t\t@for (action of batchActions; track $index) {\n\t\t\t\t\t@if (!$any(action).buttons?.length) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-list__batch-action-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(action)\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(action)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (action.icon) {\n\t\t\t\t\t\t\t\t<i class=\"{{ action.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{{ action.title }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (options.searchable) {\n\t\t\t<div class=\"hub-list__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n@if (loading()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (error()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t[context]=\"{ error: error() }\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (!getVisibleItems(items, true).length) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--empty\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else {\n\t<ng-container\n\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t[ngTemplateOutletContext]=\"{\n\t\t\tcontrols: getVisibleControls(form.controls, true),\n\t\t\tcontrolsForm: form,\n\t\t\titemsFull: items,\n\t\t\titems: getVisibleItems(items, true),\n\t\t\tparentItem: null,\n\t\t\tisRoot: true,\n\t\t\tdepth: 0\n\t\t}\"\n\t></ng-container>\n}\n\n<ng-template\n\t#containerTpt\n\tlet-controls=\"controls\"\n\tlet-controlsForm=\"controlsForm\"\n\tlet-itemsFull=\"itemsFull\"\n\tlet-isRoot=\"isRoot\"\n\tlet-items=\"items\"\n\tlet-parentItem=\"parentItem\"\n\tlet-depth=\"depth\"\n>\n\t@let containerRef = makeContainerRef(controlsForm, itemsFull, parentItem, depth);\n\t<ul\n\t\tclass=\"hub-list__items\"\n\t\t[class.hub-list__items--root]=\"isRoot\"\n\t\t[class.hub-list__items--cards]=\"isRoot && isCardsDisplay()\"\n\t\t[attr.data-hub-container-key]=\"containerRef.key\"\n\t\t(dragover)=\"onContainerDragOver($event, containerRef)\"\n\t\t(drop)=\"onContainerDrop($event)\"\n\t>\n\t\t@for (formGroup of controls; track getTrackKey(formGroup.get('data')?.value, $index); let index = $index) {\n\t\t\t@let absIndex = absoluteIndex(index, isRoot);\n\t\t\t@if (sortable() && showPlaceholderBefore(controlsForm, absIndex)) {\n\t\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t\t></ng-container>\n\t\t\t\t</li>\n\t\t\t}\n\t\t\t<li\n\t\t\t\tclass=\"hub-list__item\"\n\t\t\t\t[ngClass]=\"_getRowClass(items[index])\"\n\t\t\t\t[class.hub-list__item--clickable]=\"clickFn()\"\n\t\t\t\t[class.hub-list__item--selected]=\"formGroup.get('selected')?.value\"\n\t\t\t\t[class.hub-list__item--dragging]=\"isRowDragging(items[index])\"\n\t\t\t\t[class.hub-list__item--drag-disabled]=\"sortable() && isRowDisabled(items[index])\"\n\t\t\t\t[attr.draggable]=\"isDragEnabled(items[index]) ? true : null\"\n\t\t\t\t[attr.data-hub-index]=\"absIndex\"\n\t\t\t\t[attr.tabindex]=\"keyboardSortable() && isDragEnabled(items[index]) ? 0 : null\"\n\t\t\t\t[attr.aria-roledescription]=\"sortable() ? ('DRAG_SORTABLE_ITEM' | translate) : null\"\n\t\t\t\t[attr.aria-grabbed]=\"sortable() ? isRowDragging(items[index]) : null\"\n\t\t\t\t[formGroup]=\"formGroup\"\n\t\t\t\t(click)=\"onItemClick(formGroup.value, depth, index, $event); $event.preventDefault(); $event.stopPropagation()\"\n\t\t\t\t(dragstart)=\"onDragStart($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(dragenter)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(dragover)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(drop)=\"onDrop($event)\"\n\t\t\t\t(dragend)=\"onDragEnd()\"\n\t\t\t\t(pointerdown)=\"onPointerDown($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(keydown)=\"onItemKeydown($event, containerRef, absIndex, items[index])\"\n\t\t\t>\n\t\t\t\t@if (formGroup.value; as item) {\n\t\t\t\t\t<div class=\"hub-list__item-content\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass=\"hub-list__checkbox\"\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\tformControlName=\"selected\"\n\t\t\t\t\t\t\t\t(change)=\"onSelectionChange()\"\n\t\t\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<div class=\"hub-list__label\">\n\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"itemTpt() || defaultItemtTpt\"\n\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\tdata: items[index],\n\t\t\t\t\t\t\t\t\tdepth,\n\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\tcollapsed: !!formGroup.get('collapsed').value,\n\t\t\t\t\t\t\t\t\tselected: formGroup.get('selected').value\n\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@if (item[bindChildren()]?.length) {\n\t\t\t\t\t\t\t<div class=\"hub-list__actions\">\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tclass=\"hub-list__chevron\"\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\t\t(click)=\"\n\t\t\t\t\t\t\t\t\t\ttoggleCollapsed(formGroup.get('collapsed'));\n\t\t\t\t\t\t\t\t\t\t$event.preventDefault();\n\t\t\t\t\t\t\t\t\t\t$event.stopPropagation()\n\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t[ngClass]=\"\n\t\t\t\t\t\t\t\t\t\t\titem.collapsed ? 'hub-table__icon--chevron-down' : 'hub-table__icon--chevron-up'\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t@if (item[bindChildren()]?.length && !item.collapsed) {\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\tcontrols: formGroup.get('children')?.controls,\n\t\t\t\t\t\t\t\tcontrolsForm: formGroup.get('children'),\n\t\t\t\t\t\t\t\titemsFull: items[index][bindChildren()],\n\t\t\t\t\t\t\t\titems: items[index][bindChildren()],\n\t\t\t\t\t\t\t\tparentItem: items[index],\n\t\t\t\t\t\t\t\tisRoot: false,\n\t\t\t\t\t\t\t\tdepth: depth + 1\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t></ng-container>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</li>\n\t\t}\n\t\t@if (sortable() && showPlaceholderAtEnd(controlsForm, isRoot, controls.length)) {\n\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t<ng-container\n\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t></ng-container>\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n\n@if (sortable() && keyboardSortable()) {\n\t<div class=\"hub-list__sr-only\" role=\"status\" aria-live=\"polite\">\n\t\t@if (announcement(); as message) {\n\t\t\t{{ message.key | translate: message.params }}\n\t\t}\n\t</div>\n}\n\n@if (paginate()) {\n\t<div class=\"hub-list__bottom-bar\">\n\t\t<hub-paginator\n\t\t\tclass=\"hub-list__bottom-bar-paginator\"\n\t\t\t[(page)]=\"page\"\n\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t[rtl]=\"isRtl()\"\n\t\t></hub-paginator>\n\t\t<div class=\"hub-list__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"onPerPageChange($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t<p class=\"hub-list__bottom-bar-info hub-paginator__info\">\n\t\t\t{{\n\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t| translate\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tamount: getVisibleItems(items, true).length,\n\t\t\t\t\t\t\t\ttotal: getEffectiveTotalItems()\n\t\t\t\t\t\t }\n\t\t\t\t\t| ucfirst\n\t\t\t}}\n\t\t</p>\n\t</div>\n}\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-list__no-results\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-list__loading\" role=\"status\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'LOADING' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-list__error text-danger\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'ERROR_OCURRED' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultPlaceholderTpt>\n\t<div class=\"hub-list__placeholder-inner\" aria-hidden=\"true\"></div>\n</ng-template>\n\n<ng-template #defaultItemtTpt let-data=\"data\">\n\t{{ data[bindLabel()] }}\n</ng-template>\n", styles: [":root,:host{--hub-list-checkbox-size: 1rem;--hub-list-chevron-size: var(--hub-ref-icon-size, 1em);--hub-list-bg: transparent;--hub-list-border-radius: var(--hub-ref-radius-md, .375rem);--hub-list-padding-x: var(--hub-ref-space-0, 0);--hub-list-padding-y: var(--hub-ref-space-0, 0);--hub-list-gap: var(--hub-ref-space-4, 1.5rem);--hub-list-items-bg: transparent;--hub-list-items-gap: var(--hub-ref-space-2, .5rem);--hub-list-empty-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-empty-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-empty-color: var(--hub-sys-text-muted, #6c757d);--hub-list-empty-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-empty-padding-y: var(--hub-ref-space-3, 1rem);--hub-list-item-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-item-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-item-border-width: 1px;--hub-list-item-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-item-color: var(--hub-sys-text-primary, #212529);--hub-list-item-gap: var(--hub-ref-space-2, .5rem);--hub-list-item-hover-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-item-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-item-padding-y: var(--hub-ref-space-2, .5rem);--hub-list-children-gap: var(--hub-list-item-padding-y);--hub-list-accent: var(--hub-sys-color-primary, #0d6efd);--hub-list-item-selected-bg: var(--hub-list-accent);--hub-list-item-selected-color: var(--hub-ref-color-white, #fff);--hub-list-cards-min-column-width: 18rem;--hub-list-cards-gap: var(--hub-list-items-gap);--hub-list-cards-columns: auto-fit;--hub-list-cards-row-gap: var(--hub-list-cards-gap);--hub-list-cards-column-gap: var(--hub-list-cards-gap);--hub-list-cards-bg: var(--hub-list-item-bg, transparent);--hub-list-cards-color: var(--hub-list-item-color);--hub-list-cards-padding-x: var(--hub-list-item-padding-x);--hub-list-cards-padding-y: var(--hub-list-item-padding-y);--hub-list-cards-border-color: var(--hub-list-item-border-color);--hub-list-cards-border-width: var(--hub-list-item-border-width, 1px);--hub-list-cards-border-radius: var(--hub-list-item-border-radius);--hub-list-cards-shadow: none;--hub-list-cards-hover-bg: var(--hub-list-item-hover-bg);--hub-list-cards-hover-shadow: var(--hub-list-cards-shadow);--hub-list-cards-transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;--hub-list-top-bar-gap: var(--hub-ref-space-2, .5rem);--hub-list-top-bar-justify-content: end;--hub-list-top-bar-align-items: center;--hub-list-top-bar-wrap: wrap;--hub-list-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-list-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-list-bottom-bar-justify-content: space-around;--hub-list-bottom-bar-align-items: center;--hub-list-bottom-bar-wrap: wrap;--hub-list-bottom-bar-paginator-order: 1;--hub-list-bottom-bar-settings-order: 2;--hub-list-bottom-bar-info-order: 3;--hub-list-bottom-bar-paginator-flex: 0 0 auto;--hub-list-bottom-bar-settings-flex: 0 0 auto;--hub-list-bottom-bar-info-flex: 0 0 auto;--hub-list-search-btn-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-search-btn-color: var(--hub-sys-text-primary, #212529);--hub-list-search-button-min-width: 2.75rem;--hub-list-search-input-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-search-input-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-search-input-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-search-input-color: var(--hub-sys-text-primary, #212529);--hub-list-search-border-color: var(--hub-list-search-input-border-color);--hub-list-search-border-width: 1px;--hub-list-search-border-radius: var(--hub-list-search-input-border-radius);--hub-list-search-input-padding-x: .75rem;--hub-list-search-input-padding-y: .375rem;--hub-list-search-input-font-size: 1rem;--hub-list-action-btn-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-action-btn-color: var(--hub-list-item-color);--hub-list-action-btn-border-color: var(--hub-list-item-border-color);--hub-list-action-btn-border-radius: var(--hub-list-item-border-radius);--hub-list-action-btn-padding-y: .375rem;--hub-list-action-btn-padding-x: .75rem;--hub-list-action-btn-hover-bg: var(--hub-list-item-hover-bg);--hub-list-drag-handle-color: var(--hub-sys-text-muted, #6c757d);--hub-list-drag-handle-cursor: grab;--hub-list-drag-handle-size: var(--hub-ref-icon-size, 1em);--hub-list-item-dragging-opacity: .5;--hub-list-item-dragging-cursor: grabbing;--hub-list-drop-target-outline-color: var(--hub-list-accent);--hub-list-drop-target-outline-width: 2px;--hub-list-placeholder-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-placeholder-border-color: var(--hub-list-accent);--hub-list-placeholder-border-width: 2px;--hub-list-placeholder-border-style: dashed;--hub-list-placeholder-border-radius: var(--hub-list-item-border-radius);--hub-list-placeholder-min-height: 2.5rem;--hub-list-ghost-opacity: .85;--hub-list-ghost-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15)}:host{display:flex;flex-direction:column;gap:var(--hub-list-gap);padding:var(--hub-list-padding-y) var(--hub-list-padding-x);background-color:var(--hub-list-bg);border-radius:var(--hub-list-border-radius)}:host .hub-list__bottom-bar{display:flex;justify-content:var(--hub-list-bottom-bar-justify-content);align-items:var(--hub-list-bottom-bar-align-items);flex-wrap:var(--hub-list-bottom-bar-wrap);gap:var(--hub-list-bottom-bar-gap)}:host .hub-list__bottom-bar-paginator{order:var(--hub-list-bottom-bar-paginator-order);flex:var(--hub-list-bottom-bar-paginator-flex);overflow:auto;margin:0}:host .hub-list__bottom-bar-settings{order:var(--hub-list-bottom-bar-settings-order);flex:var(--hub-list-bottom-bar-settings-flex);margin:0}:host .hub-list__bottom-bar-info{order:var(--hub-list-bottom-bar-info-order);flex:var(--hub-list-bottom-bar-info-flex);margin:0}:host .hub-list__top-bar{display:flex;align-items:var(--hub-list-top-bar-align-items);justify-content:var(--hub-list-top-bar-justify-content);flex-wrap:var(--hub-list-top-bar-wrap);gap:var(--hub-list-top-bar-gap);direction:ltr}:host .hub-list__batch-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-list-batch-actions-gap)}:host .hub-list__batch-action-btn{display:inline-flex;align-items:center;gap:.35rem}:host .hub-list__batch-action-btn--default{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:var(--hub-list-action-btn-padding-y) var(--hub-list-action-btn-padding-x);color:var(--hub-list-action-btn-color);background-color:var(--hub-list-action-btn-bg);border:1px solid var(--hub-list-action-btn-border-color);border-radius:var(--hub-list-action-btn-border-radius);transition:background-color .15s ease-in-out,border-color .15s ease-in-out,color .15s ease-in-out}:host .hub-list__batch-action-btn--default:hover:not(:disabled){background-color:var(--hub-list-action-btn-hover-bg)}:host .hub-list__search{margin-left:auto}:host.hub-list--rtl{direction:rtl}:host.hub-list--rtl .hub-list__items .hub-list__items{padding-left:0;padding-right:var(--hub-list-item-padding-x)}:host.hub-list--rtl .hub-list__search{direction:ltr;order:1;margin-left:0;margin-right:auto}:host.hub-list--rtl .hub-list__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important}:host.hub-list--rtl .hub-list__search-btn{border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}:host.hub-list--rtl .hub-list__batch-actions{order:2;flex-direction:row-reverse;margin-left:auto;margin-right:0}.hub-list__items{display:flex;flex-direction:column;gap:var(--hub-list-items-gap);background-color:var(--hub-list-items-bg);list-style:none;margin:0;padding:0}.hub-list__items .hub-list__items{margin-top:var(--hub-list-children-gap);padding-left:var(--hub-list-item-padding-x);padding-right:0;padding-top:0;padding-bottom:0;border-radius:0}.hub-list__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}.hub-list__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);font-size:var(--hub-list-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);background-color:var(--hub-list-search-input-bg);border-color:var(--hub-list-search-border-color)!important;color:var(--hub-list-search-input-color);border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}.hub-list__search-btn{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-list-search-button-min-width);padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);background-color:var(--hub-list-search-btn-bg)!important;color:var(--hub-list-search-btn-color)!important;border-color:var(--hub-list-search-border-color)!important;border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important;cursor:pointer}.hub-list__search-icon{display:inline-block;width:var(--hub-ref-icon-size, 1em);height:var(--hub-ref-icon-size, 1em);background-color:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}.hub-list__item{display:flex;flex-direction:column;padding:var(--hub-list-item-padding-y) var(--hub-list-item-padding-x);background-color:var(--hub-list-item-bg);color:var(--hub-list-item-color);border-radius:var(--hub-list-item-border-radius);transition:background-color .15s ease-in-out;position:relative;border:var(--hub-list-item-border-width) solid var(--hub-list-item-border-color)}.hub-list__item--clickable{cursor:pointer}.hub-list__item--clickable:hover{background-color:var(--hub-list-item-hover-bg)}.hub-list__item--selected{background-color:var(--hub-list-item-selected-bg)!important;color:var(--hub-list-item-selected-color);border-color:var(--hub-list-item-selected-bg)}.hub-list__item--selected .hub-list__label,.hub-list__item--selected .hub-list__actions button{color:var(--hub-list-item-selected-color)}.hub-list__item--empty{background-color:var(--hub-list-empty-bg);color:var(--hub-list-empty-color);padding:var(--hub-list-empty-padding-y, var(--hub-ref-space-3, 1rem)) var(--hub-list-empty-padding-x, var(--hub-ref-space-3, 1rem));border-color:var(--hub-list-empty-border-color);text-align:center}.hub-list__items--cards{display:grid;grid-template-columns:repeat(var(--hub-list-cards-columns),minmax(min(100%,var(--hub-list-cards-min-column-width)),1fr));gap:var(--hub-list-cards-row-gap) var(--hub-list-cards-column-gap)}.hub-list__items--cards>.hub-list__item{height:100%;background-color:var(--hub-list-cards-bg);color:var(--hub-list-cards-color);padding:var(--hub-list-cards-padding-y) var(--hub-list-cards-padding-x);border:var(--hub-list-cards-border-width) solid var(--hub-list-cards-border-color);border-radius:var(--hub-list-cards-border-radius);box-shadow:var(--hub-list-cards-shadow);transition:var(--hub-list-cards-transition)}.hub-list__items--cards>.hub-list__item.hub-list__item--clickable:hover{background-color:var(--hub-list-cards-hover-bg);box-shadow:var(--hub-list-cards-hover-shadow)}.hub-list__items--cards .hub-list__item-content{align-items:flex-start}.hub-list__items--cards .hub-list__label{overflow:visible;text-overflow:initial;white-space:normal}.hub-list__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.hub-list__item-content{display:flex;justify-content:space-between;align-items:center;gap:var(--hub-list-item-gap);width:100%}.hub-list__checkbox{width:var(--hub-list-checkbox-size);height:var(--hub-list-checkbox-size);flex-shrink:0;cursor:pointer}.hub-list__actions{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__chevron{padding:0;font-size:var(--hub-list-chevron-size);display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer}.hub-list__no-results{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__drag-handle{display:inline-flex;align-items:center;justify-content:center;font-size:var(--hub-list-drag-handle-size);color:var(--hub-list-drag-handle-color);cursor:var(--hub-list-drag-handle-cursor);touch-action:none;-webkit-user-select:none;user-select:none}.hub-list__item--dragging{opacity:var(--hub-list-item-dragging-opacity);cursor:var(--hub-list-item-dragging-cursor)}.hub-list__item--drag-disabled .hub-list__drag-handle{cursor:not-allowed;opacity:.4}.hub-list__placeholder{list-style:none;pointer-events:none;min-height:var(--hub-list-placeholder-min-height);background-color:var(--hub-list-placeholder-bg);border:var(--hub-list-placeholder-border-width) var(--hub-list-placeholder-border-style) var(--hub-list-placeholder-border-color);border-radius:var(--hub-list-placeholder-border-radius)}.hub-list__items--cards>.hub-list__placeholder{height:100%}.hub-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host([data-variant=primary]),.hub-list[data-variant=primary]{--hub-list-accent: var(--hub-sys-color-primary)}:host([data-variant=success]),.hub-list[data-variant=success]{--hub-list-accent: var(--hub-sys-color-success)}:host([data-variant=danger]),.hub-list[data-variant=danger]{--hub-list-accent: var(--hub-sys-color-danger)}:host([data-variant=warning]),.hub-list[data-variant=warning]{--hub-list-accent: var(--hub-sys-color-warning)}:host([data-variant=info]),.hub-list[data-variant=info]{--hub-list-accent: var(--hub-sys-color-info)}\n"] }]
3096
+ ], standalone: true, template: "@if (batchActions.length || options.searchable) {\n\t<div class=\"hub-list__top-bar\">\n\t\t@if (batchActions.length) {\n\t\t\t<div class=\"hub-list__batch-actions\">\n\t\t\t\t@for (action of batchActions; track $index) {\n\t\t\t\t\t@if (!$any(action).buttons?.length) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-list__batch-action-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(action)\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(action)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (action.icon) {\n\t\t\t\t\t\t\t\t<i class=\"{{ action.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t{{ action.title }}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (options.searchable) {\n\t\t\t<div class=\"hub-list__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-list__search-input\"\n\t\t\t\t\t\t[formControl]=\"searchFG\"\n\t\t\t\t\t\t[placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keyup.enter)=\"filter()\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button class=\"hub-list__search-btn\" type=\"button\" (click)=\"filter()\">\n\t\t\t\t\t\t<i class=\"hub-list__search-icon\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n@if (loading()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (error()) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--state\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t[context]=\"{ error: error() }\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else if (!getVisibleItems(items, true).length) {\n\t<ul class=\"hub-list__items hub-list__items--root\">\n\t\t<li class=\"hub-list__item hub-list__item--empty\">\n\t\t\t<hub-state-outlet\n\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t/>\n\t\t</li>\n\t</ul>\n} @else {\n\t<ng-container\n\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t[ngTemplateOutletContext]=\"{\n\t\t\tcontrols: getVisibleControls(form.controls, true),\n\t\t\tcontrolsForm: form,\n\t\t\titemsFull: items,\n\t\t\titems: getVisibleItems(items, true),\n\t\t\tparentItem: null,\n\t\t\tisRoot: true,\n\t\t\tdepth: 0\n\t\t}\"\n\t></ng-container>\n}\n\n<ng-template\n\t#containerTpt\n\tlet-controls=\"controls\"\n\tlet-controlsForm=\"controlsForm\"\n\tlet-itemsFull=\"itemsFull\"\n\tlet-isRoot=\"isRoot\"\n\tlet-items=\"items\"\n\tlet-parentItem=\"parentItem\"\n\tlet-depth=\"depth\"\n>\n\t@let containerRef = makeContainerRef(controlsForm, itemsFull, parentItem, depth);\n\t<ul\n\t\tclass=\"hub-list__items\"\n\t\t[class.hub-list__items--root]=\"isRoot\"\n\t\t[class.hub-list__items--cards]=\"isRoot && isCardsDisplay()\"\n\t\t[attr.data-hub-container-key]=\"containerRef.key\"\n\t\t(dragover)=\"onContainerDragOver($event, containerRef)\"\n\t\t(drop)=\"onContainerDrop($event)\"\n\t>\n\t\t@for (formGroup of controls; track getTrackKey(formGroup.get('data')?.value, $index); let index = $index) {\n\t\t\t@let absIndex = absoluteIndex(index, isRoot);\n\t\t\t@if (sortable() && showPlaceholderBefore(controlsForm, absIndex)) {\n\t\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t\t></ng-container>\n\t\t\t\t</li>\n\t\t\t}\n\t\t\t<li\n\t\t\t\tclass=\"hub-list__item\"\n\t\t\t\t[ngClass]=\"_getRowClass(items[index])\"\n\t\t\t\t[class.hub-list__item--clickable]=\"clickFn()\"\n\t\t\t\t[class.hub-list__item--selected]=\"formGroup.get('selected')?.value\"\n\t\t\t\t[class.hub-list__item--dragging]=\"isRowDragging(items[index])\"\n\t\t\t\t[class.hub-list__item--drag-disabled]=\"sortable() && isRowDisabled(items[index])\"\n\t\t\t\t[attr.draggable]=\"isDragEnabled(items[index]) ? true : null\"\n\t\t\t\t[attr.data-hub-index]=\"absIndex\"\n\t\t\t\t[attr.tabindex]=\"keyboardSortable() && isDragEnabled(items[index]) ? 0 : null\"\n\t\t\t\t[attr.aria-roledescription]=\"sortable() ? ('DRAG_SORTABLE_ITEM' | translate) : null\"\n\t\t\t\t[attr.aria-grabbed]=\"sortable() ? isRowDragging(items[index]) : null\"\n\t\t\t\t[formGroup]=\"formGroup\"\n\t\t\t\t(click)=\"onItemClick(formGroup.value, depth, index, $event); $event.preventDefault(); $event.stopPropagation()\"\n\t\t\t\t(dragstart)=\"onDragStart($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(dragenter)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(dragover)=\"onDragOver($event, containerRef, absIndex)\"\n\t\t\t\t(drop)=\"onDrop($event)\"\n\t\t\t\t(dragend)=\"onDragEnd()\"\n\t\t\t\t(pointerdown)=\"onPointerDown($event, containerRef, absIndex, items[index])\"\n\t\t\t\t(keydown)=\"onItemKeydown($event, containerRef, absIndex, items[index])\"\n\t\t\t>\n\t\t\t\t@if (formGroup.value; as item) {\n\t\t\t\t\t<div class=\"hub-list__item-content\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass=\"hub-list__checkbox\"\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\tformControlName=\"selected\"\n\t\t\t\t\t\t\t\t(change)=\"onSelectionChange()\"\n\t\t\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t<div class=\"hub-list__label\">\n\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"itemTpt() || defaultItemtTpt\"\n\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\tdata: items[index],\n\t\t\t\t\t\t\t\t\tdepth,\n\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\tcollapsed: !!formGroup.get('collapsed').value,\n\t\t\t\t\t\t\t\t\tselected: formGroup.get('selected').value\n\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t@if (item[bindChildren()]?.length) {\n\t\t\t\t\t\t\t<div class=\"hub-list__actions\">\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tclass=\"hub-list__chevron\"\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tdraggable=\"false\"\n\t\t\t\t\t\t\t\t\t(click)=\"\n\t\t\t\t\t\t\t\t\t\ttoggleCollapsed(formGroup.get('collapsed'));\n\t\t\t\t\t\t\t\t\t\t$event.preventDefault();\n\t\t\t\t\t\t\t\t\t\t$event.stopPropagation()\n\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t[ngClass]=\"\n\t\t\t\t\t\t\t\t\t\t\titem.collapsed ? 'hub-table__icon--chevron-down' : 'hub-table__icon--chevron-up'\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t@if (item[bindChildren()]?.length && !item.collapsed) {\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t[ngTemplateOutlet]=\"containerTpt\"\n\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\tcontrols: formGroup.get('children')?.controls,\n\t\t\t\t\t\t\t\tcontrolsForm: formGroup.get('children'),\n\t\t\t\t\t\t\t\titemsFull: items[index][bindChildren()],\n\t\t\t\t\t\t\t\titems: items[index][bindChildren()],\n\t\t\t\t\t\t\t\tparentItem: items[index],\n\t\t\t\t\t\t\t\tisRoot: false,\n\t\t\t\t\t\t\t\tdepth: depth + 1\n\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t></ng-container>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</li>\n\t\t}\n\t\t@if (sortable() && showPlaceholderAtEnd(controlsForm, isRoot, controls.length)) {\n\t\t\t<li class=\"hub-list__placeholder\" aria-hidden=\"true\">\n\t\t\t\t<ng-container\n\t\t\t\t\t[ngTemplateOutlet]=\"placeholderTpt() || defaultPlaceholderTpt\"\n\t\t\t\t\t[ngTemplateOutletContext]=\"{ item: dragService.active()?.item }\"\n\t\t\t\t></ng-container>\n\t\t\t</li>\n\t\t}\n\t</ul>\n</ng-template>\n\n@if (sortable() && keyboardSortable()) {\n\t<div class=\"hub-list__sr-only\" role=\"status\" aria-live=\"polite\">\n\t\t@if (announcement(); as message) {\n\t\t\t{{ message.key | translate: message.params }}\n\t\t}\n\t</div>\n}\n\n@if (paginate()) {\n\t<div class=\"hub-list__bottom-bar\">\n\t\t<hub-paginator\n\t\t\tclass=\"hub-list__bottom-bar-paginator\"\n\t\t\t[(page)]=\"page\"\n\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t[rtl]=\"isRtl()\"\n\t\t></hub-paginator>\n\t\t<div class=\"hub-list__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"onPerPageChange($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t<p class=\"hub-list__bottom-bar-info hub-paginator__info\">\n\t\t\t{{\n\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t| translate\n\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\tamount: getVisibleItems(items, true).length,\n\t\t\t\t\t\t\t\ttotal: getEffectiveTotalItems()\n\t\t\t\t\t\t }\n\t\t\t\t\t| ucfirst\n\t\t\t}}\n\t\t</p>\n\t</div>\n}\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-list__no-results\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-list__loading\" role=\"status\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'LOADING' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-list__error text-danger\" role=\"alert\">\n\t\t<i class=\"hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'ERROR_OCURRED' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultPlaceholderTpt>\n\t<div class=\"hub-list__placeholder-inner\" aria-hidden=\"true\"></div>\n</ng-template>\n\n<ng-template #defaultItemtTpt let-data=\"data\">\n\t{{ data[bindLabel()] }}\n</ng-template>\n", styles: [":root,:host{--hub-list-checkbox-size: 1rem;--hub-list-chevron-size: var(--hub-ref-icon-size, 1em);--hub-list-bg: transparent;--hub-list-border-radius: var(--hub-ref-radius-md, .375rem);--hub-list-padding-x: var(--hub-ref-space-0, 0);--hub-list-padding-y: var(--hub-ref-space-0, 0);--hub-list-gap: var(--hub-ref-space-4, 1.5rem);--hub-list-items-bg: transparent;--hub-list-items-gap: var(--hub-ref-space-2, .5rem);--hub-list-empty-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-empty-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-empty-color: var(--hub-sys-text-muted, #6c757d);--hub-list-empty-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-empty-padding-y: var(--hub-ref-space-3, 1rem);--hub-list-item-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-item-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-item-border-width: 1px;--hub-list-item-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-item-color: var(--hub-sys-text-primary, #212529);--hub-list-item-gap: var(--hub-ref-space-2, .5rem);--hub-list-item-hover-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-item-padding-x: var(--hub-ref-space-3, 1rem);--hub-list-item-padding-y: var(--hub-ref-space-2, .5rem);--hub-list-children-gap: var(--hub-list-item-padding-y);--hub-list-accent: var(--hub-sys-color-primary, #0d6efd);--hub-list-accent-emphasis: color-mix(in oklch, var(--hub-list-accent) 80%, var(--hub-sys-color-ink, #212529));--hub-list-accent-subtle: color-mix(in oklch, var(--hub-list-accent) 12%, var(--hub-sys-surface-page, #ffffff));--hub-list-accent-on: oklch(from var(--hub-list-accent) clamp(0, (.62 - l) * 1000, 1) 0 h);--hub-list-item-selected-bg: var(--hub-list-accent);--hub-list-item-selected-color: var(--hub-list-accent-on);--hub-list-cards-min-column-width: 18rem;--hub-list-cards-gap: var(--hub-list-items-gap);--hub-list-cards-columns: auto-fit;--hub-list-cards-row-gap: var(--hub-list-cards-gap);--hub-list-cards-column-gap: var(--hub-list-cards-gap);--hub-list-cards-bg: var(--hub-list-item-bg, transparent);--hub-list-cards-color: var(--hub-list-item-color);--hub-list-cards-padding-x: var(--hub-list-item-padding-x);--hub-list-cards-padding-y: var(--hub-list-item-padding-y);--hub-list-cards-border-color: var(--hub-list-item-border-color);--hub-list-cards-border-width: var(--hub-list-item-border-width, 1px);--hub-list-cards-border-radius: var(--hub-list-item-border-radius);--hub-list-cards-shadow: none;--hub-list-cards-hover-bg: var(--hub-list-item-hover-bg);--hub-list-cards-hover-shadow: var(--hub-list-cards-shadow);--hub-list-cards-transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;--hub-list-top-bar-gap: var(--hub-ref-space-2, .5rem);--hub-list-top-bar-justify-content: end;--hub-list-top-bar-align-items: center;--hub-list-top-bar-wrap: wrap;--hub-list-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-list-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-list-bottom-bar-justify-content: space-around;--hub-list-bottom-bar-align-items: center;--hub-list-bottom-bar-wrap: wrap;--hub-list-bottom-bar-paginator-order: 1;--hub-list-bottom-bar-settings-order: 2;--hub-list-bottom-bar-info-order: 3;--hub-list-bottom-bar-paginator-flex: 0 0 auto;--hub-list-bottom-bar-settings-flex: 0 0 auto;--hub-list-bottom-bar-info-flex: 0 0 auto;--hub-list-search-btn-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-search-btn-color: var(--hub-sys-text-primary, #212529);--hub-list-search-button-min-width: 2.75rem;--hub-list-search-input-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-search-input-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-list-search-input-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-list-search-input-color: var(--hub-sys-text-primary, #212529);--hub-list-search-border-color: var(--hub-list-search-input-border-color);--hub-list-search-border-width: 1px;--hub-list-search-border-radius: var(--hub-list-search-input-border-radius);--hub-list-search-input-padding-x: .75rem;--hub-list-search-input-padding-y: .375rem;--hub-list-search-input-font-size: 1rem;--hub-list-action-btn-bg: var(--hub-sys-surface-page, #ffffff);--hub-list-action-btn-color: var(--hub-list-item-color);--hub-list-action-btn-border-color: var(--hub-list-item-border-color);--hub-list-action-btn-border-radius: var(--hub-list-item-border-radius);--hub-list-action-btn-padding-y: .375rem;--hub-list-action-btn-padding-x: .75rem;--hub-list-action-btn-hover-bg: var(--hub-list-item-hover-bg);--hub-list-drag-handle-color: var(--hub-sys-text-muted, #6c757d);--hub-list-drag-handle-cursor: grab;--hub-list-drag-handle-size: var(--hub-ref-icon-size, 1em);--hub-list-item-dragging-opacity: .5;--hub-list-item-dragging-cursor: grabbing;--hub-list-drop-target-outline-color: var(--hub-list-accent);--hub-list-drop-target-outline-width: 2px;--hub-list-placeholder-bg: var(--hub-ref-surface-2, #f8f9fa);--hub-list-placeholder-border-color: var(--hub-list-accent);--hub-list-placeholder-border-width: 2px;--hub-list-placeholder-border-style: dashed;--hub-list-placeholder-border-radius: var(--hub-list-item-border-radius);--hub-list-placeholder-min-height: 2.5rem;--hub-list-ghost-opacity: .85;--hub-list-ghost-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15)}:host{display:flex;flex-direction:column;gap:var(--hub-list-gap);padding:var(--hub-list-padding-y) var(--hub-list-padding-x);background-color:var(--hub-list-bg);border-radius:var(--hub-list-border-radius)}:host .hub-list__bottom-bar{display:flex;justify-content:var(--hub-list-bottom-bar-justify-content);align-items:var(--hub-list-bottom-bar-align-items);flex-wrap:var(--hub-list-bottom-bar-wrap);gap:var(--hub-list-bottom-bar-gap)}:host .hub-list__bottom-bar-paginator{order:var(--hub-list-bottom-bar-paginator-order);flex:var(--hub-list-bottom-bar-paginator-flex);overflow:auto;margin:0}:host .hub-list__bottom-bar-settings{order:var(--hub-list-bottom-bar-settings-order);flex:var(--hub-list-bottom-bar-settings-flex);margin:0}:host .hub-list__bottom-bar-info{order:var(--hub-list-bottom-bar-info-order);flex:var(--hub-list-bottom-bar-info-flex);margin:0}:host .hub-list__top-bar{display:flex;align-items:var(--hub-list-top-bar-align-items);justify-content:var(--hub-list-top-bar-justify-content);flex-wrap:var(--hub-list-top-bar-wrap);gap:var(--hub-list-top-bar-gap);direction:ltr}:host .hub-list__batch-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-list-batch-actions-gap)}:host .hub-list__batch-action-btn{display:inline-flex;align-items:center;gap:.35rem}:host .hub-list__batch-action-btn--default{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:var(--hub-list-action-btn-padding-y) var(--hub-list-action-btn-padding-x);color:var(--hub-list-action-btn-color);background-color:var(--hub-list-action-btn-bg);border:1px solid var(--hub-list-action-btn-border-color);border-radius:var(--hub-list-action-btn-border-radius);transition:background-color .15s ease-in-out,border-color .15s ease-in-out,color .15s ease-in-out}:host .hub-list__batch-action-btn--default:hover:not(:disabled){background-color:var(--hub-list-action-btn-hover-bg)}:host .hub-list__search{margin-left:auto}:host.hub-list--rtl{direction:rtl}:host.hub-list--rtl .hub-list__items .hub-list__items{padding-left:0;padding-right:var(--hub-list-item-padding-x)}:host.hub-list--rtl .hub-list__search{direction:ltr;order:1;margin-left:0;margin-right:auto}:host.hub-list--rtl .hub-list__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important}:host.hub-list--rtl .hub-list__search-btn{border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}:host.hub-list--rtl .hub-list__batch-actions{order:2;flex-direction:row-reverse;margin-left:auto;margin-right:0}.hub-list__items{display:flex;flex-direction:column;gap:var(--hub-list-items-gap);background-color:var(--hub-list-items-bg);list-style:none;margin:0;padding:0}.hub-list__items .hub-list__items{margin-top:var(--hub-list-children-gap);padding-left:var(--hub-list-item-padding-x);padding-right:0;padding-top:0;padding-bottom:0;border-radius:0}.hub-list__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}.hub-list__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);font-size:var(--hub-list-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);background-color:var(--hub-list-search-input-bg);border-color:var(--hub-list-search-border-color)!important;color:var(--hub-list-search-input-color);border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:var(--hub-list-search-border-radius) 0 0 var(--hub-list-search-border-radius)!important}.hub-list__search-btn{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-list-search-button-min-width);padding:var(--hub-list-search-input-padding-y) var(--hub-list-search-input-padding-x);background-color:var(--hub-list-search-btn-bg)!important;color:var(--hub-list-search-btn-color)!important;border-color:var(--hub-list-search-border-color)!important;border:var(--hub-list-search-border-width) solid var(--hub-list-search-border-color);border-radius:0 var(--hub-list-search-border-radius) var(--hub-list-search-border-radius) 0!important;cursor:pointer}.hub-list__search-icon{display:inline-block;width:var(--hub-ref-icon-size, 1em);height:var(--hub-ref-icon-size, 1em);background-color:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}.hub-list__item{display:flex;flex-direction:column;padding:var(--hub-list-item-padding-y) var(--hub-list-item-padding-x);background-color:var(--hub-list-item-bg);color:var(--hub-list-item-color);border-radius:var(--hub-list-item-border-radius);transition:background-color .15s ease-in-out;position:relative;border:var(--hub-list-item-border-width) solid var(--hub-list-item-border-color)}.hub-list__item--clickable{cursor:pointer}.hub-list__item--clickable:hover{background-color:var(--hub-list-item-hover-bg)}.hub-list__item--selected{background-color:var(--hub-list-item-selected-bg)!important;color:var(--hub-list-item-selected-color);border-color:var(--hub-list-item-selected-bg)}.hub-list__item--selected .hub-list__label,.hub-list__item--selected .hub-list__actions button{color:var(--hub-list-item-selected-color)}.hub-list__item--empty{background-color:var(--hub-list-empty-bg);color:var(--hub-list-empty-color);padding:var(--hub-list-empty-padding-y, var(--hub-ref-space-3, 1rem)) var(--hub-list-empty-padding-x, var(--hub-ref-space-3, 1rem));border-color:var(--hub-list-empty-border-color);text-align:center}.hub-list__items--cards{display:grid;grid-template-columns:repeat(var(--hub-list-cards-columns),minmax(min(100%,var(--hub-list-cards-min-column-width)),1fr));gap:var(--hub-list-cards-row-gap) var(--hub-list-cards-column-gap)}.hub-list__items--cards>.hub-list__item{height:100%;background-color:var(--hub-list-cards-bg);color:var(--hub-list-cards-color);padding:var(--hub-list-cards-padding-y) var(--hub-list-cards-padding-x);border:var(--hub-list-cards-border-width) solid var(--hub-list-cards-border-color);border-radius:var(--hub-list-cards-border-radius);box-shadow:var(--hub-list-cards-shadow);transition:var(--hub-list-cards-transition)}.hub-list__items--cards>.hub-list__item.hub-list__item--clickable:hover{background-color:var(--hub-list-cards-hover-bg);box-shadow:var(--hub-list-cards-hover-shadow)}.hub-list__items--cards .hub-list__item-content{align-items:flex-start}.hub-list__items--cards .hub-list__label{overflow:visible;text-overflow:initial;white-space:normal}.hub-list__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.hub-list__item-content{display:flex;justify-content:space-between;align-items:center;gap:var(--hub-list-item-gap);width:100%}.hub-list__checkbox{width:var(--hub-list-checkbox-size);height:var(--hub-list-checkbox-size);flex-shrink:0;cursor:pointer}.hub-list__actions{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__chevron{padding:0;font-size:var(--hub-list-chevron-size);display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer}.hub-list__no-results{display:flex;align-items:center;gap:var(--hub-ref-space-2, .5rem)}.hub-list__drag-handle{display:inline-flex;align-items:center;justify-content:center;font-size:var(--hub-list-drag-handle-size);color:var(--hub-list-drag-handle-color);cursor:var(--hub-list-drag-handle-cursor);touch-action:none;-webkit-user-select:none;user-select:none}.hub-list__item--dragging{opacity:var(--hub-list-item-dragging-opacity);cursor:var(--hub-list-item-dragging-cursor)}.hub-list__item--drag-disabled .hub-list__drag-handle{cursor:not-allowed;opacity:.4}.hub-list__placeholder{list-style:none;pointer-events:none;min-height:var(--hub-list-placeholder-min-height);background-color:var(--hub-list-placeholder-bg);border:var(--hub-list-placeholder-border-width) var(--hub-list-placeholder-border-style) var(--hub-list-placeholder-border-color);border-radius:var(--hub-list-placeholder-border-radius)}.hub-list__items--cards>.hub-list__placeholder{height:100%}.hub-list__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host([data-variant=primary]),.hub-list[data-variant=primary]{--hub-list-accent: var(--hub-sys-color-primary)}:host([data-variant=secondary]),.hub-list[data-variant=secondary]{--hub-list-accent: var(--hub-sys-color-secondary)}:host([data-variant=success]),.hub-list[data-variant=success]{--hub-list-accent: var(--hub-sys-color-success)}:host([data-variant=danger]),.hub-list[data-variant=danger]{--hub-list-accent: var(--hub-sys-color-danger)}:host([data-variant=warning]),.hub-list[data-variant=warning]{--hub-list-accent: var(--hub-sys-color-warning)}:host([data-variant=info]),.hub-list[data-variant=info]{--hub-list-accent: var(--hub-sys-color-info)}:host([data-variant=neutral]),.hub-list[data-variant=neutral]{--hub-list-accent: var(--hub-sys-color-neutral)}:host([data-variant=light]),.hub-list[data-variant=light]{--hub-list-accent: var(--hub-sys-color-light)}:host([data-variant=dark]),.hub-list[data-variant=dark]{--hub-list-accent: var(--hub-sys-color-dark)}\n"] }]
3097
3097
  }], ctorParameters: () => [], propDecorators: { loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }, { type: i0.Output, args: ["loadingChange"] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }, { type: i0.Output, args: ["errorChange"] }], loadingComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingComponent", required: false }] }], errorComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorComponent", required: false }] }], noResultsComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsComponent", required: false }] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }], bindLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindLabel", required: false }] }], bindChildren: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindChildren", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], paginate: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginate", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], perPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "perPage", required: false }] }, { type: i0.Output, args: ["perPageChange"] }], perPageOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "perPageOptions", required: false }] }], totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: false }] }, { type: i0.Output, args: ["totalItemsChange"] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], dragGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragGroup", required: false }] }], sortDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortDisabled", required: false }] }], keyboardSortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyboardSortable", required: false }] }], sorted: [{ type: i0.Output, args: ["sorted"] }], options: [{
3098
3098
  type: Input
3099
3099
  }], items: [{
@@ -4634,7 +4634,7 @@ class TableComponent {
4634
4634
  useExisting: forwardRef(() => TableComponent),
4635
4635
  multi: true
4636
4636
  }
4637
- ], queries: [{ propertyName: "templateRow", first: true, predicate: PaginableTableRowDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerTpts", predicate: PaginableTableHeaderDirective, isSignal: true }, { propertyName: "templateCells", predicate: PaginableTableCellDirective, isSignal: true }, { propertyName: "noResultsTpt", first: true, predicate: PaginableNoResultsDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "loadingTpt", first: true, predicate: PaginableLoadingDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "errorTpt", first: true, predicate: PaginableErrorDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "templateExpandingRows", predicate: PaginableTableExpandingRowDirective, isSignal: true }, { propertyName: "filterTpts", predicate: PaginableTableFilterDirective, isSignal: true }], viewQueries: [{ propertyName: "dropdownComponents", predicate: DropdownComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (batchActions().length || searchable() || headerFilters().length) {\n\t<div class=\"hub-table__top-bar\">\n\t\t@if (batchActions().length) {\n\t\t\t<div class=\"hub-table__batch-actions\">\n\t\t\t\t@for (button of batchActions(); track $index) {\n\t\t\t\t\t@if ($any(button).buttons?.length) {\n\t\t\t\t\t\t<hub-table-dropdown\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-dropdown\"\n\t\t\t\t\t\t\t[options]=\"$any(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(button)\"\n\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (button.icon) {\n\t\t\t\t\t\t\t\t<i class=\"hub-table__batch-actions-btn-icon {{ button.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (button.title) {\n\t\t\t\t\t\t\t\t<span class=\"hub-table__batch-actions-btn-title\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (searchable()) {\n\t\t\t<div class=\"hub-table__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (headerFilters().length) {\n\t\t\t<div class=\"hub-table__delete-filters\">\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"hub-table__delete-filters-btn btn btn-outline-danger\"\n\t\t\t\t\t(click)=\"clearFilters()\"\n\t\t\t\t\t[disabled]=\"filterLoading\"\n\t\t\t\t>\n\t\t\t\t\t<i class=\"hub-table__delete-filters-icon hub-table__icon hub-table__icon--eraser\"></i>\n\t\t\t\t\t{{ 'CLEAN_FILTERS' | translate | ucfirst }}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n<div class=\"hub-table__container {{ responsiveCSSClass() }}\" [class.hub-table__responsive]=\"responsiveCSSClass()\">\n\t@let striped = options().striped;\n\t<table\n\t\tclass=\"hub-table__element\"\n\t\t[class.hub-table__hover]=\"(options().hoverableRows || selectable()) && !loading()\"\n\t\t[class.hub-table__striped-odd]=\"striped === 'rows-odd'\"\n\t\t[class.hub-table__striped-even]=\"striped === 'rows-even'\"\n\t\t[class.hub-table__striped-columns-odd]=\"striped === 'columns-odd'\"\n\t\t[class.hub-table__striped-columns-even]=\"striped === 'columns-even'\"\n\t\t[class.hub-table__selectable]=\"selectable()\"\n\t\t[class.hub-table__scrollable]=\"options().scrollable\"\n\t\t[ngClass]=\"options().variant ? 'hub-table__' + options().variant : null\"\n\t>\n\t\t<thead class=\"hub-table__head\" [formGroup]=\"filtersFG\">\n\t\t\t<tr class=\"hub-table__head-row\">\n\t\t\t\t@if (selectable()) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--actions sticky-start\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t[(ngModel)]=\"allRowsSelected\"\n\t\t\t\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t\t\t\t(click)=\"toggleAll()\"\n\t\t\t\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t</th>\n\t\t\t\t}\n\t\t\t\t@for (header of fixedHeaders(); track header.property) {\n\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t<th\n\t\t\t\t\t\t\tclass=\"hub-table__header-cell\"\n\t\t\t\t\t\t\tresizable\n\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"hub-table__header-cell-content d-flex flex-nowrap align-items-center justify-content-between gap-2\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getHeaderTemplate(header) || defaultHeaderTpt\"\n\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\theader,\n\t\t\t\t\t\t\t\t\t\tproperty: header | get: header.property\n\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t@if (header.sortable || header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t<div class=\"hub-table__header-cell-actions d-flex gap-2 ms-auto align-items-center\">\n\t\t\t\t\t\t\t\t\t\t<button class=\"hub-table__sort-btn btn\" (click)=\"sort(header)\">\n\t\t\t\t\t\t\t\t\t\t\t@if (header.sortable) {\n\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__sort-icon hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"getOrdenationClass(header)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t@if (header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t\t\t<hub-dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t#dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t(open)=\"onDropdownFilterOpened($event)\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button button\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[class.hub-table__filter-button--active]=\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button-icon hub-table__icon hub-table__icon--filter\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t@if (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tas rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@if (rules.length) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"hub-table__filter-count\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{{ rules.length }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t@if (dropdown.isOpened()) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<menu-filter\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown-content content\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[header]=\"header\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[formControlName]=\"header.filter.key || header.property\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</menu-filter>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t</hub-dropdown>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--expander sticky-end\"></th>\n\t\t\t\t}\n\t\t\t</tr>\n\n\t\t\t<!-- Filtering -->\n\t\t\t@if (hasColumnFilters()) {\n\t\t\t\t<tr class=\"hub-table__filter-row\">\n\t\t\t\t\t@if (selectable() || batchActions.length) {\n\t\t\t\t\t\t<th class=\"hub-table__filter-cell sticky-start\"></th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (header of fixedHeaders(); track $index; let last = $last) {\n\t\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t\t@let formControlName = header.filter?.key || header.property;\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\tclass=\"hub-table__filter-cell\"\n\t\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@if (header.filter && header.filter.mode !== 'menu' && filtersFG.get(formControlName)) {\n\t\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getFilterTemplate(header) || defaultFilterTpt\"\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\t\t\t\t\tformControl: filtersFG.get(formControlName)\n\t\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</thead>\n\t\t<tbody class=\"hub-table__body\">\n\t\t\t@if (loading()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (error()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t\t\t\t[context]=\"{ error: error(), colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (rows().length) {\n\t\t\t\t@for (item of rows(); track $index) {\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"templateRow() || defaultRowTemplate\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t}\n\t\t\t} @else {\n\t\t\t\t<tr>\n\t\t\t\t\t<td [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount(), filters: filters() ?? undefined }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</tbody>\n\t</table>\n</div>\n\n<!-- Pagination -->\n@if (page() !== undefined && page() !== null) {\n\t<div class=\"hub-table__bottom-bar\">\n\t\t@if (paginationPosition() == 'bottom' || paginationPosition() === 'both') {\n\t\t\t<hub-paginator\n\t\t\t\tclass=\"hub-table__paginator hub-table__bottom-bar-paginator\"\n\t\t\t\t[(page)]=\"$any(page)\"\n\t\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t\t[rtl]=\"isRtl()\"\n\t\t\t>\n\t\t\t</hub-paginator>\n\t\t}\n\t\t<div class=\"hub-table__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"perPage.set($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t@if (totalItems() !== null && totalItems() !== undefined) {\n\t\t\t<p class=\"hub-table__bottom-bar-info hub-paginator__info\">\n\t\t\t\t{{\n\t\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t\t| translate\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\tamount: rows().length,\n\t\t\t\t\t\t\t\t\ttotal: totalItems()\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t| ucfirst\n\t\t\t\t}}\n\t\t\t</p>\n\t\t}\n\t</div>\n}\n<ng-template #defaultRowTemplate let-item>\n\t<tr\n\t\tclass=\"hub-table__body-row\"\n\t\t(click)=\"onItemClick($event, item)\"\n\t\t[class.hub-table__body-row--selected]=\"selectable() && item.selected\"\n\t\t[class.hub-table__body-row--clickable]=\"clickFn()\"\n\t\t[ngClass]=\"_getRowClass(item)\"\n\t>\n\t\t@if (selectable() || batchActions.length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--select sticky-start\">\n\t\t\t\t<input\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t[(ngModel)]=\"item.selected\"\n\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t(click)=\"$event.stopPropagation(); toggle(item)\"\n\t\t\t\t/>\n\t\t\t</td>\n\t\t}\n\t\t@for (header of fixedHeaders(); track $index) {\n\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t<td\n\t\t\t\t\tclass=\"hub-table__cell\"\n\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t[style.width]=\"header.buttons?.length ? '0' : 'auto'\"\n\t\t\t\t>\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"getCellTemplate(header) || defaultCellTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\titem: item.data,\n\t\t\t\t\t\t\trow: item,\n\t\t\t\t\t\t\tproperty: item.data | get: header.property\n\t\t\t\t\t\t}\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</td>\n\t\t\t}\n\t\t}\n\t\t@if (templateExpandingRows().length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--expander sticky-end\" [class.sticky-end]=\"stickyActions()\">\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<button (click)=\"toggleExpandedRow(item)\" type=\"button\" class=\"hub-table__expander-btn btn btn-link px-2\">\n\t\t\t\t\t\t<i\n\t\t\t\t\t\t\tclass=\"hub-table__expander-icon hub-table__icon\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-up]=\"!item.collapsed\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-down]=\"item.collapsed\"\n\t\t\t\t\t\t></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</td>\n\t\t}\n\t\t<!-- <td *ngIf=\"!lastColumnOnlyHasButtons && filterHeaders?.length\"></td> -->\n\t</tr>\n\t@if (!item.collapsed) {\n\t\t@for (template of templateExpandingRows(); track template) {\n\t\t\t<ng-container [ngTemplateOutlet]=\"template.templateRef\" [ngTemplateOutletContext]=\"{ item: item }\"> </ng-container>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-table__no-data alert alert-info d-flex align-items-center m-4\" role=\"alert\">\n\t\t<i class=\"hub-table__no-data-icon hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-table__loading\">\n\t\t<svg\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\txmlns:xlink=\"http://www.w3.org/1999/xlink\"\n\t\t\tstyle=\"margin: auto; background: #fff; display: block\"\n\t\t\twidth=\"200px\"\n\t\t\theight=\"200px\"\n\t\t\tviewBox=\"0 0 100 100\"\n\t\t\tpreserveAspectRatio=\"xMidYMid\"\n\t\t>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#cccccc\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#333333\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t</svg>\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-table__error m-4 p-4 text-center text-danger\">\n\t\t<svg\n\t\t\taria-hidden=\"true\"\n\t\t\tfocusable=\"false\"\n\t\t\tdata-prefix=\"fal\"\n\t\t\tdata-icon=\"sad-tear\"\n\t\t\trole=\"img\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tviewBox=\"0 0 496 512\"\n\t\t\tstyle=\"height: 64px\"\n\t\t>\n\t\t\t<path\n\t\t\t\tfill=\"#dc3545\"\n\t\t\t\td=\"M168 240c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zm160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zM248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 464c-119.1 0-216-96.9-216-216S128.9 40 248 40s216 96.9 216 216-96.9 216-216 216zm0-152c-11.2 0-22 1.7-32.7 4.1-7.2-12.6-16.1-26.5-28.1-42.4-9-12.1-29.4-12-38.4 0-29.7 39.6-44.8 69-44.8 87.3 0 34.7 28.7 63 64 63s64-28.3 64-63c0-4.4-1-9.5-2.7-15.1 6.1-1.2 12.3-1.9 18.7-1.9 34.9 0 67.8 15.4 90.2 42.2 5.3 6.4 15.4 8 22.5 2 6.8-5.7 7.7-15.8 2-22.5C334.2 339.6 292.4 320 248 320zm-80 80c-17.7 0-32-13.9-32-31 0-7.7 10-28.8 32-59.5 22 30.7 32 51.8 32 59.5 0 17.1-14.3 31-32 31z\"\n\t\t\t\tclass=\"\"\n\t\t\t></path>\n\t\t</svg>\n\t\t<p>{{ 'ERROR_OCURRED' | translate }}</p>\n\t</div>\n</ng-template>\n\n<ng-template #defaultHeaderTpt let-header=\"header\" let-property=\"property\">\n\t@if (header.icon) {\n\t\t<i class=\"hub-table__header-icon {{ header.icon }}\" aria-hidden=\"true\"></i>\n\t}\n\t<div\n\t\tclass=\"hub-table__header-title\"\n\t\t[class.me-auto]=\"header.align === 'start'\"\n\t\t[class.ms-auto]=\"header.align === 'end'\"\n\t\t[class.mx-auto]=\"header.align === 'center'\"\n\t>\n\t\t@if (header.title) {\n\t\t\t<span class=\"hub-table__header-title-text text-wrap\">{{ header.title ?? header.property | unwrapAsync }}</span>\n\t\t}\n\t</div>\n</ng-template>\n\n<ng-template #defaultFilterTpt let-header=\"header\" let-formControl=\"formControl\">\n\t@switch (header.filter.type) {\n\t\t@case ('dropdown') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t@if (header.filter.placeholder) {\n\t\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t\t{{ header.filter.placeholder }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t\t@if (header.filter.options | isObservable) {\n\t\t\t\t\t@let options = header.filter.options | async;\n\t\t\t\t\t@for (option of $any(options); track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t} @else {\n\t\t\t\t\t@for (option of header.filter.options; track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</select>\n\t\t}\n\t\t@case ('number-range') {\n\t\t\t<hub-table-range-input type=\"number\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('date-range') {\n\t\t\t<hub-table-range-input type=\"date\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('boolean') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t{{ header.filter.placeholder ?? 'SELECT_ONE' | translate | ucfirst }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"true\">\n\t\t\t\t\t{{ header.filter.trueLabel ?? ('TRUE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"false\">\n\t\t\t\t\t{{ header.filter.falseLabel ?? ('FALSE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t</select>\n\t\t}\n\t\t@default {\n\t\t\t<input\n\t\t\t\t[type]=\"header.filter.type\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\tclass=\"form-control\"\n\t\t\t\t[placeholder]=\"header.filter.placeholder || ''\"\n\t\t\t/>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultCellTpt let-property=\"property\" let-item=\"item\" let-row=\"row\" let-header=\"header\">\n\t@if (header.buttons) {\n\t\t<div class=\"hub-table__cell-buttons d-flex flex-nowrap gap-2 justify-content-end align-items-center\">\n\t\t\t@for (button of header.buttons; track button) {\n\t\t\t\t@if (button.buttons) {\n\t\t\t\t\t<hub-table-dropdown [options]=\"button\" [row]=\"row\" class=\"hub-table__cell-dropdown d-inline-block\">\n\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t} @else {\n\t\t\t\t\t@if (!(isHidden(button, row) | async)) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"hub-table__cell-btn\"\n\t\t\t\t\t\t\t[attr.title]=\"button.tooltip | unwrapAsync\"\n\t\t\t\t\t\t\t(click)=\"handleAction($event, button, row)\"\n\t\t\t\t\t\t\t[ngClass]=\"getRowActionClassList(button)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"hub-table__cell-btn-content d-flex flex-nowrap align-items-center gap-1\">\n\t\t\t\t\t\t\t\t<ng-hub-ui-icon [config]=\"button.icon\"></ng-hub-ui-icon>\n\t\t\t\t\t\t\t\t@if (button.label) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.label | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t} @else if (button.title) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t</div>\n\t} @else {\n\t\t<span class=\"hub-table__cell-value\">{{ property }}</span>\n\t}\n</ng-template>\n", styles: [":root,:host{--hub-table-container-bg: var(--hub-ref-color-white, #fff);--hub-table-container-color: var(--hub-sys-text-primary, #212529);--hub-table-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-border-radius: var(--hub-ref-radius-md, .375rem);--hub-table-border-width: var(--hub-ref-border-width, 1px);--hub-table-container-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-justify-content: end;--hub-table-top-bar-align-items: center;--hub-table-top-bar-wrap: wrap;--hub-table-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-table-batch-actions-margin-inline-end: auto;--hub-table-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-bottom-bar-justify-content: space-around;--hub-table-bottom-bar-align-items: center;--hub-table-bottom-bar-wrap: wrap;--hub-table-bottom-bar-paginator-order: 1;--hub-table-bottom-bar-settings-order: 2;--hub-table-bottom-bar-info-order: 3;--hub-table-bottom-bar-paginator-flex: 0 0 auto;--hub-table-bottom-bar-settings-flex: 0 0 auto;--hub-table-bottom-bar-info-flex: 0 0 auto;--hub-table-icon-color: currentColor;--hub-table-icon-size: 1em;--hub-table-icon-sort: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z'/%3E%3C/svg%3E\");--hub-table-icon-sort-up: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");--hub-table-icon-sort-down: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");--hub-table-accent-bg: transparent;--hub-table-active-bg: var(--hub-sys-state-active-bg, rgba(0, 0, 0, .1));--hub-table-active-color: var(--hub-sys-text-primary, #212529);--hub-table-accent: var(--hub-sys-color-primary, #0d6efd);--hub-table-accent-subtle: color-mix(in srgb, var(--hub-table-accent) 12%, var(--hub-sys-surface-page, #ffffff));--hub-table-selected-bg: var(--hub-table-accent-subtle);--hub-table-selected-color: var(--hub-sys-text-primary, #212529);--hub-table-bg: var(--hub-ref-color-white, #fff);--hub-table-bg-state: initial;--hub-table-bg-type: initial;--hub-table-cell-padding-x: var(--hub-ref-space-3, 1rem);--hub-table-cell-padding-x-sm: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y-sm: var(--hub-ref-space-1, .25rem);--hub-table-cell-vertical-align: middle;--hub-table-color: var(--hub-sys-text-primary, #212529);--hub-table-color-state: initial;--hub-table-color-type: initial;--hub-table-group-separator-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-search-button-bg: var(--hub-table-container-bg);--hub-table-search-button-border-color: var(--hub-table-border-color);--hub-table-search-button-color: var(--hub-table-container-color);--hub-table-search-button-min-width: 2.75rem;--hub-table-search-input-bg: var(--hub-table-container-bg);--hub-table-search-input-border-color: var(--hub-table-border-color);--hub-table-search-input-color: var(--hub-table-container-color);--hub-table-search-border-width: var(--hub-table-border-width);--hub-table-search-border-radius: var(--hub-table-border-radius);--hub-table-search-input-padding-x: .75rem;--hub-table-search-input-padding-y: .375rem;--hub-table-search-input-font-size: 1rem;--hub-table-filter-button-active-bg: color-mix(in srgb, var(--hub-sys-color-success, #198754) 10%, transparent);--hub-table-filter-button-active-border-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-hover-bg: rgba(0, 0, 0, .05);--hub-table-filter-button-icon-active-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-icon-color: var(--hub-sys-text-muted, #6c757d);--hub-table-filter-button-gap: var(--hub-ref-space-2, .5rem);--hub-table-filter-button-padding-x: .75rem;--hub-table-filter-button-padding-y: .375rem;--hub-table-filter-button-border-width: 1px;--hub-table-filter-button-border-color: transparent;--hub-table-filter-button-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-table-filter-button-transition: all .2s ease;--hub-table-filter-count-bg: var(--hub-sys-color-success, #198754);--hub-table-filter-count-color: var(--hub-ref-color-white, #fff);--hub-table-filter-count-size: 1.25rem;--hub-table-filter-count-padding-x: .4em;--hub-table-filter-count-font-size: .7rem;--hub-table-filter-count-font-weight: var(--hub-ref-font-weight-bold, 700);--hub-table-filter-count-border-radius: var(--hub-ref-radius-pill, 50rem);--hub-table-batch-actions-btn-icon-gap: var(--hub-ref-space-1, .25rem);--hub-table-hover-bg: var(--hub-sys-state-hover-bg, rgba(0, 0, 0, .075));--hub-table-hover-color: var(--hub-sys-text-primary, #212529);--hub-table-striped-bg: var(--hub-sys-state-striped-bg, rgba(0, 0, 0, .05));--hub-table-striped-color: var(--hub-sys-text-primary, #212529)}:host{display:flex;flex-direction:column;gap:var(--hub-table-container-gap);min-width:0;color:var(--hub-table-container-color)}:host .hub-table__top-bar{display:flex;justify-content:var(--hub-table-top-bar-justify-content);align-items:var(--hub-table-top-bar-align-items);flex-wrap:var(--hub-table-top-bar-wrap);gap:var(--hub-table-top-bar-gap)}:host .hub-table__batch-actions{display:flex;align-items:center;gap:var(--hub-table-batch-actions-gap);margin-inline-end:var(--hub-table-batch-actions-margin-inline-end)}:host .hub-table__batch-actions-btn-icon{margin-right:var(--hub-table-batch-actions-btn-icon-gap)}:host .hub-table__batch-actions-btn--default,:host .hub-table__cell-btn--default{border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius)}:host .hub-table__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}:host .hub-table__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-table-search-input-padding-y) var(--hub-table-search-input-padding-x);font-size:var(--hub-table-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);color:var(--hub-table-search-input-color);appearance:none;background-color:var(--hub-table-search-input-bg);background-clip:padding-box;border:var(--hub-table-search-border-width) solid var(--hub-table-search-input-border-color);border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}:host .hub-table__search-button{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-search-button-min-width);color:var(--hub-table-search-button-color);background-color:var(--hub-table-search-button-bg);border-color:var(--hub-table-search-button-border-color);border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host .hub-table__bottom-bar{display:flex;justify-content:var(--hub-table-bottom-bar-justify-content);align-items:var(--hub-table-bottom-bar-align-items);flex-wrap:var(--hub-table-bottom-bar-wrap);gap:var(--hub-table-bottom-bar-gap)}:host .hub-table__bottom-bar-paginator{order:var(--hub-table-bottom-bar-paginator-order);flex:var(--hub-table-bottom-bar-paginator-flex)}:host .hub-table__bottom-bar-settings{order:var(--hub-table-bottom-bar-settings-order);flex:var(--hub-table-bottom-bar-settings-flex);margin:0}:host .hub-table__bottom-bar-info{order:var(--hub-table-bottom-bar-info-order);flex:var(--hub-table-bottom-bar-info-flex);margin:0}:host .hub-table__paginator{overflow:auto;margin:0}:host .hub-table__filter-button{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-table-filter-button-gap);padding:var(--hub-table-filter-button-padding-y) var(--hub-table-filter-button-padding-x);cursor:pointer;border:var(--hub-table-filter-button-border-width) solid var(--hub-table-filter-button-border-color);border-radius:var(--hub-table-filter-button-border-radius);transition:var(--hub-table-filter-button-transition)}:host .hub-table__filter-button:hover{background-color:var(--hub-table-filter-button-hover-bg)}:host .hub-table__filter-button--active{background-color:var(--hub-table-filter-button-active-bg);border-color:var(--hub-table-filter-button-active-border-color)}:host .hub-table__filter-button--active .hub-table__filter-button-icon{color:var(--hub-table-filter-button-icon-active-color)}:host .hub-table__filter-button-icon{transition:color .2s ease;color:var(--hub-table-filter-button-icon-color)}:host .hub-table__filter-count{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-filter-count-size);height:var(--hub-table-filter-count-size);padding:0 var(--hub-table-filter-count-padding-x);font-size:var(--hub-table-filter-count-font-size);font-weight:var(--hub-table-filter-count-font-weight);line-height:1;color:var(--hub-table-filter-count-color);text-align:center;white-space:nowrap;background-color:var(--hub-table-filter-count-bg);border-radius:var(--hub-table-filter-count-border-radius);animation:badge-appear .2s ease}:host .hub-table__no-data-icon{margin-right:1.5rem}:host .hub-table__header-icon{margin-right:.5rem}:host .hub-table__icon{display:inline-block;width:var(--hub-table-icon-size);height:var(--hub-table-icon-size);background-color:var(--hub-table-icon-color);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;vertical-align:middle}:host .hub-table__icon--xs{--hub-table-icon-size: .75em}:host .hub-table__icon--sm{--hub-table-icon-size: .875em}:host .hub-table__icon--lg{--hub-table-icon-size: 1.33em}:host .hub-table__icon--2x{--hub-table-icon-size: 2em}:host .hub-table__icon--3x{--hub-table-icon-size: 3em}:host .hub-table__icon--4x{--hub-table-icon-size: 4em}:host .hub-table__icon--5x{--hub-table-icon-size: 5em}:host .hub-table__icon--search{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}:host .hub-table__icon--filter{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\")}:host .hub-table__icon--eraser{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\")}:host .hub-table__icon--info{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");margin-right:1.5rem}:host .hub-table__icon--sort{-webkit-mask-image:var(--hub-table-icon-sort);mask-image:var(--hub-table-icon-sort)}:host .hub-table__icon--sort-up{-webkit-mask-image:var(--hub-table-icon-sort-up);mask-image:var(--hub-table-icon-sort-up)}:host .hub-table__icon--sort-down{-webkit-mask-image:var(--hub-table-icon-sort-down);mask-image:var(--hub-table-icon-sort-down)}:host .hub-table__icon--caret-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--caret-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--ellipsis-v{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--trash{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__icon--plus{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__container{overflow:auto;background-color:var(--hub-table-container-bg);border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius);color:var(--hub-table-container-color)}:host .hub-table__element{position:relative;width:100%;border-collapse:collapse;border-spacing:0;vertical-align:var(--hub-table-cell-vertical-align);border-color:var(--hub-table-border-color);background-color:var(--hub-table-bg);color:var(--hub-table-color)}:host .hub-table__element .sticky-start{background-color:var(--hub-table-bg);left:0;position:sticky;z-index:9}:host .hub-table__element .sticky-end{background-color:var(--hub-table-bg);right:0;position:sticky;z-index:9}:host .hub-table__element .clickable-item{cursor:pointer}:host .hub-table__element>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y) var(--hub-table-cell-padding-x);vertical-align:var(--hub-table-cell-vertical-align);color:var(--hub-table-color-state, var(--hub-table-color-type, var(--hub-table-color)));background-color:var(--hub-table-bg);border-bottom-style:solid;border-bottom-color:var(--hub-table-border-color);border-bottom-width:var(--hub-table-border-width);box-shadow:inset 0 0 0 9999px var(--hub-table-bg-state, var(--hub-table-bg-type, var(--hub-table-accent-bg)))}:host .hub-table__element>tbody{vertical-align:inherit}:host .hub-table__element>thead{vertical-align:bottom}:host .hub-table__scrollable thead{position:sticky;top:0;z-index:10}:host .hub-table__group-divider{border-top:calc(var(--hub-table-border-width) * 2) solid var(--hub-table-group-separator-color)}:host .hub-table__sm>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y-sm) var(--hub-table-cell-padding-x-sm)}:host .hub-table__bordered>:not(caption)>*{border-style:solid;border-width:var(--hub-table-border-width) 0}:host .hub-table__bordered>:not(caption)>*>*{border-style:solid;border-width:0 var(--hub-table-border-width)}:host .hub-table__borderless>:not(caption)>*>*{border-bottom-width:0}:host .hub-table__borderless>:not(:first-child){border-top-width:0}:host .hub-table__striped-odd>tbody>tr:nth-of-type(odd)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-even>tbody>tr:nth-of-type(2n)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-odd>:not(caption)>tr>:nth-child(odd){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-even>:not(caption)>tr>:nth-child(2n){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__active{--hub-table-color-state: var(--hub-table-active-color);--hub-table-bg-state: var(--hub-table-active-bg)}:host .hub-table__hover>tbody>tr:hover>*{--hub-table-color-state: var(--hub-table-hover-color);--hub-table-bg-state: var(--hub-table-hover-bg)}:host .hub-table__body-row--selected>*,:host .hub-table__hover>tbody>tr.hub-table__body-row--selected:hover>*{--hub-table-color-state: var(--hub-table-selected-color);--hub-table-bg-state: var(--hub-table-selected-bg)}:host .hub-table__responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.hub-table__primary{--hub-table-accent: var(--hub-sys-color-primary)}.hub-table__success{--hub-table-accent: var(--hub-sys-color-success)}.hub-table__danger{--hub-table-accent: var(--hub-sys-color-danger)}.hub-table__warning{--hub-table-accent: var(--hub-sys-color-warning)}.hub-table__info{--hub-table-accent: var(--hub-sys-color-info)}:host.hub-table--rtl{direction:rtl}:host.hub-table--rtl .hub-table__top-bar{direction:ltr}:host.hub-table--rtl .hub-table__batch-actions{order:2;flex-direction:row-reverse;margin-inline-end:0;margin-inline-start:auto}:host.hub-table--rtl .hub-table__batch-actions-btn-icon{margin-right:0;margin-left:var(--hub-table-batch-actions-btn-icon-gap)}:host.hub-table--rtl .hub-table__search{order:1;margin-inline-end:auto;margin-inline-start:0;direction:ltr}:host.hub-table--rtl .hub-table__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host.hub-table--rtl .hub-table__search-button{border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius)}:host.hub-table--rtl .hub-table__no-data-icon{margin-right:0;margin-left:1.5rem}:host.hub-table--rtl .hub-table__header-icon{margin-right:0;margin-left:.5rem}.caption-top{caption-side:top}@media(max-width:576px){.hub-table__responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:768px){.hub-table__responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:992px){.hub-table__responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1200px){.hub-table__responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1400px){.hub-table__responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@keyframes badge-appear{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PaginableTableDropdownComponent, selector: "hub-table-dropdown, paginable-table-dropdown", inputs: ["row", "options", "appendTo", "disabled"] }, { kind: "component", type: PaginatorComponent, selector: "hub-paginator, paginable-table-paginator", inputs: ["rtl", "page", "numberOfPages"], outputs: ["pageChange"] }, { kind: "component", type: DropdownComponent, selector: "hub-dropdown, hub-ui-dropdown", inputs: ["id"], outputs: ["open", "close"] }, { kind: "component", type: MenuFilterComponent, selector: "menu-filter", inputs: ["header"] }, { kind: "component", type: HubIconComponent, selector: "hub-icon, ng-hub-ui-icon", inputs: ["config"] }, { kind: "component", type: PaginableTableRangeInputComponent, selector: "hub-table-range-input, paginable-table-range-input", inputs: ["type"] }, { kind: "component", type: PaginableStateOutlet, selector: "hub-state-outlet", inputs: ["template", "instanceDefault", "globalDefault", "fallback", "context"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UcfirstPipe, name: "ucfirst" }, { kind: "pipe", type: UnwrapAsyncPipe, name: "unwrapAsync" }, { kind: "pipe", type: IsObservablePipe, name: "isObservable" }, { kind: "pipe", type: GetPipe, name: "get" }], animations: [
4637
+ ], queries: [{ propertyName: "templateRow", first: true, predicate: PaginableTableRowDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerTpts", predicate: PaginableTableHeaderDirective, isSignal: true }, { propertyName: "templateCells", predicate: PaginableTableCellDirective, isSignal: true }, { propertyName: "noResultsTpt", first: true, predicate: PaginableNoResultsDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "loadingTpt", first: true, predicate: PaginableLoadingDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "errorTpt", first: true, predicate: PaginableErrorDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "templateExpandingRows", predicate: PaginableTableExpandingRowDirective, isSignal: true }, { propertyName: "filterTpts", predicate: PaginableTableFilterDirective, isSignal: true }], viewQueries: [{ propertyName: "dropdownComponents", predicate: DropdownComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (batchActions().length || searchable() || headerFilters().length) {\n\t<div class=\"hub-table__top-bar\">\n\t\t@if (batchActions().length) {\n\t\t\t<div class=\"hub-table__batch-actions\">\n\t\t\t\t@for (button of batchActions(); track $index) {\n\t\t\t\t\t@if ($any(button).buttons?.length) {\n\t\t\t\t\t\t<hub-table-dropdown\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-dropdown\"\n\t\t\t\t\t\t\t[options]=\"$any(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(button)\"\n\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (button.icon) {\n\t\t\t\t\t\t\t\t<i class=\"hub-table__batch-actions-btn-icon {{ button.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (button.title) {\n\t\t\t\t\t\t\t\t<span class=\"hub-table__batch-actions-btn-title\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (searchable()) {\n\t\t\t<div class=\"hub-table__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (headerFilters().length) {\n\t\t\t<div class=\"hub-table__delete-filters\">\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"hub-table__delete-filters-btn btn btn-outline-danger\"\n\t\t\t\t\t(click)=\"clearFilters()\"\n\t\t\t\t\t[disabled]=\"filterLoading\"\n\t\t\t\t>\n\t\t\t\t\t<i class=\"hub-table__delete-filters-icon hub-table__icon hub-table__icon--eraser\"></i>\n\t\t\t\t\t{{ 'CLEAN_FILTERS' | translate | ucfirst }}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n<div class=\"hub-table__container {{ responsiveCSSClass() }}\" [class.hub-table__responsive]=\"responsiveCSSClass()\">\n\t@let striped = options().striped;\n\t<table\n\t\tclass=\"hub-table__element\"\n\t\t[class.hub-table__hover]=\"(options().hoverableRows || selectable()) && !loading()\"\n\t\t[class.hub-table__striped-odd]=\"striped === 'rows-odd'\"\n\t\t[class.hub-table__striped-even]=\"striped === 'rows-even'\"\n\t\t[class.hub-table__striped-columns-odd]=\"striped === 'columns-odd'\"\n\t\t[class.hub-table__striped-columns-even]=\"striped === 'columns-even'\"\n\t\t[class.hub-table__selectable]=\"selectable()\"\n\t\t[class.hub-table__scrollable]=\"options().scrollable\"\n\t\t[ngClass]=\"options().variant ? 'hub-table__' + options().variant : null\"\n\t>\n\t\t<thead class=\"hub-table__head\" [formGroup]=\"filtersFG\">\n\t\t\t<tr class=\"hub-table__head-row\">\n\t\t\t\t@if (selectable()) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--actions sticky-start\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t[(ngModel)]=\"allRowsSelected\"\n\t\t\t\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t\t\t\t(click)=\"toggleAll()\"\n\t\t\t\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t</th>\n\t\t\t\t}\n\t\t\t\t@for (header of fixedHeaders(); track header.property) {\n\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t<th\n\t\t\t\t\t\t\tclass=\"hub-table__header-cell\"\n\t\t\t\t\t\t\tresizable\n\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"hub-table__header-cell-content d-flex flex-nowrap align-items-center justify-content-between gap-2\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getHeaderTemplate(header) || defaultHeaderTpt\"\n\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\theader,\n\t\t\t\t\t\t\t\t\t\tproperty: header | get: header.property\n\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t@if (header.sortable || header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t<div class=\"hub-table__header-cell-actions d-flex gap-2 ms-auto align-items-center\">\n\t\t\t\t\t\t\t\t\t\t<button class=\"hub-table__sort-btn btn\" (click)=\"sort(header)\">\n\t\t\t\t\t\t\t\t\t\t\t@if (header.sortable) {\n\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__sort-icon hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"getOrdenationClass(header)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t@if (header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t\t\t<hub-dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t#dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t(open)=\"onDropdownFilterOpened($event)\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button button\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[class.hub-table__filter-button--active]=\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button-icon hub-table__icon hub-table__icon--filter\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t@if (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tas rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@if (rules.length) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"hub-table__filter-count\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{{ rules.length }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t@if (dropdown.isOpened()) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<menu-filter\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown-content content\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[header]=\"header\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[formControlName]=\"header.filter.key || header.property\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</menu-filter>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t</hub-dropdown>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--expander sticky-end\"></th>\n\t\t\t\t}\n\t\t\t</tr>\n\n\t\t\t<!-- Filtering -->\n\t\t\t@if (hasColumnFilters()) {\n\t\t\t\t<tr class=\"hub-table__filter-row\">\n\t\t\t\t\t@if (selectable() || batchActions.length) {\n\t\t\t\t\t\t<th class=\"hub-table__filter-cell sticky-start\"></th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (header of fixedHeaders(); track $index; let last = $last) {\n\t\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t\t@let formControlName = header.filter?.key || header.property;\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\tclass=\"hub-table__filter-cell\"\n\t\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@if (header.filter && header.filter.mode !== 'menu' && filtersFG.get(formControlName)) {\n\t\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getFilterTemplate(header) || defaultFilterTpt\"\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\t\t\t\t\tformControl: filtersFG.get(formControlName)\n\t\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</thead>\n\t\t<tbody class=\"hub-table__body\">\n\t\t\t@if (loading()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (error()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t\t\t\t[context]=\"{ error: error(), colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (rows().length) {\n\t\t\t\t@for (item of rows(); track $index) {\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"templateRow() || defaultRowTemplate\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t}\n\t\t\t} @else {\n\t\t\t\t<tr>\n\t\t\t\t\t<td [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount(), filters: filters() ?? undefined }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</tbody>\n\t</table>\n</div>\n\n<!-- Pagination -->\n@if (page() !== undefined && page() !== null) {\n\t<div class=\"hub-table__bottom-bar\">\n\t\t@if (paginationPosition() == 'bottom' || paginationPosition() === 'both') {\n\t\t\t<hub-paginator\n\t\t\t\tclass=\"hub-table__paginator hub-table__bottom-bar-paginator\"\n\t\t\t\t[(page)]=\"$any(page)\"\n\t\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t\t[rtl]=\"isRtl()\"\n\t\t\t>\n\t\t\t</hub-paginator>\n\t\t}\n\t\t<div class=\"hub-table__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"perPage.set($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t@if (totalItems() !== null && totalItems() !== undefined) {\n\t\t\t<p class=\"hub-table__bottom-bar-info hub-paginator__info\">\n\t\t\t\t{{\n\t\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t\t| translate\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\tamount: rows().length,\n\t\t\t\t\t\t\t\t\ttotal: totalItems()\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t| ucfirst\n\t\t\t\t}}\n\t\t\t</p>\n\t\t}\n\t</div>\n}\n<ng-template #defaultRowTemplate let-item>\n\t<tr\n\t\tclass=\"hub-table__body-row\"\n\t\t(click)=\"onItemClick($event, item)\"\n\t\t[class.hub-table__body-row--selected]=\"selectable() && item.selected\"\n\t\t[class.hub-table__body-row--clickable]=\"clickFn()\"\n\t\t[ngClass]=\"_getRowClass(item)\"\n\t>\n\t\t@if (selectable() || batchActions.length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--select sticky-start\">\n\t\t\t\t<input\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t[(ngModel)]=\"item.selected\"\n\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t(click)=\"$event.stopPropagation(); toggle(item)\"\n\t\t\t\t/>\n\t\t\t</td>\n\t\t}\n\t\t@for (header of fixedHeaders(); track $index) {\n\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t<td\n\t\t\t\t\tclass=\"hub-table__cell\"\n\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t[style.width]=\"header.buttons?.length ? '0' : 'auto'\"\n\t\t\t\t>\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"getCellTemplate(header) || defaultCellTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\titem: item.data,\n\t\t\t\t\t\t\trow: item,\n\t\t\t\t\t\t\tproperty: item.data | get: header.property\n\t\t\t\t\t\t}\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</td>\n\t\t\t}\n\t\t}\n\t\t@if (templateExpandingRows().length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--expander sticky-end\" [class.sticky-end]=\"stickyActions()\">\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<button (click)=\"toggleExpandedRow(item)\" type=\"button\" class=\"hub-table__expander-btn btn btn-link px-2\">\n\t\t\t\t\t\t<i\n\t\t\t\t\t\t\tclass=\"hub-table__expander-icon hub-table__icon\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-up]=\"!item.collapsed\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-down]=\"item.collapsed\"\n\t\t\t\t\t\t></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</td>\n\t\t}\n\t\t<!-- <td *ngIf=\"!lastColumnOnlyHasButtons && filterHeaders?.length\"></td> -->\n\t</tr>\n\t@if (!item.collapsed) {\n\t\t@for (template of templateExpandingRows(); track template) {\n\t\t\t<ng-container [ngTemplateOutlet]=\"template.templateRef\" [ngTemplateOutletContext]=\"{ item: item }\"> </ng-container>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-table__no-data alert alert-info d-flex align-items-center m-4\" role=\"alert\">\n\t\t<i class=\"hub-table__no-data-icon hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-table__loading\">\n\t\t<svg\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\txmlns:xlink=\"http://www.w3.org/1999/xlink\"\n\t\t\tstyle=\"margin: auto; background: #fff; display: block\"\n\t\t\twidth=\"200px\"\n\t\t\theight=\"200px\"\n\t\t\tviewBox=\"0 0 100 100\"\n\t\t\tpreserveAspectRatio=\"xMidYMid\"\n\t\t>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#cccccc\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#333333\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t</svg>\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-table__error m-4 p-4 text-center text-danger\">\n\t\t<svg\n\t\t\taria-hidden=\"true\"\n\t\t\tfocusable=\"false\"\n\t\t\tdata-prefix=\"fal\"\n\t\t\tdata-icon=\"sad-tear\"\n\t\t\trole=\"img\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tviewBox=\"0 0 496 512\"\n\t\t\tstyle=\"height: 64px\"\n\t\t>\n\t\t\t<path\n\t\t\t\tfill=\"#dc3545\"\n\t\t\t\td=\"M168 240c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zm160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zM248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 464c-119.1 0-216-96.9-216-216S128.9 40 248 40s216 96.9 216 216-96.9 216-216 216zm0-152c-11.2 0-22 1.7-32.7 4.1-7.2-12.6-16.1-26.5-28.1-42.4-9-12.1-29.4-12-38.4 0-29.7 39.6-44.8 69-44.8 87.3 0 34.7 28.7 63 64 63s64-28.3 64-63c0-4.4-1-9.5-2.7-15.1 6.1-1.2 12.3-1.9 18.7-1.9 34.9 0 67.8 15.4 90.2 42.2 5.3 6.4 15.4 8 22.5 2 6.8-5.7 7.7-15.8 2-22.5C334.2 339.6 292.4 320 248 320zm-80 80c-17.7 0-32-13.9-32-31 0-7.7 10-28.8 32-59.5 22 30.7 32 51.8 32 59.5 0 17.1-14.3 31-32 31z\"\n\t\t\t\tclass=\"\"\n\t\t\t></path>\n\t\t</svg>\n\t\t<p>{{ 'ERROR_OCURRED' | translate }}</p>\n\t</div>\n</ng-template>\n\n<ng-template #defaultHeaderTpt let-header=\"header\" let-property=\"property\">\n\t@if (header.icon) {\n\t\t<i class=\"hub-table__header-icon {{ header.icon }}\" aria-hidden=\"true\"></i>\n\t}\n\t<div\n\t\tclass=\"hub-table__header-title\"\n\t\t[class.me-auto]=\"header.align === 'start'\"\n\t\t[class.ms-auto]=\"header.align === 'end'\"\n\t\t[class.mx-auto]=\"header.align === 'center'\"\n\t>\n\t\t@if (header.title) {\n\t\t\t<span class=\"hub-table__header-title-text text-wrap\">{{ header.title ?? header.property | unwrapAsync }}</span>\n\t\t}\n\t</div>\n</ng-template>\n\n<ng-template #defaultFilterTpt let-header=\"header\" let-formControl=\"formControl\">\n\t@switch (header.filter.type) {\n\t\t@case ('dropdown') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t@if (header.filter.placeholder) {\n\t\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t\t{{ header.filter.placeholder }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t\t@if (header.filter.options | isObservable) {\n\t\t\t\t\t@let options = header.filter.options | async;\n\t\t\t\t\t@for (option of $any(options); track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t} @else {\n\t\t\t\t\t@for (option of header.filter.options; track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</select>\n\t\t}\n\t\t@case ('number-range') {\n\t\t\t<hub-table-range-input type=\"number\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('date-range') {\n\t\t\t<hub-table-range-input type=\"date\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('boolean') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t{{ header.filter.placeholder ?? 'SELECT_ONE' | translate | ucfirst }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"true\">\n\t\t\t\t\t{{ header.filter.trueLabel ?? ('TRUE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"false\">\n\t\t\t\t\t{{ header.filter.falseLabel ?? ('FALSE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t</select>\n\t\t}\n\t\t@default {\n\t\t\t<input\n\t\t\t\t[type]=\"header.filter.type\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\tclass=\"form-control\"\n\t\t\t\t[placeholder]=\"header.filter.placeholder || ''\"\n\t\t\t/>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultCellTpt let-property=\"property\" let-item=\"item\" let-row=\"row\" let-header=\"header\">\n\t@if (header.buttons) {\n\t\t<div class=\"hub-table__cell-buttons d-flex flex-nowrap gap-2 justify-content-end align-items-center\">\n\t\t\t@for (button of header.buttons; track button) {\n\t\t\t\t@if (button.buttons) {\n\t\t\t\t\t<hub-table-dropdown [options]=\"button\" [row]=\"row\" class=\"hub-table__cell-dropdown d-inline-block\">\n\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t} @else {\n\t\t\t\t\t@if (!(isHidden(button, row) | async)) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"hub-table__cell-btn\"\n\t\t\t\t\t\t\t[attr.title]=\"button.tooltip | unwrapAsync\"\n\t\t\t\t\t\t\t(click)=\"handleAction($event, button, row)\"\n\t\t\t\t\t\t\t[ngClass]=\"getRowActionClassList(button)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"hub-table__cell-btn-content d-flex flex-nowrap align-items-center gap-1\">\n\t\t\t\t\t\t\t\t<ng-hub-ui-icon [config]=\"button.icon\"></ng-hub-ui-icon>\n\t\t\t\t\t\t\t\t@if (button.label) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.label | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t} @else if (button.title) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t</div>\n\t} @else {\n\t\t<span class=\"hub-table__cell-value\">{{ property }}</span>\n\t}\n</ng-template>\n", styles: [":root,:host{--hub-table-container-bg: var(--hub-ref-color-white, #fff);--hub-table-container-color: var(--hub-sys-text-primary, #212529);--hub-table-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-border-radius: var(--hub-ref-radius-md, .375rem);--hub-table-border-width: var(--hub-ref-border-width, 1px);--hub-table-container-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-justify-content: end;--hub-table-top-bar-align-items: center;--hub-table-top-bar-wrap: wrap;--hub-table-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-table-batch-actions-margin-inline-end: auto;--hub-table-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-bottom-bar-justify-content: space-around;--hub-table-bottom-bar-align-items: center;--hub-table-bottom-bar-wrap: wrap;--hub-table-bottom-bar-paginator-order: 1;--hub-table-bottom-bar-settings-order: 2;--hub-table-bottom-bar-info-order: 3;--hub-table-bottom-bar-paginator-flex: 0 0 auto;--hub-table-bottom-bar-settings-flex: 0 0 auto;--hub-table-bottom-bar-info-flex: 0 0 auto;--hub-table-icon-color: currentColor;--hub-table-icon-size: 1em;--hub-table-icon-sort: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z'/%3E%3C/svg%3E\");--hub-table-icon-sort-up: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");--hub-table-icon-sort-down: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");--hub-table-accent-bg: transparent;--hub-table-active-bg: var(--hub-sys-state-active-bg, rgba(0, 0, 0, .1));--hub-table-active-color: var(--hub-sys-text-primary, #212529);--hub-table-accent: var(--hub-sys-color-primary, #0d6efd);--hub-table-accent-emphasis: color-mix(in oklch, var(--hub-table-accent) 80%, var(--hub-sys-color-ink, #212529));--hub-table-accent-subtle: color-mix(in oklch, var(--hub-table-accent) 12%, var(--hub-sys-surface-page, #ffffff));--hub-table-accent-on: oklch(from var(--hub-table-accent) clamp(0, (.62 - l) * 1000, 1) 0 h);--hub-table-selected-bg: var(--hub-table-accent-subtle);--hub-table-selected-color: var(--hub-sys-text-primary, #212529);--hub-table-bg: var(--hub-ref-color-white, #fff);--hub-table-bg-state: initial;--hub-table-bg-type: initial;--hub-table-cell-padding-x: var(--hub-ref-space-3, 1rem);--hub-table-cell-padding-x-sm: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y-sm: var(--hub-ref-space-1, .25rem);--hub-table-cell-vertical-align: middle;--hub-table-color: var(--hub-sys-text-primary, #212529);--hub-table-color-state: initial;--hub-table-color-type: initial;--hub-table-group-separator-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-search-button-bg: var(--hub-table-container-bg);--hub-table-search-button-border-color: var(--hub-table-border-color);--hub-table-search-button-color: var(--hub-table-container-color);--hub-table-search-button-min-width: 2.75rem;--hub-table-search-input-bg: var(--hub-table-container-bg);--hub-table-search-input-border-color: var(--hub-table-border-color);--hub-table-search-input-color: var(--hub-table-container-color);--hub-table-search-border-width: var(--hub-table-border-width);--hub-table-search-border-radius: var(--hub-table-border-radius);--hub-table-search-input-padding-x: .75rem;--hub-table-search-input-padding-y: .375rem;--hub-table-search-input-font-size: 1rem;--hub-table-filter-button-active-bg: color-mix(in oklch, var(--hub-sys-color-success, #198754) 10%, transparent);--hub-table-filter-button-active-border-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-hover-bg: rgba(0, 0, 0, .05);--hub-table-filter-button-icon-active-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-icon-color: var(--hub-sys-text-muted, #6c757d);--hub-table-filter-button-gap: var(--hub-ref-space-2, .5rem);--hub-table-filter-button-padding-x: .75rem;--hub-table-filter-button-padding-y: .375rem;--hub-table-filter-button-border-width: 1px;--hub-table-filter-button-border-color: transparent;--hub-table-filter-button-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-table-filter-button-transition: all .2s ease;--hub-table-filter-count-bg: var(--hub-sys-color-success, #198754);--hub-table-filter-count-color: var(--hub-ref-color-white, #fff);--hub-table-filter-count-size: 1.25rem;--hub-table-filter-count-padding-x: .4em;--hub-table-filter-count-font-size: .7rem;--hub-table-filter-count-font-weight: var(--hub-ref-font-weight-bold, 700);--hub-table-filter-count-border-radius: var(--hub-ref-radius-pill, 50rem);--hub-table-batch-actions-btn-icon-gap: var(--hub-ref-space-1, .25rem);--hub-table-hover-bg: var(--hub-sys-state-hover-bg, rgba(0, 0, 0, .075));--hub-table-hover-color: var(--hub-sys-text-primary, #212529);--hub-table-striped-bg: var(--hub-sys-state-striped-bg, rgba(0, 0, 0, .05));--hub-table-striped-color: var(--hub-sys-text-primary, #212529)}:host{display:flex;flex-direction:column;gap:var(--hub-table-container-gap);min-width:0;color:var(--hub-table-container-color)}:host .hub-table__top-bar{display:flex;justify-content:var(--hub-table-top-bar-justify-content);align-items:var(--hub-table-top-bar-align-items);flex-wrap:var(--hub-table-top-bar-wrap);gap:var(--hub-table-top-bar-gap)}:host .hub-table__batch-actions{display:flex;align-items:center;gap:var(--hub-table-batch-actions-gap);margin-inline-end:var(--hub-table-batch-actions-margin-inline-end)}:host .hub-table__batch-actions-btn-icon{margin-right:var(--hub-table-batch-actions-btn-icon-gap)}:host .hub-table__batch-actions-btn--default,:host .hub-table__cell-btn--default{border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius)}:host .hub-table__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}:host .hub-table__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-table-search-input-padding-y) var(--hub-table-search-input-padding-x);font-size:var(--hub-table-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);color:var(--hub-table-search-input-color);appearance:none;background-color:var(--hub-table-search-input-bg);background-clip:padding-box;border:var(--hub-table-search-border-width) solid var(--hub-table-search-input-border-color);border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}:host .hub-table__search-button{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-search-button-min-width);color:var(--hub-table-search-button-color);background-color:var(--hub-table-search-button-bg);border-color:var(--hub-table-search-button-border-color);border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host .hub-table__bottom-bar{display:flex;justify-content:var(--hub-table-bottom-bar-justify-content);align-items:var(--hub-table-bottom-bar-align-items);flex-wrap:var(--hub-table-bottom-bar-wrap);gap:var(--hub-table-bottom-bar-gap)}:host .hub-table__bottom-bar-paginator{order:var(--hub-table-bottom-bar-paginator-order);flex:var(--hub-table-bottom-bar-paginator-flex)}:host .hub-table__bottom-bar-settings{order:var(--hub-table-bottom-bar-settings-order);flex:var(--hub-table-bottom-bar-settings-flex);margin:0}:host .hub-table__bottom-bar-info{order:var(--hub-table-bottom-bar-info-order);flex:var(--hub-table-bottom-bar-info-flex);margin:0}:host .hub-table__paginator{overflow:auto;margin:0}:host .hub-table__filter-button{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-table-filter-button-gap);padding:var(--hub-table-filter-button-padding-y) var(--hub-table-filter-button-padding-x);cursor:pointer;border:var(--hub-table-filter-button-border-width) solid var(--hub-table-filter-button-border-color);border-radius:var(--hub-table-filter-button-border-radius);transition:var(--hub-table-filter-button-transition)}:host .hub-table__filter-button:hover{background-color:var(--hub-table-filter-button-hover-bg)}:host .hub-table__filter-button--active{background-color:var(--hub-table-filter-button-active-bg);border-color:var(--hub-table-filter-button-active-border-color)}:host .hub-table__filter-button--active .hub-table__filter-button-icon{color:var(--hub-table-filter-button-icon-active-color)}:host .hub-table__filter-button-icon{transition:color .2s ease;color:var(--hub-table-filter-button-icon-color)}:host .hub-table__filter-count{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-filter-count-size);height:var(--hub-table-filter-count-size);padding:0 var(--hub-table-filter-count-padding-x);font-size:var(--hub-table-filter-count-font-size);font-weight:var(--hub-table-filter-count-font-weight);line-height:1;color:var(--hub-table-filter-count-color);text-align:center;white-space:nowrap;background-color:var(--hub-table-filter-count-bg);border-radius:var(--hub-table-filter-count-border-radius);animation:badge-appear .2s ease}:host .hub-table__no-data-icon{margin-right:1.5rem}:host .hub-table__header-icon{margin-right:.5rem}:host .hub-table__icon{display:inline-block;width:var(--hub-table-icon-size);height:var(--hub-table-icon-size);background-color:var(--hub-table-icon-color);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;vertical-align:middle}:host .hub-table__icon--xs{--hub-table-icon-size: .75em}:host .hub-table__icon--sm{--hub-table-icon-size: .875em}:host .hub-table__icon--lg{--hub-table-icon-size: 1.33em}:host .hub-table__icon--2x{--hub-table-icon-size: 2em}:host .hub-table__icon--3x{--hub-table-icon-size: 3em}:host .hub-table__icon--4x{--hub-table-icon-size: 4em}:host .hub-table__icon--5x{--hub-table-icon-size: 5em}:host .hub-table__icon--search{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}:host .hub-table__icon--filter{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\")}:host .hub-table__icon--eraser{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\")}:host .hub-table__icon--info{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");margin-right:1.5rem}:host .hub-table__icon--sort{-webkit-mask-image:var(--hub-table-icon-sort);mask-image:var(--hub-table-icon-sort)}:host .hub-table__icon--sort-up{-webkit-mask-image:var(--hub-table-icon-sort-up);mask-image:var(--hub-table-icon-sort-up)}:host .hub-table__icon--sort-down{-webkit-mask-image:var(--hub-table-icon-sort-down);mask-image:var(--hub-table-icon-sort-down)}:host .hub-table__icon--caret-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--caret-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--ellipsis-v{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--trash{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__icon--plus{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__container{overflow:auto;background-color:var(--hub-table-container-bg);border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius);color:var(--hub-table-container-color)}:host .hub-table__element{position:relative;width:100%;border-collapse:collapse;border-spacing:0;vertical-align:var(--hub-table-cell-vertical-align);border-color:var(--hub-table-border-color);background-color:var(--hub-table-bg);color:var(--hub-table-color)}:host .hub-table__element .sticky-start{background-color:var(--hub-table-bg);left:0;position:sticky;z-index:9}:host .hub-table__element .sticky-end{background-color:var(--hub-table-bg);right:0;position:sticky;z-index:9}:host .hub-table__element .clickable-item{cursor:pointer}:host .hub-table__element>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y) var(--hub-table-cell-padding-x);vertical-align:var(--hub-table-cell-vertical-align);color:var(--hub-table-color-state, var(--hub-table-color-type, var(--hub-table-color)));background-color:var(--hub-table-bg);border-bottom-style:solid;border-bottom-color:var(--hub-table-border-color);border-bottom-width:var(--hub-table-border-width);box-shadow:inset 0 0 0 9999px var(--hub-table-bg-state, var(--hub-table-bg-type, var(--hub-table-accent-bg)))}:host .hub-table__element>tbody{vertical-align:inherit}:host .hub-table__element>thead{vertical-align:bottom}:host .hub-table__scrollable thead{position:sticky;top:0;z-index:10}:host .hub-table__group-divider{border-top:calc(var(--hub-table-border-width) * 2) solid var(--hub-table-group-separator-color)}:host .hub-table__sm>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y-sm) var(--hub-table-cell-padding-x-sm)}:host .hub-table__bordered>:not(caption)>*{border-style:solid;border-width:var(--hub-table-border-width) 0}:host .hub-table__bordered>:not(caption)>*>*{border-style:solid;border-width:0 var(--hub-table-border-width)}:host .hub-table__borderless>:not(caption)>*>*{border-bottom-width:0}:host .hub-table__borderless>:not(:first-child){border-top-width:0}:host .hub-table__striped-odd>tbody>tr:nth-of-type(odd)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-even>tbody>tr:nth-of-type(2n)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-odd>:not(caption)>tr>:nth-child(odd){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-even>:not(caption)>tr>:nth-child(2n){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__active{--hub-table-color-state: var(--hub-table-active-color);--hub-table-bg-state: var(--hub-table-active-bg)}:host .hub-table__hover>tbody>tr:hover>*{--hub-table-color-state: var(--hub-table-hover-color);--hub-table-bg-state: var(--hub-table-hover-bg)}:host .hub-table__body-row--selected>*,:host .hub-table__hover>tbody>tr.hub-table__body-row--selected:hover>*{--hub-table-color-state: var(--hub-table-selected-color);--hub-table-bg-state: var(--hub-table-selected-bg)}:host .hub-table__responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.hub-table__primary{--hub-table-accent: var(--hub-sys-color-primary)}.hub-table__secondary{--hub-table-accent: var(--hub-sys-color-secondary)}.hub-table__success{--hub-table-accent: var(--hub-sys-color-success)}.hub-table__danger{--hub-table-accent: var(--hub-sys-color-danger)}.hub-table__warning{--hub-table-accent: var(--hub-sys-color-warning)}.hub-table__info{--hub-table-accent: var(--hub-sys-color-info)}.hub-table__neutral{--hub-table-accent: var(--hub-sys-color-neutral)}.hub-table__light{--hub-table-accent: var(--hub-sys-color-light)}.hub-table__dark{--hub-table-accent: var(--hub-sys-color-dark)}:host.hub-table--rtl{direction:rtl}:host.hub-table--rtl .hub-table__top-bar{direction:ltr}:host.hub-table--rtl .hub-table__batch-actions{order:2;flex-direction:row-reverse;margin-inline-end:0;margin-inline-start:auto}:host.hub-table--rtl .hub-table__batch-actions-btn-icon{margin-right:0;margin-left:var(--hub-table-batch-actions-btn-icon-gap)}:host.hub-table--rtl .hub-table__search{order:1;margin-inline-end:auto;margin-inline-start:0;direction:ltr}:host.hub-table--rtl .hub-table__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host.hub-table--rtl .hub-table__search-button{border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius)}:host.hub-table--rtl .hub-table__no-data-icon{margin-right:0;margin-left:1.5rem}:host.hub-table--rtl .hub-table__header-icon{margin-right:0;margin-left:.5rem}.caption-top{caption-side:top}@media(max-width:576px){.hub-table__responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:768px){.hub-table__responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:992px){.hub-table__responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1200px){.hub-table__responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1400px){.hub-table__responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@keyframes badge-appear{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PaginableTableDropdownComponent, selector: "hub-table-dropdown, paginable-table-dropdown", inputs: ["row", "options", "appendTo", "disabled"] }, { kind: "component", type: PaginatorComponent, selector: "hub-paginator, paginable-table-paginator", inputs: ["rtl", "page", "numberOfPages"], outputs: ["pageChange"] }, { kind: "component", type: DropdownComponent, selector: "hub-dropdown, hub-ui-dropdown", inputs: ["id"], outputs: ["open", "close"] }, { kind: "component", type: MenuFilterComponent, selector: "menu-filter", inputs: ["header"] }, { kind: "component", type: HubIconComponent, selector: "hub-icon, ng-hub-ui-icon", inputs: ["config"] }, { kind: "component", type: PaginableTableRangeInputComponent, selector: "hub-table-range-input, paginable-table-range-input", inputs: ["type"] }, { kind: "component", type: PaginableStateOutlet, selector: "hub-state-outlet", inputs: ["template", "instanceDefault", "globalDefault", "fallback", "context"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: UcfirstPipe, name: "ucfirst" }, { kind: "pipe", type: UnwrapAsyncPipe, name: "unwrapAsync" }, { kind: "pipe", type: IsObservablePipe, name: "isObservable" }, { kind: "pipe", type: GetPipe, name: "get" }], animations: [
4638
4638
  trigger('fadeInOut', [
4639
4639
  transition(':enter', [style({ opacity: 0 }), animate('256ms 256ms', style({ opacity: 1, height: 'auto' }))]),
4640
4640
  transition(':leave', [animate('256ms ease-out', style({ opacity: 0, height: '0' }))])
@@ -4677,7 +4677,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
4677
4677
  ], host: {
4678
4678
  class: 'hub-table',
4679
4679
  '[class.hub-table--rtl]': 'isRtl()'
4680
- }, template: "@if (batchActions().length || searchable() || headerFilters().length) {\n\t<div class=\"hub-table__top-bar\">\n\t\t@if (batchActions().length) {\n\t\t\t<div class=\"hub-table__batch-actions\">\n\t\t\t\t@for (button of batchActions(); track $index) {\n\t\t\t\t\t@if ($any(button).buttons?.length) {\n\t\t\t\t\t\t<hub-table-dropdown\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-dropdown\"\n\t\t\t\t\t\t\t[options]=\"$any(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(button)\"\n\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (button.icon) {\n\t\t\t\t\t\t\t\t<i class=\"hub-table__batch-actions-btn-icon {{ button.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (button.title) {\n\t\t\t\t\t\t\t\t<span class=\"hub-table__batch-actions-btn-title\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (searchable()) {\n\t\t\t<div class=\"hub-table__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (headerFilters().length) {\n\t\t\t<div class=\"hub-table__delete-filters\">\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"hub-table__delete-filters-btn btn btn-outline-danger\"\n\t\t\t\t\t(click)=\"clearFilters()\"\n\t\t\t\t\t[disabled]=\"filterLoading\"\n\t\t\t\t>\n\t\t\t\t\t<i class=\"hub-table__delete-filters-icon hub-table__icon hub-table__icon--eraser\"></i>\n\t\t\t\t\t{{ 'CLEAN_FILTERS' | translate | ucfirst }}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n<div class=\"hub-table__container {{ responsiveCSSClass() }}\" [class.hub-table__responsive]=\"responsiveCSSClass()\">\n\t@let striped = options().striped;\n\t<table\n\t\tclass=\"hub-table__element\"\n\t\t[class.hub-table__hover]=\"(options().hoverableRows || selectable()) && !loading()\"\n\t\t[class.hub-table__striped-odd]=\"striped === 'rows-odd'\"\n\t\t[class.hub-table__striped-even]=\"striped === 'rows-even'\"\n\t\t[class.hub-table__striped-columns-odd]=\"striped === 'columns-odd'\"\n\t\t[class.hub-table__striped-columns-even]=\"striped === 'columns-even'\"\n\t\t[class.hub-table__selectable]=\"selectable()\"\n\t\t[class.hub-table__scrollable]=\"options().scrollable\"\n\t\t[ngClass]=\"options().variant ? 'hub-table__' + options().variant : null\"\n\t>\n\t\t<thead class=\"hub-table__head\" [formGroup]=\"filtersFG\">\n\t\t\t<tr class=\"hub-table__head-row\">\n\t\t\t\t@if (selectable()) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--actions sticky-start\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t[(ngModel)]=\"allRowsSelected\"\n\t\t\t\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t\t\t\t(click)=\"toggleAll()\"\n\t\t\t\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t</th>\n\t\t\t\t}\n\t\t\t\t@for (header of fixedHeaders(); track header.property) {\n\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t<th\n\t\t\t\t\t\t\tclass=\"hub-table__header-cell\"\n\t\t\t\t\t\t\tresizable\n\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"hub-table__header-cell-content d-flex flex-nowrap align-items-center justify-content-between gap-2\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getHeaderTemplate(header) || defaultHeaderTpt\"\n\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\theader,\n\t\t\t\t\t\t\t\t\t\tproperty: header | get: header.property\n\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t@if (header.sortable || header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t<div class=\"hub-table__header-cell-actions d-flex gap-2 ms-auto align-items-center\">\n\t\t\t\t\t\t\t\t\t\t<button class=\"hub-table__sort-btn btn\" (click)=\"sort(header)\">\n\t\t\t\t\t\t\t\t\t\t\t@if (header.sortable) {\n\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__sort-icon hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"getOrdenationClass(header)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t@if (header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t\t\t<hub-dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t#dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t(open)=\"onDropdownFilterOpened($event)\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button button\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[class.hub-table__filter-button--active]=\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button-icon hub-table__icon hub-table__icon--filter\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t@if (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tas rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@if (rules.length) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"hub-table__filter-count\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{{ rules.length }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t@if (dropdown.isOpened()) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<menu-filter\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown-content content\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[header]=\"header\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[formControlName]=\"header.filter.key || header.property\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</menu-filter>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t</hub-dropdown>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--expander sticky-end\"></th>\n\t\t\t\t}\n\t\t\t</tr>\n\n\t\t\t<!-- Filtering -->\n\t\t\t@if (hasColumnFilters()) {\n\t\t\t\t<tr class=\"hub-table__filter-row\">\n\t\t\t\t\t@if (selectable() || batchActions.length) {\n\t\t\t\t\t\t<th class=\"hub-table__filter-cell sticky-start\"></th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (header of fixedHeaders(); track $index; let last = $last) {\n\t\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t\t@let formControlName = header.filter?.key || header.property;\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\tclass=\"hub-table__filter-cell\"\n\t\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@if (header.filter && header.filter.mode !== 'menu' && filtersFG.get(formControlName)) {\n\t\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getFilterTemplate(header) || defaultFilterTpt\"\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\t\t\t\t\tformControl: filtersFG.get(formControlName)\n\t\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</thead>\n\t\t<tbody class=\"hub-table__body\">\n\t\t\t@if (loading()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (error()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t\t\t\t[context]=\"{ error: error(), colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (rows().length) {\n\t\t\t\t@for (item of rows(); track $index) {\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"templateRow() || defaultRowTemplate\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t}\n\t\t\t} @else {\n\t\t\t\t<tr>\n\t\t\t\t\t<td [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount(), filters: filters() ?? undefined }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</tbody>\n\t</table>\n</div>\n\n<!-- Pagination -->\n@if (page() !== undefined && page() !== null) {\n\t<div class=\"hub-table__bottom-bar\">\n\t\t@if (paginationPosition() == 'bottom' || paginationPosition() === 'both') {\n\t\t\t<hub-paginator\n\t\t\t\tclass=\"hub-table__paginator hub-table__bottom-bar-paginator\"\n\t\t\t\t[(page)]=\"$any(page)\"\n\t\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t\t[rtl]=\"isRtl()\"\n\t\t\t>\n\t\t\t</hub-paginator>\n\t\t}\n\t\t<div class=\"hub-table__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"perPage.set($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t@if (totalItems() !== null && totalItems() !== undefined) {\n\t\t\t<p class=\"hub-table__bottom-bar-info hub-paginator__info\">\n\t\t\t\t{{\n\t\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t\t| translate\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\tamount: rows().length,\n\t\t\t\t\t\t\t\t\ttotal: totalItems()\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t| ucfirst\n\t\t\t\t}}\n\t\t\t</p>\n\t\t}\n\t</div>\n}\n<ng-template #defaultRowTemplate let-item>\n\t<tr\n\t\tclass=\"hub-table__body-row\"\n\t\t(click)=\"onItemClick($event, item)\"\n\t\t[class.hub-table__body-row--selected]=\"selectable() && item.selected\"\n\t\t[class.hub-table__body-row--clickable]=\"clickFn()\"\n\t\t[ngClass]=\"_getRowClass(item)\"\n\t>\n\t\t@if (selectable() || batchActions.length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--select sticky-start\">\n\t\t\t\t<input\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t[(ngModel)]=\"item.selected\"\n\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t(click)=\"$event.stopPropagation(); toggle(item)\"\n\t\t\t\t/>\n\t\t\t</td>\n\t\t}\n\t\t@for (header of fixedHeaders(); track $index) {\n\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t<td\n\t\t\t\t\tclass=\"hub-table__cell\"\n\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t[style.width]=\"header.buttons?.length ? '0' : 'auto'\"\n\t\t\t\t>\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"getCellTemplate(header) || defaultCellTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\titem: item.data,\n\t\t\t\t\t\t\trow: item,\n\t\t\t\t\t\t\tproperty: item.data | get: header.property\n\t\t\t\t\t\t}\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</td>\n\t\t\t}\n\t\t}\n\t\t@if (templateExpandingRows().length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--expander sticky-end\" [class.sticky-end]=\"stickyActions()\">\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<button (click)=\"toggleExpandedRow(item)\" type=\"button\" class=\"hub-table__expander-btn btn btn-link px-2\">\n\t\t\t\t\t\t<i\n\t\t\t\t\t\t\tclass=\"hub-table__expander-icon hub-table__icon\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-up]=\"!item.collapsed\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-down]=\"item.collapsed\"\n\t\t\t\t\t\t></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</td>\n\t\t}\n\t\t<!-- <td *ngIf=\"!lastColumnOnlyHasButtons && filterHeaders?.length\"></td> -->\n\t</tr>\n\t@if (!item.collapsed) {\n\t\t@for (template of templateExpandingRows(); track template) {\n\t\t\t<ng-container [ngTemplateOutlet]=\"template.templateRef\" [ngTemplateOutletContext]=\"{ item: item }\"> </ng-container>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-table__no-data alert alert-info d-flex align-items-center m-4\" role=\"alert\">\n\t\t<i class=\"hub-table__no-data-icon hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-table__loading\">\n\t\t<svg\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\txmlns:xlink=\"http://www.w3.org/1999/xlink\"\n\t\t\tstyle=\"margin: auto; background: #fff; display: block\"\n\t\t\twidth=\"200px\"\n\t\t\theight=\"200px\"\n\t\t\tviewBox=\"0 0 100 100\"\n\t\t\tpreserveAspectRatio=\"xMidYMid\"\n\t\t>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#cccccc\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#333333\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t</svg>\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-table__error m-4 p-4 text-center text-danger\">\n\t\t<svg\n\t\t\taria-hidden=\"true\"\n\t\t\tfocusable=\"false\"\n\t\t\tdata-prefix=\"fal\"\n\t\t\tdata-icon=\"sad-tear\"\n\t\t\trole=\"img\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tviewBox=\"0 0 496 512\"\n\t\t\tstyle=\"height: 64px\"\n\t\t>\n\t\t\t<path\n\t\t\t\tfill=\"#dc3545\"\n\t\t\t\td=\"M168 240c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zm160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zM248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 464c-119.1 0-216-96.9-216-216S128.9 40 248 40s216 96.9 216 216-96.9 216-216 216zm0-152c-11.2 0-22 1.7-32.7 4.1-7.2-12.6-16.1-26.5-28.1-42.4-9-12.1-29.4-12-38.4 0-29.7 39.6-44.8 69-44.8 87.3 0 34.7 28.7 63 64 63s64-28.3 64-63c0-4.4-1-9.5-2.7-15.1 6.1-1.2 12.3-1.9 18.7-1.9 34.9 0 67.8 15.4 90.2 42.2 5.3 6.4 15.4 8 22.5 2 6.8-5.7 7.7-15.8 2-22.5C334.2 339.6 292.4 320 248 320zm-80 80c-17.7 0-32-13.9-32-31 0-7.7 10-28.8 32-59.5 22 30.7 32 51.8 32 59.5 0 17.1-14.3 31-32 31z\"\n\t\t\t\tclass=\"\"\n\t\t\t></path>\n\t\t</svg>\n\t\t<p>{{ 'ERROR_OCURRED' | translate }}</p>\n\t</div>\n</ng-template>\n\n<ng-template #defaultHeaderTpt let-header=\"header\" let-property=\"property\">\n\t@if (header.icon) {\n\t\t<i class=\"hub-table__header-icon {{ header.icon }}\" aria-hidden=\"true\"></i>\n\t}\n\t<div\n\t\tclass=\"hub-table__header-title\"\n\t\t[class.me-auto]=\"header.align === 'start'\"\n\t\t[class.ms-auto]=\"header.align === 'end'\"\n\t\t[class.mx-auto]=\"header.align === 'center'\"\n\t>\n\t\t@if (header.title) {\n\t\t\t<span class=\"hub-table__header-title-text text-wrap\">{{ header.title ?? header.property | unwrapAsync }}</span>\n\t\t}\n\t</div>\n</ng-template>\n\n<ng-template #defaultFilterTpt let-header=\"header\" let-formControl=\"formControl\">\n\t@switch (header.filter.type) {\n\t\t@case ('dropdown') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t@if (header.filter.placeholder) {\n\t\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t\t{{ header.filter.placeholder }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t\t@if (header.filter.options | isObservable) {\n\t\t\t\t\t@let options = header.filter.options | async;\n\t\t\t\t\t@for (option of $any(options); track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t} @else {\n\t\t\t\t\t@for (option of header.filter.options; track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</select>\n\t\t}\n\t\t@case ('number-range') {\n\t\t\t<hub-table-range-input type=\"number\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('date-range') {\n\t\t\t<hub-table-range-input type=\"date\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('boolean') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t{{ header.filter.placeholder ?? 'SELECT_ONE' | translate | ucfirst }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"true\">\n\t\t\t\t\t{{ header.filter.trueLabel ?? ('TRUE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"false\">\n\t\t\t\t\t{{ header.filter.falseLabel ?? ('FALSE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t</select>\n\t\t}\n\t\t@default {\n\t\t\t<input\n\t\t\t\t[type]=\"header.filter.type\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\tclass=\"form-control\"\n\t\t\t\t[placeholder]=\"header.filter.placeholder || ''\"\n\t\t\t/>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultCellTpt let-property=\"property\" let-item=\"item\" let-row=\"row\" let-header=\"header\">\n\t@if (header.buttons) {\n\t\t<div class=\"hub-table__cell-buttons d-flex flex-nowrap gap-2 justify-content-end align-items-center\">\n\t\t\t@for (button of header.buttons; track button) {\n\t\t\t\t@if (button.buttons) {\n\t\t\t\t\t<hub-table-dropdown [options]=\"button\" [row]=\"row\" class=\"hub-table__cell-dropdown d-inline-block\">\n\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t} @else {\n\t\t\t\t\t@if (!(isHidden(button, row) | async)) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"hub-table__cell-btn\"\n\t\t\t\t\t\t\t[attr.title]=\"button.tooltip | unwrapAsync\"\n\t\t\t\t\t\t\t(click)=\"handleAction($event, button, row)\"\n\t\t\t\t\t\t\t[ngClass]=\"getRowActionClassList(button)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"hub-table__cell-btn-content d-flex flex-nowrap align-items-center gap-1\">\n\t\t\t\t\t\t\t\t<ng-hub-ui-icon [config]=\"button.icon\"></ng-hub-ui-icon>\n\t\t\t\t\t\t\t\t@if (button.label) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.label | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t} @else if (button.title) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t</div>\n\t} @else {\n\t\t<span class=\"hub-table__cell-value\">{{ property }}</span>\n\t}\n</ng-template>\n", styles: [":root,:host{--hub-table-container-bg: var(--hub-ref-color-white, #fff);--hub-table-container-color: var(--hub-sys-text-primary, #212529);--hub-table-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-border-radius: var(--hub-ref-radius-md, .375rem);--hub-table-border-width: var(--hub-ref-border-width, 1px);--hub-table-container-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-justify-content: end;--hub-table-top-bar-align-items: center;--hub-table-top-bar-wrap: wrap;--hub-table-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-table-batch-actions-margin-inline-end: auto;--hub-table-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-bottom-bar-justify-content: space-around;--hub-table-bottom-bar-align-items: center;--hub-table-bottom-bar-wrap: wrap;--hub-table-bottom-bar-paginator-order: 1;--hub-table-bottom-bar-settings-order: 2;--hub-table-bottom-bar-info-order: 3;--hub-table-bottom-bar-paginator-flex: 0 0 auto;--hub-table-bottom-bar-settings-flex: 0 0 auto;--hub-table-bottom-bar-info-flex: 0 0 auto;--hub-table-icon-color: currentColor;--hub-table-icon-size: 1em;--hub-table-icon-sort: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z'/%3E%3C/svg%3E\");--hub-table-icon-sort-up: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");--hub-table-icon-sort-down: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");--hub-table-accent-bg: transparent;--hub-table-active-bg: var(--hub-sys-state-active-bg, rgba(0, 0, 0, .1));--hub-table-active-color: var(--hub-sys-text-primary, #212529);--hub-table-accent: var(--hub-sys-color-primary, #0d6efd);--hub-table-accent-subtle: color-mix(in srgb, var(--hub-table-accent) 12%, var(--hub-sys-surface-page, #ffffff));--hub-table-selected-bg: var(--hub-table-accent-subtle);--hub-table-selected-color: var(--hub-sys-text-primary, #212529);--hub-table-bg: var(--hub-ref-color-white, #fff);--hub-table-bg-state: initial;--hub-table-bg-type: initial;--hub-table-cell-padding-x: var(--hub-ref-space-3, 1rem);--hub-table-cell-padding-x-sm: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y-sm: var(--hub-ref-space-1, .25rem);--hub-table-cell-vertical-align: middle;--hub-table-color: var(--hub-sys-text-primary, #212529);--hub-table-color-state: initial;--hub-table-color-type: initial;--hub-table-group-separator-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-search-button-bg: var(--hub-table-container-bg);--hub-table-search-button-border-color: var(--hub-table-border-color);--hub-table-search-button-color: var(--hub-table-container-color);--hub-table-search-button-min-width: 2.75rem;--hub-table-search-input-bg: var(--hub-table-container-bg);--hub-table-search-input-border-color: var(--hub-table-border-color);--hub-table-search-input-color: var(--hub-table-container-color);--hub-table-search-border-width: var(--hub-table-border-width);--hub-table-search-border-radius: var(--hub-table-border-radius);--hub-table-search-input-padding-x: .75rem;--hub-table-search-input-padding-y: .375rem;--hub-table-search-input-font-size: 1rem;--hub-table-filter-button-active-bg: color-mix(in srgb, var(--hub-sys-color-success, #198754) 10%, transparent);--hub-table-filter-button-active-border-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-hover-bg: rgba(0, 0, 0, .05);--hub-table-filter-button-icon-active-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-icon-color: var(--hub-sys-text-muted, #6c757d);--hub-table-filter-button-gap: var(--hub-ref-space-2, .5rem);--hub-table-filter-button-padding-x: .75rem;--hub-table-filter-button-padding-y: .375rem;--hub-table-filter-button-border-width: 1px;--hub-table-filter-button-border-color: transparent;--hub-table-filter-button-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-table-filter-button-transition: all .2s ease;--hub-table-filter-count-bg: var(--hub-sys-color-success, #198754);--hub-table-filter-count-color: var(--hub-ref-color-white, #fff);--hub-table-filter-count-size: 1.25rem;--hub-table-filter-count-padding-x: .4em;--hub-table-filter-count-font-size: .7rem;--hub-table-filter-count-font-weight: var(--hub-ref-font-weight-bold, 700);--hub-table-filter-count-border-radius: var(--hub-ref-radius-pill, 50rem);--hub-table-batch-actions-btn-icon-gap: var(--hub-ref-space-1, .25rem);--hub-table-hover-bg: var(--hub-sys-state-hover-bg, rgba(0, 0, 0, .075));--hub-table-hover-color: var(--hub-sys-text-primary, #212529);--hub-table-striped-bg: var(--hub-sys-state-striped-bg, rgba(0, 0, 0, .05));--hub-table-striped-color: var(--hub-sys-text-primary, #212529)}:host{display:flex;flex-direction:column;gap:var(--hub-table-container-gap);min-width:0;color:var(--hub-table-container-color)}:host .hub-table__top-bar{display:flex;justify-content:var(--hub-table-top-bar-justify-content);align-items:var(--hub-table-top-bar-align-items);flex-wrap:var(--hub-table-top-bar-wrap);gap:var(--hub-table-top-bar-gap)}:host .hub-table__batch-actions{display:flex;align-items:center;gap:var(--hub-table-batch-actions-gap);margin-inline-end:var(--hub-table-batch-actions-margin-inline-end)}:host .hub-table__batch-actions-btn-icon{margin-right:var(--hub-table-batch-actions-btn-icon-gap)}:host .hub-table__batch-actions-btn--default,:host .hub-table__cell-btn--default{border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius)}:host .hub-table__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}:host .hub-table__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-table-search-input-padding-y) var(--hub-table-search-input-padding-x);font-size:var(--hub-table-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);color:var(--hub-table-search-input-color);appearance:none;background-color:var(--hub-table-search-input-bg);background-clip:padding-box;border:var(--hub-table-search-border-width) solid var(--hub-table-search-input-border-color);border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}:host .hub-table__search-button{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-search-button-min-width);color:var(--hub-table-search-button-color);background-color:var(--hub-table-search-button-bg);border-color:var(--hub-table-search-button-border-color);border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host .hub-table__bottom-bar{display:flex;justify-content:var(--hub-table-bottom-bar-justify-content);align-items:var(--hub-table-bottom-bar-align-items);flex-wrap:var(--hub-table-bottom-bar-wrap);gap:var(--hub-table-bottom-bar-gap)}:host .hub-table__bottom-bar-paginator{order:var(--hub-table-bottom-bar-paginator-order);flex:var(--hub-table-bottom-bar-paginator-flex)}:host .hub-table__bottom-bar-settings{order:var(--hub-table-bottom-bar-settings-order);flex:var(--hub-table-bottom-bar-settings-flex);margin:0}:host .hub-table__bottom-bar-info{order:var(--hub-table-bottom-bar-info-order);flex:var(--hub-table-bottom-bar-info-flex);margin:0}:host .hub-table__paginator{overflow:auto;margin:0}:host .hub-table__filter-button{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-table-filter-button-gap);padding:var(--hub-table-filter-button-padding-y) var(--hub-table-filter-button-padding-x);cursor:pointer;border:var(--hub-table-filter-button-border-width) solid var(--hub-table-filter-button-border-color);border-radius:var(--hub-table-filter-button-border-radius);transition:var(--hub-table-filter-button-transition)}:host .hub-table__filter-button:hover{background-color:var(--hub-table-filter-button-hover-bg)}:host .hub-table__filter-button--active{background-color:var(--hub-table-filter-button-active-bg);border-color:var(--hub-table-filter-button-active-border-color)}:host .hub-table__filter-button--active .hub-table__filter-button-icon{color:var(--hub-table-filter-button-icon-active-color)}:host .hub-table__filter-button-icon{transition:color .2s ease;color:var(--hub-table-filter-button-icon-color)}:host .hub-table__filter-count{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-filter-count-size);height:var(--hub-table-filter-count-size);padding:0 var(--hub-table-filter-count-padding-x);font-size:var(--hub-table-filter-count-font-size);font-weight:var(--hub-table-filter-count-font-weight);line-height:1;color:var(--hub-table-filter-count-color);text-align:center;white-space:nowrap;background-color:var(--hub-table-filter-count-bg);border-radius:var(--hub-table-filter-count-border-radius);animation:badge-appear .2s ease}:host .hub-table__no-data-icon{margin-right:1.5rem}:host .hub-table__header-icon{margin-right:.5rem}:host .hub-table__icon{display:inline-block;width:var(--hub-table-icon-size);height:var(--hub-table-icon-size);background-color:var(--hub-table-icon-color);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;vertical-align:middle}:host .hub-table__icon--xs{--hub-table-icon-size: .75em}:host .hub-table__icon--sm{--hub-table-icon-size: .875em}:host .hub-table__icon--lg{--hub-table-icon-size: 1.33em}:host .hub-table__icon--2x{--hub-table-icon-size: 2em}:host .hub-table__icon--3x{--hub-table-icon-size: 3em}:host .hub-table__icon--4x{--hub-table-icon-size: 4em}:host .hub-table__icon--5x{--hub-table-icon-size: 5em}:host .hub-table__icon--search{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}:host .hub-table__icon--filter{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\")}:host .hub-table__icon--eraser{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\")}:host .hub-table__icon--info{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");margin-right:1.5rem}:host .hub-table__icon--sort{-webkit-mask-image:var(--hub-table-icon-sort);mask-image:var(--hub-table-icon-sort)}:host .hub-table__icon--sort-up{-webkit-mask-image:var(--hub-table-icon-sort-up);mask-image:var(--hub-table-icon-sort-up)}:host .hub-table__icon--sort-down{-webkit-mask-image:var(--hub-table-icon-sort-down);mask-image:var(--hub-table-icon-sort-down)}:host .hub-table__icon--caret-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--caret-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--ellipsis-v{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--trash{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__icon--plus{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__container{overflow:auto;background-color:var(--hub-table-container-bg);border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius);color:var(--hub-table-container-color)}:host .hub-table__element{position:relative;width:100%;border-collapse:collapse;border-spacing:0;vertical-align:var(--hub-table-cell-vertical-align);border-color:var(--hub-table-border-color);background-color:var(--hub-table-bg);color:var(--hub-table-color)}:host .hub-table__element .sticky-start{background-color:var(--hub-table-bg);left:0;position:sticky;z-index:9}:host .hub-table__element .sticky-end{background-color:var(--hub-table-bg);right:0;position:sticky;z-index:9}:host .hub-table__element .clickable-item{cursor:pointer}:host .hub-table__element>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y) var(--hub-table-cell-padding-x);vertical-align:var(--hub-table-cell-vertical-align);color:var(--hub-table-color-state, var(--hub-table-color-type, var(--hub-table-color)));background-color:var(--hub-table-bg);border-bottom-style:solid;border-bottom-color:var(--hub-table-border-color);border-bottom-width:var(--hub-table-border-width);box-shadow:inset 0 0 0 9999px var(--hub-table-bg-state, var(--hub-table-bg-type, var(--hub-table-accent-bg)))}:host .hub-table__element>tbody{vertical-align:inherit}:host .hub-table__element>thead{vertical-align:bottom}:host .hub-table__scrollable thead{position:sticky;top:0;z-index:10}:host .hub-table__group-divider{border-top:calc(var(--hub-table-border-width) * 2) solid var(--hub-table-group-separator-color)}:host .hub-table__sm>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y-sm) var(--hub-table-cell-padding-x-sm)}:host .hub-table__bordered>:not(caption)>*{border-style:solid;border-width:var(--hub-table-border-width) 0}:host .hub-table__bordered>:not(caption)>*>*{border-style:solid;border-width:0 var(--hub-table-border-width)}:host .hub-table__borderless>:not(caption)>*>*{border-bottom-width:0}:host .hub-table__borderless>:not(:first-child){border-top-width:0}:host .hub-table__striped-odd>tbody>tr:nth-of-type(odd)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-even>tbody>tr:nth-of-type(2n)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-odd>:not(caption)>tr>:nth-child(odd){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-even>:not(caption)>tr>:nth-child(2n){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__active{--hub-table-color-state: var(--hub-table-active-color);--hub-table-bg-state: var(--hub-table-active-bg)}:host .hub-table__hover>tbody>tr:hover>*{--hub-table-color-state: var(--hub-table-hover-color);--hub-table-bg-state: var(--hub-table-hover-bg)}:host .hub-table__body-row--selected>*,:host .hub-table__hover>tbody>tr.hub-table__body-row--selected:hover>*{--hub-table-color-state: var(--hub-table-selected-color);--hub-table-bg-state: var(--hub-table-selected-bg)}:host .hub-table__responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.hub-table__primary{--hub-table-accent: var(--hub-sys-color-primary)}.hub-table__success{--hub-table-accent: var(--hub-sys-color-success)}.hub-table__danger{--hub-table-accent: var(--hub-sys-color-danger)}.hub-table__warning{--hub-table-accent: var(--hub-sys-color-warning)}.hub-table__info{--hub-table-accent: var(--hub-sys-color-info)}:host.hub-table--rtl{direction:rtl}:host.hub-table--rtl .hub-table__top-bar{direction:ltr}:host.hub-table--rtl .hub-table__batch-actions{order:2;flex-direction:row-reverse;margin-inline-end:0;margin-inline-start:auto}:host.hub-table--rtl .hub-table__batch-actions-btn-icon{margin-right:0;margin-left:var(--hub-table-batch-actions-btn-icon-gap)}:host.hub-table--rtl .hub-table__search{order:1;margin-inline-end:auto;margin-inline-start:0;direction:ltr}:host.hub-table--rtl .hub-table__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host.hub-table--rtl .hub-table__search-button{border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius)}:host.hub-table--rtl .hub-table__no-data-icon{margin-right:0;margin-left:1.5rem}:host.hub-table--rtl .hub-table__header-icon{margin-right:0;margin-left:.5rem}.caption-top{caption-side:top}@media(max-width:576px){.hub-table__responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:768px){.hub-table__responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:992px){.hub-table__responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1200px){.hub-table__responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1400px){.hub-table__responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@keyframes badge-appear{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}\n"] }]
4680
+ }, template: "@if (batchActions().length || searchable() || headerFilters().length) {\n\t<div class=\"hub-table__top-bar\">\n\t\t@if (batchActions().length) {\n\t\t\t<div class=\"hub-table__batch-actions\">\n\t\t\t\t@for (button of batchActions(); track $index) {\n\t\t\t\t\t@if ($any(button).buttons?.length) {\n\t\t\t\t\t\t<hub-table-dropdown\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-dropdown\"\n\t\t\t\t\t\t\t[options]=\"$any(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclass=\"hub-table__batch-actions-btn\"\n\t\t\t\t\t\t\t[ngClass]=\"getBatchActionClassList(button)\"\n\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t(click)=\"handleBatchAction(button)\"\n\t\t\t\t\t\t\t[disabled]=\"!value.length\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (button.icon) {\n\t\t\t\t\t\t\t\t<i class=\"hub-table__batch-actions-btn-icon {{ button.icon }}\"></i>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (button.title) {\n\t\t\t\t\t\t\t\t<span class=\"hub-table__batch-actions-btn-title\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (searchable()) {\n\t\t\t<div class=\"hub-table__search\">\n\t\t\t\t@if (isRtl()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t} @else {\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\tclass=\"hub-table__search-input\"\n\t\t\t\t\t\t(input)=\"searchProxy$.next($any($event.target).value)\"\n\t\t\t\t\t\t[value]=\"searchTerm()\"\n\t\t\t\t\t\t[attr.placeholder]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t/>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"hub-table__search-button btn btn-outline-dark\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t[attr.aria-label]=\"'SEARCH' | translate | ucfirst\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<i class=\"hub-table__search-icon hub-table__icon hub-table__icon--search\" aria-hidden=\"true\"></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@if (headerFilters().length) {\n\t\t\t<div class=\"hub-table__delete-filters\">\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclass=\"hub-table__delete-filters-btn btn btn-outline-danger\"\n\t\t\t\t\t(click)=\"clearFilters()\"\n\t\t\t\t\t[disabled]=\"filterLoading\"\n\t\t\t\t>\n\t\t\t\t\t<i class=\"hub-table__delete-filters-icon hub-table__icon hub-table__icon--eraser\"></i>\n\t\t\t\t\t{{ 'CLEAN_FILTERS' | translate | ucfirst }}\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n\n<div class=\"hub-table__container {{ responsiveCSSClass() }}\" [class.hub-table__responsive]=\"responsiveCSSClass()\">\n\t@let striped = options().striped;\n\t<table\n\t\tclass=\"hub-table__element\"\n\t\t[class.hub-table__hover]=\"(options().hoverableRows || selectable()) && !loading()\"\n\t\t[class.hub-table__striped-odd]=\"striped === 'rows-odd'\"\n\t\t[class.hub-table__striped-even]=\"striped === 'rows-even'\"\n\t\t[class.hub-table__striped-columns-odd]=\"striped === 'columns-odd'\"\n\t\t[class.hub-table__striped-columns-even]=\"striped === 'columns-even'\"\n\t\t[class.hub-table__selectable]=\"selectable()\"\n\t\t[class.hub-table__scrollable]=\"options().scrollable\"\n\t\t[ngClass]=\"options().variant ? 'hub-table__' + options().variant : null\"\n\t>\n\t\t<thead class=\"hub-table__head\" [formGroup]=\"filtersFG\">\n\t\t\t<tr class=\"hub-table__head-row\">\n\t\t\t\t@if (selectable()) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--actions sticky-start\">\n\t\t\t\t\t\t@if (multipleSelectable()) {\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t[(ngModel)]=\"allRowsSelected\"\n\t\t\t\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t\t\t\t(click)=\"toggleAll()\"\n\t\t\t\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t</th>\n\t\t\t\t}\n\t\t\t\t@for (header of fixedHeaders(); track header.property) {\n\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t<th\n\t\t\t\t\t\t\tclass=\"hub-table__header-cell\"\n\t\t\t\t\t\t\tresizable\n\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"hub-table__header-cell-content d-flex flex-nowrap align-items-center justify-content-between gap-2\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getHeaderTemplate(header) || defaultHeaderTpt\"\n\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\theader,\n\t\t\t\t\t\t\t\t\t\tproperty: header | get: header.property\n\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t@if (header.sortable || header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t<div class=\"hub-table__header-cell-actions d-flex gap-2 ms-auto align-items-center\">\n\t\t\t\t\t\t\t\t\t\t<button class=\"hub-table__sort-btn btn\" (click)=\"sort(header)\">\n\t\t\t\t\t\t\t\t\t\t\t@if (header.sortable) {\n\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__sort-icon hub-table__icon\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"getOrdenationClass(header)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t@if (header.filter?.mode === 'menu') {\n\t\t\t\t\t\t\t\t\t\t\t<hub-dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t#dropdown\n\t\t\t\t\t\t\t\t\t\t\t\t(open)=\"onDropdownFilterOpened($event)\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button button\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[class.hub-table__filter-button--active]=\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<i\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-button-icon hub-table__icon hub-table__icon--filter\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t></i>\n\t\t\t\t\t\t\t\t\t\t\t\t\t@if (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfiltersFG.get(header.filter.key || header.property)?.value?.rules;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tas rules\n\t\t\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t@if (rules.length) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"hub-table__filter-count\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{{ rules.length }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t@if (dropdown.isOpened()) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<menu-filter\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"hub-table__filter-dropdown-content content\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[header]=\"header\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t[formControlName]=\"header.filter.key || header.property\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</menu-filter>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t</hub-dropdown>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<th class=\"hub-table__header-cell hub-table__header-cell--expander sticky-end\"></th>\n\t\t\t\t}\n\t\t\t</tr>\n\n\t\t\t<!-- Filtering -->\n\t\t\t@if (hasColumnFilters()) {\n\t\t\t\t<tr class=\"hub-table__filter-row\">\n\t\t\t\t\t@if (selectable() || batchActions.length) {\n\t\t\t\t\t\t<th class=\"hub-table__filter-cell sticky-start\"></th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (header of fixedHeaders(); track $index; let last = $last) {\n\t\t\t\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t\t\t\t@let formControlName = header.filter?.key || header.property;\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\tclass=\"hub-table__filter-cell\"\n\t\t\t\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@if (header.filter && header.filter.mode !== 'menu' && filtersFG.get(formControlName)) {\n\t\t\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutlet]=\"getFilterTemplate(header) || defaultFilterTpt\"\n\t\t\t\t\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\t\t\t\t\tformControl: filtersFG.get(formControlName)\n\t\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</thead>\n\t\t<tbody class=\"hub-table__body\">\n\t\t\t@if (loading()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"loadingTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"loadingComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.loading()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultLoadingTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (error()) {\n\t\t\t\t<tr class=\"hub-table__body-row\">\n\t\t\t\t\t<td class=\"hub-table__cell\" [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"errorTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"errorComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.error()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultErrorTpt\"\n\t\t\t\t\t\t\t[context]=\"{ error: error(), colspan: headersCount() }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t} @else if (rows().length) {\n\t\t\t\t@for (item of rows(); track $index) {\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"templateRow() || defaultRowTemplate\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{ $implicit: item }\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t}\n\t\t\t} @else {\n\t\t\t\t<tr>\n\t\t\t\t\t<td [attr.colspan]=\"headersCount()\">\n\t\t\t\t\t\t<hub-state-outlet\n\t\t\t\t\t\t\t[template]=\"noResultsTpt()\"\n\t\t\t\t\t\t\t[instanceDefault]=\"noResultsComponent()\"\n\t\t\t\t\t\t\t[globalDefault]=\"defaults.noResults()\"\n\t\t\t\t\t\t\t[fallback]=\"defaultNoResultsTpt\"\n\t\t\t\t\t\t\t[context]=\"{ colspan: headersCount(), filters: filters() ?? undefined }\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t}\n\t\t</tbody>\n\t</table>\n</div>\n\n<!-- Pagination -->\n@if (page() !== undefined && page() !== null) {\n\t<div class=\"hub-table__bottom-bar\">\n\t\t@if (paginationPosition() == 'bottom' || paginationPosition() === 'both') {\n\t\t\t<hub-paginator\n\t\t\t\tclass=\"hub-table__paginator hub-table__bottom-bar-paginator\"\n\t\t\t\t[(page)]=\"$any(page)\"\n\t\t\t\t[numberOfPages]=\"numberOfPages()\"\n\t\t\t\t[rtl]=\"isRtl()\"\n\t\t\t>\n\t\t\t</hub-paginator>\n\t\t}\n\t\t<div class=\"hub-table__bottom-bar-settings hub-paginator__settings\">\n\t\t\t<label class=\"hub-paginator__label\"> {{ 'ROWS_PER_PAGE' | translate | ucfirst }}: </label>\n\t\t\t<select\n\t\t\t\tclass=\"hub-paginator__select\"\n\t\t\t\t[ngModel]=\"perPage()\"\n\t\t\t\t(ngModelChange)=\"perPage.set($event)\"\n\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t>\n\t\t\t\t@for (option of perPageOptions(); track option) {\n\t\t\t\t\t<option [ngValue]=\"option\" class=\"hub-paginator__select-option\">\n\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t</select>\n\t\t</div>\n\t\t@if (totalItems() !== null && totalItems() !== undefined) {\n\t\t\t<p class=\"hub-table__bottom-bar-info hub-paginator__info\">\n\t\t\t\t{{\n\t\t\t\t\t'SHOWING_X_OF_Y_ROWS'\n\t\t\t\t\t\t| translate\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\tamount: rows().length,\n\t\t\t\t\t\t\t\t\ttotal: totalItems()\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t| ucfirst\n\t\t\t\t}}\n\t\t\t</p>\n\t\t}\n\t</div>\n}\n<ng-template #defaultRowTemplate let-item>\n\t<tr\n\t\tclass=\"hub-table__body-row\"\n\t\t(click)=\"onItemClick($event, item)\"\n\t\t[class.hub-table__body-row--selected]=\"selectable() && item.selected\"\n\t\t[class.hub-table__body-row--clickable]=\"clickFn()\"\n\t\t[ngClass]=\"_getRowClass(item)\"\n\t>\n\t\t@if (selectable() || batchActions.length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--select sticky-start\">\n\t\t\t\t<input\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t[(ngModel)]=\"item.selected\"\n\t\t\t\t\t[ngModelOptions]=\"{ standalone: true }\"\n\t\t\t\t\t(click)=\"$event.stopPropagation(); toggle(item)\"\n\t\t\t\t/>\n\t\t\t</td>\n\t\t}\n\t\t@for (header of fixedHeaders(); track $index) {\n\t\t\t@if (!(isColumnHidden(header) | async)) {\n\t\t\t\t<td\n\t\t\t\t\tclass=\"hub-table__cell\"\n\t\t\t\t\t[class.sticky-start]=\"header.sticky === 'start'\"\n\t\t\t\t\t[class.sticky-end]=\"header.sticky === 'end'\"\n\t\t\t\t\t[class.text-start]=\"header.align === 'start'\"\n\t\t\t\t\t[class.text-end]=\"header.align === 'end'\"\n\t\t\t\t\t[class.text-center]=\"header.align === 'center'\"\n\t\t\t\t\t[style.width]=\"header.buttons?.length ? '0' : 'auto'\"\n\t\t\t\t>\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t[ngTemplateOutlet]=\"getCellTemplate(header) || defaultCellTpt\"\n\t\t\t\t\t\t[ngTemplateOutletContext]=\"{\n\t\t\t\t\t\t\theader: header,\n\t\t\t\t\t\t\titem: item.data,\n\t\t\t\t\t\t\trow: item,\n\t\t\t\t\t\t\tproperty: item.data | get: header.property\n\t\t\t\t\t\t}\"\n\t\t\t\t\t>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</td>\n\t\t\t}\n\t\t}\n\t\t@if (templateExpandingRows().length) {\n\t\t\t<td class=\"hub-table__cell hub-table__cell--expander sticky-end\" [class.sticky-end]=\"stickyActions()\">\n\t\t\t\t@if (templateExpandingRows().length) {\n\t\t\t\t\t<button (click)=\"toggleExpandedRow(item)\" type=\"button\" class=\"hub-table__expander-btn btn btn-link px-2\">\n\t\t\t\t\t\t<i\n\t\t\t\t\t\t\tclass=\"hub-table__expander-icon hub-table__icon\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-up]=\"!item.collapsed\"\n\t\t\t\t\t\t\t[class.hub-table__icon--caret-down]=\"item.collapsed\"\n\t\t\t\t\t\t></i>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</td>\n\t\t}\n\t\t<!-- <td *ngIf=\"!lastColumnOnlyHasButtons && filterHeaders?.length\"></td> -->\n\t</tr>\n\t@if (!item.collapsed) {\n\t\t@for (template of templateExpandingRows(); track template) {\n\t\t\t<ng-container [ngTemplateOutlet]=\"template.templateRef\" [ngTemplateOutletContext]=\"{ item: item }\"> </ng-container>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultNoResultsTpt>\n\t<div class=\"hub-table__no-data alert alert-info d-flex align-items-center m-4\" role=\"alert\">\n\t\t<i class=\"hub-table__no-data-icon hub-table__icon hub-table__icon--info hub-table__icon--2x\" aria-hidden=\"true\"></i>\n\t\t{{ 'NO_RESULTS_FOUND' | translate | ucfirst }}\n\t</div>\n</ng-template>\n\n<ng-template #defaultLoadingTpt>\n\t<div class=\"hub-table__loading\">\n\t\t<svg\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\txmlns:xlink=\"http://www.w3.org/1999/xlink\"\n\t\t\tstyle=\"margin: auto; background: #fff; display: block\"\n\t\t\twidth=\"200px\"\n\t\t\theight=\"200px\"\n\t\t\tviewBox=\"0 0 100 100\"\n\t\t\tpreserveAspectRatio=\"xMidYMid\"\n\t\t>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#cccccc\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"0s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t\t<circle cx=\"50\" cy=\"50\" r=\"0\" fill=\"none\" stroke=\"#333333\" stroke-width=\"1\">\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"r\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"0;40\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0 0.2 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t\t<animate\n\t\t\t\t\tattributeName=\"opacity\"\n\t\t\t\t\trepeatCount=\"indefinite\"\n\t\t\t\t\tdur=\"1.6666666666666667s\"\n\t\t\t\t\tvalues=\"1;0\"\n\t\t\t\t\tkeyTimes=\"0;1\"\n\t\t\t\t\tkeySplines=\"0.2 0 0.8 1\"\n\t\t\t\t\tcalcMode=\"spline\"\n\t\t\t\t\tbegin=\"-0.8333333333333334s\"\n\t\t\t\t></animate>\n\t\t\t</circle>\n\t\t</svg>\n\t</div>\n</ng-template>\n\n<ng-template #defaultErrorTpt>\n\t<div class=\"hub-table__error m-4 p-4 text-center text-danger\">\n\t\t<svg\n\t\t\taria-hidden=\"true\"\n\t\t\tfocusable=\"false\"\n\t\t\tdata-prefix=\"fal\"\n\t\t\tdata-icon=\"sad-tear\"\n\t\t\trole=\"img\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tviewBox=\"0 0 496 512\"\n\t\t\tstyle=\"height: 64px\"\n\t\t>\n\t\t\t<path\n\t\t\t\tfill=\"#dc3545\"\n\t\t\t\td=\"M168 240c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zm160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32zM248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 464c-119.1 0-216-96.9-216-216S128.9 40 248 40s216 96.9 216 216-96.9 216-216 216zm0-152c-11.2 0-22 1.7-32.7 4.1-7.2-12.6-16.1-26.5-28.1-42.4-9-12.1-29.4-12-38.4 0-29.7 39.6-44.8 69-44.8 87.3 0 34.7 28.7 63 64 63s64-28.3 64-63c0-4.4-1-9.5-2.7-15.1 6.1-1.2 12.3-1.9 18.7-1.9 34.9 0 67.8 15.4 90.2 42.2 5.3 6.4 15.4 8 22.5 2 6.8-5.7 7.7-15.8 2-22.5C334.2 339.6 292.4 320 248 320zm-80 80c-17.7 0-32-13.9-32-31 0-7.7 10-28.8 32-59.5 22 30.7 32 51.8 32 59.5 0 17.1-14.3 31-32 31z\"\n\t\t\t\tclass=\"\"\n\t\t\t></path>\n\t\t</svg>\n\t\t<p>{{ 'ERROR_OCURRED' | translate }}</p>\n\t</div>\n</ng-template>\n\n<ng-template #defaultHeaderTpt let-header=\"header\" let-property=\"property\">\n\t@if (header.icon) {\n\t\t<i class=\"hub-table__header-icon {{ header.icon }}\" aria-hidden=\"true\"></i>\n\t}\n\t<div\n\t\tclass=\"hub-table__header-title\"\n\t\t[class.me-auto]=\"header.align === 'start'\"\n\t\t[class.ms-auto]=\"header.align === 'end'\"\n\t\t[class.mx-auto]=\"header.align === 'center'\"\n\t>\n\t\t@if (header.title) {\n\t\t\t<span class=\"hub-table__header-title-text text-wrap\">{{ header.title ?? header.property | unwrapAsync }}</span>\n\t\t}\n\t</div>\n</ng-template>\n\n<ng-template #defaultFilterTpt let-header=\"header\" let-formControl=\"formControl\">\n\t@switch (header.filter.type) {\n\t\t@case ('dropdown') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t@if (header.filter.placeholder) {\n\t\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t\t{{ header.filter.placeholder }}\n\t\t\t\t\t</option>\n\t\t\t\t}\n\t\t\t\t@if (header.filter.options | isObservable) {\n\t\t\t\t\t@let options = header.filter.options | async;\n\t\t\t\t\t@for (option of $any(options); track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t} @else {\n\t\t\t\t\t@for (option of header.filter.options; track option) {\n\t\t\t\t\t\t<option [value]=\"option[header.filter.bindValue || 'id']\">\n\t\t\t\t\t\t\t{{ option[header.filter.bindLabel || 'name'] }}\n\t\t\t\t\t\t</option>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t</select>\n\t\t}\n\t\t@case ('number-range') {\n\t\t\t<hub-table-range-input type=\"number\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('date-range') {\n\t\t\t<hub-table-range-input type=\"date\" [formControl]=\"formControl\"> </hub-table-range-input>\n\t\t}\n\t\t@case ('boolean') {\n\t\t\t<select [formControl]=\"formControl\" class=\"form-select form-control\">\n\t\t\t\t<option [ngValue]=\"null\">\n\t\t\t\t\t{{ header.filter.placeholder ?? 'SELECT_ONE' | translate | ucfirst }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"true\">\n\t\t\t\t\t{{ header.filter.trueLabel ?? ('TRUE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t\t<option [ngValue]=\"false\">\n\t\t\t\t\t{{ header.filter.falseLabel ?? ('FALSE' | translate | ucfirst) }}\n\t\t\t\t</option>\n\t\t\t</select>\n\t\t}\n\t\t@default {\n\t\t\t<input\n\t\t\t\t[type]=\"header.filter.type\"\n\t\t\t\t[formControl]=\"formControl\"\n\t\t\t\tclass=\"form-control\"\n\t\t\t\t[placeholder]=\"header.filter.placeholder || ''\"\n\t\t\t/>\n\t\t}\n\t}\n</ng-template>\n\n<ng-template #defaultCellTpt let-property=\"property\" let-item=\"item\" let-row=\"row\" let-header=\"header\">\n\t@if (header.buttons) {\n\t\t<div class=\"hub-table__cell-buttons d-flex flex-nowrap gap-2 justify-content-end align-items-center\">\n\t\t\t@for (button of header.buttons; track button) {\n\t\t\t\t@if (button.buttons) {\n\t\t\t\t\t<hub-table-dropdown [options]=\"button\" [row]=\"row\" class=\"hub-table__cell-dropdown d-inline-block\">\n\t\t\t\t\t</hub-table-dropdown>\n\t\t\t\t} @else {\n\t\t\t\t\t@if (!(isHidden(button, row) | async)) {\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclass=\"hub-table__cell-btn\"\n\t\t\t\t\t\t\t[attr.title]=\"button.tooltip | unwrapAsync\"\n\t\t\t\t\t\t\t(click)=\"handleAction($event, button, row)\"\n\t\t\t\t\t\t\t[ngClass]=\"getRowActionClassList(button)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"hub-table__cell-btn-content d-flex flex-nowrap align-items-center gap-1\">\n\t\t\t\t\t\t\t\t<ng-hub-ui-icon [config]=\"button.icon\"></ng-hub-ui-icon>\n\t\t\t\t\t\t\t\t@if (button.label) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.label | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t} @else if (button.title) {\n\t\t\t\t\t\t\t\t\t<span class=\"hub-table__cell-btn-label\">{{ button.title | unwrapAsync }}</span>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t</div>\n\t} @else {\n\t\t<span class=\"hub-table__cell-value\">{{ property }}</span>\n\t}\n</ng-template>\n", styles: [":root,:host{--hub-table-container-bg: var(--hub-ref-color-white, #fff);--hub-table-container-color: var(--hub-sys-text-primary, #212529);--hub-table-border-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-border-radius: var(--hub-ref-radius-md, .375rem);--hub-table-border-width: var(--hub-ref-border-width, 1px);--hub-table-container-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-top-bar-justify-content: end;--hub-table-top-bar-align-items: center;--hub-table-top-bar-wrap: wrap;--hub-table-batch-actions-gap: var(--hub-ref-space-2, .5rem);--hub-table-batch-actions-margin-inline-end: auto;--hub-table-bottom-bar-gap: var(--hub-ref-space-3, 1rem);--hub-table-bottom-bar-justify-content: space-around;--hub-table-bottom-bar-align-items: center;--hub-table-bottom-bar-wrap: wrap;--hub-table-bottom-bar-paginator-order: 1;--hub-table-bottom-bar-settings-order: 2;--hub-table-bottom-bar-info-order: 3;--hub-table-bottom-bar-paginator-flex: 0 0 auto;--hub-table-bottom-bar-settings-flex: 0 0 auto;--hub-table-bottom-bar-info-flex: 0 0 auto;--hub-table-icon-color: currentColor;--hub-table-icon-size: 1em;--hub-table-icon-sort: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 41.4c12.5-12.5 32.8-12.5 45.3 0l128 128c9.2 9.2 11.9 22.9 6.9 34.9s-16.6 19.8-29.6 19.8H32c-12.9 0-24.6-7.8-29.6-19.8s-2.2-25.7 6.9-34.9l128-128zm0 429.3l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128c-12.5 12.5-32.8 12.5-45.3 0z'/%3E%3C/svg%3E\");--hub-table-icon-sort-up: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");--hub-table-icon-sort-down: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");--hub-table-accent-bg: transparent;--hub-table-active-bg: var(--hub-sys-state-active-bg, rgba(0, 0, 0, .1));--hub-table-active-color: var(--hub-sys-text-primary, #212529);--hub-table-accent: var(--hub-sys-color-primary, #0d6efd);--hub-table-accent-emphasis: color-mix(in oklch, var(--hub-table-accent) 80%, var(--hub-sys-color-ink, #212529));--hub-table-accent-subtle: color-mix(in oklch, var(--hub-table-accent) 12%, var(--hub-sys-surface-page, #ffffff));--hub-table-accent-on: oklch(from var(--hub-table-accent) clamp(0, (.62 - l) * 1000, 1) 0 h);--hub-table-selected-bg: var(--hub-table-accent-subtle);--hub-table-selected-color: var(--hub-sys-text-primary, #212529);--hub-table-bg: var(--hub-ref-color-white, #fff);--hub-table-bg-state: initial;--hub-table-bg-type: initial;--hub-table-cell-padding-x: var(--hub-ref-space-3, 1rem);--hub-table-cell-padding-x-sm: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y: var(--hub-ref-space-2, .5rem);--hub-table-cell-padding-y-sm: var(--hub-ref-space-1, .25rem);--hub-table-cell-vertical-align: middle;--hub-table-color: var(--hub-sys-text-primary, #212529);--hub-table-color-state: initial;--hub-table-color-type: initial;--hub-table-group-separator-color: var(--hub-sys-border-color-default, #dee2e6);--hub-table-search-button-bg: var(--hub-table-container-bg);--hub-table-search-button-border-color: var(--hub-table-border-color);--hub-table-search-button-color: var(--hub-table-container-color);--hub-table-search-button-min-width: 2.75rem;--hub-table-search-input-bg: var(--hub-table-container-bg);--hub-table-search-input-border-color: var(--hub-table-border-color);--hub-table-search-input-color: var(--hub-table-container-color);--hub-table-search-border-width: var(--hub-table-border-width);--hub-table-search-border-radius: var(--hub-table-border-radius);--hub-table-search-input-padding-x: .75rem;--hub-table-search-input-padding-y: .375rem;--hub-table-search-input-font-size: 1rem;--hub-table-filter-button-active-bg: color-mix(in oklch, var(--hub-sys-color-success, #198754) 10%, transparent);--hub-table-filter-button-active-border-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-hover-bg: rgba(0, 0, 0, .05);--hub-table-filter-button-icon-active-color: var(--hub-sys-color-success, #198754);--hub-table-filter-button-icon-color: var(--hub-sys-text-muted, #6c757d);--hub-table-filter-button-gap: var(--hub-ref-space-2, .5rem);--hub-table-filter-button-padding-x: .75rem;--hub-table-filter-button-padding-y: .375rem;--hub-table-filter-button-border-width: 1px;--hub-table-filter-button-border-color: transparent;--hub-table-filter-button-border-radius: var(--hub-ref-radius-sm, .25rem);--hub-table-filter-button-transition: all .2s ease;--hub-table-filter-count-bg: var(--hub-sys-color-success, #198754);--hub-table-filter-count-color: var(--hub-ref-color-white, #fff);--hub-table-filter-count-size: 1.25rem;--hub-table-filter-count-padding-x: .4em;--hub-table-filter-count-font-size: .7rem;--hub-table-filter-count-font-weight: var(--hub-ref-font-weight-bold, 700);--hub-table-filter-count-border-radius: var(--hub-ref-radius-pill, 50rem);--hub-table-batch-actions-btn-icon-gap: var(--hub-ref-space-1, .25rem);--hub-table-hover-bg: var(--hub-sys-state-hover-bg, rgba(0, 0, 0, .075));--hub-table-hover-color: var(--hub-sys-text-primary, #212529);--hub-table-striped-bg: var(--hub-sys-state-striped-bg, rgba(0, 0, 0, .05));--hub-table-striped-color: var(--hub-sys-text-primary, #212529)}:host{display:flex;flex-direction:column;gap:var(--hub-table-container-gap);min-width:0;color:var(--hub-table-container-color)}:host .hub-table__top-bar{display:flex;justify-content:var(--hub-table-top-bar-justify-content);align-items:var(--hub-table-top-bar-align-items);flex-wrap:var(--hub-table-top-bar-wrap);gap:var(--hub-table-top-bar-gap)}:host .hub-table__batch-actions{display:flex;align-items:center;gap:var(--hub-table-batch-actions-gap);margin-inline-end:var(--hub-table-batch-actions-margin-inline-end)}:host .hub-table__batch-actions-btn-icon{margin-right:var(--hub-table-batch-actions-btn-icon-gap)}:host .hub-table__batch-actions-btn--default,:host .hub-table__cell-btn--default{border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius)}:host .hub-table__search{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:end}:host .hub-table__search-input{position:relative;flex:1 1 auto;width:1%;min-width:0;display:block;width:100%;padding:var(--hub-table-search-input-padding-y) var(--hub-table-search-input-padding-x);font-size:var(--hub-table-search-input-font-size);font-weight:var(--hub-ref-font-weight-base, 400);line-height:var(--hub-ref-line-height-base, 1.5);color:var(--hub-table-search-input-color);appearance:none;background-color:var(--hub-table-search-input-bg);background-clip:padding-box;border:var(--hub-table-search-border-width) solid var(--hub-table-search-input-border-color);border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}:host .hub-table__search-button{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-search-button-min-width);color:var(--hub-table-search-button-color);background-color:var(--hub-table-search-button-bg);border-color:var(--hub-table-search-button-border-color);border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host .hub-table__bottom-bar{display:flex;justify-content:var(--hub-table-bottom-bar-justify-content);align-items:var(--hub-table-bottom-bar-align-items);flex-wrap:var(--hub-table-bottom-bar-wrap);gap:var(--hub-table-bottom-bar-gap)}:host .hub-table__bottom-bar-paginator{order:var(--hub-table-bottom-bar-paginator-order);flex:var(--hub-table-bottom-bar-paginator-flex)}:host .hub-table__bottom-bar-settings{order:var(--hub-table-bottom-bar-settings-order);flex:var(--hub-table-bottom-bar-settings-flex);margin:0}:host .hub-table__bottom-bar-info{order:var(--hub-table-bottom-bar-info-order);flex:var(--hub-table-bottom-bar-info-flex);margin:0}:host .hub-table__paginator{overflow:auto;margin:0}:host .hub-table__filter-button{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--hub-table-filter-button-gap);padding:var(--hub-table-filter-button-padding-y) var(--hub-table-filter-button-padding-x);cursor:pointer;border:var(--hub-table-filter-button-border-width) solid var(--hub-table-filter-button-border-color);border-radius:var(--hub-table-filter-button-border-radius);transition:var(--hub-table-filter-button-transition)}:host .hub-table__filter-button:hover{background-color:var(--hub-table-filter-button-hover-bg)}:host .hub-table__filter-button--active{background-color:var(--hub-table-filter-button-active-bg);border-color:var(--hub-table-filter-button-active-border-color)}:host .hub-table__filter-button--active .hub-table__filter-button-icon{color:var(--hub-table-filter-button-icon-active-color)}:host .hub-table__filter-button-icon{transition:color .2s ease;color:var(--hub-table-filter-button-icon-color)}:host .hub-table__filter-count{display:inline-flex;align-items:center;justify-content:center;min-width:var(--hub-table-filter-count-size);height:var(--hub-table-filter-count-size);padding:0 var(--hub-table-filter-count-padding-x);font-size:var(--hub-table-filter-count-font-size);font-weight:var(--hub-table-filter-count-font-weight);line-height:1;color:var(--hub-table-filter-count-color);text-align:center;white-space:nowrap;background-color:var(--hub-table-filter-count-bg);border-radius:var(--hub-table-filter-count-border-radius);animation:badge-appear .2s ease}:host .hub-table__no-data-icon{margin-right:1.5rem}:host .hub-table__header-icon{margin-right:.5rem}:host .hub-table__icon{display:inline-block;width:var(--hub-table-icon-size);height:var(--hub-table-icon-size);background-color:var(--hub-table-icon-color);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;vertical-align:middle}:host .hub-table__icon--xs{--hub-table-icon-size: .75em}:host .hub-table__icon--sm{--hub-table-icon-size: .875em}:host .hub-table__icon--lg{--hub-table-icon-size: 1.33em}:host .hub-table__icon--2x{--hub-table-icon-size: 2em}:host .hub-table__icon--3x{--hub-table-icon-size: 3em}:host .hub-table__icon--4x{--hub-table-icon-size: 4em}:host .hub-table__icon--5x{--hub-table-icon-size: 5em}:host .hub-table__icon--search{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E\")}:host .hub-table__icon--filter{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M3.9 54.9C10.5 40.9 24.5 32 40 32H472c15.5 0 29.5 8.9 36.1 22.9s4.6 30.5-5.2 42.5L320 320.9V448c0 12.1-6.8 23.2-17.7 28.6s-23.8 4.3-33.5-3l-64-48c-8.1-6-12.8-15.5-12.8-25.6V320.9L9 97.3C-.7 85.4-2.8 68.8 3.9 54.9z'/%3E%3C/svg%3E\")}:host .hub-table__icon--eraser{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M290.7 57.4L57.4 290.7c-25 25-25 65.5 0 90.5l80 80c12 12 28.3 18.7 45.3 18.7H288h9.4H512c17.7 0 32-14.3 32-32s-14.3-32-32-32H387.9L518.6 285.3c25-25 25-65.5 0-90.5L381.3 57.4c-25-25-65.5-25-90.5 0zM297.4 416H288l-105.4 0-80-80L227.3 211.3 364.7 348.7 297.4 416z'/%3E%3C/svg%3E\")}:host .hub-table__icon--info{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E\");margin-right:1.5rem}:host .hub-table__icon--sort{-webkit-mask-image:var(--hub-table-icon-sort);mask-image:var(--hub-table-icon-sort)}:host .hub-table__icon--sort-up{-webkit-mask-image:var(--hub-table-icon-sort-up);mask-image:var(--hub-table-icon-sort-up)}:host .hub-table__icon--sort-down{-webkit-mask-image:var(--hub-table-icon-sort-down);mask-image:var(--hub-table-icon-sort-down)}:host .hub-table__icon--caret-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M182.6 137.4c-12.5-12.5-32.8-12.5-45.3 0l-128 128c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8H288c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-128-128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--caret-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8H32c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-up{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-down{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5 12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--chevron-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 105.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-left{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 246.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160zm352-160l-160 160c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 438.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--angle-double-right{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 265.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160zm-352 160l160-160c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 73.4 393.4c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--ellipsis-v{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 128 512'%3E%3Cpath d='M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z'/%3E%3C/svg%3E\")}:host .hub-table__icon--trash{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__icon--plus{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E\");margin-right:.5rem}:host .hub-table__container{overflow:auto;background-color:var(--hub-table-container-bg);border:var(--hub-table-border-width) solid var(--hub-table-border-color);border-radius:var(--hub-table-border-radius);color:var(--hub-table-container-color)}:host .hub-table__element{position:relative;width:100%;border-collapse:collapse;border-spacing:0;vertical-align:var(--hub-table-cell-vertical-align);border-color:var(--hub-table-border-color);background-color:var(--hub-table-bg);color:var(--hub-table-color)}:host .hub-table__element .sticky-start{background-color:var(--hub-table-bg);left:0;position:sticky;z-index:9}:host .hub-table__element .sticky-end{background-color:var(--hub-table-bg);right:0;position:sticky;z-index:9}:host .hub-table__element .clickable-item{cursor:pointer}:host .hub-table__element>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y) var(--hub-table-cell-padding-x);vertical-align:var(--hub-table-cell-vertical-align);color:var(--hub-table-color-state, var(--hub-table-color-type, var(--hub-table-color)));background-color:var(--hub-table-bg);border-bottom-style:solid;border-bottom-color:var(--hub-table-border-color);border-bottom-width:var(--hub-table-border-width);box-shadow:inset 0 0 0 9999px var(--hub-table-bg-state, var(--hub-table-bg-type, var(--hub-table-accent-bg)))}:host .hub-table__element>tbody{vertical-align:inherit}:host .hub-table__element>thead{vertical-align:bottom}:host .hub-table__scrollable thead{position:sticky;top:0;z-index:10}:host .hub-table__group-divider{border-top:calc(var(--hub-table-border-width) * 2) solid var(--hub-table-group-separator-color)}:host .hub-table__sm>:not(caption)>*>*{padding:var(--hub-table-cell-padding-y-sm) var(--hub-table-cell-padding-x-sm)}:host .hub-table__bordered>:not(caption)>*{border-style:solid;border-width:var(--hub-table-border-width) 0}:host .hub-table__bordered>:not(caption)>*>*{border-style:solid;border-width:0 var(--hub-table-border-width)}:host .hub-table__borderless>:not(caption)>*>*{border-bottom-width:0}:host .hub-table__borderless>:not(:first-child){border-top-width:0}:host .hub-table__striped-odd>tbody>tr:nth-of-type(odd)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-even>tbody>tr:nth-of-type(2n)>*{color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-odd>:not(caption)>tr>:nth-child(odd){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__striped-columns-even>:not(caption)>tr>:nth-child(2n){color:var(--hub-table-striped-color);background-color:var(--hub-table-striped-bg)}:host .hub-table__active{--hub-table-color-state: var(--hub-table-active-color);--hub-table-bg-state: var(--hub-table-active-bg)}:host .hub-table__hover>tbody>tr:hover>*{--hub-table-color-state: var(--hub-table-hover-color);--hub-table-bg-state: var(--hub-table-hover-bg)}:host .hub-table__body-row--selected>*,:host .hub-table__hover>tbody>tr.hub-table__body-row--selected:hover>*{--hub-table-color-state: var(--hub-table-selected-color);--hub-table-bg-state: var(--hub-table-selected-bg)}:host .hub-table__responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.hub-table__primary{--hub-table-accent: var(--hub-sys-color-primary)}.hub-table__secondary{--hub-table-accent: var(--hub-sys-color-secondary)}.hub-table__success{--hub-table-accent: var(--hub-sys-color-success)}.hub-table__danger{--hub-table-accent: var(--hub-sys-color-danger)}.hub-table__warning{--hub-table-accent: var(--hub-sys-color-warning)}.hub-table__info{--hub-table-accent: var(--hub-sys-color-info)}.hub-table__neutral{--hub-table-accent: var(--hub-sys-color-neutral)}.hub-table__light{--hub-table-accent: var(--hub-sys-color-light)}.hub-table__dark{--hub-table-accent: var(--hub-sys-color-dark)}:host.hub-table--rtl{direction:rtl}:host.hub-table--rtl .hub-table__top-bar{direction:ltr}:host.hub-table--rtl .hub-table__batch-actions{order:2;flex-direction:row-reverse;margin-inline-end:0;margin-inline-start:auto}:host.hub-table--rtl .hub-table__batch-actions-btn-icon{margin-right:0;margin-left:var(--hub-table-batch-actions-btn-icon-gap)}:host.hub-table--rtl .hub-table__search{order:1;margin-inline-end:auto;margin-inline-start:0;direction:ltr}:host.hub-table--rtl .hub-table__search-input{direction:ltr;text-align:right;border-radius:0 var(--hub-table-search-border-radius) var(--hub-table-search-border-radius) 0}:host.hub-table--rtl .hub-table__search-button{border-radius:var(--hub-table-search-border-radius) 0 0 var(--hub-table-search-border-radius)}:host.hub-table--rtl .hub-table__no-data-icon{margin-right:0;margin-left:1.5rem}:host.hub-table--rtl .hub-table__header-icon{margin-right:0;margin-left:.5rem}.caption-top{caption-side:top}@media(max-width:576px){.hub-table__responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:768px){.hub-table__responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:992px){.hub-table__responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1200px){.hub-table__responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:1400px){.hub-table__responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@keyframes badge-appear{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}\n"] }]
4681
4681
  }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], debounce: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounce", required: false }] }], headers: [{ type: i0.Input, args: [{ isSignal: true, alias: "headers", required: false }] }, { type: i0.Output, args: ["headersChange"] }], filters: [{ type: i0.Input, args: [{ isSignal: true, alias: "filters", required: false }] }, { type: i0.Output, args: ["filtersChange"] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], perPageOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "perPageOptions", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], perPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "perPage", required: false }] }, { type: i0.Output, args: ["perPageChange"] }], totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: false }] }, { type: i0.Output, args: ["totalItemsChange"] }], ordination: [{ type: i0.Input, args: [{ isSignal: true, alias: "ordination", required: false }] }, { type: i0.Output, args: ["ordinationChange"] }], paginate: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginate", required: false }] }], bindValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "bindValue", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }, { type: i0.Output, args: ["loadingChange"] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }, { type: i0.Output, args: ["errorChange"] }], loadingComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingComponent", required: false }] }], errorComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorComponent", required: false }] }], noResultsComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsComponent", required: false }] }], paginationPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationPosition", required: false }] }], paginationInfo: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationInfo", required: false }] }], stickyActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyActions", required: false }] }], batchActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "batchActions", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], searchTerm: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchTerm", required: false }] }, { type: i0.Output, args: ["searchTermChange"] }], searchFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchFn", required: false }] }], compareFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareFn", required: false }] }], clickFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickFn", required: false }] }], rowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowClass", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], templateRow: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PaginableTableRowDirective), { ...{
4682
4682
  read: TemplateRef
4683
4683
  }, isSignal: true }] }], headerTpts: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => PaginableTableHeaderDirective), { isSignal: true }] }], templateCells: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => PaginableTableCellDirective), { isSignal: true }] }], noResultsTpt: [{ type: i0.ContentChild, args: [i0.forwardRef(() => PaginableNoResultsDirective), { ...{