reapop-rails 0.6.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 4eb4d90e60124271068b9ed188476db5895567f7
+  data.tar.gz: 46c7cf4c14a780606444d249d5f8be2c25c95852
+SHA512:
+  metadata.gz: d96caf02d8c81d9c6a9c464ade2d0e4b1b45f4f9106135773426477f508ac7728c9a8ead978c1aaf2aee5122d52f3ad4210a3576a4328cc47e883a44f393278f
+  data.tar.gz: 8fbd0fa58abc750f9af810fb381af1e178895ab80b77176db401064e408bb2321aa86d82705fe35a17fd7b907ad13c8fc39aa0d1ba25fbab7eee3d59e5e1655c

data/.gitignore

@@ -0,0 +1,9 @@
+/.bundle/
+/.yardoc
+/Gemfile.lock
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/

data/.travis.yml

@@ -0,0 +1,5 @@
+sudo: false
+language: ruby
+rvm:
+  - 2.3.1
+before_install: gem install bundler -v 1.13.4

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in reapop-rails.gemspec
+gemspec

data/LICENSE

@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "{}"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright {yyyy} {name of copyright owner}
+
+   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
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 ACT.md
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,43 @@
+# Reapop::Rails
+
+Rails wrapper for Reapop notification JavaScript library (https://github.com/LouisBarranqueiro/reapop). The version number of this gem follows the version number of the original JavaScript library.
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'reapop-rails'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install reapop-rails
+
+## Usage
+
+Add the following code to ``application.js``:
+```
+//= require reapop
+```
+
+
+## Development
+
+After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake test` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
+
+To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/LouisBarranqueiro/reapop.
+
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
+

data/Rakefile

@@ -0,0 +1,10 @@
+require "bundler/gem_tasks"
+require "rake/testtask"
+
+Rake::TestTask.new(:test) do |t|
+  t.libs << "test"
+  t.libs << "lib"
+  t.test_files = FileList['test/**/*_test.rb']
+end
+
+task :default => :test

data/app/assets/javascripts/reapop.js

@@ -0,0 +1,1112 @@
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("React"), require("ReactRedux"));
+	else if(typeof define === 'function' && define.amd)
+		define(["React", "ReactRedux"], factory);
+	else if(typeof exports === 'object')
+		exports["reapop"] = factory(require("React"), require("ReactRedux"));
+	else
+		root["reapop"] = factory(root["React"], root["ReactRedux"]);
+})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_5__) {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId])
+/******/ 			return installedModules[moduleId].exports;
+
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			exports: {},
+/******/ 			id: moduleId,
+/******/ 			loaded: false
+/******/ 		};
+
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+
+/******/ 		// Flag the module as loaded
+/******/ 		module.loaded = true;
+
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+
+
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.removeNotification = exports.updateNotification = exports.addNotification = exports.reducer = exports.types = exports.actions = exports.POSITIONS = exports.STATUS = undefined;
+
+	var _NotificationsSystem = __webpack_require__(8);
+
+	var _NotificationsSystem2 = _interopRequireDefault(_NotificationsSystem);
+
+	var _constants = __webpack_require__(1);
+
+	var _notifications = __webpack_require__(4);
+
+	var _notifications2 = _interopRequireDefault(_notifications);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	exports.STATUS = _constants.STATUS;
+	exports.POSITIONS = _constants.POSITIONS;
+	exports.actions = _notifications.actions;
+	exports.types = _notifications.types;
+	exports.reducer = _notifications2.default;
+	exports.addNotification = _notifications.addNotification;
+	exports.updateNotification = _notifications.updateNotification;
+	exports.removeNotification = _notifications.removeNotification;
+	// NotificationsSystem React component
+
+	exports.default = _NotificationsSystem2.default;
+
+/***/ },
+/* 1 */
+/***/ function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	var DEFAULT_STATUS = exports.DEFAULT_STATUS = 'default';
+	var INFO_STATUS = exports.INFO_STATUS = 'info';
+	var SUCCESS_STATUS = exports.SUCCESS_STATUS = 'success';
+	var WARNING_STATUS = exports.WARNING_STATUS = 'warning';
+	var ERROR_STATUS = exports.ERROR_STATUS = 'error';
+
+	var STATUS = exports.STATUS = {
+	  default: DEFAULT_STATUS,
+	  info: INFO_STATUS,
+	  success: SUCCESS_STATUS,
+	  warning: WARNING_STATUS,
+	  error: ERROR_STATUS
+	};
+
+	var TOP = exports.TOP = 't';
+	var TOP_CENTER = exports.TOP_CENTER = 'tc';
+	var TOP_LEFT_POSITION = exports.TOP_LEFT_POSITION = 'tl';
+	var TOP_RIGHT_POSITION = exports.TOP_RIGHT_POSITION = 'tr';
+	var BOTTOM = exports.BOTTOM = 'b';
+	var BOTTOM_CENTER = exports.BOTTOM_CENTER = 'bc';
+	var BOTTOM_LEFT_POSITION = exports.BOTTOM_LEFT_POSITION = 'bl';
+	var BOTTOM_RIGHT_POSITION = exports.BOTTOM_RIGHT_POSITION = 'br';
+
+	var POSITIONS = exports.POSITIONS = {
+	  top: TOP,
+	  topCenter: TOP_CENTER,
+	  topLeft: TOP_LEFT_POSITION,
+	  topRight: TOP_RIGHT_POSITION,
+	  bottom: BOTTOM,
+	  bottomCenter: BOTTOM_CENTER,
+	  bottomLeft: BOTTOM_LEFT_POSITION,
+	  bottomRight: BOTTOM_RIGHT_POSITION
+	};
+
+/***/ },
+/* 2 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.convertStatus = convertStatus;
+	exports.Timer = Timer;
+	exports.treatNotification = treatNotification;
+	exports.preloadImage = preloadImage;
+	exports.mapObjectValues = mapObjectValues;
+
+	var _constants = __webpack_require__(1);
+
+	/**
+	 * Convert status in a understandable status for the Notification component
+	 * @param {String|Number} status
+	 * @returns {String} status an understandable status
+	 */
+	function convertStatus(status) {
+	  var reHttpStatusCode = /^\d{3}$/;
+	  // convert HTTP status code
+	  if (reHttpStatusCode.test(status)) {
+	    switch (true) {
+	      case /^1/.test(status):
+	        return _constants.STATUS.info;
+	      case /^2/.test(status):
+	        return _constants.STATUS.success;
+	      case /^(4|5)/.test(status):
+	        return _constants.STATUS.error;
+	    }
+	  }
+	  return status;
+	}
+
+	/**
+	 * Create a Timer
+	 * @param {Function} callback
+	 * @param {Number} delay
+	 * @constructor
+	 */
+	function Timer(callback, delay) {
+	  var timerId = void 0;
+	  var start = void 0;
+	  var remaining = delay;
+
+	  this.pause = function () {
+	    clearTimeout(timerId);
+	    remaining -= new Date() - start;
+	  };
+	  this.resume = function () {
+	    start = new Date();
+	    clearTimeout(timerId);
+	    timerId = setTimeout(callback, remaining);
+	  };
+
+	  this.getTimeRemaining = function () {
+	    return remaining;
+	  };
+	}
+
+	/**
+	 * Treat data of a notification
+	 * @param {Object} notification
+	 * @returns {Object} a notification
+	 */
+	function treatNotification(notification) {
+	  if (notification.dismissAfter) {
+	    notification.dismissAfter = parseInt(notification.dismissAfter);
+	  }
+	  if (notification.image) {
+	    notification.status = _constants.STATUS.default;
+	  } else {
+	    notification.status = convertStatus(notification.status);
+	  }
+	  if (!notification.buttons) {
+	    notification.buttons = [];
+	  }
+	  return notification;
+	}
+
+	/**
+	 * Preload an image
+	 * @param {String} url url of image to load
+	 * @param {Function} onload Function called when image is loaded
+	 * @returns {void}
+	 */
+	function preloadImage(url, onload) {
+	  var image = new Image();
+	  image.src = url;
+	  image.onload = onload;
+	  return image;
+	}
+
+	/**
+	 * Return values of an Object in an Array
+	 * @param {Object} obj
+	 * @returns {Array}
+	 */
+	function mapObjectValues(obj) {
+	  var array = [];
+
+	  for (var key in obj) {
+	    if (obj.hasOwnProperty(key)) {
+	      array.push(obj[key]);
+	    }
+	  }
+	  return array;
+	}
+
+/***/ },
+/* 3 */
+/***/ function(module, exports) {
+
+	module.exports = __WEBPACK_EXTERNAL_MODULE_3__;
+
+/***/ },
+/* 4 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.types = exports.actions = exports.updateNotification = exports.addNotification = undefined;
+	exports.removeNotification = removeNotification;
+
+	var _helpers = __webpack_require__(2);
+
+	function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
+
+	// An array to store notifications object
+	var INITIAL_STATE = [];
+	// Action types
+	var ADD_NOTIFICATION = 'ADD_NOTIFICATION';
+	var UPDATE_NOTIFICATION = 'UPDATE_NOTIFICATION';
+	var REMOVE_NOTIFICATION = 'REMOVE_NOTIFICATION';
+
+	/**
+	 * Add a notification (thunk action creator)
+	 *
+	 * We use a thunk here to create an ADD_NOTIFICATION action
+	 * and only return the notification object.
+	 * @param {Object} notification
+	 * @returns {Object} notification
+	 */
+	var addNotification = exports.addNotification = function addNotification(notification) {
+	  return function (dispatch) {
+	    if (!notification.id) {
+	      notification.id = new Date().getTime();
+	    }
+	    notification = (0, _helpers.treatNotification)(notification);
+	    // if there is an image, we preload it
+	    // and add notification when image is loaded
+	    if (notification.image) {
+	      (0, _helpers.preloadImage)(notification.image, dispatch.bind(undefined, _addNotification(notification)));
+	    } else {
+	      dispatch(_addNotification(notification));
+	    }
+	    return notification;
+	  };
+	};
+
+	/**
+	 * Add a notification (action creator)
+	 *
+	 * @param {Object} notification
+	 * @returns {{type: string, payload: {Object}}}
+	 * @private
+	 */
+	function _addNotification(notification) {
+	  return {
+	    type: ADD_NOTIFICATION,
+	    payload: notification
+	  };
+	}
+
+	/**
+	 * Update a notification (thunk action creator)
+	 *
+	 * We use a thunk here to create an UPDATE_NOTIFICATION action
+	 * and only return the notification object.
+	 * @param {Object} notification
+	 * @returns {Object} notification
+	 */
+	var updateNotification = exports.updateNotification = function updateNotification(notification) {
+	  return function (dispatch, getState) {
+	    if (!notification.id) {
+	      throw new Error('A notification must have an `id` property to be updated');
+	    }
+
+	    var notifications = getState().notifications;
+	    var index = notifications.findIndex(function (oldNotification) {
+	      return oldNotification.id === notification.id;
+	    });
+	    var currNotification = notifications[index];
+
+	    notification = (0, _helpers.treatNotification)(notification);
+
+	    // if image is different, then we preload it
+	    // and update notification when image is loaded
+	    if (notification.image && (!currNotification.image || currNotification.image && notification.image !== currNotification.image)) {
+	      (0, _helpers.preloadImage)(notification.image, dispatch.bind(undefined, _updateNotification(notification)));
+	    } else {
+	      dispatch(_updateNotification(notification));
+	    }
+	    return notification;
+	  };
+	};
+
+	/**
+	 * Update a notification (action creator)
+	 *
+	 * @param {Object} notification
+	 * @returns {{type: string, payload: {Object}}}
+	 * @private
+	 */
+	function _updateNotification(notification) {
+	  return {
+	    type: UPDATE_NOTIFICATION,
+	    payload: notification
+	  };
+	}
+
+	/**
+	 * Remove a notification (action creator)
+	 *
+	 * @param {Object} notification
+	 * @returns {{type: string, payload: {Object}}}
+	 */
+	function removeNotification(notification) {
+	  return {
+	    type: REMOVE_NOTIFICATION,
+	    payload: notification
+	  };
+	}
+
+	// Action creators
+	var actions = exports.actions = {
+	  addNotification: addNotification,
+	  updateNotification: updateNotification,
+	  removeNotification: removeNotification
+	};
+
+	// Actions types
+	var types = exports.types = {
+	  ADD_NOTIFICATION: ADD_NOTIFICATION,
+	  UPDATE_NOTIFICATION: UPDATE_NOTIFICATION,
+	  REMOVE_NOTIFICATION: REMOVE_NOTIFICATION
+	};
+
+	// Reducers
+
+	exports.default = function () {
+	  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : INITIAL_STATE;
+	  var _ref = arguments[1];
+	  var type = _ref.type,
+	      payload = _ref.payload;
+
+	  switch (type) {
+	    case ADD_NOTIFICATION:
+	      return [].concat(_toConsumableArray(state), [payload]);
+	    case UPDATE_NOTIFICATION:
+	      // get index of the notification
+	      var index = state.findIndex(function (notification) {
+	        return notification.id === payload.id;
+	      });
+	      // replace the old notification by the new one
+	      state[index] = Object.assign({}, payload);
+	      return [].concat(_toConsumableArray(state));
+	    case REMOVE_NOTIFICATION:
+	      return state.filter(function (notification) {
+	        return notification.id !== payload;
+	      });
+	    default:
+	      return state;
+	  }
+	};
+
+/***/ },
+/* 5 */
+/***/ function(module, exports) {
+
+	module.exports = __WEBPACK_EXTERNAL_MODULE_5__;
+
+/***/ },
+/* 6 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.Notification = undefined;
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _react = __webpack_require__(3);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactRedux = __webpack_require__(5);
+
+	var _helpers = __webpack_require__(2);
+
+	var _notifications = __webpack_require__(4);
+
+	var _constants = __webpack_require__(1);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	/**
+	 * Create a timer
+	 * @param {Number} dismissAfter
+	 * @param {Array} buttons
+	 * @param {Function} callback
+	 * @returns {Function|null} a Timer
+	 */
+	function createTimer(dismissAfter, buttons, callback) {
+	  if (dismissAfter > 0 && (!buttons || buttons && buttons.length === 0)) {
+	    return new _helpers.Timer(callback, dismissAfter);
+	  }
+	  return null;
+	}
+
+	var Notification = exports.Notification = function (_Component) {
+	  _inherits(Notification, _Component);
+
+	  /**
+	   * Constructor
+	   * Bind methods
+	   * @param {Object} props
+	   * @returns {void}
+	   */
+	  function Notification(props) {
+	    _classCallCheck(this, Notification);
+
+	    var _props$notification = props.notification,
+	        dismissAfter = _props$notification.dismissAfter,
+	        buttons = _props$notification.buttons;
+
+	    var _this = _possibleConstructorReturn(this, (Notification.__proto__ || Object.getPrototypeOf(Notification)).call(this, props));
+
+	    _this._remove = _this._remove.bind(_this);
+	    _this._pauseTimer = _this._pauseTimer.bind(_this);
+	    _this._resumeTimer = _this._resumeTimer.bind(_this);
+	    _this.state = {
+	      timer: createTimer(dismissAfter, buttons, _this._remove)
+	    };
+	    return _this;
+	  }
+
+	  /**
+	   * Run `onAdd` callback function when component is mounted
+	   * @returns {void}
+	   */
+
+	  // Properties types
+
+
+	  _createClass(Notification, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      var onAdd = this.props.notification.onAdd;
+
+	      if (typeof onAdd === 'function') {
+	        onAdd();
+	      }
+	    }
+
+	    /**
+	     * Run `onRemove` callback function when component will unmount
+	     * @returns {void}
+	     */
+
+	  }, {
+	    key: 'componentWillUnmount',
+	    value: function componentWillUnmount() {
+	      var onRemove = this.props.notification.onRemove;
+
+	      if (typeof onRemove === 'function') {
+	        onRemove();
+	      }
+	    }
+
+	    /**
+	     * Update timer
+	     * @param {Object} nextProps
+	     * @returns {void}
+	     */
+
+	  }, {
+	    key: 'componentWillReceiveProps',
+	    value: function componentWillReceiveProps(nextProps) {
+	      var _nextProps$notificati = nextProps.notification,
+	          dismissAfter = _nextProps$notificati.dismissAfter,
+	          buttons = _nextProps$notificati.buttons;
+
+	      this.setState({
+	        timer: createTimer(dismissAfter, buttons, this._remove)
+	      });
+	    }
+
+	    /**
+	     * Remove the notification
+	     * @private
+	     * @returns {void}
+	     */
+
+	  }, {
+	    key: '_remove',
+	    value: function _remove() {
+	      var _props = this.props,
+	          removeNotification = _props.removeNotification,
+	          id = _props.notification.id;
+
+	      removeNotification(id);
+	    }
+
+	    /**
+	     * Pauses the timer
+	     * @returns {void}
+	     * @private
+	     */
+
+	  }, {
+	    key: '_pauseTimer',
+	    value: function _pauseTimer() {
+	      var timer = this.state.timer;
+
+	      timer.pause();
+	    }
+
+	    /**
+	     * Resumes the timer
+	     * @returns {void}
+	     * @private
+	     */
+
+	  }, {
+	    key: '_resumeTimer',
+	    value: function _resumeTimer() {
+	      var timer = this.state.timer;
+
+	      timer.resume();
+	    }
+
+	    /**
+	     * Wrap content in an object ready for HTML
+	     * @param {String} content a text
+	     * @returns {Object}
+	     * @private
+	     */
+
+	  }, {
+	    key: '_setHTML',
+	    value: function _setHTML(content) {
+	      return {
+	        __html: content
+	      };
+	    }
+
+	    /**
+	     * Render button(s)
+	     * @returns {*}
+	     */
+
+	  }, {
+	    key: '_renderButtons',
+	    value: function _renderButtons() {
+	      var _props2 = this.props,
+	          className = _props2.className,
+	          buttons = _props2.notification.buttons;
+
+
+	      return buttons.map(function (button) {
+	        return _react2.default.createElement(
+	          'button',
+	          { key: button.name, className: className.button, onClick: button.onClick },
+	          _react2.default.createElement(
+	            'span',
+	            { className: className.buttonText },
+	            button.primary ? _react2.default.createElement(
+	              'b',
+	              null,
+	              button.name
+	            ) : button.name
+	          )
+	        );
+	      });
+	    }
+
+	    /**
+	     * Render
+	     * @returns {XML}
+	     */
+
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      var _props3 = this.props,
+	          className = _props3.className,
+	          _props3$notification = _props3.notification,
+	          title = _props3$notification.title,
+	          message = _props3$notification.message,
+	          status = _props3$notification.status,
+	          dismissible = _props3$notification.dismissible,
+	          closeButton = _props3$notification.closeButton,
+	          buttons = _props3$notification.buttons,
+	          image = _props3$notification.image,
+	          allowHTML = _props3$notification.allowHTML;
+	      var timer = this.state.timer;
+
+	      var isDismissible = dismissible && buttons.length === 0;
+
+	      if (timer) {
+	        this._resumeTimer();
+	      }
+
+	      return _react2.default.createElement(
+	        'div',
+	        { className: className.wrapper,
+	          onClick: isDismissible && !closeButton ? this._remove : '',
+	          onMouseEnter: timer ? this._pauseTimer : '',
+	          onMouseLeave: timer ? this._resumeTimer : '' },
+	        _react2.default.createElement(
+	          'div',
+	          { className: className.main + ' ' + className.status(status) + ' ' + ((isDismissible && !closeButton ? className.dismissible : '') + ' ') + ('' + className.buttons(buttons.length)) },
+	          image ? _react2.default.createElement(
+	            'div',
+	            { className: className.imageContainer },
+	            _react2.default.createElement('span', { className: className.image, style: { backgroundImage: 'url(' + image + ')' } })
+	          ) : _react2.default.createElement('span', { className: className.icon }),
+	          _react2.default.createElement(
+	            'div',
+	            { className: className.meta },
+	            title ? allowHTML ? _react2.default.createElement('h4', { className: className.title, dangerouslySetInnerHTML: this._setHTML(title) }) : _react2.default.createElement(
+	              'h4',
+	              { className: className.title },
+	              title
+	            ) : '',
+	            message ? allowHTML ? _react2.default.createElement('p', { className: className.message, dangerouslySetInnerHTML: this._setHTML(message) }) : _react2.default.createElement(
+	              'p',
+	              { className: className.message },
+	              message
+	            ) : ''
+	          ),
+	          isDismissible && closeButton ? _react2.default.createElement(
+	            'div',
+	            { className: className.closeButtonContainer },
+	            _react2.default.createElement('span', { className: className.closeButton, onClick: this._remove })
+	          ) : '',
+	          buttons.length ? _react2.default.createElement(
+	            'div',
+	            { className: className.buttons(), onClick: this._remove },
+	            this._renderButtons()
+	          ) : ''
+	        )
+	      );
+	    }
+	  }]);
+
+	  return Notification;
+	}(_react.Component);
+
+	Notification.propTypes = {
+	  className: _react2.default.PropTypes.shape({
+	    main: _react2.default.PropTypes.string.isRequired,
+	    wrapper: _react2.default.PropTypes.string.isRequired,
+	    meta: _react2.default.PropTypes.string.isRequired,
+	    title: _react2.default.PropTypes.string.isRequired,
+	    message: _react2.default.PropTypes.string.isRequired,
+	    imageContainer: _react2.default.PropTypes.string.isRequired,
+	    image: _react2.default.PropTypes.string.isRequired,
+	    icon: _react2.default.PropTypes.string.isRequired,
+	    status: _react2.default.PropTypes.func.isRequired,
+	    dismissible: _react2.default.PropTypes.string.isRequired,
+	    closeButtonContainer: _react2.default.PropTypes.string.isRequired,
+	    closeButton: _react2.default.PropTypes.string.isRequired,
+	    buttons: _react2.default.PropTypes.func.isRequired,
+	    button: _react2.default.PropTypes.string.isRequired,
+	    buttonText: _react2.default.PropTypes.string.isRequired
+	  }).isRequired,
+	  notification: _react2.default.PropTypes.shape({
+	    id: _react2.default.PropTypes.string.isRequired,
+	    title: _react2.default.PropTypes.string,
+	    message: _react2.default.PropTypes.string,
+	    image: _react2.default.PropTypes.string,
+	    status: _react2.default.PropTypes.string.isRequired,
+	    position: _react2.default.PropTypes.oneOf((0, _helpers.mapObjectValues)(_constants.POSITIONS)),
+	    dismissAfter: _react2.default.PropTypes.number.isRequired,
+	    dismissible: _react2.default.PropTypes.bool.isRequired,
+	    onAdd: _react2.default.PropTypes.func,
+	    onRemove: _react2.default.PropTypes.func,
+	    closeButton: _react2.default.PropTypes.bool.isRequired,
+	    buttons: _react2.default.PropTypes.arrayOf(_react2.default.PropTypes.shape({
+	      name: _react2.default.PropTypes.string.isRequired,
+	      onClick: _react2.default.PropTypes.func
+	    })).isRequired,
+	    allowHTML: _react2.default.PropTypes.bool.isRequired
+	  }).isRequired,
+	  removeNotification: _react2.default.PropTypes.func.isRequired
+	};
+	exports.default = (0, _reactRedux.connect)(null, { removeNotification: _notifications.removeNotification })(Notification);
+
+/***/ },
+/* 7 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.NotificationsContainer = undefined;
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _react = __webpack_require__(3);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _helpers = __webpack_require__(2);
+
+	var _Notification = __webpack_require__(6);
+
+	var _Notification2 = _interopRequireDefault(_Notification);
+
+	var _constants = __webpack_require__(1);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var NotificationsContainer = exports.NotificationsContainer = function (_Component) {
+	  _inherits(NotificationsContainer, _Component);
+
+	  /**
+	   * Constructor
+	   * Bind methods
+	   * @param {Object} props
+	   * @returns {void}
+	   */
+
+	  // default types
+	  function NotificationsContainer(props) {
+	    _classCallCheck(this, NotificationsContainer);
+
+	    var _this = _possibleConstructorReturn(this, (NotificationsContainer.__proto__ || Object.getPrototypeOf(NotificationsContainer)).call(this, props));
+
+	    _this._renderNotifications = _this._renderNotifications.bind(_this);
+	    return _this;
+	  }
+
+	  /**
+	   * Render notifications
+	   * @private
+	   * @returns {XML}
+	   */
+
+
+	  // Properties types
+
+
+	  _createClass(NotificationsContainer, [{
+	    key: '_renderNotifications',
+	    value: function _renderNotifications() {
+	      // get all notifications and default values for notifications
+	      var _props = this.props,
+	          position = _props.position,
+	          className = _props.theme.notification.className,
+	          _props$defaultValues = _props.defaultValues,
+	          status = _props$defaultValues.status,
+	          dismissible = _props$defaultValues.dismissible,
+	          dismissAfter = _props$defaultValues.dismissAfter,
+	          closeButton = _props$defaultValues.closeButton,
+	          allowHTML = _props$defaultValues.allowHTML;
+	      var notifications = this.props.notifications;
+
+	      // when notifications are displayed at the bottom,
+	      // we display notifications from bottom to top
+
+	      if ([_constants.POSITIONS.bottomLeft, _constants.POSITIONS.bottomRight, _constants.POSITIONS.bottomCenter, _constants.POSITIONS.bottom].indexOf(position) >= 0) {
+	        notifications = notifications.reverse();
+	      }
+
+	      return notifications.map(function (notification) {
+	        // Define default values for notification if it's needed
+	        if (!notification.status) {
+	          notification.status = status;
+	        }
+	        if (typeof notification.dismissible !== 'boolean') {
+	          notification.dismissible = dismissible;
+	        }
+	        if (typeof notification.dismissAfter !== 'number') {
+	          notification.dismissAfter = dismissAfter;
+	        }
+	        if (typeof notification.closeButton !== 'boolean') {
+	          notification.closeButton = closeButton;
+	        }
+	        if (typeof notification.allowHTML !== 'boolean') {
+	          notification.allowHTML = allowHTML;
+	        }
+	        return _react2.default.createElement(_Notification2.default, { key: notification.id, notification: notification, className: className });
+	      });
+	    }
+
+	    /**
+	     * Render
+	     * @returns {XML}
+	     */
+
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      var _props$theme$notifica = this.props.theme.notificationsContainer,
+	          className = _props$theme$notifica.className,
+	          _props$theme$notifica2 = _props$theme$notifica.transition,
+	          name = _props$theme$notifica2.name,
+	          enterTimeout = _props$theme$notifica2.enterTimeout,
+	          leaveTimeout = _props$theme$notifica2.leaveTimeout;
+	      var position = this.props.position;
+
+
+	      return _react2.default.createElement(
+	        'div',
+	        { className: className.main + ' ' + className.position(position) },
+	        _react2.default.createElement(
+	          _react2.default.addons.CSSTransitionGroup,
+	          { transitionName: name, transitionEnterTimeout: enterTimeout,
+	            transitionLeaveTimeout: leaveTimeout },
+	          this._renderNotifications()
+	        )
+	      );
+	    }
+	  }]);
+
+	  return NotificationsContainer;
+	}(_react.Component);
+
+	NotificationsContainer.defaultProps = {
+	  notifications: []
+	};
+	NotificationsContainer.propTypes = {
+	  notifications: _react2.default.PropTypes.array.isRequired,
+	  position: _react2.default.PropTypes.string.isRequired,
+	  defaultValues: _react2.default.PropTypes.shape({
+	    status: _react2.default.PropTypes.string.isRequired,
+	    position: _react2.default.PropTypes.oneOf((0, _helpers.mapObjectValues)(_constants.POSITIONS)),
+	    dismissible: _react2.default.PropTypes.bool.isRequired,
+	    dismissAfter: _react2.default.PropTypes.number.isRequired,
+	    closeButton: _react2.default.PropTypes.bool.isRequired,
+	    allowHTML: _react2.default.PropTypes.bool.isRequired
+	  }).isRequired,
+	  theme: _react2.default.PropTypes.shape({
+	    notificationsContainer: _react2.default.PropTypes.shape({
+	      className: _react2.default.PropTypes.shape({
+	        main: _react2.default.PropTypes.string.isRequired,
+	        position: _react2.default.PropTypes.func.isRequired
+	      }).isRequired,
+	      transition: _react2.default.PropTypes.shape({
+	        name: _react2.default.PropTypes.object.isRequired,
+	        enterTimeout: _react2.default.PropTypes.number.isRequired,
+	        leaveTimeout: _react2.default.PropTypes.number.isRequired
+	      }).isRequired
+	    }).isRequired,
+	    notification: _react2.default.PropTypes.shape({
+	      className: _react2.default.PropTypes.object.isRequired
+	    }).isRequired
+	  }).isRequired
+	};
+	exports.default = NotificationsContainer;
+
+/***/ },
+/* 8 */
+/***/ function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.NotificationsSystem = exports.defaultValues = undefined;
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	var _react = __webpack_require__(3);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactRedux = __webpack_require__(5);
+
+	var _helpers = __webpack_require__(2);
+
+	var _NotificationsContainer = __webpack_require__(7);
+
+	var _NotificationsContainer2 = _interopRequireDefault(_NotificationsContainer);
+
+	var _constants = __webpack_require__(1);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	// default value for notifications
+	var defaultValues = exports.defaultValues = {
+	  status: _constants.STATUS.default,
+	  position: _constants.POSITIONS.topRight,
+	  dismissible: true,
+	  dismissAfter: 5000,
+	  allowHTML: false,
+	  closeButton: false
+	};
+
+	var NotificationsSystem = exports.NotificationsSystem = function (_Component) {
+	  _inherits(NotificationsSystem, _Component);
+
+	  // default properties
+	  function NotificationsSystem(props) {
+	    _classCallCheck(this, NotificationsSystem);
+
+	    var _this = _possibleConstructorReturn(this, (NotificationsSystem.__proto__ || Object.getPrototypeOf(NotificationsSystem)).call(this, props));
+
+	    _this._updateWindowWidth = _this._updateWindowWidth.bind(_this);
+	    _this._renderNotificationsContainers = _this._renderNotificationsContainers.bind(_this);
+	    _this.state = {
+	      windowWidth: window.innerWidth
+	    };
+	    return _this;
+	  }
+
+	  /**
+	   * Update window width
+	   * @returns {void}
+	   * @private
+	   */
+
+
+	  // properties types
+
+
+	  _createClass(NotificationsSystem, [{
+	    key: '_updateWindowWidth',
+	    value: function _updateWindowWidth() {
+	      this.setState({ windowWidth: window.innerWidth });
+	    }
+
+	    /**
+	     * Add resize listener to update window width when the window is resized
+	     * @returns {void}
+	     */
+
+	  }, {
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      window.addEventListener('resize', this._updateWindowWidth);
+	    }
+
+	    /**
+	     * Remove resize listener
+	     * @returns {void}
+	     */
+
+	  }, {
+	    key: 'componentWillUnmount',
+	    value: function componentWillUnmount() {
+	      window.removeEventListener('resize', this._updateWindowWidth);
+	    }
+
+	    /**
+	     * Render notifications containers
+	     * @returns {XML}
+	     * @private
+	     */
+
+	  }, {
+	    key: '_renderNotificationsContainers',
+	    value: function _renderNotificationsContainers() {
+	      var _props = this.props,
+	          notifications = _props.notifications,
+	          position = _props.defaultValues.position,
+	          theme = _props.theme;
+	      var windowWidth = this.state.windowWidth;
+	      // render all notifications in the same container at the top for small screens
+
+	      if (windowWidth < theme.smallScreenMin) {
+	        return _react2.default.createElement(_NotificationsContainer2.default, { key: 't', position: 't', defaultValues: defaultValues,
+	          theme: theme, notifications: notifications });
+	      }
+	      var positions = (0, _helpers.mapObjectValues)(_constants.POSITIONS);
+	      // extract the default position of all positions
+	      positions.splice(positions.indexOf(position), 1);
+	      var notifs = notifications.filter(function (notif) {
+	        return !notif.position || notif.position === position;
+	      });
+	      // init array with all notifications with default position
+	      var JSX = [_react2.default.createElement(_NotificationsContainer2.default, { key: position, position: position, defaultValues: defaultValues,
+	        theme: theme, notifications: notifs })];
+	      // fill array with others containers
+	      JSX = JSX.concat(positions.map(function (position) {
+	        var notifs = notifications.filter(function (notif) {
+	          return position === notif.position;
+	        });
+	        return _react2.default.createElement(_NotificationsContainer2.default, { key: position, position: position, defaultValues: defaultValues,
+	          theme: theme, notifications: notifs });
+	      }));
+	      return JSX;
+	    }
+
+	    /**
+	     * Render
+	     * @returns {XML}
+	     */
+
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      var className = this.props.theme.notificationsSystem.className;
+
+	      return _react2.default.createElement(
+	        'div',
+	        { className: className },
+	        this._renderNotificationsContainers()
+	      );
+	    }
+	  }]);
+
+	  return NotificationsSystem;
+	}(_react.Component);
+
+	/**
+	 * Map state to props
+	 * @param {Object} state
+	 * @returns {{notifications: {Array}}}
+	 */
+
+
+	NotificationsSystem.defaultProps = {
+	  notifications: [],
+	  defaultValues: defaultValues
+	};
+	NotificationsSystem.propTypes = {
+	  notifications: _react2.default.PropTypes.array.isRequired,
+	  defaultValues: _react2.default.PropTypes.object.isRequired,
+	  theme: _react2.default.PropTypes.shape({
+	    smallScreenMin: _react2.default.PropTypes.number.isRequired,
+	    notificationsSystem: _react2.default.PropTypes.shape({
+	      className: _react2.default.PropTypes.string.isRequired
+	    })
+	  }).isRequired
+	};
+	function mapStateToProps(state) {
+	  return {
+	    notifications: state.notifications
+	  };
+	}
+
+	exports.default = (0, _reactRedux.connect)(mapStateToProps)(NotificationsSystem);
+
+/***/ }
+/******/ ])
+});
+;