carbon-react 111.22.3 → 111.22.4

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 (3) hide show
  1. package/esm/components/progress-tracker/progress-tracker.component.js +18 -9
  2. package/lib/components/progress-tracker/progress-tracker.component.js +20 -9
  3. package/package.json +1 -1
package/esm/components/progress-tracker/progress-tracker.component.js CHANGED
@@ -7,6 +7,8 @@ import tagComponent from "../../__internal__/utils/helpers/tags";
7
7
  import { filterStyledSystemMarginProps } from "../../style/utils";
8
8
  import { StyledProgressBar, InnerBar, StyledValuesLabel, StyledProgressTracker, StyledValue } from "./progress-tracker.style";
9
9
  import useResizeObserver from "../../hooks/__internal__/useResizeObserver";
10
+ import Logger from "../../__internal__/utils/logger";
11
+ let deprecatedWarningTriggered = false;
10
12
  const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
11
13
 
12
14
  const ProgressTracker = ({
@@ -22,25 +24,32 @@ const ProgressTracker = ({
22
24
  showDefaultLabels = false,
23
25
  currentProgressLabel,
24
26
  maxProgressLabel,
25
- orientation = "horizontal",
26
- direction = "up",
27
+ orientation,
28
+ direction,
27
29
  labelsPosition,
28
30
  ...rest
29
31
  }) => {
32
+ if (!deprecatedWarningTriggered && (orientation || direction)) {
33
+ deprecatedWarningTriggered = true;
34
+ Logger.deprecate("The `orientation` and `direction` props in `ProgressTracker` component are deprecated and will soon be removed.");
35
+ }
36
+
37
+ const internalOrientation = orientation || "horizontal";
38
+ const internalDirection = direction || "up";
30
39
  const barRef = useRef();
31
40
  const [barLength, setBarLength] = useState(0);
32
- const isVertical = orientation === "vertical";
41
+ const isVertical = internalOrientation === "vertical";
33
42
  const prefixLabels = !isVertical && labelsPosition !== "bottom" || isVertical && labelsPosition === "left";
34
43
  const updateBarLength = useCallback(() => {
35
- if (orientation === "horizontal") {
44
+ if (internalOrientation === "horizontal") {
36
45
  setBarLength(`${barRef.current.offsetWidth}px`);
37
46
  } else {
38
47
  setBarLength(`${barRef.current.offsetHeight}px`);
39
48
  }
40
- }, [barRef, orientation]);
49
+ }, [barRef, internalOrientation]);
41
50
  useLayoutEffect(() => {
42
51
  updateBarLength();
43
- }, [barRef, orientation, updateBarLength]);
52
+ }, [barRef, internalOrientation, updateBarLength]);
44
53
  useResizeObserver(barRef, () => {
45
54
  updateBarLength();
46
55
  });
@@ -61,9 +70,9 @@ const ProgressTracker = ({
61
70
  return /*#__PURE__*/React.createElement(StyledValuesLabel, {
62
71
  position: labelsPosition,
63
72
  isVertical: isVertical
64
- }, isVertical && direction === "up" && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledValue, {
73
+ }, isVertical && internalDirection === "up" && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledValue, {
65
74
  isMaxValue: true
66
- }, label(maxProgressLabel, "100%")), /*#__PURE__*/React.createElement(StyledValue, null, label(currentProgressLabel, `${progress}%`))), (direction === "down" || !isVertical) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledValue, null, label(currentProgressLabel, `${progress}%`)), /*#__PURE__*/React.createElement(StyledValue, {
75
+ }, label(maxProgressLabel, "100%")), /*#__PURE__*/React.createElement(StyledValue, null, label(currentProgressLabel, `${progress}%`))), (internalDirection === "down" || !isVertical) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledValue, null, label(currentProgressLabel, `${progress}%`)), /*#__PURE__*/React.createElement(StyledValue, {
67
76
  isMaxValue: true
68
77
  }, label(maxProgressLabel, "100%"))));
69
78
  };
