keevo-components 1.8.278 → 1.8.279

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/esm2022/lib/components/kv-avatar/kv-avatar.component.mjs +25 -21
  2. package/fesm2022/keevo-components.mjs +576 -571
  3. package/fesm2022/keevo-components.mjs.map +1 -1
  4. package/lib/components/kv-avatar/kv-avatar.component.d.ts +0 -1
  5. package/package.json +1 -1
package/fesm2022/keevo-components.mjs CHANGED
@@ -86,7 +86,7 @@ import { PasswordModule } from 'primeng/password';
86
86
  import * as i3$2 from 'primeng/picklist';
87
87
  import { PickListModule } from 'primeng/picklist';
88
88
  import { ProgressBarModule } from 'primeng/progressbar';
89
- import * as i6$2 from 'primeng/radiobutton';
89
+ import * as i6$1 from 'primeng/radiobutton';
90
90
  import { RadioButtonModule } from 'primeng/radiobutton';
91
91
  import { RatingModule } from 'primeng/rating';
92
92
  import * as i12 from 'primeng/sidebar';
@@ -102,7 +102,7 @@ import { TagModule } from 'primeng/tag';
102
102
  import * as i15 from 'primeng/toast';
103
103
  import { ToastModule } from 'primeng/toast';
104
104
  import { ToolbarModule } from 'primeng/toolbar';
105
- import * as i1$7 from 'primeng/tree';
105
+ import * as i1$6 from 'primeng/tree';
106
106
  import { TreeModule } from 'primeng/tree';
107
107
  import * as i2$3 from 'primeng/selectbutton';
108
108
  import { SelectButtonModule } from 'primeng/selectbutton';
@@ -110,19 +110,19 @@ import * as i5$8 from 'primeng/stepper';
110
110
  import { StepperModule } from 'primeng/stepper';
111
111
  import { InputGroupModule } from 'primeng/inputgroup';
112
112
  import { InputGroupAddonModule } from 'primeng/inputgroupaddon';
113
- import * as i6$1 from 'primeng/slider';
113
+ import * as i6$2 from 'primeng/slider';
114
114
  import { SliderModule } from 'primeng/slider';
115
- import * as i1$5 from 'projects/keevo-components/src/public-api';
116
- import { BaseComponentCrud as BaseComponentCrud$1, KvModalModule as KvModalModule$1, PrimeNgModule as PrimeNgModule$1 } from 'projects/keevo-components/src/public-api';
117
115
  import Quill from 'quill';
118
- import * as i1$6 from 'ngx-loading';
116
+ import * as i1$5 from 'ngx-loading';
119
117
  import { NgxLoadingModule } from 'ngx-loading';
120
118
  import { ProgressSpinnerModule } from 'primeng/progressspinner';
121
119
  import { OrgChart } from 'd3-org-chart';
122
120
  import * as d3 from 'd3';
123
121
  import { AutoCompleteModule } from 'primeng/autocomplete';
124
122
  import * as vkbeautify from 'vkbeautify';
125
- import * as i1$8 from '@angular/platform-browser';
123
+ import * as i1$7 from '@angular/platform-browser';
124
+ import * as i1$8 from 'projects/keevo-components/src/public-api';
125
+ import { BaseComponentCrud as BaseComponentCrud$1, KvModalModule as KvModalModule$1, PrimeNgModule as PrimeNgModule$1 } from 'projects/keevo-components/src/public-api';
126
126
 
127
127
  class BaseComponentButton {
128
128
  constructor() {
@@ -3741,6 +3741,160 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
3741
3741
  }]
3742
3742
  }] });
3743
3743
 
3744
+ // import { KvCropImageComponent } from './kv-crop-image/kv-crop-image.component';
3745
+ class KvAvatarComponent extends BaseComponentCrud {
3746
+ constructor(imageService, notificationService, dialogService) {
3747
+ super(dialogService, notificationService);
3748
+ this.imageService = imageService;
3749
+ this.notificationService = notificationService;
3750
+ this.dialogService = dialogService;
3751
+ this.borderColor = '#002542';
3752
+ this.btnsColor = '#002542';
3753
+ this.width = 135;
3754
+ this.height = 135;
3755
+ this.imageUrlChange = new EventEmitter();
3756
+ this.removerFotoEvent = new EventEmitter();
3757
+ this.onModalOpen = new EventEmitter();
3758
+ this.btnAlterarFoto = false;
3759
+ this.existeLogo = false;
3760
+ this.selectedImage = '';
3761
+ this.imageUrl = input(this.imageService.userDefaultImage());
3762
+ this.imageSource = signal(this.imageService.userDefaultImage());
3763
+ }
3764
+ ngOnInit() {
3765
+ this.imageSource.set(this.imageUrl());
3766
+ this.getImageSrc();
3767
+ }
3768
+ getImageSrc() {
3769
+ if (this.imageUrl && (this.imageUrl().startsWith('data:image') || this.imageUrl().startsWith('http') || this.imageUrl().startsWith('https'))) {
3770
+ this.existeLogo = true;
3771
+ }
3772
+ else if (this.imageUrl.length > 0) {
3773
+ this.existeLogo = true;
3774
+ this.imageSource.set('data:image/jpg;base64,' + this.imageUrl);
3775
+ }
3776
+ else {
3777
+ this.existeLogo = false;
3778
+ this.imageSource.set(this.imageService.userDefaultImage());
3779
+ }
3780
+ }
3781
+ openFile() {
3782
+ const inputElement = document.getElementById('fotoEscolhida');
3783
+ if (inputElement) {
3784
+ inputElement.click();
3785
+ }
3786
+ }
3787
+ selectFotoSelecionada(event) {
3788
+ const file = event.target.files[0];
3789
+ if (file) {
3790
+ const reader = new FileReader();
3791
+ reader.readAsDataURL(file);
3792
+ reader.onload = () => {
3793
+ this.selectedImage = reader.result;
3794
+ // this.abrirModalRecortarFoto();
3795
+ this.existeLogo = false;
3796
+ };
3797
+ }
3798
+ }
3799
+ questionRemoverFoto() {
3800
+ const msg = '<h3>Você tem certeza que deseja retirar a foto desse usuário?</h3>';
3801
+ this.notificationService.question({
3802
+ type: 'question',
3803
+ message: msg,
3804
+ accept: (data) => {
3805
+ this.removerFoto();
3806
+ },
3807
+ reject: (data) => {
3808
+ }
3809
+ });
3810
+ }
3811
+ removerFoto() {
3812
+ this.imageSource.set('');
3813
+ this.removerFotoEvent.emit();
3814
+ this.existeLogo = false;
3815
+ this.imageUrlChange.emit(this.imageSource());
3816
+ this.fileInput.nativeElement.value = '';
3817
+ }
3818
+ handleImageError(event) {
3819
+ event.target.src = this.imageService.userDefaultImage();
3820
+ }
3821
+ // abrirModalRecortarFoto() {
3822
+ // this.openDialog(
3823
+ // KvCropImageComponent,
3824
+ // () => {
3825
+ // this.imageUrl = this.receberDados();
3826
+ // this.imageSource.set(this.receberDados() as string)
3827
+ // this.imageUrlChange.emit(this.imageSource());
3828
+ // this.existeLogo = true;
3829
+ // },
3830
+ // {
3831
+ // maximizable: false,
3832
+ // popup: true,
3833
+ // width: '60%',
3834
+ // header: 'Recortar',
3835
+ // id:{imagemSelecionada: this.selectedImage, imagemCortada: ''}
3836
+ // }
3837
+ // )
3838
+ // const [firstKey] = this.dialogService.dialogComponentRefMap.entries().next().value;
3839
+ // const instance = this.dialogService.getInstance(firstKey);
3840
+ // instance.config.showHeader = false;
3841
+ // instance.config.contentStyle = { 'border-radius': '12px' };
3842
+ // }
3843
+ receberDados() {
3844
+ const [firstKey] = this.dialogService.dialogComponentRefMap.entries().next().value;
3845
+ const instance = this.dialogService.getInstance(firstKey);
3846
+ return instance.config.data.id.imagemCortada;
3847
+ }
3848
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, deps: [{ token: ImagensService }, { token: NotificationService }, { token: i1$3.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
3849
+ 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", onModalOpen: "onModalOpen" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"image-container\">\r\n <!-- <img [src]=\"getImageSrc() || imageService.userDefaultImage()\" alt=\"Foto\" class=\"container-foto\" [style.border-color]=\"borderColor\" [style.width.px]=\"width\" [style.height.px]=\"height\" (error)=\"handleImageError($event)\" (click)=\"openFile()\"> -->\r\n\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", 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}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
3850
+ }
3851
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, decorators: [{
3852
+ type: Component,
3853
+ args: [{ selector: 'kv-avatar', template: "<div class=\"image-container\">\r\n <!-- <img [src]=\"getImageSrc() || imageService.userDefaultImage()\" alt=\"Foto\" class=\"container-foto\" [style.border-color]=\"borderColor\" [style.width.px]=\"width\" [style.height.px]=\"height\" (error)=\"handleImageError($event)\" (click)=\"openFile()\"> -->\r\n\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", 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}\n"] }]
3854
+ }], ctorParameters: () => [{ type: ImagensService }, { type: NotificationService }, { type: i1$3.DialogService }], propDecorators: { borderColor: [{
3855
+ type: Input
3856
+ }], btnsColor: [{
3857
+ type: Input
3858
+ }], width: [{
3859
+ type: Input
3860
+ }], height: [{
3861
+ type: Input
3862
+ }], imageUrlChange: [{
3863
+ type: Output
3864
+ }], removerFotoEvent: [{
3865
+ type: Output
3866
+ }], onModalOpen: [{
3867
+ type: Output
3868
+ }], btnAlterarFoto: [{
3869
+ type: Input
3870
+ }], fileInput: [{
3871
+ type: ViewChild,
3872
+ args: ['fileInput']
3873
+ }] } });
3874
+
3875
+ class KvButtonModule {
3876
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
3877
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, declarations: [KvButtonComponent], imports: [CommonModule,
3878
+ PrimeNgModule], exports: [KvButtonComponent] }); }
3879
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, imports: [CommonModule,
3880
+ PrimeNgModule] }); }
3881
+ }
3882
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, decorators: [{
3883
+ type: NgModule,
3884
+ args: [{
3885
+ declarations: [
3886
+ KvButtonComponent
3887
+ ],
3888
+ imports: [
3889
+ CommonModule,
3890
+ PrimeNgModule
3891
+ ],
3892
+ exports: [
3893
+ KvButtonComponent
3894
+ ]
3895
+ }]
3896
+ }] });
3897
+
3744
3898
  class KvLabelModule {
3745
3899
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
3746
3900
  static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLabelModule, declarations: [KvLabelComponent], imports: [CommonModule], exports: [KvLabelComponent] }); }
