react-awesome-button - npm Package Compare versions

Comparing version 0.5.2 to 0.6.0

dist/index.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["react-awesome-button"]=t():e["react-awesome-button"]=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t,n){"use strict";function o(e){return function(){return e}}var r=function(){};r.thatReturns=o,r.thatReturnsFalse=o(!1),r.thatReturnsTrue=o(!0),r.thatReturnsNull=o(null),r.thatReturnsThis=function(){return this},r.thatReturnsArgument=function(e){return e},e.exports=r},function(e,t,n){e.exports=n(2)},function(e,t,n){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},l=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),u=n(3),c=o(u),f=n(7),p=o(f),d=n(11),h="aws-btn",y=function(e){return c.default.createElement("a",e)},m=function(e){return c.default.createElement("button",e)},b=function(e){function t(e){r(this,t);var n=s(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.rootElement=e.rootElement||h,n.animationStage=0,n.extraProps={},n.state={disabled:e.disabled,loading:!1,loadingEnd:!1,loadingStart:!1,blocked:!1},n.checkProps(e),n}return i(t,e),l(t,[{key:"componentDidMount",value:function(){this.container=this.button&&this.button.parentNode,(0,d.setCssEndEvent)(this.wrapper,"transition",this.clearStagedWrapperAnimation.bind(this))}},{key:"componentWillReceiveProps",value:function(e){this.checkProps(e)}},{key:"getRootClassName",value:function(){var e=[this.rootElement,this.props.type&&this.rootElement+"--"+this.props.type,this.props.size&&this.rootElement+"--"+this.props.size,this.props.visible&&this.rootElement+"--visible",this.state.loadingStart&&this.rootElement+"--start"||null,this.state.loadingEnd&&this.rootElement+"--end"||null,this.props.progress&&this.rootElement+"--progress"||null];return!0===this.state.disabled&&e.push(this.rootElement+"--disabled"),this.state.pressPosition&&e.push(this.state.pressPosition),this.props.cssModule&&this.props.cssModule["aws-btn"]?(0,d.classToModules)(e,this.props.cssModule):e.join(" ").trim().replace(/[\s]+/gi," ")}},{key:"checkProps",value:function(e){this.extraProps.to=e.to||null,this.extraProps.href=e.href||null,this.extraProps.target=e.target||null,this.renderComponent=e.element||(this.props.href?y:m)}},{key:"endLoading",value:function(){this.setState({loadingEnd:!0}),this.animationStage=1}},{key:"startLoading",value:function(){this.setState({loading:!0,loadingStart:!0,blocked:!0})}},{key:"clearPress",value:function(){(0,d.toggleMoveClasses)({element:this.container,root:this.rootElement,cssModule:this.props.cssModule});var e=this.state.loading?this.state.pressPosition:null;this.setState({pressPosition:e})}},{key:"clearLoading",value:function(){this.setState({loading:!1,loadingStart:!1,loadingEnd:!1})}},{key:"clearStagedWrapperAnimation",value:function(){var e=this;if(0!==this.animationStage){if(5===this.animationStage)return this.animationStage=0,void setTimeout(function(){"undefined"!=typeof window&&window.requestAnimationFrame(function(){e.clearLoading(),e.clearPress(),setTimeout(function(){e.setState({blocked:!1})},500)})},350);this.animationStage+=1}}},{key:"action",value:function(){this.props.progress&&this.startLoading(),this.props.action&&this.button&&this.props.action(this.container,this.props.progress?this.endLoading.bind(this):null)}},{key:"createBubble",value:function(e){(0,d.createBubbleEffect)({event:e,button:this.button,content:this.content,className:(0,d.getClassName)(this.rootElement+"__bubble",this.props.cssModule)})}},{key:"moveEvents",value:function(){var e=this,t={onMouseLeave:function(){e.clearPress()},onMouseDown:function(t){!0===e.state.disabled||!0===e.state.loading||!0===e.state.blocked||t&&1!==t.nativeEvent.which||(e.pressed=(new Date).getTime(),e.setState({pressPosition:e.rootElement+"--active",loading:e.props.progress}))},onMouseUp:function(t){if(!0===e.state.disabled||!0===e.state.blocked)return t.preventDefault(),void t.stopPropagation();e.clearTimer&&clearTimeout(e.clearTimer);var n=(new Date).getTime()-e.pressed;if(!1===e.props.progress&&!0===e.props.bubbles&&e.createBubble(t),"undefined"!=typeof window&&e.button){var o=new Event("action");e.button.dispatchEvent(o)}e.action(),e.clearTimer=setTimeout(function(){e.clearPress()},100-n)}};return!0===this.props.moveEvents?t.onMouseMove=function(t){if(!0!==e.state.disabled&&!0!==e.state.loading&&!0!==e.state.blocked){var n=e.button,o=n.getBoundingClientRect(),r=o.left,s=n.offsetWidth,i=t.pageX<r+.3*s?"left":t.pageX>r+.65*s?"right":"middle";(0,d.toggleMoveClasses)({element:e.container,root:e.rootElement,cssModule:e.props.cssModule,state:i})}}:t.onMouseEnter=function(){e.container.classList.add((0,d.classToModules)([e.rootElement+"--middle"],e.props.cssModule))},t}},{key:"render",value:function(){var e=this,t=this.renderComponent;return c.default.createElement(t,a({style:this.props.style,className:this.getRootClassName(),role:"button"},this.extraProps,this.moveEvents()),c.default.createElement("span",{ref:function(t){e.button=t},className:(0,d.getClassName)(this.rootElement+"__container",this.props.cssModule)},c.default.createElement("span",{ref:function(t){e.wrapper=t},className:(0,d.getClassName)(this.rootElement+"__wrapper",this.props.cssModule)},c.default.createElement("span",{ref:function(t){e.content=t},"data-loading":this.props.progress&&this.props.loadingLabel||null,"data-status":this.props.progress&&this.props.resultLabel||null,className:(0,d.getClassName)(this.rootElement+"__content",this.props.cssModule)},c.default.createElement("span",null,this.props.children)))))}}]),t}(c.default.Component);b.propTypes={action:p.default.func,bubbles:p.default.bool,children:p.default.node.isRequired,disabled:p.default.bool,element:p.default.func,href:p.default.string,loadingLabel:p.default.string,progress:p.default.bool,resultLabel:p.default.string,rootElement:p.default.string,moveEvents:p.default.bool,size:p.default.string,style:p.default.object,cssModule:p.default.object,target:p.default.string,to:p.default.string,type:p.default.string,visible:p.default.bool},b.defaultProps={action:null,bubbles:!1,cssModule:null,disabled:!1,element:null,href:null,loadingLabel:"Wait ..",moveEvents:!0,progress:!1,resultLabel:"Success!",rootElement:h,size:null,style:{},target:null,to:null,type:"primary",visible:!0},t.default=b},function(e,t,n){"use strict";e.exports=n(4)},function(e,t,n){"use strict";function o(e){for(var t=arguments.length-1,n="Minified React error #"+e+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+e,o=0;o<t;o++)n+="&args[]="+encodeURIComponent(arguments[o+1]);throw t=Error(n+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."),t.name="Invariant Violation",t.framesToPop=1,t}function r(e,t,n){this.props=e,this.context=t,this.refs=g,this.updater=n||x}function s(e,t,n){this.props=e,this.context=t,this.refs=g,this.updater=n||x}function i(){}function a(e,t,n){this.props=e,this.context=t,this.refs=g,this.updater=n||x}function l(e,t,n){var o,r={},s=null,i=null;if(null!=t)for(o in void 0!==t.ref&&(i=t.ref),void 0!==t.key&&(s=""+t.key),t)R.call(t,o)&&!L.hasOwnProperty(o)&&(r[o]=t[o]);var a=arguments.length-2;if(1===a)r.children=n;else if(1<a){for(var l=Array(a),u=0;u<a;u++)l[u]=arguments[u+2];r.children=l}if(e&&e.defaultProps)for(o in a=e.defaultProps)void 0===r[o]&&(r[o]=a[o]);return{$$typeof:_,type:e,key:s,ref:i,props:r,_owner:T.current}}function u(e){return"object"==typeof e&&null!==e&&e.$$typeof===_}function c(e){var t={"=":"=0",":":"=2"};return"$"+(""+e).replace(/[=:]/g,function(e){return t[e]})}function f(e,t,n,o){if(A.length){var r=A.pop();return r.result=e,r.keyPrefix=t,r.func=n,r.context=o,r.count=0,r}return{result:e,keyPrefix:t,func:n,context:o,count:0}}function p(e){e.result=null,e.keyPrefix=null,e.func=null,e.context=null,e.count=0,10>A.length&&A.push(e)}function d(e,t,n,r){var s=typeof e;"undefined"!==s&&"boolean"!==s||(e=null);var i=!1;if(null===e)i=!0;else switch(s){case"string":case"number":i=!0;break;case"object":switch(e.$$typeof){case _:case k:case O:case P:i=!0}}if(i)return n(r,e,""===t?"."+h(e,0):t),1;if(i=0,t=""===t?".":t+":",Array.isArray(e))for(var a=0;a<e.length;a++){s=e[a];var l=t+h(s,a);i+=d(s,l,n,r)}else if(null===e||void 0===e?l=null:(l=S&&e[S]||e["@@iterator"],l="function"==typeof l?l:null),"function"==typeof l)for(e=l.call(e),a=0;!(s=e.next()).done;)s=s.value,l=t+h(s,a++),i+=d(s,l,n,r);else"object"===s&&(n=""+e,o("31","[object Object]"===n?"object with keys {"+Object.keys(e).join(", ")+"}":n,""));return i}function h(e,t){return"object"==typeof e&&null!==e&&null!=e.key?c(e.key):t.toString(36)}function y(e,t){e.func.call(e.context,t,e.count++)}function m(e,t,n){var o=e.result,r=e.keyPrefix;e=e.func.call(e.context,t,e.count++),Array.isArray(e)?b(e,o,n,E.thatReturnsArgument):null!=e&&(u(e)&&(t=r+(!e.key||t&&t.key===e.key?"":(""+e.key).replace(N,"$&/")+"/")+n,e={$$typeof:_,type:e.type,key:t,ref:e.ref,props:e.props,_owner:e._owner}),o.push(e))}function b(e,t,n,o,r){var s="";null!=n&&(s=(""+n).replace(N,"$&/")+"/"),t=f(t,s,o,r),null==e||d(e,"",m,t),p(t)}var v=n(5),g=n(6),E=n(0),w="function"==typeof Symbol&&Symbol.for,_=w?Symbol.for("react.element"):60103,k=w?Symbol.for("react.call"):60104,O=w?Symbol.for("react.return"):60105,P=w?Symbol.for("react.portal"):60106,j=w?Symbol.for("react.fragment"):60107,S="function"==typeof Symbol&&Symbol.iterator,x={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}};r.prototype.isReactComponent={},r.prototype.setState=function(e,t){"object"!=typeof e&&"function"!=typeof e&&null!=e&&o("85"),this.updater.enqueueSetState(this,e,t,"setState")},r.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")},i.prototype=r.prototype;var C=s.prototype=new i;C.constructor=s,v(C,r.prototype),C.isPureReactComponent=!0;var M=a.prototype=new i;M.constructor=a,v(M,r.prototype),M.unstable_isAsyncReactComponent=!0,M.render=function(){return this.props.children};var T={current:null},R=Object.prototype.hasOwnProperty,L={key:!0,ref:!0,__self:!0,__source:!0},N=/\/+/g,A=[],$={Children:{map:function(e,t,n){if(null==e)return e;var o=[];return b(e,o,null,t,n),o},forEach:function(e,t,n){if(null==e)return e;t=f(null,null,t,n),null==e||d(e,"",y,t),p(t)},count:function(e){return null==e?0:d(e,"",E.thatReturnsNull,null)},toArray:function(e){var t=[];return b(e,t,null,E.thatReturnsArgument),t},only:function(e){return u(e)||o("143"),e}},Component:r,PureComponent:s,unstable_AsyncComponent:a,Fragment:j,createElement:l,cloneElement:function(e,t,n){var o=v({},e.props),r=e.key,s=e.ref,i=e._owner;if(null!=t){if(void 0!==t.ref&&(s=t.ref,i=T.current),void 0!==t.key&&(r=""+t.key),e.type&&e.type.defaultProps)var a=e.type.defaultProps;for(l in t)R.call(t,l)&&!L.hasOwnProperty(l)&&(o[l]=void 0===t[l]&&void 0!==a?a[l]:t[l])}var l=arguments.length-2;if(1===l)o.children=n;else if(1<l){a=Array(l);for(var u=0;u<l;u++)a[u]=arguments[u+2];o.children=a}return{$$typeof:_,type:e.type,key:r,ref:s,props:o,_owner:i}},createFactory:function(e){var t=l.bind(null,e);return t.type=e,t},isValidElement:u,version:"16.2.0",__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:{ReactCurrentOwner:T,assign:v}},q=Object.freeze({default:$}),U=q&&$||q;e.exports=U.default?U.default:U},function(e,t,n){"use strict";function o(e){if(null===e||void 0===e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}var r=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var o={};return"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},o)).join("")}catch(e){return!1}}()?Object.assign:function(e,t){for(var n,a,l=o(e),u=1;u<arguments.length;u++){n=Object(arguments[u]);for(var c in n)s.call(n,c)&&(l[c]=n[c]);if(r){a=r(n);for(var f=0;f<a.length;f++)i.call(n,a[f])&&(l[a[f]]=n[a[f]])}}return l}},function(e,t,n){"use strict";var o={};e.exports=o},function(e,t,n){e.exports=n(8)()},function(e,t,n){"use strict";var o=n(0),r=n(9),s=n(10);e.exports=function(){function e(e,t,n,o,i,a){a!==s&&r(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=o,n.PropTypes=n,n}},function(e,t,n){"use strict";function o(e,t,n,o,s,i,a,l){if(r(t),!e){var u;if(void 0===t)u=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var c=[n,o,s,i,a,l],f=0;u=new Error(t.replace(/%s/g,function(){return c[f++]})),u.name="Invariant Violation"}throw u.framesToPop=1,u}}var r=function(e){};e.exports=o},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,n){"use strict";function o(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=arguments[1],n=[],o=e.length;o--;)t[e[o]]&&n.push(t[e[o]]);return n.join(" ").trim()}function r(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments[1];return t?t[e]||e:e}function s(e,t,n){if(!e)return!1;var o=t.charAt(0).toUpperCase()+t.slice(1);return void 0!==e.style["Webkit"+o]?e.addEventListener("webkit"+o+"End",n):void 0!==e.style.OTransition?e.addEventListener("o"+t+"End",n):e.addEventListener(t+"End",n)}function i(e){var t=e.element,n=e.root,r=e.cssModule,s=void 0===r?null:r,i=e.state,a=void 0===i?null:i;if(!t)return!1;var l=["middle","left","right"];if(!a)return t.classList.remove(o([n+"--"+l[0]],s),o([n+"--"+l[1]],s),o([n+"--"+l[2]],s)),!1;for(var u=l.filter(function(e){return e!==a}),c=u.length;c--;)t.classList.remove(o([n+"--"+u[c]],s));return t.classList.add(o([n+"--"+a],s)),!0}function a(e){var t=e.event,n=e.button,o=e.content,r=e.className,i=n.getBoundingClientRect(),a=window.pageYOffset||document.documentElement.scrolltop||0,l=document.createElement("span"),u=i.width<50?3*i.width:2*i.width;l.className=r,l.style.top="-"+(u/2-(t.pageY-i.top-a))+"px",l.style.left="-"+(u/2-(t.pageX-i.left))+"px",l.style.width=u+"px",l.style.height=u+"px",s(l,"animation",function(){o.removeChild(l)}),window.requestAnimationFrame(function(){o.appendChild(l)})}Object.defineProperty(t,"__esModule",{value:!0}),t.classToModules=o,t.getClassName=r,t.setCssEndEvent=s,t.toggleMoveClasses=i,t.createBubbleEffect=a}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["react-awesome-button"]=t():e["react-awesome-button"]=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t,n){"use strict";function o(e){return function(){return e}}var r=function(){};r.thatReturns=o,r.thatReturnsFalse=o(!1),r.thatReturnsTrue=o(!0),r.thatReturnsNull=o(null),r.thatReturnsThis=function(){return this},r.thatReturnsArgument=function(e){return e},e.exports=r},function(e,t,n){e.exports=n(2)},function(e,t,n){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},l=function(){function e(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,n,o){return n&&e(t.prototype,n),o&&e(t,o),t}}(),u=n(3),c=o(u),f=n(7),p=o(f),d=n(11),h="aws-btn",y=function(e){return c.default.createElement("a",e)},m=function(e){return c.default.createElement("button",e)},b=function(e){function t(e){r(this,t);var n=s(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.rootElement=e.rootElement||h,n.animationStage=0,n.extraProps={},n.state={disabled:e.disabled,loading:!1,loadingEnd:!1,loadingStart:!1,blocked:!1},n.checkProps(e),n}return i(t,e),l(t,[{key:"componentDidMount",value:function(){this.container=this.button&&this.button.parentNode,(0,d.setCssEndEvent)(this.wrapper,"transition",this.clearStagedWrapperAnimation.bind(this))}},{key:"componentWillReceiveProps",value:function(e){this.checkProps(e)}},{key:"getRootClassName",value:function(){var e=[this.rootElement,this.props.type&&this.rootElement+"--"+this.props.type,this.props.size&&this.rootElement+"--"+this.props.size,this.props.visible&&this.rootElement+"--visible",this.state.loadingStart&&this.rootElement+"--start"||null,this.state.loadingEnd&&this.rootElement+"--end"||null,this.props.progress&&this.rootElement+"--progress"||null];return!0===this.state.disabled&&e.push(this.rootElement+"--disabled"),this.state.pressPosition&&e.push(this.state.pressPosition),this.props.cssModule&&this.props.cssModule["aws-btn"]?(0,d.classToModules)(e,this.props.cssModule):e.join(" ").trim().replace(/[\s]+/gi," ")}},{key:"checkProps",value:function(e){this.extraProps.to=e.to||null,this.extraProps.href=e.href||null,this.extraProps.target=e.target||null,this.renderComponent=e.element||(this.props.href?y:m)}},{key:"endLoading",value:function(){this.setState({loadingEnd:!0}),this.animationStage=1}},{key:"startLoading",value:function(){this.setState({loading:!0,loadingStart:!0,blocked:!0})}},{key:"clearPress",value:function(){(0,d.toggleMoveClasses)({element:this.container,root:this.rootElement,cssModule:this.props.cssModule});var e=this.state.loading?this.state.pressPosition:null;this.setState({pressPosition:e})}},{key:"clearLoading",value:function(){this.setState({loading:!1,loadingStart:!1,loadingEnd:!1})}},{key:"clearStagedWrapperAnimation",value:function(){var e=this;if(0!==this.animationStage){if(5===this.animationStage)return this.animationStage=0,void setTimeout(function(){"undefined"!=typeof window&&window.requestAnimationFrame(function(){e.clearLoading(),e.clearPress(),setTimeout(function(){e.setState({blocked:!1})},500)})},350);this.animationStage+=1}}},{key:"action",value:function(){this.props.progress&&this.startLoading(),this.props.action&&this.button&&this.props.action(this.container,this.props.progress?this.endLoading.bind(this):null)}},{key:"createBubble",value:function(e){(0,d.createBubbleEffect)({event:e,button:this.button,content:this.content,className:(0,d.getClassName)(this.rootElement+"__bubble",this.props.cssModule)})}},{key:"moveEvents",value:function(){var e=this,t={onMouseLeave:function(){e.clearPress()},onMouseDown:function(t){!0===e.state.disabled||!0===e.state.loading||!0===e.state.blocked||t&&1!==t.nativeEvent.which||(e.pressed=(new Date).getTime(),e.setState({pressPosition:e.rootElement+"--active",loading:e.props.progress}))},onMouseUp:function(t){if(!0===e.state.disabled||!0===e.state.blocked)return t.preventDefault(),void t.stopPropagation();e.clearTimer&&clearTimeout(e.clearTimer);var n=(new Date).getTime()-e.pressed;if(!1===e.props.progress&&!0===e.props.bubbles&&e.createBubble(t),"undefined"!=typeof window&&e.button){var o=new Event("action");e.button.dispatchEvent(o)}e.action(),e.clearTimer=setTimeout(function(){e.clearPress()},100-n)}};return!0===this.props.moveEvents?t.onMouseMove=function(t){if(!0!==e.state.disabled&&!0!==e.state.loading&&!0!==e.state.blocked){var n=e.button,o=n.getBoundingClientRect(),r=o.left,s=n.offsetWidth,i=t.pageX<r+.3*s?"left":t.pageX>r+.65*s?"right":"middle";(0,d.toggleMoveClasses)({element:e.container,root:e.rootElement,cssModule:e.props.cssModule,state:i})}}:t.onMouseEnter=function(){e.container.classList.add((0,d.classToModules)([e.rootElement+"--middle"],e.props.cssModule))},t}},{key:"render",value:function(){var e=this,t=this.renderComponent;return c.default.createElement(t,a({style:this.props.style,className:this.getRootClassName(),role:"button"},this.extraProps,this.moveEvents()),c.default.createElement("span",{ref:function(t){e.button=t},className:(0,d.getClassName)(this.rootElement+"__container",this.props.cssModule)},c.default.createElement("span",{ref:function(t){e.wrapper=t},className:(0,d.getClassName)(this.rootElement+"__wrapper",this.props.cssModule)},c.default.createElement("span",{ref:function(t){e.content=t},"data-loading":this.props.progress&&this.props.loadingLabel||null,"data-status":this.props.progress&&this.props.resultLabel||null,className:(0,d.getClassName)(this.rootElement+"__content",this.props.cssModule)},c.default.createElement("span",null,this.props.children)))))}}]),t}(c.default.Component);b.propTypes={action:p.default.func,bubbles:p.default.bool,children:p.default.node.isRequired,disabled:p.default.bool,element:p.default.func,href:p.default.string,loadingLabel:p.default.string,progress:p.default.bool,resultLabel:p.default.string,rootElement:p.default.string,moveEvents:p.default.bool,size:p.default.string,style:p.default.object,cssModule:p.default.object,target:p.default.string,to:p.default.string,type:p.default.string,visible:p.default.bool},b.defaultProps={action:null,bubbles:!1,cssModule:null,disabled:!1,element:null,href:null,loadingLabel:"Wait ..",moveEvents:!0,progress:!1,resultLabel:"Success!",rootElement:h,size:null,style:{},target:null,to:null,type:"primary",visible:!0},t.default=b},function(e,t,n){"use strict";e.exports=n(4)},function(e,t,n){"use strict";function o(e){for(var t=arguments.length-1,n="Minified React error #"+e+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant="+e,o=0;o<t;o++)n+="&args[]="+encodeURIComponent(arguments[o+1]);throw t=Error(n+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."),t.name="Invariant Violation",t.framesToPop=1,t}function r(e,t,n){this.props=e,this.context=t,this.refs=g,this.updater=n||x}function s(e,t,n){this.props=e,this.context=t,this.refs=g,this.updater=n||x}function i(){}function a(e,t,n){this.props=e,this.context=t,this.refs=g,this.updater=n||x}function l(e,t,n){var o,r={},s=null,i=null;if(null!=t)for(o in void 0!==t.ref&&(i=t.ref),void 0!==t.key&&(s=""+t.key),t)R.call(t,o)&&!L.hasOwnProperty(o)&&(r[o]=t[o]);var a=arguments.length-2;if(1===a)r.children=n;else if(1<a){for(var l=Array(a),u=0;u<a;u++)l[u]=arguments[u+2];r.children=l}if(e&&e.defaultProps)for(o in a=e.defaultProps)void 0===r[o]&&(r[o]=a[o]);return{$$typeof:_,type:e,key:s,ref:i,props:r,_owner:T.current}}function u(e){return"object"==typeof e&&null!==e&&e.$$typeof===_}function c(e){var t={"=":"=0",":":"=2"};return"$"+(""+e).replace(/[=:]/g,function(e){return t[e]})}function f(e,t,n,o){if(A.length){var r=A.pop();return r.result=e,r.keyPrefix=t,r.func=n,r.context=o,r.count=0,r}return{result:e,keyPrefix:t,func:n,context:o,count:0}}function p(e){e.result=null,e.keyPrefix=null,e.func=null,e.context=null,e.count=0,10>A.length&&A.push(e)}function d(e,t,n,r){var s=typeof e;"undefined"!==s&&"boolean"!==s||(e=null);var i=!1;if(null===e)i=!0;else switch(s){case"string":case"number":i=!0;break;case"object":switch(e.$$typeof){case _:case k:case O:case P:i=!0}}if(i)return n(r,e,""===t?"."+h(e,0):t),1;if(i=0,t=""===t?".":t+":",Array.isArray(e))for(var a=0;a<e.length;a++){s=e[a];var l=t+h(s,a);i+=d(s,l,n,r)}else if(null===e||void 0===e?l=null:(l=S&&e[S]||e["@@iterator"],l="function"==typeof l?l:null),"function"==typeof l)for(e=l.call(e),a=0;!(s=e.next()).done;)s=s.value,l=t+h(s,a++),i+=d(s,l,n,r);else"object"===s&&(n=""+e,o("31","[object Object]"===n?"object with keys {"+Object.keys(e).join(", ")+"}":n,""));return i}function h(e,t){return"object"==typeof e&&null!==e&&null!=e.key?c(e.key):t.toString(36)}function y(e,t){e.func.call(e.context,t,e.count++)}function m(e,t,n){var o=e.result,r=e.keyPrefix;e=e.func.call(e.context,t,e.count++),Array.isArray(e)?b(e,o,n,E.thatReturnsArgument):null!=e&&(u(e)&&(t=r+(!e.key||t&&t.key===e.key?"":(""+e.key).replace(N,"$&/")+"/")+n,e={$$typeof:_,type:e.type,key:t,ref:e.ref,props:e.props,_owner:e._owner}),o.push(e))}function b(e,t,n,o,r){var s="";null!=n&&(s=(""+n).replace(N,"$&/")+"/"),t=f(t,s,o,r),null==e||d(e,"",m,t),p(t)}var v=n(5),g=n(6),E=n(0),w="function"==typeof Symbol&&Symbol.for,_=w?Symbol.for("react.element"):60103,k=w?Symbol.for("react.call"):60104,O=w?Symbol.for("react.return"):60105,P=w?Symbol.for("react.portal"):60106,j=w?Symbol.for("react.fragment"):60107,S="function"==typeof Symbol&&Symbol.iterator,x={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}};r.prototype.isReactComponent={},r.prototype.setState=function(e,t){"object"!=typeof e&&"function"!=typeof e&&null!=e&&o("85"),this.updater.enqueueSetState(this,e,t,"setState")},r.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")},i.prototype=r.prototype;var C=s.prototype=new i;C.constructor=s,v(C,r.prototype),C.isPureReactComponent=!0;var M=a.prototype=new i;M.constructor=a,v(M,r.prototype),M.unstable_isAsyncReactComponent=!0,M.render=function(){return this.props.children};var T={current:null},R=Object.prototype.hasOwnProperty,L={key:!0,ref:!0,__self:!0,__source:!0},N=/\/+/g,A=[],$={Children:{map:function(e,t,n){if(null==e)return e;var o=[];return b(e,o,null,t,n),o},forEach:function(e,t,n){if(null==e)return e;t=f(null,null,t,n),null==e||d(e,"",y,t),p(t)},count:function(e){return null==e?0:d(e,"",E.thatReturnsNull,null)},toArray:function(e){var t=[];return b(e,t,null,E.thatReturnsArgument),t},only:function(e){return u(e)||o("143"),e}},Component:r,PureComponent:s,unstable_AsyncComponent:a,Fragment:j,createElement:l,cloneElement:function(e,t,n){var o=v({},e.props),r=e.key,s=e.ref,i=e._owner;if(null!=t){if(void 0!==t.ref&&(s=t.ref,i=T.current),void 0!==t.key&&(r=""+t.key),e.type&&e.type.defaultProps)var a=e.type.defaultProps;for(l in t)R.call(t,l)&&!L.hasOwnProperty(l)&&(o[l]=void 0===t[l]&&void 0!==a?a[l]:t[l])}var l=arguments.length-2;if(1===l)o.children=n;else if(1<l){a=Array(l);for(var u=0;u<l;u++)a[u]=arguments[u+2];o.children=a}return{$$typeof:_,type:e.type,key:r,ref:s,props:o,_owner:i}},createFactory:function(e){var t=l.bind(null,e);return t.type=e,t},isValidElement:u,version:"16.2.0",__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:{ReactCurrentOwner:T,assign:v}},q=Object.freeze({default:$}),U=q&&$||q;e.exports=U.default?U.default:U},function(e,t,n){"use strict";function o(e){if(null===e||void 0===e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}var r=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var o={};return"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},o)).join("")}catch(e){return!1}}()?Object.assign:function(e,t){for(var n,a,l=o(e),u=1;u<arguments.length;u++){n=Object(arguments[u]);for(var c in n)s.call(n,c)&&(l[c]=n[c]);if(r){a=r(n);for(var f=0;f<a.length;f++)i.call(n,a[f])&&(l[a[f]]=n[a[f]])}}return l}},function(e,t,n){"use strict";var o={};e.exports=o},function(e,t,n){e.exports=n(8)()},function(e,t,n){"use strict";var o=n(0),r=n(9),s=n(10);e.exports=function(){function e(e,t,n,o,i,a){a!==s&&r(!1,"Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types")}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=o,n.PropTypes=n,n}},function(e,t,n){"use strict";function o(e,t,n,o,s,i,a,l){if(r(t),!e){var u;if(void 0===t)u=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var c=[n,o,s,i,a,l],f=0;u=new Error(t.replace(/%s/g,function(){return c[f++]})),u.name="Invariant Violation"}throw u.framesToPop=1,u}}var r=function(e){};e.exports=o},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,n){"use strict";function o(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=arguments[1];if(!t)return e.join(" ").trim();for(var n=[],o=e.length;o--;)t[e[o]]&&n.push(t[e[o]]);return n.join(" ").trim()}function r(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments[1];return t?t[e]||e:e}function s(e,t,n){if(!e)return!1;var o=t.charAt(0).toUpperCase()+t.slice(1);return void 0!==e.style["Webkit"+o]?e.addEventListener("webkit"+o+"End",n):void 0!==e.style.OTransition?e.addEventListener("o"+t+"End",n):e.addEventListener(t+"End",n)}function i(e){var t=e.element,n=e.root,r=e.cssModule,s=void 0===r?null:r,i=e.state,a=void 0===i?null:i;if(!t)return!1;if(!a)return t.classList.remove(o([n+"--"+l[0]],s),o([n+"--"+l[1]],s),o([n+"--"+l[2]],s)),!1;for(var u=l.filter(function(e){return e!==a}),c=u.length;c--;)t.classList.remove(o([n+"--"+u[c]],s));return t.classList.add(o([n+"--"+a],s)),!0}function a(e){var t=e.event,n=e.button,o=e.content,r=e.className,i=n.getBoundingClientRect(),a=window.pageYOffset||document.documentElement.scrolltop||0,l=document.createElement("span"),u=i.width<50?3*i.width:2*i.width;l.className=r,l.style.top="-"+(u/2-(t.pageY-i.top-a))+"px",l.style.left="-"+(u/2-(t.pageX-i.left))+"px",l.style.width=u+"px",l.style.height=u+"px",s(l,"animation",function(){o.removeChild(l)}),window.requestAnimationFrame(function(){o.appendChild(l)})}Object.defineProperty(t,"__esModule",{value:!0}),t.classToModules=o,t.getClassName=r,t.setCssEndEvent=s,t.toggleMoveClasses=i,t.createBubbleEffect=a;var l=["middle","left","right"]}])});

package.json

 {
   "name": "react-awesome-button",
-  "version": "0.5.2",
+  "version": "0.6.0",
   "description": "Performant, extendable, highly customisable, production ready React Component that renders an animated basic set of UI buttons",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

src/demo/data.js

@@ -25,7 +25,6 @@ import React from 'react';
       <div>
-        <AwesomeButton bubbles cssModule={AwsBtnStyles}>Primary Button</AwesomeButton>
+        <AwesomeButton bubbles>Primary Button</AwesomeButton>
         <AwesomeButton bubbles cssModule={AwsBtnStyles} type="secondary">Secondary Button</AwesomeButton>
         <AwesomeButton cssModule={AwsBtnStyles} disabled>Disabled Button</AwesomeButton>
-      </div>
-      ),
+      </div>),
   },
