Merge pull request #1 from CharlesElGriego/add-output-events

Feature: add output events instead of inputs
docusealco · Mar 22, 2024 · a54f7e8 · a54f7e8
2 parents 664ee40 + 6921b09
commit a54f7e8
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 16 deletions.
diff --git a/src/builder.component.ts b/src/builder.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, HostListener, HostBinding } from "@angular/core"
+import { Component, Input, HostListener, HostBinding, Output, EventEmitter } from "@angular/core"
 
 interface DocusealField {
   name: string,
@@ -39,14 +39,15 @@ export class DocusealBuilderComponent implements AfterViewInit {
   @Input() drawFieldType: string = "text"
   @Input() customButton: { title: string, url: string } = { title: "", url: "" }
   @Input() backgroundColor: string = ""
-  @Input() onLoad: (detail: any) => void = () => {}
-  @Input() onUpload: (detail: any) => void = () => {}
-  @Input() onSend: (detail: any) => void = () => {}
-  @Input() onSave: (detail: any) => void = () => {}
   @Input() sendButtonText: string = ""
   @Input() saveButtonText: string = ""
   @Input() customCss: string = ""
 
+  @Output() onLoad = new EventEmitter<any>();
+  @Output() onUpload = new EventEmitter<any>();
+  @Output() onSend = new EventEmitter<any>();
+  @Output() onSave = new EventEmitter<any>();
+
   @HostBinding("attr.data-token") get dataToken(): string { return this.token }
   @HostBinding("attr.data-preview") get dataPreview(): boolean { return this.preview }
   @HostBinding("attr.data-language") get dataLanguage(): string { return this.language }
@@ -78,28 +79,28 @@ export class DocusealBuilderComponent implements AfterViewInit {
   @HostListener('send', ['$event'])
   onSendEvent(event: CustomEvent): void {
     if (this.onSend) {
-      this.onSend(event.detail)
+      this.onSend.emit(event.detail)
     }
   }
 
   @HostListener('load', ['$event'])
   onLoadEvent(event: CustomEvent): void {
     if (this.onLoad) {
-      this.onLoad(event.detail)
+      this.onLoad.emit(event.detail)
     }
   }
 
   @HostListener('upload', ['$event'])
   onUploadEvent(event: CustomEvent): void {
     if (this.onUpload) {
-      this.onUpload(event.detail)
+      this.onUpload.emit(event.detail)
     }
   }
 
   @HostListener('save', ['$event'])
   onSaveEvent(event: CustomEvent): void {
     if (this.onSave) {
-      this.onSave(event.detail)
+      this.onSave.emit(event.detail)
     }
   }
 

diff --git a/src/form.component.ts b/src/form.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, HostListener, HostBinding } from "@angular/core"
+import { Component, Input, HostListener, HostBinding, Output, EventEmitter } from "@angular/core"
 
 interface DocusealField {
   name: string,
@@ -48,11 +48,13 @@ export class DocusealFormComponent implements AfterViewInit {
   @Input() i18n: object = {}
   @Input() fields: DocusealField[] = []
   @Input() readonlyFields: string[] = []
-  @Input() onComplete: (detail: any) => void = () => {}
-  @Input() onInit: (detail: any) => void = () => {}
-  @Input() onLoad: (detail: any) => void = () => {}
   @Input() customCss: string = ""
 
+  @Output() onComplete = new EventEmitter<any>();
+  @Output() onInit = new EventEmitter<any>();
+  @Output() onLoad = new EventEmitter<any>();
+
+
   @HostBinding("attr.data-src") get dataSrc(): string { return this.src }
   @HostBinding("attr.data-email") get dataEmail(): string { return this.email }
   @HostBinding("attr.data-role") get dataRole(): string { return this.role || this.submitter }
@@ -88,21 +90,21 @@ export class DocusealFormComponent implements AfterViewInit {
   @HostListener('completed', ['$event'])
   onCompleteEvent(event: CustomEvent): void {
     if (this.onComplete) {
-      this.onComplete(event.detail)
+      this.onComplete.emit(event.detail)
     }
   }
 
   @HostListener('init', ['$event'])
   onInitEvent(event: CustomEvent): void {
     if (this.onInit) {
-      this.onInit(event.detail)
+      this.onInit.emit(event.detail)
     }
   }
 
   @HostListener('load', ['$event'])
   onLoadEvent(event: CustomEvent): void {
     if (this.onLoad) {
-      this.onLoad(event.detail)
+      this.onLoad.emit(event.detail)
     }
   }