@lucca-front/ng 22.1.0-rc.4 → 22.1.1

package/fesm2022/lucca-front-ng-core.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, LOCALE_ID, Inject, Optional, Injectable, inject, ViewContainerRef, Renderer2, TemplateRef, Injector, input, effect, untracked, Directive, booleanAttribute, numberAttribute, Pipe } from '@angular/core';
 import { getLocaleDateFormat, FormatWidth, formatDate } from '@angular/common';
-export { PrClass as LuClass } from '@lucca/prisme/core';
+export { LU_RANDOM, PrClass as LuClass } from '@lucca/prisme/core';
 import { BreakpointObserver } from '@angular/cdk/layout';
 import { toSignal } from '@angular/core/rxjs-interop';
 import { map } from 'rxjs';
@@ -286,10 +286,10 @@ class LuNativeDateAdapter extends ALuDateAdapter {
         }
         return this.forge(year, month, date);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuNativeDateAdapter, deps: [{ token: LOCALE_ID }, { token: LU_NATIVE_DATE_ADAPTER_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuNativeDateAdapter }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuNativeDateAdapter, deps: [{ token: LOCALE_ID }, { token: LU_NATIVE_DATE_ADAPTER_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuNativeDateAdapter }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuNativeDateAdapter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuNativeDateAdapter, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
@@ -370,10 +370,10 @@ class LuStringDateAdapter extends ALuDateAdapter {
         }
         return result;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuStringDateAdapter, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuStringDateAdapter }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuStringDateAdapter, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuStringDateAdapter }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuStringDateAdapter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuStringDateAdapter, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
