@atlaskit/progress-tracker 8.6.2 → 8.6.3

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/progress-tracker
 
+## 8.6.3
+
+### Patch Changes
+
+- [#102669](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/102669)
+  [`57f9d0819e9e6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/57f9d0819e9e6) -
+  Internal change only. Update spacing to use logical properties and tokenise typography values.
+
 ## 8.6.2
 
 ### Patch Changes
@@ -20,7 +28,7 @@
 
 - [#99069](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/99069)
   [`609d5a37c656`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/609d5a37c656) -
-  Add support for React 18.
+  Add support for React 18 in non-strict mode.
 
 ## 8.5.11
 

package/README.md

@@ -10,4 +10,5 @@ yarn add @atlaskit/progress-tracker
 
 ## Usage
 
-Detailed docs and example usage can be found [here](https://atlassian.design/components/progress-tracker/).
+Detailed docs and example usage can be found
+[here](https://atlassian.design/components/progress-tracker/).

package/dist/cjs/internal/bar.js

@@ -9,17 +9,23 @@ var _colors = require("@atlaskit/theme/colors");
 var _constants = require("../constants");
 var _constants2 = require("./constants");
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 var progressBarStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: _constants2.PROGRESS_BAR_HEIGHT,
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  left: '50%',
   backgroundColor: "var(--ds-background-brand-bold, ".concat(_colors.B300, ")"),
-  borderBottomRightRadius: _constants2.PROGRESS_BAR_HEIGHT,
-  borderTopRightRadius: _constants2.PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  borderEndEndRadius: _constants2.PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  borderStartEndRadius: _constants2.PROGRESS_BAR_HEIGHT,
+  insetInlineStart: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transform: "translate(0, calc(-1 * ".concat(_constants2.LABEL_TOP_SPACING, "))"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transition: "width var(".concat(_constants2.varTransitionSpeed, ") var(").concat(_constants2.varTransitionEasing, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transitionDelay: "var(".concat(_constants2.varTransitionDelay, ")")
 });
 
@@ -35,7 +41,9 @@ var ProgressBar = function ProgressBar(_ref) {
   return (0, _react.jsx)("div", {
     "data-testid": testId,
     style: {
-      width: "calc(".concat(percentageComplete, "% + ").concat(percentageComplete / 100, " * calc(var(").concat(_constants2.varSpacing, ", ").concat(_constants.spacing.cosy, ") + ").concat(_constants2.HALF_GRID_SIZE, "))")
+      width: "calc(".concat(percentageComplete, "% + ").concat(percentageComplete / 100
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      , " * calc(var(").concat(_constants2.varSpacing, ", ").concat(_constants.spacing.cosy, ") + ").concat(_constants2.HALF_GRID_SIZE, "))")
     },
     css: progressBarStyles
   });

package/dist/cjs/internal/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.varTransitionSpeed = exports.varTransitionEasing = exports.varTransitionDelay = exports.varSpacing = exports.varMarkerColor = exports.varBackgroundColor = exports.TRANSITION_SPEED = exports.SEMI_BOLD_FONT_WEIGHT = exports.REGULAR_FONT_WEIGHT = exports.PROGRESS_BAR_HEIGHT = exports.LINEAR_TRANSITION_SPEED = exports.LABEL_TOP_SPACING = exports.HALF_GRID_SIZE = exports.ANIMATION_EASE_OUT = void 0;
+exports.varTransitionSpeed = exports.varTransitionEasing = exports.varTransitionDelay = exports.varSpacing = exports.varMarkerColor = exports.varBackgroundColor = exports.TRANSITION_SPEED = exports.PROGRESS_BAR_HEIGHT = exports.LINEAR_TRANSITION_SPEED = exports.LABEL_TOP_SPACING = exports.HALF_GRID_SIZE = exports.ANIMATION_EASE_OUT = void 0;
 var TRANSITION_SPEED = exports.TRANSITION_SPEED = 300;
 var LINEAR_TRANSITION_SPEED = exports.LINEAR_TRANSITION_SPEED = 50;
 var ANIMATION_EASE_OUT = exports.ANIMATION_EASE_OUT = 'cubic-bezier(0.15,1,0.3,1)';
@@ -13,10 +13,9 @@ var varTransitionDelay = exports.varTransitionDelay = '--ds--pt--td';
 var varTransitionEasing = exports.varTransitionEasing = '--ds--pt--te';
 var varMarkerColor = exports.varMarkerColor = '--ds--pt--mc';
 var varBackgroundColor = exports.varBackgroundColor = '--ds--pt--bg';
-var REGULAR_FONT_WEIGHT = exports.REGULAR_FONT_WEIGHT = "var(--ds-font-weight-regular, 400)";
-var SEMI_BOLD_FONT_WEIGHT = exports.SEMI_BOLD_FONT_WEIGHT = "var(--ds-font-weight-semibold, 600)";
 var HALF_GRID_SIZE = exports.HALF_GRID_SIZE = "var(--ds-space-050, 4px)";
 var PROGRESS_BAR_HEIGHT = exports.PROGRESS_BAR_HEIGHT = "var(--ds-space-100, 8px)";
 
-// Labels sit 16px from bottom of progress bar i.e. 8 + 16
-var LABEL_TOP_SPACING = exports.LABEL_TOP_SPACING = "var(--ds-space-300, 24px)";
+// Labels sit 16px from bottom of progress bar
+// i.e. 8 (bar height) + 16 - 4 (line height 24->20 in PYX-695) = 20px
+var LABEL_TOP_SPACING = exports.LABEL_TOP_SPACING = "var(--ds-space-250, 20px)";

package/dist/cjs/internal/link.js

@@ -8,6 +8,8 @@ var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var linkStyles = (0, _react.css)({
   color: "var(--ds-text, ".concat(_colors.N800, ")"),
   cursor: 'pointer'

package/dist/cjs/internal/marker.js

@@ -9,27 +9,41 @@ var _constants = require("./constants");
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var progressMarkerStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   width: _constants.PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: _constants.PROGRESS_BAR_HEIGHT,
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  left: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   backgroundColor: "var(".concat(_constants.varBackgroundColor, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   borderRadius: _constants.PROGRESS_BAR_HEIGHT,
+  insetInlineStart: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transform: "translate(-50%, calc(-1 * ".concat(_constants.LABEL_TOP_SPACING, "))"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transition: "opacity var(".concat(_constants.varTransitionSpeed, ") var(").concat(_constants.varTransitionEasing, "), background-color var(").concat(_constants.varTransitionSpeed, ") var(").concat(_constants.varTransitionEasing, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transitionDelay: "var(".concat(_constants.varTransitionDelay, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear': {
     opacity: 0.01
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear.fade-appear-active': {
     opacity: 1
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-enter': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: "var(".concat(_constants.varMarkerColor, ")")
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-enter.fade-enter-active': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: "var(".concat(_constants.varBackgroundColor, ")")
   }
 });

package/dist/cjs/internal/stage.js

@@ -23,7 +23,7 @@ var _utils = require("./utils");
 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; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/no-nested-styles */ /** @jsx jsx */
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/no-nested-styles */ /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var listItemContentStyles = (0, _primitives.xcss)({
   width: '100%',
   position: 'relative'
@@ -33,23 +33,20 @@ var listItemStyles = (0, _react2.css)({
   overflowWrap: 'break-word'
 });
 var titleStyles = (0, _react2.css)({
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginTop: _constants.LABEL_TOP_SPACING,
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  lineHeight: '16px',
+  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+  marginBlockStart: _constants.LABEL_TOP_SPACING,
   textAlign: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear': {
     opacity: 0.01
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear.fade-appear-active': {
     opacity: 1,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     transition: "opacity var(".concat(_constants.varTransitionSpeed, ") cubic-bezier(0.2, 0, 0, 1)")
   }
 });
-var textStyles = (0, _react2.css)({
-  fontSize: '14px',
-  lineHeight: '16px'
-});
 var ProgressTrackerStage = exports.default = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(ProgressTrackerStage, _PureComponent);
   var _super = _createSuper(ProgressTrackerStage);
@@ -136,9 +133,7 @@ var ProgressTrackerStage = exports.default = /*#__PURE__*/function (_PureCompone
         timeout: transitionDelay + transitionSpeed,
         classNames: "fade"
       }, (0, _react2.jsx)("div", {
-        css: titleStyles
-      }, (0, _react2.jsx)("span", {
-        css: textStyles,
+        css: titleStyles,
         style: {
           color: (0, _utils.getTextColor)(item.status),
           fontWeight: (0, _utils.getFontWeight)(item.status)
@@ -146,7 +141,7 @@ var ProgressTrackerStage = exports.default = /*#__PURE__*/function (_PureCompone
         "data-testid": testId && "".concat(testId, "-title")
       }, this.shouldShowLink() ? render.link({
         item: item
-      }) : item.label)))));
+      }) : item.label))));
     }
   }]);
   return ProgressTrackerStage;

package/dist/cjs/internal/utils.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getTextColor = exports.getMarkerColor = exports.getFontWeight = void 0;
 var _colors = require("@atlaskit/theme/colors");
-var _constants = require("./constants");
 var getMarkerColor = exports.getMarkerColor = function getMarkerColor(status) {
   switch (status) {
     case 'unvisited':
@@ -35,11 +34,11 @@ var getTextColor = exports.getTextColor = function getTextColor(status) {
 var getFontWeight = exports.getFontWeight = function getFontWeight(status) {
   switch (status) {
     case 'unvisited':
-      return _constants.REGULAR_FONT_WEIGHT;
+      return "var(--ds-font-weight-regular, 400)";
     case 'current':
     case 'visited':
     case 'disabled':
-      return _constants.SEMI_BOLD_FONT_WEIGHT;
+      return "var(--ds-font-weight-semibold, 600)";
     default:
       return undefined;
   }

package/dist/cjs/progress-tracker.js

@@ -21,16 +21,17 @@ var _stage = _interopRequireDefault(require("./internal/stage"));
 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; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/no-nested-styles */ /** @jsx jsx */
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/no-nested-styles */ /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var containerStyles = (0, _react2.css)({
   display: 'grid',
   width: '100%',
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   margin: '0 auto',
   padding: "var(--ds-space-0, 0px)",
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   gap: "var(".concat(_constants2.varSpacing, ")"),
   listStyleType: 'none',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&&': {
     marginBlockStart: "var(--ds-space-500, 40px)"
   }

package/dist/es2019/internal/bar.js

@@ -1,18 +1,24 @@
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { B300 } from '@atlaskit/theme/colors';
 import { spacing } from '../constants';
 import { HALF_GRID_SIZE, LABEL_TOP_SPACING, PROGRESS_BAR_HEIGHT, varSpacing, varTransitionDelay, varTransitionEasing, varTransitionSpeed } from './constants';
 const progressBarStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: PROGRESS_BAR_HEIGHT,
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  left: '50%',
   backgroundColor: `var(--ds-background-brand-bold, ${B300})`,
-  borderBottomRightRadius: PROGRESS_BAR_HEIGHT,
-  borderTopRightRadius: PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  borderEndEndRadius: PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  borderStartEndRadius: PROGRESS_BAR_HEIGHT,
+  insetInlineStart: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transform: `translate(0, calc(-1 * ${LABEL_TOP_SPACING}))`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transition: `width var(${varTransitionSpeed}) var(${varTransitionEasing})`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transitionDelay: `var(${varTransitionDelay})`
 });
 
@@ -28,7 +34,9 @@ const ProgressBar = ({
 }) => jsx("div", {
   "data-testid": testId,
   style: {
-    width: `calc(${percentageComplete}% + ${percentageComplete / 100} * calc(var(${varSpacing}, ${spacing.cosy}) + ${HALF_GRID_SIZE}))`
+    width: `calc(${percentageComplete}% + ${percentageComplete / 100
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    } * calc(var(${varSpacing}, ${spacing.cosy}) + ${HALF_GRID_SIZE}))`
   },
   css: progressBarStyles
 });

package/dist/es2019/internal/constants.js

@@ -7,10 +7,9 @@ export const varTransitionDelay = '--ds--pt--td';
 export const varTransitionEasing = '--ds--pt--te';
 export const varMarkerColor = '--ds--pt--mc';
 export const varBackgroundColor = '--ds--pt--bg';
-export const REGULAR_FONT_WEIGHT = "var(--ds-font-weight-regular, 400)";
-export const SEMI_BOLD_FONT_WEIGHT = "var(--ds-font-weight-semibold, 600)";
 export const HALF_GRID_SIZE = "var(--ds-space-050, 4px)";
 export const PROGRESS_BAR_HEIGHT = "var(--ds-space-100, 8px)";
 
-// Labels sit 16px from bottom of progress bar i.e. 8 + 16
-export const LABEL_TOP_SPACING = "var(--ds-space-300, 24px)";
+// Labels sit 16px from bottom of progress bar
+// i.e. 8 (bar height) + 16 - 4 (line height 24->20 in PYX-695) = 20px
+export const LABEL_TOP_SPACING = "var(--ds-space-250, 20px)";

package/dist/es2019/internal/link.js

@@ -1,5 +1,6 @@
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N800 } from '@atlaskit/theme/colors';
 const linkStyles = css({

package/dist/es2019/internal/marker.js

@@ -1,29 +1,42 @@
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { LABEL_TOP_SPACING, PROGRESS_BAR_HEIGHT, varBackgroundColor, varMarkerColor, varTransitionDelay, varTransitionEasing, varTransitionSpeed } from './constants';
 const progressMarkerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   width: PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: PROGRESS_BAR_HEIGHT,
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  left: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   backgroundColor: `var(${varBackgroundColor})`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   borderRadius: PROGRESS_BAR_HEIGHT,
+  insetInlineStart: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transform: `translate(-50%, calc(-1 * ${LABEL_TOP_SPACING}))`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transition: `opacity var(${varTransitionSpeed}) var(${varTransitionEasing}), background-color var(${varTransitionSpeed}) var(${varTransitionEasing})`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transitionDelay: `var(${varTransitionDelay})`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear': {
     opacity: 0.01
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear.fade-appear-active': {
     opacity: 1
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-enter': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: `var(${varMarkerColor})`
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-enter.fade-enter-active': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: `var(${varBackgroundColor})`
   }
 });

package/dist/es2019/internal/stage.js

@@ -2,6 +2,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 import { PureComponent } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { CSSTransition } from 'react-transition-group';
 import { Box, xcss } from '@atlaskit/primitives';
@@ -18,23 +20,20 @@ const listItemStyles = css({
   overflowWrap: 'break-word'
 });
 const titleStyles = css({
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginTop: LABEL_TOP_SPACING,
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  lineHeight: '16px',
+  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+  marginBlockStart: LABEL_TOP_SPACING,
   textAlign: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear': {
     opacity: 0.01
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear.fade-appear-active': {
     opacity: 1,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     transition: `opacity var(${varTransitionSpeed}) cubic-bezier(0.2, 0, 0, 1)`
   }
 });
-const textStyles = css({
-  fontSize: '14px',
-  lineHeight: '16px'
-});
 export default class ProgressTrackerStage extends PureComponent {
   constructor(props) {
     super(props);
@@ -116,9 +115,7 @@ export default class ProgressTrackerStage extends PureComponent {
       timeout: transitionDelay + transitionSpeed,
       classNames: "fade"
     }, jsx("div", {
-      css: titleStyles
-    }, jsx("span", {
-      css: textStyles,
+      css: titleStyles,
       style: {
         color: getTextColor(item.status),
         fontWeight: getFontWeight(item.status)
@@ -126,6 +123,6 @@ export default class ProgressTrackerStage extends PureComponent {
       "data-testid": testId && `${testId}-title`
     }, this.shouldShowLink() ? render.link({
       item
-    }) : item.label)))));
+    }) : item.label))));
   }
 }

package/dist/es2019/internal/utils.js

@@ -1,5 +1,4 @@
 import { B300, N70 } from '@atlaskit/theme/colors';
-import { REGULAR_FONT_WEIGHT, SEMI_BOLD_FONT_WEIGHT } from './constants';
 export const getMarkerColor = status => {
   switch (status) {
     case 'unvisited':
@@ -29,11 +28,11 @@ export const getTextColor = status => {
 export const getFontWeight = status => {
   switch (status) {
     case 'unvisited':
-      return REGULAR_FONT_WEIGHT;
+      return "var(--ds-font-weight-regular, 400)";
     case 'current':
     case 'visited':
     case 'disabled':
-      return SEMI_BOLD_FONT_WEIGHT;
+      return "var(--ds-font-weight-semibold, 600)";
     default:
       return undefined;
   }

package/dist/es2019/progress-tracker.js

@@ -2,6 +2,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 import { PureComponent } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { spacing } from './constants';
 import { ANIMATION_EASE_OUT, LINEAR_TRANSITION_SPEED, TRANSITION_SPEED, varSpacing } from './internal/constants';
@@ -13,9 +15,10 @@ const containerStyles = css({
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   margin: '0 auto',
   padding: "var(--ds-space-0, 0px)",
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   gap: `var(${varSpacing})`,
   listStyleType: 'none',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&&': {
     marginBlockStart: "var(--ds-space-500, 40px)"
   }

package/dist/esm/internal/bar.js

@@ -1,18 +1,24 @@
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { B300 } from '@atlaskit/theme/colors';
 import { spacing } from '../constants';
 import { HALF_GRID_SIZE, LABEL_TOP_SPACING, PROGRESS_BAR_HEIGHT, varSpacing, varTransitionDelay, varTransitionEasing, varTransitionSpeed } from './constants';
 var progressBarStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: PROGRESS_BAR_HEIGHT,
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  left: '50%',
   backgroundColor: "var(--ds-background-brand-bold, ".concat(B300, ")"),
-  borderBottomRightRadius: PROGRESS_BAR_HEIGHT,
-  borderTopRightRadius: PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  borderEndEndRadius: PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  borderStartEndRadius: PROGRESS_BAR_HEIGHT,
+  insetInlineStart: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transform: "translate(0, calc(-1 * ".concat(LABEL_TOP_SPACING, "))"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transition: "width var(".concat(varTransitionSpeed, ") var(").concat(varTransitionEasing, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transitionDelay: "var(".concat(varTransitionDelay, ")")
 });
 
@@ -28,7 +34,9 @@ var ProgressBar = function ProgressBar(_ref) {
   return jsx("div", {
     "data-testid": testId,
     style: {
-      width: "calc(".concat(percentageComplete, "% + ").concat(percentageComplete / 100, " * calc(var(").concat(varSpacing, ", ").concat(spacing.cosy, ") + ").concat(HALF_GRID_SIZE, "))")
+      width: "calc(".concat(percentageComplete, "% + ").concat(percentageComplete / 100
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      , " * calc(var(").concat(varSpacing, ", ").concat(spacing.cosy, ") + ").concat(HALF_GRID_SIZE, "))")
     },
     css: progressBarStyles
   });

package/dist/esm/internal/constants.js

@@ -7,10 +7,9 @@ export var varTransitionDelay = '--ds--pt--td';
 export var varTransitionEasing = '--ds--pt--te';
 export var varMarkerColor = '--ds--pt--mc';
 export var varBackgroundColor = '--ds--pt--bg';
-export var REGULAR_FONT_WEIGHT = "var(--ds-font-weight-regular, 400)";
-export var SEMI_BOLD_FONT_WEIGHT = "var(--ds-font-weight-semibold, 600)";
 export var HALF_GRID_SIZE = "var(--ds-space-050, 4px)";
 export var PROGRESS_BAR_HEIGHT = "var(--ds-space-100, 8px)";
 
-// Labels sit 16px from bottom of progress bar i.e. 8 + 16
-export var LABEL_TOP_SPACING = "var(--ds-space-300, 24px)";
+// Labels sit 16px from bottom of progress bar
+// i.e. 8 (bar height) + 16 - 4 (line height 24->20 in PYX-695) = 20px
+export var LABEL_TOP_SPACING = "var(--ds-space-250, 20px)";

package/dist/esm/internal/link.js

@@ -1,5 +1,6 @@
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N800 } from '@atlaskit/theme/colors';
 var linkStyles = css({

package/dist/esm/internal/marker.js

@@ -1,29 +1,42 @@
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { LABEL_TOP_SPACING, PROGRESS_BAR_HEIGHT, varBackgroundColor, varMarkerColor, varTransitionDelay, varTransitionEasing, varTransitionSpeed } from './constants';
 var progressMarkerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   width: PROGRESS_BAR_HEIGHT,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: PROGRESS_BAR_HEIGHT,
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  left: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   backgroundColor: "var(".concat(varBackgroundColor, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   borderRadius: PROGRESS_BAR_HEIGHT,
+  insetInlineStart: '50%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transform: "translate(-50%, calc(-1 * ".concat(LABEL_TOP_SPACING, "))"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transition: "opacity var(".concat(varTransitionSpeed, ") var(").concat(varTransitionEasing, "), background-color var(").concat(varTransitionSpeed, ") var(").concat(varTransitionEasing, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   transitionDelay: "var(".concat(varTransitionDelay, ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear': {
     opacity: 0.01
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear.fade-appear-active': {
     opacity: 1
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-enter': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: "var(".concat(varMarkerColor, ")")
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-enter.fade-enter-active': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: "var(".concat(varBackgroundColor, ")")
   }
 });

package/dist/esm/internal/stage.js

@@ -12,6 +12,8 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 import { PureComponent } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { CSSTransition } from 'react-transition-group';
 import { Box, xcss } from '@atlaskit/primitives';
@@ -28,23 +30,20 @@ var listItemStyles = css({
   overflowWrap: 'break-word'
 });
 var titleStyles = css({
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginTop: LABEL_TOP_SPACING,
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  lineHeight: '16px',
+  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+  marginBlockStart: LABEL_TOP_SPACING,
   textAlign: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear': {
     opacity: 0.01
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.fade-appear.fade-appear-active': {
     opacity: 1,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     transition: "opacity var(".concat(varTransitionSpeed, ") cubic-bezier(0.2, 0, 0, 1)")
   }
 });
-var textStyles = css({
-  fontSize: '14px',
-  lineHeight: '16px'
-});
 var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
   _inherits(ProgressTrackerStage, _PureComponent);
   var _super = _createSuper(ProgressTrackerStage);
@@ -131,9 +130,7 @@ var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
         timeout: transitionDelay + transitionSpeed,
         classNames: "fade"
       }, jsx("div", {
-        css: titleStyles
-      }, jsx("span", {
-        css: textStyles,
+        css: titleStyles,
         style: {
           color: getTextColor(item.status),
           fontWeight: getFontWeight(item.status)
@@ -141,7 +138,7 @@ var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
         "data-testid": testId && "".concat(testId, "-title")
       }, this.shouldShowLink() ? render.link({
         item: item
-      }) : item.label)))));
+      }) : item.label))));
     }
   }]);
   return ProgressTrackerStage;

package/dist/esm/internal/utils.js

@@ -1,5 +1,4 @@
 import { B300, N70 } from '@atlaskit/theme/colors';
-import { REGULAR_FONT_WEIGHT, SEMI_BOLD_FONT_WEIGHT } from './constants';
 export var getMarkerColor = function getMarkerColor(status) {
   switch (status) {
     case 'unvisited':
@@ -29,11 +28,11 @@ export var getTextColor = function getTextColor(status) {
 export var getFontWeight = function getFontWeight(status) {
   switch (status) {
     case 'unvisited':
-      return REGULAR_FONT_WEIGHT;
+      return "var(--ds-font-weight-regular, 400)";
     case 'current':
     case 'visited':
     case 'disabled':
-      return SEMI_BOLD_FONT_WEIGHT;
+      return "var(--ds-font-weight-semibold, 600)";
     default:
       return undefined;
   }

package/dist/esm/progress-tracker.js

@@ -12,6 +12,8 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 /* eslint-disable @atlaskit/design-system/no-nested-styles */
 /** @jsx jsx */
 import { PureComponent } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { spacing } from './constants';
 import { ANIMATION_EASE_OUT, LINEAR_TRANSITION_SPEED, TRANSITION_SPEED, varSpacing } from './internal/constants';
@@ -23,9 +25,10 @@ var containerStyles = css({
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   margin: '0 auto',
   padding: "var(--ds-space-0, 0px)",
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   gap: "var(".concat(varSpacing, ")"),
   listStyleType: 'none',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&&': {
     marginBlockStart: "var(--ds-space-500, 40px)"
   }

package/dist/types/internal/constants.d.ts

@@ -7,8 +7,6 @@ export declare const varTransitionDelay = "--ds--pt--td";
 export declare const varTransitionEasing = "--ds--pt--te";
 export declare const varMarkerColor = "--ds--pt--mc";
 export declare const varBackgroundColor = "--ds--pt--bg";
-export declare const REGULAR_FONT_WEIGHT: "var(--ds-font-weight-regular)";
-export declare const SEMI_BOLD_FONT_WEIGHT: "var(--ds-font-weight-semibold)";
 export declare const HALF_GRID_SIZE: "var(--ds-space-050)";
 export declare const PROGRESS_BAR_HEIGHT: "var(--ds-space-100)";
-export declare const LABEL_TOP_SPACING: "var(--ds-space-300)";
+export declare const LABEL_TOP_SPACING: "var(--ds-space-250)";

package/dist/types-ts4.5/internal/constants.d.ts

@@ -7,8 +7,6 @@ export declare const varTransitionDelay = "--ds--pt--td";
 export declare const varTransitionEasing = "--ds--pt--te";
 export declare const varMarkerColor = "--ds--pt--mc";
 export declare const varBackgroundColor = "--ds--pt--bg";
-export declare const REGULAR_FONT_WEIGHT: "var(--ds-font-weight-regular)";
-export declare const SEMI_BOLD_FONT_WEIGHT: "var(--ds-font-weight-semibold)";
 export declare const HALF_GRID_SIZE: "var(--ds-space-050)";
 export declare const PROGRESS_BAR_HEIGHT: "var(--ds-space-100)";
-export declare const LABEL_TOP_SPACING: "var(--ds-space-300)";
+export declare const LABEL_TOP_SPACING: "var(--ds-space-250)";

package/package.json

@@ -1,89 +1,89 @@
 {
-  "name": "@atlaskit/progress-tracker",
-  "version": "8.6.2",
-  "description": "A progress tracker displays the steps and progress through a journey.",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
-  "author": "Atlassian Pty Ltd",
-  "license": "Apache-2.0",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "module:es2019": "dist/es2019/index.js",
-  "types": "dist/types/index.d.ts",
-  "sideEffects": false,
-  "atlaskit:src": "src/index.tsx",
-  "atlassian": {
-    "team": "Design System Team",
-    "releaseModel": "continuous",
-    "runReact18": true,
-    "productPushConsumption": [
-      "jira"
-    ],
-    "website": {
-      "name": "Progress tracker",
-      "category": "Components"
-    }
-  },
-  "dependencies": {
-    "@atlaskit/primitives": "^7.0.0",
-    "@atlaskit/theme": "^12.9.0",
-    "@atlaskit/tokens": "^1.49.0",
-    "@babel/runtime": "^7.0.0",
-    "@emotion/react": "^11.7.1",
-    "react-transition-group": "^4.4.1"
-  },
-  "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
-  },
-  "devDependencies": {
-    "@af/accessibility-testing": "*",
-    "@af/visual-regression": "*",
-    "@atlaskit/ds-lib": "^2.3.0",
-    "@atlaskit/ssr": "*",
-    "@atlaskit/visual-regression": "*",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/user-event": "^14.4.3",
-    "@types/react-transition-group": "^2.0.6",
-    "jest-in-case": "^1.0.2",
-    "react-dom": "^16.8.0",
-    "react-router-dom": "^4.2.2",
-    "react-test-renderer": "^16.8.0",
-    "typescript": "~5.4.2"
-  },
-  "techstack": {
-    "@atlassian/frontend": {
-      "import-structure": "atlassian-conventions"
-    },
-    "@repo/internal": {
-      "dom-events": "use-bind-event-listener",
-      "design-system": "v1",
-      "design-tokens": [
-        "color",
-        "spacing"
-      ],
-      "styling": [
-        "static",
-        "emotion"
-      ],
-      "analytics": "analytics-next",
-      "deprecation": "no-deprecated-imports",
-      "ui-components": "primitives"
-    }
-  },
-  "typesVersions": {
-    ">=4.5 <4.9": {
-      "*": [
-        "dist/types-ts4.5/*",
-        "dist/types-ts4.5/index.d.ts"
-      ]
-    }
-  },
-  "af:exports": {
-    "./constants": "./src/constants.tsx",
-    "./types": "./src/types.tsx",
-    ".": "./src/index.tsx"
-  },
-  "homepage": "https://atlassian.design/components/progress-tracker/"
-}
+	"name": "@atlaskit/progress-tracker",
+	"version": "8.6.3",
+	"description": "A progress tracker displays the steps and progress through a journey.",
+	"publishConfig": {
+		"registry": "https://registry.npmjs.org/"
+	},
+	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
+	"author": "Atlassian Pty Ltd",
+	"license": "Apache-2.0",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"module:es2019": "dist/es2019/index.js",
+	"types": "dist/types/index.d.ts",
+	"sideEffects": false,
+	"atlaskit:src": "src/index.tsx",
+	"atlassian": {
+		"team": "Design System Team",
+		"releaseModel": "continuous",
+		"runReact18": true,
+		"productPushConsumption": [
+			"jira"
+		],
+		"website": {
+			"name": "Progress tracker",
+			"category": "Components"
+		}
+	},
+	"dependencies": {
+		"@atlaskit/primitives": "^7.3.0",
+		"@atlaskit/theme": "^12.9.0",
+		"@atlaskit/tokens": "^1.50.0",
+		"@babel/runtime": "^7.0.0",
+		"@emotion/react": "^11.7.1",
+		"react-transition-group": "^4.4.1"
+	},
+	"peerDependencies": {
+		"react": "^16.8.0 || ^17.0.0 || ~18.2.0"
+	},
+	"devDependencies": {
+		"@af/accessibility-testing": "*",
+		"@af/visual-regression": "*",
+		"@atlaskit/ds-lib": "^2.3.0",
+		"@atlaskit/ssr": "*",
+		"@atlaskit/visual-regression": "*",
+		"@testing-library/react": "^12.1.5",
+		"@testing-library/user-event": "^14.4.3",
+		"@types/react-transition-group": "^2.0.6",
+		"jest-in-case": "^1.0.2",
+		"react-dom": "^16.8.0",
+		"react-router-dom": "^4.2.2",
+		"react-test-renderer": "^16.8.0",
+		"typescript": "~5.4.2"
+	},
+	"techstack": {
+		"@atlassian/frontend": {
+			"import-structure": "atlassian-conventions"
+		},
+		"@repo/internal": {
+			"dom-events": "use-bind-event-listener",
+			"design-system": "v1",
+			"design-tokens": [
+				"color",
+				"spacing"
+			],
+			"styling": [
+				"static",
+				"emotion"
+			],
+			"analytics": "analytics-next",
+			"deprecation": "no-deprecated-imports",
+			"ui-components": "primitives"
+		}
+	},
+	"typesVersions": {
+		">=4.5 <4.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
+		}
+	},
+	"af:exports": {
+		"./constants": "./src/constants.tsx",
+		"./types": "./src/types.tsx",
+		".": "./src/index.tsx"
+	},
+	"homepage": "https://atlassian.design/components/progress-tracker/"
+}

package/report.api.md

@@ -2,7 +2,8 @@
 
 ## API Report File for "@atlaskit/progress-tracker"
 
-> Do not edit this file. This report is auto-generated using [API Extractor](https://api-extractor.com/).
+> Do not edit this file. This report is auto-generated using
+> [API Extractor](https://api-extractor.com/).
 > [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
 
 ### Table of contents
@@ -22,57 +23,54 @@ import { PureComponent } from 'react';
 
 // @public (undocumented)
 interface LinkComponentProps {
-  // (undocumented)
-  item: Stage;
+	// (undocumented)
+	item: Stage;
 }
 
 // @public (undocumented)
-export class ProgressTracker extends PureComponent<
-  ProgressTrackerProps,
-  State
-> {
-  // (undocumented)
-  static defaultProps: {
-    items: never[];
-    spacing: string;
-    render: {
-      link: ({ item }: LinkComponentProps) => jsx.JSX.Element;
-    };
-    animated: boolean;
-    label: string;
-  };
-  // (undocumented)
-  render(): jsx.JSX.Element;
-  // (undocumented)
-  state: {
-    prevStages: {
-      percentageComplete: number;
-      id: string;
-      label: string;
-      status: Status;
-      noLink?: boolean | undefined;
-      href?: string | undefined;
-      onClick?: (() => void) | undefined;
-    }[];
-  };
-  // (undocumented)
-  UNSAFE_componentWillReceiveProps(nextProps: ProgressTrackerProps): void;
+export class ProgressTracker extends PureComponent<ProgressTrackerProps, State> {
+	// (undocumented)
+	static defaultProps: {
+		items: never[];
+		spacing: string;
+		render: {
+			link: ({ item }: LinkComponentProps) => jsx.JSX.Element;
+		};
+		animated: boolean;
+		label: string;
+	};
+	// (undocumented)
+	render(): jsx.JSX.Element;
+	// (undocumented)
+	state: {
+		prevStages: {
+			percentageComplete: number;
+			id: string;
+			label: string;
+			status: Status;
+			noLink?: boolean | undefined;
+			href?: string | undefined;
+			onClick?: (() => void) | undefined;
+		}[];
+	};
+	// (undocumented)
+	UNSAFE_componentWillReceiveProps(nextProps: ProgressTrackerProps): void;
 }
 
 // @public (undocumented)
 export interface ProgressTrackerProps {
-  animated: boolean;
-  items: Stages;
-  label?: string;
-  render: ProgressTrackerStageRenderProp;
-  spacing: Spacing;
-  testId?: string;
+	animated: boolean;
+	items: Stages;
+	label?: string;
+	render: ProgressTrackerStageRenderProp;
+	spacing: Spacing;
+	testId?: string;
 }
 
 // @public (undocumented)
 interface ProgressTrackerStageRenderProp {
-  // (undocumented)
-  link: (props: LinkComponentProps) => JSX.Element;
+	// (undocumented)
+	link: (props: LinkComponentProps) => JSX.Element;
 }
 
 // @public (undocumented)
@@ -80,27 +78,27 @@ type Spacing = keyof typeof spacing;
 
 // @public
 const spacing: {
-  readonly comfortable: 'var(--ds-space-500)';
-  readonly cosy: 'var(--ds-space-200)';
-  readonly compact: 'var(--ds-space-050)';
+	readonly comfortable: 'var(--ds-space-500)';
+	readonly cosy: 'var(--ds-space-200)';
+	readonly compact: 'var(--ds-space-050)';
 };
 
 // @public (undocumented)
 export interface Stage {
-  // (undocumented)
-  href?: string;
-  // (undocumented)
-  id: string;
-  // (undocumented)
-  label: string;
-  // (undocumented)
-  noLink?: boolean;
-  // (undocumented)
-  onClick?: () => void;
-  // (undocumented)
-  percentageComplete: number;
-  // (undocumented)
-  status: Status;
+	// (undocumented)
+	href?: string;
+	// (undocumented)
+	id: string;
+	// (undocumented)
+	label: string;
+	// (undocumented)
+	noLink?: boolean;
+	// (undocumented)
+	onClick?: () => void;
+	// (undocumented)
+	percentageComplete: number;
+	// (undocumented)
+	status: Status;
 }
 
 // @public (undocumented)
@@ -108,8 +106,8 @@ export type Stages = Stage[];
 
 // @public (undocumented)
 interface State {
-  // (undocumented)
-  prevStages: Stages;
+	// (undocumented)
+	prevStages: Stages;
 }
 
 // @public (undocumented)
@@ -126,7 +124,7 @@ type Status = 'current' | 'disabled' | 'unvisited' | 'visited';
 
 ```json
 {
-  "react": "^16.8.0"
+	"react": "^16.8.0"
 }
 ```