keevo-components 1.8.424 → 1.8.426

package/esm2022/lib/components/kv-workspace/empresa/kv-workspace-empresa.component.mjs

@@ -53,7 +53,7 @@ export class WorkspaceEmpresaComponent {
         this.onEmpresaSelecionada.emit(this.empresaSelecionada);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceEmpresaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceEmpresaComponent, selector: "kv-workspace-empresa", inputs: { empresas: "empresas", empresaSelecionada: "empresaSelecionada", totalEmpresas: "totalEmpresas" }, outputs: { onEmpresaSelecionada: "onEmpresaSelecionada", onPaginate: "onPaginate" }, ngImport: i0, template: "<kv-table\r\n  [config]=\"tableConfig\"\r\n  [dataSource]=\"empresas\"\r\n  [isTableScrollable]=\"true\"\r\n  [paginator]=\"true\"\r\n  [rows]=\"5\"\r\n  [rowsPerPageOptions]=\"[5]\"\r\n  [scrollHeight]=\"'300px'\"\r\n  [tableSize]=\"5\"\r\n  [totalRecords]=\"totalEmpresas\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  (onPaginate)=\"paginate($event)\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: i1.KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceEmpresaComponent, selector: "kv-workspace-empresa", inputs: { empresas: "empresas", empresaSelecionada: "empresaSelecionada", totalEmpresas: "totalEmpresas" }, outputs: { onEmpresaSelecionada: "onEmpresaSelecionada", onPaginate: "onPaginate" }, ngImport: i0, template: "<kv-table\r\n  [config]=\"tableConfig\"\r\n  [dataSource]=\"empresas\"\r\n  [isTableScrollable]=\"true\"\r\n  [paginator]=\"true\"\r\n  [rows]=\"5\"\r\n  [rowsPerPageOptions]=\"[5]\"\r\n  [scrollHeight]=\"'300px'\"\r\n  [tableSize]=\"5\"\r\n  [totalRecords]=\"totalEmpresas\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  (onPaginate)=\"paginate($event)\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: i1.KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon", "ellipsisText"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceEmpresaComponent, decorators: [{
             type: Component,

package/esm2022/lib/components/kv-workspace/master/kv-workspace-master.component.mjs

@@ -48,7 +48,7 @@ export class WorkspaceMasterComponent {
         this.onMasterSelecionada.emit(this.masterSelecionada);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceMasterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceMasterComponent, selector: "kv-workspace-master", inputs: { masters: "masters", masterSelecionada: "masterSelecionada" }, outputs: { onMasterSelecionada: "onMasterSelecionada" }, ngImport: i0, template: "<kv-table\r\n  [tableSize]=\"5\"\r\n  [rows]=\"5\"\r\n  [config]=\"tableConfig\"\r\n  [paginator]=\"false\"\r\n  [dataSource]=\"dataSource\"\r\n  [rowsPerPageOptions]=\"[5, 10, 25, 50, 100, 200]\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  [isTableScrollable]=\"true\"\r\n  [scrollHeight]=\"'300px'\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: i1.KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceMasterComponent, selector: "kv-workspace-master", inputs: { masters: "masters", masterSelecionada: "masterSelecionada" }, outputs: { onMasterSelecionada: "onMasterSelecionada" }, ngImport: i0, template: "<kv-table\r\n  [tableSize]=\"5\"\r\n  [rows]=\"5\"\r\n  [config]=\"tableConfig\"\r\n  [paginator]=\"false\"\r\n  [dataSource]=\"dataSource\"\r\n  [rowsPerPageOptions]=\"[5, 10, 25, 50, 100, 200]\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  [isTableScrollable]=\"true\"\r\n  [scrollHeight]=\"'300px'\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: i1.KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon", "ellipsisText"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceMasterComponent, decorators: [{
             type: Component,

package/fesm2022/keevo-components.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, Output, ViewChild, Injectable, Directive, Pipe, ViewChildren, ContentChildren, forwardRef, input, output, signal, model, effect, computed, HostListener, viewChild, NgModule, inject, contentChildren, ViewContainerRef, ChangeDetectionStrategy, HostBinding, Injector } from '@angular/core';
+import { EventEmitter, Component, Input, Output, ViewChild, Injectable, Directive, Pipe, ViewChildren, ContentChildren, forwardRef, input, output, signal, model, viewChild, effect, computed, HostListener, NgModule, inject, contentChildren, ViewContainerRef, ChangeDetectionStrategy, HostBinding, Injector } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, NgClass } from '@angular/common';
 import * as i1$1 from 'primeng/button';
@@ -1461,6 +1461,8 @@ class KvTableComponent {
         this.doubleClickEvent = new EventEmitter();
         this.filterField = new EventEmitter();
         this.onSwitchTableChange = new EventEmitter();
+        this.tableCell = viewChild('tableCell');
+        this.ellipsisText = input(false);
         this.configuracaoEffect = effect(() => {
             const config = this.tableConfig();
             this.definirFiltrosGlobais(config);
@@ -1904,12 +1906,18 @@ class KvTableComponent {
     get config() {
         return this.tableConfig();
     }
+    returnMaxWidth(widthCol) {
+        let widthTable = this.tableCell()?.nativeElement.parentElement.offsetWidth;
+        let percent = Number(widthCol.replace('%', ''));
+        let widthCalc = widthTable * percent / 100;
+        return `${widthCalc}px`;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTableComponent, deps: [{ token: i1.DatePipe }, { token: i1.DecimalPipe }, { token: CpfCnpjPipe }, { token: TelefonePipe }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTableComponent, selector: "kv-table", inputs: { _templates: { classPropertyName: "_templates", publicName: "templates", isSignal: false, isRequired: false, transformFunction: null }, setConfig: { classPropertyName: "setConfig", publicName: "config", isSignal: false, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, defaultSortField: { classPropertyName: "defaultSortField", publicName: "defaultSortField", isSignal: false, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: false, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: false, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: false, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: false, isRequired: false, transformFunction: null }, tableSize: { classPropertyName: "tableSize", publicName: "tableSize", isSignal: false, isRequired: false, transformFunction: null }, filterColumnsBtn: { classPropertyName: "filterColumnsBtn", publicName: "filterColumnsBtn", isSignal: false, isRequired: false, transformFunction: null }, replaceEmptyValues: { classPropertyName: "replaceEmptyValues", publicName: "replaceEmptyValues", isSignal: false, isRequired: false, transformFunction: null }, filtrosAvancados: { classPropertyName: "filtrosAvancados", publicName: "filtrosAvancados", isSignal: false, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: false, isRequired: false, transformFunction: null }, isTableScrollable: { classPropertyName: "isTableScrollable", publicName: "isTableScrollable", isSignal: false, isRequired: false, transformFunction: null }, tableCaptalized: { classPropertyName: "tableCaptalized", publicName: "tableCaptalized", isSignal: false, isRequired: false, transformFunction: null }, rowTrackBy: { classPropertyName: "rowTrackBy", publicName: "rowTrackBy", isSignal: false, isRequired: false, transformFunction: null }, responsiveLayout: { classPropertyName: "responsiveLayout", publicName: "responsiveLayout", isSignal: false, isRequired: false, transformFunction: null }, disabledHeaderCheckbox: { classPropertyName: "disabledHeaderCheckbox", publicName: "disabledHeaderCheckbox", isSignal: false, isRequired: false, transformFunction: null }, applyStyle: { classPropertyName: "applyStyle", publicName: "applyStyle", isSignal: false, isRequired: false, transformFunction: null }, pageLinksOptions: { classPropertyName: "pageLinksOptions", publicName: "pageLinksOptions", isSignal: false, isRequired: false, transformFunction: null }, showFirstLastIcon: { classPropertyName: "showFirstLastIcon", publicName: "showFirstLastIcon", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { first: "firstChange", rows: "rowsChange", onActiveItem: "onActiveItem", onActiveItemLote: "onActiveItemLote", onPaginate: "onPaginate", onSelectionChange: "onSelectionChange", doubleClickEvent: "doubleClickEvent", filterField: "filterField", onSwitchTableChange: "onSwitchTableChange" }, host: { listeners: { "window:resize": "onWindowResize($event)", "document:keydown.escape": "onEscapeKey($event)", "document:click": "onClickEvent($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }, { propertyName: "ptable", first: true, predicate: Table, descendants: true }, { propertyName: "menuFiltroDiv", first: true, predicate: ["menuFiltroDiv"], descendants: true }, { propertyName: "botaoFiltro", first: true, predicate: ["botaoFiltro"], descendants: true }, { propertyName: "inputField", first: true, predicate: ["inputField"], descendants: true }], ngImport: i0, template: "<div class=\"kv-table-container\">\r\n  @if (config) {\r\n  <p-table\r\n    #dt\r\n    styleClass=\"p-datatable-sm\"\r\n    [value]=\"dataSource\"\r\n    [(selection)]=\"selectedItems\"\r\n    [rowSelectable]=\"isRowSelectable\"\r\n    [columns]=\"config.columns\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [rows]=\"rows()\"\r\n    [paginator]=\"paginator\"\r\n    [rowsPerPageOptions]=\"rowsPerPageOptions\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [rowHover]=\"true\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [lazy]=\"config.lazy\"\r\n    [first]=\"first()\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (selectionChange)=\"selectionChange($event)\"\r\n    (onSort)=\"onSort($event)\"\r\n    (onPage)=\"onPage($event)\"\r\n    rowGroupMode=\"rowspan\"\r\n    [groupRowsBy]=\"config.fieldGroup\"\r\n    [showFirstLastIcon]=\"widthPage() > 960 ? true : false\"\r\n    [pageLinks]=\"widthPage() > 960 ? 2 : 1\"\r\n    [responsive]=\"true\"\r\n    [responsiveLayout]=\"responsiveLayout ? 'stack' : ''\"\r\n    [scrollable]=\"isTableScrollable\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [rowTrackBy]=\"rowTrackBy\"\r\n  >\r\n    @if (config?.enableCation) {\r\n    <ng-template pTemplate=\"caption\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between grid formgrid p-fluid col-12 p-1 m-0\"\r\n        [style.background-color]=\"'#f1f1f1'\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          @if (config.title) {\r\n          <div class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          } @if (config.subtitle) {\r\n          <div class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center md:col-6 lg:col-4 {{\r\n            widthPage() < 768 ? 'col-10' : 'col-12'\r\n          }}  gap-1 p-0\"\r\n        >\r\n          @if (config?.enableFilter) {\r\n          <span class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search text-sm\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"widthPage() > 800\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(dt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              autocomplete=\"off\"\r\n              #inputField\r\n              class=\"text-sm\"\r\n            />\r\n          </span>\r\n          } @if(filterColumnsBtn) {\r\n          <div #botaoFiltro>\r\n            <kv-button\r\n              id=\"botaoFiltro\"\r\n              [icon]=\"'align_vertical_top'\"\r\n              (onClick)=\"abrirMenuFiltro($event)\"\r\n              severity=\"tertiary\"\r\n              pTooltip=\"Ocultar/Exibir colunas\"\r\n            >\r\n            </kv-button>\r\n          </div>\r\n\r\n          <div\r\n            #menuFiltroDiv\r\n            id=\"menuFiltroDiv\"\r\n            [style.visibility]=\"'hidden'\"\r\n            class=\"absolute z-4 bg-gray-200 menu-columns-filtro\"\r\n          >\r\n            <p-card styleClass=\"p-1\">\r\n              <div\r\n                class=\"flex flex-column text-medium w-15rem p-1\"\r\n                *ngFor=\"let col of columnsFilter()\"\r\n              >\r\n                {{ checkMenuFiltro(col) }}\r\n                <p-checkbox\r\n                  #filterColumns\r\n                  [label]=\"col.header\"\r\n                  [binary]=\"true\"\r\n                  class=\"checkbox-container\"\r\n                  (onChange)=\"dinamicColumnSet($event, col)\"\r\n                  [(ngModel)]=\"col.checked\"\r\n                  *ngIf=\"!dinamicDisableColumn(col)\"\r\n                ></p-checkbox>\r\n              </div>\r\n            </p-card>\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-2 justify-content-end gap-2 p-0\">\r\n          @for (action of config.actionsLote; track i; let i = $index) {\r\n          <div class=\"flex align-items-center justify-content-center\">\r\n            @if ((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            (getOrExecute(action.visible, selectedItems) ?? true)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"\r\n                (getOrExecute(action.tooltip, selectedItems)?.length ??\r\n                  0 > 7) &&\r\n                config.actionsLote &&\r\n                i == config.actionsLote.length - 1\r\n                  ? 'left'\r\n                  : 'bottom'\r\n              \"\r\n              [disabled]=\"getOrExecute(action.disabled, selectedItems) || false\"\r\n              [icon]=\"getOrExecute(action.icon, selectedItems)\"\r\n              [severity]=\"action.severity || 'tertiary'\"\r\n            />\r\n            }\r\n          </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    }\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n        @if (config.enableSelect) {\r\n        <th>\r\n          <p-tableHeaderCheckbox\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n            [disabled]=\"disabledHeaderCheckbox\"\r\n          ></p-tableHeaderCheckbox>\r\n        </th>\r\n        } @for (col of columns; track $index) {\r\n        <th\r\n          [pSortableColumn]=\"col.field\"\r\n          [pSortableColumnDisabled]=\"col.sortable === false\"\r\n          [style.width]=\"col.width\"\r\n        >\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              col.centralize && 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <span class=\"text-xs font-medium\">{{ col.header }}</span>\r\n            @if (col.sortable) {\r\n            <p-sortIcon [field]=\"col.field\" class=\"pb-1\"></p-sortIcon>\r\n            } @if (col.headerTooltip) {\r\n            <span\r\n              class=\"material-symbols-outlined flex align-items-center\"\r\n              [pTooltip]=\"col.headerTooltip\"\r\n              >info</span\r\n            >\r\n            }\r\n          </div>\r\n        </th>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <th></th>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowData\r\n      let-columns=\"columns\"\r\n      let-rowgroup=\"rowgroup\"\r\n      let-rowspan=\"rowspan\"\r\n      let-rowIndex=\"rowIndex\"\r\n    >\r\n      <tr\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{\r\n          capitalize: tableCaptalized,\r\n          last: rowIndex === dataSource.length - 1\r\n        }\"\r\n        class=\"tr-td {{ isDisabledRow(rowData) ? 'disabled-row' : '' }}\"\r\n      >\r\n        @if (config.enableSelect) {\r\n        <td style=\"width: 8px !important\">\r\n          <p-tableCheckbox\r\n            [value]=\"rowData\"\r\n            [disabled]=\"isDisabledCheckbox(rowData)\"\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n          ></p-tableCheckbox>\r\n        </td>\r\n        } @for (col of columns; track $index) {\r\n        <ng-container>\r\n          @if (rowgroup && !col.template) {\r\n          <td\r\n            [attr.rowspan]=\"rowgroup && col.grouped ? rowspan : null\"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n            class=\"{{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"returnRowClass(rowData, col)\"\r\n            >\r\n              @if (!isChipField(col) && !col.iconField && !isImageField(col)) {\r\n              <span\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }} text-xs\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                @if(col.tagColor) {\r\n                <div\r\n                  class=\"tag\"\r\n                  [pTooltip]=\"\r\n                    col.tooltipTag &&\r\n                    col.tooltipTag(rowData, col, rowData[col.field])\r\n                  \"\r\n                  [style.background-color]=\"\r\n                    col.tagColor(rowData, col, rowData[col.field])\r\n                  \"\r\n                ></div>\r\n\r\n                } @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                  >{{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >               \r\n\r\n                @if(col.switchDisable){\r\n                  <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col.switchDisable(rowData, col)\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n                @else {\r\n                  <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (!rowgroup && !col.grouped && !col.template) {\r\n          <td\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"\r\n                returnRowClass(rowData, col) +\r\n                ' flex flex-row gap-2 align-items-center ' +\r\n                (col.centralize && 'justify-content-center')\r\n              \"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"\r\n                  col.tooltipTag &&\r\n                  col.tooltipTag(rowData, col, rowData[col.field])\r\n                \"\r\n                [style.background-color]=\"\r\n                  col.tagColor(rowData, col, rowData[col.field])\r\n                \"\r\n              ></div>\r\n\r\n              } @if (!isChipField(col) && !col.iconField && !isImageField(col)){\r\n              <span class=\"text-xs\">\r\n                @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                >\r\n                  {{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >\r\n              @if(col.switchDisable){\r\n                <kv-switch\r\n                (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                [disabled]=\"col.switchDisable(rowData, col)\"\r\n                [switchValue]=\"transformValue(rowData, col)\"\r\n              >\r\n              </kv-switch>\r\n              }\r\n              @else {\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n              }\r\n                \r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (col.template) {\r\n          <td\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n            @if (getCustomTemplate(col.template.name)) {\r\n\r\n            <div\r\n              class=\"flex flex-row gap-2 align-items-center {{\r\n                col.centralize && ' justify-content-center'\r\n              }}\"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"col.tooltipTag && col.tooltipTag(rowData, col)\"\r\n                [style.background-color]=\"col.tagColor(rowData, col)\"\r\n              ></div>\r\n              }\r\n\r\n              <div class=\"w-full\">\r\n                <ng-container\r\n                  [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n                  [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                />\r\n              </div>\r\n            </div>\r\n            }\r\n          </td>\r\n          }\r\n        </ng-container>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <td>\r\n          <div class=\"flex flex-row justify-content-end w-full\">\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz\"\r\n              style=\"font-size: 20px; padding: 0.15rem;\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            <p-tieredMenu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"tableActions[rowIndex - actionsOffset]\"\r\n              appendTo=\"body\"\r\n            ></p-tieredMenu>\r\n          </div>\r\n        </td>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\" let-columns>\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"columns.length + 2\"\r\n          style=\"text-align: center; border-radius: 10px !important\"\r\n        >\r\n          <p class=\"font-medium m-0 text-sm\">Nenhum registro encontrado</p>\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n  }\r\n</div>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/icon?family=Material+Icons\"\r\n/>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\"\r\n/>\r\n", styles: ["::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable>.p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.tag{width:5px;height:20px;border-radius:.25rem}::ng-deep .p-panel .p-panel-header{border:none!important}:host ::ng-deep .p-datatable-header{background-color:#f1f1f1!important;padding:0!important;border-radius:5px!important}::ng-deep .p-panel.p-panel-toggleable .p-panel-header{background-color:#f1f1f1}::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{background-color:#f1f1f1;padding:.35rem}.icon-more-horiz{font-weight:700}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}.tr-td{overflow-wrap:anywhere}.tr-td:hover{box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;background-color:#fff;transition:color .3s,transform .3s;transform:scale(1)}.tr-td:hover.last{box-shadow:-1px -1px 9px -3px #000000bf;-webkit-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75);-moz-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75)}.disabled-row{pointer-events:none;opacity:.6;background-color:#dddddd8e}::ng-deep .p-tooltip{pointer-events:auto}.btn-table{background-color:#29b92d;padding:12px}.btn-table:hover{background-color:#249a29}.btn-table:active{background-color:#1c801f}.btn-table:disabled{background-color:#29b92d}::ng-deep svg.p-icon{width:.65rem;height:.65rem}::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:#004172;background:#004172}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:hover{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:active{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:disabled{background-color:#002542;opacity:.4;cursor:auto}input{height:1.875rem}::ng-deep .p-checkbox .p-checkbox-box{width:1.125rem;height:1.125rem}::ng-deep .p-checkbox{display:flex;align-items:center}::ng-deep .p-checkbox-label{font-size:.875rem}::ng-deep .p-datatable .p-paginator-bottom{scale:.75}::ng-deep .p-menuitem-text{font-size:.875rem}::ng-deep .p-tieredmenu .p-menuitem>.p-menuitem-content .p-menuitem-link{padding:.5rem .75rem}::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.15rem}:host{height:100%}::ng-deep .kv-table-container,::ng-deep p-table{height:100%}::ng-deep p-table .p-datatable{display:flex;flex-direction:column;height:100%}::ng-deep .p-datatable .p-datatable-wrapper{flex:1 1 1}::ng-deep p-table .p-datatable .p-datatable-wrapper,::ng-deep p-table{height:100%}::ng-deep table{height:auto!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5$2.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "directive", type: i6.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i8$1.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i5$3.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i13.TieredMenu, selector: "p-tieredMenu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "autoDisplay", "showTransitionOptions", "hideTransitionOptions", "id", "ariaLabel", "ariaLabelledBy", "disabled", "tabindex"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i14.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i14.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i14.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i14.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i14.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: KvSwitchComponent, selector: "kv-switch", inputs: ["readonly", "switchValue"], outputs: ["onSwitchChange"] }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "label", "disabled"], outputs: ["onClick"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTableComponent, selector: "kv-table", inputs: { _templates: { classPropertyName: "_templates", publicName: "templates", isSignal: false, isRequired: false, transformFunction: null }, setConfig: { classPropertyName: "setConfig", publicName: "config", isSignal: false, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, defaultSortField: { classPropertyName: "defaultSortField", publicName: "defaultSortField", isSignal: false, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: false, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: false, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: false, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: false, isRequired: false, transformFunction: null }, tableSize: { classPropertyName: "tableSize", publicName: "tableSize", isSignal: false, isRequired: false, transformFunction: null }, filterColumnsBtn: { classPropertyName: "filterColumnsBtn", publicName: "filterColumnsBtn", isSignal: false, isRequired: false, transformFunction: null }, replaceEmptyValues: { classPropertyName: "replaceEmptyValues", publicName: "replaceEmptyValues", isSignal: false, isRequired: false, transformFunction: null }, filtrosAvancados: { classPropertyName: "filtrosAvancados", publicName: "filtrosAvancados", isSignal: false, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: false, isRequired: false, transformFunction: null }, isTableScrollable: { classPropertyName: "isTableScrollable", publicName: "isTableScrollable", isSignal: false, isRequired: false, transformFunction: null }, tableCaptalized: { classPropertyName: "tableCaptalized", publicName: "tableCaptalized", isSignal: false, isRequired: false, transformFunction: null }, rowTrackBy: { classPropertyName: "rowTrackBy", publicName: "rowTrackBy", isSignal: false, isRequired: false, transformFunction: null }, responsiveLayout: { classPropertyName: "responsiveLayout", publicName: "responsiveLayout", isSignal: false, isRequired: false, transformFunction: null }, disabledHeaderCheckbox: { classPropertyName: "disabledHeaderCheckbox", publicName: "disabledHeaderCheckbox", isSignal: false, isRequired: false, transformFunction: null }, applyStyle: { classPropertyName: "applyStyle", publicName: "applyStyle", isSignal: false, isRequired: false, transformFunction: null }, pageLinksOptions: { classPropertyName: "pageLinksOptions", publicName: "pageLinksOptions", isSignal: false, isRequired: false, transformFunction: null }, showFirstLastIcon: { classPropertyName: "showFirstLastIcon", publicName: "showFirstLastIcon", isSignal: false, isRequired: false, transformFunction: null }, ellipsisText: { classPropertyName: "ellipsisText", publicName: "ellipsisText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { first: "firstChange", rows: "rowsChange", onActiveItem: "onActiveItem", onActiveItemLote: "onActiveItemLote", onPaginate: "onPaginate", onSelectionChange: "onSelectionChange", doubleClickEvent: "doubleClickEvent", filterField: "filterField", onSwitchTableChange: "onSwitchTableChange" }, host: { listeners: { "window:resize": "onWindowResize($event)", "document:keydown.escape": "onEscapeKey($event)", "document:click": "onClickEvent($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "tableCell", first: true, predicate: ["tableCell"], descendants: true, isSignal: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }, { propertyName: "ptable", first: true, predicate: Table, descendants: true }, { propertyName: "menuFiltroDiv", first: true, predicate: ["menuFiltroDiv"], descendants: true }, { propertyName: "botaoFiltro", first: true, predicate: ["botaoFiltro"], descendants: true }, { propertyName: "inputField", first: true, predicate: ["inputField"], descendants: true }], ngImport: i0, template: "<div class=\"kv-table-container\">\r\n  @if (config) {\r\n  <p-table\r\n    #dt\r\n    styleClass=\"p-datatable-sm\"\r\n    [value]=\"dataSource\"\r\n    [(selection)]=\"selectedItems\"\r\n    [rowSelectable]=\"isRowSelectable\"\r\n    [columns]=\"config.columns\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [rows]=\"rows()\"\r\n    [paginator]=\"paginator\"\r\n    [rowsPerPageOptions]=\"rowsPerPageOptions\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [rowHover]=\"true\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [lazy]=\"config.lazy\"\r\n    [first]=\"first()\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (selectionChange)=\"selectionChange($event)\"\r\n    (onSort)=\"onSort($event)\"\r\n    (onPage)=\"onPage($event)\"\r\n    rowGroupMode=\"rowspan\"\r\n    [groupRowsBy]=\"config.fieldGroup\"\r\n    [showFirstLastIcon]=\"widthPage() > 960 ? true : false\"\r\n    [pageLinks]=\"widthPage() > 960 ? 2 : 1\"\r\n    [responsive]=\"true\"\r\n    [responsiveLayout]=\"responsiveLayout ? 'stack' : ''\"\r\n    [scrollable]=\"isTableScrollable\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [rowTrackBy]=\"rowTrackBy\"\r\n  >\r\n    @if (config?.enableCation) {\r\n    <ng-template pTemplate=\"caption\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between grid formgrid p-fluid col-12 p-1 m-0\"\r\n        [style.background-color]=\"'#f1f1f1'\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          @if (config.title) {\r\n          <div class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          } @if (config.subtitle) {\r\n          <div class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center md:col-6 lg:col-4 {{\r\n            widthPage() < 768 ? 'col-10' : 'col-12'\r\n          }}  gap-1 p-0\"\r\n        >\r\n          @if (config?.enableFilter) {\r\n          <span class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search text-sm\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"widthPage() > 800\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(dt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              autocomplete=\"off\"\r\n              #inputField\r\n              class=\"text-sm\"\r\n            />\r\n          </span>\r\n          } @if(filterColumnsBtn) {\r\n          <div #botaoFiltro>\r\n            <kv-button\r\n              id=\"botaoFiltro\"\r\n              [icon]=\"'align_vertical_top'\"\r\n              (onClick)=\"abrirMenuFiltro($event)\"\r\n              severity=\"tertiary\"\r\n              pTooltip=\"Ocultar/Exibir colunas\"\r\n              size=\"small\"\r\n            >\r\n            </kv-button>\r\n          </div>\r\n\r\n          <div\r\n            #menuFiltroDiv\r\n            id=\"menuFiltroDiv\"\r\n            [style.visibility]=\"'hidden'\"\r\n            class=\"absolute z-4 bg-gray-200 menu-columns-filtro\"\r\n          >\r\n            <p-card styleClass=\"p-1\">\r\n              <div\r\n                class=\"flex flex-column text-medium w-15rem p-1\"\r\n                *ngFor=\"let col of columnsFilter()\"\r\n              >\r\n                {{ checkMenuFiltro(col) }}\r\n                <p-checkbox\r\n                  #filterColumns\r\n                  [label]=\"col.header\"\r\n                  [binary]=\"true\"\r\n                  class=\"checkbox-container\"\r\n                  (onChange)=\"dinamicColumnSet($event, col)\"\r\n                  [(ngModel)]=\"col.checked\"\r\n                  *ngIf=\"!dinamicDisableColumn(col)\"\r\n                ></p-checkbox>\r\n              </div>\r\n            </p-card>\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-2 justify-content-end gap-2 p-0\">\r\n          @for (action of config.actionsLote; track i; let i = $index) {\r\n          <div class=\"flex align-items-center justify-content-center\">\r\n            @if ((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            (getOrExecute(action.visible, selectedItems) ?? true)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"\r\n                (getOrExecute(action.tooltip, selectedItems)?.length ??\r\n                  0 > 7) &&\r\n                config.actionsLote &&\r\n                i == config.actionsLote.length - 1\r\n                  ? 'left'\r\n                  : 'bottom'\r\n              \"\r\n              [disabled]=\"getOrExecute(action.disabled, selectedItems) || false\"\r\n              [icon]=\"getOrExecute(action.icon, selectedItems)\"\r\n              [severity]=\"action.severity || 'tertiary'\"\r\n              size=\"small\"\r\n            />\r\n            }\r\n          </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    }\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n        @if (config.enableSelect) {\r\n        <th>\r\n          <p-tableHeaderCheckbox\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n            [disabled]=\"disabledHeaderCheckbox\"\r\n          ></p-tableHeaderCheckbox>\r\n        </th>\r\n        } @for (col of columns; track $index) {\r\n        <th\r\n          [pSortableColumn]=\"col.field\"\r\n          [pSortableColumnDisabled]=\"col.sortable === false\"\r\n          [style.width]=\"col.width\"\r\n        >\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              col.centralize && 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <span class=\"text-xs font-medium\">{{ col.header }}</span>\r\n            @if (col.sortable) {\r\n            <p-sortIcon [field]=\"col.field\" class=\"pb-1\"></p-sortIcon>\r\n            } @if (col.headerTooltip) {\r\n            <span\r\n              class=\"material-symbols-outlined flex align-items-center\"\r\n              [pTooltip]=\"col.headerTooltip\"\r\n              >info</span\r\n            >\r\n            }\r\n          </div>\r\n        </th>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <th></th>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowData\r\n      let-columns=\"columns\"\r\n      let-rowgroup=\"rowgroup\"\r\n      let-rowspan=\"rowspan\"\r\n      let-rowIndex=\"rowIndex\"\r\n    >\r\n      <tr\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{\r\n          capitalize: tableCaptalized,\r\n          last: rowIndex === dataSource.length - 1\r\n        }\"\r\n        class=\"tr-td {{ isDisabledRow(rowData) ? 'disabled-row' : '' }}\"\r\n      >\r\n        @if (config.enableSelect) {\r\n        <td style=\"width: 8px !important\">\r\n          <p-tableCheckbox\r\n            [value]=\"rowData\"\r\n            [disabled]=\"isDisabledCheckbox(rowData)\"\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n          ></p-tableCheckbox>\r\n        </td>\r\n        } @for (col of columns; track $index) {\r\n        <ng-container>\r\n          @if (rowgroup && !col.template) {\r\n          <td\r\n            [attr.rowspan]=\"rowgroup && col.grouped ? rowspan : null\"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n            class=\"{{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }}\"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"returnRowClass(rowData, col)\"\r\n            >\r\n              @if (!isChipField(col) && !col.iconField && !isImageField(col)) {\r\n              <span\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }} text-xs\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                @if(col.tagColor) {\r\n                <div\r\n                  class=\"tag\"\r\n                  [pTooltip]=\"\r\n                    col.tooltipTag &&\r\n                    col.tooltipTag(rowData, col, rowData[col.field])\r\n                  \"\r\n                  [style.background-color]=\"\r\n                    col.tagColor(rowData, col, rowData[col.field])\r\n                  \"\r\n                ></div>\r\n\r\n                } @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                  >{{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >\r\n                @if(col.switchDisable){\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col.switchDisable(rowData, col)\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                } @else {\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (!rowgroup && !col.grouped && !col.template) {\r\n          <td\r\n            #tableCell\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"\r\n                returnRowClass(rowData, col) +\r\n                ' flex flex-row gap-2 align-items-center ' +\r\n                (col.centralize && 'justify-content-center')\r\n              \"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n              [style.max-width]=\"ellipsisText() && returnMaxWidth(col.width)\"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"\r\n                  col.tooltipTag &&\r\n                  col.tooltipTag(rowData, col, rowData[col.field])\r\n                \"\r\n                [style.background-color]=\"\r\n                  col.tagColor(rowData, col, rowData[col.field])\r\n                \"\r\n              ></div>\r\n\r\n              } @if (!isChipField(col) && !col.iconField && !isImageField(col)){\r\n              <span class=\"text-xs {{ ellipsisText() && 'ellipsis-text' }}\">\r\n                @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                >\r\n                  {{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >\r\n                @if(col.switchDisable){\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col.switchDisable(rowData, col)\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                } @else {\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (col.template) {\r\n          <td\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n            @if (getCustomTemplate(col.template.name)) {\r\n\r\n            <div\r\n              class=\"flex flex-row gap-2 align-items-center {{\r\n                col.centralize && ' justify-content-center'\r\n              }}\"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"col.tooltipTag && col.tooltipTag(rowData, col)\"\r\n                [style.background-color]=\"col.tagColor(rowData, col)\"\r\n              ></div>\r\n              }\r\n\r\n              <div class=\"w-full\">\r\n                <ng-container\r\n                  [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n                  [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                />\r\n              </div>\r\n            </div>\r\n            }\r\n          </td>\r\n          }\r\n        </ng-container>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <td>\r\n          <div class=\"flex flex-row justify-content-end w-full\">\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz\"\r\n              style=\"font-size: 20px; padding: 0.15rem\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            <p-tieredMenu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"tableActions[rowIndex - actionsOffset]\"\r\n              appendTo=\"body\"\r\n            ></p-tieredMenu>\r\n          </div>\r\n        </td>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\" let-columns>\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"columns.length + 2\"\r\n          style=\"text-align: center; border-radius: 10px !important\"\r\n        >\r\n          <p class=\"font-medium m-0 text-sm\">Nenhum registro encontrado</p>\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n  }\r\n</div>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/icon?family=Material+Icons\"\r\n/>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\"\r\n/>\r\n", styles: ["::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable>.p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.tag{width:5px;height:20px;border-radius:.25rem}::ng-deep .p-panel .p-panel-header{border:none!important}:host ::ng-deep .p-datatable-header{background-color:#860000!important;padding:0!important;border-radius:5px!important}::ng-deep .p-panel.p-panel-toggleable .p-panel-header{background-color:#f1f1f1}::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{background-color:#f1f1f1;padding:.15rem}.icon-more-horiz{font-weight:700}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}.tr-td{overflow-wrap:anywhere}.tr-td:hover{box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;background-color:#fff;transition:color .3s,transform .3s;transform:scale(1)}.tr-td:hover.last{box-shadow:-1px -1px 9px -3px #000000bf;-webkit-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75);-moz-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75)}.disabled-row{pointer-events:none;opacity:.6;background-color:#dddddd8e}::ng-deep .p-tooltip{pointer-events:auto}.btn-table{background-color:#29b92d;padding:12px}.btn-table:hover{background-color:#249a29}.btn-table:active{background-color:#1c801f}.btn-table:disabled{background-color:#29b92d}::ng-deep svg.p-icon{width:.65rem;height:.65rem}::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:#004172;background:#004172}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:hover{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:active{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:disabled{background-color:#002542;opacity:.4;cursor:auto}input{height:1.75rem}::ng-deep .p-checkbox .p-checkbox-box{width:1.125rem;height:1.125rem;border:1.5px solid #d1d5db}::ng-deep .p-checkbox{display:flex!important;align-items:center!important;justify-content:center}::ng-deep .p-checkbox-label{font-size:.875rem}::ng-deep .p-datatable .p-paginator-bottom{scale:.75}::ng-deep .p-menuitem-text{font-size:.875rem}::ng-deep .p-tieredmenu .p-menuitem>.p-menuitem-content .p-menuitem-link{padding:.5rem .75rem}::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.15rem}:host{height:100%}::ng-deep .kv-table-container,::ng-deep p-table{height:100%}::ng-deep p-table .p-datatable{display:flex;flex-direction:column;height:100%}::ng-deep .p-datatable .p-datatable-wrapper{flex:1 1 1}::ng-deep p-table .p-datatable .p-datatable-wrapper,::ng-deep p-table{height:100%}::ng-deep table{height:auto!important}.ellipsis-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5$2.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "directive", type: i6.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i8$1.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "directive", type: i5$3.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i13.TieredMenu, selector: "p-tieredMenu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "autoDisplay", "showTransitionOptions", "hideTransitionOptions", "id", "ariaLabel", "ariaLabelledBy", "disabled", "tabindex"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i14.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i14.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i14.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i14.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i14.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: KvSwitchComponent, selector: "kv-switch", inputs: ["readonly", "switchValue"], outputs: ["onSwitchChange"] }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "label", "disabled"], outputs: ["onClick"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-table', template: "<div class=\"kv-table-container\">\r\n  @if (config) {\r\n  <p-table\r\n    #dt\r\n    styleClass=\"p-datatable-sm\"\r\n    [value]=\"dataSource\"\r\n    [(selection)]=\"selectedItems\"\r\n    [rowSelectable]=\"isRowSelectable\"\r\n    [columns]=\"config.columns\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [rows]=\"rows()\"\r\n    [paginator]=\"paginator\"\r\n    [rowsPerPageOptions]=\"rowsPerPageOptions\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [rowHover]=\"true\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [lazy]=\"config.lazy\"\r\n    [first]=\"first()\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (selectionChange)=\"selectionChange($event)\"\r\n    (onSort)=\"onSort($event)\"\r\n    (onPage)=\"onPage($event)\"\r\n    rowGroupMode=\"rowspan\"\r\n    [groupRowsBy]=\"config.fieldGroup\"\r\n    [showFirstLastIcon]=\"widthPage() > 960 ? true : false\"\r\n    [pageLinks]=\"widthPage() > 960 ? 2 : 1\"\r\n    [responsive]=\"true\"\r\n    [responsiveLayout]=\"responsiveLayout ? 'stack' : ''\"\r\n    [scrollable]=\"isTableScrollable\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [rowTrackBy]=\"rowTrackBy\"\r\n  >\r\n    @if (config?.enableCation) {\r\n    <ng-template pTemplate=\"caption\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between grid formgrid p-fluid col-12 p-1 m-0\"\r\n        [style.background-color]=\"'#f1f1f1'\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          @if (config.title) {\r\n          <div class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          } @if (config.subtitle) {\r\n          <div class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center md:col-6 lg:col-4 {{\r\n            widthPage() < 768 ? 'col-10' : 'col-12'\r\n          }}  gap-1 p-0\"\r\n        >\r\n          @if (config?.enableFilter) {\r\n          <span class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search text-sm\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"widthPage() > 800\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(dt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              autocomplete=\"off\"\r\n              #inputField\r\n              class=\"text-sm\"\r\n            />\r\n          </span>\r\n          } @if(filterColumnsBtn) {\r\n          <div #botaoFiltro>\r\n            <kv-button\r\n              id=\"botaoFiltro\"\r\n              [icon]=\"'align_vertical_top'\"\r\n              (onClick)=\"abrirMenuFiltro($event)\"\r\n              severity=\"tertiary\"\r\n              pTooltip=\"Ocultar/Exibir colunas\"\r\n            >\r\n            </kv-button>\r\n          </div>\r\n\r\n          <div\r\n            #menuFiltroDiv\r\n            id=\"menuFiltroDiv\"\r\n            [style.visibility]=\"'hidden'\"\r\n            class=\"absolute z-4 bg-gray-200 menu-columns-filtro\"\r\n          >\r\n            <p-card styleClass=\"p-1\">\r\n              <div\r\n                class=\"flex flex-column text-medium w-15rem p-1\"\r\n                *ngFor=\"let col of columnsFilter()\"\r\n              >\r\n                {{ checkMenuFiltro(col) }}\r\n                <p-checkbox\r\n                  #filterColumns\r\n                  [label]=\"col.header\"\r\n                  [binary]=\"true\"\r\n                  class=\"checkbox-container\"\r\n                  (onChange)=\"dinamicColumnSet($event, col)\"\r\n                  [(ngModel)]=\"col.checked\"\r\n                  *ngIf=\"!dinamicDisableColumn(col)\"\r\n                ></p-checkbox>\r\n              </div>\r\n            </p-card>\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-2 justify-content-end gap-2 p-0\">\r\n          @for (action of config.actionsLote; track i; let i = $index) {\r\n          <div class=\"flex align-items-center justify-content-center\">\r\n            @if ((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            (getOrExecute(action.visible, selectedItems) ?? true)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"\r\n                (getOrExecute(action.tooltip, selectedItems)?.length ??\r\n                  0 > 7) &&\r\n                config.actionsLote &&\r\n                i == config.actionsLote.length - 1\r\n                  ? 'left'\r\n                  : 'bottom'\r\n              \"\r\n              [disabled]=\"getOrExecute(action.disabled, selectedItems) || false\"\r\n              [icon]=\"getOrExecute(action.icon, selectedItems)\"\r\n              [severity]=\"action.severity || 'tertiary'\"\r\n            />\r\n            }\r\n          </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    }\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n        @if (config.enableSelect) {\r\n        <th>\r\n          <p-tableHeaderCheckbox\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n            [disabled]=\"disabledHeaderCheckbox\"\r\n          ></p-tableHeaderCheckbox>\r\n        </th>\r\n        } @for (col of columns; track $index) {\r\n        <th\r\n          [pSortableColumn]=\"col.field\"\r\n          [pSortableColumnDisabled]=\"col.sortable === false\"\r\n          [style.width]=\"col.width\"\r\n        >\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              col.centralize && 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <span class=\"text-xs font-medium\">{{ col.header }}</span>\r\n            @if (col.sortable) {\r\n            <p-sortIcon [field]=\"col.field\" class=\"pb-1\"></p-sortIcon>\r\n            } @if (col.headerTooltip) {\r\n            <span\r\n              class=\"material-symbols-outlined flex align-items-center\"\r\n              [pTooltip]=\"col.headerTooltip\"\r\n              >info</span\r\n            >\r\n            }\r\n          </div>\r\n        </th>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <th></th>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowData\r\n      let-columns=\"columns\"\r\n      let-rowgroup=\"rowgroup\"\r\n      let-rowspan=\"rowspan\"\r\n      let-rowIndex=\"rowIndex\"\r\n    >\r\n      <tr\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{\r\n          capitalize: tableCaptalized,\r\n          last: rowIndex === dataSource.length - 1\r\n        }\"\r\n        class=\"tr-td {{ isDisabledRow(rowData) ? 'disabled-row' : '' }}\"\r\n      >\r\n        @if (config.enableSelect) {\r\n        <td style=\"width: 8px !important\">\r\n          <p-tableCheckbox\r\n            [value]=\"rowData\"\r\n            [disabled]=\"isDisabledCheckbox(rowData)\"\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n          ></p-tableCheckbox>\r\n        </td>\r\n        } @for (col of columns; track $index) {\r\n        <ng-container>\r\n          @if (rowgroup && !col.template) {\r\n          <td\r\n            [attr.rowspan]=\"rowgroup && col.grouped ? rowspan : null\"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n            class=\"{{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"returnRowClass(rowData, col)\"\r\n            >\r\n              @if (!isChipField(col) && !col.iconField && !isImageField(col)) {\r\n              <span\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }} text-xs\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                @if(col.tagColor) {\r\n                <div\r\n                  class=\"tag\"\r\n                  [pTooltip]=\"\r\n                    col.tooltipTag &&\r\n                    col.tooltipTag(rowData, col, rowData[col.field])\r\n                  \"\r\n                  [style.background-color]=\"\r\n                    col.tagColor(rowData, col, rowData[col.field])\r\n                  \"\r\n                ></div>\r\n\r\n                } @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                  >{{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >               \r\n\r\n                @if(col.switchDisable){\r\n                  <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col.switchDisable(rowData, col)\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n                @else {\r\n                  <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (!rowgroup && !col.grouped && !col.template) {\r\n          <td\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"\r\n                returnRowClass(rowData, col) +\r\n                ' flex flex-row gap-2 align-items-center ' +\r\n                (col.centralize && 'justify-content-center')\r\n              \"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"\r\n                  col.tooltipTag &&\r\n                  col.tooltipTag(rowData, col, rowData[col.field])\r\n                \"\r\n                [style.background-color]=\"\r\n                  col.tagColor(rowData, col, rowData[col.field])\r\n                \"\r\n              ></div>\r\n\r\n              } @if (!isChipField(col) && !col.iconField && !isImageField(col)){\r\n              <span class=\"text-xs\">\r\n                @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                >\r\n                  {{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >\r\n              @if(col.switchDisable){\r\n                <kv-switch\r\n                (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                [disabled]=\"col.switchDisable(rowData, col)\"\r\n                [switchValue]=\"transformValue(rowData, col)\"\r\n              >\r\n              </kv-switch>\r\n              }\r\n              @else {\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n              }\r\n                \r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (col.template) {\r\n          <td\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n            @if (getCustomTemplate(col.template.name)) {\r\n\r\n            <div\r\n              class=\"flex flex-row gap-2 align-items-center {{\r\n                col.centralize && ' justify-content-center'\r\n              }}\"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"col.tooltipTag && col.tooltipTag(rowData, col)\"\r\n                [style.background-color]=\"col.tagColor(rowData, col)\"\r\n              ></div>\r\n              }\r\n\r\n              <div class=\"w-full\">\r\n                <ng-container\r\n                  [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n                  [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                />\r\n              </div>\r\n            </div>\r\n            }\r\n          </td>\r\n          }\r\n        </ng-container>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <td>\r\n          <div class=\"flex flex-row justify-content-end w-full\">\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz\"\r\n              style=\"font-size: 20px; padding: 0.15rem;\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            <p-tieredMenu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"tableActions[rowIndex - actionsOffset]\"\r\n              appendTo=\"body\"\r\n            ></p-tieredMenu>\r\n          </div>\r\n        </td>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\" let-columns>\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"columns.length + 2\"\r\n          style=\"text-align: center; border-radius: 10px !important\"\r\n        >\r\n          <p class=\"font-medium m-0 text-sm\">Nenhum registro encontrado</p>\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n  }\r\n</div>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/icon?family=Material+Icons\"\r\n/>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\"\r\n/>\r\n", styles: ["::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable>.p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.tag{width:5px;height:20px;border-radius:.25rem}::ng-deep .p-panel .p-panel-header{border:none!important}:host ::ng-deep .p-datatable-header{background-color:#f1f1f1!important;padding:0!important;border-radius:5px!important}::ng-deep .p-panel.p-panel-toggleable .p-panel-header{background-color:#f1f1f1}::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{background-color:#f1f1f1;padding:.35rem}.icon-more-horiz{font-weight:700}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}.tr-td{overflow-wrap:anywhere}.tr-td:hover{box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;background-color:#fff;transition:color .3s,transform .3s;transform:scale(1)}.tr-td:hover.last{box-shadow:-1px -1px 9px -3px #000000bf;-webkit-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75);-moz-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75)}.disabled-row{pointer-events:none;opacity:.6;background-color:#dddddd8e}::ng-deep .p-tooltip{pointer-events:auto}.btn-table{background-color:#29b92d;padding:12px}.btn-table:hover{background-color:#249a29}.btn-table:active{background-color:#1c801f}.btn-table:disabled{background-color:#29b92d}::ng-deep svg.p-icon{width:.65rem;height:.65rem}::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:#004172;background:#004172}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:hover{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:active{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:disabled{background-color:#002542;opacity:.4;cursor:auto}input{height:1.875rem}::ng-deep .p-checkbox .p-checkbox-box{width:1.125rem;height:1.125rem}::ng-deep .p-checkbox{display:flex;align-items:center}::ng-deep .p-checkbox-label{font-size:.875rem}::ng-deep .p-datatable .p-paginator-bottom{scale:.75}::ng-deep .p-menuitem-text{font-size:.875rem}::ng-deep .p-tieredmenu .p-menuitem>.p-menuitem-content .p-menuitem-link{padding:.5rem .75rem}::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.15rem}:host{height:100%}::ng-deep .kv-table-container,::ng-deep p-table{height:100%}::ng-deep p-table .p-datatable{display:flex;flex-direction:column;height:100%}::ng-deep .p-datatable .p-datatable-wrapper{flex:1 1 1}::ng-deep p-table .p-datatable .p-datatable-wrapper,::ng-deep p-table{height:100%}::ng-deep table{height:auto!important}\n"] }]
+            args: [{ selector: 'kv-table', template: "<div class=\"kv-table-container\">\r\n  @if (config) {\r\n  <p-table\r\n    #dt\r\n    styleClass=\"p-datatable-sm\"\r\n    [value]=\"dataSource\"\r\n    [(selection)]=\"selectedItems\"\r\n    [rowSelectable]=\"isRowSelectable\"\r\n    [columns]=\"config.columns\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [rows]=\"rows()\"\r\n    [paginator]=\"paginator\"\r\n    [rowsPerPageOptions]=\"rowsPerPageOptions\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [rowHover]=\"true\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [lazy]=\"config.lazy\"\r\n    [first]=\"first()\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (selectionChange)=\"selectionChange($event)\"\r\n    (onSort)=\"onSort($event)\"\r\n    (onPage)=\"onPage($event)\"\r\n    rowGroupMode=\"rowspan\"\r\n    [groupRowsBy]=\"config.fieldGroup\"\r\n    [showFirstLastIcon]=\"widthPage() > 960 ? true : false\"\r\n    [pageLinks]=\"widthPage() > 960 ? 2 : 1\"\r\n    [responsive]=\"true\"\r\n    [responsiveLayout]=\"responsiveLayout ? 'stack' : ''\"\r\n    [scrollable]=\"isTableScrollable\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [rowTrackBy]=\"rowTrackBy\"\r\n  >\r\n    @if (config?.enableCation) {\r\n    <ng-template pTemplate=\"caption\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between grid formgrid p-fluid col-12 p-1 m-0\"\r\n        [style.background-color]=\"'#f1f1f1'\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          @if (config.title) {\r\n          <div class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          } @if (config.subtitle) {\r\n          <div class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center md:col-6 lg:col-4 {{\r\n            widthPage() < 768 ? 'col-10' : 'col-12'\r\n          }}  gap-1 p-0\"\r\n        >\r\n          @if (config?.enableFilter) {\r\n          <span class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search text-sm\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"widthPage() > 800\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(dt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              autocomplete=\"off\"\r\n              #inputField\r\n              class=\"text-sm\"\r\n            />\r\n          </span>\r\n          } @if(filterColumnsBtn) {\r\n          <div #botaoFiltro>\r\n            <kv-button\r\n              id=\"botaoFiltro\"\r\n              [icon]=\"'align_vertical_top'\"\r\n              (onClick)=\"abrirMenuFiltro($event)\"\r\n              severity=\"tertiary\"\r\n              pTooltip=\"Ocultar/Exibir colunas\"\r\n              size=\"small\"\r\n            >\r\n            </kv-button>\r\n          </div>\r\n\r\n          <div\r\n            #menuFiltroDiv\r\n            id=\"menuFiltroDiv\"\r\n            [style.visibility]=\"'hidden'\"\r\n            class=\"absolute z-4 bg-gray-200 menu-columns-filtro\"\r\n          >\r\n            <p-card styleClass=\"p-1\">\r\n              <div\r\n                class=\"flex flex-column text-medium w-15rem p-1\"\r\n                *ngFor=\"let col of columnsFilter()\"\r\n              >\r\n                {{ checkMenuFiltro(col) }}\r\n                <p-checkbox\r\n                  #filterColumns\r\n                  [label]=\"col.header\"\r\n                  [binary]=\"true\"\r\n                  class=\"checkbox-container\"\r\n                  (onChange)=\"dinamicColumnSet($event, col)\"\r\n                  [(ngModel)]=\"col.checked\"\r\n                  *ngIf=\"!dinamicDisableColumn(col)\"\r\n                ></p-checkbox>\r\n              </div>\r\n            </p-card>\r\n          </div>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-2 justify-content-end gap-2 p-0\">\r\n          @for (action of config.actionsLote; track i; let i = $index) {\r\n          <div class=\"flex align-items-center justify-content-center\">\r\n            @if ((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            (getOrExecute(action.visible, selectedItems) ?? true)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"\r\n                (getOrExecute(action.tooltip, selectedItems)?.length ??\r\n                  0 > 7) &&\r\n                config.actionsLote &&\r\n                i == config.actionsLote.length - 1\r\n                  ? 'left'\r\n                  : 'bottom'\r\n              \"\r\n              [disabled]=\"getOrExecute(action.disabled, selectedItems) || false\"\r\n              [icon]=\"getOrExecute(action.icon, selectedItems)\"\r\n              [severity]=\"action.severity || 'tertiary'\"\r\n              size=\"small\"\r\n            />\r\n            }\r\n          </div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    }\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n        @if (config.enableSelect) {\r\n        <th>\r\n          <p-tableHeaderCheckbox\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n            [disabled]=\"disabledHeaderCheckbox\"\r\n          ></p-tableHeaderCheckbox>\r\n        </th>\r\n        } @for (col of columns; track $index) {\r\n        <th\r\n          [pSortableColumn]=\"col.field\"\r\n          [pSortableColumnDisabled]=\"col.sortable === false\"\r\n          [style.width]=\"col.width\"\r\n        >\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              col.centralize && 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <span class=\"text-xs font-medium\">{{ col.header }}</span>\r\n            @if (col.sortable) {\r\n            <p-sortIcon [field]=\"col.field\" class=\"pb-1\"></p-sortIcon>\r\n            } @if (col.headerTooltip) {\r\n            <span\r\n              class=\"material-symbols-outlined flex align-items-center\"\r\n              [pTooltip]=\"col.headerTooltip\"\r\n              >info</span\r\n            >\r\n            }\r\n          </div>\r\n        </th>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <th></th>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowData\r\n      let-columns=\"columns\"\r\n      let-rowgroup=\"rowgroup\"\r\n      let-rowspan=\"rowspan\"\r\n      let-rowIndex=\"rowIndex\"\r\n    >\r\n      <tr\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{\r\n          capitalize: tableCaptalized,\r\n          last: rowIndex === dataSource.length - 1\r\n        }\"\r\n        class=\"tr-td {{ isDisabledRow(rowData) ? 'disabled-row' : '' }}\"\r\n      >\r\n        @if (config.enableSelect) {\r\n        <td style=\"width: 8px !important\">\r\n          <p-tableCheckbox\r\n            [value]=\"rowData\"\r\n            [disabled]=\"isDisabledCheckbox(rowData)\"\r\n            (click)=\"activeItemLote(selectedItems)\"\r\n          ></p-tableCheckbox>\r\n        </td>\r\n        } @for (col of columns; track $index) {\r\n        <ng-container>\r\n          @if (rowgroup && !col.template) {\r\n          <td\r\n            [attr.rowspan]=\"rowgroup && col.grouped ? rowspan : null\"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n            class=\"{{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }}\"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"returnRowClass(rowData, col)\"\r\n            >\r\n              @if (!isChipField(col) && !col.iconField && !isImageField(col)) {\r\n              <span\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }} text-xs\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                @if(col.tagColor) {\r\n                <div\r\n                  class=\"tag\"\r\n                  [pTooltip]=\"\r\n                    col.tooltipTag &&\r\n                    col.tooltipTag(rowData, col, rowData[col.field])\r\n                  \"\r\n                  [style.background-color]=\"\r\n                    col.tagColor(rowData, col, rowData[col.field])\r\n                  \"\r\n                ></div>\r\n\r\n                } @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                  >{{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >\r\n                @if(col.switchDisable){\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col.switchDisable(rowData, col)\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                } @else {\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (!rowgroup && !col.grouped && !col.template) {\r\n          <td\r\n            #tableCell\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n            [pTooltip]=\"returnTooltipRow(rowData, col)\"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n\r\n            <span\r\n              *ngIf=\"!isBooleanField(rowData, col); else booleanField\"\r\n              [class]=\"\r\n                returnRowClass(rowData, col) +\r\n                ' flex flex-row gap-2 align-items-center ' +\r\n                (col.centralize && 'justify-content-center')\r\n              \"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n              [style.max-width]=\"ellipsisText() && returnMaxWidth(col.width)\"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"\r\n                  col.tooltipTag &&\r\n                  col.tooltipTag(rowData, col, rowData[col.field])\r\n                \"\r\n                [style.background-color]=\"\r\n                  col.tagColor(rowData, col, rowData[col.field])\r\n                \"\r\n              ></div>\r\n\r\n              } @if (!isChipField(col) && !col.iconField && !isImageField(col)){\r\n              <span class=\"text-xs {{ ellipsisText() && 'ellipsis-text' }}\">\r\n                @if (col.icon) {\r\n                <i [class]=\"col.icon + ' mr-2'\"></i>\r\n                }\r\n                {{ transformValue(rowData, col) }}\r\n              </span>\r\n              } @if (isChipField(col) && !col.iconField) {\r\n              <div>\r\n                <span\r\n                  [class]=\"returnClassChip(rowData, col)\"\r\n                  [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n                  class=\"text-xs\"\r\n                >\r\n                  {{ transformValue(rowData, col) }}</span\r\n                >\r\n              </div>\r\n              }\r\n            </span>\r\n\r\n            @if (isImageField(col)) {\r\n            <span>\r\n              <span>\r\n                <img class=\"image\" [src]=\"loadImage(rowData, col)\" />\r\n              </span>\r\n            </span>\r\n            } @if (col.iconField) {\r\n            <i\r\n              [ngClass]=\"{\r\n                'material-icons': col.indIconMaterial,\r\n                'material-symbols-outlined mr-2': !col.indIconMaterial\r\n              }\"\r\n              [pTooltip]=\"returnTooltipIcon(rowData, col)\"\r\n            >\r\n              {{ returnClassIcon(rowData, col) }}\r\n            </i>\r\n            }\r\n\r\n            <ng-template #booleanField>\r\n              @if (!col.iconField && !isSwitchField(col)) {\r\n              <div\r\n                class=\"flex flex-row gap-2 align-items-center {{\r\n                  col.centralize && 'justify-content-center'\r\n                }}\"\r\n                [pTooltip]=\"\r\n                  col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n                \"\r\n              >\r\n                <i\r\n                  [ngClass]=\"\r\n                    rowData[col.field] ? 'text-green-500' : 'text-red-500'\r\n                  \"\r\n                  ><span\r\n                    class=\"material-symbols-outlined text-lg font-semibold\"\r\n                  >\r\n                    {{ rowData[col.field] ? \"check\" : \"close\" }}\r\n                  </span>\r\n                </i>\r\n              </div>\r\n              } @if (isSwitchField(col)) {\r\n              <span\r\n                [class]=\"\r\n                  returnRowClass(rowData, col) +\r\n                  ' flex flex-row align-items-center justify-content-center'\r\n                \"\r\n              >\r\n                @if(col.switchDisable){\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col.switchDisable(rowData, col)\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                } @else {\r\n                <kv-switch\r\n                  (onSwitchChange)=\"onSwitchChange($event, rowData, col)\"\r\n                  [disabled]=\"col?.onlyReadField ?? true\"\r\n                  [switchValue]=\"transformValue(rowData, col)\"\r\n                >\r\n                </kv-switch>\r\n                }\r\n              </span>\r\n              }\r\n            </ng-template>\r\n          </td>\r\n          } @if (col.template) {\r\n          <td\r\n            class=\"rowTable {{\r\n              col.styleClass\r\n                ? col.styleClass(rowData, col, rowData[col.field])\r\n                : ''\r\n            }} \"\r\n          >\r\n            <span class=\"p-column-title\">{{ col.header }}:</span>\r\n            @if (getCustomTemplate(col.template.name)) {\r\n\r\n            <div\r\n              class=\"flex flex-row gap-2 align-items-center {{\r\n                col.centralize && ' justify-content-center'\r\n              }}\"\r\n              [pTooltip]=\"\r\n                col.tooltip && col.tooltip(rowData, col, rowData[col.field])\r\n              \"\r\n            >\r\n              @if(col.tagColor) {\r\n              <div\r\n                class=\"tag\"\r\n                [pTooltip]=\"col.tooltipTag && col.tooltipTag(rowData, col)\"\r\n                [style.background-color]=\"col.tagColor(rowData, col)\"\r\n              ></div>\r\n              }\r\n\r\n              <div class=\"w-full\">\r\n                <ng-container\r\n                  [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n                  [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                />\r\n              </div>\r\n            </div>\r\n            }\r\n          </td>\r\n          }\r\n        </ng-container>\r\n        } @if (config.actions && config.actions.length > 0) {\r\n        <td>\r\n          <div class=\"flex flex-row justify-content-end w-full\">\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz\"\r\n              style=\"font-size: 20px; padding: 0.15rem\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            <p-tieredMenu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"tableActions[rowIndex - actionsOffset]\"\r\n              appendTo=\"body\"\r\n            ></p-tieredMenu>\r\n          </div>\r\n        </td>\r\n        }\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\" let-columns>\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"columns.length + 2\"\r\n          style=\"text-align: center; border-radius: 10px !important\"\r\n        >\r\n          <p class=\"font-medium m-0 text-sm\">Nenhum registro encontrado</p>\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n  }\r\n</div>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/icon?family=Material+Icons\"\r\n/>\r\n\r\n<link\r\n  rel=\"stylesheet\"\r\n  href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\"\r\n/>\r\n", styles: ["::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar{width:6px}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-datatable>.p-datatable-wrapper:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-datatable>.p-datatable-wrapper::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.tag{width:5px;height:20px;border-radius:.25rem}::ng-deep .p-panel .p-panel-header{border:none!important}:host ::ng-deep .p-datatable-header{background-color:#860000!important;padding:0!important;border-radius:5px!important}::ng-deep .p-panel.p-panel-toggleable .p-panel-header{background-color:#f1f1f1}::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{background-color:#f1f1f1;padding:.15rem}.icon-more-horiz{font-weight:700}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}.tr-td{overflow-wrap:anywhere}.tr-td:hover{box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;background-color:#fff;transition:color .3s,transform .3s;transform:scale(1)}.tr-td:hover.last{box-shadow:-1px -1px 9px -3px #000000bf;-webkit-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75);-moz-box-shadow:-1px -1px 9px -3px rgba(0,0,0,.75)}.disabled-row{pointer-events:none;opacity:.6;background-color:#dddddd8e}::ng-deep .p-tooltip{pointer-events:auto}.btn-table{background-color:#29b92d;padding:12px}.btn-table:hover{background-color:#249a29}.btn-table:active{background-color:#1c801f}.btn-table:disabled{background-color:#29b92d}::ng-deep svg.p-icon{width:.65rem;height:.65rem}::ng-deep .p-checkbox .p-checkbox-box.p-highlight{border-color:#004172;background:#004172}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:hover{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:active{background-color:#002542}::ng-deep .p-checkbox .p-checkbox-box.p-highlight:disabled{background-color:#002542;opacity:.4;cursor:auto}input{height:1.75rem}::ng-deep .p-checkbox .p-checkbox-box{width:1.125rem;height:1.125rem;border:1.5px solid #d1d5db}::ng-deep .p-checkbox{display:flex!important;align-items:center!important;justify-content:center}::ng-deep .p-checkbox-label{font-size:.875rem}::ng-deep .p-datatable .p-paginator-bottom{scale:.75}::ng-deep .p-menuitem-text{font-size:.875rem}::ng-deep .p-tieredmenu .p-menuitem>.p-menuitem-content .p-menuitem-link{padding:.5rem .75rem}::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.15rem}:host{height:100%}::ng-deep .kv-table-container,::ng-deep p-table{height:100%}::ng-deep p-table .p-datatable{display:flex;flex-direction:column;height:100%}::ng-deep .p-datatable .p-datatable-wrapper{flex:1 1 1}::ng-deep p-table .p-datatable .p-datatable-wrapper,::ng-deep p-table{height:100%}::ng-deep table{height:auto!important}.ellipsis-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;display:inline-block}\n"] }]
         }], ctorParameters: () => [{ type: i1.DatePipe }, { type: i1.DecimalPipe }, { type: CpfCnpjPipe }, { type: TelefonePipe }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { templates: [{
                 type: ContentChildren,
                 args: [TemplateDirective]
@@ -5300,10 +5308,12 @@ class KvInputCalendarComponent extends BaseComponentInput {
                     month.length === 2 &&
                     year.length === 4) {
                     const objDate = new Date(+year, +month - 1, +day);
-                    if (!isNaN(objDate.getTime())) {
-                        // Verifica se a data é válida
+                    if ((!isNaN(objDate.getTime())) && !(+month > 12 || +day > 31)) {
                         this.dateFilter.value = objDate; // Atribui a data sem barras ao dateFilter
                     }
+                    else {
+                        this.formControl?.setErrors({ invalidDate: true, erroMessage: 'Data Invalida!' });
+                    }
                 }
             }
         }
@@ -7624,7 +7634,7 @@ class WorkspaceEmpresaComponent {
         this.onEmpresaSelecionada.emit(this.empresaSelecionada);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceEmpresaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceEmpresaComponent, selector: "kv-workspace-empresa", inputs: { empresas: "empresas", empresaSelecionada: "empresaSelecionada", totalEmpresas: "totalEmpresas" }, outputs: { onEmpresaSelecionada: "onEmpresaSelecionada", onPaginate: "onPaginate" }, ngImport: i0, template: "<kv-table\r\n  [config]=\"tableConfig\"\r\n  [dataSource]=\"empresas\"\r\n  [isTableScrollable]=\"true\"\r\n  [paginator]=\"true\"\r\n  [rows]=\"5\"\r\n  [rowsPerPageOptions]=\"[5]\"\r\n  [scrollHeight]=\"'300px'\"\r\n  [tableSize]=\"5\"\r\n  [totalRecords]=\"totalEmpresas\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  (onPaginate)=\"paginate($event)\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceEmpresaComponent, selector: "kv-workspace-empresa", inputs: { empresas: "empresas", empresaSelecionada: "empresaSelecionada", totalEmpresas: "totalEmpresas" }, outputs: { onEmpresaSelecionada: "onEmpresaSelecionada", onPaginate: "onPaginate" }, ngImport: i0, template: "<kv-table\r\n  [config]=\"tableConfig\"\r\n  [dataSource]=\"empresas\"\r\n  [isTableScrollable]=\"true\"\r\n  [paginator]=\"true\"\r\n  [rows]=\"5\"\r\n  [rowsPerPageOptions]=\"[5]\"\r\n  [scrollHeight]=\"'300px'\"\r\n  [tableSize]=\"5\"\r\n  [totalRecords]=\"totalEmpresas\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  (onPaginate)=\"paginate($event)\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon", "ellipsisText"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceEmpresaComponent, decorators: [{
             type: Component,
@@ -7688,7 +7698,7 @@ class WorkspaceMasterComponent {
         this.onMasterSelecionada.emit(this.masterSelecionada);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceMasterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceMasterComponent, selector: "kv-workspace-master", inputs: { masters: "masters", masterSelecionada: "masterSelecionada" }, outputs: { onMasterSelecionada: "onMasterSelecionada" }, ngImport: i0, template: "<kv-table\r\n  [tableSize]=\"5\"\r\n  [rows]=\"5\"\r\n  [config]=\"tableConfig\"\r\n  [paginator]=\"false\"\r\n  [dataSource]=\"dataSource\"\r\n  [rowsPerPageOptions]=\"[5, 10, 25, 50, 100, 200]\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  [isTableScrollable]=\"true\"\r\n  [scrollHeight]=\"'300px'\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: WorkspaceMasterComponent, selector: "kv-workspace-master", inputs: { masters: "masters", masterSelecionada: "masterSelecionada" }, outputs: { onMasterSelecionada: "onMasterSelecionada" }, ngImport: i0, template: "<kv-table\r\n  [tableSize]=\"5\"\r\n  [rows]=\"5\"\r\n  [config]=\"tableConfig\"\r\n  [paginator]=\"false\"\r\n  [dataSource]=\"dataSource\"\r\n  [rowsPerPageOptions]=\"[5, 10, 25, 50, 100, 200]\"\r\n  (doubleClickEvent)=\"doubleClick($event)\"\r\n  (onActiveItem)=\"activeItem($event)\"\r\n  [isTableScrollable]=\"true\"\r\n  [scrollHeight]=\"'300px'\">\r\n</kv-table>", styles: [""], dependencies: [{ kind: "component", type: KvTableComponent, selector: "kv-table", inputs: ["templates", "config", "first", "rows", "defaultSortField", "dataSource", "selectedItems", "totalRecords", "paginator", "rowsPerPageOptions", "tableSize", "filterColumnsBtn", "replaceEmptyValues", "filtrosAvancados", "scrollHeight", "isTableScrollable", "tableCaptalized", "rowTrackBy", "responsiveLayout", "disabledHeaderCheckbox", "applyStyle", "pageLinksOptions", "showFirstLastIcon", "ellipsisText"], outputs: ["firstChange", "rowsChange", "onActiveItem", "onActiveItemLote", "onPaginate", "onSelectionChange", "doubleClickEvent", "filterField", "onSwitchTableChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WorkspaceMasterComponent, decorators: [{
             type: Component,
@@ -9604,11 +9614,11 @@ class KvContentViewerComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvContentViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvContentViewerComponent, selector: "kv-content-viewer", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, arquivo: { classPropertyName: "arquivo", publicName: "arquivo", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, blob: { classPropertyName: "blob", publicName: "blob", isSignal: true, isRequired: false, transformFunction: null }, ekpContent: { classPropertyName: "ekpContent", publicName: "ekpContent", isSignal: true, isRequired: false, transformFunction: null }, extencaoDocumento: { classPropertyName: "extencaoDocumento", publicName: "extencaoDocumento", isSignal: false, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: false, isRequired: false, transformFunction: null }, visualizadorDocumentos: { classPropertyName: "visualizadorDocumentos", publicName: "visualizadorDocumentos", isSignal: false, isRequired: false, transformFunction: null }, cardTemplate: { classPropertyName: "cardTemplate", publicName: "cardTemplate", isSignal: false, isRequired: false, transformFunction: null }, contentTemplate: { classPropertyName: "contentTemplate", publicName: "contentTemplate", isSignal: false, isRequired: false, transformFunction: null }, noDocumentSelectedTemplate: { classPropertyName: "noDocumentSelectedTemplate", publicName: "noDocumentSelectedTemplate", isSignal: false, isRequired: false, transformFunction: null }, noDocumentListTemplate: { classPropertyName: "noDocumentListTemplate", publicName: "noDocumentListTemplate", isSignal: false, isRequired: false, transformFunction: null }, indvisualizado: { classPropertyName: "indvisualizado", publicName: "indvisualizado", isSignal: false, isRequired: false, transformFunction: null }, btnTelaCheia: { classPropertyName: "btnTelaCheia", publicName: "btnTelaCheia", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onScrollHandler: "onScrollHandler", onSelectFile: "onSelectFile" }, ngImport: i0, template: "<div class=\"flex flex-column md:flex-row gap-2 mt-3 custom-max-height\" style=\"height: 1000vh;\">\r\n  <!-- Lista de documentos -->\r\n  <div\r\n    class=\"card-perfil overflow-x-hidden\"\r\n    (scroll)=\"scrollHandler($event)\"\r\n    [ngClass]=\"{\r\n      'overflow-y-scroll': dataSource().length > 0,\r\n      'overflow-y-hidden': dataSource().length === 0\r\n    }\"\r\n    style=\"position: relative; max-height: calc(100vh - 100px);\"\r\n  >\r\n    <div *ngIf=\"dataSource().length > 0; else emptyDocumentList\" class=\"col-12\">\r\n      <!-- Lista de cards -->\r\n      <div\r\n        *ngFor=\"let option of dataSource(); trackBy: trackByFn\"\r\n        class=\"card-normal outline-none border-round-xl w-full p-2 m-1 grid p-fluid flex flex-row flex-nowrap align-items-center justify-content-center cursor-pointer\"\r\n        style=\"min-height: 5rem\"\r\n        (click)=\"visualizarPreview(option)\"\r\n        [ngClass]=\"{\r\n    'card-naoVisualizado': !isVisualizado(option),\r\n    'card-selected': option === arquivoPreview(),\r\n    'card-normal': option !== arquivoPreview(),\r\n   }\"\r\n      >\r\n        <div class=\"flex flex-grow-1 ml-2 flex-column gap-1 m-0 p-0 overflow-hidden text-overflow-ellipsis \" style=\"max-width: 100%;\">\r\n          <ng-container *ngIf=\"cardTemplate; else defaultTemplate\">\r\n            <ng-container \r\n              *ngTemplateOutlet=\"cardTemplate; context: { $implicit: option }\"\r\n            ></ng-container>\r\n          </ng-container>\r\n        </div>\r\n        <ng-template #defaultTemplate>\r\n          <div class=\"card-common-style default-card\">\r\n            <h1 class=\"font-bold text-base p-0 m-0\">Bem-vindo!</h1>\r\n            <p class=\"text-sm mt-2\">\r\n              Kv-file-preview aguardando um template...\r\n            </p>\r\n            <p class=\"font-bold text-sm p-0 m-0\">Data: {{ todayDate() }}</p>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n\r\n    <ng-template #emptyDocumentList>\r\n      @if(!noDocumentListTemplate) {\r\n      <div class=\"text-center text-gray-600 mt-4 m-3\" style=\"height: 100%\">\r\n        <div class=\" flex align-items-center gap-1\">\r\n          <span class=\"material-symbols-outlined\"> inbox </span>\r\n          <p>Nenhum documento dispon\u00EDvel.</p>\r\n        </div>\r\n      </div>\r\n      } @else {\r\n      <div class=\"text-center mt-4 m-3\" style=\"height: 100%\">\r\n        <ng-container *ngTemplateOutlet=\"noDocumentListTemplate\"></ng-container>\r\n      </div>\r\n      }\r\n    </ng-template>\r\n\r\n    <!-- Contador de documentos - Fixo na parte inferior -->\r\n    <div\r\n      class=\"sticky-counter flex flex-row flex-1 px-2 justify-content-center p-2\"\r\n      style=\"position: sticky; bottom: 0; background-color: white\"\r\n    >\r\n      <span>{{ totalItensCarregado() }} de {{ totalRecords }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Visualizador -->\r\n  <div  id=\"fullscreenDiv\" class=\"card-perfil col-12 md:col-8 lg:col-9\" style=\"position: relative\">\r\n    @if(btnTelaCheia)\r\n    {\r\n      <div class=\"grid\">\r\n      <div class=\"col\"></div>\r\n      <span id=\"fullscreenBtn\" (click)=\"alternarTelaCheia()\" class=\"material-symbols-outlined p-2 text-xl cursor-pointer\">\r\n        open_in_full\r\n        </span>\r\n      </div>\r\n    }\r\n    @if(visualizadorDocumentos) {\r\n      <ng-container *ngIf=\"arquivo(); else noDocumentSelected\">\r\n        @if(isLoading) {\r\n        <ngx-loading\r\n          [show]=\"isLoading\"\r\n          [config]=\"{ backdropBorderRadius: '3px', fullScreenBackdrop: false }\"\r\n        ></ngx-loading>\r\n        }\r\n        <kv-file-viewer-novo\r\n        *ngIf=\"extencaoDocumento !== 'ekp'\"\r\n          [arquivo]=\"arquivo()!\"\r\n          [type]=\"type()!\"\r\n          [blob]=\"blob()!\"\r\n          [width]=\"'100%'\" \r\n          [height]=\"'100%'\"\r\n          class=\"file-viewer\"\r\n        >\r\n        </kv-file-viewer-novo>\r\n  \r\n        <div\r\n          id=\"html-content\"\r\n          [innerHTML]=\"ekpContent()\"\r\n          *ngIf=\"extencaoDocumento === 'ekp'\"\r\n          class=\"ekp-content\"\r\n        ></div>\r\n      </ng-container>\r\n    } @else {\r\n      <ng-container *ngIf=\"arquivoPreview(); else noDocumentSelected\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            contentTemplate;\r\n            context: { $implicit: arquivoPreview() }\r\n          \"\r\n        ></ng-container>\r\n      </ng-container>\r\n    }\r\n    <ng-template #noDocumentSelected>\r\n      @if(!noDocumentSelectedTemplate) {\r\n      <div\r\n        class=\"no-document-message flex flex-column align-items-center justify-content-center\"\r\n        style=\"height: 100%\"\r\n      >\r\n        <p class=\"text-center text-gray-500\">\r\n          Selecione um arquivo para visualiza\u00E7\u00E3o\r\n        </p>\r\n        <img\r\n          [src]=\"\r\n            'https://work-assets.keevo.com.br/img/Digital_personal_files-pana_3.png'\r\n          \"\r\n          style=\"max-height: 50%; margin-top: 2rem;\"\r\n          alt=\"\"\r\n        />\r\n      </div>\r\n      } @else {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"noDocumentSelectedTemplate\"\r\n      ></ng-container>\r\n      }\r\n    </ng-template>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.farol-statuspublicacao{margin-right:.5rem;width:.35rem;border-radius:1rem;-webkit-border-radius:1rem;-moz-border-radius:1rem;-ms-border-radius:1rem;-o-border-radius:1rem}:host ::ng-deep .p-sidebar{border-radius:5px;position:absolute;height:var(--sidebar-height)}:host ::ng-deep .p-sidebar .p-sidebar-content{overflow:auto;border:1px solid #e5e7eb;border-radius:5px;margin-top:1rem}.card-perfil{border:1.5px solid #CBD5E1;background:#fff;border-radius:6px;max-height:100%}:host ::ng-deep .p-fieldset .p-fieldset-content{padding-bottom:0}:host ::ng-deep .p-sidebar .p-sidebar-close{display:none}.card-normal{border:1.5px solid #CBD5E1}.card-naoVisualizado{border-left:4px solid #e6671f!important}.parent-container{height:100%;display:flex;flex-direction:column}.file-viewer{margin:auto}.ekp-content{min-height:20rem;padding:1rem;overflow-y:auto;border-radius:5px}ngx-loading{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1000}.card{transition:all .3s ease;border:1px solid transparent}.card-normal:hover{border:1px solid #a9a9a9;box-shadow:0 4px 8px #0000001a}.card-selected{background-color:#f0f0f0;border:1px solid #c0c0c0;box-shadow:0 6px 12px #00000026;transform:scale(1.02)}.loading-spinner{display:flex;align-items:center;justify-content:center;height:100%;font-size:1.5rem;color:#666}#html-content{width:100%;height:100%;overflow-y:auto}:host ::ng-deep .list-card-button .kv-button{width:22px;height:22px}:host ::ng-deep .list-card-button .kv-button .material-symbols-outlined.only-icon.icon-normal[_ngcontent-ng-c4083184952]{font-size:1rem}.custom-max-height{max-height:calc(100vh - 300px)}@media (max-height: 915px){.custom-max-height{max-height:94%}}@media (max-height: 805px){.custom-max-height{max-height:90%}}@media (max-height: 720px){.custom-max-height{max-height:85%}}.download-icon{font-size:20px;cursor:pointer;transition:transform .3s ease,color .3s ease}.download-icon:hover{color:#0f6cbd;transform:scale(1.2)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KvFileViewerNovoComponent, selector: "kv-file-viewer-novo", inputs: ["arquivo", "type", "blob", "width", "height"] }, { kind: "component", type: i1$6.NgxLoadingComponent, selector: "ngx-loading", inputs: ["show", "config", "template"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvContentViewerComponent, selector: "kv-content-viewer", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, arquivo: { classPropertyName: "arquivo", publicName: "arquivo", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, blob: { classPropertyName: "blob", publicName: "blob", isSignal: true, isRequired: false, transformFunction: null }, ekpContent: { classPropertyName: "ekpContent", publicName: "ekpContent", isSignal: true, isRequired: false, transformFunction: null }, extencaoDocumento: { classPropertyName: "extencaoDocumento", publicName: "extencaoDocumento", isSignal: false, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: false, isRequired: false, transformFunction: null }, visualizadorDocumentos: { classPropertyName: "visualizadorDocumentos", publicName: "visualizadorDocumentos", isSignal: false, isRequired: false, transformFunction: null }, cardTemplate: { classPropertyName: "cardTemplate", publicName: "cardTemplate", isSignal: false, isRequired: false, transformFunction: null }, contentTemplate: { classPropertyName: "contentTemplate", publicName: "contentTemplate", isSignal: false, isRequired: false, transformFunction: null }, noDocumentSelectedTemplate: { classPropertyName: "noDocumentSelectedTemplate", publicName: "noDocumentSelectedTemplate", isSignal: false, isRequired: false, transformFunction: null }, noDocumentListTemplate: { classPropertyName: "noDocumentListTemplate", publicName: "noDocumentListTemplate", isSignal: false, isRequired: false, transformFunction: null }, indvisualizado: { classPropertyName: "indvisualizado", publicName: "indvisualizado", isSignal: false, isRequired: false, transformFunction: null }, btnTelaCheia: { classPropertyName: "btnTelaCheia", publicName: "btnTelaCheia", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onScrollHandler: "onScrollHandler", onSelectFile: "onSelectFile" }, ngImport: i0, template: "<div class=\"flex flex-column md:flex-row gap-2 mt-3 custom-max-height\" style=\"height: 100%;\">\r\n  <!-- Lista de documentos -->\r\n  <div\r\n    class=\"card-perfil overflow-x-hidden\"\r\n    (scroll)=\"scrollHandler($event)\"\r\n    [ngClass]=\"{\r\n      'overflow-y-scroll': dataSource().length > 0,\r\n      'overflow-y-hidden': dataSource().length === 0\r\n    }\"\r\n    style=\"position: relative; height: 100%; min-height: 15rem;\"\r\n  >\r\n    <div *ngIf=\"dataSource().length > 0; else emptyDocumentList\" class=\"col-12\">\r\n      <!-- Lista de cards -->\r\n      <div\r\n        *ngFor=\"let option of dataSource(); trackBy: trackByFn\"\r\n        class=\"card-normal outline-none border-round-xl w-full p-2 m-1 grid p-fluid flex flex-row flex-nowrap align-items-center justify-content-center cursor-pointer\"\r\n        style=\"min-height: 5rem\"\r\n        (click)=\"visualizarPreview(option)\"\r\n        [ngClass]=\"{\r\n    'card-naoVisualizado': !isVisualizado(option),\r\n    'card-selected': option === arquivoPreview(),\r\n    'card-normal': option !== arquivoPreview(),\r\n   }\"\r\n      >\r\n        <div class=\"flex flex-grow-1 ml-2 flex-column gap-1 m-0 p-0 overflow-hidden text-overflow-ellipsis \" style=\"max-width: 100%;\">\r\n          <ng-container *ngIf=\"cardTemplate; else defaultTemplate\">\r\n            <ng-container \r\n              *ngTemplateOutlet=\"cardTemplate; context: { $implicit: option }\"\r\n            ></ng-container>\r\n          </ng-container>\r\n        </div>\r\n        <ng-template #defaultTemplate>\r\n          <div class=\"card-common-style default-card\">\r\n            <h1 class=\"font-bold text-base p-0 m-0\">Bem-vindo!</h1>\r\n            <p class=\"text-sm mt-2\">\r\n              Kv-file-preview aguardando um template...\r\n            </p>\r\n            <p class=\"font-bold text-sm p-0 m-0\">Data: {{ todayDate() }}</p>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n\r\n    <ng-template #emptyDocumentList>\r\n      @if(!noDocumentListTemplate) {\r\n      <div class=\"text-center text-gray-600 mt-4 m-3\" style=\"height: 100%\">\r\n        <div class=\" flex align-items-center gap-1\">\r\n          <span class=\"material-symbols-outlined\"> inbox </span>\r\n          <p>Nenhum documento dispon\u00EDvel.</p>\r\n        </div>\r\n      </div>\r\n      } @else {\r\n      <div class=\"text-center mt-4 m-3\" style=\"height: 100%\">\r\n        <ng-container *ngTemplateOutlet=\"noDocumentListTemplate\"></ng-container>\r\n      </div>\r\n      }\r\n    </ng-template>\r\n\r\n    <!-- Contador de documentos - Fixo na parte inferior -->\r\n    <div\r\n      class=\"sticky-counter flex flex-row flex-1 px-2 justify-content-center p-2\"\r\n      style=\"position: sticky; bottom: 0; background-color: white\"\r\n    >\r\n      <span>{{ totalItensCarregado() }} de {{ totalRecords }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Visualizador -->\r\n  <div  id=\"fullscreenDiv\" class=\"card-perfil col-12 md:col-8 lg:col-9\" style=\"position: relative; height: 100%;\">\r\n    @if(btnTelaCheia)\r\n    {\r\n      <div class=\"grid\">\r\n      <div class=\"col\"></div>\r\n      <span id=\"fullscreenBtn\" (click)=\"alternarTelaCheia()\" class=\"material-symbols-outlined p-2 text-xl cursor-pointer\">\r\n        open_in_full\r\n        </span>\r\n      </div>\r\n    }\r\n    @if(visualizadorDocumentos) {\r\n      <ng-container *ngIf=\"arquivo(); else noDocumentSelected\">\r\n        @if(isLoading) {\r\n        <ngx-loading\r\n          [show]=\"isLoading\"\r\n          [config]=\"{ backdropBorderRadius: '3px', fullScreenBackdrop: false }\"\r\n        ></ngx-loading>\r\n        }\r\n        <kv-file-viewer-novo\r\n        *ngIf=\"extencaoDocumento !== 'ekp'\"\r\n          [arquivo]=\"arquivo()!\"\r\n          [type]=\"type()!\"\r\n          [blob]=\"blob()!\"\r\n          [width]=\"'100%'\" \r\n          [height]=\"'100%'\"\r\n          class=\"file-viewer\"\r\n        >\r\n        </kv-file-viewer-novo>\r\n  \r\n        <div\r\n          id=\"html-content\"\r\n          [innerHTML]=\"ekpContent()\"\r\n          *ngIf=\"extencaoDocumento === 'ekp'\"\r\n          class=\"ekp-content\"\r\n        ></div>\r\n      </ng-container>\r\n    } @else {\r\n      <ng-container *ngIf=\"arquivoPreview(); else noDocumentSelected\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            contentTemplate;\r\n            context: { $implicit: arquivoPreview() }\r\n          \"\r\n        ></ng-container>\r\n      </ng-container>\r\n    }\r\n    <ng-template #noDocumentSelected>\r\n      @if(!noDocumentSelectedTemplate) {\r\n      <div\r\n        class=\"no-document-message flex flex-column align-items-center justify-content-center\"\r\n        style=\"height: 100%\"\r\n      >\r\n        <p class=\"text-center text-gray-500\">\r\n          Selecione um arquivo para visualiza\u00E7\u00E3o\r\n        </p>\r\n        <img\r\n          [src]=\"\r\n            'https://work-assets.keevo.com.br/img/Digital_personal_files-pana_3.png'\r\n          \"\r\n          style=\"max-height: 50%; margin-top: 2rem;\"\r\n          alt=\"\"\r\n        />\r\n      </div>\r\n      } @else {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"noDocumentSelectedTemplate\"\r\n      ></ng-container>\r\n      }\r\n    </ng-template>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.farol-statuspublicacao{margin-right:.5rem;width:.35rem;border-radius:1rem;-webkit-border-radius:1rem;-moz-border-radius:1rem;-ms-border-radius:1rem;-o-border-radius:1rem}:host ::ng-deep .p-sidebar{border-radius:5px;position:absolute;height:var(--sidebar-height)}:host ::ng-deep .p-sidebar .p-sidebar-content{overflow:auto;border:1px solid #e5e7eb;border-radius:5px;margin-top:1rem}.card-perfil{border:1.5px solid #CBD5E1;background:#fff;border-radius:6px;max-height:100%}:host ::ng-deep .p-fieldset .p-fieldset-content{padding-bottom:0}:host ::ng-deep .p-sidebar .p-sidebar-close{display:none}.card-normal{border:1.5px solid #CBD5E1}.card-naoVisualizado{border-left:4px solid #e6671f!important}.parent-container{height:100%;display:flex;flex-direction:column}.file-viewer{margin:auto}.ekp-content{min-height:20rem;padding:1rem;overflow-y:auto;border-radius:5px}ngx-loading{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1000}.card{transition:all .3s ease;border:1px solid transparent}.card-normal:hover{border:1px solid #a9a9a9;box-shadow:0 4px 8px #0000001a}.card-selected{background-color:#f0f0f0;border:1px solid #c0c0c0;box-shadow:0 6px 12px #00000026;transform:scale(1.02)}.loading-spinner{display:flex;align-items:center;justify-content:center;height:100%;font-size:1.5rem;color:#666}#html-content{width:100%;height:100%;overflow-y:auto}:host ::ng-deep .list-card-button .kv-button{width:22px;height:22px}:host ::ng-deep .list-card-button .kv-button .material-symbols-outlined.only-icon.icon-normal[_ngcontent-ng-c4083184952]{font-size:1rem}.download-icon{font-size:20px;cursor:pointer;transition:transform .3s ease,color .3s ease}.download-icon:hover{color:#0f6cbd;transform:scale(1.2)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KvFileViewerNovoComponent, selector: "kv-file-viewer-novo", inputs: ["arquivo", "type", "blob", "width", "height"] }, { kind: "component", type: i1$6.NgxLoadingComponent, selector: "ngx-loading", inputs: ["show", "config", "template"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvContentViewerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-content-viewer', template: "<div class=\"flex flex-column md:flex-row gap-2 mt-3 custom-max-height\" style=\"height: 1000vh;\">\r\n  <!-- Lista de documentos -->\r\n  <div\r\n    class=\"card-perfil overflow-x-hidden\"\r\n    (scroll)=\"scrollHandler($event)\"\r\n    [ngClass]=\"{\r\n      'overflow-y-scroll': dataSource().length > 0,\r\n      'overflow-y-hidden': dataSource().length === 0\r\n    }\"\r\n    style=\"position: relative; max-height: calc(100vh - 100px);\"\r\n  >\r\n    <div *ngIf=\"dataSource().length > 0; else emptyDocumentList\" class=\"col-12\">\r\n      <!-- Lista de cards -->\r\n      <div\r\n        *ngFor=\"let option of dataSource(); trackBy: trackByFn\"\r\n        class=\"card-normal outline-none border-round-xl w-full p-2 m-1 grid p-fluid flex flex-row flex-nowrap align-items-center justify-content-center cursor-pointer\"\r\n        style=\"min-height: 5rem\"\r\n        (click)=\"visualizarPreview(option)\"\r\n        [ngClass]=\"{\r\n    'card-naoVisualizado': !isVisualizado(option),\r\n    'card-selected': option === arquivoPreview(),\r\n    'card-normal': option !== arquivoPreview(),\r\n   }\"\r\n      >\r\n        <div class=\"flex flex-grow-1 ml-2 flex-column gap-1 m-0 p-0 overflow-hidden text-overflow-ellipsis \" style=\"max-width: 100%;\">\r\n          <ng-container *ngIf=\"cardTemplate; else defaultTemplate\">\r\n            <ng-container \r\n              *ngTemplateOutlet=\"cardTemplate; context: { $implicit: option }\"\r\n            ></ng-container>\r\n          </ng-container>\r\n        </div>\r\n        <ng-template #defaultTemplate>\r\n          <div class=\"card-common-style default-card\">\r\n            <h1 class=\"font-bold text-base p-0 m-0\">Bem-vindo!</h1>\r\n            <p class=\"text-sm mt-2\">\r\n              Kv-file-preview aguardando um template...\r\n            </p>\r\n            <p class=\"font-bold text-sm p-0 m-0\">Data: {{ todayDate() }}</p>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n\r\n    <ng-template #emptyDocumentList>\r\n      @if(!noDocumentListTemplate) {\r\n      <div class=\"text-center text-gray-600 mt-4 m-3\" style=\"height: 100%\">\r\n        <div class=\" flex align-items-center gap-1\">\r\n          <span class=\"material-symbols-outlined\"> inbox </span>\r\n          <p>Nenhum documento dispon\u00EDvel.</p>\r\n        </div>\r\n      </div>\r\n      } @else {\r\n      <div class=\"text-center mt-4 m-3\" style=\"height: 100%\">\r\n        <ng-container *ngTemplateOutlet=\"noDocumentListTemplate\"></ng-container>\r\n      </div>\r\n      }\r\n    </ng-template>\r\n\r\n    <!-- Contador de documentos - Fixo na parte inferior -->\r\n    <div\r\n      class=\"sticky-counter flex flex-row flex-1 px-2 justify-content-center p-2\"\r\n      style=\"position: sticky; bottom: 0; background-color: white\"\r\n    >\r\n      <span>{{ totalItensCarregado() }} de {{ totalRecords }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Visualizador -->\r\n  <div  id=\"fullscreenDiv\" class=\"card-perfil col-12 md:col-8 lg:col-9\" style=\"position: relative\">\r\n    @if(btnTelaCheia)\r\n    {\r\n      <div class=\"grid\">\r\n      <div class=\"col\"></div>\r\n      <span id=\"fullscreenBtn\" (click)=\"alternarTelaCheia()\" class=\"material-symbols-outlined p-2 text-xl cursor-pointer\">\r\n        open_in_full\r\n        </span>\r\n      </div>\r\n    }\r\n    @if(visualizadorDocumentos) {\r\n      <ng-container *ngIf=\"arquivo(); else noDocumentSelected\">\r\n        @if(isLoading) {\r\n        <ngx-loading\r\n          [show]=\"isLoading\"\r\n          [config]=\"{ backdropBorderRadius: '3px', fullScreenBackdrop: false }\"\r\n        ></ngx-loading>\r\n        }\r\n        <kv-file-viewer-novo\r\n        *ngIf=\"extencaoDocumento !== 'ekp'\"\r\n          [arquivo]=\"arquivo()!\"\r\n          [type]=\"type()!\"\r\n          [blob]=\"blob()!\"\r\n          [width]=\"'100%'\" \r\n          [height]=\"'100%'\"\r\n          class=\"file-viewer\"\r\n        >\r\n        </kv-file-viewer-novo>\r\n  \r\n        <div\r\n          id=\"html-content\"\r\n          [innerHTML]=\"ekpContent()\"\r\n          *ngIf=\"extencaoDocumento === 'ekp'\"\r\n          class=\"ekp-content\"\r\n        ></div>\r\n      </ng-container>\r\n    } @else {\r\n      <ng-container *ngIf=\"arquivoPreview(); else noDocumentSelected\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            contentTemplate;\r\n            context: { $implicit: arquivoPreview() }\r\n          \"\r\n        ></ng-container>\r\n      </ng-container>\r\n    }\r\n    <ng-template #noDocumentSelected>\r\n      @if(!noDocumentSelectedTemplate) {\r\n      <div\r\n        class=\"no-document-message flex flex-column align-items-center justify-content-center\"\r\n        style=\"height: 100%\"\r\n      >\r\n        <p class=\"text-center text-gray-500\">\r\n          Selecione um arquivo para visualiza\u00E7\u00E3o\r\n        </p>\r\n        <img\r\n          [src]=\"\r\n            'https://work-assets.keevo.com.br/img/Digital_personal_files-pana_3.png'\r\n          \"\r\n          style=\"max-height: 50%; margin-top: 2rem;\"\r\n          alt=\"\"\r\n        />\r\n      </div>\r\n      } @else {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"noDocumentSelectedTemplate\"\r\n      ></ng-container>\r\n      }\r\n    </ng-template>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.farol-statuspublicacao{margin-right:.5rem;width:.35rem;border-radius:1rem;-webkit-border-radius:1rem;-moz-border-radius:1rem;-ms-border-radius:1rem;-o-border-radius:1rem}:host ::ng-deep .p-sidebar{border-radius:5px;position:absolute;height:var(--sidebar-height)}:host ::ng-deep .p-sidebar .p-sidebar-content{overflow:auto;border:1px solid #e5e7eb;border-radius:5px;margin-top:1rem}.card-perfil{border:1.5px solid #CBD5E1;background:#fff;border-radius:6px;max-height:100%}:host ::ng-deep .p-fieldset .p-fieldset-content{padding-bottom:0}:host ::ng-deep .p-sidebar .p-sidebar-close{display:none}.card-normal{border:1.5px solid #CBD5E1}.card-naoVisualizado{border-left:4px solid #e6671f!important}.parent-container{height:100%;display:flex;flex-direction:column}.file-viewer{margin:auto}.ekp-content{min-height:20rem;padding:1rem;overflow-y:auto;border-radius:5px}ngx-loading{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1000}.card{transition:all .3s ease;border:1px solid transparent}.card-normal:hover{border:1px solid #a9a9a9;box-shadow:0 4px 8px #0000001a}.card-selected{background-color:#f0f0f0;border:1px solid #c0c0c0;box-shadow:0 6px 12px #00000026;transform:scale(1.02)}.loading-spinner{display:flex;align-items:center;justify-content:center;height:100%;font-size:1.5rem;color:#666}#html-content{width:100%;height:100%;overflow-y:auto}:host ::ng-deep .list-card-button .kv-button{width:22px;height:22px}:host ::ng-deep .list-card-button .kv-button .material-symbols-outlined.only-icon.icon-normal[_ngcontent-ng-c4083184952]{font-size:1rem}.custom-max-height{max-height:calc(100vh - 300px)}@media (max-height: 915px){.custom-max-height{max-height:94%}}@media (max-height: 805px){.custom-max-height{max-height:90%}}@media (max-height: 720px){.custom-max-height{max-height:85%}}.download-icon{font-size:20px;cursor:pointer;transition:transform .3s ease,color .3s ease}.download-icon:hover{color:#0f6cbd;transform:scale(1.2)}\n"] }]
+            args: [{ selector: 'kv-content-viewer', template: "<div class=\"flex flex-column md:flex-row gap-2 mt-3 custom-max-height\" style=\"height: 100%;\">\r\n  <!-- Lista de documentos -->\r\n  <div\r\n    class=\"card-perfil overflow-x-hidden\"\r\n    (scroll)=\"scrollHandler($event)\"\r\n    [ngClass]=\"{\r\n      'overflow-y-scroll': dataSource().length > 0,\r\n      'overflow-y-hidden': dataSource().length === 0\r\n    }\"\r\n    style=\"position: relative; height: 100%; min-height: 15rem;\"\r\n  >\r\n    <div *ngIf=\"dataSource().length > 0; else emptyDocumentList\" class=\"col-12\">\r\n      <!-- Lista de cards -->\r\n      <div\r\n        *ngFor=\"let option of dataSource(); trackBy: trackByFn\"\r\n        class=\"card-normal outline-none border-round-xl w-full p-2 m-1 grid p-fluid flex flex-row flex-nowrap align-items-center justify-content-center cursor-pointer\"\r\n        style=\"min-height: 5rem\"\r\n        (click)=\"visualizarPreview(option)\"\r\n        [ngClass]=\"{\r\n    'card-naoVisualizado': !isVisualizado(option),\r\n    'card-selected': option === arquivoPreview(),\r\n    'card-normal': option !== arquivoPreview(),\r\n   }\"\r\n      >\r\n        <div class=\"flex flex-grow-1 ml-2 flex-column gap-1 m-0 p-0 overflow-hidden text-overflow-ellipsis \" style=\"max-width: 100%;\">\r\n          <ng-container *ngIf=\"cardTemplate; else defaultTemplate\">\r\n            <ng-container \r\n              *ngTemplateOutlet=\"cardTemplate; context: { $implicit: option }\"\r\n            ></ng-container>\r\n          </ng-container>\r\n        </div>\r\n        <ng-template #defaultTemplate>\r\n          <div class=\"card-common-style default-card\">\r\n            <h1 class=\"font-bold text-base p-0 m-0\">Bem-vindo!</h1>\r\n            <p class=\"text-sm mt-2\">\r\n              Kv-file-preview aguardando um template...\r\n            </p>\r\n            <p class=\"font-bold text-sm p-0 m-0\">Data: {{ todayDate() }}</p>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n\r\n    <ng-template #emptyDocumentList>\r\n      @if(!noDocumentListTemplate) {\r\n      <div class=\"text-center text-gray-600 mt-4 m-3\" style=\"height: 100%\">\r\n        <div class=\" flex align-items-center gap-1\">\r\n          <span class=\"material-symbols-outlined\"> inbox </span>\r\n          <p>Nenhum documento dispon\u00EDvel.</p>\r\n        </div>\r\n      </div>\r\n      } @else {\r\n      <div class=\"text-center mt-4 m-3\" style=\"height: 100%\">\r\n        <ng-container *ngTemplateOutlet=\"noDocumentListTemplate\"></ng-container>\r\n      </div>\r\n      }\r\n    </ng-template>\r\n\r\n    <!-- Contador de documentos - Fixo na parte inferior -->\r\n    <div\r\n      class=\"sticky-counter flex flex-row flex-1 px-2 justify-content-center p-2\"\r\n      style=\"position: sticky; bottom: 0; background-color: white\"\r\n    >\r\n      <span>{{ totalItensCarregado() }} de {{ totalRecords }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Visualizador -->\r\n  <div  id=\"fullscreenDiv\" class=\"card-perfil col-12 md:col-8 lg:col-9\" style=\"position: relative; height: 100%;\">\r\n    @if(btnTelaCheia)\r\n    {\r\n      <div class=\"grid\">\r\n      <div class=\"col\"></div>\r\n      <span id=\"fullscreenBtn\" (click)=\"alternarTelaCheia()\" class=\"material-symbols-outlined p-2 text-xl cursor-pointer\">\r\n        open_in_full\r\n        </span>\r\n      </div>\r\n    }\r\n    @if(visualizadorDocumentos) {\r\n      <ng-container *ngIf=\"arquivo(); else noDocumentSelected\">\r\n        @if(isLoading) {\r\n        <ngx-loading\r\n          [show]=\"isLoading\"\r\n          [config]=\"{ backdropBorderRadius: '3px', fullScreenBackdrop: false }\"\r\n        ></ngx-loading>\r\n        }\r\n        <kv-file-viewer-novo\r\n        *ngIf=\"extencaoDocumento !== 'ekp'\"\r\n          [arquivo]=\"arquivo()!\"\r\n          [type]=\"type()!\"\r\n          [blob]=\"blob()!\"\r\n          [width]=\"'100%'\" \r\n          [height]=\"'100%'\"\r\n          class=\"file-viewer\"\r\n        >\r\n        </kv-file-viewer-novo>\r\n  \r\n        <div\r\n          id=\"html-content\"\r\n          [innerHTML]=\"ekpContent()\"\r\n          *ngIf=\"extencaoDocumento === 'ekp'\"\r\n          class=\"ekp-content\"\r\n        ></div>\r\n      </ng-container>\r\n    } @else {\r\n      <ng-container *ngIf=\"arquivoPreview(); else noDocumentSelected\">\r\n        <ng-container\r\n          *ngTemplateOutlet=\"\r\n            contentTemplate;\r\n            context: { $implicit: arquivoPreview() }\r\n          \"\r\n        ></ng-container>\r\n      </ng-container>\r\n    }\r\n    <ng-template #noDocumentSelected>\r\n      @if(!noDocumentSelectedTemplate) {\r\n      <div\r\n        class=\"no-document-message flex flex-column align-items-center justify-content-center\"\r\n        style=\"height: 100%\"\r\n      >\r\n        <p class=\"text-center text-gray-500\">\r\n          Selecione um arquivo para visualiza\u00E7\u00E3o\r\n        </p>\r\n        <img\r\n          [src]=\"\r\n            'https://work-assets.keevo.com.br/img/Digital_personal_files-pana_3.png'\r\n          \"\r\n          style=\"max-height: 50%; margin-top: 2rem;\"\r\n          alt=\"\"\r\n        />\r\n      </div>\r\n      } @else {\r\n      <ng-container\r\n        *ngTemplateOutlet=\"noDocumentSelectedTemplate\"\r\n      ></ng-container>\r\n      }\r\n    </ng-template>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.farol-statuspublicacao{margin-right:.5rem;width:.35rem;border-radius:1rem;-webkit-border-radius:1rem;-moz-border-radius:1rem;-ms-border-radius:1rem;-o-border-radius:1rem}:host ::ng-deep .p-sidebar{border-radius:5px;position:absolute;height:var(--sidebar-height)}:host ::ng-deep .p-sidebar .p-sidebar-content{overflow:auto;border:1px solid #e5e7eb;border-radius:5px;margin-top:1rem}.card-perfil{border:1.5px solid #CBD5E1;background:#fff;border-radius:6px;max-height:100%}:host ::ng-deep .p-fieldset .p-fieldset-content{padding-bottom:0}:host ::ng-deep .p-sidebar .p-sidebar-close{display:none}.card-normal{border:1.5px solid #CBD5E1}.card-naoVisualizado{border-left:4px solid #e6671f!important}.parent-container{height:100%;display:flex;flex-direction:column}.file-viewer{margin:auto}.ekp-content{min-height:20rem;padding:1rem;overflow-y:auto;border-radius:5px}ngx-loading{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1000}.card{transition:all .3s ease;border:1px solid transparent}.card-normal:hover{border:1px solid #a9a9a9;box-shadow:0 4px 8px #0000001a}.card-selected{background-color:#f0f0f0;border:1px solid #c0c0c0;box-shadow:0 6px 12px #00000026;transform:scale(1.02)}.loading-spinner{display:flex;align-items:center;justify-content:center;height:100%;font-size:1.5rem;color:#666}#html-content{width:100%;height:100%;overflow-y:auto}:host ::ng-deep .list-card-button .kv-button{width:22px;height:22px}:host ::ng-deep .list-card-button .kv-button .material-symbols-outlined.only-icon.icon-normal[_ngcontent-ng-c4083184952]{font-size:1rem}.download-icon{font-size:20px;cursor:pointer;transition:transform .3s ease,color .3s ease}.download-icon:hover{color:#0f6cbd;transform:scale(1.2)}\n"] }]
         }], propDecorators: { extencaoDocumento: [{
                 type: Input
             }], totalRecords: [{