@atlaskit/progress-tracker 8.6.1 → 8.6.3

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.
@@ -12,6 +12,8 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
12
12
  /* eslint-disable @atlaskit/design-system/no-nested-styles */
13
13
  /** @jsx jsx */
14
14
  import { PureComponent } from 'react';
15
+
16
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
15
17
  import { css, jsx } from '@emotion/react';
16
18
  import { CSSTransition } from 'react-transition-group';
17
19
  import { Box, xcss } from '@atlaskit/primitives';
@@ -28,23 +30,20 @@ var listItemStyles = css({
28
30
  overflowWrap: 'break-word'
29
31
  });
30
32
  var titleStyles = css({
31
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
32
- marginTop: LABEL_TOP_SPACING,
33
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
34
- lineHeight: '16px',
33
+ font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
34
+ marginBlockStart: LABEL_TOP_SPACING,
35
35
  textAlign: 'center',
36
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
36
37
  '&.fade-appear': {
37
38
  opacity: 0.01
38
39
  },
40
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
39
41
  '&.fade-appear.fade-appear-active': {
40
42
  opacity: 1,
43
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
41
44
  transition: "opacity var(".concat(varTransitionSpeed, ") cubic-bezier(0.2, 0, 0, 1)")
42
45
  }
43
46
  });
44
- var textStyles = css({
45
- fontSize: '14px',
46
- lineHeight: '16px'
47
- });
48
47
  var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
49
48
  _inherits(ProgressTrackerStage, _PureComponent);
50
49
  var _super = _createSuper(ProgressTrackerStage);
@@ -99,7 +98,9 @@ var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
99
98
  var ariaCurrent = item.status === 'current' ? 'step' : 'false';
100
99
  var listInlineStyles = (_listInlineStyles = {}, _defineProperty(_listInlineStyles, varTransitionSpeed, "".concat(transitionSpeed, "ms")), _defineProperty(_listInlineStyles, varTransitionDelay, "".concat(transitionDelay, "ms")), _defineProperty(_listInlineStyles, varTransitionEasing, transitionEasing), _defineProperty(_listInlineStyles, varMarkerColor, this.state.oldMarkerColor), _defineProperty(_listInlineStyles, varBackgroundColor, getMarkerColor(item.status)), _listInlineStyles);
101
100
  return jsx("li", {
102
- "data-testid": testId,
101
+ "data-testid": testId
102
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
103
+ ,
103
104
  style: listInlineStyles,
104
105
  css: listItemStyles,
105
106
  "aria-current": ariaCurrent
@@ -129,9 +130,7 @@ var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
129
130
  timeout: transitionDelay + transitionSpeed,
130
131
  classNames: "fade"
131
132
  }, jsx("div", {
132
- css: titleStyles
133
- }, jsx("span", {
134
- css: textStyles,
133
+ css: titleStyles,
135
134
  style: {
136
135
  color: getTextColor(item.status),
137
136
  fontWeight: getFontWeight(item.status)
@@ -139,7 +138,7 @@ var ProgressTrackerStage = /*#__PURE__*/function (_PureComponent) {
139
138
  "data-testid": testId && "".concat(testId, "-title")
140
139
  }, this.shouldShowLink() ? render.link({
141
140
  item: item
142
- }) : item.label)))));
141
+ }) : item.label))));
143
142
  }
144
143
  }]);
145
144
  return ProgressTrackerStage;
@@ -1,5 +1,4 @@
1
1
  import { B300, N70 } from '@atlaskit/theme/colors';
