All files / elements/Progress/LinearProgress index.js

100% Statements 20/20
100% Branches 6/6
100% Functions 3/3
100% Lines 19/19

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99                              17x 17x   17x   17x         17x       4x 4x 1x   3x 1x   2x     17x           17x         1212x   17x                     1212x   1212x                                             17x         17x          
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { withHideable } from 'src/elements/utils';
import {
  determinateKeyframes,
  indeterminateKeyframes,
  getProgressProps,
  makeColorResolver,
  progressBaseDefaultProps,
  progressBasePropTypes,
  styledSystemAnimation,
} from '../utils';
import { LineComponent, TrackComponent } from './component';
 
const backgroundIndicatorColor = makeColorResolver('background', 'indicatorColor');
const backgroundTrackColor = makeColorResolver('background', 'trackColor');
 
const Track = styled(withHideable(TrackComponent))`${backgroundTrackColor}`;
 
Track.defaultProps = {
  height: 5,
  overflow: 'hidden',
};
 
const getAnimationName = props => {
  const {
    animationName,
    isDeterminate,
  } = props;
  if (animationName) {
    return animationName;
  }
  if (isDeterminate) {
    return determinateKeyframes();
  }
  return indeterminateKeyframes();
};
 
const Line = styled(LineComponent)`
  ${backgroundIndicatorColor}
  animation-name: ${getAnimationName};
  ${styledSystemAnimation}
`;
 
Line.defaultProps = {
  height: '100%',
  width: 1,
};
 
const getTrackColor = props => (props.hideTrack ? 'transparent' : props.trackColor);
 
export const LinearProgress = props => {
  const {
    containerProps,
    hideTrack,
    indicatorColor,
    indicatorProps,
    indicatorPropsToTrim,
    isHidden,
    trackColor,
    trackProps,
    trackPropsToTrim,
  } = props;
  // We need to have showProgress hard coded to false to avoid recursion.
  return (
    <Track
      isHidden={isHidden}
      trackColor={
        getTrackColor({ hideTrack, trackColor })
      }
      {...containerProps}
      {...trackProps}
      trackPropsToTrim={trackPropsToTrim}
      // eslint-disable-next-line react/jsx-sort-props
      showProgress={false}
    >
      <Line
        {...getProgressProps(props)}
        indicatorColor={indicatorColor}
        {...indicatorProps}
        indicatorPropsToTrim={indicatorPropsToTrim}
        showProgress={false}
      />
    </Track>
  );
};
 
LinearProgress.propTypes = {
  ...progressBasePropTypes,
  value: PropTypes.number,
};
 
LinearProgress.defaultProps = {
  ...progressBaseDefaultProps,
  total: 100,
  value: -1,
};