coer-elements 2.0.80 → 2.0.82

package/components/lib/coer-datebox/coer-datebox.component.d.ts

@@ -22,7 +22,7 @@ export declare class CoerDateBox extends ControlValue implements AfterViewInit,
     value: import("@angular/core").InputSignal<string | Date | null | undefined>;
     label: import("@angular/core").InputSignal<string>;
     placeholder: import("@angular/core").InputSignal<string>;
-    textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
+    textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
     isWritable: import("@angular/core").InputSignal<boolean>;
     isInvalid: import("@angular/core").InputSignal<boolean>;
     isValid: import("@angular/core").InputSignal<boolean>;

package/components/lib/coer-grid/coer-grid.extension.d.ts

@@ -1,11 +1,11 @@
 import { IGridButtonByRow, IGridColumn, IGridImport, IGridHeaderButton, IGridHeaderExportButton, IGridKeyupEnter, IGridSearch, IGridInput, IGridCheckbox, IGridInputCheckbox, IGridHeaderImportButton, IGridDataSource, IGridHeader, IGridFooter } from "coer-elements/interfaces";
-import { AfterViewInit } from "@angular/core";
+import { AfterContentChecked, AfterViewInit } from "@angular/core";
 import { ControlValue } from 'coer-elements/tools';
 import { CoerGridHeader } from "./coer-grid-header/coer-grid-header.component";
 import { CoerGridBody } from "./coer-grid-body/coer-grid-body.component";
 import { CoerGridfooter } from "./coer-grid-footer/coer-grid-footer.component";
 import * as i0 from "@angular/core";
