ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
63 lines • 10.9 kB
JavaScript
import { Component, ViewEncapsulation, Input, TemplateRef, NgZone } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "ng-zorro-antd-mobile/icon";
export class ToastComponent {
get content() {
return this._content;
}
set content(value) {
if (value instanceof TemplateRef) {
this.isContentString = false;
}
else {
this.isContentString = true;
}
this._zone.run(() => {
this._content = value;
});
}
get iconType() {
return this._iconType;
}
set iconType(value) {
this._zone.run(() => {
this._iconType = value;
});
}
constructor(_zone) {
this._zone = _zone;
this.prefixCls = 'am-toast';
this.isContentString = true;
this.transitionName = 'am-fade-enter am-fade-enter-active';
this._iconType = '';
this._content = '';
this.mask = true;
this.position = 'middle';
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToastComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ToastComponent, selector: "Toast", inputs: { mask: "mask", content: "content", iconType: "iconType", position: "position" }, host: { properties: { "class.am-toast": "true", "class.am-toast-mask": "mask", "class.am-toast-mask-top": "mask && position === 'top'", "class.am-toast-mask-middle": "mask && position === 'middle'", "class.am-toast-mask-bottom": "mask && position === 'bottom'", "class.am-toast-nomask": "!mask", "class.am-toast-nomask-top": "!mask && position === 'top'", "class.am-toast-nomask-middle": "!mask && position === 'middle'", "class.am-toast-nomask-bottom": "!mask && position === 'bottom'" } }, ngImport: i0, template: "<div class=\"{{ prefixCls }}-notice {{ prefixCls }}-notice-closable {{ transitionName }}\">\n <div class=\"{{ prefixCls }}-notice-content\">\n <div role=\"alert\" *ngIf=\"iconType\" class=\"{{ prefixCls }}-text {{ prefixCls }}-text-icon\" aria-live=\"assertive\">\n <Icon [type]=\"iconType\" [size]=\"'lg'\"></Icon>\n <div *ngIf=\"isContentString\" class=\"{{ prefixCls }}-text-info\">{{ content }}</div>\n </div>\n <div *ngIf=\"!iconType\" class=\"{{ prefixCls }}-text\" role=\"alert\" aria-live=\"assertive\">\n <div *ngIf=\"isContentString\" class=\"{{ prefixCls }}-text-info\">{{ content }}</div>\n <ng-template *ngIf=\"!isContentString\" [ngTemplateOutlet]=\"content\"></ng-template>\n </div>\n </div>\n <a class=\"{{ prefixCls }}-notice-close\">\n <span class=\"{{ prefixCls }}-notice-close-x\"></span>\n </a>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.IconComponent, selector: "Icon, nzm-icon", inputs: ["color", "type", "src", "size"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToastComponent, decorators: [{
type: Component,
args: [{ selector: 'Toast', encapsulation: ViewEncapsulation.None, host: {
'[class.am-toast]': 'true',
'[class.am-toast-mask]': 'mask',
'[class.am-toast-mask-top]': `mask && position === 'top'`,
'[class.am-toast-mask-middle]': `mask && position === 'middle'`,
'[class.am-toast-mask-bottom]': `mask && position === 'bottom'`,
'[class.am-toast-nomask]': '!mask',
'[class.am-toast-nomask-top]': `!mask && position === 'top'`,
'[class.am-toast-nomask-middle]': `!mask && position === 'middle'`,
'[class.am-toast-nomask-bottom]': `!mask && position === 'bottom'`
}, template: "<div class=\"{{ prefixCls }}-notice {{ prefixCls }}-notice-closable {{ transitionName }}\">\n <div class=\"{{ prefixCls }}-notice-content\">\n <div role=\"alert\" *ngIf=\"iconType\" class=\"{{ prefixCls }}-text {{ prefixCls }}-text-icon\" aria-live=\"assertive\">\n <Icon [type]=\"iconType\" [size]=\"'lg'\"></Icon>\n <div *ngIf=\"isContentString\" class=\"{{ prefixCls }}-text-info\">{{ content }}</div>\n </div>\n <div *ngIf=\"!iconType\" class=\"{{ prefixCls }}-text\" role=\"alert\" aria-live=\"assertive\">\n <div *ngIf=\"isContentString\" class=\"{{ prefixCls }}-text-info\">{{ content }}</div>\n <ng-template *ngIf=\"!isContentString\" [ngTemplateOutlet]=\"content\"></ng-template>\n </div>\n </div>\n <a class=\"{{ prefixCls }}-notice-close\">\n <span class=\"{{ prefixCls }}-notice-close-x\"></span>\n </a>\n</div>\n" }]
}], ctorParameters: () => [{ type: i0.NgZone }], propDecorators: { mask: [{
type: Input
}], content: [{
type: Input
}], iconType: [{
type: Input
}], position: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9hc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy90b2FzdC90b2FzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi9jb21wb25lbnRzL3RvYXN0L3RvYXN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7QUFrQnpGLE1BQU0sT0FBTyxjQUFjO0lBV3pCLElBQ0ksT0FBTztRQUNULE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUN2QixDQUFDO0lBQ0QsSUFBSSxPQUFPLENBQUMsS0FBZ0M7UUFDMUMsSUFBSSxLQUFLLFlBQVksV0FBVyxFQUFFO1lBQ2hDLElBQUksQ0FBQyxlQUFlLEdBQUcsS0FBSyxDQUFDO1NBQzlCO2FBQU07WUFDTCxJQUFJLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQztTQUM3QjtRQUNELElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLEdBQUcsRUFBRTtZQUNsQixJQUFJLENBQUMsUUFBUSxHQUFHLEtBQUssQ0FBQztRQUN4QixDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFDRCxJQUNJLFFBQVE7UUFDVixPQUFPLElBQUksQ0FBQyxTQUFTLENBQUM7SUFDeEIsQ0FBQztJQUNELElBQUksUUFBUSxDQUFDLEtBQWE7UUFDeEIsSUFBSSxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUMsR0FBRyxFQUFFO1lBQ2xCLElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1FBQ3pCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUlELFlBQW9CLEtBQWE7UUFBYixVQUFLLEdBQUwsS0FBSyxDQUFRO1FBcENqQyxjQUFTLEdBQVcsVUFBVSxDQUFDO1FBQy9CLG9CQUFlLEdBQVksSUFBSSxDQUFDO1FBRWhDLG1CQUFjLEdBQUcsb0NBQW9DLENBQUM7UUFFOUMsY0FBUyxHQUFXLEVBQUUsQ0FBQztRQUN2QixhQUFRLEdBQThCLEVBQUUsQ0FBQztRQUdqRCxTQUFJLEdBQVksSUFBSSxDQUFDO1FBeUJyQixhQUFRLEdBQVcsUUFBUSxDQUFDO0lBRVEsQ0FBQzs4R0FyQzFCLGNBQWM7a0dBQWQsY0FBYyxtbkJDbEIzQixrMkJBZUE7OzJGREdhLGNBQWM7a0JBaEIxQixTQUFTOytCQUNFLE9BQU8saUJBQ0YsaUJBQWlCLENBQUMsSUFBSSxRQUUvQjt3QkFDSixrQkFBa0IsRUFBRSxNQUFNO3dCQUMxQix1QkFBdUIsRUFBRSxNQUFNO3dCQUMvQiwyQkFBMkIsRUFBRSw0QkFBNEI7d0JBQ3pELDhCQUE4QixFQUFFLCtCQUErQjt3QkFDL0QsOEJBQThCLEVBQUUsK0JBQStCO3dCQUMvRCx5QkFBeUIsRUFBRSxPQUFPO3dCQUNsQyw2QkFBNkIsRUFBRSw2QkFBNkI7d0JBQzVELGdDQUFnQyxFQUFFLGdDQUFnQzt3QkFDbEUsZ0NBQWdDLEVBQUUsZ0NBQWdDO3FCQUNuRTsyRUFZRCxJQUFJO3NCQURILEtBQUs7Z0JBR0YsT0FBTztzQkFEVixLQUFLO2dCQWVGLFFBQVE7c0JBRFgsS0FBSztnQkFVTixRQUFRO3NCQURQLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIFZpZXdFbmNhcHN1bGF0aW9uLCBJbnB1dCwgVGVtcGxhdGVSZWYsIE5nWm9uZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdUb2FzdCcsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIHRlbXBsYXRlVXJsOiAnLi90b2FzdC5jb21wb25lbnQuaHRtbCcsXG4gIGhvc3Q6IHtcbiAgICAnW2NsYXNzLmFtLXRvYXN0XSc6ICd0cnVlJyxcbiAgICAnW2NsYXNzLmFtLXRvYXN0LW1hc2tdJzogJ21hc2snLFxuICAgICdbY2xhc3MuYW0tdG9hc3QtbWFzay10b3BdJzogYG1hc2sgJiYgcG9zaXRpb24gPT09ICd0b3AnYCxcbiAgICAnW2NsYXNzLmFtLXRvYXN0LW1hc2stbWlkZGxlXSc6IGBtYXNrICYmIHBvc2l0aW9uID09PSAnbWlkZGxlJ2AsXG4gICAgJ1tjbGFzcy5hbS10b2FzdC1tYXNrLWJvdHRvbV0nOiBgbWFzayAmJiBwb3NpdGlvbiA9PT0gJ2JvdHRvbSdgLFxuICAgICdbY2xhc3MuYW0tdG9hc3Qtbm9tYXNrXSc6ICchbWFzaycsXG4gICAgJ1tjbGFzcy5hbS10b2FzdC1ub21hc2stdG9wXSc6IGAhbWFzayAmJiBwb3NpdGlvbiA9PT0gJ3RvcCdgLFxuICAgICdbY2xhc3MuYW0tdG9hc3Qtbm9tYXNrLW1pZGRsZV0nOiBgIW1hc2sgJiYgcG9zaXRpb24gPT09ICdtaWRkbGUnYCxcbiAgICAnW2NsYXNzLmFtLXRvYXN0LW5vbWFzay1ib3R0b21dJzogYCFtYXNrICYmIHBvc2l0aW9uID09PSAnYm90dG9tJ2BcbiAgfVxufSlcbmV4cG9ydCBjbGFzcyBUb2FzdENvbXBvbmVudCB7XG4gIHByZWZpeENsczogc3RyaW5nID0gJ2FtLXRvYXN0JztcbiAgaXNDb250ZW50U3RyaW5nOiBib29sZWFuID0gdHJ1ZTtcbiAgbWFza0NsYXNzTWFwO1xuICB0cmFuc2l0aW9uTmFtZSA9ICdhbS1mYWRlLWVudGVyIGFtLWZhZGUtZW50ZXItYWN0aXZlJztcblxuICBwcml2YXRlIF9pY29uVHlwZTogc3RyaW5nID0gJyc7XG4gIHByaXZhdGUgX2NvbnRlbnQ6IHN0cmluZyB8IFRlbXBsYXRlUmVmPGFueT4gPSAnJztcblxuICBASW5wdXQoKVxuICBtYXNrOiBib29sZWFuID0gdHJ1ZTtcbiAgQElucHV0KClcbiAgZ2V0IGNvbnRlbnQoKTogc3RyaW5nIHwgVGVtcGxhdGVSZWY8YW55PiB7XG4gICAgcmV0dXJuIHRoaXMuX2NvbnRlbnQ7XG4gIH1cbiAgc2V0IGNvbnRlbnQodmFsdWU6IHN0cmluZyB8IFRlbXBsYXRlUmVmPGFueT4pIHtcbiAgICBpZiAodmFsdWUgaW5zdGFuY2VvZiBUZW1wbGF0ZVJlZikge1xuICAgICAgdGhpcy5pc0NvbnRlbnRTdHJpbmcgPSBmYWxzZTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5pc0NvbnRlbnRTdHJpbmcgPSB0cnVlO1xuICAgIH1cbiAgICB0aGlzLl96b25lLnJ1bigoKSA9PiB7XG4gICAgICB0aGlzLl9jb250ZW50ID0gdmFsdWU7XG4gICAgfSk7XG4gIH1cbiAgQElucHV0KClcbiAgZ2V0IGljb25UeXBlKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHRoaXMuX2ljb25UeXBlO1xuICB9XG4gIHNldCBpY29uVHlwZSh2YWx1ZTogc3RyaW5nKSB7XG4gICAgdGhpcy5fem9uZS5ydW4oKCkgPT4ge1xuICAgICAgdGhpcy5faWNvblR5cGUgPSB2YWx1ZTtcbiAgICB9KTtcbiAgfVxuICBASW5wdXQoKVxuICBwb3NpdGlvbjogc3RyaW5nID0gJ21pZGRsZSc7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBfem9uZTogTmdab25lKSB7fVxufVxuIiwiPGRpdiBjbGFzcz1cInt7IHByZWZpeENscyB9fS1ub3RpY2Uge3sgcHJlZml4Q2xzIH19LW5vdGljZS1jbG9zYWJsZSB7eyB0cmFuc2l0aW9uTmFtZSB9fVwiPlxuICA8ZGl2IGNsYXNzPVwie3sgcHJlZml4Q2xzIH19LW5vdGljZS1jb250ZW50XCI+XG4gICAgPGRpdiByb2xlPVwiYWxlcnRcIiAqbmdJZj1cImljb25UeXBlXCIgY2xhc3M9XCJ7eyBwcmVmaXhDbHMgfX0tdGV4dCB7eyBwcmVmaXhDbHMgfX0tdGV4dC1pY29uXCIgYXJpYS1saXZlPVwiYXNzZXJ0aXZlXCI+XG4gICAgICA8SWNvbiBbdHlwZV09XCJpY29uVHlwZVwiIFtzaXplXT1cIidsZydcIj48L0ljb24+XG4gICAgICA8ZGl2ICpuZ0lmPVwiaXNDb250ZW50U3RyaW5nXCIgY2xhc3M9XCJ7eyBwcmVmaXhDbHMgfX0tdGV4dC1pbmZvXCI+e3sgY29udGVudCB9fTwvZGl2PlxuICAgIDwvZGl2PlxuICAgIDxkaXYgKm5nSWY9XCIhaWNvblR5cGVcIiBjbGFzcz1cInt7IHByZWZpeENscyB9fS10ZXh0XCIgcm9sZT1cImFsZXJ0XCIgYXJpYS1saXZlPVwiYXNzZXJ0aXZlXCI+XG4gICAgICA8ZGl2ICpuZ0lmPVwiaXNDb250ZW50U3RyaW5nXCIgY2xhc3M9XCJ7eyBwcmVmaXhDbHMgfX0tdGV4dC1pbmZvXCI+e3sgY29udGVudCB9fTwvZGl2PlxuICAgICAgPG5nLXRlbXBsYXRlICpuZ0lmPVwiIWlzQ29udGVudFN0cmluZ1wiIFtuZ1RlbXBsYXRlT3V0bGV0XT1cImNvbnRlbnRcIj48L25nLXRlbXBsYXRlPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgPGEgY2xhc3M9XCJ7eyBwcmVmaXhDbHMgfX0tbm90aWNlLWNsb3NlXCI+XG4gICAgPHNwYW4gY2xhc3M9XCJ7eyBwcmVmaXhDbHMgfX0tbm90aWNlLWNsb3NlLXhcIj48L3NwYW4+XG4gIDwvYT5cbjwvZGl2PlxuIl19