Completely updated React, fixed #11, (hopefully)

This commit is contained in:
2018-03-04 19:11:49 -05:00
parent 6e0afd6e2a
commit 34e5f5139a
13674 changed files with 333464 additions and 473223 deletions

View File

@@ -37,8 +37,6 @@ var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
exports.default = createSwitch;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
@@ -51,6 +49,14 @@ var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _CheckBoxOutlineBlank = require('../internal/svg-icons/CheckBoxOutlineBlank');
var _CheckBoxOutlineBlank2 = _interopRequireDefault(_CheckBoxOutlineBlank);
var _CheckBox = require('../internal/svg-icons/CheckBox');
var _CheckBox2 = _interopRequireDefault(_CheckBox);
var _withStyles = require('../styles/withStyles');
var _withStyles2 = _interopRequireDefault(_withStyles);
@@ -59,24 +65,8 @@ var _IconButton = require('../IconButton');
var _IconButton2 = _interopRequireDefault(_IconButton);
var _CheckBoxOutlineBlank = require('../svg-icons/CheckBoxOutlineBlank');
var _CheckBoxOutlineBlank2 = _interopRequireDefault(_CheckBoxOutlineBlank);
var _CheckBox = require('../svg-icons/CheckBox');
var _CheckBox2 = _interopRequireDefault(_CheckBox);
var _Icon = require('../Icon');
var _Icon2 = _interopRequireDefault(_Icon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_Element = require('react').babelPluginFlowReactPropTypes_proptype_Element || require('prop-types').any;
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
var styles = exports.styles = {
root: {
display: 'inline-flex',
@@ -99,261 +89,209 @@ var styles = exports.styles = {
disabled: {}
};
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* @ignore - internal component.
*/
var SwitchBase = function (_React$Component) {
(0, _inherits3.default)(SwitchBase, _React$Component);
function SwitchBase() {
var _ref;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, SwitchBase);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = SwitchBase.__proto__ || (0, _getPrototypeOf2.default)(SwitchBase)).call.apply(_ref, [this].concat(args))), _this), _this.state = {}, _this.input = null, _this.isControlled = null, _this.handleInputChange = function (event) {
var checked = event.target.checked;
if (!_this.isControlled) {
_this.setState({ checked: checked });
}
if (_this.props.onChange) {
_this.props.onChange(event, checked);
}
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(SwitchBase, [{
key: 'componentWillMount',
value: function componentWillMount() {
var props = this.props;
this.isControlled = props.checked != null;
if (!this.isControlled) {
// not controlled, use internal state
this.setState({
checked: props.defaultChecked !== undefined ? props.defaultChecked : false
});
}
}
}, {
key: 'render',
value: function render() {
var _classNames;
var _props = this.props,
checkedProp = _props.checked,
checkedIcon = _props.checkedIcon,
classes = _props.classes,
classNameProp = _props.className,
disabledProp = _props.disabled,
iconProp = _props.icon,
id = _props.id,
inputProps = _props.inputProps,
inputRef = _props.inputRef,
name = _props.name,
onChange = _props.onChange,
tabIndex = _props.tabIndex,
type = _props.type,
value = _props.value,
other = (0, _objectWithoutProperties3.default)(_props, ['checked', 'checkedIcon', 'classes', 'className', 'disabled', 'icon', 'id', 'inputProps', 'inputRef', 'name', 'onChange', 'tabIndex', 'type', 'value']);
var muiFormControl = this.context.muiFormControl;
var disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
var checked = this.isControlled ? checkedProp : this.state.checked;
var className = (0, _classnames2.default)(classes.root, classes.default, classNameProp, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.checked, checked), (0, _defineProperty3.default)(_classNames, classes.disabled, disabled), _classNames));
var icon = checked ? checkedIcon : iconProp;
var hasLabelFor = type === 'checkbox' || type === 'radio';
return _react2.default.createElement(
_IconButton2.default,
(0, _extends3.default)({
component: 'span',
className: className,
disabled: disabled,
tabIndex: null,
role: undefined
}, other),
icon,
_react2.default.createElement('input', (0, _extends3.default)({
id: hasLabelFor && id,
type: type,
name: name,
checked: checked,
onChange: this.handleInputChange,
className: classes.input,
disabled: disabled,
tabIndex: tabIndex,
value: value,
ref: inputRef
}, inputProps))
);
}
}]);
return SwitchBase;
}(_react2.default.Component);
// NB: If changed, please update Checkbox, Switch and Radio
// so that the API documentation is updated.
SwitchBase.propTypes = process.env.NODE_ENV !== "production" ? {
/**
* If `true`, the component is checked.
*/
checked: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').string]),
/**
* The CSS class name of the root element when checked.
*/
checkedClassName: require('prop-types').string,
checked: _propTypes2.default.oneOfType([_propTypes2.default.bool, _propTypes2.default.string]),
/**
* The icon to display when the component is checked.
* If a string is provided, it will be used as a font ligature.
*/
checkedIcon: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
checkedIcon: _propTypes2.default.node,
/**
* Useful to extend the style applied to components.
*/
classes: require('prop-types').object,
classes: _propTypes2.default.object.isRequired,
/**
* @ignore
*/
className: require('prop-types').string,
className: _propTypes2.default.string,
/**
* @ignore
*/
defaultChecked: require('prop-types').bool,
defaultChecked: _propTypes2.default.bool,
/**
* If `true`, the switch will be disabled.
*/
disabled: require('prop-types').bool,
/**
* The CSS class name of the root element when disabled.
*/
disabledClassName: require('prop-types').string,
disabled: _propTypes2.default.bool,
/**
* If `true`, the ripple effect will be disabled.
*/
disableRipple: require('prop-types').bool,
disableRipple: _propTypes2.default.bool,
/**
* The icon to display when the component is unchecked.
* If a string is provided, it will be used as a font ligature.
*/
icon: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
icon: _propTypes2.default.node,
/**
* The id of the `input` element.
*/
id: _propTypes2.default.string,
/**
* If `true`, the component appears indeterminate.
*/
indeterminate: require('prop-types').bool,
indeterminate: _propTypes2.default.bool,
/**
* The icon to display when the component is indeterminate.
* If a string is provided, it will be used as a font ligature.
*/
indeterminateIcon: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
indeterminateIcon: _propTypes2.default.node,
/**
* Properties applied to the `input` element.
*/
inputProps: require('prop-types').object,
inputProps: _propTypes2.default.object,
/**
* Use that property to pass a ref callback to the native input component.
*/
inputRef: require('prop-types').func,
inputRef: _propTypes2.default.func,
/*
* @ignore
*/
name: require('prop-types').string,
name: _propTypes2.default.string,
/**
* Callback fired when the state is changed.
*
* @param {object} event The event source of the callback
* @param {boolean} checked The `checked` value of the switch
*/
onChange: require('prop-types').func,
onChange: _propTypes2.default.func,
/**
* @ignore
*/
tabIndex: require('prop-types').oneOfType([require('prop-types').number, require('prop-types').string]),
tabIndex: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string]),
/**
* The input component property `type`.
*/
type: _propTypes2.default.string,
/**
* The value of the component.
*/
value: require('prop-types').string
value: _propTypes2.default.string
} : {};
SwitchBase.defaultProps = {
checkedIcon: _react2.default.createElement(_CheckBox2.default, null),
disableRipple: false,
icon: _react2.default.createElement(_CheckBoxOutlineBlank2.default, null),
type: 'checkbox'
};
// NB: If changed, please update Checkbox, Switch and Radio
// so that the API documentation is updated.
var babelPluginFlowReactPropTypes_proptype_Options = {
defaultIcon: typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element.isRequired ? babelPluginFlowReactPropTypes_proptype_Element.isRequired : babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element).isRequired,
defaultCheckedIcon: typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element.isRequired ? babelPluginFlowReactPropTypes_proptype_Element.isRequired : babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element).isRequired,
inputType: require('prop-types').string
SwitchBase.contextTypes = {
muiFormControl: _propTypes2.default.object
};
var _ref2 = _react2.default.createElement(_CheckBoxOutlineBlank2.default, null);
var _ref3 = _react2.default.createElement(_CheckBox2.default, null);
function createSwitch() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
_ref$defaultIcon = _ref.defaultIcon,
defaultIcon = _ref$defaultIcon === undefined ? _ref2 : _ref$defaultIcon,
_ref$defaultCheckedIc = _ref.defaultCheckedIcon,
defaultCheckedIcon = _ref$defaultCheckedIc === undefined ? _ref3 : _ref$defaultCheckedIc,
_ref$inputType = _ref.inputType,
inputType = _ref$inputType === undefined ? 'checkbox' : _ref$inputType;
/**
* @ignore - internal component.
*/
var SwitchBase = function (_React$Component) {
(0, _inherits3.default)(SwitchBase, _React$Component);
function SwitchBase() {
var _ref4;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, SwitchBase);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref4 = SwitchBase.__proto__ || (0, _getPrototypeOf2.default)(SwitchBase)).call.apply(_ref4, [this].concat(args))), _this), _this.state = {}, _this.input = null, _this.button = null, _this.isControlled = null, _this.handleInputChange = function (event) {
var checked = event.target.checked;
if (!_this.isControlled) {
_this.setState({ checked: checked });
}
if (_this.props.onChange) {
_this.props.onChange(event, checked);
}
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(SwitchBase, [{
key: 'componentWillMount',
value: function componentWillMount() {
var props = this.props;
this.isControlled = props.checked !== undefined;
if (!this.isControlled) {
// not controlled, use internal state
this.setState({
checked: props.defaultChecked !== undefined ? props.defaultChecked : false
});
}
}
}, {
key: 'render',
value: function render() {
var _classNames,
_this2 = this;
var _props = this.props,
checkedProp = _props.checked,
classes = _props.classes,
classNameProp = _props.className,
checkedClassName = _props.checkedClassName,
checkedIcon = _props.checkedIcon,
disabledProp = _props.disabled,
disabledClassName = _props.disabledClassName,
iconProp = _props.icon,
inputProps = _props.inputProps,
inputRef = _props.inputRef,
name = _props.name,
onChange = _props.onChange,
tabIndex = _props.tabIndex,
value = _props.value,
other = (0, _objectWithoutProperties3.default)(_props, ['checked', 'classes', 'className', 'checkedClassName', 'checkedIcon', 'disabled', 'disabledClassName', 'icon', 'inputProps', 'inputRef', 'name', 'onChange', 'tabIndex', 'value']);
var muiFormControl = this.context.muiFormControl;
var disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
var checked = this.isControlled ? checkedProp : this.state.checked;
var className = (0, _classnames2.default)(classes.root, classes.default, classNameProp, (_classNames = {}, (0, _defineProperty3.default)(_classNames, (0, _classnames2.default)(classes.checked, checkedClassName), checked), (0, _defineProperty3.default)(_classNames, (0, _classnames2.default)(classes.disabled, disabledClassName), disabled), _classNames));
var icon = checked ? checkedIcon : iconProp;
if (typeof icon === 'string') {
icon = _react2.default.createElement(
_Icon2.default,
null,
icon
);
}
return _react2.default.createElement(
_IconButton2.default,
(0, _extends3.default)({
component: 'span',
className: className,
disabled: disabled,
tabIndex: null,
role: undefined,
rootRef: function rootRef(node) {
_this2.button = node;
}
}, other),
icon,
_react2.default.createElement('input', (0, _extends3.default)({
type: inputType,
name: name,
checked: this.isControlled ? checkedProp : undefined,
onChange: this.handleInputChange,
className: classes.input,
disabled: disabled,
tabIndex: tabIndex,
value: value
}, inputProps, {
ref: function ref(node) {
_this2.input = node;
if (inputRef) {
inputRef(node);
}
}
}))
);
}
}]);
return SwitchBase;
}(_react2.default.Component);
SwitchBase.defaultProps = {
checkedIcon: defaultCheckedIcon,
disableRipple: false,
icon: defaultIcon
};
SwitchBase.contextTypes = {
muiFormControl: _propTypes2.default.object
};
return (0, _withStyles2.default)(styles, { name: 'MuiSwitchBase' })(SwitchBase);
}
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiSwitchBase' })(SwitchBase);