@@ -545,10 +545,10 @@ class PortalDirective {
     static ngTemplateContextGuard(_dir, _ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: PortalDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.4", type: PortalDirective, isStandalone: true, selector: "[luPortal]", inputs: { luPortal: { classPropertyName: "luPortal", publicName: "luPortal", isSignal: true, isRequired: true, transformFunction: null }, luPortalContext: { classPropertyName: "luPortalContext", publicName: "luPortalContext", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: PortalDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.2.1", type: PortalDirective, isStandalone: true, selector: "[luPortal]", inputs: { luPortal: { classPropertyName: "luPortal", publicName: "luPortal", isSignal: true, isRequired: true, transformFunction: null }, luPortalContext: { classPropertyName: "luPortalContext", publicName: "luPortalContext", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: PortalDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: PortalDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[luPortal]',
@@ -653,10 +653,10 @@ class IntlParamsPipe {
             return args[key]?.toString() ?? base;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: IntlParamsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.1.4", ngImport: i0, type: IntlParamsPipe, isStandalone: true, name: "intlParams" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: IntlParamsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.2.1", ngImport: i0, type: IntlParamsPipe, isStandalone: true, name: "intlParams" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: IntlParamsPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: IntlParamsPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'intlParams',
@@ -690,10 +690,10 @@ class IntlPluralLabelPipe {
     transform(value, count) {
         return typeof value === 'string' ? value : getIntlPluralLabel(this.pluralRules, value, count);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: IntlPluralLabelPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.1.4", ngImport: i0, type: IntlPluralLabelPipe, isStandalone: true, name: "intlPluralLabel" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: IntlPluralLabelPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.2.1", ngImport: i0, type: IntlPluralLabelPipe, isStandalone: true, name: "intlPluralLabel" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: IntlPluralLabelPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: IntlPluralLabelPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'intlPluralLabel',
@@ -729,10 +729,10 @@ class LuTypeGuardPipe {
     transform(obj, typeGuardFn) {
         return typeGuardFn(obj);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuTypeGuardPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.1.4", ngImport: i0, type: LuTypeGuardPipe, isStandalone: true, name: "luTypeGuard" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuTypeGuardPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.2.1", ngImport: i0, type: LuTypeGuardPipe, isStandalone: true, name: "luTypeGuard" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: LuTypeGuardPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: LuTypeGuardPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'luTypeGuard',

package/fesm2022/lucca-front-ng-data-table.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, input, model, inject, computed, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component, ElementRef, DestroyRef, viewChild, signal, contentChildren, contentChild, afterNextRender } from '@angular/core';
+import { InjectionToken, input, model, inject, computed, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component, ElementRef, DestroyRef, output, linkedSignal, viewChild, signal, contentChildren, contentChild, afterNextRender } from '@angular/core';
 import { ButtonComponent } from '@lucca-front/ng/button';
 import { PortalDirective, luBooleanAttribute, isNotNil, intlInputOptions, luNumberAttribute, ɵeffectWithDeps as _effectWithDeps } from '@lucca-front/ng/core';
 import { IconComponent } from '@lucca-front/ng/icon';
@@ -37,15 +37,15 @@ class DataTableBodyComponent {
     expandedToggle() {
         this.expanded.set(!this.expanded());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: DataTableBodyComponent, isStandalone: true, selector: "tbody[luDataTableBody]", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, groupButtonAlt: { classPropertyName: "groupButtonAlt", publicName: "groupButtonAlt", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { classAttribute: "dataTable-body" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: DataTableBodyComponent, isStandalone: true, selector: "tbody[luDataTableBody]", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, groupButtonAlt: { classPropertyName: "groupButtonAlt", publicName: "groupButtonAlt", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { classAttribute: "dataTable-body" }, providers: [
             {
                 provide: LU_DATA_TABLE_BODY_INSTANCE,
                 useExisting: forwardRef(() => DataTableBodyComponent),
             },
         ], ngImport: i0, template: "@if (group(); as group) {\n\t@if (groupButtonAlt(); as groupButtonAlt) {\n\t\t<tr class=\"dataTable-body-row mod-group\">\n\t\t\t<td class=\"dataTable-body-row-cell\" [attr.colspan]=\"colspan()\">\n\t\t\t\t<div class=\"dataTable-body-row-cell-expand\">\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclass=\"dataTable-body-row-cell-expand-button\"\n\t\t\t\t\t\tluButton\n\t\t\t\t\t\tdisclosure\n\t\t\t\t\t\t[attr.aria-expanded]=\"expanded()\"\n\t\t\t\t\t\t(click)=\"expandedToggle()\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<lu-icon icon=\"arrowChevronTop\" [alt]=\"groupButtonAlt\" />\n\t\t\t\t\t</button>\n\t\t\t\t\t<ng-container *luPortal=\"group\" />\n\t\t\t\t</div>\n\t\t\t</td>\n\t\t</tr>\n\t}\n}\n<ng-content />\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[luButton], a[luButton], span[luButton], button[prButton], a[prButton], span[prButton]", inputs: ["size", "block", "disabled", "critical", "delete", "disclosure", "palette", "state", "luButton", "prButton"] }, { kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tbody[luDataTableBody]', encapsulation: ViewEncapsulation.None, host: {
                         class: 'dataTable-body',
@@ -88,10 +88,10 @@ class BaseDataTableCell {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: BaseDataTableCell, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: BaseDataTableCell, isStandalone: true, selector: "lu-base-data-table-cell", inputs: { editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: BaseDataTableCell, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.1", type: BaseDataTableCell, isStandalone: true, selector: "lu-base-data-table-cell", inputs: { editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: BaseDataTableCell, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: BaseDataTableCell, decorators: [{
             type: Component,
             args: [{
                     selector: 'lu-base-data-table-cell',
@@ -108,8 +108,11 @@ class DataTableRowCellHeaderComponent extends BaseDataTableCell {
         super(...arguments);
         this.elementRef = inject(ElementRef);
         this.#destroyRef = inject(DestroyRef);
-        this.sort = model(null, /* @ts-ignore */
+        this.sort = input(null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "sort" }] : /* istanbul ignore next */ []));
+        this.sortChange = output();
+        this.currentSort = linkedSignal(() => this.sort(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "currentSort" }] : /* istanbul ignore next */ []));
         this.fixedWidth = input(null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "fixedWidth" }] : /* istanbul ignore next */ []));
         this.inlineSize = input(null, /* @ts-ignore */
@@ -155,20 +158,22 @@ class DataTableRowCellHeaderComponent extends BaseDataTableCell {
         this.#destroyRef.onDestroy(() => observer.disconnect());
     }
     toggleSort() {
-        const sort = this.sort();
+        const sort = this.currentSort();
         if (isNotNil(sort)) {
-            this.sort.set(SORT_VALUES[(SORT_VALUES.indexOf(sort) + 1) % SORT_VALUES.length]);
+            const next = SORT_VALUES[(SORT_VALUES.indexOf(sort) + 1) % SORT_VALUES.length];
+            this.currentSort.set(next);
+            this.sortChange.emit(next);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableRowCellHeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: DataTableRowCellHeaderComponent, isStandalone: true, selector: "th[luDataTableCell]", inputs: { sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, fixedWidth: { classPropertyName: "fixedWidth", publicName: "fixedWidth", isSignal: true, isRequired: false, transformFunction: null }, inlineSize: { classPropertyName: "inlineSize", publicName: "inlineSize", isSignal: true, isRequired: false, transformFunction: null }, sortWithEllipsis: { classPropertyName: "sortWithEllipsis", publicName: "sortWithEllipsis", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sort: "sortChange" }, host: { properties: { "class.dataTable-body-row-cell": "bodyRef !== null", "class.dataTable-head-row-cell": "headRef !== null", "class.dataTable-foot-row-cell": "footRef !== null", "class.mod-alignStart": "align() === \"start\"", "class.mod-alignCenter": "align() === \"center\"", "class.mod-alignEnd": "align() === \"end\"", "class.mod-stickyColumn": "isStickyStart() || isStickyEnd()", "attr.aria-sort": "sort()", "class.mod-editable": "editable()", "attr.scope": "bodyRef !== null ? \"row\" : \"col\"", "style.--dataTable-layoutFixed-width": "inlineSize() || fixedWidth()", "style.insetInlineStart": "insetInlineStart()", "style.insetInlineEnd": "insetInlineEnd()" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableRowCellHeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: DataTableRowCellHeaderComponent, isStandalone: true, selector: "th[luDataTableCell]", inputs: { sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, fixedWidth: { classPropertyName: "fixedWidth", publicName: "fixedWidth", isSignal: true, isRequired: false, transformFunction: null }, inlineSize: { classPropertyName: "inlineSize", publicName: "inlineSize", isSignal: true, isRequired: false, transformFunction: null }, sortWithEllipsis: { classPropertyName: "sortWithEllipsis", publicName: "sortWithEllipsis", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sortChange: "sortChange" }, host: { properties: { "class.dataTable-body-row-cell": "bodyRef !== null", "class.dataTable-head-row-cell": "headRef !== null", "class.dataTable-foot-row-cell": "footRef !== null", "class.mod-alignStart": "align() === \"start\"", "class.mod-alignCenter": "align() === \"center\"", "class.mod-alignEnd": "align() === \"end\"", "class.mod-stickyColumn": "isStickyStart() || isStickyEnd()", "attr.aria-sort": "currentSort()", "class.mod-editable": "editable()", "attr.scope": "bodyRef !== null ? \"row\" : \"col\"", "style.--dataTable-layoutFixed-width": "inlineSize() || fixedWidth()", "style.insetInlineStart": "insetInlineStart()", "style.insetInlineEnd": "insetInlineEnd()" } }, providers: [
             {
                 provide: LU_DATA_TABLE_CELL_INSTANCE,
                 useExisting: forwardRef(() => DataTableRowCellHeaderComponent),
             },
-        ], viewQueries: [{ propertyName: "sortButtonRef", first: true, predicate: ["sortButton"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (sort()) {\n\t<button luButton type=\"button\" class=\"tableSortable\" [class.mod-ellipsis]=\"sortWithEllipsis()\" (click)=\"toggleSort()\" #sortButton>\n\t\t<span\n\t\t\tclass=\"tableSortable-label\"\n\t\t\t[luTooltipDisabled]=\"!sortWithEllipsis()\"\n\t\t\tluTooltip\n\t\t\tluTooltipWhenEllipsis\n\t\t\t[luTooltipTriggerAnchor]=\"sortButtonRef()\"\n\t\t\t><ng-container *ngTemplateOutlet=\"contentTpl\"\n\t\t/></span>\n\t\t<span class=\"tableSortable-arrows\">\n\t\t\t<lu-icon icon=\"chevronTop\" class=\"tableSortable-arrows-ascending\" />\n\t\t\t<lu-icon icon=\"chevronBottom\" class=\"tableSortable-arrows-descending\" />\n\t\t</span>\n\t</button>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"contentTpl\" />\n}\n\n<ng-template #contentTpl><ng-content /></ng-template>\n", styles: ["@layer components{.tableSortable.button{--components-sortable-arrowColor: var(--palettes-neutral-500);--components-sortable-arrowScale: 1;--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1);--components-sortable-fontWeight: 400;--components-sortable-fontSize: var(--pr-t-font-body-M-fontSize);--components-sortable-lineHeight: var(--pr-t-font-body-M-lineHeight);--components-sortable-arrowsOffset: var(--pr-t-spacings-50);--components-sortable-minInlineSize: auto;--components-sortable-maxInlineSize: none;-webkit-user-select:none;user-select:none;font-weight:var(--components-sortable-fontWeight);vertical-align:top;align-items:flex-end;min-inline-size:var(--components-sortable-minInlineSize);max-inline-size:var(--components-sortable-maxInlineSize);inset-inline-start:var(--components-sortable-offset);padding:0 var(--pr-t-spacings-50);gap:var(--pr-t-spacings-25);text-align:inherit;flex-direction:var(--components-sortable-direction);font-size:var(--components-sortable-fontSize);line-height:var(--components-sortable-lineHeight);color:currentColor;--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}.tableSortable.button:hover,.tableSortable.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}.tableSortable.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.tableSortable.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}.tableSortable-label{min-inline-size:0}.tableSortable-arrows{margin-block-end:var(--components-sortable-arrowsOffset);position:relative;inline-size:1rem;block-size:1rem;flex-shrink:0}.tableSortable-arrows-ascending,.tableSortable-arrows-descending{--icon-size: 1rem;position:absolute;inset:0;color:var(--components-sortable-arrowColor);transition-property:translate,scale,color;transition-duration:var(--commons-animations-durations-slow);scale:var(--components-sortable-arrowScale)}.tableSortable-arrows-ascending{translate:0 calc(var(--pr-t-spacings-50) * -1)}.tableSortable-arrows-descending{translate:0 var(--pr-t-spacings-50)}}@layer mods{.tableSortable.mod-ellipsis{--components-sortable-minInlineSize: 0;--components-sortable-maxInlineSize: 100%}.tableSortable.mod-ellipsis .tableSortable-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer mods{.table-head-row-cell.mod-alignStart .tableSortable,.table-head-row-cell.mod-alignLeft .tableSortable,.dataTable-head-row-cell.mod-alignStart .tableSortable,.dataTable-head-row-cell.mod-alignLeft .tableSortable,.indexTable-head-row-cell.mod-alignStart .tableSortable,.indexTable-head-row-cell.mod-alignLeft .tableSortable{--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1)}.table-head-row-cell.mod-alignEnd .tableSortable,.table-head-row-cell.mod-alignRight .tableSortable,.dataTable-head-row-cell.mod-alignEnd .tableSortable,.dataTable-head-row-cell.mod-alignRight .tableSortable,.indexTable-head-row-cell.mod-alignEnd .tableSortable,.indexTable-head-row-cell.mod-alignRight .tableSortable{--components-sortable-direction: row-reverse;--components-sortable-offset: var(--pr-t-spacings-50)}.table-head-row-cell.mod-alignCenter .tableSortable,.dataTable-head-row-cell.mod-alignCenter .tableSortable,.indexTable-head-row-cell.mod-alignCenter .tableSortable{--components-sortable-offset: var(--pr-t-spacings-100)}.table-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.dataTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.indexTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.table-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.dataTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.indexTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending{--components-sortable-arrowColor: var(--palettes-neutral-700);--components-sortable-arrowScale: 1.25}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[luButton], a[luButton], span[luButton], button[prButton], a[prButton], span[prButton]", inputs: ["size", "block", "disabled", "critical", "delete", "disclosure", "palette", "state", "luButton", "prButton"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: LuTooltipTriggerDirective, selector: "[luTooltip],[prTooltip]", inputs: ["luTooltip", "prTooltip", "luTooltipEnterDelay", "prTooltipEnterDelay", "luTooltipLeaveDelay", "prTooltipLeaveDelay", "luTooltipDisabled", "prTooltipDisabled", "luTooltipOnlyForDisplay", "prTooltipOnlyForDisplay", "luTooltipPosition", "prTooltipPosition", "luTooltipWhenEllipsis", "prTooltipWhenEllipsis", "luTooltipAnchor", "prTooltipAnchor", "luTooltipTriggerAnchor", "prTooltipTriggerAnchor", "id"], exportAs: ["luTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "sortButtonRef", first: true, predicate: ["sortButton"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (currentSort()) {\n\t<button luButton type=\"button\" class=\"tableSortable\" [class.mod-ellipsis]=\"sortWithEllipsis()\" (click)=\"toggleSort()\" #sortButton>\n\t\t<span\n\t\t\tclass=\"tableSortable-label\"\n\t\t\t[luTooltipDisabled]=\"!sortWithEllipsis()\"\n\t\t\tluTooltip\n\t\t\tluTooltipWhenEllipsis\n\t\t\t[luTooltipTriggerAnchor]=\"sortButtonRef()\"\n\t\t\t><ng-container *ngTemplateOutlet=\"contentTpl\"\n\t\t/></span>\n\t\t<span class=\"tableSortable-arrows\">\n\t\t\t<lu-icon icon=\"chevronTop\" class=\"tableSortable-arrows-ascending\" />\n\t\t\t<lu-icon icon=\"chevronBottom\" class=\"tableSortable-arrows-descending\" />\n\t\t</span>\n\t</button>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"contentTpl\" />\n}\n\n<ng-template #contentTpl><ng-content /></ng-template>\n", styles: ["@layer components{.tableSortable.button{--components-sortable-arrowColor: var(--palettes-neutral-500);--components-sortable-arrowScale: 1;--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1);--components-sortable-fontWeight: 400;--components-sortable-fontSize: var(--pr-t-font-body-M-fontSize);--components-sortable-lineHeight: var(--pr-t-font-body-M-lineHeight);--components-sortable-arrowsOffset: var(--pr-t-spacings-50);--components-sortable-minInlineSize: auto;--components-sortable-maxInlineSize: none;-webkit-user-select:none;user-select:none;font-weight:var(--components-sortable-fontWeight);vertical-align:top;align-items:flex-end;min-inline-size:var(--components-sortable-minInlineSize);max-inline-size:var(--components-sortable-maxInlineSize);inset-inline-start:var(--components-sortable-offset);padding:0 var(--pr-t-spacings-50);gap:var(--pr-t-spacings-25);text-align:inherit;flex-direction:var(--components-sortable-direction);font-size:var(--components-sortable-fontSize);line-height:var(--components-sortable-lineHeight);color:currentColor;--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}.tableSortable.button:hover,.tableSortable.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}.tableSortable.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.tableSortable.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}.tableSortable-label{min-inline-size:0}.tableSortable-arrows{margin-block-end:var(--components-sortable-arrowsOffset);position:relative;inline-size:1rem;block-size:1rem;flex-shrink:0}.tableSortable-arrows-ascending,.tableSortable-arrows-descending{--icon-size: 1rem;position:absolute;inset:0;color:var(--components-sortable-arrowColor);transition-property:translate,scale,color;transition-duration:var(--commons-animations-durations-slow);scale:var(--components-sortable-arrowScale)}.tableSortable-arrows-ascending{translate:0 calc(var(--pr-t-spacings-50) * -1)}.tableSortable-arrows-descending{translate:0 var(--pr-t-spacings-50)}}@layer mods{.tableSortable.mod-ellipsis{--components-sortable-minInlineSize: 0;--components-sortable-maxInlineSize: 100%}.tableSortable.mod-ellipsis .tableSortable-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer mods{.table-head-row-cell.mod-alignStart .tableSortable,.table-head-row-cell.mod-alignLeft .tableSortable,.dataTable-head-row-cell.mod-alignStart .tableSortable,.dataTable-head-row-cell.mod-alignLeft .tableSortable,.indexTable-head-row-cell.mod-alignStart .tableSortable,.indexTable-head-row-cell.mod-alignLeft .tableSortable{--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1)}.table-head-row-cell.mod-alignEnd .tableSortable,.table-head-row-cell.mod-alignRight .tableSortable,.dataTable-head-row-cell.mod-alignEnd .tableSortable,.dataTable-head-row-cell.mod-alignRight .tableSortable,.indexTable-head-row-cell.mod-alignEnd .tableSortable,.indexTable-head-row-cell.mod-alignRight .tableSortable{--components-sortable-direction: row-reverse;--components-sortable-offset: var(--pr-t-spacings-50)}.table-head-row-cell.mod-alignCenter .tableSortable,.dataTable-head-row-cell.mod-alignCenter .tableSortable,.indexTable-head-row-cell.mod-alignCenter .tableSortable{--components-sortable-offset: var(--pr-t-spacings-100)}.table-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.dataTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.indexTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.table-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.dataTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.indexTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending{--components-sortable-arrowColor: var(--palettes-neutral-700);--components-sortable-arrowScale: 1.25}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "button[luButton], a[luButton], span[luButton], button[prButton], a[prButton], span[prButton]", inputs: ["size", "block", "disabled", "critical", "delete", "disclosure", "palette", "state", "luButton", "prButton"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: LuTooltipTriggerDirective, selector: "[luTooltip],[prTooltip]", inputs: ["luTooltip", "prTooltip", "luTooltipEnterDelay", "prTooltipEnterDelay", "luTooltipLeaveDelay", "prTooltipLeaveDelay", "luTooltipDisabled", "prTooltipDisabled", "luTooltipOnlyForDisplay", "prTooltipOnlyForDisplay", "luTooltipPosition", "prTooltipPosition", "luTooltipWhenEllipsis", "prTooltipWhenEllipsis", "luTooltipAnchor", "prTooltipAnchor", "luTooltipTriggerAnchor", "prTooltipTriggerAnchor", "id"], exportAs: ["luTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableRowCellHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableRowCellHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'th[luDataTableCell]', encapsulation: ViewEncapsulation.None, host: {
                         '[class.dataTable-body-row-cell]': 'bodyRef !== null',
@@ -178,7 +183,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                         '[class.mod-alignCenter]': 'align() === "center"',
                         '[class.mod-alignEnd]': 'align() === "end"',
                         '[class.mod-stickyColumn]': 'isStickyStart() || isStickyEnd()',
-                        '[attr.aria-sort]': 'sort()',
+                        '[attr.aria-sort]': 'currentSort()',
                         '[class.mod-editable]': 'editable()',
                         '[attr.scope]': 'bodyRef !== null ? "row" : "col"',
                         '[style.--dataTable-layoutFixed-width]': 'inlineSize() || fixedWidth()',
@@ -189,8 +194,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                             provide: LU_DATA_TABLE_CELL_INSTANCE,
                             useExisting: forwardRef(() => DataTableRowCellHeaderComponent),
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (sort()) {\n\t<button luButton type=\"button\" class=\"tableSortable\" [class.mod-ellipsis]=\"sortWithEllipsis()\" (click)=\"toggleSort()\" #sortButton>\n\t\t<span\n\t\t\tclass=\"tableSortable-label\"\n\t\t\t[luTooltipDisabled]=\"!sortWithEllipsis()\"\n\t\t\tluTooltip\n\t\t\tluTooltipWhenEllipsis\n\t\t\t[luTooltipTriggerAnchor]=\"sortButtonRef()\"\n\t\t\t><ng-container *ngTemplateOutlet=\"contentTpl\"\n\t\t/></span>\n\t\t<span class=\"tableSortable-arrows\">\n\t\t\t<lu-icon icon=\"chevronTop\" class=\"tableSortable-arrows-ascending\" />\n\t\t\t<lu-icon icon=\"chevronBottom\" class=\"tableSortable-arrows-descending\" />\n\t\t</span>\n\t</button>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"contentTpl\" />\n}\n\n<ng-template #contentTpl><ng-content /></ng-template>\n", styles: ["@layer components{.tableSortable.button{--components-sortable-arrowColor: var(--palettes-neutral-500);--components-sortable-arrowScale: 1;--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1);--components-sortable-fontWeight: 400;--components-sortable-fontSize: var(--pr-t-font-body-M-fontSize);--components-sortable-lineHeight: var(--pr-t-font-body-M-lineHeight);--components-sortable-arrowsOffset: var(--pr-t-spacings-50);--components-sortable-minInlineSize: auto;--components-sortable-maxInlineSize: none;-webkit-user-select:none;user-select:none;font-weight:var(--components-sortable-fontWeight);vertical-align:top;align-items:flex-end;min-inline-size:var(--components-sortable-minInlineSize);max-inline-size:var(--components-sortable-maxInlineSize);inset-inline-start:var(--components-sortable-offset);padding:0 var(--pr-t-spacings-50);gap:var(--pr-t-spacings-25);text-align:inherit;flex-direction:var(--components-sortable-direction);font-size:var(--components-sortable-fontSize);line-height:var(--components-sortable-lineHeight);color:currentColor;--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}.tableSortable.button:hover,.tableSortable.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}.tableSortable.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.tableSortable.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}.tableSortable-label{min-inline-size:0}.tableSortable-arrows{margin-block-end:var(--components-sortable-arrowsOffset);position:relative;inline-size:1rem;block-size:1rem;flex-shrink:0}.tableSortable-arrows-ascending,.tableSortable-arrows-descending{--icon-size: 1rem;position:absolute;inset:0;color:var(--components-sortable-arrowColor);transition-property:translate,scale,color;transition-duration:var(--commons-animations-durations-slow);scale:var(--components-sortable-arrowScale)}.tableSortable-arrows-ascending{translate:0 calc(var(--pr-t-spacings-50) * -1)}.tableSortable-arrows-descending{translate:0 var(--pr-t-spacings-50)}}@layer mods{.tableSortable.mod-ellipsis{--components-sortable-minInlineSize: 0;--components-sortable-maxInlineSize: 100%}.tableSortable.mod-ellipsis .tableSortable-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer mods{.table-head-row-cell.mod-alignStart .tableSortable,.table-head-row-cell.mod-alignLeft .tableSortable,.dataTable-head-row-cell.mod-alignStart .tableSortable,.dataTable-head-row-cell.mod-alignLeft .tableSortable,.indexTable-head-row-cell.mod-alignStart .tableSortable,.indexTable-head-row-cell.mod-alignLeft .tableSortable{--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1)}.table-head-row-cell.mod-alignEnd .tableSortable,.table-head-row-cell.mod-alignRight .tableSortable,.dataTable-head-row-cell.mod-alignEnd .tableSortable,.dataTable-head-row-cell.mod-alignRight .tableSortable,.indexTable-head-row-cell.mod-alignEnd .tableSortable,.indexTable-head-row-cell.mod-alignRight .tableSortable{--components-sortable-direction: row-reverse;--components-sortable-offset: var(--pr-t-spacings-50)}.table-head-row-cell.mod-alignCenter .tableSortable,.dataTable-head-row-cell.mod-alignCenter .tableSortable,.indexTable-head-row-cell.mod-alignCenter .tableSortable{--components-sortable-offset: var(--pr-t-spacings-100)}.table-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.dataTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.indexTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.table-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.dataTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.indexTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending{--components-sortable-arrowColor: var(--palettes-neutral-700);--components-sortable-arrowScale: 1.25}}\n"] }]
-        }], propDecorators: { sort: [{ type: i0.Input, args: [{ isSignal: true, alias: "sort", required: false }] }, { type: i0.Output, args: ["sortChange"] }], fixedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedWidth", required: false }] }], inlineSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineSize", required: false }] }], sortWithEllipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortWithEllipsis", required: false }] }], sortButtonRef: [{ type: i0.ViewChild, args: ['sortButton', { ...{ read: ElementRef }, isSignal: true }] }] } });
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (currentSort()) {\n\t<button luButton type=\"button\" class=\"tableSortable\" [class.mod-ellipsis]=\"sortWithEllipsis()\" (click)=\"toggleSort()\" #sortButton>\n\t\t<span\n\t\t\tclass=\"tableSortable-label\"\n\t\t\t[luTooltipDisabled]=\"!sortWithEllipsis()\"\n\t\t\tluTooltip\n\t\t\tluTooltipWhenEllipsis\n\t\t\t[luTooltipTriggerAnchor]=\"sortButtonRef()\"\n\t\t\t><ng-container *ngTemplateOutlet=\"contentTpl\"\n\t\t/></span>\n\t\t<span class=\"tableSortable-arrows\">\n\t\t\t<lu-icon icon=\"chevronTop\" class=\"tableSortable-arrows-ascending\" />\n\t\t\t<lu-icon icon=\"chevronBottom\" class=\"tableSortable-arrows-descending\" />\n\t\t</span>\n\t</button>\n} @else {\n\t<ng-container *ngTemplateOutlet=\"contentTpl\" />\n}\n\n<ng-template #contentTpl><ng-content /></ng-template>\n", styles: ["@layer components{.tableSortable.button{--components-sortable-arrowColor: var(--palettes-neutral-500);--components-sortable-arrowScale: 1;--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1);--components-sortable-fontWeight: 400;--components-sortable-fontSize: var(--pr-t-font-body-M-fontSize);--components-sortable-lineHeight: var(--pr-t-font-body-M-lineHeight);--components-sortable-arrowsOffset: var(--pr-t-spacings-50);--components-sortable-minInlineSize: auto;--components-sortable-maxInlineSize: none;-webkit-user-select:none;user-select:none;font-weight:var(--components-sortable-fontWeight);vertical-align:top;align-items:flex-end;min-inline-size:var(--components-sortable-minInlineSize);max-inline-size:var(--components-sortable-maxInlineSize);inset-inline-start:var(--components-sortable-offset);padding:0 var(--pr-t-spacings-50);gap:var(--pr-t-spacings-25);text-align:inherit;flex-direction:var(--components-sortable-direction);font-size:var(--components-sortable-fontSize);line-height:var(--components-sortable-lineHeight);color:currentColor;--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}.tableSortable.button:hover,.tableSortable.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}.tableSortable.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.tableSortable.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}.tableSortable-label{min-inline-size:0}.tableSortable-arrows{margin-block-end:var(--components-sortable-arrowsOffset);position:relative;inline-size:1rem;block-size:1rem;flex-shrink:0}.tableSortable-arrows-ascending,.tableSortable-arrows-descending{--icon-size: 1rem;position:absolute;inset:0;color:var(--components-sortable-arrowColor);transition-property:translate,scale,color;transition-duration:var(--commons-animations-durations-slow);scale:var(--components-sortable-arrowScale)}.tableSortable-arrows-ascending{translate:0 calc(var(--pr-t-spacings-50) * -1)}.tableSortable-arrows-descending{translate:0 var(--pr-t-spacings-50)}}@layer mods{.tableSortable.mod-ellipsis{--components-sortable-minInlineSize: 0;--components-sortable-maxInlineSize: 100%}.tableSortable.mod-ellipsis .tableSortable-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer mods{.table-head-row-cell.mod-alignStart .tableSortable,.table-head-row-cell.mod-alignLeft .tableSortable,.dataTable-head-row-cell.mod-alignStart .tableSortable,.dataTable-head-row-cell.mod-alignLeft .tableSortable,.indexTable-head-row-cell.mod-alignStart .tableSortable,.indexTable-head-row-cell.mod-alignLeft .tableSortable{--components-sortable-direction: row;--components-sortable-offset: calc(var(--pr-t-spacings-50) * -1)}.table-head-row-cell.mod-alignEnd .tableSortable,.table-head-row-cell.mod-alignRight .tableSortable,.dataTable-head-row-cell.mod-alignEnd .tableSortable,.dataTable-head-row-cell.mod-alignRight .tableSortable,.indexTable-head-row-cell.mod-alignEnd .tableSortable,.indexTable-head-row-cell.mod-alignRight .tableSortable{--components-sortable-direction: row-reverse;--components-sortable-offset: var(--pr-t-spacings-50)}.table-head-row-cell.mod-alignCenter .tableSortable,.dataTable-head-row-cell.mod-alignCenter .tableSortable,.indexTable-head-row-cell.mod-alignCenter .tableSortable{--components-sortable-offset: var(--pr-t-spacings-100)}.table-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.dataTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.indexTable-head-row-cell[aria-sort=ascending] .tableSortable .tableSortable-arrows-ascending,.table-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.dataTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending,.indexTable-head-row-cell[aria-sort=descending] .tableSortable .tableSortable-arrows-descending{--components-sortable-arrowColor: var(--palettes-neutral-700);--components-sortable-arrowScale: 1.25}}\n"] }]
+        }], propDecorators: { sort: [{ type: i0.Input, args: [{ isSignal: true, alias: "sort", required: false }] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], fixedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedWidth", required: false }] }], inlineSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineSize", required: false }] }], sortWithEllipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortWithEllipsis", required: false }] }], sortButtonRef: [{ type: i0.ViewChild, args: ['sortButton', { ...{ read: ElementRef }, isSignal: true }] }] } });
 
 class DataTableRowCellComponent extends BaseDataTableCell {
     constructor() {
@@ -223,15 +228,15 @@ class DataTableRowCellComponent extends BaseDataTableCell {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "insetInlineEnd" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableRowCellComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: DataTableRowCellComponent, isStandalone: true, selector: "td[luDataTableCell]", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.dataTable-body-row-cell": "bodyRef !== null", "class.dataTable-head-row-cell": "headRef !== null", "class.dataTable-foot-row-cell": "footRef !== null", "class.mod-alignStart": "align() === \"start\" || alignCol() === \"start\"", "class.mod-alignCenter": "align() === \"center\" || alignCol() === \"center\"", "class.mod-alignEnd": "align() === \"end\" || alignCol() === \"end\"", "class.mod-editable": "editable()", "class.mod-actions": "actions()", "class.mod-stickyColumn": "isSticky()", "style.insetInlineStart": "insetInlineStart()", "style.insetInlineEnd": "insetInlineEnd()" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableRowCellComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.2.1", type: DataTableRowCellComponent, isStandalone: true, selector: "td[luDataTableCell]", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.dataTable-body-row-cell": "bodyRef !== null", "class.dataTable-head-row-cell": "headRef !== null", "class.dataTable-foot-row-cell": "footRef !== null", "class.mod-alignStart": "align() === \"start\" || alignCol() === \"start\"", "class.mod-alignCenter": "align() === \"center\" || alignCol() === \"center\"", "class.mod-alignEnd": "align() === \"end\" || alignCol() === \"end\"", "class.mod-editable": "editable()", "class.mod-actions": "actions()", "class.mod-stickyColumn": "isSticky()", "style.insetInlineStart": "insetInlineStart()", "style.insetInlineEnd": "insetInlineEnd()" } }, providers: [
             {
                 provide: LU_DATA_TABLE_CELL_INSTANCE,
                 useExisting: forwardRef(() => DataTableRowCellComponent),
             },
         ], usesInheritance: true, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableRowCellComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableRowCellComponent, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
@@ -262,15 +267,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
         }], propDecorators: { actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }] } });
 
 class DataTableFootComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableFootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.4", type: DataTableFootComponent, isStandalone: true, selector: "tfoot[luDataTableFoot]", host: { classAttribute: "dataTable-foot" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableFootComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.2.1", type: DataTableFootComponent, isStandalone: true, selector: "tfoot[luDataTableFoot]", host: { classAttribute: "dataTable-foot" }, providers: [
             {
                 provide: LU_DATA_TABLE_FOOT_INSTANCE,
                 useExisting: forwardRef(() => DataTableFootComponent),
             },
         ], ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableFootComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableFootComponent, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
@@ -298,15 +303,15 @@ class DataTableHeadComponent {
         this.cols = contentChildren(DataTableRowCellHeaderComponent, { ...(ngDevMode ? { debugName: "cols" } : /* istanbul ignore next */ {}), descendants: true });
         this.tableRef = inject(LU_DATA_TABLE_INSTANCE);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableHeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.4", type: DataTableHeadComponent, isStandalone: true, selector: "thead[luDataTableHead]", inputs: { sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-sticky": "sticky()", "class.is-firstBodyRowVisible": "isFirstVisible()", "attr.inert": "tableRef.empty() ? \"inert\" : null" }, classAttribute: "dataTable-head" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableHeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.2.1", type: DataTableHeadComponent, isStandalone: true, selector: "thead[luDataTableHead]", inputs: { sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-sticky": "sticky()", "class.is-firstBodyRowVisible": "isFirstVisible()", "attr.inert": "tableRef.empty() ? \"inert\" : null" }, classAttribute: "dataTable-head" }, providers: [
             {
                 provide: LU_DATA_TABLE_HEAD_INSTANCE,
                 useExisting: forwardRef(() => DataTableHeadComponent),
             },
         ], queries: [{ propertyName: "cols", predicate: DataTableRowCellHeaderComponent, descendants: true, isSignal: true }], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer components{.dataTableWrapper{--components-dataTable-shadow-firstColumnOpacity: 1;--components-dataTable-shadow-lastColumnOpacity: 1;--components-dataTable-shadow-firstRowOpacity: 1;--components-dataTable-shadow-lastRowOpacity: 1;--components-dataTable-header-shadow-opacity: 1;--components-dataTable-shadow-colsStart-opacity: 1;--components-dataTable-shadow-colsEnd-opacity: 1;--components-dataTable-shadow-lastRowInsetBlockEnd: 0}}@layer mods{.dataTableWrapper:has(.dataTable.mod-stickyHeader,.dataTable-head.mod-sticky) .dataTable-head{position:sticky;inset-block-start:-1px;z-index:2}.dataTableWrapper:has(.dataTable.mod-stickyHeader,.dataTable-head.mod-sticky) .dataTable-head:after{content:\"\";inset-inline:0;block-size:var(--pr-t-spacings-100);position:absolute;background-image:linear-gradient(color-mix(in var(--commons-colorSpace, srgb),var(--palettes-neutral-400) 24%,transparent),transparent);pointer-events:none;box-shadow:0 1px var(--commons-border-200) inset;opacity:var(--components-dataTable-header-shadow-opacity)}.dataTableWrapper:has(.dataTable.mod-stickyHeader,.dataTable-head.mod-sticky){--components-dataTable-shadow-firstRowOpacity: 0}.dataTableWrapper:has(.dataTableShadows),.dataTableWrapper:has(.dataTable.mod-columnsOverflow){display:flex}.dataTableWrapper:has(.dataTableShadows):before,.dataTableWrapper:has(.dataTableShadows):after,.dataTableWrapper:has(.dataTable.mod-columnsOverflow):before,.dataTableWrapper:has(.dataTable.mod-columnsOverflow):after{content:\"\";position:sticky;inline-size:var(--pr-t-spacings-100);background-image:linear-gradient(to right,color-mix(in var(--commons-colorSpace, srgb),var(--palettes-neutral-400) 24%,transparent),transparent);flex-shrink:0;margin-inline-start:calc(var(--pr-t-spacings-100) * -1);inset-block-start:0;pointer-events:none;z-index:3}.dataTableWrapper:has(.dataTableShadows):before,.dataTableWrapper:has(.dataTable.mod-columnsOverflow):before{inset-inline-start:0;opacity:var(--components-dataTable-shadow-firstColumnOpacity)}.dataTableWrapper:has(.dataTableShadows):after,.dataTableWrapper:has(.dataTable.mod-columnsOverflow):after{inset-inline-end:0;transform:scaleX(-1);opacity:var(--components-dataTable-shadow-lastColumnOpacity)}.dataTableWrapper:has(.dataTableShadows) .dataTableShadows,.dataTableWrapper:has(.dataTable.mod-rowsOverflow) .dataTableShadows{display:flex;flex-direction:column;flex-grow:1}.dataTableWrapper:has(.dataTableShadows) .dataTableShadows .dataTable,.dataTableWrapper:has(.dataTable.mod-rowsOverflow) .dataTableShadows .dataTable{block-size:auto;flex-grow:1}.dataTableWrapper:has(.dataTableShadows) .dataTableShadows:before,.dataTableWrapper:has(.dataTableShadows) .dataTableShadows:after,.dataTableWrapper:has(.dataTable.mod-rowsOverflow) .dataTableShadows:before,.dataTableWrapper:has(.dataTable.mod-rowsOverflow) .dataTableShadows:after{content:\"\";position:sticky;display:block;block-size:var(--pr-t-spacings-100);background-image:linear-gradient(to bottom,color-mix(in var(--commons-colorSpace, srgb),var(--palettes-neutral-400) 24%,transparent),transparent);margin-block-start:calc(var(--pr-t-spacings-100) * -1);flex-shrink:0;pointer-events:none;z-index:2}.dataTableWrapper:has(.dataTableShadows) .dataTableShadows:before,.dataTableWrapper:has(.dataTable.mod-rowsOverflow) .dataTableShadows:before{inset-block-start:0;opacity:var(--components-dataTable-shadow-firstRowOpacity)}.dataTableWrapper:has(.dataTableShadows) .dataTableShadows:after,.dataTableWrapper:has(.dataTable.mod-rowsOverflow) .dataTableShadows:after{inset-block-end:var(--components-dataTable-shadow-lastRowInsetBlockEnd);transform:scaleY(-1);opacity:var(--components-dataTable-shadow-lastRowOpacity)}.dataTableWrapper:has(.dataTable.is-firstColumnVisible){--components-dataTable-shadow-firstColumnOpacity: 0}.dataTableWrapper:has(.dataTable.is-lastColumnVisible){--components-dataTable-shadow-lastColumnOpacity: 0}.dataTableWrapper:has(.dataTable.is-firstRowVisible){--components-dataTable-shadow-firstRowOpacity: 0}.dataTableWrapper:has(.dataTable.is-lastRowVisible){--components-dataTable-shadow-lastRowOpacity: 0}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)~:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:after,.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:has(~:is(.dataTable-body-row-cell,.dataTable-head-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)):not(:has(+:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn)):after{content:\"\";position:absolute;inset-block:0;inset-inline-start:100%;inline-size:var(--pr-t-spacings-100);pointer-events:none;background-image:linear-gradient(to right,color-mix(in var(--commons-colorSpace, srgb),var(--palettes-neutral-400) 24%,transparent),transparent)}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)~:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn~:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:after{content:none}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) .dataTable-head-row-cell.mod-stickyColumn:first-child{z-index:2}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn{position:sticky}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:first-child{inset-inline-start:0}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:last-child{inset-inline-end:0;--components-dataTable-cell-shadow: 0 1px inset var(--commons-border-200), 1px 0 var(--palettes-neutral-0)}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:has(~:is(.dataTable-body-row-cell,.dataTable-head-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)){transform:translate(-1px);z-index:1}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:has(~:is(.dataTable-body-row-cell,.dataTable-head-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)):not(:has(+:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn)):after{opacity:var(--components-dataTable-shadow-colsStart-opacity)}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)~:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:after{inset-inline-start:auto;inset-inline-end:100%;transform:scaleX(-1);opacity:var(--components-dataTable-shadow-colsEnd-opacity)}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn) .dataTable-body-row.mod-group .dataTable-body-row-cell-expand{position:sticky;inset-inline-start:var(--components-dataTable-cell-padding-inline);inline-size:fit-content}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn):has(.dataTable.mod-cellBorder) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:has(~:is(.dataTable-body-row-cell,.dataTable-head-row-cell,.dataTable-foot-row-cell):not(.mod-stickyColumn)):not(:has(+:is(.dataTable-body-row-cell,.dataTable-head-row-cell,.dataTable-foot-row-cell).mod-stickyColumn)):after{--components-dataTable-cell-shadow: 1px 0 var(--commons-border-200) inset}.dataTableWrapper:has(:is(.dataTable-head-row-cell,.dataTable-head-body-cell,.dataTable-foot-row-cell).mod-stickyColumn):has(.dataTable.mod-cellBorder) :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-stickyColumn:last-child{--components-dataTable-cell-shadow: 0 1px inset var(--commons-border-200), 1px 0 inset var(--commons-border-200), 1px 0 var(--palettes-neutral-0)}.dataTableWrapper:has(.dataTable.is-firstColumnVisibleAfterColsStart){--components-dataTable-shadow-colsStart-opacity: 0}.dataTableWrapper:has(.dataTable.is-lastColumnVisibleBeforeColsEnd){--components-dataTable-shadow-colsEnd-opacity: 0}.dataTableWrapper:has(.dataTableWrapper-pagination:not(:empty)){--components-dataTable-shadow-lastRowInsetBlockEnd: var(--pr-t-spacings-600)}}.dataTableWrapper:has(.dataTable-head.is-firstBodyRowVisible){--components-dataTable-header-shadow-opacity: 0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableHeadComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableHeadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'thead[luDataTableHead]', template: '<ng-content />', encapsulation: ViewEncapsulation.None, host: {
                         class: 'dataTable-head',
@@ -374,15 +379,15 @@ class DataTableRowComponent {
         this.mixed = input(false, { ...(ngDevMode ? { debugName: "mixed" } : /* istanbul ignore next */ {}), transform: luBooleanAttribute });
         this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: luBooleanAttribute });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: DataTableRowComponent, isStandalone: true, selector: "tr[luDataTableRow]", inputs: { intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, selectedLabel: { classPropertyName: "selectedLabel", publicName: "selectedLabel", isSignal: true, isRequired: false, transformFunction: null }, mixed: { classPropertyName: "mixed", publicName: "mixed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, host: { properties: { "class.dataTable-body-row": "bodyRef !== null", "class.dataTable-head-row": "headRef !== null", "class.dataTable-foot-row": "footRef !== null", "class.mod-selectable": "tableRef?.selectable() ?? false", "class.mod-draggable": "tableRef?.drag() ?? false" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.1", type: DataTableRowComponent, isStandalone: true, selector: "tr[luDataTableRow]", inputs: { intl: { classPropertyName: "intl", publicName: "intl", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, selectedLabel: { classPropertyName: "selectedLabel", publicName: "selectedLabel", isSignal: true, isRequired: false, transformFunction: null }, mixed: { classPropertyName: "mixed", publicName: "mixed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selectedChange" }, host: { properties: { "class.dataTable-body-row": "bodyRef !== null", "class.dataTable-head-row": "headRef !== null", "class.dataTable-foot-row": "footRef !== null", "class.mod-selectable": "tableRef?.selectable() ?? false", "class.mod-draggable": "tableRef?.drag() ?? false" } }, providers: [
             {
                 provide: LU_DATA_TABLE_ROW_INSTANCE,
                 useExisting: forwardRef(() => DataTableRowComponent),
             },
         ], queries: [{ propertyName: "cells", predicate: LU_DATA_TABLE_CELL_INSTANCE, isSignal: true }], ngImport: i0, template: "@if (tableRef?.drag()) {\n\t<td class=\"dataTable-body-row-cell\" aria-hidden=\"true\">\n\t\t@if (bodyRef) {\n\t\t\t<span class=\"button dataTable-body-row-cell-drag\" cdkDragHandle>\n\t\t\t\t<lu-icon icon=\"dotsDrag\" [alt]=\"intl().move\" />\n\t\t\t</span>\n\t\t}\n\t</td>\n}\n\n@if (tableRef?.selectable()) {\n\t@if (headRef) {\n\t\t<th class=\"dataTable-head-row-cell\" scope=\"col\"><ng-container *ngTemplateOutlet=\"input\" /></th>\n\t} @else {\n\t\t<td [class.dataTable-body-row-cell]=\"bodyRef !== null\" [class.dataTable-foot-row-cell]=\"footRef !== null\">\n\t\t\t<ng-container *ngTemplateOutlet=\"input\" />\n\t\t</td>\n\t}\n}\n<ng-content />\n\n<ng-template #input>\n\t@if (!footRef && selectedLabel()) {\n\t\t<lu-form-field [label]=\"selectedLabel() ?? ''\" hiddenLabel>\n\t\t\t<lu-checkbox-input [(ngModel)]=\"selected\" [disabled]=\"disabled()\" [mixed]=\"mixed()\" />\n\t\t</lu-form-field>\n\t}\n</ng-template>\n", dependencies: [{ kind: "component", type: CheckboxInputComponent, selector: "lu-checkbox-input", inputs: ["checklist", "mixed"] }, { kind: "component", type: FormFieldComponent, selector: "lu-form-field", inputs: ["intl", "label", "hiddenLabel", "rolePresentationLabel", "inline", "statusControl", "tooltip", "tag", "AI", "iconAItooltip", "iconAIalt", "width", "invalid", "inlineMessage", "errorInlineMessage", "inlineMessageState", "size", "extraDescribedBy", "layout", "counter", "presentation"], outputs: ["rolePresentationLabelChange", "layoutChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableRowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableRowComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tr[luDataTableRow]', encapsulation: ViewEncapsulation.None, host: {
                         '[class.dataTable-body-row]': 'bodyRef !== null',
@@ -415,6 +420,9 @@ class DataTableComponent {
         this.tableRef = viewChild('tableRef', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "tableRef" }] : /* istanbul ignore next */ []));
         this.#destroyRef = inject(DestroyRef);
+        /**
+         * @deprecated No replacement: rows without an action should not have a hover effect.
+         */
         this.hover = input(false, { ...(ngDevMode ? { debugName: "hover" } : /* istanbul ignore next */ {}), transform: luBooleanAttribute });
         this.selectable = input(false, { ...(ngDevMode ? { debugName: "selectable" } : /* istanbul ignore next */ {}), transform: luBooleanAttribute });
         this.layoutFixed = input(false, { ...(ngDevMode ? { debugName: "layoutFixed" } : /* istanbul ignore next */ {}), transform: luBooleanAttribute });
@@ -486,15 +494,15 @@ class DataTableComponent {
             this.#destroyRef.onDestroy(() => observer.disconnect());
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.4", type: DataTableComponent, isStandalone: true, selector: "lu-data-table", inputs: { hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, layoutFixed: { classPropertyName: "layoutFixed", publicName: "layoutFixed", isSignal: true, isRequired: false, transformFunction: null }, cellBorder: { classPropertyName: "cellBorder", publicName: "cellBorder", isSignal: true, isRequired: false, transformFunction: null }, nested: { classPropertyName: "nested", publicName: "nested", isSignal: true, isRequired: false, transformFunction: null }, drag: { classPropertyName: "drag", publicName: "drag", isSignal: true, isRequired: false, transformFunction: null }, noOverflow: { classPropertyName: "noOverflow", publicName: "noOverflow", isSignal: true, isRequired: false, transformFunction: null }, empty: { classPropertyName: "empty", publicName: "empty", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, stickyColsStart: { classPropertyName: "stickyColsStart", publicName: "stickyColsStart", isSignal: true, isRequired: false, transformFunction: null }, stickyColsEnd: { classPropertyName: "stickyColsEnd", publicName: "stickyColsEnd", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "scroll": "scroll()" }, properties: { "class.mod-nested": "this.nested()", "class.mod-noOverflow": "this.noOverflow()" }, classAttribute: "dataTableWrapper" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.2.1", type: DataTableComponent, isStandalone: true, selector: "lu-data-table", inputs: { hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, layoutFixed: { classPropertyName: "layoutFixed", publicName: "layoutFixed", isSignal: true, isRequired: false, transformFunction: null }, cellBorder: { classPropertyName: "cellBorder", publicName: "cellBorder", isSignal: true, isRequired: false, transformFunction: null }, nested: { classPropertyName: "nested", publicName: "nested", isSignal: true, isRequired: false, transformFunction: null }, drag: { classPropertyName: "drag", publicName: "drag", isSignal: true, isRequired: false, transformFunction: null }, noOverflow: { classPropertyName: "noOverflow", publicName: "noOverflow", isSignal: true, isRequired: false, transformFunction: null }, empty: { classPropertyName: "empty", publicName: "empty", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, verticalAlign: { classPropertyName: "verticalAlign", publicName: "verticalAlign", isSignal: true, isRequired: false, transformFunction: null }, stickyColsStart: { classPropertyName: "stickyColsStart", publicName: "stickyColsStart", isSignal: true, isRequired: false, transformFunction: null }, stickyColsEnd: { classPropertyName: "stickyColsEnd", publicName: "stickyColsEnd", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "scroll": "scroll()" }, properties: { "class.mod-nested": "this.nested()", "class.mod-noOverflow": "this.noOverflow()" }, classAttribute: "dataTableWrapper" }, providers: [
             {
                 provide: LU_DATA_TABLE_INSTANCE,
                 useExisting: forwardRef(() => DataTableComponent),
             },
         ], queries: [{ propertyName: "rows", predicate: DataTableRowComponent, descendants: true, isSignal: true }, { propertyName: "header", first: true, predicate: DataTableHeadComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "tableRef", first: true, predicate: ["tableRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"dataTableShadows\">\n\t<table [class]=\"classMods()\" [attr.role]=\"empty() ? 'presentation' : null\" #tableRef>\n\t\t<ng-content />\n\t</table>\n\t<div class=\"dataTableWrapper-pagination\">\n\t\t<ng-content select=\"[dataTablePagination]\" />\n\t</div>\n</div>\n", styles: ["@layer components{.dataTableWrapper{--components-dataTable-cell-padding-inline: var(--pr-t-spacings-150);--components-dataTable-cell-paddingInlineStart: var(--components-dataTable-cell-padding-inline);--components-dataTable-cell-padding-block: var(--pr-t-spacings-100);--components-dataTable-cell-padding: var(--components-dataTable-cell-padding-block) var(--components-dataTable-cell-padding-inline);--components-dataTable-treeLevel: 1;--components-dataTable-cell-verticalAlign: middle;--components-dataTable-cell-shadow: 0 1px inset var(--commons-border-200);--components-dataTable-cell-background: var(--pr-t-elevation-surface-raised);--components-dataTable-cell-textAlign: left;--components-dataTable-tableLayout: auto;--components-dataTable-cellFirst-width: auto;--components-dataTable-row-display: table-row;--components-dataTable-expand-rotation: 180deg;--components-dataTable-borderRadius: var(--pr-t-border-radius-structure);--components-dataTable-minInlineSize: none}}@layer mods{.dataTableWrapper.mod-nested{--components-dataTable-borderRadius: var(--pr-t-border-radius-default)}.dataTableWrapper.mod-noOverflow{--components-dataTable-minInlineSize: fit-content}}@layer components{.dataTable{display:table;text-align:start;inline-size:calc(100% + 1px);block-size:calc(100% + 1px);border-spacing:0;margin-inline-start:-1px;margin-block-start:-1px;table-layout:var(--components-dataTable-tableLayout)}.dataTableWrapper{border-radius:var(--components-dataTable-borderRadius);border:1px solid var(--commons-border-200);overflow:auto;contain:paint;background-color:var(--components-dataTable-cell-background);display:block;min-inline-size:var(--components-dataTable-minInlineSize)}.dataTableWrapper:focus-visible{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:2px}.dataTableWrapper-pagination{border-block-start:1px solid var(--commons-border-200);background-color:var(--components-dataTable-cell-background);display:flex;justify-content:flex-end;position:sticky;inset-block-end:0;z-index:4}.dataTableWrapper-pagination>*{position:sticky;inset-inline-end:0}.dataTableWrapper-pagination:empty{display:none}.dataTable-head-row-cell{color:var(--pr-t-color-text-subtle);padding:var(--components-dataTable-cell-padding);display:table-cell;font-weight:var(--pr-t-font-fontWeight-regular)}.dataTable-head-row-cell .checkboxField{margin-block-end:.125rem}.dataTable-head{display:table-header-group;vertical-align:bottom}.dataTable-body{display:table-row-group}.dataTable-foot{display:table-footer-group}.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row{display:var(--components-dataTable-row-display)}.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell{display:table-cell;box-shadow:var(--components-dataTable-cell-shadow);background-color:var(--components-dataTable-cell-background);text-align:var(--components-dataTable-cell-textAlign);transition-property:background-color;transition-duration:var(--commons-animations-durations-fast);font-weight:var(--pr-t-font-fontWeight-regular)}.dataTable-head-row-cell:first-child,.dataTable-body-row-cell:first-child,.dataTable-foot-row-cell:first-child{inline-size:var(--components-dataTable-cellFirst-width);inset-inline-start:0}.dataTable-head-row-cell:first-child .checkboxField,.dataTable-body-row-cell:first-child .checkboxField,.dataTable-foot-row-cell:first-child .checkboxField{--component-checkboxField-top: 0}.dataTable-head-row-cell:last-child,.dataTable-body-row-cell:last-child,.dataTable-foot-row-cell:last-child{inset-inline-end:0}.dataTable-body-row-cell,.dataTable-foot-row-cell{padding:var(--components-dataTable-cell-padding);padding-inline-start:var(--components-dataTable-cell-paddingInlineStart);vertical-align:middle}.dataTable-head-row:first-child .dataTable-head-row-cell{--components-dataTable-cell-shadow: none}.dataTable-body-row-cell{vertical-align:var(--components-dataTable-cell-verticalAlign)}.dataTable-foot-row-cell{font-weight:var(--pr-t-font-fontWeight-semibold)}.dataTable-body-row-cell-expand{display:flex;gap:var(--pr-t-spacings-100);align-items:flex-start;font-weight:var(--pr-t-font-fontWeight-semibold)}.dataTable-body-row-cell-expand-button.button{vertical-align:top;margin-inline-start:calc(var(--pr-t-spacings-25) * -1)}.dataTable-body-row-cell-expand-button.button .lucca-icon{transform:rotate(var(--components-dataTable-expand-rotation));transition-property:transform;transition-duration:var(--commons-animations-durations-fast)}.dataTable-body-row-cell-drag.button{--icon-size: 1.25rem;--components-button-font: var(--pr-t-font-body-S);--components-button-paddingBlock: var(--pr-t-spacings-75);--components-button-paddingInline: var(--pr-t-spacings-100);--components-button-gap: var(--pr-t-spacings-75)}.dataTable-body-row-cell-drag.button .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS)}.dataTable-body-row-cell-drag.button{--components-button-font-size: var(--pr-t-font-body-S-fontSize);--components-button-line-height: var(--pr-t-font-body-S-lineHeight)}.dataTable-body-row-cell-drag.button:after{font-size:var(--pr-t-font-body-S-lineHeight);block-size:var(--pr-t-font-body-S-lineHeight)}.dataTable-body-row-cell-drag.button{--components-button-padding: var(--pr-t-spacings-100);--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}.dataTable-body-row-cell-drag.button:hover,.dataTable-body-row-cell-drag.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}.dataTable-body-row-cell-drag.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}.dataTable-body-row-cell-drag.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}.dataTable-body-row-cell-drag.button{--components-button-padding: var(--pr-t-spacings-50);--components-button-color: var(--palettes-neutral-700);cursor:move;vertical-align:top}.dataTable .statusBadge,.dataTable .tag,.dataTable lu-tag,.dataTable pr-tag,.dataTable .avatar{vertical-align:top}.dataTable .statusBadge,.dataTable .tag{margin-block-start:var(--pr-t-spacings-25)}.dataTable .avatarWrapper{display:inline-flex}}@layer mods{.dataTable.mod-cellBorder{--components-dataTable-cell-shadow: 0 1px inset var(--commons-border-200), 1px 0 inset var(--commons-border-200)}.dataTable.mod-cellBorder .dataTable-head-row:first-child .dataTable-head-row-cell{--components-dataTable-cell-shadow: 1px 0 inset var(--commons-border-200)}.dataTable.mod-cellBorder :is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-editable{--components-dataTable-cell-paddingInlineStart: var(--pr-t-spacings-100)}.dataTable.mod-alignTop,.dataTable.mod-verticalAlignTop{--components-dataTable-cell-verticalAlign: top}.dataTable.mod-verticalAlignBottom{--components-dataTable-cell-verticalAlign: bottom}.dataTable.mod-verticalAlignMiddle{--components-dataTable-cell-verticalAlign: middle}.dataTable.mod-layoutFixed{--components-dataTable-tableLayout: fixed}@media(min-width:20em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinXXXS{--components-dataTable-tableLayout: fixed}}@media(min-width:30em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinXXS{--components-dataTable-tableLayout: fixed}}@media(min-width:40em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinXS{--components-dataTable-tableLayout: fixed}}@media(min-width:50em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinS{--components-dataTable-tableLayout: fixed}}@media(min-width:64em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinM{--components-dataTable-tableLayout: fixed}}@media(min-width:80em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinL{--components-dataTable-tableLayout: fixed}}@media(min-width:85.375em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinXL{--components-dataTable-tableLayout: fixed}}@media(min-width:100em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinXXL{--components-dataTable-tableLayout: fixed}}@media(min-width:120em){.dataTable[class*=mod-layoutFixedAtMediaMin].mod-layoutFixedAtMediaMinXXXL{--components-dataTable-tableLayout: fixed}}.dataTable[class*=mod-layoutFixed].mod-layoutFixed .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixed .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixed .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}@media(min-width:20em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXXS .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXXS .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXXS .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:30em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXS .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXS .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXS .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:40em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXS .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXS .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXS .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:50em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinS .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinS .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinS .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:64em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinM .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinM .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinM .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:80em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinL .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinL .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinL .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:85.375em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXL .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXL .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXL .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:100em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXL .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXL .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXL .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}@media(min-width:120em){.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXXL .dataTable-head-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXXL .dataTable-body-row-cell,.dataTable[class*=mod-layoutFixed].mod-layoutFixedAtMediaMinXXXL .dataTable-foot-row-cell{min-inline-size:var(--dataTable-layoutFixed-width, auto);inline-size:var(--dataTable-layoutFixed-width, auto)}}.dataTable.mod-hover :is(.mod-selectable,.dataTable-body-row:not(.mod-group)):hover{--components-dataTable-cell-background: var(--palettes-neutral-25)}.dataTable.mod-hover :is(.mod-selectable,.dataTable-body-row:not(.mod-group)).mod-selectable:has(input:checked):hover{--components-dataTable-cell-background: var(--palettes-product-100)}}@layer mods{:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group{--components-dataTable-tree-extraPadding: calc(1.5rem + var(--pr-t-spacings-100))}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group:has(.dataTable-body-row-cell-expand-button.button){--components-dataTable-tree-extraPadding: 0rem}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button{--icon-size: 1.25rem;--components-button-font: var(--pr-t-font-body-S);--components-button-paddingBlock: var(--pr-t-spacings-75);--components-button-paddingInline: var(--pr-t-spacings-100);--components-button-gap: var(--pr-t-spacings-75)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button{--components-button-font-size: var(--pr-t-font-body-S-fontSize);--components-button-line-height: var(--pr-t-font-body-S-lineHeight)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button:after{font-size:var(--pr-t-font-body-S-lineHeight);block-size:var(--pr-t-font-body-S-lineHeight)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button{--components-button-padding: var(--pr-t-spacings-75);--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button:hover,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group .dataTable-body-row-cell-expand-button.button{--components-button-padding: var(--pr-t-spacings-25);--components-button-color: var(--palettes-neutral-800)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group{font:var(--pr-t-font-heading-4)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-group:hover{--components-dataTable-cell-background: var(--palettes-neutral-50)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row):has([selectable]),:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-selectable{--components-dataTable-cellFirst-width: 2.625rem}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row):has([selectable]) .dataTable-head-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row):has([selectable]) .dataTable-body-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row):has([selectable]) .dataTable-foot-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-selectable .dataTable-head-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-selectable .dataTable-body-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-selectable .dataTable-foot-row-cell:first-child{inline-size:var(--components-dataTable-cellFirst-width);max-inline-size:var(--components-dataTable-cellFirst-width)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable .dataTable-head-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable .dataTable-body-row-cell:first-child,:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable .dataTable-foot-row-cell:first-child{--components-dataTable-cellFirst-width: 2.5rem;padding-inline:var(--pr-t-spacings-75)}:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable:has([selectable]) .dataTable-head-row-cell:nth-child(2),:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable:has([selectable]) .dataTable-body-row-cell:nth-child(2),:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable:has([selectable]) .dataTable-foot-row-cell:nth-child(2),:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable.mod-selectable .dataTable-head-row-cell:nth-child(2),:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable.mod-selectable .dataTable-body-row-cell:nth-child(2),:is(.dataTable-head-row,.dataTable-body-row,.dataTable-foot-row).mod-draggable.mod-selectable .dataTable-foot-row-cell:nth-child(2){--components-dataTable-cellFirst-width: 2.625rem;inline-size:var(--components-dataTable-cellFirst-width);max-inline-size:var(--components-dataTable-cellFirst-width)}:is(.dataTable-body-row,.dataTable-foot-row):has([selectable]):has(input:checked),:is(.dataTable-body-row,.dataTable-foot-row).mod-selectable:has(input:checked){--components-dataTable-cell-background: var(--palettes-product-50)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions{padding-block:0;padding-inline:var(--pr-t-spacings-50);text-align:end;white-space:nowrap}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button{--icon-size: 1.25rem;--components-button-font: var(--pr-t-font-body-S);--components-button-paddingBlock: var(--pr-t-spacings-75);--components-button-paddingInline: var(--pr-t-spacings-100);--components-button-gap: var(--pr-t-spacings-75)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button{--components-button-font-size: var(--pr-t-font-body-S-fontSize);--components-button-line-height: var(--pr-t-font-body-S-lineHeight)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button:after{font-size:var(--pr-t-font-body-S-lineHeight);block-size:var(--pr-t-font-body-S-lineHeight)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button{--components-button-padding: var(--pr-t-spacings-100);--components-button-padding: var(--pr-t-spacings-75);--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button:hover,:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button.mod-critical:hover,:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button.mod-delete:hover{--components-button-color: var(--palettes-error-700);--components-button-backgroundColor: var(--palettes-error-100)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button.mod-critical:active,:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button.mod-delete:active{--components-button-color: var(--palettes-error-700);--components-button-backgroundColor: var(--palettes-error-200)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button.is-loading:after{content:\"\";inline-size:var(--pr-t-font-body-S-lineHeight);block-size:var(--pr-t-font-body-S-lineHeight);border-radius:var(--pr-t-border-radius-full);line-height:.8rem;border-width:var(--commons-loading-borderWidth);inset:0;margin:auto;position:absolute;border-style:solid;animation-name:rotate;animation-duration:var(--commons-loading-speed);animation-timing-function:linear;animation-iteration-count:infinite;border-color:var(--commons-loading-frontground);border-block-start-color:transparent}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button.is-loading{--components-button-backgroundColor: var(--palettes-neutral-50);--commons-loading-frontground: var(--palettes-neutral-400)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions .button{transition-property:box-shadow,color}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-actions:is(.dataTable-head-row-cell) .button{position:relative;inset-block-end:var(--pr-t-spacings-50)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-alignCenter{--components-dataTable-cell-textAlign: center}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-alignRight,:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-alignEnd{--components-dataTable-cell-textAlign: end}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-alignStart{--components-dataTable-cell-textAlign: start}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-editable{--components-dataTable-cell-padding: var(--pr-t-spacings-100);--components-dataTable-cell-paddingInlineStart: var(--pr-t-spacings-50)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree{--components-dataTable-tree-extraPadding: calc(1.5rem + var(--pr-t-spacings-100))}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree:has(.dataTable-body-row-cell-expand-button.button){--components-dataTable-tree-extraPadding: 0rem}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button{--icon-size: 1.25rem;--components-button-font: var(--pr-t-font-body-S);--components-button-paddingBlock: var(--pr-t-spacings-75);--components-button-paddingInline: var(--pr-t-spacings-100);--components-button-gap: var(--pr-t-spacings-75)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button .numericBadge{--components-numericBadge-size: 1.25rem;--components-numericBadge-borderRadius: var(--pr-t-border-radius-small);--components-numericBadge-font: var(--pr-t-font-body-XS)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button{--components-button-font-size: var(--pr-t-font-body-S-fontSize);--components-button-line-height: var(--pr-t-font-body-S-lineHeight)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button:after{font-size:var(--pr-t-font-body-S-lineHeight);block-size:var(--pr-t-font-body-S-lineHeight)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button{--components-button-padding: var(--pr-t-spacings-75);--components-button-backgroundColor: transparent;--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-boxShadow: none}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button:hover,:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button:focus-visible{--components-button-color: var(--palettes-700, var(--pr-t-color-text-subtle));--components-button-backgroundColor: var(--palettes-50, var(--palettes-neutral-50))}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button:active{--components-button-backgroundColor: var(--palettes-100, var(--palettes-neutral-100))}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button:disabled{--components-button-backgroundColor: transparent;--components-button-color: var(--pr-t-color-text-disabled)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree .dataTable-body-row-cell-expand-button.button{--components-button-padding: var(--pr-t-spacings-25);--components-button-color: var(--palettes-neutral-800)}:is(.dataTable-head-row-cell,.dataTable-body-row-cell,.dataTable-foot-row-cell).mod-tree{--components-dataTable-cell-paddingInlineStart: calc( var(--components-dataTable-cell-padding-inline) + var(--pr-t-spacings-300) * calc(var(--components-dataTable-treeLevel) - 1) + var(--components-dataTable-tree-extraPadding) )}.dataTable-body-row.is-collapsed{--components-dataTable-row-display: none}.dataTable-body-row:first-child:has(.dataTable-body-row-cell-expand-button.button[aria-expanded=false])~.dataTable-body-row{--components-dataTable-row-display: none}.dataTable-body-row-cell-expand-button[aria-expanded=true]{--components-dataTable-expand-rotation: 0deg}}@layer components{:not(.dataTable-body)>.dataTable-body-row{--components-dataTable-cell-padding-inline: var(--pr-t-spacings-150);--components-dataTable-cell-paddingInlineStart: var(--components-dataTable-cell-padding-inline);--components-dataTable-cell-padding-block: var(--pr-t-spacings-100);--components-dataTable-cell-padding: var(--components-dataTable-cell-padding-block) var(--components-dataTable-cell-padding-inline);--components-dataTable-treeLevel: 1;--components-dataTable-cell-verticalAlign: middle;--components-dataTable-cell-shadow: 0 1px inset var(--commons-border-200);--components-dataTable-cell-background: var(--pr-t-elevation-surface-raised);--components-dataTable-cell-textAlign: left;--components-dataTable-tableLayout: auto;--components-dataTable-cellFirst-width: auto;--components-dataTable-row-display: table-row;--components-dataTable-expand-rotation: 180deg;--components-dataTable-borderRadius: var(--pr-t-border-radius-structure);--components-dataTable-minInlineSize: none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: DataTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.1", ngImport: i0, type: DataTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-data-table', encapsulation: ViewEncapsulation.None, host: {
                         class: 'dataTableWrapper',