keevo-components 2.0.272 → 2.0.274

package/fesm2022/keevo-components.mjs

@@ -8412,20 +8412,29 @@ class KvPageFormComponent {
         this.addSubTitle();
         // this.setPageFormContainerAttributes();
     }
+    ngOnChanges(changes) {
+        if (changes['SubTituloForm']) {
+            this.addSubTitle();
+        }
+    }
     /**
      * Adiciona sub-título à tela
      */
     addSubTitle() {
-        if (this.SubTituloForm) {
-            const headerElement = document.querySelector('.p-dialog .p-dialog-header');
-            if (headerElement) {
-                const subtitleElement = document.createElement('span');
-                subtitleElement.textContent = this.SubTituloForm;
-                subtitleElement.style.fontSize = '0.75rem';
-                subtitleElement.style.width = '100%';
-                subtitleElement.style.marginLeft = '2px';
-                headerElement.appendChild(subtitleElement);
-            }
+        const headerElement = document.querySelector('.p-dialog .p-dialog-header');
+        if (headerElement) {
+            let subtitleElement = headerElement.querySelector('.subtitulo');
+            if (subtitleElement) {
+                subtitleElement.remove();
+            }
+            subtitleElement = document.createElement('span');
+            subtitleElement.classList.add('subtitulo');
+            subtitleElement.textContent = this.SubTituloForm || '';
+            subtitleElement.style.fontSize = '0.90rem';
+            subtitleElement.style.width = '100%';
+            subtitleElement.style.marginLeft = '2px';
+            subtitleElement.style.marginTop = '10px';
+            headerElement.appendChild(subtitleElement);
         }
     }
     /**
@@ -8446,7 +8455,7 @@ class KvPageFormComponent {
         this.onClickSecundary.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvPageFormComponent, deps: [{ token: i2$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvPageFormComponent, selector: "kv-page-form", inputs: { formGroup: "formGroup", TituloForm: "TituloForm", SubTituloForm: "SubTituloForm", isSaveLoading: "isSaveLoading", popup: "popup", locationUseComponent: "locationUseComponent", iconBtnCancel: "iconBtnCancel", showBtnCancel: "showBtnCancel", txtBtnCancel: "txtBtnCancel", actionsCancelToogle: "actionsCancelToogle", iconBtnCancelToogle: "iconBtnCancelToogle", showBtnCancelToogle: "showBtnCancelToogle", txtBtnCancelToogle: "txtBtnCancelToogle", iconBtnSave: "iconBtnSave", showBtnSave: "showBtnSave", txtBtnSave: "txtBtnSave", disableBtnSave: "disableBtnSave", actionsSaveToogle: "actionsSaveToogle", iconBtnSaveToogle: "iconBtnSaveToogle", showBtnSaveToogle: "showBtnSaveToogle", txtBtnSaveToogle: "txtBtnSaveToogle", iconBtnSecundary: "iconBtnSecundary", showBtnSecundary: "showBtnSecundary", txtBtnSecundary: "txtBtnSecundary", colorBtnSecundary: "colorBtnSecundary", actionsToogle: "actionsToogle", iconBtnToogle: "iconBtnToogle", showBtnToogle: "showBtnToogle", txtBtnToogle: "txtBtnToogle", classBtnToogle: "classBtnToogle", disableBtnSair: "disableBtnSair", showMessageCamposObrigatorios: "showMessageCamposObrigatorios" }, outputs: { onSave: "onSave", onCancel: "onCancel", onClickSecundary: "onClickSecundary" }, ngImport: i0, template: "<div\r\n  [formGroup]=\"formGroup\"\r\n  class=\"h-full flex flex-column overflow-hidden relative p-0 m-0\"\r\n>\r\n  <!-- Renderiza\u00E7\u00E3o do form -->\r\n  <div class=\"m-0 {{!popup && 'p-3'}} h-full flex-1 overflow-y-auto page-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n\r\n  <!-- Divider -->\r\n  <!-- <p-divider class=\"col-12\"></p-divider> -->\r\n\r\n  <!-- Barra de a\u00E7\u00F5es -->\r\n\r\n  <div\r\n    class=\"flex flex-column md:flex-row md:justify-content-end md:align-items-center col-12 gap-2 barra-acoes flex-init border-round-bottom-md p-2\"\r\n    id=\"barra-acoes\"\r\n  >\r\n    @if(showMessageCamposObrigatorios) {\r\n    <span class=\"w-full text-xs text-gray-500 font-medium\">\r\n      <span class=\"font-bold\">*</span> Preenchimento obrigat\u00F3rio</span>\r\n    }\r\n\r\n    <kv-button\r\n      *ngIf=\"showBtnCancel\"\r\n      [label]=\"txtBtnCancel\"\r\n      [icon]=\"iconBtnCancel\"\r\n      [disabled]=\"isSaveLoading\"\r\n      (onClick)=\"cancel($event)\"\r\n      class=\"w-full md:w-auto\"\r\n      severity=\"secondary\"\r\n      type=\"text\"\r\n    >\r\n    </kv-button>\r\n\r\n    <kv-button\r\n      *ngIf=\"actionsCancelToogle && showBtnCancelToogle\"\r\n      [label]=\"txtBtnCancelToogle\"\r\n      class=\"w-full md:w-auto\"\r\n      [severity]=\"'secondary'\"\r\n      type=\"text\"\r\n      [disabled]=\"isSaveLoading\"\r\n      [popup]=\"true\"\r\n      [items]=\"actionsCancelToogle\"\r\n      iconPosition=\"left\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"showBtnSecundary\"\r\n      [label]=\"txtBtnSecundary\"\r\n      [icon]=\"iconBtnSecundary\"\r\n      [disabled]=\"isSaveLoading\"\r\n      severity=\"tertiary\"\r\n      (onClick)=\"actionSecundary($event)\"\r\n      class=\"w-full md:w-auto\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"actionsToogle && showBtnToogle\"\r\n      [label]=\"txtBtnToogle\"\r\n      [icon]=\"iconBtnToogle\"\r\n      class=\"w-full md:w-auto\"\r\n      severity=\"tertiary\"\r\n      [disabled]=\"isSaveLoading\"\r\n      [popup]=\"true\"\r\n      [items]=\"actionsToogle\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"showBtnSave\"\r\n      [label]=\"txtBtnSave\"\r\n      [icon]=\"iconBtnSave\"\r\n      [disabled]=\"disableBtnSave\"\r\n      [loading]=\"isSaveLoading\"\r\n      (onClick)=\"save($event)\"\r\n      severity=\"primary\"\r\n      class=\"w-full md:w-auto\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"actionsSaveToogle && showBtnSaveToogle\"\r\n      [label]=\"txtBtnSaveToogle\"\r\n      [icon]=\"iconBtnSaveToogle\"\r\n      [loading]=\"isSaveLoading\"\r\n      class=\"w-full md:w-auto\"\r\n      [severity]=\"'primary'\"\r\n      [popup]=\"true\"\r\n      [items]=\"actionsSaveToogle\"\r\n    />\r\n  </div>\r\n</div>\r\n", styles: ["::ng-deep .p-dialog .p-dialog-content{padding:.75rem!important}::ng-deep .page-content{overflow-x:hidden}*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{bottom:0;right:0;background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup", "popupIcon"], outputs: ["iconChange", "onClick"] }, { kind: "directive", type: i2$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvPageFormComponent, selector: "kv-page-form", inputs: { formGroup: "formGroup", TituloForm: "TituloForm", SubTituloForm: "SubTituloForm", isSaveLoading: "isSaveLoading", popup: "popup", locationUseComponent: "locationUseComponent", iconBtnCancel: "iconBtnCancel", showBtnCancel: "showBtnCancel", txtBtnCancel: "txtBtnCancel", actionsCancelToogle: "actionsCancelToogle", iconBtnCancelToogle: "iconBtnCancelToogle", showBtnCancelToogle: "showBtnCancelToogle", txtBtnCancelToogle: "txtBtnCancelToogle", iconBtnSave: "iconBtnSave", showBtnSave: "showBtnSave", txtBtnSave: "txtBtnSave", disableBtnSave: "disableBtnSave", actionsSaveToogle: "actionsSaveToogle", iconBtnSaveToogle: "iconBtnSaveToogle", showBtnSaveToogle: "showBtnSaveToogle", txtBtnSaveToogle: "txtBtnSaveToogle", iconBtnSecundary: "iconBtnSecundary", showBtnSecundary: "showBtnSecundary", txtBtnSecundary: "txtBtnSecundary", colorBtnSecundary: "colorBtnSecundary", actionsToogle: "actionsToogle", iconBtnToogle: "iconBtnToogle", showBtnToogle: "showBtnToogle", txtBtnToogle: "txtBtnToogle", classBtnToogle: "classBtnToogle", disableBtnSair: "disableBtnSair", showMessageCamposObrigatorios: "showMessageCamposObrigatorios" }, outputs: { onSave: "onSave", onCancel: "onCancel", onClickSecundary: "onClickSecundary" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n  [formGroup]=\"formGroup\"\r\n  class=\"h-full flex flex-column overflow-hidden relative p-0 m-0\"\r\n>\r\n  <!-- Renderiza\u00E7\u00E3o do form -->\r\n  <div class=\"m-0 {{!popup && 'p-3'}} h-full flex-1 overflow-y-auto page-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n\r\n  <!-- Divider -->\r\n  <!-- <p-divider class=\"col-12\"></p-divider> -->\r\n\r\n  <!-- Barra de a\u00E7\u00F5es -->\r\n\r\n  <div\r\n    class=\"flex flex-column md:flex-row md:justify-content-end md:align-items-center col-12 gap-2 barra-acoes flex-init border-round-bottom-md p-2\"\r\n    id=\"barra-acoes\"\r\n  >\r\n    @if(showMessageCamposObrigatorios) {\r\n    <span class=\"w-full text-xs text-gray-500 font-medium\">\r\n      <span class=\"font-bold\">*</span> Preenchimento obrigat\u00F3rio</span>\r\n    }\r\n\r\n    <kv-button\r\n      *ngIf=\"showBtnCancel\"\r\n      [label]=\"txtBtnCancel\"\r\n      [icon]=\"iconBtnCancel\"\r\n      [disabled]=\"isSaveLoading\"\r\n      (onClick)=\"cancel($event)\"\r\n      class=\"w-full md:w-auto\"\r\n      severity=\"secondary\"\r\n      type=\"text\"\r\n    >\r\n    </kv-button>\r\n\r\n    <kv-button\r\n      *ngIf=\"actionsCancelToogle && showBtnCancelToogle\"\r\n      [label]=\"txtBtnCancelToogle\"\r\n      class=\"w-full md:w-auto\"\r\n      [severity]=\"'secondary'\"\r\n      type=\"text\"\r\n      [disabled]=\"isSaveLoading\"\r\n      [popup]=\"true\"\r\n      [items]=\"actionsCancelToogle\"\r\n      iconPosition=\"left\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"showBtnSecundary\"\r\n      [label]=\"txtBtnSecundary\"\r\n      [icon]=\"iconBtnSecundary\"\r\n      [disabled]=\"isSaveLoading\"\r\n      severity=\"tertiary\"\r\n      (onClick)=\"actionSecundary($event)\"\r\n      class=\"w-full md:w-auto\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"actionsToogle && showBtnToogle\"\r\n      [label]=\"txtBtnToogle\"\r\n      [icon]=\"iconBtnToogle\"\r\n      class=\"w-full md:w-auto\"\r\n      severity=\"tertiary\"\r\n      [disabled]=\"isSaveLoading\"\r\n      [popup]=\"true\"\r\n      [items]=\"actionsToogle\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"showBtnSave\"\r\n      [label]=\"txtBtnSave\"\r\n      [icon]=\"iconBtnSave\"\r\n      [disabled]=\"disableBtnSave\"\r\n      [loading]=\"isSaveLoading\"\r\n      (onClick)=\"save($event)\"\r\n      severity=\"primary\"\r\n      class=\"w-full md:w-auto\"\r\n    />\r\n\r\n    <kv-button\r\n      *ngIf=\"actionsSaveToogle && showBtnSaveToogle\"\r\n      [label]=\"txtBtnSaveToogle\"\r\n      [icon]=\"iconBtnSaveToogle\"\r\n      [loading]=\"isSaveLoading\"\r\n      class=\"w-full md:w-auto\"\r\n      [severity]=\"'primary'\"\r\n      [popup]=\"true\"\r\n      [items]=\"actionsSaveToogle\"\r\n    />\r\n  </div>\r\n</div>\r\n", styles: ["::ng-deep .p-dialog .p-dialog-content{padding:.75rem!important}::ng-deep .page-content{overflow-x:hidden}*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{bottom:0;right:0;background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup", "popupIcon"], outputs: ["iconChange", "onClick"] }, { kind: "directive", type: i2$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvPageFormComponent, decorators: [{
             type: Component,
@@ -12480,6 +12489,8 @@ class KvTableViewerComponent {
         this.onSelectItems = output();
         this.onSearch = output();
         this.onSort = output();
+        this.onCheckboxSelectable = output();
+        this.onCheckboxUnselectable = output();
         this.templates = contentChildren(TemplateDirective);
         this._templates = input({}, { alias: 'templates' });
         this.getCustomTemplate = computed(() => (templatename) => {
@@ -12487,7 +12498,7 @@ class KvTableViewerComponent {
             return templates[templatename];
         });
         this.isRowSelected = computed(() => {
-            return this.selectedItems()?.length > 0 || this.selectedItem();
+            return this.selectedItem();
         });
         this.verifyItemSelecionado = computed(() => (rowData) => {
             let isSelected;
@@ -12515,9 +12526,8 @@ class KvTableViewerComponent {
                 return value;
         });
         this.handleTableSize = computed(() => {
-            const selectedItems = this.selectedItems();
             const selectedItem = this.selectedItem();
-            if (selectedItems?.length == 0 && !selectedItem)
+            if (!selectedItem)
                 return 'col-12';
             else
                 return this.tableViewerSize();
@@ -12529,7 +12539,7 @@ class KvTableViewerComponent {
             return this.actionsRow()?.length > 0;
         });
         this.showSelectedItem = computed(() => {
-            return this.selectedItems()?.length == 1 || this.selectedItem();
+            return this.selectedItem();
         });
         this.hasSelectedItems = computed(() => {
             return this.selectedItems()?.length > 1;
@@ -12542,7 +12552,7 @@ class KvTableViewerComponent {
         });
         this.breakpointObserver
             .observe([Breakpoints.HandsetPortrait, '(max-width: 768px)'])
-            .subscribe(state => this.isMobile.set(state.matches));
+            .subscribe((state) => this.isMobile.set(state.matches));
         effect(() => {
             this.onSelectItems.emit(this.selectedItems());
             this.onSearch.emit(this.searchValue());
@@ -12607,29 +12617,31 @@ class KvTableViewerComponent {
     }
     handleSort(event) {
         const currentSortState = this.lastEmittedSort();
-        if (currentSortState && currentSortState.field === event.field && currentSortState.order === event.order) {
+        if (currentSortState &&
+            currentSortState.field === event.field &&
+            currentSortState.order === event.order) {
             return;
         }
         this.lastEmittedSort.set({ field: event.field, order: event.order });
         let ordenacao = `${event.field} ${event.order === 1 ? 'ASC' : 'DESC'} `;
-        let ordernacaoGroup = { column: event.field, direction: event.order === 1 ? 'ASC' : 'DESC' };
-        this.onSort.emit({ ordenacao: ordenacao, ordernacaoGroup: ordernacaoGroup });
+        let ordernacaoGroup = {
+            column: event.field,
+            direction: event.order === 1 ? 'ASC' : 'DESC',
+        };
+        this.onSort.emit({
+            ordenacao: ordenacao,
+            ordernacaoGroup: ordernacaoGroup,
+        });
     }
     rowSelect(rowData) {
-        if (this.selectableTable()) {
-            if (this.selectedItems().includes(rowData))
-                this.selectedItems.update((items) => items.filter(item => item !== rowData));
-            else
-                this.selectedItems.update((items) => [...items, rowData]);
-            if (this.selectedItems()?.length === 1)
-                this.onClickRowItem.emit(this.selectedItems()[0]);
-            else
-                this.onClickRowItem.emit(rowData);
-        }
-        else {
-            this.selectedItem.set(rowData);
-            this.onClickRowItem.emit(rowData);
-        }
+        this.selectedItem.set(rowData);
+        this.onClickRowItem.emit(rowData);
+    }
+    onCheckboxSelect(event) {
+        this.onCheckboxSelectable.emit(event?.data);
+    }
+    onCheckboxUnselect(event) {
+        this.onCheckboxUnselectable.emit(event?.data);
     }
     transformMoney(valor) {
         const formatter = new Intl.NumberFormat('pt-BR', {
@@ -12648,49 +12660,56 @@ class KvTableViewerComponent {
         this.removeOverlay();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTableViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTableViewerComponent, isStandalone: true, selector: "kv-table-viewer", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, actionsRow: { classPropertyName: "actionsRow", publicName: "actionsRow", isSignal: true, isRequired: false, transformFunction: null }, actionsHeader: { classPropertyName: "actionsHeader", publicName: "actionsHeader", isSignal: true, isRequired: false, transformFunction: null }, actionsLote: { classPropertyName: "actionsLote", publicName: "actionsLote", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, pageLinks: { classPropertyName: "pageLinks", publicName: "pageLinks", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectionPageOnly: { classPropertyName: "selectionPageOnly", publicName: "selectionPageOnly", isSignal: true, isRequired: false, transformFunction: null }, selectableTable: { classPropertyName: "selectableTable", publicName: "selectableTable", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, showHeaderTemplate: { classPropertyName: "showHeaderTemplate", publicName: "showHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, tableViewerSize: { classPropertyName: "tableViewerSize", publicName: "tableViewerSize", isSignal: true, isRequired: false, transformFunction: null }, searchInput: { classPropertyName: "searchInput", publicName: "searchInput", isSignal: true, isRequired: false, transformFunction: null }, filterButton: { classPropertyName: "filterButton", publicName: "filterButton", isSignal: true, isRequired: false, transformFunction: null }, idName: { classPropertyName: "idName", publicName: "idName", isSignal: true, isRequired: false, transformFunction: null }, emptyTableImg: { classPropertyName: "emptyTableImg", publicName: "emptyTableImg", isSignal: true, isRequired: false, transformFunction: null }, isSelectedPrimaryItem: { classPropertyName: "isSelectedPrimaryItem", publicName: "isSelectedPrimaryItem", isSignal: true, isRequired: false, transformFunction: null }, _templates: { classPropertyName: "_templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onPageChange: "onPageChange", onClickRowItem: "onClickRowItem", onSelectItems: "onSelectItems", onSearch: "onSearch", onSort: "onSort" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], viewQueries: [{ propertyName: "op", first: true, predicate: ["op"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n    isEmptyTable() ? 'empty-table' : ''\r\n  }}\"\r\n>\r\n  @if(!this.selectedItem() || !isMobile() && !selectableTable()) {\r\n  <div\r\n    class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n    [style.transition]=\"'all 0.3s ease-in-out'\"\r\n  >\r\n    @if(showHeaderTemplate()) {\r\n    <div>\r\n      <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n    </div>\r\n    }\r\n\r\n    <div\r\n      class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n    >\r\n      <div class=\"flex flex-row align-items-center gap-2\">\r\n        @if(searchInput()) {\r\n        <input\r\n          style=\"height: 1.875rem\"\r\n          placeholder=\"Pesquisar...\"\r\n          type=\"text\"\r\n          pInputText\r\n          [(ngModel)]=\"searchValue\"\r\n          class=\"text-xs\"\r\n        />\r\n\r\n        } @if(filterButton()) {\r\n        <kv-button\r\n          label=\"Filtrar\"\r\n          icon=\"filter_alt\"\r\n          severity=\"tertiary\"\r\n          (onClick)=\"toggleOverlayPanel($event)\"\r\n        ></kv-button>\r\n        }\r\n\r\n        <p-overlayPanel #op [dismissable]=\"false\">\r\n          <ng-content select=\"[filtro]\"> </ng-content>\r\n        </p-overlayPanel>\r\n      </div>\r\n      <div class=\"flex flex-row gap-2\">\r\n        @if(actionsHeader()) { @for(action of actionsHeader(); track $index) {\r\n        <kv-button\r\n          [icon]=\"action?.icon || ''\"\r\n          [label]=\"action?.label || ''\"\r\n          [severity]=\"action['severity'] || 'tertiary'\"\r\n          (onClick)=\"action?.command($event)\"\r\n          [popupIcon]=\"false\"\r\n          [items]=\"action.items || []\"\r\n          [popup]=\"isPopupButton()(action)\"\r\n        ></kv-button>\r\n        } } @if(selectedItem()) {\r\n        <kv-button\r\n          [pTooltip]=\"'Recolher'\"\r\n          icon=\"reorder\"\r\n          severity=\"tertiary\"\r\n          (onClick)=\"selectedItem.set(null)\"\r\n        ></kv-button>\r\n        }\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"flex-1 h-full overflow-hidden\">\r\n      <p-table\r\n        [value]=\"data()\"\r\n        [lazy]=\"lazy()\"\r\n        [selectionPageOnly]=\"selectionPageOnly()\"\r\n        [columns]=\"columns()\"\r\n        [paginator]=\"paginator()\"\r\n        [rows]=\"rows()\"\r\n        [totalRecords]=\"totalRecords()\"\r\n        [loading]=\"loading()\"\r\n        [pageLinks]=\"pageLinks()\"\r\n        [first]=\"first()\"\r\n        [scrollable]=\"scrollable()\"\r\n        scrollHeight=\"flex\"\r\n        [showCurrentPageReport]=\"true\"\r\n        [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n        (onPage)=\"handlePageChange($event)\"\r\n        (onSort)=\"handleSort($event)\"\r\n        [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n        [(selection)]=\"selectedItems\"\r\n        styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n      >\r\n        @if(showHeader()) {\r\n        <ng-template pTemplate=\"header\" let-columns>\r\n          <tr>\r\n            @if(selectableTable()) {\r\n            <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n            } @for (col of columns; track col.field) {\r\n            <th\r\n              [pSortableColumn]=\"col.field\"\r\n              [pSortableColumnDisabled]=\"!col?.sortable\"\r\n              [style]=\"{ width: col.width || 'auto' }\"\r\n            >\r\n              <div class=\"flex flex-row align-items-center gap-1\">\r\n                <span>{{ col.header }}</span>\r\n                @if (col.sortable) {\r\n                <p-sortIcon [field]=\"col.field\" class=\"pb-1\"></p-sortIcon>\r\n                }\r\n              </div>\r\n            </th>\r\n            }\r\n          </tr>\r\n        </ng-template>\r\n        }\r\n\r\n        <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n          <tr\r\n            class=\"cursor-pointer {{\r\n              verifyItemSelecionado()(rowData) && 'bg-gray-100'\r\n            }} hover:bg-gray-200\"\r\n          >\r\n            @if(selectableTable()) {\r\n            <td><p-tableCheckbox [value]=\"rowData\" /></td>\r\n            } @for (col of columns; track col.field) {\r\n            <td (click)=\"rowSelect(rowData)\" style=\"word-break: break-all;\">\r\n              @if(col?.template) {\r\n              <div class=\"flex flex-row gap-2 align-items-center\">\r\n                @if (getCustomTemplate()(col.template.name)) {\r\n                <ng-container\r\n                  [ngTemplateOutlet]=\"getCustomTemplate()(col.template.name)\"\r\n                  [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                />\r\n                }\r\n              </div>\r\n              } @else if(col?.icon) {\r\n              <span class=\"material-symbols-outlined text-lg\">\r\n                {{ col.icon(rowData) }}\r\n              </span>\r\n              } @else if(col?.tag) {\r\n              <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n              } @else {\r\n              {{ transformData()(col.pipe, rowData[col.field]) }}\r\n              }\r\n            </td>\r\n            }\r\n          </tr>\r\n        </ng-template>\r\n\r\n        <ng-template pTemplate=\"emptymessage\">\r\n          <tr>\r\n            <td [attr.colspan]=\"returnColspan()\">\r\n              <div\r\n                class=\"w-full h-full flex align-items-center justify-content-center\"\r\n              >\r\n                <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n              </div>\r\n            </td>\r\n          </tr>\r\n        </ng-template>\r\n      </p-table>\r\n    </div>\r\n  </div>\r\n\r\n  }\r\n\r\n  <div\r\n    class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n    [@slideInOut]=\"isRowSelected() ? 'i.n' : 'out'\"\r\n    [style.overflow]=\"'hidden'\"\r\n  >\r\n    @if(hasSelectedItems()) {\r\n    <actions-lote-field\r\n      class=\"h-full\"\r\n      [selectedItems]=\"selectedItems()\"\r\n      [actionsLote]=\"actionsLote()\"\r\n    />\r\n    } @else if(showSelectedItem()) {\r\n    <div class=\"bg-gray-100 w-full h-auto p-2 relative\">\r\n      @if(hasActionsRow()) {\r\n      <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n      }\r\n\r\n      @if(isMobile()) {\r\n        <div class=\"h-2rem w-2rem\">\r\n          <kv-button\r\n            icon=\"arrow_back\"\r\n            severity=\"tertiary\"\r\n            [pTooltip]=\"'Voltar'\"\r\n            (onClick)=\"selectedItem.set(null)\"\r\n          />\r\n        </div>\r\n      }\r\n\r\n      <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n    </div>\r\n    <div class=\"p-2 overflow-y-auto h-full\">\r\n      <ng-content select=\"[selectedItem]\"></ng-content>\r\n    </div>\r\n    }\r\n\r\n    <!-- @else { Nenhum item selecionado } -->\r\n  </div>\r\n</div>\r\n", styles: ["::ng-deep .filter-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:transparent;z-index:1299}::ng-deep .p-overlaypanel{z-index:1400!important}::ng-deep .kv-table-viewer .p-datatable-wrapper{overflow-x:hidden}::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i5$2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TooltipModule }, { 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: "ngmodule", type: TableModule }, { 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: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: KvInputsModule }, { kind: "ngmodule", type: KvButtonModule }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup", "popupIcon"], outputs: ["iconChange", "onClick"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i9$1.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: ActionsLoteFieldComponent, selector: "actions-lote-field", inputs: ["selectedItems", "actionsLote"] }, { kind: "ngmodule", type: KvTagsModule }, { kind: "component", type: KvTagsComponent, selector: "kv-tags", inputs: ["tags", "hover", "clickable"], outputs: ["onClickTag"] }, { kind: "ngmodule", type: TieredMenuModule }, { kind: "component", type: ActionsRowMenuComponent, selector: "actions-row-menu", inputs: ["actionsRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTableViewerComponent, isStandalone: true, selector: "kv-table-viewer", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, actionsRow: { classPropertyName: "actionsRow", publicName: "actionsRow", isSignal: true, isRequired: false, transformFunction: null }, actionsHeader: { classPropertyName: "actionsHeader", publicName: "actionsHeader", isSignal: true, isRequired: false, transformFunction: null }, actionsLote: { classPropertyName: "actionsLote", publicName: "actionsLote", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, pageLinks: { classPropertyName: "pageLinks", publicName: "pageLinks", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectionPageOnly: { classPropertyName: "selectionPageOnly", publicName: "selectionPageOnly", isSignal: true, isRequired: false, transformFunction: null }, selectableTable: { classPropertyName: "selectableTable", publicName: "selectableTable", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, showHeaderTemplate: { classPropertyName: "showHeaderTemplate", publicName: "showHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, tableViewerSize: { classPropertyName: "tableViewerSize", publicName: "tableViewerSize", isSignal: true, isRequired: false, transformFunction: null }, searchInput: { classPropertyName: "searchInput", publicName: "searchInput", isSignal: true, isRequired: false, transformFunction: null }, filterButton: { classPropertyName: "filterButton", publicName: "filterButton", isSignal: true, isRequired: false, transformFunction: null }, idName: { classPropertyName: "idName", publicName: "idName", isSignal: true, isRequired: false, transformFunction: null }, emptyTableImg: { classPropertyName: "emptyTableImg", publicName: "emptyTableImg", isSignal: true, isRequired: false, transformFunction: null }, isSelectedPrimaryItem: { classPropertyName: "isSelectedPrimaryItem", publicName: "isSelectedPrimaryItem", isSignal: true, isRequired: false, transformFunction: null }, _templates: { classPropertyName: "_templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onPageChange: "onPageChange", onClickRowItem: "onClickRowItem", onSelectItems: "onSelectItems", onSearch: "onSearch", onSort: "onSort", onCheckboxSelectable: "onCheckboxSelectable", onCheckboxUnselectable: "onCheckboxUnselectable" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], viewQueries: [{ propertyName: "op", first: true, predicate: ["op"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n    isEmptyTable() ? 'empty-table' : ''\r\n  }}\"\r\n>\r\n  @if (!isMobile() || selectedItem()) {\r\n    <div\r\n      class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n      [style.transition]=\"'all 0.3s ease-in-out'\"\r\n    >\r\n      @if (showHeaderTemplate()) {\r\n        <div>\r\n          <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n        </div>\r\n      }\r\n\r\n      <div\r\n        class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n      >\r\n        <div class=\"flex flex-row align-items-center gap-2\">\r\n          @if (searchInput()) {\r\n            <input\r\n              style=\"height: 1.875rem\"\r\n              placeholder=\"Pesquisar...\"\r\n              type=\"text\"\r\n              pInputText\r\n              [(ngModel)]=\"searchValue\"\r\n              class=\"text-xs\"\r\n            />\r\n          }\r\n          @if (filterButton()) {\r\n            <kv-button\r\n              label=\"Filtrar\"\r\n              icon=\"filter_alt\"\r\n              severity=\"tertiary\"\r\n              (onClick)=\"toggleOverlayPanel($event)\"\r\n            ></kv-button>\r\n          }\r\n\r\n          <p-overlayPanel #op [dismissable]=\"false\">\r\n            <ng-content select=\"[filtro]\"> </ng-content>\r\n          </p-overlayPanel>\r\n        </div>\r\n        <div class=\"flex flex-row gap-2\">\r\n          @if (actionsHeader()) {\r\n            @for (action of actionsHeader(); track $index) {\r\n              <kv-button\r\n                [icon]=\"action?.icon || ''\"\r\n                [label]=\"action?.label || ''\"\r\n                [severity]=\"action['severity'] || 'tertiary'\"\r\n                (onClick)=\"action?.command($event)\"\r\n                [popupIcon]=\"false\"\r\n                [items]=\"action.items || []\"\r\n                [popup]=\"isPopupButton()(action)\"\r\n                [pTooltip]=\"action?.tooltip\"\r\n              ></kv-button>\r\n            }\r\n          }\r\n          @if (selectedItem()) {\r\n            <kv-button\r\n              [pTooltip]=\"'Recolher'\"\r\n              icon=\"reorder\"\r\n              severity=\"tertiary\"\r\n              (onClick)=\"selectedItem.set(null)\"\r\n            ></kv-button>\r\n          }\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"flex-1 h-full overflow-hidden\">\r\n        <p-table\r\n          [value]=\"data()\"\r\n          [lazy]=\"lazy()\"\r\n          [selectionPageOnly]=\"selectionPageOnly()\"\r\n          [columns]=\"columns()\"\r\n          [paginator]=\"paginator()\"\r\n          [rows]=\"rows()\"\r\n          [totalRecords]=\"totalRecords()\"\r\n          [loading]=\"loading()\"\r\n          [pageLinks]=\"pageLinks()\"\r\n          [first]=\"first()\"\r\n          [scrollable]=\"scrollable()\"\r\n          scrollHeight=\"flex\"\r\n          [showCurrentPageReport]=\"true\"\r\n          [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n          (onPage)=\"handlePageChange($event)\"\r\n          (onSort)=\"handleSort($event)\"\r\n          [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n          (onRowSelect)=\"onCheckboxSelect($event)\"\r\n          (onRowUnselect)=\"onCheckboxUnselect($event)\"\r\n          [(selection)]=\"selectedItems\"\r\n          styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n        >\r\n          @if (showHeader()) {\r\n            <ng-template pTemplate=\"header\" let-columns>\r\n              <tr>\r\n                @if (selectableTable()) {\r\n                  <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n                }\r\n                @for (col of columns; track col.field) {\r\n                  <th\r\n                    [pSortableColumn]=\"col.field\"\r\n                    [pSortableColumnDisabled]=\"!col?.sortable\"\r\n                    [style]=\"{ width: col.width || 'auto' }\"\r\n                  >\r\n                    <div class=\"flex flex-row align-items-center gap-1\">\r\n                      <span>{{ col.header }}</span>\r\n                      @if (col.sortable) {\r\n                        <p-sortIcon\r\n                          [field]=\"col.field\"\r\n                          class=\"pb-1\"\r\n                        ></p-sortIcon>\r\n                      }\r\n                    </div>\r\n                  </th>\r\n                }\r\n              </tr>\r\n            </ng-template>\r\n          }\r\n\r\n          <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n            <tr\r\n              class=\"cursor-pointer hover:bg-bluegray-100\"\r\n              [ngClass]=\"{\r\n                'bg-bluegray-50':\r\n                  rowData == selectedItem() || verifyItemSelecionado()(rowData),\r\n              }\"\r\n            >\r\n              @if (selectableTable()) {\r\n                <td>\r\n                  <p-tableCheckbox [value]=\"rowData\" />\r\n                </td>\r\n              }\r\n              @for (col of columns; track col.field) {\r\n                <td (click)=\"rowSelect(rowData)\" style=\"word-break: break-all\">\r\n                  @if (col?.template) {\r\n                    <div class=\"flex flex-row gap-2 align-items-center\">\r\n                      @if (getCustomTemplate()(col.template.name)) {\r\n                        <ng-container\r\n                          [ngTemplateOutlet]=\"\r\n                            getCustomTemplate()(col.template.name)\r\n                          \"\r\n                          [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                        />\r\n                      }\r\n                    </div>\r\n                  } @else if (col?.icon) {\r\n                    <span class=\"material-symbols-outlined text-lg\">\r\n                      {{ col.icon(rowData) }}\r\n                    </span>\r\n                  } @else if (col?.tag) {\r\n                    <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n                  } @else {\r\n                    <span\r\n                      [ngClass]=\"{\r\n                        'font-semibold': rowData == selectedItem(),\r\n                      }\"\r\n                    >\r\n                      {{ transformData()(col.pipe, rowData[col.field]) }}\r\n                    </span>\r\n                  }\r\n                </td>\r\n              }\r\n            </tr>\r\n          </ng-template>\r\n\r\n          <ng-template pTemplate=\"emptymessage\">\r\n            <tr>\r\n              <td [attr.colspan]=\"returnColspan()\">\r\n                <div\r\n                  class=\"w-full h-full flex align-items-center justify-content-center\"\r\n                >\r\n                  <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n                </div>\r\n              </td>\r\n            </tr>\r\n          </ng-template>\r\n        </p-table>\r\n      </div>\r\n    </div>\r\n  }\r\n\r\n  <div\r\n    class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n    [@slideInOut]=\"isRowSelected() ? 'i.n' : 'out'\"\r\n    [style.overflow]=\"'hidden'\"\r\n  >\r\n    <!-- @if(hasSelectedItems()) {\r\n    <actions-lote-field\r\n      class=\"h-full\"\r\n      [selectedItems]=\"selectedItems()\"\r\n      [actionsLote]=\"actionsLote()\"\r\n    />\r\n    } @else -->\r\n    @if (showSelectedItem()) {\r\n      <div class=\"bg-bluegray-50 w-full h-auto p-2 relative\">\r\n        @if (hasActionsRow()) {\r\n          <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n        }\r\n\r\n        @if (isMobile()) {\r\n          <div class=\"h-2rem w-2rem\">\r\n            <kv-button\r\n              icon=\"arrow_back\"\r\n              severity=\"tertiary\"\r\n              [pTooltip]=\"'Voltar'\"\r\n              (onClick)=\"selectedItem.set(null)\"\r\n            />\r\n          </div>\r\n        }\r\n\r\n        <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n      </div>\r\n      <div class=\"p-2 overflow-y-auto h-full\">\r\n        <ng-content select=\"[selectedItem]\"></ng-content>\r\n      </div>\r\n    }\r\n\r\n    <!-- @else { Nenhum item selecionado } -->\r\n  </div>\r\n</div>\r\n", styles: ["::ng-deep .filter-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:transparent;z-index:1299}::ng-deep .p-overlaypanel{z-index:1400!important}::ng-deep .kv-table-viewer .p-datatable-wrapper{overflow-x:hidden}::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i5$2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TooltipModule }, { 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: "ngmodule", type: TableModule }, { 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: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: KvInputsModule }, { kind: "ngmodule", type: KvButtonModule }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["fullWidth", "type", "loading", "severity", "size", "icon", "iconPosition", "label", "disabled", "items", "popup", "popupIcon"], outputs: ["iconChange", "onClick"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i9$1.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: KvTagsModule }, { kind: "component", type: KvTagsComponent, selector: "kv-tags", inputs: ["tags", "hover", "clickable"], outputs: ["onClickTag"] }, { kind: "ngmodule", type: TieredMenuModule }, { kind: "component", type: ActionsRowMenuComponent, selector: "actions-row-menu", inputs: ["actionsRow"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
             trigger('slideInOut', [
                 state('in', style({
                     width: '*',
                     opacity: 1,
-                    transform: 'translateX(0)'
+                    transform: 'translateX(0)',
                 })),
                 state('out', style({
                     width: '0px',
                     opacity: 0,
-                    transform: 'translateX(100%)'
+                    transform: 'translateX(100%)',
                 })),
-                transition('out => in', [
-                    animate('300ms ease-in-out')
-                ]),
-                transition('in => out', [
-                    animate('200ms ease-in-out')
-                ])
-            ])
+                transition('out => in', [animate('300ms ease-in-out')]),
+                transition('in => out', [animate('200ms ease-in-out')]),
+            ]),
         ] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTableViewerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-table-viewer', standalone: true, imports: [InputTextModule, CommonModule, TooltipModule, TableModule, SkeletonModule, ButtonModule, KvInputsModule, KvButtonModule, OverlayPanelModule, ActionsLoteFieldComponent, KvTagsModule, TieredMenuModule, ActionsRowMenuComponent, FormsModule], animations: [
+            args: [{ selector: 'kv-table-viewer', standalone: true, imports: [
+                        InputTextModule,
+                        CommonModule,
+                        TooltipModule,
+                        TableModule,
+                        SkeletonModule,
+                        ButtonModule,
+                        KvInputsModule,
+                        KvButtonModule,
+                        OverlayPanelModule,
+                        ActionsLoteFieldComponent,
+                        KvTagsModule,
+                        TieredMenuModule,
+                        ActionsRowMenuComponent,
+                        FormsModule,
+                    ], animations: [
                         trigger('slideInOut', [
                             state('in', style({
                                 width: '*',
                                 opacity: 1,
-                                transform: 'translateX(0)'
+                                transform: 'translateX(0)',
                             })),
                             state('out', style({
                                 width: '0px',
                                 opacity: 0,
-                                transform: 'translateX(100%)'
+                                transform: 'translateX(100%)',
                             })),
-                            transition('out => in', [
-                                animate('300ms ease-in-out')
-                            ]),
-                            transition('in => out', [
-                                animate('200ms ease-in-out')
-                            ])
-                        ])
-                    ], template: "<div\r\n  class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n    isEmptyTable() ? 'empty-table' : ''\r\n  }}\"\r\n>\r\n  @if(!this.selectedItem() || !isMobile() && !selectableTable()) {\r\n  <div\r\n    class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n    [style.transition]=\"'all 0.3s ease-in-out'\"\r\n  >\r\n    @if(showHeaderTemplate()) {\r\n    <div>\r\n      <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n    </div>\r\n    }\r\n\r\n    <div\r\n      class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n    >\r\n      <div class=\"flex flex-row align-items-center gap-2\">\r\n        @if(searchInput()) {\r\n        <input\r\n          style=\"height: 1.875rem\"\r\n          placeholder=\"Pesquisar...\"\r\n          type=\"text\"\r\n          pInputText\r\n          [(ngModel)]=\"searchValue\"\r\n          class=\"text-xs\"\r\n        />\r\n\r\n        } @if(filterButton()) {\r\n        <kv-button\r\n          label=\"Filtrar\"\r\n          icon=\"filter_alt\"\r\n          severity=\"tertiary\"\r\n          (onClick)=\"toggleOverlayPanel($event)\"\r\n        ></kv-button>\r\n        }\r\n\r\n        <p-overlayPanel #op [dismissable]=\"false\">\r\n          <ng-content select=\"[filtro]\"> </ng-content>\r\n        </p-overlayPanel>\r\n      </div>\r\n      <div class=\"flex flex-row gap-2\">\r\n        @if(actionsHeader()) { @for(action of actionsHeader(); track $index) {\r\n        <kv-button\r\n          [icon]=\"action?.icon || ''\"\r\n          [label]=\"action?.label || ''\"\r\n          [severity]=\"action['severity'] || 'tertiary'\"\r\n          (onClick)=\"action?.command($event)\"\r\n          [popupIcon]=\"false\"\r\n          [items]=\"action.items || []\"\r\n          [popup]=\"isPopupButton()(action)\"\r\n        ></kv-button>\r\n        } } @if(selectedItem()) {\r\n        <kv-button\r\n          [pTooltip]=\"'Recolher'\"\r\n          icon=\"reorder\"\r\n          severity=\"tertiary\"\r\n          (onClick)=\"selectedItem.set(null)\"\r\n        ></kv-button>\r\n        }\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"flex-1 h-full overflow-hidden\">\r\n      <p-table\r\n        [value]=\"data()\"\r\n        [lazy]=\"lazy()\"\r\n        [selectionPageOnly]=\"selectionPageOnly()\"\r\n        [columns]=\"columns()\"\r\n        [paginator]=\"paginator()\"\r\n        [rows]=\"rows()\"\r\n        [totalRecords]=\"totalRecords()\"\r\n        [loading]=\"loading()\"\r\n        [pageLinks]=\"pageLinks()\"\r\n        [first]=\"first()\"\r\n        [scrollable]=\"scrollable()\"\r\n        scrollHeight=\"flex\"\r\n        [showCurrentPageReport]=\"true\"\r\n        [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n        (onPage)=\"handlePageChange($event)\"\r\n        (onSort)=\"handleSort($event)\"\r\n        [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n        [(selection)]=\"selectedItems\"\r\n        styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n      >\r\n        @if(showHeader()) {\r\n        <ng-template pTemplate=\"header\" let-columns>\r\n          <tr>\r\n            @if(selectableTable()) {\r\n            <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n            } @for (col of columns; track col.field) {\r\n            <th\r\n              [pSortableColumn]=\"col.field\"\r\n              [pSortableColumnDisabled]=\"!col?.sortable\"\r\n              [style]=\"{ width: col.width || 'auto' }\"\r\n            >\r\n              <div class=\"flex flex-row align-items-center gap-1\">\r\n                <span>{{ col.header }}</span>\r\n                @if (col.sortable) {\r\n                <p-sortIcon [field]=\"col.field\" class=\"pb-1\"></p-sortIcon>\r\n                }\r\n              </div>\r\n            </th>\r\n            }\r\n          </tr>\r\n        </ng-template>\r\n        }\r\n\r\n        <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n          <tr\r\n            class=\"cursor-pointer {{\r\n              verifyItemSelecionado()(rowData) && 'bg-gray-100'\r\n            }} hover:bg-gray-200\"\r\n          >\r\n            @if(selectableTable()) {\r\n            <td><p-tableCheckbox [value]=\"rowData\" /></td>\r\n            } @for (col of columns; track col.field) {\r\n            <td (click)=\"rowSelect(rowData)\" style=\"word-break: break-all;\">\r\n              @if(col?.template) {\r\n              <div class=\"flex flex-row gap-2 align-items-center\">\r\n                @if (getCustomTemplate()(col.template.name)) {\r\n                <ng-container\r\n                  [ngTemplateOutlet]=\"getCustomTemplate()(col.template.name)\"\r\n                  [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                />\r\n                }\r\n              </div>\r\n              } @else if(col?.icon) {\r\n              <span class=\"material-symbols-outlined text-lg\">\r\n                {{ col.icon(rowData) }}\r\n              </span>\r\n              } @else if(col?.tag) {\r\n              <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n              } @else {\r\n              {{ transformData()(col.pipe, rowData[col.field]) }}\r\n              }\r\n            </td>\r\n            }\r\n          </tr>\r\n        </ng-template>\r\n\r\n        <ng-template pTemplate=\"emptymessage\">\r\n          <tr>\r\n            <td [attr.colspan]=\"returnColspan()\">\r\n              <div\r\n                class=\"w-full h-full flex align-items-center justify-content-center\"\r\n              >\r\n                <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n              </div>\r\n            </td>\r\n          </tr>\r\n        </ng-template>\r\n      </p-table>\r\n    </div>\r\n  </div>\r\n\r\n  }\r\n\r\n  <div\r\n    class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n    [@slideInOut]=\"isRowSelected() ? 'i.n' : 'out'\"\r\n    [style.overflow]=\"'hidden'\"\r\n  >\r\n    @if(hasSelectedItems()) {\r\n    <actions-lote-field\r\n      class=\"h-full\"\r\n      [selectedItems]=\"selectedItems()\"\r\n      [actionsLote]=\"actionsLote()\"\r\n    />\r\n    } @else if(showSelectedItem()) {\r\n    <div class=\"bg-gray-100 w-full h-auto p-2 relative\">\r\n      @if(hasActionsRow()) {\r\n      <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n      }\r\n\r\n      @if(isMobile()) {\r\n        <div class=\"h-2rem w-2rem\">\r\n          <kv-button\r\n            icon=\"arrow_back\"\r\n            severity=\"tertiary\"\r\n            [pTooltip]=\"'Voltar'\"\r\n            (onClick)=\"selectedItem.set(null)\"\r\n          />\r\n        </div>\r\n      }\r\n\r\n      <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n    </div>\r\n    <div class=\"p-2 overflow-y-auto h-full\">\r\n      <ng-content select=\"[selectedItem]\"></ng-content>\r\n    </div>\r\n    }\r\n\r\n    <!-- @else { Nenhum item selecionado } -->\r\n  </div>\r\n</div>\r\n", styles: ["::ng-deep .filter-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:transparent;z-index:1299}::ng-deep .p-overlaypanel{z-index:1400!important}::ng-deep .kv-table-viewer .p-datatable-wrapper{overflow-x:hidden}::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"] }]
+                            transition('out => in', [animate('300ms ease-in-out')]),
+                            transition('in => out', [animate('200ms ease-in-out')]),
+                        ]),
+                    ], template: "<div\r\n  class=\"h-full flex flex-row p-2 kv-table-viewer overflow-hidden {{\r\n    isEmptyTable() ? 'empty-table' : ''\r\n  }}\"\r\n>\r\n  @if (!isMobile() || selectedItem()) {\r\n    <div\r\n      class=\"h-full {{ handleTableSize() }} m-0 p-0 flex flex-column gap-2\"\r\n      [style.transition]=\"'all 0.3s ease-in-out'\"\r\n    >\r\n      @if (showHeaderTemplate()) {\r\n        <div>\r\n          <ng-content select=\"[tableHeaderTemplate]\"> </ng-content>\r\n        </div>\r\n      }\r\n\r\n      <div\r\n        class=\"flex flex-row align-items-center justify-content-between flex-initial\"\r\n      >\r\n        <div class=\"flex flex-row align-items-center gap-2\">\r\n          @if (searchInput()) {\r\n            <input\r\n              style=\"height: 1.875rem\"\r\n              placeholder=\"Pesquisar...\"\r\n              type=\"text\"\r\n              pInputText\r\n              [(ngModel)]=\"searchValue\"\r\n              class=\"text-xs\"\r\n            />\r\n          }\r\n          @if (filterButton()) {\r\n            <kv-button\r\n              label=\"Filtrar\"\r\n              icon=\"filter_alt\"\r\n              severity=\"tertiary\"\r\n              (onClick)=\"toggleOverlayPanel($event)\"\r\n            ></kv-button>\r\n          }\r\n\r\n          <p-overlayPanel #op [dismissable]=\"false\">\r\n            <ng-content select=\"[filtro]\"> </ng-content>\r\n          </p-overlayPanel>\r\n        </div>\r\n        <div class=\"flex flex-row gap-2\">\r\n          @if (actionsHeader()) {\r\n            @for (action of actionsHeader(); track $index) {\r\n              <kv-button\r\n                [icon]=\"action?.icon || ''\"\r\n                [label]=\"action?.label || ''\"\r\n                [severity]=\"action['severity'] || 'tertiary'\"\r\n                (onClick)=\"action?.command($event)\"\r\n                [popupIcon]=\"false\"\r\n                [items]=\"action.items || []\"\r\n                [popup]=\"isPopupButton()(action)\"\r\n                [pTooltip]=\"action?.tooltip\"\r\n              ></kv-button>\r\n            }\r\n          }\r\n          @if (selectedItem()) {\r\n            <kv-button\r\n              [pTooltip]=\"'Recolher'\"\r\n              icon=\"reorder\"\r\n              severity=\"tertiary\"\r\n              (onClick)=\"selectedItem.set(null)\"\r\n            ></kv-button>\r\n          }\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"flex-1 h-full overflow-hidden\">\r\n        <p-table\r\n          [value]=\"data()\"\r\n          [lazy]=\"lazy()\"\r\n          [selectionPageOnly]=\"selectionPageOnly()\"\r\n          [columns]=\"columns()\"\r\n          [paginator]=\"paginator()\"\r\n          [rows]=\"rows()\"\r\n          [totalRecords]=\"totalRecords()\"\r\n          [loading]=\"loading()\"\r\n          [pageLinks]=\"pageLinks()\"\r\n          [first]=\"first()\"\r\n          [scrollable]=\"scrollable()\"\r\n          scrollHeight=\"flex\"\r\n          [showCurrentPageReport]=\"true\"\r\n          [currentPageReportTemplate]=\"currentPageReportTemplate()\"\r\n          (onPage)=\"handlePageChange($event)\"\r\n          (onSort)=\"handleSort($event)\"\r\n          [rowsPerPageOptions]=\"rowsPerPageOptions()\"\r\n          (onRowSelect)=\"onCheckboxSelect($event)\"\r\n          (onRowUnselect)=\"onCheckboxUnselect($event)\"\r\n          [(selection)]=\"selectedItems\"\r\n          styleClass=\"p-datatable-sm text-xs overflow-y-auto h-full flex flex-column h-full\"\r\n        >\r\n          @if (showHeader()) {\r\n            <ng-template pTemplate=\"header\" let-columns>\r\n              <tr>\r\n                @if (selectableTable()) {\r\n                  <th style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\r\n                }\r\n                @for (col of columns; track col.field) {\r\n                  <th\r\n                    [pSortableColumn]=\"col.field\"\r\n                    [pSortableColumnDisabled]=\"!col?.sortable\"\r\n                    [style]=\"{ width: col.width || 'auto' }\"\r\n                  >\r\n                    <div class=\"flex flex-row align-items-center gap-1\">\r\n                      <span>{{ col.header }}</span>\r\n                      @if (col.sortable) {\r\n                        <p-sortIcon\r\n                          [field]=\"col.field\"\r\n                          class=\"pb-1\"\r\n                        ></p-sortIcon>\r\n                      }\r\n                    </div>\r\n                  </th>\r\n                }\r\n              </tr>\r\n            </ng-template>\r\n          }\r\n\r\n          <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n            <tr\r\n              class=\"cursor-pointer hover:bg-bluegray-100\"\r\n              [ngClass]=\"{\r\n                'bg-bluegray-50':\r\n                  rowData == selectedItem() || verifyItemSelecionado()(rowData),\r\n              }\"\r\n            >\r\n              @if (selectableTable()) {\r\n                <td>\r\n                  <p-tableCheckbox [value]=\"rowData\" />\r\n                </td>\r\n              }\r\n              @for (col of columns; track col.field) {\r\n                <td (click)=\"rowSelect(rowData)\" style=\"word-break: break-all\">\r\n                  @if (col?.template) {\r\n                    <div class=\"flex flex-row gap-2 align-items-center\">\r\n                      @if (getCustomTemplate()(col.template.name)) {\r\n                        <ng-container\r\n                          [ngTemplateOutlet]=\"\r\n                            getCustomTemplate()(col.template.name)\r\n                          \"\r\n                          [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n                        />\r\n                      }\r\n                    </div>\r\n                  } @else if (col?.icon) {\r\n                    <span class=\"material-symbols-outlined text-lg\">\r\n                      {{ col.icon(rowData) }}\r\n                    </span>\r\n                  } @else if (col?.tag) {\r\n                    <kv-tags [tags]=\"[col.tag(rowData)]\" />\r\n                  } @else {\r\n                    <span\r\n                      [ngClass]=\"{\r\n                        'font-semibold': rowData == selectedItem(),\r\n                      }\"\r\n                    >\r\n                      {{ transformData()(col.pipe, rowData[col.field]) }}\r\n                    </span>\r\n                  }\r\n                </td>\r\n              }\r\n            </tr>\r\n          </ng-template>\r\n\r\n          <ng-template pTemplate=\"emptymessage\">\r\n            <tr>\r\n              <td [attr.colspan]=\"returnColspan()\">\r\n                <div\r\n                  class=\"w-full h-full flex align-items-center justify-content-center\"\r\n                >\r\n                  <img [src]=\"emptyTableImg()\" class=\"h-10rem w-auto\" />\r\n                </div>\r\n              </td>\r\n            </tr>\r\n          </ng-template>\r\n        </p-table>\r\n      </div>\r\n    </div>\r\n  }\r\n\r\n  <div\r\n    class=\"shadow-2 p-0 m-0 col selected-item-field ml-2 flex flex-column\"\r\n    [@slideInOut]=\"isRowSelected() ? 'i.n' : 'out'\"\r\n    [style.overflow]=\"'hidden'\"\r\n  >\r\n    <!-- @if(hasSelectedItems()) {\r\n    <actions-lote-field\r\n      class=\"h-full\"\r\n      [selectedItems]=\"selectedItems()\"\r\n      [actionsLote]=\"actionsLote()\"\r\n    />\r\n    } @else -->\r\n    @if (showSelectedItem()) {\r\n      <div class=\"bg-bluegray-50 w-full h-auto p-2 relative\">\r\n        @if (hasActionsRow()) {\r\n          <actions-row-menu [actionsRow]=\"actionsRow()\" />\r\n        }\r\n\r\n        @if (isMobile()) {\r\n          <div class=\"h-2rem w-2rem\">\r\n            <kv-button\r\n              icon=\"arrow_back\"\r\n              severity=\"tertiary\"\r\n              [pTooltip]=\"'Voltar'\"\r\n              (onClick)=\"selectedItem.set(null)\"\r\n            />\r\n          </div>\r\n        }\r\n\r\n        <ng-content select=\"[selectedItemHeader]\"></ng-content>\r\n      </div>\r\n      <div class=\"p-2 overflow-y-auto h-full\">\r\n        <ng-content select=\"[selectedItem]\"></ng-content>\r\n      </div>\r\n    }\r\n\r\n    <!-- @else { Nenhum item selecionado } -->\r\n  </div>\r\n</div>\r\n", styles: ["::ng-deep .filter-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:transparent;z-index:1299}::ng-deep .p-overlaypanel{z-index:1400!important}::ng-deep .kv-table-viewer .p-datatable-wrapper{overflow-x:hidden}::ng-deep .kv-table-viewer .p-paginator .p-paginator-pages .p-paginator-page{font-size:.75rem;min-width:2rem;height:2rem}::ng-deep .kv-table-viewer .p-paginator .p-paginator-current{font-size:.75rem}::ng-deep .kv-table-viewer .p-inputwrapper .p-dropdown{margin:0;height:auto}::ng-deep .p-paginator-rpp-options .p-dropdown-panel .p-dropdown-items{padding:.25rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item{border-radius:.25rem;height:1.5rem;display:flex;align-items:center;justify-content:center}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-label{padding:.5rem}::ng-deep .p-paginator-rpp-options .p-dropdown-item .p-dropdown-trigger{width:1.5rem}::ng-deep .p-paginator-bottom .p-link{min-width:2rem;height:2rem}::ng-deep .p-paginator{padding:0rem}::ng-deep .p-dropdown-label{font-size:.75rem}::ng-deep .empty-table .p-datatable-table{height:100%}::ng-deep .p-menu{padding:.25rem}::ng-deep .p-menu-list .p-menuitem .p-menuitem-content .p-menuitem-link{font-size:.75rem;padding:.5rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { op: [{
                 type: ViewChild,
                 args: ['op']