text: "use strict";
  
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  
  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.default = exports.styles = void 0;
  
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
  
  var _react = _interopRequireDefault(require("react"));
  
  var _propTypes = _interopRequireDefault(require("prop-types"));
  
  var _classnames = _interopRequireDefault(require("classnames"));
  
  var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
  
  var _helpers = require("../utils/helpers");
  
  var _chainPropTypes = _interopRequireDefault(require("../utils/chainPropTypes"));
  
  var SIZE = 44;
  
  function getRelativeValue(value, min, max) {
    var clampedValue = Math.min(Math.max(min, value), max);
    return (clampedValue - min) / (max - min);
  }
  
  function easeOut(t) {
    t = getRelativeValue(t, 0, 1); // https://gist.github.com/gre/1650294
  
    t = (t -= 1) * t * t + 1;
    return t;
  }
  
  function easeIn(t) {
    return t * t;
  }
  
  var styles = function styles(theme) {
    return {
      /* Styles applied to the root element. */
      root: {
        display: 'inline-block',
        lineHeight: 1 // Keep the progress centered
  
      },
  
      /* Styles applied to the root element if `variant="static"`. */
      static: {
        transition: theme.transitions.create('transform')
      },
  
      /* Styles applied to the root element if `variant="indeterminate"`. */
      indeterminate: {
        animation: 'mui-progress-circular-rotate 1.4s linear infinite'
      },
  
      /* Styles applied to the root element if `color="primary"`. */
      colorPrimary: {
        color: theme.palette.primary.main
      },
  
      /* Styles applied to the root element if `color="secondary"`. */
      colorSecondary: {
        color: theme.palette.secondary.main
      },
  
      /* Styles applied to the `svg` element. */
      svg: {},
  
      /* Styles applied to the `circle` svg path. */
      circle: {
        stroke: 'currentColor' // Use butt to follow the specification, by chance, it's already the default CSS value.
        // strokeLinecap: 'butt',
  
      },
  
      /* Styles applied to the `circle` svg path if `variant="static"`. */
      circleStatic: {
        transition: theme.transitions.create('stroke-dashoffset')
      },
  
      /* Styles applied to the `circle` svg path if `variant="indeterminate"`. */
      circleIndeterminate: {
        animation: 'mui-progress-circular-dash 1.4s ease-in-out infinite',
        // Some default value that looks fine waiting for the animation to kicks in.
        strokeDasharray: '80px, 200px',
        strokeDashoffset: '0px' // Add the unit to fix a Edge 16 and below bug.
  
      },
      '@keyframes mui-progress-circular-rotate': {
        '100%': {
          transform: 'rotate(360deg)'
        }
      },
      '@keyframes mui-progress-circular-dash': {
        '0%': {
          strokeDasharray: '1px, 200px',
          strokeDashoffset: '0px'
        },
        '50%': {
          strokeDasharray: '100px, 200px',
          strokeDashoffset: '-15px'
        },
        '100%': {
          strokeDasharray: '100px, 200px',
          strokeDashoffset: '-120px'
        }
      },
  
      /* Styles applied to the `circle` svg path if `disableShrink={true}`. */
      circleDisableShrink: {
        animation: 'none'
      }
    };
  };
  /**
   * ## 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.
   */
  
  
  exports.styles = styles;
  
  function CircularProgress(props) {
    var _classNames, _classNames2;
  
    var classes = props.classes,
        className = props.className,
        color = props.color,
        disableShrink = props.disableShrink,
        size = props.size,
        style = props.style,
        thickness = props.thickness,
        value = props.value,
        variant = props.variant,
        other = (0, _objectWithoutProperties2.default)(props, ["classes", "className", "color", "disableShrink", "size", "style", "thickness", "value", "variant"]);
    var circleStyle = {};
    var rootStyle = {};
    var rootProps = {};
  
    if (variant === 'determinate' || variant === 'static') {
      var circumference = 2 * Math.PI * ((SIZE - thickness) / 2);
      circleStyle.strokeDasharray = circumference.toFixed(3);
      rootProps['aria-valuenow'] = Math.round(value);
  
      if (variant === 'static') {
        circleStyle.strokeDashoffset = "".concat(((100 - value) / 100 * circumference).toFixed(3), "px");
        rootStyle.transform = 'rotate(-90deg)';
      } else {
        circleStyle.strokeDashoffset = "".concat((easeIn((100 - value) / 100) * circumference).toFixed(3), "px");
        rootStyle.transform = "rotate(".concat((easeOut(value / 70) * 270).toFixed(3), "deg)");
      }
    }
  
    return _react.default.createElement("div", (0, _extends2.default)({
      className: (0, _classnames.default)(classes.root, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes["color".concat((0, _helpers.capitalize)(color))], color !== 'inherit'), (0, _defineProperty2.default)(_classNames, classes.indeterminate, variant === 'indeterminate'), (0, _defineProperty2.default)(_classNames, classes.static, variant === 'static'), _classNames), className),
      style: (0, _extends2.default)({
        width: size,
        height: size
      }, rootStyle, style),
      role: "progressbar"
    }, rootProps, other), _react.default.createElement("svg", {
      className: classes.svg,
      viewBox: "".concat(SIZE / 2, " ").concat(SIZE / 2, " ").concat(SIZE, " ").concat(SIZE)
    }, _react.default.createElement("circle", {
      className: (0, _classnames.default)(classes.circle, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, classes.circleIndeterminate, variant === 'indeterminate'), (0, _defineProperty2.default)(_classNames2, classes.circleStatic, variant === 'static'), (0, _defineProperty2.default)(_classNames2, classes.circleDisableShrink, disableShrink), _classNames2)),
      style: circleStyle,
      cx: SIZE,
      cy: SIZE,
      r: (SIZE - thickness) / 2,
      fill: "none",
      strokeWidth: thickness
    })));
  }
  
  process.env.NODE_ENV !== "production" ? CircularProgress.propTypes = {
    /**
     * Override or extend the styles applied to the component.
     * See [CSS API](#css-api) below for more details.
     */
    classes: _propTypes.default.object.isRequired,
  
    /**
     * @ignore
     */
    className: _propTypes.default.string,
  
    /**
     * The color of the component. It supports those theme colors that make sense for this component.
     */
    color: _propTypes.default.oneOf(['primary', 'secondary', 'inherit']),
  
    /**
     * If `true`, the shrink animation is disabled.
     * This only works if variant is `indeterminate`.
     */
    disableShrink: (0, _chainPropTypes.default)(_propTypes.default.bool, function (props) {
      /* istanbul ignore if */
      if (props.disableShrink && props.variant !== 'indeterminate') {
        return new Error('Material-UI: you have provided the `disableShrink` property ' + 'with a variant other than `indeterminate`. This will have no effect.');
      }
  
      return null;
    }),
  
    /**
     * The size of the circle.
     */
    size: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
  
    /**
     * @ignore
     */
    style: _propTypes.default.object,
  
    /**
     * The thickness of the circle.
     */
    thickness: _propTypes.default.number,
  
    /**
     * The value of the progress indicator for the determinate and static variants.
     * Value between 0 and 100.
     */
    value: _propTypes.default.number,
  
    /**
     * The variant to use.
     * Use indeterminate when there is no progress value.
     */
    variant: _propTypes.default.oneOf(['determinate', 'indeterminate', 'static'])
  } : void 0;
  CircularProgress.defaultProps = {
    color: 'primary',
    disableShrink: false,
    size: 40,
    thickness: 3.6,
    value: 0,
    variant: 'indeterminate'
  };
  
  var _default = (0, _withStyles.default)(styles, {
    name: 'MuiCircularProgress',
    flip: false
  })(CircularProgress);
  
  exports.default = _default;