@atlaskit/progress-bar 0.5.7 → 0.5.8

package/dist/es2019/components/progress-bar.js

@@ -1,61 +1,119 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
-import { jsx } from '@emotion/core';
-import deprecationWarning from '@atlaskit/ds-lib/deprecation-warning';
+import { css, jsx, keyframes } from '@emotion/core';
+import { propDeprecationWarning } from '@atlaskit/ds-lib/deprecation-warning';
+import { G300, N40A, N500 } from '@atlaskit/theme/colors';
 import { Theme } from '../theme';
-const maxValue = 1;
-
-const Bar = ({
-  isIndeterminate,
-  tokens
-}) => {
-  if (isIndeterminate) {
-    return jsx(React.Fragment, null, jsx("span", {
-      css: [tokens.bar, tokens.increasingBar]
-    }), jsx("span", {
-      css: [tokens.bar, tokens.decreasingBar]
-    }));
+const MIN_VALUE = 0;
+const MAX_VALUE = 1;
+const increasingBarAnimation = keyframes({
+  from: {
+    left: '-5%',
+    width: '5%'
+  },
+  to: {
+    left: '130%',
+    width: ' 100%'
   }
-
-  return jsx("span", {
-    css: [tokens.bar, tokens.determinateBar]
-  });
-};
-
-export default class ProgressBar extends React.PureComponent {
-  render() {
-    const {
-      ariaLabel,
-      value,
-      isIndeterminate,
-      theme
-    } = this.props;
-    const valueParsed = isIndeterminate ? 0 : Math.max(0, Math.min(value, maxValue));
-    deprecationWarning('@atlaskit/progress-bar', '`theme` prop', 'If you depend on `theme`, we recommend migrating to one of its variants.');
-    return jsx(Theme.Provider, {
-      value: theme
-    }, jsx(Theme.Consumer, {
-      value: value
-    }, tokens => jsx("div", {
-      css: tokens.container,
-      role: "progressbar",
-      "aria-label": ariaLabel,
-      "aria-valuemin": 0,
-      "aria-valuenow": valueParsed,
-      "aria-valuemax": maxValue,
-      tabIndex: 0,
-      "data-testid": "progress-bar"
-    }, jsx(Bar, {
-      isIndeterminate: isIndeterminate,
-      tokens: tokens
-    }))));
+});
+const decreasingBarAnimation = keyframes({
+  from: {
+    left: '-80%',
+    width: '80%'
+  },
+  to: {
+    left: '110%',
+    width: '10%'
   }
+});
+const containerStyles = css({
+  width: `100%`,
+  height: 6,
+  position: 'relative',
+  background: `var(--ds-background-neutral, ${N40A})`,
+  borderRadius: 3,
+  overflow: 'hidden'
+});
+const containerAppearance = {
+  default: css({
+    background: `var(--ds-background-neutral, ${N40A})`
+  }),
+  success: css({
+    background: `var(--ds-background-neutral, ${N40A})`
+  }),
+  inverse: css({
+    background: "var(--ds-background-inverse-subtle, rgba(255, 255, 255, 0.5))"
+  })
+};
+const barAppearance = {
+  default: css({
+    background: `var(--ds-background-neutral-bold, ${N500})`
+  }),
+  success: css({
+    background: `var(--ds-background-success-bold, ${G300})`
+  }),
+  inverse: css({
+    background: "var(--ds-surface, white)"
+  })
+};
+const barStyles = css({
+  display: 'block',
+  height: 6,
+  position: 'absolute',
+  borderRadius: 3
+});
+const determinateBarStyles = css({
+  transition: 'width 0.2s'
+});
+const increasingBarStyles = css({
+  animation: `${increasingBarAnimation} 2s infinite`
+});
+const decreasingBarStyles = css({
+  animation: `${decreasingBarAnimation} 2s 0.5s infinite`
+});
+/**
+ * __Progress bar__
+ *
+ * A progress bar displays the status of a given process.
+ *
+ * - [Examples](https://atlassian.design/components/progress-bar/examples)
+ * - [Code](https://atlassian.design/components/progress-bar/code)
+ * - [Usage](https://atlassian.design/components/progress-bar/usage)
+ */
 
-}
+const ProgressBar = ({
+  appearance = 'default',
+  ariaLabel,
+  isIndeterminate = false,
+  testId = 'progress-bar',
+  theme,
+  value = 0
+}) => {
+  const valueParsed = isIndeterminate ? MIN_VALUE : Math.max(MIN_VALUE, Math.min(value, MAX_VALUE));
+  propDeprecationWarning("@atlaskit/progress-bar", 'theme', typeof theme !== undefined, 'https://community.developer.atlassian.com/t/theme-prop-in-atlaskit-progress-bar-is-being-deprecated/56198');
+  return jsx(Theme.Provider, {
+    value: theme
+  }, jsx(Theme.Consumer, {
+    value: value
+  }, tokens => jsx("div", {
+    css: [containerStyles, containerAppearance[appearance], tokens.container],
+    role: "progressbar",
+    "aria-label": ariaLabel,
+    "aria-valuemin": MIN_VALUE,
+    "aria-valuenow": valueParsed,
+    "aria-valuemax": MAX_VALUE,
+    tabIndex: 0,
+    "data-testid": testId
+  }, isIndeterminate ? jsx(React.Fragment, null, jsx("span", {
+    css: [barStyles, barAppearance[appearance], increasingBarStyles, tokens.bar, tokens.increasingBar]
+  }), jsx("span", {
+    css: [barStyles, barAppearance[appearance], decreasingBarStyles, tokens.bar, tokens.decreasingBar]
+  })) : jsx("span", {
+    style: {
+      width: `${Number(value) * 100}%`
+    },
+    css: [barStyles, barAppearance[appearance], determinateBarStyles, tokens.bar, tokens.determinateBar]
+  }))));
+};
 
-_defineProperty(ProgressBar, "defaultProps", {
-  value: 0,
-  isIndeterminate: false
-});
+export default ProgressBar;

package/dist/es2019/components/success-progress-bar.js

@@ -1,36 +1,27 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import deprecationWarning from '@atlaskit/ds-lib/deprecation-warning';
-import { G300 } from '@atlaskit/theme/colors';
 import ProgressBar from './progress-bar';
-export default class SuccessProgressBar extends React.PureComponent {
-  render() {
-    deprecationWarning('@atlaskit/progress-bar', '`theme` prop', 'If you depend on `theme`, we recommend migrating to one of its variants.');
-    return /*#__PURE__*/React.createElement(ProgressBar, _extends({}, this.props, {
-      theme: (currentTheme, props) => {
-        const theme = currentTheme(props);
-        const {
-          value,
-          isIndeterminate
-        } = this.props;
+/**
+ * __Success progress bar__
+ *
+ * A success progress bar indicates the completion of a process.
+ *
+ * - [Examples](https://atlassian.design/components/progress-bar/success-progress-bar/examples)
+ * - [Code](https://atlassian.design/components/progress-bar/success-progress-bar/code)
+ */
 
-        if (value < 1 || isIndeterminate) {
-          return theme;
-        }
+const SuccessProgressBar = ({
+  ariaLabel,
+  isIndeterminate = false,
+  testId,
+  value = 0
+}) => {
+  return /*#__PURE__*/React.createElement(ProgressBar, {
+    appearance: value < 1 || isIndeterminate ? 'default' : 'success',
+    value: value,
+    isIndeterminate: isIndeterminate,
+    ariaLabel: ariaLabel,
+    testId: testId
+  });
+};
 
-        return { ...theme,
-          bar: { ...theme.bar,
-            background: `var(--ds-background-success-bold, ${G300})`
-          }
-        };
-      }
-    }));
-  }
-
-}
-
-_defineProperty(SuccessProgressBar, "defaultProps", {
-  value: 0,
-  isIndeterminate: false
-});
+export default SuccessProgressBar;

package/dist/es2019/components/transparent-progress-bar.js

@@ -1,29 +1,27 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import deprecationWarning from '@atlaskit/ds-lib/deprecation-warning';
 import ProgressBar from './progress-bar';
-export default class TransparentProgressBar extends React.PureComponent {
-  render() {
-    deprecationWarning('@atlaskit/progress-bar', '`theme` prop', 'If you depend on `theme`, we recommend migrating to one of its variants.');
-    return /*#__PURE__*/React.createElement(ProgressBar, _extends({}, this.props, {
-      theme: (currentTheme, props) => {
-        const theme = currentTheme(props);
-        return { ...theme,
-          container: { ...theme.container,
-            background: "var(--ds-background-inverse-subtle, rgba(255, 255, 255, 0.5))"
-          },
-          bar: { ...theme.bar,
-            background: "var(--ds-surface, white)"
-          }
-        };
-      }
-    }));
-  }
+/**
+ * __Transparent progress bar__
+ *
+ * A transparent progress bar is used on bold backgrounds to maintain suitable contrast.
+ *
+ * - [Examples](https://atlassian.design/components/progress-bar/transparent-progress-bar/examples)
+ * - [Code](https://atlassian.design/components/progress-bar/transparent-progress-bar/code)
+ */
 
-}
+const TransparentProgressBar = ({
+  ariaLabel,
+  isIndeterminate = false,
+  testId,
+  value = 0
+}) => {
+  return /*#__PURE__*/React.createElement(ProgressBar, {
+    appearance: "inverse",
+    value: value,
+    isIndeterminate: isIndeterminate,
+    ariaLabel: ariaLabel,
+    testId: testId
+  });
+};
 
-_defineProperty(TransparentProgressBar, "defaultProps", {
-  value: 0,
-  isIndeterminate: false
-});
+export default TransparentProgressBar;

package/dist/es2019/theme.js

@@ -1,42 +1,14 @@
-import { keyframes } from '@emotion/core';
-import { N40A, N500 } from '@atlaskit/theme/colors';
 import { createTheme } from '@atlaskit/theme/components';
-const increasingBarAnimation = keyframes`
-  from { left: -5%; width: 5%; }
-  to { left: 130%; width: 100%;}
-`;
-const decreasingBarAnimation = keyframes`
-  from { left: -80%; width: 80%; }
-  to { left: 110%; width: 10%;}
-`;
+
 /**
- * @deprecated creates the default theme, which can be customised using the `theme` prop
+ * Creates the default theme, which can be customised using the `theme` prop
+ *
+ * @deprecated
  */
-
 export const Theme = createTheme(props => ({
-  container: {
-    background: `var(--ds-background-neutral, ${N40A})`,
-    borderRadius: 3,
-    height: 6,
-    overflow: 'hidden',
-    position: 'relative',
-    width: `100%`
-  },
-  bar: {
-    borderRadius: 3,
-    display: 'block',
-    height: 6,
-    position: 'absolute',
-    background: `var(--ds-background-neutral-bold, ${N500})`
-  },
-  determinateBar: {
-    transition: 'width 0.2s',
-    width: `${Number(props.value) * 100}%`
-  },
-  increasingBar: {
-    animation: `${increasingBarAnimation} 2s infinite`
-  },
-  decreasingBar: {
-    animation: `${decreasingBarAnimation} 2s 0.5s infinite`
-  }
+  container: {},
+  bar: {},
+  determinateBar: {},
+  increasingBar: {},
+  decreasingBar: {}
 }));

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/progress-bar",
-	"version": "0.5.7",
+	"version": "0.5.8",
 	"sideEffects": false
 }

package/dist/esm/components/progress-bar.js

@@ -1,87 +1,126 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+import _typeof from "@babel/runtime/helpers/typeof";
 
 /** @jsx jsx */
 import React from 'react';
-import { jsx } from '@emotion/core';
-import deprecationWarning from '@atlaskit/ds-lib/deprecation-warning';
+import { css, jsx, keyframes } from '@emotion/core';
+import { propDeprecationWarning } from '@atlaskit/ds-lib/deprecation-warning';
+import { G300, N40A, N500 } from '@atlaskit/theme/colors';
 import { Theme } from '../theme';
-var maxValue = 1;
-
-var Bar = function Bar(_ref) {
-  var isIndeterminate = _ref.isIndeterminate,
-      tokens = _ref.tokens;
+var MIN_VALUE = 0;
+var MAX_VALUE = 1;
+var increasingBarAnimation = keyframes({
+  from: {
+    left: '-5%',
+    width: '5%'
+  },
+  to: {
+    left: '130%',
+    width: ' 100%'
+  }
+});
+var decreasingBarAnimation = keyframes({
+  from: {
+    left: '-80%',
+    width: '80%'
+  },
+  to: {
+    left: '110%',
+    width: '10%'
+  }
+});
+var containerStyles = css({
+  width: "100%",
+  height: 6,
+  position: 'relative',
+  background: "var(--ds-background-neutral, ".concat(N40A, ")"),
+  borderRadius: 3,
+  overflow: 'hidden'
+});
+var containerAppearance = {
+  default: css({
+    background: "var(--ds-background-neutral, ".concat(N40A, ")")
+  }),
+  success: css({
+    background: "var(--ds-background-neutral, ".concat(N40A, ")")
+  }),
+  inverse: css({
+    background: "var(--ds-background-inverse-subtle, rgba(255, 255, 255, 0.5))"
+  })
+};
+var barAppearance = {
+  default: css({
+    background: "var(--ds-background-neutral-bold, ".concat(N500, ")")
+  }),
+  success: css({
+    background: "var(--ds-background-success-bold, ".concat(G300, ")")
+  }),
+  inverse: css({
+    background: "var(--ds-surface, white)"
+  })
+};
+var barStyles = css({
+  display: 'block',
+  height: 6,
+  position: 'absolute',
+  borderRadius: 3
+});
+var determinateBarStyles = css({
+  transition: 'width 0.2s'
+});
+var increasingBarStyles = css({
+  animation: "".concat(increasingBarAnimation, " 2s infinite")
+});
+var decreasingBarStyles = css({
+  animation: "".concat(decreasingBarAnimation, " 2s 0.5s infinite")
+});
+/**
+ * __Progress bar__
+ *
+ * A progress bar displays the status of a given process.
+ *
+ * - [Examples](https://atlassian.design/components/progress-bar/examples)
+ * - [Code](https://atlassian.design/components/progress-bar/code)
+ * - [Usage](https://atlassian.design/components/progress-bar/usage)
+ */
 
-  if (isIndeterminate) {
-    return jsx(React.Fragment, null, jsx("span", {
-      css: [tokens.bar, tokens.increasingBar]
+var ProgressBar = function ProgressBar(_ref) {
+  var _ref$appearance = _ref.appearance,
+      appearance = _ref$appearance === void 0 ? 'default' : _ref$appearance,
+      ariaLabel = _ref.ariaLabel,
+      _ref$isIndeterminate = _ref.isIndeterminate,
+      isIndeterminate = _ref$isIndeterminate === void 0 ? false : _ref$isIndeterminate,
+      _ref$testId = _ref.testId,
+      testId = _ref$testId === void 0 ? 'progress-bar' : _ref$testId,
+      theme = _ref.theme,
+      _ref$value = _ref.value,
+      value = _ref$value === void 0 ? 0 : _ref$value;
+  var valueParsed = isIndeterminate ? MIN_VALUE : Math.max(MIN_VALUE, Math.min(value, MAX_VALUE));
+  propDeprecationWarning("@atlaskit/progress-bar", 'theme', _typeof(theme) !== undefined, 'https://community.developer.atlassian.com/t/theme-prop-in-atlaskit-progress-bar-is-being-deprecated/56198');
+  return jsx(Theme.Provider, {
+    value: theme
+  }, jsx(Theme.Consumer, {
+    value: value
+  }, function (tokens) {
+    return jsx("div", {
+      css: [containerStyles, containerAppearance[appearance], tokens.container],
+      role: "progressbar",
+      "aria-label": ariaLabel,
+      "aria-valuemin": MIN_VALUE,
+      "aria-valuenow": valueParsed,
+      "aria-valuemax": MAX_VALUE,
+      tabIndex: 0,
+      "data-testid": testId
+    }, isIndeterminate ? jsx(React.Fragment, null, jsx("span", {
+      css: [barStyles, barAppearance[appearance], increasingBarStyles, tokens.bar, tokens.increasingBar]
     }), jsx("span", {
-      css: [tokens.bar, tokens.decreasingBar]
+      css: [barStyles, barAppearance[appearance], decreasingBarStyles, tokens.bar, tokens.decreasingBar]
+    })) : jsx("span", {
+      style: {
+        width: "".concat(Number(value) * 100, "%")
+      },
+      css: [barStyles, barAppearance[appearance], determinateBarStyles, tokens.bar, tokens.determinateBar]
     }));
-  }
-
-  return jsx("span", {
-    css: [tokens.bar, tokens.determinateBar]
-  });
+  }));
 };
 
-var ProgressBar = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(ProgressBar, _React$PureComponent);
-
-  var _super = _createSuper(ProgressBar);
-
-  function ProgressBar() {
-    _classCallCheck(this, ProgressBar);
-
-    return _super.apply(this, arguments);
-  }
-
-  _createClass(ProgressBar, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          ariaLabel = _this$props.ariaLabel,
-          value = _this$props.value,
-          isIndeterminate = _this$props.isIndeterminate,
-          theme = _this$props.theme;
-      var valueParsed = isIndeterminate ? 0 : Math.max(0, Math.min(value, maxValue));
-      deprecationWarning('@atlaskit/progress-bar', '`theme` prop', 'If you depend on `theme`, we recommend migrating to one of its variants.');
-      return jsx(Theme.Provider, {
-        value: theme
-      }, jsx(Theme.Consumer, {
-        value: value
-      }, function (tokens) {
-        return jsx("div", {
-          css: tokens.container,
-          role: "progressbar",
-          "aria-label": ariaLabel,
-          "aria-valuemin": 0,
-          "aria-valuenow": valueParsed,
-          "aria-valuemax": maxValue,
-          tabIndex: 0,
-          "data-testid": "progress-bar"
-        }, jsx(Bar, {
-          isIndeterminate: isIndeterminate,
-          tokens: tokens
-        }));
-      }));
-    }
-  }]);
-
-  return ProgressBar;
-}(React.PureComponent);
-
-_defineProperty(ProgressBar, "defaultProps", {
-  value: 0,
-  isIndeterminate: false
-});
-
-export { ProgressBar as default };
+export default ProgressBar;

package/dist/esm/components/success-progress-bar.js

@@ -1,68 +1,28 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React from 'react';
-import deprecationWarning from '@atlaskit/ds-lib/deprecation-warning';
-import { G300 } from '@atlaskit/theme/colors';
 import ProgressBar from './progress-bar';
-
-var SuccessProgressBar = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(SuccessProgressBar, _React$PureComponent);
-
-  var _super = _createSuper(SuccessProgressBar);
-
-  function SuccessProgressBar() {
-    _classCallCheck(this, SuccessProgressBar);
-
-    return _super.apply(this, arguments);
-  }
-
-  _createClass(SuccessProgressBar, [{
-    key: "render",
-    value: function render() {
-      var _this = this;
-
-      deprecationWarning('@atlaskit/progress-bar', '`theme` prop', 'If you depend on `theme`, we recommend migrating to one of its variants.');
-      return /*#__PURE__*/React.createElement(ProgressBar, _extends({}, this.props, {
-        theme: function theme(currentTheme, props) {
-          var theme = currentTheme(props);
-          var _this$props = _this.props,
-              value = _this$props.value,
-              isIndeterminate = _this$props.isIndeterminate;
-
-          if (value < 1 || isIndeterminate) {
-            return theme;
-          }
-
-          return _objectSpread(_objectSpread({}, theme), {}, {
-            bar: _objectSpread(_objectSpread({}, theme.bar), {}, {
-              background: "var(--ds-background-success-bold, ".concat(G300, ")")
-            })
-          });
-        }
-      }));
-    }
-  }]);
-
-  return SuccessProgressBar;
-}(React.PureComponent);
-
-_defineProperty(SuccessProgressBar, "defaultProps", {
-  value: 0,
-  isIndeterminate: false
-});
-
-export { SuccessProgressBar as default };
+/**
+ * __Success progress bar__
+ *
+ * A success progress bar indicates the completion of a process.
+ *
+ * - [Examples](https://atlassian.design/components/progress-bar/success-progress-bar/examples)
+ * - [Code](https://atlassian.design/components/progress-bar/success-progress-bar/code)
+ */
+
+var SuccessProgressBar = function SuccessProgressBar(_ref) {
+  var ariaLabel = _ref.ariaLabel,
+      _ref$isIndeterminate = _ref.isIndeterminate,
+      isIndeterminate = _ref$isIndeterminate === void 0 ? false : _ref$isIndeterminate,
+      testId = _ref.testId,
+      _ref$value = _ref.value,
+      value = _ref$value === void 0 ? 0 : _ref$value;
+  return /*#__PURE__*/React.createElement(ProgressBar, {
+    appearance: value < 1 || isIndeterminate ? 'default' : 'success',
+    value: value,
+    isIndeterminate: isIndeterminate,
+    ariaLabel: ariaLabel,
+    testId: testId
+  });
+};
+
+export default SuccessProgressBar;