Completely updated React, fixed #11, (hopefully)

goTorrentWebUI/node_modules/material-ui/IconButton/IconButton.d.ts

@@ -2,26 +2,18 @@ import * as React from 'react';
 import { StandardProps, PropTypes } from '..';
 import { ButtonBaseProps, ButtonBaseClassKey } from '../ButtonBase';
 
-export interface IconButtonProps extends StandardProps<
-  ButtonBaseProps,
-  IconButtonClassKey
-> {
-  color?: PropTypes.Color | 'contrast';
+export interface IconButtonProps extends StandardProps<ButtonBaseProps, IconButtonClassKey> {
+  color?: PropTypes.Color;
   disabled?: boolean;
   disableRipple?: boolean;
-  rootRef?: React.Ref<any>;
 }
 
 export type IconButtonClassKey =
   | ButtonBaseClassKey
-  | 'colorAccent'
-  | 'colorContrast'
   | 'colorPrimary'
+  | 'colorSecondary'
   | 'colorInherit'
-  | 'label'
-  | 'icon'
-  | 'keyboardFocused'
-  ;
+  | 'label';
 
 declare const IconButton: React.ComponentType<IconButtonProps>;
 

goTorrentWebUI/node_modules/material-ui/IconButton/IconButton.js

@@ -17,13 +17,14 @@ var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProp
 
 var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
 
-var _ref; //  weak
-// @inheritedComponent ButtonBase
-
 var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _classnames = require('classnames');
 
 var _classnames2 = _interopRequireDefault(_classnames);
@@ -38,18 +39,15 @@ var _ButtonBase2 = _interopRequireDefault(_ButtonBase);
 
 var _helpers = require('../utils/helpers');
 
-var _Icon = require('../Icon');
-
-var _Icon2 = _interopRequireDefault(_Icon);
+var _reactHelpers = require('../utils/reactHelpers');
 
 require('../SvgIcon');
 
-var _reactHelpers = require('../utils/reactHelpers');
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any; // Ensure CSS specificity
+// Ensure CSS specificity
 
+// @inheritedComponent ButtonBase
 
 var styles = exports.styles = function styles(theme) {
   return {
@@ -66,18 +64,15 @@ var styles = exports.styles = function styles(theme) {
         duration: theme.transitions.duration.shortest
       })
     },
-    colorAccent: {
-      color: theme.palette.secondary.A200
-    },
-    colorContrast: {
-      color: theme.palette.getContrastText(theme.palette.primary[500])
-    },
-    colorPrimary: {
-      color: theme.palette.primary[500]
-    },
     colorInherit: {
       color: 'inherit'
     },
+    colorPrimary: {
+      color: theme.palette.primary.main
+    },
+    colorSecondary: {
+      color: theme.palette.secondary.main
+    },
     disabled: {
       color: theme.palette.action.disabled
     },
@@ -86,61 +81,10 @@ var styles = exports.styles = function styles(theme) {
       display: 'flex',
       alignItems: 'inherit',
       justifyContent: 'inherit'
-    },
-    icon: {
-      width: '1em',
-      height: '1em'
-    },
-    keyboardFocused: {
-      backgroundColor: theme.palette.text.divider
     }
   };
 };
 