@@ -3761,529 +3915,79 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
3761
3915
  }]
3762
3916
  }] });
3763
3917
 
3764
- class KvModalComponent {
3765
- constructor(dynamicDialogRef) {
3766
- this.dynamicDialogRef = dynamicDialogRef;
3767
- /**
3768
- * Ações do Dialog
3769
- */
3770
- this.actions = [];
3771
- this.actionsPosition = 'right';
3772
- this.justify_content = 'justify-content-start';
3918
+ class KvAvatarModule {
3919
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
3920
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, declarations: [KvAvatarComponent], imports: [CommonModule,
3921
+ ButtonModule,
3922
+ FileUploadModule,
3923
+ SliderModule,
3924
+ FormsModule,
3925
+ ReactiveFormsModule,
3926
+ KvButtonModule,
3927
+ KvLabelModule], exports: [KvAvatarComponent] }); }
3928
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, imports: [CommonModule,
3929
+ ButtonModule,
3930
+ FileUploadModule,
3931
+ SliderModule,
3932
+ FormsModule,
3933
+ ReactiveFormsModule,
3934
+ KvButtonModule,
3935
+ KvLabelModule] }); }
3936
+ }
3937
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, decorators: [{
3938
+ type: NgModule,
3939
+ args: [{
3940
+ declarations: [
3941
+ KvAvatarComponent,
3942
+ ],
3943
+ imports: [
3944
+ CommonModule,
3945
+ ButtonModule,
3946
+ FileUploadModule,
3947
+ SliderModule,
3948
+ FormsModule,
3949
+ ReactiveFormsModule,
3950
+ KvButtonModule,
3951
+ KvLabelModule,
3952
+ ],
3953
+ exports: [
3954
+ KvAvatarComponent
3955
+ ]
3956
+ }]
3957
+ }] });
3958
+
3959
+ class KvButtonPersonalizeComponent extends BaseComponentButton {
3960
+ constructor() {
3961
+ super();
3773
3962
  }
3774
3963
  ngOnInit() {
3775
- this.addSubTitle();
3776
- this.setMarginBottom();
3777
- this.defPositionButtons();
3964
+ this.colorHover = this.colorHover ? this.colorHover : this.color;
3965
+ this.backgroundColor = this.color;
3778
3966
  }
3779
- onWindowResize() {
3780
- this.setMarginBottom();
3967
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonPersonalizeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3968
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvButtonPersonalizeComponent, selector: "kv-button-personalize", inputs: { colorHover: "colorHover", textColor: "textColor" }, usesInheritance: true, ngImport: i0, template: "<button\r\n pButton\r\n pRipple\r\n [icon]=\"icon\"\r\n [label]=\"label\"\r\n [loading]=\"loading\"\r\n (click)=\"click($event)\"\r\n [disabled]=\"disabled\"\r\n class=\"btn-personalize\"\r\n [style.color]=\"textColor\"\r\n [style.backgroundColor]=\"backgroundColor\"\r\n [style.borderColor]=\"backgroundColor\"\r\n [text]=\"text\"\r\n></button>\r\n", styles: [".btn-personalize{height:35px}::ng-deep .p-button-label{font-weight:500!important}\n"], 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: i2.Ripple, selector: "[pRipple]" }] }); }
3969
+ }
3970
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonPersonalizeComponent, decorators: [{
3971
+ type: Component,
3972
+ args: [{ selector: 'kv-button-personalize', template: "<button\r\n pButton\r\n pRipple\r\n [icon]=\"icon\"\r\n [label]=\"label\"\r\n [loading]=\"loading\"\r\n (click)=\"click($event)\"\r\n [disabled]=\"disabled\"\r\n class=\"btn-personalize\"\r\n [style.color]=\"textColor\"\r\n [style.backgroundColor]=\"backgroundColor\"\r\n [style.borderColor]=\"backgroundColor\"\r\n [text]=\"text\"\r\n></button>\r\n", styles: [".btn-personalize{height:35px}::ng-deep .p-button-label{font-weight:500!important}\n"] }]
3973
+ }], ctorParameters: () => [], propDecorators: { colorHover: [{
3974
+ type: Input
3975
+ }], textColor: [{
3976
+ type: Input
3977
+ }] } });
3978
+
3979
+ class KvButtonPopupComponent extends BaseComponentButton {
3980
+ constructor() {
3981
+ super();
3982
+ this.items = [];
3983
+ this.classBtn = '';
3984
+ this.icon = 'pi pi-chevron-down';
3781
3985
  }
3782
- /**
3783
- * Adiciona sub-título à tela
3784
- */
3785
- addSubTitle() {
3786
- if (this.subtitle) {
3787
- const headerElement = document.querySelector('.p-dialog .p-dialog-header');
3788
- if (headerElement) {
3789
- const subtitleElement = document.createElement('span');
3790
- subtitleElement.textContent = this.subtitle;
3791
- subtitleElement.style.fontSize = '0.75rem';
3792
- subtitleElement.style.width = '100%';
3793
- subtitleElement.style.marginLeft = '2px';
3794
- headerElement.appendChild(subtitleElement);
3795
- }
3796
- if (this.subHeader) {
3797
- const headerElement = document.querySelector('.p-dialog .p-dialog-header');
3798
- const subHeader = this.subHeader.nativeElement;
3799
- if (headerElement && this.subHeader) {
3800
- subHeader.style.width = '100%';
3801
- subHeader.style.marginLeft = '2px';
3802
- headerElement.appendChild(this.subHeader.nativeElement);
3803
- }
3804
- }
3805
- }
3986
+ handleShow() {
3987
+ this.rotate();
3806
3988
  }
3807
- defPositionButtons() {
3808
- if (this.actionsPosition === 'right') {
3809
- this.justify_content = 'justify-content-end';
3810
- }
3811
- if (this.actionsPosition === 'center') {
3812
- this.justify_content = 'justify-content-center';
3813
- }
3814
- if (this.actionsPosition === 'left') {
3815
- this.justify_content = 'justify-content-start';
3816
- }
3817
- }
3818
- setMarginBottom() {
3819
- let actionsFieldHeight = document.getElementById('actions-field')?.offsetHeight;
3820
- let divBox = document.getElementById('content-modal');
3821
- if (divBox) {
3822
- if (actionsFieldHeight) {
3823
- divBox.style.marginBottom = `${actionsFieldHeight + 30}px`;
3824
- }
3825
- else {
3826
- divBox.style.marginBottom = `50px`;
3827
- }
3828
- }
3829
- }
3830
- clickExecute(action) {
3831
- if (action.command) {
3832
- action.command();
3833
- if (action.closeAfterClick != false)
3834
- this.dynamicDialogRef.close();
3835
- }
3836
- }
3837
- 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 }); }
3838
- 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"] }] }); }
3839
- }
3840
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalComponent, decorators: [{
3841
- type: Component,
3842
- 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"] }]
3843
- }], ctorParameters: () => [{ type: i1$3.DynamicDialogRef }], propDecorators: { actions: [{
3844
- type: Input
3845
- }], actionsPosition: [{
3846
- type: Input
3847
- }], subtitle: [{
3848
- type: Input
3849
- }], subHeader: [{
3850
- type: Input
3851
- }], onWindowResize: [{
3852
- type: HostListener,
3853
- args: ['window:resize', ['$event']]
3854
- }] } });
3855
-
3856
- class KvCropImageComponent extends BaseComponentCrud$1 {
3857
- onWindowResize() {
3858
- this.widthTela = window.innerWidth;
3859
- this.updateCanvasSize();
3860
- }
3861
- constructor(imageService, notificationService, dialogService, dynamicDialogRef, dynamicDialogConfig) {
3862
- super(dialogService, notificationService);
3863
- this.imageService = imageService;
3864
- this.notificationService = notificationService;
3865
- this.dialogService = dialogService;
3866
- this.dynamicDialogRef = dynamicDialogRef;
3867
- this.dynamicDialogConfig = dynamicDialogConfig;
3868
- this.imageLoaded = false;
3869
- this.imageX = 0;
3870
- this.imageY = 0;
3871
- this.startX = 0;
3872
- this.startY = 0;
3873
- this.valueZoom = 50;
3874
- this.scaleFactor = 1;
3875
- this.selectedImage = '';
3876
- this.actionsModal = [
3877
- {
3878
- label: 'Cancelar',
3879
- severity: 'tertiary',
3880
- icon: 'cancel',
3881
- command: (e) => {
3882
- this.dynamicDialogRef.close();
3883
- },
3884
- },
3885
- {
3886
- label: 'Recortar',
3887
- severity: 'primary',
3888
- icon: 'crop',
3889
- command: (e) => {
3890
- this.cropImage();
3891
- },
3892
- },
3893
- ];
3894
- this.widthTela = window.innerWidth;
3895
- this.selectedImage = this.dynamicDialogConfig.data.id.imagemSelecionada;
3896
- this.openCropModal();
3897
- }
3898
- openCropModal() {
3899
- setTimeout(() => {
3900
- const canvas = this.cropCanvas.nativeElement;
3901
- const ctx = canvas.getContext('2d');
3902
- const img = new Image();
3903
- img.src = this.selectedImage;
3904
- img.onload = () => {
3905
- this.imageLoaded = true;
3906
- this.imageX = (canvas.width - img.width * this.scaleFactor) / 2;
3907
- this.imageY = (canvas.height - img.height * this.scaleFactor) / 2;
3908
- canvas.width = this.retornaTamanhoCanvas();
3909
- canvas.height = 400;
3910
- this.redrawCanvas(ctx, img);
3911
- this.initializeImageMove(canvas, ctx, img);
3912
- this.initializeMouseWheel(canvas, ctx, img);
3913
- };
3914
- }, 0);
3915
- }
3916
- redrawCanvas(ctx, img) {
3917
- if (!ctx)
3918
- return;
3919
- ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
3920
- ctx.filter = 'blur(5px) opacity(0.9)';
3921
- ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactor, img.height * this.scaleFactor);
3922
- ctx.filter = 'none';
3923
- this.drawImageInCropArea(ctx, img);
3924
- this.drawCropArea(ctx);
3925
- }
3926
- initializeImageMove(canvas, ctx, img) {
3927
- let isDragging = false;
3928
- canvas.style.cursor = 'grab';
3929
- canvas.onmousedown = (e) => {
3930
- isDragging = true;
3931
- canvas.style.cursor = 'grabbing';
3932
- this.startX = e.offsetX - this.imageX;
3933
- this.startY = e.offsetY - this.imageY;
3934
- };
3935
- canvas.onmousemove = (e) => {
3936
- if (isDragging) {
3937
- this.imageX = e.offsetX - this.startX;
3938
- this.imageY = e.offsetY - this.startY;
3939
- this.redrawCanvas(ctx, img);
3940
- }
3941
- };
3942
- canvas.onmouseup = () => {
3943
- isDragging = false;
3944
- canvas.style.cursor = 'grab';
3945
- };
3946
- canvas.onmouseout = () => {
3947
- isDragging = false;
3948
- canvas.style.cursor = 'grab';
3949
- };
3950
- }
3951
- initializeMouseWheel(canvas, ctx, img) {
3952
- canvas.onwheel = (e) => {
3953
- e.preventDefault();
3954
- const delta = e.deltaY > 0 ? -0.1 : 0.1;
3955
- this.scaleFactor = Math.min(Math.max(this.scaleFactor + delta, 0.1), 5); // limita o fator de escala entre 0.1 e 5
3956
- this.redrawCanvas(ctx, img);
3957
- this.valueZoom = this.scaleFactor * 50;
3958
- };
3959
- }
3960
- drawImageInCropArea(ctx, img) {
3961
- if (!ctx)
3962
- return;
3963
- // Calcula a posição da área de corte
3964
- const cropX = (ctx.canvas.width - 225) / 2;
3965
- const cropY = (ctx.canvas.height - 225) / 2;
3966
- // Desenha a imagem de não desfocada dentro da área de corte
3967
- ctx.save();
3968
- ctx.beginPath();
3969
- ctx.arc(cropX + 112.5, cropY + 112.5, 112.5, 0, Math.PI * 2, true);
3970
- ctx.clip();
3971
- ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactor, img.height * this.scaleFactor);
3972
- ctx.restore();
3973
- }
3974
- drawCropArea(ctx) {
3975
- if (!ctx)
3976
- return;
3977
- ctx.beginPath();
3978
- const cropX = (ctx.canvas.width - 225) / 2;
3979
- const cropY = (ctx.canvas.height - 225) / 2;
3980
- ctx.arc(cropX + 112.5, cropY + 112.5, 112.5, 0, Math.PI * 2, true);
3981
- ctx.strokeStyle = 'transparent';
3982
- ctx.lineWidth = 2;
3983
- ctx.stroke();
3984
- }
3985
- updateCanvasSize() {
3986
- const canvas = this.cropCanvas.nativeElement;
3987
- const ctx = canvas.getContext('2d');
3988
- const img = new Image();
3989
- img.src = this.selectedImage;
3990
- img.onload = () => {
3991
- this.imageLoaded = true;
3992
- this.imageX = (canvas.width - img.width * this.scaleFactor) / 2;
3993
- this.imageY = (canvas.height - img.height * this.scaleFactor) / 2;
3994
- canvas.width = this.retornaTamanhoCanvas();
3995
- canvas.height = 400;
3996
- this.redrawCanvas(ctx, img);
3997
- };
3998
- }
3999
- onZoomChange(event) {
4000
- const canvas = this.cropCanvas.nativeElement;
4001
- const ctx = canvas.getContext('2d');
4002
- const img = new Image();
4003
- img.src = this.selectedImage;
4004
- img.onload = () => {
4005
- this.scaleFactor = event.value / 50;
4006
- this.redrawCanvas(ctx, img);
4007
- };
4008
- }
4009
- cropImage() {
4010
- const canvas = this.cropCanvas.nativeElement;
4011
- const ctx = canvas.getContext('2d');
4012
- if (ctx) {
4013
- const centerX = canvas.width / 2;
4014
- const centerY = canvas.height / 2;
4015
- const radius = 100;
4016
- const imageData = ctx.getImageData(centerX - radius, centerY - radius, radius * 2, radius * 2);
4017
- const newCanvas = document.createElement('canvas');
4018
- const newCtx = newCanvas.getContext('2d');
4019
- newCanvas.width = radius * 2;
4020
- newCanvas.height = radius * 2;
4021
- newCtx?.putImageData(imageData, 0, 0);
4022
- this.selectedImage = newCanvas.toDataURL();
4023
- this.enviarDados();
4024
- this.dynamicDialogRef.close(this.selectedImage);
4025
- }
4026
- }
4027
- enviarDados() {
4028
- const arr = this.dialogService.dialogComponentRefMap;
4029
- const entries = arr.entries();
4030
- const firstEntry = entries.next().value;
4031
- const [firstKey, firstValue] = firstEntry;
4032
- const instance = this.dialogService.getInstance(firstKey);
4033
- instance.config.data.id.imagemCortada = this.selectedImage;
4034
- }
4035
- retornaTamanhoCanvas() {
4036
- if (this.widthTela < 500) {
4037
- return this.widthTela * 0.7;
4038
- }
4039
- return this.widthTela * 0.4;
4040
- }
4041
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvCropImageComponent, deps: [{ token: i1$5.ImagensService }, { token: i1$5.NotificationService }, { token: i1$3.DialogService }, { token: i1$3.DynamicDialogRef }, { token: i1$3.DynamicDialogConfig }], target: i0.ɵɵFactoryTarget.Component }); }
4042
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvCropImageComponent, isStandalone: true, selector: "kv-crop-image", host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "cropCanvas", first: true, predicate: ["cropCanvas"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<kv-modal [actions]=\"actionsModal\">\r\n <div class=\"crop-container\">\r\n <canvas #cropCanvas class=\"crop-canvas\"></canvas>\r\n <div class=\"crop-border\"></div>\r\n </div>\r\n \r\n <div class=\"w-full zoom-container\">\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</kv-modal>\r\n", styles: [".crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px}.crop-border{position:absolute;width:225px;height:225px;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: KvModalModule$1 }, { kind: "component", type: KvModalComponent, selector: "kv-modal", inputs: ["actions", "actionsPosition", "subtitle", "subHeader"] }, { kind: "ngmodule", type: PrimeNgModule$1 }, { kind: "ngmodule", type: KvLabelModule }, { kind: "component", type: KvLabelComponent, selector: "kv-label", inputs: ["componentId", "label"] }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i6$1.Slider, selector: "p-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }] }); }
4043
- }
4044
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvCropImageComponent, decorators: [{
4045
- type: Component,
4046
- args: [{ selector: 'kv-crop-image', standalone: true, imports: [
4047
- CommonModule,
4048
- FormsModule,
4049
- KvModalModule$1,
4050
- PrimeNgModule$1,
4051
- KvLabelModule,
4052
- SliderModule
4053
- ], template: "<kv-modal [actions]=\"actionsModal\">\r\n <div class=\"crop-container\">\r\n <canvas #cropCanvas class=\"crop-canvas\"></canvas>\r\n <div class=\"crop-border\"></div>\r\n </div>\r\n \r\n <div class=\"w-full zoom-container\">\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</kv-modal>\r\n", styles: [".crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px}.crop-border{position:absolute;width:225px;height:225px;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}\n"] }]
4054
- }], ctorParameters: () => [{ type: i1$5.ImagensService }, { type: i1$5.NotificationService }, { type: i1$3.DialogService }, { type: i1$3.DynamicDialogRef }, { type: i1$3.DynamicDialogConfig }], propDecorators: { onWindowResize: [{
4055
- type: HostListener,
4056
- args: ['window:resize', ['$event']]
4057
- }], cropCanvas: [{
4058
- type: ViewChild,
4059
- args: ['cropCanvas']
4060
- }], fileInput: [{
4061
- type: ViewChild,
4062
- args: ['fileInput']
4063
- }] } });
4064
-
4065
- class KvAvatarComponent extends BaseComponentCrud {
4066
- constructor(imageService, notificationService, dialogService) {
4067
- super(dialogService, notificationService);
4068
- this.imageService = imageService;
4069
- this.notificationService = notificationService;
4070
- this.dialogService = dialogService;
4071
- this.borderColor = '#002542';
4072
- this.btnsColor = '#002542';
4073
- this.width = 135;
4074
- this.height = 135;
4075
- this.imageUrlChange = new EventEmitter();
4076
- this.removerFotoEvent = new EventEmitter();
4077
- this.onModalOpen = new EventEmitter();
4078
- this.btnAlterarFoto = false;
4079
- this.existeLogo = false;
4080
- this.selectedImage = '';
4081
- this.imageUrl = input(this.imageService.userDefaultImage());
4082
- this.imageSource = signal(this.imageService.userDefaultImage());
4083
- }
4084
- ngOnInit() {
4085
- this.imageSource.set(this.imageUrl());
4086
- this.getImageSrc();
4087
- }
4088
- getImageSrc() {
4089
- if (this.imageUrl && (this.imageUrl().startsWith('data:image') || this.imageUrl().startsWith('http') || this.imageUrl().startsWith('https'))) {
4090
- this.existeLogo = true;
4091
- }
4092
- else if (this.imageUrl.length > 0) {
4093
- this.existeLogo = true;
4094
- this.imageSource.set('data:image/jpg;base64,' + this.imageUrl);
4095
- }
4096
- else {
4097
- this.existeLogo = false;
4098
- this.imageSource.set(this.imageService.userDefaultImage());
4099
- }
4100
- }
4101
- openFile() {
4102
- const inputElement = document.getElementById('fotoEscolhida');
4103
- if (inputElement) {
4104
- inputElement.click();
4105
- }
4106
- }
4107
- selectFotoSelecionada(event) {
4108
- const file = event.target.files[0];
4109
- if (file) {
4110
- const reader = new FileReader();
4111
- reader.readAsDataURL(file);
4112
- reader.onload = () => {
4113
- this.selectedImage = reader.result;
4114
- this.abrirModalRecortarFoto();
4115
- this.existeLogo = false;
4116
- };
4117
- }
4118
- }
4119
- questionRemoverFoto() {
4120
- const msg = '<h3>Você tem certeza que deseja retirar a foto desse usuário?</h3>';
4121
- this.notificationService.question({
4122
- type: 'question',
4123
- message: msg,
4124
- accept: (data) => {
4125
- this.removerFoto();
4126
- },
4127
- reject: (data) => {
4128
- }
4129
- });
4130
- }
4131
- removerFoto() {
4132
- this.imageSource.set('');
4133
- this.removerFotoEvent.emit();
4134
- this.existeLogo = false;
4135
- this.imageUrlChange.emit(this.imageSource());
4136
- this.fileInput.nativeElement.value = '';
4137
- }
4138
- handleImageError(event) {
4139
- event.target.src = this.imageService.userDefaultImage();
4140
- }
4141
- abrirModalRecortarFoto() {
4142
- this.openDialog(KvCropImageComponent, () => {
4143
- this.imageUrl = this.receberDados();
4144
- this.imageSource.set(this.receberDados());
4145
- this.imageUrlChange.emit(this.imageSource());
4146
- this.existeLogo = true;
4147
- }, {
4148
- maximizable: false,
4149
- popup: true,
4150
- width: '60%',
4151
- header: 'Recortar',
4152
- id: { imagemSelecionada: this.selectedImage, imagemCortada: '' }
4153
- });
4154
- const [firstKey] = this.dialogService.dialogComponentRefMap.entries().next().value;
4155
- const instance = this.dialogService.getInstance(firstKey);
4156
- instance.config.showHeader = false;
4157
- instance.config.contentStyle = { 'border-radius': '12px' };
4158
- }
4159
- receberDados() {
4160
- const [firstKey] = this.dialogService.dialogComponentRefMap.entries().next().value;
4161
- const instance = this.dialogService.getInstance(firstKey);
4162
- return instance.config.data.id.imagemCortada;
4163
- }
4164
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, deps: [{ token: ImagensService }, { token: NotificationService }, { token: i1$3.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
4165
- 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", onModalOpen: "onModalOpen" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"image-container\">\r\n <!-- <img [src]=\"getImageSrc() || imageService.userDefaultImage()\" alt=\"Foto\" class=\"container-foto\" [style.border-color]=\"borderColor\" [style.width.px]=\"width\" [style.height.px]=\"height\" (error)=\"handleImageError($event)\" (click)=\"openFile()\"> -->\r\n\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", 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}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
4166
- }
4167
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarComponent, decorators: [{
4168
- type: Component,
4169
- args: [{ selector: 'kv-avatar', template: "<div class=\"image-container\">\r\n <!-- <img [src]=\"getImageSrc() || imageService.userDefaultImage()\" alt=\"Foto\" class=\"container-foto\" [style.border-color]=\"borderColor\" [style.width.px]=\"width\" [style.height.px]=\"height\" (error)=\"handleImageError($event)\" (click)=\"openFile()\"> -->\r\n\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", 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}\n"] }]
4170
- }], ctorParameters: () => [{ type: ImagensService }, { type: NotificationService }, { type: i1$3.DialogService }], propDecorators: { borderColor: [{
4171
- type: Input
4172
- }], btnsColor: [{
4173
- type: Input
4174
- }], width: [{
4175
- type: Input
4176
- }], height: [{
4177
- type: Input
4178
- }], imageUrlChange: [{
4179
- type: Output
4180
- }], removerFotoEvent: [{
4181
- type: Output
4182
- }], onModalOpen: [{
4183
- type: Output
4184
- }], btnAlterarFoto: [{
4185
- type: Input
4186
- }], fileInput: [{
4187
- type: ViewChild,
4188
- args: ['fileInput']
4189
- }] } });
4190
-
4191
- class KvButtonModule {
4192
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
4193
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, declarations: [KvButtonComponent], imports: [CommonModule,
4194
- PrimeNgModule], exports: [KvButtonComponent] }); }
4195
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, imports: [CommonModule,
4196
- PrimeNgModule] }); }
4197
- }
4198
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonModule, decorators: [{
4199
- type: NgModule,
4200
- args: [{
4201
- declarations: [
4202
- KvButtonComponent
4203
- ],
4204
- imports: [
4205
- CommonModule,
4206
- PrimeNgModule
4207
- ],
4208
- exports: [
4209
- KvButtonComponent
4210
- ]
4211
- }]
4212
- }] });
4213
-
4214
- class KvAvatarModule {
4215
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
4216
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, declarations: [KvAvatarComponent], imports: [CommonModule,
4217
- ButtonModule,
4218
- FileUploadModule,
4219
- SliderModule,
4220
- FormsModule,
4221
- ReactiveFormsModule,
4222
- KvButtonModule,
4223
- KvLabelModule], exports: [KvAvatarComponent] }); }
4224
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, imports: [CommonModule,
4225
- ButtonModule,
4226
- FileUploadModule,
4227
- SliderModule,
4228
- FormsModule,
4229
- ReactiveFormsModule,
4230
- KvButtonModule,
4231
- KvLabelModule] }); }
4232
- }
4233
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvAvatarModule, decorators: [{
4234
- type: NgModule,
4235
- args: [{
4236
- declarations: [
4237
- KvAvatarComponent,
4238
- ],
4239
- imports: [
4240
- CommonModule,
4241
- ButtonModule,
4242
- FileUploadModule,
4243
- SliderModule,
4244
- FormsModule,
4245
- ReactiveFormsModule,
4246
- KvButtonModule,
4247
- KvLabelModule,
4248
- ],
4249
- exports: [
4250
- KvAvatarComponent
4251
- ]
4252
- }]
4253
- }] });
4254
-
4255
- class KvButtonPersonalizeComponent extends BaseComponentButton {
4256
- constructor() {
4257
- super();
4258
- }
4259
- ngOnInit() {
4260
- this.colorHover = this.colorHover ? this.colorHover : this.color;
4261
- this.backgroundColor = this.color;
4262
- }
4263
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonPersonalizeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4264
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvButtonPersonalizeComponent, selector: "kv-button-personalize", inputs: { colorHover: "colorHover", textColor: "textColor" }, usesInheritance: true, ngImport: i0, template: "<button\r\n pButton\r\n pRipple\r\n [icon]=\"icon\"\r\n [label]=\"label\"\r\n [loading]=\"loading\"\r\n (click)=\"click($event)\"\r\n [disabled]=\"disabled\"\r\n class=\"btn-personalize\"\r\n [style.color]=\"textColor\"\r\n [style.backgroundColor]=\"backgroundColor\"\r\n [style.borderColor]=\"backgroundColor\"\r\n [text]=\"text\"\r\n></button>\r\n", styles: [".btn-personalize{height:35px}::ng-deep .p-button-label{font-weight:500!important}\n"], 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: i2.Ripple, selector: "[pRipple]" }] }); }
4265
- }
4266
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvButtonPersonalizeComponent, decorators: [{
4267
- type: Component,
4268
- args: [{ selector: 'kv-button-personalize', template: "<button\r\n pButton\r\n pRipple\r\n [icon]=\"icon\"\r\n [label]=\"label\"\r\n [loading]=\"loading\"\r\n (click)=\"click($event)\"\r\n [disabled]=\"disabled\"\r\n class=\"btn-personalize\"\r\n [style.color]=\"textColor\"\r\n [style.backgroundColor]=\"backgroundColor\"\r\n [style.borderColor]=\"backgroundColor\"\r\n [text]=\"text\"\r\n></button>\r\n", styles: [".btn-personalize{height:35px}::ng-deep .p-button-label{font-weight:500!important}\n"] }]
4269
- }], ctorParameters: () => [], propDecorators: { colorHover: [{
4270
- type: Input
4271
- }], textColor: [{
4272
- type: Input
4273
- }] } });
4274
-
4275
- class KvButtonPopupComponent extends BaseComponentButton {
4276
- constructor() {
4277
- super();
4278
- this.items = [];
4279
- this.classBtn = '';
4280
- this.icon = 'pi pi-chevron-down';
4281
- }
4282
- handleShow() {
4283
- this.rotate();
4284
- }
4285
- handleHide() {
4286
- this.rotate();
3989
+ handleHide() {
3990
+ this.rotate();
4287
3991
  }
4288
3992
  rotate() {
4289
3993
  this.icon = this.icon === 'pi pi-chevron-down' ? 'pi pi-chevron-up' : 'pi pi-chevron-down';
@@ -4923,7 +4627,7 @@ class KvRadioGroupComponent extends BaseComponentInput {
4923
4627
  this.onSelectedOption.emit(event.value[this.optionValue]);
4924
4628
  }
4925
4629
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvRadioGroupComponent, deps: [{ token: ComponentService }], target: i0.ɵɵFactoryTarget.Component }); }
4926
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvRadioGroupComponent, selector: "kv-radio-group", inputs: { options: "options", optionValue: "optionValue", optionLabel: "optionLabel", optionValueDefault: "optionValueDefault", vertical: "vertical" }, outputs: { onSelectedOption: "onSelectedOption" }, providers: ComponentProviders(KvRadioGroupComponent), usesInheritance: true, ngImport: i0, template: "<kv-label [label]=\"label && label + (showAsterisk ? '*' : '')\" />\r\n<div [class.vertical-radio-group]=\"vertical\">\r\n <div class=\"option\" *ngFor=\"let option of options; let isFirst = first\">\r\n <p-radioButton\r\n [inputId]=\"option[optionValue]\"\r\n name=\"option\"\r\n [value]=\"option\"\r\n [(ngModel)]=\"selectedOpt\"\r\n (onClick)=\"selectedOption($event)\"\r\n [disabled]=\"disabled\"\r\n [class.ml-3]=\"!isFirst && !vertical\"\r\n >\r\n </p-radioButton>\r\n <label [for]=\"option[optionValue]\" class=\"radio-option-label\">\r\n {{ option[optionLabel] }}</label\r\n >\r\n </div>\r\n <kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n</div>\r\n", styles: [".option{display:inline-block;margin:0;height:35px;padding-top:.75rem}.vertical-radio-group{display:flex;flex-direction:column}.radio-option-label{font-size:1rem}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#004172;background:#004172}\n", "@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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: KvErrorComponent, selector: "kv-error", inputs: ["formControl", "hasError"] }, { kind: "component", type: KvLabelComponent, selector: "kv-label", inputs: ["componentId", "label"] }, { kind: "component", type: i6$2.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
4630
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvRadioGroupComponent, selector: "kv-radio-group", inputs: { options: "options", optionValue: "optionValue", optionLabel: "optionLabel", optionValueDefault: "optionValueDefault", vertical: "vertical" }, outputs: { onSelectedOption: "onSelectedOption" }, providers: ComponentProviders(KvRadioGroupComponent), usesInheritance: true, ngImport: i0, template: "<kv-label [label]=\"label && label + (showAsterisk ? '*' : '')\" />\r\n<div [class.vertical-radio-group]=\"vertical\">\r\n <div class=\"option\" *ngFor=\"let option of options; let isFirst = first\">\r\n <p-radioButton\r\n [inputId]=\"option[optionValue]\"\r\n name=\"option\"\r\n [value]=\"option\"\r\n [(ngModel)]=\"selectedOpt\"\r\n (onClick)=\"selectedOption($event)\"\r\n [disabled]=\"disabled\"\r\n [class.ml-3]=\"!isFirst && !vertical\"\r\n >\r\n </p-radioButton>\r\n <label [for]=\"option[optionValue]\" class=\"radio-option-label\">\r\n {{ option[optionLabel] }}</label\r\n >\r\n </div>\r\n <kv-error [hasError]=\"hasControlError()\">{{ erroMessage() }}</kv-error>\r\n</div>\r\n", styles: [".option{display:inline-block;margin:0;height:35px;padding-top:.75rem}.vertical-radio-group{display:flex;flex-direction:column}.radio-option-label{font-size:1rem}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#004172;background:#004172}\n", "@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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: KvErrorComponent, selector: "kv-error", inputs: ["formControl", "hasError"] }, { kind: "component", type: KvLabelComponent, selector: "kv-label", inputs: ["componentId", "label"] }, { kind: "component", type: i6$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
4927
4631
  }
4928
4632
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvRadioGroupComponent, decorators: [{
4929
4633
  type: Component,
@@ -5113,7 +4817,7 @@ class KvLoaderComponent {
5113
4817
  this.loading = KvLoaderService.isLoading;
5114
4818
  }
5115
4819
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5116
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvLoaderComponent, selector: "kv-loader", ngImport: i0, template: "<ngx-loading [show]=\"(loading | async) || false\"></ngx-loading>\r\n", dependencies: [{ kind: "component", type: i1$6.NgxLoadingComponent, selector: "ngx-loading", inputs: ["show", "config", "template"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
4820
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvLoaderComponent, selector: "kv-loader", ngImport: i0, template: "<ngx-loading [show]=\"(loading | async) || false\"></ngx-loading>\r\n", dependencies: [{ kind: "component", type: i1$5.NgxLoadingComponent, selector: "ngx-loading", inputs: ["show", "config", "template"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
5117
4821
  }
5118
4822
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLoaderComponent, decorators: [{
5119
4823
  type: Component,
@@ -5122,7 +4826,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
5122
4826
 
5123
4827
  class KvLoaderModule {
5124
4828
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLoaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5125
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLoaderModule, declarations: [KvLoaderComponent], imports: [CommonModule, i1$6.NgxLoadingModule], exports: [KvLoaderComponent] }); }
4829
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLoaderModule, declarations: [KvLoaderComponent], imports: [CommonModule, i1$5.NgxLoadingModule], exports: [KvLoaderComponent] }); }
5126
4830
  static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLoaderModule, imports: [CommonModule,
5127
4831
  NgxLoadingModule.forRoot({
5128
4832
  fullScreenBackdrop: true
@@ -5493,46 +5197,138 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
5493
5197
  args: ['window:resize', ['$event']]
5494
5198
  }] } });
5495
5199
 
5496
- class KvLayoutModule {
5497
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5498
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, declarations: [DropdownMasterComponent,
5499
- KvLayoutComponent], imports: [CommonModule,
5500
- FormsModule,
5501
- KvButtonsModule,
5502
- KvInputsModule,
5503
- PipesModule,
5504
- PrimeNgModule,
5505
- ReactiveFormsModule], exports: [KvLayoutComponent] }); }
5506
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, imports: [CommonModule,
5507
- FormsModule,
5508
- KvButtonsModule,
5509
- KvInputsModule,
5510
- PipesModule,
5511
- PrimeNgModule,
5512
- ReactiveFormsModule] }); }
5513
- }
5514
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, decorators: [{
5515
- type: NgModule,
5516
- args: [{
5517
- declarations: [
5518
- DropdownMasterComponent,
5519
- KvLayoutComponent
5520
- ],
5521
- exports: [
5522
- KvLayoutComponent
5523
- ],
5524
- imports: [
5525
- CommonModule,
5526
- FormsModule,
5527
- KvButtonsModule,
5528
- KvInputsModule,
5529
- PipesModule,
5530
- PrimeNgModule,
5531
- ReactiveFormsModule,
5532
- ]
5533
- }]
5534
- }] });
5535
-
5200
+ class KvLayoutModule {
5201
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5202
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, declarations: [DropdownMasterComponent,
5203
+ KvLayoutComponent], imports: [CommonModule,
5204
+ FormsModule,
5205
+ KvButtonsModule,
5206
+ KvInputsModule,
5207
+ PipesModule,
5208
+ PrimeNgModule,
5209
+ ReactiveFormsModule], exports: [KvLayoutComponent] }); }
5210
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, imports: [CommonModule,
5211
+ FormsModule,
5212
+ KvButtonsModule,
5213
+ KvInputsModule,
5214
+ PipesModule,
5215
+ PrimeNgModule,
5216
+ ReactiveFormsModule] }); }
5217
+ }
5218
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutModule, decorators: [{
5219
+ type: NgModule,
5220
+ args: [{
5221
+ declarations: [
5222
+ DropdownMasterComponent,
5223
+ KvLayoutComponent
5224
+ ],
5225
+ exports: [
5226
+ KvLayoutComponent
5227
+ ],
5228
+ imports: [
5229
+ CommonModule,
5230
+ FormsModule,
5231
+ KvButtonsModule,
5232
+ KvInputsModule,
5233
+ PipesModule,
5234
+ PrimeNgModule,
5235
+ ReactiveFormsModule,
5236
+ ]
5237
+ }]
5238
+ }] });
5239
+
5240
+ class KvModalComponent {
5241
+ constructor(dynamicDialogRef) {
5242
+ this.dynamicDialogRef = dynamicDialogRef;
5243
+ /**
5244
+ * Ações do Dialog
5245
+ */
5246
+ this.actions = [];
5247
+ this.actionsPosition = 'right';
5248
+ this.justify_content = 'justify-content-start';
5249
+ }
5250
+ ngOnInit() {
5251
+ this.addSubTitle();
5252
+ this.setMarginBottom();
5253
+ this.defPositionButtons();
5254
+ }
5255
+ onWindowResize() {
5256
+ this.setMarginBottom();
5257
+ }
5258
+ /**
5259
+ * Adiciona sub-título à tela
5260
+ */
5261
+ addSubTitle() {
5262
+ if (this.subtitle) {
5263
+ const headerElement = document.querySelector('.p-dialog .p-dialog-header');
5264
+ if (headerElement) {
5265
+ const subtitleElement = document.createElement('span');
5266
+ subtitleElement.textContent = this.subtitle;
5267
+ subtitleElement.style.fontSize = '0.75rem';
5268
+ subtitleElement.style.width = '100%';
5269
+ subtitleElement.style.marginLeft = '2px';
5270
+ headerElement.appendChild(subtitleElement);
5271
+ }
5272
+ if (this.subHeader) {
5273
+ const headerElement = document.querySelector('.p-dialog .p-dialog-header');
5274
+ const subHeader = this.subHeader.nativeElement;
5275
+ if (headerElement && this.subHeader) {
5276
+ subHeader.style.width = '100%';
5277
+ subHeader.style.marginLeft = '2px';
5278
+ headerElement.appendChild(this.subHeader.nativeElement);
5279
+ }
5280
+ }
5281
+ }
5282
+ }
5283
+ defPositionButtons() {
5284
+ if (this.actionsPosition === 'right') {
5285
+ this.justify_content = 'justify-content-end';
5286
+ }
5287
+ if (this.actionsPosition === 'center') {
5288
+ this.justify_content = 'justify-content-center';
5289
+ }
5290
+ if (this.actionsPosition === 'left') {
5291
+ this.justify_content = 'justify-content-start';
5292
+ }
5293
+ }
5294
+ setMarginBottom() {
5295
+ let actionsFieldHeight = document.getElementById('actions-field')?.offsetHeight;
5296
+ let divBox = document.getElementById('content-modal');
5297
+ if (divBox) {
5298
+ if (actionsFieldHeight) {
5299
+ divBox.style.marginBottom = `${actionsFieldHeight + 30}px`;
5300
+ }
5301
+ else {
5302
+ divBox.style.marginBottom = `50px`;
5303
+ }
5304
+ }
5305
+ }
5306
+ clickExecute(action) {
5307
+ if (action.command) {
5308
+ action.command();
5309
+ if (action.closeAfterClick != false)
5310
+ this.dynamicDialogRef.close();
5311
+ }
5312
+ }
5313
+ 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 }); }
5314
+ 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"] }] }); }
5315
+ }
5316
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalComponent, decorators: [{
5317
+ type: Component,
5318
+ 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"] }]
5319
+ }], ctorParameters: () => [{ type: i1$3.DynamicDialogRef }], propDecorators: { actions: [{
5320
+ type: Input
5321
+ }], actionsPosition: [{
5322
+ type: Input
5323
+ }], subtitle: [{
5324
+ type: Input
5325
+ }], subHeader: [{
5326
+ type: Input
5327
+ }], onWindowResize: [{
5328
+ type: HostListener,
5329
+ args: ['window:resize', ['$event']]
5330
+ }] } });
5331
+
5536
5332
  class KvModalModule {
5537
5333
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
5538
5334
  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] }); }
