Completely updated React, fixed #11, (hopefully)
This commit is contained in:
238
goTorrentWebUI/node_modules/material-ui/Tabs/Tabs.js
generated
vendored
238
goTorrentWebUI/node_modules/material-ui/Tabs/Tabs.js
generated
vendored
@@ -45,6 +45,10 @@ var _react = require('react');
|
||||
|
||||
var _react2 = _interopRequireDefault(_react);
|
||||
|
||||
var _propTypes = require('prop-types');
|
||||
|
||||
var _propTypes2 = _interopRequireDefault(_propTypes);
|
||||
|
||||
var _warning = require('warning');
|
||||
|
||||
var _warning2 = _interopRequireDefault(_warning);
|
||||
@@ -85,12 +89,6 @@ var _TabScrollButton2 = _interopRequireDefault(_TabScrollButton);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_ComponentType = require('prop-types').func;
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_IndicatorStyle = require('./TabIndicator').babelPluginFlowReactPropTypes_proptype_IndicatorStyle || require('prop-types').any;
|
||||
|
||||
var styles = exports.styles = function styles(theme) {
|
||||
return {
|
||||
root: {
|
||||
@@ -117,109 +115,12 @@ var styles = exports.styles = function styles(theme) {
|
||||
centered: {
|
||||
justifyContent: 'center'
|
||||
},
|
||||
buttonAuto: (0, _defineProperty3.default)({}, theme.breakpoints.down('sm'), {
|
||||
buttonAuto: (0, _defineProperty3.default)({}, theme.breakpoints.down('xs'), {
|
||||
display: 'none'
|
||||
})
|
||||
};
|
||||
};
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Props = {
|
||||
/**
|
||||
* The CSS class name of the scroll button elements.
|
||||
*/
|
||||
buttonClassName: require('prop-types').string,
|
||||
|
||||
/**
|
||||
* If `true`, the tabs will be centered.
|
||||
* This property is intended for large views.
|
||||
*/
|
||||
centered: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* The content of the component.
|
||||
*/
|
||||
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,
|
||||
|
||||
/**
|
||||
* If `true`, the tabs will grow to use all the available space.
|
||||
* This property is intended for small views, like on mobile.
|
||||
*/
|
||||
fullWidth: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* The CSS class name of the indicator element.
|
||||
*/
|
||||
indicatorClassName: require('prop-types').string,
|
||||
|
||||
/**
|
||||
* Determines the color of the indicator.
|
||||
*/
|
||||
indicatorColor: require('prop-types').oneOfType([require('prop-types').oneOf(['accent']), require('prop-types').oneOf(['primary']), require('prop-types').string]),
|
||||
|
||||
/**
|
||||
* Callback fired when the value changes.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
* @param {number} value We default to the index of the child
|
||||
*/
|
||||
onChange: require('prop-types').func.isRequired,
|
||||
|
||||
/**
|
||||
* True invokes scrolling properties and allow for horizontally scrolling
|
||||
* (or swiping) the tab bar.
|
||||
*/
|
||||
scrollable: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* Determine behavior of scroll buttons when tabs are set to scroll
|
||||
* `auto` will only present them on medium and larger viewports
|
||||
* `on` will always present them
|
||||
* `off` will never present them
|
||||
*/
|
||||
scrollButtons: require('prop-types').oneOf(['auto', 'on', 'off']),
|
||||
|
||||
/**
|
||||
* The component used to render the scroll buttons.
|
||||
*/
|
||||
TabScrollButton: typeof babelPluginFlowReactPropTypes_proptype_ComponentType === 'function' ? babelPluginFlowReactPropTypes_proptype_ComponentType : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_ComponentType),
|
||||
|
||||
/**
|
||||
* Determines the color of the `Tab`.
|
||||
*/
|
||||
textColor: require('prop-types').oneOf(['accent', 'primary', 'inherit']),
|
||||
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
theme: require('prop-types').object,
|
||||
|
||||
/**
|
||||
* The value of the currently selected `Tab`.
|
||||
* If you don't want any selected `Tab`, you can set this property to `false`.
|
||||
*/
|
||||
value: require('prop-types').any.isRequired
|
||||
};
|
||||
var babelPluginFlowReactPropTypes_proptype_TabsMeta = {
|
||||
clientWidth: require('prop-types').number.isRequired,
|
||||
scrollLeft: require('prop-types').number.isRequired,
|
||||
scrollLeftNormalized: require('prop-types').number.isRequired,
|
||||
scrollWidth: require('prop-types').number.isRequired,
|
||||
|
||||
// ClientRect
|
||||
left: require('prop-types').number.isRequired,
|
||||
right: require('prop-types').number.isRequired
|
||||
};
|
||||
|
||||
var Tabs = function (_React$Component) {
|
||||
(0, _inherits3.default)(Tabs, _React$Component);
|
||||
|
||||
@@ -235,10 +136,7 @@ var Tabs = function (_React$Component) {
|
||||
}
|
||||
|
||||
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = Tabs.__proto__ || (0, _getPrototypeOf2.default)(Tabs)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
|
||||
indicatorStyle: {
|
||||
left: 0,
|
||||
width: 0
|
||||
},
|
||||
indicatorStyle: {},
|
||||
scrollerStyle: {
|
||||
marginBottom: 0
|
||||
},
|
||||
@@ -263,14 +161,14 @@ var Tabs = function (_React$Component) {
|
||||
var showScrollButtons = scrollable && (scrollButtons === 'auto' || scrollButtons === 'on');
|
||||
|
||||
conditionalElements.scrollButtonLeft = showScrollButtons ? _react2.default.createElement(TabScrollButtonProp, {
|
||||
direction: theme.direction === 'rtl' ? 'right' : 'left',
|
||||
direction: theme && theme.direction === 'rtl' ? 'right' : 'left',
|
||||
onClick: _this.handleLeftScrollClick,
|
||||
visible: _this.state.showLeftScroll,
|
||||
className: (0, _classnames2.default)((0, _defineProperty3.default)({}, classes.buttonAuto, scrollButtons === 'auto'), buttonClassName)
|
||||
}) : null;
|
||||
|
||||
conditionalElements.scrollButtonRight = showScrollButtons ? _react2.default.createElement(TabScrollButtonProp, {
|
||||
direction: theme.direction === 'rtl' ? 'left' : 'right',
|
||||
direction: theme && theme.direction === 'rtl' ? 'left' : 'right',
|
||||
onClick: _this.handleRightScrollClick,
|
||||
visible: _this.state.showRightScroll,
|
||||
className: (0, _classnames2.default)((0, _defineProperty3.default)({}, classes.buttonAuto, scrollButtons === 'auto'), buttonClassName)
|
||||
@@ -294,11 +192,11 @@ var Tabs = function (_React$Component) {
|
||||
|
||||
var tabMeta = void 0;
|
||||
if (_this.tabs && value !== false) {
|
||||
var _children = _this.tabs.children[0].children;
|
||||
var children = _this.tabs.children[0].children;
|
||||
|
||||
if (_children.length > 0) {
|
||||
var tab = _children[_this.valueToIndex[value]];
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(Boolean(tab), 'Material-UI: the value provided `' + value + '` is invalid') : void 0;
|
||||
if (children.length > 0) {
|
||||
var tab = children[_this.valueToIndex[value]];
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(tab, 'Material-UI: the value provided `' + value + '` is invalid') : void 0;
|
||||
tabMeta = tab ? tab.getBoundingClientRect() : null;
|
||||
}
|
||||
}
|
||||
@@ -366,17 +264,17 @@ var Tabs = function (_React$Component) {
|
||||
|
||||
if (_this.tabs && scrollable && scrollButtons !== 'off') {
|
||||
var _this$tabs = _this.tabs,
|
||||
_scrollWidth = _this$tabs.scrollWidth,
|
||||
_clientWidth = _this$tabs.clientWidth;
|
||||
scrollWidth = _this$tabs.scrollWidth,
|
||||
clientWidth = _this$tabs.clientWidth;
|
||||
|
||||
var _scrollLeft = (0, _normalizeScrollLeft.getNormalizedScrollLeft)(_this.tabs, theme.direction);
|
||||
var scrollLeft = (0, _normalizeScrollLeft.getNormalizedScrollLeft)(_this.tabs, theme.direction);
|
||||
|
||||
var _showLeftScroll = theme.direction === 'rtl' ? _scrollWidth > _clientWidth + _scrollLeft : _scrollLeft > 0;
|
||||
var showLeftScroll = theme.direction === 'rtl' ? scrollWidth > clientWidth + scrollLeft : scrollLeft > 0;
|
||||
|
||||
var _showRightScroll = theme.direction === 'rtl' ? _scrollLeft > 0 : _scrollWidth > _clientWidth + _scrollLeft;
|
||||
var showRightScroll = theme.direction === 'rtl' ? scrollLeft > 0 : scrollWidth > clientWidth + scrollLeft;
|
||||
|
||||
if (_showLeftScroll !== _this.state.showLeftScroll || _showRightScroll !== _this.state.showRightScroll) {
|
||||
_this.setState({ showLeftScroll: _showLeftScroll, showRightScroll: _showRightScroll });
|
||||
if (showLeftScroll !== _this.state.showLeftScroll || showRightScroll !== _this.state.showRightScroll) {
|
||||
_this.setState({ showLeftScroll: showLeftScroll, showRightScroll: showRightScroll });
|
||||
}
|
||||
}
|
||||
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
|
||||
@@ -389,6 +287,12 @@ var Tabs = function (_React$Component) {
|
||||
this.setState({ mounted: true });
|
||||
this.updateIndicatorState(this.props);
|
||||
this.updateScrollButtonState();
|
||||
|
||||
if (this.props.action) {
|
||||
this.props.action({
|
||||
updateIndicator: this.handleResize
|
||||
});
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'componentDidUpdate',
|
||||
@@ -443,10 +347,11 @@ var Tabs = function (_React$Component) {
|
||||
_this2 = this;
|
||||
|
||||
var _props = this.props,
|
||||
action = _props.action,
|
||||
buttonClassName = _props.buttonClassName,
|
||||
centered = _props.centered,
|
||||
classes = _props.classes,
|
||||
childrenProp = _props.children,
|
||||
classes = _props.classes,
|
||||
classNameProp = _props.className,
|
||||
fullWidth = _props.fullWidth,
|
||||
indicatorClassName = _props.indicatorClassName,
|
||||
@@ -458,7 +363,7 @@ var Tabs = function (_React$Component) {
|
||||
textColor = _props.textColor,
|
||||
theme = _props.theme,
|
||||
value = _props.value,
|
||||
other = (0, _objectWithoutProperties3.default)(_props, ['buttonClassName', 'centered', 'classes', 'children', 'className', 'fullWidth', 'indicatorClassName', 'indicatorColor', 'onChange', 'scrollable', 'scrollButtons', 'TabScrollButton', 'textColor', 'theme', 'value']);
|
||||
other = (0, _objectWithoutProperties3.default)(_props, ['action', 'buttonClassName', 'centered', 'children', 'classes', 'className', 'fullWidth', 'indicatorClassName', 'indicatorColor', 'onChange', 'scrollable', 'scrollButtons', 'TabScrollButton', 'textColor', 'theme', 'value']);
|
||||
|
||||
|
||||
var className = (0, _classnames2.default)(classes.root, classNameProp);
|
||||
@@ -530,13 +435,96 @@ var Tabs = function (_React$Component) {
|
||||
return Tabs;
|
||||
}(_react2.default.Component);
|
||||
|
||||
Tabs.propTypes = process.env.NODE_ENV !== "production" ? {
|
||||
/**
|
||||
* Callback fired when the component mounts.
|
||||
* This is useful when you want to trigger an action programmatically.
|
||||
* It currently only supports `updateIndicator()` action.
|
||||
*
|
||||
* @param {object} actions This object contains all possible actions
|
||||
* that can be triggered programmatically.
|
||||
*/
|
||||
action: _propTypes2.default.func,
|
||||
/**
|
||||
* The CSS class name of the scroll button elements.
|
||||
*/
|
||||
buttonClassName: _propTypes2.default.string,
|
||||
/**
|
||||
* If `true`, the tabs will be centered.
|
||||
* This property is intended for large views.
|
||||
*/
|
||||
centered: _propTypes2.default.bool,
|
||||
/**
|
||||
* The content of the component.
|
||||
*/
|
||||
children: _propTypes2.default.node,
|
||||
/**
|
||||
* Useful to extend the style applied to components.
|
||||
*/
|
||||
classes: _propTypes2.default.object.isRequired,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
className: _propTypes2.default.string,
|
||||
/**
|
||||
* If `true`, the tabs will grow to use all the available space.
|
||||
* This property is intended for small views, like on mobile.
|
||||
*/
|
||||
fullWidth: _propTypes2.default.bool,
|
||||
/**
|
||||
* The CSS class name of the indicator element.
|
||||
*/
|
||||
indicatorClassName: _propTypes2.default.string,
|
||||
/**
|
||||
* Determines the color of the indicator.
|
||||
*/
|
||||
indicatorColor: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.oneOf(['secondary', 'primary'])]),
|
||||
/**
|
||||
* Callback fired when the value changes.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
* @param {number} value We default to the index of the child
|
||||
*/
|
||||
onChange: _propTypes2.default.func,
|
||||
/**
|
||||
* True invokes scrolling properties and allow for horizontally scrolling
|
||||
* (or swiping) the tab bar.
|
||||
*/
|
||||
scrollable: _propTypes2.default.bool,
|
||||
/**
|
||||
* Determine behavior of scroll buttons when tabs are set to scroll
|
||||
* `auto` will only present them on medium and larger viewports
|
||||
* `on` will always present them
|
||||
* `off` will never present them
|
||||
*/
|
||||
scrollButtons: _propTypes2.default.oneOf(['auto', 'on', 'off']),
|
||||
/**
|
||||
* The component used to render the scroll buttons.
|
||||
*/
|
||||
TabScrollButton: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),
|
||||
/**
|
||||
* Determines the color of the `Tab`.
|
||||
*/
|
||||
textColor: _propTypes2.default.oneOf(['secondary', 'primary', 'inherit']),
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
theme: _propTypes2.default.object.isRequired,
|
||||
/**
|
||||
* The value of the currently selected `Tab`.
|
||||
* If you don't want any selected `Tab`, you can set this property to `false`.
|
||||
*/
|
||||
value: _propTypes2.default.any
|
||||
} : {};
|
||||
|
||||
Tabs.defaultProps = {
|
||||
centered: false,
|
||||
fullWidth: false,
|
||||
indicatorColor: 'accent',
|
||||
indicatorColor: 'secondary',
|
||||
scrollable: false,
|
||||
scrollButtons: 'auto',
|
||||
TabScrollButton: _TabScrollButton2.default,
|
||||
textColor: 'inherit'
|
||||
};
|
||||
exports.default = (0, _withStyles2.default)(styles, { withTheme: true, name: 'MuiTabs' })(Tabs);
|
||||
|
||||
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiTabs', withTheme: true })(Tabs);
|
Reference in New Issue
Block a user