keevo-components 1.8.340 → 1.8.342

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, model, HostListener, NgModule, signal, input, viewChild, computed, inject, contentChildren, effect, ChangeDetectionStrategy, HostBinding, Injector } from '@angular/core';
+import { EventEmitter, Component, Input, Output, ViewChild, Injectable, Directive, Pipe, ViewChildren, ContentChildren, forwardRef, signal, model, effect, HostListener, NgModule, computed, input, viewChild, inject, contentChildren, 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';
@@ -47,24 +47,26 @@ import { DividerModule } from 'primeng/divider';
 import * as i1$4 from '@angular/common/http';
 import { HttpHeaders } from '@angular/common/http';
 import { filter as filter$1 } from 'rxjs/operators';
+import { DialogModule } from 'primeng/dialog';
+import * as i2$2 from 'primeng/slider';
+import { SliderModule } from 'primeng/slider';
+import { FileUploadModule } from 'primeng/fileupload';
 import { AccordionModule } from 'primeng/accordion';
 import { BadgeModule } from 'primeng/badge';
 import * as i5$9 from 'primeng/breadcrumb';
 import { BreadcrumbModule } from 'primeng/breadcrumb';
 import * as i5$4 from 'primeng/calendar';
 import { CalendarModule } from 'primeng/calendar';
-import * as i2$2 from 'primeng/carousel';
+import * as i2$3 from 'primeng/carousel';
 import { CarouselModule, Carousel } from 'primeng/carousel';
 import { ChipModule } from 'primeng/chip';
 import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import * as i7$2 from 'primeng/contextmenu';
 import { ContextMenuModule } from 'primeng/contextmenu';
 import { DataViewModule } from 'primeng/dataview';
-import { DialogModule } from 'primeng/dialog';
 import { EditorModule } from 'primeng/editor';
-import * as i2$4 from 'primeng/fieldset';
+import * as i2$5 from 'primeng/fieldset';
 import { FieldsetModule } from 'primeng/fieldset';
-import { FileUploadModule } from 'primeng/fileupload';
 import { ImageModule } from 'primeng/image';
 import * as i5$5 from 'primeng/inputmask';
 import { InputMaskModule } from 'primeng/inputmask';
@@ -104,17 +106,15 @@ import { ToastModule } from 'primeng/toast';
 import { ToolbarModule } from 'primeng/toolbar';
 import * as i1$6 from 'primeng/tree';
 import { TreeModule } from 'primeng/tree';
-import * as i2$3 from 'primeng/selectbutton';
+import * as i2$4 from 'primeng/selectbutton';
 import { SelectButtonModule } from 'primeng/selectbutton';
 import * as i3$3 from 'primeng/stepper';
 import { StepperModule } from 'primeng/stepper';
 import { InputGroupModule } from 'primeng/inputgroup';
 import { InputGroupAddonModule } from 'primeng/inputgroupaddon';
-import * as i4$1 from 'primeng/slider';
-import { SliderModule } from 'primeng/slider';
-import Quill from 'quill';
 import * as i1$5 from 'ngx-loading';
 import { NgxLoadingModule } from 'ngx-loading';
+import Quill from 'quill';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
 import { OrgChart } from 'd3-org-chart';
 import * as d3 from 'd3';
@@ -1389,17 +1389,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
 const imgDefault$1 = '/9j/4AAQSkZJRgABAQIAdgB2AAD/4QBiRXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAASgEbAAUAAAABAAAAUgEoAAMAAAABAAMAAAITAAMAAAABAAEAAAAAAAAAAAB2AAAAAQAAAHYAAAAB/9sAQwADAgICAgIDAgICAwMDAwQGBAQEBAQIBgYFBgkICgoJCAkJCgwPDAoLDgsJCQ0RDQ4PEBAREAoMEhMSEBMPEBAQ/9sAQwEDAwMEAwQIBAQIEAsJCxAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQ/8AAEQgAkACQAwERAAIRAQMRAf/EAB0AAQABBAMBAAAAAAAAAAAAAAAGAQIHCAMECQX/xABBEAACAQQABQICCAQDBAsAAAABAgMABAURBgcSITETQQhRCRQVGSJVldEyYYGRQlJiFiM3OFNjcXN1dpKTsbO0/8QAGgEBAAIDAQAAAAAAAAAAAAAAAAEFAwQGAv/EADIRAAIABAMFCAEFAQEBAAAAAAABAgMEESExUQUSQZHwExUyYXGBobHRIjNCweE08SP/2gAMAwEAAhEDEQA/APKqgFAKAUBdDDLcSpBBE8ksjBERFJZmJ0AAPJJqUnE7IhtQq7yJ5w9ydz2Vi+s5e4XFRMu0V09SU70RtAR0jRPk9QI0V96s5GypkxXmPd+X/n35FbO2pKl4QfqfxzJ9jOU/BmO6WksZb6RJBIr3UpOta0pVelSO3gg72d7HarOXs2ngzV/XpIq49pVMfG3ovzdkmsMTisX1/ZmMtLP1ddfoQLH1a3rfSBvWz/etuCXBLvuJK+mBpxzI5lt9t21xO3WQ8CgOpf4nFZTo+08ZaXnpb6PrECydO9b11A63of2rHHLgmeNJ+qPcEyOXfcbV9MCM5PlPwZkepo7GWxkeQyM9rKRve9qFbqUL38ADWhrQ7VqTNm08eSt6P/1G5BtKog439V+LMgPEPJ3PYqL6ziLhcrGq7dET05RrZOkJPUNAeD1EnQX3qsn7KmS1vS3vfD/378i0k7UlTHuxrdfxz/wgc0M1vM9vcRPFLExR0dSrKwOiCD4IPtVY04XZlkmoldZFtQSKAUAoBQCgFASjg/l9meLZRKFeysOksbuSIlW7kaQdus7BB0dDR2d6B3aWhmVOOUOv41NKsrYaVYYxadX/AN+Vmzh7hHAcMRBMTYIkpXpe4f8AFK/Yb2x9j0g9I0u/YV0MimlU6tAsdeJzs2pmz/3Ir/XSy11Z9ms5gKhTUkXK6FBcaFCLjQoLjQoTcoVNBcpUEnxuIeEcBxRCUy1gjShelLhPwyp2OtMO5A6iek7XftWCfSyqhfrWOvEzyaibIf8A84reXDp5Xz0ZhPjHl/l+EZfUIa8sCoIu44yFU7A0479B2RrZ0djR3sDnaqimUru8Vr+dDoKSvl1KtFaGK+V888sr4K70+SL1pm+KAUAoBQE55dcu5eJplyuWR48TG3YbKtcsD3VT7KD2Lf0HfZWyoaF1D34/D99cerVtdXKnXZy/F9f7p1fOMMMVvElvbxJHFGoRERQFVQNAADwAPauiSUKssjnW3E7t4nIB869HhsrQgrUAUAoBQCgFAUqQUIoTc45oYp4ngniSSORSjo6hlZSNEEHsQR7VDSiVnkek3C7p4mDeYnLuXhiVsrikeTFSN3HctbMT2Vj7qT4b+h76Lc5XULp32kvw/X+efT6OhrlULs5ni+/916tB6rSyFAKAlHL/AIOl4uy+pCq2FmySXZJO2UntGNEHbaI37AE+dA7lFSuqmWeSz/HuaFfVqml7qvvRXt5eeTWF8nnpa5sFDFFBEkEESRxxqEREUBVUDQAA8AD2rqUklZHMtt4s5QKk8tlaggUAoCfcpuRPNLnbknx/Lvha4yEcDBbm9ciK1tt/9JK2lB136RtiPANYZ1RLp1eYzPIpptQ7S0bP4T6Lbju4tFk4h5qYKwuSNmKzsZrpAfl1sY//AIqui2vAn+mFllDseNr9USIrzB+jb528K2cuR4SyeG4tiiBY29s7W12QPcRyfgP/AGCTZ9gayStqyY3aK6MU3ZM6BXgaZqvlsTlcDkrnDZvG3WPv7OQxXFrdRNFLE48qyMAVP8jVkmoldZFZFC4XaLM6lSQKAUBaRU5kpnHNDFcRPb3ESSRSKUdHUMrKRogg+QahpNNM9wxOF7yzNfeYHB0vCOYIj6TYXjPJaEHuqgjaHZJ2uwN+40fOwOWraV0szDwvL8ex0tBVqpl7r8UKV/PzySxtksuRF60zfLoYZbiVIIInklkYIiIpLMxOgAB5JNSk4nZENqFXeRspwngIuGeH7TDoIzJEnVO6Af7yVu7HYALDfYEjfSFHtXW00hU8pS17+vXwchUTe2mxTMcXq/TV2yxSwvd5tn2AK2DAy6oIFAKAyp8NXIzJfEBzQsuC4JZLXFwIb3L3iAbgtEIDdO+3WxKovnu2yCAa16qoVNLcfHgbNJTOpmqDhxPYngzgvhfl7w1Y8IcHYa3xmJx8Yjgt4V0B82Y+WYnuWOySSSSa5WZMimxOKN3Z1kuXDKhUECsj7deD2KA1y+MT4W8Nzz4NuuI+H8dFDxzhrdpbC4jUK1/Gg2bWQ/4tjfQT/C2u4Bbe/Q1jp492Lwv48zQrqNVMG9Cv1L58jyVdHjdo5FKspIZSNEH5GumOWKUAoBQFpHvUko+Nxdw9DxRgLrEyBRK69du7aHRKP4TvR0N9job6SR71r1UhVEpy37epsU03sJsMzT6/v342ZrZNDNbzPb3ETxSxMUdHUqysDogg+CD7VyTThdmdcmoldZE85O8PRZXPy5a5CtFilV1Q6O5X2EOiD2AVjvYIYKastlyVMm77/j99fJWbUqHLlqWv5cfJW+/q5m+ujOdLqHkrUAUAoD0i+i74Vs7Tlrxdxr6S/W8lm1xpcjuIreBJAB8gWuW/sPlVDteNuZDBor9cjoNjwJS4o9X9f+m61VBcCgFAKA8Y/i24VtODPiP48wVhEsVv9p/XkRRoILmNLjpA9gPW0B8q6yijcyRDE9PrA5GugUuojhWv3iYjrZNUUAoClSC2oPRhDnFw9Fis/Fl7boWPKqzsg7alTQc6AA0QyneySxYn2rntqSFLmKYv5fa/P3c6PZc5zJW484frh/ZPuU+M+zuDLaRklSS+kkunWQa1s9KlRr+Eoiked734Iqz2bL3KdPW769kVe0o9+oflZf39smQFb5oMuqDyKAUAoD0b+i64xs7ngPjDgFpVF3j8smWVCe7RTwpESPmA1uN/LrHzqh2vLajhj8rHQbHmJwRQaO5u7VQXAoBQCgPFz4qOMbPjz4huOuJcfKstrJlGtIJFO1kjt0W3VwfkRECP5Guso5blyIYXp94nI1sxTKiKJa/WBiqtk1RQCgFAWkVJKIdzYxn2jwXcyKkzyWUkd0ix9/B6WLDR7BHc+2tb3oGq/aUtzKd24Y9cyw2dMUuoV+OHXukSXEWH2VirLGer6v1O3jg6+np6uhQu9bOt68brclwdnAoNFY05kfaRuPV35ndHishjZWoIFAKAUBkbkBzozfIXmZjuPcRGbiCMG2yVn1dIu7NyPUj37HsrKfZkUnY2DgqZCqZbgZsU1RFTTFGj2J5bczOC+bXClrxlwLmocjjrpRvpIEkEmtmKVPKON91P8iNggnlZsqOTFuRrE6yVOgnw78DuiU1jMgoDVj40vizw3KPhe+5e8F5SO444y0BgPoPv7JhcaMzkfwylT+BfIJDnsAGsqCic6JTI1+lfJW19apELggf6n8Hld5rozmRQCgFAKAo3ipJR0stYDK4q8xZm9IXlvJB6nT1dHWpXetjet+N1jmQdpA4NU1zMkuPs41Glezudush4RcPFDyytQBQCgFAKAlPLzmjzB5UZr/aDl5xVfYS9ICyGBwY5lB2FkjYFJF37MCKxzZME5bsxXMsqdMkPeluxsnhPpNueePtFtsvw1wjlZEGvrD2s8MjH5sElCf2UVXxbJkt4NosIdrzksUmRTmD9ID8RPHVnLjbLM47ha1mBVxg7ZopmX/vpGeRT/NCprLL2bIlu7V/UxTdp1ExWTt6GuVzc3F5cS3d3PJPPM5kklkYs7sTssxPckn3Nb6VsEV7beLOOgFAKAUAoCh8VIRbQ9CgRcPFDyytQBQCgFASfg/lfzH5gyenwPwLnc4OrpZ7GwkljQ/6nUdK/1IrHHOlyvHEkZJcmZN8ELZmDA/AJ8T+bRZZuBrXFRv3DX+Ut1Ov5qjsw/qBWrFtKnh/lf2NuHZlTF/G3uSuH6M/4hJUDSZfguE/5XyU5I/8ATARWPvWRo+vcyrZM/Vdex1b/AOjb+I2zQtbtwrfED+G3yjgn/wByNRUrash68iHsmoWnMx9xR8G3xL8JI82R5T5W6iQb68Y8V/sfMLAzt/cVngrqePKL+vswR0FRBnDyx+jEOTxeTwt7Jjsxjrqxu4TqSC5haKRD/NWAIrZTUSujUcLhdmdapIFAKAUBQ+KkItoejqYm/wDtTFWWT9L0vrlvHP0dXV09ahtb0N6351WOXH2kCj1SZ7mQdnG4L3s7cjujxWQxsrUECgMj8kOQPMPn7xIcDwRjlFvbdLX+Sudra2SHwXYA7Y6OkUFjo9tAkYKipl00O9GbFPTTKmLdg5no9yb+AvkjywggvuIsWvGmcQAvd5aINbK3/V2uygHj+Prb5EeKoZ+0Z07CF7q8vydBI2bJk4xLefn+DY62tbayt47Szt4oIIlCRxRIFRFHgADsBWg23iywStgjlqAKAUAoCOca8uOAuY+OOK474QxWcttEKt7bLI0e/dHI6kP81INZJc2OU7wOxjmSoJqtGrmk/P76Nu3jtLnibkHfTerGGkfh6/m6usfK3nbvv5LITv8AzjsDb021cd2fz/JT1OyVbekcvwaFZHHZDD5C5xWWsp7O9s5WguLeeMpJFIp0yMp7ggggg1dJqJXRSNOF2eZ16ECgKHxUko6WWvxisVeZQw+qLO3kn9Pq6evoUtrejrevOqxzI+zgceib5GSXA5kagTtd25ka5T5MZHgu1jZ5nksZJLV2kO/B6lCnZ/CEdAPGta8AVp7NmOZTpPhh1zNzaMvs6h2449e6ZMQasCvZdUEHZxmOu8vkrTE2EfqXN7PHbwpvXVI7BVH9yKhtQq7JScTsj225L8peHOSnLvFcBcOW8YWziDXlyF095dED1Z3Pklj434UKo7AVyNROiqJjjiOxp5ENPLUEJOawmYUAoBQCgFAKAUBoV9JfyVw8WMxXPHC2kcF+10mJzPprr6wrIxgmb/UvQUJ8kMg8LV1sqod3Jfqik2vTqynLPJnn5V2UQoC0mpJRDubGT+zuC7qNXmSS9kjtUaM61s9TBjsfhKI49971rRNV+0pjl07txw65G/s6WplQr8MevdogHJ3iCLFZ+XE3JVYsqqornQ1Mmyg2SOxDMPBJYqKrNlz1Lm7jyi++BZ7VkOZLUyH+PDyftw5Wv5Gb66I54uqTySzlL/xV4M/8wY7/APTHWKd+1F6MyyP3YfVHubXHHZigFAKAUAoBQCgFAay/SJ/8s+S/8VsP/sqw2Z/0L0ZXbU/5n6o8oa6U5goe1SC2oPRhDnFxDDlc9FibboaPFKyM47kyvouNgkaHSo8AhuoH2rntqz1MmKXD/H7f4+7nR7LkuXKccWcX1w/sgcM0tvKk8ErxyxsHR0YhlYHYII8EGqxNwu6LJpRKzyNlOEs/HxNw/Z5dTGJJU6Z0Uj8Eq9mGgSV79wD36Sp9662mnqolKNe/r18HIVEvsZ0UrT1yzXDH1WF7rNM+wD7VsGBnfweYveHs1j8/jWRbvGXUV5bl16lEkbh1JHuNgdq8xQqJOF8RDE4WolwNjvvFPiX/ADnBfpMf71od2U+j5lh3rUarkPvFPiX/ADnBfpMf707sp9HzHetRquQ+8U+Jf85wX6TH+9O7KfR8x3rUarkPvFPiX/OcF+kx/vTuyn0fMd61Gq5D7xT4l/znBfpMf707sp9HzHetRquQ+8U+Jf8AOcF+kx/vTuyn0fMd61Gq5D7xT4l/znBfpMf707sp9HzHetRquQ+8U+Jf85wX6TH+9O7KfR8x3rUarkPvFPiX/OcF+kx/vTuyn0fMd61Gq5EP5qfGBzp5ycITcD8b5HFzYueaK4dbfHpE/XGdr+Id/NZZNDJkRb8GZinV06og3I8jClbZplpPtUkpHxeLuIYuF8BdZZyhlRei3Rv8cp7KNbGx7nR30g1r1M9U8pzH7evXwbFPK7ebDL1+v698L2NbZppbiV555XklkYu7uxLMxOyST5JNck24nd5nXJKFWRbUEko5f8Yy8I5cGTpNheMkd2CDtVBOpBoE7XZOvcEjzojcoqp0szHwvP8APsaFfSKpl7yvvQ3t5+WOGNs+GtrmwUM0VxElxbypJFIodHRgyspGwQR5BrqU7q6OZaawZyA1OZ5aLqggUAoBQCgFAKAUAoBQFpNTkSkcc00VvE9xcSpHFGpd3dgqqoGyST4AqG0k2z3DC4nurM195gcYy8XZgmPpFhZs8doAO7KSNyHYB23SDr2Gh52Ty1bVOqmXWSy/J0tBSKml7z8USV/Lyzawvms+RF60zfFAKAnHLvmJLwxKuKyrvJipG7HuzWzE92Ue6k+V/qO+w1lQ1zp32czw/X+eXTra6hVQt+X4vvrh1bOUM0VxEk8EqSRSKHR0YFWUjYII8giujTTV0znGmnZo5AfnUnlorUEFaAUAoBQCgFAU3qpBQn5UJSOOaaK3ie4uJUjijUu7uwCqoGyST4AFQ2liz0ld2Rg3mJzEl4mlbFYp3jxUbdz3DXLA9mYeyj2X+p76C85XVzqHuQeH7668ujoaFU67SPxfXXXnB6rSyFAKAUAoCU8H8w81wnIsJd77HhCgs5ZSFTuW3Ge/QepiToaOzsb0RuUtbMpnbOHT8aFfVbOl1F4oLQxN3btnkscr4KyfCy4YGbcBxZgOJog2IyMcsgQO8Dfhlj7KTtT3IBYAsNrvwTXRSamVUK8t+3Hr4Ofm086T+5DbF/flfPNXxtmk8D69ZzCVDGpIsV6hQWGx86EWGx86Cw6hQmxQsaCxSoJPkZ/i3h/hmMtl8jHFIULpAv4pZOzEaUdxsqQGOl35IrBPqZVOrzH7cevgzSqebP8A24b4pcMOdss3xtkm8DCPGPMDL8XS+mS1nYBQBaRykqx2Dtz26zsDWxoaGhvZPO1VbMqnZ4LT86nRUtBLpknFaKLW3rlnbB2evwRetM3hQCgFAKAUAoC6GaW3lSeCV45Y2Do6MQysDsEEeCDUpuF3RDSiVnkTzh7nFn8VELbLQJlYlXSM7+nKOwA24B6h2PkFiTsmrKTtSbLVo1vL56+fMq5+ypcx3lvd14rjy+rK1if4zmxwXkelZL6WykeT01S6hK78aYsvUqjv5LDWjvQ71Zy9pU8x2vb16ZWzNnVEtXtf06T+CS2GWxWVEhxeStbwRa9T0Jlk6N71vpJ1vR/sa3IJkEzwNP0dzTjlxy7KNNX1O3WQ8CgOpf5fE4ro+08naWfq7KevMsfVrzrqI35H96xxzIJfjaXqzJBLjmeBN+iI1k+a/BeN6lS/lvZElMbJaxFvG9sGbpRl7eQx3sa2O9aczaVPLdr39Ol8G1L2dUTFe1vXptciAcQc4s/lYjbYmBMVEy6dkf1JTsEHTkAKO48DqBGw1Vk/ak2ZhB+lfPMtJGypct70x72nBcOfHyxy4kDmmmuJnuLiV5ZZWLu7sWZmJ2SSe5JPvVa24ndlmkoVZZFtQSKAUAoD/9k=';
 class KvTableComponent {
     set setConfig(value) {
-        this.config = {
+        this.tableConfig.set({
             enableCation: value.enableCation || true,
             enableSelect: value.enableSelect || false,
             enableFilter: value.enableFilter || true,
             ...value,
-        };
-        if (this.config.enableFilter) {
-            this.config.columns.forEach((col) => {
-                this.globalFilterFields.push(col.field);
-            });
-        }
+        });
+        this.definirColunasConfiguraveis(this.tableConfig());
     }
     constructor(datePipe, decimalPipe, cpfCnpjPipe, telefonePipe, renderer, elementRef) {
         this.datePipe = datePipe;
@@ -1408,6 +1404,7 @@ class KvTableComponent {
         this.telefonePipe = telefonePipe;
         this.renderer = renderer;
         this.elementRef = elementRef;
+        this.tableConfig = signal(undefined);
         this.globalFilterFields = [];
         this.selectedSize = '';
         //menuColumns: KvMenuItem[] = [];
@@ -1465,6 +1462,11 @@ class KvTableComponent {
         this.doubleClickEvent = new EventEmitter();
         this.filterField = new EventEmitter();
         this.onSwitchTableChange = new EventEmitter();
+        this.configuracaoEffect = effect(() => {
+            const config = this.tableConfig();
+            this.definirFiltrosGlobais(config);
+            this.definirColunasConfiguraveis(config);
+        });
         this.isRowSelectable = this.isRowSelectable.bind(this);
     }
     ngDoCheck() {
@@ -1521,6 +1523,20 @@ class KvTableComponent {
             });
         });
     }
+    definirColunasConfiguraveis(config) {
+        this.columns.splice(0, this.columns.length);
+        config.columns.forEach((col) => {
+            this.columns.push(col);
+        });
+    }
+    definirFiltrosGlobais(config) {
+        if (config.enableFilter) {
+            this.globalFilterFields.splice(0, this.globalFilterFields.length);
+            for (const column of config.columns) {
+                this.globalFilterFields.push(column.field);
+            }
+        }
+    }
     resetTable() {
         if (this.ptable)
             this.ptable.reset();
@@ -1870,6 +1886,9 @@ class KvTableComponent {
     onSort(e) {
         this.dataSource = [...this.dataSource];
     }
+    get config() {
+        return this.tableConfig();
+    }
     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>\r\n  @if (filtrosAvancados) {\r\n  <p-panel\r\n    header=\"Filtros avan\u00E7ados\"\r\n    [toggleable]=\"true\"\r\n    [collapsed]=\"true\"\r\n    (collapsedChange)=\"collapsed = !collapsed\"\r\n    [style]=\"{ 'margin-bottom': '2px' }\"\r\n  >\r\n    <ng-template pTemplate=\"headericons\">\r\n      @if (!collapsed) {\r\n      <i class=\"pi pi-filter\"></i>\r\n      }\r\n      <!-- \u00CDcone quando o painel est\u00E1 aberto -->\r\n      @if (collapsed) {\r\n      <i class=\"pi pi-minus\"></i>\r\n      }\r\n      <!-- \u00CDcone quando o painel est\u00E1 fechado -->\r\n    </ng-template>\r\n    <ng-content></ng-content>\r\n  </p-panel>\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]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 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-0 m-0\"\r\n        [style.background-color]=\"'#EAEAEA'\"\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            tamanhoTela < 768 ? 'col-10' : 'col-12'\r\n          }} mt-1 mb-2 gap-1\"\r\n        >\r\n          @if (config.enableFilter) {\r\n          <span class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(dt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              autocomplete=\"off\"\r\n              #inputField\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-2\">\r\n              <div\r\n                class=\"flex flex-column text-medium w-15rem p-1\"\r\n                *ngFor=\"let col of columns\"\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\">\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        } \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          class=\"text-sm\"\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>{{ col.header }}</span>\r\n            @if (col.sortable) {\r\n            <p-sortIcon\r\n              [field]=\"col.field\"\r\n              style=\"font-size: 10px\"\r\n            ></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        } \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]=\"{ capitalize: tableCaptalized, 'last': rowIndex === dataSource.length - 1  }\"\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=\"{{col.styleClass? col.styleClass(rowData, col, rowData[col.field]):''}} \"            >\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                  }}\"\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                    >{{ 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 class=\"material-symbols-outlined\">\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                  <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                </span>\r\n                }\r\n              </ng-template>\r\n            </td>\r\n          } \r\n          @if (!rowgroup && !col.grouped && !col.template) {\r\n            <td class=\"rowTable {{col.styleClass? col.styleClass(rowData, col, rowData[col.field]):''}} \" [pTooltip]=\"returnTooltipRow(rowData, col)\" >\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                } \r\n                @if (!isChipField(col) && !col.iconField && !isImageField(col)){\r\n                <span>\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                  >\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 class=\"material-symbols-outlined\">\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                  <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                </span>\r\n                }\r\n              </ng-template>\r\n            </td>\r\n          } \r\n          @if (col.template) {\r\n            <td class=\"rowTable {{col.styleClass? col.styleClass(rowData, col, rowData[col.field]):''}} \">\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 p-1\"\r\n              style=\"font-size: 25px\"\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\">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:#eaeaea!important;padding:0!important;border-radius:5px!important}::ng-deep .p-panel.p-panel-toggleable .p-panel-header{background-color:#eaeaea}::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{background-color:#eaeaea}.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:.7rem;height:1rem}::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}\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$2.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: i11.Panel, selector: "p-panel", inputs: ["toggleable", "header", "collapsed", "style", "styleClass", "iconPos", "expandIcon", "collapseIcon", "showHeader", "toggler", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { 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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.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: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }] }); }
 }
@@ -2179,11 +2198,11 @@ class KvTreetableComponent {
             this.inputBusca.nativeElement.value = '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTreetableComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTreetableComponent, selector: "kv-tree-table", inputs: { disableRowNodeSticky: "disableRowNodeSticky", config: "config", dataSource: "dataSource", gridLines: "gridLines", tableCaptalized: "tableCaptalized", selectedItems: "selectedItems", paginator: "paginator", rows: "rows", treeTableDraggable: "treeTableDraggable", transferArrayItem: "transferArrayItem", ordenacao: "ordenacao", totalRecords: "totalRecords", textoEmptyMessage: "textoEmptyMessage", childrenRecoil: "childrenRecoil", showHeader: "showHeader", scrollHeight: "scrollHeight", pageLinksOptions: "pageLinksOptions", pageLinks: "pageLinks", showFirstLastIcon: "showFirstLastIcon", _templates: ["templates", "_templates"] }, outputs: { onFilter: "onFilter", onPaginate: "onPaginate", onActiveItem: "onActiveItem", onActiveItemLote: "onActiveItemLote", doubleClickEvent: "doubleClickEvent", onNodeSelect: "onNodeSelect", onNodeUnselect: "onNodeUnselect", onDropItem: "onDropItem" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "pTreeTable", first: true, predicate: TreeTable, descendants: true }, { propertyName: "inputBusca", first: true, predicate: ["inputBusca"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"!treeTableDraggable\">\r\n  <p-treeTable\r\n    #tt\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (onNodeSelect)=\"onNodeSelected($event)\"\r\n    (onNodeUnselect)=\"onNodeUnselected($event)\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          } }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n              }\r\n            </div>\r\n          </th>\r\n          } @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n        @for(col of columns; track $index){\r\n        <td\r\n          [style.position]=\"rowNode.level !== 0 ? 'sticky' : null\"\r\n          [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"\r\n            rowNode.level === 0 && col.field != config.columns[0].field\r\n              ? 'none'\r\n              : ''\r\n          \"\r\n        >\r\n          <div class=\"flex flex-row {{ align(col) }}\">\r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n            >\r\n              <p-treeTableToggler class=\"hiddenVisible\" [rowNode]=\"rowNode\" />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n\r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n\r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n          </div>\r\n\r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end\">\r\n            @for (actionPai of config.actionsPai; track $index) { @if\r\n            (getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            } }\r\n          </div>\r\n          }\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"treeTableDraggable\"\r\n  cdkDropList\r\n  class=\"example-list\"\r\n  (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n  <p-treeTable\r\n    #tt\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [pageLinks]=\"pageLinks\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    currentPageReportTemplate=\"{first} - {last} de {{ totalRecords }}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n              }\r\n            </div>\r\n          </th>\r\n          }\r\n          <th [style.width]=\"5\"></th>\r\n        </tr>\r\n      </ng-template>      \r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        cdkDrag\r\n        [cdkDragData]=\"rowNode\"\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n        @for(col of columns; track $index){\r\n        <td\r\n          [style.position]=\"!disableRowNodeSticky && rowNode.level !== 0 ? 'sticky' : null\"\r\n          [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \"\r\n        >\r\n          <div class=\"flex flex-row  {{ align(col) }}\">\r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n           \r\n            >\r\n              \r\n              <p-treeTableToggler \r\n                class=\"hiddenVisible\" \r\n                [rowNode]=\"rowNode\"\r\n              />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n                  \r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"rowNode.level === 0 ? 'none' : ''\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n            class=\"flex align-items-center \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            @if(!config.actionsPai?.length) {\r\n              <span\r\n            class=\"material-symbols-outlined\"\r\n            style=\"cursor: grab; font-size: 25px;\"\r\n            cdkDragHandle\r\n          >\r\n            drag_indicator\r\n          </span>\r\n            }\r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n          \r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n            \r\n          </div>\r\n          \r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end align-items-center \">\r\n            @for (actionPai of config.actionsPai; track $index) {\r\n            @if(getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            <span\r\n        class=\"material-symbols-outlined\"\r\n        style=\"cursor: grab; font-size: 25px;\"\r\n        cdkDragHandle\r\n      >\r\n        drag_indicator\r\n      </span>\r\n            } }\r\n          </div>\r\n          }\r\n          \r\n        \r\n\r\n        </td>\r\n        @if(!config.actionsPai?.length && !config.actions?.length) {\r\n        <td>\r\n            <span\r\n          class=\"material-symbols-outlined\"\r\n          style=\"cursor: grab; font-size: 25px;\"\r\n          cdkDragHandle\r\n        >\r\n          drag_indicator\r\n        </span>\r\n        </td>\r\n      }\r\n      </tr>\r\n\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n", styles: ["::ng-deep .p-treetable .p-treetable-tbody>tr>td{padding:.4rem}::ng-deep .p-treetable .p-treetable-header{padding:0rem}span{font-size:14px}:host ::ng-deep .p-treetable table{table-layout:auto!important}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transform:scale(1.2);transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}::ng-deep .p-treetable .p-treetable-thead>tr>th{background-color:#eaeaea}.tag{width:5px;height:20px;border-radius:.25rem}.cdk-drag-preview{display:flex;align-items:center;justify-content:space-between;border-radius:10px!important}.cdk-drop-list-dragging{cursor:grabbing}:host ::ng-deep .cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep .cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}::ng-deep svg.p-icon{width:.7rem;height:1rem}::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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.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: "directive", type: i5$3.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i5.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "directive", type: i7.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i7.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i8$2.TreeTable, selector: "p-treeTable", inputs: ["columns", "style", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "paginatorLocale", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "value", "virtualRowHeight", "selectionKeys"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel", "selectionKeysChange"] }, { kind: "component", type: i8$2.TreeTableToggler, selector: "p-treeTableToggler", inputs: ["rowNode"] }, { kind: "directive", type: i8$2.TTSortableColumn, selector: "[ttSortableColumn]", inputs: ["ttSortableColumn", "ttSortableColumnDisabled"] }, { kind: "component", type: i8$2.TTSortIcon, selector: "p-treeTableSortIcon", inputs: ["field", "ariaLabelDesc", "ariaLabelAsc"] }, { kind: "directive", type: i8$2.TTRow, selector: "[ttRow]", inputs: ["ttRow"] }, { kind: "component", type: i8$2.TTCheckbox, selector: "p-treeTableCheckbox", inputs: ["disabled", "value"] }, { kind: "component", type: i8$2.TTHeaderCheckbox, selector: "p-treeTableHeaderCheckbox" }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvTreetableComponent, selector: "kv-tree-table", inputs: { disableRowNodeSticky: "disableRowNodeSticky", config: "config", dataSource: "dataSource", gridLines: "gridLines", tableCaptalized: "tableCaptalized", selectedItems: "selectedItems", paginator: "paginator", rows: "rows", treeTableDraggable: "treeTableDraggable", transferArrayItem: "transferArrayItem", ordenacao: "ordenacao", totalRecords: "totalRecords", textoEmptyMessage: "textoEmptyMessage", childrenRecoil: "childrenRecoil", showHeader: "showHeader", scrollHeight: "scrollHeight", pageLinksOptions: "pageLinksOptions", pageLinks: "pageLinks", showFirstLastIcon: "showFirstLastIcon", _templates: ["templates", "_templates"] }, outputs: { onFilter: "onFilter", onPaginate: "onPaginate", onActiveItem: "onActiveItem", onActiveItemLote: "onActiveItemLote", doubleClickEvent: "doubleClickEvent", onNodeSelect: "onNodeSelect", onNodeUnselect: "onNodeUnselect", onDropItem: "onDropItem" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], viewQueries: [{ propertyName: "pTreeTable", first: true, predicate: TreeTable, descendants: true }, { propertyName: "inputBusca", first: true, predicate: ["inputBusca"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"!treeTableDraggable\">\r\n  <p-treeTable\r\n    #tt\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (onNodeSelect)=\"onNodeSelected($event)\"\r\n    (onNodeUnselect)=\"onNodeUnselected($event)\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          } }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n              }\r\n            </div>\r\n          </th>\r\n          } @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n        @for(col of columns; track $index){\r\n        <td\r\n          [style.position]=\"rowNode.level !== 0 ? 'sticky' : null\"\r\n          [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"\r\n            rowNode.level === 0 && col.field != config.columns[0].field\r\n              ? 'none'\r\n              : ''\r\n          \"\r\n        >\r\n          <div class=\"flex flex-row {{ align(col) }}\">\r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n            >\r\n              <p-treeTableToggler class=\"hiddenVisible\" [rowNode]=\"rowNode\" />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n\r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n\r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n          </div>\r\n\r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end\">\r\n            @for (actionPai of config.actionsPai; track $index) { @if\r\n            (getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            } }\r\n          </div>\r\n          }\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"treeTableDraggable\"\r\n  cdkDropList\r\n  class=\"example-list\"\r\n  (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n  <p-treeTable\r\n    #tt\r\n    class=\"treetabledraggable\"\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [pageLinks]=\"pageLinks\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    currentPageReportTemplate=\"{first} - {last} de {{ totalRecords }}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n              }\r\n            </div>\r\n          </th>\r\n          }\r\n          <th [style.width]=\"5\"></th>\r\n        </tr>\r\n      </ng-template>      \r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        cdkDrag\r\n        cdkDragLockAxis=\"y\"\r\n        [cdkDragData]=\"rowNode\"\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n      \r\n        @for(col of columns; track $index){\r\n          <td\r\n          class=\"draggable-cell\"\r\n          [style.position]=\"!disableRowNodeSticky && rowNode.level !== 0 ? 'sticky' : null\"\r\n          \r\n        >\r\n        \r\n        <!-- [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \" -->\r\n        \r\n          <div class=\"flex flex-row  {{ align(col) }}\">\r\n            \r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n           \r\n            >\r\n            <span\r\n            class=\"material-symbols-outlined drag-icon\"\r\n            style=\"cursor: grab; font-size: 25px; color: #6b7280; opacity: 0.9;\"\r\n            cdkDragHandle\r\n          >\r\n            drag_indicator\r\n          </span>\r\n              <p-treeTableToggler \r\n                class=\"hiddenVisible\" \r\n                [rowNode]=\"rowNode\"\r\n              />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n                  \r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"rowNode.level === 0 ? 'none' : ''\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n            class=\"flex align-items-center \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            \r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n          \r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n            \r\n          </div>\r\n          \r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end align-items-center \">\r\n            @for (actionPai of config.actionsPai; track $index) {\r\n            @if(getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            \r\n            } }\r\n          </div>\r\n          }\r\n          \r\n        \r\n\r\n        </td>\r\n      \r\n      </tr>\r\n\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .p-treetable .p-treetable-tbody>tr>td{padding:.4rem}::ng-deep .p-treetable .p-treetable-header{padding:0rem}span{font-size:14px}:host ::ng-deep .p-treetable table{table-layout:auto!important}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transform:scale(1.2);transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}::ng-deep .p-treetable .p-treetable-thead>tr>th{background-color:#eaeaea}:host ::ng-deep .treetabledraggable .p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler{width:1rem;height:1rem}.tag{width:5px;height:20px;border-radius:.25rem}:host ::ng-deep .draggable-cell .drag-icon{visibility:hidden}:host ::ng-deep .draggable-cell:hover .drag-icon{visibility:visible}.cdk-drag-preview{display:flex;align-items:center;justify-content:space-between;border-radius:10px!important}.cdk-drop-list-dragging{cursor:grabbing}:host ::ng-deep .cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep .cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}::ng-deep svg.p-icon{width:.7rem;height:1rem}::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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.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: "directive", type: i5$3.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i5.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "directive", type: i7.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i7.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i8$2.TreeTable, selector: "p-treeTable", inputs: ["columns", "style", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "paginatorLocale", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "value", "virtualRowHeight", "selectionKeys"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel", "selectionKeysChange"] }, { kind: "component", type: i8$2.TreeTableToggler, selector: "p-treeTableToggler", inputs: ["rowNode"] }, { kind: "directive", type: i8$2.TTSortableColumn, selector: "[ttSortableColumn]", inputs: ["ttSortableColumn", "ttSortableColumnDisabled"] }, { kind: "component", type: i8$2.TTSortIcon, selector: "p-treeTableSortIcon", inputs: ["field", "ariaLabelDesc", "ariaLabelAsc"] }, { kind: "directive", type: i8$2.TTRow, selector: "[ttRow]", inputs: ["ttRow"] }, { kind: "component", type: i8$2.TTCheckbox, selector: "p-treeTableCheckbox", inputs: ["disabled", "value"] }, { kind: "component", type: i8$2.TTHeaderCheckbox, selector: "p-treeTableHeaderCheckbox" }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTreetableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-tree-table', template: "<div *ngIf=\"!treeTableDraggable\">\r\n  <p-treeTable\r\n    #tt\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (onNodeSelect)=\"onNodeSelected($event)\"\r\n    (onNodeUnselect)=\"onNodeUnselected($event)\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          } }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n              }\r\n            </div>\r\n          </th>\r\n          } @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n        @for(col of columns; track $index){\r\n        <td\r\n          [style.position]=\"rowNode.level !== 0 ? 'sticky' : null\"\r\n          [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"\r\n            rowNode.level === 0 && col.field != config.columns[0].field\r\n              ? 'none'\r\n              : ''\r\n          \"\r\n        >\r\n          <div class=\"flex flex-row {{ align(col) }}\">\r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n            >\r\n              <p-treeTableToggler class=\"hiddenVisible\" [rowNode]=\"rowNode\" />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n\r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n\r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n          </div>\r\n\r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end\">\r\n            @for (actionPai of config.actionsPai; track $index) { @if\r\n            (getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            } }\r\n          </div>\r\n          }\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"treeTableDraggable\"\r\n  cdkDropList\r\n  class=\"example-list\"\r\n  (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n  <p-treeTable\r\n    #tt\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [pageLinks]=\"pageLinks\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    currentPageReportTemplate=\"{first} - {last} de {{ totalRecords }}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n              }\r\n            </div>\r\n          </th>\r\n          }\r\n          <th [style.width]=\"5\"></th>\r\n        </tr>\r\n      </ng-template>      \r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        cdkDrag\r\n        [cdkDragData]=\"rowNode\"\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n        @for(col of columns; track $index){\r\n        <td\r\n          [style.position]=\"!disableRowNodeSticky && rowNode.level !== 0 ? 'sticky' : null\"\r\n          [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \"\r\n        >\r\n          <div class=\"flex flex-row  {{ align(col) }}\">\r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n           \r\n            >\r\n              \r\n              <p-treeTableToggler \r\n                class=\"hiddenVisible\" \r\n                [rowNode]=\"rowNode\"\r\n              />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n                  \r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"rowNode.level === 0 ? 'none' : ''\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n            class=\"flex align-items-center \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            @if(!config.actionsPai?.length) {\r\n              <span\r\n            class=\"material-symbols-outlined\"\r\n            style=\"cursor: grab; font-size: 25px;\"\r\n            cdkDragHandle\r\n          >\r\n            drag_indicator\r\n          </span>\r\n            }\r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n          \r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n            \r\n          </div>\r\n          \r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end align-items-center \">\r\n            @for (actionPai of config.actionsPai; track $index) {\r\n            @if(getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            <span\r\n        class=\"material-symbols-outlined\"\r\n        style=\"cursor: grab; font-size: 25px;\"\r\n        cdkDragHandle\r\n      >\r\n        drag_indicator\r\n      </span>\r\n            } }\r\n          </div>\r\n          }\r\n          \r\n        \r\n\r\n        </td>\r\n        @if(!config.actionsPai?.length && !config.actions?.length) {\r\n        <td>\r\n            <span\r\n          class=\"material-symbols-outlined\"\r\n          style=\"cursor: grab; font-size: 25px;\"\r\n          cdkDragHandle\r\n        >\r\n          drag_indicator\r\n        </span>\r\n        </td>\r\n      }\r\n      </tr>\r\n\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n", styles: ["::ng-deep .p-treetable .p-treetable-tbody>tr>td{padding:.4rem}::ng-deep .p-treetable .p-treetable-header{padding:0rem}span{font-size:14px}:host ::ng-deep .p-treetable table{table-layout:auto!important}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transform:scale(1.2);transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}::ng-deep .p-treetable .p-treetable-thead>tr>th{background-color:#eaeaea}.tag{width:5px;height:20px;border-radius:.25rem}.cdk-drag-preview{display:flex;align-items:center;justify-content:space-between;border-radius:10px!important}.cdk-drop-list-dragging{cursor:grabbing}:host ::ng-deep .cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep .cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}::ng-deep svg.p-icon{width:.7rem;height:1rem}::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}\n"] }]
+            args: [{ selector: 'kv-tree-table', template: "<div *ngIf=\"!treeTableDraggable\">\r\n  <p-treeTable\r\n    #tt\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    (onNodeSelect)=\"onNodeSelected($event)\"\r\n    (onNodeUnselect)=\"onNodeUnselected($event)\"\r\n    [showCurrentPageReport]=\"true\"\r\n    currentPageReportTemplate=\"{first} - {last} de {totalRecords}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          } }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n              }\r\n            </div>\r\n          </th>\r\n          } @if (config.actions?.length ?? 0 > 0) {\r\n          <th [style.width]=\"5\"></th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n        @for(col of columns; track $index){\r\n        <td\r\n          [style.position]=\"rowNode.level !== 0 ? 'sticky' : null\"\r\n          [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"\r\n            rowNode.level === 0 && col.field != config.columns[0].field\r\n              ? 'none'\r\n              : ''\r\n          \"\r\n        >\r\n          <div class=\"flex flex-row {{ align(col) }}\">\r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n            >\r\n              <p-treeTableToggler class=\"hiddenVisible\" [rowNode]=\"rowNode\" />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n\r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n\r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n          </div>\r\n\r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end\">\r\n            @for (actionPai of config.actionsPai; track $index) { @if\r\n            (getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            } }\r\n          </div>\r\n          }\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"treeTableDraggable\"\r\n  cdkDropList\r\n  class=\"example-list\"\r\n  (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n  <p-treeTable\r\n    #tt\r\n    class=\"treetabledraggable\"\r\n    [value]=\"dataSource\"\r\n    [columns]=\"config.columns\"\r\n    [resizableColumns]=\"true\"\r\n    [tableStyle]=\"{ 'min-width': '50rem' }\"\r\n    [resizableColumns]=\"true\"\r\n    [paginator]=\"paginator\"\r\n    [rows]=\"rows\"\r\n    [pageLinks]=\"pageLinks\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [rowsPerPageOptions]=\"[5, 10, 25, 50]\"\r\n    [showFirstLastIcon]=\"tamanhoTela > 960 ? true : false\"\r\n    [pageLinks]=\"tamanhoTela > 960 ? 2 : 1\"\r\n    [styleClass]=\"gridLines ? 'p-treetable-gridlines' : ''\"\r\n    [(selection)]=\"selectedItems\"\r\n    [lazy]=\"config.lazy\"\r\n    (onLazyLoad)=\"paginate($event)\"\r\n    currentPageReportTemplate=\"{first} - {last} de {{ totalRecords }}\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n  >\r\n    <ng-template pTemplate=\"caption\" *ngIf=\"config.enableCation\">\r\n      <div\r\n        class=\"flex flex-row flex-wrap justify-content-between align-items-center grid formgrid p-fluid col-12 m-0\"\r\n        style=\"background-color: #eaeaea\"\r\n      >\r\n        <div class=\"col-12 flex flex-column\">\r\n          <div *ngIf=\"config.title\" class=\"text-md font-bold my-3\">\r\n            {{ config.title }}\r\n          </div>\r\n          <div *ngIf=\"config.subtitle\" class=\"text-sm mb-4 font-medium\">\r\n            {{ config.subtitle }}\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          class=\"flex flex-row align-items-center col-10 p-0 md:col-6 lg:col-4 justify-content-center {{\r\n            tamanhoTela < 768 ? '' : 'input-search'\r\n          }}\"\r\n        >\r\n          <span *ngIf=\"config.enableFilter\" class=\"p-input-icon-left\">\r\n            <i class=\"pi pi-search\"></i>\r\n\r\n            <input\r\n              pInputText\r\n              pAutoFocus\r\n              [autofocus]=\"true\"\r\n              type=\"text\"\r\n              (input)=\"onGlobalFilter(tt, $event)\"\r\n              placeholder=\"Pesquisar...\"\r\n              class=\"h-2rem\"\r\n              #inputBusca\r\n            />\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"flex flex-row col-1 justify-content-end p-0\">\r\n          <div class=\"flex flex-row gap-2 btns-options\">\r\n            @for (action of config.actionsLote; track $index) {\r\n            @if((selectedItems.length > 0 || action.showAcoesLote) &&\r\n            exibirCampo(action, this.action)) {\r\n            <kv-button\r\n              (onClick)=\"action?.command(); activeItemLote(selectedItems)\"\r\n              [pTooltip]=\"getOrExecute(action.tooltip, selectedItems)\"\r\n              [tooltipPosition]=\"'bottom'\"\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        </div>\r\n      </div>\r\n    </ng-template>\r\n\r\n    @if(showHeader){\r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for(col of columns; track $index){\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            class=\"text-sm\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div>\r\n              <div [ngClass]=\"{ flex: $index == 0, 'gap-3': $index == 0 }\">\r\n                <div *ngIf=\"$index == 0 && config.enableSelect\">\r\n                  <p-treeTableHeaderCheckbox\r\n                    (click)=\"activeItemLote(selectedItems)\"\r\n                  />\r\n                </div>\r\n  \r\n                <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n                  <span>{{ col.header }}</span>\r\n  \r\n                  @if(col.sortable) {\r\n                  <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n                  }\r\n  \r\n                  <span\r\n                    *ngIf=\"col.headerTooltip\"\r\n                    class=\"material-symbols-outlined flex align-items-center\"\r\n                    [pTooltip]=\"col.headerTooltip\"\r\n                    >info</span\r\n                  >\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </th>\r\n          }\r\n        </tr>\r\n      </ng-template>\r\n  \r\n      <ng-template pTemplate=\"header\" let-columns>\r\n        <tr>\r\n          @for (col of columns; track $index) {\r\n          <th\r\n            [ttSortableColumn]=\"col.field\"\r\n            [ttSortableColumnDisabled]=\"col.sortable === false\"\r\n            [style.width]=\"col.width\"\r\n          >\r\n            <div class=\"flex flex-row align-items-center  {{ align(col) }}\">\r\n              <span>{{ col.header }}</span>\r\n  \r\n              @if(col.sortable) {\r\n              <p-treeTableSortIcon [field]=\"col.field\" />\r\n  \r\n              }\r\n            </div>\r\n          </th>\r\n          }\r\n          <th [style.width]=\"5\"></th>\r\n        </tr>\r\n      </ng-template>      \r\n    }\r\n\r\n\r\n    <ng-template\r\n      pTemplate=\"body\"\r\n      let-rowNode\r\n      let-rowData=\"rowData\"\r\n      let-columns=\"columns\"\r\n    >\r\n      <tr\r\n        cdkDrag\r\n        cdkDragLockAxis=\"y\"\r\n        [cdkDragData]=\"rowNode\"\r\n        [ttRow]=\"rowNode\"\r\n        (dblclick)=\"doubleClick($event, rowData)\"\r\n        [ngClass]=\"{ capitalize: tableCaptalized }\"\r\n      >\r\n      \r\n        @for(col of columns; track $index){\r\n          <td\r\n          class=\"draggable-cell\"\r\n          [style.position]=\"!disableRowNodeSticky && rowNode.level !== 0 ? 'sticky' : null\"\r\n          \r\n        >\r\n        \r\n        <!-- [style.left.px]=\"\r\n            childrenRecoil && rowNode.level !== 0 ? rowNode.level * 30 : null\r\n          \" -->\r\n        \r\n          <div class=\"flex flex-row  {{ align(col) }}\">\r\n            \r\n            <div\r\n              class=\"w-full-h-full flex align-items-center\"\r\n              *ngIf=\"$index == 0\"\r\n           \r\n            >\r\n            <span\r\n            class=\"material-symbols-outlined drag-icon\"\r\n            style=\"cursor: grab; font-size: 25px; color: #6b7280; opacity: 0.9;\"\r\n            cdkDragHandle\r\n          >\r\n            drag_indicator\r\n          </span>\r\n              <p-treeTableToggler \r\n                class=\"hiddenVisible\" \r\n                [rowNode]=\"rowNode\"\r\n              />\r\n\r\n              @if(config.enableSelect) {\r\n                <p-treeTableCheckbox\r\n                  [disabled]=\"isDisabledCheckbox(rowData, rowNode)\"\r\n                  (click)=\"activeItemLote(selectedItems)\"\r\n                  [value]=\"rowNode\"\r\n                  [ngStyle]=\"{\r\n                    'display': isSelectEnabled(rowData, rowNode) ? 'block' : 'none',\r\n                    'margin-left': config.visibleCheckboxFunction ? '-34px' : '0px'\r\n                  }\"\r\n                />\r\n              }\r\n                  \r\n            </div>\r\n\r\n            <div class=\"flex flex-row align-items-center\">\r\n              <div\r\n                class=\"flex flex-row align-items-center justify-content-center gap-2\"\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                }\r\n\r\n                <i\r\n                  *ngIf=\"col.boolean\"\r\n                  class=\"pi {{\r\n                    rowData[col.field] ? 'pi-check text-green-300' : ''\r\n                  }}\"\r\n                  style=\"font-size: 1.1rem\"\r\n                ></i>\r\n\r\n                <div class=\"flex flex-column\" *ngIf=\"!col.boolean\">\r\n                  <span class=\"m-0\">{{ rowData[col.field] }}</span>\r\n\r\n                  <p *ngIf=\"col.subtitle\" class=\"m-0 text-xs font-semibold\">\r\n                    {{ rowData[col.subtitle] }}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <span *ngIf=\"col.template && validateShowTemplate(rowNode, col)\">\r\n            <ng-container\r\n              *ngIf=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutlet]=\"getCustomTemplate(col.template.name)\"\r\n              [ngTemplateOutletContext]=\"{ $implicit: rowData }\"\r\n            >\r\n            </ng-container>\r\n          </span>\r\n        </td>\r\n        }\r\n\r\n        <td\r\n          style=\"border-left: none; text-align: end\"\r\n          *ngIf=\"(config.actions?.length ?? 0 > 0) || config.actionsPai\"\r\n          [style.borderRight]=\"rowNode.level === 0 ? 'none' : ''\"\r\n          [style.borderLeft]=\"rowNode.level === 0 ? 'none' : ''\"\r\n        >\r\n          <div\r\n            *ngIf=\"\r\n              (config.actions?.length ?? 0 > 0) &&\r\n              validateActionPosition(rowNode)\r\n            \"\r\n            class=\"flex align-items-center \"\r\n          >\r\n            <span\r\n              class=\"material-symbols-outlined cursor-pointer icon-more-horiz p-1\"\r\n              style=\"font-size: 25px\"\r\n              (click)=\"menu.toggle($event); activeItem(rowData)\"\r\n            >\r\n              more_horiz\r\n            </span>\r\n\r\n            \r\n\r\n            @for(action of config.actions; track $index) {\r\n            {{ criarMenusModal(rowData) }}\r\n            }\r\n          \r\n            <p-menu\r\n              #menu\r\n              [popup]=\"true\"\r\n              [model]=\"menuItems\"\r\n              appendTo=\"body\"\r\n            ></p-menu>\r\n            \r\n          </div>\r\n          \r\n          @if(config.actionsPai?.length ?? 0 > 0 && rowNode.level == 0){\r\n          <div class=\"flex justify-content-end align-items-center \">\r\n            @for (actionPai of config.actionsPai; track $index) {\r\n            @if(getOrExecute(actionPai.visible, rowData) ?? true) {\r\n            <kv-button\r\n              (onClick)=\"activeItem(rowData); actionPai.command($event)\"\r\n              [icon]=\"actionPai.icon\"\r\n              [severity]=\"actionPai.severity || 'tertiary'\"\r\n            />\r\n            \r\n            } }\r\n          </div>\r\n          }\r\n          \r\n        \r\n\r\n        </td>\r\n      \r\n      </tr>\r\n\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"emptymessage\">\r\n      <tr>\r\n        <td\r\n          [attr.colspan]=\"config.columns.length + 1\"\r\n          style=\"text-align: center\"\r\n        >\r\n          {{ textoEmptyMessage }}\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-treeTable>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .p-treetable .p-treetable-tbody>tr>td{padding:.4rem}::ng-deep .p-treetable .p-treetable-header{padding:0rem}span{font-size:14px}:host ::ng-deep .p-treetable table{table-layout:auto!important}.icon-more-horiz:hover,.icon-more-horiz:focus{color:#5e5e5e;transform:scale(1.2);transition:color .3s,transform .3s;background-color:#eaeaea;border-radius:50%}::ng-deep .p-treetable .p-treetable-thead>tr>th{background-color:#eaeaea}:host ::ng-deep .treetabledraggable .p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler{width:1rem;height:1rem}.tag{width:5px;height:20px;border-radius:.25rem}:host ::ng-deep .draggable-cell .drag-icon{visibility:hidden}:host ::ng-deep .draggable-cell:hover .drag-icon{visibility:visible}.cdk-drag-preview{display:flex;align-items:center;justify-content:space-between;border-radius:10px!important}.cdk-drop-list-dragging{cursor:grabbing}:host ::ng-deep .cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}:host ::ng-deep .cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}::ng-deep svg.p-icon{width:.7rem;height:1rem}::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}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { disableRowNodeSticky: [{
                 type: Input
             }], config: [{
@@ -3684,6 +3703,118 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+class KvLabelModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, declarations: [KvLabelComponent], imports: [CommonModule], exports: [KvLabelComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, imports: [CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        KvLabelComponent
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        KvLabelComponent
+                    ]
+                }]
+        }] });
+
+class KvModalComponent {
+    constructor(dynamicDialogRef) {
+        this.dynamicDialogRef = dynamicDialogRef;
+        /**
+         * Ações do Dialog
+         */
+        this.actions = [];
+        this.actionsPosition = 'right';
+        this.justify_content = 'justify-content-start';
+    }
+    ngOnInit() {
+        this.addSubTitle();
+        this.setMarginBottom();
+        this.defPositionButtons();
+    }
+    onWindowResize() {
+        this.setMarginBottom();
+    }
+    /**
+     * Adiciona sub-título à tela
+     */
+    addSubTitle() {
+        if (this.subtitle) {
+            const headerElement = document.querySelector('.p-dialog .p-dialog-header');
+            if (headerElement) {
+                const subtitleElement = document.createElement('span');
+                subtitleElement.textContent = this.subtitle;
+                subtitleElement.style.fontSize = '0.75rem';
+                subtitleElement.style.width = '100%';
+                subtitleElement.style.marginLeft = '2px';
+                headerElement.appendChild(subtitleElement);
+            }
+            if (this.subHeader) {
+                const headerElement = document.querySelector('.p-dialog .p-dialog-header');
+                const subHeader = this.subHeader.nativeElement;
+                if (headerElement && this.subHeader) {
+                    subHeader.style.width = '100%';
+                    subHeader.style.marginLeft = '2px';
+                    headerElement.appendChild(this.subHeader.nativeElement);
+                }
+            }
+        }
+    }
+    defPositionButtons() {
+        if (this.actionsPosition === 'right') {
+            this.justify_content = 'justify-content-end';
+        }
+        if (this.actionsPosition === 'center') {
+            this.justify_content = 'justify-content-center';
+        }
+        if (this.actionsPosition === 'left') {
+            this.justify_content = 'justify-content-start';
+        }
+    }
+    setMarginBottom() {
+        let actionsFieldHeight = document.getElementById('actions-field')?.offsetHeight;
+        let divBox = document.getElementById('content-modal');
+        if (divBox) {
+            if (actionsFieldHeight) {
+                divBox.style.marginBottom = `${actionsFieldHeight + 30}px`;
+            }
+            else {
+                divBox.style.marginBottom = `50px`;
+            }
+        }
+    }
+    clickExecute(action) {
+        if (action.command) {
+            action.command();
+            if (action.closeAfterClick != false)
+                this.dynamicDialogRef.close();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalComponent, deps: [{ token: i1$3.DynamicDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvModalComponent, selector: "kv-modal", inputs: { actions: "actions", actionsPosition: "actionsPosition", subtitle: "subtitle", subHeader: "subHeader" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, ngImport: i0, template: "<!-- RENDERIZA\u00C7\u00C3O DO MODAL -->\r\n<div class=\"col-12 mb-4\" id=\"content-modal\">\r\n    <!-- COLOCAR UM COMPONENTE SUBHEADER AQUI -->\r\n\r\n    <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- RENDERIZA\u00C7\u00C3O DOS BOT\u00D5ES -->\r\n\r\n<div class=\"bg-white flex flex-row flex-wrap gap-2 p-2 modal-barra-acoes {{justify_content}}\" *ngIf=\"actions\" id=\"actions-field\">\r\n    <kv-button\r\n        *ngFor=\" let action of actions\"\r\n        [ngClass]=\"action.visible==false?'hidden':''\"\r\n        icon=\"{{action.icon}}\"\r\n        label=\"{{action.label}}\"\r\n        [disabled]=\"action.disabled || false\"\r\n        (onClick)=\"clickExecute(action)\"\r\n        [severity]=\"action.severity ||'primary'\"\r\n    />\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;left:0;right:0;background-color:#fff;padding:10px;z-index:999}#page-form-container{padding-bottom:40px}@media screen and (max-width: 991px){#page-form-container{padding-bottom:100px}}.modal-barra-acoes{position:fixed;bottom:0;left:0;right:0;z-index:999;margin-right:1.5rem}\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: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kv-modal', template: "<!-- RENDERIZA\u00C7\u00C3O DO MODAL -->\r\n<div class=\"col-12 mb-4\" id=\"content-modal\">\r\n    <!-- COLOCAR UM COMPONENTE SUBHEADER AQUI -->\r\n\r\n    <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- RENDERIZA\u00C7\u00C3O DOS BOT\u00D5ES -->\r\n\r\n<div class=\"bg-white flex flex-row flex-wrap gap-2 p-2 modal-barra-acoes {{justify_content}}\" *ngIf=\"actions\" id=\"actions-field\">\r\n    <kv-button\r\n        *ngFor=\" let action of actions\"\r\n        [ngClass]=\"action.visible==false?'hidden':''\"\r\n        icon=\"{{action.icon}}\"\r\n        label=\"{{action.label}}\"\r\n        [disabled]=\"action.disabled || false\"\r\n        (onClick)=\"clickExecute(action)\"\r\n        [severity]=\"action.severity ||'primary'\"\r\n    />\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;left:0;right:0;background-color:#fff;padding:10px;z-index:999}#page-form-container{padding-bottom:40px}@media screen and (max-width: 991px){#page-form-container{padding-bottom:100px}}.modal-barra-acoes{position:fixed;bottom:0;left:0;right:0;z-index:999;margin-right:1.5rem}\n"] }]
+        }], ctorParameters: () => [{ type: i1$3.DynamicDialogRef }], propDecorators: { actions: [{
+                type: Input
+            }], actionsPosition: [{
+                type: Input
+            }], subtitle: [{
+                type: Input
+            }], subHeader: [{
+                type: Input
+            }], onWindowResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
+            }] } });
+
 class PrimeNgModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: PrimeNgModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: PrimeNgModule, exports: [AccordionModule,
@@ -3891,178 +4022,412 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
                 }]
         }] });
 
