Latest build

react-toolbox · Jul 24, 2016 · af9e889 · af9e889
1 parent e8bc36d
commit af9e889
Show file tree

Hide file tree

Showing 7 changed files with 79 additions and 78 deletions.
diff --git a/lib/_mixins.scss b/lib/_mixins.scss
@@ -7,7 +7,7 @@
 
 @mixin typo-display-4($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 11.2rem;
+  font-size: $unit * 11.2rem;
   font-weight: 300;
   line-height: 1;
   letter-spacing: -.04em;
@@ -19,7 +19,7 @@
 
 @mixin typo-display-3($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 5.6rem;
+  font-size: $unit * 5.6rem;
   font-weight: 400;
   line-height: 1.35;
   letter-spacing: -.02em;
@@ -31,9 +31,9 @@
 
 @mixin typo-display-2($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 4.5rem;
+  font-size: $unit * 4.5;
   font-weight: 400;
-  line-height: 4.8rem;
+  line-height: $unit * 4.8;
 
   @if $color-contrast {
     opacity: .54;
@@ -42,9 +42,9 @@
 
 @mixin typo-display-1($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 3.4rem;
+  font-size: $unit * 3.4;
   font-weight: 400;
-  line-height: 4rem;
+  line-height: $unit * 4;
 
   @if $color-contrast {
     opacity: .54;
@@ -53,9 +53,9 @@
 
 @mixin typo-headline($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 2.4rem;
+  font-size: $unit * 2.4;
   font-weight: 400;
-  line-height: 3.2rem;
+  line-height: $unit * 3.2;
   -moz-osx-font-smoothing: grayscale;
 
   @if $color-contrast {
@@ -65,7 +65,7 @@
 
 @mixin typo-title($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 2rem;
+  font-size: $unit * 2;
   font-weight: 500;
   line-height: 1;
   letter-spacing: .02em;
@@ -77,9 +77,9 @@
 
 @mixin typo-subhead($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.6rem;
+  font-size: $unit * 1.6;
   font-weight: 400;
-  line-height: 2.4rem;
+  line-height: $unit * 2.4;
   letter-spacing: .04em;
 
   @if $color-contrast {
@@ -89,9 +89,9 @@
 
 @mixin typo-subhead-2($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.6rem;
+  font-size: $unit * 1.6;
   font-weight: 400;
-  line-height: 2.8rem;
+  line-height: $unit * 2.8;
   letter-spacing: .04em;
 
   @if $color-contrast {
@@ -101,8 +101,8 @@
 
 @mixin typo-body-2($color-contrast: false, $use-preferred: false) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.4rem;
-  line-height: 2.4rem;
+  font-size: $unit * 1.4;
+  line-height: $unit * 2.4;
   letter-spacing: 0;
 
   @if $use-preferred {
@@ -118,9 +118,9 @@
 
 @mixin typo-body-1($color-contrast: false, $use-preferred: false) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.4rem;
+  font-size: $unit * 1.4;
   font-weight: 400;
-  line-height: 2.4rem;
+  line-height: $unit * 2.4;
   letter-spacing: 0;
 
   @if $color-contrast {
@@ -130,7 +130,7 @@
 
 @mixin typo-caption($color-contrast: false, $use-preferred: false) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.2rem;
+  font-size: $unit * 1.2;
   font-weight: 400;
   line-height: 1;
   letter-spacing: 0;
@@ -143,7 +143,7 @@
 @mixin typo-blockquote($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
   position: relative;
-  font-size: 2.4rem;
+  font-size: $unit * 2.4;
   font-style: italic;
   font-weight: 300;
   line-height: 1.35;
@@ -167,7 +167,7 @@
 
 @mixin typo-menu($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.4rem;
+  font-size: $unit * 1.4;
   font-weight: 500;
   line-height: 1;
   letter-spacing: 0;
@@ -179,7 +179,7 @@
 
 @mixin typo-button($color-contrast: false, $use-preferred: true) {
   @include typo-preferred-font($use-preferred);
-  font-size: 1.4rem;
+  font-size: $unit * 1.4;
   font-weight: 500;
   line-height: 1;
   text-transform: uppercase;

diff --git a/lib/autocomplete/Autocomplete.js b/lib/autocomplete/Autocomplete.js
@@ -203,40 +203,40 @@ var factory = function factory(Chip, Input) {
             }
           }
         } else if (query && !this.state.showAllSuggestions) {
-            var _iteratorNormalCompletion2 = true;
-            var _didIteratorError2 = false;
-            var _iteratorError2 = undefined;
+          var _iteratorNormalCompletion2 = true;
+          var _didIteratorError2 = false;
+          var _iteratorError2 = undefined;
 
-            try {
-              for (var _iterator2 = source[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-                var _step2$value = _slicedToArray(_step2.value, 2);
+          try {
+            for (var _iterator2 = source[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
+              var _step2$value = _slicedToArray(_step2.value, 2);
 
-                var key = _step2$value[0];
-                var value = _step2$value[1];
+              var key = _step2$value[0];
+              var value = _step2$value[1];
 
-                if (this.matches(value.toLowerCase().trim(), query)) {
-                  suggest.set(key, value);
-                }
+              if (this.matches(value.toLowerCase().trim(), query)) {
+                suggest.set(key, value);
               }
+            }
 
-              // When multiple is false, suggest all values when showAllSuggestions is true
-            } catch (err) {
-              _didIteratorError2 = true;
-              _iteratorError2 = err;
+            // When multiple is false, suggest all values when showAllSuggestions is true
+          } catch (err) {
+            _didIteratorError2 = true;
+            _iteratorError2 = err;
+          } finally {
+            try {
+              if (!_iteratorNormalCompletion2 && _iterator2.return) {
+                _iterator2.return();
+              }
             } finally {
-              try {
-                if (!_iteratorNormalCompletion2 && _iterator2.return) {
-                  _iterator2.return();
-                }
-              } finally {
-                if (_didIteratorError2) {
-                  throw _iteratorError2;
-                }
+              if (_didIteratorError2) {
+                throw _iteratorError2;
               }
             }
-          } else {
-              suggest = source;
-            }
+          }
+        } else {
+          suggest = source;
+        }
 
         return suggest;
       }
@@ -395,11 +395,9 @@ var factory = function factory(Chip, Input) {
         var label = _props.label;
         var source = _props.source;
         var suggestionMatch = _props.suggestionMatch;
-        var //eslint-disable-line no-unused-vars
-        selectedPosition = _props.selectedPosition;
+        var selectedPosition = _props.selectedPosition;
         var showSuggestionsWhenValueIsSet = _props.showSuggestionsWhenValueIsSet;
-        var //eslint-disable-line no-unused-vars
-        theme = _props.theme;
+        var theme = _props.theme;
 
         var other = _objectWithoutProperties(_props, ['error', 'label', 'source', 'suggestionMatch', 'selectedPosition', 'showSuggestionsWhenValueIsSet', 'theme']);
 

diff --git a/lib/button/theme.scss b/lib/button/theme.scss
@@ -17,6 +17,7 @@
   align-content: center;
   align-items: center;
   justify-content: center;
+  line-height: $button-height;
   text-align: center;
   text-decoration: none;
   white-space: nowrap;

diff --git a/lib/layout/Layout.js b/lib/layout/Layout.js
@@ -51,7 +51,7 @@ Layout.propTypes = {
     }
 
     var names = _react2.default.Children.map(children, getChildName).join('|');
-    if (! ~ALLOWED_THEMED.indexOf(names)) {
+    if (!~ALLOWED_THEMED.indexOf(names)) {
       return new Error('`' + componentName + '` ' + 'should have a Panel for a child, optionally preceded by a NavDrawer and/or followed by a Sidebar.');
     }
   },

diff --git a/lib/menu/Menu.js b/lib/menu/Menu.js
@@ -101,37 +101,43 @@ var factory = function factory(MenuItem) {
     }, {
       key: 'componentWillReceiveProps',
       value: function componentWillReceiveProps(nextProps) {
+        var _this3 = this;
+
         if (this.props.position !== nextProps.position) {
           var position = nextProps.position === POSITION.AUTO ? this.calculatePosition() : nextProps.position;
           this.setState({ position: position });
         }
 
+        /**
+         * If the menu is going to be activated via props and its not active, verify
+         * the position is appropriated and then show it recalculating position if its
+         * wrong. It should be shown in two consecutive setState.
+         */
         if (!this.props.active && nextProps.active && !this.state.active) {
-          this.show();
+          if (nextProps.position === POSITION.AUTO) {
+            var _position = this.calculatePosition();
+            if (this.state.position !== _position) {
+              this.setState({ position: _position, active: false }, function () {
+                _this3.activateTimeoutHandle = setTimeout(function () {
+                  _this3.show();
+                }, 20);
+              });
+            } else {
+              this.show();
+            }
+          } else {
+            this.show();
+          }
         }
 
+        /**
+         * If the menu is being deactivated via props and the current state is
+         * active, it should be hid.
+         */
         if (this.props.active && !nextProps.active && this.state.active) {
           this.hide();
         }
       }
-    }, {
-      key: 'shouldComponentUpdate',
-      value: function shouldComponentUpdate(nextProps, nextState) {
-        var _this3 = this;
-
-        if (!this.state.active && nextState.active && this.props.position === POSITION.AUTO) {
-          var position = this.calculatePosition();
-          if (this.state.position !== position) {
-            this.setState({ position: position, active: false }, function () {
-              _this3.activateTimeoutHandle = setTimeout(function () {
-                _this3.setState({ active: true });
-              }, 20);
-            });
-            return false;
-          }
-        }
-        return true;
-      }
     }, {
       key: 'componentWillUpdate',
       value: function componentWillUpdate(nextProps, nextState) {
@@ -152,9 +158,7 @@ var factory = function factory(MenuItem) {
     }, {
       key: 'componentWillUnmount',
       value: function componentWillUnmount() {
-        if (this.state.active) {
-          _utils.events.removeEventsFromDocument({ click: this.handleDocumentClick });
-        }
+        if (this.state.active) _utils.events.removeEventsFromDocument({ click: this.handleDocumentClick });
         clearTimeout(this.positionTimeoutHandle);
         clearTimeout(this.activateTimeoutHandle);
       }

diff --git a/lib/ripple/Ripple.js b/lib/ripple/Ripple.js
@@ -166,8 +166,7 @@ var rippleFactory = function rippleFactory() {
             var _props2 = this.props;
             var children = _props2.children;
             var ripple = _props2.ripple;
-            var //eslint-disable-line no-unused-vars
-            onRippleEnded = _props2.onRippleEnded;
+            var onRippleEnded = _props2.onRippleEnded;
             var className = _props2.rippleClassName;
             var centered = _props2.rippleCentered;
             var spread = _props2.rippleSpread;

diff --git a/lib/tooltip/Tooltip.js b/lib/tooltip/Tooltip.js
@@ -79,9 +79,8 @@ var factory = function factory() {
           var tooltip = _props.tooltip;
           var tooltipDelay = _props.tooltipDelay;
           var tooltipHideOnClick = _props.tooltipHideOnClick;
-          var theme = _props.theme;
 
-          var other = _objectWithoutProperties(_props, ['children', 'className', 'tooltip', 'tooltipDelay', 'tooltipHideOnClick', 'theme']); //eslint-disable-line no-unused-vars
+          var other = _objectWithoutProperties(_props, ['children', 'className', 'tooltip', 'tooltipDelay', 'tooltipHideOnClick']); //eslint-disable-line no-unused-vars
 
 
           var composedClassName = (0, _classnames3.default)(this.props.theme.tooltipWrapper, className);