-export declare class CoerGridExtension<T> extends ControlValue implements AfterViewInit {
+export declare class CoerGridExtension<T> extends ControlValue implements AfterViewInit, AfterContentChecked {
     protected readonly _coerGridHeader: import("@angular/core").Signal<CoerGridHeader<T> | undefined>;
     protected readonly _coerGridBody: import("@angular/core").Signal<CoerGridBody<T> | undefined>;
     protected readonly _coerGridFooter: import("@angular/core").Signal<CoerGridfooter<T> | undefined>;
@@ -16,6 +16,7 @@ export declare class CoerGridExtension<T> extends ControlValue implements AfterV
     protected readonly _id: string;
     protected readonly _searchInner: import("@angular/core").WritableSignal<string | number>;
     protected readonly _isLoadingInner: import("@angular/core").WritableSignal<boolean>;
+    protected _height: string;
     columns: import("@angular/core").InputSignal<IGridColumn<T>[]>;
     cleanColumnName: import("@angular/core").InputSignal<boolean>;
     search: IGridSearch;
@@ -62,8 +63,10 @@ export declare class CoerGridExtension<T> extends ControlValue implements AfterV
     protected onNumberboxChange: import("@angular/core").OutputEmitterRef<IGridInput<T>>;
     protected onSelectboxChange: import("@angular/core").OutputEmitterRef<IGridInput<T>>;
     ngAfterViewInit(): void;
+    ngAfterContentChecked(): void;
     SetValue(value: T[]): void;
-    writeValue(value: T[]): void;
+    /** */
+    protected _SetHeight(): void;
     protected _SetValueInput(row: IGridInput<T>, input: 'coer-switch' | 'coer-textbox' | 'coer-numberbox' | 'coer-selectbox'): void;
     protected _columns: import("@angular/core").Signal<IGridHeader<T>[]>;
     /** */
@@ -81,7 +84,6 @@ export declare class CoerGridExtension<T> extends ControlValue implements AfterV
     protected _Import(value: IGridImport<T>): void;
     /** */
     protected _buildRow<T>(data: any): T;
-    protected get _height(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<CoerGridExtension<any>, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CoerGridExtension<any>, "coer-grid-extension", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "cleanColumnName": { "alias": "cleanColumnName"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; }; "exportButton": { "alias": "exportButton"; "required": false; }; "importButton": { "alias": "importButton"; "required": false; }; "addButton": { "alias": "addButton"; "required": false; }; "saveButton": { "alias": "saveButton"; "required": false; }; "checkbox": { "alias": "checkbox"; "required": false; }; "buttonByRow": { "alias": "buttonByRow"; "required": false; }; "footer": { "alias": "footer"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "isReadonly": { "alias": "isReadonly"; "required": false; "isSignal": true; }; "isInvisible": { "alias": "isInvisible"; "required": false; "isSignal": true; }; "rowsByPage": { "alias": "rowsByPage"; "required": false; "isSignal": true; }; "tooltipByRow": { "alias": "tooltipByRow"; "required": false; "isSignal": true; }; "enableSort": { "alias": "enableSort"; "required": false; "isSignal": true; }; "enableFocusNext": { "alias": "enableFocusNext"; "required": false; "isSignal": true; }; "enableFocusRow": { "alias": "enableFocusRow"; "required": false; "isSignal": true; }; "enableHoverRow": { "alias": "enableHoverRow"; "required": false; "isSignal": true; }; "isStriped": { "alias": "isStriped"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "MinWidth": { "alias": "MinWidth"; "required": false; "isSignal": true; }; "MaxWidth": { "alias": "MaxWidth"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "margin": { "alias": "margin"; "required": false; "isSignal": true; }; }, { "onClickExport": "onClickExport"; "onClickImport": "onClickImport"; "onClickAdd": "onClickAdd"; "onClickSave": "onClickSave"; "onClickRow": "onClickRow"; "onDoubleClickRow": "onDoubleClickRow"; "onCheckboxChange": "onCheckboxChange"; "onClickDeleteRow": "onClickDeleteRow"; "onClickEditRow": "onClickEditRow"; "onClickModalRow": "onClickModalRow"; "onClickGoRow": "onClickGoRow"; "onKeyupEnter": "onKeyupEnter"; "onKeyupEnterLast": "onKeyupEnterLast"; "onSwitchChange": "onSwitchChange"; "onTextboxChange": "onTextboxChange"; "onNumberboxChange": "onNumberboxChange"; "onSelectboxChange": "onSelectboxChange"; }, never, never, true, never>;
 }

package/components/lib/coer-modal/coer-modal.component.d.ts

@@ -16,7 +16,7 @@ export declare class CoerModal implements AfterViewInit {
     width: import("@angular/core").InputSignal<"auto" | "small" | "full">;
     height: import("@angular/core").InputSignal<string>;
     maxHeight: import("@angular/core").InputSignal<string>;
-    verticalPosition: import("@angular/core").InputSignal<"top" | "bottom" | "middle">;
+    verticalPosition: import("@angular/core").InputSignal<"top" | "middle" | "bottom">;
     onOpen: import("@angular/core").OutputEmitterRef<void>;
     onClose: import("@angular/core").OutputEmitterRef<void>;
     protected IsNull: (value: any) => boolean;

package/components/lib/coer-numberbox/coer-numberbox.component.d.ts

@@ -16,7 +16,7 @@ export declare class CoerNumberBox extends ControlValue implements AfterViewInit
     value: import("@angular/core").InputSignal<string | number | null | undefined>;
     label: import("@angular/core").InputSignal<string>;
     placeholder: import("@angular/core").InputSignal<string>;
-    textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
+    textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
     min: import("@angular/core").InputSignal<number>;
     max: import("@angular/core").InputSignal<number>;
     isInvalid: import("@angular/core").InputSignal<boolean>;

package/components/lib/coer-secretbox/coer-secretbox.component.d.ts

@@ -17,7 +17,7 @@ export declare class CoerSecretBox extends ControlValue implements AfterViewInit
     value: import("@angular/core").InputSignal<string | number | null | undefined>;
     label: import("@angular/core").InputSignal<string>;
     placeholder: import("@angular/core").InputSignal<string>;
-    textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
+    textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
     minLength: import("@angular/core").InputSignal<string | number>;
     maxLength: import("@angular/core").InputSignal<string | number>;
     isInvalid: import("@angular/core").InputSignal<boolean>;

package/components/lib/coer-textarea/coer-textarea.component.d.ts

@@ -12,7 +12,7 @@ export declare class CoerTextarea extends ControlValue implements AfterViewInit,
     value: import("@angular/core").InputSignal<string | number | null | undefined>;
     label: import("@angular/core").InputSignal<string>;
     placeholder: import("@angular/core").InputSignal<string>;
-    textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
+    textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
     minLength: import("@angular/core").InputSignal<string | number>;
     maxLength: import("@angular/core").InputSignal<string | number>;
     isInvalid: import("@angular/core").InputSignal<boolean>;

package/components/lib/coer-textbox/coer-textbox.component.d.ts

@@ -16,7 +16,7 @@ export declare class CoerTextBox extends ControlValue implements AfterViewInit,
     value: import("@angular/core").InputSignal<string | number | null | undefined>;
     label: import("@angular/core").InputSignal<string>;
     placeholder: import("@angular/core").InputSignal<string>;
-    textPosition: import("@angular/core").InputSignal<"left" | "right" | "center">;
+    textPosition: import("@angular/core").InputSignal<"left" | "center" | "right">;
     minLength: import("@angular/core").InputSignal<string | number>;
     maxLength: import("@angular/core").InputSignal<string | number>;
     isInvalid: import("@angular/core").InputSignal<boolean>;

package/extensions/lib/array.extension.d.ts

@@ -1,9 +1,9 @@
 declare global {
     interface Array<T> {
         /** */
-        Distinct(): T[];
+        distinct(): T[];
         /** */
-        Except(exceptions: T[]): T[];
+        except(exceptions: T[]): T[];
     }
 }
 export {};

package/extensions/lib/date.extension.d.ts

@@ -0,0 +1,61 @@
+declare global {
+    interface Date {
+        /** */
+        getOffset(): number;
+        /** */
+        getLastDay(): number;
+        /** */
+        isValidDate(): boolean;
+        /** */
+        getCurrentDate(): Date;
+        /** Convert UTC Date to Local Zone */
+        toLocalZone(): Date;
+        /** Convert Local Zone Date to UTC */
+        toUTC(): Date;
+        /** YYYY-MM-DD HH:mm:ss */
+        toFormatDB(): string;
+        /** */
+        toFormatDate(format?: 'MDY' | 'DMY' | 'YMD'): string;
+        /** */
+        toFormatDateTime(ampm?: boolean, format?: 'MDY' | 'DMY' | 'YMD'): string;
+        /** */
+        addMilliseconds(milliseconds: number): Date;
+        /** */
+        addSeconds(seconds: number): Date;
+        /** */
+        addMinutes(minutes: number): Date;
+        /** */
+        addHours(hours: number): Date;
+        /** */
+        addDays(days: number): Date;
+        /** */
+        addWeeks(weeks: number): Date;
+        /** */
+        addMonths(months: number): Date;
+        /** */
+        addYears(years: number): Date;
+        /** */
+        setMillisecond(millisecond?: number): Date;
+        /** */
+        setSecond(second?: number): Date;
+        /** */
+        setMinute(minute?: number): Date;
+        /** */
+        setHour(hour?: number): Date;
+        /** */
+        setFirstHour(): Date;
+        /** */
+        setLastHour(): Date;
+        /** */
+        setDay(day?: number): Date;
+        /** */
+        setFirstDay(): Date;
+        /** */
+        setLastDay(): Date;
+        /** */
+        getDiffNow(unit?: 'milliseconds' | 'seconds' | 'minutes' | 'hours' | 'days'): number;
+        /** */
+        getDiff(date: string | Date, unit?: 'milliseconds' | 'seconds' | 'minutes' | 'hours' | 'days'): number;
+    }
+}
+export {};

package/extensions/lib/string.extension.d.ts

@@ -8,6 +8,8 @@ declare global {
         cleanUpBlanks(): string;
         /** Apply title formatting */
         toTitle(): string;
+        /** Remove whitespaces */
+        removeWhiteSpaces(): string;
         /** Removes the last character */
         removeLastChar(): string;
         /** Removes accents */

package/extensions/public-api.d.ts

@@ -1,3 +1,4 @@
 import './lib/array.extension';
+import './lib/date.extension';
 import './lib/object.extension';
 import './lib/string.extension';

package/fesm2022/coer-elements-components.mjs

@@ -415,7 +415,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImpor
 
 class DATE_ADAPTER extends NativeDateAdapter {
     format(date) {
-        return Dates.GetFormatDate(date);
+        return Dates.ToFormatDate(date);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: DATE_ADAPTER, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: DATE_ADAPTER }); }
@@ -585,7 +585,7 @@ class CoerDateBox extends ControlValue {
     //ControlValueAccessor
     SetValue(value) {
         this._value = Tools.IsNotOnlyWhiteSpace(value) && Dates.IsValidDate(value)
-            ? Dates.GetFormatDB(value) : null;
+            ? Dates.ToFormatDB(value) : null;
         if (typeof this._UpdateValue === 'function') {
             this._UpdateValue(this._value);
             this.onChangeValue.emit(this._value);
@@ -1091,6 +1091,7 @@ class CoerGridExtension extends ControlValue {
         this._id = Tools.GetGuid('coer-grid');
         this._searchInner = signal('');
         this._isLoadingInner = signal(true);
+        this._height = '0px';
         // protected _expandedGroups: string[] = [];   
         //Inputs
         this.columns = input([]);
@@ -1237,6 +1238,10 @@ class CoerGridExtension extends ControlValue {
             this._isLoadingInner.set(false);
         });
     }
+    //AfterViewChecked
+    ngAfterContentChecked() {
+        this._SetHeight();
+    }
     //ControlValueAccessor
     SetValue(value) {
         if (Tools.IsNull(value))
@@ -1247,9 +1252,17 @@ class CoerGridExtension extends ControlValue {
         }
         this._valueSignal.set(this._value);
     }
-    //ControlValueAccessor
-    writeValue(value) {
-        this.SetValue(value);
+    /** */
+    _SetHeight() {
+        this._height = (this.height() == 'full')
+            ? (Screen.WINDOW_HEIGHT - (45 //Toolbar
+                + 15
+                + (this._coerGridHeader()?.heigth || 0)
+                + (this._coerGridFooter()?.heigth || 0)
+                + HTMLElements.GetOffsetTop(this._grid)
+                + Number(HTMLElements.GetCssValue(this._gridGrandFather, 'padding-top').split('px')[0])
+                + Number(HTMLElements.GetCssValue(this._gridGrandFather, 'padding-bottom').split('px')[0]))) + 'px'
+            : this.height();
     }
     //ControlValueAccessor
     _SetValueInput(row, input) {
@@ -1297,17 +1310,6 @@ class CoerGridExtension extends ControlValue {
         }
         return { ...row };
     }
-    //getter
-    get _height() {
-        return (this.height() == 'full')
-            ? (Screen.WINDOW_HEIGHT - (45 //Toolbar
-                + (this._coerGridHeader()?.heigth || 0)
-                + (this._coerGridFooter()?.heigth || 0)
-                + HTMLElements.GetOffsetTop(this._grid)
-                + Number(HTMLElements.GetCssValue(this._gridGrandFather, 'padding-top').split('px')[0])
-                + Number(HTMLElements.GetCssValue(this._gridGrandFather, 'padding-bottom').split('px')[0]))) + 'px'
-            : this.height();
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerGridExtension, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.1", type: CoerGridExtension, isStandalone: true, selector: "coer-grid-extension", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, cleanColumnName: { classPropertyName: "cleanColumnName", publicName: "cleanColumnName", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: false, isRequired: false, transformFunction: null }, exportButton: { classPropertyName: "exportButton", publicName: "exportButton", isSignal: false, isRequired: false, transformFunction: null }, importButton: { classPropertyName: "importButton", publicName: "importButton", isSignal: false, isRequired: false, transformFunction: null }, addButton: { classPropertyName: "addButton", publicName: "addButton", isSignal: false, isRequired: false, transformFunction: null }, saveButton: { classPropertyName: "saveButton", publicName: "saveButton", isSignal: false, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: false, isRequired: false, transformFunction: null }, buttonByRow: { classPropertyName: "buttonByRow", publicName: "buttonByRow", isSignal: false, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: false, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, rowsByPage: { classPropertyName: "rowsByPage", publicName: "rowsByPage", isSignal: true, isRequired: false, transformFunction: null }, tooltipByRow: { classPropertyName: "tooltipByRow", publicName: "tooltipByRow", isSignal: true, isRequired: false, transformFunction: null }, enableSort: { classPropertyName: "enableSort", publicName: "enableSort", isSignal: true, isRequired: false, transformFunction: null }, enableFocusNext: { classPropertyName: "enableFocusNext", publicName: "enableFocusNext", isSignal: true, isRequired: false, transformFunction: null }, enableFocusRow: { classPropertyName: "enableFocusRow", publicName: "enableFocusRow", isSignal: true, isRequired: false, transformFunction: null }, enableHoverRow: { classPropertyName: "enableHoverRow", publicName: "enableHoverRow", isSignal: true, isRequired: false, transformFunction: null }, isStriped: { classPropertyName: "isStriped", publicName: "isStriped", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, MinWidth: { classPropertyName: "MinWidth", publicName: "MinWidth", isSignal: true, isRequired: false, transformFunction: null }, MaxWidth: { classPropertyName: "MaxWidth", publicName: "MaxWidth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, margin: { classPropertyName: "margin", publicName: "margin", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClickExport: "onClickExport", onClickImport: "onClickImport", onClickAdd: "onClickAdd", onClickSave: "onClickSave", onClickRow: "onClickRow", onDoubleClickRow: "onDoubleClickRow", onCheckboxChange: "onCheckboxChange", onClickDeleteRow: "onClickDeleteRow", onClickEditRow: "onClickEditRow", onClickModalRow: "onClickModalRow", onClickGoRow: "onClickGoRow", onKeyupEnter: "onKeyupEnter", onKeyupEnterLast: "onKeyupEnterLast", onSwitchChange: "onSwitchChange", onTextboxChange: "onTextboxChange", onNumberboxChange: "onNumberboxChange", onSelectboxChange: "onSelectboxChange" }, viewQueries: [{ propertyName: "_coerGridHeader", first: true, predicate: ["coerGridHeader"], descendants: true, isSignal: true }, { propertyName: "_coerGridBody", first: true, predicate: ["coerGridBody"], descendants: true, isSignal: true }, { propertyName: "_coerGridFooter", first: true, predicate: ["coerGridFooter"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
@@ -1660,7 +1662,7 @@ class CoerGridHeader {
         };
     }
     ngAfterViewInit() {
-        Tools.Sleep(1000).then(_ => {
+        Tools.Sleep().then(_ => {
             this._header = HTMLElements.GetElement(`#${this.GetIdCalculated()(-1, -1, 'header')}`);
             this._headerSlots = HTMLElements.GetElement(`#${this.GetIdCalculated()(-1, -1, 'header-slots')}`);
             this._headerButtons = HTMLElements.GetElement(`#${this.GetIdCalculated()(-1, -1, 'header-buttons')}`);
@@ -2538,7 +2540,7 @@ class CoerGridCell {
                             property: this.header()?.config?.property,
                             row: { ...this.row() },
                             value: this.row()[Strings.FirstCharToLower(this.header().property)]
-                        }) ? Dates.GetFormatDateTime(response) : response;
+                        }) ? Dates.ToFormatDateTime(response) : response;
                 }
                 if (Tools.IsNotNull(this.header().config?.typeDate)) {
                     response = (typeof this.header()?.config?.typeDate === 'boolean' && this.header()?.config?.typeDate === true) ||
@@ -2547,7 +2549,7 @@ class CoerGridCell {
                             property: this.header()?.config?.property,
                             row: { ...this.row() },
                             value: this.row()[Strings.FirstCharToLower(this.header().property)]
-                        }) ? Dates.GetFormatDate(response) : response;
+                        }) ? Dates.ToFormatDate(response) : response;
                 }
                 return response;
             }
@@ -3186,11 +3188,11 @@ class CoerGridBody {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerGridBody, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerGridBody, isStandalone: false, selector: "coer-grid-body", inputs: { GetIdCalculated: { classPropertyName: "GetIdCalculated", publicName: "GetIdCalculated", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataSourceSelected: { classPropertyName: "dataSourceSelected", publicName: "dataSourceSelected", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, searchInner: { classPropertyName: "searchInner", publicName: "searchInner", isSignal: true, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: true, isRequired: false, transformFunction: null }, buttonByRow: { classPropertyName: "buttonByRow", publicName: "buttonByRow", isSignal: true, isRequired: false, transformFunction: null }, isLoadingInner: { classPropertyName: "isLoadingInner", publicName: "isLoadingInner", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, isEnabled: { classPropertyName: "isEnabled", publicName: "isEnabled", isSignal: true, isRequired: false, transformFunction: null }, enableSort: { classPropertyName: "enableSort", publicName: "enableSort", isSignal: true, isRequired: false, transformFunction: null }, enableFocusNext: { classPropertyName: "enableFocusNext", publicName: "enableFocusNext", isSignal: true, isRequired: false, transformFunction: null }, enableFocusRow: { classPropertyName: "enableFocusRow", publicName: "enableFocusRow", isSignal: true, isRequired: false, transformFunction: null }, enableHoverRow: { classPropertyName: "enableHoverRow", publicName: "enableHoverRow", isSignal: true, isRequired: false, transformFunction: null }, isStriped: { classPropertyName: "isStriped", publicName: "isStriped", isSignal: true, isRequired: false, transformFunction: null }, tooltipByRow: { classPropertyName: "tooltipByRow", publicName: "tooltipByRow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange", onClickRow: "onClickRow", onDoubleClickRow: "onDoubleClickRow", onInnerLoadingChange: "onInnerLoadingChange", onCheckboxChange: "onCheckboxChange", onClickDeleteRow: "onClickDeleteRow", onClickEditRow: "onClickEditRow", onClickModalRow: "onClickModalRow", onClickGoRow: "onClickGoRow", onSwitchChange: "onSwitchChange", onTextboxChange: "onTextboxChange", onNumberboxChange: "onNumberboxChange", onSelectboxChange: "onSelectboxChange", onKeyupEnter: "onKeyupEnter", onKeyupEnterLast: "onKeyupEnterLast" }, viewQueries: [{ propertyName: "_coerCheckboxList", predicate: CoerCheckbox, descendants: true, isSignal: true }, { propertyName: "_coerGridCellList", predicate: (CoerGridCell), descendants: true, isSignal: true }], ngImport: i0, template: "<section class=\"coer-grid-body\">\r\n    <table [ngClass]=\"{ \r\n        'table'   : true,\r\n        'table-sm': true, \r\n        'table-responsive': true,\r\n        'table-striped'   : isStriped()\r\n        }\">\r\n        \r\n        <thead>\r\n            <tr>\r\n                <!-- Checkbox All -->\r\n                @if(_showCheckbox()) {\r\n                    <th class=\"action-column\" scope=\"col\">    \r\n                        <div class=\"action-column-content\">\r\n                            <div [ngClass]=\"{ 'display-none': _isInvisibleCheckboxAll }\">\r\n                                <coer-checkbox\r\n                                    [id]=\"GetIdCalculated()(-1, -1, 'checkbox-all')\"\r\n                                    [ignoreDataBinding]=\"true\"   \r\n                                    (onChange)=\"_ClickCheckAll($event)\"\r\n                                ></coer-checkbox>\r\n                            </div> \r\n    \r\n                            <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                            </div>   \r\n                        </div>\r\n                    </th>\r\n                }\r\n\r\n                @if(_ShowButtonByRow('showModalButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                } \r\n    \r\n                <!-- Dynamic Grid Column -->\r\n                @for(header of columns(); track header.indexColumn) {\r\n                    <th scope=\"col\" [class]=\"_cursorHeader()\" (dblclick)=\"_SortToggle(header.property)\" [ngStyle]=\"{ 'width': header.config?.width || 'auto' }\">                        \r\n                        <div class=\"th-content\">\r\n                            <span> {{ header.columnName }} </span>\r\n                            <i [class]=\"_IconShortHeader(header.property)\"></i>\r\n                            <i [class]=\"_IconSearchHeader(header.property)\"></i>\r\n                        </div>\r\n                    </th>\r\n                }\r\n                    \r\n                @if(_ShowButtonByRow('showDeleteButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n                   \r\n                @if(_ShowButtonByRow('showEditButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }   \r\n                \r\n                @if(_ShowButtonByRow('showGoButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n            </tr>\r\n        </thead>\r\n    \r\n        <!-- body -->\r\n        @for(group of dataSource(); track group.indexGroup) {\r\n            <tbody>     \r\n                @for(row of group.rows; track row.indexRow) {\r\n                    <tr [id]=\"GetIdCalculated()(row.indexRow, 0, 'row')\" \r\n                        (click)=\"_focusRowIndex.set(row.indexRow)\"\r\n                        [ngClass]=\"{ \r\n                            'loading'  : isLoading(),\r\n                            'row-focus': (row.indexRow == _focusRowIndex() && enableFocusRow()),\r\n                            'row-hover-none': !enableHoverRow()\r\n                        }\">\r\n    \r\n                        <!-- CheckBox Column -->\r\n                        @if(_showCheckbox()) {\r\n                            <td class=\"action-column\">\r\n                                <div class=\"action-column-content\">\r\n                                    <div [ngClass]=\"{ 'display-none': _isLoadingInner }\">\r\n                                        <coer-checkbox\r\n                                            [id]=\"GetIdCalculated()(row.indexRow, 0, 'checkbox')\"\r\n                                            [ignoreDataBinding]=\"true\"\r\n                                            [isDisabled]=\"!isEnabled()\"\r\n                                            (onChange)=\"_ClickCheck($event, row)\"\r\n                                        ></coer-checkbox>\r\n                                    </div>\r\n    \r\n                                    <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                        <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                                    </div>\r\n                                </div>\r\n                            </td>\r\n                        }\r\n\r\n                        <!-- Modal Button -->\r\n                        @if(_ShowButtonByRow('showModalButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showModalButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorModal()\"\r\n                                            icon=\"icon-modal icon-fill\"\r\n                                            [tooltip]=\"_GetTooltip('Open', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickModalRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Dynamic Column -->\r\n                        @for(header of columns(); track header.indexColumn) {\r\n                            <td class=\"td-content\">\r\n                                <coer-grid-cell\r\n                                    [id]=\"GetIdCalculated()(row.indexRow, header.indexColumn)\"\r\n                                    [header]=\"header\"\r\n                                    [row]=\"row\"\r\n                                    [checkOnRow]=\"_checkOnRow()\"\r\n                                    [enableInputs]=\"isEnabled() && !_isLoadingInner\"\r\n                                    (onClickRow)=\"isEnabled() ? _ClickOnRow(row) : null\"\r\n                                    (onDoubleClickRow)=\"isEnabled() ? onDoubleClickRow.emit(row) : null\"\r\n                                    (onSwitchChange)=\"onSwitchChange.emit($event)\"\r\n                                    (onTextboxChange)=\"onTextboxChange.emit($event)\"\r\n                                    (onNumberboxChange)=\"onNumberboxChange.emit($event)\"\r\n                                    (onSelectboxChange)=\"onSelectboxChange.emit($event)\"\r\n                                    (onKeyupEnter)=\"_NextInput(row.indexRow, header.indexColumn, $event)\"\r\n                                ></coer-grid-cell>\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Delete Button -->\r\n                        @if(_ShowButtonByRow('showDeleteButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showDeleteButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorDelete()\"\r\n                                            icon=\"delete\"\r\n                                            [tooltip]=\"_GetTooltip('Delete', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isReadonly]=\"isReadonly()\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickDeleteRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Edit Button -->\r\n                        @if(_ShowButtonByRow('showEditButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showEditButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorEdit()\"\r\n                                            icon=\"edit\"\r\n                                            [tooltip]=\"_GetTooltip('Edit', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickEditRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        } \r\n    \r\n                        <!-- Go Button -->\r\n                        @if(_ShowButtonByRow('showGoButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showGoButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorGo()\"\r\n                                            icon=\"go\"\r\n                                            [tooltip]=\"_GetTooltip('Go to', row, 'detail')\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickGoRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n                    </tr>\r\n                }\r\n            </tbody>\r\n        }\r\n    </table> \r\n</section>", styles: ["section.coer-grid-body table{table-layout:auto;border-collapse:separate;border-spacing:1px 0px;margin:0;font-size:14px}section.coer-grid-body table thead tr th{position:sticky!important;top:0!important;z-index:100!important;vertical-align:middle!important;background-color:var(--gray)!important;color:var(--smoke)!important;overflow:hidden;white-space:nowrap!important;word-wrap:break-word;text-overflow:ellipsis;min-width:30px!important;max-height:30px!important;height:30px!important}section.coer-grid-body table thead tr th div.th-content{display:flex!important;align-items:center!important}section.coer-grid-body table thead tr th div.th-content::selection{background-color:transparent!important}section.coer-grid-body table tbody tr td{border:0px!important;white-space:break-spaces!important;text-overflow:ellipsis!important;overflow:hidden!important;min-height:30px!important;background-color:inherit!important}section.coer-grid-body table tbody tr td.td-content{padding:0!important;vertical-align:middle!important;overflow:visible!important}section.coer-grid-body table tbody tr:not(.row-focus):not(.row-hover-none):hover td{color:#000!important;background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 95%)!important}section.coer-grid-body table tbody tr.row-focus td{background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 65%)!important}section.coer-grid-body table th.action-column,section.coer-grid-body table td.action-column{width:30px!important;min-width:30px!important;max-width:30px!important;padding:0!important;overflow:hidden!important;vertical-align:middle!important}section.coer-grid-body table th.action-column div.action-column-content,section.coer-grid-body table td.action-column div.action-column-content{display:flex!important;align-items:center!important;justify-content:center!important;max-height:30px!important;height:30px!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "typeBreakpoint", "icon", "iconPosition", "path", "isLoading", "isDisabled", "isReadonly", "isInvisible", "isHidde", "width", "widthBreakpoint", "minWidth", "maxWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "tooltip", "tooltipPosition"], outputs: ["onClick"] }, { kind: "component", type: CoerCheckbox, selector: "coer-checkbox", inputs: ["id", "label", "labelPosition", "isLoading", "isDisabled", "isReadonly", "isInvisible", "ignoreDataBinding", "value"], outputs: ["onChange"] }, { kind: "component", type: CoerGridCell, selector: "coer-grid-cell", inputs: ["id", "header", "row", "checkOnRow", "enableInputs"], outputs: ["onClickRow", "onDoubleClickRow", "onSwitchChange", "onTextboxChange", "onNumberboxChange", "onSelectboxChange", "onKeyupEnter"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerGridBody, isStandalone: false, selector: "coer-grid-body", inputs: { GetIdCalculated: { classPropertyName: "GetIdCalculated", publicName: "GetIdCalculated", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataSourceSelected: { classPropertyName: "dataSourceSelected", publicName: "dataSourceSelected", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, searchInner: { classPropertyName: "searchInner", publicName: "searchInner", isSignal: true, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: true, isRequired: false, transformFunction: null }, buttonByRow: { classPropertyName: "buttonByRow", publicName: "buttonByRow", isSignal: true, isRequired: false, transformFunction: null }, isLoadingInner: { classPropertyName: "isLoadingInner", publicName: "isLoadingInner", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, isEnabled: { classPropertyName: "isEnabled", publicName: "isEnabled", isSignal: true, isRequired: false, transformFunction: null }, enableSort: { classPropertyName: "enableSort", publicName: "enableSort", isSignal: true, isRequired: false, transformFunction: null }, enableFocusNext: { classPropertyName: "enableFocusNext", publicName: "enableFocusNext", isSignal: true, isRequired: false, transformFunction: null }, enableFocusRow: { classPropertyName: "enableFocusRow", publicName: "enableFocusRow", isSignal: true, isRequired: false, transformFunction: null }, enableHoverRow: { classPropertyName: "enableHoverRow", publicName: "enableHoverRow", isSignal: true, isRequired: false, transformFunction: null }, isStriped: { classPropertyName: "isStriped", publicName: "isStriped", isSignal: true, isRequired: false, transformFunction: null }, tooltipByRow: { classPropertyName: "tooltipByRow", publicName: "tooltipByRow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange", onClickRow: "onClickRow", onDoubleClickRow: "onDoubleClickRow", onInnerLoadingChange: "onInnerLoadingChange", onCheckboxChange: "onCheckboxChange", onClickDeleteRow: "onClickDeleteRow", onClickEditRow: "onClickEditRow", onClickModalRow: "onClickModalRow", onClickGoRow: "onClickGoRow", onSwitchChange: "onSwitchChange", onTextboxChange: "onTextboxChange", onNumberboxChange: "onNumberboxChange", onSelectboxChange: "onSelectboxChange", onKeyupEnter: "onKeyupEnter", onKeyupEnterLast: "onKeyupEnterLast" }, viewQueries: [{ propertyName: "_coerCheckboxList", predicate: CoerCheckbox, descendants: true, isSignal: true }, { propertyName: "_coerGridCellList", predicate: (CoerGridCell), descendants: true, isSignal: true }], ngImport: i0, template: "<section class=\"coer-grid-body\">\r\n    <table [ngClass]=\"{ \r\n        'table'   : true,\r\n        'table-sm': true, \r\n        'table-responsive': true,\r\n        'table-striped'   : isStriped()\r\n        }\">\r\n        \r\n        <thead>\r\n            <tr>\r\n                <!-- Checkbox All -->\r\n                @if(_showCheckbox()) {\r\n                    <th class=\"action-column\" scope=\"col\">    \r\n                        <div class=\"action-column-content\">\r\n                            <div [ngClass]=\"{ 'display-none': _isInvisibleCheckboxAll }\">\r\n                                <coer-checkbox\r\n                                    [id]=\"GetIdCalculated()(-1, -1, 'checkbox-all')\"\r\n                                    [ignoreDataBinding]=\"true\"   \r\n                                    (onChange)=\"_ClickCheckAll($event)\"\r\n                                ></coer-checkbox>\r\n                            </div> \r\n    \r\n                            <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                            </div>   \r\n                        </div>\r\n                    </th>\r\n                }\r\n\r\n                @if(_ShowButtonByRow('showModalButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                } \r\n    \r\n                <!-- Dynamic Grid Column -->\r\n                @for(header of columns(); track header.indexColumn) {\r\n                    <th scope=\"col\" [class]=\"_cursorHeader()\" (dblclick)=\"_SortToggle(header.property)\" [ngStyle]=\"{ 'width': header.config?.width || 'auto' }\">                        \r\n                        <div class=\"th-content\">\r\n                            <span> {{ header.columnName }} </span>\r\n                            <i [class]=\"_IconShortHeader(header.property)\"></i>\r\n                            <i [class]=\"_IconSearchHeader(header.property)\"></i>\r\n                        </div>\r\n                    </th>\r\n                }\r\n                    \r\n                @if(_ShowButtonByRow('showDeleteButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n                   \r\n                @if(_ShowButtonByRow('showEditButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }   \r\n                \r\n                @if(_ShowButtonByRow('showGoButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n            </tr>\r\n        </thead>\r\n    \r\n        <!-- body -->\r\n        @for(group of dataSource(); track group.indexGroup) {\r\n            <tbody>     \r\n                @for(row of group.rows; track row.indexRow) {\r\n                    <tr [id]=\"GetIdCalculated()(row.indexRow, 0, 'row')\" \r\n                        (click)=\"_focusRowIndex.set(row.indexRow)\"\r\n                        [ngClass]=\"{ \r\n                            'loading'  : isLoading(),\r\n                            'row-focus': (row.indexRow == _focusRowIndex() && enableFocusRow()),\r\n                            'row-hover-none': !enableHoverRow()\r\n                        }\">\r\n    \r\n                        <!-- CheckBox Column -->\r\n                        @if(_showCheckbox()) {\r\n                            <td class=\"action-column\">\r\n                                <div class=\"action-column-content\">\r\n                                    <div [ngClass]=\"{ 'display-none': _isLoadingInner }\">\r\n                                        <coer-checkbox\r\n                                            [id]=\"GetIdCalculated()(row.indexRow, 0, 'checkbox')\"\r\n                                            [ignoreDataBinding]=\"true\"\r\n                                            [isDisabled]=\"!isEnabled()\"\r\n                                            (onChange)=\"_ClickCheck($event, row)\"\r\n                                        ></coer-checkbox>\r\n                                    </div>\r\n    \r\n                                    <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                        <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                                    </div>\r\n                                </div>\r\n                            </td>\r\n                        }\r\n\r\n                        <!-- Modal Button -->\r\n                        @if(_ShowButtonByRow('showModalButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showModalButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorModal()\"\r\n                                            icon=\"icon-modal icon-fill\"\r\n                                            [tooltip]=\"_GetTooltip('Open', row)\" \r\n                                            tooltipPosition=\"right\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickModalRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Dynamic Column -->\r\n                        @for(header of columns(); track header.indexColumn) {\r\n                            <td class=\"td-content\">\r\n                                <coer-grid-cell\r\n                                    [id]=\"GetIdCalculated()(row.indexRow, header.indexColumn)\"\r\n                                    [header]=\"header\"\r\n                                    [row]=\"row\"\r\n                                    [checkOnRow]=\"_checkOnRow()\"\r\n                                    [enableInputs]=\"isEnabled() && !_isLoadingInner\"\r\n                                    (onClickRow)=\"isEnabled() ? _ClickOnRow(row) : null\"\r\n                                    (onDoubleClickRow)=\"isEnabled() ? onDoubleClickRow.emit(row) : null\"\r\n                                    (onSwitchChange)=\"onSwitchChange.emit($event)\"\r\n                                    (onTextboxChange)=\"onTextboxChange.emit($event)\"\r\n                                    (onNumberboxChange)=\"onNumberboxChange.emit($event)\"\r\n                                    (onSelectboxChange)=\"onSelectboxChange.emit($event)\"\r\n                                    (onKeyupEnter)=\"_NextInput(row.indexRow, header.indexColumn, $event)\"\r\n                                ></coer-grid-cell>\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Delete Button -->\r\n                        @if(_ShowButtonByRow('showDeleteButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showDeleteButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorDelete()\"\r\n                                            icon=\"delete\"\r\n                                            [tooltip]=\"_GetTooltip('Delete', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isReadonly]=\"isReadonly()\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickDeleteRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Edit Button -->\r\n                        @if(_ShowButtonByRow('showEditButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showEditButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorEdit()\"\r\n                                            icon=\"edit\"\r\n                                            [tooltip]=\"_GetTooltip('Edit', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickEditRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        } \r\n    \r\n                        <!-- Go Button -->\r\n                        @if(_ShowButtonByRow('showGoButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showGoButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorGo()\"\r\n                                            icon=\"go\"\r\n                                            [tooltip]=\"_GetTooltip('Go to', row, 'detail')\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickGoRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n                    </tr>\r\n                }\r\n            </tbody>\r\n        }\r\n    </table> \r\n</section>", styles: ["section.coer-grid-body table{table-layout:auto;border-collapse:separate;border-spacing:1px 0px;margin:0;font-size:14px}section.coer-grid-body table thead tr th{position:sticky!important;top:0!important;z-index:100!important;vertical-align:middle!important;background-color:var(--gray)!important;color:var(--smoke)!important;overflow:hidden;white-space:nowrap!important;word-wrap:break-word;text-overflow:ellipsis;min-width:30px!important;max-height:30px!important;height:30px!important}section.coer-grid-body table thead tr th div.th-content{display:flex!important;align-items:center!important}section.coer-grid-body table thead tr th div.th-content::selection{background-color:transparent!important}section.coer-grid-body table tbody tr td{border:0px!important;white-space:break-spaces!important;text-overflow:ellipsis!important;overflow:hidden!important;min-height:30px!important;background-color:inherit!important}section.coer-grid-body table tbody tr td.td-content{padding:0!important;vertical-align:middle!important;overflow:visible!important}section.coer-grid-body table tbody tr:not(.row-focus):not(.row-hover-none):hover td{color:#000!important;background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 95%)!important}section.coer-grid-body table tbody tr.row-focus td{background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 65%)!important}section.coer-grid-body table th.action-column,section.coer-grid-body table td.action-column{width:30px!important;min-width:30px!important;max-width:30px!important;padding:0!important;overflow:hidden!important;vertical-align:middle!important}section.coer-grid-body table th.action-column div.action-column-content,section.coer-grid-body table td.action-column div.action-column-content{display:flex!important;align-items:center!important;justify-content:center!important;max-height:30px!important;height:30px!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "typeBreakpoint", "icon", "iconPosition", "path", "isLoading", "isDisabled", "isReadonly", "isInvisible", "isHidde", "width", "widthBreakpoint", "minWidth", "maxWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "tooltip", "tooltipPosition"], outputs: ["onClick"] }, { kind: "component", type: CoerCheckbox, selector: "coer-checkbox", inputs: ["id", "label", "labelPosition", "isLoading", "isDisabled", "isReadonly", "isInvisible", "ignoreDataBinding", "value"], outputs: ["onChange"] }, { kind: "component", type: CoerGridCell, selector: "coer-grid-cell", inputs: ["id", "header", "row", "checkOnRow", "enableInputs"], outputs: ["onClickRow", "onDoubleClickRow", "onSwitchChange", "onTextboxChange", "onNumberboxChange", "onSelectboxChange", "onKeyupEnter"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerGridBody, decorators: [{
             type: Component,
-            args: [{ selector: 'coer-grid-body', standalone: false, template: "<section class=\"coer-grid-body\">\r\n    <table [ngClass]=\"{ \r\n        'table'   : true,\r\n        'table-sm': true, \r\n        'table-responsive': true,\r\n        'table-striped'   : isStriped()\r\n        }\">\r\n        \r\n        <thead>\r\n            <tr>\r\n                <!-- Checkbox All -->\r\n                @if(_showCheckbox()) {\r\n                    <th class=\"action-column\" scope=\"col\">    \r\n                        <div class=\"action-column-content\">\r\n                            <div [ngClass]=\"{ 'display-none': _isInvisibleCheckboxAll }\">\r\n                                <coer-checkbox\r\n                                    [id]=\"GetIdCalculated()(-1, -1, 'checkbox-all')\"\r\n                                    [ignoreDataBinding]=\"true\"   \r\n                                    (onChange)=\"_ClickCheckAll($event)\"\r\n                                ></coer-checkbox>\r\n                            </div> \r\n    \r\n                            <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                            </div>   \r\n                        </div>\r\n                    </th>\r\n                }\r\n\r\n                @if(_ShowButtonByRow('showModalButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                } \r\n    \r\n                <!-- Dynamic Grid Column -->\r\n                @for(header of columns(); track header.indexColumn) {\r\n                    <th scope=\"col\" [class]=\"_cursorHeader()\" (dblclick)=\"_SortToggle(header.property)\" [ngStyle]=\"{ 'width': header.config?.width || 'auto' }\">                        \r\n                        <div class=\"th-content\">\r\n                            <span> {{ header.columnName }} </span>\r\n                            <i [class]=\"_IconShortHeader(header.property)\"></i>\r\n                            <i [class]=\"_IconSearchHeader(header.property)\"></i>\r\n                        </div>\r\n                    </th>\r\n                }\r\n                    \r\n                @if(_ShowButtonByRow('showDeleteButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n                   \r\n                @if(_ShowButtonByRow('showEditButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }   \r\n                \r\n                @if(_ShowButtonByRow('showGoButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n            </tr>\r\n        </thead>\r\n    \r\n        <!-- body -->\r\n        @for(group of dataSource(); track group.indexGroup) {\r\n            <tbody>     \r\n                @for(row of group.rows; track row.indexRow) {\r\n                    <tr [id]=\"GetIdCalculated()(row.indexRow, 0, 'row')\" \r\n                        (click)=\"_focusRowIndex.set(row.indexRow)\"\r\n                        [ngClass]=\"{ \r\n                            'loading'  : isLoading(),\r\n                            'row-focus': (row.indexRow == _focusRowIndex() && enableFocusRow()),\r\n                            'row-hover-none': !enableHoverRow()\r\n                        }\">\r\n    \r\n                        <!-- CheckBox Column -->\r\n                        @if(_showCheckbox()) {\r\n                            <td class=\"action-column\">\r\n                                <div class=\"action-column-content\">\r\n                                    <div [ngClass]=\"{ 'display-none': _isLoadingInner }\">\r\n                                        <coer-checkbox\r\n                                            [id]=\"GetIdCalculated()(row.indexRow, 0, 'checkbox')\"\r\n                                            [ignoreDataBinding]=\"true\"\r\n                                            [isDisabled]=\"!isEnabled()\"\r\n                                            (onChange)=\"_ClickCheck($event, row)\"\r\n                                        ></coer-checkbox>\r\n                                    </div>\r\n    \r\n                                    <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                        <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                                    </div>\r\n                                </div>\r\n                            </td>\r\n                        }\r\n\r\n                        <!-- Modal Button -->\r\n                        @if(_ShowButtonByRow('showModalButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showModalButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorModal()\"\r\n                                            icon=\"icon-modal icon-fill\"\r\n                                            [tooltip]=\"_GetTooltip('Open', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickModalRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Dynamic Column -->\r\n                        @for(header of columns(); track header.indexColumn) {\r\n                            <td class=\"td-content\">\r\n                                <coer-grid-cell\r\n                                    [id]=\"GetIdCalculated()(row.indexRow, header.indexColumn)\"\r\n                                    [header]=\"header\"\r\n                                    [row]=\"row\"\r\n                                    [checkOnRow]=\"_checkOnRow()\"\r\n                                    [enableInputs]=\"isEnabled() && !_isLoadingInner\"\r\n                                    (onClickRow)=\"isEnabled() ? _ClickOnRow(row) : null\"\r\n                                    (onDoubleClickRow)=\"isEnabled() ? onDoubleClickRow.emit(row) : null\"\r\n                                    (onSwitchChange)=\"onSwitchChange.emit($event)\"\r\n                                    (onTextboxChange)=\"onTextboxChange.emit($event)\"\r\n                                    (onNumberboxChange)=\"onNumberboxChange.emit($event)\"\r\n                                    (onSelectboxChange)=\"onSelectboxChange.emit($event)\"\r\n                                    (onKeyupEnter)=\"_NextInput(row.indexRow, header.indexColumn, $event)\"\r\n                                ></coer-grid-cell>\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Delete Button -->\r\n                        @if(_ShowButtonByRow('showDeleteButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showDeleteButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorDelete()\"\r\n                                            icon=\"delete\"\r\n                                            [tooltip]=\"_GetTooltip('Delete', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isReadonly]=\"isReadonly()\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickDeleteRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Edit Button -->\r\n                        @if(_ShowButtonByRow('showEditButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showEditButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorEdit()\"\r\n                                            icon=\"edit\"\r\n                                            [tooltip]=\"_GetTooltip('Edit', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickEditRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        } \r\n    \r\n                        <!-- Go Button -->\r\n                        @if(_ShowButtonByRow('showGoButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showGoButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorGo()\"\r\n                                            icon=\"go\"\r\n                                            [tooltip]=\"_GetTooltip('Go to', row, 'detail')\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickGoRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n                    </tr>\r\n                }\r\n            </tbody>\r\n        }\r\n    </table> \r\n</section>", styles: ["section.coer-grid-body table{table-layout:auto;border-collapse:separate;border-spacing:1px 0px;margin:0;font-size:14px}section.coer-grid-body table thead tr th{position:sticky!important;top:0!important;z-index:100!important;vertical-align:middle!important;background-color:var(--gray)!important;color:var(--smoke)!important;overflow:hidden;white-space:nowrap!important;word-wrap:break-word;text-overflow:ellipsis;min-width:30px!important;max-height:30px!important;height:30px!important}section.coer-grid-body table thead tr th div.th-content{display:flex!important;align-items:center!important}section.coer-grid-body table thead tr th div.th-content::selection{background-color:transparent!important}section.coer-grid-body table tbody tr td{border:0px!important;white-space:break-spaces!important;text-overflow:ellipsis!important;overflow:hidden!important;min-height:30px!important;background-color:inherit!important}section.coer-grid-body table tbody tr td.td-content{padding:0!important;vertical-align:middle!important;overflow:visible!important}section.coer-grid-body table tbody tr:not(.row-focus):not(.row-hover-none):hover td{color:#000!important;background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 95%)!important}section.coer-grid-body table tbody tr.row-focus td{background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 65%)!important}section.coer-grid-body table th.action-column,section.coer-grid-body table td.action-column{width:30px!important;min-width:30px!important;max-width:30px!important;padding:0!important;overflow:hidden!important;vertical-align:middle!important}section.coer-grid-body table th.action-column div.action-column-content,section.coer-grid-body table td.action-column div.action-column-content{display:flex!important;align-items:center!important;justify-content:center!important;max-height:30px!important;height:30px!important}\n"] }]
+            args: [{ selector: 'coer-grid-body', standalone: false, template: "<section class=\"coer-grid-body\">\r\n    <table [ngClass]=\"{ \r\n        'table'   : true,\r\n        'table-sm': true, \r\n        'table-responsive': true,\r\n        'table-striped'   : isStriped()\r\n        }\">\r\n        \r\n        <thead>\r\n            <tr>\r\n                <!-- Checkbox All -->\r\n                @if(_showCheckbox()) {\r\n                    <th class=\"action-column\" scope=\"col\">    \r\n                        <div class=\"action-column-content\">\r\n                            <div [ngClass]=\"{ 'display-none': _isInvisibleCheckboxAll }\">\r\n                                <coer-checkbox\r\n                                    [id]=\"GetIdCalculated()(-1, -1, 'checkbox-all')\"\r\n                                    [ignoreDataBinding]=\"true\"   \r\n                                    (onChange)=\"_ClickCheckAll($event)\"\r\n                                ></coer-checkbox>\r\n                            </div> \r\n    \r\n                            <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                            </div>   \r\n                        </div>\r\n                    </th>\r\n                }\r\n\r\n                @if(_ShowButtonByRow('showModalButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                } \r\n    \r\n                <!-- Dynamic Grid Column -->\r\n                @for(header of columns(); track header.indexColumn) {\r\n                    <th scope=\"col\" [class]=\"_cursorHeader()\" (dblclick)=\"_SortToggle(header.property)\" [ngStyle]=\"{ 'width': header.config?.width || 'auto' }\">                        \r\n                        <div class=\"th-content\">\r\n                            <span> {{ header.columnName }} </span>\r\n                            <i [class]=\"_IconShortHeader(header.property)\"></i>\r\n                            <i [class]=\"_IconSearchHeader(header.property)\"></i>\r\n                        </div>\r\n                    </th>\r\n                }\r\n                    \r\n                @if(_ShowButtonByRow('showDeleteButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n                   \r\n                @if(_ShowButtonByRow('showEditButton')) { \r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }   \r\n                \r\n                @if(_ShowButtonByRow('showGoButton')) {\r\n                    <th class=\"action-column\" scope=\"col\"></th>\r\n                }\r\n            </tr>\r\n        </thead>\r\n    \r\n        <!-- body -->\r\n        @for(group of dataSource(); track group.indexGroup) {\r\n            <tbody>     \r\n                @for(row of group.rows; track row.indexRow) {\r\n                    <tr [id]=\"GetIdCalculated()(row.indexRow, 0, 'row')\" \r\n                        (click)=\"_focusRowIndex.set(row.indexRow)\"\r\n                        [ngClass]=\"{ \r\n                            'loading'  : isLoading(),\r\n                            'row-focus': (row.indexRow == _focusRowIndex() && enableFocusRow()),\r\n                            'row-hover-none': !enableHoverRow()\r\n                        }\">\r\n    \r\n                        <!-- CheckBox Column -->\r\n                        @if(_showCheckbox()) {\r\n                            <td class=\"action-column\">\r\n                                <div class=\"action-column-content\">\r\n                                    <div [ngClass]=\"{ 'display-none': _isLoadingInner }\">\r\n                                        <coer-checkbox\r\n                                            [id]=\"GetIdCalculated()(row.indexRow, 0, 'checkbox')\"\r\n                                            [ignoreDataBinding]=\"true\"\r\n                                            [isDisabled]=\"!isEnabled()\"\r\n                                            (onChange)=\"_ClickCheck($event, row)\"\r\n                                        ></coer-checkbox>\r\n                                    </div>\r\n    \r\n                                    <div [class]=\"_isLoadingInner ? 'display-contents' : 'display-none'\">\r\n                                        <i class=\"icon-circle-notch animation-spin text-primary\"></i> \r\n                                    </div>\r\n                                </div>\r\n                            </td>\r\n                        }\r\n\r\n                        <!-- Modal Button -->\r\n                        @if(_ShowButtonByRow('showModalButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showModalButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorModal()\"\r\n                                            icon=\"icon-modal icon-fill\"\r\n                                            [tooltip]=\"_GetTooltip('Open', row)\" \r\n                                            tooltipPosition=\"right\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickModalRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Dynamic Column -->\r\n                        @for(header of columns(); track header.indexColumn) {\r\n                            <td class=\"td-content\">\r\n                                <coer-grid-cell\r\n                                    [id]=\"GetIdCalculated()(row.indexRow, header.indexColumn)\"\r\n                                    [header]=\"header\"\r\n                                    [row]=\"row\"\r\n                                    [checkOnRow]=\"_checkOnRow()\"\r\n                                    [enableInputs]=\"isEnabled() && !_isLoadingInner\"\r\n                                    (onClickRow)=\"isEnabled() ? _ClickOnRow(row) : null\"\r\n                                    (onDoubleClickRow)=\"isEnabled() ? onDoubleClickRow.emit(row) : null\"\r\n                                    (onSwitchChange)=\"onSwitchChange.emit($event)\"\r\n                                    (onTextboxChange)=\"onTextboxChange.emit($event)\"\r\n                                    (onNumberboxChange)=\"onNumberboxChange.emit($event)\"\r\n                                    (onSelectboxChange)=\"onSelectboxChange.emit($event)\"\r\n                                    (onKeyupEnter)=\"_NextInput(row.indexRow, header.indexColumn, $event)\"\r\n                                ></coer-grid-cell>\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Delete Button -->\r\n                        @if(_ShowButtonByRow('showDeleteButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showDeleteButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorDelete()\"\r\n                                            icon=\"delete\"\r\n                                            [tooltip]=\"_GetTooltip('Delete', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isReadonly]=\"isReadonly()\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickDeleteRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n    \r\n                        <!-- Edit Button -->\r\n                        @if(_ShowButtonByRow('showEditButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showEditButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorEdit()\"\r\n                                            icon=\"edit\"\r\n                                            [tooltip]=\"_GetTooltip('Edit', row)\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickEditRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        } \r\n    \r\n                        <!-- Go Button -->\r\n                        @if(_ShowButtonByRow('showGoButton')) {\r\n                            <td class=\"action-column\">\r\n                                @if(_ShowButtonByRow('showGoButton', row)) {\r\n                                    <div class=\"action-column-content\">\r\n                                        <coer-button\r\n                                            type=\"icon-no-border\"\r\n                                            [color]=\"_ButtonByRowColorGo()\"\r\n                                            icon=\"go\"\r\n                                            [tooltip]=\"_GetTooltip('Go to', row, 'detail')\" \r\n                                            tooltipPosition=\"left\"\r\n                                            [isDisabled]=\"_isLoadingInner\"\r\n                                            (onClick)=\"onClickGoRow.emit(row)\"\r\n                                        ></coer-button>\r\n                                    </div>\r\n                                }\r\n                            </td>\r\n                        }\r\n                    </tr>\r\n                }\r\n            </tbody>\r\n        }\r\n    </table> \r\n</section>", styles: ["section.coer-grid-body table{table-layout:auto;border-collapse:separate;border-spacing:1px 0px;margin:0;font-size:14px}section.coer-grid-body table thead tr th{position:sticky!important;top:0!important;z-index:100!important;vertical-align:middle!important;background-color:var(--gray)!important;color:var(--smoke)!important;overflow:hidden;white-space:nowrap!important;word-wrap:break-word;text-overflow:ellipsis;min-width:30px!important;max-height:30px!important;height:30px!important}section.coer-grid-body table thead tr th div.th-content{display:flex!important;align-items:center!important}section.coer-grid-body table thead tr th div.th-content::selection{background-color:transparent!important}section.coer-grid-body table tbody tr td{border:0px!important;white-space:break-spaces!important;text-overflow:ellipsis!important;overflow:hidden!important;min-height:30px!important;background-color:inherit!important}section.coer-grid-body table tbody tr td.td-content{padding:0!important;vertical-align:middle!important;overflow:visible!important}section.coer-grid-body table tbody tr:not(.row-focus):not(.row-hover-none):hover td{color:#000!important;background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 95%)!important}section.coer-grid-body table tbody tr.row-focus td{background-color:color-mix(in srgb,var(--inputs-items-inner),var(--white) 65%)!important}section.coer-grid-body table th.action-column,section.coer-grid-body table td.action-column{width:30px!important;min-width:30px!important;max-width:30px!important;padding:0!important;overflow:hidden!important;vertical-align:middle!important}section.coer-grid-body table th.action-column div.action-column-content,section.coer-grid-body table td.action-column div.action-column-content{display:flex!important;align-items:center!important;justify-content:center!important;max-height:30px!important;height:30px!important}\n"] }]
         }] });
 
 class CoerGridfooter {
@@ -3207,7 +3209,7 @@ class CoerGridfooter {
         this.isLoadingInner = input(true);
     }
     ngAfterViewInit() {
-        Tools.Sleep(1000).then(_ => {
+        Tools.Sleep().then(_ => {
             this._footer = HTMLElements.GetElement(`#${this.GetIdCalculated()(-1, -1, 'footer')}`);
         });
     }
@@ -3216,11 +3218,11 @@ class CoerGridfooter {
         return Number(HTMLElements.GetElementHeight(this._footer).split('px')[0]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerGridfooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerGridfooter, isStandalone: false, selector: "coer-grid-footer", inputs: { GetIdCalculated: { classPropertyName: "GetIdCalculated", publicName: "GetIdCalculated", isSignal: true, isRequired: true, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataSourceFiltered: { classPropertyName: "dataSourceFiltered", publicName: "dataSourceFiltered", isSignal: true, isRequired: false, transformFunction: null }, dataSourceSelected: { classPropertyName: "dataSourceSelected", publicName: "dataSourceSelected", isSignal: true, isRequired: false, transformFunction: null }, isLoadingInner: { classPropertyName: "isLoadingInner", publicName: "isLoadingInner", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if(footer().show) {\r\n    <footer [id]=\"GetIdCalculated()(-1, -1, 'footer')\" class=\"flex-middle-between padding-top-5px\">\r\n        <span>\r\n            @if(isLoadingInner()) {\r\n                <span class=\"animation-fade\"> Loading </span>\r\n            }\r\n\r\n            @else if(dataSourceSelected().length > 0) {\r\n                <span class=\"margin-left-5px text-gray\">\r\n                    <i class=\"bi bi-check2-square\"></i>\r\n                    {{ dataSourceSelected().length | numericFormat }}\r\n                </span>\r\n            }\r\n        </span>\r\n\r\n        @if(dataSource().length > 0) {\r\n            <span class=\"margin-right-5px text-gray\"> {{ dataSource().length | numericFormat }} Rows </span>\r\n        } \r\n    </footer>\r\n}", dependencies: [{ kind: "pipe", type: i5.NumericFormatPipe, name: "numericFormat" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerGridfooter, isStandalone: false, selector: "coer-grid-footer", inputs: { GetIdCalculated: { classPropertyName: "GetIdCalculated", publicName: "GetIdCalculated", isSignal: true, isRequired: true, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataSourceFiltered: { classPropertyName: "dataSourceFiltered", publicName: "dataSourceFiltered", isSignal: true, isRequired: false, transformFunction: null }, dataSourceSelected: { classPropertyName: "dataSourceSelected", publicName: "dataSourceSelected", isSignal: true, isRequired: false, transformFunction: null }, isLoadingInner: { classPropertyName: "isLoadingInner", publicName: "isLoadingInner", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if(footer().show) {\r\n    <footer [id]=\"GetIdCalculated()(-1, -1, 'footer')\" class=\"flex-middle-between padding-top-5px\">\r\n        <span>\r\n            @if(isLoadingInner()) {\r\n                <span class=\"animation-fade\"> Loading </span>\r\n            }\r\n\r\n            @else if(dataSourceSelected().length > 0) {\r\n                <span class=\"margin-left-5px text-gray\">\r\n                    <i class=\"bi bi-check2-square\"></i>\r\n                    {{ dataSourceSelected().length | numericFormat }}\r\n                </span>\r\n            }\r\n        </span>\r\n\r\n        @if(dataSource().length > 0) {\r\n            <span class=\"margin-right-5px text-gray\"> {{ dataSource().length | numericFormat }} Rows </span>\r\n        } \r\n    </footer>\r\n} ", dependencies: [{ kind: "pipe", type: i5.NumericFormatPipe, name: "numericFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerGridfooter, decorators: [{
             type: Component,
-            args: [{ selector: 'coer-grid-footer', standalone: false, template: "@if(footer().show) {\r\n    <footer [id]=\"GetIdCalculated()(-1, -1, 'footer')\" class=\"flex-middle-between padding-top-5px\">\r\n        <span>\r\n            @if(isLoadingInner()) {\r\n                <span class=\"animation-fade\"> Loading </span>\r\n            }\r\n\r\n            @else if(dataSourceSelected().length > 0) {\r\n                <span class=\"margin-left-5px text-gray\">\r\n                    <i class=\"bi bi-check2-square\"></i>\r\n                    {{ dataSourceSelected().length | numericFormat }}\r\n                </span>\r\n            }\r\n        </span>\r\n\r\n        @if(dataSource().length > 0) {\r\n            <span class=\"margin-right-5px text-gray\"> {{ dataSource().length | numericFormat }} Rows </span>\r\n        } \r\n    </footer>\r\n}" }]
+            args: [{ selector: 'coer-grid-footer', standalone: false, template: "@if(footer().show) {\r\n    <footer [id]=\"GetIdCalculated()(-1, -1, 'footer')\" class=\"flex-middle-between padding-top-5px\">\r\n        <span>\r\n            @if(isLoadingInner()) {\r\n                <span class=\"animation-fade\"> Loading </span>\r\n            }\r\n\r\n            @else if(dataSourceSelected().length > 0) {\r\n                <span class=\"margin-left-5px text-gray\">\r\n                    <i class=\"bi bi-check2-square\"></i>\r\n                    {{ dataSourceSelected().length | numericFormat }}\r\n                </span>\r\n            }\r\n        </span>\r\n\r\n        @if(dataSource().length > 0) {\r\n            <span class=\"margin-right-5px text-gray\"> {{ dataSource().length | numericFormat }} Rows </span>\r\n        } \r\n    </footer>\r\n} " }]
         }] });
 
 class CoerGrid extends CoerGridExtension {