ngx-toast-notifications
Version:
Toast notifications for Angular applications
16 lines (14 loc) • 12.6 kB
JavaScript
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/animations"),require("rxjs")):"function"==typeof define&&define.amd?define("ngx-toast-notifications",["exports","@angular/core","@angular/common","@angular/animations","rxjs"],e):e((t=t||self)["ngx-toast-notifications"]={},t.ng.core,t.ng.common,t.ng.animations,t.rxjs)}(this,(function(t,e,o,n,r){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */var i=function(){return(i=Object.assign||function(t){for(var e,o=1,n=arguments.length;o<n;o++)for(var r in e=arguments[o])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};var a=function(){function t(t,e){this._onClose=new r.Subject,this.autoClose=t.autoClose,this.duration=t.duration>0?t.duration:0,this.text=t.text,this.caption=t.caption,this.type=t.type,this.component=t.component,this._closeFunction=e,this._setTimeout()}return Object.defineProperty(t.prototype,"onClose",{get:function(){return this._onClose.asObservable()},enumerable:!0,configurable:!0}),t.prototype.close=function(t){this._onClose.closed||(this._onClose.next(t),this._onClose.complete()),this._closeFunction(this),this._clearTimeout()},t.prototype._setTimeout=function(){var t=this;this.autoClose&&this.duration>0&&(this._timeoutId=setTimeout((function(){return t.close()}),this.duration))},t.prototype._clearTimeout=function(){this._timeoutId&&clearTimeout(this._timeoutId)},t}();var s=n.transition("* => *",[n.query("@*",n.animateChild(),{optional:!0})]),c=n.transition("void => *",[n.style({height:0,opacity:0,"margin-top":0}),n.animate(200,n.style({height:"*",opacity:1,"margin-top":"1rem"}))]),l=n.transition("* => void",[n.style({height:"!",opacity:1,"margin-top":"1rem"}),n.animate(150,n.style({height:0,opacity:0,"margin-top":0}))]),p=n.transition("void => *",[n.style({width:0,opacity:0}),n.animate("{{duration}}",n.style({width:"100%",opacity:1}))]),d=function(){function t(t){this._changeDetector=t,this.tl=[],this.tc=[],this.tr=[],this.bl=[],this.bc=[],this.br=[]}return t.prototype.add=function(t){var e=this,o=this._getCollection(t.position);if(t.preventDuplicates&&this._isDuplicate(o,t))return null;var n=new a(t,(function(t){return e._delete(o,t)}));return o.push(n),this._changeDetector.detectChanges(),n},t.prototype._delete=function(t,e){t.splice(t.indexOf(e),1),this._changeDetector.detectChanges()},t.prototype._isDuplicate=function(t,e){return t.some((function(t){return t.type===e.type&&t.component===e.component&&t.caption===e.caption&&t.text===e.text}))},t.prototype._getCollection=function(t){switch(t){case"top-left":return this.tl;case"top-center":return this.tc;case"top-right":return this.tr;case"bottom-left":return this.bl;case"bottom-center":return this.bc;default:return this.br}},t.decorators=[{type:e.Component,args:[{template:'<ng-template #toastPanel let-toasts>\r\n <div *ngFor="let toast of toasts" [@nested]>\r\n <div class="toast-card" [ngClass]="toast.type || \'light\'" [@shrink]>\r\n <ng-template toastContent [toast]="toast"></ng-template>\r\n <div *ngIf="toast.autoClose"\r\n class="lifetime-progress"\r\n role="progressbar"\r\n [@progress]="{value: \'*\', params: {duration: toast.duration + \'ms\'}}"></div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<div class="toast-overlay">\r\n <div class="toast-panel top-center">\r\n <ng-container *ngTemplateOutlet="toastPanel; context: {$implicit: tc}"></ng-container>\r\n </div>\r\n <div class="toast-panel top-left">\r\n <ng-container *ngTemplateOutlet="toastPanel; context: {$implicit: tl}"></ng-container>\r\n </div>\r\n <div class="toast-panel top-right">\r\n <ng-container *ngTemplateOutlet="toastPanel; context: {$implicit: tr}"></ng-container>\r\n </div>\r\n <div class="toast-panel bottom-center">\r\n <ng-container *ngTemplateOutlet="toastPanel; context: {$implicit: bc}"></ng-container>\r\n </div>\r\n <div class="toast-panel bottom-left">\r\n <ng-container *ngTemplateOutlet="toastPanel; context: {$implicit: bl}"></ng-container>\r\n </div>\r\n <div class="toast-panel bottom-right">\r\n <ng-container *ngTemplateOutlet="toastPanel; context: {$implicit: br}"></ng-container>\r\n </div>\r\n</div>\r\n',animations:[n.trigger("nested",[s]),n.trigger("shrink",[c,l]),n.trigger("progress",[p])],changeDetection:e.ChangeDetectionStrategy.OnPush,styles:['.toast-overlay{pointer-events:none;position:fixed;z-index:9000;left:0;top:0;width:100%;height:100%}@media (max-width:575px){.toast-overlay{display:flex;justify-content:flex-end;flex-direction:column}}.toast-panel{width:100%;font-size:1rem;line-height:1.5;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}.toast-card{pointer-events:auto;overflow:hidden;background-clip:border-box;min-width:0;background-color:#f8f9fa;color:#212529;margin-top:1rem;box-shadow:rgba(0,0,0,.15) 0 .2rem 1.5rem .3rem}@media (min-width:576px){.toast-panel{position:absolute;max-width:20rem}.toast-panel.top-left{top:0;left:1rem}.toast-panel.top-center{top:0;left:50%;margin-left:-10rem}.toast-panel.top-right{top:0;right:1rem}.toast-panel.bottom-left{bottom:1rem;left:1rem}.toast-panel.bottom-center{bottom:1rem;left:50%;margin-left:-10rem}.toast-panel.bottom-right{bottom:1rem;right:1rem}.toast-card{border-radius:.15rem;box-shadow:rgba(0,0,0,.2) 0 .3rem .4rem -.2rem,rgba(0,0,0,.15) 0 .2rem 1.5rem .3rem}}.toast-card.danger,.toast-card.dark,.toast-card.info,.toast-card.primary,.toast-card.secondary,.toast-card.success{color:#f8f9fa}.toast-card.danger .lifetime-progress,.toast-card.dark .lifetime-progress,.toast-card.info .lifetime-progress,.toast-card.primary .lifetime-progress,.toast-card.secondary .lifetime-progress,.toast-card.success .lifetime-progress{background-color:#f8f9fa}.toast-card.light .lifetime-progress,.toast-card.primary,.toast-card.warning .lifetime-progress{background-color:#007bff}.toast-card.secondary{background-color:#868e96}.toast-card.success{background-color:#28a745}.toast-card.danger{background-color:#dc3545}.toast-card.warning{background-color:#ffc107}.toast-card.info{background-color:#17a2b8}.toast-card.light{background-color:#f8f9fa}.toast-card.dark{background-color:#343a40}.toast-card .lifetime-progress{display:flex;height:2px;width:0;border-radius:1px}']}]}],t.ctorParameters=function(){return[{type:e.ChangeDetectorRef}]},t}();var u=function(){function t(t,e,o,n,r){this._document=e,this._factoryResolver=o,this._appRef=n,this._injector=r,this._renderer=t.createRenderer(null,null)}return Object.defineProperty(t.prototype,"ref",{get:function(){return this._componentRef||this._attach(),this._componentRef},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"containerElement",{get:function(){return this._containerElement||(this._containerElement=this._renderer.createElement("div"),this._renderer.addClass(this._containerElement,"toast-container"),this._renderer.appendChild(this._document.body,this._containerElement)),this._containerElement},enumerable:!0,configurable:!0}),t.prototype.ngOnDestroy=function(){this._detach(),this._destroyContainer()},t.prototype._attach=function(){this._detach();var t=this._factoryResolver.resolveComponentFactory(d);this._componentRef=t.create(this._injector);var e=this._componentRef.hostView;this._appRef.attachView(e);var o=e.rootNodes[0];this._renderer.appendChild(this.containerElement,o)},t.prototype._detach=function(){this._componentRef&&(this._appRef.detachView(this._componentRef.hostView),this._componentRef.destroy(),this._componentRef=null)},t.prototype._destroyContainer=function(){this._containerElement&&this._containerElement.parentNode&&(this._renderer.removeChild(this._containerElement.parentNode,this._containerElement),this._containerElement=null)},t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[{type:e.RendererFactory2},{type:void 0,decorators:[{type:e.Inject,args:[o.DOCUMENT]}]},{type:e.ComponentFactoryResolver},{type:e.ApplicationRef},{type:e.Injector}]},t}();var m=new e.InjectionToken("ToastNotificationsConfig");var f=function(){function t(){}return t.decorators=[{type:e.Component,args:[{template:'<div class="close-button" (click)="toast.close()">×</div>\r\n<div class="content-body">\r\n <div *ngIf="toast.caption" class="title">{{toast.caption}}</div>\r\n <div>{{toast.text}}</div>\r\n</div>\r\n',styles:[":host{display:block;position:relative}.close-button{border:0;background:0 0;position:absolute;font-size:1.6rem;top:.5rem;right:.8rem;line-height:.6;font-weight:700;opacity:.3;color:inherit;cursor:pointer}@media (min-width:576px){.close-button{font-size:1rem;top:.3rem;right:.4rem}}.close-button:hover{opacity:1}.content-body{padding:.5rem 2.2rem .5rem .5rem;font-size:.85rem;min-height:1rem}@media (min-width:576px){.content-body{padding-right:1rem}}.content-body .title{font-weight:700}"]}]}],t.propDecorators={toast:[{type:e.Input}]},t}();var h={autoClose:!0,duration:8e3,type:"light",position:"bottom-right",component:f},g=function(){function t(t,e){this._config=t,this._containerService=e}return t.prototype.open=function(t,o){return"string"==typeof t&&(t=i({text:t},o)),t instanceof e.Type&&(t=i({},o,{component:t})),t=i({},h,this._config,t),this._containerService.ref.instance.add(t)},t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[{type:void 0,decorators:[{type:e.Inject,args:[m]}]},{type:u}]},t}();var y=function(){function t(t){this._toaster=t}return t.prototype.next=function(t){var e={text:t.text,caption:t.caption,type:t.type,duration:t.duration||t.lifetime,component:null};this._toaster.open(e)},t.decorators=[{type:e.Injectable}],t.ctorParameters=function(){return[{type:g}]},t}();var v=function(){function t(t,e){this._viewContainerRef=t,this._componentFactoryResolver=e}return t.prototype.ngOnInit=function(){var t=this._componentFactoryResolver.resolveComponentFactory(this.toast.component);this._componentRef=this._viewContainerRef.createComponent(t),this._componentRef.instance.toast=this.toast},t.prototype.ngOnDestroy=function(){this._componentRef&&(this._componentRef.destroy(),this._componentRef=null)},t.decorators=[{type:e.Directive,args:[{selector:"[toastContent]"}]}],t.ctorParameters=function(){return[{type:e.ViewContainerRef},{type:e.ComponentFactoryResolver}]},t.propDecorators={toast:[{type:e.Input}]},t}();var _={},b=function(){function t(t){if(t)throw new Error("ToastNotificationsModule is already loaded. Import it in the root module only")}return t.forRoot=function(e){return void 0===e&&(e={}),{ngModule:t,providers:[{provide:m,useValue:e}]}},t.decorators=[{type:e.NgModule,args:[{imports:[o.CommonModule],declarations:[d,f,v],entryComponents:[d,f],providers:[g,u,{provide:m,useValue:_}]}]}],t.ctorParameters=function(){return[{type:t,decorators:[{type:e.Optional},{type:e.SkipSelf}]}]},t}(),C={lifetime:8e3},x=function(){function t(t){if(t)throw new Error("ToastNotificationCoreModule is already loaded. Import it in the root module only")}return t.forRoot=function(e){return void 0===e&&(e=C),{ngModule:t,providers:[{provide:m,useValue:{duration:e.duration||e.lifetime}}]}},t.decorators=[{type:e.NgModule,args:[{imports:[b],providers:[y]}]}],t.ctorParameters=function(){return[{type:t,decorators:[{type:e.Optional},{type:e.SkipSelf}]}]},t}(),w=function(){function t(){}return t.decorators=[{type:e.NgModule}],t}();t.TOAST_NOTIFICATIONS_CONFIG=m,t.Toast=a,t.ToastNotificationClientModule=w,t.ToastNotificationCoreModule=x,t.ToastNotifications=y,t.ToastNotificationsModule=b,t.Toaster=g,t.ɵa=d,t.ɵb=f,t.ɵc=v,t.ɵd=u,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=ngx-toast-notifications.umd.min.js.map