Socket
Socket
Sign inDemoInstall

react-awesome-button

Package Overview
Dependencies
Maintainers
1
Versions
57
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-awesome-button - npm Package Compare versions

Comparing version 0.4.2 to 0.4.3

2

dist/index.js

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("prop-types"),require("react")):"function"==typeof define&&define.amd?define(["prop-types","react"],t):"object"==typeof exports?exports["react-awesome-button"]=t(require("prop-types"),require("react")):e["react-awesome-button"]=t(e.PropTypes,e.React)}(this,function(e,t){return function(e){function t(o){if(n[o])return n[o].exports;var s=n[o]={i:o,l:!1,exports:{}};return e[o].call(s.exports,s,s.exports,t),s.l=!0,s.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},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=4)}([function(e,t,n){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}function s(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(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),p=o(u),c=n(2),d=o(c),f=n(1),h="aws-btn",b=function(e){return p.default.createElement("a",e)},m=function(e){return p.default.createElement("button",e)},g=function(e){function t(e){s(this,t);var n=r(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,clicked:!1},n.checkProps(e),n}return i(t,e),l(t,[{key:"componentDidMount",value:function(){(0,f.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,f.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?b: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(){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.props.action(this.button.parentNode,this.props.progress?this.endLoading.bind(this):null)}},{key:"createBubble",value:function(e){(0,f.createBubbleEffect)({event:e,button:this.button,content:this.content,className:(0,f.getClassName)(this.rootElement+"__bubble",this.props.cssModule)})}},{key:"moveEvents",value:function(){var e=this,t={onMouseLeave:function(){e.clearPress()},onMouseDown:function(t){if(!(!0===e.state.disabled||!0===e.state.loading||!0===e.state.blocked||t&&1!==t.nativeEvent.which)&&(!1===e.props.progress&&!0===e.props.bubbles&&e.createBubble(t),e.setState({loading:e.props.progress,pressPosition:e.rootElement+"--active"}),"undefined"!=typeof window)){var n=new Event("action");e.button.dispatchEvent(n),e.action()}},onMouseUp:function(t){if(!0===e.state.disabled||!0===e.state.loading||!0===e.state.blocked)return t.preventDefault(),void t.stopPropagation();e.clearPress()}};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().left,s=n.offsetWidth;e.setState({pressPosition:t.pageX<o+.3*s?e.rootElement+"--left":t.pageX>o+.65*s?e.rootElement+"--right":e.rootElement+"--middle"})}}:t.onMouseEnter=function(){e.setState({pressPosition:e.rootElement+"--middle"})},t}},{key:"render",value:function(){var e=this,t=this.renderComponent;return p.default.createElement(t,a({style:this.props.style,className:this.getRootClassName(),role:"button"},this.extraProps,this.moveEvents()),p.default.createElement("span",{ref:function(t){e.button=t},className:(0,f.getClassName)(this.rootElement+"__container",this.props.cssModule)},p.default.createElement("span",{ref:function(t){e.wrapper=t},className:(0,f.getClassName)(this.rootElement+"__wrapper",this.props.cssModule)},p.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,f.getClassName)(this.rootElement+"__content",this.props.cssModule)},p.default.createElement("span",null,this.props.children)))))}}]),t}(p.default.Component);g.propTypes={action:d.default.func,bubbles:d.default.bool,children:d.default.node.isRequired,disabled:d.default.bool,element:d.default.func,href:d.default.string,loadingLabel:d.default.string,progress:d.default.bool,resultLabel:d.default.string,rootElement:d.default.string,moveEvents:d.default.bool,size:d.default.string,style:d.default.object,cssModule:d.default.object,target:d.default.string,to:d.default.string,type:d.default.string,visible:d.default.bool},g.defaultProps={action:null,bubbles:!1,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=g},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 s(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments[1];return t?t[e]||e:e}function r(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.event,n=e.button,o=e.content,s=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=s,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",r(l,"animation",function(){o.removeChild(l)}),window.requestAnimationFrame(function(){o.appendChild(l)})}Object.defineProperty(t,"__esModule",{value:!0}),t.classToModules=o,t.getClassName=s,t.setCssEndEvent=r,t.createBubbleEffect=i},function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t,n){e.exports=n(0)}])});
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("prop-types"),require("react")):"function"==typeof define&&define.amd?define(["prop-types","react"],e):"object"==typeof exports?exports["react-awesome-button"]=e(require("prop-types"),require("react")):t["react-awesome-button"]=e(t.PropTypes,t.React)}(this,function(t,e){return function(t){function e(o){if(n[o])return n[o].exports;var s=n[o]={i:o,l:!1,exports:{}};return t[o].call(s.exports,s,s.exports,e),s.l=!0,s.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},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=4)}([function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{default:t}}function s(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(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 i(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)}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},l=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}}(),u=n(3),p=o(u),c=n(2),d=o(c),f=n(1),h="aws-btn",b=function(t){return p.default.createElement("a",t)},m=function(t){return p.default.createElement("button",t)},g=function(t){function e(t){s(this,e);var n=r(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,t));return n.rootElement=t.rootElement||h,n.animationStage=0,n.extraProps={},n.state={disabled:t.disabled,loading:!1,loadingEnd:!1,loadingStart:!1,blocked:!1,clicked:!1},n.checkProps(t),n}return i(e,t),l(e,[{key:"componentDidMount",value:function(){(0,f.setCssEndEvent)(this.wrapper,"transition",this.clearStagedWrapperAnimation.bind(this))}},{key:"componentWillReceiveProps",value:function(t){this.checkProps(t)}},{key:"getRootClassName",value:function(){var t=[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&&t.push(this.rootElement+"--disabled"),this.state.pressPosition&&t.push(this.state.pressPosition),this.props.cssModule&&this.props.cssModule["aws-btn"]?(0,f.classToModules)(t,this.props.cssModule):t.join(" ").trim().replace(/[\s]+/gi," ")}},{key:"checkProps",value:function(t){this.extraProps.to=t.to||null,this.extraProps.href=t.href||null,this.extraProps.target=t.target||null,this.renderComponent=t.element||(this.props.href?b: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(){var t=this.state.loading?this.state.pressPosition:null;this.setState({pressPosition:t})}},{key:"clearLoading",value:function(){this.setState({loading:!1,loadingStart:!1,loadingEnd:!1})}},{key:"clearStagedWrapperAnimation",value:function(){var t=this;if(0!==this.animationStage){if(5===this.animationStage)return this.animationStage=0,void setTimeout(function(){"undefined"!=typeof window&&window.requestAnimationFrame(function(){t.clearLoading(),t.clearPress(),setTimeout(function(){t.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.button.parentNode,this.props.progress?this.endLoading.bind(this):null)}},{key:"createBubble",value:function(t){(0,f.createBubbleEffect)({event:t,button:this.button,content:this.content,className:(0,f.getClassName)(this.rootElement+"__bubble",this.props.cssModule)})}},{key:"moveEvents",value:function(){var t=this,e={onMouseLeave:function(){t.clearPress()},onMouseDown:function(e){if(!(!0===t.state.disabled||!0===t.state.loading||!0===t.state.blocked||e&&1!==e.nativeEvent.which)){if(!1===t.props.progress&&!0===t.props.bubbles&&t.createBubble(e),t.setState({loading:t.props.progress,pressPosition:t.rootElement+"--active"}),"undefined"!=typeof window&&t.button){var n=new Event("action");t.button.dispatchEvent(n)}t.action()}},onMouseUp:function(e){if(!0===t.state.disabled||!0===t.state.loading||!0===t.state.blocked)return e.preventDefault(),void e.stopPropagation();t.clearPress()}};return!0===this.props.moveEvents?e.onMouseMove=function(e){if(!0!==t.state.disabled&&!0!==t.state.loading&&!0!==t.state.blocked){var n=t.button,o=n.getBoundingClientRect().left,s=n.offsetWidth;t.setState({pressPosition:e.pageX<o+.3*s?t.rootElement+"--left":e.pageX>o+.65*s?t.rootElement+"--right":t.rootElement+"--middle"})}}:e.onMouseEnter=function(){t.setState({pressPosition:t.rootElement+"--middle"})},e}},{key:"render",value:function(){var t=this,e=this.renderComponent;return p.default.createElement(e,a({style:this.props.style,className:this.getRootClassName(),role:"button"},this.extraProps,this.moveEvents()),p.default.createElement("span",{ref:function(e){t.button=e},className:(0,f.getClassName)(this.rootElement+"__container",this.props.cssModule)},p.default.createElement("span",{ref:function(e){t.wrapper=e},className:(0,f.getClassName)(this.rootElement+"__wrapper",this.props.cssModule)},p.default.createElement("span",{ref:function(e){t.content=e},"data-loading":this.props.progress&&this.props.loadingLabel||null,"data-status":this.props.progress&&this.props.resultLabel||null,className:(0,f.getClassName)(this.rootElement+"__content",this.props.cssModule)},p.default.createElement("span",null,this.props.children)))))}}]),e}(p.default.Component);g.propTypes={action:d.default.func,bubbles:d.default.bool,children:d.default.node.isRequired,disabled:d.default.bool,element:d.default.func,href:d.default.string,loadingLabel:d.default.string,progress:d.default.bool,resultLabel:d.default.string,rootElement:d.default.string,moveEvents:d.default.bool,size:d.default.string,style:d.default.object,cssModule:d.default.object,target:d.default.string,to:d.default.string,type:d.default.string,visible:d.default.bool},g.defaultProps={action:null,bubbles:!1,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},e.default=g},function(t,e,n){"use strict";function o(){for(var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],e=arguments[1],n=[],o=t.length;o--;)e[t[o]]&&n.push(e[t[o]]);return n.join(" ").trim()}function s(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",e=arguments[1];return e?e[t]||t:t}function r(t,e,n){if(!t)return!1;var o=e.charAt(0).toUpperCase()+e.slice(1);return void 0!==t.style["Webkit"+o]?t.addEventListener("webkit"+o+"End",n):void 0!==t.style.OTransition?t.addEventListener("o"+e+"End",n):t.addEventListener(e+"End",n)}function i(t){var e=t.event,n=t.button,o=t.content,s=t.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=s,l.style.top="-"+(u/2-(e.pageY-i.top-a))+"px",l.style.left="-"+(u/2-(e.pageX-i.left))+"px",l.style.width=u+"px",l.style.height=u+"px",r(l,"animation",function(){o.removeChild(l)}),window.requestAnimationFrame(function(){o.appendChild(l)})}Object.defineProperty(e,"__esModule",{value:!0}),e.classToModules=o,e.getClassName=s,e.setCssEndEvent=r,e.createBubbleEffect=i},function(e,n){e.exports=t},function(t,n){t.exports=e},function(t,e,n){t.exports=n(0)}])});
{
"name": "react-awesome-button",
"version": "0.4.2",
"version": "0.4.3",
"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",

@@ -162,3 +162,3 @@ import React from 'react';

}
if (this.props.action) {
if (this.props.action && this.button) {
this.props.action(

@@ -198,7 +198,7 @@ this.button.parentNode,

});
if (typeof window !== 'undefined') {
if (typeof window !== 'undefined' && this.button) {
const eventTrigger = new Event('action');
this.button.dispatchEvent(eventTrigger);
this.action();
}
this.action();
},

@@ -205,0 +205,0 @@ onMouseUp: (event) => {

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc