Latest build 🤖

lib/autocomplete/Autocomplete.js

@@ -182,7 +182,7 @@ var factory = function factory(Chip, Input) {
               var key = _step$value[0];
               var value = _step$value[1];
 
-              if (!values.has(key) && value.toLowerCase().trim().startsWith(query)) {
+              if (!values.has(key) && this.matches(value.toLowerCase().trim(), query)) {
                 suggest.set(key, value);
               }
             }
@@ -214,7 +214,7 @@ var factory = function factory(Chip, Input) {
                 var key = _step2$value[0];
                 var value = _step2$value[1];
 
-                if (value.toLowerCase().trim().startsWith(query)) {
+                if (this.matches(value.toLowerCase().trim(), query)) {
                   suggest.set(key, value);
                 }
               }
@@ -240,6 +240,23 @@ var factory = function factory(Chip, Input) {
 
         return suggest;
       }
+    }, {
+      key: 'matches',
+      value: function matches(value, query) {
+        var suggestionMatch = this.props.suggestionMatch;
+
+
+        if (suggestionMatch === 'start') {
+          return value.startsWith(query);
+        } else if (suggestionMatch === 'anywhere') {
+          return value.includes(query);
+        } else if (suggestionMatch === 'word') {
+          var re = new RegExp('\\b' + query, 'g');
+          return re.test(value);
+        }
+
+        return false;
+      }
     }, {
       key: 'source',
       value: function source() {
@@ -418,6 +435,7 @@ var factory = function factory(Chip, Input) {
     selectedPosition: _react.PropTypes.oneOf(['above', 'below']),
     showSuggestionsWhenValueIsSet: _react.PropTypes.bool,
     source: _react.PropTypes.any,
+    suggestionMatch: _react.PropTypes.oneOf(['start', 'anywhere', 'word']),
     theme: _react.PropTypes.shape({
       active: _react.PropTypes.string,
       autocomplete: _react.PropTypes.string,
@@ -438,7 +456,8 @@ var factory = function factory(Chip, Input) {
     selectedPosition: 'above',
     multiple: true,
     showSuggestionsWhenValueIsSet: false,
-    source: {}
+    source: {},
+    suggestionMatch: 'start'
   };
 
 

lib/button/theme.scss

@@ -11,7 +11,7 @@
 %button {
   @include typo-button();
   position: relative;
-  display: inline-flex;
+  display: inline-block;
   height: $button-height;
   flex-direction: row;
   align-content: center;

lib/checkbox/Checkbox.js

@@ -118,7 +118,8 @@ var factory = function factory(Check) {
     checked: _react.PropTypes.bool,
     className: _react.PropTypes.string,
     disabled: _react.PropTypes.bool,
-    label: _react.PropTypes.any,
+    label: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.node]),
+    name: _react.PropTypes.string,
     onChange: _react.PropTypes.func,
     theme: _react.PropTypes.shape({
       disabled: _react.PropTypes.string,

lib/date_picker/DatePicker.js

@@ -136,10 +136,10 @@ var factory = function factory(Input, DatePickerDialog) {
     icon: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.element]),
     inputClassName: _react.PropTypes.string,
     inputFormat: _react.PropTypes.func,
-    name: _react.PropTypes.string,
     label: _react.PropTypes.string,
     maxDate: _react.PropTypes.object,
     minDate: _react.PropTypes.object,
+    name: _react.PropTypes.string,
     onChange: _react.PropTypes.func,
     theme: _react.PropTypes.shape({
       input: _react.PropTypes.string

lib/dropdown/Dropdown.js

@@ -81,6 +81,9 @@ var factory = function factory(Input) {
       }, _this.handleSelect = function (item, event) {
         if (_this.props.onBlur) _this.props.onBlur(event);
         if (!_this.props.disabled && _this.props.onChange) {
+          if (_this.props.name) {
+            event.target.name = _this.props.name;
+          }
           _this.props.onChange(item, event);
           _this.setState({ active: false });
         }
@@ -223,6 +226,7 @@ var factory = function factory(Input) {
     disabled: _react.PropTypes.bool,
     error: _react.PropTypes.string,
     label: _react.PropTypes.string,
+    name: _react.PropTypes.string,
     onBlur: _react.PropTypes.func,
     onChange: _react.PropTypes.func,
     onFocus: _react.PropTypes.func,

lib/font_icon/FontIcon.js

@@ -30,7 +30,7 @@ var FontIcon = function FontIcon(_ref) {
     'span',
     _extends({
       'data-react-toolbox': 'font-icon',
-      className: (0, _classnames2.default)({ 'material-icons': typeof value === 'string' }, className)
+      className: (0, _classnames2.default)({ 'material-icons': typeof value === 'string' || typeof children === 'string' }, className)
     }, other),
     value,
     children

lib/input/Input.js

@@ -159,10 +159,10 @@ var factory = function factory(FontIcon) {
     floating: _react2.default.PropTypes.bool,
     hint: _react2.default.PropTypes.string,
     icon: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.element]),
-    name: _react2.default.PropTypes.string,
     label: _react2.default.PropTypes.string,
     maxLength: _react2.default.PropTypes.number,
     multiline: _react2.default.PropTypes.bool,
+    name: _react2.default.PropTypes.string,
     onBlur: _react2.default.PropTypes.func,
     onChange: _react2.default.PropTypes.func,
     onFocus: _react2.default.PropTypes.func,

lib/menu/Menu.js

@@ -70,13 +70,14 @@ var factory = function factory(MenuItem) {
         if (_this.state.active && !_utils.events.targetIsDescendant(event, _reactDom2.default.findDOMNode(_this))) {
           _this.setState({ active: false, rippled: false });
         }
-      }, _this.handleSelect = function (item) {
+      }, _this.handleSelect = function (item, event) {
         var _item$props = item.props;
         var value = _item$props.value;
         var onClick = _item$props.onClick;
 
+        if (onClick) event.persist();
         _this.setState({ active: false, rippled: _this.props.ripple }, function () {
-          if (onClick) onClick();
+          if (onClick) onClick(event);
           if (_this.props.onSelect) _this.props.onSelect(value);
         });
       }, _temp), _possibleConstructorReturn(_this, _ret);
@@ -275,7 +276,9 @@ var factory = function factory(MenuItem) {
     onSelect: _react.PropTypes.func,
     onShow: _react.PropTypes.func,
     outline: _react.PropTypes.bool,
-    position: _react.PropTypes.string,
+    position: _react.PropTypes.oneOf(Object.keys(POSITION).map(function (key) {
+      return POSITION[key];
+    })),
     ripple: _react.PropTypes.bool,
     selectable: _react.PropTypes.bool,
     selected: _react.PropTypes.any,

lib/menu/__test__/index.spec.js

@@ -0,0 +1,51 @@
+'use strict';
+
+var _expect = require('expect');
+
+var _expect2 = _interopRequireDefault(_expect);
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _reactDom = require('react-dom');
+
+var _reactDom2 = _interopRequireDefault(_reactDom);
+
+var _reactAddonsTestUtils = require('react-addons-test-utils');
+
+var _reactAddonsTestUtils2 = _interopRequireDefault(_reactAddonsTestUtils);
+
+var _Menu = require('../Menu');
+
+var _Menu2 = _interopRequireDefault(_Menu);
+
+var _MenuItem = require('../MenuItem');
+
+var _MenuItem2 = _interopRequireDefault(_MenuItem);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+describe('MenuItem', function () {
+  describe('#onClick', function () {
+    it('passes to listener the event', function () {
+      var listenerCalled = false;
+      var handleClick = function handleClick(event) {
+        listenerCalled = true;
+        (0, _expect2.default)(event).toExist();
+        (0, _expect2.default)(event.target).toExist();
+      };
+
+      var tree = _reactAddonsTestUtils2.default.renderIntoDocument(_react2.default.createElement(
+        _Menu2.default,
+        null,
+        _react2.default.createElement(_MenuItem2.default, { key: '1', onClick: handleClick })
+      ));
+
+      var menuItem = _reactAddonsTestUtils2.default.findRenderedComponentWithType(tree, _MenuItem.MenuItem);
+      _reactAddonsTestUtils2.default.Simulate.click(_reactDom2.default.findDOMNode(menuItem));
+
+      (0, _expect2.default)(listenerCalled).toBe(true);
+    });
+  });
+});

lib/overlay/theme.scss

@@ -16,7 +16,7 @@
   align-items: center;
   justify-content: center;
   pointer-events: none;
-  &.invisible > *:not(.overlay) {
+  &.invisible > *:not(.backdrop) {
     pointer-events: all;
   }
 }

lib/radio/RadioButton.js

@@ -117,7 +117,7 @@ var factory = function factory(Radio) {
     checked: _react.PropTypes.bool,
     className: _react.PropTypes.string,
     disabled: _react.PropTypes.bool,
-    label: _react.PropTypes.string,
+    label: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.node]),
     name: _react.PropTypes.string,
     onBlur: _react.PropTypes.func,
     onChange: _react.PropTypes.func,

lib/snackbar/Snackbar.js

@@ -68,6 +68,11 @@ var factory = function factory(Overlay, Button) {
           }, nextProps.timeout);
         }
       }
+    }, {
+      key: 'componentWillUnmount',
+      value: function componentWillUnmount() {
+        clearTimeout(this.curTimeout);
+      }
     }, {
       key: 'render',
       value: function render() {

lib/time_picker/TimePicker.js

@@ -122,8 +122,8 @@ var factory = function factory(TimePickerDialog, Input) {
     error: _react.PropTypes.string,
     format: _react.PropTypes.oneOf(['24hr', 'ampm']),
     inputClassName: _react.PropTypes.string,
-    name: _react.PropTypes.string,
     label: _react.PropTypes.string,
+    name: _react.PropTypes.string,
     onChange: _react.PropTypes.func,
     theme: _react.PropTypes.shape({
       input: _react.PropTypes.string