-class KvAvatarComponent {
-    constructor(imageService, notificationService) {
-        this.imageService = imageService;
-        this.notificationService = notificationService;
-        this.borderColor = '#002542';
-        this.btnsColor = '#002542';
-        this.width = 135;
-        this.height = 135;
-        this.imageUrlChange = new EventEmitter();
-        this.onModalOpen = new EventEmitter();
-        this.removerFotoEvent = new EventEmitter();
-        this.btnAlterarFoto = false;
-        this.existeLogo = false;
-        this.selectedImage = '';
-        this.showCropModal = false;
-        this.imageLoaded = false;
-        this.imageX = 0;
-        this.imageY = 0;
+class KvButtonModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, declarations: [KvButtonComponent], imports: [CommonModule,
+            PrimeNgModule], exports: [KvButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, imports: [CommonModule,
+            PrimeNgModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        KvButtonComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        PrimeNgModule
+                    ],
+                    exports: [
+                        KvButtonComponent
+                    ]
+                }]
+        }] });
+
+class KvModalModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, declarations: [KvModalComponent], imports: [CommonModule, PrimeNgModule, KvButtonModule], exports: [KvModalComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, imports: [CommonModule, PrimeNgModule, KvButtonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [KvModalComponent],
+                    imports: [CommonModule, PrimeNgModule, KvButtonModule],
+                    exports: [KvModalComponent],
+                }]
+        }] });
+
+class ImageCutterService {
+    constructor(dialogservice) {
+        this.dialogservice = dialogservice;
+    }
+    cut(imageBase64, width, height, indCircle = false) {
+        const cutConfig = { imageBase64, width, height, indCircle };
+        this.abrirModal(cutConfig);
+        return new Promise((resolve, reject) => {
+            window.addEventListener('cropImage', (event) => {
+                if (event.detail.status == true) {
+                    resolve(event.detail.result);
+                }
+                else {
+                    reject('Operacao cancelada.');
+                }
+            });
+        });
+    }
+    abrirModal(cutConfig) {
+        const params = {
+            closable: true,
+            maximizable: false,
+            popup: true,
+            width: '75vw',
+            header: `Cortar`,
+            id: { imagem: cutConfig.imageBase64, width: cutConfig.width, height: cutConfig.height, indCircle: cutConfig.indCircle },
+            styleClass: 'modal'
+        };
+        const dialogRef = FormService.openDialog(this.dialogservice, SimpleComponent, () => { }, params);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: ImageCutterService, deps: [{ token: i1$3.DialogService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: ImageCutterService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: ImageCutterService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1$3.DialogService }] });
+class SimpleComponent {
+    constructor(dynamicDialogRef, dialogService) {
+        this.dynamicDialogRef = dynamicDialogRef;
+        this.dialogService = dialogService;
+        // ? Variavies que recebem os valores do dialog
+        this._variaviesDialog = signal(null);
+        //? Referências para o contexto e canvas
+        this.canvas = signal(null);
+        this.ctx = signal(null);
+        this._Image = signal(new Image());
+        //? Coordenadas iniciais e finais do desenho
         this.startX = 0;
         this.startY = 0;
-        this.valueZoom = 20;
-        this.scaleFactor = 2;
-        this.canvasWidth = signal(null);
-        this.canvasHeight = signal(null);
-        this.imageUrl = input(this.imageService.userDefaultImage());
-        this.imageSource = signal(this.imageService.userDefaultImage());
-        this.imgCanva = signal(null);
-        this.widthTela = window.innerWidth;
+        //? Fator de escala da imagem e zoom
+        this.scaleFactorReadOnly = computed(() => {
+            return Math.min(this.scaleFactor(), 3);
+        });
+        this.scaleFactor = signal(null);
+        this.scaleFactorModel = 0;
+        this.imageX = 0;
+        this.imageY = 0;
+        //#region Propriedades computadas de tamanho do canvas e da imagem
+        //? Largura e altura do canvas baseado na tamanho da tela
+        this.canvasWidth = computed(() => this.widthTela() * 0.5);
+        this.canvasHeight = computed(() => this.heigthTela() * 0.5);
+        //? Largura e altura da área de corte
+        this.cutWidth = computed(() => {
+            if (this._variaviesDialog()?.indCircle) {
+                return this.radius() * 2;
+            }
+            else {
+                const canvasWidth = this.canvasWidth();
+                const maxWidth = canvasWidth * 0.8;
+                const proportionalHeight = maxWidth * this.proporcaoImagem();
+                return proportionalHeight > this.canvasHeight() * 0.8 ? this.canvasHeight() * 0.8 / this.proporcaoImagem() : maxWidth;
+            }
+        });
+        this.cutHeight = computed(() => {
+            if (this._variaviesDialog()?.indCircle) {
+                return this.radius() * 2;
+            }
+            else {
+                const canvasHeight = this.canvasHeight();
+                const maxHeight = canvasHeight * 0.8;
+                const proportionalWidth = maxHeight / this.proporcaoImagem();
+                return proportionalWidth > this.canvasWidth() * 0.8 ? this.canvasWidth() * 0.8 * this.proporcaoImagem() : maxHeight;
+            }
+        });
+        //? Largura e altura da imagem no canvas (baseado na escala) - tamanho real da imagem
+        this.canvaImageWidth = computed(() => {
+            return this._Image().width * this.scaleFactorReadOnly();
+        });
+        this.canvaImageHeight = computed(() => {
+            return this._Image().height * this.scaleFactorReadOnly();
+        });
+        this.proporcaoImagem = computed(() => {
+            return this._variaviesDialog()?.height / this._variaviesDialog()?.width;
+        });
+        this.radius = computed(() => {
+            const minSize = Math.min(this.canvasHeight() * 0.8, this.canvasWidth() * 0.8);
+            return minSize / 2;
+        });
+        //#endregion
+        // #region Limites de movimentação da imagem
+        //? Limites de movimentação da imagem
+        this.indCircle = computed(() => {
+            return this._variaviesDialog()?.indCircle;
+        });
+        this.xMin = computed(() => {
+            return !this._variaviesDialog()?.indCircle ? (this.canvasWidth() - this.cutWidth()) / 2 : (this.canvasWidth() - (this.radius() * 2)) / 2;
+        });
+        this.yMin = computed(() => {
+            return !this._variaviesDialog()?.indCircle ? (this.canvasHeight() - this.cutHeight()) / 2 : (this.canvasHeight() - (this.radius() * 2)) / 2;
+        });
+        this.xMax = computed(() => {
+            return !this._variaviesDialog()?.indCircle ? -(this.canvaImageWidth() - (this.xMin()) - this.cutWidth()) : -(this.canvaImageWidth() - (this.xMin()) - (this.radius() * 2));
+        });
+        this.yMax = computed(() => {
+            return !this._variaviesDialog()?.indCircle ? -(this.canvaImageHeight() - (this.yMin()) - this.cutHeight()) : -(this.canvaImageHeight() - (this.yMin()) - (this.radius() * 2));
+        });
+        // #endregion
+        //? Proporção da imagem
+        this.widthTela = signal(0);
+        this.heigthTela = signal(0);
+        this.atualizaTamanhoTela();
     }
-    ngOnInit() {
-        this.imageSource.set(this.imageUrl());
-        this.getImageSrc();
+    setScaleFactorModel(valor) {
+        this.scaleFactorModel = valor;
+        this.scaleFactor.set(this.scaleFactorModel);
     }
     onWindowResize() {
-        this.widthTela = window.innerWidth;
-        this.heigthTela = window.innerHeight;
+        this.atualizaTamanhoTela();
         this.updateCanvasSize();
-        this.updateCropBorderSize();
+        this.atualizaCutBorder();
     }
-    getImageSrc() {
-        const imageUrl = this.imageUrl();
-        if (imageUrl && (imageUrl.startsWith('data:image') || imageUrl.startsWith('http') || imageUrl.startsWith('https'))) {
-            this.existeLogo = true;
-        }
-        else if (imageUrl && imageUrl.length > 0) {
-            this.existeLogo = true;
-            this.imageSource.set('data:image/jpg;base64,' + imageUrl);
-        }
-        else {
-            this.existeLogo = false;
-            this.imageSource.set(this.imageService.userDefaultImage());
-        }
+    atualizaTamanhoTela() {
+        this.widthTela.set(window.innerWidth);
+        this.heigthTela.set(window.innerHeight);
     }
-    openFile() {
-        const inputElement = document.getElementById('fotoEscolhida');
-        if (inputElement) {
-            inputElement.click();
-        }
+    ngAfterViewInit() {
+        this.recuperarVariaviesDialog();
+        this.inciarReferencias();
+        this.iniciarCanvas();
+    }
+    inciarReferencias() {
+        this.canvas.set(this.cropCanvas.nativeElement);
+        this.ctx.set(this.canvas().getContext('2d'));
+        this._Image().src = this._variaviesDialog()?.imagem;
+    }
+    iniciarCanvas() {
+        this._Image().onload = () => {
+            //? Define o tamanho do canvas
+            this.canvas().height = this.canvasHeight();
+            this.canvas().width = this.canvasWidth();
+            this.ajustarZommEPosicaoInicial();
+            this.initializeImageMove(this.canvas(), this.ctx(), this._Image());
+            this.initializeMouseWheel(this.canvas(), this.ctx(), this._Image());
+            this.redrawCanvas(this.ctx(), this._Image());
+        };
     }
-    selectFotoSelecionada(event) {
-        const file = event.target.files[0];
-        if (file) {
-            const reader = new FileReader();
-            reader.readAsDataURL(file);
-            reader.onload = () => {
-                this.selectedImage = reader.result;
-                this.onModalOpen.emit(null);
-                this.openCropModal();
-                this.existeLogo = false;
-            };
+    ajustarZommEPosicaoInicial() {
+        const cutWidth = this.cutWidth();
+        const cutHeight = this.cutHeight();
+        const imageWidth = this._Image().width;
+        const imageHeight = this._Image().height;
+        //? Ajusta possição e zoom inicial
+        if (this._variaviesDialog()?.indCircle) {
+            const scaleFactor = (this.radius() * 2) / Math.min(imageWidth, imageHeight);
+            this.setScaleFactorModel(scaleFactor);
+            this.scaleFactor.set(scaleFactor);
         }
+        else {
+            const scaleFactor = this.cutHeight() === this.cutWidth()
+                ? this._Image().width > this._Image().height
+                    ? this.cutHeight() / imageHeight
+                    : this.cutWidth() / imageWidth
+                : this.cutHeight() > this.cutWidth()
+                    ? this.cutHeight() / imageHeight
+                    : this.cutWidth() / imageWidth;
+            this.setScaleFactorModel(scaleFactor);
+            this.scaleFactor.set(scaleFactor);
+        }
+        this.imageX = Math.max((this.canvas().width - imageWidth * this.scaleFactorReadOnly()) / 2, this.xMin());
+        this.imageY = Math.max((this.canvasHeight() - imageHeight * this.scaleFactorReadOnly()) / 2, this.yMin());
+    }
+    //#region Métodos de recuperação de dados
+    recuperaInstanciaDialog() {
+        const arr = this.dialogService.dialogComponentRefMap;
+        const entries = arr.entries();
+        const firstEntry = entries.next().value;
+        const [firstKey, firstValue] = firstEntry;
+        const instance = this.dialogService.getInstance(firstKey);
+        this.dialogInstance = instance;
+        return instance;
+    }
+    recuperarVariaviesDialog() {
+        this._variaviesDialog.set(this.recuperaInstanciaDialog().data.id);
+    }
+    //#endregion
+    //#region Métodos de atualizacao do canvas
+    //? Atualiza o tamanho do canvas
+    updateCanvasSize() {
+        this.imageX = (this.canvas().width - this._Image().width * this.scaleFactorReadOnly()) / 2;
+        this.imageY = (this.canvasHeight() / 2) - (this._Image().height * this.scaleFactorReadOnly()) / 2;
+        this.canvas().height = this.canvasHeight();
+        this.canvas().width = this.canvasWidth();
+        this.redrawCanvas(this.ctx(), this._Image());
     }
-    questionRemoverFoto() {
-        const msg = '<h3>Você tem certeza que deseja retirar a foto desse usuário?</h3>';
-        this.notificationService.question({
-            type: 'question',
-            message: msg,
-            accept: (data) => {
-                this.removerFoto();
-            },
-            reject: (data) => {
-            }
-        });
-    }
-    removerFoto() {
-        this.imageSource.set('');
-        this.removerFotoEvent.emit();
-        this.existeLogo = false;
-        this.imageUrlChange.emit(this.imageSource());
-        this.fileInput.nativeElement.value = '';
+    redrawCanvas(ctx, img) {
+        if (!ctx)
+            return;
+        this.drawCropArea(ctx);
+        ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+        ctx.filter = 'blur(5px) opacity(0.9)';
+        ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactorReadOnly(), img.height * this.scaleFactorReadOnly());
+        ctx.filter = 'none';
+        this.drawImageInCropArea(ctx, img);
     }
-    handleImageError(event) {
-        event.target.src = this.imageService.userDefaultImage();
+    //? Desenha a área de corte
+    drawCropArea(ctx) {
+        if (!ctx)
+            return;
+        this.atualizaCutBorder();
+        const cropX = ctx.canvas.width / 2 - this.cutWidth() / 2;
+        const cropY = ctx.canvas.height / 2 - this.cutHeight() / 2;
+        const cropXCircle = ctx.canvas.width / 2 - this.radius() / 2;
+        const cropYCircle = ctx.canvas.height / 2 - this.radius() / 2;
+        ctx.beginPath();
+        ctx.strokeStyle = 'transparent';
+        ctx.lineWidth = 2;
+        if (this._variaviesDialog()?.indCircle) {
+            ctx.arc(cropXCircle, cropYCircle, this.radius(), 0, Math.PI * 2, true);
+        }
+        else {
+            ctx.rect(cropX, cropY, this.cutWidth(), this.cutHeight());
+        }
+        ctx.stroke();
     }
-    //------- Recorte de imagem -------
-    openCropModal() {
-        this.showCropModal = true;
-        setTimeout(() => {
-            const canvas = this.cropCanvas.nativeElement;
-            const ctx = canvas.getContext('2d');
-            const img = new Image();
-            img.src = this.selectedImage;
-            img.onload = () => {
-                this.imageLoaded = true;
-                canvas.height = 400;
-                canvas.width = this.retornaTamanhoCanvas();
-                this.scaleFactor = canvas.height / img.height;
-                this.imageX = (canvas.width - img.width * this.scaleFactor) / 2;
-                this.imageY = 0;
-                this.canvasWidth.set(canvas.width);
-                this.canvasHeight.set(canvas.height);
-                this.redrawCanvas(ctx, img);
-                this.initializeImageMove(canvas, ctx, img);
-                this.initializeMouseWheel(canvas, ctx, img);
-                this.valueZoom = this.scaleFactor * 20;
-            };
-        }, 0);
+    //? Desenha a imagem na área de corte
+    drawImageInCropArea(ctx, img) {
+        if (!ctx)
+            return;
+        const cropX = (ctx.canvas.width - this.cutWidth()) / 2;
+        const cropY = (ctx.canvas.height - this.cutHeight()) / 2;
+        ctx.save();
+        ctx.beginPath();
+        if (this._variaviesDialog()?.indCircle) {
+            ctx.arc(ctx.canvas.width / 2, ctx.canvas.height / 2, this.radius(), 0, Math.PI * 2, true);
+        }
+        else {
+            ctx.rect(cropX, cropY, this.cutWidth(), this.cutHeight());
+        }
+        ctx.clip();
+        ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactorReadOnly(), img.height * this.scaleFactorReadOnly());
+        ctx.restore();
     }
-    cropImage() {
-        const canvas = this.cropCanvas.nativeElement;
-        const ctx = canvas.getContext('2d');
-        if (ctx) {
-            const cropRadius = this.getCropRadius();
-            const centerX = canvas.width / 2;
-            const centerY = canvas.height / 2;
-            const imageData = ctx.getImageData(centerX - cropRadius, centerY - cropRadius, cropRadius * 2, cropRadius * 2);
-            const newCanvas = document.createElement('canvas');
-            const newCtx = newCanvas.getContext('2d');
-            newCanvas.width = cropRadius * 2;
-            newCanvas.height = cropRadius * 2;
-            if (newCtx) {
-                newCtx.putImageData(imageData, 0, 0);
-                this.imageSource.set(newCanvas.toDataURL());
-                this.imageUrlChange.emit(this.imageSource());
-                this.existeLogo = true;
-                this.closeCropModal();
+    atualizaCutBorder() {
+        if (this.cropBorder && this.cropBorder.nativeElement) {
+            const cropBorderElement = this.cropBorder.nativeElement;
+            if (this._variaviesDialog()?.indCircle) {
+                cropBorderElement.style.borderRadius = this.radius() * 2 + 'px';
+                cropBorderElement.style.width = this.radius() * 2 + 'px';
+                cropBorderElement.style.height = this.radius() * 2 + 'px';
+            }
+            else {
+                cropBorderElement.style.width = this.cutWidth() + 'px';
+                cropBorderElement.style.height = this.cutHeight() + 'px';
             }
         }
     }
-    onZoomChange(event) {
-        const canvas = this.cropCanvas.nativeElement;
-        const ctx = canvas.getContext('2d');
-        const img = new Image();
-        img.src = this.selectedImage;
-        img.onload = () => {
-            const zoomValue = event.value / 20;
-            this.scaleFactor = Math.max(zoomValue, 0.1); // Garantir que o fator de escala não seja menor que 0.1
-            this.redrawCanvas(ctx, img);
-        };
+    //#endregion
+    //#region handlers de eventos
+    onZoomChange(e) {
+        const prevZoom = this.scaleFactorReadOnly();
+        const zoomValue = e.value;
+        const direction = prevZoom < zoomValue ? 'up' : 'down';
+        this.ajustarZoom(direction);
     }
-    retornaTamanhoCanvas() {
-        return this.widthTela < 700 ? this.widthTela * 0.7 : this.widthTela * 0.4;
-    }
-    closeCropModal() {
-        this.showCropModal = false;
-        this.valueZoom = 20;
-        this.imageLoaded = false;
-        this.imageX = this.imgCanva()?.width / 2;
-        this.imageY = this.imgCanva()?.height / 2;
-        this.startX = 0;
-        this.startY = 0;
+    initializeMouseWheel(canvas, ctx, img) {
+        canvas.onwheel = (e) => {
+            e.preventDefault();
+            //? Recuperando os valores de zoom e delta atuais
+            const direction = e.deltaY > 0 ? 'down' : 'up';
+            this.ajustarZoom(direction);
+        };
     }
-    redrawCanvas(ctx, img) {
-        this.updateCropBorderSize();
-        if (!ctx)
-            return;
-        ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
-        ctx.filter = 'blur(5px) opacity(0.9)';
-        ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactor, img.height * this.scaleFactor);
-        ctx.filter = 'none';
-        this.drawImageInCropArea(ctx, img);
-        this.drawCropArea(ctx);
+    ajustarZoom(direction) {
+        const prevScaleFactor = this.scaleFactorReadOnly();
+        const delta = direction == 'down' ? -0.01 : 0.01;
+        let scaleFactor = Math.min((prevScaleFactor + (delta * 1.2)), 3);
+        const newHeight = this._Image().height * scaleFactor;
+        const newWidth = this._Image().width * scaleFactor;
+        if (this._variaviesDialog()?.indCircle) {
+            if (newHeight < this.radius() * 2 || newWidth < this.radius() * 2) {
+                scaleFactor = prevScaleFactor;
+            }
+            else {
+                this.scaleFactor.set(scaleFactor);
+                this.setScaleFactorModel(scaleFactor);
+            }
+        }
+        else {
+            if (newHeight < this.cutHeight() || newWidth < this.cutWidth()) {
+                scaleFactor = prevScaleFactor;
+            }
+            else {
+                this.scaleFactor.set(scaleFactor);
+                this.setScaleFactorModel(scaleFactor);
+            }
+        }
+        this.scaleFactor.set(scaleFactor);
+        this.setScaleFactorModel(scaleFactor);
+        const canvas = this.cropCanvas.nativeElement;
+        const canvasWidth = canvas.offsetWidth;
+        const canvasHeight = canvas.offsetHeight;
+        const centerX = canvasWidth / 2;
+        const centerY = canvasHeight / 2;
+        const newCanvasX = centerX - (centerX - this.imageX) * (scaleFactor / prevScaleFactor);
+        const newCanvasY = centerY - (centerY - this.imageY) * (scaleFactor / prevScaleFactor);
+        this.imageX = newCanvasX;
+        this.imageY = newCanvasY;
+        if (!this.verificaImagemdentroDosLimiteXmin()) {
+            const diffXmin = this.retornaDiffXmax();
+            this.moveImage(this.imageX - diffXmin);
+        }
+        if (!this.verificaImagemdentroDosLimiteXmax()) {
+            const diffXmax = this.retornaDiffXmin();
+            this.moveImage(this.imageX + diffXmax);
+        }
+        if (!this.verificaImagemdentroDosLimiteYmax()) {
+            const diffYmax = this.retornaDiffYmin();
+            this.moveImage(undefined, this.imageY + diffYmax);
+        }
+        if (!this.verificaImagemdentroDosLimiteYmin()) {
+            const diffYmin = this.retornaDiffYmax();
+            this.moveImage(undefined, this.imageY - diffYmin);
+        }
+        this.redrawCanvas(this.ctx(), this._Image());
+    }
+    verificaImagemdentroDosLimiteXmin() {
+        const newImageX = this.imageX;
+        return newImageX < this.xMin();
+    }
+    verificaImagemdentroDosLimiteXmax() {
+        const newImageX = this.imageX;
+        return newImageX > this.xMax();
+    }
+    verificaImagemdentroDosLimiteYmin() {
+        const newImageY = this.imageY;
+        return newImageY < this.yMin();
+    }
+    verificaImagemdentroDosLimiteYmax() {
+        const newImageY = this.imageY;
+        return newImageY > this.yMax();
+    }
+    retornaDiffXmin() {
+        const newImageX = this.imageX;
+        return this.xMin() - newImageX;
+    }
+    retornaDiffXmax() {
+        const newImageX = this.imageX;
+        return newImageX - this.xMax();
+    }
+    retornaDiffYmin() {
+        const newImageY = this.imageY;
+        return this.yMin() - newImageY;
+    }
+    retornaDiffYmax() {
+        const newImageY = this.imageY;
+        return newImageY - this.yMax();
     }
     initializeImageMove(canvas, ctx, img) {
         let isDragging = false;
@@ -4073,13 +4438,6 @@ class KvAvatarComponent {
             this.startX = e.offsetX - this.imageX;
             this.startY = e.offsetY - this.imageY;
         };
-        canvas.onmousemove = (e) => {
-            if (isDragging) {
-                this.imageX = e.offsetX - this.startX;
-                this.imageY = e.offsetY - this.startY;
-                this.redrawCanvas(ctx, img);
-            }
-        };
         canvas.onmouseup = () => {
             isDragging = false;
             canvas.style.cursor = 'grab';
@@ -4088,84 +4446,276 @@ class KvAvatarComponent {
             isDragging = false;
             canvas.style.cursor = 'grab';
         };
-    }
-    initializeMouseWheel(canvas, ctx, img) {
-        canvas.onwheel = (e) => {
-            e.preventDefault();
-            const delta = e.deltaY > 0 ? -0.1 : 0.1;
-            this.scaleFactor = Math.min(Math.max(this.scaleFactor + delta, 0.1), 5); // limita o fator de escala entre 0.1 e 5
-            this.redrawCanvas(ctx, img);
-            this.valueZoom = this.scaleFactor * 20;
+        canvas.onmousemove = (e) => {
+            if (isDragging) {
+                // Calcula o novo posicionamento da imagem
+                let newImageX = e.offsetX - this.startX;
+                let newImageY = e.offsetY - this.startY;
+                if (newImageX < this.xMin() && newImageX > this.xMax()) {
+                    this.moveImage(newImageX);
+                }
+                if (newImageY < this.yMin() && newImageY > this.yMax()) {
+                    this.moveImage(undefined, newImageY);
+                }
+                this.redrawCanvas(ctx, img);
+            }
         };
     }
-    drawImageInCropArea(ctx, img) {
-        if (!ctx)
-            return;
-        const cropRadius = this.getCropRadius();
-        const cropX = (ctx.canvas.width - cropRadius * 2) / 2;
-        const cropY = (ctx.canvas.height - cropRadius * 2) / 2;
-        ctx.save();
-        ctx.beginPath();
-        ctx.arc(cropX + cropRadius, cropY + cropRadius, cropRadius, 0, Math.PI * 2, true);
-        ctx.clip();
-        ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactor, img.height * this.scaleFactor);
-        ctx.restore();
+    moveImage(dx, dy) {
+        this.imageX = (dx ?? this.imageX);
+        this.imageY = (dy ?? this.imageY);
     }
-    drawCropArea(ctx) {
-        if (!ctx)
-            return;
-        const cropRadius = this.getCropRadius();
-        const cropX = (ctx.canvas.width - cropRadius * 2) / 2;
-        const cropY = (ctx.canvas.height - cropRadius * 2) / 2;
-        ctx.beginPath();
-        ctx.arc(cropX + cropRadius, cropY + cropRadius, cropRadius, 0, Math.PI * 2, true);
-        ctx.strokeStyle = 'transparent';
-        ctx.lineWidth = 2;
-        ctx.stroke();
+    //#endregion
+    //#region Métodos de corte e fechamento do modal
+    cropImage() {
+        const ctx = this.ctx();
+        if (ctx) {
+            const X = ((this.canvas().width - this._Image().width * this.scaleFactorReadOnly()) / 2);
+            const Y = ((this.canvasHeight() / 2) - (this._Image().height * this.scaleFactorReadOnly()) / 2);
+            // Recuperar o imageData da imagem que está na área de corte
+            let imageData;
+            const cropX = (ctx.canvas.width - this.cutWidth()) / 2;
+            const cropY = (ctx.canvas.height - this.cutHeight()) / 2;
+            if (this._variaviesDialog()?.indCircle) {
+                // Create a new canvas with the same dimensions as the circle
+                const circleCanvas = document.createElement('canvas');
+                const circleCtx = circleCanvas.getContext('2d');
+                circleCanvas.width = this.radius() * 2;
+                circleCanvas.height = this.radius() * 2;
+                // Draw the circle on the new canvas
+                circleCtx.beginPath();
+                circleCtx.arc(this.radius(), this.radius(), this.radius(), 0, 2 * Math.PI);
+                circleCtx.fill();
+                // Set the composite operation to 'destination-in' to cut out the circle
+                ctx.globalCompositeOperation = 'destination-in';
+                // Draw the image on the main canvas using the circle as a mask
+                ctx.drawImage(circleCanvas, cropX, cropY);
+                // Reset the composite operation to the default value
+                ctx.globalCompositeOperation = 'source-over';
+                // Get the image data of the cropped circle
+                imageData = ctx.getImageData(cropX, cropY, this.radius() * 2, this.radius() * 2);
+            }
+            else {
+                imageData = ctx.getImageData(cropX, cropY, this.cutWidth(), this.cutHeight());
+            }
+            // Obter os valores de width e height da variável _variaviesDialog
+            const variaveisDialog = this._variaviesDialog();
+            if (variaveisDialog) {
+                const { width, height } = variaveisDialog;
+                // Criar um novo canvas e contexto com os valores de width e height
+                const newCanvas = document.createElement('canvas');
+                const newCtx = newCanvas.getContext('2d');
+                newCanvas.width = width;
+                newCanvas.height = height;
+                if (newCtx) {
+                    // Redimensionar a imagem para o tamanho especificado
+                    const tempCanvas = document.createElement('canvas');
+                    const tempCtx = tempCanvas.getContext('2d');
+                    tempCanvas.width = this.cutWidth();
+                    tempCanvas.height = this.cutHeight();
+                    tempCtx.putImageData(imageData, 0, 0);
+                    newCtx.drawImage(tempCanvas, 0, 0, width, height);
+                    window.dispatchEvent(new CustomEvent('cropImage', { detail: {
+                            result: Promise.resolve(newCanvas.toDataURL()),
+                            status: true
+                        } }));
+                    this.closeCropModal();
+                }
+            }
+        }
     }
-    getCropRadius() {
-        const baseRadius = 200; // Raio base para uma tela de referência
-        const referenceWidth = (this.widthTela + 100); // Largura da tela de referência
-        const scaleFactor = window.innerWidth / referenceWidth; // Fator de escala com base na largura da tela atual
-        const diagonal = Math.sqrt(Math.pow(this.canvasHeight(), 2) + Math.pow(this.canvasWidth(), 2));
-        const calculatedRadius = (diagonal / 4);
-        const maxRadius = baseRadius * scaleFactor; // Ajusta o raio com base no fator de escala
-        return Math.min(calculatedRadius, maxRadius);
+    closeCropModal() {
+        this.dialogInstance.close();
     }
-    updateCropBorderSize() {
-        if (this.cropBorder && this.cropBorder.nativeElement) {
-            const radius = this.getCropRadius();
-            const cropBorderElement = this.cropBorder.nativeElement;
-            cropBorderElement.style.width = `${radius * 2}px`;
-            cropBorderElement.style.height = `${radius * 2}px`;
+    cancel() {
+        window.dispatchEvent(new CustomEvent('cropImage', { detail: {
+                result: Promise.resolve('cancel'),
+                status: false
+            } }));
+        this.closeCropModal();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: SimpleComponent, deps: [{ token: i1$3.DynamicDialogRef }, { token: i1$3.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: SimpleComponent, isStandalone: true, selector: "app-simple-component", host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "cropCanvas", first: true, predicate: ["cropCanvas"], descendants: true }, { propertyName: "cropBorder", first: true, predicate: ["cropBorder"], descendants: true }], ngImport: i0, template: `
+      <div class="modal-content">
+        <div class="crop-container">
+          <canvas #cropCanvas class="crop-canvas"></canvas>
+          <div #cropBorder class="crop-border"></div>
+        </div>
+
+        <div class="w-full mt-2">
+          <kv-label label="Zoom" style="text-align: left;" />
+          <p-slider [(ngModel)]="this.scaleFactorModel" [step]="0.000001"  [max]="3"  (onChange)="onZoomChange($event)"></p-slider>
+        </div>
+
+          <div class="button-container">
+          <kv-button label="Cancelar" severity="tertiary" icon="close" (click)="cancel()"></kv-button>
+          <kv-button label="Recortar" severity="primary" icon="crop" (click)="cropImage()" class="ml-2"></kv-button>
+        </div>
+
+      </div>
+
+
+
+  `, isInline: true, styles: ["img{border-style:solid;border-width:2px;border-radius:50%;object-fit:cover}i{font-size:22px}.botao-alterar-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-alterar-foto i{color:#fff}.botao-excluir-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-excluir-foto i{color:#fff}.btn{position:absolute;top:87%;left:87%;transform:translate(-50%,-50%)}.image-container{display:inline-block;position:relative}.modal-content{position:relative;background-color:#fefefe;margin:1% auto;padding:20px;width:80%;max-width:fit-content;text-align:center;border-radius:12px}.crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid #d1d5db;border-radius:12px;width:100%;height:auto}.crop-border{position:absolute;border:2px dashed #9ca3af;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}.button-container{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-top:24px}\n"], dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: KvModalModule }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i2$2.Slider, selector: "p-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: FileUploadModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: KvButtonModule }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }, { kind: "ngmodule", type: KvLabelModule }, { kind: "component", type: KvLabelComponent, selector: "kv-label", inputs: ["componentId", "label"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: SimpleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-simple-component', template: `
+      <div class="modal-content">
+        <div class="crop-container">
+          <canvas #cropCanvas class="crop-canvas"></canvas>
+          <div #cropBorder class="crop-border"></div>
+        </div>
+
+        <div class="w-full mt-2">
+          <kv-label label="Zoom" style="text-align: left;" />
+          <p-slider [(ngModel)]="this.scaleFactorModel" [step]="0.000001"  [max]="3"  (onChange)="onZoomChange($event)"></p-slider>
+        </div>
+
+          <div class="button-container">
+          <kv-button label="Cancelar" severity="tertiary" icon="close" (click)="cancel()"></kv-button>
+          <kv-button label="Recortar" severity="primary" icon="crop" (click)="cropImage()" class="ml-2"></kv-button>
+        </div>
+
+      </div>
+
+
+
+  `, standalone: true, imports: [
+                        DialogModule,
+                        KvModalModule,
+                        SliderModule,
+                        CommonModule,
+                        ButtonModule,
+                        FileUploadModule,
+                        SliderModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        KvButtonModule,
+                        KvLabelModule,
+                    ], styles: ["img{border-style:solid;border-width:2px;border-radius:50%;object-fit:cover}i{font-size:22px}.botao-alterar-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-alterar-foto i{color:#fff}.botao-excluir-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-excluir-foto i{color:#fff}.btn{position:absolute;top:87%;left:87%;transform:translate(-50%,-50%)}.image-container{display:inline-block;position:relative}.modal-content{position:relative;background-color:#fefefe;margin:1% auto;padding:20px;width:80%;max-width:fit-content;text-align:center;border-radius:12px}.crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid #d1d5db;border-radius:12px;width:100%;height:auto}.crop-border{position:absolute;border:2px dashed #9ca3af;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}.button-container{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-top:24px}\n"] }]
+        }], ctorParameters: () => [{ type: i1$3.DynamicDialogRef }, { type: i1$3.DialogService }], propDecorators: { cropCanvas: [{
+                type: ViewChild,
+                args: ['cropCanvas']
+            }], cropBorder: [{
+                type: ViewChild,
+                args: ['cropBorder']
+            }], onWindowResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
+            }] } });
+
+class KvAvatarComponent {
+    constructor(imageService, notificationService, imageCutterService) {
+        this.imageService = imageService;
+        this.notificationService = notificationService;
+        this.imageCutterService = imageCutterService;
+        this.borderColor = '#002542';
+        this.btnsColor = '#002542';
+        this.width = 135;
+        this.height = 135;
+        this.btnAlterarFoto = false;
+        this.imageUrlChange = new EventEmitter();
+        this.removerFotoEvent = new EventEmitter();
+        this.file = null;
+        this.existeLogo = false;
+        this.selectedImage = '';
+        this.imageUrl = input(this.imageService.userDefaultImage());
+        this.imageSource = signal(this.imageService.userDefaultImage());
+        this.imageLoaded = signal(false);
+    }
+    ngOnInit() {
+        this.imageSource.set(this.imageUrl());
+        this.carregaImagemInicial();
+    }
+    carregaImagemInicial() {
+        const imageUrl = this.imageUrl();
+        if (imageUrl && (imageUrl.startsWith('data:image') || imageUrl.startsWith('http') || imageUrl.startsWith('https'))) {
+            this.existeLogo = true;
+        }
+        else if (imageUrl && imageUrl.length > 0) {
+            this.existeLogo = true;
+            this.imageSource.set('data:image/jpg;base64,' + imageUrl);
+        }
+        else {
+            this.existeLogo = false;
+            this.imageSource.set(this.imageService.userDefaultImage());
         }
     }
-    updateCanvasSize() {
-        if (this.cropCanvas && this.cropCanvas.nativeElement) {
-            const canvas = this.cropCanvas.nativeElement;
-            const ctx = canvas.getContext('2d');
-            const img = new Image();
-            img.src = this.selectedImage;
-            this.imgCanva.set(img);
-            img.onload = () => {
-                this.imageLoaded = true;
-                canvas.width = this.retornaTamanhoCanvas();
-                canvas.height = 400;
-                this.imageX = (canvas.width - img.width * this.scaleFactor) / 2;
-                this.imageY = 0; // A imagem começa no topo do canvas
-                this.canvasWidth.set(canvas.width);
-                this.canvasHeight.set(canvas.height);
-                this.redrawCanvas(ctx, img);
-            };
+    onImageLoad() {
+        this.imageLoaded.set(true);
+    }
+    openFile() {
+        const inputElement = document.getElementById('fotoEscolhida');
+        if (inputElement) {
+            inputElement.click();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, deps: [{ token: ImagensService }, { token: NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.8", type: KvAvatarComponent, selector: "kv-avatar", inputs: { borderColor: { classPropertyName: "borderColor", publicName: "borderColor", isSignal: false, isRequired: false, transformFunction: null }, btnsColor: { classPropertyName: "btnsColor", publicName: "btnsColor", isSignal: false, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: false, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: false, isRequired: false, transformFunction: null }, btnAlterarFoto: { classPropertyName: "btnAlterarFoto", publicName: "btnAlterarFoto", isSignal: false, isRequired: false, transformFunction: null }, imageUrl: { classPropertyName: "imageUrl", publicName: "imageUrl", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imageUrlChange: "imageUrlChange", onModalOpen: "onModalOpen", removerFotoEvent: "removerFotoEvent" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "cropCanvas", first: true, predicate: ["cropCanvas"], descendants: true }, { propertyName: "cropBorder", first: true, predicate: ["cropBorder"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"image-container\">\r\n  <img [src]=\"imageSource()\" alt=\"Foto\" class=\"container-foto\" [style.border-color]=\"borderColor\" [style.width.px]=\"width\" [style.height.px]=\"height\" (error)=\"handleImageError($event)\">\r\n  <div class=\"btn\">\r\n    <input #fileInput *ngIf=\"btnAlterarFoto\" id=\"fotoEscolhida\" type=\"file\" accept=\"image/*\" style=\"display:none\" (change)=\"selectFotoSelecionada($any($event))\">\r\n    <button *ngIf=\"btnAlterarFoto && !existeLogo\" class=\"botao-alterar-foto border-circle\" [style.background-color]=\"btnsColor\" (click)=\"openFile()\">\r\n      <i class=\"material-symbols-outlined\">photo_camera</i>\r\n    </button>\r\n    \r\n    <button *ngIf=\"btnAlterarFoto && existeLogo\" [style.background-color]=\"btnsColor\"\r\n     class=\"botao-excluir-foto border-circle\r\n            hover:shadow-3\r\n            active:shadow-5\"\r\n     (click)=\"questionRemoverFoto()\">\r\n      <i class=\"material-symbols-outlined\">delete</i>\r\n    </button>\r\n  </div>\r\n</div>\r\n\r\n<div *ngIf=\"showCropModal\" class=\"modal\">\r\n  <div class=\"modal-content\">\r\n    <div class=\"crop-container\">\r\n      <canvas #cropCanvas class=\"crop-canvas\"></canvas>\r\n      <div #cropBorder class=\"crop-border\"></div>\r\n    </div>\r\n\r\n    <div class=\"w-full mt-2\">\r\n      <kv-label label=\"Zoom\" style=\"text-align: left;\"/>\r\n      <p-slider [(ngModel)]=\"valueZoom\" (onChange)=\"onZoomChange($event)\"></p-slider>\r\n    </div>\r\n      \r\n    <div class=\"button-container\">  \r\n      <kv-button label=\"Cancelar\" severity=\"tertiary\" icon=\"close\" (click)=\"closeCropModal()\"></kv-button>\r\n      <kv-button label=\"Recortar\" severity=\"primary\" icon=\"crop\" (click)=\"cropImage()\" class=\"ml-2\"></kv-button>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter var,Inter,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter var,Inter,sans-serif!important}:host ::ng-deep .inputs{height:35px}:root{--kv-primary-color: #29b92d, --kv-secondary-color: #002542, --kv-terciary-color: #f2f3f5, --kv-primary-hover-color: #249a29, --kv-secondary-hover-color: #002038, --kv-terciary-hover-color: #d9dadb, --kv-primary-active-color: #1c801f, --kv-secondary-active-color: #001729, --kv-terciary-active-color: #c0c1c2, --kv-primary-disable-color: #1c801f, --kv-secondary-disable-color: #001729, --kv-terciary-disable-color: #c0c1c2, }::ng-deep .p-dialog .p-dialog-header{color:#fff!important;background:#002542!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}img{border-style:solid;border-width:2px;border-radius:50%;object-fit:cover}i{font-size:22px}.botao-alterar-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-alterar-foto i{color:#fff}.botao-excluir-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-excluir-foto i{color:#fff}.btn{position:absolute;top:87%;left:87%;transform:translate(-50%,-50%)}.image-container{display:inline-block;position:relative}.modal{display:block;position:absolute;z-index:9999;left:0;top:0;width:100vw;height:100vh;overflow:auto;background-color:#0006}.modal-content{background-color:#fefefe;margin:1% auto;padding:20px;border:1px solid #888;width:80%;max-width:fit-content;text-align:center;border-radius:12px}.crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px;width:100%;height:auto}.crop-border{position:absolute;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}.button-container{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-top:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$1.Slider, selector: "p-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }, { kind: "component", type: KvLabelComponent, selector: "kv-label", inputs: ["componentId", "label"] }] }); }
+    changeImage(event) {
+        const file = event.target.files[0];
+        if (file.type.startsWith('image/')) {
+            if (this.btnAlterarFoto == true) {
+                this.file = file;
+                const reader = new FileReader();
+                reader.onload = async () => {
+                    try {
+                        const result = await this.imageCutterService.cut(reader.result?.toString() ?? '', this.width, this.height, true);
+                        this.existeLogo = true;
+                        this.imageSource.set(result);
+                        this.selectedImage = result;
+                        this.imageUrlChange.emit(this.imageSource());
+                    }
+                    catch (error) {
+                        this.removerFoto();
+                    }
+                };
+                reader.readAsDataURL(file);
+            }
+            else {
+                // ?! Comportamneto padrão --> Preservar <-- !!!
+                this.file = file;
+                const reader = new FileReader();
+                reader.onload = (e) => {
+                    this.imageSource.set(reader.result + '');
+                };
+                reader.readAsDataURL(file);
+                this.imageUrlChange.emit(this.imageSource());
+            }
+        }
+        else {
+            this.notificationService.toastError('Apenas arquivos de imagem são permitidos.');
+        }
+    }
+    questionRemoverFoto() {
+        const msg = '<h3>Você tem certeza que deseja retirar a foto desse usuário?</h3>';
+        this.notificationService.question({
+            type: 'question',
+            message: msg,
+            accept: (data) => {
+                this.removerFoto();
+            },
+            reject: (data) => {
+            }
+        });
+    }
+    removerFoto() {
+        this.imageSource.set('');
+        this.removerFotoEvent.emit();
+        this.existeLogo = false;
+        this.imageUrlChange.emit(this.imageSource());
+        this.fileInput.nativeElement.value = '';
+    }
+    handleImageError(event) {
+        this.imageLoaded.set(true);
+        event.target.src = this.imageService.userDefaultImage();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, deps: [{ token: ImagensService }, { token: NotificationService }, { token: ImageCutterService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.8", type: KvAvatarComponent, selector: "kv-avatar", inputs: { borderColor: { classPropertyName: "borderColor", publicName: "borderColor", isSignal: false, isRequired: false, transformFunction: null }, btnsColor: { classPropertyName: "btnsColor", publicName: "btnsColor", isSignal: false, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: false, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: false, isRequired: false, transformFunction: null }, btnAlterarFoto: { classPropertyName: "btnAlterarFoto", publicName: "btnAlterarFoto", isSignal: false, isRequired: false, transformFunction: null }, imageUrl: { classPropertyName: "imageUrl", publicName: "imageUrl", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imageUrlChange: "imageUrlChange", removerFotoEvent: "removerFotoEvent" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"image-container\" [style.width.px]=\"width\" [style.height.px]=\"height\" >\r\n\r\n  <img\r\n    [src]=\"imageSource()\"\r\n    (load)=\"onImageLoad()\"\r\n    (error)=\"handleImageError($event)\"\r\n    alt=\"Foto\"\r\n    class=\"container-foto\"\r\n    [style.border-color]=\"borderColor\"\r\n    [style.width.px]=\"width\"\r\n    [style.height.px]=\"height\"\r\n    >\r\n\r\n  <div class=\"btn\">\r\n    <input #fileInput *ngIf=\"btnAlterarFoto\" id=\"fotoEscolhida\" type=\"file\" accept=\"image/*\" style=\"display:none\" (change)=\"changeImage($any($event))\">\r\n\r\n    <button *ngIf=\"btnAlterarFoto && !existeLogo\"\r\n      class=\"botao-alterar-foto border-circle\"\r\n      [style.background-color]=\"btnsColor\" (click)=\"openFile()\">\r\n      <i class=\"material-symbols-outlined\">photo_camera</i>\r\n    </button>\r\n\r\n    <button *ngIf=\"btnAlterarFoto && existeLogo\" [style.background-color]=\"btnsColor\"\r\n        class=\"botao-excluir-foto border-circle\r\n                hover:shadow-3\r\n                active:shadow-5\"\r\n        (click)=\"questionRemoverFoto()\">\r\n      <i class=\"material-symbols-outlined\">delete</i>\r\n    </button>\r\n  </div>\r\n\r\n  <ngx-loading [show]=\"!imageLoaded()\" full class=\"container-foto\" [config]=\"{backdropBorderRadius: '100%', fullScreenBackdrop: false }\"></ngx-loading>\r\n\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter var,Inter,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter var,Inter,sans-serif!important}:host ::ng-deep .inputs{height:35px}:root{--kv-primary-color: #29b92d, --kv-secondary-color: #002542, --kv-terciary-color: #f2f3f5, --kv-primary-hover-color: #249a29, --kv-secondary-hover-color: #002038, --kv-terciary-hover-color: #d9dadb, --kv-primary-active-color: #1c801f, --kv-secondary-active-color: #001729, --kv-terciary-active-color: #c0c1c2, --kv-primary-disable-color: #1c801f, --kv-secondary-disable-color: #001729, --kv-terciary-disable-color: #c0c1c2, }::ng-deep .p-dialog .p-dialog-header{color:#fff!important;background:#002542!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}img{border-style:solid;border-width:2px;border-radius:50%;object-fit:cover}i{font-size:22px}.botao-alterar-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-alterar-foto i{color:#fff}.botao-excluir-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-excluir-foto i{color:#fff}.btn{position:absolute;top:87%;left:87%;transform:translate(-50%,-50%)}.image-container{display:inline-block;position:relative}.modal{display:block;position:absolute;z-index:9999;left:0;top:0;width:100vw;height:100vh;overflow:auto;background-color:#0006}.modal-content{background-color:#fefefe;margin:1% auto;padding:20px;border:1px solid #888;width:80%;max-width:fit-content;text-align:center;border-radius:12px}.crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px;width:100%;height:auto}.crop-border{position:absolute;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}.button-container{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-top:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$5.NgxLoadingComponent, selector: "ngx-loading", inputs: ["show", "config", "template"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-avatar', template: "<div class=\"image-container\">\r\n  <img [src]=\"imageSource()\" alt=\"Foto\" class=\"container-foto\" [style.border-color]=\"borderColor\" [style.width.px]=\"width\" [style.height.px]=\"height\" (error)=\"handleImageError($event)\">\r\n  <div class=\"btn\">\r\n    <input #fileInput *ngIf=\"btnAlterarFoto\" id=\"fotoEscolhida\" type=\"file\" accept=\"image/*\" style=\"display:none\" (change)=\"selectFotoSelecionada($any($event))\">\r\n    <button *ngIf=\"btnAlterarFoto && !existeLogo\" class=\"botao-alterar-foto border-circle\" [style.background-color]=\"btnsColor\" (click)=\"openFile()\">\r\n      <i class=\"material-symbols-outlined\">photo_camera</i>\r\n    </button>\r\n    \r\n    <button *ngIf=\"btnAlterarFoto && existeLogo\" [style.background-color]=\"btnsColor\"\r\n     class=\"botao-excluir-foto border-circle\r\n            hover:shadow-3\r\n            active:shadow-5\"\r\n     (click)=\"questionRemoverFoto()\">\r\n      <i class=\"material-symbols-outlined\">delete</i>\r\n    </button>\r\n  </div>\r\n</div>\r\n\r\n<div *ngIf=\"showCropModal\" class=\"modal\">\r\n  <div class=\"modal-content\">\r\n    <div class=\"crop-container\">\r\n      <canvas #cropCanvas class=\"crop-canvas\"></canvas>\r\n      <div #cropBorder class=\"crop-border\"></div>\r\n    </div>\r\n\r\n    <div class=\"w-full mt-2\">\r\n      <kv-label label=\"Zoom\" style=\"text-align: left;\"/>\r\n      <p-slider [(ngModel)]=\"valueZoom\" (onChange)=\"onZoomChange($event)\"></p-slider>\r\n    </div>\r\n      \r\n    <div class=\"button-container\">  \r\n      <kv-button label=\"Cancelar\" severity=\"tertiary\" icon=\"close\" (click)=\"closeCropModal()\"></kv-button>\r\n      <kv-button label=\"Recortar\" severity=\"primary\" icon=\"crop\" (click)=\"cropImage()\" class=\"ml-2\"></kv-button>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter var,Inter,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter var,Inter,sans-serif!important}:host ::ng-deep .inputs{height:35px}:root{--kv-primary-color: #29b92d, --kv-secondary-color: #002542, --kv-terciary-color: #f2f3f5, --kv-primary-hover-color: #249a29, --kv-secondary-hover-color: #002038, --kv-terciary-hover-color: #d9dadb, --kv-primary-active-color: #1c801f, --kv-secondary-active-color: #001729, --kv-terciary-active-color: #c0c1c2, --kv-primary-disable-color: #1c801f, --kv-secondary-disable-color: #001729, --kv-terciary-disable-color: #c0c1c2, }::ng-deep .p-dialog .p-dialog-header{color:#fff!important;background:#002542!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}img{border-style:solid;border-width:2px;border-radius:50%;object-fit:cover}i{font-size:22px}.botao-alterar-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-alterar-foto i{color:#fff}.botao-excluir-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-excluir-foto i{color:#fff}.btn{position:absolute;top:87%;left:87%;transform:translate(-50%,-50%)}.image-container{display:inline-block;position:relative}.modal{display:block;position:absolute;z-index:9999;left:0;top:0;width:100vw;height:100vh;overflow:auto;background-color:#0006}.modal-content{background-color:#fefefe;margin:1% auto;padding:20px;border:1px solid #888;width:80%;max-width:fit-content;text-align:center;border-radius:12px}.crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px;width:100%;height:auto}.crop-border{position:absolute;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}.button-container{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-top:24px}\n"] }]
-        }], ctorParameters: () => [{ type: ImagensService }, { type: NotificationService }], propDecorators: { borderColor: [{
+            args: [{ selector: 'kv-avatar', template: "<div class=\"image-container\" [style.width.px]=\"width\" [style.height.px]=\"height\" >\r\n\r\n  <img\r\n    [src]=\"imageSource()\"\r\n    (load)=\"onImageLoad()\"\r\n    (error)=\"handleImageError($event)\"\r\n    alt=\"Foto\"\r\n    class=\"container-foto\"\r\n    [style.border-color]=\"borderColor\"\r\n    [style.width.px]=\"width\"\r\n    [style.height.px]=\"height\"\r\n    >\r\n\r\n  <div class=\"btn\">\r\n    <input #fileInput *ngIf=\"btnAlterarFoto\" id=\"fotoEscolhida\" type=\"file\" accept=\"image/*\" style=\"display:none\" (change)=\"changeImage($any($event))\">\r\n\r\n    <button *ngIf=\"btnAlterarFoto && !existeLogo\"\r\n      class=\"botao-alterar-foto border-circle\"\r\n      [style.background-color]=\"btnsColor\" (click)=\"openFile()\">\r\n      <i class=\"material-symbols-outlined\">photo_camera</i>\r\n    </button>\r\n\r\n    <button *ngIf=\"btnAlterarFoto && existeLogo\" [style.background-color]=\"btnsColor\"\r\n        class=\"botao-excluir-foto border-circle\r\n                hover:shadow-3\r\n                active:shadow-5\"\r\n        (click)=\"questionRemoverFoto()\">\r\n      <i class=\"material-symbols-outlined\">delete</i>\r\n    </button>\r\n  </div>\r\n\r\n  <ngx-loading [show]=\"!imageLoaded()\" full class=\"container-foto\" [config]=\"{backdropBorderRadius: '100%', fullScreenBackdrop: false }\"></ngx-loading>\r\n\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter var,Inter,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter var,Inter,sans-serif!important}:host ::ng-deep .inputs{height:35px}:root{--kv-primary-color: #29b92d, --kv-secondary-color: #002542, --kv-terciary-color: #f2f3f5, --kv-primary-hover-color: #249a29, --kv-secondary-hover-color: #002038, --kv-terciary-hover-color: #d9dadb, --kv-primary-active-color: #1c801f, --kv-secondary-active-color: #001729, --kv-terciary-active-color: #c0c1c2, --kv-primary-disable-color: #1c801f, --kv-secondary-disable-color: #001729, --kv-terciary-disable-color: #c0c1c2, }::ng-deep .p-dialog .p-dialog-header{color:#fff!important;background:#002542!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}img{border-style:solid;border-width:2px;border-radius:50%;object-fit:cover}i{font-size:22px}.botao-alterar-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-alterar-foto i{color:#fff}.botao-excluir-foto{border-style:none;width:max-content;background-color:#002542;color:#000;font-weight:700;cursor:pointer;padding:7px 9px}.botao-excluir-foto i{color:#fff}.btn{position:absolute;top:87%;left:87%;transform:translate(-50%,-50%)}.image-container{display:inline-block;position:relative}.modal{display:block;position:absolute;z-index:9999;left:0;top:0;width:100vw;height:100vh;overflow:auto;background-color:#0006}.modal-content{background-color:#fefefe;margin:1% auto;padding:20px;border:1px solid #888;width:80%;max-width:fit-content;text-align:center;border-radius:12px}.crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px;width:100%;height:auto}.crop-border{position:absolute;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}.button-container{display:flex;align-items:center;justify-content:flex-end;flex-direction:row;margin-top:24px}\n"] }]
+        }], ctorParameters: () => [{ type: ImagensService }, { type: NotificationService }, { type: ImageCutterService }], propDecorators: { borderColor: [{
                 type: Input
             }], btnsColor: [{
                 type: Input
@@ -4173,71 +4723,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
                 type: Input
             }], height: [{
                 type: Input
+            }], btnAlterarFoto: [{
+                type: Input
             }], imageUrlChange: [{
                 type: Output
-            }], onModalOpen: [{
-                type: Output
             }], removerFotoEvent: [{
                 type: Output
-            }], btnAlterarFoto: [{
-                type: Input
-            }], cropCanvas: [{
-                type: ViewChild,
-                args: ['cropCanvas']
-            }], cropBorder: [{
-                type: ViewChild,
-                args: ['cropBorder']
             }], fileInput: [{
                 type: ViewChild,
                 args: ['fileInput']
-            }], onWindowResize: [{
-                type: HostListener,
-                args: ['window:resize', ['$event']]
             }] } });
 
-class KvButtonModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, declarations: [KvButtonComponent], imports: [CommonModule,
-            PrimeNgModule], exports: [KvButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, imports: [CommonModule,
-            PrimeNgModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        KvButtonComponent
-                    ],
-                    imports: [
-                        CommonModule,
-                        PrimeNgModule
-                    ],
-                    exports: [
-                        KvButtonComponent
-                    ]
-                }]
-        }] });
-
-class KvLabelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, declarations: [KvLabelComponent], imports: [CommonModule], exports: [KvLabelComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, imports: [CommonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        KvLabelComponent
-                    ],
-                    imports: [
-                        CommonModule
-                    ],
-                    exports: [
-                        KvLabelComponent
-                    ]
-                }]
-        }] });
-
 class KvAvatarModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, declarations: [KvAvatarComponent], imports: [CommonModule,
@@ -4247,7 +4743,8 @@ class KvAvatarModule {
             FormsModule,
             ReactiveFormsModule,
             KvButtonModule,
-            KvLabelModule], exports: [KvAvatarComponent] }); }
+            KvLabelModule,
+            NgxLoadingModule], exports: [KvAvatarComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, imports: [CommonModule,
             ButtonModule,
             FileUploadModule,
@@ -4255,7 +4752,8 @@ class KvAvatarModule {
             FormsModule,
             ReactiveFormsModule,
             KvButtonModule,
-            KvLabelModule] }); }
+            KvLabelModule,
+            NgxLoadingModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, decorators: [{
             type: NgModule,
@@ -4272,6 +4770,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
                         ReactiveFormsModule,
                         KvButtonModule,
                         KvLabelModule,
+                        NgxLoadingModule
                     ],
                     exports: [
                         KvAvatarComponent
@@ -4399,7 +4898,7 @@ class KvCarouselComponent {
         window.open(link, '_blank');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvCarouselComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.8", type: KvCarouselComponent, selector: "kv-carousel", inputs: { heightCarousel: { classPropertyName: "heightCarousel", publicName: "heightCarousel", isSignal: true, isRequired: false, transformFunction: null }, carouselData: { classPropertyName: "carouselData", publicName: "carouselData", isSignal: false, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "carouselContainer", first: true, predicate: Carousel, descendants: true, isSignal: true }], ngImport: i0, template: "<p-carousel\r\n  [value]=\"carouselData\"\r\n  [indicatorStyleClass]=\"'carousel-indicator'\"\r\n  [autoplayInterval]=\"5000\"\r\n  [showIndicators]=\"true\"\r\n  [showNavigators]=\"false\"\r\n  [numVisible]=\"1\"\r\n  [numScroll]=\"1\"\r\n  [circular]=\"true\"\r\n  styleClass=\"h-full\"\r\n>\r\n  >\r\n  <ng-template\r\n    pTemplate=\"item\"\r\n    let-banner\r\n    class=\"justify-content-center align-items-center\"\r\n  >\r\n    <img\r\n      [src]=\"banner.img\"\r\n      class=\"w-full border-round-banner\"\r\n      [style.height.px]=\"heightComputed()\"\r\n      (click)=\"navigateToLink(banner.link)\"\r\n    />\r\n  </ng-template>\r\n</p-carousel>\r\n", styles: ["::ng-deep .p-carousel-indicators{position:absolute;left:50%;transform:translate(-50%);bottom:-1rem}::ng-deep .carousel-indicator{width:15px!important;height:4px!important;margin:-3px!important;padding:0!important;background-color:#eeeeeed0}::ng-deep .carousel-indicator:hover{background-color:#efefef}button.p-carousel-indicator.p-link{background-color:#f0f8ff!important}::ng-deep .p-carousel .p-carousel-content{overflow:hidden!important;position:relative}::ng-deep .border-round-banner{border-radius:20px!important;max-height:500px}\n"], dependencies: [{ kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2$2.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.8", type: KvCarouselComponent, selector: "kv-carousel", inputs: { heightCarousel: { classPropertyName: "heightCarousel", publicName: "heightCarousel", isSignal: true, isRequired: false, transformFunction: null }, carouselData: { classPropertyName: "carouselData", publicName: "carouselData", isSignal: false, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "carouselContainer", first: true, predicate: Carousel, descendants: true, isSignal: true }], ngImport: i0, template: "<p-carousel\r\n  [value]=\"carouselData\"\r\n  [indicatorStyleClass]=\"'carousel-indicator'\"\r\n  [autoplayInterval]=\"5000\"\r\n  [showIndicators]=\"true\"\r\n  [showNavigators]=\"false\"\r\n  [numVisible]=\"1\"\r\n  [numScroll]=\"1\"\r\n  [circular]=\"true\"\r\n  styleClass=\"h-full\"\r\n>\r\n  >\r\n  <ng-template\r\n    pTemplate=\"item\"\r\n    let-banner\r\n    class=\"justify-content-center align-items-center\"\r\n  >\r\n    <img\r\n      [src]=\"banner.img\"\r\n      class=\"w-full border-round-banner\"\r\n      [style.height.px]=\"heightComputed()\"\r\n      (click)=\"navigateToLink(banner.link)\"\r\n    />\r\n  </ng-template>\r\n</p-carousel>\r\n", styles: ["::ng-deep .p-carousel-indicators{position:absolute;left:50%;transform:translate(-50%);bottom:-1rem}::ng-deep .carousel-indicator{width:15px!important;height:4px!important;margin:-3px!important;padding:0!important;background-color:#eeeeeed0}::ng-deep .carousel-indicator:hover{background-color:#efefef}button.p-carousel-indicator.p-link{background-color:#f0f8ff!important}::ng-deep .p-carousel .p-carousel-content{overflow:hidden!important;position:relative}::ng-deep .border-round-banner{border-radius:20px!important;max-height:500px}\n"], dependencies: [{ kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2$3.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvCarouselComponent, decorators: [{
             type: Component,
@@ -4998,7 +5497,7 @@ class KvSelectButtonComponent {
         this.optionClick.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvSelectButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvSelectButtonComponent, selector: "kv-select-button", inputs: { formGroup: "formGroup", formControlName: "formControlName", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", mutiple: "mutiple", disabled: "disabled", value: "value" }, outputs: { onSelectionChange: "onSelectionChange", optionClick: "optionClick" }, ngImport: i0, template: "@if(value) {\r\n<p-selectButton\r\n    [options]=\"options\"\r\n    [optionLabel]=\"optionLabel\"\r\n    [optionValue]=\"optionValue\"\r\n    (onChange)=\"selectionChange($event)\"\r\n    (onOptionClick)=\"onOptionClick($event)\"\r\n    [multiple]=\"mutiple\"\r\n    [disabled]=\"disabled\"\r\n    [(ngModel)]=\"value\"\r\n/>\r\n} @else {\r\n<div [formGroup]=\"formGroup\">\r\n    <p-selectButton\r\n        [options]=\"options\"\r\n        [optionLabel]=\"optionLabel\"\r\n        [optionValue]=\"optionValue\"\r\n        (onChange)=\"selectionChange($event)\"\r\n        (onOptionClick)=\"onOptionClick($event)\"\r\n        [multiple]=\"mutiple\"\r\n        [disabled]=\"disabled\"\r\n        [formControlName]=\"formControlName\"\r\n        [(ngModel)]=\"value\"\r\n    />\r\n</div>\r\n}", styles: [":host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#183462!important;border:#183462;box-shadow:0 4px 10px #00000008,0 0 2px #0000000f,0 2px 6px #0000001f}\n"], dependencies: [{ kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$3.SelectButton, selector: "p-selectButton", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvSelectButtonComponent, selector: "kv-select-button", inputs: { formGroup: "formGroup", formControlName: "formControlName", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", mutiple: "mutiple", disabled: "disabled", value: "value" }, outputs: { onSelectionChange: "onSelectionChange", optionClick: "optionClick" }, ngImport: i0, template: "@if(value) {\r\n<p-selectButton\r\n    [options]=\"options\"\r\n    [optionLabel]=\"optionLabel\"\r\n    [optionValue]=\"optionValue\"\r\n    (onChange)=\"selectionChange($event)\"\r\n    (onOptionClick)=\"onOptionClick($event)\"\r\n    [multiple]=\"mutiple\"\r\n    [disabled]=\"disabled\"\r\n    [(ngModel)]=\"value\"\r\n/>\r\n} @else {\r\n<div [formGroup]=\"formGroup\">\r\n    <p-selectButton\r\n        [options]=\"options\"\r\n        [optionLabel]=\"optionLabel\"\r\n        [optionValue]=\"optionValue\"\r\n        (onChange)=\"selectionChange($event)\"\r\n        (onOptionClick)=\"onOptionClick($event)\"\r\n        [multiple]=\"mutiple\"\r\n        [disabled]=\"disabled\"\r\n        [formControlName]=\"formControlName\"\r\n        [(ngModel)]=\"value\"\r\n    />\r\n</div>\r\n}", styles: [":host ::ng-deep .p-selectbutton .p-button.p-highlight{background:#183462!important;border:#183462;box-shadow:0 4px 10px #00000008,0 0 2px #0000000f,0 2px 6px #0000001f}\n"], dependencies: [{ kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$4.SelectButton, selector: "p-selectButton", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvSelectButtonComponent, decorators: [{
             type: Component,
@@ -5484,11 +5983,11 @@ class KvLayoutComponent {
         return this.expandMenu() ? 'expanded' : 'collapsed';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2$1.FormBuilder }, { token: i3$1.Router }, { token: i3$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvLayoutComponent, selector: "kv-layout", inputs: { apps: { classPropertyName: "apps", publicName: "apps", isSignal: false, isRequired: false, transformFunction: null }, breadCrumbItems: { classPropertyName: "breadCrumbItems", publicName: "breadCrumbItems", isSignal: false, isRequired: false, transformFunction: null }, masters: { classPropertyName: "masters", publicName: "masters", isSignal: false, isRequired: false, transformFunction: null }, menus: { classPropertyName: "menus", publicName: "menus", isSignal: false, isRequired: false, transformFunction: null }, expandMenu: { classPropertyName: "expandMenu", publicName: "expandMenu", isSignal: true, isRequired: false, transformFunction: null }, logoMenuExpand: { classPropertyName: "logoMenuExpand", publicName: "logoMenuExpand", isSignal: false, isRequired: false, transformFunction: null }, logoMenuHide: { classPropertyName: "logoMenuHide", publicName: "logoMenuHide", isSignal: false, isRequired: false, transformFunction: null }, selectedApp: { classPropertyName: "selectedApp", publicName: "selectedApp", isSignal: false, isRequired: false, transformFunction: null }, selectedEmpresa: { classPropertyName: "selectedEmpresa", publicName: "selectedEmpresa", isSignal: false, isRequired: false, transformFunction: null }, selectedMaster: { classPropertyName: "selectedMaster", publicName: "selectedMaster", isSignal: false, isRequired: false, transformFunction: null }, showButtonApps: { classPropertyName: "showButtonApps", publicName: "showButtonApps", isSignal: false, isRequired: false, transformFunction: null }, showButtonUser: { classPropertyName: "showButtonUser", publicName: "showButtonUser", isSignal: false, isRequired: false, transformFunction: null }, showExpandMenu: { classPropertyName: "showExpandMenu", publicName: "showExpandMenu", isSignal: false, isRequired: false, transformFunction: null }, showDropdownLicenca: { classPropertyName: "showDropdownLicenca", publicName: "showDropdownLicenca", isSignal: false, isRequired: false, transformFunction: null }, showMenu: { classPropertyName: "showMenu", publicName: "showMenu", isSignal: false, isRequired: false, transformFunction: null }, showTrocaEmpresa: { classPropertyName: "showTrocaEmpresa", publicName: "showTrocaEmpresa", isSignal: false, isRequired: false, transformFunction: null }, userName: { classPropertyName: "userName", publicName: "userName", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { expandMenu: "expandMenuChange", accessKeePassEmit: "accessKeePassEmit", changeEmpresaEmit: "changeEmpresaEmit", changeLicenseEmit: "changeLicenseEmit", expandMenuEmit: "expandMenuEmit", logoutEmit: "logoutEmit", selectAppEmit: "selectAppEmit", navigateToDefaultRouteEmit: "navigateToDefaultRouteEmit" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, queries: [{ propertyName: "topMenuActions", predicate: ["topMenuAction"], isSignal: true }], viewQueries: [{ propertyName: "meusDadosPanel", first: true, predicate: ["meusDadosPanel"], descendants: true }, { propertyName: "sidebarRef", first: true, predicate: ["sidebarRef"], descendants: true }, { propertyName: "sistemasPanel", first: true, predicate: ["sistemasPanel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n  @if (showMenu) {\r\n  <div [style]=\"{ minWidth: expandMenu() ? '300px' : '60px' }\"></div>\r\n  } @if(showMenu) {\r\n  <p-sidebar\r\n    #sidebarRef\r\n    [visible]=\"true\"\r\n    [showCloseIcon]=\"false\"\r\n    [modal]=\"false\"\r\n    [style]=\"{ width: expandMenu() ? '300px' : '60px' }\"\r\n    class=\"sidebar-animation\"\r\n  >\r\n    <ng-template pTemplate=\"headless\">\r\n      <div class=\"flex flex-column overflow-hidden\">\r\n        <div\r\n          class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n        >\r\n          <div\r\n            class=\"flex {{\r\n              expandMenu() ? 'flex-row' : 'flex-column'\r\n            }} align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }} py-3\"\r\n          >\r\n            <!-- Logo para o menu expandido -->\r\n            <img\r\n              *ngIf=\"expandMenu() && logoMenuExpand\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuExpand\"\r\n              width=\"150\"\r\n              class=\"cursor-pointer\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Logo para o menu minimizado-->\r\n            <img\r\n              *ngIf=\"!expandMenu() && logoMenuHide\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuHide\"\r\n              width=\"50\"\r\n              class=\"mb-2\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Toggle menu -->\r\n            <button\r\n              *ngIf=\"showExpandMenu\"\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"toggleMenu()\"\r\n              [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> menu </i>\r\n            </button>\r\n          </div>\r\n\r\n          @if(showTrocaEmpresa){\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <div\r\n              class=\"flex flex-column cursor-pointer\"\r\n              *ngIf=\"expandMenu() && selectedEmpresa\"\r\n              (click)=\"changeEmpresa($event)\"\r\n            >\r\n              <span\r\n                class=\"text-sm font-semibold mr-2\"\r\n                [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n                [tooltipPosition]=\"'right'\"\r\n              >\r\n                {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n              </span>\r\n              <span class=\"text-sm mt-1\">{{\r\n                this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n              }}</span>\r\n            </div>\r\n\r\n            <button\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"changeEmpresa($event)\"\r\n              [pTooltip]=\"'Trocar de empresa'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n            </button>\r\n          </div>\r\n          <p-divider type=\"solid\"></p-divider>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n          <!-- menus -->\r\n          <li\r\n            *ngFor=\"let menu of menus; let i = index\"\r\n            [class]=\"expandMenu() ? 'px-2' : 'px-1'\"\r\n          >\r\n            <!-- menu que n\u00E3o tem filho -->\r\n            <a\r\n              (click)=\"callRoute(menu.link)\"\r\n              *ngIf=\"\r\n                !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n              \"\r\n              pRipple\r\n              [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n              [tooltipPosition]=\"'right'\"\r\n              class=\"{{\r\n                menu.bgColor\r\n              }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n              [class.justify-content-center]=\"!expandMenu()\"\r\n            >\r\n              <i\r\n                class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                  expandMenu() ? 'ml-1 mr-2' : ''\r\n                }}  icon-hover-color {{ menu.textColor }}\"\r\n                *ngIf=\"menu.icone\"\r\n              >\r\n                {{ menu.icone }}\r\n              </i>\r\n              <span\r\n                class=\"content-option-menu text-base text-blue-900 font-medium {{\r\n                  menu.textColor\r\n                }}\"\r\n                *ngIf=\"expandMenu()\"\r\n                >{{ menu.descricaomenu }}</span\r\n              >\r\n            </a>\r\n            <!-- menu com filho -->\r\n            <div *ngIf=\"menu.indmenupai\">\r\n              <a\r\n                pRipple\r\n                pStyleClass=\"@next\"\r\n                enterClass=\"hidden\"\r\n                enterActiveClass=\"slidedown\"\r\n                leaveToClass=\"hidden\"\r\n                leaveActiveClass=\"slideup\"\r\n                [class.bg-green-600]=\"isSelectedMenuPai(menu)\"\r\n                class=\"menu-option flex align-items-center {{\r\n                  !expandMenu()\r\n                    ? 'justify-content-center'\r\n                    : 'justify-content-between'\r\n                }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n                [tooltipPosition]=\"'right'\"\r\n                [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n                (click)=\"\r\n                  expandMenu.set(!expandMenu() ? !expandMenu() : expandMenu())\r\n                \"\r\n              >\r\n                <div class=\"flex flex-row align-items-center\">\r\n                  <i\r\n                    class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                      expandMenu() ? 'ml-1 mr-2' : ''\r\n                    }} icon-hover-color\"\r\n                    *ngIf=\"menu.icone\"\r\n                    [class.text-white]=\"isSelectedMenuPai(menu)\"\r\n                  >\r\n                    {{ menu.icone }}\r\n                  </i>\r\n                  <span\r\n                    class=\"text-base text-blue-900 font-medium content-option-menu\"\r\n                    *ngIf=\"expandMenu()\"\r\n                    >{{ menu.descricaomenu }}</span\r\n                  >\r\n                </div>\r\n                <i\r\n                  class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color content-option-menu\"\r\n                  *ngIf=\"expandMenu()\"\r\n                ></i>\r\n              </a>\r\n\r\n              <!-- filhos -->\r\n              <div\r\n                class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n                  !(\r\n                    menuSelecionado()?.idmenupai == menu.idmenu &&\r\n                    this.expandMenu()\r\n                  ) && 'hidden'\r\n                }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n              >\r\n                <li\r\n                  *ngFor=\"\r\n                    let filho of returnMenuChild(menu.idmenu);\r\n                    let iFilho = index\r\n                  \"\r\n                >\r\n                  <a\r\n                    *ngIf=\"expandMenu()\"\r\n                    (click)=\"callRoute(filho.link)\"\r\n                    pRipple\r\n                    class=\"{{\r\n                      filho.bgColor\r\n                    }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n                  >\r\n                    <i\r\n                      class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                        expandMenu() ? 'ml-1 mr-2' : ''\r\n                      }} icon-hover-color\"\r\n                      *ngIf=\"filho.icone\"\r\n                    >\r\n                      {{ filho.icone }}\r\n                    </i>\r\n                    <span\r\n                      class=\"content-option-menu text-base text-blue-900 ml-4 {{\r\n                        filho.textColor\r\n                      }}\"\r\n                      *ngIf=\"expandMenu()\"\r\n                      >{{ filho.descricaomenu }}</span\r\n                    >\r\n                  </a>\r\n                </li>\r\n              </div>\r\n            </div>\r\n          </li>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </p-sidebar>\r\n  }\r\n\r\n  <!-- Topbar -->\r\n  <div\r\n    class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n    id=\"page-content\"\r\n    style=\"width: 100vw !important\"\r\n  >\r\n    <div\r\n      class=\"flex flex-row flex-wrap align-items-center justify-content-between m-3\"\r\n    >\r\n      @if(!showMenu) {\r\n      <!-- Logo home -->\r\n      <div>\r\n        <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n      </div>\r\n      } @else {\r\n      <!-- Breadcrumbs -->\r\n      <div>\r\n        <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n          {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n        </p>\r\n        <p-breadcrumb\r\n          *ngIf=\"widthCard > 400\"\r\n          styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n          [model]=\"breadCrumbItems\"\r\n          [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n          (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n        ></p-breadcrumb>\r\n      </div>\r\n      } \r\n      \r\n      @if(widthCard > 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-40rem\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n\r\n      <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n      <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n        @for (topAction of topMenuActions(); track $index) {\r\n        <ng-container *ngTemplateOutlet=\"topAction\" />\r\n        }\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonApps\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-th-large\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          (click)=\"sistemasPanel.toggle($event)\"\r\n          [pTooltip]=\"'Sistemas'\"\r\n          [tooltipPosition]=\"'left'\"\r\n        ></p-button>\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonUser\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-user\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"meusDadosPanel.toggle($event)\"\r\n        ></p-button>\r\n      </div>\r\n\r\n      @if(widthCard < 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-full\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n    </div>\r\n\r\n    <!-- Container -->\r\n    <p-card\r\n      styleClass=\"m-3 overflow-y-auto {{\r\n        !showMenu && 'sm:overflow-y-hidden'\r\n      }} card-container\"\r\n      [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n    >\r\n      <div class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </p-card>\r\n  </div>\r\n\r\n  <!-- Painel de aplicativos -->\r\n  <p-overlayPanel\r\n    #sistemasPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">Sistemas</p>\r\n\r\n      <div\r\n        class=\"flex flex-row flex-wrap gap-3 align-items-center justify-content-center mt-5 mb-3\"\r\n        style=\"width: 270px; height: 100%\"\r\n      >\r\n        @for (aplicativo of apps; track $index) { @if(aplicativo.urlicone ==\r\n        \"https://work-assets.keevo.com.br/img/icone-keevocenter.png\") {\r\n        <div\r\n          class=\"btn-sistema text-xl md:text-3xl flex align-items-center justify-content-center\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n        >\r\n          {{ aplicativo.descricaoaplicativo.charAt(0).toLocaleUpperCase() }}\r\n        </div>\r\n        } @else {\r\n        <img\r\n          [src]=\"aplicativo.urlicone\"\r\n          class=\"btn-sistema flex align-items-center justify-content-center\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        />\r\n        } }\r\n\r\n        <!-- <button\r\n          *ngFor=\"let aplicativo of apps\"\r\n          pButton\r\n          pRipple\r\n          class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        >\r\n          {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n        </button> -->\r\n      </div>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n\r\n  <!-- Painel do usu\u00E1rio -->\r\n  <p-overlayPanel\r\n    #meusDadosPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">\r\n        Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n      </p>\r\n      <div class=\"mt-5 mb-3\"></div>\r\n\r\n      <p-button\r\n        icon=\"pi pi-lock\"\r\n        label=\"Acessar Keepass\"\r\n        (onClick)=\"accessKeePass($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n\r\n      <p-button\r\n        icon=\"pi pi-sign-out\"\r\n        label=\"Sair\"\r\n        (onClick)=\"logout($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 17%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color,.menu-option:hover .content-option-menu{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}.btn-sistema{display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;cursor:pointer;width:4rem;height:4rem;background-color:#002542;color:#fff;padding:.5rem;box-shadow:#00000059 0 0 4px;border-radius:.75rem;transition:box-shadow .3s ease-in-out}.btn-sistema:hover{opacity:.9;box-shadow:#0009 0 0 8px}\n"], dependencies: [{ 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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$9.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { 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: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i10.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i10$1.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i2.Ripple, selector: "[pRipple]" }, { kind: "component", type: i12.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i13$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DropdownMasterComponent, selector: "dropdown-master", inputs: ["formControlName", "masters"] }, { kind: "pipe", type: CpfCnpjPipe, name: "cpfCnpj" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvLayoutComponent, selector: "kv-layout", inputs: { apps: { classPropertyName: "apps", publicName: "apps", isSignal: false, isRequired: false, transformFunction: null }, breadCrumbItems: { classPropertyName: "breadCrumbItems", publicName: "breadCrumbItems", isSignal: false, isRequired: false, transformFunction: null }, masters: { classPropertyName: "masters", publicName: "masters", isSignal: false, isRequired: false, transformFunction: null }, menus: { classPropertyName: "menus", publicName: "menus", isSignal: false, isRequired: false, transformFunction: null }, expandMenu: { classPropertyName: "expandMenu", publicName: "expandMenu", isSignal: true, isRequired: false, transformFunction: null }, logoMenuExpand: { classPropertyName: "logoMenuExpand", publicName: "logoMenuExpand", isSignal: false, isRequired: false, transformFunction: null }, logoMenuHide: { classPropertyName: "logoMenuHide", publicName: "logoMenuHide", isSignal: false, isRequired: false, transformFunction: null }, selectedApp: { classPropertyName: "selectedApp", publicName: "selectedApp", isSignal: false, isRequired: false, transformFunction: null }, selectedEmpresa: { classPropertyName: "selectedEmpresa", publicName: "selectedEmpresa", isSignal: false, isRequired: false, transformFunction: null }, selectedMaster: { classPropertyName: "selectedMaster", publicName: "selectedMaster", isSignal: false, isRequired: false, transformFunction: null }, showButtonApps: { classPropertyName: "showButtonApps", publicName: "showButtonApps", isSignal: false, isRequired: false, transformFunction: null }, showButtonUser: { classPropertyName: "showButtonUser", publicName: "showButtonUser", isSignal: false, isRequired: false, transformFunction: null }, showExpandMenu: { classPropertyName: "showExpandMenu", publicName: "showExpandMenu", isSignal: false, isRequired: false, transformFunction: null }, showDropdownLicenca: { classPropertyName: "showDropdownLicenca", publicName: "showDropdownLicenca", isSignal: false, isRequired: false, transformFunction: null }, showMenu: { classPropertyName: "showMenu", publicName: "showMenu", isSignal: false, isRequired: false, transformFunction: null }, showTrocaEmpresa: { classPropertyName: "showTrocaEmpresa", publicName: "showTrocaEmpresa", isSignal: false, isRequired: false, transformFunction: null }, userName: { classPropertyName: "userName", publicName: "userName", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { expandMenu: "expandMenuChange", accessKeePassEmit: "accessKeePassEmit", changeEmpresaEmit: "changeEmpresaEmit", changeLicenseEmit: "changeLicenseEmit", expandMenuEmit: "expandMenuEmit", logoutEmit: "logoutEmit", selectAppEmit: "selectAppEmit", navigateToDefaultRouteEmit: "navigateToDefaultRouteEmit" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, queries: [{ propertyName: "topMenuActions", predicate: ["topMenuAction"], isSignal: true }], viewQueries: [{ propertyName: "meusDadosPanel", first: true, predicate: ["meusDadosPanel"], descendants: true }, { propertyName: "sidebarRef", first: true, predicate: ["sidebarRef"], descendants: true }, { propertyName: "sistemasPanel", first: true, predicate: ["sistemasPanel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n  @if (showMenu) {\r\n  <div [style]=\"{ minWidth: expandMenu() ? '300px' : '60px' }\"></div>\r\n  } @if(showMenu) {\r\n  <p-sidebar\r\n    #sidebarRef\r\n    [visible]=\"true\"\r\n    [showCloseIcon]=\"false\"\r\n    [modal]=\"false\"\r\n    [style]=\"{ width: expandMenu() ? '300px' : '60px' }\"\r\n    class=\"sidebar-animation\"\r\n  >\r\n    <ng-template pTemplate=\"headless\">\r\n      <div class=\"flex flex-column overflow-hidden\">\r\n        <div\r\n          class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n        >\r\n          <div\r\n            class=\"flex {{\r\n              expandMenu() ? 'flex-row' : 'flex-column'\r\n            }} align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }} py-3\"\r\n          >\r\n            <!-- Logo para o menu expandido -->\r\n            <img\r\n              *ngIf=\"expandMenu() && logoMenuExpand\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuExpand\"\r\n              height=\"50\"\r\n              width=\"auto\"\r\n              class=\"cursor-pointer p-1\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Logo para o menu minimizado-->\r\n            <img\r\n              *ngIf=\"!expandMenu() && logoMenuHide\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuHide\"\r\n              height=\"50\"\r\n              width=\"auto\"\r\n              class=\"mb-2 p-1\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Toggle menu -->\r\n            <button\r\n              *ngIf=\"showExpandMenu\"\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"toggleMenu()\"\r\n              [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> menu </i>\r\n            </button>\r\n          </div>\r\n\r\n          @if(showTrocaEmpresa){\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <div\r\n              class=\"flex flex-column cursor-pointer\"\r\n              *ngIf=\"expandMenu() && selectedEmpresa\"\r\n              (click)=\"changeEmpresa($event)\"\r\n            >\r\n              <span\r\n                class=\"text-sm font-semibold mr-2\"\r\n                [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n                [tooltipPosition]=\"'right'\"\r\n              >\r\n                {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n              </span>\r\n              <span class=\"text-sm mt-1\">{{\r\n                this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n              }}</span>\r\n            </div>\r\n\r\n            <button\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"changeEmpresa($event)\"\r\n              [pTooltip]=\"'Trocar de empresa'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n            </button>\r\n          </div>\r\n          <p-divider type=\"solid\"></p-divider>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n          <!-- menus -->\r\n          <li\r\n            *ngFor=\"let menu of menus; let i = index\"\r\n            [class]=\"expandMenu() ? 'px-2' : 'px-1'\"\r\n          >\r\n            <!-- menu que n\u00E3o tem filho -->\r\n            <a\r\n              (click)=\"callRoute(menu.link)\"\r\n              *ngIf=\"\r\n                !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n              \"\r\n              pRipple\r\n              [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n              [tooltipPosition]=\"'right'\"\r\n              class=\"{{\r\n                menu.bgColor\r\n              }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n              [class.justify-content-center]=\"!expandMenu()\"\r\n            >\r\n              <i\r\n                class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                  expandMenu() ? 'ml-1 mr-2' : ''\r\n                }}  icon-hover-color {{ menu.textColor }}\"\r\n                *ngIf=\"menu.icone\"\r\n              >\r\n                {{ menu.icone }}\r\n              </i>\r\n              <span\r\n                class=\"content-option-menu text-base text-blue-900 font-medium {{\r\n                  menu.textColor\r\n                }}\"\r\n                *ngIf=\"expandMenu()\"\r\n                >{{ menu.descricaomenu }}</span\r\n              >\r\n            </a>\r\n            <!-- menu com filho -->\r\n            <div *ngIf=\"menu.indmenupai\">\r\n              <a\r\n                pRipple\r\n                pStyleClass=\"@next\"\r\n                enterClass=\"hidden\"\r\n                enterActiveClass=\"slidedown\"\r\n                leaveToClass=\"hidden\"\r\n                leaveActiveClass=\"slideup\"\r\n                [class.bg-green-600]=\"isSelectedMenuPai(menu)\"\r\n                class=\"menu-option flex align-items-center {{\r\n                  !expandMenu()\r\n                    ? 'justify-content-center'\r\n                    : 'justify-content-between'\r\n                }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n                [tooltipPosition]=\"'right'\"\r\n                [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n                (click)=\"\r\n                  expandMenu.set(!expandMenu() ? !expandMenu() : expandMenu())\r\n                \"\r\n              >\r\n                <div class=\"flex flex-row align-items-center\">\r\n                  <i\r\n                    class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                      expandMenu() ? 'ml-1 mr-2' : ''\r\n                    }} icon-hover-color\"\r\n                    *ngIf=\"menu.icone\"\r\n                    [class.text-white]=\"isSelectedMenuPai(menu)\"\r\n                  >\r\n                    {{ menu.icone }}\r\n                  </i>\r\n                  <span\r\n                    class=\"text-base text-blue-900 font-medium content-option-menu\"\r\n                    *ngIf=\"expandMenu()\"\r\n                    >{{ menu.descricaomenu }}</span\r\n                  >\r\n                </div>\r\n                <i\r\n                  class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color content-option-menu\"\r\n                  *ngIf=\"expandMenu()\"\r\n                ></i>\r\n              </a>\r\n\r\n              <!-- filhos -->\r\n              <div\r\n                class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n                  !(\r\n                    menuSelecionado()?.idmenupai == menu.idmenu &&\r\n                    this.expandMenu()\r\n                  ) && 'hidden'\r\n                }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n              >\r\n                <li\r\n                  *ngFor=\"\r\n                    let filho of returnMenuChild(menu.idmenu);\r\n                    let iFilho = index\r\n                  \"\r\n                >\r\n                  <a\r\n                    *ngIf=\"expandMenu()\"\r\n                    (click)=\"callRoute(filho.link)\"\r\n                    pRipple\r\n                    class=\"{{\r\n                      filho.bgColor\r\n                    }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n                  >\r\n                    <i\r\n                      class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                        expandMenu() ? 'ml-1 mr-2' : ''\r\n                      }} icon-hover-color\"\r\n                      *ngIf=\"filho.icone\"\r\n                    >\r\n                      {{ filho.icone }}\r\n                    </i>\r\n                    <span\r\n                      class=\"content-option-menu text-base text-blue-900 ml-4 {{\r\n                        filho.textColor\r\n                      }}\"\r\n                      *ngIf=\"expandMenu()\"\r\n                      >{{ filho.descricaomenu }}</span\r\n                    >\r\n                  </a>\r\n                </li>\r\n              </div>\r\n            </div>\r\n          </li>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </p-sidebar>\r\n  }\r\n\r\n  <!-- Topbar -->\r\n  <div\r\n    class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n    id=\"page-content\"\r\n    style=\"width: 100vw !important\"\r\n  >\r\n    <div\r\n      class=\"flex flex-row flex-wrap align-items-center justify-content-between m-3\"\r\n    >\r\n      @if(!showMenu) {\r\n      <!-- Logo home -->\r\n      <div>\r\n        <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n      </div>\r\n      } @else {\r\n      <!-- Breadcrumbs -->\r\n      <div>\r\n        <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n          {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n        </p>\r\n        <p-breadcrumb\r\n          *ngIf=\"widthCard > 400\"\r\n          styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n          [model]=\"breadCrumbItems\"\r\n          [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n          (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n        ></p-breadcrumb>\r\n      </div>\r\n      } \r\n      \r\n      @if(widthCard > 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-40rem\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n\r\n      <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n      <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n        @for (topAction of topMenuActions(); track $index) {\r\n        <ng-container *ngTemplateOutlet=\"topAction\" />\r\n        }\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonApps\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-th-large\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          (click)=\"sistemasPanel.toggle($event)\"\r\n          [pTooltip]=\"'Sistemas'\"\r\n          [tooltipPosition]=\"'left'\"\r\n        ></p-button>\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonUser\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-user\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"meusDadosPanel.toggle($event)\"\r\n        ></p-button>\r\n      </div>\r\n\r\n      @if(widthCard < 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-full\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n    </div>\r\n\r\n    <!-- Container -->\r\n    <p-card\r\n      styleClass=\"m-3 overflow-y-auto {{\r\n        !showMenu && 'sm:overflow-y-hidden'\r\n      }} card-container\"\r\n      [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n    >\r\n      <div class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </p-card>\r\n  </div>\r\n\r\n  <!-- Painel de aplicativos -->\r\n  <p-overlayPanel\r\n    #sistemasPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">Sistemas</p>\r\n\r\n      <div\r\n        class=\"flex flex-row flex-wrap gap-3 align-items-center justify-content-center mt-5 mb-3\"\r\n        style=\"width: 270px; height: 100%\"\r\n      >\r\n        @for (aplicativo of apps; track $index) { @if(aplicativo.urlicone ==\r\n        \"https://work-assets.keevo.com.br/img/icone-keevocenter.png\") {\r\n        <div\r\n          class=\"btn-sistema text-xl md:text-3xl flex align-items-center justify-content-center\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n        >\r\n          {{ aplicativo.descricaoaplicativo.charAt(0).toLocaleUpperCase() }}\r\n        </div>\r\n        } @else {\r\n        <img\r\n          [src]=\"aplicativo.urlicone\"\r\n          class=\"btn-sistema flex align-items-center justify-content-center\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        />\r\n        } }\r\n\r\n        <!-- <button\r\n          *ngFor=\"let aplicativo of apps\"\r\n          pButton\r\n          pRipple\r\n          class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        >\r\n          {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n        </button> -->\r\n      </div>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n\r\n  <!-- Painel do usu\u00E1rio -->\r\n  <p-overlayPanel\r\n    #meusDadosPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">\r\n        Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n      </p>\r\n      <div class=\"mt-5 mb-3\"></div>\r\n\r\n      <p-button\r\n        icon=\"pi pi-lock\"\r\n        label=\"Acessar Keepass\"\r\n        (onClick)=\"accessKeePass($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n\r\n      <p-button\r\n        icon=\"pi pi-sign-out\"\r\n        label=\"Sair\"\r\n        (onClick)=\"logout($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 17%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color,.menu-option:hover .content-option-menu{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}.btn-sistema{display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;cursor:pointer;width:4rem;height:4rem;background-color:#002542;color:#fff;padding:.5rem;box-shadow:#00000059 0 0 4px;border-radius:.75rem;transition:box-shadow .3s ease-in-out}.btn-sistema:hover{opacity:.9;box-shadow:#0009 0 0 8px}\n"], dependencies: [{ 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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$9.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { 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: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i10.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i10$1.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i2.Ripple, selector: "[pRipple]" }, { kind: "component", type: i12.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i13$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DropdownMasterComponent, selector: "dropdown-master", inputs: ["formControlName", "masters"] }, { kind: "pipe", type: CpfCnpjPipe, name: "cpfCnpj" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-layout', template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n  @if (showMenu) {\r\n  <div [style]=\"{ minWidth: expandMenu() ? '300px' : '60px' }\"></div>\r\n  } @if(showMenu) {\r\n  <p-sidebar\r\n    #sidebarRef\r\n    [visible]=\"true\"\r\n    [showCloseIcon]=\"false\"\r\n    [modal]=\"false\"\r\n    [style]=\"{ width: expandMenu() ? '300px' : '60px' }\"\r\n    class=\"sidebar-animation\"\r\n  >\r\n    <ng-template pTemplate=\"headless\">\r\n      <div class=\"flex flex-column overflow-hidden\">\r\n        <div\r\n          class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n        >\r\n          <div\r\n            class=\"flex {{\r\n              expandMenu() ? 'flex-row' : 'flex-column'\r\n            }} align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }} py-3\"\r\n          >\r\n            <!-- Logo para o menu expandido -->\r\n            <img\r\n              *ngIf=\"expandMenu() && logoMenuExpand\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuExpand\"\r\n              width=\"150\"\r\n              class=\"cursor-pointer\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Logo para o menu minimizado-->\r\n            <img\r\n              *ngIf=\"!expandMenu() && logoMenuHide\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuHide\"\r\n              width=\"50\"\r\n              class=\"mb-2\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Toggle menu -->\r\n            <button\r\n              *ngIf=\"showExpandMenu\"\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"toggleMenu()\"\r\n              [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> menu </i>\r\n            </button>\r\n          </div>\r\n\r\n          @if(showTrocaEmpresa){\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <div\r\n              class=\"flex flex-column cursor-pointer\"\r\n              *ngIf=\"expandMenu() && selectedEmpresa\"\r\n              (click)=\"changeEmpresa($event)\"\r\n            >\r\n              <span\r\n                class=\"text-sm font-semibold mr-2\"\r\n                [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n                [tooltipPosition]=\"'right'\"\r\n              >\r\n                {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n              </span>\r\n              <span class=\"text-sm mt-1\">{{\r\n                this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n              }}</span>\r\n            </div>\r\n\r\n            <button\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"changeEmpresa($event)\"\r\n              [pTooltip]=\"'Trocar de empresa'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n            </button>\r\n          </div>\r\n          <p-divider type=\"solid\"></p-divider>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n          <!-- menus -->\r\n          <li\r\n            *ngFor=\"let menu of menus; let i = index\"\r\n            [class]=\"expandMenu() ? 'px-2' : 'px-1'\"\r\n          >\r\n            <!-- menu que n\u00E3o tem filho -->\r\n            <a\r\n              (click)=\"callRoute(menu.link)\"\r\n              *ngIf=\"\r\n                !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n              \"\r\n              pRipple\r\n              [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n              [tooltipPosition]=\"'right'\"\r\n              class=\"{{\r\n                menu.bgColor\r\n              }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n              [class.justify-content-center]=\"!expandMenu()\"\r\n            >\r\n              <i\r\n                class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                  expandMenu() ? 'ml-1 mr-2' : ''\r\n                }}  icon-hover-color {{ menu.textColor }}\"\r\n                *ngIf=\"menu.icone\"\r\n              >\r\n                {{ menu.icone }}\r\n              </i>\r\n              <span\r\n                class=\"content-option-menu text-base text-blue-900 font-medium {{\r\n                  menu.textColor\r\n                }}\"\r\n                *ngIf=\"expandMenu()\"\r\n                >{{ menu.descricaomenu }}</span\r\n              >\r\n            </a>\r\n            <!-- menu com filho -->\r\n            <div *ngIf=\"menu.indmenupai\">\r\n              <a\r\n                pRipple\r\n                pStyleClass=\"@next\"\r\n                enterClass=\"hidden\"\r\n                enterActiveClass=\"slidedown\"\r\n                leaveToClass=\"hidden\"\r\n                leaveActiveClass=\"slideup\"\r\n                [class.bg-green-600]=\"isSelectedMenuPai(menu)\"\r\n                class=\"menu-option flex align-items-center {{\r\n                  !expandMenu()\r\n                    ? 'justify-content-center'\r\n                    : 'justify-content-between'\r\n                }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n                [tooltipPosition]=\"'right'\"\r\n                [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n                (click)=\"\r\n                  expandMenu.set(!expandMenu() ? !expandMenu() : expandMenu())\r\n                \"\r\n              >\r\n                <div class=\"flex flex-row align-items-center\">\r\n                  <i\r\n                    class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                      expandMenu() ? 'ml-1 mr-2' : ''\r\n                    }} icon-hover-color\"\r\n                    *ngIf=\"menu.icone\"\r\n                    [class.text-white]=\"isSelectedMenuPai(menu)\"\r\n                  >\r\n                    {{ menu.icone }}\r\n                  </i>\r\n                  <span\r\n                    class=\"text-base text-blue-900 font-medium content-option-menu\"\r\n                    *ngIf=\"expandMenu()\"\r\n                    >{{ menu.descricaomenu }}</span\r\n                  >\r\n                </div>\r\n                <i\r\n                  class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color content-option-menu\"\r\n                  *ngIf=\"expandMenu()\"\r\n                ></i>\r\n              </a>\r\n\r\n              <!-- filhos -->\r\n              <div\r\n                class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n                  !(\r\n                    menuSelecionado()?.idmenupai == menu.idmenu &&\r\n                    this.expandMenu()\r\n                  ) && 'hidden'\r\n                }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n              >\r\n                <li\r\n                  *ngFor=\"\r\n                    let filho of returnMenuChild(menu.idmenu);\r\n                    let iFilho = index\r\n                  \"\r\n                >\r\n                  <a\r\n                    *ngIf=\"expandMenu()\"\r\n                    (click)=\"callRoute(filho.link)\"\r\n                    pRipple\r\n                    class=\"{{\r\n                      filho.bgColor\r\n                    }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n                  >\r\n                    <i\r\n                      class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                        expandMenu() ? 'ml-1 mr-2' : ''\r\n                      }} icon-hover-color\"\r\n                      *ngIf=\"filho.icone\"\r\n                    >\r\n                      {{ filho.icone }}\r\n                    </i>\r\n                    <span\r\n                      class=\"content-option-menu text-base text-blue-900 ml-4 {{\r\n                        filho.textColor\r\n                      }}\"\r\n                      *ngIf=\"expandMenu()\"\r\n                      >{{ filho.descricaomenu }}</span\r\n                    >\r\n                  </a>\r\n                </li>\r\n              </div>\r\n            </div>\r\n          </li>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </p-sidebar>\r\n  }\r\n\r\n  <!-- Topbar -->\r\n  <div\r\n    class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n    id=\"page-content\"\r\n    style=\"width: 100vw !important\"\r\n  >\r\n    <div\r\n      class=\"flex flex-row flex-wrap align-items-center justify-content-between m-3\"\r\n    >\r\n      @if(!showMenu) {\r\n      <!-- Logo home -->\r\n      <div>\r\n        <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n      </div>\r\n      } @else {\r\n      <!-- Breadcrumbs -->\r\n      <div>\r\n        <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n          {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n        </p>\r\n        <p-breadcrumb\r\n          *ngIf=\"widthCard > 400\"\r\n          styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n          [model]=\"breadCrumbItems\"\r\n          [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n          (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n        ></p-breadcrumb>\r\n      </div>\r\n      } \r\n      \r\n      @if(widthCard > 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-40rem\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n\r\n      <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n      <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n        @for (topAction of topMenuActions(); track $index) {\r\n        <ng-container *ngTemplateOutlet=\"topAction\" />\r\n        }\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonApps\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-th-large\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          (click)=\"sistemasPanel.toggle($event)\"\r\n          [pTooltip]=\"'Sistemas'\"\r\n          [tooltipPosition]=\"'left'\"\r\n        ></p-button>\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonUser\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-user\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"meusDadosPanel.toggle($event)\"\r\n        ></p-button>\r\n      </div>\r\n\r\n      @if(widthCard < 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-full\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n    </div>\r\n\r\n    <!-- Container -->\r\n    <p-card\r\n      styleClass=\"m-3 overflow-y-auto {{\r\n        !showMenu && 'sm:overflow-y-hidden'\r\n      }} card-container\"\r\n      [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n    >\r\n      <div class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </p-card>\r\n  </div>\r\n\r\n  <!-- Painel de aplicativos -->\r\n  <p-overlayPanel\r\n    #sistemasPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">Sistemas</p>\r\n\r\n      <div\r\n        class=\"flex flex-row flex-wrap gap-3 align-items-center justify-content-center mt-5 mb-3\"\r\n        style=\"width: 270px; height: 100%\"\r\n      >\r\n        @for (aplicativo of apps; track $index) { @if(aplicativo.urlicone ==\r\n        \"https://work-assets.keevo.com.br/img/icone-keevocenter.png\") {\r\n        <div\r\n          class=\"btn-sistema text-xl md:text-3xl flex align-items-center justify-content-center\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n        >\r\n          {{ aplicativo.descricaoaplicativo.charAt(0).toLocaleUpperCase() }}\r\n        </div>\r\n        } @else {\r\n        <img\r\n          [src]=\"aplicativo.urlicone\"\r\n          class=\"btn-sistema flex align-items-center justify-content-center\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        />\r\n        } }\r\n\r\n        <!-- <button\r\n          *ngFor=\"let aplicativo of apps\"\r\n          pButton\r\n          pRipple\r\n          class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        >\r\n          {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n        </button> -->\r\n      </div>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n\r\n  <!-- Painel do usu\u00E1rio -->\r\n  <p-overlayPanel\r\n    #meusDadosPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">\r\n        Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n      </p>\r\n      <div class=\"mt-5 mb-3\"></div>\r\n\r\n      <p-button\r\n        icon=\"pi pi-lock\"\r\n        label=\"Acessar Keepass\"\r\n        (onClick)=\"accessKeePass($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n\r\n      <p-button\r\n        icon=\"pi pi-sign-out\"\r\n        label=\"Sair\"\r\n        (onClick)=\"logout($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 17%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color,.menu-option:hover .content-option-menu{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}.btn-sistema{display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;cursor:pointer;width:4rem;height:4rem;background-color:#002542;color:#fff;padding:.5rem;box-shadow:#00000059 0 0 4px;border-radius:.75rem;transition:box-shadow .3s ease-in-out}.btn-sistema:hover{opacity:.9;box-shadow:#0009 0 0 8px}\n"] }]
+            args: [{ selector: 'kv-layout', template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n  @if (showMenu) {\r\n  <div [style]=\"{ minWidth: expandMenu() ? '300px' : '60px' }\"></div>\r\n  } @if(showMenu) {\r\n  <p-sidebar\r\n    #sidebarRef\r\n    [visible]=\"true\"\r\n    [showCloseIcon]=\"false\"\r\n    [modal]=\"false\"\r\n    [style]=\"{ width: expandMenu() ? '300px' : '60px' }\"\r\n    class=\"sidebar-animation\"\r\n  >\r\n    <ng-template pTemplate=\"headless\">\r\n      <div class=\"flex flex-column overflow-hidden\">\r\n        <div\r\n          class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n        >\r\n          <div\r\n            class=\"flex {{\r\n              expandMenu() ? 'flex-row' : 'flex-column'\r\n            }} align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }} py-3\"\r\n          >\r\n            <!-- Logo para o menu expandido -->\r\n            <img\r\n              *ngIf=\"expandMenu() && logoMenuExpand\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuExpand\"\r\n              height=\"50\"\r\n              width=\"auto\"\r\n              class=\"cursor-pointer p-1\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Logo para o menu minimizado-->\r\n            <img\r\n              *ngIf=\"!expandMenu() && logoMenuHide\"\r\n              alt=\"Card\"\r\n              [src]=\"logoMenuHide\"\r\n              height=\"50\"\r\n              width=\"auto\"\r\n              class=\"mb-2 p-1\"\r\n              (click)=\"navigateToDefaultRoute()\"\r\n            />\r\n\r\n            <!-- Toggle menu -->\r\n            <button\r\n              *ngIf=\"showExpandMenu\"\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"toggleMenu()\"\r\n              [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> menu </i>\r\n            </button>\r\n          </div>\r\n\r\n          @if(showTrocaEmpresa){\r\n          <div\r\n            class=\"flex flex-row align-items-center {{\r\n              expandMenu()\r\n                ? 'justify-content-between'\r\n                : 'justify-content-center'\r\n            }}\"\r\n          >\r\n            <div\r\n              class=\"flex flex-column cursor-pointer\"\r\n              *ngIf=\"expandMenu() && selectedEmpresa\"\r\n              (click)=\"changeEmpresa($event)\"\r\n            >\r\n              <span\r\n                class=\"text-sm font-semibold mr-2\"\r\n                [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n                [tooltipPosition]=\"'right'\"\r\n              >\r\n                {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n              </span>\r\n              <span class=\"text-sm mt-1\">{{\r\n                this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n              }}</span>\r\n            </div>\r\n\r\n            <button\r\n              pButton\r\n              class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n              (click)=\"changeEmpresa($event)\"\r\n              [pTooltip]=\"'Trocar de empresa'\"\r\n              [tooltipPosition]=\"'right'\"\r\n            >\r\n              <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n            </button>\r\n          </div>\r\n          <p-divider type=\"solid\"></p-divider>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n          <!-- menus -->\r\n          <li\r\n            *ngFor=\"let menu of menus; let i = index\"\r\n            [class]=\"expandMenu() ? 'px-2' : 'px-1'\"\r\n          >\r\n            <!-- menu que n\u00E3o tem filho -->\r\n            <a\r\n              (click)=\"callRoute(menu.link)\"\r\n              *ngIf=\"\r\n                !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n              \"\r\n              pRipple\r\n              [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n              [tooltipPosition]=\"'right'\"\r\n              class=\"{{\r\n                menu.bgColor\r\n              }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n              [class.justify-content-center]=\"!expandMenu()\"\r\n            >\r\n              <i\r\n                class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                  expandMenu() ? 'ml-1 mr-2' : ''\r\n                }}  icon-hover-color {{ menu.textColor }}\"\r\n                *ngIf=\"menu.icone\"\r\n              >\r\n                {{ menu.icone }}\r\n              </i>\r\n              <span\r\n                class=\"content-option-menu text-base text-blue-900 font-medium {{\r\n                  menu.textColor\r\n                }}\"\r\n                *ngIf=\"expandMenu()\"\r\n                >{{ menu.descricaomenu }}</span\r\n              >\r\n            </a>\r\n            <!-- menu com filho -->\r\n            <div *ngIf=\"menu.indmenupai\">\r\n              <a\r\n                pRipple\r\n                pStyleClass=\"@next\"\r\n                enterClass=\"hidden\"\r\n                enterActiveClass=\"slidedown\"\r\n                leaveToClass=\"hidden\"\r\n                leaveActiveClass=\"slideup\"\r\n                [class.bg-green-600]=\"isSelectedMenuPai(menu)\"\r\n                class=\"menu-option flex align-items-center {{\r\n                  !expandMenu()\r\n                    ? 'justify-content-center'\r\n                    : 'justify-content-between'\r\n                }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n                [tooltipPosition]=\"'right'\"\r\n                [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n                (click)=\"\r\n                  expandMenu.set(!expandMenu() ? !expandMenu() : expandMenu())\r\n                \"\r\n              >\r\n                <div class=\"flex flex-row align-items-center\">\r\n                  <i\r\n                    class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                      expandMenu() ? 'ml-1 mr-2' : ''\r\n                    }} icon-hover-color\"\r\n                    *ngIf=\"menu.icone\"\r\n                    [class.text-white]=\"isSelectedMenuPai(menu)\"\r\n                  >\r\n                    {{ menu.icone }}\r\n                  </i>\r\n                  <span\r\n                    class=\"text-base text-blue-900 font-medium content-option-menu\"\r\n                    *ngIf=\"expandMenu()\"\r\n                    >{{ menu.descricaomenu }}</span\r\n                  >\r\n                </div>\r\n                <i\r\n                  class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color content-option-menu\"\r\n                  *ngIf=\"expandMenu()\"\r\n                ></i>\r\n              </a>\r\n\r\n              <!-- filhos -->\r\n              <div\r\n                class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n                  !(\r\n                    menuSelecionado()?.idmenupai == menu.idmenu &&\r\n                    this.expandMenu()\r\n                  ) && 'hidden'\r\n                }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n              >\r\n                <li\r\n                  *ngFor=\"\r\n                    let filho of returnMenuChild(menu.idmenu);\r\n                    let iFilho = index\r\n                  \"\r\n                >\r\n                  <a\r\n                    *ngIf=\"expandMenu()\"\r\n                    (click)=\"callRoute(filho.link)\"\r\n                    pRipple\r\n                    class=\"{{\r\n                      filho.bgColor\r\n                    }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n                  >\r\n                    <i\r\n                      class=\"content-option-menu material-symbols-outlined icon-menu {{\r\n                        expandMenu() ? 'ml-1 mr-2' : ''\r\n                      }} icon-hover-color\"\r\n                      *ngIf=\"filho.icone\"\r\n                    >\r\n                      {{ filho.icone }}\r\n                    </i>\r\n                    <span\r\n                      class=\"content-option-menu text-base text-blue-900 ml-4 {{\r\n                        filho.textColor\r\n                      }}\"\r\n                      *ngIf=\"expandMenu()\"\r\n                      >{{ filho.descricaomenu }}</span\r\n                    >\r\n                  </a>\r\n                </li>\r\n              </div>\r\n            </div>\r\n          </li>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n  </p-sidebar>\r\n  }\r\n\r\n  <!-- Topbar -->\r\n  <div\r\n    class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n    id=\"page-content\"\r\n    style=\"width: 100vw !important\"\r\n  >\r\n    <div\r\n      class=\"flex flex-row flex-wrap align-items-center justify-content-between m-3\"\r\n    >\r\n      @if(!showMenu) {\r\n      <!-- Logo home -->\r\n      <div>\r\n        <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n      </div>\r\n      } @else {\r\n      <!-- Breadcrumbs -->\r\n      <div>\r\n        <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n          {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n        </p>\r\n        <p-breadcrumb\r\n          *ngIf=\"widthCard > 400\"\r\n          styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n          [model]=\"breadCrumbItems\"\r\n          [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n          (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n        ></p-breadcrumb>\r\n      </div>\r\n      } \r\n      \r\n      @if(widthCard > 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-40rem\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n\r\n      <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n      <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n        @for (topAction of topMenuActions(); track $index) {\r\n        <ng-container *ngTemplateOutlet=\"topAction\" />\r\n        }\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonApps\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-th-large\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          (click)=\"sistemasPanel.toggle($event)\"\r\n          [pTooltip]=\"'Sistemas'\"\r\n          [tooltipPosition]=\"'left'\"\r\n        ></p-button>\r\n\r\n        <p-button\r\n          *ngIf=\"showButtonUser\"\r\n          styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n          icon=\"pi pi-user\"\r\n          [rounded]=\"true\"\r\n          [text]=\"true\"\r\n          [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"meusDadosPanel.toggle($event)\"\r\n        ></p-button>\r\n      </div>\r\n\r\n      @if(widthCard < 992){\r\n      <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n      <dropdown-master\r\n        *ngIf=\"showLicencas()\"\r\n        class=\"w-full\"\r\n        formControlName=\"idmaster\"\r\n        [formGroup]=\"formGroup\"\r\n        [masters]=\"masters\"\r\n        (onSelectionChange)=\"changeLicense($event)\"\r\n        (onSelectionValue)=\"changeLicense($event)\"\r\n      >\r\n      </dropdown-master>\r\n      }\r\n    </div>\r\n\r\n    <!-- Container -->\r\n    <p-card\r\n      styleClass=\"m-3 overflow-y-auto {{\r\n        !showMenu && 'sm:overflow-y-hidden'\r\n      }} card-container\"\r\n      [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n    >\r\n      <div class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </p-card>\r\n  </div>\r\n\r\n  <!-- Painel de aplicativos -->\r\n  <p-overlayPanel\r\n    #sistemasPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">Sistemas</p>\r\n\r\n      <div\r\n        class=\"flex flex-row flex-wrap gap-3 align-items-center justify-content-center mt-5 mb-3\"\r\n        style=\"width: 270px; height: 100%\"\r\n      >\r\n        @for (aplicativo of apps; track $index) { @if(aplicativo.urlicone ==\r\n        \"https://work-assets.keevo.com.br/img/icone-keevocenter.png\") {\r\n        <div\r\n          class=\"btn-sistema text-xl md:text-3xl flex align-items-center justify-content-center\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n        >\r\n          {{ aplicativo.descricaoaplicativo.charAt(0).toLocaleUpperCase() }}\r\n        </div>\r\n        } @else {\r\n        <img\r\n          [src]=\"aplicativo.urlicone\"\r\n          class=\"btn-sistema flex align-items-center justify-content-center\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        />\r\n        } }\r\n\r\n        <!-- <button\r\n          *ngFor=\"let aplicativo of apps\"\r\n          pButton\r\n          pRipple\r\n          class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n          [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n          [tooltipPosition]=\"'left'\"\r\n          (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n        >\r\n          {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n        </button> -->\r\n      </div>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n\r\n  <!-- Painel do usu\u00E1rio -->\r\n  <p-overlayPanel\r\n    #meusDadosPanel\r\n    [showTransitionOptions]=\"'350ms ease-out'\"\r\n    [hideTransitionOptions]=\"'250ms ease-in'\"\r\n  >\r\n    <ng-template pTemplate=\"container\">\r\n      <p class=\"title-style mt-3\">\r\n        Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n      </p>\r\n      <div class=\"mt-5 mb-3\"></div>\r\n\r\n      <p-button\r\n        icon=\"pi pi-lock\"\r\n        label=\"Acessar Keepass\"\r\n        (onClick)=\"accessKeePass($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n\r\n      <p-button\r\n        icon=\"pi pi-sign-out\"\r\n        label=\"Sair\"\r\n        (onClick)=\"logout($event)\"\r\n        styleClass=\"border-noround w-full text-blue-900\"\r\n        [text]=\"true\"\r\n      >\r\n      </p-button>\r\n    </ng-template>\r\n  </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 17%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color,.menu-option:hover .content-option-menu{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}.btn-sistema{display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;cursor:pointer;width:4rem;height:4rem;background-color:#002542;color:#fff;padding:.5rem;box-shadow:#00000059 0 0 4px;border-radius:.75rem;transition:box-shadow .3s ease-in-out}.btn-sistema:hover{opacity:.9;box-shadow:#0009 0 0 8px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2$1.FormBuilder }, { type: i3$1.Router }, { type: i3$1.ActivatedRoute }], propDecorators: { apps: [{
                 type: Input
             }], breadCrumbItems: [{
@@ -5589,112 +6088,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
                 }]
         }] });
 
-class KvModalComponent {
-    constructor(dynamicDialogRef) {
-        this.dynamicDialogRef = dynamicDialogRef;
-        /**
-         * Ações do Dialog
-         */
-        this.actions = [];
-        this.actionsPosition = 'right';
-        this.justify_content = 'justify-content-start';
-    }
-    ngOnInit() {
-        this.addSubTitle();
-        this.setMarginBottom();
-        this.defPositionButtons();
-    }
-    onWindowResize() {
-        this.setMarginBottom();
-    }
-    /**
-     * Adiciona sub-título à tela
-     */
-    addSubTitle() {
-        if (this.subtitle) {
-            const headerElement = document.querySelector('.p-dialog .p-dialog-header');
-            if (headerElement) {
-                const subtitleElement = document.createElement('span');
-                subtitleElement.textContent = this.subtitle;
-                subtitleElement.style.fontSize = '0.75rem';
-                subtitleElement.style.width = '100%';
-                subtitleElement.style.marginLeft = '2px';
-                headerElement.appendChild(subtitleElement);
-            }
-            if (this.subHeader) {
-                const headerElement = document.querySelector('.p-dialog .p-dialog-header');
-                const subHeader = this.subHeader.nativeElement;
-                if (headerElement && this.subHeader) {
-                    subHeader.style.width = '100%';
-                    subHeader.style.marginLeft = '2px';
-                    headerElement.appendChild(this.subHeader.nativeElement);
-                }
-            }
-        }
-    }
-    defPositionButtons() {
-        if (this.actionsPosition === 'right') {
-            this.justify_content = 'justify-content-end';
-        }
-        if (this.actionsPosition === 'center') {
-            this.justify_content = 'justify-content-center';
-        }
-        if (this.actionsPosition === 'left') {
-            this.justify_content = 'justify-content-start';
-        }
-    }
-    setMarginBottom() {
-        let actionsFieldHeight = document.getElementById('actions-field')?.offsetHeight;
-        let divBox = document.getElementById('content-modal');
-        if (divBox) {
-            if (actionsFieldHeight) {
-                divBox.style.marginBottom = `${actionsFieldHeight + 30}px`;
-            }
-            else {
-                divBox.style.marginBottom = `50px`;
-            }
-        }
-    }
-    clickExecute(action) {
-        if (action.command) {
-            action.command();
-            if (action.closeAfterClick != false)
-                this.dynamicDialogRef.close();
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalComponent, deps: [{ token: i1$3.DynamicDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvModalComponent, selector: "kv-modal", inputs: { actions: "actions", actionsPosition: "actionsPosition", subtitle: "subtitle", subHeader: "subHeader" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, ngImport: i0, template: "<!-- RENDERIZA\u00C7\u00C3O DO MODAL -->\r\n<div class=\"col-12 mb-4\" id=\"content-modal\">\r\n    <!-- COLOCAR UM COMPONENTE SUBHEADER AQUI -->\r\n\r\n    <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- RENDERIZA\u00C7\u00C3O DOS BOT\u00D5ES -->\r\n\r\n<div class=\"bg-white flex flex-row flex-wrap gap-2 p-2 modal-barra-acoes {{justify_content}}\" *ngIf=\"actions\" id=\"actions-field\">\r\n    <kv-button\r\n        *ngFor=\" let action of actions\"\r\n        [ngClass]=\"action.visible==false?'hidden':''\"\r\n        icon=\"{{action.icon}}\"\r\n        label=\"{{action.label}}\"\r\n        [disabled]=\"action.disabled || false\"\r\n        (onClick)=\"clickExecute(action)\"\r\n        [severity]=\"action.severity ||'primary'\"\r\n    />\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;left:0;right:0;background-color:#fff;padding:10px;z-index:999}#page-form-container{padding-bottom:40px}@media screen and (max-width: 991px){#page-form-container{padding-bottom:100px}}.modal-barra-acoes{position:fixed;bottom:0;left:0;right:0;z-index:999;margin-right:1.5rem}\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: "component", type: KvButtonComponent, selector: "kv-button", inputs: ["label", "icon", "loading", "disabled", "severity", "size", "fullWidth"], outputs: ["onClick"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'kv-modal', template: "<!-- RENDERIZA\u00C7\u00C3O DO MODAL -->\r\n<div class=\"col-12 mb-4\" id=\"content-modal\">\r\n    <!-- COLOCAR UM COMPONENTE SUBHEADER AQUI -->\r\n\r\n    <ng-content></ng-content>\r\n</div>\r\n\r\n<!-- RENDERIZA\u00C7\u00C3O DOS BOT\u00D5ES -->\r\n\r\n<div class=\"bg-white flex flex-row flex-wrap gap-2 p-2 modal-barra-acoes {{justify_content}}\" *ngIf=\"actions\" id=\"actions-field\">\r\n    <kv-button\r\n        *ngFor=\" let action of actions\"\r\n        [ngClass]=\"action.visible==false?'hidden':''\"\r\n        icon=\"{{action.icon}}\"\r\n        label=\"{{action.label}}\"\r\n        [disabled]=\"action.disabled || false\"\r\n        (onClick)=\"clickExecute(action)\"\r\n        [severity]=\"action.severity ||'primary'\"\r\n    />\r\n</div>\r\n", styles: ["*{padding-bottom:0rem;padding-top:0rem}.barra-acoes{position:fixed;bottom:0;left:0;right:0;background-color:#fff;padding:10px;z-index:999}#page-form-container{padding-bottom:40px}@media screen and (max-width: 991px){#page-form-container{padding-bottom:100px}}.modal-barra-acoes{position:fixed;bottom:0;left:0;right:0;z-index:999;margin-right:1.5rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.DynamicDialogRef }], propDecorators: { actions: [{
-                type: Input
-            }], actionsPosition: [{
-                type: Input
-            }], subtitle: [{
-                type: Input
-            }], subHeader: [{
-                type: Input
-            }], onWindowResize: [{
-                type: HostListener,
-                args: ['window:resize', ['$event']]
-            }] } });
-
-class KvModalModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, declarations: [KvModalComponent], imports: [CommonModule, PrimeNgModule, KvButtonModule], exports: [KvModalComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, imports: [CommonModule, PrimeNgModule, KvButtonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [KvModalComponent],
-                    imports: [CommonModule, PrimeNgModule, KvButtonModule],
-                    exports: [KvModalComponent],
-                }]
-        }] });
-
 class KvOrgchartComponent {
     constructor(renderer) {
         this.renderer = renderer;
@@ -5728,6 +6121,20 @@ class KvOrgchartComponent {
             .data(this.dataSource)
             .nodeWidth(() => this.config.cardWidht)
             .nodeHeight(() => this.config.cardHeight)
+            .compact(false)
+            .buttonContent(({ node, state }) => {
+            return `<div style="color:#FFFFFF; border-radius:100%;font-size:5px;margin:auto auto;background-color:#64748B;"> 
+            <span>
+            ${node.children && node.children.length > 0
+                ? `<i class="material-symbols-outlined">
+keyboard_arrow_up
+</i>`
+                : `<i class="material-symbols-outlined">
+keyboard_arrow_down
+</i>`}
+            </span>
+          </div>`;
+        })
             .nodeUpdate(function (d) {
         })
             .linkUpdate((node, index, nodes) => {
@@ -5755,21 +6162,18 @@ class KvOrgchartComponent {
         })
             .defaultFont('Roboto')
             .render();
+        this.chart.expandAll();
     }
     stringToTemplateLiteral(string) {
         const convertedTemplate = string.replace(/\{\{([^}]*)\}\}/g, '${$1}');
         return '`' + convertedTemplate + '`';
     }
-    compactSwap() {
-        this.compact = !this.compact;
-        this.chart.compact(this.compact).render();
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvOrgchartComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvOrgchartComponent, selector: "kv-orgchart", inputs: { dataSource: "dataSource", config: "config", template: "template", nodeTemplate: "nodeTemplate", generateTemplate: "generateTemplate", templateFuncion: "templateFuncion", corDeFundo: "corDeFundo" }, viewQueries: [{ propertyName: "chartContainer", first: true, predicate: ["chartContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #chartContainer id=\"chartContainer\" [ngClass]=\"{'backGround': true}\">\r\n\r\n\r\n  <div class=\"div-botoes w-full flex gap-1\" >\r\n\r\n\r\n    <span *ngIf=\"!mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Expandir menu\">menu</span>\r\n\r\n\r\n\r\n    <span *ngIf=\"mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Recolher menu\">menu_open</span>\r\n\r\n    <div *ngIf=\"mostraMenu\">\r\n      <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomIn()\" pTooltip=\"Zoom +\">zoom_in</span>\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomOut()\" pTooltip=\"Zoom -\">zoom_out</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.collapseAll()\" pTooltip=\"Expandir\">expand_less</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.expandAll()\" pTooltip=\"Recolher\">expand_more</span>\r\n\r\n\r\n    <!-- <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"compactSwap()\" pTooltip=\"Compactar\">cached</span> -->\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fit().render()\" pTooltip=\"Centralizar\">\r\n      filter_center_focus\r\n    </span>\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fullscreen('#chartContainer')\" pTooltip=\"Tela cheia\" >\r\n      fullscreen\r\n    </span>\r\n\r\n    </div>\r\n\r\n\r\n  </div>\r\n\r\n\r\n</div>\r\n\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: ["#chartContainer{height:100%;overflow:hidden}:host ::ng-deep #chartContainer svg.svg-chart-container{height:100%!important;position:relative;width:100%;top:-56px;z-index:0;background-color:#fff}.div-botoes{z-index:1;width:100%;position:relative}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvOrgchartComponent, selector: "kv-orgchart", inputs: { dataSource: "dataSource", config: "config", template: "template", nodeTemplate: "nodeTemplate", generateTemplate: "generateTemplate", templateFuncion: "templateFuncion", corDeFundo: "corDeFundo" }, viewQueries: [{ propertyName: "chartContainer", first: true, predicate: ["chartContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #chartContainer id=\"chartContainer\" [ngClass]=\"{'backGround': true}\">\r\n\r\n\r\n  <div class=\"div-botoes w-full flex gap-1\" >\r\n\r\n\r\n    <span *ngIf=\"!mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Expandir menu\">menu</span>\r\n\r\n\r\n\r\n    <span *ngIf=\"mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Recolher menu\">menu_open</span>\r\n\r\n    <div *ngIf=\"mostraMenu\">\r\n      <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomIn()\" pTooltip=\"Zoom +\">zoom_in</span>\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomOut()\" pTooltip=\"Zoom -\">zoom_out</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.collapseAll()\" pTooltip=\"Recolher\">expand_less</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.expandAll()\" pTooltip=\"Expandir\">expand_more</span>\r\n\r\n\r\n    <!-- <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"compactSwap()\" pTooltip=\"Compactar\">cached</span> -->\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fit().render()\" pTooltip=\"Centralizar\">\r\n      filter_center_focus\r\n    </span>\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fullscreen('#chartContainer')\" pTooltip=\"Tela cheia\" >\r\n      fullscreen\r\n    </span>\r\n\r\n    </div>\r\n\r\n\r\n  </div>\r\n\r\n\r\n</div>\r\n\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: ["#chartContainer{height:100%;overflow:hidden}:host ::ng-deep #chartContainer svg.svg-chart-container{height:100%!important;position:relative;width:100%;top:-56px;z-index:0;background-color:#fff}.div-botoes{z-index:1;width:100%;position:relative}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvOrgchartComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-orgchart', template: "<div #chartContainer id=\"chartContainer\" [ngClass]=\"{'backGround': true}\">\r\n\r\n\r\n  <div class=\"div-botoes w-full flex gap-1\" >\r\n\r\n\r\n    <span *ngIf=\"!mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Expandir menu\">menu</span>\r\n\r\n\r\n\r\n    <span *ngIf=\"mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Recolher menu\">menu_open</span>\r\n\r\n    <div *ngIf=\"mostraMenu\">\r\n      <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomIn()\" pTooltip=\"Zoom +\">zoom_in</span>\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomOut()\" pTooltip=\"Zoom -\">zoom_out</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.collapseAll()\" pTooltip=\"Expandir\">expand_less</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.expandAll()\" pTooltip=\"Recolher\">expand_more</span>\r\n\r\n\r\n    <!-- <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"compactSwap()\" pTooltip=\"Compactar\">cached</span> -->\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fit().render()\" pTooltip=\"Centralizar\">\r\n      filter_center_focus\r\n    </span>\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fullscreen('#chartContainer')\" pTooltip=\"Tela cheia\" >\r\n      fullscreen\r\n    </span>\r\n\r\n    </div>\r\n\r\n\r\n  </div>\r\n\r\n\r\n</div>\r\n\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: ["#chartContainer{height:100%;overflow:hidden}:host ::ng-deep #chartContainer svg.svg-chart-container{height:100%!important;position:relative;width:100%;top:-56px;z-index:0;background-color:#fff}.div-botoes{z-index:1;width:100%;position:relative}\n"] }]
+            args: [{ selector: 'kv-orgchart', template: "<div #chartContainer id=\"chartContainer\" [ngClass]=\"{'backGround': true}\">\r\n\r\n\r\n  <div class=\"div-botoes w-full flex gap-1\" >\r\n\r\n\r\n    <span *ngIf=\"!mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Expandir menu\">menu</span>\r\n\r\n\r\n\r\n    <span *ngIf=\"mostraMenu\" class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n    (click)=\"mostraMenu = !mostraMenu\" pTooltip=\"Recolher menu\">menu_open</span>\r\n\r\n    <div *ngIf=\"mostraMenu\">\r\n      <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomIn()\" pTooltip=\"Zoom +\">zoom_in</span>\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.zoomOut()\" pTooltip=\"Zoom -\">zoom_out</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.collapseAll()\" pTooltip=\"Recolher\">expand_less</span>\r\n\r\n    <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"chart.expandAll()\" pTooltip=\"Expandir\">expand_more</span>\r\n\r\n\r\n    <!-- <span class=\"surface-300 shadow-4 p-1 m-2 border-circle material-icons cursor-pointer\"\r\n      (click)=\"compactSwap()\" pTooltip=\"Compactar\">cached</span> -->\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fit().render()\" pTooltip=\"Centralizar\">\r\n      filter_center_focus\r\n    </span>\r\n\r\n    <span class=\"material-icons surface-300 shadow-4 p-1 m-2 border-circle cursor-pointer\"\r\n      (click)=\"chart.fullscreen('#chartContainer')\" pTooltip=\"Tela cheia\" >\r\n      fullscreen\r\n    </span>\r\n\r\n    </div>\r\n\r\n\r\n  </div>\r\n\r\n\r\n</div>\r\n\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: ["#chartContainer{height:100%;overflow:hidden}:host ::ng-deep #chartContainer svg.svg-chart-container{height:100%!important;position:relative;width:100%;top:-56px;z-index:0;background-color:#fff}.div-botoes{z-index:1;width:100%;position:relative}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { chartContainer: [{
                 type: ViewChild,
                 args: ['chartContainer']
@@ -6677,11 +7081,11 @@ class WokspaceLogoComponent {
     ngOnInit() {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WokspaceLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: WokspaceLogoComponent, selector: "kv-workspace-logo", inputs: { logoKeevoCenter: "logoKeevoCenter", nomeUsuario: "nomeUsuario", masterSelecionada: "masterSelecionada" }, ngImport: i0, template: "<div class=\"field col-12 flex justify-content-center mb-1\">\r\n  <img [src]=\"logoKeevoCenter\" style=\"width: 200px\" />\r\n</div>\r\n\r\n<div class=\"col-12 align-items-center z-5\">\r\n  <div class=\"col-9\">\r\n    Ol\u00E1, <b>{{ nomeUsuario }}.</b> Bem-vindo(a)!\r\n  </div>\r\n\r\n  @if(!masterSelecionada){\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual workspace voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n  @else {\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual empresa voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n</div>", styles: [""] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: WokspaceLogoComponent, selector: "kv-workspace-logo", inputs: { logoKeevoCenter: "logoKeevoCenter", nomeUsuario: "nomeUsuario", masterSelecionada: "masterSelecionada" }, ngImport: i0, template: "<div class=\"field col-12 flex justify-content-center mb-1\">\r\n  <img [src]=\"logoKeevoCenter\" style=\"width: auto; height: 4rem;\" />\r\n</div>\r\n\r\n<div class=\"col-12 align-items-center z-5\">\r\n  <div class=\"col-9\">\r\n    Ol\u00E1, <b>{{ nomeUsuario }}.</b> Bem-vindo(a)!\r\n  </div>\r\n\r\n  @if(!masterSelecionada){\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual workspace voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n  @else {\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual empresa voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n</div>", styles: [""] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: WokspaceLogoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-workspace-logo', template: "<div class=\"field col-12 flex justify-content-center mb-1\">\r\n  <img [src]=\"logoKeevoCenter\" style=\"width: 200px\" />\r\n</div>\r\n\r\n<div class=\"col-12 align-items-center z-5\">\r\n  <div class=\"col-9\">\r\n    Ol\u00E1, <b>{{ nomeUsuario }}.</b> Bem-vindo(a)!\r\n  </div>\r\n\r\n  @if(!masterSelecionada){\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual workspace voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n  @else {\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual empresa voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n</div>" }]
+            args: [{ selector: 'kv-workspace-logo', template: "<div class=\"field col-12 flex justify-content-center mb-1\">\r\n  <img [src]=\"logoKeevoCenter\" style=\"width: auto; height: 4rem;\" />\r\n</div>\r\n\r\n<div class=\"col-12 align-items-center z-5\">\r\n  <div class=\"col-9\">\r\n    Ol\u00E1, <b>{{ nomeUsuario }}.</b> Bem-vindo(a)!\r\n  </div>\r\n\r\n  @if(!masterSelecionada){\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual workspace voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n  @else {\r\n  <b class=\"field col-9 flex\">\r\n    Escolha qual empresa voc\u00EA deseja acessar:\r\n  </b>\r\n  }\r\n</div>" }]
         }], ctorParameters: () => [], propDecorators: { logoKeevoCenter: [{
                 type: Input
             }], nomeUsuario: [{
@@ -7128,12 +7532,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
         }] });
 
 class KvImageUploadComponent {
-    constructor(notificationService) {
+    constructor(notificationService, imageCutterService) {
         this.notificationService = notificationService;
+        this.imageCutterService = imageCutterService;
         this.file = null;
         this.fileSrc = null;
         this.widthComponent = '400px';
         this.heightComponent = 'auto';
+        this.cutImage = input(false);
+        this.cutWidth = input(0);
+        this.cutHeight = input(0);
+        this.cutCircle = input(false);
         this.maxHeightImage = '400px';
         this.fileEmit = new EventEmitter();
         this.deleteEmit = new EventEmitter();
@@ -7164,13 +7573,31 @@ class KvImageUploadComponent {
     }
     handleFile(file) {
         if (file.type.startsWith('image/')) {
-            this.file = file;
-            const reader = new FileReader();
-            reader.onload = (e) => {
-                this.fileSrc = reader.result;
-            };
-            reader.readAsDataURL(file);
-            this.fileEmit.emit(file);
+            if (this.cutImage() == true) {
+                this.file = file;
+                const reader = new FileReader();
+                reader.onload = async () => {
+                    try {
+                        const result = await this.imageCutterService.cut(reader.result?.toString() ?? '', this.cutWidth(), this.cutHeight(), this.cutCircle());
+                        this.fileSrc = result;
+                        this.fileEmit.emit(result);
+                    }
+                    catch (error) {
+                        this.deleteImage();
+                    }
+                };
+                reader.readAsDataURL(file);
+            }
+            else {
+                // ?! Comportamneto padrão --> Preservar <-- !!!
+                this.file = file;
+                const reader = new FileReader();
+                reader.onload = (e) => {
+                    this.fileSrc = reader.result;
+                };
+                reader.readAsDataURL(file);
+                this.fileEmit.emit(file);
+            }
         }
         else {
             this.notificationService.toastError('Apenas arquivos de imagem são permitidos.');
@@ -7187,15 +7614,18 @@ class KvImageUploadComponent {
     deleteImage() {
         this.file = null;
         this.fileSrc = null;
+        if (this.fileInput) {
+            this.fileInput.nativeElement.value = '';
+        }
         this.deleteEmit.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvImageUploadComponent, deps: [{ token: NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvImageUploadComponent, selector: "kv-image-upload", inputs: { fileSrc: "fileSrc", widthComponent: "widthComponent", heightComponent: "heightComponent", maxHeightImage: "maxHeightImage", description: "description" }, outputs: { fileEmit: "fileEmit", deleteEmit: "deleteEmit" }, ngImport: i0, template: "<div\r\n    (dragover)=\"onDragOver($event)\"\r\n    (dragleave)=\"onDragLeave($event)\"\r\n    (drop)=\"onDrop($event)\"\r\n    class=\"relative overflow-hidden border-dashed border-2 border-round-lg border-gray-400 flex justify-content-end\"\r\n    [style.width]=\"widthComponent\"\r\n    [style.height]=\"heightComponent\"\r\n>\r\n\r\n    <div\r\n        class=\"w-full flex align-items-center justify-content-center\"\r\n        style=\"cursor: pointer;\"\r\n        (click)=\"fileInput.click()\"\r\n    >\r\n        <input\r\n            type=\"file\"\r\n            (change)=\"onFileSelected($event)\"\r\n            #fileInput\r\n            hidden\r\n            accept=\"image/*\"\r\n        >\r\n        <div\r\n            *ngIf=\"!fileSrc\"\r\n            class=\"flex flex-column align-items-center justify-content-center\"\r\n        >\r\n            <span\r\n                class=\"material-symbols-outlined mt-2\"\r\n                style=\"font-size: 3rem;\"\r\n            >\r\n                cloud_upload\r\n            </span>\r\n\r\n            @if(description) {\r\n            <p class=\"font-semibold\">{{description}}</p>\r\n            } @else {\r\n            <p class=\"font-semibold\">Arraste e solte uma imagem aqui, ou</p>\r\n            <p class=\"font-semibold\">clique para selecion\u00E1-la</p>\r\n            }\r\n\r\n        </div>\r\n        <div *ngIf=\"fileSrc || file\">\r\n            <img\r\n                [src]=\"fileSrc\"\r\n                [alt]=\"file?.name\"\r\n                class=\"w-full\"\r\n                [style.maxHeight]=\"maxHeightImage\"\r\n            >\r\n        </div>\r\n    </div>\r\n\r\n    @if(fileSrc || file) {\r\n        <button\r\n            style=\"background-color: transparent;\"\r\n            pButton\r\n            (click)=\"deleteImage()\"\r\n            class=\"absolute transition-colors transition-duration-500 text-red-700 hover:text-red-500 w-2rem h-2rem\"\r\n            [text]=\"true\"\r\n            [icon]=\"'pi pi-trash'\"\r\n        >\r\n        </button>\r\n        }\r\n    \r\n\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvImageUploadComponent, deps: [{ token: NotificationService }, { token: ImageCutterService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvImageUploadComponent, selector: "kv-image-upload", inputs: { fileSrc: { classPropertyName: "fileSrc", publicName: "fileSrc", isSignal: false, isRequired: false, transformFunction: null }, widthComponent: { classPropertyName: "widthComponent", publicName: "widthComponent", isSignal: false, isRequired: false, transformFunction: null }, heightComponent: { classPropertyName: "heightComponent", publicName: "heightComponent", isSignal: false, isRequired: false, transformFunction: null }, cutImage: { classPropertyName: "cutImage", publicName: "cutImage", isSignal: true, isRequired: false, transformFunction: null }, cutWidth: { classPropertyName: "cutWidth", publicName: "cutWidth", isSignal: true, isRequired: false, transformFunction: null }, cutHeight: { classPropertyName: "cutHeight", publicName: "cutHeight", isSignal: true, isRequired: false, transformFunction: null }, cutCircle: { classPropertyName: "cutCircle", publicName: "cutCircle", isSignal: true, isRequired: false, transformFunction: null }, maxHeightImage: { classPropertyName: "maxHeightImage", publicName: "maxHeightImage", isSignal: false, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { fileEmit: "fileEmit", deleteEmit: "deleteEmit" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div\r\n    (dragover)=\"onDragOver($event)\"\r\n    (dragleave)=\"onDragLeave($event)\"\r\n    (drop)=\"onDrop($event)\"\r\n    class=\"relative overflow-hidden border-dashed border-2 border-round-lg border-gray-400 flex justify-content-end\"\r\n    [style.width]=\"widthComponent\"\r\n    [style.height]=\"heightComponent\"\r\n>\r\n\r\n    <div\r\n        class=\"w-full flex align-items-center justify-content-center\"\r\n        style=\"cursor: pointer;\"\r\n        (click)=\"fileInput.click()\"\r\n    >\r\n        <input\r\n            type=\"file\"\r\n            (change)=\"onFileSelected($event)\"\r\n            #fileInput\r\n            hidden\r\n            accept=\"image/*\"\r\n        >\r\n        <div\r\n            *ngIf=\"!fileSrc\"\r\n            class=\"flex flex-column align-items-center justify-content-center\"\r\n        >\r\n            <span\r\n                class=\"material-symbols-outlined mt-2\"\r\n                style=\"font-size: 3rem;\"\r\n            >\r\n                cloud_upload\r\n            </span>\r\n\r\n            @if(description) {\r\n            <p class=\"font-semibold\">{{description}}</p>\r\n            } @else {\r\n            <p class=\"font-semibold\">Arraste e solte uma imagem aqui, ou</p>\r\n            <p class=\"font-semibold\">clique para selecion\u00E1-la</p>\r\n            }\r\n\r\n        </div>\r\n        <div *ngIf=\"fileSrc || file\">\r\n            <img\r\n                [src]=\"fileSrc\"\r\n                [alt]=\"file?.name\"\r\n                class=\"w-full\"\r\n                [style.maxHeight]=\"maxHeightImage\"\r\n            >\r\n        </div>\r\n    </div>\r\n\r\n    @if(fileSrc || file) {\r\n        <button\r\n            style=\"background-color: transparent;\"\r\n            pButton\r\n            (click)=\"deleteImage()\"\r\n            class=\"absolute transition-colors transition-duration-500 text-red-700 hover:text-red-500 w-2rem h-2rem\"\r\n            [text]=\"true\"\r\n            [icon]=\"'pi pi-trash'\"\r\n        >\r\n        </button>\r\n        }\r\n\r\n\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvImageUploadComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kv-image-upload', template: "<div\r\n    (dragover)=\"onDragOver($event)\"\r\n    (dragleave)=\"onDragLeave($event)\"\r\n    (drop)=\"onDrop($event)\"\r\n    class=\"relative overflow-hidden border-dashed border-2 border-round-lg border-gray-400 flex justify-content-end\"\r\n    [style.width]=\"widthComponent\"\r\n    [style.height]=\"heightComponent\"\r\n>\r\n\r\n    <div\r\n        class=\"w-full flex align-items-center justify-content-center\"\r\n        style=\"cursor: pointer;\"\r\n        (click)=\"fileInput.click()\"\r\n    >\r\n        <input\r\n            type=\"file\"\r\n            (change)=\"onFileSelected($event)\"\r\n            #fileInput\r\n            hidden\r\n            accept=\"image/*\"\r\n        >\r\n        <div\r\n            *ngIf=\"!fileSrc\"\r\n            class=\"flex flex-column align-items-center justify-content-center\"\r\n        >\r\n            <span\r\n                class=\"material-symbols-outlined mt-2\"\r\n                style=\"font-size: 3rem;\"\r\n            >\r\n                cloud_upload\r\n            </span>\r\n\r\n            @if(description) {\r\n            <p class=\"font-semibold\">{{description}}</p>\r\n            } @else {\r\n            <p class=\"font-semibold\">Arraste e solte uma imagem aqui, ou</p>\r\n            <p class=\"font-semibold\">clique para selecion\u00E1-la</p>\r\n            }\r\n\r\n        </div>\r\n        <div *ngIf=\"fileSrc || file\">\r\n            <img\r\n                [src]=\"fileSrc\"\r\n                [alt]=\"file?.name\"\r\n                class=\"w-full\"\r\n                [style.maxHeight]=\"maxHeightImage\"\r\n            >\r\n        </div>\r\n    </div>\r\n\r\n    @if(fileSrc || file) {\r\n        <button\r\n            style=\"background-color: transparent;\"\r\n            pButton\r\n            (click)=\"deleteImage()\"\r\n            class=\"absolute transition-colors transition-duration-500 text-red-700 hover:text-red-500 w-2rem h-2rem\"\r\n            [text]=\"true\"\r\n            [icon]=\"'pi pi-trash'\"\r\n        >\r\n        </button>\r\n        }\r\n    \r\n\r\n</div>" }]
-        }], ctorParameters: () => [{ type: NotificationService }], propDecorators: { fileSrc: [{
+            args: [{ selector: 'kv-image-upload', template: "<div\r\n    (dragover)=\"onDragOver($event)\"\r\n    (dragleave)=\"onDragLeave($event)\"\r\n    (drop)=\"onDrop($event)\"\r\n    class=\"relative overflow-hidden border-dashed border-2 border-round-lg border-gray-400 flex justify-content-end\"\r\n    [style.width]=\"widthComponent\"\r\n    [style.height]=\"heightComponent\"\r\n>\r\n\r\n    <div\r\n        class=\"w-full flex align-items-center justify-content-center\"\r\n        style=\"cursor: pointer;\"\r\n        (click)=\"fileInput.click()\"\r\n    >\r\n        <input\r\n            type=\"file\"\r\n            (change)=\"onFileSelected($event)\"\r\n            #fileInput\r\n            hidden\r\n            accept=\"image/*\"\r\n        >\r\n        <div\r\n            *ngIf=\"!fileSrc\"\r\n            class=\"flex flex-column align-items-center justify-content-center\"\r\n        >\r\n            <span\r\n                class=\"material-symbols-outlined mt-2\"\r\n                style=\"font-size: 3rem;\"\r\n            >\r\n                cloud_upload\r\n            </span>\r\n\r\n            @if(description) {\r\n            <p class=\"font-semibold\">{{description}}</p>\r\n            } @else {\r\n            <p class=\"font-semibold\">Arraste e solte uma imagem aqui, ou</p>\r\n            <p class=\"font-semibold\">clique para selecion\u00E1-la</p>\r\n            }\r\n\r\n        </div>\r\n        <div *ngIf=\"fileSrc || file\">\r\n            <img\r\n                [src]=\"fileSrc\"\r\n                [alt]=\"file?.name\"\r\n                class=\"w-full\"\r\n                [style.maxHeight]=\"maxHeightImage\"\r\n            >\r\n        </div>\r\n    </div>\r\n\r\n    @if(fileSrc || file) {\r\n        <button\r\n            style=\"background-color: transparent;\"\r\n            pButton\r\n            (click)=\"deleteImage()\"\r\n            class=\"absolute transition-colors transition-duration-500 text-red-700 hover:text-red-500 w-2rem h-2rem\"\r\n            [text]=\"true\"\r\n            [icon]=\"'pi pi-trash'\"\r\n        >\r\n        </button>\r\n        }\r\n\r\n\r\n</div>\r\n" }]
+        }], ctorParameters: () => [{ type: NotificationService }, { type: ImageCutterService }], propDecorators: { fileSrc: [{
                 type: Input
             }], widthComponent: [{
                 type: Input
@@ -7209,6 +7639,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
                 type: Output
             }], deleteEmit: [{
                 type: Output
+            }], fileInput: [{
+                type: ViewChild,
+                args: ['fileInput']
             }] } });
 
 class KvImageUploadModule {
@@ -7866,7 +8299,7 @@ class KvFilterFieldsetComponent {
         this.collapsedEvent.emit(this.isCollapsed);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFilterFieldsetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvFilterFieldsetComponent, selector: "kv-filter-fieldset", inputs: { isExpandable: "isExpandable" }, outputs: { collapsedEvent: "collapsedEvent" }, ngImport: i0, template: "<p-fieldset styleClass=\"p-0 mb-2\" >\r\n  <ng-template pTemplate=\"header\">\r\n    @if(isExpandable) {\r\n    <div\r\n      class=\"flex flex-row align-items-center justify-content-center p-1 cursor-pointer\"\r\n      (click)=\"toggleField()\"\r\n    >\r\n      <span\r\n        class=\"material-symbols-outlined flex align-items-center justify-content-center mr-2\"\r\n        style=\"font-size: 1.4rem\"\r\n      >\r\n        {{ isCollapsed ? \"remove\" : \"add\" }}\r\n      </span>\r\n\r\n      <span class=\"text-sm\"> Filtros Avan\u00E7ados </span>\r\n    </div>\r\n    }\r\n  </ng-template>\r\n\r\n  <ng-content></ng-content>\r\n</p-fieldset>\r\n", styles: ["::ng-deep .p-fieldset .p-fieldset-legend{padding:.3rem;margin-left:1rem}::ng-deep .p-fieldset .p-fieldset-legend{background-color:#fff;border:none}::ng-deep .p-fieldset .p-fieldset-legend:hover{background-color:#f5f5f5}::ng-deep .p-fieldset .p-fieldset-legend:active{background-color:#e0e0e0}::ng-deep .p-fieldset .p-fieldset-content{padding-top:0rem}\n"], dependencies: [{ kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2$4.Fieldset, selector: "p-fieldset", inputs: ["legend", "toggleable", "collapsed", "style", "styleClass", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvFilterFieldsetComponent, selector: "kv-filter-fieldset", inputs: { isExpandable: "isExpandable" }, outputs: { collapsedEvent: "collapsedEvent" }, ngImport: i0, template: "<p-fieldset styleClass=\"p-0 mb-2\" >\r\n  <ng-template pTemplate=\"header\">\r\n    @if(isExpandable) {\r\n    <div\r\n      class=\"flex flex-row align-items-center justify-content-center p-1 cursor-pointer\"\r\n      (click)=\"toggleField()\"\r\n    >\r\n      <span\r\n        class=\"material-symbols-outlined flex align-items-center justify-content-center mr-2\"\r\n        style=\"font-size: 1.4rem\"\r\n      >\r\n        {{ isCollapsed ? \"remove\" : \"add\" }}\r\n      </span>\r\n\r\n      <span class=\"text-sm\"> Filtros Avan\u00E7ados </span>\r\n    </div>\r\n    }\r\n  </ng-template>\r\n\r\n  <ng-content></ng-content>\r\n</p-fieldset>\r\n", styles: ["::ng-deep .p-fieldset .p-fieldset-legend{padding:.3rem;margin-left:1rem}::ng-deep .p-fieldset .p-fieldset-legend{background-color:#fff;border:none}::ng-deep .p-fieldset .p-fieldset-legend:hover{background-color:#f5f5f5}::ng-deep .p-fieldset .p-fieldset-legend:active{background-color:#e0e0e0}::ng-deep .p-fieldset .p-fieldset-content{padding-top:0rem}\n"], dependencies: [{ kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2$5.Fieldset, selector: "p-fieldset", inputs: ["legend", "toggleable", "collapsed", "style", "styleClass", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFilterFieldsetComponent, decorators: [{
             type: Component,
@@ -8554,5 +8987,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BaseApiService, BaseChartComponent, BaseComponent, BaseComponentButton, BaseComponentCrud, BaseComponentCrudForm, BaseComponentCrudList, BaseComponentDropDown, BaseComponentDropDownExternal, BaseComponentInput, BaseComponentMultiSelect, BasecomponentTable, BreadcrumbsService, CapitalizePipe, ChatService, ComponentProviders, ComponentService, CpfCnpjPipe, DocsService, DragDirective, DynamicInputDirective, FormService, ImagensService, KeevoComponentsModule, KeevoValidators, KvAvatarComponent, KvAvatarModule, KvButtonComponent, KvButtonModule, KvButtonPersonalizeComponent, KvButtonPopupComponent, KvButtonSecondaryComponent, KvButtonSuccessComponent, KvButtonsModule, KvCarouselComponent, KvCarouselModule, KvChartComponent, KvChartModule, KvCheckComponent, KvDropdownComponent, KvEditorComponent, KvErrorComponent, KvFileUploadComponent, KvFileUploadModule, KvFileViewerComponent, KvFileViewerModule, KvFilterCardComponent, KvFilterCardModule, KvFilterFieldsetComponent, KvFilterFieldsetModule, KvGIconComponent, KvGIconModule, KvHomeCardComponent, KvHomeCardModule, KvImageUploadComponent, KvImageUploadModule, KvInputCalendarComponent, KvInputMaskComponent, KvInputNumberComponent, KvInputPasswordComponent, KvInputTextCheckboxComponent, KvInputTextComponent, KvInputTextareaComponent, KvInputTimeComponent, KvInputsModule, KvLayoutComponent, KvLayoutModule, KvLoaderComponent, KvLoaderModule, KvLoaderService, KvLoginComponent, KvLoginModule, KvModalComponent, KvModalModule, KvMultiSelectComponent, KvOrgchartComponent, KvOrgchartModule, KvPageFormComponent, KvPageFormModule, KvPageStepperComponent, KvPageStepperodule, KvPickListComponent, KvPickListModule, KvProgressBarModule, KvRadioGroupComponent, KvReportComponent, KvReportModule, KvSelectButtonComponent, KvSelectButtonsComponent, KvStepperComponent, KvStepperModule, KvSwitchComponent, KvTableComponent, KvTableEditComponent, KvTableEditModule, KvTableExpandableComponent, KvTableExpandableModule, KvTableModule, KvTreeViewComponent, KvTreetableComponent, KvTreetableModule, KvWorkspaceModule, KvtreeViewModule, MaskPipe, NotificationService, ObjectService, PeriodosChart, PipesModule, PrimeNgModule, ProgressBarComponent, TablePaginate, TelefonePipe, TemplateDirective, TranslatePrimeng, WorkspaceComponent, getOrExecute, kvErrorModule, loading, mapToMenuItem };
+export { BaseApiService, BaseChartComponent, BaseComponent, BaseComponentButton, BaseComponentCrud, BaseComponentCrudForm, BaseComponentCrudList, BaseComponentDropDown, BaseComponentDropDownExternal, BaseComponentInput, BaseComponentMultiSelect, BasecomponentTable, BreadcrumbsService, CapitalizePipe, ChatService, ComponentProviders, ComponentService, CpfCnpjPipe, DocsService, DragDirective, DynamicInputDirective, FormService, ImageCutterService, ImagensService, KeevoComponentsModule, KeevoValidators, KvAvatarComponent, KvAvatarModule, KvButtonComponent, KvButtonModule, KvButtonPersonalizeComponent, KvButtonPopupComponent, KvButtonSecondaryComponent, KvButtonSuccessComponent, KvButtonsModule, KvCarouselComponent, KvCarouselModule, KvChartComponent, KvChartModule, KvCheckComponent, KvDropdownComponent, KvEditorComponent, KvErrorComponent, KvFileUploadComponent, KvFileUploadModule, KvFileViewerComponent, KvFileViewerModule, KvFilterCardComponent, KvFilterCardModule, KvFilterFieldsetComponent, KvFilterFieldsetModule, KvGIconComponent, KvGIconModule, KvHomeCardComponent, KvHomeCardModule, KvImageUploadComponent, KvImageUploadModule, KvInputCalendarComponent, KvInputMaskComponent, KvInputNumberComponent, KvInputPasswordComponent, KvInputTextCheckboxComponent, KvInputTextComponent, KvInputTextareaComponent, KvInputTimeComponent, KvInputsModule, KvLayoutComponent, KvLayoutModule, KvLoaderComponent, KvLoaderModule, KvLoaderService, KvLoginComponent, KvLoginModule, KvModalComponent, KvModalModule, KvMultiSelectComponent, KvOrgchartComponent, KvOrgchartModule, KvPageFormComponent, KvPageFormModule, KvPageStepperComponent, KvPageStepperodule, KvPickListComponent, KvPickListModule, KvProgressBarModule, KvRadioGroupComponent, KvReportComponent, KvReportModule, KvSelectButtonComponent, KvSelectButtonsComponent, KvStepperComponent, KvStepperModule, KvSwitchComponent, KvTableComponent, KvTableEditComponent, KvTableEditModule, KvTableExpandableComponent, KvTableExpandableModule, KvTableModule, KvTreeViewComponent, KvTreetableComponent, KvTreetableModule, KvWorkspaceModule, KvtreeViewModule, MaskPipe, NotificationService, ObjectService, PeriodosChart, PipesModule, PrimeNgModule, ProgressBarComponent, TablePaginate, TelefonePipe, TemplateDirective, TranslatePrimeng, WorkspaceComponent, getOrExecute, kvErrorModule, loading, mapToMenuItem };
 //# sourceMappingURL=keevo-components.mjs.map