1 | (function (global, factory) {
|
2 | typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('primeng/dom'), require('primeng/api'), require('@angular/animations')) :
|
3 | typeof define === 'function' && define.amd ? define('primeng/toast', ['exports', '@angular/core', '@angular/common', 'primeng/dom', 'primeng/api', '@angular/animations'], factory) :
|
4 | (global = global || self, factory((global.primeng = global.primeng || {}, global.primeng.toast = {}), global.ng.core, global.ng.common, global.primeng.dom, global.primeng.api, global.ng.animations));
|
5 | }(this, (function (exports, core, common, dom, api, animations) { 'use strict';
|
6 |
|
7 | var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
8 | var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
9 | if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
10 | else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
11 | return c > 3 && r && Object.defineProperty(target, key, r), r;
|
12 | };
|
13 | var __read = (this && this.__read) || function (o, n) {
|
14 | var m = typeof Symbol === "function" && o[Symbol.iterator];
|
15 | if (!m) return o;
|
16 | var i = m.call(o), r, ar = [], e;
|
17 | try {
|
18 | while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
19 | }
|
20 | catch (error) { e = { error: error }; }
|
21 | finally {
|
22 | try {
|
23 | if (r && !r.done && (m = i["return"])) m.call(i);
|
24 | }
|
25 | finally { if (e) throw e.error; }
|
26 | }
|
27 | return ar;
|
28 | };
|
29 | var __spread = (this && this.__spread) || function () {
|
30 | for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i]));
|
31 | return ar;
|
32 | };
|
33 | var ToastItem = (function () {
|
34 | function ToastItem(zone) {
|
35 | this.zone = zone;
|
36 | this.onClose = new core.EventEmitter();
|
37 | }
|
38 | ToastItem.prototype.ngAfterViewInit = function () {
|
39 | this.initTimeout();
|
40 | };
|
41 | ToastItem.prototype.initTimeout = function () {
|
42 | var _this = this;
|
43 | if (!this.message.sticky) {
|
44 | this.zone.runOutsideAngular(function () {
|
45 | _this.timeout = setTimeout(function () {
|
46 | _this.onClose.emit({
|
47 | index: _this.index,
|
48 | message: _this.message
|
49 | });
|
50 | }, _this.message.life || 3000);
|
51 | });
|
52 | }
|
53 | };
|
54 | ToastItem.prototype.clearTimeout = function () {
|
55 | if (this.timeout) {
|
56 | clearTimeout(this.timeout);
|
57 | this.timeout = null;
|
58 | }
|
59 | };
|
60 | ToastItem.prototype.onMouseEnter = function () {
|
61 | this.clearTimeout();
|
62 | };
|
63 | ToastItem.prototype.onMouseLeave = function () {
|
64 | this.initTimeout();
|
65 | };
|
66 | ToastItem.prototype.onCloseIconClick = function (event) {
|
67 | this.clearTimeout();
|
68 | this.onClose.emit({
|
69 | index: this.index,
|
70 | message: this.message
|
71 | });
|
72 | event.preventDefault();
|
73 | };
|
74 | ToastItem.prototype.ngOnDestroy = function () {
|
75 | this.clearTimeout();
|
76 | };
|
77 | ToastItem.ctorParameters = function () { return [
|
78 | { type: core.NgZone }
|
79 | ]; };
|
80 | __decorate([
|
81 | core.Input()
|
82 | ], ToastItem.prototype, "message", void 0);
|
83 | __decorate([
|
84 | core.Input()
|
85 | ], ToastItem.prototype, "index", void 0);
|
86 | __decorate([
|
87 | core.Input()
|
88 | ], ToastItem.prototype, "template", void 0);
|
89 | __decorate([
|
90 | core.Input()
|
91 | ], ToastItem.prototype, "showTransformOptions", void 0);
|
92 | __decorate([
|
93 | core.Input()
|
94 | ], ToastItem.prototype, "hideTransformOptions", void 0);
|
95 | __decorate([
|
96 | core.Input()
|
97 | ], ToastItem.prototype, "showTransitionOptions", void 0);
|
98 | __decorate([
|
99 | core.Input()
|
100 | ], ToastItem.prototype, "hideTransitionOptions", void 0);
|
101 | __decorate([
|
102 | core.Output()
|
103 | ], ToastItem.prototype, "onClose", void 0);
|
104 | __decorate([
|
105 | core.ViewChild('container')
|
106 | ], ToastItem.prototype, "containerViewChild", void 0);
|
107 | ToastItem = __decorate([
|
108 | core.Component({
|
109 | selector: 'p-toastItem',
|
110 | template: "\n <div #container [attr.id]=\"message.id\" class=\"ui-toast-message ui-shadow\" [@messageState]=\"{value: 'visible', params: {showTransformParams: showTransformOptions, hideTransformParams: hideTransformOptions, showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions}}\"\n [ngClass]=\"{'ui-toast-message-info': message.severity == 'info','ui-toast-message-warn': message.severity == 'warn',\n 'ui-toast-message-error': message.severity == 'error','ui-toast-message-success': message.severity == 'success'}\"\n (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" role=\"alert\" aria-live=\"assertive\" aria-atomic=\"true\">\n <div class=\"ui-toast-message-content\">\n <a tabindex=\"0\" class=\"ui-toast-close-icon pi pi-times\" (click)=\"onCloseIconClick($event)\" (keydown.enter)=\"onCloseIconClick($event)\" *ngIf=\"message.closable !== false\"></a>\n <ng-container *ngIf=\"!template\">\n <span class=\"ui-toast-icon pi\"\n [ngClass]=\"{'pi-info-circle': message.severity == 'info', 'pi-exclamation-triangle': message.severity == 'warn',\n 'pi-times-circle': message.severity == 'error', 'pi-check' :message.severity == 'success'}\"></span>\n <div class=\"ui-toast-message-text-content\">\n <div class=\"ui-toast-summary\">{{message.summary}}</div>\n <div class=\"ui-toast-detail\">{{message.detail}}</div>\n </div>\n </ng-container>\n <ng-container *ngTemplateOutlet=\"template; context: {$implicit: message}\"></ng-container>\n </div>\n </div>\n ",
|
111 | animations: [
|
112 | animations.trigger('messageState', [
|
113 | animations.state('visible', animations.style({
|
114 | transform: 'translateY(0)',
|
115 | opacity: 1
|
116 | })),
|
117 | animations.transition('void => *', [
|
118 | animations.style({ transform: '{{showTransformParams}}', opacity: 0 }),
|
119 | animations.animate('{{showTransitionParams}}')
|
120 | ]),
|
121 | animations.transition('* => void', [
|
122 | animations.animate(('{{hideTransitionParams}}'), animations.style({
|
123 | height: 0,
|
124 | opacity: 0,
|
125 | transform: '{{hideTransformParams}}'
|
126 | }))
|
127 | ])
|
128 | ])
|
129 | ]
|
130 | })
|
131 | ], ToastItem);
|
132 | return ToastItem;
|
133 | }());
|
134 | var Toast = (function () {
|
135 | function Toast(messageService, cd) {
|
136 | this.messageService = messageService;
|
137 | this.cd = cd;
|
138 | this.autoZIndex = true;
|
139 | this.baseZIndex = 0;
|
140 | this.position = 'top-right';
|
141 | this.preventOpenDuplicates = false;
|
142 | this.preventDuplicates = false;
|
143 | this.showTransformOptions = 'translateY(100%)';
|
144 | this.hideTransformOptions = 'translateY(-100%)';
|
145 | this.showTransitionOptions = '300ms ease-out';
|
146 | this.hideTransitionOptions = '250ms ease-in';
|
147 | this.onClose = new core.EventEmitter();
|
148 | }
|
149 | Toast.prototype.ngOnInit = function () {
|
150 | var _this = this;
|
151 | this.messageSubscription = this.messageService.messageObserver.subscribe(function (messages) {
|
152 | if (messages) {
|
153 | if (messages instanceof Array) {
|
154 | var filteredMessages = messages.filter(function (m) { return _this.canAdd(m); });
|
155 | _this.add(filteredMessages);
|
156 | }
|
157 | else if (_this.canAdd(messages)) {
|
158 | _this.add([messages]);
|
159 | }
|
160 | if (_this.modal && _this.messages && _this.messages.length) {
|
161 | _this.enableModality();
|
162 | }
|
163 | }
|
164 | });
|
165 | this.clearSubscription = this.messageService.clearObserver.subscribe(function (key) {
|
166 | if (key) {
|
167 | if (_this.key === key) {
|
168 | _this.messages = null;
|
169 | }
|
170 | }
|
171 | else {
|
172 | _this.messages = null;
|
173 | }
|
174 | if (_this.modal) {
|
175 | _this.disableModality();
|
176 | }
|
177 | });
|
178 | };
|
179 | Toast.prototype.add = function (messages) {
|
180 | this.messages = this.messages ? __spread(this.messages, messages) : __spread(messages);
|
181 | if (this.preventDuplicates) {
|
182 | this.messagesArchieve = this.messagesArchieve ? __spread(this.messagesArchieve, messages) : __spread(messages);
|
183 | }
|
184 | };
|
185 | Toast.prototype.canAdd = function (message) {
|
186 | var allow = this.key === message.key;
|
187 | if (allow && this.preventOpenDuplicates) {
|
188 | allow = !this.containsMessage(this.messages, message);
|
189 | }
|
190 | if (allow && this.preventDuplicates) {
|
191 | allow = !this.containsMessage(this.messagesArchieve, message);
|
192 | }
|
193 | return allow;
|
194 | };
|
195 | Toast.prototype.containsMessage = function (collection, message) {
|
196 | if (!collection) {
|
197 | return false;
|
198 | }
|
199 | return collection.find(function (m) {
|
200 | return ((m.summary === message.summary) && (m.detail == message.detail) && (m.severity === message.severity));
|
201 | }) != null;
|
202 | };
|
203 | Toast.prototype.ngAfterContentInit = function () {
|
204 | var _this = this;
|
205 | this.templates.forEach(function (item) {
|
206 | switch (item.getType()) {
|
207 | case 'message':
|
208 | _this.template = item.template;
|
209 | break;
|
210 | default:
|
211 | _this.template = item.template;
|
212 | break;
|
213 | }
|
214 | });
|
215 | };
|
216 | Toast.prototype.onMessageClose = function (event) {
|
217 | this.messages.splice(event.index, 1);
|
218 | if (this.messages.length === 0) {
|
219 | this.disableModality();
|
220 | }
|
221 | this.onClose.emit({
|
222 | message: event.message
|
223 | });
|
224 | this.cd.detectChanges();
|
225 | };
|
226 | Toast.prototype.enableModality = function () {
|
227 | if (!this.mask) {
|
228 | this.mask = document.createElement('div');
|
229 | this.mask.style.zIndex = String(parseInt(this.containerViewChild.nativeElement.style.zIndex) - 1);
|
230 | this.mask.style.display = 'block';
|
231 | var maskStyleClass = 'ui-widget-overlay ui-dialog-mask';
|
232 | dom.DomHandler.addMultipleClasses(this.mask, maskStyleClass);
|
233 | document.body.appendChild(this.mask);
|
234 | }
|
235 | };
|
236 | Toast.prototype.disableModality = function () {
|
237 | if (this.mask) {
|
238 | document.body.removeChild(this.mask);
|
239 | this.mask = null;
|
240 | }
|
241 | };
|
242 | Toast.prototype.onAnimationStart = function (event) {
|
243 | if (event.fromState === 'void' && this.autoZIndex) {
|
244 | this.containerViewChild.nativeElement.style.zIndex = String(this.baseZIndex + (++dom.DomHandler.zindex));
|
245 | }
|
246 | };
|
247 | Toast.prototype.ngOnDestroy = function () {
|
248 | if (this.messageSubscription) {
|
249 | this.messageSubscription.unsubscribe();
|
250 | }
|
251 | if (this.clearSubscription) {
|
252 | this.clearSubscription.unsubscribe();
|
253 | }
|
254 | this.disableModality();
|
255 | };
|
256 | Toast.ctorParameters = function () { return [
|
257 | { type: api.MessageService },
|
258 | { type: core.ChangeDetectorRef }
|
259 | ]; };
|
260 | __decorate([
|
261 | core.Input()
|
262 | ], Toast.prototype, "key", void 0);
|
263 | __decorate([
|
264 | core.Input()
|
265 | ], Toast.prototype, "autoZIndex", void 0);
|
266 | __decorate([
|
267 | core.Input()
|
268 | ], Toast.prototype, "baseZIndex", void 0);
|
269 | __decorate([
|
270 | core.Input()
|
271 | ], Toast.prototype, "style", void 0);
|
272 | __decorate([
|
273 | core.Input()
|
274 | ], Toast.prototype, "styleClass", void 0);
|
275 | __decorate([
|
276 | core.Input()
|
277 | ], Toast.prototype, "position", void 0);
|
278 | __decorate([
|
279 | core.Input()
|
280 | ], Toast.prototype, "modal", void 0);
|
281 | __decorate([
|
282 | core.Input()
|
283 | ], Toast.prototype, "preventOpenDuplicates", void 0);
|
284 | __decorate([
|
285 | core.Input()
|
286 | ], Toast.prototype, "preventDuplicates", void 0);
|
287 | __decorate([
|
288 | core.Input()
|
289 | ], Toast.prototype, "showTransformOptions", void 0);
|
290 | __decorate([
|
291 | core.Input()
|
292 | ], Toast.prototype, "hideTransformOptions", void 0);
|
293 | __decorate([
|
294 | core.Input()
|
295 | ], Toast.prototype, "showTransitionOptions", void 0);
|
296 | __decorate([
|
297 | core.Input()
|
298 | ], Toast.prototype, "hideTransitionOptions", void 0);
|
299 | __decorate([
|
300 | core.Output()
|
301 | ], Toast.prototype, "onClose", void 0);
|
302 | __decorate([
|
303 | core.ViewChild('container')
|
304 | ], Toast.prototype, "containerViewChild", void 0);
|
305 | __decorate([
|
306 | core.ContentChildren(api.PrimeTemplate)
|
307 | ], Toast.prototype, "templates", void 0);
|
308 | Toast = __decorate([
|
309 | core.Component({
|
310 | selector: 'p-toast',
|
311 | template: "\n <div #container [ngClass]=\"{'ui-toast ui-widget': true, \n 'ui-toast-top-right': position === 'top-right',\n 'ui-toast-top-left': position === 'top-left',\n 'ui-toast-bottom-right': position === 'bottom-right',\n 'ui-toast-bottom-left': position === 'bottom-left',\n 'ui-toast-top-center': position === 'top-center',\n 'ui-toast-bottom-center': position === 'bottom-center',\n 'ui-toast-center': position === 'center'}\" \n [ngStyle]=\"style\" [class]=\"styleClass\">\n <p-toastItem *ngFor=\"let msg of messages; let i=index\" [message]=\"msg\" [index]=\"i\" (onClose)=\"onMessageClose($event)\"\n [template]=\"template\" @toastAnimation (@toastAnimation.start)=\"onAnimationStart($event)\" \n [showTransformOptions]=\"showTransformOptions\" [hideTransformOptions]=\"hideTransformOptions\" \n [showTransitionOptions]=\"showTransitionOptions\" [hideTransitionOptions]=\"hideTransitionOptions\"></p-toastItem>\n </div>\n ",
|
312 | animations: [
|
313 | animations.trigger('toastAnimation', [
|
314 | animations.transition(':enter, :leave', [
|
315 | animations.query('@*', animations.animateChild())
|
316 | ])
|
317 | ])
|
318 | ],
|
319 | changeDetection: core.ChangeDetectionStrategy.Default
|
320 | })
|
321 | ], Toast);
|
322 | return Toast;
|
323 | }());
|
324 | var ToastModule = (function () {
|
325 | function ToastModule() {
|
326 | }
|
327 | ToastModule = __decorate([
|
328 | core.NgModule({
|
329 | imports: [common.CommonModule],
|
330 | exports: [Toast, api.SharedModule],
|
331 | declarations: [Toast, ToastItem]
|
332 | })
|
333 | ], ToastModule);
|
334 | return ToastModule;
|
335 | }());
|
336 |
|
337 | exports.Toast = Toast;
|
338 | exports.ToastItem = ToastItem;
|
339 | exports.ToastModule = ToastModule;
|
340 |
|
341 | Object.defineProperty(exports, '__esModule', { value: true });
|
342 |
|
343 | })));
|
344 |
|