UNPKG

@angular-mdl/core

Version:

Angular components, directives and styles based on material design lite https://getmdl.io.

106 lines 10.2 kB
import { Component, forwardRef, HostListener, Inject, ViewChildren, ViewEncapsulation, } from "@angular/core"; import { MDL_CONFIGUARTION } from "./config"; import { MdlButtonComponent } from "../button/mdl-button.component"; import { MdlDialogReference } from "./mdl-dialog-reference"; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; import * as i2 from "../button/mdl-button.component"; import * as i3 from "./mdl-dialog-reference"; export class MdlSimpleDialogComponent { // why do i need forwardRef at this point, the demo LoginDialog dosn't need this!?!? constructor(dialogConfiguration, dialog) { this.dialogConfiguration = dialogConfiguration; this.dialog = dialog; this.dialog = dialog; dialog.onVisible().subscribe(() => { if (this.buttons) { this.buttons.first.elementRef.nativeElement.focus(); } }); } onEsc() { // run the first action that is marked as closing action const closeAction = this.dialogConfiguration.actions.find((action) => action.isClosingAction); if (closeAction) { closeAction.handler(); this.dialog.hide(); } } actionClicked(action) { action.handler(); this.dialog.hide(); } } MdlSimpleDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: MdlSimpleDialogComponent, deps: [{ token: forwardRef(() => MDL_CONFIGUARTION) }, { token: forwardRef(() => MdlDialogReference) }], target: i0.ɵɵFactoryTarget.Component }); MdlSimpleDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: MdlSimpleDialogComponent, selector: "mdl-dialog-component", host: { listeners: { "keydown.esc": "onEsc()" } }, viewQueries: [{ propertyName: "buttons", predicate: MdlButtonComponent, descendants: true }], ngImport: i0, template: ` <h3 class="mdl-dialog__title" *ngIf="dialogConfiguration?.title"> {{ dialogConfiguration?.title }} </h3> <div class="mdl-dialog__content" [innerHTML]="dialogConfiguration?.message" ></div> <div class="mdl-dialog__actions" [ngClass]="{ 'mdl-dialog__actions--full-width': dialogConfiguration?.fullWidthAction }" > <button mdl-button mdl-colored="primary" type="button" *ngFor="let action of dialogConfiguration?.actions" (click)="actionClicked(action)" [ngClass]="{ close: action.isClosingAction }" > {{ action.text }} </button> </div> `, isInline: true, 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: i2.MdlButtonComponent, selector: "mdl-button, button[mdl-button], a[mdl-button]", inputs: ["mdl-button-type", "mdl-colored", "disabled"], exportAs: ["mdlButton"] }], encapsulation: i0.ViewEncapsulation.None }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: MdlSimpleDialogComponent, decorators: [{ type: Component, args: [{ selector: "mdl-dialog-component", template: ` <h3 class="mdl-dialog__title" *ngIf="dialogConfiguration?.title"> {{ dialogConfiguration?.title }} </h3> <div class="mdl-dialog__content" [innerHTML]="dialogConfiguration?.message" ></div> <div class="mdl-dialog__actions" [ngClass]="{ 'mdl-dialog__actions--full-width': dialogConfiguration?.fullWidthAction }" > <button mdl-button mdl-colored="primary" type="button" *ngFor="let action of dialogConfiguration?.actions" (click)="actionClicked(action)" [ngClass]="{ close: action.isClosingAction }" > {{ action.text }} </button> </div> `, encapsulation: ViewEncapsulation.None, }] }], ctorParameters: function () { return [{ type: undefined, decorators: [{ type: Inject, args: [forwardRef(() => MDL_CONFIGUARTION)] }] }, { type: i3.MdlDialogReference, decorators: [{ type: Inject, args: [forwardRef(() => MdlDialogReference)] }] }]; }, propDecorators: { buttons: [{ type: ViewChildren, args: [MdlButtonComponent] }], onEsc: [{ type: HostListener, args: ["keydown.esc"] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWRsLXNpbXBsZS1kaWFsb2cuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29yZS9zcmMvbGliL2RpYWxvZy9tZGwtc2ltcGxlLWRpYWxvZy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxVQUFVLEVBQ1YsWUFBWSxFQUNaLE1BQU0sRUFFTixZQUFZLEVBQ1osaUJBQWlCLEdBQ2xCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFVBQVUsQ0FBQztBQUs3QyxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7Ozs7QUFnQzVELE1BQU0sT0FBTyx3QkFBd0I7SUFJbkMsb0ZBQW9GO0lBQ3BGLFlBRVMsbUJBQWtELEVBRWxELE1BQTBCO1FBRjFCLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBK0I7UUFFbEQsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFFakMsSUFBSSxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7UUFFckIsTUFBTSxDQUFDLFNBQVMsRUFBRSxDQUFDLFNBQVMsQ0FBQyxHQUFHLEVBQUU7WUFDaEMsSUFBSSxJQUFJLENBQUMsT0FBTyxFQUFFO2dCQUNoQixJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLEtBQUssRUFBRSxDQUFDO2FBQ3JEO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBR0QsS0FBSztRQUNILHdEQUF3RDtRQUN4RCxNQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsbUJBQW1CLENBQUMsT0FBTyxDQUFDLElBQUksQ0FDdkQsQ0FBQyxNQUFNLEVBQUUsRUFBRSxDQUFDLE1BQU0sQ0FBQyxlQUFlLENBQ25DLENBQUM7UUFDRixJQUFJLFdBQVcsRUFBRTtZQUNmLFdBQVcsQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUN0QixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxDQUFDO1NBQ3BCO0lBQ0gsQ0FBQztJQUVELGFBQWEsQ0FBQyxNQUF3QjtRQUNwQyxNQUFNLENBQUMsT0FBTyxFQUFFLENBQUM7UUFDakIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUNyQixDQUFDOztxSEFuQ1Usd0JBQXdCLGtCQU16QixVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsaUJBQWlCLENBQUMsYUFFbkMsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLGtCQUFrQixDQUFDO3lHQVJuQyx3QkFBd0IsMklBQ3JCLGtCQUFrQixnREE3QnRCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBeUJUOzJGQUdVLHdCQUF3QjtrQkE5QnBDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLHNCQUFzQjtvQkFDaEMsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBeUJUO29CQUNELGFBQWEsRUFBRSxpQkFBaUIsQ0FBQyxJQUFJO2lCQUN0Qzs7MEJBT0ksTUFBTTsyQkFBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsaUJBQWlCLENBQUM7OzBCQUUxQyxNQUFNOzJCQUFDLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQzs0Q0FOOUMsT0FBTztzQkFETixZQUFZO3VCQUFDLGtCQUFrQjtnQkFvQmhDLEtBQUs7c0JBREosWUFBWTt1QkFBQyxhQUFhIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBmb3J3YXJkUmVmLFxuICBIb3N0TGlzdGVuZXIsXG4gIEluamVjdCxcbiAgUXVlcnlMaXN0LFxuICBWaWV3Q2hpbGRyZW4sXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgTURMX0NPTkZJR1VBUlRJT04gfSBmcm9tIFwiLi9jb25maWdcIjtcbmltcG9ydCB7XG4gIElNZGxEaWFsb2dBY3Rpb24sXG4gIElNZGxTaW1wbGVEaWFsb2dDb25maWd1cmF0aW9uLFxufSBmcm9tIFwiLi9tZGwtZGlhbG9nLWNvbmZpZ3VyYXRpb25cIjtcbmltcG9ydCB7IE1kbEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gXCIuLi9idXR0b24vbWRsLWJ1dHRvbi5jb21wb25lbnRcIjtcbmltcG9ydCB7IE1kbERpYWxvZ1JlZmVyZW5jZSB9IGZyb20gXCIuL21kbC1kaWFsb2ctcmVmZXJlbmNlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJtZGwtZGlhbG9nLWNvbXBvbmVudFwiLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxoMyBjbGFzcz1cIm1kbC1kaWFsb2dfX3RpdGxlXCIgKm5nSWY9XCJkaWFsb2dDb25maWd1cmF0aW9uPy50aXRsZVwiPlxuICAgICAge3sgZGlhbG9nQ29uZmlndXJhdGlvbj8udGl0bGUgfX1cbiAgICA8L2gzPlxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwibWRsLWRpYWxvZ19fY29udGVudFwiXG4gICAgICBbaW5uZXJIVE1MXT1cImRpYWxvZ0NvbmZpZ3VyYXRpb24/Lm1lc3NhZ2VcIlxuICAgID48L2Rpdj5cbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cIm1kbC1kaWFsb2dfX2FjdGlvbnNcIlxuICAgICAgW25nQ2xhc3NdPVwie1xuICAgICAgICAnbWRsLWRpYWxvZ19fYWN0aW9ucy0tZnVsbC13aWR0aCc6IGRpYWxvZ0NvbmZpZ3VyYXRpb24/LmZ1bGxXaWR0aEFjdGlvblxuICAgICAgfVwiXG4gICAgPlxuICAgICAgPGJ1dHRvblxuICAgICAgICBtZGwtYnV0dG9uXG4gICAgICAgIG1kbC1jb2xvcmVkPVwicHJpbWFyeVwiXG4gICAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgICAqbmdGb3I9XCJsZXQgYWN0aW9uIG9mIGRpYWxvZ0NvbmZpZ3VyYXRpb24/LmFjdGlvbnNcIlxuICAgICAgICAoY2xpY2spPVwiYWN0aW9uQ2xpY2tlZChhY3Rpb24pXCJcbiAgICAgICAgW25nQ2xhc3NdPVwieyBjbG9zZTogYWN0aW9uLmlzQ2xvc2luZ0FjdGlvbiB9XCJcbiAgICAgID5cbiAgICAgICAge3sgYWN0aW9uLnRleHQgfX1cbiAgICAgIDwvYnV0dG9uPlxuICAgIDwvZGl2PlxuICBgLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxufSlcbmV4cG9ydCBjbGFzcyBNZGxTaW1wbGVEaWFsb2dDb21wb25lbnQge1xuICBAVmlld0NoaWxkcmVuKE1kbEJ1dHRvbkNvbXBvbmVudClcbiAgYnV0dG9uczogUXVlcnlMaXN0PE1kbEJ1dHRvbkNvbXBvbmVudD4gfCB1bmRlZmluZWQ7XG5cbiAgLy8gd2h5IGRvIGkgbmVlZCBmb3J3YXJkUmVmIGF0IHRoaXMgcG9pbnQsIHRoZSBkZW1vIExvZ2luRGlhbG9nIGRvc24ndCBuZWVkIHRoaXMhPyE/XG4gIGNvbnN0cnVjdG9yKFxuICAgIEBJbmplY3QoZm9yd2FyZFJlZigoKSA9PiBNRExfQ09ORklHVUFSVElPTikpXG4gICAgcHVibGljIGRpYWxvZ0NvbmZpZ3VyYXRpb246IElNZGxTaW1wbGVEaWFsb2dDb25maWd1cmF0aW9uLFxuICAgIEBJbmplY3QoZm9yd2FyZFJlZigoKSA9PiBNZGxEaWFsb2dSZWZlcmVuY2UpKVxuICAgIHB1YmxpYyBkaWFsb2c6IE1kbERpYWxvZ1JlZmVyZW5jZVxuICApIHtcbiAgICB0aGlzLmRpYWxvZyA9IGRpYWxvZztcblxuICAgIGRpYWxvZy5vblZpc2libGUoKS5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgaWYgKHRoaXMuYnV0dG9ucykge1xuICAgICAgICB0aGlzLmJ1dHRvbnMuZmlyc3QuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LmZvY3VzKCk7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cblxuICBASG9zdExpc3RlbmVyKFwia2V5ZG93bi5lc2NcIilcbiAgb25Fc2MoKTogdm9pZCB7XG4gICAgLy8gcnVuIHRoZSBmaXJzdCBhY3Rpb24gdGhhdCBpcyBtYXJrZWQgYXMgY2xvc2luZyBhY3Rpb25cbiAgICBjb25zdCBjbG9zZUFjdGlvbiA9IHRoaXMuZGlhbG9nQ29uZmlndXJhdGlvbi5hY3Rpb25zLmZpbmQoXG4gICAgICAoYWN0aW9uKSA9PiBhY3Rpb24uaXNDbG9zaW5nQWN0aW9uXG4gICAgKTtcbiAgICBpZiAoY2xvc2VBY3Rpb24pIHtcbiAgICAgIGNsb3NlQWN0aW9uLmhhbmRsZXIoKTtcbiAgICAgIHRoaXMuZGlhbG9nLmhpZGUoKTtcbiAgICB9XG4gIH1cblxuICBhY3Rpb25DbGlja2VkKGFjdGlvbjogSU1kbERpYWxvZ0FjdGlvbik6IHZvaWQge1xuICAgIGFjdGlvbi5oYW5kbGVyKCk7XG4gICAgdGhpcy5kaWFsb2cuaGlkZSgpO1xuICB9XG59XG4iXX0=