@cauca-911/datagrid 22.2.3 → 22.2.5

package/fesm2022/cauca-911-datagrid.mjs

@@ -52,6 +52,8 @@ class BaseGridColumnComponent {
         ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
         this.isInColumnChooser = input(true, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "isInColumnChooser" }] : /* istanbul ignore next */ []));
+        this.visibleByDefault = input(true, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "visibleByDefault" }] : /* istanbul ignore next */ []));
         this.width = input('', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
         this.showToolTip = input(true, /* @ts-ignore */
@@ -85,7 +87,7 @@ class BaseGridColumnComponent {
         return this.label() ?? this.capitalize(this.prop());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: BaseGridColumnComponent, deps: [{ token: i1.MatTable, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: BaseGridColumnComponent, isStandalone: true, selector: "ng-component", inputs: { prop: { classPropertyName: "prop", publicName: "prop", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, isInColumnChooser: { classPropertyName: "isInColumnChooser", publicName: "isInColumnChooser", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, showToolTip: { classPropertyName: "showToolTip", publicName: "showToolTip", isSignal: true, isRequired: false, transformFunction: null }, exportable: { classPropertyName: "exportable", publicName: "exportable", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.ariaHidden": "this.ariaHidden", "class": "this.classes" } }, viewQueries: [{ propertyName: "columnDef", first: true, predicate: MatColumnDef, descendants: true, static: true }, { propertyName: "cellDef", first: true, predicate: MatCellDef, descendants: true, static: true }, { propertyName: "headerCellDef", first: true, predicate: MatHeaderCellDef, descendants: true, static: true }, { propertyName: "footerCellDef", first: true, predicate: MatFooterCellDef, descendants: true, static: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: BaseGridColumnComponent, isStandalone: true, selector: "ng-component", inputs: { prop: { classPropertyName: "prop", publicName: "prop", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, isInColumnChooser: { classPropertyName: "isInColumnChooser", publicName: "isInColumnChooser", isSignal: true, isRequired: false, transformFunction: null }, visibleByDefault: { classPropertyName: "visibleByDefault", publicName: "visibleByDefault", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, showToolTip: { classPropertyName: "showToolTip", publicName: "showToolTip", isSignal: true, isRequired: false, transformFunction: null }, exportable: { classPropertyName: "exportable", publicName: "exportable", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.ariaHidden": "this.ariaHidden", "class": "this.classes" } }, viewQueries: [{ propertyName: "columnDef", first: true, predicate: MatColumnDef, descendants: true, static: true }, { propertyName: "cellDef", first: true, predicate: MatCellDef, descendants: true, static: true }, { propertyName: "headerCellDef", first: true, predicate: MatHeaderCellDef, descendants: true, static: true }, { propertyName: "footerCellDef", first: true, predicate: MatFooterCellDef, descendants: true, static: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: BaseGridColumnComponent, decorators: [{
             type: Component,
@@ -95,7 +97,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                 }]
         }], ctorParameters: () => [{ type: i1.MatTable, decorators: [{
                     type: Optional
-                }] }], propDecorators: { prop: [{ type: i0.Input, args: [{ isSignal: true, alias: "prop", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], isInColumnChooser: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInColumnChooser", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], showToolTip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToolTip", required: false }] }], exportable: [{ type: i0.Input, args: [{ isSignal: true, alias: "exportable", required: false }] }], ariaHidden: [{
+                }] }], propDecorators: { prop: [{ type: i0.Input, args: [{ isSignal: true, alias: "prop", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], isInColumnChooser: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInColumnChooser", required: false }] }], visibleByDefault: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibleByDefault", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], showToolTip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToolTip", required: false }] }], exportable: [{ type: i0.Input, args: [{ isSignal: true, alias: "exportable", required: false }] }], ariaHidden: [{
                 type: HostBinding,
                 args: ['attr.ariaHidden']
             }], classes: [{
@@ -506,8 +508,11 @@ class BaseDataGridComponent {
     setUpPaginator(_paginator, _showPaginator) {
         // nothing
     }
-    onColumnsChanged(columns) {
+    onColumnsChanged({ columns, persist }) {
         this.allDisplayedColumns.set([...columns]);
+        if (!persist) {
+            return;
+        }
         const columnsToSave = this.removeMandatoryColumns([...columns]);
         this.preferenceService.addOrUpdateGridPreference(this.resourceName(), columnsToSave).subscribe();
     }
@@ -583,11 +588,11 @@ class ButtonPopoverComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: ButtonPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: ButtonPopoverComponent, isStandalone: true, selector: "cauca-button-popover", inputs: { buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, buttonIcon: { classPropertyName: "buttonIcon", publicName: "buttonIcon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<cauca-basic-button [icon]=\"buttonIcon()\" [color]=\"color()\" [label]=\"buttonLabel()\" [translateLabel]=\"false\" (buttonClick)=\"toggle()\" cdkOverlayOrigin #popoverTrigger=\"cdkOverlayOrigin\" />\r\n\r\n<ng-template\r\n  cdkConnectedOverlay\r\n  [cdkConnectedOverlayOrigin]=\"popoverTrigger\"\r\n  [cdkConnectedOverlayOpen]=\"isActive()\"\r\n  [cdkConnectedOverlayHasBackdrop]=\"isActive()\"\r\n  [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop-cs'\"\r\n  (backdropClick)=\"toggle()\">\r\n  <ng-content></ng-content>\r\n</ng-template>", styles: [".popover{background-color:#fff;border:1px solid #DDD;pointer-events:none;opacity:0;position:absolute;transition:all .5s ease 0s}.active{opacity:1;pointer-events:auto}\n"], dependencies: [{ kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: BasicButtonComponent, selector: "cauca-basic-button" }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: ButtonPopoverComponent, isStandalone: true, selector: "cauca-button-popover", inputs: { buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, buttonIcon: { classPropertyName: "buttonIcon", publicName: "buttonIcon", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<cauca-basic-button [icon]=\"buttonIcon()\" [color]=\"color()\" [label]=\"buttonLabel()\" [translateLabel]=\"false\" (buttonClick)=\"toggle()\" cdkOverlayOrigin #popoverTrigger=\"cdkOverlayOrigin\" />\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"popoverTrigger\"\n  [cdkConnectedOverlayOpen]=\"isActive()\"\n  [cdkConnectedOverlayHasBackdrop]=\"isActive()\"\n  [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop-cs'\"\n  (backdropClick)=\"toggle()\">\n  <ng-content></ng-content>\n</ng-template>", styles: [".popover{background-color:#fff;border:1px solid #DDD;pointer-events:none;opacity:0;position:absolute;transition:all .5s ease 0s}.active{opacity:1;pointer-events:auto}\n"], dependencies: [{ kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: BasicButtonComponent, selector: "cauca-basic-button" }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: ButtonPopoverComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-button-popover', imports: [CdkConnectedOverlay, BasicButtonComponent, CdkOverlayOrigin], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cauca-basic-button [icon]=\"buttonIcon()\" [color]=\"color()\" [label]=\"buttonLabel()\" [translateLabel]=\"false\" (buttonClick)=\"toggle()\" cdkOverlayOrigin #popoverTrigger=\"cdkOverlayOrigin\" />\r\n\r\n<ng-template\r\n  cdkConnectedOverlay\r\n  [cdkConnectedOverlayOrigin]=\"popoverTrigger\"\r\n  [cdkConnectedOverlayOpen]=\"isActive()\"\r\n  [cdkConnectedOverlayHasBackdrop]=\"isActive()\"\r\n  [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop-cs'\"\r\n  (backdropClick)=\"toggle()\">\r\n  <ng-content></ng-content>\r\n</ng-template>", styles: [".popover{background-color:#fff;border:1px solid #DDD;pointer-events:none;opacity:0;position:absolute;transition:all .5s ease 0s}.active{opacity:1;pointer-events:auto}\n"] }]
+            args: [{ selector: 'cauca-button-popover', imports: [CdkConnectedOverlay, BasicButtonComponent, CdkOverlayOrigin], changeDetection: ChangeDetectionStrategy.OnPush, template: "<cauca-basic-button [icon]=\"buttonIcon()\" [color]=\"color()\" [label]=\"buttonLabel()\" [translateLabel]=\"false\" (buttonClick)=\"toggle()\" cdkOverlayOrigin #popoverTrigger=\"cdkOverlayOrigin\" />\n\n<ng-template\n  cdkConnectedOverlay\n  [cdkConnectedOverlayOrigin]=\"popoverTrigger\"\n  [cdkConnectedOverlayOpen]=\"isActive()\"\n  [cdkConnectedOverlayHasBackdrop]=\"isActive()\"\n  [cdkConnectedOverlayBackdropClass]=\"'cdk-overlay-transparent-backdrop-cs'\"\n  (backdropClick)=\"toggle()\">\n  <ng-content></ng-content>\n</ng-template>", styles: [".popover{background-color:#fff;border:1px solid #DDD;pointer-events:none;opacity:0;position:absolute;transition:all .5s ease 0s}.active{opacity:1;pointer-events:auto}\n"] }]
         }], propDecorators: { buttonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLabel", required: false }] }], buttonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonIcon", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] } });
 
 class DataGridTableOptionsComponent {
@@ -626,9 +631,9 @@ class DataGridTableOptionsComponent {
                     this.selectOnlyUserColumns(configuration.visibleColumns);
                 }
                 else {
-                    this.selectAllColumns();
+                    this.selectDefaultColumns();
                 }
-                this.onColumnsChanged();
+                this.onColumnsChanged(false);
             }
         });
     }
@@ -640,13 +645,17 @@ class DataGridTableOptionsComponent {
     changeDensity(newDensity) {
         this.densityChanged.emit(newDensity);
     }
-    onColumnsChanged() {
+    onColumnsChanged(persist = true) {
         const newColumns = this.allColumns().filter(column => column.selected);
-        this.columnsChanged.emit(newColumns.map((column) => column.prop()));
+        this.columnsChanged.emit({ columns: newColumns.map((column) => column.prop()), persist });
     }
     resetColumns() {
+        this.selectDefaultColumns();
+        this.onColumnsChanged();
+    }
+    showAllColumns() {
         this.allColumns().forEach((column => column.selected = true));
-        this.columnsChanged.emit(this.allColumns().map((column) => column.prop()));
+        this.onColumnsChanged();
     }
     selectOnlyUserColumns(configurationVisibleColumns) {
         this.allColumns().forEach((column => {
@@ -656,17 +665,17 @@ class DataGridTableOptionsComponent {
             }
         }));
     }
-    selectAllColumns() {
+    selectDefaultColumns() {
         this.allColumns().forEach((column => {
-            column.selected = true;
+            column.selected = column.visibleByDefault();
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridTableOptionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridTableOptionsComponent, isStandalone: true, selector: "cauca-data-grid-table-options", inputs: { gridName: { classPropertyName: "gridName", publicName: "gridName", isSignal: true, isRequired: true, transformFunction: null }, showColumnViewer: { classPropertyName: "showColumnViewer", publicName: "showColumnViewer", isSignal: true, isRequired: false, transformFunction: null }, allColumns: { classPropertyName: "allColumns", publicName: "allColumns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { densityChanged: "densityChanged", columnsChanged: "columnsChanged" }, viewQueries: [{ propertyName: "columnViewer", first: true, predicate: ButtonPopoverComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"table-options-bar\">\r\n  <div class=\"table-options\">\r\n    @if (showColumnViewer()) { <cauca-button-popover [buttonLabel]=\"'dataGrid.columns' | translate\" buttonIcon=\"view_column\">\r\n      <mat-card>\r\n        <mat-card-content>\r\n          <div class=\"columns\">\r\n            @for (column of columns; track column) {\r\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"column.selected\"\r\n                (change)=\"onColumnsChanged()\">\r\n                {{column.label()}}\r\n              </mat-checkbox>\r\n            }\r\n          </div>\r\n        </mat-card-content>\r\n        <mat-card-actions>\r\n          <cauca-stroked-button [small]=\"true\" color=\"primary\" (buttonClick)=\"resetColumns()\" label=\"dataGrid.columnChooser.reset\" [translateLabel]=\"true\" />\r\n          <cauca-raised-button [small]=\"true\" color=\"primary\" (buttonClick)=\"resetColumns()\" label=\"dataGrid.columnChooser.showAll\" [translateLabel]=\"true\" />\r\n        </mat-card-actions>\r\n      </mat-card>\r\n    </cauca-button-popover> }\r\n    <cauca-basic-button color=\"primary\" [matMenuTriggerFor]=\"densityMenu\" class=\"open-menu-button\" [icon]=\"currentDensityIcon\" label=\"dataGrid.density.title\" [translateLabel]=\"true\" />\r\n  </div>\r\n\r\n  <ng-content select=\"[customFilter]\"> </ng-content>\r\n</div>\r\n\r\n<mat-menu #densityMenu=\"matMenu\">\r\n  <cauca-menu-item label=\"dataGrid.density.compact\" [translateLabel]=\"true\" icon=\"density_small\" (buttonClick)=\"changeDensity(density.Compact)\" class=\"density-compact\" />\r\n  <cauca-menu-item label=\"dataGrid.density.standard\" [translateLabel]=\"true\" icon=\"density_medium\" (buttonClick)=\"changeDensity(density.Standard)\" class=\"density-standard\" />\r\n  <cauca-menu-item label=\"dataGrid.density.comfortable\" [translateLabel]=\"true\" icon=\"density_large\" (buttonClick)=\"changeDensity(density.Comfortable)\" class=\"density-comfortable\" />\r\n</mat-menu>", styles: [".table-options-bar{display:flex;padding:8px 16px;align-items:center;align-self:stretch}.table-options{flex:1 0 0;display:flex;gap:8px;align-items:center;align-content:normal;text-transform:capitalize}.columns{display:flex;flex-direction:column;max-height:650px}mat-card{box-shadow:0 8px 10px 1px #00000024}mat-card>mat-card-actions{gap:32px;padding:16px;justify-content:space-between}.column-viewer-header{display:flex;flex-direction:row-reverse;padding:4px 4px 0px px 0px}.mat-mdc-icon-button.mat-mdc-button-base{height:24px}mat-card-content{padding:0 8px}.button-small{height:32px;line-height:18px}.small-icon-button{height:24px;width:24px;padding:0}.small-icon-button>span{height:24px!important;width:24px!important}.small-icon-button>.mat-mdc-icon-button .mat-mdc-button-touch-target{display:none;height:24px!important;width:24px!important}.small-icon{font-size:18px;height:unset;width:unset}\n"], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i1$4.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: ButtonPopoverComponent, selector: "cauca-button-popover", inputs: ["buttonLabel", "buttonIcon", "color"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: StrokedButtonComponent, selector: "cauca-stroked-button" }, { kind: "component", type: RaisedButtonComponent, selector: "cauca-raised-button" }, { kind: "component", type: BasicButtonComponent, selector: "cauca-basic-button" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MenuItemComponent, selector: "cauca-menu-item", inputs: ["translateLabel", "trigger"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridTableOptionsComponent, isStandalone: true, selector: "cauca-data-grid-table-options", inputs: { gridName: { classPropertyName: "gridName", publicName: "gridName", isSignal: true, isRequired: true, transformFunction: null }, showColumnViewer: { classPropertyName: "showColumnViewer", publicName: "showColumnViewer", isSignal: true, isRequired: false, transformFunction: null }, allColumns: { classPropertyName: "allColumns", publicName: "allColumns", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { densityChanged: "densityChanged", columnsChanged: "columnsChanged" }, viewQueries: [{ propertyName: "columnViewer", first: true, predicate: ButtonPopoverComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"table-options-bar\">\n  <div class=\"table-options\">\n    @if (showColumnViewer()) { <cauca-button-popover [buttonLabel]=\"'dataGrid.columns' | translate\" buttonIcon=\"view_column\">\n      <mat-card>\n        <mat-card-content>\n          <div class=\"columns\">\n            @for (column of columns; track column) {\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"column.selected\"\n                (change)=\"onColumnsChanged()\">\n                {{column.label()}}\n              </mat-checkbox>\n            }\n          </div>\n        </mat-card-content>\n        <mat-card-actions>\n          <cauca-stroked-button [small]=\"true\" color=\"primary\" (buttonClick)=\"resetColumns()\" label=\"dataGrid.columnChooser.reset\" [translateLabel]=\"true\" />\n          <cauca-raised-button [small]=\"true\" color=\"primary\" (buttonClick)=\"showAllColumns()\" label=\"dataGrid.columnChooser.showAll\" [translateLabel]=\"true\" />\n        </mat-card-actions>\n      </mat-card>\n    </cauca-button-popover> }\n    <cauca-basic-button color=\"primary\" [matMenuTriggerFor]=\"densityMenu\" class=\"open-menu-button\" [icon]=\"currentDensityIcon\" label=\"dataGrid.density.title\" [translateLabel]=\"true\" />\n  </div>\n\n  <ng-content select=\"[customFilter]\"> </ng-content>\n</div>\n\n<mat-menu #densityMenu=\"matMenu\">\n  <cauca-menu-item label=\"dataGrid.density.compact\" [translateLabel]=\"true\" icon=\"density_small\" (buttonClick)=\"changeDensity(density.Compact)\" class=\"density-compact\" />\n  <cauca-menu-item label=\"dataGrid.density.standard\" [translateLabel]=\"true\" icon=\"density_medium\" (buttonClick)=\"changeDensity(density.Standard)\" class=\"density-standard\" />\n  <cauca-menu-item label=\"dataGrid.density.comfortable\" [translateLabel]=\"true\" icon=\"density_large\" (buttonClick)=\"changeDensity(density.Comfortable)\" class=\"density-comfortable\" />\n</mat-menu>", styles: [".table-options-bar{display:flex;padding:8px 16px;align-items:center;align-self:stretch}.table-options{flex:1 0 0;display:flex;gap:8px;align-items:center;align-content:normal;text-transform:capitalize}.columns{display:flex;flex-direction:column;max-height:650px}mat-card{box-shadow:0 8px 10px 1px #00000024}mat-card>mat-card-actions{gap:32px;padding:16px;justify-content:space-between}.column-viewer-header{display:flex;flex-direction:row-reverse;padding:4px 4px 0px px 0px}.mat-mdc-icon-button.mat-mdc-button-base{height:24px}mat-card-content{padding:0 8px}.button-small{height:32px;line-height:18px}.small-icon-button{height:24px;width:24px;padding:0}.small-icon-button>span{height:24px!important;width:24px!important}.small-icon-button>.mat-mdc-icon-button .mat-mdc-button-touch-target{display:none;height:24px!important;width:24px!important}.small-icon{font-size:18px;height:unset;width:unset}\n"], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i1$4.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: ButtonPopoverComponent, selector: "cauca-button-popover", inputs: ["buttonLabel", "buttonIcon", "color"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: StrokedButtonComponent, selector: "cauca-stroked-button" }, { kind: "component", type: RaisedButtonComponent, selector: "cauca-raised-button" }, { kind: "component", type: BasicButtonComponent, selector: "cauca-basic-button" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MenuItemComponent, selector: "cauca-menu-item", inputs: ["translateLabel", "trigger"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridTableOptionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-table-options', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCardModule, ButtonPopoverComponent, MatCheckboxModule, StrokedButtonComponent, RaisedButtonComponent, BasicButtonComponent, MatMenuModule, FormsModule, TranslatePipe, MenuItemComponent], template: "<div class=\"table-options-bar\">\r\n  <div class=\"table-options\">\r\n    @if (showColumnViewer()) { <cauca-button-popover [buttonLabel]=\"'dataGrid.columns' | translate\" buttonIcon=\"view_column\">\r\n      <mat-card>\r\n        <mat-card-content>\r\n          <div class=\"columns\">\r\n            @for (column of columns; track column) {\r\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"column.selected\"\r\n                (change)=\"onColumnsChanged()\">\r\n                {{column.label()}}\r\n              </mat-checkbox>\r\n            }\r\n          </div>\r\n        </mat-card-content>\r\n        <mat-card-actions>\r\n          <cauca-stroked-button [small]=\"true\" color=\"primary\" (buttonClick)=\"resetColumns()\" label=\"dataGrid.columnChooser.reset\" [translateLabel]=\"true\" />\r\n          <cauca-raised-button [small]=\"true\" color=\"primary\" (buttonClick)=\"resetColumns()\" label=\"dataGrid.columnChooser.showAll\" [translateLabel]=\"true\" />\r\n        </mat-card-actions>\r\n      </mat-card>\r\n    </cauca-button-popover> }\r\n    <cauca-basic-button color=\"primary\" [matMenuTriggerFor]=\"densityMenu\" class=\"open-menu-button\" [icon]=\"currentDensityIcon\" label=\"dataGrid.density.title\" [translateLabel]=\"true\" />\r\n  </div>\r\n\r\n  <ng-content select=\"[customFilter]\"> </ng-content>\r\n</div>\r\n\r\n<mat-menu #densityMenu=\"matMenu\">\r\n  <cauca-menu-item label=\"dataGrid.density.compact\" [translateLabel]=\"true\" icon=\"density_small\" (buttonClick)=\"changeDensity(density.Compact)\" class=\"density-compact\" />\r\n  <cauca-menu-item label=\"dataGrid.density.standard\" [translateLabel]=\"true\" icon=\"density_medium\" (buttonClick)=\"changeDensity(density.Standard)\" class=\"density-standard\" />\r\n  <cauca-menu-item label=\"dataGrid.density.comfortable\" [translateLabel]=\"true\" icon=\"density_large\" (buttonClick)=\"changeDensity(density.Comfortable)\" class=\"density-comfortable\" />\r\n</mat-menu>", styles: [".table-options-bar{display:flex;padding:8px 16px;align-items:center;align-self:stretch}.table-options{flex:1 0 0;display:flex;gap:8px;align-items:center;align-content:normal;text-transform:capitalize}.columns{display:flex;flex-direction:column;max-height:650px}mat-card{box-shadow:0 8px 10px 1px #00000024}mat-card>mat-card-actions{gap:32px;padding:16px;justify-content:space-between}.column-viewer-header{display:flex;flex-direction:row-reverse;padding:4px 4px 0px px 0px}.mat-mdc-icon-button.mat-mdc-button-base{height:24px}mat-card-content{padding:0 8px}.button-small{height:32px;line-height:18px}.small-icon-button{height:24px;width:24px;padding:0}.small-icon-button>span{height:24px!important;width:24px!important}.small-icon-button>.mat-mdc-icon-button .mat-mdc-button-touch-target{display:none;height:24px!important;width:24px!important}.small-icon{font-size:18px;height:unset;width:unset}\n"] }]
+            args: [{ selector: 'cauca-data-grid-table-options', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatCardModule, ButtonPopoverComponent, MatCheckboxModule, StrokedButtonComponent, RaisedButtonComponent, BasicButtonComponent, MatMenuModule, FormsModule, TranslatePipe, MenuItemComponent], template: "<div class=\"table-options-bar\">\n  <div class=\"table-options\">\n    @if (showColumnViewer()) { <cauca-button-popover [buttonLabel]=\"'dataGrid.columns' | translate\" buttonIcon=\"view_column\">\n      <mat-card>\n        <mat-card-content>\n          <div class=\"columns\">\n            @for (column of columns; track column) {\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"column.selected\"\n                (change)=\"onColumnsChanged()\">\n                {{column.label()}}\n              </mat-checkbox>\n            }\n          </div>\n        </mat-card-content>\n        <mat-card-actions>\n          <cauca-stroked-button [small]=\"true\" color=\"primary\" (buttonClick)=\"resetColumns()\" label=\"dataGrid.columnChooser.reset\" [translateLabel]=\"true\" />\n          <cauca-raised-button [small]=\"true\" color=\"primary\" (buttonClick)=\"showAllColumns()\" label=\"dataGrid.columnChooser.showAll\" [translateLabel]=\"true\" />\n        </mat-card-actions>\n      </mat-card>\n    </cauca-button-popover> }\n    <cauca-basic-button color=\"primary\" [matMenuTriggerFor]=\"densityMenu\" class=\"open-menu-button\" [icon]=\"currentDensityIcon\" label=\"dataGrid.density.title\" [translateLabel]=\"true\" />\n  </div>\n\n  <ng-content select=\"[customFilter]\"> </ng-content>\n</div>\n\n<mat-menu #densityMenu=\"matMenu\">\n  <cauca-menu-item label=\"dataGrid.density.compact\" [translateLabel]=\"true\" icon=\"density_small\" (buttonClick)=\"changeDensity(density.Compact)\" class=\"density-compact\" />\n  <cauca-menu-item label=\"dataGrid.density.standard\" [translateLabel]=\"true\" icon=\"density_medium\" (buttonClick)=\"changeDensity(density.Standard)\" class=\"density-standard\" />\n  <cauca-menu-item label=\"dataGrid.density.comfortable\" [translateLabel]=\"true\" icon=\"density_large\" (buttonClick)=\"changeDensity(density.Comfortable)\" class=\"density-comfortable\" />\n</mat-menu>", styles: [".table-options-bar{display:flex;padding:8px 16px;align-items:center;align-self:stretch}.table-options{flex:1 0 0;display:flex;gap:8px;align-items:center;align-content:normal;text-transform:capitalize}.columns{display:flex;flex-direction:column;max-height:650px}mat-card{box-shadow:0 8px 10px 1px #00000024}mat-card>mat-card-actions{gap:32px;padding:16px;justify-content:space-between}.column-viewer-header{display:flex;flex-direction:row-reverse;padding:4px 4px 0px px 0px}.mat-mdc-icon-button.mat-mdc-button-base{height:24px}mat-card-content{padding:0 8px}.button-small{height:32px;line-height:18px}.small-icon-button{height:24px;width:24px;padding:0}.small-icon-button>span{height:24px!important;width:24px!important}.small-icon-button>.mat-mdc-icon-button .mat-mdc-button-touch-target{display:none;height:24px!important;width:24px!important}.small-icon{font-size:18px;height:unset;width:unset}\n"] }]
         }], propDecorators: { gridName: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridName", required: true }] }], showColumnViewer: [{ type: i0.Input, args: [{ isSignal: true, alias: "showColumnViewer", required: false }] }], allColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "allColumns", required: false }] }], densityChanged: [{ type: i0.Output, args: ["densityChanged"] }], columnsChanged: [{ type: i0.Output, args: ["columnsChanged"] }], columnViewer: [{
                 type: ViewChild,
                 args: [ButtonPopoverComponent, { static: true }]
@@ -680,11 +689,11 @@ class DataGridProgressSpinerComponent {
         ...(ngDevMode ? [{ debugName: "useBackground" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridProgressSpinerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridProgressSpinerComponent, isStandalone: true, selector: "cauca-data-grid-progress-spiner", inputs: { isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, useBackground: { classPropertyName: "useBackground", publicName: "useBackground", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (isLoading()) {\r\n  <div class=\"spiner-container\" [class.use-background]=\"useBackground()\">\r\n    <mat-progress-spinner\r\n      color=\"primary\"\r\n      mode=\"indeterminate\">\r\n    </mat-progress-spinner>\r\n  </div>\r\n}", styles: [".spiner-container{display:flex;justify-content:center;align-items:center}.use-background{background:#fff}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridProgressSpinerComponent, isStandalone: true, selector: "cauca-data-grid-progress-spiner", inputs: { isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, useBackground: { classPropertyName: "useBackground", publicName: "useBackground", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (isLoading()) {\n  <div class=\"spiner-container\" [class.use-background]=\"useBackground()\">\n    <mat-progress-spinner\n      color=\"primary\"\n      mode=\"indeterminate\">\n    </mat-progress-spinner>\n  </div>\n}", styles: [".spiner-container{display:flex;justify-content:center;align-items:center}.use-background{background:#fff}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridProgressSpinerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-progress-spiner', imports: [MatProgressSpinnerModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isLoading()) {\r\n  <div class=\"spiner-container\" [class.use-background]=\"useBackground()\">\r\n    <mat-progress-spinner\r\n      color=\"primary\"\r\n      mode=\"indeterminate\">\r\n    </mat-progress-spinner>\r\n  </div>\r\n}", styles: [".spiner-container{display:flex;justify-content:center;align-items:center}.use-background{background:#fff}\n"] }]
+            args: [{ selector: 'cauca-data-grid-progress-spiner', imports: [MatProgressSpinnerModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isLoading()) {\n  <div class=\"spiner-container\" [class.use-background]=\"useBackground()\">\n    <mat-progress-spinner\n      color=\"primary\"\n      mode=\"indeterminate\">\n    </mat-progress-spinner>\n  </div>\n}", styles: [".spiner-container{display:flex;justify-content:center;align-items:center}.use-background{background:#fff}\n"] }]
         }], propDecorators: { isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], useBackground: [{ type: i0.Input, args: [{ isSignal: true, alias: "useBackground", required: false }] }] } });
 
 class DataGridComponent extends BaseDataGridComponent {
@@ -740,7 +749,7 @@ class DataGridComponent extends BaseDataGridComponent {
         return this.dataSource.filteredData;
     }
     refreshDisplayedColumns(columns) {
-        this.onColumnsChanged(columns);
+        this.onColumnsChanged({ columns, persist: true });
     }
     rowDropped(event) {
         const data = this.getData();
@@ -767,8 +776,8 @@ class DataGridComponent extends BaseDataGridComponent {
     computeDisplayedColumns() {
         return this.decorateColumns(this.displayedColumns());
     }
-    onColumnsChanged(columns) {
-        super.onColumnsChanged(columns);
+    onColumnsChanged({ columns, persist }) {
+        super.onColumnsChanged({ columns, persist });
         this.allDisplayedColumns.set(this.decorateColumns(columns));
     }
     setUpFilterPredicate() {
@@ -1145,8 +1154,8 @@ class OdataGridComponent extends BaseDataGridComponent {
     computeDisplayedColumns() {
         return this.decorateColumns(this.displayedColumns());
     }
-    onColumnsChanged(columns) {
-        super.onColumnsChanged(this.decorateColumns(columns));
+    onColumnsChanged({ columns, persist }) {
+        super.onColumnsChanged({ columns: this.decorateColumns(columns), persist });
     }
     applyFilterValue(filter, { resetPage }) {
         const filterPredicate = this.filterPredicate();
@@ -1407,28 +1416,28 @@ class CheckIconComponent {
         ...(ngDevMode ? [{ debugName: "uncheck" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: CheckIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: CheckIconComponent, isStandalone: true, selector: "cauca-check-icon", inputs: { checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null }, isChecked: { classPropertyName: "isChecked", publicName: "isChecked", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-    <mat-icon
-      class="check-icon"
-      [class.check-mark]="checkMark()"
-      [class.check]="check()"
-      [class.uncheck]="uncheck()"
-      aria-hidden="false"
-      aria-label="State icon"
-      [fontIcon]="icon()" />
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: CheckIconComponent, isStandalone: true, selector: "cauca-check-icon", inputs: { checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null }, isChecked: { classPropertyName: "isChecked", publicName: "isChecked", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <mat-icon
+      class="check-icon"
+      [class.check-mark]="checkMark()"
+      [class.check]="check()"
+      [class.uncheck]="uncheck()"
+      aria-hidden="false"
+      aria-label="State icon"
+      [fontIcon]="icon()" />
   `, isInline: true, styles: [".check-mark{color:#2e7d32}.check{color:#006496}.uncheck{color:#12101461}.check-icon{vertical-align:middle}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: CheckIconComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-check-icon', template: `
-    <mat-icon
-      class="check-icon"
-      [class.check-mark]="checkMark()"
-      [class.check]="check()"
-      [class.uncheck]="uncheck()"
-      aria-hidden="false"
-      aria-label="State icon"
-      [fontIcon]="icon()" />
+            args: [{ selector: 'cauca-check-icon', template: `
+    <mat-icon
+      class="check-icon"
+      [class.check-mark]="checkMark()"
+      [class.check]="check()"
+      [class.uncheck]="uncheck()"
+      aria-hidden="false"
+      aria-label="State icon"
+      [fontIcon]="icon()" />
   `, imports: [MatIcon], changeDetection: ChangeDetectionStrategy.OnPush, styles: [".check-mark{color:#2e7d32}.check{color:#006496}.uncheck{color:#12101461}.check-icon{vertical-align:middle}\n"] }]
         }], propDecorators: { checkIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkIcon", required: false }] }], uncheckIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "uncheckIcon", required: false }] }], isChecked: [{ type: i0.Input, args: [{ isSignal: true, alias: "isChecked", required: false }] }] } });
 
@@ -1443,11 +1452,11 @@ class DataGridCheckColumnComponent extends BaseGridColumnComponent {
         ...(ngDevMode ? [{ debugName: "uncheckIcon" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridCheckColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: DataGridCheckColumnComponent, isStandalone: true, selector: "cauca-data-grid-check-column", inputs: { checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCheckColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width(), 'text-align': 'center'}\">\r\n        {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n    <td mat-cell *matCellDef=\"let row\">\r\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\"  [isChecked]=\"row[prop()]\" />\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:120px;min-width:120px;text-align:center}\n"], dependencies: [{ kind: "component", type: CheckIconComponent, selector: "cauca-check-icon", inputs: ["checkIcon", "uncheckIcon", "isChecked"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: DataGridCheckColumnComponent, isStandalone: true, selector: "cauca-data-grid-check-column", inputs: { checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCheckColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width(), 'text-align': 'center'}\">\n        {{ label() ?? capitalize(prop()) }}\n    </th>\n    <td mat-cell *matCellDef=\"let row\">\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\"  [isChecked]=\"row[prop()]\" />\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:120px;min-width:120px;text-align:center}\n"], dependencies: [{ kind: "component", type: CheckIconComponent, selector: "cauca-check-icon", inputs: ["checkIcon", "uncheckIcon", "isChecked"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridCheckColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-check-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCheckColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [CheckIconComponent, MatColumnDef, MatHeaderCell, MatHeaderCellDef, NgStyle, MatCell, MatCellDef, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width(), 'text-align': 'center'}\">\r\n        {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n    <td mat-cell *matCellDef=\"let row\">\r\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\"  [isChecked]=\"row[prop()]\" />\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:120px;min-width:120px;text-align:center}\n"] }]
+            args: [{ selector: 'cauca-data-grid-check-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCheckColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [CheckIconComponent, MatColumnDef, MatHeaderCell, MatHeaderCellDef, NgStyle, MatCell, MatCellDef, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width(), 'text-align': 'center'}\">\n        {{ label() ?? capitalize(prop()) }}\n    </th>\n    <td mat-cell *matCellDef=\"let row\">\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\"  [isChecked]=\"row[prop()]\" />\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:120px;min-width:120px;text-align:center}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1481,11 +1490,11 @@ class DataGridColumnComponent extends BaseGridColumnComponent {
         return '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridColumnComponent, isStandalone: true, selector: "cauca-data-grid-column", inputs: { summaryType: { classPropertyName: "summaryType", publicName: "summaryType", isSignal: true, isRequired: false, transformFunction: null }, summaryLabel: { classPropertyName: "summaryLabel", publicName: "summaryLabel", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n\r\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\">\r\n      {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n\r\n    <td mat-cell *matCellDef=\"let row\">\r\n      @if (showToolTip()) {<span [matTooltip]=\"row[prop()]\" >{{ row[prop()] }}</span>}\r\n      @else { <span>{{ row[prop()] }}</span>}\r\n    </td>\r\n\r\n    <td mat-footer-cell *matFooterCellDef>\r\n      @if (isInitialized) {\r\n        {{calculateSummary()}}\r\n      }\r\n    </td>\r\n\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridColumnComponent, isStandalone: true, selector: "cauca-data-grid-column", inputs: { summaryType: { classPropertyName: "summaryType", publicName: "summaryType", isSignal: true, isRequired: false, transformFunction: null }, summaryLabel: { classPropertyName: "summaryLabel", publicName: "summaryLabel", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\n\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\">\n      {{ label() ?? capitalize(prop()) }}\n    </th>\n\n    <td mat-cell *matCellDef=\"let row\">\n      @if (showToolTip()) {<span [matTooltip]=\"row[prop()]\" >{{ row[prop()] }}</span>}\n      @else { <span>{{ row[prop()] }}</span>}\n    </td>\n\n    <td mat-footer-cell *matFooterCellDef>\n      @if (isInitialized) {\n        {{calculateSummary()}}\n      }\n    </td>\n\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-column', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridColumnComponent) }], imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, NgStyle, MatCell, MatCellDef, MatTooltip, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n\r\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\">\r\n      {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n\r\n    <td mat-cell *matCellDef=\"let row\">\r\n      @if (showToolTip()) {<span [matTooltip]=\"row[prop()]\" >{{ row[prop()] }}</span>}\r\n      @else { <span>{{ row[prop()] }}</span>}\r\n    </td>\r\n\r\n    <td mat-footer-cell *matFooterCellDef>\r\n      @if (isInitialized) {\r\n        {{calculateSummary()}}\r\n      }\r\n    </td>\r\n\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+            args: [{ selector: 'cauca-data-grid-column', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridColumnComponent) }], imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, NgStyle, MatCell, MatCellDef, MatTooltip, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\n\n    <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\">\n      {{ label() ?? capitalize(prop()) }}\n    </th>\n\n    <td mat-cell *matCellDef=\"let row\">\n      @if (showToolTip()) {<span [matTooltip]=\"row[prop()]\" >{{ row[prop()] }}</span>}\n      @else { <span>{{ row[prop()] }}</span>}\n    </td>\n\n    <td mat-footer-cell *matFooterCellDef>\n      @if (isInitialized) {\n        {{calculateSummary()}}\n      }\n    </td>\n\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1508,11 +1517,11 @@ class DataGridCommandIconColumnComponent extends BaseGridColumnComponent {
         this.commandClick = output();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridCommandIconColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridCommandIconColumnComponent, isStandalone: true, selector: "cauca-data-grid-command-icon-column", inputs: { checkColor: { classPropertyName: "checkColor", publicName: "checkColor", isSignal: true, isRequired: false, transformFunction: null }, checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckColor: { classPropertyName: "uncheckColor", publicName: "uncheckColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { commandClick: "commandClick" }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandIconColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell mat-sort-header *matHeaderCellDef>\r\n        <div>\r\n            @if (label()) {\r\n                {{ label() }}\r\n            } @else {\r\n                <mat-icon [style.color]=\"uncheckColor()\" aria-hidden=\"false\" aria-label=\"State icon\" [fontIcon]=\"uncheckIcon()\" />\r\n            }\r\n        </div>\r\n    </th>\r\n    <td mat-cell *matCellDef=\"let row\">\r\n        <div>\r\n            <cauca-icon-button (buttonClick)=\"commandClick.emit(row)\" [icon]=\"row[prop()] ? checkIcon() : uncheckIcon()\" [color]=\"row[prop()] ? checkColor() : uncheckColor()\" />\r\n        </div>\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}td{width:50px;min-width:50px;padding-left:0;padding-right:0}td>div{display:flex;justify-content:center}th{padding-left:23px;padding-right:0;width:70px;min-width:70px}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconButtonComponent, selector: "cauca-icon-button" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridCommandIconColumnComponent, isStandalone: true, selector: "cauca-data-grid-command-icon-column", inputs: { checkColor: { classPropertyName: "checkColor", publicName: "checkColor", isSignal: true, isRequired: false, transformFunction: null }, checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckColor: { classPropertyName: "uncheckColor", publicName: "uncheckColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { commandClick: "commandClick" }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandIconColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell mat-sort-header *matHeaderCellDef>\n        <div>\n            @if (label()) {\n                {{ label() }}\n            } @else {\n                <mat-icon [style.color]=\"uncheckColor()\" aria-hidden=\"false\" aria-label=\"State icon\" [fontIcon]=\"uncheckIcon()\" />\n            }\n        </div>\n    </th>\n    <td mat-cell *matCellDef=\"let row\">\n        <div>\n            <cauca-icon-button (buttonClick)=\"commandClick.emit(row)\" [icon]=\"row[prop()] ? checkIcon() : uncheckIcon()\" [color]=\"row[prop()] ? checkColor() : uncheckColor()\" />\n        </div>\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}td{width:50px;min-width:50px;padding-left:0;padding-right:0}td>div{display:flex;justify-content:center}th{padding-left:23px;padding-right:0;width:70px;min-width:70px}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconButtonComponent, selector: "cauca-icon-button" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridCommandIconColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-command-icon-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandIconColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatSortHeader, MatHeaderCellDef, MatIcon, MatCell, MatCellDef, IconButtonComponent, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell mat-sort-header *matHeaderCellDef>\r\n        <div>\r\n            @if (label()) {\r\n                {{ label() }}\r\n            } @else {\r\n                <mat-icon [style.color]=\"uncheckColor()\" aria-hidden=\"false\" aria-label=\"State icon\" [fontIcon]=\"uncheckIcon()\" />\r\n            }\r\n        </div>\r\n    </th>\r\n    <td mat-cell *matCellDef=\"let row\">\r\n        <div>\r\n            <cauca-icon-button (buttonClick)=\"commandClick.emit(row)\" [icon]=\"row[prop()] ? checkIcon() : uncheckIcon()\" [color]=\"row[prop()] ? checkColor() : uncheckColor()\" />\r\n        </div>\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}td{width:50px;min-width:50px;padding-left:0;padding-right:0}td>div{display:flex;justify-content:center}th{padding-left:23px;padding-right:0;width:70px;min-width:70px}\n"] }]
+            args: [{ selector: 'cauca-data-grid-command-icon-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandIconColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatSortHeader, MatHeaderCellDef, MatIcon, MatCell, MatCellDef, IconButtonComponent, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell mat-sort-header *matHeaderCellDef>\n        <div>\n            @if (label()) {\n                {{ label() }}\n            } @else {\n                <mat-icon [style.color]=\"uncheckColor()\" aria-hidden=\"false\" aria-label=\"State icon\" [fontIcon]=\"uncheckIcon()\" />\n            }\n        </div>\n    </th>\n    <td mat-cell *matCellDef=\"let row\">\n        <div>\n            <cauca-icon-button (buttonClick)=\"commandClick.emit(row)\" [icon]=\"row[prop()] ? checkIcon() : uncheckIcon()\" [color]=\"row[prop()] ? checkColor() : uncheckColor()\" />\n        </div>\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}td{width:50px;min-width:50px;padding-left:0;padding-right:0}td>div{display:flex;justify-content:center}th{padding-left:23px;padding-right:0;width:70px;min-width:70px}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1537,11 +1546,11 @@ class DataGridCommandsColumnComponent extends BaseGridColumnComponent {
         this.duplicateClick = output();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridCommandsColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridCommandsColumnComponent, isStandalone: true, selector: "cauca-data-grid-commands-column", inputs: { canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDuplicate: { classPropertyName: "canDuplicate", publicName: "canDuplicate", isSignal: true, isRequired: false, transformFunction: null }, editLinkField: { classPropertyName: "editLinkField", publicName: "editLinkField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { deleteClick: "deleteClick", editClick: "editClick", duplicateClick: "duplicateClick" }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandsColumnComponent) }], queries: [{ propertyName: "menuTemplate", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"buttons\">\r\n  <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\"> {{ label() }} </th>\r\n  <td mat-cell *matCellDef=\"let row\">\r\n\r\n      <div class=\"align-commands\">\r\n\r\n        @if (canEdit()) { <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"edit\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" /> }\r\n\r\n        @if (canDuplicate()) { <cauca-icon-button color=\"grey\" icon=\"content_copy\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" /> }\r\n\r\n        @if (canDelete()) { <cauca-icon-button colorOnHover=\"var(--warn)\" color=\"grey\" icon=\"close\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" /> }\r\n\r\n        <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\r\n\r\n      </div>\r\n\r\n  </td>\r\n  <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-buttons{width:128px}.align-commands{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconButtonComponent, selector: "cauca-icon-button" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridCommandsColumnComponent, isStandalone: true, selector: "cauca-data-grid-commands-column", inputs: { canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDuplicate: { classPropertyName: "canDuplicate", publicName: "canDuplicate", isSignal: true, isRequired: false, transformFunction: null }, editLinkField: { classPropertyName: "editLinkField", publicName: "editLinkField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { deleteClick: "deleteClick", editClick: "editClick", duplicateClick: "duplicateClick" }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandsColumnComponent) }], queries: [{ propertyName: "menuTemplate", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"buttons\">\n  <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\"> {{ label() }} </th>\n  <td mat-cell *matCellDef=\"let row\">\n\n      <div class=\"align-commands\">\n\n        @if (canEdit()) { <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"edit\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" /> }\n\n        @if (canDuplicate()) { <cauca-icon-button color=\"grey\" icon=\"content_copy\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" /> }\n\n        @if (canDelete()) { <cauca-icon-button colorOnHover=\"var(--warn)\" color=\"grey\" icon=\"close\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" /> }\n\n        <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\n\n      </div>\n\n  </td>\n  <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-buttons{width:128px}.align-commands{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconButtonComponent, selector: "cauca-icon-button" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridCommandsColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-commands-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandsColumnComponent) }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, MatCell, MatCellDef, IconButtonComponent, NgTemplateOutlet, MatFooterCell, MatFooterCellDef, NgStyle, RouterLink], template: "<ng-container matColumnDef=\"buttons\">\r\n  <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\"> {{ label() }} </th>\r\n  <td mat-cell *matCellDef=\"let row\">\r\n\r\n      <div class=\"align-commands\">\r\n\r\n        @if (canEdit()) { <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"edit\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" /> }\r\n\r\n        @if (canDuplicate()) { <cauca-icon-button color=\"grey\" icon=\"content_copy\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" /> }\r\n\r\n        @if (canDelete()) { <cauca-icon-button colorOnHover=\"var(--warn)\" color=\"grey\" icon=\"close\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" /> }\r\n\r\n        <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\r\n\r\n      </div>\r\n\r\n  </td>\r\n  <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-buttons{width:128px}.align-commands{display:flex;align-items:center}\n"] }]
+            args: [{ selector: 'cauca-data-grid-commands-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridCommandsColumnComponent) }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, MatCell, MatCellDef, IconButtonComponent, NgTemplateOutlet, MatFooterCell, MatFooterCellDef, NgStyle, RouterLink], template: "<ng-container matColumnDef=\"buttons\">\n  <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{'width': width()}\"> {{ label() }} </th>\n  <td mat-cell *matCellDef=\"let row\">\n\n      <div class=\"align-commands\">\n\n        @if (canEdit()) { <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"edit\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" /> }\n\n        @if (canDuplicate()) { <cauca-icon-button color=\"grey\" icon=\"content_copy\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" /> }\n\n        @if (canDelete()) { <cauca-icon-button colorOnHover=\"var(--warn)\" color=\"grey\" icon=\"close\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" /> }\n\n        <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\n\n      </div>\n\n  </td>\n  <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-buttons{width:128px}.align-commands{display:flex;align-items:center}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1564,11 +1573,11 @@ class DataGridIconColumnComponent extends BaseGridColumnComponent {
         ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridIconColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridIconColumnComponent, isStandalone: true, selector: "cauca-data-grid-icon-column", inputs: { alignRight: { classPropertyName: "alignRight", publicName: "alignRight", isSignal: true, isRequired: false, transformFunction: null }, useMatIcon: { classPropertyName: "useMatIcon", publicName: "useMatIcon", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridIconColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef> {{ showLabel() ? label() ?? capitalize(prop()) : '' }} </th>\r\n    <td [ngClass]=\"alignRight() ? 'td-right' : ''\" mat-cell *matCellDef=\"let row\">\r\n        @if (useMatIcon()) { <mat-icon>{{icon()}}</mat-icon> }\r\n        @else { <cauca-icon [icon]=\"row[prop()]\" /> }\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:180px;min-width:50px;padding:14px;text-align:center}.td-right{text-align:right}cauca-icon{font-size:32px}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconComponent, selector: "cauca-icon", inputs: ["icon"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridIconColumnComponent, isStandalone: true, selector: "cauca-data-grid-icon-column", inputs: { alignRight: { classPropertyName: "alignRight", publicName: "alignRight", isSignal: true, isRequired: false, transformFunction: null }, useMatIcon: { classPropertyName: "useMatIcon", publicName: "useMatIcon", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridIconColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef> {{ showLabel() ? label() ?? capitalize(prop()) : '' }} </th>\n    <td [ngClass]=\"alignRight() ? 'td-right' : ''\" mat-cell *matCellDef=\"let row\">\n        @if (useMatIcon()) { <mat-icon>{{icon()}}</mat-icon> }\n        @else { <cauca-icon [icon]=\"row[prop()]\" /> }\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:180px;min-width:50px;padding:14px;text-align:center}.td-right{text-align:right}cauca-icon{font-size:32px}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconComponent, selector: "cauca-icon", inputs: ["icon"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridIconColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-data-grid-icon-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridIconColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, MatCell, MatCellDef, IconComponent, MatFooterCell, MatFooterCellDef, NgClass, MatIcon], template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef> {{ showLabel() ? label() ?? capitalize(prop()) : '' }} </th>\r\n    <td [ngClass]=\"alignRight() ? 'td-right' : ''\" mat-cell *matCellDef=\"let row\">\r\n        @if (useMatIcon()) { <mat-icon>{{icon()}}</mat-icon> }\r\n        @else { <cauca-icon [icon]=\"row[prop()]\" /> }\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:180px;min-width:50px;padding:14px;text-align:center}.td-right{text-align:right}cauca-icon{font-size:32px}\n"] }]
+            args: [{ selector: 'cauca-data-grid-icon-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridIconColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, MatCell, MatCellDef, IconComponent, MatFooterCell, MatFooterCellDef, NgClass, MatIcon], template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef> {{ showLabel() ? label() ?? capitalize(prop()) : '' }} </th>\n    <td [ngClass]=\"alignRight() ? 'td-right' : ''\" mat-cell *matCellDef=\"let row\">\n        @if (useMatIcon()) { <mat-icon>{{icon()}}</mat-icon> }\n        @else { <cauca-icon [icon]=\"row[prop()]\" /> }\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th,td{width:180px;min-width:50px;padding:14px;text-align:center}.td-right{text-align:right}cauca-icon{font-size:32px}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1609,7 +1618,7 @@ class DataGridMenuColumnComponent extends BaseGridColumnComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridMenuColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridMenuColumnComponent, isStandalone: true, selector: "cauca-data-grid-menu-column", inputs: { canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null }, canDeleteByRow: { classPropertyName: "canDeleteByRow", publicName: "canDeleteByRow", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDuplicate: { classPropertyName: "canDuplicate", publicName: "canDuplicate", isSignal: true, isRequired: false, transformFunction: null }, canDuplicateByRow: { classPropertyName: "canDuplicateByRow", publicName: "canDuplicateByRow", isSignal: true, isRequired: false, transformFunction: null }, editLinkField: { classPropertyName: "editLinkField", publicName: "editLinkField", isSignal: true, isRequired: false, transformFunction: null }, duplicateLinkField: { classPropertyName: "duplicateLinkField", publicName: "duplicateLinkField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { canDelete: "canDeleteChange", canDuplicate: "canDuplicateChange", deleteClick: "deleteClick", editClick: "editClick", duplicateClick: "duplicateClick" }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridMenuColumnComponent) }], queries: [{ propertyName: "menuTemplate", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"menu\">\r\n    <th mat-header-cell *matHeaderCellDef> {{ label() }} </th>\r\n    <td mat-cell *matCellDef=\"let row\">\r\n    <div class=\"align-commands\">\r\n\r\n        <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"more_horiz\" [matMenuTriggerFor]=\"actionMenu\" (menuOpened)=\"menuOpened(row)\" />\r\n\r\n        <mat-menu #actionMenu=\"matMenu\" class=\"grid-menu\">\r\n            @if (canEdit()) {\r\n                <cauca-menu-item colorOnHover=\"var(--primary)\" icon=\"edit\" label=\"edit\" [translateLabel]=\"true\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" />\r\n            }\r\n\r\n            @if (canDuplicate()) {\r\n                <cauca-menu-item icon=\"content_copy\" label=\"duplicate\" [translateLabel]=\"true\" [routerLink]=\"duplicateLinkField() ? [row[duplicateLinkField()]] : null\" [queryParams]=\"{ duplicate: true }\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" />\r\n            }\r\n\r\n            @if (canDelete()) {\r\n                <cauca-menu-item colorOnHover=\"var(--warn)\" icon=\"close\" label=\"delete\" [translateLabel]=\"true\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" />\r\n            }\r\n            <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\r\n\r\n        </mat-menu>\r\n\r\n        </div>\r\n\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-menu{width:80px}.align-commands{display:flex;align-items:center}.grid-menu{max-width:none}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconButtonComponent, selector: "cauca-icon-button" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MenuItemComponent, selector: "cauca-menu-item", inputs: ["translateLabel", "trigger"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: DataGridMenuColumnComponent, isStandalone: true, selector: "cauca-data-grid-menu-column", inputs: { canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null }, canDeleteByRow: { classPropertyName: "canDeleteByRow", publicName: "canDeleteByRow", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDuplicate: { classPropertyName: "canDuplicate", publicName: "canDuplicate", isSignal: true, isRequired: false, transformFunction: null }, canDuplicateByRow: { classPropertyName: "canDuplicateByRow", publicName: "canDuplicateByRow", isSignal: true, isRequired: false, transformFunction: null }, editLinkField: { classPropertyName: "editLinkField", publicName: "editLinkField", isSignal: true, isRequired: false, transformFunction: null }, duplicateLinkField: { classPropertyName: "duplicateLinkField", publicName: "duplicateLinkField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { canDelete: "canDeleteChange", canDuplicate: "canDuplicateChange", deleteClick: "deleteClick", editClick: "editClick", duplicateClick: "duplicateClick" }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DataGridMenuColumnComponent) }], queries: [{ propertyName: "menuTemplate", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"menu\">\n    <th mat-header-cell *matHeaderCellDef> {{ label() }} </th>\n    <td mat-cell *matCellDef=\"let row\">\n    <div class=\"align-commands\">\n\n        <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"more_horiz\" [matMenuTriggerFor]=\"actionMenu\" (menuOpened)=\"menuOpened(row)\" />\n\n        <mat-menu #actionMenu=\"matMenu\" class=\"grid-menu\">\n            @if (canEdit()) {\n                <cauca-menu-item colorOnHover=\"var(--primary)\" icon=\"edit\" label=\"edit\" [translateLabel]=\"true\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" />\n            }\n\n            @if (canDuplicate()) {\n                <cauca-menu-item icon=\"content_copy\" label=\"duplicate\" [translateLabel]=\"true\" [routerLink]=\"duplicateLinkField() ? [row[duplicateLinkField()]] : null\" [queryParams]=\"{ duplicate: true }\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" />\n            }\n\n            @if (canDelete()) {\n                <cauca-menu-item colorOnHover=\"var(--warn)\" icon=\"close\" label=\"delete\" [translateLabel]=\"true\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" />\n            }\n            <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\n\n        </mat-menu>\n\n        </div>\n\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-menu{width:80px}.align-commands{display:flex;align-items:center}.grid-menu{max-width:none}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: IconButtonComponent, selector: "cauca-icon-button" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MenuItemComponent, selector: "cauca-menu-item", inputs: ["translateLabel", "trigger"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DataGridMenuColumnComponent, decorators: [{
             type: Component,
@@ -1626,7 +1635,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                         MatFooterCell,
                         MatFooterCellDef,
                         RouterLink
-                    ], template: "<ng-container matColumnDef=\"menu\">\r\n    <th mat-header-cell *matHeaderCellDef> {{ label() }} </th>\r\n    <td mat-cell *matCellDef=\"let row\">\r\n    <div class=\"align-commands\">\r\n\r\n        <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"more_horiz\" [matMenuTriggerFor]=\"actionMenu\" (menuOpened)=\"menuOpened(row)\" />\r\n\r\n        <mat-menu #actionMenu=\"matMenu\" class=\"grid-menu\">\r\n            @if (canEdit()) {\r\n                <cauca-menu-item colorOnHover=\"var(--primary)\" icon=\"edit\" label=\"edit\" [translateLabel]=\"true\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" />\r\n            }\r\n\r\n            @if (canDuplicate()) {\r\n                <cauca-menu-item icon=\"content_copy\" label=\"duplicate\" [translateLabel]=\"true\" [routerLink]=\"duplicateLinkField() ? [row[duplicateLinkField()]] : null\" [queryParams]=\"{ duplicate: true }\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" />\r\n            }\r\n\r\n            @if (canDelete()) {\r\n                <cauca-menu-item colorOnHover=\"var(--warn)\" icon=\"close\" label=\"delete\" [translateLabel]=\"true\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" />\r\n            }\r\n            <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\r\n\r\n        </mat-menu>\r\n\r\n        </div>\r\n\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-menu{width:80px}.align-commands{display:flex;align-items:center}.grid-menu{max-width:none}\n"] }]
+                    ], template: "<ng-container matColumnDef=\"menu\">\n    <th mat-header-cell *matHeaderCellDef> {{ label() }} </th>\n    <td mat-cell *matCellDef=\"let row\">\n    <div class=\"align-commands\">\n\n        <cauca-icon-button colorOnHover=\"var(--primary)\" color=\"grey\" icon=\"more_horiz\" [matMenuTriggerFor]=\"actionMenu\" (menuOpened)=\"menuOpened(row)\" />\n\n        <mat-menu #actionMenu=\"matMenu\" class=\"grid-menu\">\n            @if (canEdit()) {\n                <cauca-menu-item colorOnHover=\"var(--primary)\" icon=\"edit\" label=\"edit\" [translateLabel]=\"true\" [routerLink]=\"editLinkField() ? [row[editLinkField()]] : null\" (buttonClick)=\"editClick?.emit(row)\" class=\"edit-button\" />\n            }\n\n            @if (canDuplicate()) {\n                <cauca-menu-item icon=\"content_copy\" label=\"duplicate\" [translateLabel]=\"true\" [routerLink]=\"duplicateLinkField() ? [row[duplicateLinkField()]] : null\" [queryParams]=\"{ duplicate: true }\" (buttonClick)=\"duplicateClick?.emit(row)\" class=\"duplicate-button\" />\n            }\n\n            @if (canDelete()) {\n                <cauca-menu-item colorOnHover=\"var(--warn)\" icon=\"close\" label=\"delete\" [translateLabel]=\"true\" (buttonClick)=\"deleteClick?.emit(row)\" class=\"delete-button\" />\n            }\n            <template [ngTemplateOutlet]=\"menuTemplate\" [ngTemplateOutletContext]=\"{row:row}\"></template>\n\n        </mat-menu>\n\n        </div>\n\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}.mat-column-menu{width:80px}.align-commands{display:flex;align-items:center}.grid-menu{max-width:none}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1697,7 +1706,7 @@ class DateGridColumnComponent extends BaseGridColumnComponent {
         return resolveDisplayDate(row?.[this.prop()], this.minDate(), this.maxDate());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DateGridColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: DateGridColumnComponent, isStandalone: true, selector: "cauca-date-grid-column", inputs: { showWithTime: { classPropertyName: "showWithTime", publicName: "showWithTime", isSignal: true, isRequired: false, transformFunction: null }, showSecond: { classPropertyName: "showSecond", publicName: "showSecond", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DateGridColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header [ngStyle]=\"{'width': width()}\">\r\n      {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n\r\n    <td mat-cell *matCellDef=\"let row\">\r\n      <cauca-time-label [date]=\"row[prop()]\" [showTime]=\"showWithTime()\" [showSecond]=\"showSecond()\" [minLimit]=\"minDate()\" [maxLimit]=\"maxDate()\" />\r\n    </td>\r\n\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>\r\n\r\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: TimeLabelComponent, selector: "cauca-time-label", inputs: ["date", "minLimit", "maxLimit", "showTime", "showSecond"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: DateGridColumnComponent, isStandalone: true, selector: "cauca-date-grid-column", inputs: { showWithTime: { classPropertyName: "showWithTime", publicName: "showWithTime", isSignal: true, isRequired: false, transformFunction: null }, showSecond: { classPropertyName: "showSecond", publicName: "showSecond", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => DateGridColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\n\n    <th mat-header-cell *matHeaderCellDef mat-sort-header [ngStyle]=\"{'width': width()}\">\n      {{ label() ?? capitalize(prop()) }}\n    </th>\n\n    <td mat-cell *matCellDef=\"let row\">\n      <cauca-time-label [date]=\"row[prop()]\" [showTime]=\"showWithTime()\" [showSecond]=\"showSecond()\" [minLimit]=\"minDate()\" [maxLimit]=\"maxDate()\" />\n    </td>\n\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>\n\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: TimeLabelComponent, selector: "cauca-time-label", inputs: ["date", "minLimit", "maxLimit", "showTime", "showSecond"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DateGridColumnComponent, decorators: [{
             type: Component,
@@ -1707,7 +1716,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                         MatCell, MatCellDef,
                         TimeLabelComponent,
                         MatFooterCell, MatFooterCellDef,
-                    ], template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n\r\n    <th mat-header-cell *matHeaderCellDef mat-sort-header [ngStyle]=\"{'width': width()}\">\r\n      {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n\r\n    <td mat-cell *matCellDef=\"let row\">\r\n      <cauca-time-label [date]=\"row[prop()]\" [showTime]=\"showWithTime()\" [showSecond]=\"showSecond()\" [minLimit]=\"minDate()\" [maxLimit]=\"maxDate()\" />\r\n    </td>\r\n\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>\r\n\r\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+                    ], template: "<ng-container matColumnDef=\"{{ prop() }}\">\n\n    <th mat-header-cell *matHeaderCellDef mat-sort-header [ngStyle]=\"{'width': width()}\">\n      {{ label() ?? capitalize(prop()) }}\n    </th>\n\n    <td mat-cell *matCellDef=\"let row\">\n      <cauca-time-label [date]=\"row[prop()]\" [showTime]=\"showWithTime()\" [showSecond]=\"showSecond()\" [minLimit]=\"minDate()\" [maxLimit]=\"maxDate()\" />\n    </td>\n\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>\n\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1727,11 +1736,11 @@ class SortableDataGridCheckColumnComponent extends BaseGridColumnComponent {
         ...(ngDevMode ? [{ debugName: "sortProp" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: SortableDataGridCheckColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: SortableDataGridCheckColumnComponent, isStandalone: true, selector: "cauca-sortable-data-grid-check-column", inputs: { checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null }, sortProp: { classPropertyName: "sortProp", publicName: "sortProp", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => SortableDataGridCheckColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\" [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\r\n        {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n    <td mat-cell *matCellDef=\"let row\" [ngStyle]=\"{'width': width()}\">\r\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\" [isChecked]=\"row[prop()]\" />\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}::ng-deep .mat-column-isVisible>div,::ng-deep .mat-column-isRecurrent>div{justify-content:center}cauca-check-icon{display:flex;margin-right:18px;justify-content:center}th,td{width:120px;min-width:120px;text-align:center}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: CheckIconComponent, selector: "cauca-check-icon", inputs: ["checkIcon", "uncheckIcon", "isChecked"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.0", type: SortableDataGridCheckColumnComponent, isStandalone: true, selector: "cauca-sortable-data-grid-check-column", inputs: { checkIcon: { classPropertyName: "checkIcon", publicName: "checkIcon", isSignal: true, isRequired: false, transformFunction: null }, uncheckIcon: { classPropertyName: "uncheckIcon", publicName: "uncheckIcon", isSignal: true, isRequired: false, transformFunction: null }, sortProp: { classPropertyName: "sortProp", publicName: "sortProp", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => SortableDataGridCheckColumnComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\" [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\n        {{ label() ?? capitalize(prop()) }}\n    </th>\n    <td mat-cell *matCellDef=\"let row\" [ngStyle]=\"{'width': width()}\">\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\" [isChecked]=\"row[prop()]\" />\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}::ng-deep .mat-column-isVisible>div,::ng-deep .mat-column-isRecurrent>div{justify-content:center}cauca-check-icon{display:flex;margin-right:18px;justify-content:center}th,td{width:120px;min-width:120px;text-align:center}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "component", type: CheckIconComponent, selector: "cauca-check-icon", inputs: ["checkIcon", "uncheckIcon", "isChecked"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: SortableDataGridCheckColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cauca-sortable-data-grid-check-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => SortableDataGridCheckColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, MatSortHeader, NgStyle, MatTooltip, MatCell, MatCellDef, CheckIconComponent, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\" [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\r\n        {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n    <td mat-cell *matCellDef=\"let row\" [ngStyle]=\"{'width': width()}\">\r\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\" [isChecked]=\"row[prop()]\" />\r\n    </td>\r\n    <td mat-footer-cell *matFooterCellDef></td>\r\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}::ng-deep .mat-column-isVisible>div,::ng-deep .mat-column-isRecurrent>div{justify-content:center}cauca-check-icon{display:flex;margin-right:18px;justify-content:center}th,td{width:120px;min-width:120px;text-align:center}\n"] }]
+            args: [{ selector: 'cauca-sortable-data-grid-check-column', providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => SortableDataGridCheckColumnComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatColumnDef, MatHeaderCell, MatHeaderCellDef, MatSortHeader, NgStyle, MatTooltip, MatCell, MatCellDef, CheckIconComponent, MatFooterCell, MatFooterCellDef], template: "<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\" [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\n        {{ label() ?? capitalize(prop()) }}\n    </th>\n    <td mat-cell *matCellDef=\"let row\" [ngStyle]=\"{'width': width()}\">\n        <cauca-check-icon [checkIcon]=\"checkIcon()\" [uncheckIcon]=\"uncheckIcon()\" [isChecked]=\"row[prop()]\" />\n    </td>\n    <td mat-footer-cell *matFooterCellDef></td>\n</ng-container>", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}::ng-deep .mat-column-isVisible>div,::ng-deep .mat-column-isRecurrent>div{justify-content:center}cauca-check-icon{display:flex;margin-right:18px;justify-content:center}th,td{width:120px;min-width:120px;text-align:center}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{
@@ -1794,7 +1803,7 @@ class SortableDataGridColumnComponent extends BaseGridColumnComponent {
         return '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: SortableDataGridColumnComponent, deps: [{ token: OdataGridComponent, optional: true }, { token: DataGridComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: SortableDataGridColumnComponent, isStandalone: true, selector: "cauca-sortable-data-grid-column", inputs: { summaryType: { classPropertyName: "summaryType", publicName: "summaryType", isSignal: true, isRequired: false, transformFunction: null }, summaryLabel: { classPropertyName: "summaryLabel", publicName: "summaryLabel", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, sortProp: { classPropertyName: "sortProp", publicName: "sortProp", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => SortableDataGridColumnComponent) }], usesInheritance: true, ngImport: i0, template: "\r\n<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\"  [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\r\n      {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n\r\n    <td mat-cell *matCellDef=\"let row\">\r\n      <cauca-column-label [value]=\"row[prop()]\" [showToolTip]=\"showToolTip()\" [format]=\"format()\" />\r\n    </td>\r\n\r\n    <td mat-footer-cell *matFooterCellDef>\r\n      @if (isInitialized) {\r\n        {{calculateSummary()}}\r\n      }\r\n    </td>\r\n</ng-container>\r\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-mdc-footer-cell{font-weight:700}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ColumnLabelComponent, selector: "cauca-column-label", inputs: ["value", "format", "showToolTip"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.0", type: SortableDataGridColumnComponent, isStandalone: true, selector: "cauca-sortable-data-grid-column", inputs: { summaryType: { classPropertyName: "summaryType", publicName: "summaryType", isSignal: true, isRequired: false, transformFunction: null }, summaryLabel: { classPropertyName: "summaryLabel", publicName: "summaryLabel", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, sortProp: { classPropertyName: "sortProp", publicName: "sortProp", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: BaseGridColumnComponent, useExisting: forwardRef(() => SortableDataGridColumnComponent) }], usesInheritance: true, ngImport: i0, template: "\n<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\"  [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\n      {{ label() ?? capitalize(prop()) }}\n    </th>\n\n    <td mat-cell *matCellDef=\"let row\">\n      <cauca-column-label [value]=\"row[prop()]\" [showToolTip]=\"showToolTip()\" [format]=\"format()\" />\n    </td>\n\n    <td mat-footer-cell *matFooterCellDef>\n      @if (isInitialized) {\n        {{calculateSummary()}}\n      }\n    </td>\n</ng-container>\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-mdc-footer-cell{font-weight:700}\n"], dependencies: [{ kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ColumnLabelComponent, selector: "cauca-column-label", inputs: ["value", "format", "showToolTip"] }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: SortableDataGridColumnComponent, decorators: [{
             type: Component,
@@ -1804,7 +1813,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                         MatCell, MatCellDef,
                         MatTooltip, ColumnLabelComponent,
                         MatFooterCell, MatFooterCellDef,
-                    ], template: "\r\n<ng-container matColumnDef=\"{{ prop() }}\">\r\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\"  [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\r\n      {{ label() ?? capitalize(prop()) }}\r\n    </th>\r\n\r\n    <td mat-cell *matCellDef=\"let row\">\r\n      <cauca-column-label [value]=\"row[prop()]\" [showToolTip]=\"showToolTip()\" [format]=\"format()\" />\r\n    </td>\r\n\r\n    <td mat-footer-cell *matFooterCellDef>\r\n      @if (isInitialized) {\r\n        {{calculateSummary()}}\r\n      }\r\n    </td>\r\n</ng-container>\r\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-mdc-footer-cell{font-weight:700}\n"] }]
+                    ], template: "\n<ng-container matColumnDef=\"{{ prop() }}\">\n    <th mat-header-cell *matHeaderCellDef [mat-sort-header]=\"sortProp() || prop()\"  [ngStyle]=\"{'width': width()}\" [matTooltip]=\"label() ?? capitalize(prop())\">\n      {{ label() ?? capitalize(prop()) }}\n    </th>\n\n    <td mat-cell *matCellDef=\"let row\">\n      <cauca-column-label [value]=\"row[prop()]\" [showToolTip]=\"showToolTip()\" [format]=\"format()\" />\n    </td>\n\n    <td mat-footer-cell *matFooterCellDef>\n      @if (isInitialized) {\n        {{calculateSummary()}}\n      }\n    </td>\n</ng-container>\n", styles: ["th.mat-mdc-header-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}th,td{overflow:hidden;width:auto;text-overflow:ellipsis;white-space:nowrap}th.mat-mdc-header-cell .mat-sort-header-container{min-width:0}th.mat-mdc-header-cell .mat-sort-header-content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-mdc-footer-cell{font-weight:700}\n"] }]
         }], ctorParameters: () => [{ type: OdataGridComponent, decorators: [{
                     type: Optional
                 }] }, { type: DataGridComponent, decorators: [{