@@ -127,3 +126,5 @@ {
           }}
-        >Progress Button</AwesomeButton>
+        >
+          Progress Button
+        </AwesomeButton>
         <AwesomeButton
@@ -138,3 +139,5 @@ cssModule={AwsBtnStyles}
           }}
-        >Progress Button</AwesomeButton>
+        >
+          Progress Button
+        </AwesomeButton>
       </div>),
@@ -167,11 +170,17 @@ },
             cssModule={AwsBtnStylesThemeTwo}
-          >Themed Button</AwesomeButton>
+          >
+            Themed Button
+          </AwesomeButton>
           <AwesomeButton
             cssModule={AwsBtnStylesThemeTwo}
             type="secondary"
-          >Themed Button</AwesomeButton>
+          >
+            Themed Button
+          </AwesomeButton>
           <AwesomeButton
             cssModule={AwsBtnStylesThemeTwo}
             disabled
-          >Themed Button</AwesomeButton>
+          >
+            Themed Button
+          </AwesomeButton>
         </div>
@@ -192,3 +201,5 @@ </div>
           moveEvents={false}
-        >Without Move Events</AwesomeButton>
+        >
+          Without Move Events
+        </AwesomeButton>
       </div>
@@ -195,0 +206,0 @@ ),

src/demo/demo.js