2
- import { REGULAR_FONT_WEIGHT, SEMI_BOLD_FONT_WEIGHT } from './constants';
3
2
  export var getMarkerColor = function getMarkerColor(status) {
4
3
  switch (status) {
5
4
  case 'unvisited':
@@ -29,11 +28,11 @@ export var getTextColor = function getTextColor(status) {
29
28
  export var getFontWeight = function getFontWeight(status) {
30
29
  switch (status) {
31
30
  case 'unvisited':
32
- return REGULAR_FONT_WEIGHT;
31
+ return "var(--ds-font-weight-regular, 400)";
33
32
  case 'current':
34
33
  case 'visited':
35
34
  case 'disabled':
36
- return SEMI_BOLD_FONT_WEIGHT;
35
+ return "var(--ds-font-weight-semibold, 600)";
37
36
  default:
38
37
  return undefined;
39
38
  }
@@ -12,6 +12,8 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
12
12
  /* eslint-disable @atlaskit/design-system/no-nested-styles */
13
13
  /** @jsx jsx */
14
14
  import { PureComponent } from 'react';
15
+
16
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
15
17
  import { css, jsx } from '@emotion/react';
16
18
  import { spacing } from './constants';
17
19
  import { ANIMATION_EASE_OUT, LINEAR_TRANSITION_SPEED, TRANSITION_SPEED, varSpacing } from './internal/constants';
@@ -23,9 +25,10 @@ var containerStyles = css({
23
25
  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
24
26
  margin: '0 auto',
25
27
  padding: "var(--ds-space-0, 0px)",
26
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
28
+ // 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
27
29
  gap: "var(".concat(varSpacing, ")"),
28
30
  listStyleType: 'none',
31
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
29
32
  '&&': {
30
33
  marginBlockStart: "var(--ds-space-500, 40px)"
31
34
  }
@@ -115,7 +118,9 @@ var ProgressTracker = /*#__PURE__*/function (_PureComponent) {
115
118
  gridTemplateColumns: "repeat(".concat(items.length, ", 1fr)")
116
119
  }, _defineProperty(_listInlineStyles, varSpacing, spacing[this.props.spacing]), _defineProperty(_listInlineStyles, "maxWidth", 8 * 10 * items.length * 2), _listInlineStyles);
117
120
  return jsx("ul", {
118
- "data-testid": testId,
121
+ "data-testid": testId
122
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
123
+ ,
119
124
  style: listInlineStyles,
120
125
  css: containerStyles,
121
126
  "aria-label": label
@@ -7,8 +7,6 @@ export declare const varTransitionDelay = "--ds--pt--td";
7
7
  export declare const varTransitionEasing = "--ds--pt--te";
8
8
  export declare const varMarkerColor = "--ds--pt--mc";
9
9
  export declare const varBackgroundColor = "--ds--pt--bg";
10
- export declare const REGULAR_FONT_WEIGHT: "var(--ds-font-weight-regular)";
11
- export declare const SEMI_BOLD_FONT_WEIGHT: "var(--ds-font-weight-semibold)";
12
10
  export declare const HALF_GRID_SIZE: "var(--ds-space-050)";
13
11
  export declare const PROGRESS_BAR_HEIGHT: "var(--ds-space-100)";
14
- export declare const LABEL_TOP_SPACING: "var(--ds-space-300)";
12
+ export declare const LABEL_TOP_SPACING: "var(--ds-space-250)";
@@ -1,6 +1,6 @@
1
1
  /** @jsx jsx */
2
- import { FC } from 'react';
3
- import { Stage } from '../types';
2
+ import { type FC } from 'react';
3
+ import { type Stage } from '../types';
4
4
  /**
5
5
  * __Progress tracker link__
6
6
  */
@@ -1,5 +1,5 @@
1
1
  /** @jsx jsx */
2
- import { FC } from 'react';
2
+ import { type FC } from 'react';
3
3
  /**
4
4
  * __Progress marker__
5
5
  *
@@ -7,8 +7,6 @@ export declare const varTransitionDelay = "--ds--pt--td";
7
7
  export declare const varTransitionEasing = "--ds--pt--te";
8
8
  export declare const varMarkerColor = "--ds--pt--mc";
9
9
  export declare const varBackgroundColor = "--ds--pt--bg";
10
- export declare const REGULAR_FONT_WEIGHT: "var(--ds-font-weight-regular)";
11
- export declare const SEMI_BOLD_FONT_WEIGHT: "var(--ds-font-weight-semibold)";
12
10
  export declare const HALF_GRID_SIZE: "var(--ds-space-050)";
13
11
  export declare const PROGRESS_BAR_HEIGHT: "var(--ds-space-100)";
14
- export declare const LABEL_TOP_SPACING: "var(--ds-space-300)";
12
+ export declare const LABEL_TOP_SPACING: "var(--ds-space-250)";
@@ -1,6 +1,6 @@
1
1
  /** @jsx jsx */
2
- import { FC } from 'react';
3
- import { Stage } from '../types';
2
+ import { type FC } from 'react';
3
+ import { type Stage } from '../types';
4
4
  /**
5
5
  * __Progress tracker link__
6
6
  */
@@ -1,5 +1,5 @@
1
1
  /** @jsx jsx */
2
- import { FC } from 'react';
2
+ import { type FC } from 'react';
3
3
  /**
4
4
  * __Progress marker__
5
5
  *
package/package.json CHANGED
@@ -1,91 +1,89 @@
1
1
  {
2
- "name": "@atlaskit/progress-tracker",
3
- "version": "8.6.1",
4
- "description": "A progress tracker displays the steps and progress through a journey.",
5
- "publishConfig": {
6
- "registry": "https://registry.npmjs.org/"
7
- },
8
- "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
9
- "author": "Atlassian Pty Ltd",
10
- "license": "Apache-2.0",
11
- "main": "dist/cjs/index.js",
12
- "module": "dist/esm/index.js",
13
- "module:es2019": "dist/es2019/index.js",
14
- "types": "dist/types/index.d.ts",
15
- "sideEffects": false,
16
- "atlaskit:src": "src/index.tsx",
17
- "atlassian": {
18
- "team": "Design System Team",
19
- "releaseModel": "continuous",
20
- "runReact18": true,
21
- "productPushConsumption": [
22
- "jira"
23
- ],
24
- "website": {
25
- "name": "Progress tracker",
26
- "category": "Components"
27
- }
28
- },
29
- "dependencies": {
30
- "@atlaskit/primitives": "^6.2.0",
31
- "@atlaskit/theme": "^12.8.0",
32
- "@atlaskit/tokens": "^1.48.0",
33
- "@babel/runtime": "^7.0.0",
34
- "@emotion/react": "^11.7.1",
35
- "react-transition-group": "^4.4.1"
36
- },
37
- "peerDependencies": {
38
- "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
39
- },
40
- "devDependencies": {
41
- "@af/accessibility-testing": "*",
42
- "@af/visual-regression": "*",
43
- "@atlaskit/ds-lib": "^2.3.0",
44
- "@atlaskit/ssr": "*",
45
- "@atlaskit/visual-regression": "*",
46
- "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
47
- "@testing-library/react": "^12.1.5",
48
- "@testing-library/user-event": "^14.4.3",
49
- "@types/react-transition-group": "^2.0.6",
50
- "jest-in-case": "^1.0.2",
51
- "react-dom": "^16.8.0",
52
- "react-router-dom": "^4.2.2",
53
- "react-test-renderer": "^16.8.0",
54
- "typescript": "~5.4.2"
55
- },
56
- "techstack": {
57
- "@atlassian/frontend": {
58
- "import-structure": "atlassian-conventions"
59
- },
60
- "@repo/internal": {
61
- "dom-events": "use-bind-event-listener",
62
- "design-system": "v1",
63
- "design-tokens": [
64
- "color",
65
- "spacing"
66
- ],
67
- "styling": [
68
- "static",
69
- "emotion"
70
- ],
71
- "analytics": "analytics-next",
72
- "deprecation": "no-deprecated-imports",
73
- "ui-components": "primitives"
74
- }
75
- },
76
- "typesVersions": {
77
- ">=4.5 <4.9": {
78
- "*": [
79
- "dist/types-ts4.5/*",
80
- "dist/types-ts4.5/index.d.ts"
81
- ]
82
- }
83
- },
84
- "af:exports": {
85
- "./constants": "./src/constants.tsx",
86
- "./types": "./src/types.tsx",
87
- ".": "./src/index.tsx"
88
- },
89
- "homepage": "https://atlassian.design/components/progress-tracker/",
90
- "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
91
- }
2
+ "name": "@atlaskit/progress-tracker",
3
+ "version": "8.6.3",
4
+ "description": "A progress tracker displays the steps and progress through a journey.",
5
+ "publishConfig": {
6
+ "registry": "https://registry.npmjs.org/"
7
+ },
8
+ "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
9
+ "author": "Atlassian Pty Ltd",
10
+ "license": "Apache-2.0",
11
+ "main": "dist/cjs/index.js",
12
+ "module": "dist/esm/index.js",
13
+ "module:es2019": "dist/es2019/index.js",
14
+ "types": "dist/types/index.d.ts",
15
+ "sideEffects": false,
16
+ "atlaskit:src": "src/index.tsx",
17
+ "atlassian": {
18
+ "team": "Design System Team",
19
+ "releaseModel": "continuous",
20
+ "runReact18": true,
21
+ "productPushConsumption": [
22
+ "jira"
23
+ ],
24
+ "website": {
25
+ "name": "Progress tracker",
26
+ "category": "Components"
27
+ }
28
+ },
29
+ "dependencies": {
30
+ "@atlaskit/primitives": "^7.3.0",
31
+ "@atlaskit/theme": "^12.9.0",
32
+ "@atlaskit/tokens": "^1.50.0",
33
+ "@babel/runtime": "^7.0.0",
34
+ "@emotion/react": "^11.7.1",
35
+ "react-transition-group": "^4.4.1"
36
+ },
37
+ "peerDependencies": {
38
+ "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
39
+ },
40
+ "devDependencies": {
41
+ "@af/accessibility-testing": "*",
42
+ "@af/visual-regression": "*",
43
+ "@atlaskit/ds-lib": "^2.3.0",
44
+ "@atlaskit/ssr": "*",
45
+ "@atlaskit/visual-regression": "*",
46
+ "@testing-library/react": "^12.1.5",
47
+ "@testing-library/user-event": "^14.4.3",
48
+ "@types/react-transition-group": "^2.0.6",
49
+ "jest-in-case": "^1.0.2",
50
+ "react-dom": "^16.8.0",
51
+ "react-router-dom": "^4.2.2",
52
+ "react-test-renderer": "^16.8.0",
53
+ "typescript": "~5.4.2"
54
+ },
55
+ "techstack": {
56
+ "@atlassian/frontend": {
57
+ "import-structure": "atlassian-conventions"
58
+ },
59
+ "@repo/internal": {
60
+ "dom-events": "use-bind-event-listener",
61
+ "design-system": "v1",
62
+ "design-tokens": [
63
+ "color",
64
+ "spacing"
65
+ ],
66
+ "styling": [
67
+ "static",
68
+ "emotion"
69
+ ],
70
+ "analytics": "analytics-next",
71
+ "deprecation": "no-deprecated-imports",
72
+ "ui-components": "primitives"
73
+ }
74
+ },
75
+ "typesVersions": {
76
+ ">=4.5 <4.9": {
77
+ "*": [
78
+ "dist/types-ts4.5/*",
79
+ "dist/types-ts4.5/index.d.ts"
80
+ ]
81
+ }
82
+ },
83
+ "af:exports": {
84
+ "./constants": "./src/constants.tsx",
85
+ "./types": "./src/types.tsx",
86
+ ".": "./src/index.tsx"
87
+ },
88
+ "homepage": "https://atlassian.design/components/progress-tracker/"
89
+ }
package/report.api.md CHANGED
@@ -2,7 +2,8 @@
2
2
 
3
3
  ## API Report File for "@atlaskit/progress-tracker"
4
4
 
5
- > Do not edit this file. This report is auto-generated using [API Extractor](https://api-extractor.com/).
5
+ > Do not edit this file. This report is auto-generated using
6
+ > [API Extractor](https://api-extractor.com/).
6
7
  > [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
7
8
 
8
9
  ### Table of contents
@@ -22,57 +23,54 @@ import { PureComponent } from 'react';
22
23
 
23
24
  // @public (undocumented)
24
25
  interface LinkComponentProps {
25
- // (undocumented)
26
- item: Stage;
26
+ // (undocumented)
27
+ item: Stage;
27
28
  }
28
29
 
29
30
  // @public (undocumented)
30
- export class ProgressTracker extends PureComponent<
31
- ProgressTrackerProps,
32
- State
33
- > {
34
- // (undocumented)
35
- static defaultProps: {
36
- items: never[];
37
- spacing: string;
38
- render: {
39
- link: ({ item }: LinkComponentProps) => jsx.JSX.Element;
40
- };
41
- animated: boolean;
42
- label: string;
43
- };
44
- // (undocumented)
45
- render(): jsx.JSX.Element;
46
- // (undocumented)
47
- state: {
48
- prevStages: {
49
- percentageComplete: number;
50
- id: string;
51
- label: string;
52
- status: Status;
53
- noLink?: boolean | undefined;
54
- href?: string | undefined;
55
- onClick?: (() => void) | undefined;
56
- }[];
57
- };
58
- // (undocumented)
59
- UNSAFE_componentWillReceiveProps(nextProps: ProgressTrackerProps): void;
31
+ export class ProgressTracker extends PureComponent<ProgressTrackerProps, State> {
32
+ // (undocumented)
33
+ static defaultProps: {
34
+ items: never[];
35
+ spacing: string;
36
+ render: {
37
+ link: ({ item }: LinkComponentProps) => jsx.JSX.Element;
38
+ };
39
+ animated: boolean;
40
+ label: string;
41
+ };
42
+ // (undocumented)
43
+ render(): jsx.JSX.Element;
44
+ // (undocumented)
45
+ state: {
46
+ prevStages: {
47
+ percentageComplete: number;
48
+ id: string;
49
+ label: string;
50
+ status: Status;
51
+ noLink?: boolean | undefined;
52
+ href?: string | undefined;
53
+ onClick?: (() => void) | undefined;
54
+ }[];
55
+ };
56
+ // (undocumented)
57
+ UNSAFE_componentWillReceiveProps(nextProps: ProgressTrackerProps): void;
60
58
  }
61
59
 
62
60
  // @public (undocumented)
63
61
  export interface ProgressTrackerProps {
64
- animated: boolean;
65
- items: Stages;
66
- label?: string;
67
- render: ProgressTrackerStageRenderProp;
68
- spacing: Spacing;
69
- testId?: string;
62
+ animated: boolean;
63
+ items: Stages;
64
+ label?: string;
65
+ render: ProgressTrackerStageRenderProp;
66
+ spacing: Spacing;
67
+ testId?: string;
70
68
  }
71
69
 
72
70
  // @public (undocumented)
73
71
  interface ProgressTrackerStageRenderProp {
74
- // (undocumented)
75
- link: (props: LinkComponentProps) => JSX.Element;
72
+ // (undocumented)
73
+ link: (props: LinkComponentProps) => JSX.Element;
76
74
  }
77
75
 
78
76
  // @public (undocumented)
@@ -80,27 +78,27 @@ type Spacing = keyof typeof spacing;
80
78
 
81
79
  // @public
82
80
  const spacing: {
83
- readonly comfortable: 'var(--ds-space-500)';
84
- readonly cosy: 'var(--ds-space-200)';
85
- readonly compact: 'var(--ds-space-050)';
81
+ readonly comfortable: 'var(--ds-space-500)';
82
+ readonly cosy: 'var(--ds-space-200)';
83
+ readonly compact: 'var(--ds-space-050)';
86
84
  };
87
85
 
88
86
  // @public (undocumented)
89
87
  export interface Stage {
90
- // (undocumented)
91
- href?: string;
92
- // (undocumented)
93
- id: string;
94
- // (undocumented)
95
- label: string;
96
- // (undocumented)
97
- noLink?: boolean;
98
- // (undocumented)
99
- onClick?: () => void;
100
- // (undocumented)
101
- percentageComplete: number;
102
- // (undocumented)
103
- status: Status;
88
+ // (undocumented)
89
+ href?: string;
90
+ // (undocumented)
91
+ id: string;
92
+ // (undocumented)
93
+ label: string;
94
+ // (undocumented)
95
+ noLink?: boolean;
96
+ // (undocumented)
97
+ onClick?: () => void;
98
+ // (undocumented)
99
+ percentageComplete: number;
100
+ // (undocumented)
101
+ status: Status;
104
102
  }
105
103
 
106
104
  // @public (undocumented)
@@ -108,8 +106,8 @@ export type Stages = Stage[];
108
106
 
109
107
  // @public (undocumented)
110
108
  interface State {
111
- // (undocumented)
112
- prevStages: Stages;
109
+ // (undocumented)
110
+ prevStages: Stages;
113
111
  }
114
112
 
115
113
  // @public (undocumented)
@@ -126,7 +124,7 @@ type Status = 'current' | 'disabled' | 'unvisited' | 'visited';
126
124
 
127
125
  ```json
128
126
  {
129
- "react": "^16.8.0"
127
+ "react": "^16.8.0"
130
128
  }
131
129
  ```
132
130