react-buttons - npm Package Compare versions

Comparing version 0.0.8 to 0.0.9

dist/index.js

@@ -17,2 +17,4 @@ 'use strict';
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
@@ -30,5 +32,5 @@
 
-var _classnames = require('classnames');
+var _classnames2 = require('classnames');
 
-var _classnames2 = _interopRequireDefault(_classnames);
+var _classnames3 = _interopRequireDefault(_classnames2);
 
@@ -70,3 +72,3 @@ var Button = (function (_Component) {
         'button',
-        _extends({}, props, { className: (0, _classnames2['default'])(className, { 'icon-text-btn': icon }) }),
+        _extends({}, props, { className: (0, _classnames3['default'])(className, { 'icon-text-btn': icon }) }),
         _react2['default'].createElement(
@@ -188,3 +190,3 @@ 'div',
       var buttonProps = {
-        className: (0, _classnames2['default'])('icon-btn', this.props.className, {
+        className: (0, _classnames3['default'])('icon-btn', this.props.className, {
           'tab-focus': isTabFocused
@@ -265,6 +267,5 @@ }),
     value: function render() {
-      var className = (0, _classnames2['default'])('hamburger-btn', this.props.className, {
-        'active': this.props.active,
-        'hamburger-btn-lg': this.props.isLarge
-      });
+      var className = (0, _classnames3['default'])('hamburger-btn', this.props.className, _defineProperty({
+        'active': this.props.active
+      }, 'hamburger-btn-' + this.props.size, this.props.size));
 
@@ -286,7 +287,7 @@ return _react2['default'].createElement(
       active: _react.PropTypes.bool,
-      isLarge: _react.PropTypes.bool,
       label: _react.PropTypes.string.isRequired,
       helpPosition: _react.PropTypes.oneOf(['top', 'left', 'bottom', 'right']),
       onClick: _react.PropTypes.func,
-      className: _react.PropTypes.string
+      className: _react.PropTypes.string,
+      size: _react.PropTypes.string
     },
@@ -298,4 +299,4 @@ enumerable: true
       active: false,
-      isLarge: false,
-      helpPosition: 'bottom'
+      helpPosition: 'bottom',
+      size: 'md'
     },
@@ -331,3 +332,3 @@ enumerable: true
 
-      var fullClassName = (0, _classnames2['default'])(className, 'flat-btn', 'flat-btn-' + color, {
+      var fullClassName = (0, _classnames3['default'])(className, 'flat-btn', 'flat-btn-' + color, {
         'active': active
@@ -374,3 +375,3 @@ });
     value: function render() {
-      var className = (0, _classnames2['default'])(this.props.className, 'floating-btn', 'floating-btn-' + this.props.color);
+      var className = (0, _classnames3['default'])(this.props.className, 'floating-btn', 'floating-btn-' + this.props.color);
 
@@ -377,0 +378,0 @@ return _react2['default'].createElement(IconButton, _extends({}, this.props, { className: className }));

dist/index.min.js

@@ -1,1 +0,1 @@
-"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _objectWithoutProperties(e,t){var r={};for(var a in e)t.indexOf(a)>=0||Object.prototype.hasOwnProperty.call(e,a)&&(r[a]=e[a]);return r}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _inherits(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(exports,"__esModule",{value:!0});var _extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_createClass=function(){function e(e,t){for(var r=0;r<t.length;r++){var a=t[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,r,a){return r&&e(t.prototype,r),a&&e(t,a),t}}(),_get=function(e,t,r){for(var a=!0;a;){var o=e,s=t,n=r;i=c=l=void 0,a=!1,null===o&&(o=Function.prototype);var i=Object.getOwnPropertyDescriptor(o,s);if(void 0!==i){if("value"in i)return i.value;var l=i.get;return void 0===l?void 0:l.call(n)}var c=Object.getPrototypeOf(o);if(null===c)return void 0;e=c,t=s,r=n,a=!0}},_react=require("react"),_react2=_interopRequireDefault(_react),_reactAddonsPureRenderMixin=require("react-addons-pure-render-mixin"),_reactAddonsPureRenderMixin2=_interopRequireDefault(_reactAddonsPureRenderMixin),_classnames=require("classnames"),_classnames2=_interopRequireDefault(_classnames),Button=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=this.props,t=e.iconBefore,r=e.faIcon,a=e.materialIcon,o=e.className,s=_objectWithoutProperties(e,["iconBefore","faIcon","materialIcon","className"]),n=null;return r?n=_react2["default"].createElement("i",{className:"icon fa fa-"+r}):a&&(n=_react2["default"].createElement("i",{className:"icon material-icons"},a)),_react2["default"].createElement("button",_extends({},s,{className:_classnames2["default"](o,{"icon-text-btn":n})}),_react2["default"].createElement("div",null,t&&n,this.props.children,!t&&n))}}],[{key:"propTypes",value:{iconBefore:_react.PropTypes.bool,faIcon:_react.PropTypes.string,materialIcon:_react.PropTypes.string,type:_react.PropTypes.oneOf(["button","submit","reset"]),className:_react.PropTypes.string,onClick:_react.PropTypes.func,children:_react.PropTypes.node},enumerable:!0},{key:"defaultProps",value:{iconBefore:!1,type:"button"},enumerable:!0}]),t}(_react.Component);exports.Button=Button;var TAB=9,SPACEBAR=32,ENTER=13,IconButton=function(e){function t(e){var r=this;_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.handleClick=function(e){r.props.onClick(e),r.setHelpTextVisible(!1)},this.handleKeyUp=function(e){var t=e.which||e.keyCode;t===TAB?(r.setHelpTextVisible(!0),r.setState({isTabFocused:!0})):(t===SPACEBAR||t===ENTER)&&r.setHelpTextVisible(!1)},this.removeTabFocus=function(){r.setHelpTextVisible(!1),r.setState({isTabFocused:!1})},this.handleMouseOver=function(){r.setHelpTextVisible(!0)},this.handleMouseLeave=function(){r.setHelpTextVisible(!1)},this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this),this.state={isTabFocused:!1,isHelpTextVisible:!1},this.helpTextTimer=null}return _inherits(t,e),_createClass(t,[{key:"setHelpTextVisible",value:function(e){var t=this;if(e){if(this.helpTextTimer)return;this.helpTextTimer=setTimeout(function(){t.setState({isHelpTextVisible:!0})},this.props.helpTextTime)}else this.helpTextTimer&&(clearTimeout(this.helpTextTimer),this.helpTextTimer=null),this.setState({isHelpTextVisible:!1})}},{key:"render",value:function(){var e=this.state,t=e.isTabFocused,r=e.isHelpTextVisible,a={className:_classnames2["default"]("icon-btn",this.props.className,{"tab-focus":t}),onClick:this.handleClick,"aria-label":this.props.label,onKeyUp:this.handleKeyUp,onBlur:this.removeTabFocus,onMouseOver:this.handleMouseOver,onMouseLeave:this.handleMouseLeave},o=this.props.children;return this.props.faIcon?o=_react2["default"].createElement("i",{className:"fa fa-"+this.props.faIcon}):this.props.materialIcon&&(o=_react2["default"].createElement("i",{className:"material-icons"},this.props.materialIcon)),_react2["default"].createElement("button",a,o,r&&_react2["default"].createElement("div",{key:"help-text",className:"help-text-"+this.props.helpPosition},this.props.label))}}],[{key:"propTypes",value:{label:_react.PropTypes.string.isRequired,helpPosition:_react.PropTypes.oneOf(["top","right","bottom","left"]),faIcon:_react.PropTypes.string,materialIcon:_react.PropTypes.string,type:_react.PropTypes.oneOf(["button","reset","submit"]),helpTextTime:_react.PropTypes.number,onClick:_react.PropTypes.func,className:_react.PropTypes.string,children:_react.PropTypes.node},enumerable:!0},{key:"defaultProps",value:{helpPosition:"bottom",type:"button",helpTextTime:1e3,onClick:function(){}},enumerable:!0}]),t}(_react.Component);exports.IconButton=IconButton;var HamburgerButton=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=_classnames2["default"]("hamburger-btn",this.props.className,{active:this.props.active,"hamburger-btn-lg":this.props.isLarge});return _react2["default"].createElement(IconButton,_extends({},this.props,{className:e}),_react2["default"].createElement("div",{className:"bars-wrapper"},_react2["default"].createElement("div",{className:"left-bars"}),_react2["default"].createElement("div",{className:"right-bars"})))}}],[{key:"propTypes",value:{active:_react.PropTypes.bool,isLarge:_react.PropTypes.bool,label:_react.PropTypes.string.isRequired,helpPosition:_react.PropTypes.oneOf(["top","left","bottom","right"]),onClick:_react.PropTypes.func,className:_react.PropTypes.string},enumerable:!0},{key:"defaultProps",value:{active:!1,isLarge:!1,helpPosition:"bottom"},enumerable:!0}]),t}(_react.Component);exports.HamburgerButton=HamburgerButton;var FlatButton=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=this.props,t=e.className,r=e.color,a=e.active,o=_objectWithoutProperties(e,["className","color","active"]),s=_classnames2["default"](t,"flat-btn","flat-btn-"+r,{active:a});return _react2["default"].createElement(Button,_extends({},o,{className:s}))}}],[{key:"propTypes",value:{color:_react.PropTypes.string,active:_react.PropTypes.bool,className:_react.PropTypes.string},enumerable:!0},{key:"defaultProps",value:{color:"default",active:!1},enumerable:!0}]),t}(_react.Component);exports.FlatButton=FlatButton;var FloatingButton=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=_classnames2["default"](this.props.className,"floating-btn","floating-btn-"+this.props.color);return _react2["default"].createElement(IconButton,_extends({},this.props,{className:e}))}}],[{key:"propTypes",value:{color:_react.PropTypes.string,className:_react.PropTypes.string},enumerable:!0},{key:"defaultProps",value:{color:"default",helpPosition:"left"},enumerable:!0}]),t}(_react.Component);exports.FloatingButton=FloatingButton;
+"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{"default":e}}function _objectWithoutProperties(e,t){var r={};for(var a in e)t.indexOf(a)>=0||Object.prototype.hasOwnProperty.call(e,a)&&(r[a]=e[a]);return r}function _defineProperty(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _inherits(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(exports,"__esModule",{value:!0});var _extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_createClass=function(){function e(e,t){for(var r=0;r<t.length;r++){var a=t[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,r,a){return r&&e(t.prototype,r),a&&e(t,a),t}}(),_get=function(e,t,r){for(var a=!0;a;){var o=e,s=t,n=r;i=c=l=void 0,a=!1,null===o&&(o=Function.prototype);var i=Object.getOwnPropertyDescriptor(o,s);if(void 0!==i){if("value"in i)return i.value;var l=i.get;return void 0===l?void 0:l.call(n)}var c=Object.getPrototypeOf(o);if(null===c)return void 0;e=c,t=s,r=n,a=!0}},_react=require("react"),_react2=_interopRequireDefault(_react),_reactAddonsPureRenderMixin=require("react-addons-pure-render-mixin"),_reactAddonsPureRenderMixin2=_interopRequireDefault(_reactAddonsPureRenderMixin),_classnames2=require("classnames"),_classnames3=_interopRequireDefault(_classnames2),Button=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=this.props,t=e.iconBefore,r=e.faIcon,a=e.materialIcon,o=e.className,s=_objectWithoutProperties(e,["iconBefore","faIcon","materialIcon","className"]),n=null;return r?n=_react2["default"].createElement("i",{className:"icon fa fa-"+r}):a&&(n=_react2["default"].createElement("i",{className:"icon material-icons"},a)),_react2["default"].createElement("button",_extends({},s,{className:_classnames3["default"](o,{"icon-text-btn":n})}),_react2["default"].createElement("div",null,t&&n,this.props.children,!t&&n))}}],[{key:"propTypes",value:{iconBefore:_react.PropTypes.bool,faIcon:_react.PropTypes.string,materialIcon:_react.PropTypes.string,type:_react.PropTypes.oneOf(["button","submit","reset"]),className:_react.PropTypes.string,onClick:_react.PropTypes.func,children:_react.PropTypes.node},enumerable:!0},{key:"defaultProps",value:{iconBefore:!1,type:"button"},enumerable:!0}]),t}(_react.Component);exports.Button=Button;var TAB=9,SPACEBAR=32,ENTER=13,IconButton=function(e){function t(e){var r=this;_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.handleClick=function(e){r.props.onClick(e),r.setHelpTextVisible(!1)},this.handleKeyUp=function(e){var t=e.which||e.keyCode;t===TAB?(r.setHelpTextVisible(!0),r.setState({isTabFocused:!0})):(t===SPACEBAR||t===ENTER)&&r.setHelpTextVisible(!1)},this.removeTabFocus=function(){r.setHelpTextVisible(!1),r.setState({isTabFocused:!1})},this.handleMouseOver=function(){r.setHelpTextVisible(!0)},this.handleMouseLeave=function(){r.setHelpTextVisible(!1)},this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this),this.state={isTabFocused:!1,isHelpTextVisible:!1},this.helpTextTimer=null}return _inherits(t,e),_createClass(t,[{key:"setHelpTextVisible",value:function(e){var t=this;if(e){if(this.helpTextTimer)return;this.helpTextTimer=setTimeout(function(){t.setState({isHelpTextVisible:!0})},this.props.helpTextTime)}else this.helpTextTimer&&(clearTimeout(this.helpTextTimer),this.helpTextTimer=null),this.setState({isHelpTextVisible:!1})}},{key:"render",value:function(){var e=this.state,t=e.isTabFocused,r=e.isHelpTextVisible,a={className:_classnames3["default"]("icon-btn",this.props.className,{"tab-focus":t}),onClick:this.handleClick,"aria-label":this.props.label,onKeyUp:this.handleKeyUp,onBlur:this.removeTabFocus,onMouseOver:this.handleMouseOver,onMouseLeave:this.handleMouseLeave},o=this.props.children;return this.props.faIcon?o=_react2["default"].createElement("i",{className:"fa fa-"+this.props.faIcon}):this.props.materialIcon&&(o=_react2["default"].createElement("i",{className:"material-icons"},this.props.materialIcon)),_react2["default"].createElement("button",a,o,r&&_react2["default"].createElement("div",{key:"help-text",className:"help-text-"+this.props.helpPosition},this.props.label))}}],[{key:"propTypes",value:{label:_react.PropTypes.string.isRequired,helpPosition:_react.PropTypes.oneOf(["top","right","bottom","left"]),faIcon:_react.PropTypes.string,materialIcon:_react.PropTypes.string,type:_react.PropTypes.oneOf(["button","reset","submit"]),helpTextTime:_react.PropTypes.number,onClick:_react.PropTypes.func,className:_react.PropTypes.string,children:_react.PropTypes.node},enumerable:!0},{key:"defaultProps",value:{helpPosition:"bottom",type:"button",helpTextTime:1e3,onClick:function(){}},enumerable:!0}]),t}(_react.Component);exports.IconButton=IconButton;var HamburgerButton=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=_classnames3["default"]("hamburger-btn",this.props.className,_defineProperty({active:this.props.active},"hamburger-btn-"+this.props.size,this.props.size));return _react2["default"].createElement(IconButton,_extends({},this.props,{className:e}),_react2["default"].createElement("div",{className:"bars-wrapper"},_react2["default"].createElement("div",{className:"left-bars"}),_react2["default"].createElement("div",{className:"right-bars"})))}}],[{key:"propTypes",value:{active:_react.PropTypes.bool,label:_react.PropTypes.string.isRequired,helpPosition:_react.PropTypes.oneOf(["top","left","bottom","right"]),onClick:_react.PropTypes.func,className:_react.PropTypes.string,size:_react.PropTypes.string},enumerable:!0},{key:"defaultProps",value:{active:!1,helpPosition:"bottom",size:"md"},enumerable:!0}]),t}(_react.Component);exports.HamburgerButton=HamburgerButton;var FlatButton=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=this.props,t=e.className,r=e.color,a=e.active,o=_objectWithoutProperties(e,["className","color","active"]),s=_classnames3["default"](t,"flat-btn","flat-btn-"+r,{active:a});return _react2["default"].createElement(Button,_extends({},o,{className:s}))}}],[{key:"propTypes",value:{color:_react.PropTypes.string,active:_react.PropTypes.bool,className:_react.PropTypes.string},enumerable:!0},{key:"defaultProps",value:{color:"default",active:!1},enumerable:!0}]),t}(_react.Component);exports.FlatButton=FlatButton;var FloatingButton=function(e){function t(e){_classCallCheck(this,t),_get(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.shouldComponentUpdate=_reactAddonsPureRenderMixin2["default"].shouldComponentUpdate.bind(this)}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=_classnames3["default"](this.props.className,"floating-btn","floating-btn-"+this.props.color);return _react2["default"].createElement(IconButton,_extends({},this.props,{className:e}))}}],[{key:"propTypes",value:{color:_react.PropTypes.string,className:_react.PropTypes.string},enumerable:!0},{key:"defaultProps",value:{color:"default",helpPosition:"left"},enumerable:!0}]),t}(_react.Component);exports.FloatingButton=FloatingButton;

example/js/components/Example.js

@@ -79,6 +79,6 @@ import React, { Component } from 'react';
             <IconButton {...ICON_BTN_PROPS[this.state.iconBtnPropsIndex]} onClick={this.nextIconBtn} />
-            <HamburgerButton active={isHamburgerActive[0]} onClick={this.toggleHamburger.bind(this, 0)} label="Boop" />
-            <HamburgerButton active={isHamburgerActive[1]} onClick={this.toggleHamburger.bind(this, 1)} isLarge={true} label="Boop" />
-            <HamburgerButton className="fancy-dancy" active={isHamburgerActive[2]} onClick={this.toggleHamburger.bind(this, 2)} label="Boop" />
-            <HamburgerButton className="fancy-dancy" active={isHamburgerActive[3]} onClick={this.toggleHamburger.bind(this, 3)} isLarge={true} label="Boop" />
+            <HamburgerButton active={isHamburgerActive[0]} onClick={this.toggleHamburger.bind(this, 0)} size="sm" label="Boop" />
+            <HamburgerButton active={isHamburgerActive[1]} onClick={this.toggleHamburger.bind(this, 1)} label="Boop" />
+            <HamburgerButton className="fancy-dancy" active={isHamburgerActive[2]} onClick={this.toggleHamburger.bind(this, 2)} size="lg" label="Boop" />
+            <HamburgerButton className="fancy-dancy" active={isHamburgerActive[3]} onClick={this.toggleHamburger.bind(this, 3)} size="xl" label="Boop" />
           </div>
@@ -85,0 +85,0 @@ </main>

package.json

 {
   "name": "react-buttons",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "A few common buttons with css and helpers.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -27,2 +27,4 @@ # react-buttons
 
+> Each component can be disabled and not inluded in your compiled source by changing the variables **$include-x**
+> Check [the sass source](https://github.com/mlaursen/react-buttons/blob/master/src/scss/_variables.scss)
 
@@ -54,3 +56,3 @@ ## Example
 
-        <HamburgerButton active={false} isLarge={true} onClick={/* something */} />
+        <HamburgerButton active={false} size="lg" onClick={/* something */} />
         <HamburgerButton active={this.props.btnActive} onClick={/* toggle */} />
@@ -114,3 +116,2 @@
     helpTextTime: 1000,
-    onClick: (e) => { console.warn('IconButton with no clicky click', e.target); },
   }
@@ -134,3 +135,3 @@ ```
     active: PropTypes.bool,
-    isLarge: PropTypes.bool,
+    size: PropTypes.string,
     label: PropTypes.string.isRequired,
@@ -142,5 +143,4 @@ helpPosition: PropTypes.oneOf(['top', 'left', 'bottom', 'right']),
     active: false,
-    isLarge: false,
+    size: 'md',
     helpPosition: 'bottom',
-    onClick: (e) => { console.warn('HamburgerButton with no clicky click', e.target); },
   }
@@ -147,0 +147,0 @@ ```

src/js/index.js

@@ -172,3 +172,2 @@ import React, { Component, PropTypes } from 'react';
     active: PropTypes.bool,
-    isLarge: PropTypes.bool,
     label: PropTypes.string.isRequired,
@@ -178,2 +177,3 @@ helpPosition: PropTypes.oneOf(['top', 'left', 'bottom', 'right']),
     className: PropTypes.string,
+    size: PropTypes.string,
   }
@@ -183,4 +183,4 @@
     active: false,
-    isLarge: false,
     helpPosition: 'bottom',
+    size: 'md',
   }
@@ -191,3 +191,3 @@
       'active': this.props.active,
-      'hamburger-btn-lg': this.props.isLarge,
+      [`hamburger-btn-${this.props.size}`]: this.props.size,
     });
@@ -194,0 +194,0 @@

No alert changes

Improved metrics

Total package byte prevSize

90387

increased by12.87%

Lines of code

1175

increased by13.2%

No dependency changes