@@ -28,4 +28,4 @@ import React from 'react';
           <code
-            dangerouslySetInnerHTML={{ __html:
-              Prism.highlight(example.scss.trim(), Prism.languages.scss),
+            dangerouslySetInnerHTML={{
+              __html: Prism.highlight(example.scss.trim(), Prism.languages.scss),
             }}
@@ -39,4 +39,4 @@ />
           <code
-            dangerouslySetInnerHTML={{ __html:
-              Prism.highlight(example.js.trim(), Prism.languages.jsx),
+            dangerouslySetInnerHTML={{
+              __html: Prism.highlight(example.js.trim(), Prism.languages.jsx),
             }}
@@ -49,4 +49,4 @@ />
         <code
-          dangerouslySetInnerHTML={{ __html:
-            Prism.highlight(example.text.trim(), Prism.languages.jsx),
+          dangerouslySetInnerHTML={{
+            __html: Prism.highlight(example.text.trim(), Prism.languages.jsx),
           }}
@@ -91,6 +91,9 @@ />
 
-render((
-  <Router>
-    <Route path="/" component={Demo} />
-  </Router>),
-  document.getElementById('root'));
+render(
+  (
+    <Router>
+      <Route path="/" component={Demo} />
+    </Router>
+  ),
+  document.getElementById('root'),
+);

src/helpers/component.js

@@ -0,2 +1,7 @@
+const POSITION_STATES = ['middle', 'left', 'right'];
+
 export function classToModules(className = [], cssModule) {
+  if (!cssModule) {
+    return className.join(' ').trim();
+  }
   const ClassName = [];
@@ -42,3 +47,2 @@ let i = className.length;
   }
-  const POSITION_STATES = ['middle', 'left', 'right'];
   if (!state) {
@@ -45,0 +49,0 @@ element.classList.remove(

No alert changes

Improved metrics

Lines of code

985

increased by1.76%

Worsened metrics

Total package byte prevSize

89340

decreased by-69.45%

Number of package files

32

decreased by-5.88%

No dependency changes