@netgrif/components-core
Version:
Netgrif Application engine frontend core Angular library
48 lines • 11.2 kB
JavaScript
import { Component, Inject } from '@angular/core';
import { AbstractDialogComponent } from '../../models/abstract-dialog.component';
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
import * as i0 from "@angular/core";
import * as i1 from "@angular/material/dialog";
import * as i2 from "@ngbracket/ngx-layout/flex";
import * as i3 from "@angular/material/button";
import * as i4 from "@angular/material/input";
import * as i5 from "@angular/material/form-field";
import * as i6 from "@angular/forms";
import * as i7 from "@ngx-translate/core";
/**
* Question modal dialog with its own layout (which asks the user a question and wait for the answer)
* based on a material design that injected data and inherits from an [AbstractDialog]{@link AbstractDialogComponent}.
*/
export class PromptDialogComponent extends AbstractDialogComponent {
dialogRef;
data;
/** Set submit button to disabled or enabled according to the user answer. */
disableButton = true;
prompt;
submitClick;
/**
* Only injecting.
* @param dialogRef Reference to a dialog opened via the MatDialog service.
* @param data Injected data that was passed in to a dialog.
*/
constructor(dialogRef, data) {
super(dialogRef, data);
this.dialogRef = dialogRef;
this.data = data;
}
onClose(isSubmitted) {
this.dialogRef.close(isSubmitted ? {
prompt: this.prompt
} : {});
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PromptDialogComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PromptDialogComponent, selector: "ncc-question-dialog-with-answer", usesInheritance: true, ngImport: i0, template: "<h1 mat-dialog-title>{{data.title}}</h1>\n\n<div mat-dialog-content class=\"dialog-container dialog-content-margin netgrif-input netgrif-input-fix\">\n <span>{{data.content}}</span>\n <br>\n <mat-form-field class=\"dialog-prompt-margin\" appearance=\"outline\">\n <mat-label>{{data.placeholder}}</mat-label>\n <input matInput [(ngModel)]=\"prompt\" (ngModelChange)=\"disableButton = !prompt || prompt.trim().length === 0\">\n </mat-form-field>\n</div>\n\n<mat-dialog-actions fxLayoutAlign=\"end\">\n <button mat-button (click)=\"onClose(false)\">{{ 'dialog.close' | translate}}</button>\n <button mat-flat-button color=\"primary\" [disabled]=\"disableButton\" (click)=\"onClose(true)\">{{ 'dialog.submit' | translate}}</button>\n</mat-dialog-actions>\n", styles: [".dialog-prompt-margin{margin-top:16px}\n"], dependencies: [{ kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PromptDialogComponent, decorators: [{
type: Component,
args: [{ selector: 'ncc-question-dialog-with-answer', template: "<h1 mat-dialog-title>{{data.title}}</h1>\n\n<div mat-dialog-content class=\"dialog-container dialog-content-margin netgrif-input netgrif-input-fix\">\n <span>{{data.content}}</span>\n <br>\n <mat-form-field class=\"dialog-prompt-margin\" appearance=\"outline\">\n <mat-label>{{data.placeholder}}</mat-label>\n <input matInput [(ngModel)]=\"prompt\" (ngModelChange)=\"disableButton = !prompt || prompt.trim().length === 0\">\n </mat-form-field>\n</div>\n\n<mat-dialog-actions fxLayoutAlign=\"end\">\n <button mat-button (click)=\"onClose(false)\">{{ 'dialog.close' | translate}}</button>\n <button mat-flat-button color=\"primary\" [disabled]=\"disableButton\" (click)=\"onClose(true)\">{{ 'dialog.submit' | translate}}</button>\n</mat-dialog-actions>\n", styles: [".dialog-prompt-margin{margin-top:16px}\n"] }]
}], ctorParameters: () => [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_DIALOG_DATA]
}] }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvbXB0LWRpYWxvZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZXRncmlmLWNvbXBvbmVudHMtY29yZS9zcmMvbGliL2RpYWxvZy9jb21wb25lbnRzL3Byb21wdC1kaWFsb2cvcHJvbXB0LWRpYWxvZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZXRncmlmLWNvbXBvbmVudHMtY29yZS9zcmMvbGliL2RpYWxvZy9jb21wb25lbnRzL3Byb21wdC1kaWFsb2cvcHJvbXB0LWRpYWxvZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUNoRCxPQUFPLEVBQUMsdUJBQXVCLEVBQUMsTUFBTSx3Q0FBd0MsQ0FBQztBQUcvRSxPQUFPLEVBQUMsZUFBZSxFQUFlLE1BQU0sMEJBQTBCLENBQUM7Ozs7Ozs7OztBQUV2RTs7O0dBR0c7QUFNSCxNQUFNLE9BQU8scUJBQXNCLFNBQVEsdUJBQThDO0lBV2xFO0lBQ3lCO0lBWDVDLDZFQUE2RTtJQUN0RSxhQUFhLEdBQUcsSUFBSSxDQUFDO0lBQ3JCLE1BQU0sQ0FBUztJQUNmLFdBQVcsQ0FBVTtJQUU1Qjs7OztPQUlHO0lBQ0gsWUFBbUIsU0FBNEQsRUFDbkMsSUFBZ0I7UUFDeEQsS0FBSyxDQUFDLFNBQVMsRUFBRSxJQUFJLENBQUMsQ0FBQztRQUZSLGNBQVMsR0FBVCxTQUFTLENBQW1EO1FBQ25DLFNBQUksR0FBSixJQUFJLENBQVk7SUFFNUQsQ0FBQztJQUVELE9BQU8sQ0FBQyxXQUFvQjtRQUN4QixJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDO1lBQy9CLE1BQU0sRUFBRSxJQUFJLENBQUMsTUFBTTtTQUN0QixDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUNaLENBQUM7d0dBcEJRLHFCQUFxQiw4Q0FZVixlQUFlOzRGQVoxQixxQkFBcUIsOEZDZmxDLGt4QkFlQTs7NEZEQWEscUJBQXFCO2tCQUxqQyxTQUFTOytCQUNJLGlDQUFpQzs7MEJBZ0I5QixNQUFNOzJCQUFDLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudCwgSW5qZWN0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7QWJzdHJhY3REaWFsb2dDb21wb25lbnR9IGZyb20gJy4uLy4uL21vZGVscy9hYnN0cmFjdC1kaWFsb2cuY29tcG9uZW50JztcbmltcG9ydCB7RGlhbG9nUmVzdWx0fSBmcm9tICcuLi8uLi9tb2RlbHMvRGlhbG9nUmVzdWx0JztcbmltcG9ydCB7RGlhbG9nRGF0YX0gZnJvbSAnLi4vLi4vbW9kZWxzL0RpYWxvZ0RhdGEnO1xuaW1wb3J0IHtNQVRfRElBTE9HX0RBVEEsIE1hdERpYWxvZ1JlZn0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGlhbG9nJztcblxuLyoqXG4gKiBRdWVzdGlvbiBtb2RhbCBkaWFsb2cgd2l0aCBpdHMgb3duIGxheW91dCAod2hpY2ggYXNrcyB0aGUgdXNlciBhIHF1ZXN0aW9uIGFuZCB3YWl0IGZvciB0aGUgYW5zd2VyKVxuICogYmFzZWQgb24gYSBtYXRlcmlhbCBkZXNpZ24gdGhhdCBpbmplY3RlZCBkYXRhIGFuZCBpbmhlcml0cyBmcm9tIGFuIFtBYnN0cmFjdERpYWxvZ117QGxpbmsgQWJzdHJhY3REaWFsb2dDb21wb25lbnR9LlxuICovXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ25jYy1xdWVzdGlvbi1kaWFsb2ctd2l0aC1hbnN3ZXInLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9wcm9tcHQtZGlhbG9nLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9wcm9tcHQtZGlhbG9nLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgUHJvbXB0RGlhbG9nQ29tcG9uZW50IGV4dGVuZHMgQWJzdHJhY3REaWFsb2dDb21wb25lbnQ8UHJvbXB0RGlhbG9nQ29tcG9uZW50PiB7XG4gICAgLyoqIFNldCBzdWJtaXQgYnV0dG9uIHRvIGRpc2FibGVkIG9yIGVuYWJsZWQgYWNjb3JkaW5nIHRvIHRoZSB1c2VyIGFuc3dlci4gKi9cbiAgICBwdWJsaWMgZGlzYWJsZUJ1dHRvbiA9IHRydWU7XG4gICAgcHVibGljIHByb21wdDogc3RyaW5nO1xuICAgIHB1YmxpYyBzdWJtaXRDbGljazogYm9vbGVhbjtcblxuICAgIC8qKlxuICAgICAqIE9ubHkgaW5qZWN0aW5nLlxuICAgICAqIEBwYXJhbSBkaWFsb2dSZWYgUmVmZXJlbmNlIHRvIGEgZGlhbG9nIG9wZW5lZCB2aWEgdGhlIE1hdERpYWxvZyBzZXJ2aWNlLlxuICAgICAqIEBwYXJhbSBkYXRhIEluamVjdGVkIGRhdGEgdGhhdCB3YXMgcGFzc2VkIGluIHRvIGEgZGlhbG9nLlxuICAgICAqL1xuICAgIGNvbnN0cnVjdG9yKHB1YmxpYyBkaWFsb2dSZWY6IE1hdERpYWxvZ1JlZjxQcm9tcHREaWFsb2dDb21wb25lbnQsIERpYWxvZ1Jlc3VsdD4sXG4gICAgICAgICAgICAgICAgQEluamVjdChNQVRfRElBTE9HX0RBVEEpIHB1YmxpYyBkYXRhOiBEaWFsb2dEYXRhKSB7XG4gICAgICAgIHN1cGVyKGRpYWxvZ1JlZiwgZGF0YSk7XG4gICAgfVxuXG4gICAgb25DbG9zZShpc1N1Ym1pdHRlZDogYm9vbGVhbikge1xuICAgICAgICB0aGlzLmRpYWxvZ1JlZi5jbG9zZShpc1N1Ym1pdHRlZCA/IHtcbiAgICAgICAgICAgIHByb21wdDogdGhpcy5wcm9tcHRcbiAgICAgICAgfSA6IHt9KTtcbiAgICB9XG5cbn1cbiIsIjxoMSBtYXQtZGlhbG9nLXRpdGxlPnt7ZGF0YS50aXRsZX19PC9oMT5cblxuPGRpdiBtYXQtZGlhbG9nLWNvbnRlbnQgY2xhc3M9XCJkaWFsb2ctY29udGFpbmVyIGRpYWxvZy1jb250ZW50LW1hcmdpbiBuZXRncmlmLWlucHV0IG5ldGdyaWYtaW5wdXQtZml4XCI+XG4gICAgPHNwYW4+e3tkYXRhLmNvbnRlbnR9fTwvc3Bhbj5cbiAgICA8YnI+XG4gICAgPG1hdC1mb3JtLWZpZWxkIGNsYXNzPVwiZGlhbG9nLXByb21wdC1tYXJnaW5cIiBhcHBlYXJhbmNlPVwib3V0bGluZVwiPlxuICAgICAgICA8bWF0LWxhYmVsPnt7ZGF0YS5wbGFjZWhvbGRlcn19PC9tYXQtbGFiZWw+XG4gICAgICAgIDxpbnB1dCBtYXRJbnB1dCBbKG5nTW9kZWwpXT1cInByb21wdFwiIChuZ01vZGVsQ2hhbmdlKT1cImRpc2FibGVCdXR0b24gPSAhcHJvbXB0IHx8IHByb21wdC50cmltKCkubGVuZ3RoID09PSAwXCI+XG4gICAgPC9tYXQtZm9ybS1maWVsZD5cbjwvZGl2PlxuXG48bWF0LWRpYWxvZy1hY3Rpb25zIGZ4TGF5b3V0QWxpZ249XCJlbmRcIj5cbiAgICA8YnV0dG9uIG1hdC1idXR0b24gKGNsaWNrKT1cIm9uQ2xvc2UoZmFsc2UpXCI+e3sgJ2RpYWxvZy5jbG9zZScgfCB0cmFuc2xhdGV9fTwvYnV0dG9uPlxuICAgIDxidXR0b24gbWF0LWZsYXQtYnV0dG9uIGNvbG9yPVwicHJpbWFyeVwiIFtkaXNhYmxlZF09XCJkaXNhYmxlQnV0dG9uXCIgKGNsaWNrKT1cIm9uQ2xvc2UodHJ1ZSlcIj57eyAnZGlhbG9nLnN1Ym1pdCcgfCB0cmFuc2xhdGV9fTwvYnV0dG9uPlxuPC9tYXQtZGlhbG9nLWFjdGlvbnM+XG4iXX0=