react-toastify - npm Package Compare versions

Comparing version 3.1.2 to 3.2.0

dist/ReactToastify.min.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("prop-types"),require("glamor"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","prop-types","glamor","react-dom"],e):"object"==typeof exports?exports.ReactToastify=e(require("react"),require("prop-types"),require("glamor"),require("react-dom")):t.ReactToastify=e(t.react,t["prop-types"],t.glamor,t["react-dom"])}(this,function(t,e,n,o){return function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=7)}([function(e,n){e.exports=t},function(t,n){t.exports=e},function(t,e){t.exports=n},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.POSITION={TOP_LEFT:"top-left",TOP_RIGHT:"top-right",TOP_CENTER:"top-center",BOTTOM_LEFT:"bottom-left",BOTTOM_RIGHT:"bottom-right",BOTTOM_CENTER:"bottom-center"},e.TYPE={INFO:"info",SUCCESS:"success",WARNING:"warning",ERROR:"error",DEFAULT:"default"},e.ACTION={SHOW:"SHOW_TOAST",CLEAR:"CLEAR_TOAST",MOUNTED:"CONTAINER_MOUNTED"}},function(t,e,n){"use strict";function o(t){Object.keys(t).forEach(function(e){var n=t[e];r.hasOwnProperty(e)&&(r[e]=n)})}Object.defineProperty(e,"__esModule",{value:!0}),e.defineStyle=o;var r={width:"320px",colorDefault:"#fff",colorInfo:"#3498db",colorSuccess:"#07bc0c",colorWarning:"#f1c40f",colorError:"#e74c3c",colorProgressDefault:"linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55)",mobile:"only screen and (max-width : 480px)",zIndex:9999};e.default=r},function(t,e,n){"use strict";function o(t){return"number"==typeof t&&!isNaN(t)&&t>0}function r(t){return Object.keys(t).map(function(e){return t[e]})}function i(t){return t.isRequired=function(e,n,o){if(void 0===e[n])return new Error("The prop "+n+" is marked as required in \n      "+o+", but its value is undefined.");t(e,n,o)},t}Object.defineProperty(e,"__esModule",{value:!0}),e.falseOrElement=e.falseOrDelay=void 0,e.isValidDelay=o,e.objectValues=r;var a=n(0);e.falseOrDelay=i(function(t,e,n){var r=t[e];return!1===r||o(r)?null:new Error(n+" expect "+e+" \n      to be a valid Number > 0 or equal to false. "+r+" given.")}),e.falseOrElement=i(function(t,e,n){var o=t[e];return!1===o||(0,a.isValidElement)(o)?null:new Error(n+" expect "+e+" \n      to be a valid react element or equal to false. "+o+" given.")})},function(t,e,n){"use strict";function o(t){if(Array.isArray(t)){for(var e=0,n=Array(t.length);e<t.length;e++)n[e]=t[e];return n}return Array.from(t)}Object.defineProperty(e,"__esModule",{value:!0});var r={eventList:new Map,on:function(t,e){return this.eventList.has(t)||this.eventList.set(t,[]),this.eventList.get(t).push(e),this},off:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;return this.eventList.delete(t)},emit:function(t){for(var e=this,n=arguments.length,r=Array(n>1?n-1:0),i=1;i<n;i++)r[i-1]=arguments[i];return this.eventList.has(t)?(this.eventList.get(t).forEach(function(t){return setTimeout(function(){return t.call.apply(t,[e].concat(o(r)))},0)}),!0):(console.warn("<"+t+"> Event is not registered. Did you forgot to bind the event ?"),!1)}};e.default=r},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(e,"__esModule",{value:!0}),e.style=e.toast=e.ToastContainer=void 0;var r=n(8),i=o(r),a=n(19),s=o(a),u=n(4);e.ToastContainer=i.default,e.toast=s.default,e.style=u.defineStyle},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t){if(Array.isArray(t)){for(var e=0,n=Array(t.length);e<t.length;e++)n[e]=t[e];return n}return Array.from(t)}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function u(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}Object.defineProperty(e,"__esModule",{value:!0});var l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),f=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},p=n(0),d=o(p),h=n(1),m=o(h),y=n(2),O=n(9),b=o(O),v=n(11),g=o(v),T=n(13),E=o(T),x=n(14),C=o(x),N=n(3),P=n(4),_=o(P),I=n(6),S=o(I),j=n(5),k=function(t){var e=void 0,n="-"+parseInt(_.default.width,10)/2+"px";switch(t){case N.POSITION.TOP_LEFT:e={top:"1em",left:"1em"};break;case N.POSITION.TOP_CENTER:e={top:"1em",left:"50%",marginLeft:n};break;case N.POSITION.TOP_RIGHT:default:e={top:"1em",right:"1em"};break;case N.POSITION.BOTTOM_LEFT:e={bottom:"1em",left:"1em"};break;case N.POSITION.BOTTOM_CENTER:e={bottom:"1em",left:"50%",marginLeft:n};break;case N.POSITION.BOTTOM_RIGHT:e={bottom:"1em",right:"1em"}}return(0,y.css)(e,(0,y.css)(u({},"@media "+_.default.mobile,f({left:0,margin:0,position:"fixed"},"top"===t.substring(0,3)?{top:0}:{bottom:0}))))},w=function(t,e){return(0,y.css)(f({zIndex:_.default.zIndex,position:"fixed",padding:"4px",width:_.default.width,boxSizing:"border-box",color:"#fff"},t?{pointerEvents:"none"}:{},u({},"@media "+_.default.mobile,{width:"100vw",padding:0})),k(e))},R=function(t){function e(){var t,n,o,r;i(this,e);for(var s=arguments.length,u=Array(s),l=0;l<s;l++)u[l]=arguments[l];return n=o=a(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(u))),o.state={toast:[],isDocumentHidden:!1},o.collection={},o.isDocumentHidden=function(){return o.setState({isDocumentHidden:document.hidden})},o.isToastActive=function(t){return-1!==o.state.toast.indexOf(parseInt(t,10))},r=n,a(o,r)}return s(e,t),c(e,[{key:"componentDidMount",value:function(){var t=this,e=N.ACTION.SHOW,n=N.ACTION.CLEAR,o=N.ACTION.MOUNTED;S.default.on(e,function(e,n){return t.show(e,n)}).on(n,function(e){return null!==e?t.removeToast(e):t.clear()}).emit(o,this),document.addEventListener("visibilitychange",this.isDocumentHidden)}},{key:"componentWillUnmount",value:function(){S.default.off(N.ACTION.SHOW),S.default.off(N.ACTION.CLEAR),document.removeEventListener("visibilitychange",this.isDocumentHidden)}},{key:"removeToast",value:function(t){this.setState({toast:this.state.toast.filter(function(e){return e!==parseInt(t,10)})})}},{key:"makeCloseButton",value:function(t,e,n){var o=this,r=this.props.closeButton;return((0,p.isValidElement)(t)||!1===t)&&(r=t),!1!==r&&(0,p.cloneElement)(r,{closeToast:function(){return o.removeToast(e)},type:n})}},{key:"getAutoCloseDelay",value:function(t){return!1===t||(0,j.isValidDelay)(t)?t:this.props.autoClose}},{key:"isFunction",value:function(t){return!!(t&&t.constructor&&t.call&&t.apply)}},{key:"canBeRendered",value:function(t){return(0,p.isValidElement)(t)||"string"==typeof t||"number"==typeof t}},{key:"show",value:function(t,e){var n=this;if(!this.canBeRendered(t))throw new Error("The element you provided cannot be rendered. You provided an element of type "+(void 0===t?"undefined":l(t)));var o=e.toastId,i=function(){return n.removeToast(o)},a={id:o,type:e.type,closeToast:i,updateId:e.updateId,position:e.position||this.props.position,transition:e.transition||this.props.transition,className:e.className||this.props.toastClassName,bodyClassName:e.bodyClassName||this.props.bodyClassName,closeButton:this.makeCloseButton(e.closeButton,o,e.type),pauseOnHover:null!==e.pauseOnHover?e.pauseOnHover:this.props.pauseOnHover,closeOnClick:null!==e.closeOnClick?e.closeOnClick:this.props.closeOnClick,progressClassName:e.progressClassName||this.props.progressClassName,autoClose:this.getAutoCloseDelay(!1!==e.autoClose?parseInt(e.autoClose,10):e.autoClose),hideProgressBar:"boolean"==typeof e.hideProgressBar?e.hideProgressBar:this.props.hideProgressBar};this.isFunction(e.onOpen)&&(a.onOpen=e.onOpen),this.isFunction(e.onClose)&&(a.onClose=e.onClose),(0,p.isValidElement)(t)&&"string"!=typeof t.type&&"number"!=typeof t.type&&(t=(0,p.cloneElement)(t,{closeToast:i})),this.collection=f({},this.collection,u({},o,{position:a.position,options:a,content:t})),this.setState({toast:null!==a.updateId?[].concat(r(this.state.toast)):[].concat(r(this.state.toast),[o])})}},{key:"makeToast",value:function(t,e){return d.default.createElement(g.default,f({},e,{isDocumentHidden:this.state.isDocumentHidden,key:"toast-"+e.id}),t)}},{key:"clear",value:function(){this.setState({toast:[]})}},{key:"renderToast",value:function(){var t=this,e={},n=this.props,o=n.className,r=n.style;return(n.newestOnTop?Object.keys(this.collection).reverse():Object.keys(this.collection)).forEach(function(n){var o=t.collection[n];e[o.position]||(e[o.position]=[]),-1!==t.state.toast.indexOf(parseInt(n,10))?e[o.position].push(t.makeToast(o.content,o.options)):(e[o.position].push(null),delete t.collection[n])}),Object.keys(e).map(function(t){var n=1===e[t].length&&null===e[t][0];return d.default.createElement(b.default,f({},"string"!=typeof o?(0,y.css)(w(n,t),o):w(n,t),"string"==typeof o&&{className:o},null!==r&&{style:r},{key:"container-"+t}),e[t])})}},{key:"render",value:function(){return d.default.createElement("div",null,this.renderToast())}}]),e}(p.Component);R.propTypes={position:m.default.oneOf((0,j.objectValues)(N.POSITION)),autoClose:j.falseOrDelay,closeButton:j.falseOrElement,hideProgressBar:m.default.bool,pauseOnHover:m.default.bool,closeOnClick:m.default.bool,newestOnTop:m.default.bool,className:m.default.oneOfType([m.default.string,m.default.object]),style:m.default.object,toastClassName:m.default.oneOfType([m.default.string,m.default.object]),bodyClassName:m.default.oneOfType([m.default.string,m.default.object]),progressClassName:m.default.oneOfType([m.default.string,m.default.object]),transition:m.default.func},R.defaultProps={position:N.POSITION.TOP_RIGHT,transition:C.default,autoClose:5e3,hideProgressBar:!1,closeButton:d.default.createElement(E.default,null),pauseOnHover:!0,closeOnClick:!0,newestOnTop:!1,className:null,style:null,toastClassName:"",bodyClassName:"",progressClassName:""},e.default=R},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}e.__esModule=!0;var u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},l=n(1),c=o(l),f=n(0),p=o(f),d=n(10),h=Object.values||function(t){return Object.keys(t).map(function(e){return t[e]})},m=(c.default.any,c.default.node,c.default.bool,c.default.bool,c.default.bool,c.default.func,{component:"div",childFactory:function(t){return t}}),y=function(t){function e(n,o){i(this,e);var r=a(this,t.call(this,n,o));return r.handleExited=function(t,e,n){var o=(0,d.getChildMapping)(r.props.children);t in o||(n&&n(e),r.setState(function(e){var n=u({},e.children);return delete n[t],{children:n}}))},r.state={children:(0,d.getChildMapping)(n.children,function(t){var e=function(e){r.handleExited(t.key,e,t.props.onExited)};return(0,f.cloneElement)(t,{onExited:e,in:!0,appear:r.getProp(t,"appear"),enter:r.getProp(t,"enter"),exit:r.getProp(t,"exit")})})},r}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:{isMounting:!this.appeared}}},e.prototype.getProp=function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:this.props;return null!=n[e]?n[e]:t.props[e]},e.prototype.componentDidMount=function(){this.appeared=!0},e.prototype.componentWillReceiveProps=function(t){var e=this,n=this.state.children,o=(0,d.getChildMapping)(t.children),r=(0,d.mergeChildMappings)(n,o);Object.keys(r).forEach(function(i){var a=r[i];if((0,f.isValidElement)(a)){var s=function(t){e.handleExited(a.key,t,a.props.onExited)},u=i in n,l=i in o,c=n[i],p=(0,f.isValidElement)(c)&&!c.props.in;!l||u&&!p?l||!u||p?l&&u&&(0,f.isValidElement)(c)&&(r[i]=(0,f.cloneElement)(a,{onExited:s,in:c.props.in,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})):r[i]=(0,f.cloneElement)(a,{in:!1}):r[i]=(0,f.cloneElement)(a,{onExited:s,in:!0,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})}}),this.setState({children:r})},e.prototype.render=function(){var t=this.props,e=t.component,n=t.childFactory,o=r(t,["component","childFactory"]),i=this.state.children;return delete o.appear,delete o.enter,delete o.exit,p.default.createElement(e,o,h(i).map(n))},e}(p.default.Component);y.childContextTypes={transitionGroup:c.default.object.isRequired},y.propTypes={},y.defaultProps=m,e.default=y,t.exports=e.default},function(t,e,n){"use strict";function o(t,e){var n=function(t){return e&&(0,i.isValidElement)(t)?e(t):t},o=Object.create(null);return t&&i.Children.map(t,function(t){return t}).forEach(function(t){o[t.key]=n(t)}),o}function r(t,e){function n(n){return n in e?e[n]:t[n]}t=t||{},e=e||{};var o=Object.create(null),r=[];for(var i in t)i in e?r.length&&(o[i]=r,r=[]):r.push(i);var a=void 0,s={};for(var u in e){if(o[u])for(a=0;a<o[u].length;a++){var l=o[u][a];s[o[u][a]]=n(l)}s[u]=n(u)}for(a=0;a<r.length;a++)s[r[a]]=n(r[a]);return s}e.__esModule=!0,e.getChildMapping=o,e.mergeChildMappings=r;var i=n(0)},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function s(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}Object.defineProperty(e,"__esModule",{value:!0});var u=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),l=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},c=n(0),f=o(c),p=n(1),d=o(p),h=n(2),m=n(12),y=o(m),O=n(3),b=n(4),v=o(b),g=n(5),T=function(t){return(0,h.css)(l({position:"relative",minHeight:"48px",marginBottom:"1rem",padding:"8px",borderRadius:"1px",boxShadow:"0 1px 10px 0 rgba(0, 0, 0, .1), 0 2px 15px 0 rgba(0, 0, 0, .05)",display:"flex",justifyContent:"space-between",maxHeight:"800px",overflow:"hidden",fontFamily:"sans-serif",cursor:"pointer",background:v.default["color"+t.charAt(0).toUpperCase()+t.slice(1)]},"default"===t?{color:"#aaa"}:{},s({},"@media "+v.default.mobile,{marginBottom:0})))},E=(0,h.css)({margin:"auto 0",flex:1}),x=function(t){function e(){var t,n,o,a;r(this,e);for(var s=arguments.length,u=Array(s),l=0;l<s;l++)u[l]=arguments[l];return n=o=i(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(u))),o.state={isRunning:!0},o.pauseToast=function(){o.setState({isRunning:!1})},o.playToast=function(){o.setState({isRunning:!0})},a=n,i(o,a)}return a(e,t),u(e,[{key:"componentDidMount",value:function(){null!==this.props.onOpen&&this.props.onOpen(this.getChildrenProps())}},{key:"componentWillReceiveProps",value:function(t){this.props.isDocumentHidden!==t.isDocumentHidden&&this.setState({isRunning:!t.isDocumentHidden})}},{key:"componentWillUnmount",value:function(){null!==this.props.onClose&&this.props.onClose(this.getChildrenProps())}},{key:"getChildrenProps",value:function(){return this.props.children.props}},{key:"getToastProps",value:function(){var t={};return!1!==this.props.autoClose&&!0===this.props.pauseOnHover&&(t.onMouseEnter=this.pauseToast,t.onMouseLeave=this.playToast),"string"==typeof this.props.className&&(t.className=this.props.className),this.props.closeOnClick&&(t.onClick=this.props.closeToast),t}},{key:"render",value:function(){var t=this.props,e=t.closeButton,n=t.children,o=t.autoClose,r=t.type,i=t.hideProgressBar,a=t.closeToast,s=t.transition,u=t.position,c=t.onExited,p=t.className,d=t.bodyClassName,m=t.progressClassName,O=t.updateId;return f.default.createElement(s,{in:this.props.in,appear:!0,unmountOnExit:!0,onExited:c,position:u},f.default.createElement("div",l({},"string"!=typeof p?(0,h.css)(T(r),p):T(r),this.getToastProps()),f.default.createElement("div",l({},"string"!=typeof d?(0,h.css)(E,d):E,"string"==typeof d&&{className:d}),n),!1!==e&&e,!1!==o&&f.default.createElement(y.default,{key:"pb-"+O,delay:o,isRunning:this.state.isRunning,closeToast:a,hide:i,type:r,className:m})))}}]),e}(c.Component);x.propTypes={closeButton:g.falseOrElement.isRequired,autoClose:g.falseOrDelay.isRequired,children:d.default.node.isRequired,closeToast:d.default.func.isRequired,position:d.default.oneOf((0,g.objectValues)(O.POSITION)).isRequired,pauseOnHover:d.default.bool.isRequired,closeOnClick:d.default.bool.isRequired,transition:d.default.func.isRequired,isDocumentHidden:d.default.bool.isRequired,in:d.default.bool,onExited:d.default.func,hideProgressBar:d.default.bool,onOpen:d.default.func,onClose:d.default.func,type:d.default.oneOf((0,g.objectValues)(O.TYPE)),className:d.default.oneOfType([d.default.string,d.default.object]),bodyClassName:d.default.oneOfType([d.default.string,d.default.object]),progressClassName:d.default.oneOfType([d.default.string,d.default.object]),updateId:d.default.number},x.defaultProps={type:O.TYPE.DEFAULT,in:!0,hideProgressBar:!1,onOpen:null,onClose:null,className:"",bodyClassName:"",progressClassName:"",updateId:null},e.default=x},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t){var e=t.delay,n=t.isRunning,o=t.closeToast,r=t.type,a=t.hide,u=t.className;return s.default.createElement("div",i({},"string"!=typeof u?(0,c.css)(m(r,n,a,e),u):m(r,n,a,e),"string"==typeof u&&{className:u},{onAnimationEnd:o}))}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},a=n(0),s=o(a),u=n(1),l=o(u),c=n(2),f=n(3),p=n(4),d=o(p),h=c.css.keyframes("track-progress",{"0%":{width:"100%"},"100%":{width:0}}),m=function(t,e,n,o){return(0,c.css)(i({position:"absolute",bottom:0,left:0,width:0,height:"5px",zIndex:d.default.zIndex,opacity:n?0:.7,animation:h+" linear 1",animationPlayState:e?"running":"paused",animationDuration:o+"ms",backgroundColor:"rgba(255,255,255,.7)"},"default"===t?{background:d.default.colorProgressDefault}:{}))};r.propTypes={delay:l.default.number.isRequired,isRunning:l.default.bool.isRequired,closeToast:l.default.func.isRequired,type:l.default.string,hide:l.default.bool,className:l.default.oneOfType([l.default.string,l.default.object])},r.defaultProps={type:f.TYPE.DEFAULT,hide:!1,className:""},e.default=r},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t){var e=t.closeToast,n=t.type;return s.default.createElement("button",i({},f("default"===n),{type:"button",onClick:e}),"✖")}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},a=n(0),s=o(a),u=n(1),l=o(u),c=n(2),f=function(t){return(0,c.css)({color:t?"#000":"#fff",fontWeight:"bold",fontSize:"14px",background:"transparent",outline:"none",border:"none",padding:0,cursor:"pointer",opacity:t?"0.3":"0.7",transition:".3s ease",alignSelf:"flex-start",":hover, :focus":{opacity:1}})};r.propTypes={closeToast:l.default.func},e.default=r},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n}function i(t){var e=t.children,n=t.position,o=r(t,["children","position"]),i=m(n),s=i.enter,l=i.exit;return u.default.createElement(c.default,a({},o,{timeout:750,onEnter:function(t){return t.classList.add(s)},onEntered:function(t){return t.classList.remove(s)},onExit:function(t){return t.classList.add(l)}}),e)}Object.defineProperty(e,"__esModule",{value:!0});var a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},s=n(0),u=o(s),l=n(15),c=o(l),f=n(2),p=n(18),d=o(p),h={animationDuration:"0.75s",animationFillMode:"both"},m=function(t){var e=(0,d.default)(t),n=e.enter,o=e.exit,r=f.css.keyframes("enter",a({"from, 60%, 75%, 90%, to":{animationTimingFunction:"cubic-bezier(0.215, 0.610, 0.355, 1.000)"}},n)),i=f.css.keyframes("exit",o);return{enter:(0,f.css)(a({},h,{animationName:r})),exit:(0,f.css)(a({},h,{animationName:i}))}};e.default=i},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function u(){}e.__esModule=!0,e.EXITING=e.ENTERED=e.ENTERING=e.EXITED=e.UNMOUNTED=void 0;var l=n(1),c=function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e.default=t,e}(l),f=n(0),p=o(f),d=n(16),h=o(d),m=(n(17),e.UNMOUNTED="unmounted"),y=e.EXITED="exited",O=e.ENTERING="entering",b=e.ENTERED="entered",v=e.EXITING="exiting",g=function(t){function e(n,o){i(this,e);var r=a(this,t.call(this,n,o)),s=o.transitionGroup,u=s&&!s.isMounting?n.enter:n.appear,l=void 0;return r.nextStatus=null,n.in?u?(l=y,r.nextStatus=O):l=b:l=n.unmountOnExit||n.mountOnEnter?m:y,r.state={status:l},r.nextCallback=null,r}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:null}},e.prototype.componentDidMount=function(){this.updateStatus(!0)},e.prototype.componentWillReceiveProps=function(t){var e=this.pendingState||this.state,n=e.status;t.in?(n===m&&this.setState({status:y}),n!==O&&n!==b&&(this.nextStatus=O)):n!==O&&n!==b||(this.nextStatus=v)},e.prototype.componentDidUpdate=function(){this.updateStatus()},e.prototype.componentWillUnmount=function(){this.cancelNextCallback()},e.prototype.getTimeouts=function(){var t=this.props.timeout,e=void 0,n=void 0,o=void 0;return e=n=o=t,null!=t&&"number"!=typeof t&&(e=t.exit,n=t.enter,o=t.appear),{exit:e,enter:n,appear:o}},e.prototype.updateStatus=function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.nextStatus;if(null!==e){this.nextStatus=null,this.cancelNextCallback();var n=h.default.findDOMNode(this);e===O?this.performEnter(n,t):this.performExit(n)}else this.props.unmountOnExit&&this.state.status===y&&this.setState({status:m})},e.prototype.performEnter=function(t,e){var n=this,o=this.props.enter,r=this.context.transitionGroup?this.context.transitionGroup.isMounting:e,i=this.getTimeouts();if(!e&&!o)return void this.safeSetState({status:b},function(){n.props.onEntered(t)});this.props.onEnter(t,r),this.safeSetState({status:O},function(){n.props.onEntering(t,r),n.onTransitionEnd(t,i.enter,function(){n.safeSetState({status:b},function(){n.props.onEntered(t,r)})})})},e.prototype.performExit=function(t){var e=this,n=this.props.exit,o=this.getTimeouts();if(!n)return void this.safeSetState({status:y},function(){e.props.onExited(t)});this.props.onExit(t),this.safeSetState({status:v},function(){e.props.onExiting(t),e.onTransitionEnd(t,o.exit,function(){e.safeSetState({status:y},function(){e.props.onExited(t)})})})},e.prototype.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},e.prototype.safeSetState=function(t,e){var n=this;this.pendingState=t,e=this.setNextCallback(e),this.setState(t,function(){n.pendingState=null,e()})},e.prototype.setNextCallback=function(t){var e=this,n=!0;return this.nextCallback=function(o){n&&(n=!1,e.nextCallback=null,t(o))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},e.prototype.onTransitionEnd=function(t,e,n){this.setNextCallback(n),t?(this.props.addEndListener&&this.props.addEndListener(t,this.nextCallback),null!=e&&setTimeout(this.nextCallback,e)):setTimeout(this.nextCallback,0)},e.prototype.render=function(){var t=this.state.status;if(t===m)return null;var e=this.props,n=e.children,o=r(e,["children"]);if(delete o.in,delete o.mountOnEnter,delete o.unmountOnExit,delete o.appear,delete o.enter,delete o.exit,delete o.timeout,delete o.addEndListener,delete o.onEnter,delete o.onEntering,delete o.onEntered,delete o.onExit,delete o.onExiting,delete o.onExited,"function"==typeof n)return n(t,o);var i=p.default.Children.only(n);return p.default.cloneElement(i,o)},e}(p.default.Component);g.contextTypes={transitionGroup:c.object},g.childContextTypes={transitionGroup:function(){}},g.propTypes={},g.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:u,onEntering:u,onEntered:u,onExit:u,onExiting:u,onExited:u},g.UNMOUNTED=0,g.EXITED=1,g.ENTERING=2,g.ENTERED=3,g.EXITING=4,e.default=g},function(t,e){t.exports=o},function(t,e,n){"use strict";function o(t){var e="transition"+t+"Timeout",n="transition"+t;return function(t){if(t[n]){if(null==t[e])return new Error(e+" wasn't supplied to CSSTransitionGroup: this can cause unreliable animations and won't be supported in a future version of React. See https://fb.me/react-animation-transition-group-timeout for more information.");if("number"!=typeof t[e])return new Error(e+" must be a number (in milliseconds)")}return null}}e.__esModule=!0,e.classNamesShape=e.timeoutsShape=void 0,e.transitionTimeout=o;var r=n(1),i=function(t){return t&&t.__esModule?t:{default:t}}(r);e.timeoutsShape=i.default.oneOfType([i.default.number,i.default.shape({enter:i.default.number,exit:i.default.number}).isRequired]),e.classNamesShape=i.default.oneOfType([i.default.string,i.default.shape({enter:i.default.string,exit:i.default.string,active:i.default.string}),i.default.shape({enter:i.default.string,enterActive:i.default.string,exit:i.default.string,exitActive:i.default.string})])},function(t,e,n){"use strict";function o(t){switch(t){case r.POSITION.TOP_RIGHT:case r.POSITION.BOTTOM_RIGHT:default:return{enter:{from:{opacity:0,transform:"translate3d(3000px, 0, 0)"},"60%":{opacity:1,transform:"translate3d(-25px, 0, 0)"},"75%":{transform:"translate3d(10px, 0, 0)"},"90%":{transform:"translate3d(-5px, 0, 0)"},to:{transform:"none"}},exit:{"20%":{opacity:1,transform:"translate3d(-20px, 0, 0)"},to:{opacity:0,transform:"translate3d(2000px, 0, 0)"}}};case r.POSITION.TOP_LEFT:case r.POSITION.BOTTOM_LEFT:return{enter:{"0%":{opacity:0,transform:"translate3d(-3000px, 0, 0)"},"60%":{opacity:1,transform:"translate3d(25px, 0, 0)"},"75%":{transform:"translate3d(-10px, 0, 0)"},"90%":{transform:"translate3d(5px, 0, 0)"},to:{transform:"none"}},exit:{"20%":{opacity:1,transform:"translate3d(20px, 0, 0)"},to:{opacity:0,transform:"translate3d(-2000px, 0, 0)"}}};case r.POSITION.BOTTOM_CENTER:return{enter:{from:{opacity:0,transform:"translate3d(0, 3000px, 0)"},"60%":{opacity:1,transform:"translate3d(0, -20px, 0)"},"75%":{transform:"translate3d(0, 10px, 0)"},"90%":{transform:"translate3d(0, -5px, 0)"},to:{transform:"translate3d(0, 0, 0)"}},exit:{"20%":{transform:"translate3d(0, 10px, 0)"},"40%, 45%":{opacity:1,transform:"translate3d(0, -20px, 0)"},to:{opacity:0,transform:"translate3d(0, 2000px, 0)"}}};case r.POSITION.TOP_CENTER:return{enter:{"0%":{opacity:0,transform:"translate3d(0, -3000px, 0)"},"60%":{opacity:1,transform:"translate3d(0, 25px, 0)"},"75%":{transform:"translate3d(0, -10px, 0)"},"90%":{transform:"translate3d(0, 5px, 0)"},to:{transform:"none"}},exit:{"20%":{transform:"translate3d(0, -10px, 0)"},"40%, 45%":{opacity:1,transform:"translate3d(0, 20px, 0)"},to:{opacity:0,transform:"translate3d(0, -2000px, 0)"}}}}}Object.defineProperty(e,"__esModule",{value:!0}),e.default=o;var r=n(3)},function(t,e,n){"use strict";function o(t,e){return i({},l,t,{type:e,toastId:++p})}function r(t,e){return null!==c?s.default.emit(u.ACTION.SHOW,t,e):f.push({action:u.ACTION.SHOW,content:t,options:e}),e.toastId}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},a=n(6),s=function(t){return t&&t.__esModule?t:{default:t}}(a),u=n(3),l={type:u.TYPE.DEFAULT,autoClose:null,closeButton:null,hideProgressBar:null,position:null,pauseOnHover:null,closeOnClick:null,className:null,bodyClassName:null,progressClassName:null,transition:null,updateId:null},c=null,f=[],p=0,d=i(function(t,e){return r(t,o(e,e&&e.type||u.TYPE.DEFAULT))},{success:function(t,e){return r(t,o(e,u.TYPE.SUCCESS))},info:function(t,e){return r(t,o(e,u.TYPE.INFO))},warn:function(t,e){return r(t,o(e,u.TYPE.WARNING))},warning:function(t,e){return r(t,o(e,u.TYPE.WARNING))},error:function(t,e){return r(t,o(e,u.TYPE.ERROR))},dismiss:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;return c&&s.default.emit(u.ACTION.CLEAR,t)},isActive:function(){return!1},update:function(t,e){if(c&&void 0!==c.collection[t]){var n=c.collection[t],o=n.options,a=n.content,s=null!==o.updateId?o.updateId+1:1,u=i({},o,e,{toastId:t,updateId:s}),l=void 0!==u.render?u.render:a;return delete u.render,r(l,u)}return!1}},{POSITION:u.POSITION,TYPE:u.TYPE});s.default.on(u.ACTION.MOUNTED,function(t){c=t,d.isActive=function(t){return c.isToastActive(t)},f.forEach(function(t){s.default.emit(t.action,t.content,t.options)}),f=[]}),e.default=d}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("prop-types"),require("glamor"),require("react-dom")):"function"==typeof define&&define.amd?define(["react","prop-types","glamor","react-dom"],e):"object"==typeof exports?exports.ReactToastify=e(require("react"),require("prop-types"),require("glamor"),require("react-dom")):t.ReactToastify=e(t.react,t["prop-types"],t.glamor,t["react-dom"])}(this,function(t,e,n,o){return function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=7)}([function(e,n){e.exports=t},function(t,n){t.exports=e},function(t,e){t.exports=n},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.POSITION={TOP_LEFT:"top-left",TOP_RIGHT:"top-right",TOP_CENTER:"top-center",BOTTOM_LEFT:"bottom-left",BOTTOM_RIGHT:"bottom-right",BOTTOM_CENTER:"bottom-center"},e.TYPE={INFO:"info",SUCCESS:"success",WARNING:"warning",ERROR:"error",DEFAULT:"default"},e.ACTION={SHOW:"SHOW_TOAST",CLEAR:"CLEAR_TOAST",MOUNTED:"CONTAINER_MOUNTED"}},function(t,e,n){"use strict";function o(t){for(var e in t)r[e]=t[e]}Object.defineProperty(e,"__esModule",{value:!0}),e.defineStyle=o;var r={width:"320px",colorDefault:"#fff",colorInfo:"#3498db",colorSuccess:"#07bc0c",colorWarning:"#f1c40f",colorError:"#e74c3c",colorProgressDefault:"linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55)",mobile:"only screen and (max-width : 480px)",fontFamily:"sans-serif",zIndex:9999,TOP_LEFT:{top:"1em",left:"1em"},TOP_CENTER:{top:"1em",left:"50%"},TOP_RIGHT:{top:"1em",right:"1em"},BOTTOM_LEFT:{bottom:"1em",left:"1em"},BOTTOM_CENTER:{bottom:"1em",left:"50%"},BOTTOM_RIGHT:{bottom:"1em",right:"1em"}};e.default=r},function(t,e,n){"use strict";function o(t){return"number"==typeof t&&!isNaN(t)&&t>0}function r(t){return Object.keys(t).map(function(e){return t[e]})}function i(t){return t.isRequired=function(e,n,o){if(void 0===e[n])return new Error("The prop "+n+" is marked as required in \n      "+o+", but its value is undefined.");t(e,n,o)},t}Object.defineProperty(e,"__esModule",{value:!0}),e.falseOrElement=e.falseOrDelay=void 0,e.isValidDelay=o,e.objectValues=r;var a=n(0);e.falseOrDelay=i(function(t,e,n){var r=t[e];return!1===r||o(r)?null:new Error(n+" expect "+e+" \n      to be a valid Number > 0 or equal to false. "+r+" given.")}),e.falseOrElement=i(function(t,e,n){var o=t[e];return!1===o||(0,a.isValidElement)(o)?null:new Error(n+" expect "+e+" \n      to be a valid react element or equal to false. "+o+" given.")})},function(t,e,n){"use strict";function o(t){if(Array.isArray(t)){for(var e=0,n=Array(t.length);e<t.length;e++)n[e]=t[e];return n}return Array.from(t)}Object.defineProperty(e,"__esModule",{value:!0});var r={eventList:new Map,on:function(t,e){return this.eventList.has(t)||this.eventList.set(t,[]),this.eventList.get(t).push(e),this},off:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;return this.eventList.delete(t)},emit:function(t){for(var e=this,n=arguments.length,r=Array(n>1?n-1:0),i=1;i<n;i++)r[i-1]=arguments[i];return this.eventList.has(t)?(this.eventList.get(t).forEach(function(t){return setTimeout(function(){return t.call.apply(t,[e].concat(o(r)))},0)}),!0):(console.warn("<"+t+"> Event is not registered. Did you forgot to bind the event ?"),!1)}};e.default=r},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(e,"__esModule",{value:!0}),e.style=e.toast=e.ToastContainer=void 0;var r=n(8),i=o(r),a=n(19),s=o(a),u=n(4);e.ToastContainer=i.default,e.toast=s.default,e.style=u.defineStyle},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t){if(Array.isArray(t)){for(var e=0,n=Array(t.length);e<t.length;e++)n[e]=t[e];return n}return Array.from(t)}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function u(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}Object.defineProperty(e,"__esModule",{value:!0});var l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),f=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},p=n(0),d=o(p),h=n(1),m=o(h),y=n(2),O=n(9),b=o(O),v=n(11),g=o(v),E=n(13),T=o(E),x=n(14),C=o(x),N=n(3),P=n(4),_=o(P),S=n(6),I=o(S),j=n(5),w=function(t){var e=t.toUpperCase().replace("-","_"),n=void 0!==N.POSITION[e]?_.default[e]:_.default.TOP_RIGHT;return-1!==e.indexOf("CENTER")&&void 0===n.marginLeft&&(n.marginLeft="-"+parseInt(_.default.width,10)/2+"px"),(0,y.css)(n,(0,y.css)(u({},"@media "+_.default.mobile,f({left:0,margin:0,position:"fixed"},"top"===t.substring(0,3)?{top:0}:{bottom:0}))))},k=function(t,e){return(0,y.css)(f({zIndex:_.default.zIndex,position:"fixed",padding:"4px",width:_.default.width,boxSizing:"border-box",color:"#fff"},t?{pointerEvents:"none"}:{},u({},"@media "+_.default.mobile,{width:"100vw",padding:0})),w(e))},R=function(t){function e(){var t,n,o,r;i(this,e);for(var s=arguments.length,u=Array(s),l=0;l<s;l++)u[l]=arguments[l];return n=o=a(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(u))),o.state={toast:[],isDocumentHidden:!1},o.collection={},o.isDocumentHidden=function(){return o.setState({isDocumentHidden:document.hidden})},o.isToastActive=function(t){return-1!==o.state.toast.indexOf(parseInt(t,10))},r=n,a(o,r)}return s(e,t),c(e,[{key:"componentDidMount",value:function(){var t=this,e=N.ACTION.SHOW,n=N.ACTION.CLEAR,o=N.ACTION.MOUNTED;I.default.on(e,function(e,n){return t.show(e,n)}).on(n,function(e){return null!==e?t.removeToast(e):t.clear()}).emit(o,this),document.addEventListener("visibilitychange",this.isDocumentHidden)}},{key:"componentWillUnmount",value:function(){I.default.off(N.ACTION.SHOW),I.default.off(N.ACTION.CLEAR),document.removeEventListener("visibilitychange",this.isDocumentHidden)}},{key:"removeToast",value:function(t){this.setState({toast:this.state.toast.filter(function(e){return e!==parseInt(t,10)})})}},{key:"makeCloseButton",value:function(t,e,n){var o=this,r=this.props.closeButton;return((0,p.isValidElement)(t)||!1===t)&&(r=t),!1!==r&&(0,p.cloneElement)(r,{closeToast:function(){return o.removeToast(e)},type:n})}},{key:"getAutoCloseDelay",value:function(t){return!1===t||(0,j.isValidDelay)(t)?t:this.props.autoClose}},{key:"isFunction",value:function(t){return!!(t&&t.constructor&&t.call&&t.apply)}},{key:"canBeRendered",value:function(t){return(0,p.isValidElement)(t)||"string"==typeof t||"number"==typeof t||this.isFunction(t)}},{key:"show",value:function(t,e){var n=this;if(!this.canBeRendered(t))throw new Error("The element you provided cannot be rendered. You provided an element of type "+(void 0===t?"undefined":l(t)));var o=e.toastId,i=function(){return n.removeToast(o)},a={id:o,type:e.type,closeToast:i,updateId:e.updateId,position:e.position||this.props.position,transition:e.transition||this.props.transition,className:e.className||this.props.toastClassName,bodyClassName:e.bodyClassName||this.props.bodyClassName,closeButton:this.makeCloseButton(e.closeButton,o,e.type),pauseOnHover:null!==e.pauseOnHover?e.pauseOnHover:this.props.pauseOnHover,closeOnClick:null!==e.closeOnClick?e.closeOnClick:this.props.closeOnClick,progressClassName:e.progressClassName||this.props.progressClassName,autoClose:this.getAutoCloseDelay(!1!==e.autoClose?parseInt(e.autoClose,10):e.autoClose),hideProgressBar:"boolean"==typeof e.hideProgressBar?e.hideProgressBar:this.props.hideProgressBar};this.isFunction(e.onOpen)&&(a.onOpen=e.onOpen),this.isFunction(e.onClose)&&(a.onClose=e.onClose),(0,p.isValidElement)(t)&&"string"!=typeof t.type&&"number"!=typeof t.type?t=(0,p.cloneElement)(t,{closeToast:i}):this.isFunction(t)&&(t=t({closeToast:i})),this.collection=f({},this.collection,u({},o,{position:a.position,options:a,content:t})),this.setState({toast:null!==a.updateId?[].concat(r(this.state.toast)):[].concat(r(this.state.toast),[o])})}},{key:"makeToast",value:function(t,e){return d.default.createElement(g.default,f({},e,{isDocumentHidden:this.state.isDocumentHidden,key:"toast-"+e.id}),t)}},{key:"clear",value:function(){this.setState({toast:[]})}},{key:"renderToast",value:function(){var t=this,e={},n=this.props,o=n.className,r=n.style;return(n.newestOnTop?Object.keys(this.collection).reverse():Object.keys(this.collection)).forEach(function(n){var o=t.collection[n];e[o.position]||(e[o.position]=[]),-1!==t.state.toast.indexOf(parseInt(n,10))?e[o.position].push(t.makeToast(o.content,o.options)):(e[o.position].push(null),delete t.collection[n])}),Object.keys(e).map(function(t){var n=1===e[t].length&&null===e[t][0];return d.default.createElement(b.default,f({},"string"!=typeof o?(0,y.css)(k(n,t),o):k(n,t),"string"==typeof o&&{className:o},null!==r&&{style:r},{key:"container-"+t}),e[t])})}},{key:"render",value:function(){return d.default.createElement("div",null,this.renderToast())}}]),e}(p.Component);R.propTypes={position:m.default.oneOf((0,j.objectValues)(N.POSITION)),autoClose:j.falseOrDelay,closeButton:j.falseOrElement,hideProgressBar:m.default.bool,pauseOnHover:m.default.bool,closeOnClick:m.default.bool,newestOnTop:m.default.bool,className:m.default.oneOfType([m.default.string,m.default.object]),style:m.default.object,toastClassName:m.default.oneOfType([m.default.string,m.default.object]),bodyClassName:m.default.oneOfType([m.default.string,m.default.object]),progressClassName:m.default.oneOfType([m.default.string,m.default.object]),transition:m.default.func},R.defaultProps={position:N.POSITION.TOP_RIGHT,transition:C.default,autoClose:5e3,hideProgressBar:!1,closeButton:d.default.createElement(T.default,null),pauseOnHover:!0,closeOnClick:!0,newestOnTop:!1,className:null,style:null,toastClassName:"",bodyClassName:"",progressClassName:""},e.default=R},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}e.__esModule=!0;var u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},l=n(1),c=o(l),f=n(0),p=o(f),d=n(10),h=Object.values||function(t){return Object.keys(t).map(function(e){return t[e]})},m=(c.default.any,c.default.node,c.default.bool,c.default.bool,c.default.bool,c.default.func,{component:"div",childFactory:function(t){return t}}),y=function(t){function e(n,o){i(this,e);var r=a(this,t.call(this,n,o));return r.handleExited=function(t,e,n){var o=(0,d.getChildMapping)(r.props.children);t in o||(n&&n(e),r.setState(function(e){var n=u({},e.children);return delete n[t],{children:n}}))},r.state={children:(0,d.getChildMapping)(n.children,function(t){var e=function(e){r.handleExited(t.key,e,t.props.onExited)};return(0,f.cloneElement)(t,{onExited:e,in:!0,appear:r.getProp(t,"appear"),enter:r.getProp(t,"enter"),exit:r.getProp(t,"exit")})})},r}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:{isMounting:!this.appeared}}},e.prototype.getProp=function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:this.props;return null!=n[e]?n[e]:t.props[e]},e.prototype.componentDidMount=function(){this.appeared=!0},e.prototype.componentWillReceiveProps=function(t){var e=this,n=this.state.children,o=(0,d.getChildMapping)(t.children),r=(0,d.mergeChildMappings)(n,o);Object.keys(r).forEach(function(i){var a=r[i];if((0,f.isValidElement)(a)){var s=function(t){e.handleExited(a.key,t,a.props.onExited)},u=i in n,l=i in o,c=n[i],p=(0,f.isValidElement)(c)&&!c.props.in;!l||u&&!p?l||!u||p?l&&u&&(0,f.isValidElement)(c)&&(r[i]=(0,f.cloneElement)(a,{onExited:s,in:c.props.in,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})):r[i]=(0,f.cloneElement)(a,{in:!1}):r[i]=(0,f.cloneElement)(a,{onExited:s,in:!0,exit:e.getProp(a,"exit",t),enter:e.getProp(a,"enter",t)})}}),this.setState({children:r})},e.prototype.render=function(){var t=this.props,e=t.component,n=t.childFactory,o=r(t,["component","childFactory"]),i=this.state.children;return delete o.appear,delete o.enter,delete o.exit,p.default.createElement(e,o,h(i).map(n))},e}(p.default.Component);y.childContextTypes={transitionGroup:c.default.object.isRequired},y.propTypes={},y.defaultProps=m,e.default=y,t.exports=e.default},function(t,e,n){"use strict";function o(t,e){var n=function(t){return e&&(0,i.isValidElement)(t)?e(t):t},o=Object.create(null);return t&&i.Children.map(t,function(t){return t}).forEach(function(t){o[t.key]=n(t)}),o}function r(t,e){function n(n){return n in e?e[n]:t[n]}t=t||{},e=e||{};var o=Object.create(null),r=[];for(var i in t)i in e?r.length&&(o[i]=r,r=[]):r.push(i);var a=void 0,s={};for(var u in e){if(o[u])for(a=0;a<o[u].length;a++){var l=o[u][a];s[o[u][a]]=n(l)}s[u]=n(u)}for(a=0;a<r.length;a++)s[r[a]]=n(r[a]);return s}e.__esModule=!0,e.getChildMapping=o,e.mergeChildMappings=r;var i=n(0)},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function s(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}Object.defineProperty(e,"__esModule",{value:!0});var u=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),l=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},c=n(0),f=o(c),p=n(1),d=o(p),h=n(2),m=n(12),y=o(m),O=n(3),b=n(4),v=o(b),g=n(5),E=function(t){return(0,h.css)(l({position:"relative",minHeight:"48px",marginBottom:"1rem",padding:"8px",borderRadius:"1px",boxShadow:"0 1px 10px 0 rgba(0, 0, 0, .1), 0 2px 15px 0 rgba(0, 0, 0, .05)",display:"flex",justifyContent:"space-between",maxHeight:"800px",overflow:"hidden",fontFamily:v.default.fontFamily,cursor:"pointer",background:v.default["color"+t.charAt(0).toUpperCase()+t.slice(1)]},"default"===t?{color:"#aaa"}:{},s({},"@media "+v.default.mobile,{marginBottom:0})))},T=(0,h.css)({margin:"auto 0",flex:1}),x=function(t){function e(){var t,n,o,a;r(this,e);for(var s=arguments.length,u=Array(s),l=0;l<s;l++)u[l]=arguments[l];return n=o=i(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(u))),o.state={isRunning:!0},o.pauseToast=function(){o.setState({isRunning:!1})},o.playToast=function(){o.setState({isRunning:!0})},a=n,i(o,a)}return a(e,t),u(e,[{key:"componentDidMount",value:function(){null!==this.props.onOpen&&this.props.onOpen(this.getChildrenProps())}},{key:"componentWillReceiveProps",value:function(t){this.props.isDocumentHidden!==t.isDocumentHidden&&this.setState({isRunning:!t.isDocumentHidden})}},{key:"componentWillUnmount",value:function(){null!==this.props.onClose&&this.props.onClose(this.getChildrenProps())}},{key:"getChildrenProps",value:function(){return this.props.children.props}},{key:"getToastProps",value:function(){var t={};return!1!==this.props.autoClose&&!0===this.props.pauseOnHover&&(t.onMouseEnter=this.pauseToast,t.onMouseLeave=this.playToast),"string"==typeof this.props.className&&(t.className=this.props.className),this.props.closeOnClick&&(t.onClick=this.props.closeToast),t}},{key:"render",value:function(){var t=this.props,e=t.closeButton,n=t.children,o=t.autoClose,r=t.type,i=t.hideProgressBar,a=t.closeToast,s=t.transition,u=t.position,c=t.onExited,p=t.className,d=t.bodyClassName,m=t.progressClassName,O=t.updateId;return f.default.createElement(s,{in:this.props.in,appear:!0,unmountOnExit:!0,onExited:c,position:u},f.default.createElement("div",l({},"string"!=typeof p?(0,h.css)(E(r),p):E(r),this.getToastProps()),f.default.createElement("div",l({},"string"!=typeof d?(0,h.css)(T,d):T,"string"==typeof d&&{className:d}),n),!1!==e&&e,!1!==o&&f.default.createElement(y.default,{key:"pb-"+O,delay:o,isRunning:this.state.isRunning,closeToast:a,hide:i,type:r,className:m})))}}]),e}(c.Component);x.propTypes={closeButton:g.falseOrElement.isRequired,autoClose:g.falseOrDelay.isRequired,children:d.default.node.isRequired,closeToast:d.default.func.isRequired,position:d.default.oneOf((0,g.objectValues)(O.POSITION)).isRequired,pauseOnHover:d.default.bool.isRequired,closeOnClick:d.default.bool.isRequired,transition:d.default.func.isRequired,isDocumentHidden:d.default.bool.isRequired,in:d.default.bool,onExited:d.default.func,hideProgressBar:d.default.bool,onOpen:d.default.func,onClose:d.default.func,type:d.default.oneOf((0,g.objectValues)(O.TYPE)),className:d.default.oneOfType([d.default.string,d.default.object]),bodyClassName:d.default.oneOfType([d.default.string,d.default.object]),progressClassName:d.default.oneOfType([d.default.string,d.default.object]),updateId:d.default.number},x.defaultProps={type:O.TYPE.DEFAULT,in:!0,hideProgressBar:!1,onOpen:null,onClose:null,className:"",bodyClassName:"",progressClassName:"",updateId:null},e.default=x},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t){var e=t.delay,n=t.isRunning,o=t.closeToast,r=t.type,a=t.hide,u=t.className;return s.default.createElement("div",i({},"string"!=typeof u?(0,c.css)(m(r,n,a,e),u):m(r,n,a,e),"string"==typeof u&&{className:u},{onAnimationEnd:o}))}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},a=n(0),s=o(a),u=n(1),l=o(u),c=n(2),f=n(3),p=n(4),d=o(p),h=c.css.keyframes("track-progress",{"0%":{width:"100%"},"100%":{width:0}}),m=function(t,e,n,o){return(0,c.css)(i({position:"absolute",bottom:0,left:0,width:0,height:"5px",zIndex:d.default.zIndex,opacity:n?0:.7,animation:h+" linear 1",animationPlayState:e?"running":"paused",animationDuration:o+"ms",backgroundColor:"rgba(255,255,255,.7)"},"default"===t?{background:d.default.colorProgressDefault}:{}))};r.propTypes={delay:l.default.number.isRequired,isRunning:l.default.bool.isRequired,closeToast:l.default.func.isRequired,type:l.default.string,hide:l.default.bool,className:l.default.oneOfType([l.default.string,l.default.object])},r.defaultProps={type:f.TYPE.DEFAULT,hide:!1,className:""},e.default=r},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t){var e=t.closeToast,n=t.type;return s.default.createElement("button",i({},f("default"===n),{type:"button",onClick:e}),"✖")}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},a=n(0),s=o(a),u=n(1),l=o(u),c=n(2),f=function(t){return(0,c.css)({color:t?"#000":"#fff",fontWeight:"bold",fontSize:"14px",background:"transparent",outline:"none",border:"none",padding:0,cursor:"pointer",opacity:t?"0.3":"0.7",transition:".3s ease",alignSelf:"flex-start",":hover, :focus":{opacity:1}})};r.propTypes={closeToast:l.default.func},e.default=r},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n}function i(t){var e=t.children,n=t.position,o=r(t,["children","position"]),i=m(n),s=i.enter,l=i.exit;return u.default.createElement(c.default,a({},o,{timeout:750,onEnter:function(t){return t.classList.add(s)},onEntered:function(t){return t.classList.remove(s)},onExit:function(t){return t.classList.add(l)}}),e)}Object.defineProperty(e,"__esModule",{value:!0});var a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},s=n(0),u=o(s),l=n(15),c=o(l),f=n(2),p=n(18),d=o(p),h={animationDuration:"0.75s",animationFillMode:"both"},m=function(t){var e=(0,d.default)(t),n=e.enter,o=e.exit,r=f.css.keyframes("enter",a({"from, 60%, 75%, 90%, to":{animationTimingFunction:"cubic-bezier(0.215, 0.610, 0.355, 1.000)"}},n)),i=f.css.keyframes("exit",o);return{enter:(0,f.css)(a({},h,{animationName:r})),exit:(0,f.css)(a({},h,{animationName:i}))}};e.default=i},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function r(t,e){var n={};for(var o in t)e.indexOf(o)>=0||Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function s(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}function u(){}e.__esModule=!0,e.EXITING=e.ENTERED=e.ENTERING=e.EXITED=e.UNMOUNTED=void 0;var l=n(1),c=function(t){if(t&&t.__esModule)return t;var e={};if(null!=t)for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e.default=t,e}(l),f=n(0),p=o(f),d=n(16),h=o(d),m=(n(17),e.UNMOUNTED="unmounted"),y=e.EXITED="exited",O=e.ENTERING="entering",b=e.ENTERED="entered",v=e.EXITING="exiting",g=function(t){function e(n,o){i(this,e);var r=a(this,t.call(this,n,o)),s=o.transitionGroup,u=s&&!s.isMounting?n.enter:n.appear,l=void 0;return r.nextStatus=null,n.in?u?(l=y,r.nextStatus=O):l=b:l=n.unmountOnExit||n.mountOnEnter?m:y,r.state={status:l},r.nextCallback=null,r}return s(e,t),e.prototype.getChildContext=function(){return{transitionGroup:null}},e.prototype.componentDidMount=function(){this.updateStatus(!0)},e.prototype.componentWillReceiveProps=function(t){var e=this.pendingState||this.state,n=e.status;t.in?(n===m&&this.setState({status:y}),n!==O&&n!==b&&(this.nextStatus=O)):n!==O&&n!==b||(this.nextStatus=v)},e.prototype.componentDidUpdate=function(){this.updateStatus()},e.prototype.componentWillUnmount=function(){this.cancelNextCallback()},e.prototype.getTimeouts=function(){var t=this.props.timeout,e=void 0,n=void 0,o=void 0;return e=n=o=t,null!=t&&"number"!=typeof t&&(e=t.exit,n=t.enter,o=t.appear),{exit:e,enter:n,appear:o}},e.prototype.updateStatus=function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.nextStatus;if(null!==e){this.nextStatus=null,this.cancelNextCallback();var n=h.default.findDOMNode(this);e===O?this.performEnter(n,t):this.performExit(n)}else this.props.unmountOnExit&&this.state.status===y&&this.setState({status:m})},e.prototype.performEnter=function(t,e){var n=this,o=this.props.enter,r=this.context.transitionGroup?this.context.transitionGroup.isMounting:e,i=this.getTimeouts();if(!e&&!o)return void this.safeSetState({status:b},function(){n.props.onEntered(t)});this.props.onEnter(t,r),this.safeSetState({status:O},function(){n.props.onEntering(t,r),n.onTransitionEnd(t,i.enter,function(){n.safeSetState({status:b},function(){n.props.onEntered(t,r)})})})},e.prototype.performExit=function(t){var e=this,n=this.props.exit,o=this.getTimeouts();if(!n)return void this.safeSetState({status:y},function(){e.props.onExited(t)});this.props.onExit(t),this.safeSetState({status:v},function(){e.props.onExiting(t),e.onTransitionEnd(t,o.exit,function(){e.safeSetState({status:y},function(){e.props.onExited(t)})})})},e.prototype.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},e.prototype.safeSetState=function(t,e){var n=this;this.pendingState=t,e=this.setNextCallback(e),this.setState(t,function(){n.pendingState=null,e()})},e.prototype.setNextCallback=function(t){var e=this,n=!0;return this.nextCallback=function(o){n&&(n=!1,e.nextCallback=null,t(o))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},e.prototype.onTransitionEnd=function(t,e,n){this.setNextCallback(n),t?(this.props.addEndListener&&this.props.addEndListener(t,this.nextCallback),null!=e&&setTimeout(this.nextCallback,e)):setTimeout(this.nextCallback,0)},e.prototype.render=function(){var t=this.state.status;if(t===m)return null;var e=this.props,n=e.children,o=r(e,["children"]);if(delete o.in,delete o.mountOnEnter,delete o.unmountOnExit,delete o.appear,delete o.enter,delete o.exit,delete o.timeout,delete o.addEndListener,delete o.onEnter,delete o.onEntering,delete o.onEntered,delete o.onExit,delete o.onExiting,delete o.onExited,"function"==typeof n)return n(t,o);var i=p.default.Children.only(n);return p.default.cloneElement(i,o)},e}(p.default.Component);g.contextTypes={transitionGroup:c.object},g.childContextTypes={transitionGroup:function(){}},g.propTypes={},g.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:u,onEntering:u,onEntered:u,onExit:u,onExiting:u,onExited:u},g.UNMOUNTED=0,g.EXITED=1,g.ENTERING=2,g.ENTERED=3,g.EXITING=4,e.default=g},function(t,e){t.exports=o},function(t,e,n){"use strict";function o(t){var e="transition"+t+"Timeout",n="transition"+t;return function(t){if(t[n]){if(null==t[e])return new Error(e+" wasn't supplied to CSSTransitionGroup: this can cause unreliable animations and won't be supported in a future version of React. See https://fb.me/react-animation-transition-group-timeout for more information.");if("number"!=typeof t[e])return new Error(e+" must be a number (in milliseconds)")}return null}}e.__esModule=!0,e.classNamesShape=e.timeoutsShape=void 0,e.transitionTimeout=o;var r=n(1),i=function(t){return t&&t.__esModule?t:{default:t}}(r);e.timeoutsShape=i.default.oneOfType([i.default.number,i.default.shape({enter:i.default.number,exit:i.default.number}).isRequired]),e.classNamesShape=i.default.oneOfType([i.default.string,i.default.shape({enter:i.default.string,exit:i.default.string,active:i.default.string}),i.default.shape({enter:i.default.string,enterActive:i.default.string,exit:i.default.string,exitActive:i.default.string})])},function(t,e,n){"use strict";function o(t){switch(t){case r.POSITION.TOP_RIGHT:case r.POSITION.BOTTOM_RIGHT:default:return{enter:{from:{opacity:0,transform:"translate3d(3000px, 0, 0)"},"60%":{opacity:1,transform:"translate3d(-25px, 0, 0)"},"75%":{transform:"translate3d(10px, 0, 0)"},"90%":{transform:"translate3d(-5px, 0, 0)"},to:{transform:"none"}},exit:{"20%":{opacity:1,transform:"translate3d(-20px, 0, 0)"},to:{opacity:0,transform:"translate3d(2000px, 0, 0)"}}};case r.POSITION.TOP_LEFT:case r.POSITION.BOTTOM_LEFT:return{enter:{"0%":{opacity:0,transform:"translate3d(-3000px, 0, 0)"},"60%":{opacity:1,transform:"translate3d(25px, 0, 0)"},"75%":{transform:"translate3d(-10px, 0, 0)"},"90%":{transform:"translate3d(5px, 0, 0)"},to:{transform:"none"}},exit:{"20%":{opacity:1,transform:"translate3d(20px, 0, 0)"},to:{opacity:0,transform:"translate3d(-2000px, 0, 0)"}}};case r.POSITION.BOTTOM_CENTER:return{enter:{from:{opacity:0,transform:"translate3d(0, 3000px, 0)"},"60%":{opacity:1,transform:"translate3d(0, -20px, 0)"},"75%":{transform:"translate3d(0, 10px, 0)"},"90%":{transform:"translate3d(0, -5px, 0)"},to:{transform:"translate3d(0, 0, 0)"}},exit:{"20%":{transform:"translate3d(0, 10px, 0)"},"40%, 45%":{opacity:1,transform:"translate3d(0, -20px, 0)"},to:{opacity:0,transform:"translate3d(0, 2000px, 0)"}}};case r.POSITION.TOP_CENTER:return{enter:{"0%":{opacity:0,transform:"translate3d(0, -3000px, 0)"},"60%":{opacity:1,transform:"translate3d(0, 25px, 0)"},"75%":{transform:"translate3d(0, -10px, 0)"},"90%":{transform:"translate3d(0, 5px, 0)"},to:{transform:"none"}},exit:{"20%":{transform:"translate3d(0, -10px, 0)"},"40%, 45%":{opacity:1,transform:"translate3d(0, 20px, 0)"},to:{opacity:0,transform:"translate3d(0, -2000px, 0)"}}}}}Object.defineProperty(e,"__esModule",{value:!0}),e.default=o;var r=n(3)},function(t,e,n){"use strict";function o(t,e){return i({},l,t,{type:e,toastId:++p})}function r(t,e){return null!==c?s.default.emit(u.ACTION.SHOW,t,e):f.push({action:u.ACTION.SHOW,content:t,options:e}),e.toastId}Object.defineProperty(e,"__esModule",{value:!0});var i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},a=n(6),s=function(t){return t&&t.__esModule?t:{default:t}}(a),u=n(3),l={type:u.TYPE.DEFAULT,autoClose:null,closeButton:null,hideProgressBar:null,position:null,pauseOnHover:null,closeOnClick:null,className:null,bodyClassName:null,progressClassName:null,transition:null,updateId:null},c=null,f=[],p=0,d=i(function(t,e){return r(t,o(e,e&&e.type||u.TYPE.DEFAULT))},{success:function(t,e){return r(t,o(e,u.TYPE.SUCCESS))},info:function(t,e){return r(t,o(e,u.TYPE.INFO))},warn:function(t,e){return r(t,o(e,u.TYPE.WARNING))},warning:function(t,e){return r(t,o(e,u.TYPE.WARNING))},error:function(t,e){return r(t,o(e,u.TYPE.ERROR))},dismiss:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;return c&&s.default.emit(u.ACTION.CLEAR,t)},isActive:function(){return!1},update:function(t,e){if(c&&void 0!==c.collection[t]){var n=c.collection[t],o=n.options,a=n.content,s=null!==o.updateId?o.updateId+1:1,u=i({},o,e,{toastId:t,updateId:s}),l=void 0!==u.render?u.render:a;return delete u.render,r(l,u)}return!1}},{POSITION:u.POSITION,TYPE:u.TYPE});s.default.on(u.ACTION.MOUNTED,function(t){c=t,d.isActive=function(t){return c.isToastActive(t)},f.forEach(function(t){s.default.emit(t.action,t.content,t.options)}),f=[]}),e.default=d}])});
 //# sourceMappingURL=ReactToastify.min.js.map

index.d.ts

@@ -1,16 +0,24 @@
-import * as React from "react";
-import Transition from "react-transition-group/Transition";
+import * as React from 'react';
+import Transition from 'react-transition-group/Transition';
 
-type ToastType = "info" | "success" | "warning" | "error" | "default";
+type ToastType = 'info' | 'success' | 'warning' | 'error' | 'default';
 
+type ToastContent = React.ReactNode | () => void;
+
 interface styleProps {
-  width?: string,
-  colorDefault?: string,
-  colorInfo?: string,
-  colorSuccess?: string,
-  colorWarning?: string,
-  colorError?: string,
-  colorProgressDefault?: string,
-  mobile?: string,
-  zIndex?: string | number,
+  width?: string;
+  colorDefault?: string;
+  colorInfo?: string;
+  colorSuccess?: string;
+  colorWarning?: string;
+  colorError?: string;
+  colorProgressDefault?: string;
+  mobile?: string;
+  zIndex?: string | number;
+  TOP_LEFT?: object;
+  TOP_CENTER?: object;
+  TOP_RIGHT?: object;
+  BOTTOM_LEFT?: object;
+  BOTTOM_CENTER?: object;
+  BOTTOM_RIGHT?: object;
 }
@@ -38,3 +46,3 @@
 interface UpdateOptions extends ToastOptions {
-  render?: React.ReactNode
+  render?: ToastContent;
 }
@@ -49,10 +57,10 @@
 interface Toast {
-  success(content: React.ReactNode, options?: ToastOptions): number;
-  info(content: React.ReactNode, options?: ToastOptions): number;
-  warn(content: React.ReactNode, options?: ToastOptions): number;
-  error(content: React.ReactNode, options?: ToastOptions): number;
+  success(content: ToastContent, options?: ToastOptions): number;
+  info(content: ToastContent, options?: ToastOptions): number;
+  warn(content: ToastContent, options?: ToastOptions): number;
+  error(content: ToastContent, options?: ToastOptions): number;
   isActive(toastId: number): boolean;
   dismiss(toastId?: number): void;
   update(toastId: number, options?: UpdateOptions): number;
-  (content: React.ReactNode, options?: ToastOptions): number;
+  (content: ToastContent, options?: ToastOptions): number;
 }
@@ -59,0 +67,0 @@

lib/animation.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -8,3 +8,3 @@ Object.defineProperty(exports, "__esModule", {
 
-var _constant = require("./constant");
+var _constant = require('./constant');
 
@@ -20,26 +20,26 @@ function getAnimation(pos) {
             opacity: 0,
-            transform: "translate3d(3000px, 0, 0)"
+            transform: 'translate3d(3000px, 0, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(-25px, 0, 0)"
+            transform: 'translate3d(-25px, 0, 0)'
           },
-          "75%": {
-            transform: "translate3d(10px, 0, 0)"
+          '75%': {
+            transform: 'translate3d(10px, 0, 0)'
           },
-          "90%": {
-            transform: "translate3d(-5px, 0, 0)"
+          '90%': {
+            transform: 'translate3d(-5px, 0, 0)'
           },
           to: {
-            transform: "none"
+            transform: 'none'
           }
         },
         exit: {
-          "20%": {
+          '20%': {
             opacity: 1,
-            transform: "translate3d(-20px, 0, 0)"
+            transform: 'translate3d(-20px, 0, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(2000px, 0, 0)"
+            transform: 'translate3d(2000px, 0, 0)'
           }
@@ -52,28 +52,28 @@ }
         enter: {
-          "0%": {
+          '0%': {
             opacity: 0,
-            transform: "translate3d(-3000px, 0, 0)"
+            transform: 'translate3d(-3000px, 0, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(25px, 0, 0)"
+            transform: 'translate3d(25px, 0, 0)'
           },
-          "75%": {
-            transform: "translate3d(-10px, 0, 0)"
+          '75%': {
+            transform: 'translate3d(-10px, 0, 0)'
           },
-          "90%": {
-            transform: "translate3d(5px, 0, 0)"
+          '90%': {
+            transform: 'translate3d(5px, 0, 0)'
           },
           to: {
-            transform: "none"
+            transform: 'none'
           }
         },
         exit: {
-          "20%": {
+          '20%': {
             opacity: 1,
-            transform: "translate3d(20px, 0, 0)"
+            transform: 'translate3d(20px, 0, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(-2000px, 0, 0)"
+            transform: 'translate3d(-2000px, 0, 0)'
           }
@@ -87,29 +87,29 @@ }
             opacity: 0,
-            transform: "translate3d(0, 3000px, 0)"
+            transform: 'translate3d(0, 3000px, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(0, -20px, 0)"
+            transform: 'translate3d(0, -20px, 0)'
           },
-          "75%": {
-            transform: "translate3d(0, 10px, 0)"
+          '75%': {
+            transform: 'translate3d(0, 10px, 0)'
           },
-          "90%": {
-            transform: "translate3d(0, -5px, 0)"
+          '90%': {
+            transform: 'translate3d(0, -5px, 0)'
           },
           to: {
-            transform: "translate3d(0, 0, 0)"
+            transform: 'translate3d(0, 0, 0)'
           }
         },
         exit: {
-          "20%": {
-            transform: "translate3d(0, 10px, 0)"
+          '20%': {
+            transform: 'translate3d(0, 10px, 0)'
           },
-          "40%, 45%": {
+          '40%, 45%': {
             opacity: 1,
-            transform: "translate3d(0, -20px, 0)"
+            transform: 'translate3d(0, -20px, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(0, 2000px, 0)"
+            transform: 'translate3d(0, 2000px, 0)'
           }
@@ -121,31 +121,31 @@ }
         enter: {
-          "0%": {
+          '0%': {
             opacity: 0,
-            transform: "translate3d(0, -3000px, 0)"
+            transform: 'translate3d(0, -3000px, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(0, 25px, 0)"
+            transform: 'translate3d(0, 25px, 0)'
           },
-          "75%": {
-            transform: "translate3d(0, -10px, 0)"
+          '75%': {
+            transform: 'translate3d(0, -10px, 0)'
           },
-          "90%": {
-            transform: "translate3d(0, 5px, 0)"
+          '90%': {
+            transform: 'translate3d(0, 5px, 0)'
           },
           to: {
-            transform: "none"
+            transform: 'none'
           }
         },
         exit: {
-          "20%": {
-            transform: "translate3d(0, -10px, 0)"
+          '20%': {
+            transform: 'translate3d(0, -10px, 0)'
           },
-          "40%, 45%": {
+          '40%, 45%': {
             opacity: 1,
-            transform: "translate3d(0, 20px, 0)"
+            transform: 'translate3d(0, 20px, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(0, -2000px, 0)"
+            transform: 'translate3d(0, -2000px, 0)'
           }
@@ -152,0 +152,0 @@ }

lib/constant.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -7,21 +7,21 @@ Object.defineProperty(exports, "__esModule", {
 var POSITION = exports.POSITION = {
-  TOP_LEFT: "top-left",
-  TOP_RIGHT: "top-right",
-  TOP_CENTER: "top-center",
-  BOTTOM_LEFT: "bottom-left",
-  BOTTOM_RIGHT: "bottom-right",
-  BOTTOM_CENTER: "bottom-center"
+  TOP_LEFT: 'top-left',
+  TOP_RIGHT: 'top-right',
+  TOP_CENTER: 'top-center',
+  BOTTOM_LEFT: 'bottom-left',
+  BOTTOM_RIGHT: 'bottom-right',
+  BOTTOM_CENTER: 'bottom-center'
 };
 
 var TYPE = exports.TYPE = {
-  INFO: "info",
-  SUCCESS: "success",
-  WARNING: "warning",
-  ERROR: "error",
-  DEFAULT: "default"
+  INFO: 'info',
+  SUCCESS: 'success',
+  WARNING: 'warning',
+  ERROR: 'error',
+  DEFAULT: 'default'
 };
 var ACTION = exports.ACTION = {
-  SHOW: "SHOW_TOAST",
-  CLEAR: "CLEAR_TOAST",
-  MOUNTED: "CONTAINER_MOUNTED"
+  SHOW: 'SHOW_TOAST',
+  CLEAR: 'CLEAR_TOAST',
+  MOUNTED: 'CONTAINER_MOUNTED'
 };

lib/DefaultCloseButton.js

@@ -24,14 +24,14 @@ 'use strict';
   return (0, _glamor.css)({
-    color: isDefault ? "#000" : "#fff",
-    fontWeight: "bold",
-    fontSize: "14px",
-    background: "transparent",
-    outline: "none",
-    border: "none",
+    color: isDefault ? '#000' : '#fff',
+    fontWeight: 'bold',
+    fontSize: '14px',
+    background: 'transparent',
+    outline: 'none',
+    border: 'none',
     padding: 0,
-    cursor: "pointer",
-    opacity: isDefault ? "0.3" : "0.7",
-    transition: ".3s ease",
-    alignSelf: "flex-start",
-    ":hover, :focus": {
+    cursor: 'pointer',
+    opacity: isDefault ? '0.3' : '0.7',
+    transition: '.3s ease',
+    alignSelf: 'flex-start',
+    ':hover, :focus': {
       opacity: 1
@@ -48,6 +48,3 @@ }
     'button',
-    _extends({}, rule(type === "default"), {
-      type: 'button',
-      onClick: closeToast
-    }),
+    _extends({}, rule(type === 'default'), { type: 'button', onClick: closeToast }),
     '\u2716'
@@ -54,0 +51,0 @@ );

lib/DefaultTransition.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -9,13 +9,13 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
-var _Transition = require("react-transition-group/Transition");
+var _Transition = require('react-transition-group/Transition');
 
 var _Transition2 = _interopRequireDefault(_Transition);
 
-var _glamor = require("glamor");
+var _glamor = require('glamor');
 
-var _animation2 = require("./animation");
+var _animation2 = require('./animation');
 
@@ -29,4 +29,4 @@ var _animation3 = _interopRequireDefault(_animation2);
 var animate = {
-  animationDuration: "0.75s",
-  animationFillMode: "both"
+  animationDuration: '0.75s',
+  animationFillMode: 'both'
 };
@@ -39,8 +39,8 @@
 
-  var enterAnimation = _glamor.css.keyframes("enter", _extends({
-    "from, 60%, 75%, 90%, to": {
-      animationTimingFunction: "cubic-bezier(0.215, 0.610, 0.355, 1.000)"
+  var enterAnimation = _glamor.css.keyframes('enter', _extends({
+    'from, 60%, 75%, 90%, to': {
+      animationTimingFunction: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)'
     }
   }, enter));
-  var exitAnimation = _glamor.css.keyframes("exit", exit);
+  var exitAnimation = _glamor.css.keyframes('exit', exit);
 
@@ -56,3 +56,3 @@ return {
       position = _ref.position,
-      props = _objectWithoutProperties(_ref, ["children", "position"]);
+      props = _objectWithoutProperties(_ref, ['children', 'position']);
 
@@ -59,0 +59,0 @@ var _animation = animation(position),

lib/ProgressBar.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -9,15 +9,15 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
-var _propTypes = require("prop-types");
+var _propTypes = require('prop-types');
 
 var _propTypes2 = _interopRequireDefault(_propTypes);
 
-var _glamor = require("glamor");
+var _glamor = require('glamor');
 
-var _constant = require("./constant");
+var _constant = require('./constant');
 
-var _style = require("./style");
+var _style = require('./style');
 
@@ -28,5 +28,5 @@ var _style2 = _interopRequireDefault(_style);
 
-var trackProgress = _glamor.css.keyframes("track-progress", {
-  "0%": { width: "100%" },
-  "100%": { width: 0 }
+var trackProgress = _glamor.css.keyframes('track-progress', {
+  '0%': { width: '100%' },
+  '100%': { width: 0 }
 });
@@ -36,14 +36,14 @@
   return (0, _glamor.css)(_extends({
-    position: "absolute",
+    position: 'absolute',
     bottom: 0,
     left: 0,
     width: 0,
-    height: "5px",
+    height: '5px',
     zIndex: _style2.default.zIndex,
     opacity: hide ? 0 : 0.7,
-    animation: trackProgress + " linear 1",
-    animationPlayState: isRunning ? "running" : "paused",
-    animationDuration: delay + "ms",
-    backgroundColor: "rgba(255,255,255,.7)"
-  }, type === "default" ? { background: _style2.default.colorProgressDefault } : {}));
+    animation: trackProgress + ' linear 1',
+    animationPlayState: isRunning ? 'running' : 'paused',
+    animationDuration: delay + 'ms',
+    backgroundColor: 'rgba(255,255,255,.7)'
+  }, type === 'default' ? { background: _style2.default.colorProgressDefault } : {}));
 };
@@ -59,3 +59,3 @@
 
-  return _react2.default.createElement("div", _extends({}, typeof className !== "string" ? (0, _glamor.css)(progress(type, isRunning, hide, delay), className) : progress(type, isRunning, hide, delay), typeof className === "string" && { className: className }, {
+  return _react2.default.createElement('div', _extends({}, typeof className !== 'string' ? (0, _glamor.css)(progress(type, isRunning, hide, delay), className) : progress(type, isRunning, hide, delay), typeof className === 'string' && { className: className }, {
     onAnimationEnd: closeToast
@@ -100,5 +100,5 @@ }));
   hide: false,
-  className: ""
+  className: ''
 };
 
 exports.default = ProgressBar;

lib/style.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -8,22 +8,44 @@ Object.defineProperty(exports, "__esModule", {
 var style = {
-  width: "320px",
-  colorDefault: "#fff",
-  colorInfo: "#3498db",
-  colorSuccess: "#07bc0c",
-  colorWarning: "#f1c40f",
-  colorError: "#e74c3c",
-  colorProgressDefault: "linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55)",
-  mobile: "only screen and (max-width : 480px)",
-  zIndex: 9999
+  width: '320px',
+  colorDefault: '#fff',
+  colorInfo: '#3498db',
+  colorSuccess: '#07bc0c',
+  colorWarning: '#f1c40f',
+  colorError: '#e74c3c',
+  colorProgressDefault: 'linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55)',
+  mobile: 'only screen and (max-width : 480px)',
+  fontFamily: 'sans-serif',
+  zIndex: 9999,
+  TOP_LEFT: {
+    top: '1em',
+    left: '1em'
+  },
+  TOP_CENTER: {
+    top: '1em',
+    left: '50%'
+  },
+  TOP_RIGHT: {
+    top: '1em',
+    right: '1em'
+  },
+  BOTTOM_LEFT: {
+    bottom: '1em',
+    left: '1em'
+  },
+  BOTTOM_CENTER: {
+    bottom: '1em',
+    left: '50%'
+  },
+  BOTTOM_RIGHT: {
+    bottom: '1em',
+    right: '1em'
+  }
 };
 
 function defineStyle(props) {
-  Object.keys(props).forEach(function (k) {
-    var val = props[k];
-    if (style.hasOwnProperty(k)) {
-      style[k] = val;
-    }
-  });
+  for (var prop in props) {
+    style[prop] = props[prop];
+  }
 }
 
 exports.default = style;

lib/Toast.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -11,23 +11,23 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
-var _propTypes = require("prop-types");
+var _propTypes = require('prop-types');
 
 var _propTypes2 = _interopRequireDefault(_propTypes);
 
-var _glamor = require("glamor");
+var _glamor = require('glamor');
 
-var _ProgressBar = require("./ProgressBar");
+var _ProgressBar = require('./ProgressBar');
 
 var _ProgressBar2 = _interopRequireDefault(_ProgressBar);
 
-var _constant = require("./constant");
+var _constant = require('./constant');
 
-var _style = require("./style");
+var _style = require('./style');
 
 var _style2 = _interopRequireDefault(_style);
 
-var _propValidator = require("./util/propValidator");
+var _propValidator = require('./util/propValidator');
 
@@ -46,16 +46,16 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
   return (0, _glamor.css)(_extends({
-    position: "relative",
-    minHeight: "48px",
-    marginBottom: "1rem",
-    padding: "8px",
-    borderRadius: "1px",
-    boxShadow: "0 1px 10px 0 rgba(0, 0, 0, .1), 0 2px 15px 0 rgba(0, 0, 0, .05)",
-    display: "flex",
-    justifyContent: "space-between",
-    maxHeight: "800px",
-    overflow: "hidden",
-    fontFamily: "sans-serif",
-    cursor: "pointer",
-    background: _style2.default["color" + type.charAt(0).toUpperCase() + type.slice(1)]
-  }, type === "default" ? { color: "#aaa" } : {}, _defineProperty({}, "@media " + _style2.default.mobile, {
+    position: 'relative',
+    minHeight: '48px',
+    marginBottom: '1rem',
+    padding: '8px',
+    borderRadius: '1px',
+    boxShadow: '0 1px 10px 0 rgba(0, 0, 0, .1), 0 2px 15px 0 rgba(0, 0, 0, .05)',
+    display: 'flex',
+    justifyContent: 'space-between',
+    maxHeight: '800px',
+    overflow: 'hidden',
+    fontFamily: _style2.default.fontFamily,
+    cursor: 'pointer',
+    background: _style2.default['color' + type.charAt(0).toUpperCase() + type.slice(1)]
+  }, type === 'default' ? { color: '#aaa' } : {}, _defineProperty({}, '@media ' + _style2.default.mobile, {
     marginBottom: 0
@@ -66,3 +66,3 @@ })));
 var body = (0, _glamor.css)({
-  margin: "auto 0",
+  margin: 'auto 0',
   flex: 1
@@ -95,3 +95,3 @@ });
   _createClass(Toast, [{
-    key: "componentDidMount",
+    key: 'componentDidMount',
     value: function componentDidMount() {
@@ -101,3 +101,3 @@ this.props.onOpen !== null && this.props.onOpen(this.getChildrenProps());
   }, {
-    key: "componentWillReceiveProps",
+    key: 'componentWillReceiveProps',
     value: function componentWillReceiveProps(nextProps) {
@@ -111,3 +111,3 @@ if (this.props.isDocumentHidden !== nextProps.isDocumentHidden) {
   }, {
-    key: "componentWillUnmount",
+    key: 'componentWillUnmount',
     value: function componentWillUnmount() {
@@ -117,3 +117,3 @@ this.props.onClose !== null && this.props.onClose(this.getChildrenProps());
   }, {
-    key: "getChildrenProps",
+    key: 'getChildrenProps',
     value: function getChildrenProps() {
@@ -123,3 +123,3 @@ return this.props.children.props;
   }, {
-    key: "getToastProps",
+    key: 'getToastProps',
     value: function getToastProps() {
@@ -132,3 +132,3 @@ var toastProps = {};
       }
-      typeof this.props.className === "string" && (toastProps.className = this.props.className);
+      typeof this.props.className === 'string' && (toastProps.className = this.props.className);
       this.props.closeOnClick && (toastProps.onClick = this.props.closeToast);
@@ -139,3 +139,3 @@
   }, {
-    key: "render",
+    key: 'render',
     value: function render() {
@@ -161,3 +161,3 @@ var _props = this.props,
         {
-          "in": this.props.in,
+          'in': this.props.in,
           appear: true,
@@ -169,7 +169,7 @@ unmountOnExit: true,
         _react2.default.createElement(
-          "div",
-          _extends({}, typeof className !== "string" ? (0, _glamor.css)(toast(type), className) : toast(type), this.getToastProps()),
+          'div',
+          _extends({}, typeof className !== 'string' ? (0, _glamor.css)(toast(type), className) : toast(type), this.getToastProps()),
           _react2.default.createElement(
-            "div",
-            _extends({}, typeof bodyClassName !== "string" ? (0, _glamor.css)(body, bodyClassName) : body, typeof bodyClassName === "string" && {
+            'div',
+            _extends({}, typeof bodyClassName !== 'string' ? (0, _glamor.css)(body, bodyClassName) : body, typeof bodyClassName === 'string' && {
               className: bodyClassName
@@ -181,3 +181,3 @@ }),
           autoClose !== false && _react2.default.createElement(_ProgressBar2.default, {
-            key: "pb-" + updateId,
+            key: 'pb-' + updateId,
             delay: autoClose,
@@ -225,7 +225,7 @@ isRunning: this.state.isRunning,
   onClose: null,
-  className: "",
-  bodyClassName: "",
-  progressClassName: "",
+  className: '',
+  bodyClassName: '',
+  progressClassName: '',
   updateId: null
 };
 exports.default = Toast;

lib/ToastContainer.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -13,39 +13,39 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
-var _propTypes = require("prop-types");
+var _propTypes = require('prop-types');
 
 var _propTypes2 = _interopRequireDefault(_propTypes);
 
-var _glamor = require("glamor");
+var _glamor = require('glamor');
 
-var _TransitionGroup = require("react-transition-group/TransitionGroup");
+var _TransitionGroup = require('react-transition-group/TransitionGroup');
 
 var _TransitionGroup2 = _interopRequireDefault(_TransitionGroup);
 
-var _Toast = require("./Toast");
+var _Toast = require('./Toast');
 
 var _Toast2 = _interopRequireDefault(_Toast);
 
-var _DefaultCloseButton = require("./DefaultCloseButton");
+var _DefaultCloseButton = require('./DefaultCloseButton');
 
 var _DefaultCloseButton2 = _interopRequireDefault(_DefaultCloseButton);
 
-var _DefaultTransition = require("./DefaultTransition");
+var _DefaultTransition = require('./DefaultTransition');
 
 var _DefaultTransition2 = _interopRequireDefault(_DefaultTransition);
 
-var _constant = require("./constant");
+var _constant = require('./constant');
 
-var _style = require("./style");
+var _style = require('./style');
 
 var _style2 = _interopRequireDefault(_style);
 
-var _EventManager = require("./util/EventManager");
+var _EventManager = require('./util/EventManager');
 
 var _EventManager2 = _interopRequireDefault(_EventManager);
 
-var _propValidator = require("./util/propValidator");
+var _propValidator = require('./util/propValidator');
 
@@ -65,49 +65,15 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var toastPosition = function toastPosition(pos) {
-  var rule = void 0;
-  var marginLeft = "-" + parseInt(_style2.default.width, 10) / 2 + "px";
-  switch (pos) {
-    case _constant.POSITION.TOP_LEFT:
-      rule = {
-        top: "1em",
-        left: "1em"
-      };
-      break;
-    case _constant.POSITION.TOP_CENTER:
-      rule = {
-        top: "1em",
-        left: "50%",
-        marginLeft: marginLeft
-      };
-      break;
-    case _constant.POSITION.TOP_RIGHT:
-    default:
-      rule = {
-        top: "1em",
-        right: "1em"
-      };
-      break;
-    case _constant.POSITION.BOTTOM_LEFT:
-      rule = {
-        bottom: "1em",
-        left: "1em"
-      };
-      break;
-    case _constant.POSITION.BOTTOM_CENTER:
-      rule = {
-        bottom: "1em",
-        left: "50%",
-        marginLeft: marginLeft
-      };
-      break;
-    case _constant.POSITION.BOTTOM_RIGHT:
-      rule = {
-        bottom: "1em",
-        right: "1em"
-      };
+  var positionKey = pos.toUpperCase().replace('-', '_');
+  var positionRule = typeof _constant.POSITION[positionKey] !== 'undefined' ? _style2.default[positionKey] : _style2.default.TOP_RIGHT;
+
+  /** define margin for center toast based on toast witdh */
+  if (positionKey.indexOf('CENTER') !== -1 && typeof positionRule.marginLeft === 'undefined') {
+    positionRule.marginLeft = '-' + parseInt(_style2.default.width, 10) / 2 + 'px';
   }
-  return (0, _glamor.css)(rule, (0, _glamor.css)(_defineProperty({}, "@media " + _style2.default.mobile, _extends({
+
+  return (0, _glamor.css)(positionRule, (0, _glamor.css)(_defineProperty({}, '@media ' + _style2.default.mobile, _extends({
     left: 0,
     margin: 0,
-    position: "fixed"
-  }, pos.substring(0, 3) === "top" ? { top: 0 } : { bottom: 0 }))));
+    position: 'fixed'
+  }, pos.substring(0, 3) === 'top' ? { top: 0 } : { bottom: 0 }))));
 };
@@ -118,9 +84,9 @@
     zIndex: _style2.default.zIndex,
-    position: "fixed",
-    padding: "4px",
+    position: 'fixed',
+    padding: '4px',
     width: _style2.default.width,
-    boxSizing: "border-box",
-    color: "#fff"
-  }, disablePointer ? { pointerEvents: "none" } : {}, _defineProperty({}, "@media " + _style2.default.mobile, {
-    width: "100vw",
+    boxSizing: 'border-box',
+    color: '#fff'
+  }, disablePointer ? { pointerEvents: 'none' } : {}, _defineProperty({}, '@media ' + _style2.default.mobile, {
+    width: '100vw',
     padding: 0
@@ -169,3 +135,3 @@ })), toastPosition(position));
   _createClass(ToastContainer, [{
-    key: "componentDidMount",
+    key: 'componentDidMount',
     value: function componentDidMount() {
@@ -183,13 +149,13 @@ var _this2 = this;
       }).emit(MOUNTED, this);
-      document.addEventListener("visibilitychange", this.isDocumentHidden);
+      document.addEventListener('visibilitychange', this.isDocumentHidden);
     }
   }, {
-    key: "componentWillUnmount",
+    key: 'componentWillUnmount',
     value: function componentWillUnmount() {
       _EventManager2.default.off(_constant.ACTION.SHOW);
       _EventManager2.default.off(_constant.ACTION.CLEAR);
-      document.removeEventListener("visibilitychange", this.isDocumentHidden);
+      document.removeEventListener('visibilitychange', this.isDocumentHidden);
     }
   }, {
-    key: "removeToast",
+    key: 'removeToast',
     value: function removeToast(id) {
@@ -203,3 +169,3 @@ this.setState({
   }, {
-    key: "makeCloseButton",
+    key: 'makeCloseButton',
     value: function makeCloseButton(toastClose, toastId, type) {
@@ -222,3 +188,3 @@ var _this3 = this;
   }, {
-    key: "getAutoCloseDelay",
+    key: 'getAutoCloseDelay',
     value: function getAutoCloseDelay(toastAutoClose) {
@@ -228,3 +194,3 @@ return toastAutoClose === false || (0, _propValidator.isValidDelay)(toastAutoClose) ? toastAutoClose : this.props.autoClose;
   }, {
-    key: "isFunction",
+    key: 'isFunction',
     value: function isFunction(object) {
@@ -234,8 +200,8 @@ return !!(object && object.constructor && object.call && object.apply);
   }, {
-    key: "canBeRendered",
+    key: 'canBeRendered',
     value: function canBeRendered(content) {
-      return (0, _react.isValidElement)(content) || typeof content === "string" || typeof content === "number";
+      return (0, _react.isValidElement)(content) || typeof content === 'string' || typeof content === 'number' || this.isFunction(content);
     }
   }, {
-    key: "show",
+    key: 'show',
     value: function show(content, options) {
@@ -245,3 +211,3 @@ var _this4 = this;
       if (!this.canBeRendered(content)) {
-        throw new Error("The element you provided cannot be rendered. You provided an element of type " + (typeof content === "undefined" ? "undefined" : _typeof(content)));
+        throw new Error('The element you provided cannot be rendered. You provided an element of type ' + (typeof content === 'undefined' ? 'undefined' : _typeof(content)));
       }
@@ -266,3 +232,3 @@ var toastId = options.toastId;
         autoClose: this.getAutoCloseDelay(options.autoClose !== false ? parseInt(options.autoClose, 10) : options.autoClose),
-        hideProgressBar: typeof options.hideProgressBar === "boolean" ? options.hideProgressBar : this.props.hideProgressBar
+        hideProgressBar: typeof options.hideProgressBar === 'boolean' ? options.hideProgressBar : this.props.hideProgressBar
       };
@@ -277,6 +243,8 @@
        */
-      if ((0, _react.isValidElement)(content) && typeof content.type !== "string" && typeof content.type !== "number") {
+      if ((0, _react.isValidElement)(content) && typeof content.type !== 'string' && typeof content.type !== 'number') {
         content = (0, _react.cloneElement)(content, {
           closeToast: closeToast
         });
+      } else if (this.isFunction(content)) {
+        content = content({ closeToast: closeToast });
       }
@@ -295,3 +263,3 @@
   }, {
-    key: "makeToast",
+    key: 'makeToast',
     value: function makeToast(content, options) {
@@ -302,3 +270,3 @@ return _react2.default.createElement(
           isDocumentHidden: this.state.isDocumentHidden,
-          key: "toast-" + options.id
+          key: 'toast-' + options.id
         }),
@@ -309,3 +277,3 @@ content
   }, {
-    key: "clear",
+    key: 'clear',
     value: function clear() {
@@ -315,3 +283,3 @@ this.setState({ toast: [] });
   }, {
-    key: "renderToast",
+    key: 'renderToast',
     value: function renderToast() {
@@ -345,4 +313,4 @@ var _this5 = this;
           _TransitionGroup2.default,
-          _extends({}, typeof className !== "string" ? (0, _glamor.css)(container(disablePointer, position), className) : container(disablePointer, position), typeof className === "string" && { className: className }, style !== null && { style: style }, {
-            key: "container-" + position
+          _extends({}, typeof className !== 'string' ? (0, _glamor.css)(container(disablePointer, position), className) : container(disablePointer, position), typeof className === 'string' && { className: className }, style !== null && { style: style }, {
+            key: 'container-' + position
           }),
@@ -354,6 +322,6 @@ toastToRender[position]
   }, {
-    key: "render",
+    key: 'render',
     value: function render() {
       return _react2.default.createElement(
-        "div",
+        'div',
         null,
@@ -445,6 +413,6 @@ this.renderToast()
   style: null,
-  toastClassName: "",
-  bodyClassName: "",
-  progressClassName: ""
+  toastClassName: '',
+  bodyClassName: '',
+  progressClassName: ''
 };
 exports.default = ToastContainer;

lib/toaster.js

@@ -41,3 +41,6 @@ 'use strict';
 function mergeOptions(options, type) {
-  return _extends({}, defaultOptions, options, { type: type, toastId: ++toastId });
+  return _extends({}, defaultOptions, options, {
+    type: type,
+    toastId: ++toastId
+  });
 }
@@ -93,4 +96,7 @@
 
-      var nextOptions = _extends({}, oldOptions, options, { toastId: id, updateId: updateId });
-      var content = typeof nextOptions.render !== "undefined" ? nextOptions.render : oldContent;
+      var nextOptions = _extends({}, oldOptions, options, {
+        toastId: id,
+        updateId: updateId
+      });
+      var content = typeof nextOptions.render !== 'undefined' ? nextOptions.render : oldContent;
       delete nextOptions.render;
@@ -97,0 +103,0 @@

lib/util/propValidator.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -10,6 +10,6 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require("react");
+var _react = require('react');
 
 function isValidDelay(val) {
-  return typeof val === "number" && !isNaN(val) && val > 0;
+  return typeof val === 'number' && !isNaN(val) && val > 0;
 }
@@ -27,4 +27,4 @@
 
-    if (typeof prop === "undefined") {
-      return new Error("The prop " + propName + " is marked as required in \n      " + componentName + ", but its value is undefined.");
+    if (typeof prop === 'undefined') {
+      return new Error('The prop ' + propName + ' is marked as required in \n      ' + componentName + ', but its value is undefined.');
     }
@@ -41,3 +41,3 @@
   if (prop !== false && !isValidDelay(prop)) {
-    return new Error(componentName + " expect " + propName + " \n      to be a valid Number > 0 or equal to false. " + prop + " given.");
+    return new Error(componentName + ' expect ' + propName + ' \n      to be a valid Number > 0 or equal to false. ' + prop + ' given.');
   }
@@ -52,3 +52,3 @@
   if (prop !== false && !(0, _react.isValidElement)(prop)) {
-    return new Error(componentName + " expect " + propName + " \n      to be a valid react element or equal to false. " + prop + " given.");
+    return new Error(componentName + ' expect ' + propName + ' \n      to be a valid react element or equal to false. ' + prop + ' given.');
   }
@@ -55,0 +55,0 @@

package.json

 {
   "name": "react-toastify",
-  "version": "3.1.2",
+  "version": "3.2.0",
   "description": "React notification made easy",
@@ -21,2 +21,3 @@ "keywords": [
     "lint:fix": "eslint --fix src/",
+    "prettier-all": "prettier --single-quote --write 'src/**/*.js'",
     "prebuild": "npm run test",
@@ -73,2 +74,3 @@ "build": "NODE_ENV=production ./scripts/build.sh"
     "jest-glamor-react": "^3.2.2",
+    "prettier": "^1.9.2",
     "raf": "^3.3.2",
@@ -75,0 +77,0 @@ "react": "^16.0.0",

README.md

@@ -225,2 +225,8 @@ # React Toastify [![Build Status](https://travis-ci.org/fkhadra/react-toastify.svg?branch=master)](https://travis-ci.org/fkhadra/react-toastify) [![npm](https://img.shields.io/npm/dm/react-toastify.svg)]() [![npm](https://img.shields.io/npm/v/react-toastify.svg)]() [![license](https://img.shields.io/github/license/fkhadra/react-toastify.svg?maxAge=2592000)]() [![Coverage Status](https://coveralls.io/repos/github/fkhadra/react-toastify/badge.svg?branch=master)](https://coveralls.io/github/fkhadra/react-toastify?branch=master)
 
+Use could also render a component using a function. More or less like a "render props":
+
+```js
+toast(({ closeToast }) => <div>Functional swag 😎</div>);
+```
+
 ### Remove a toast programmatically
@@ -693,2 +699,4 @@
 
+You could use the style helper to replace the variable listed below:
+
 ```javascript
@@ -706,3 +714,30 @@ import { style } from "react-toastify";
   mobile: "only screen and (max-width : 480px)",
+  fontFamily: "sans-serif",
   zIndex: 9999,
+  TOP_LEFT: {
+    top: '1em',
+    left: '1em'
+  },
+  TOP_CENTER: {
+    top: '1em',
+    marginLeft: `-${320/2}px`,
+    left: '50%'
+  },
+  TOP_RIGHT: {
+    top: '1em',
+    right: '1em'
+  },
+  BOTTOM_LEFT: {
+    bottom: '1em',
+    left: '1em'
+  },
+  BOTTOM_CENTER: {
+    bottom: '1em',
+    marginLeft: `-${320/2}px`,
+    left: '50%'
+  },
+  BOTTOM_RIGHT: {
+    bottom: '1em',
+    right: '1em'
+  }
 });
@@ -834,2 +869,3 @@ ```
 const toastId = toast(<Img foo={bar}/>, options) // default, type: 'default'
+toast(({ closeToast }) => <div>Render props like</div>, options);
 toast.success("Hello", options) // add type: 'success' to options
@@ -859,2 +895,8 @@ toast.info("World", options) // add type: 'info' to options
 
+### V3.2.0
+
+- Allow "render props" rendering. Relate to [issue #106](https://github.com/fkhadra/react-toastify/issues/106)
+- Can set fontFamily via the style helper. Relate to [issue #107](https://github.com/fkhadra/react-toastify/issues/107)
+- Can override position default values via style helper. Realte to [issue #108](https://github.com/fkhadra/react-toastify/issues/108)
+
 ### V3.1.1
@@ -861,0 +903,0 @@

src/animation.js

@@ -1,2 +0,2 @@
-import { POSITION } from "./constant";
+import { POSITION } from './constant';
 
@@ -12,26 +12,26 @@ export default function getAnimation(pos) {
             opacity: 0,
-            transform: "translate3d(3000px, 0, 0)"
+            transform: 'translate3d(3000px, 0, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(-25px, 0, 0)"
+            transform: 'translate3d(-25px, 0, 0)'
           },
-          "75%": {
-            transform: "translate3d(10px, 0, 0)"
+          '75%': {
+            transform: 'translate3d(10px, 0, 0)'
           },
-          "90%": {
-            transform: "translate3d(-5px, 0, 0)"
+          '90%': {
+            transform: 'translate3d(-5px, 0, 0)'
           },
           to: {
-            transform: "none"
+            transform: 'none'
           }
         },
         exit: {
-          "20%": {
+          '20%': {
             opacity: 1,
-            transform: "translate3d(-20px, 0, 0)"
+            transform: 'translate3d(-20px, 0, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(2000px, 0, 0)"
+            transform: 'translate3d(2000px, 0, 0)'
           }
@@ -44,28 +44,28 @@ }
         enter: {
-          "0%": {
+          '0%': {
             opacity: 0,
-            transform: "translate3d(-3000px, 0, 0)"
+            transform: 'translate3d(-3000px, 0, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(25px, 0, 0)"
+            transform: 'translate3d(25px, 0, 0)'
           },
-          "75%": {
-            transform: "translate3d(-10px, 0, 0)"
+          '75%': {
+            transform: 'translate3d(-10px, 0, 0)'
           },
-          "90%": {
-            transform: "translate3d(5px, 0, 0)"
+          '90%': {
+            transform: 'translate3d(5px, 0, 0)'
           },
           to: {
-            transform: "none"
+            transform: 'none'
           }
         },
         exit: {
-          "20%": {
+          '20%': {
             opacity: 1,
-            transform: "translate3d(20px, 0, 0)"
+            transform: 'translate3d(20px, 0, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(-2000px, 0, 0)"
+            transform: 'translate3d(-2000px, 0, 0)'
           }
@@ -79,29 +79,29 @@ }
             opacity: 0,
-            transform: "translate3d(0, 3000px, 0)"
+            transform: 'translate3d(0, 3000px, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(0, -20px, 0)"
+            transform: 'translate3d(0, -20px, 0)'
           },
-          "75%": {
-            transform: "translate3d(0, 10px, 0)"
+          '75%': {
+            transform: 'translate3d(0, 10px, 0)'
           },
-          "90%": {
-            transform: "translate3d(0, -5px, 0)"
+          '90%': {
+            transform: 'translate3d(0, -5px, 0)'
           },
           to: {
-            transform: "translate3d(0, 0, 0)"
+            transform: 'translate3d(0, 0, 0)'
           }
         },
         exit: {
-          "20%": {
-            transform: "translate3d(0, 10px, 0)"
+          '20%': {
+            transform: 'translate3d(0, 10px, 0)'
           },
-          "40%, 45%": {
+          '40%, 45%': {
             opacity: 1,
-            transform: "translate3d(0, -20px, 0)"
+            transform: 'translate3d(0, -20px, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(0, 2000px, 0)"
+            transform: 'translate3d(0, 2000px, 0)'
           }
@@ -113,31 +113,31 @@ }
         enter: {
-          "0%": {
+          '0%': {
             opacity: 0,
-            transform: "translate3d(0, -3000px, 0)"
+            transform: 'translate3d(0, -3000px, 0)'
           },
-          "60%": {
+          '60%': {
             opacity: 1,
-            transform: "translate3d(0, 25px, 0)"
+            transform: 'translate3d(0, 25px, 0)'
           },
-          "75%": {
-            transform: "translate3d(0, -10px, 0)"
+          '75%': {
+            transform: 'translate3d(0, -10px, 0)'
           },
-          "90%": {
-            transform: "translate3d(0, 5px, 0)"
+          '90%': {
+            transform: 'translate3d(0, 5px, 0)'
           },
           to: {
-            transform: "none"
+            transform: 'none'
           }
         },
         exit: {
-          "20%": {
-            transform: "translate3d(0, -10px, 0)"
+          '20%': {
+            transform: 'translate3d(0, -10px, 0)'
           },
-          "40%, 45%": {
+          '40%, 45%': {
             opacity: 1,
-            transform: "translate3d(0, 20px, 0)"
+            transform: 'translate3d(0, 20px, 0)'
           },
           to: {
             opacity: 0,
-            transform: "translate3d(0, -2000px, 0)"
+            transform: 'translate3d(0, -2000px, 0)'
           }
@@ -144,0 +144,0 @@ }

src/constant.js

 export const POSITION = {
-  TOP_LEFT: "top-left",
-  TOP_RIGHT: "top-right",
-  TOP_CENTER: "top-center",
-  BOTTOM_LEFT: "bottom-left",
-  BOTTOM_RIGHT: "bottom-right",
-  BOTTOM_CENTER: "bottom-center"
+  TOP_LEFT: 'top-left',
+  TOP_RIGHT: 'top-right',
+  TOP_CENTER: 'top-center',
+  BOTTOM_LEFT: 'bottom-left',
+  BOTTOM_RIGHT: 'bottom-right',
+  BOTTOM_CENTER: 'bottom-center'
 };
 
 export const TYPE = {
-  INFO: "info",
-  SUCCESS: "success",
-  WARNING: "warning",
-  ERROR: "error",
-  DEFAULT: "default"
+  INFO: 'info',
+  SUCCESS: 'success',
+  WARNING: 'warning',
+  ERROR: 'error',
+  DEFAULT: 'default'
 };
 export const ACTION = {
-  SHOW: "SHOW_TOAST",
-  CLEAR: "CLEAR_TOAST",
-  MOUNTED: "CONTAINER_MOUNTED"
+  SHOW: 'SHOW_TOAST',
+  CLEAR: 'CLEAR_TOAST',
+  MOUNTED: 'CONTAINER_MOUNTED'
 };

src/DefaultCloseButton.js

 /* eslint react/require-default-props: 0 */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { css } from "glamor";
+import { css } from 'glamor';
 
-const rule = isDefault => css({
-  color: isDefault ? "#000" : "#fff",
-  fontWeight: "bold",
-  fontSize: "14px",
-  background: "transparent",
-  outline: "none",
-  border: "none",
-  padding: 0,
-  cursor: "pointer",
-  opacity: isDefault ? "0.3" : "0.7",
-  transition: ".3s ease",
-  alignSelf: "flex-start",
-  ":hover, :focus": {
-    opacity: 1
-  }
-});
+const rule = isDefault =>
+  css({
+    color: isDefault ? '#000' : '#fff',
+    fontWeight: 'bold',
+    fontSize: '14px',
+    background: 'transparent',
+    outline: 'none',
+    border: 'none',
+    padding: 0,
+    cursor: 'pointer',
+    opacity: isDefault ? '0.3' : '0.7',
+    transition: '.3s ease',
+    alignSelf: 'flex-start',
+    ':hover, :focus': {
+      opacity: 1
+    }
+  });
 
-
 function DefaultCloseButton({ closeToast, type }) {
   return (
-    <button
-      {...rule(type === "default")}
-      type="button"
-      onClick={closeToast}
-    >
+    <button {...rule(type === 'default')} type="button" onClick={closeToast}>
       ✖
@@ -32,0 +28,0 @@ </button>

src/DefaultTransition.js

@@ -1,10 +0,10 @@
-import React from "react";
-import Transition from "react-transition-group/Transition";
-import { css } from "glamor";
+import React from 'react';
+import Transition from 'react-transition-group/Transition';
+import { css } from 'glamor';
 
-import getAnimation from "./animation";
+import getAnimation from './animation';
 
 const animate = {
-  animationDuration: "0.75s",
-  animationFillMode: "both"
+  animationDuration: '0.75s',
+  animationFillMode: 'both'
 };
@@ -14,9 +14,9 @@
   const { enter, exit } = getAnimation(pos);
-  const enterAnimation = css.keyframes("enter", {
-    "from, 60%, 75%, 90%, to": {
-      animationTimingFunction: "cubic-bezier(0.215, 0.610, 0.355, 1.000)"
+  const enterAnimation = css.keyframes('enter', {
+    'from, 60%, 75%, 90%, to': {
+      animationTimingFunction: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)'
     },
     ...enter
   });
-  const exitAnimation = css.keyframes("exit", exit);
+  const exitAnimation = css.keyframes('exit', exit);
 
@@ -23,0 +23,0 @@ return {

src/ProgressBar.js

@@ -1,11 +0,11 @@
-import React from "react";
-import PropTypes from "prop-types";
-import { css } from "glamor";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { css } from 'glamor';
 
-import { TYPE } from "./constant";
-import style from "./style";
+import { TYPE } from './constant';
+import style from './style';
 
-const trackProgress = css.keyframes("track-progress", {
-  "0%": { width: "100%" },
-  "100%": { width: 0 }
+const trackProgress = css.keyframes('track-progress', {
+  '0%': { width: '100%' },
+  '100%': { width: 0 }
 });
@@ -15,14 +15,14 @@
   css({
-    position: "absolute",
+    position: 'absolute',
     bottom: 0,
     left: 0,
     width: 0,
-    height: "5px",
+    height: '5px',
     zIndex: style.zIndex,
     opacity: hide ? 0 : 0.7,
     animation: `${trackProgress} linear 1`,
-    animationPlayState: isRunning ? "running" : "paused",
+    animationPlayState: isRunning ? 'running' : 'paused',
     animationDuration: `${delay}ms`,
-    backgroundColor: "rgba(255,255,255,.7)",
-    ...(type === "default" ? { background: style.colorProgressDefault } : {})
+    backgroundColor: 'rgba(255,255,255,.7)',
+    ...(type === 'default' ? { background: style.colorProgressDefault } : {})
   });
@@ -33,6 +33,6 @@
     <div
-      {...(typeof className !== "string"
+      {...(typeof className !== 'string'
         ? css(progress(type, isRunning, hide, delay), className)
         : progress(type, isRunning, hide, delay))}
-      {...typeof className === "string" && { className }}
+      {...typeof className === 'string' && { className }}
       onAnimationEnd={closeToast}
@@ -78,5 +78,5 @@ />
   hide: false,
-  className: ""
+  className: ''
 };
 
 export default ProgressBar;

src/style.js

 const style = {
-  width: "320px",
-  colorDefault: "#fff",
-  colorInfo: "#3498db",
-  colorSuccess: "#07bc0c",
-  colorWarning: "#f1c40f",
-  colorError: "#e74c3c",
-  colorProgressDefault: "linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55)",
-  mobile: "only screen and (max-width : 480px)",
+  width: '320px',
+  colorDefault: '#fff',
+  colorInfo: '#3498db',
+  colorSuccess: '#07bc0c',
+  colorWarning: '#f1c40f',
+  colorError: '#e74c3c',
+  colorProgressDefault:
+    'linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55)',
+  mobile: 'only screen and (max-width : 480px)',
+  fontFamily: 'sans-serif',
   zIndex: 9999,
+  TOP_LEFT: {
+    top: '1em',
+    left: '1em'
+  },
+  TOP_CENTER: {
+    top: '1em',
+    left: '50%'
+  },
+  TOP_RIGHT: {
+    top: '1em',
+    right: '1em'
+  },
+  BOTTOM_LEFT: {
+    bottom: '1em',
+    left: '1em'
+  },
+  BOTTOM_CENTER: {
+    bottom: '1em',
+    left: '50%'
+  },
+  BOTTOM_RIGHT: {
+    bottom: '1em',
+    right: '1em'
+  }
 };
 
-export function defineStyle(props){
-  Object.keys(props).forEach(k => {
-    const val = props[k];
-    if(style.hasOwnProperty(k)){
-      style[k] = val;
-    }
-  });
+export function defineStyle(props) {
+  for (let prop in props) {
+    style[prop] = props[prop];
+  }
 }
 
 export default style;

src/Toast.js

@@ -1,8 +0,8 @@
-import React, { Component } from "react";
-import PropTypes from "prop-types";
-import { css } from "glamor";
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { css } from 'glamor';
 
-import ProgressBar from "./ProgressBar";
-import { POSITION, TYPE } from "./constant";
-import style from "./style";
+import ProgressBar from './ProgressBar';
+import { POSITION, TYPE } from './constant';
+import style from './style';
 import {
@@ -12,21 +12,21 @@ falseOrElement,
   objectValues
-} from "./util/propValidator";
+} from './util/propValidator';
 
 const toast = type =>
   css({
-    position: "relative",
-    minHeight: "48px",
-    marginBottom: "1rem",
-    padding: "8px",
-    borderRadius: "1px",
+    position: 'relative',
+    minHeight: '48px',
+    marginBottom: '1rem',
+    padding: '8px',
+    borderRadius: '1px',
     boxShadow:
-      "0 1px 10px 0 rgba(0, 0, 0, .1), 0 2px 15px 0 rgba(0, 0, 0, .05)",
-    display: "flex",
-    justifyContent: "space-between",
-    maxHeight: "800px",
-    overflow: "hidden",
-    fontFamily: "sans-serif",
-    cursor: "pointer",
+      '0 1px 10px 0 rgba(0, 0, 0, .1), 0 2px 15px 0 rgba(0, 0, 0, .05)',
+    display: 'flex',
+    justifyContent: 'space-between',
+    maxHeight: '800px',
+    overflow: 'hidden',
+    fontFamily: style.fontFamily,
+    cursor: 'pointer',
     background: style[`color${type.charAt(0).toUpperCase()}${type.slice(1)}`],
-    ...(type === "default" ? { color: "#aaa" } : {}),
+    ...(type === 'default' ? { color: '#aaa' } : {}),
     [`@media ${style.mobile}`]: {
@@ -38,3 +38,3 @@ marginBottom: 0
 const body = css({
-  margin: "auto 0",
+  margin: 'auto 0',
   flex: 1
@@ -75,5 +75,5 @@ });
     onClose: null,
-    className: "",
-    bodyClassName: "",
-    progressClassName: "",
+    className: '',
+    bodyClassName: '',
+    progressClassName: '',
     updateId: null
@@ -113,3 +113,3 @@ };
     }
-    typeof this.props.className === "string" &&
+    typeof this.props.className === 'string' &&
       (toastProps.className = this.props.className);
@@ -155,3 +155,3 @@ this.props.closeOnClick && (toastProps.onClick = this.props.closeToast);
         <div
-          {...(typeof className !== "string"
+          {...(typeof className !== 'string'
             ? css(toast(type), className)
@@ -162,6 +162,6 @@ : toast(type))}
           <div
-            {...(typeof bodyClassName !== "string"
+            {...(typeof bodyClassName !== 'string'
               ? css(body, bodyClassName)
               : body)}
-            {...typeof bodyClassName === "string" && {
+            {...typeof bodyClassName === 'string' && {
               className: bodyClassName
@@ -168,0 +168,0 @@ }}

src/ToastContainer.js

@@ -1,12 +0,12 @@
-import React, { Component, isValidElement, cloneElement } from "react";
-import PropTypes from "prop-types";
-import { css } from "glamor";
-import TransitionGroup from "react-transition-group/TransitionGroup";
+import React, { Component, isValidElement, cloneElement } from 'react';
+import PropTypes from 'prop-types';
+import { css } from 'glamor';
+import TransitionGroup from 'react-transition-group/TransitionGroup';
 
-import Toast from "./Toast";
-import DefaultCloseButton from "./DefaultCloseButton";
-import DefaultTransition from "./DefaultTransition";
-import { POSITION, ACTION } from "./constant";
-import style from "./style";
-import EventManager from "./util/EventManager";
+import Toast from './Toast';
+import DefaultCloseButton from './DefaultCloseButton';
+import DefaultTransition from './DefaultTransition';
+import { POSITION, ACTION } from './constant';
+import style from './style';
+import EventManager from './util/EventManager';
 import {
@@ -17,49 +17,21 @@ falseOrDelay,
   objectValues
-} from "./util/propValidator";
+} from './util/propValidator';
 
 const toastPosition = pos => {
-  let rule;
-  const marginLeft = `-${parseInt(style.width, 10) / 2}px`;
-  switch (pos) {
-    case POSITION.TOP_LEFT:
-      rule = {
-        top: "1em",
-        left: "1em"
-      };
-      break;
-    case POSITION.TOP_CENTER:
-      rule = {
-        top: "1em",
-        left: "50%",
-        marginLeft: marginLeft
-      };
-      break;
-    case POSITION.TOP_RIGHT:
-    default:
-      rule = {
-        top: "1em",
-        right: "1em"
-      };
-      break;
-    case POSITION.BOTTOM_LEFT:
-      rule = {
-        bottom: "1em",
-        left: "1em"
-      };
-      break;
-    case POSITION.BOTTOM_CENTER:
-      rule = {
-        bottom: "1em",
-        left: "50%",
-        marginLeft: marginLeft
-      };
-      break;
-    case POSITION.BOTTOM_RIGHT:
-      rule = {
-        bottom: "1em",
-        right: "1em"
-      };
+  const positionKey = pos.toUpperCase().replace('-', '_');
+  const positionRule =
+    typeof POSITION[positionKey] !== 'undefined'
+      ? style[positionKey]
+      : style.TOP_RIGHT;
+
+  /** define margin for center toast based on toast witdh */
+  if (
+    positionKey.indexOf('CENTER') !== -1 &&
+    typeof positionRule.marginLeft === 'undefined'
+  ) {
+    positionRule.marginLeft = `-${parseInt(style.width, 10) / 2}px`;
   }
+
   return css(
-    rule,
+    positionRule,
     css({
@@ -69,4 +41,4 @@ [`@media ${style.mobile}`]: {
         margin: 0,
-        position: "fixed",
-        ...(pos.substring(0, 3) === "top" ? { top: 0 } : { bottom: 0 })
+        position: 'fixed',
+        ...(pos.substring(0, 3) === 'top' ? { top: 0 } : { bottom: 0 })
       }
@@ -81,10 +53,10 @@ })
       zIndex: style.zIndex,
-      position: "fixed",
-      padding: "4px",
+      position: 'fixed',
+      padding: '4px',
       width: style.width,
-      boxSizing: "border-box",
-      color: "#fff",
-      ...(disablePointer ? { pointerEvents: "none" } : {}),
+      boxSizing: 'border-box',
+      color: '#fff',
+      ...(disablePointer ? { pointerEvents: 'none' } : {}),
       [`@media ${style.mobile}`]: {
-        width: "100vw",
+        width: '100vw',
         padding: 0
@@ -178,5 +150,5 @@ }
     style: null,
-    toastClassName: "",
-    bodyClassName: "",
-    progressClassName: ""
+    toastClassName: '',
+    bodyClassName: '',
+    progressClassName: ''
   };
@@ -206,3 +178,3 @@
       .emit(MOUNTED, this);
-    document.addEventListener("visibilitychange", this.isDocumentHidden);
+    document.addEventListener('visibilitychange', this.isDocumentHidden);
   }
@@ -213,3 +185,3 @@
     EventManager.off(ACTION.CLEAR);
-    document.removeEventListener("visibilitychange", this.isDocumentHidden);
+    document.removeEventListener('visibilitychange', this.isDocumentHidden);
   }
@@ -255,4 +227,5 @@
       isValidElement(content) ||
-      typeof content === "string" ||
-      typeof content === "number"
+      typeof content === 'string' ||
+      typeof content === 'number' ||
+      this.isFunction(content)
     );
@@ -299,3 +272,3 @@ }
       hideProgressBar:
-        typeof options.hideProgressBar === "boolean"
+        typeof options.hideProgressBar === 'boolean'
           ? options.hideProgressBar
@@ -315,4 +288,4 @@ : this.props.hideProgressBar
       isValidElement(content) &&
-      typeof content.type !== "string" &&
-      typeof content.type !== "number"
+      typeof content.type !== 'string' &&
+      typeof content.type !== 'number'
     ) {
@@ -322,2 +295,4 @@ content = cloneElement(content, {
       });
+    } else if (this.isFunction(content)) {
+      content = content({ closeToast });
     }
@@ -385,6 +360,6 @@
         <TransitionGroup
-          {...(typeof className !== "string"
+          {...(typeof className !== 'string'
             ? css(container(disablePointer, position), className)
             : container(disablePointer, position))}
-          {...typeof className === "string" && { className }}
+          {...typeof className === 'string' && { className }}
           {...style !== null && { style }}
@@ -391,0 +366,0 @@ key={`container-${position}`}

src/toaster.js

@@ -28,3 +28,6 @@ import EventManager from './util/EventManager';
 function mergeOptions(options, type) {
-  return Object.assign({}, defaultOptions, options, { type: type, toastId: ++toastId });
+  return Object.assign({}, defaultOptions, options, {
+    type: type,
+    toastId: ++toastId
+  });
 }
@@ -48,21 +51,40 @@
 const toaster = Object.assign(
-  (content, options) => emitEvent(content, mergeOptions(options, (options && options.type) || TYPE.DEFAULT)),
+  (content, options) =>
+    emitEvent(
+      content,
+      mergeOptions(options, (options && options.type) || TYPE.DEFAULT)
+    ),
   {
-    success: (content, options) => emitEvent(content, mergeOptions(options, TYPE.SUCCESS)),
-    info: (content, options) => emitEvent(content, mergeOptions(options, TYPE.INFO)),
-    warn: (content, options) => emitEvent(content, mergeOptions(options, TYPE.WARNING)),
-    warning: (content, options) => emitEvent(content, mergeOptions(options, TYPE.WARNING)),
-    error: (content, options) => emitEvent(content, mergeOptions(options, TYPE.ERROR)),
+    success: (content, options) =>
+      emitEvent(content, mergeOptions(options, TYPE.SUCCESS)),
+    info: (content, options) =>
+      emitEvent(content, mergeOptions(options, TYPE.INFO)),
+    warn: (content, options) =>
+      emitEvent(content, mergeOptions(options, TYPE.WARNING)),
+    warning: (content, options) =>
+      emitEvent(content, mergeOptions(options, TYPE.WARNING)),
+    error: (content, options) =>
+      emitEvent(content, mergeOptions(options, TYPE.ERROR)),
     dismiss: (id = null) => container && EventManager.emit(ACTION.CLEAR, id),
     isActive: () => false,
-    update(id, options){
-      if(container && typeof container.collection[id] !== 'undefined') {
-        const {options: oldOptions, content: oldContent } =  container.collection[id];
-        const updateId = oldOptions.updateId !== null ? oldOptions.updateId + 1 : 1;
-         
-        const nextOptions = Object.assign({}, oldOptions, options, { toastId: id, updateId: updateId });
-        const content = typeof nextOptions.render !== "undefined" ? nextOptions.render : oldContent;
+    update(id, options) {
+      if (container && typeof container.collection[id] !== 'undefined') {
+        const {
+          options: oldOptions,
+          content: oldContent
+        } = container.collection[id];
+        const updateId =
+          oldOptions.updateId !== null ? oldOptions.updateId + 1 : 1;
+
+        const nextOptions = Object.assign({}, oldOptions, options, {
+          toastId: id,
+          updateId: updateId
+        });
+        const content =
+          typeof nextOptions.render !== 'undefined'
+            ? nextOptions.render
+            : oldContent;
         delete nextOptions.render;
-        
-        return emitEvent(content, nextOptions);        
+
+        return emitEvent(content, nextOptions);
       }
@@ -69,0 +91,0 @@

src/util/EventManager.js

@@ -1,2 +0,1 @@
-
 const eventManager = {
@@ -20,3 +19,5 @@ eventList: new Map(),
       /* eslint no-console: 0 */
-      console.warn(`<${event}> Event is not registered. Did you forgot to bind the event ?`);
+      console.warn(
+        `<${event}> Event is not registered. Did you forgot to bind the event ?`
+      );
       return false;
@@ -23,0 +24,0 @@ }

src/util/propValidator.js

@@ -1,5 +0,5 @@
-import { isValidElement } from "react";
+import { isValidElement } from 'react';
 
 export function isValidDelay(val) {
-  return typeof val === "number" && !isNaN(val) && val > 0;
+  return typeof val === 'number' && !isNaN(val) && val > 0;
 }
@@ -15,3 +15,3 @@
 
-    if (typeof prop === "undefined") {
+    if (typeof prop === 'undefined') {
       return new Error(`The prop ${propName} is marked as required in 
@@ -18,0 +18,0 @@ ${componentName}, but its value is undefined.`);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

498929

increased by0.23%

Lines of code

2289

increased by0.66%

Number of lines in readme file

1085

increased by4.03%

Worsened metrics

Dev dependency count

28

increased by3.7%

No dependency changes