From 6921b09e7a95459707e74b0243d7800a012dcad1 Mon Sep 17 00:00:00 2001 From: Carlos Navarro Date: Thu, 21 Mar 2024 19:43:50 -0600 Subject: [PATCH] feat: add output events instead of inputs --- src/builder.component.ts | 19 ++++++++++--------- src/form.component.ts | 16 +++++++++------- 2 files changed, 19 insertions(+), 16 deletions(-) diff --git a/src/builder.component.ts b/src/builder.component.ts index 9d5c6e2..ffa2951 100644 --- 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(); + @Output() onUpload = new EventEmitter(); + @Output() onSend = new EventEmitter(); + @Output() onSave = new EventEmitter(); + @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 index e324d87..8ebc25e 100644 --- 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(); + @Output() onInit = new EventEmitter(); + @Output() onLoad = new EventEmitter(); + + @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) } }