UNPKG

wix-style-react

Version:
182 lines (181 loc) • 7.72 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); exports.__esModule = true; exports.convertToPercentageString = exports.CircularProgressBarCore = void 0; var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var React = _interopRequireWildcard(require("react")); var _CircularProgressBarCoreSt = require("./CircularProgressBarCore.st.css"); var _Arc = require("./Arc"); var _constants = require("./constants"); var _propsUtils = require("../../utils/propsUtils"); var _ProgressLabel = require("./ProgressLabel"); var _excluded = ["value", "size", "labelPlacement"]; var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/CircularProgressBar/CircularProgressBarCore/CircularProgressBarCore.tsx"; function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); } function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } var FULL_PROGRESS = 100; var NO_PROGRESS = 0; var VIEWBOX_SIZE = 54; var resolveIndicationElement = props => { var wrapped = (dataHook, children) => /*#__PURE__*/React.createElement("div", { "data-hook": dataHook, className: _CircularProgressBarCoreSt.classes.statusIndicator, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 44, columnNumber: 5 } }, children); if (props.error && props.errorIcon) { return wrapped(_constants.dataHooks.errorIcon, props.errorIcon); } if (props.value === FULL_PROGRESS && props.successIcon) { return wrapped(_constants.dataHooks.successIcon, props.successIcon); } if (props.labelPlacement === 'center' && (props.shouldShowProgressIndication || props.label)) { return wrapped(props.label ? _constants.dataHooks.label : _constants.dataHooks.progressIndicator, /*#__PURE__*/React.createElement(_ProgressLabel.ProgressLabel, (0, _extends2.default)({}, props, { __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 63, columnNumber: 7 } }))); } return null; }; var normalizeValue = value => { return typeof value === 'number' ? value : parseInt(value, 10) ? parseInt(value, 10) : NO_PROGRESS; }; var normalizeSize = size => { var intSize = typeof size === 'number' ? size : parseInt(size, 10); return intSize && intSize > 0 ? intSize : VIEWBOX_SIZE; }; var convertToPercentageString = value => { return "".concat(Math.floor(value), "%"); }; exports.convertToPercentageString = convertToPercentageString; var renderArcs = props => { var { value, size } = props; var normalizedSize = normalizeSize(size || VIEWBOX_SIZE); var normalizedValue = normalizeValue(value || NO_PROGRESS); return /*#__PURE__*/React.createElement("div", { className: _CircularProgressBarCoreSt.classes.arcsContainer, style: { width: "".concat(normalizedSize, "px"), height: "".concat(normalizedSize, "px") }, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 95, columnNumber: 5 } }, resolveIndicationElement(props), /*#__PURE__*/React.createElement(_Arc.Arc, { "data-hook": _constants.dataHooks.progressArcBackground, value: FULL_PROGRESS, className: _CircularProgressBarCoreSt.classes.backArc, strokeWidth: 4, size: normalizedSize, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 100, columnNumber: 7 } }), /*#__PURE__*/React.createElement(_Arc.Arc, { "data-hook": _constants.dataHooks.progressArcForeground, value: normalizedValue, className: _CircularProgressBarCoreSt.classes.foreArc, strokeWidth: 4, size: normalizedSize, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 107, columnNumber: 7 } })); }; var normalizeProps = props => { var value = normalizeValue(props.value || NO_PROGRESS); if (value >= FULL_PROGRESS) { return _objectSpread(_objectSpread({}, props), {}, { value: FULL_PROGRESS }); } if (value < NO_PROGRESS) { return _objectSpread(_objectSpread({}, props), {}, { value: NO_PROGRESS }); } return _objectSpread(_objectSpread({}, props), {}, { value }); }; var CircularProgressBarCore = _ref => { var { value = NO_PROGRESS, size = VIEWBOX_SIZE, labelPlacement = 'bottom' } = _ref, propsWithNoDefaults = (0, _objectWithoutProperties2.default)(_ref, _excluded); var props = _objectSpread({ value, size, labelPlacement }, propsWithNoDefaults); var { label, error, showProgressIndication } = props; var _props = normalizeProps(props); var success = _props.value === FULL_PROGRESS; var displayValue = error && _props.errorLabel ? _props.errorLabel : convertToPercentageString(_props.value); var shouldShowProgressIndication = Boolean(showProgressIndication && !label); return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({ className: (0, _CircularProgressBarCoreSt.st)(_CircularProgressBarCoreSt.classes.root, { error, success }, _props.className), "data-error": error }, (0, _propsUtils.filterDataProps)(props), { __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 158, columnNumber: 5 } }), renderArcs(_objectSpread(_objectSpread({}, _props), {}, { shouldShowProgressIndication })), label && labelPlacement === 'bottom' && /*#__PURE__*/React.createElement("div", { "data-hook": _constants.dataHooks.label, className: _CircularProgressBarCoreSt.classes.label, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 165, columnNumber: 9 } }, label), shouldShowProgressIndication && labelPlacement === 'bottom' && /*#__PURE__*/React.createElement("div", { "data-hook": _constants.dataHooks.progressIndicator, className: _CircularProgressBarCoreSt.classes.progressIndicator, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 170, columnNumber: 9 } }, displayValue)); }; exports.CircularProgressBarCore = CircularProgressBarCore; CircularProgressBarCore.displayName = 'CircularProgressBarCore'; //# sourceMappingURL=CircularProgressBarCore.js.map