@alfalab/core-components-circular-progress-bar 3.0.6 → 3.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/Component.js +17 -19
  2. package/cssm/Component.js +19 -21
  3. package/cssm/index.js +0 -2
  4. package/esm/Component.js +6 -6
  5. package/esm/index.css +49 -49
  6. package/index.css +49 -49
  7. package/index.js +0 -2
  8. package/modern/Component.js +1 -1
  9. package/modern/index.css +49 -49
  10. package/modern/index.js +1 -1
  11. package/package.json +2 -2
package/Component.js CHANGED
@@ -1,15 +1,13 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var React = require('react');
6
4
  var cn = require('classnames');
7
5
  var coreComponentsTypography = require('@alfalab/core-components-typography');
8
6
 
9
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
7
+ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
10
8
 
11
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
- var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
9
+ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
10
+ var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
13
11
 
14
12
  /******************************************************************************
15
13
  Copyright (c) Microsoft Corporation.
@@ -38,7 +36,7 @@ var __assign = function () {
38
36
  return __assign.apply(this, arguments);
39
37
  };
40
38
 
41
- var styles = {"component":"circular-progress-bar__component_eyt2u","svg":"circular-progress-bar__svg_eyt2u","title":"circular-progress-bar__title_eyt2u","subtitle":"circular-progress-bar__subtitle_eyt2u","labelWrapper":"circular-progress-bar__labelWrapper_eyt2u","label":"circular-progress-bar__label_eyt2u","typography":"circular-progress-bar__typography_eyt2u","xxl":"circular-progress-bar__xxl_eyt2u","xl":"circular-progress-bar__xl_eyt2u","l":"circular-progress-bar__l_eyt2u","m":"circular-progress-bar__m_eyt2u","s":"circular-progress-bar__s_eyt2u","xs":"circular-progress-bar__xs_eyt2u","backgroundCircle":"circular-progress-bar__backgroundCircle_eyt2u","progressCircle":"circular-progress-bar__progressCircle_eyt2u","positive":"circular-progress-bar__positive_eyt2u","negative":"circular-progress-bar__negative_eyt2u","stroke":"circular-progress-bar__stroke_eyt2u","bg-positive":"circular-progress-bar__bg-positive_eyt2u","bg-negative":"circular-progress-bar__bg-negative_eyt2u","iconWrapper":"circular-progress-bar__iconWrapper_eyt2u","icon-tertiary":"circular-progress-bar__icon-tertiary_eyt2u","icon-positive":"circular-progress-bar__icon-positive_eyt2u","icon-negative":"circular-progress-bar__icon-negative_eyt2u","icon-primary-inverted":"circular-progress-bar__icon-primary-inverted_eyt2u","icon-primary":"circular-progress-bar__icon-primary_eyt2u","icon-secondary":"circular-progress-bar__icon-secondary_eyt2u","icon":"circular-progress-bar__icon_eyt2u"};
39
+ var styles = {"component":"circular-progress-bar__component_1brjj","svg":"circular-progress-bar__svg_1brjj","title":"circular-progress-bar__title_1brjj","subtitle":"circular-progress-bar__subtitle_1brjj","labelWrapper":"circular-progress-bar__labelWrapper_1brjj","label":"circular-progress-bar__label_1brjj","typography":"circular-progress-bar__typography_1brjj","xxl":"circular-progress-bar__xxl_1brjj","xl":"circular-progress-bar__xl_1brjj","l":"circular-progress-bar__l_1brjj","m":"circular-progress-bar__m_1brjj","s":"circular-progress-bar__s_1brjj","xs":"circular-progress-bar__xs_1brjj","backgroundCircle":"circular-progress-bar__backgroundCircle_1brjj","progressCircle":"circular-progress-bar__progressCircle_1brjj","positive":"circular-progress-bar__positive_1brjj","negative":"circular-progress-bar__negative_1brjj","stroke":"circular-progress-bar__stroke_1brjj","bg-positive":"circular-progress-bar__bg-positive_1brjj","bg-negative":"circular-progress-bar__bg-negative_1brjj","iconWrapper":"circular-progress-bar__iconWrapper_1brjj","icon-tertiary":"circular-progress-bar__icon-tertiary_1brjj","icon-positive":"circular-progress-bar__icon-positive_1brjj","icon-negative":"circular-progress-bar__icon-negative_1brjj","icon-primary-inverted":"circular-progress-bar__icon-primary-inverted_1brjj","icon-primary":"circular-progress-bar__icon-primary_1brjj","icon-secondary":"circular-progress-bar__icon-secondary_1brjj","icon":"circular-progress-bar__icon_1brjj"};
42
40
  require('./index.css')
43
41
 
44
42
  var SIZES = {
@@ -106,34 +104,34 @@ var CircularProgressBar = function (_a) {
106
104
  var subtitleContent = subtitleComplete && isComplete ? subtitleComplete : subtitle;
107
105
  var IconComponent = IconComplete && isComplete ? IconComplete : Icon;
108
106
  var renderTitleString = function () {
109
- return SIZES[size] > 64 ? (React__default['default'].createElement(coreComponentsTypography.Typography.TitleMobile, { className: cn__default['default'](styles.typography, styles.title), color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', font: 'system', view: VIEW_TITLE[size] }, titleContent)) : (React__default['default'].createElement(coreComponentsTypography.Typography.Text, { className: styles.title, color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', weight: 'bold', view: VIEW_TEXT[size] }, titleContent));
107
+ return SIZES[size] > 64 ? (React__default.default.createElement(coreComponentsTypography.Typography.TitleMobile, { className: cn__default.default(styles.typography, styles.title), color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', font: 'system', view: VIEW_TITLE[size] }, titleContent)) : (React__default.default.createElement(coreComponentsTypography.Typography.Text, { className: styles.title, color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', weight: 'bold', view: VIEW_TEXT[size] }, titleContent));
110
108
  };
111
109
  var renderTitle = function () { return (typeof title === 'string' ? renderTitleString() : titleContent); };
112
110
  var renderSubTitle = function () {
113
- return typeof subtitle === 'string' ? (React__default['default'].createElement(coreComponentsTypography.Typography.Text, { tag: 'div', className: styles.subtitle, color: isCompleteTextColor ? completeTextColor : contentColor, view: 'primary-small' }, subtitleContent)) : (subtitleContent);
111
+ return typeof subtitle === 'string' ? (React__default.default.createElement(coreComponentsTypography.Typography.Text, { tag: 'div', className: styles.subtitle, color: isCompleteTextColor ? completeTextColor : contentColor, view: 'primary-small' }, subtitleContent)) : (subtitleContent);
114
112
  };
115
113
  var renderIcon = function () {
116
114
  var _a;
117
- return (React__default['default'].createElement("span", { className: cn__default['default'](styles.iconWrapper, styles[size], styles.tertiary, styles["icon-" + contentColor], (_a = {},
118
- _a[styles["icon-" + completeIconColor]] = completeIconColor,
119
- _a)) }, IconComponent && React__default['default'].createElement(IconComponent, { className: styles.icon })));
115
+ return (React__default.default.createElement("span", { className: cn__default.default(styles.iconWrapper, styles[size], styles.tertiary, styles["icon-".concat(contentColor)], (_a = {},
116
+ _a[styles["icon-".concat(completeIconColor)]] = completeIconColor,
117
+ _a)) }, IconComponent && React__default.default.createElement(IconComponent, { className: styles.icon })));
120
118
  };
121
119
  var renderContent = function () {
122
- return Icon || (IconComplete && isComplete) ? (renderIcon()) : (React__default['default'].createElement(React__default['default'].Fragment, null,
120
+ return Icon || (IconComplete && isComplete) ? (renderIcon()) : (React__default.default.createElement(React__default.default.Fragment, null,
123
121
  SIZES[size] > 24 && renderTitle(),
124
122
  SIZES[size] > 64 && renderSubTitle()));
125
123
  };
126
- return (React__default['default'].createElement("div", { className: cn__default['default'](styles.component, styles[size], className), style: __assign({}, (height && { height: height, width: height })), "data-test-id": dataTestId },
127
- React__default['default'].createElement("svg", { viewBox: "0 0 " + memorized.widthSVG + " " + memorized.heightSVG, className: styles.svg, xmlns: 'http://www.w3.org/2000/svg' },
128
- React__default['default'].createElement("circle", { className: cn__default['default'](styles.backgroundCircle, styles[size], (_b = {},
124
+ return (React__default.default.createElement("div", { className: cn__default.default(styles.component, styles[size], className), style: __assign({}, (height && { height: height, width: height })), "data-test-id": dataTestId },
125
+ React__default.default.createElement("svg", { viewBox: "0 0 ".concat(memorized.widthSVG, " ").concat(memorized.heightSVG), className: styles.svg, xmlns: 'http://www.w3.org/2000/svg' },
126
+ React__default.default.createElement("circle", { className: cn__default.default(styles.backgroundCircle, styles[size], (_b = {},
129
127
  _b[styles.stroke] = !stroke,
130
128
  _b)), cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size] }),
131
- React__default['default'].createElement("circle", { className: cn__default['default'](styles.progressCircle, styles[view], styles[size], (_c = {},
132
- _c[styles["bg-" + view]] = fillComplete && isComplete,
129
+ React__default.default.createElement("circle", { className: cn__default.default(styles.progressCircle, styles[view], styles[size], (_c = {},
130
+ _c[styles["bg-".concat(view)]] = fillComplete && isComplete,
133
131
  _c)), cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size], strokeDasharray: memorized.strokeDasharray, strokeDashoffset: direction === 'counter-clockwise'
134
132
  ? -memorized.strokeDashoffset
135
- : memorized.strokeDashoffset, transform: "rotate(" + -90 + " " + memorized.center + " " + memorized.center + ")" })),
136
- React__default['default'].createElement("div", { className: cn__default['default'](styles.labelWrapper, (_d = {},
133
+ : memorized.strokeDashoffset, transform: "rotate(".concat(-90, " ").concat(memorized.center, " ").concat(memorized.center, ")") })),
134
+ React__default.default.createElement("div", { className: cn__default.default(styles.labelWrapper, (_d = {},
137
135
  _d[styles.label] = Icon || IconComplete,
138
136
  _d)) }, children || renderContent())));
139
137
  };
package/cssm/Component.js CHANGED
@@ -1,17 +1,15 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var React = require('react');
6
4
  var cn = require('classnames');
7
5
  var coreComponentsTypography = require('@alfalab/core-components-typography/cssm');
8
6
  var styles = require('./index.module.css');
9
7
 
10
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
+ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
11
9
 
12
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
13
- var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
14
- var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
10
+ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
11
+ var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
12
+ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
15
13
 
16
14
  /******************************************************************************
17
15
  Copyright (c) Microsoft Corporation.
@@ -105,35 +103,35 @@ var CircularProgressBar = function (_a) {
105
103
  var subtitleContent = subtitleComplete && isComplete ? subtitleComplete : subtitle;
106
104
  var IconComponent = IconComplete && isComplete ? IconComplete : Icon;
107
105
  var renderTitleString = function () {
108
- return SIZES[size] > 64 ? (React__default['default'].createElement(coreComponentsTypography.Typography.TitleMobile, { className: cn__default['default'](styles__default['default'].typography, styles__default['default'].title), color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', font: 'system', view: VIEW_TITLE[size] }, titleContent)) : (React__default['default'].createElement(coreComponentsTypography.Typography.Text, { className: styles__default['default'].title, color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', weight: 'bold', view: VIEW_TEXT[size] }, titleContent));
106
+ return SIZES[size] > 64 ? (React__default.default.createElement(coreComponentsTypography.Typography.TitleMobile, { className: cn__default.default(styles__default.default.typography, styles__default.default.title), color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', font: 'system', view: VIEW_TITLE[size] }, titleContent)) : (React__default.default.createElement(coreComponentsTypography.Typography.Text, { className: styles__default.default.title, color: isCompleteTextColor ? completeTextColor : contentColor, tag: 'div', weight: 'bold', view: VIEW_TEXT[size] }, titleContent));
109
107
  };
110
108
  var renderTitle = function () { return (typeof title === 'string' ? renderTitleString() : titleContent); };
111
109
  var renderSubTitle = function () {
112
- return typeof subtitle === 'string' ? (React__default['default'].createElement(coreComponentsTypography.Typography.Text, { tag: 'div', className: styles__default['default'].subtitle, color: isCompleteTextColor ? completeTextColor : contentColor, view: 'primary-small' }, subtitleContent)) : (subtitleContent);
110
+ return typeof subtitle === 'string' ? (React__default.default.createElement(coreComponentsTypography.Typography.Text, { tag: 'div', className: styles__default.default.subtitle, color: isCompleteTextColor ? completeTextColor : contentColor, view: 'primary-small' }, subtitleContent)) : (subtitleContent);
113
111
  };
114
112
  var renderIcon = function () {
115
113
  var _a;
116
- return (React__default['default'].createElement("span", { className: cn__default['default'](styles__default['default'].iconWrapper, styles__default['default'][size], styles__default['default'].tertiary, styles__default['default']["icon-" + contentColor], (_a = {},
117
- _a[styles__default['default']["icon-" + completeIconColor]] = completeIconColor,
118
- _a)) }, IconComponent && React__default['default'].createElement(IconComponent, { className: styles__default['default'].icon })));
114
+ return (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.iconWrapper, styles__default.default[size], styles__default.default.tertiary, styles__default.default["icon-".concat(contentColor)], (_a = {},
115
+ _a[styles__default.default["icon-".concat(completeIconColor)]] = completeIconColor,
116
+ _a)) }, IconComponent && React__default.default.createElement(IconComponent, { className: styles__default.default.icon })));
119
117
  };
120
118
  var renderContent = function () {
121
- return Icon || (IconComplete && isComplete) ? (renderIcon()) : (React__default['default'].createElement(React__default['default'].Fragment, null,
119
+ return Icon || (IconComplete && isComplete) ? (renderIcon()) : (React__default.default.createElement(React__default.default.Fragment, null,
122
120
  SIZES[size] > 24 && renderTitle(),
123
121
  SIZES[size] > 64 && renderSubTitle()));
124
122
  };
125
- return (React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].component, styles__default['default'][size], className), style: __assign({}, (height && { height: height, width: height })), "data-test-id": dataTestId },
126
- React__default['default'].createElement("svg", { viewBox: "0 0 " + memorized.widthSVG + " " + memorized.heightSVG, className: styles__default['default'].svg, xmlns: 'http://www.w3.org/2000/svg' },
127
- React__default['default'].createElement("circle", { className: cn__default['default'](styles__default['default'].backgroundCircle, styles__default['default'][size], (_b = {},
128
- _b[styles__default['default'].stroke] = !stroke,
123
+ return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, styles__default.default[size], className), style: __assign({}, (height && { height: height, width: height })), "data-test-id": dataTestId },
124
+ React__default.default.createElement("svg", { viewBox: "0 0 ".concat(memorized.widthSVG, " ").concat(memorized.heightSVG), className: styles__default.default.svg, xmlns: 'http://www.w3.org/2000/svg' },
125
+ React__default.default.createElement("circle", { className: cn__default.default(styles__default.default.backgroundCircle, styles__default.default[size], (_b = {},
126
+ _b[styles__default.default.stroke] = !stroke,
129
127
  _b)), cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size] }),
130
- React__default['default'].createElement("circle", { className: cn__default['default'](styles__default['default'].progressCircle, styles__default['default'][view], styles__default['default'][size], (_c = {},
131
- _c[styles__default['default']["bg-" + view]] = fillComplete && isComplete,
128
+ React__default.default.createElement("circle", { className: cn__default.default(styles__default.default.progressCircle, styles__default.default[view], styles__default.default[size], (_c = {},
129
+ _c[styles__default.default["bg-".concat(view)]] = fillComplete && isComplete,
132
130
  _c)), cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size], strokeDasharray: memorized.strokeDasharray, strokeDashoffset: direction === 'counter-clockwise'
133
131
  ? -memorized.strokeDashoffset
134
- : memorized.strokeDashoffset, transform: "rotate(" + -90 + " " + memorized.center + " " + memorized.center + ")" })),
135
- React__default['default'].createElement("div", { className: cn__default['default'](styles__default['default'].labelWrapper, (_d = {},
136
- _d[styles__default['default'].label] = Icon || IconComplete,
132
+ : memorized.strokeDashoffset, transform: "rotate(".concat(-90, " ").concat(memorized.center, " ").concat(memorized.center, ")") })),
133
+ React__default.default.createElement("div", { className: cn__default.default(styles__default.default.labelWrapper, (_d = {},
134
+ _d[styles__default.default.label] = Icon || IconComplete,
137
135
  _d)) }, children || renderContent())));
138
136
  };
139
137
 
package/cssm/index.js CHANGED
@@ -1,7 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var Component = require('./Component.js');
6
4
  require('react');
7
5
  require('classnames');
package/esm/Component.js CHANGED
@@ -29,7 +29,7 @@ var __assign = function () {
29
29
  return __assign.apply(this, arguments);
30
30
  };
31
31
 
32
- var styles = {"component":"circular-progress-bar__component_eyt2u","svg":"circular-progress-bar__svg_eyt2u","title":"circular-progress-bar__title_eyt2u","subtitle":"circular-progress-bar__subtitle_eyt2u","labelWrapper":"circular-progress-bar__labelWrapper_eyt2u","label":"circular-progress-bar__label_eyt2u","typography":"circular-progress-bar__typography_eyt2u","xxl":"circular-progress-bar__xxl_eyt2u","xl":"circular-progress-bar__xl_eyt2u","l":"circular-progress-bar__l_eyt2u","m":"circular-progress-bar__m_eyt2u","s":"circular-progress-bar__s_eyt2u","xs":"circular-progress-bar__xs_eyt2u","backgroundCircle":"circular-progress-bar__backgroundCircle_eyt2u","progressCircle":"circular-progress-bar__progressCircle_eyt2u","positive":"circular-progress-bar__positive_eyt2u","negative":"circular-progress-bar__negative_eyt2u","stroke":"circular-progress-bar__stroke_eyt2u","bg-positive":"circular-progress-bar__bg-positive_eyt2u","bg-negative":"circular-progress-bar__bg-negative_eyt2u","iconWrapper":"circular-progress-bar__iconWrapper_eyt2u","icon-tertiary":"circular-progress-bar__icon-tertiary_eyt2u","icon-positive":"circular-progress-bar__icon-positive_eyt2u","icon-negative":"circular-progress-bar__icon-negative_eyt2u","icon-primary-inverted":"circular-progress-bar__icon-primary-inverted_eyt2u","icon-primary":"circular-progress-bar__icon-primary_eyt2u","icon-secondary":"circular-progress-bar__icon-secondary_eyt2u","icon":"circular-progress-bar__icon_eyt2u"};
32
+ var styles = {"component":"circular-progress-bar__component_1brjj","svg":"circular-progress-bar__svg_1brjj","title":"circular-progress-bar__title_1brjj","subtitle":"circular-progress-bar__subtitle_1brjj","labelWrapper":"circular-progress-bar__labelWrapper_1brjj","label":"circular-progress-bar__label_1brjj","typography":"circular-progress-bar__typography_1brjj","xxl":"circular-progress-bar__xxl_1brjj","xl":"circular-progress-bar__xl_1brjj","l":"circular-progress-bar__l_1brjj","m":"circular-progress-bar__m_1brjj","s":"circular-progress-bar__s_1brjj","xs":"circular-progress-bar__xs_1brjj","backgroundCircle":"circular-progress-bar__backgroundCircle_1brjj","progressCircle":"circular-progress-bar__progressCircle_1brjj","positive":"circular-progress-bar__positive_1brjj","negative":"circular-progress-bar__negative_1brjj","stroke":"circular-progress-bar__stroke_1brjj","bg-positive":"circular-progress-bar__bg-positive_1brjj","bg-negative":"circular-progress-bar__bg-negative_1brjj","iconWrapper":"circular-progress-bar__iconWrapper_1brjj","icon-tertiary":"circular-progress-bar__icon-tertiary_1brjj","icon-positive":"circular-progress-bar__icon-positive_1brjj","icon-negative":"circular-progress-bar__icon-negative_1brjj","icon-primary-inverted":"circular-progress-bar__icon-primary-inverted_1brjj","icon-primary":"circular-progress-bar__icon-primary_1brjj","icon-secondary":"circular-progress-bar__icon-secondary_1brjj","icon":"circular-progress-bar__icon_1brjj"};
33
33
  require('./index.css')
34
34
 
35
35
  var SIZES = {
@@ -105,8 +105,8 @@ var CircularProgressBar = function (_a) {
105
105
  };
106
106
  var renderIcon = function () {
107
107
  var _a;
108
- return (React.createElement("span", { className: cn(styles.iconWrapper, styles[size], styles.tertiary, styles["icon-" + contentColor], (_a = {},
109
- _a[styles["icon-" + completeIconColor]] = completeIconColor,
108
+ return (React.createElement("span", { className: cn(styles.iconWrapper, styles[size], styles.tertiary, styles["icon-".concat(contentColor)], (_a = {},
109
+ _a[styles["icon-".concat(completeIconColor)]] = completeIconColor,
110
110
  _a)) }, IconComponent && React.createElement(IconComponent, { className: styles.icon })));
111
111
  };
112
112
  var renderContent = function () {
@@ -115,15 +115,15 @@ var CircularProgressBar = function (_a) {
115
115
  SIZES[size] > 64 && renderSubTitle()));
116
116
  };
117
117
  return (React.createElement("div", { className: cn(styles.component, styles[size], className), style: __assign({}, (height && { height: height, width: height })), "data-test-id": dataTestId },
118
- React.createElement("svg", { viewBox: "0 0 " + memorized.widthSVG + " " + memorized.heightSVG, className: styles.svg, xmlns: 'http://www.w3.org/2000/svg' },
118
+ React.createElement("svg", { viewBox: "0 0 ".concat(memorized.widthSVG, " ").concat(memorized.heightSVG), className: styles.svg, xmlns: 'http://www.w3.org/2000/svg' },
119
119
  React.createElement("circle", { className: cn(styles.backgroundCircle, styles[size], (_b = {},
120
120
  _b[styles.stroke] = !stroke,
121
121
  _b)), cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size] }),
122
122
  React.createElement("circle", { className: cn(styles.progressCircle, styles[view], styles[size], (_c = {},
123
- _c[styles["bg-" + view]] = fillComplete && isComplete,
123
+ _c[styles["bg-".concat(view)]] = fillComplete && isComplete,
124
124
  _c)), cx: memorized.center, cy: memorized.center, r: memorized.radius, strokeWidth: STROKE[size], strokeDasharray: memorized.strokeDasharray, strokeDashoffset: direction === 'counter-clockwise'
125
125
  ? -memorized.strokeDashoffset
126
- : memorized.strokeDashoffset, transform: "rotate(" + -90 + " " + memorized.center + " " + memorized.center + ")" })),
126
+ : memorized.strokeDashoffset, transform: "rotate(".concat(-90, " ").concat(memorized.center, " ").concat(memorized.center, ")") })),
127
127
  React.createElement("div", { className: cn(styles.labelWrapper, (_d = {},
128
128
  _d[styles.label] = Icon || IconComplete,
129
129
  _d)) }, children || renderContent())));
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1mk95 */
1
+ /* hash: 1tbp0 */
2
2
  :root {
3
3
  --color-light-bg-tertiary: #e7e9eb;
4
4
  --color-light-graphic-negative: #f15045;
@@ -34,28 +34,28 @@
34
34
  --circular-progress-bar-font-family: var(--font-family-system);
35
35
  --circular-progress-bar-font-weight: 600;
36
36
  }