@@ -6460,7 +6256,7 @@ class KvTreeViewComponent {
6460
6256
  this.selectedItems.emit(this.selectedFiles);
6461
6257
  }
6462
6258
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTreeViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6463
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvTreeViewComponent, selector: "kv-tree-view", inputs: { selectedFiles: "selectedFiles", selectionMode: "selectionMode", treeViewData: "treeViewData" }, outputs: { selectedItems: "selectedItems" }, ngImport: i0, template: "<div class=\"card flex flex-column align-items-center justify-content-center\">\r\n <p-tree\r\n [value]=\"treeViewData\"\r\n [selectionMode]=\"selectionMode\"\r\n class=\"w-full\"\r\n [(selection)]=\"selectedFiles\"\r\n (selectionChange)=\"onSelectionChange()\"\r\n ></p-tree>\r\n</div>", styles: [""], dependencies: [{ kind: "component", type: i1$7.Tree, selector: "p-tree", inputs: ["value", "selectionMode", "loadingMode", "selection", "style", "styleClass", "contextMenu", "layout", "draggableScope", "droppableScope", "draggableNodes", "droppableNodes", "metaKeySelection", "propagateSelectionUp", "propagateSelectionDown", "loading", "loadingIcon", "emptyMessage", "ariaLabel", "togglerAriaLabel", "ariaLabelledBy", "validateDrop", "filter", "filterBy", "filterMode", "filterPlaceholder", "filteredNodes", "filterLocale", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "indentation", "_templateMap", "trackBy", "virtualNodeHeight"], outputs: ["selectionChange", "onNodeSelect", "onNodeUnselect", "onNodeExpand", "onNodeCollapse", "onNodeContextMenuSelect", "onNodeDrop", "onLazyLoad", "onScroll", "onScrollIndexChange", "onFilter"] }] }); }
6259
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvTreeViewComponent, selector: "kv-tree-view", inputs: { selectedFiles: "selectedFiles", selectionMode: "selectionMode", treeViewData: "treeViewData" }, outputs: { selectedItems: "selectedItems" }, ngImport: i0, template: "<div class=\"card flex flex-column align-items-center justify-content-center\">\r\n <p-tree\r\n [value]=\"treeViewData\"\r\n [selectionMode]=\"selectionMode\"\r\n class=\"w-full\"\r\n [(selection)]=\"selectedFiles\"\r\n (selectionChange)=\"onSelectionChange()\"\r\n ></p-tree>\r\n</div>", styles: [""], dependencies: [{ kind: "component", type: i1$6.Tree, selector: "p-tree", inputs: ["value", "selectionMode", "loadingMode", "selection", "style", "styleClass", "contextMenu", "layout", "draggableScope", "droppableScope", "draggableNodes", "droppableNodes", "metaKeySelection", "propagateSelectionUp", "propagateSelectionDown", "loading", "loadingIcon", "emptyMessage", "ariaLabel", "togglerAriaLabel", "ariaLabelledBy", "validateDrop", "filter", "filterBy", "filterMode", "filterPlaceholder", "filteredNodes", "filterLocale", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "indentation", "_templateMap", "trackBy", "virtualNodeHeight"], outputs: ["selectionChange", "onNodeSelect", "onNodeUnselect", "onNodeExpand", "onNodeCollapse", "onNodeContextMenuSelect", "onNodeDrop", "onLazyLoad", "onScroll", "onScrollIndexChange", "onFilter"] }] }); }
6464
6260
  }
