From 6e417a4b990a0b7123d2db5ce9ac880584f30ce4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Wed, 8 Dec 2021 11:40:48 +0200 Subject: [PATCH] Document base dialog component --- src/lib/dialog/base-dialog.component.ts | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/src/lib/dialog/base-dialog.component.ts b/src/lib/dialog/base-dialog.component.ts index ba08d4d..b54bc32 100644 --- a/src/lib/dialog/base-dialog.component.ts +++ b/src/lib/dialog/base-dialog.component.ts @@ -1,12 +1,23 @@ import { Directive, HostListener } from '@angular/core'; import { FormGroup } from '@angular/forms'; -import { IqserEventTarget } from '../utils/types/events.type'; +import { IqserEventTarget } from '../utils'; @Directive() +/** + * Extend this component when you want to submit the form after pressing enter. + * + * This could be done by adding properties (submit)="save()" on the form and type="submit" on the save button. + * However, some components (e.g. redaction-select, color picker) don't set focus on the input after choosing a value. + * Also, other components (e.g. dropdown select) trigger a different action on enter, instead of submit. + * + * Make sure to remove property type="submit" from the save button and the (submit)="save()" property from the form + * (otherwise the save request will be triggered twice). + * */ export abstract class BaseDialogComponent { - abstract form: FormGroup; + abstract get changed(): boolean; + abstract save(): void; @HostListener('window:keydown.Enter', ['$event'])