wix-style-react/dist/src/CircularProgressBar/CircularProgressBar.js

wix-style-react

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _system = require("@wix/wix-ui-icons-common/system");
var _Tooltip = _interopRequireDefault(require("../Tooltip"));
var _ThemeProviderConsumerBackwardCompatible = require("../ThemeProvider/ThemeProviderConsumerBackwardCompatible");
var _CircularProgressBarSt = require("./CircularProgressBar.st.css");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _constants = require("./constants");
var _CircularProgressBarCore = require("./CircularProgressBarCore");
var _excluded = ["light", "size", "skin", "label", "labelPlacement", "className"];
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/CircularProgressBar/CircularProgressBar.js";
var sizeToSuccessIcon = {
  [_constants.Size.small]: _system.CircleLoaderCheckSmall,
  [_constants.Size.medium]: _system.CircleLoaderCheck,
  [_constants.Size.large]: _system.CircleLoaderCheck
};
var sizeToErrorIcon = {
  [_constants.Size.small]: /*#__PURE__*/_react.default.createElement(_system.FormFieldErrorSmall, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 22,
      columnNumber: 17
    }
  }),
  [_constants.Size.medium]: /*#__PURE__*/_react.default.createElement(_system.FormFieldError, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 23,
      columnNumber: 18
    }
  }),
  [_constants.Size.large]: /*#__PURE__*/_react.default.createElement(_system.FormFieldError, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 24,
      columnNumber: 17
    }
  })
};
class CircularProgressBar extends _react.default.PureComponent {
  _renderSuccessIcon(size) {
    return /*#__PURE__*/_react.default.createElement(_ThemeProviderConsumerBackwardCompatible.ThemeProviderConsumerBackwardCompatible, {
      defaultIcons: {
        CircularProgressBar: sizeToSuccessIcon
      },
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 30,
        columnNumber: 7
      }
    }, _ref => {
      var {
        icons
      } = _ref;
      var IconToRender = icons.CircularProgressBar[size];
      return /*#__PURE__*/_react.default.createElement(IconToRender, {
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 37,
          columnNumber: 18
        }
      });
    });
  }
  _renderProgressBar() {
    var _this$props = this.props,
      {
        light,
        size,
        skin,
        label,
        labelPlacement,
        className
      } = _this$props,
      otherProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
    return /*#__PURE__*/_react.default.createElement(_CircularProgressBarCore.CircularProgressBarCore, (0, _extends2.default)({
      className: (0, _CircularProgressBarSt.st)(_CircularProgressBarSt.classes.progressBar, {
        light,
        size,
        skin
      })
    }, otherProps, {
      label: label,
      labelPlacement: labelPlacement,
      "data-hook": _constants.dataHooks.circularProgressBar,
      size: _constants.sizesMap[size],
      "data-size": size,
      "data-skin": skin,
      successIcon: this._renderSuccessIcon(size),
      errorIcon: sizeToErrorIcon[size],
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 55,
        columnNumber: 7
      }
    }));
  }
  render() {
    var {
      dataHook,
      error,
      errorMessage,
      className
    } = this.props;
    return /*#__PURE__*/_react.default.createElement("div", {
      "data-hook": dataHook,
      className: (0, _CircularProgressBarSt.st)(_CircularProgressBarSt.classes.root, className),
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 74,
        columnNumber: 7
      }
    }, error && errorMessage ? /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
      className: _CircularProgressBarSt.classes.tooltip,
      content: errorMessage,
      dataHook: _constants.dataHooks.tooltip,
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 76,
        columnNumber: 11
      }
    }, this._renderProgressBar()) : this._renderProgressBar());
  }
}
CircularProgressBar.displayName = 'CircularProgressBar';
CircularProgressBar.defaultProps = {
  size: 'medium',
  skin: 'standard',
  labelPlacement: 'bottom'
};
CircularProgressBar.propTypes = {
  /** Should be true if had failure during the progress */
  error: _propTypes.default.bool,
  /** Label to display when an error happens */
  errorLabel: _propTypes.default.string,
  /** Message to display when an error happens */
  errorMessage: _propTypes.default.string,
  /** Use light theme instead of dark theme */
  light: _propTypes.default.bool,
  /** Use to display a percentage progress */
  showProgressIndication: _propTypes.default.bool,
  /** Use to display custom text in the progress bar */
  label: _propTypes.default.string,
  /** Placement of the label in the progress bar */
  labelPlacement: _propTypes.default.oneOf(['bottom', 'center']),
  /** Size of the bar */
  size: _propTypes.default.string,
  /** Skin of the bar */
  skin: _propTypes.default.oneOf(['standard', 'premium', 'success']),
  /** The number of the percentage progress */
  value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  dataHook: _propTypes.default.string
};
var _default = exports.default = CircularProgressBar;
//# sourceMappingURL=CircularProgressBar.js.map