Completely updated React, fixed #11, (hopefully)
This commit is contained in:
123
goTorrentWebUI/node_modules/material-ui/es/Progress/LinearProgress.js
generated
vendored
123
goTorrentWebUI/node_modules/material-ui/es/Progress/LinearProgress.js
generated
vendored
@@ -1,11 +1,11 @@
|
||||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
||||
|
||||
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
|
||||
|
||||
import _extends from 'babel-runtime/helpers/extends';
|
||||
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import warning from 'warning';
|
||||
import withStyles from '../styles/withStyles';
|
||||
import { lighten } from '../styles/colorManipulator';
|
||||
|
||||
const TRANSITION_DURATION = 4; // 400ms
|
||||
|
||||
@@ -16,24 +16,24 @@ export const styles = theme => ({
|
||||
height: 5
|
||||
},
|
||||
primaryColor: {
|
||||
backgroundColor: theme.palette.primary[100]
|
||||
backgroundColor: lighten(theme.palette.primary.light, 0.6)
|
||||
},
|
||||
primaryColorBar: {
|
||||
backgroundColor: theme.palette.primary[500]
|
||||
backgroundColor: theme.palette.primary.main
|
||||
},
|
||||
primaryDashed: {
|
||||
background: `radial-gradient(${theme.palette.primary[100]} 0%, ${theme.palette.primary[100]} 16%, transparent 42%)`,
|
||||
background: `radial-gradient(${lighten(theme.palette.primary.light, 0.6)} 0%, ${lighten(theme.palette.primary.light, 0.6)} 16%, transparent 42%)`,
|
||||
backgroundSize: '10px 10px',
|
||||
backgroundPosition: '0px -23px'
|
||||
},
|
||||
accentColor: {
|
||||
backgroundColor: theme.palette.secondary.A100
|
||||
secondaryColor: {
|
||||
backgroundColor: lighten(theme.palette.secondary.light, 0.4)
|
||||
},
|
||||
accentColorBar: {
|
||||
backgroundColor: theme.palette.secondary.A400
|
||||
secondaryColorBar: {
|
||||
backgroundColor: theme.palette.secondary.main
|
||||
},
|
||||
accentDashed: {
|
||||
background: `radial-gradient(${theme.palette.secondary.A100} 0%, ${theme.palette.secondary.A100} 16%, transparent 42%)`,
|
||||
secondaryDashed: {
|
||||
background: `radial-gradient(${lighten(theme.palette.secondary.light, 0.4)} 0%, ${lighten(theme.palette.secondary.light, 0.6)} 16%, transparent 42%)`,
|
||||
backgroundSize: '10px 10px',
|
||||
backgroundPosition: '0px -23px'
|
||||
},
|
||||
@@ -81,14 +81,6 @@ export const styles = theme => ({
|
||||
zIndex: 1,
|
||||
transition: `transform .${TRANSITION_DURATION}s linear`
|
||||
},
|
||||
bufferBar2Primary: {
|
||||
transition: `transform .${TRANSITION_DURATION}s linear`,
|
||||
backgroundColor: theme.palette.primary[100]
|
||||
},
|
||||
bufferBar2Accent: {
|
||||
transition: `transform .${TRANSITION_DURATION}s linear`,
|
||||
backgroundColor: theme.palette.secondary.A100
|
||||
},
|
||||
// Legends:
|
||||
// || represents the viewport
|
||||
// - represents a light background
|
||||
@@ -141,67 +133,104 @@ export const styles = theme => ({
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* ## ARIA
|
||||
*
|
||||
* If the progress bar is describing the loading progress of a particular region of a page,
|
||||
* you should use `aria-describedby` to point to the progress bar, and set the `aria-busy`
|
||||
* attribute to `true` on that region until it has finished loading.
|
||||
*/
|
||||
function LinearProgress(props) {
|
||||
const { classes, className, color, mode, value, valueBuffer } = props,
|
||||
other = _objectWithoutProperties(props, ['classes', 'className', 'color', 'mode', 'value', 'valueBuffer']);
|
||||
const { classes, className, color, value, valueBuffer, variant } = props,
|
||||
other = _objectWithoutProperties(props, ['classes', 'className', 'color', 'value', 'valueBuffer', 'variant']);
|
||||
|
||||
const dashedClass = classNames(classes.dashed, {
|
||||
[classes.primaryDashed]: color === 'primary',
|
||||
[classes.accentDashed]: color === 'accent'
|
||||
[classes.secondaryDashed]: color === 'secondary'
|
||||
});
|
||||
|
||||
const rootClassName = classNames(classes.root, {
|
||||
[classes.primaryColor]: color === 'primary',
|
||||
[classes.accentColor]: color === 'accent',
|
||||
[classes.rootBuffer]: mode === 'buffer',
|
||||
[classes.rootQuery]: mode === 'query'
|
||||
[classes.secondaryColor]: color === 'secondary',
|
||||
[classes.rootBuffer]: variant === 'buffer',
|
||||
[classes.rootQuery]: variant === 'query'
|
||||
}, className);
|
||||
const primaryClassName = classNames(classes.bar, {
|
||||
[classes.primaryColorBar]: color === 'primary',
|
||||
[classes.accentColorBar]: color === 'accent',
|
||||
[classes.indeterminateBar1]: mode === 'indeterminate' || mode === 'query',
|
||||
[classes.determinateBar1]: mode === 'determinate',
|
||||
[classes.bufferBar1]: mode === 'buffer'
|
||||
[classes.secondaryColorBar]: color === 'secondary',
|
||||
[classes.indeterminateBar1]: variant === 'indeterminate' || variant === 'query',
|
||||
[classes.determinateBar1]: variant === 'determinate',
|
||||
[classes.bufferBar1]: variant === 'buffer'
|
||||
});
|
||||
const secondaryClassName = classNames(classes.bar, {
|
||||
[classes.bufferBar2]: mode === 'buffer',
|
||||
[classes.primaryColorBar]: color === 'primary' && mode !== 'buffer',
|
||||
[classes.primaryColor]: color === 'primary' && mode === 'buffer',
|
||||
[classes.accentColorBar]: color === 'accent' && mode !== 'buffer',
|
||||
[classes.accentColor]: color === 'accent' && mode === 'buffer',
|
||||
[classes.indeterminateBar2]: mode === 'indeterminate' || mode === 'query'
|
||||
[classes.bufferBar2]: variant === 'buffer',
|
||||
[classes.primaryColorBar]: color === 'primary' && variant !== 'buffer',
|
||||
[classes.primaryColor]: color === 'primary' && variant === 'buffer',
|
||||
[classes.secondaryColorBar]: color === 'secondary' && variant !== 'buffer',
|
||||
[classes.secondaryColor]: color === 'secondary' && variant === 'buffer',
|
||||
[classes.indeterminateBar2]: variant === 'indeterminate' || variant === 'query'
|
||||
});
|
||||
const inlineStyles = { primary: {}, secondary: {} };
|
||||
const rootProps = {};
|
||||
|
||||
if (mode === 'determinate') {
|
||||
if (variant === 'determinate' || variant === 'buffer') {
|
||||
if (value !== undefined) {
|
||||
inlineStyles.primary.transform = `scaleX(${value / 100})`;
|
||||
rootProps['aria-valuenow'] = Math.round(value);
|
||||
} else {
|
||||
warning(false, 'Material-UI: you need to provide a value property ' + 'when LinearProgress is in determinate mode.');
|
||||
process.env.NODE_ENV !== "production" ? warning(false, 'Material-UI: you need to provide a value property ' + 'when using the determinate or buffer variant of LinearProgress .') : void 0;
|
||||
}
|
||||
} else if (mode === 'buffer') {
|
||||
if (value !== undefined) {
|
||||
inlineStyles.primary.transform = `scaleX(${value / 100})`;
|
||||
}
|
||||
if (variant === 'buffer') {
|
||||
if (valueBuffer !== undefined) {
|
||||
inlineStyles.secondary.transform = `scaleX(${(valueBuffer || 0) / 100})`;
|
||||
} else {
|
||||
warning(false, 'Material-UI: you need to provide a value property when LinearProgress is in buffer mode.');
|
||||
process.env.NODE_ENV !== "production" ? warning(false, 'Material-UI: you need to provide a valueBuffer property ' + 'when using the buffer variant of LinearProgress.') : void 0;
|
||||
}
|
||||
}
|
||||
|
||||
return React.createElement(
|
||||
'div',
|
||||
_extends({ className: rootClassName }, rootProps, other),
|
||||
mode === 'buffer' ? React.createElement('div', { className: dashedClass }) : null,
|
||||
_extends({ className: rootClassName, role: 'progressbar' }, rootProps, other),
|
||||
variant === 'buffer' ? React.createElement('div', { className: dashedClass }) : null,
|
||||
React.createElement('div', { className: primaryClassName, style: inlineStyles.primary }),
|
||||
mode === 'determinate' ? null : React.createElement('div', { className: secondaryClassName, style: inlineStyles.secondary })
|
||||
variant === 'determinate' ? null : React.createElement('div', { className: secondaryClassName, style: inlineStyles.secondary })
|
||||
);
|
||||
}
|
||||
|
||||
LinearProgress.propTypes = process.env.NODE_ENV !== "production" ? {
|
||||
/**
|
||||
* 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(['primary', 'secondary']),
|
||||
/**
|
||||
* The value of the progress indicator for the determinate and buffer variants.
|
||||
* Value between 0 and 100.
|
||||
*/
|
||||
value: PropTypes.number,
|
||||
/**
|
||||
* The value for the buffer variant.
|
||||
* Value between 0 and 100.
|
||||
*/
|
||||
valueBuffer: PropTypes.number,
|
||||
/**
|
||||
* The variant of progress indicator. Use indeterminate or query
|
||||
* when there is no progress value.
|
||||
*/
|
||||
variant: PropTypes.oneOf(['determinate', 'indeterminate', 'buffer', 'query'])
|
||||
} : {};
|
||||
|
||||
LinearProgress.defaultProps = {
|
||||
color: 'primary',
|
||||
mode: 'indeterminate'
|
||||
variant: 'indeterminate'
|
||||
};
|
||||
|
||||
export default withStyles(styles, { name: 'MuiLinearProgress' })(LinearProgress);
|
||||
Reference in New Issue
Block a user