@@ -82,7 +91,7 @@ const ProgressTracker = ({
82
91
  "aria-valuemax": ariaValueMax,
83
92
  "aria-valuetext": ariaValueText
84
93
  }), prefixLabels && renderValueLabels(), /*#__PURE__*/React.createElement(StyledProgressBar, {
85
- direction: isVertical ? direction : undefined,
94
+ direction: isVertical ? internalDirection : undefined,
86
95
  isVertical: isVertical,
87
96
  size: size,
88
97
  ref: barRef
package/lib/components/progress-tracker/progress-tracker.component.js CHANGED
@@ -19,6 +19,8 @@ var _progressTracker = require("./progress-tracker.style");
19
19
 
20
20
  var _useResizeObserver = _interopRequireDefault(require("../../hooks/__internal__/useResizeObserver"));
21
21
 
22
+ var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
23
+
22
24
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
25
 
24
26
  function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -27,6 +29,7 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
27
29
 
28
30
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
29
31
 
32
+ let deprecatedWarningTriggered = false;
30
33
  const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
31
34
 
32
35
  const ProgressTracker = ({
@@ -42,25 +45,33 @@ const ProgressTracker = ({
42
45
  showDefaultLabels = false,
43
46
  currentProgressLabel,
44
47
  maxProgressLabel,
45
- orientation = "horizontal",
46
- direction = "up",
48
+ orientation,
49
+ direction,
47
50
  labelsPosition,
48
51
  ...rest
49
52
  }) => {
53
+ if (!deprecatedWarningTriggered && (orientation || direction)) {
54
+ deprecatedWarningTriggered = true;
55
+
56
+ _logger.default.deprecate("The `orientation` and `direction` props in `ProgressTracker` component are deprecated and will soon be removed.");
57
+ }
58
+
59
+ const internalOrientation = orientation || "horizontal";
60
+ const internalDirection = direction || "up";
50
61
  const barRef = (0, _react.useRef)();
51
62
  const [barLength, setBarLength] = (0, _react.useState)(0);
52
- const isVertical = orientation === "vertical";
63
+ const isVertical = internalOrientation === "vertical";
53
64
  const prefixLabels = !isVertical && labelsPosition !== "bottom" || isVertical && labelsPosition === "left";
54
65
  const updateBarLength = (0, _react.useCallback)(() => {
55
- if (orientation === "horizontal") {
66
+ if (internalOrientation === "horizontal") {
56
67
  setBarLength(`${barRef.current.offsetWidth}px`);
57
68
  } else {
58
69
  setBarLength(`${barRef.current.offsetHeight}px`);
59
70
  }
60
- }, [barRef, orientation]);
71
+ }, [barRef, internalOrientation]);
61
72
  (0, _react.useLayoutEffect)(() => {
62
73
  updateBarLength();
63
- }, [barRef, orientation, updateBarLength]);
74
+ }, [barRef, internalOrientation, updateBarLength]);
64
75
  (0, _useResizeObserver.default)(barRef, () => {
65
76
  updateBarLength();
66
77
  });
@@ -81,9 +92,9 @@ const ProgressTracker = ({
81
92
  return /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValuesLabel, {
82
93
  position: labelsPosition,
83
94
  isVertical: isVertical
84
- }, isVertical && direction === "up" && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, {
95
+ }, isVertical && internalDirection === "up" && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, {
85
96
  isMaxValue: true
86
- }, label(maxProgressLabel, "100%")), /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, null, label(currentProgressLabel, `${progress}%`))), (direction === "down" || !isVertical) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, null, label(currentProgressLabel, `${progress}%`)), /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, {
97
+ }, label(maxProgressLabel, "100%")), /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, null, label(currentProgressLabel, `${progress}%`))), (internalDirection === "down" || !isVertical) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, null, label(currentProgressLabel, `${progress}%`)), /*#__PURE__*/_react.default.createElement(_progressTracker.StyledValue, {
87
98
  isMaxValue: true
88
99
  }, label(maxProgressLabel, "100%"))));
89
100
  };
@@ -102,7 +113,7 @@ const ProgressTracker = ({
102
113
  "aria-valuemax": ariaValueMax,
103
114
  "aria-valuetext": ariaValueText
104
115
  }), prefixLabels && renderValueLabels(), /*#__PURE__*/_react.default.createElement(_progressTracker.StyledProgressBar, {
105
- direction: isVertical ? direction : undefined,
116
+ direction: isVertical ? internalDirection : undefined,
106
117
  isVertical: isVertical,
107
118
  size: size,
108
119
  ref: barRef
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "111.22.3",
3
+ "version": "111.22.4",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "files": [
6
6
  "lib",