Merge pull request #220 from Stabzs/release/11.0.0

Release/11.0.0

.gitignore

@@ -2,7 +2,6 @@ node_modules
 src/node_modules
 npm-debug.log
 coverage
-lib
 dist
 build
 typings
@@ -12,4 +11,5 @@ src/*.d.ts
 src/*.ngfactory.ts
 angular2-toaster.d.ts
 demo/webpack/bundle.js
-demo/webpack/bundle.js.map
+demo/webpack/bundle.js.map
+.DS_Store

CHANGELOG.md

@@ -1,6 +1,61 @@
+# 11.0.0
+### FEATURES
+* **angular2-toaster:** Full release of 11.0.0 functionality.  Pins the library to 11.0.0 of Angular.
+* **toast:** A new `tapToDismiss?: boolean` property has been added to the toast object.  This allows for 
+each individual toast to override the global `tapToDismiss` config.
+Closes [#178](https://github.com/Stabzs/Angular2-Toaster/issues/178).
+* **toaster.css:** Styles have been rebuilt around flexbox and have removed IE and webkit-specific prefixes. 
+This allows for more compact css and should make it easier for users to override styles.  It also fixes close 
+button layout issues in Firefox, resolving [#192](https://github.com/Stabzs/Angular2-Toaster/issues/192).
+Due to larger default viewports for standard mobile devices, the responsive layouts are no longer beneficial 
+and they have been removed.  The standard toast width is now fixed at 300px.
+Finally, the styles should be cleaner, more compact for large toasts, and more consistent across content size
+changes.
+* **animations:**  Animations have been rebuilt and enhanced to provide smoother transitions for all animation 
+types.  Thanks to @fidian for the excellent suggestion and examples.
+Closes [#196](https://github.com/Stabzs/Angular2-Toaster/issues/196).
+
+### BREAKING CHANGES
+* **toast:** Due to the complexity of the `clickHandler` functionality potentially blocking the `tapToDismiss`
+setting based on the `clickHandler`'s boolean response, the `clickHandler` property has been replaced with an 
+`onClickCallback?: OnActionCallback = (toast: Toast) => void;` property.  This property will always be called on 
+toast click, even if `tapToDismiss` is true or if the click originated from the close button.
+* **toaster-container.component:** The toaster-container element has changed from an id to a class. Since multiple 
+containers can exist on the same page, using a class for controlling container styles is more semantically 
+appropriate.
+* **toaster.css:** IE support has been dropped and the styles have been ported to a much lighter-weight flexbox 
+pattern.  This will most likely break any custom toast styles.
+* **toaster.css:** The Toaster Container element and styles have been moved from an id to a class.  This allows for 
+custom ids to be applied to individual containers and more semantically supports multiple containers on the same page.
+* **toast, toaster.service, toaster-config:** the 'type' parameter has been constrained to the new `ToastType` type 
+instead of string.  If the default types are being used, there will be no impact.  If custom types are being used, 
+the custom types will need a new type that unions `ToastType`.  See the 'Toast Types' section of the README for 
+additional details.  
+    - To more clearly support this change, the `toaster-config.defaultTypeClass` property has been 
+renamed to `defaultToastType` and is now constrained to `ToastType`.
+    - The following toaster-config properties have been updated from type `string` to type `ToastType`:
+        - showCloseButton
+        - typeClasses
+        - iconClasses
+        - defaultToastType
+        - timeout
+* **toaster-container.component:** When providing a custom toast type, overrides must be added via `toaster-config` to 
+both the `typeClasses` and `iconClasses` properties.  If mappings do not exist for both, the toast's type will fall back 
+to `toaster-config.defaultToastType`.
+
+### BUG FIXES
+* **toaster-config:** The default for the `defaultTypeClass` property (now renamed to `defaultToastType`) has been 
+correctly changed to `info` instead of `toast-info` for the fallback case.
+* **toaster.css:** The close button positioning has been corrected.
+Closes [#192](https://github.com/Stabzs/Angular2-Toaster/issues/192).
+* **toast.component:** The `BodyOutputType.TrustedHtml` body content did not properly update on change. A pipe has been 
+added at the suggestion of @rmeshksar to force re-rendering of the content if it changes.  Replaces 
+[#185]](https://github.com/Stabzs/Angular2-Toaster/pull/185).
+
+
 # 10.0.0
 ### FEATURES
-* **angular2-toaster:** Full release of 10.0.0 functionality.  Pins the llibrary to 10.0.0 of Angular.
+* **angular2-toaster:** Full release of 10.0.0 functionality.  Pins the library to 10.0.0 of Angular.
 
 ### DOCUMENTATION
 * **README:** Added documentation for toast types and toast type overrides.

README.md

@@ -8,9 +8,11 @@ largely based off of [AngularJS-Toaster](https://github.com/jirikavi/AngularJS-T
 [![Build Status](https://travis-ci.org/Stabzs/Angular2-Toaster.svg?branch=master)](https://travis-ci.org/Stabzs/Angular2-Toaster)
 [![Coverage Status](https://coveralls.io/repos/github/Stabzs/Angular2-Toaster/badge.svg?branch=master&b=8.0.0)](https://coveralls.io/github/Stabzs/Angular2-Toaster?branch=master)
 
+Version ^11.0.0 has a number of new features, type definitions, and break changesing.  Please review the 
+[CHANGELOG](CHANGELOG.md/#11.0.0) for a list of features and breaking changes before upgrading.
 
 Version ^5.0.0 requires either `.forRoot()` or `.forChild()` `ToasterModule` inclusion.  Please 
-read the 5.x.x release notes and the `Getting Started` section before upgraded.
+read the 5.x.x release notes and the `Getting Started` section before upgrading.
 
 Version ^4.0.0 now supports @angular/animations, which is a breaking change. 
 Please read both the Getting Started and Animations sections before upgrading.
@@ -257,16 +259,47 @@ If you need to target a non-supported browser, a [polyfill](https://github.com/w
 
 # Configurable Options
 ### Toast Types
-By default, five toast types are defined: 'error, 'info', 'wait', 'success', and 'warning'.
+By default, five toast types are defined via the `ToastType` type: 'error, 'info', 'wait', 'success', and 'warning'.
 
-The default options can be overridden by passing a mapping object to the config, where the key corresponds to the toast type and the value corresponds to a custom style:
+The existing toast type configurations can be overridden by passing a mapping object that uses the 
+same type names but overrides the style class:
 
 ```typescript
 template: 
     `<toaster-container [toasterconfig]="config"></toaster-container>`
 
 public config: ToasterConfig = 
-    new ToasterConfig({typeClasses: {'partial-success': '.toaster-partial-success' }});
+    new ToasterConfig({typeClasses: {
+      error: 'custom-toast-error',
+      info: 'custom-toast-info',
+      wait: 'custom-toast-wait',
+      success: 'custom-toast-success',
+      warning: 'custom-toast-warning'
+    }});
+```
+
+In addition, the default options can be overridden, replaced, or expanded, by extending the toast type with a 
+custom type and passing a mapping object to the config, where the key corresponds to the toast type and the 
+value corresponds to a custom class:
+
+**NOTE: When providing a custom type, both the typeClasses and iconClasses objects must be updated.
+In the case where either are not provided, the toast type will fall back to the `defaultToastType` which 
+defaults to `info`.**
+```typescript
+import {DefaultTypeClasses, DefaultIconClasses} from 'angular2-toaster';
+type ExtendedToastType = ('partial-success') & ToastType;
+
+template: 
+    `<toaster-container [toasterconfig]="config"></toaster-container>`
+
+extendedTypeClasses = { ...DefaultTypeClasses, ...{ 'partial-success': 'toast-partial-success' }};
+extendedIconClasses = { ...DefaultIconClasses, ...{ 'partial-success': 'icon-partial-success' }};
+
+public config: ToasterConfig = 
+    new ToasterConfig({
+        typeClasses: <ExtendedToastType>this.extendedTypeClasses,
+        iconClasses: <ExtendedToastType>this.extendedIconClasses
+    });
 ```
 
 ### Animations
@@ -548,6 +581,20 @@ var toast: Toast = {
 this.toasterService.pop(toast);
 ```
 
+### On Click Callback
+An onClick callback function can be attached to each toast instance.  The callback will be invoked upon the toast being 
+clicked, even if the click is the close button.  The callback will be invoked before the toast is removed.
+
+```typescript
+var toast: Toast = {
+  type: 'success',
+  title: 'parent',
+  onClickCallback: (toast) => this.toasterService.pop('success', 'invoked from ' + toast.title + ' onClick callback')  
+};
+
+this.toasterService.pop(toast);
+```
+
 
 # Building the Source
 In order to build Angular2-Toaster for development, you will need to have Git and Node.js installed.
@@ -570,7 +617,7 @@ npm run build
 
 Run Karma test instance with coverage report:
 ```bash
-npm run test
+ng test angular2-toaster --code-coverage
 ```
 
 # Frequently Asked Questions and Issues

angular.json

@@ -83,7 +83,6 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
               "extractLicenses": true,
               "vendorChunk": false,