ng2-yk-notifier - npm Package Compare versions

Comparing version 1.0.0-beta.11 to 1.0.0-beta.12

notifier-container.component.d.ts

@@ -8,9 +8,4 @@ import { OnInit, OnDestroy } from "@angular/core";
     notices: Notice[];
-    animate: 'fromRight' | 'fromLeft' | 'rotate' | 'scale' | 'fade';
-    clickToClose: boolean;
     maxStack: number;
-    pauseOnHover: boolean;
     position: ['top' | 'bottom', 'right' | 'left' | 'center'];
-    timeDelay: number;
-    theClass: string;
     private selectNoticesSub;
@@ -17,0 +12,0 @@ constructor(store: Store<Notice[]>, options: NotifierOptions);

notifier-container.component.js

@@ -21,8 +21,4 @@ "use strict";
         this.store = store;
-        this.animate = 'fromRight';
-        this.clickToClose = true;
         this.maxStack = 5;
-        this.pauseOnHover = true;
         this.position = ['bottom', 'right'];
-        this.timeDelay = 0;
         if (options) {
@@ -29,0 +25,0 @@ Object.assign(this, options);

notifier-message.component.js

@@ -80,3 +80,3 @@ "use strict";
             selector: 'ng2-notifier-message',
-            template: "<div [@enterLeave]=\"notice.state\" (@enterLeave.done)=\"animationDone($event)\" (click)=\"onClick()\" (mouseenter)=\"onEnter()\" (mouseleave)=\"onLeave()\" [class]=\"notice.config.theClass\" class=\"notifier-message {{notice.type}}\"><div class=\"title\">{{notice.title}}</div><div class=\"content\">{{notice.content}}</div><div [innerHTML]=\"safeSvg\"></div></div>",
+            template: "<div [@enterLeave]=\"notice.state\" (@enterLeave.done)=\"animationDone($event)\" (click)=\"onClick()\" (mouseenter)=\"onEnter()\" (mouseleave)=\"onLeave()\" class=\"notifier-message {{notice.type}}\"><div class=\"{{notice.config.titleClass || 'title'}}\">{{notice.title}}</div><div class=\"{{notice.config.messageClass || 'content'}}\">{{notice.content}}</div><div [innerHTML]=\"safeSvg\"></div></div>",
             styles: [".notifier-message,.timer{-moz-border-radius:.3rem}.notifier-message{font-size:12px;font-size:.75rem;line-height:20px;line-height:1.25rem;position:relative;width:272px;width:17rem;min-height:48px;min-height:3rem;border-radius:.3rem;margin-bottom:10px;margin-bottom:.625rem;padding:10px;padding:.625rem;color:#333;background-color:#fff;border-color:#ccc;-moz-box-shadow:0 0 8px 3px rgba(255,254,247,.75);box-shadow:0 0 8px 3px rgba(255,254,247,.75);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.notifier-message .title{font-size:16px;font-size:1rem;line-height:20px;line-height:1.25rem}.notifier-message .content,.notifier-message .title{padding-right:48px;padding-right:3rem}.notifier-message.primary{color:#fff;background-color:#337ab7;border-color:#2e6da4}.notifier-message.success{color:#fff;background-color:#5cb85c;border-color:#4cae4c}.notifier-message.danger{color:#fff;background-color:#d9534f;border-color:#d43f3a}.notifier-message.warning{color:#fff;background-color:#f0ad4e;border-color:#eea236}:host /deep/ .notifier-message svg{position:absolute;-moz-box-sizing:border-box;box-sizing:border-box;top:0;right:0;width:48px;width:3rem;height:48px;height:3rem;padding:10px;padding:.625rem;fill:#fff}.timer{position:absolute;top:0;left:0;width:100%;height:4px;border-radius:.3rem}.timer .bar{display:block;position:relative;height:100%;-moz-border-radius:.3rem;border-radius:.3rem;background:rgba(0,0,0,.3);-webkit-transition:width .1s ease;-moz-transition:width .1s ease;transition:width .1s ease}"],
@@ -83,0 +83,0 @@ animations: [

notifier-notice.js

@@ -10,3 +10,4 @@ "use strict";
             timeDelay: 0,
-            theClass: ''
+            titleClass: '',
+            messageClass: '',
         };
@@ -13,0 +14,0 @@ this.id = uuid_1.uuid();

notifier-options.service.d.ts

@@ -8,4 +8,5 @@ export declare class NotifierOptions {
     timeDelay?: number;
-    theClass?: string;
+    titleClass?: string;
+    messageClass?: string;
     constructor(options: Object);
 }

package.json

 {
   "name": "ng2-yk-notifier",
-  "version": "1.0.0-beta.11",
+  "version": "1.0.0-beta.12",
   "description": "Angular2 Notification Component",
@@ -5,0 +5,0 @@ "keywords": [

src/notifier/notifier-container.component.ts

@@ -27,9 +27,4 @@ /**
     notices: Notice[];
-    animate: 'fromRight' | 'fromLeft' | 'rotate' | 'scale' | 'fade' = 'fromRight';
-    clickToClose: boolean = true;
     maxStack: number = 5;
-    pauseOnHover: boolean = true;
     position: ['top' | 'bottom', 'right' | 'left' | 'center'] = ['bottom', 'right'];
-    timeDelay: number = 0;
-    theClass: string;
 
@@ -36,0 +31,0 @@ private selectNoticesSub: Subscription;

src/notifier/notifier-message.component.ts

@@ -21,3 +21,3 @@ /**
     selector: 'ng2-notifier-message',
-    template: `<div [@enterLeave]="notice.state" (@enterLeave.done)="animationDone($event)" (click)="onClick()" (mouseenter)="onEnter()" (mouseleave)="onLeave()" [class]="notice.config.theClass" class="notifier-message {{notice.type}}"><div class="title">{{notice.title}}</div><div class="content">{{notice.content}}</div><div [innerHTML]="safeSvg"></div></div>`,
+    template: `<div [@enterLeave]="notice.state" (@enterLeave.done)="animationDone($event)" (click)="onClick()" (mouseenter)="onEnter()" (mouseleave)="onLeave()" class="notifier-message {{notice.type}}"><div class="{{notice.config.titleClass || 'title'}}">{{notice.title}}</div><div class="{{notice.config.messageClass || 'content'}}">{{notice.content}}</div><div [innerHTML]="safeSvg"></div></div>`,
     styles: [`.notifier-message,.timer{-moz-border-radius:.3rem}.notifier-message{font-size:12px;font-size:.75rem;line-height:20px;line-height:1.25rem;position:relative;width:272px;width:17rem;min-height:48px;min-height:3rem;border-radius:.3rem;margin-bottom:10px;margin-bottom:.625rem;padding:10px;padding:.625rem;color:#333;background-color:#fff;border-color:#ccc;-moz-box-shadow:0 0 8px 3px rgba(255,254,247,.75);box-shadow:0 0 8px 3px rgba(255,254,247,.75);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.notifier-message .title{font-size:16px;font-size:1rem;line-height:20px;line-height:1.25rem}.notifier-message .content,.notifier-message .title{padding-right:48px;padding-right:3rem}.notifier-message.primary{color:#fff;background-color:#337ab7;border-color:#2e6da4}.notifier-message.success{color:#fff;background-color:#5cb85c;border-color:#4cae4c}.notifier-message.danger{color:#fff;background-color:#d9534f;border-color:#d43f3a}.notifier-message.warning{color:#fff;background-color:#f0ad4e;border-color:#eea236}:host /deep/ .notifier-message svg{position:absolute;-moz-box-sizing:border-box;box-sizing:border-box;top:0;right:0;width:48px;width:3rem;height:48px;height:3rem;padding:10px;padding:.625rem;fill:#fff}.timer{position:absolute;top:0;left:0;width:100%;height:4px;border-radius:.3rem}.timer .bar{display:block;position:relative;height:100%;-moz-border-radius:.3rem;border-radius:.3rem;background:rgba(0,0,0,.3);-webkit-transition:width .1s ease;-moz-transition:width .1s ease;transition:width .1s ease}`],
@@ -24,0 +24,0 @@ animations: [

src/notifier/notifier-notice.ts

@@ -19,6 +19,7 @@ /**
         timeDelay: 0,
-        theClass: ''
+        titleClass: '',
+        messageClass: '',
     };
 
-    constructor(type: string, content: string, title?: string, icon?: string) {
+    constructor( type: string, content: string, title?: string, icon?: string ) {
         this.id = uuid();
@@ -25,0 +26,0 @@ this.type = type;

src/notifier/notifier-options.service.ts

@@ -16,3 +16,4 @@ /**
     timeDelay?: number = 0;
-    theClass?: string;
+    titleClass?: string;
+    messageClass?: string;
 
@@ -19,0 +20,0 @@ constructor( options: Object ) {

No alert changes

Worsened metrics

Total package byte prevSize

53600

decreased by-0.57%

Lines of code

1079

decreased by-0.92%

No dependency changes