-var babelPluginFlowReactPropTypes_proptype_Props = {
-  /**
-   * Use that property to pass a ref callback to the native button component.
-   */
-  buttonRef: require('prop-types').func,
-
-  /**
-   * The icon element.
-   * If a string is provided, it will be used as an icon font ligature.
-   */
-  children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
-
-  /**
-   * Useful to extend the style applied to components.
-   */
-  classes: require('prop-types').object,
-
-  /**
-   * @ignore
-   */
-  className: require('prop-types').string,
-
-  /**
-   * The color of the component. It's using the theme palette when that makes sense.
-   */
-  color: require('prop-types').oneOf(['default', 'inherit', 'primary', 'contrast', 'accent']),
-
-  /**
-   * If `true`, the button will be disabled.
-   */
-  disabled: require('prop-types').bool,
-
-  /**
-   * If `true`, the ripple will be disabled.
-   */
-  disableRipple: require('prop-types').bool,
-
-  /**
-   * Use that property to pass a ref callback to the root component.
-   */
-  rootRef: require('prop-types').func
-};
-
-
 /**
  * Refer to the [Icons](/style/icons) section of the documentation
  * regarding the available icon options.
@@ -148,52 +92,62 @@ var babelPluginFlowReactPropTypes_proptype_Props = {
 function IconButton(props) {
   var _classNames;
 
-  var buttonRef = props.buttonRef,
-      children = props.children,
+  var children = props.children,
       classes = props.classes,
       className = props.className,
       color = props.color,
       disabled = props.disabled,
-      rootRef = props.rootRef,
-      other = (0, _objectWithoutProperties3.default)(props, ['buttonRef', 'children', 'classes', 'className', 'color', 'disabled', 'rootRef']);
+      other = (0, _objectWithoutProperties3.default)(props, ['children', 'classes', 'className', 'color', 'disabled']);
 
 
   return _react2.default.createElement(
     _ButtonBase2.default,
     (0, _extends3.default)({
-      className: (0, _classnames2.default)(classes.root, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes['color' + (0, _helpers.capitalizeFirstLetter)(color)], color !== 'default'), (0, _defineProperty3.default)(_classNames, classes.disabled, disabled), _classNames), className),
+      className: (0, _classnames2.default)(classes.root, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes['color' + (0, _helpers.capitalize)(color)], color !== 'default'), (0, _defineProperty3.default)(_classNames, classes.disabled, disabled), _classNames), className),
       centerRipple: true,
-      keyboardFocusedClassName: classes.keyboardFocused,
+      focusRipple: true,
       disabled: disabled
-    }, other, {
-      rootRef: buttonRef,
-      ref: rootRef
-    }),
+    }, other),
     _react2.default.createElement(
       'span',
       { className: classes.label },
-      typeof children === 'string' ? _react2.default.createElement(
-        _Icon2.default,
-        { className: classes.icon },
-        children
-      ) : _react2.default.Children.map(children, function (child) {
+      _react2.default.Children.map(children, function (child) {
         if ((0, _reactHelpers.isMuiElement)(child, ['Icon', 'SvgIcon'])) {
-          return _react2.default.cloneElement(child, {
-            className: (0, _classnames2.default)(classes.icon, child.props.className)
-          });
+          return _react2.default.cloneElement(child, { fontSize: true });
         }
-
         return child;
       })
     )
   );
 }
 
-IconButton.propTypes = process.env.NODE_ENV !== "production" ? (_ref = {
-  classes: require('prop-types').object.isRequired,
-  buttonRef: require('prop-types').func,
-  children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node)
-}, (0, _defineProperty3.default)(_ref, 'classes', require('prop-types').object), (0, _defineProperty3.default)(_ref, 'className', require('prop-types').string), (0, _defineProperty3.default)(_ref, 'color', require('prop-types').oneOf(['default', 'inherit', 'primary', 'contrast', 'accent'])), (0, _defineProperty3.default)(_ref, 'disabled', require('prop-types').bool), (0, _defineProperty3.default)(_ref, 'disableRipple', require('prop-types').bool), (0, _defineProperty3.default)(_ref, 'rootRef', require('prop-types').func), _ref) : {};
+IconButton.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * The icon element.
+   */
+  children: _propTypes2.default.node,
+  /**
+   * Useful to extend the style applied to components.
+   */
+  classes: _propTypes2.default.object.isRequired,
+  /**
+   * @ignore
+   */
+  className: _propTypes2.default.string,
+  /**
+   * The color of the component. It supports those theme colors that make sense for this component.
+   */
+  color: _propTypes2.default.oneOf(['default', 'inherit', 'primary', 'secondary']),
+  /**
+   * If `true`, the button will be disabled.
+   */
+  disabled: _propTypes2.default.bool,
+  /**
+   * If `true`, the ripple will be disabled.
+   */
+  disableRipple: _propTypes2.default.bool
+} : {};
+
 IconButton.defaultProps = {
   color: 'default',
   disabled: false,

goTorrentWebUI/node_modules/material-ui/IconButton/IconButton.js.flow

@@ -1,17 +1,15 @@
-// @flow weak
 // @inheritedComponent ButtonBase
 
 import React from 'react';
-import type { Node } from 'react';
+import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import withStyles from '../styles/withStyles';
 import ButtonBase from '../ButtonBase';
-import { capitalizeFirstLetter } from '../utils/helpers';
-import Icon from '../Icon';
-import '../SvgIcon'; // Ensure CSS specificity
+import { capitalize } from '../utils/helpers';
 import { isMuiElement } from '../utils/reactHelpers';
+import '../SvgIcon'; // Ensure CSS specificity
 
-export const styles = (theme: Object) => ({
+export const styles = theme => ({
   root: {
     textAlign: 'center',
     flex: '0 0 auto',
@@ -25,18 +23,15 @@ export const styles = (theme: Object) => ({
       duration: theme.transitions.duration.shortest,
     }),
   },
-  colorAccent: {
-    color: theme.palette.secondary.A200,
-  },
-  colorContrast: {
-    color: theme.palette.getContrastText(theme.palette.primary[500]),
-  },
-  colorPrimary: {
-    color: theme.palette.primary[500],
-  },
   colorInherit: {
     color: 'inherit',
   },
+  colorPrimary: {
+    color: theme.palette.primary.main,
+  },
+  colorSecondary: {
+    color: theme.palette.secondary.main,
+  },
   disabled: {
     color: theme.palette.action.disabled,
   },
@@ -46,98 +41,69 @@ export const styles = (theme: Object) => ({
     alignItems: 'inherit',
     justifyContent: 'inherit',
   },
-  icon: {
-    width: '1em',
-    height: '1em',
-  },
-  keyboardFocused: {
-    backgroundColor: theme.palette.text.divider,
-  },
 });
 
-type ProvidedProps = {
-  classes: Object,
-};
-
-export type Props = {
-  /**
-   * Use that property to pass a ref callback to the native button component.
-   */
-  buttonRef?: Function,
-  /**
-   * The icon element.
-   * If a string is provided, it will be used as an icon font ligature.
-   */
-  children?: Node,
-  /**
-   * Useful to extend the style applied to components.
-   */
-  classes?: Object,
-  /**
-   * @ignore
-   */
-  className?: string,
-  /**
-   * The color of the component. It's using the theme palette when that makes sense.
-   */
-  color?: 'default' | 'inherit' | 'primary' | 'contrast' | 'accent',
-  /**
-   * If `true`, the button will be disabled.
-   */
-  disabled?: boolean,
-  /**
-   * If `true`, the ripple will be disabled.
-   */
-  disableRipple?: boolean,
-  /**
-   * Use that property to pass a ref callback to the root component.
-   */
-  rootRef?: Function,
-};
-
 /**
  * Refer to the [Icons](/style/icons) section of the documentation
  * regarding the available icon options.
  */
-function IconButton(props: ProvidedProps & Props) {
-  const { buttonRef, children, classes, className, color, disabled, rootRef, ...other } = props;
+function IconButton(props) {
+  const { children, classes, className, color, disabled, ...other } = props;
 
   return (
     <ButtonBase
       className={classNames(
         classes.root,
         {
-          [classes[`color${capitalizeFirstLetter(color)}`]]: color !== 'default',
+          [classes[`color${capitalize(color)}`]]: color !== 'default',
           [classes.disabled]: disabled,
         },
         className,
       )}
       centerRipple
-      keyboardFocusedClassName={classes.keyboardFocused}
+      focusRipple
       disabled={disabled}
       {...other}
-      rootRef={buttonRef}
-      ref={rootRef}
     >
       <span className={classes.label}>
-        {typeof children === 'string' ? (
-          <Icon className={classes.icon}>{children}</Icon>
-        ) : (
-          React.Children.map(children, child => {
-            if (isMuiElement(child, ['Icon', 'SvgIcon'])) {
-              return React.cloneElement(child, {
-                className: classNames(classes.icon, child.props.className),
-              });
-            }
-
-            return child;
-          })
-        )}
+        {React.Children.map(children, child => {
+          if (isMuiElement(child, ['Icon', 'SvgIcon'])) {
+            return React.cloneElement(child, { fontSize: true });
+          }
+          return child;
+        })}
       </span>
     </ButtonBase>
   );
 }
 
+IconButton.propTypes = {
+  /**
+   * The icon element.
+   */
+  children: PropTypes.node,
+  /**
+   * Useful to extend the style applied to components.
+   */
+  classes: PropTypes.object.isRequired,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component. It supports those theme colors that make sense for this component.
+   */
+  color: PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary']),
+  /**
+   * If `true`, the button will be disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the ripple will be disabled.
+   */
+  disableRipple: PropTypes.bool,
+};
+
 IconButton.defaultProps = {
   color: 'default',
   disabled: false,

goTorrentWebUI/node_modules/material-ui/IconButton/index.js.flow

@@ -1,3 +1 @@
-// @flow
-
 export { default } from './IconButton';