Completely updated React, fixed #11, (hopefully)
This commit is contained in:
291
goTorrentWebUI/node_modules/material-ui/Grid/Grid.js
generated
vendored
291
goTorrentWebUI/node_modules/material-ui/Grid/Grid.js
generated
vendored
@@ -17,22 +17,14 @@ var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
|
||||
|
||||
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
|
||||
|
||||
var _ref;
|
||||
// A grid component using the following libs as inspiration.
|
||||
//
|
||||
// For the implementation:
|
||||
// - http://v4-alpha.getbootstrap.com/layout/flexbox-grid/
|
||||
// - https://github.com/kristoferjoseph/flexboxgrid/blob/master/src/css/flexboxgrid.css
|
||||
// - https://github.com/roylee0704/react-flexbox-grid
|
||||
// - https://material.angularjs.org/latest/layout/introduction
|
||||
//
|
||||
// Follow this flexbox Guide to better understand the underlying model:
|
||||
// - https://css-tricks.com/snippets/css/a-guide-to-flexbox/
|
||||
|
||||
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);
|
||||
@@ -53,13 +45,17 @@ var _Hidden2 = _interopRequireDefault(_Hidden);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
|
||||
var GUTTERS = [0, 8, 16, 24, 40]; // A grid component using the following libs as inspiration.
|
||||
//
|
||||
// For the implementation:
|
||||
// - http://v4-alpha.getbootstrap.com/layout/flexbox-grid/
|
||||
// - https://github.com/kristoferjoseph/flexboxgrid/blob/master/src/css/flexboxgrid.css
|
||||
// - https://github.com/roylee0704/react-flexbox-grid
|
||||
// - https://material.angularjs.org/latest/layout/introduction
|
||||
//
|
||||
// Follow this flexbox Guide to better understand the underlying model:
|
||||
// - https://css-tricks.com/snippets/css/a-guide-to-flexbox/
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_ElementType = require('react').babelPluginFlowReactPropTypes_proptype_ElementType || require('prop-types').any;
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_HiddenProps = require('../Hidden/types').babelPluginFlowReactPropTypes_proptype_HiddenProps || require('prop-types').any;
|
||||
|
||||
var GUTTERS = [0, 8, 16, 24, 40];
|
||||
var GRID_SIZES = [true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
|
||||
|
||||
function generateGrid(globalStyles, theme, breakpoint) {
|
||||
@@ -77,11 +73,11 @@ function generateGrid(globalStyles, theme, breakpoint) {
|
||||
}
|
||||
|
||||
// Only keep 6 significant numbers.
|
||||
var width = Math.round(size / 12 * Math.pow(10, 6)) / Math.pow(10, 4) + '%';
|
||||
var width = Math.round(size / 12 * 10e6) / 10e4 + '%';
|
||||
|
||||
/* eslint-disable max-len */
|
||||
// Close to the bootstrap implementation:
|
||||
// https://github.com/twbs/bootstrap/blob/b0508a975d711d6b24c01f57dd5445c22699fac4/scss/mixins/_grid.scss#L69
|
||||
// https://github.com/twbs/bootstrap/blob/8fccaa2439e97ec72a4b7dc42ccc1f649790adb0/scss/mixins/_grid.scss#L41
|
||||
/* eslint-enable max-len */
|
||||
styles['grid-' + breakpoint + '-' + size] = {
|
||||
flexBasis: width,
|
||||
@@ -137,6 +133,9 @@ var styles = exports.styles = function styles(theme) {
|
||||
flex: '0 0 auto',
|
||||
margin: '0' // For instance, it's useful when used with a `figure` element.
|
||||
},
|
||||
zeroMinWidth: {
|
||||
minWidth: 0
|
||||
},
|
||||
'direction-xs-column': {
|
||||
flexDirection: 'column'
|
||||
},
|
||||
@@ -149,6 +148,9 @@ var styles = exports.styles = function styles(theme) {
|
||||
'wrap-xs-nowrap': {
|
||||
flexWrap: 'nowrap'
|
||||
},
|
||||
'wrap-xs-wrap-reverse': {
|
||||
flexWrap: 'wrap-reverse'
|
||||
},
|
||||
'align-items-xs-center': {
|
||||
alignItems: 'center'
|
||||
},
|
||||
@@ -195,183 +197,163 @@ var styles = exports.styles = function styles(theme) {
|
||||
}, {}));
|
||||
};
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_GridSizes = require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])]);
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Props = {
|
||||
/**
|
||||
* 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,
|
||||
|
||||
/**
|
||||
* The component used for the root node.
|
||||
* Either a string to use a DOM element or a component.
|
||||
*/
|
||||
component: typeof babelPluginFlowReactPropTypes_proptype_ElementType === 'function' ? babelPluginFlowReactPropTypes_proptype_ElementType : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_ElementType),
|
||||
|
||||
/**
|
||||
* If `true`, the component will have the flex *container* behavior.
|
||||
* You should be wrapping *items* with a *container*.
|
||||
*/
|
||||
container: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* If `true`, the component will have the flex *item* behavior.
|
||||
* You should be wrapping *items* with a *container*.
|
||||
*/
|
||||
item: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* Defines the `align-content` style property.
|
||||
* It's applied for all screen sizes.
|
||||
*/
|
||||
alignContent: require('prop-types').oneOf(['stretch', 'center', 'flex-start', 'flex-end', 'space-between', 'space-around']),
|
||||
|
||||
/**
|
||||
* Defines the `align-items` style property.
|
||||
* It's applied for all screen sizes.
|
||||
*/
|
||||
alignItems: require('prop-types').oneOf(['flex-start', 'center', 'flex-end', 'stretch', 'baseline']),
|
||||
|
||||
/**
|
||||
* Defines the `flex-direction` style property.
|
||||
* It is applied for all screen sizes.
|
||||
*/
|
||||
direction: require('prop-types').oneOf(['row', 'row-reverse', 'column', 'column-reverse']),
|
||||
|
||||
/**
|
||||
* Defines the space between the type `item` component.
|
||||
* It can only be used on a type `container` component.
|
||||
*/
|
||||
spacing: require('prop-types').oneOf([0, 8, 16, 24, 40]),
|
||||
|
||||
/**
|
||||
* If provided, will wrap with [Hidden](/api/hidden) component and given properties.
|
||||
*/
|
||||
hidden: typeof babelPluginFlowReactPropTypes_proptype_HiddenProps === 'function' ? babelPluginFlowReactPropTypes_proptype_HiddenProps : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_HiddenProps),
|
||||
|
||||
/**
|
||||
* Defines the `justify-content` style property.
|
||||
* It is applied for all screen sizes.
|
||||
*/
|
||||
justify: require('prop-types').oneOf(['flex-start', 'center', 'flex-end', 'space-between', 'space-around']),
|
||||
|
||||
/**
|
||||
* Defines the `flex-wrap` style property.
|
||||
* It's applied for all screen sizes.
|
||||
*/
|
||||
wrap: require('prop-types').oneOf(['nowrap', 'wrap', 'wrap-reverse']),
|
||||
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for all the screen sizes with the lowest priority.
|
||||
*/
|
||||
xs: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])]),
|
||||
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `sm` breakpoint and wider screens if not overridden.
|
||||
*/
|
||||
sm: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])]),
|
||||
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `md` breakpoint and wider screens if not overridden.
|
||||
*/
|
||||
md: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])]),
|
||||
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `lg` breakpoint and wider screens if not overridden.
|
||||
*/
|
||||
lg: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])]),
|
||||
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `xl` breakpoint and wider screens.
|
||||
*/
|
||||
xl: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])])
|
||||
};
|
||||
|
||||
|
||||
function Grid(props) {
|
||||
var _classNames;
|
||||
|
||||
var classes = props.classes,
|
||||
classNameProp = props.className,
|
||||
ComponentProp = props.component,
|
||||
container = props.container,
|
||||
item = props.item,
|
||||
alignContent = props.alignContent,
|
||||
var alignContent = props.alignContent,
|
||||
alignItems = props.alignItems,
|
||||
classes = props.classes,
|
||||
classNameProp = props.className,
|
||||
Component = props.component,
|
||||
container = props.container,
|
||||
direction = props.direction,
|
||||
spacing = props.spacing,
|
||||
hidden = props.hidden,
|
||||
item = props.item,
|
||||
justify = props.justify,
|
||||
wrap = props.wrap,
|
||||
xs = props.xs,
|
||||
sm = props.sm,
|
||||
md = props.md,
|
||||
lg = props.lg,
|
||||
md = props.md,
|
||||
zeroMinWidth = props.zeroMinWidth,
|
||||
sm = props.sm,
|
||||
spacing = props.spacing,
|
||||
wrap = props.wrap,
|
||||
xl = props.xl,
|
||||
other = (0, _objectWithoutProperties3.default)(props, ['classes', 'className', 'component', 'container', 'item', 'alignContent', 'alignItems', 'direction', 'spacing', 'hidden', 'justify', 'wrap', 'xs', 'sm', 'md', 'lg', 'xl']);
|
||||
xs = props.xs,
|
||||
other = (0, _objectWithoutProperties3.default)(props, ['alignContent', 'alignItems', 'classes', 'className', 'component', 'container', 'direction', 'hidden', 'item', 'justify', 'lg', 'md', 'zeroMinWidth', 'sm', 'spacing', 'wrap', 'xl', 'xs']);
|
||||
|
||||
|
||||
var className = (0, _classnames2.default)((_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.typeContainer, container), (0, _defineProperty3.default)(_classNames, classes.typeItem, item), (0, _defineProperty3.default)(_classNames, classes['spacing-xs-' + String(spacing)], container && spacing !== 0), (0, _defineProperty3.default)(_classNames, classes['direction-xs-' + String(direction)], direction !== Grid.defaultProps.direction), (0, _defineProperty3.default)(_classNames, classes['wrap-xs-' + String(wrap)], wrap !== Grid.defaultProps.wrap), (0, _defineProperty3.default)(_classNames, classes['align-items-xs-' + String(alignItems)], alignItems !== Grid.defaultProps.alignItems), (0, _defineProperty3.default)(_classNames, classes['align-content-xs-' + String(alignContent)], alignContent !== Grid.defaultProps.alignContent), (0, _defineProperty3.default)(_classNames, classes['justify-xs-' + String(justify)], justify !== Grid.defaultProps.justify), (0, _defineProperty3.default)(_classNames, classes['grid-xs'], xs === true), (0, _defineProperty3.default)(_classNames, classes['grid-xs-' + String(xs)], xs && xs !== true), (0, _defineProperty3.default)(_classNames, classes['grid-sm'], sm === true), (0, _defineProperty3.default)(_classNames, classes['grid-sm-' + String(sm)], sm && sm !== true), (0, _defineProperty3.default)(_classNames, classes['grid-md'], md === true), (0, _defineProperty3.default)(_classNames, classes['grid-md-' + String(md)], md && md !== true), (0, _defineProperty3.default)(_classNames, classes['grid-lg'], lg === true), (0, _defineProperty3.default)(_classNames, classes['grid-lg-' + String(lg)], lg && lg !== true), (0, _defineProperty3.default)(_classNames, classes['grid-xl'], xl === true), (0, _defineProperty3.default)(_classNames, classes['grid-xl-' + String(xl)], xl && xl !== true), _classNames), classNameProp);
|
||||
var className = (0, _classnames2.default)((_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.typeContainer, container), (0, _defineProperty3.default)(_classNames, classes.typeItem, item), (0, _defineProperty3.default)(_classNames, classes.zeroMinWidth, zeroMinWidth), (0, _defineProperty3.default)(_classNames, classes['spacing-xs-' + String(spacing)], container && spacing !== 0), (0, _defineProperty3.default)(_classNames, classes['direction-xs-' + String(direction)], direction !== Grid.defaultProps.direction), (0, _defineProperty3.default)(_classNames, classes['wrap-xs-' + String(wrap)], wrap !== Grid.defaultProps.wrap), (0, _defineProperty3.default)(_classNames, classes['align-items-xs-' + String(alignItems)], alignItems !== Grid.defaultProps.alignItems), (0, _defineProperty3.default)(_classNames, classes['align-content-xs-' + String(alignContent)], alignContent !== Grid.defaultProps.alignContent), (0, _defineProperty3.default)(_classNames, classes['justify-xs-' + String(justify)], justify !== Grid.defaultProps.justify), (0, _defineProperty3.default)(_classNames, classes['grid-xs'], xs === true), (0, _defineProperty3.default)(_classNames, classes['grid-xs-' + String(xs)], xs && xs !== true), (0, _defineProperty3.default)(_classNames, classes['grid-sm'], sm === true), (0, _defineProperty3.default)(_classNames, classes['grid-sm-' + String(sm)], sm && sm !== true), (0, _defineProperty3.default)(_classNames, classes['grid-md'], md === true), (0, _defineProperty3.default)(_classNames, classes['grid-md-' + String(md)], md && md !== true), (0, _defineProperty3.default)(_classNames, classes['grid-lg'], lg === true), (0, _defineProperty3.default)(_classNames, classes['grid-lg-' + String(lg)], lg && lg !== true), (0, _defineProperty3.default)(_classNames, classes['grid-xl'], xl === true), (0, _defineProperty3.default)(_classNames, classes['grid-xl-' + String(xl)], xl && xl !== true), _classNames), classNameProp);
|
||||
var gridProps = (0, _extends3.default)({ className: className }, other);
|
||||
|
||||
if (hidden) {
|
||||
return _react2.default.createElement(
|
||||
_Hidden2.default,
|
||||
hidden,
|
||||
_react2.default.createElement(ComponentProp, gridProps)
|
||||
_react2.default.createElement(Component, gridProps)
|
||||
);
|
||||
}
|
||||
|
||||
return _react2.default.createElement(ComponentProp, gridProps);
|
||||
return _react2.default.createElement(Component, gridProps);
|
||||
}
|
||||
|
||||
Grid.propTypes = process.env.NODE_ENV !== "production" ? (_ref = {
|
||||
classes: require('prop-types').object.isRequired,
|
||||
component: typeof babelPluginFlowReactPropTypes_proptype_ElementType === 'function' ? babelPluginFlowReactPropTypes_proptype_ElementType.isRequired ? babelPluginFlowReactPropTypes_proptype_ElementType.isRequired : babelPluginFlowReactPropTypes_proptype_ElementType : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_ElementType).isRequired,
|
||||
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, 'component', typeof babelPluginFlowReactPropTypes_proptype_ElementType === 'function' ? babelPluginFlowReactPropTypes_proptype_ElementType : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_ElementType)), (0, _defineProperty3.default)(_ref, 'container', require('prop-types').bool), (0, _defineProperty3.default)(_ref, 'item', require('prop-types').bool), (0, _defineProperty3.default)(_ref, 'alignContent', require('prop-types').oneOf(['stretch', 'center', 'flex-start', 'flex-end', 'space-between', 'space-around'])), (0, _defineProperty3.default)(_ref, 'alignItems', require('prop-types').oneOf(['flex-start', 'center', 'flex-end', 'stretch', 'baseline'])), (0, _defineProperty3.default)(_ref, 'direction', require('prop-types').oneOf(['row', 'row-reverse', 'column', 'column-reverse'])), (0, _defineProperty3.default)(_ref, 'spacing', require('prop-types').oneOf([0, 8, 16, 24, 40])), (0, _defineProperty3.default)(_ref, 'hidden', typeof babelPluginFlowReactPropTypes_proptype_HiddenProps === 'function' ? babelPluginFlowReactPropTypes_proptype_HiddenProps : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_HiddenProps)), (0, _defineProperty3.default)(_ref, 'justify', require('prop-types').oneOf(['flex-start', 'center', 'flex-end', 'space-between', 'space-around'])), (0, _defineProperty3.default)(_ref, 'wrap', require('prop-types').oneOf(['nowrap', 'wrap', 'wrap-reverse'])), (0, _defineProperty3.default)(_ref, 'xs', require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])])), (0, _defineProperty3.default)(_ref, 'sm', require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])])), (0, _defineProperty3.default)(_ref, 'md', require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])])), (0, _defineProperty3.default)(_ref, 'lg', require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])])), (0, _defineProperty3.default)(_ref, 'xl', require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').oneOf([1]), require('prop-types').oneOf([2]), require('prop-types').oneOf([3]), require('prop-types').oneOf([4]), require('prop-types').oneOf([5]), require('prop-types').oneOf([6]), require('prop-types').oneOf([7]), require('prop-types').oneOf([8]), require('prop-types').oneOf([9]), require('prop-types').oneOf([10]), require('prop-types').oneOf([11]), require('prop-types').oneOf([12])])), _ref) : {};
|
||||
Grid.propTypes = process.env.NODE_ENV !== "production" ? {
|
||||
/**
|
||||
* Defines the `align-content` style property.
|
||||
* It's applied for all screen sizes.
|
||||
*/
|
||||
alignContent: _propTypes2.default.oneOf(['stretch', 'center', 'flex-start', 'flex-end', 'space-between', 'space-around']),
|
||||
/**
|
||||
* Defines the `align-items` style property.
|
||||
* It's applied for all screen sizes.
|
||||
*/
|
||||
alignItems: _propTypes2.default.oneOf(['flex-start', 'center', 'flex-end', 'stretch', 'baseline']),
|
||||
/**
|
||||
* 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,
|
||||
/**
|
||||
* The component used for the root node.
|
||||
* Either a string to use a DOM element or a component.
|
||||
*/
|
||||
component: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),
|
||||
/**
|
||||
* If `true`, the component will have the flex *container* behavior.
|
||||
* You should be wrapping *items* with a *container*.
|
||||
*/
|
||||
container: _propTypes2.default.bool,
|
||||
/**
|
||||
* Defines the `flex-direction` style property.
|
||||
* It is applied for all screen sizes.
|
||||
*/
|
||||
direction: _propTypes2.default.oneOf(['row', 'row-reverse', 'column', 'column-reverse']),
|
||||
/**
|
||||
* If provided, will wrap with [Hidden](/api/hidden) component and given properties.
|
||||
*/
|
||||
hidden: _propTypes2.default.object,
|
||||
/**
|
||||
* If `true`, the component will have the flex *item* behavior.
|
||||
* You should be wrapping *items* with a *container*.
|
||||
*/
|
||||
item: _propTypes2.default.bool,
|
||||
/**
|
||||
* Defines the `justify-content` style property.
|
||||
* It is applied for all screen sizes.
|
||||
*/
|
||||
justify: _propTypes2.default.oneOf(['flex-start', 'center', 'flex-end', 'space-between', 'space-around']),
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `lg` breakpoint and wider screens if not overridden.
|
||||
*/
|
||||
lg: _propTypes2.default.oneOf([true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `md` breakpoint and wider screens if not overridden.
|
||||
*/
|
||||
md: _propTypes2.default.oneOf([true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `sm` breakpoint and wider screens if not overridden.
|
||||
*/
|
||||
sm: _propTypes2.default.oneOf([true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),
|
||||
/**
|
||||
* Defines the space between the type `item` component.
|
||||
* It can only be used on a type `container` component.
|
||||
*/
|
||||
spacing: _propTypes2.default.oneOf(GUTTERS),
|
||||
/**
|
||||
* Defines the `flex-wrap` style property.
|
||||
* It's applied for all screen sizes.
|
||||
*/
|
||||
wrap: _propTypes2.default.oneOf(['nowrap', 'wrap', 'wrap-reverse']),
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for the `xl` breakpoint and wider screens.
|
||||
*/
|
||||
xl: _propTypes2.default.oneOf([true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),
|
||||
/**
|
||||
* Defines the number of grids the component is going to use.
|
||||
* It's applied for all the screen sizes with the lowest priority.
|
||||
*/
|
||||
xs: _propTypes2.default.oneOf([true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),
|
||||
/**
|
||||
* If `true`, it sets `min-width: 0` on the item.
|
||||
* Refer to the limitations section of the documentation to better understand the use case.
|
||||
*/
|
||||
zeroMinWidth: _propTypes2.default.bool
|
||||
} : {};
|
||||
|
||||
Grid.defaultProps = {
|
||||
alignContent: 'stretch',
|
||||
alignItems: 'stretch',
|
||||
component: 'div',
|
||||
container: false,
|
||||
direction: 'row',
|
||||
hidden: undefined,
|
||||
item: false,
|
||||
justify: 'flex-start',
|
||||
zeroMinWidth: false,
|
||||
spacing: 16,
|
||||
wrap: 'wrap'
|
||||
};
|
||||
|
||||
// Add a wrapper component to generate some helper messages in the development
|
||||
// environment.
|
||||
/* eslint-disable react/no-multi-comp */
|
||||
// eslint-disable-next-line import/no-mutable-exports
|
||||
var GridWrapper = Grid;
|
||||
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
var requireProp = (0, _requirePropFactory2.default)('Grid');
|
||||
|
||||
GridWrapper = function GridWrapper(props) {
|
||||
return _react2.default.createElement(Grid, props);
|
||||
};
|
||||
|
||||
// $FlowFixMe - cannot mix legacy propTypes with current HOC pattern - https://github.com/facebook/flow/issues/4644#issuecomment-332530909
|
||||
var requireProp = (0, _requirePropFactory2.default)('Grid');
|
||||
GridWrapper.propTypes = {
|
||||
alignContent: requireProp('container'),
|
||||
alignItems: requireProp('container'),
|
||||
@@ -382,7 +364,8 @@ if (process.env.NODE_ENV !== 'production') {
|
||||
sm: requireProp('item'),
|
||||
spacing: requireProp('container'),
|
||||
wrap: requireProp('container'),
|
||||
xs: requireProp('item')
|
||||
xs: requireProp('item'),
|
||||
zeroMinWidth: requireProp('zeroMinWidth')
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user