coer-elements 2.0.78 → 2.0.80

package/fesm2022/coer-elements-components.mjs

@@ -3186,11 +3186,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                <!-- 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('showModalButton')) { \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                        <!-- 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\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                        <!-- 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=\"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"] }] }); }
 }
 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                <!-- 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('showModalButton')) { \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                        <!-- 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\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                        <!-- 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=\"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"] }]
         }] });
 
 class CoerGridfooter {