37
- .circular-progress-bar__component_eyt2u {
37
+ .circular-progress-bar__component_1brjj {
38
38
  position: relative;
39
39
  display: flex;
40
40
  justify-content: center;
41
41
  align-items: center;
42
42
  }
43
- .circular-progress-bar__svg_eyt2u {
43
+ .circular-progress-bar__svg_1brjj {
44
44
  display: block;
45
45
  width: 100%;
46
46
  }
47
- .circular-progress-bar__title_eyt2u,
48
- .circular-progress-bar__subtitle_eyt2u {
47
+ .circular-progress-bar__title_1brjj,
48
+ .circular-progress-bar__subtitle_1brjj {
49
49
  overflow: hidden;
50
50
  word-break: break-word;
51
51
  white-space: nowrap;
52
52
  text-overflow: ellipsis;
53
53
  margin: 0 6px;
54
54
  }
55
- .circular-progress-bar__subtitle_eyt2u {
55
+ .circular-progress-bar__subtitle_1brjj {
56
56
  max-height: 40px;
57
57
  }
58
- .circular-progress-bar__labelWrapper_eyt2u {
58
+ .circular-progress-bar__labelWrapper_1brjj {
59
59
  text-align: center;
60
60
  position: absolute;
61
61
  top: 50%;
@@ -63,150 +63,150 @@
63
63
  width: 100%;
64
64
  transform: translate(-50%, -50%)
65
65
  }
66
- .circular-progress-bar__labelWrapper_eyt2u.circular-progress-bar__label_eyt2u {
66
+ .circular-progress-bar__labelWrapper_1brjj.circular-progress-bar__label_1brjj {
67
67
  display: flex;
68
68
  align-items: center;
69
69
  justify-content: center;
70
70
  }
71
- .circular-progress-bar__typography_eyt2u {
71
+ .circular-progress-bar__typography_1brjj {
72
72
  font-feature-settings: 'ss01';
73
73
  font-weight: var(--circular-progress-bar-font-weight);
74
74
  font-family: var(--circular-progress-bar-font-family);
75
75
  }
76
- .circular-progress-bar__xxl_eyt2u {
76
+ .circular-progress-bar__xxl_1brjj {
77
77
  width: 144px;
78
78
  height: 144px
79
79
  }
80
- .circular-progress-bar__xxl_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
80
+ .circular-progress-bar__xxl_1brjj .circular-progress-bar__labelWrapper_1brjj {
81
81
  max-width: 128px;
82
82
  }
83
- .circular-progress-bar__xxl_eyt2u .circular-progress-bar__title_eyt2u {
83
+ .circular-progress-bar__xxl_1brjj .circular-progress-bar__title_1brjj {
84
84
  max-height: 32px;
85
85
  }
86
- .circular-progress-bar__xl_eyt2u {
86
+ .circular-progress-bar__xl_1brjj {
87
87
  width: 128px;
88
88
  height: 128px
89
89
  }
90
- .circular-progress-bar__xl_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
90
+ .circular-progress-bar__xl_1brjj .circular-progress-bar__labelWrapper_1brjj {
91
91
  max-width: 108px;
92
92
  }
93
- .circular-progress-bar__xl_eyt2u .circular-progress-bar__title_eyt2u {
93
+ .circular-progress-bar__xl_1brjj .circular-progress-bar__title_1brjj {
94
94
  max-height: 32px;
95
95
  }
96
- .circular-progress-bar__l_eyt2u {
96
+ .circular-progress-bar__l_1brjj {
97
97
  width: 80px;
98
98
  height: 80px
99
99
  }
100
- .circular-progress-bar__l_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
100
+ .circular-progress-bar__l_1brjj .circular-progress-bar__labelWrapper_1brjj {
101
101
  max-width: 64px;
102
102
  }
103
- .circular-progress-bar__l_eyt2u .circular-progress-bar__title_eyt2u {
103
+ .circular-progress-bar__l_1brjj .circular-progress-bar__title_1brjj {
104
104
  max-height: 24px;
105
105
  }
106
- .circular-progress-bar__m_eyt2u {
106
+ .circular-progress-bar__m_1brjj {
107
107
  width: 64px;
108
108
  height: 64px
109
109
  }
110
- .circular-progress-bar__m_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
110
+ .circular-progress-bar__m_1brjj .circular-progress-bar__labelWrapper_1brjj {
111
111
  max-width: 48px;
112
112
  }
113
- .circular-progress-bar__m_eyt2u .circular-progress-bar__title_eyt2u {
113
+ .circular-progress-bar__m_1brjj .circular-progress-bar__title_1brjj {
114
114
  max-height: 16px;
115
115
  margin: 0;
116
116
  }
117
- .circular-progress-bar__s_eyt2u {
117
+ .circular-progress-bar__s_1brjj {
118
118
  width: 48px;
119
119
  height: 48px
120
120
  }
121
- .circular-progress-bar__s_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
121
+ .circular-progress-bar__s_1brjj .circular-progress-bar__labelWrapper_1brjj {
122
122
  max-width: 40px;
123
123
  }
124
- .circular-progress-bar__s_eyt2u .circular-progress-bar__title_eyt2u {
124
+ .circular-progress-bar__s_1brjj .circular-progress-bar__title_1brjj {
125
125
  max-height: 16px;
126
126
  margin: 0;
127
127
  }
128
- .circular-progress-bar__xs_eyt2u {
128
+ .circular-progress-bar__xs_1brjj {
129
129
  width: 24px;
130
130
  height: 24px
131
131
  }
132
- .circular-progress-bar__xs_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
132
+ .circular-progress-bar__xs_1brjj .circular-progress-bar__labelWrapper_1brjj {
133
133
  max-width: 24px;
134
134
  }
135
- .circular-progress-bar__backgroundCircle_eyt2u,
136
- .circular-progress-bar__progressCircle_eyt2u {
135
+ .circular-progress-bar__backgroundCircle_1brjj,
136
+ .circular-progress-bar__progressCircle_1brjj {
137
137
  width: 100%;
138
138
  height: 100%;
139
139
  fill: transparent;
140
140
  }
141
- .circular-progress-bar__positive_eyt2u {
141
+ .circular-progress-bar__positive_1brjj {
142
142
  stroke: var(--circular-progress-bar-positive-color);
143
143
  }
144
- .circular-progress-bar__negative_eyt2u {
144
+ .circular-progress-bar__negative_1brjj {
145
145
  stroke: var(--circular-progress-bar-negative-color);
146
146
  }
147
- .circular-progress-bar__backgroundCircle_eyt2u {
147
+ .circular-progress-bar__backgroundCircle_1brjj {
148
148
  stroke: var(--circular-progress-bar-bg-color)
149
149
  }
150
- .circular-progress-bar__backgroundCircle_eyt2u.circular-progress-bar__stroke_eyt2u {
150
+ .circular-progress-bar__backgroundCircle_1brjj.circular-progress-bar__stroke_1brjj {
151
151
  stroke: transparent;
152
152
  }
153
- .circular-progress-bar__progressCircle_eyt2u {
153
+ .circular-progress-bar__progressCircle_1brjj {
154
154
  stroke-linecap: round
155
155
  }
156
- .circular-progress-bar__progressCircle_eyt2u.circular-progress-bar__bg-positive_eyt2u {
156
+ .circular-progress-bar__progressCircle_1brjj.circular-progress-bar__bg-positive_1brjj {
157
157
  fill: var(--circular-progress-bar-positive-color);
158
158
  }
159
- .circular-progress-bar__progressCircle_eyt2u.circular-progress-bar__bg-negative_eyt2u {
159
+ .circular-progress-bar__progressCircle_1brjj.circular-progress-bar__bg-negative_1brjj {
160
160
  fill: var(--circular-progress-bar-negative-color);
161
161
  }
162
- .circular-progress-bar__iconWrapper_eyt2u {
162
+ .circular-progress-bar__iconWrapper_1brjj {
163
163
  display: flex;
164
164
  align-items: center;
165
165
  justify-content: center
166
166
  }
167
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xxl_eyt2u {
167
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xxl_1brjj {
168
168
  max-width: 64px;
169
169
  max-height: 64px;
170
170
  }
171
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xl_eyt2u {
171
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xl_1brjj {
172
172
  max-width: 64px;
173
173
  max-height: 64px;
174
174
  }
175
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__l_eyt2u {
175
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__l_1brjj {
176
176
  max-width: 48px;
177
177
  max-height: 48px;
178
178
  }
179
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__m_eyt2u {
179
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__m_1brjj {
180
180
  max-width: 36px;
181
181
  max-height: 36px;
182
182
  }
183
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__s_eyt2u {
183
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__s_1brjj {
184
184
  max-width: 24px;
185
185
  max-height: 24px;
186
186
  }
187
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xs_eyt2u {
187
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xs_1brjj {
188
188
  max-width: 16px;
189
189
  max-height: 16px;
190
190
  }
191
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-tertiary_eyt2u {
191
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-tertiary_1brjj {
192
192
  color: var(--color-light-graphic-tertiary);
193
193
  }
194
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-positive_eyt2u {
194
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-positive_1brjj {
195
195
  color: var(--color-light-graphic-positive);
196
196
  }
197
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-negative_eyt2u {
197
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-negative_1brjj {
198
198
  color: var(--color-light-graphic-negative);
199
199
  }
200
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-primary-inverted_eyt2u {
200
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-primary-inverted_1brjj {
201
201
  color: var(--color-light-graphic-primary-inverted);
202
202
  }
203
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-primary_eyt2u {
203
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-primary_1brjj {
204
204
  color: var(--color-light-graphic-primary);
205
205
  }
206
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-secondary_eyt2u {
206
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-secondary_1brjj {
207
207
  color: var(--color-light-graphic-secondary);
208
208
  }
209
- .circular-progress-bar__icon_eyt2u {
209
+ .circular-progress-bar__icon_1brjj {
210
210
  width: 100%;
211
211
  height: 100%;
212
212
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1mk95 */
1
+ /* hash: 1tbp0 */
2
2
  :root {
3
3
  --color-light-bg-tertiary: #e7e9eb;
4
4
  --color-light-graphic-negative: #f15045;
@@ -34,28 +34,28 @@
34
34
  --circular-progress-bar-font-family: var(--font-family-system);
35
35
  --circular-progress-bar-font-weight: 600;
36
36
  }
37
- .circular-progress-bar__component_eyt2u {
37
+ .circular-progress-bar__component_1brjj {
38
38
  position: relative;
39
39
  display: flex;
40
40
  justify-content: center;
41
41
  align-items: center;
42
42
  }
43
- .circular-progress-bar__svg_eyt2u {
43
+ .circular-progress-bar__svg_1brjj {
44
44
  display: block;
45
45
  width: 100%;
46
46
  }
47
- .circular-progress-bar__title_eyt2u,
48
- .circular-progress-bar__subtitle_eyt2u {
47
+ .circular-progress-bar__title_1brjj,
48
+ .circular-progress-bar__subtitle_1brjj {
49
49
  overflow: hidden;
50
50
  word-break: break-word;
51
51
  white-space: nowrap;
52
52
  text-overflow: ellipsis;
53
53
  margin: 0 6px;
54
54
  }
55
- .circular-progress-bar__subtitle_eyt2u {
55
+ .circular-progress-bar__subtitle_1brjj {
56
56
  max-height: 40px;
57
57
  }
58
- .circular-progress-bar__labelWrapper_eyt2u {
58
+ .circular-progress-bar__labelWrapper_1brjj {
59
59
  text-align: center;
60
60
  position: absolute;
61
61
  top: 50%;
@@ -63,150 +63,150 @@
63
63
  width: 100%;
64
64
  transform: translate(-50%, -50%)
65
65
  }
66
- .circular-progress-bar__labelWrapper_eyt2u.circular-progress-bar__label_eyt2u {
66
+ .circular-progress-bar__labelWrapper_1brjj.circular-progress-bar__label_1brjj {
67
67
  display: flex;
68
68
  align-items: center;
69
69
  justify-content: center;
70
70
  }
71
- .circular-progress-bar__typography_eyt2u {
71
+ .circular-progress-bar__typography_1brjj {
72
72
  font-feature-settings: 'ss01';
73
73
  font-weight: var(--circular-progress-bar-font-weight);
74
74
  font-family: var(--circular-progress-bar-font-family);
75
75
  }
76
- .circular-progress-bar__xxl_eyt2u {
76
+ .circular-progress-bar__xxl_1brjj {
77
77
  width: 144px;
78
78
  height: 144px
79
79
  }
80
- .circular-progress-bar__xxl_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
80
+ .circular-progress-bar__xxl_1brjj .circular-progress-bar__labelWrapper_1brjj {
81
81
  max-width: 128px;
82
82
  }
83
- .circular-progress-bar__xxl_eyt2u .circular-progress-bar__title_eyt2u {
83
+ .circular-progress-bar__xxl_1brjj .circular-progress-bar__title_1brjj {
84
84
  max-height: 32px;
85
85
  }
86
- .circular-progress-bar__xl_eyt2u {
86
+ .circular-progress-bar__xl_1brjj {
87
87
  width: 128px;
88
88
  height: 128px
89
89
  }
90
- .circular-progress-bar__xl_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
90
+ .circular-progress-bar__xl_1brjj .circular-progress-bar__labelWrapper_1brjj {
91
91
  max-width: 108px;
92
92
  }
93
- .circular-progress-bar__xl_eyt2u .circular-progress-bar__title_eyt2u {
93
+ .circular-progress-bar__xl_1brjj .circular-progress-bar__title_1brjj {
94
94
  max-height: 32px;
95
95
  }
96
- .circular-progress-bar__l_eyt2u {
96
+ .circular-progress-bar__l_1brjj {
97
97
  width: 80px;
98
98
  height: 80px
99
99
  }
100
- .circular-progress-bar__l_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
100
+ .circular-progress-bar__l_1brjj .circular-progress-bar__labelWrapper_1brjj {
101
101
  max-width: 64px;
102
102
  }
103
- .circular-progress-bar__l_eyt2u .circular-progress-bar__title_eyt2u {
103
+ .circular-progress-bar__l_1brjj .circular-progress-bar__title_1brjj {
104
104
  max-height: 24px;
105
105
  }
106
- .circular-progress-bar__m_eyt2u {
106
+ .circular-progress-bar__m_1brjj {
107
107
  width: 64px;
108
108
  height: 64px
109
109
  }
110
- .circular-progress-bar__m_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
110
+ .circular-progress-bar__m_1brjj .circular-progress-bar__labelWrapper_1brjj {
111
111
  max-width: 48px;
112
112
  }
113
- .circular-progress-bar__m_eyt2u .circular-progress-bar__title_eyt2u {
113
+ .circular-progress-bar__m_1brjj .circular-progress-bar__title_1brjj {
114
114
  max-height: 16px;
115
115
  margin: 0;
116
116
  }
117
- .circular-progress-bar__s_eyt2u {
117
+ .circular-progress-bar__s_1brjj {
118
118
  width: 48px;
119
119
  height: 48px
120
120
  }
121
- .circular-progress-bar__s_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
121
+ .circular-progress-bar__s_1brjj .circular-progress-bar__labelWrapper_1brjj {
122
122
  max-width: 40px;
123
123
  }
124
- .circular-progress-bar__s_eyt2u .circular-progress-bar__title_eyt2u {
124
+ .circular-progress-bar__s_1brjj .circular-progress-bar__title_1brjj {
125
125
  max-height: 16px;
126
126
  margin: 0;
127
127
  }
128
- .circular-progress-bar__xs_eyt2u {
128
+ .circular-progress-bar__xs_1brjj {
129
129
  width: 24px;
130
130
  height: 24px
131
131
  }
132
- .circular-progress-bar__xs_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
132
+ .circular-progress-bar__xs_1brjj .circular-progress-bar__labelWrapper_1brjj {
133
133
  max-width: 24px;
134
134
  }
135
- .circular-progress-bar__backgroundCircle_eyt2u,
136
- .circular-progress-bar__progressCircle_eyt2u {
135
+ .circular-progress-bar__backgroundCircle_1brjj,
136
+ .circular-progress-bar__progressCircle_1brjj {
137
137
  width: 100%;
138
138
  height: 100%;
139
139
  fill: transparent;
140
140
  }
141
- .circular-progress-bar__positive_eyt2u {
141
+ .circular-progress-bar__positive_1brjj {
142
142
  stroke: var(--circular-progress-bar-positive-color);
143
143
  }
144
- .circular-progress-bar__negative_eyt2u {
144
+ .circular-progress-bar__negative_1brjj {
145
145
  stroke: var(--circular-progress-bar-negative-color);
146
146
  }
147
- .circular-progress-bar__backgroundCircle_eyt2u {
147
+ .circular-progress-bar__backgroundCircle_1brjj {
148
148
  stroke: var(--circular-progress-bar-bg-color)
149
149
  }
150
- .circular-progress-bar__backgroundCircle_eyt2u.circular-progress-bar__stroke_eyt2u {
150
+ .circular-progress-bar__backgroundCircle_1brjj.circular-progress-bar__stroke_1brjj {
151
151
  stroke: transparent;
152
152
  }
153
- .circular-progress-bar__progressCircle_eyt2u {
153
+ .circular-progress-bar__progressCircle_1brjj {
154
154
  stroke-linecap: round
155
155
  }
156
- .circular-progress-bar__progressCircle_eyt2u.circular-progress-bar__bg-positive_eyt2u {
156
+ .circular-progress-bar__progressCircle_1brjj.circular-progress-bar__bg-positive_1brjj {
157
157
  fill: var(--circular-progress-bar-positive-color);
158
158
  }
159
- .circular-progress-bar__progressCircle_eyt2u.circular-progress-bar__bg-negative_eyt2u {
159
+ .circular-progress-bar__progressCircle_1brjj.circular-progress-bar__bg-negative_1brjj {
160
160
  fill: var(--circular-progress-bar-negative-color);
161
161
  }
162
- .circular-progress-bar__iconWrapper_eyt2u {
162
+ .circular-progress-bar__iconWrapper_1brjj {
163
163
  display: flex;
164
164
  align-items: center;
165
165
  justify-content: center
166
166
  }
167
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xxl_eyt2u {
167
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xxl_1brjj {
168
168
  max-width: 64px;
169
169
  max-height: 64px;
170
170
  }
171
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xl_eyt2u {
171
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xl_1brjj {
172
172
  max-width: 64px;
173
173
  max-height: 64px;
174
174
  }
175
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__l_eyt2u {
175
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__l_1brjj {
176
176
  max-width: 48px;
177
177
  max-height: 48px;
178
178
  }
179
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__m_eyt2u {
179
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__m_1brjj {
180
180
  max-width: 36px;
181
181
  max-height: 36px;
182
182
  }
183
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__s_eyt2u {
183
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__s_1brjj {
184
184
  max-width: 24px;
185
185
  max-height: 24px;
186
186
  }
187
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xs_eyt2u {
187
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xs_1brjj {
188
188
  max-width: 16px;
189
189
  max-height: 16px;
190
190
  }
191
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-tertiary_eyt2u {
191
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-tertiary_1brjj {
192
192
  color: var(--color-light-graphic-tertiary);
193
193
  }
194
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-positive_eyt2u {
194
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-positive_1brjj {
195
195
  color: var(--color-light-graphic-positive);
196
196
  }
197
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-negative_eyt2u {
197
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-negative_1brjj {
198
198
  color: var(--color-light-graphic-negative);
199
199
  }
200
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-primary-inverted_eyt2u {
200
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-primary-inverted_1brjj {
201
201
  color: var(--color-light-graphic-primary-inverted);
202
202
  }
203
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-primary_eyt2u {
203
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-primary_1brjj {
204
204
  color: var(--color-light-graphic-primary);
205
205
  }
206
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-secondary_eyt2u {
206
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-secondary_1brjj {
207
207
  color: var(--color-light-graphic-secondary);
208
208
  }
209
- .circular-progress-bar__icon_eyt2u {
209
+ .circular-progress-bar__icon_1brjj {
210
210
  width: 100%;
211
211
  height: 100%;
212
212
  }
package/index.js CHANGED
@@ -1,7 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var Component = require('./Component.js');
6
4
  require('react');
7
5
  require('classnames');
package/modern/Component.js CHANGED
@@ -2,7 +2,7 @@ import React, { useMemo } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { Typography } from '@alfalab/core-components-typography/modern';
4
4
 
5
- var styles = {"component":"circular-progress-bar__component_eyt2u","svg":"circular-progress-bar__svg_eyt2u","title":"circular-progress-bar__title_eyt2u","subtitle":"circular-progress-bar__subtitle_eyt2u","labelWrapper":"circular-progress-bar__labelWrapper_eyt2u","label":"circular-progress-bar__label_eyt2u","typography":"circular-progress-bar__typography_eyt2u","xxl":"circular-progress-bar__xxl_eyt2u","xl":"circular-progress-bar__xl_eyt2u","l":"circular-progress-bar__l_eyt2u","m":"circular-progress-bar__m_eyt2u","s":"circular-progress-bar__s_eyt2u","xs":"circular-progress-bar__xs_eyt2u","backgroundCircle":"circular-progress-bar__backgroundCircle_eyt2u","progressCircle":"circular-progress-bar__progressCircle_eyt2u","positive":"circular-progress-bar__positive_eyt2u","negative":"circular-progress-bar__negative_eyt2u","stroke":"circular-progress-bar__stroke_eyt2u","bg-positive":"circular-progress-bar__bg-positive_eyt2u","bg-negative":"circular-progress-bar__bg-negative_eyt2u","iconWrapper":"circular-progress-bar__iconWrapper_eyt2u","icon-tertiary":"circular-progress-bar__icon-tertiary_eyt2u","icon-positive":"circular-progress-bar__icon-positive_eyt2u","icon-negative":"circular-progress-bar__icon-negative_eyt2u","icon-primary-inverted":"circular-progress-bar__icon-primary-inverted_eyt2u","icon-primary":"circular-progress-bar__icon-primary_eyt2u","icon-secondary":"circular-progress-bar__icon-secondary_eyt2u","icon":"circular-progress-bar__icon_eyt2u"};
5
+ const styles = {"component":"circular-progress-bar__component_1brjj","svg":"circular-progress-bar__svg_1brjj","title":"circular-progress-bar__title_1brjj","subtitle":"circular-progress-bar__subtitle_1brjj","labelWrapper":"circular-progress-bar__labelWrapper_1brjj","label":"circular-progress-bar__label_1brjj","typography":"circular-progress-bar__typography_1brjj","xxl":"circular-progress-bar__xxl_1brjj","xl":"circular-progress-bar__xl_1brjj","l":"circular-progress-bar__l_1brjj","m":"circular-progress-bar__m_1brjj","s":"circular-progress-bar__s_1brjj","xs":"circular-progress-bar__xs_1brjj","backgroundCircle":"circular-progress-bar__backgroundCircle_1brjj","progressCircle":"circular-progress-bar__progressCircle_1brjj","positive":"circular-progress-bar__positive_1brjj","negative":"circular-progress-bar__negative_1brjj","stroke":"circular-progress-bar__stroke_1brjj","bg-positive":"circular-progress-bar__bg-positive_1brjj","bg-negative":"circular-progress-bar__bg-negative_1brjj","iconWrapper":"circular-progress-bar__iconWrapper_1brjj","icon-tertiary":"circular-progress-bar__icon-tertiary_1brjj","icon-positive":"circular-progress-bar__icon-positive_1brjj","icon-negative":"circular-progress-bar__icon-negative_1brjj","icon-primary-inverted":"circular-progress-bar__icon-primary-inverted_1brjj","icon-primary":"circular-progress-bar__icon-primary_1brjj","icon-secondary":"circular-progress-bar__icon-secondary_1brjj","icon":"circular-progress-bar__icon_1brjj"};
6
6
  require('./index.css')
7
7
 
8
8
  const SIZES = {
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1mk95 */
1
+ /* hash: 1tbp0 */
2
2
  :root {
3
3
  --color-light-bg-tertiary: #e7e9eb;
4
4
  --color-light-graphic-negative: #f15045;
@@ -34,28 +34,28 @@
34
34
  --circular-progress-bar-font-family: var(--font-family-system);
35
35
  --circular-progress-bar-font-weight: 600;
36
36
  }
37
- .circular-progress-bar__component_eyt2u {
37
+ .circular-progress-bar__component_1brjj {
38
38
  position: relative;
39
39
  display: flex;
40
40
  justify-content: center;
41
41
  align-items: center;
42
42
  }
43
- .circular-progress-bar__svg_eyt2u {
43
+ .circular-progress-bar__svg_1brjj {
44
44
  display: block;
45
45
  width: 100%;
46
46
  }
47
- .circular-progress-bar__title_eyt2u,
48
- .circular-progress-bar__subtitle_eyt2u {
47
+ .circular-progress-bar__title_1brjj,
48
+ .circular-progress-bar__subtitle_1brjj {
49
49
  overflow: hidden;
50
50
  word-break: break-word;
51
51
  white-space: nowrap;
52
52
  text-overflow: ellipsis;
53
53
  margin: 0 6px;
54
54
  }
55
- .circular-progress-bar__subtitle_eyt2u {
55
+ .circular-progress-bar__subtitle_1brjj {
56
56
  max-height: 40px;
57
57
  }
58
- .circular-progress-bar__labelWrapper_eyt2u {
58
+ .circular-progress-bar__labelWrapper_1brjj {
59
59
  text-align: center;
60
60
  position: absolute;
61
61
  top: 50%;
@@ -63,150 +63,150 @@
63
63
  width: 100%;
64
64
  transform: translate(-50%, -50%)
65
65
  }
66
- .circular-progress-bar__labelWrapper_eyt2u.circular-progress-bar__label_eyt2u {
66
+ .circular-progress-bar__labelWrapper_1brjj.circular-progress-bar__label_1brjj {
67
67
  display: flex;
68
68
  align-items: center;
69
69
  justify-content: center;
70
70
  }
71
- .circular-progress-bar__typography_eyt2u {
71
+ .circular-progress-bar__typography_1brjj {
72
72
  font-feature-settings: 'ss01';
73
73
  font-weight: var(--circular-progress-bar-font-weight);
74
74
  font-family: var(--circular-progress-bar-font-family);
75
75
  }
76
- .circular-progress-bar__xxl_eyt2u {
76
+ .circular-progress-bar__xxl_1brjj {
77
77
  width: 144px;
78
78
  height: 144px
79
79
  }
80
- .circular-progress-bar__xxl_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
80
+ .circular-progress-bar__xxl_1brjj .circular-progress-bar__labelWrapper_1brjj {
81
81
  max-width: 128px;
82
82
  }
83
- .circular-progress-bar__xxl_eyt2u .circular-progress-bar__title_eyt2u {
83
+ .circular-progress-bar__xxl_1brjj .circular-progress-bar__title_1brjj {
84
84
  max-height: 32px;
85
85
  }
86
- .circular-progress-bar__xl_eyt2u {
86
+ .circular-progress-bar__xl_1brjj {
87
87
  width: 128px;
88
88
  height: 128px
89
89
  }
90
- .circular-progress-bar__xl_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
90
+ .circular-progress-bar__xl_1brjj .circular-progress-bar__labelWrapper_1brjj {
91
91
  max-width: 108px;
92
92
  }
93
- .circular-progress-bar__xl_eyt2u .circular-progress-bar__title_eyt2u {
93
+ .circular-progress-bar__xl_1brjj .circular-progress-bar__title_1brjj {
94
94
  max-height: 32px;
95
95
  }
96
- .circular-progress-bar__l_eyt2u {
96
+ .circular-progress-bar__l_1brjj {
97
97
  width: 80px;
98
98
  height: 80px
99
99
  }
100
- .circular-progress-bar__l_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
100
+ .circular-progress-bar__l_1brjj .circular-progress-bar__labelWrapper_1brjj {
101
101
  max-width: 64px;
102
102
  }
103
- .circular-progress-bar__l_eyt2u .circular-progress-bar__title_eyt2u {
103
+ .circular-progress-bar__l_1brjj .circular-progress-bar__title_1brjj {
104
104
  max-height: 24px;
105
105
  }
106
- .circular-progress-bar__m_eyt2u {
106
+ .circular-progress-bar__m_1brjj {
107
107
  width: 64px;
108
108
  height: 64px
109
109
  }
110
- .circular-progress-bar__m_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
110
+ .circular-progress-bar__m_1brjj .circular-progress-bar__labelWrapper_1brjj {
111
111
  max-width: 48px;
112
112
  }
113
- .circular-progress-bar__m_eyt2u .circular-progress-bar__title_eyt2u {
113
+ .circular-progress-bar__m_1brjj .circular-progress-bar__title_1brjj {
114
114
  max-height: 16px;
115
115
  margin: 0;
116
116
  }
117
- .circular-progress-bar__s_eyt2u {
117
+ .circular-progress-bar__s_1brjj {
118
118
  width: 48px;
119
119
  height: 48px
120
120
  }
121
- .circular-progress-bar__s_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
121
+ .circular-progress-bar__s_1brjj .circular-progress-bar__labelWrapper_1brjj {
122
122
  max-width: 40px;
123
123
  }
124
- .circular-progress-bar__s_eyt2u .circular-progress-bar__title_eyt2u {
124
+ .circular-progress-bar__s_1brjj .circular-progress-bar__title_1brjj {
125
125
  max-height: 16px;
126
126
  margin: 0;
127
127
  }
128
- .circular-progress-bar__xs_eyt2u {
128
+ .circular-progress-bar__xs_1brjj {
129
129
  width: 24px;
130
130
  height: 24px
131
131
  }
132
- .circular-progress-bar__xs_eyt2u .circular-progress-bar__labelWrapper_eyt2u {
132
+ .circular-progress-bar__xs_1brjj .circular-progress-bar__labelWrapper_1brjj {
133
133
  max-width: 24px;
134
134
  }
135
- .circular-progress-bar__backgroundCircle_eyt2u,
136
- .circular-progress-bar__progressCircle_eyt2u {
135
+ .circular-progress-bar__backgroundCircle_1brjj,
136
+ .circular-progress-bar__progressCircle_1brjj {
137
137
  width: 100%;
138
138
  height: 100%;
139
139
  fill: transparent;
140
140
  }
141
- .circular-progress-bar__positive_eyt2u {
141
+ .circular-progress-bar__positive_1brjj {
142
142
  stroke: var(--circular-progress-bar-positive-color);
143
143
  }
144
- .circular-progress-bar__negative_eyt2u {
144
+ .circular-progress-bar__negative_1brjj {
145
145
  stroke: var(--circular-progress-bar-negative-color);
146
146
  }
147
- .circular-progress-bar__backgroundCircle_eyt2u {
147
+ .circular-progress-bar__backgroundCircle_1brjj {
148
148
  stroke: var(--circular-progress-bar-bg-color)
149
149
  }
150
- .circular-progress-bar__backgroundCircle_eyt2u.circular-progress-bar__stroke_eyt2u {
150
+ .circular-progress-bar__backgroundCircle_1brjj.circular-progress-bar__stroke_1brjj {
151
151
  stroke: transparent;
152
152
  }
153
- .circular-progress-bar__progressCircle_eyt2u {
153
+ .circular-progress-bar__progressCircle_1brjj {
154
154
  stroke-linecap: round
155
155
  }
156
- .circular-progress-bar__progressCircle_eyt2u.circular-progress-bar__bg-positive_eyt2u {
156
+ .circular-progress-bar__progressCircle_1brjj.circular-progress-bar__bg-positive_1brjj {
157
157
  fill: var(--circular-progress-bar-positive-color);
158
158
  }
159
- .circular-progress-bar__progressCircle_eyt2u.circular-progress-bar__bg-negative_eyt2u {
159
+ .circular-progress-bar__progressCircle_1brjj.circular-progress-bar__bg-negative_1brjj {
160
160
  fill: var(--circular-progress-bar-negative-color);
161
161
  }
162
- .circular-progress-bar__iconWrapper_eyt2u {
162
+ .circular-progress-bar__iconWrapper_1brjj {
163
163
  display: flex;
164
164
  align-items: center;
165
165
  justify-content: center
166
166
  }
167
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xxl_eyt2u {
167
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xxl_1brjj {
168
168
  max-width: 64px;
169
169
  max-height: 64px;
170
170
  }
171
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xl_eyt2u {
171
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xl_1brjj {
172
172
  max-width: 64px;
173
173
  max-height: 64px;
174
174
  }
175
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__l_eyt2u {
175
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__l_1brjj {
176
176
  max-width: 48px;
177
177
  max-height: 48px;
178
178
  }
179
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__m_eyt2u {
179
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__m_1brjj {
180
180
  max-width: 36px;
181
181
  max-height: 36px;
182
182
  }
183
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__s_eyt2u {
183
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__s_1brjj {
184
184
  max-width: 24px;
185
185
  max-height: 24px;
186
186
  }
187
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__xs_eyt2u {
187
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__xs_1brjj {
188
188
  max-width: 16px;
189
189
  max-height: 16px;
190
190
  }
191
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-tertiary_eyt2u {
191
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-tertiary_1brjj {
192
192
  color: var(--color-light-graphic-tertiary);
193
193
  }
194
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-positive_eyt2u {
194
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-positive_1brjj {
195
195
  color: var(--color-light-graphic-positive);
196
196
  }
197
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-negative_eyt2u {
197
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-negative_1brjj {
198
198
  color: var(--color-light-graphic-negative);
199
199
  }
200
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-primary-inverted_eyt2u {
200
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-primary-inverted_1brjj {
201
201
  color: var(--color-light-graphic-primary-inverted);
202
202
  }
203
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-primary_eyt2u {
203
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-primary_1brjj {
204
204
  color: var(--color-light-graphic-primary);
205
205
  }
206
- .circular-progress-bar__iconWrapper_eyt2u.circular-progress-bar__icon-secondary_eyt2u {
206
+ .circular-progress-bar__iconWrapper_1brjj.circular-progress-bar__icon-secondary_1brjj {
207
207
  color: var(--color-light-graphic-secondary);
208
208
  }
209
- .circular-progress-bar__icon_eyt2u {
209
+ .circular-progress-bar__icon_1brjj {
210
210
  width: 100%;
211
211
  height: 100%;
212
212
  }
package/modern/index.js CHANGED
@@ -1,4 +1,4 @@
1
+ export { CircularProgressBar } from './Component.js';
1
2
  import 'react';
2
3
  import 'classnames';
3
4
  import '@alfalab/core-components-typography/modern';
4
- export { CircularProgressBar } from './Component.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-circular-progress-bar",
3
- "version": "3.0.6",
3
+ "version": "3.0.8",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -14,7 +14,7 @@
14
14
  "directory": "dist"
15
15
  },
16
16
  "dependencies": {
17
- "@alfalab/core-components-typography": "^3.0.6",
17
+ "@alfalab/core-components-typography": "^3.0.8",
18
18
  "classnames": "^2.3.1"
19
19
  },
20
20
  "peerDependencies": {