6465
6261
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvTreeViewComponent, decorators: [{
6466
6262
  type: Component,
@@ -7512,13 +7308,13 @@ class KvFileViewerComponent {
7512
7308
  const text = await new Response(this.blob).text();
7513
7309
  this.xmlFormat = vkbeautify.xml(text);
7514
7310
  }
7515
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFileViewerComponent, deps: [{ token: i1$8.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
7311
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFileViewerComponent, deps: [{ token: i1$7.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
7516
7312
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvFileViewerComponent, selector: "kv-file-viewer", inputs: { arquivo: "arquivo", type: "type", blob: "blob" }, usesOnChanges: true, ngImport: i0, template: "<img class=\"img\" *ngIf=\"type.match('image')\" [src]=\"sanitizedPdfSrc\" />\r\n\r\n<iframe\r\n class=\"txt-pdf\"\r\n *ngIf=\"type == 'text/plain' || type == 'application/pdf'\"\r\n [src]=\"sanitizedPdfSrc\"\r\n width=\"100%\"\r\n height=\"700px\"\r\n>\r\n</iframe>\r\n\r\n<div *ngIf=\"xmlFormat\" class=\"txt-pdf xml-viewer\">\r\n <pre lang=\"xml\">\r\n {{ xmlFormat }}\r\n </pre>\r\n</div>\r\n", styles: [".img{width:100%;height:100%;overflow:auto}.txt-pdf{width:100%;height:600px}.xml-viewer{overflow:auto;font-size:13px}.xml-viewer .tag{color:#6f517e}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
7517
7313
  }
7518
7314
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvFileViewerComponent, decorators: [{
7519
7315
  type: Component,
7520
7316
  args: [{ selector: 'kv-file-viewer', template: "<img class=\"img\" *ngIf=\"type.match('image')\" [src]=\"sanitizedPdfSrc\" />\r\n\r\n<iframe\r\n class=\"txt-pdf\"\r\n *ngIf=\"type == 'text/plain' || type == 'application/pdf'\"\r\n [src]=\"sanitizedPdfSrc\"\r\n width=\"100%\"\r\n height=\"700px\"\r\n>\r\n</iframe>\r\n\r\n<div *ngIf=\"xmlFormat\" class=\"txt-pdf xml-viewer\">\r\n <pre lang=\"xml\">\r\n {{ xmlFormat }}\r\n </pre>\r\n</div>\r\n", styles: [".img{width:100%;height:100%;overflow:auto}.txt-pdf{width:100%;height:600px}.xml-viewer{overflow:auto;font-size:13px}.xml-viewer .tag{color:#6f517e}\n"] }]
7521
- }], ctorParameters: () => [{ type: i1$8.DomSanitizer }], propDecorators: { arquivo: [{
7317
+ }], ctorParameters: () => [{ type: i1$7.DomSanitizer }], propDecorators: { arquivo: [{
7522
7318
  type: Input
7523
7319
  }], type: [{
7524
7320
  type: Input
@@ -8334,6 +8130,215 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImpor
8334
8130
  }]
8335
8131
  }] });
8336
8132
 
8133
+ class KvCropImageComponent extends BaseComponentCrud$1 {
8134
+ onWindowResize() {
8135
+ this.widthTela = window.innerWidth;
8136
+ this.updateCanvasSize();
8137
+ }
8138
+ constructor(imageService, notificationService, dialogService, dynamicDialogRef, dynamicDialogConfig) {
8139
+ super(dialogService, notificationService);
8140
+ this.imageService = imageService;
8141
+ this.notificationService = notificationService;
8142
+ this.dialogService = dialogService;
8143
+ this.dynamicDialogRef = dynamicDialogRef;
8144
+ this.dynamicDialogConfig = dynamicDialogConfig;
8145
+ this.imageLoaded = false;
8146
+ this.imageX = 0;
8147
+ this.imageY = 0;
8148
+ this.startX = 0;
8149
+ this.startY = 0;
8150
+ this.valueZoom = 50;
8151
+ this.scaleFactor = 1;
8152
+ this.selectedImage = '';
8153
+ this.actionsModal = [
8154
+ {
8155
+ label: 'Cancelar',
8156
+ severity: 'tertiary',
8157
+ icon: 'cancel',
8158
+ command: (e) => {
8159
+ this.dynamicDialogRef.close();
8160
+ },
8161
+ },
8162
+ {
8163
+ label: 'Recortar',
8164
+ severity: 'primary',
8165
+ icon: 'crop',
8166
+ command: (e) => {
8167
+ this.cropImage();
8168
+ },
8169
+ },
8170
+ ];
8171
+ this.widthTela = window.innerWidth;
8172
+ this.selectedImage = this.dynamicDialogConfig.data.id.imagemSelecionada;
8173
+ this.openCropModal();
8174
+ }
8175
+ openCropModal() {
8176
+ setTimeout(() => {
8177
+ const canvas = this.cropCanvas.nativeElement;
8178
+ const ctx = canvas.getContext('2d');
8179
+ const img = new Image();
8180
+ img.src = this.selectedImage;
8181
+ img.onload = () => {
8182
+ this.imageLoaded = true;
8183
+ this.imageX = (canvas.width - img.width * this.scaleFactor) / 2;
8184
+ this.imageY = (canvas.height - img.height * this.scaleFactor) / 2;
8185
+ canvas.width = this.retornaTamanhoCanvas();
8186
+ canvas.height = 400;
8187
+ this.redrawCanvas(ctx, img);
8188
+ this.initializeImageMove(canvas, ctx, img);
8189
+ this.initializeMouseWheel(canvas, ctx, img);
8190
+ };
8191
+ }, 0);
8192
+ }
8193
+ redrawCanvas(ctx, img) {
8194
+ if (!ctx)
8195
+ return;
8196
+ ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
8197
+ ctx.filter = 'blur(5px) opacity(0.9)';
8198
+ ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactor, img.height * this.scaleFactor);
8199
+ ctx.filter = 'none';
8200
+ this.drawImageInCropArea(ctx, img);
8201
+ this.drawCropArea(ctx);
8202
+ }
8203
+ initializeImageMove(canvas, ctx, img) {
8204
+ let isDragging = false;
8205
+ canvas.style.cursor = 'grab';
8206
+ canvas.onmousedown = (e) => {
8207
+ isDragging = true;
8208
+ canvas.style.cursor = 'grabbing';
8209
+ this.startX = e.offsetX - this.imageX;
8210
+ this.startY = e.offsetY - this.imageY;
8211
+ };
8212
+ canvas.onmousemove = (e) => {
8213
+ if (isDragging) {
8214
+ this.imageX = e.offsetX - this.startX;
8215
+ this.imageY = e.offsetY - this.startY;
8216
+ this.redrawCanvas(ctx, img);
8217
+ }
8218
+ };
8219
+ canvas.onmouseup = () => {
8220
+ isDragging = false;
8221
+ canvas.style.cursor = 'grab';
8222
+ };
8223
+ canvas.onmouseout = () => {
8224
+ isDragging = false;
8225
+ canvas.style.cursor = 'grab';
8226
+ };
8227
+ }
8228
+ initializeMouseWheel(canvas, ctx, img) {
8229
+ canvas.onwheel = (e) => {
8230
+ e.preventDefault();
8231
+ const delta = e.deltaY > 0 ? -0.1 : 0.1;
8232
+ this.scaleFactor = Math.min(Math.max(this.scaleFactor + delta, 0.1), 5); // limita o fator de escala entre 0.1 e 5
8233
+ this.redrawCanvas(ctx, img);
8234
+ this.valueZoom = this.scaleFactor * 50;
8235
+ };
8236
+ }
8237
+ drawImageInCropArea(ctx, img) {
8238
+ if (!ctx)
8239
+ return;
8240
+ // Calcula a posição da área de corte
8241
+ const cropX = (ctx.canvas.width - 225) / 2;
8242
+ const cropY = (ctx.canvas.height - 225) / 2;
8243
+ // Desenha a imagem de não desfocada dentro da área de corte
8244
+ ctx.save();
8245
+ ctx.beginPath();
8246
+ ctx.arc(cropX + 112.5, cropY + 112.5, 112.5, 0, Math.PI * 2, true);
8247
+ ctx.clip();
8248
+ ctx.drawImage(img, this.imageX, this.imageY, img.width * this.scaleFactor, img.height * this.scaleFactor);
8249
+ ctx.restore();
8250
+ }
8251
+ drawCropArea(ctx) {
8252
+ if (!ctx)
8253
+ return;
8254
+ ctx.beginPath();
8255
+ const cropX = (ctx.canvas.width - 225) / 2;
8256
+ const cropY = (ctx.canvas.height - 225) / 2;
8257
+ ctx.arc(cropX + 112.5, cropY + 112.5, 112.5, 0, Math.PI * 2, true);
8258
+ ctx.strokeStyle = 'transparent';
8259
+ ctx.lineWidth = 2;
8260
+ ctx.stroke();
8261
+ }
8262
+ updateCanvasSize() {
8263
+ const canvas = this.cropCanvas.nativeElement;
8264
+ const ctx = canvas.getContext('2d');
8265
+ const img = new Image();
8266
+ img.src = this.selectedImage;
8267
+ img.onload = () => {
8268
+ this.imageLoaded = true;
8269
+ this.imageX = (canvas.width - img.width * this.scaleFactor) / 2;
8270
+ this.imageY = (canvas.height - img.height * this.scaleFactor) / 2;
8271
+ canvas.width = this.retornaTamanhoCanvas();
8272
+ canvas.height = 400;
8273
+ this.redrawCanvas(ctx, img);
8274
+ };
8275
+ }
8276
+ onZoomChange(event) {
8277
+ const canvas = this.cropCanvas.nativeElement;
8278
+ const ctx = canvas.getContext('2d');
8279
+ const img = new Image();
8280
+ img.src = this.selectedImage;
8281
+ img.onload = () => {
8282
+ this.scaleFactor = event.value / 50;
8283
+ this.redrawCanvas(ctx, img);
8284
+ };
8285
+ }
8286
+ cropImage() {
8287
+ const canvas = this.cropCanvas.nativeElement;
8288
+ const ctx = canvas.getContext('2d');
8289
+ if (ctx) {
8290
+ const centerX = canvas.width / 2;
8291
+ const centerY = canvas.height / 2;
8292
+ const radius = 100;
8293
+ const imageData = ctx.getImageData(centerX - radius, centerY - radius, radius * 2, radius * 2);
8294
+ const newCanvas = document.createElement('canvas');
8295
+ const newCtx = newCanvas.getContext('2d');
8296
+ newCanvas.width = radius * 2;
8297
+ newCanvas.height = radius * 2;
8298
+ newCtx?.putImageData(imageData, 0, 0);
8299
+ this.selectedImage = newCanvas.toDataURL();
8300
+ this.enviarDados();
8301
+ this.dynamicDialogRef.close(this.selectedImage);
8302
+ }
8303
+ }
8304
+ enviarDados() {
8305
+ const arr = this.dialogService.dialogComponentRefMap;
8306
+ const entries = arr.entries();
8307
+ const firstEntry = entries.next().value;
8308
+ const [firstKey, firstValue] = firstEntry;
8309
+ const instance = this.dialogService.getInstance(firstKey);
8310
+ instance.config.data.id.imagemCortada = this.selectedImage;
8311
+ }
8312
+ retornaTamanhoCanvas() {
8313
+ if (this.widthTela < 500) {
8314
+ return this.widthTela * 0.7;
8315
+ }
8316
+ return this.widthTela * 0.4;
8317
+ }
8318
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvCropImageComponent, deps: [{ token: i1$8.ImagensService }, { token: i1$8.NotificationService }, { token: i1$3.DialogService }, { token: i1$3.DynamicDialogRef }, { token: i1$3.DynamicDialogConfig }], target: i0.ɵɵFactoryTarget.Component }); }
8319
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.8", type: KvCropImageComponent, isStandalone: true, selector: "kv-crop-image", host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "cropCanvas", first: true, predicate: ["cropCanvas"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<kv-modal [actions]=\"actionsModal\">\r\n <div class=\"crop-container\">\r\n <canvas #cropCanvas class=\"crop-canvas\"></canvas>\r\n <div class=\"crop-border\"></div>\r\n </div>\r\n \r\n <div class=\"w-full zoom-container\">\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</kv-modal>\r\n", styles: [".crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px}.crop-border{position:absolute;width:225px;height:225px;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: KvModalModule$1 }, { kind: "component", type: KvModalComponent, selector: "kv-modal", inputs: ["actions", "actionsPosition", "subtitle", "subHeader"] }, { kind: "ngmodule", type: PrimeNgModule$1 }, { kind: "ngmodule", type: KvLabelModule }, { kind: "component", type: KvLabelComponent, selector: "kv-label", inputs: ["componentId", "label"] }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i6$2.Slider, selector: "p-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }] }); }
8320
+ }
8321
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvCropImageComponent, decorators: [{
8322
+ type: Component,
8323
+ args: [{ selector: 'kv-crop-image', standalone: true, imports: [
8324
+ CommonModule,
8325
+ FormsModule,
8326
+ KvModalModule$1,
8327
+ PrimeNgModule$1,
8328
+ KvLabelModule,
8329
+ SliderModule
8330
+ ], template: "<kv-modal [actions]=\"actionsModal\">\r\n <div class=\"crop-container\">\r\n <canvas #cropCanvas class=\"crop-canvas\"></canvas>\r\n <div class=\"crop-border\"></div>\r\n </div>\r\n \r\n <div class=\"w-full zoom-container\">\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</kv-modal>\r\n", styles: [".crop-container{display:flex;justify-content:center;align-items:center}.crop-canvas{border:1px solid black;border-radius:12px}.crop-border{position:absolute;width:225px;height:225px;border:2px solid black;border-radius:50%;pointer-events:none}.zoom-container{padding-top:20px;padding-bottom:20px}\n"] }]
8331
+ }], ctorParameters: () => [{ type: i1$8.ImagensService }, { type: i1$8.NotificationService }, { type: i1$3.DialogService }, { type: i1$3.DynamicDialogRef }, { type: i1$3.DynamicDialogConfig }], propDecorators: { onWindowResize: [{
8332
+ type: HostListener,
8333
+ args: ['window:resize', ['$event']]
8334
+ }], cropCanvas: [{
8335
+ type: ViewChild,
8336
+ args: ['cropCanvas']
8337
+ }], fileInput: [{
8338
+ type: ViewChild,
8339
+ args: ['fileInput']
8340
+ }] } });
8341
+
8337
8342
  /*
8338
8343
  * Public API Surface of keevo-components
8339
8344
  */