@atlaskit/progress-indicator 10.4.0 → 11.0.1

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/progress-indicator
2
2
 
3
+ ## 11.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#137322](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/137322)
8
+ [`a3aec4aa82255`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a3aec4aa82255) -
9
+ Add border for progress indicator dots to increase color contrast
10
+
11
+ ## 11.0.0
12
+
13
+ ### Major Changes
14
+
15
+ - [#132492](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/132492)
16
+ [`47c7e60baaa05`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/47c7e60baaa05) -
17
+ Removes the `small` size from the `size` prop. Using the small size contributed to accessibility
18
+ issues and was unused in the majority of Atlassian products.
19
+
3
20
  ## 10.4.0
4
21
 
5
22
  ### Minor Changes
@@ -6,23 +6,19 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.varDotsSize = exports.varDotsMargin = exports.sizes = exports.progressIndicatorGapMap = void 0;
7
7
  var progressIndicatorGapMap = exports.progressIndicatorGapMap = {
8
8
  comfortable: {
9
- small: ['space.075', "var(--ds-space-075, 6px)"],
10
9
  default: ['space.100', "var(--ds-space-100, 8px)"],
11
10
  large: ['space.150', "var(--ds-space-150, 12px)"]
12
11
  },
13
12
  cozy: {
14
- small: ['space.050', "var(--ds-space-050, 4px)"],
15
13
  default: ['space.075', "var(--ds-space-075, 6px)"],
16
14
  large: ['space.100', "var(--ds-space-100, 8px)"]
17
15
  },
18
16
  compact: {
19
- small: ['space.025', "var(--ds-space-025, 2px)"],
20
17
  default: ['space.050', "var(--ds-space-050, 4px)"],
21
18
  large: ['space.075', "var(--ds-space-075, 6px)"]
22
19
  }
23
20
  };
24
21
  var sizes = exports.sizes = {
25
- small: 4,
26
22
  default: 8,
27
23
  large: 12
28
24
  };
@@ -12,17 +12,21 @@ var _constants = require("./constants");
12
12
  // TODO Token usages are not consistent for dots https://product-fabric.atlassian.net/browse/DSP-3180
13
13
  var colorMap = {
14
14
  default: (0, _primitives.xcss)({
15
- backgroundColor: 'color.background.neutral'
15
+ backgroundColor: 'color.background.neutral',
16
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
16
17
  }),
17
18
  help: (0, _primitives.xcss)({
18
- backgroundColor: 'color.background.neutral'
19
+ backgroundColor: 'color.background.neutral',
20
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
19
21
  }),
20
22
  inverted: (0, _primitives.xcss)({
21
23
  // @ts-expect-error
22
- backgroundColor: "var(--ds-icon-subtle, #626F86)"
24
+ backgroundColor: "var(--ds-icon-subtle, #626F86)",
25
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
23
26
  }),
24
27
  primary: (0, _primitives.xcss)({
25
- backgroundColor: 'color.background.neutral'
28
+ backgroundColor: 'color.background.neutral',
29
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
26
30
  })
27
31
  };
28
32
  var selectedColorMap = {
@@ -66,7 +70,6 @@ var commonStyles = (0, _primitives.xcss)({
66
70
  });
67
71
  var buttonStyles = (0, _primitives.xcss)({
68
72
  padding: 'space.0',
69
- border: 0,
70
73
  cursor: 'pointer',
71
74
  outline: 0
72
75
  });
@@ -26,7 +26,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
26
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
27
27
 
28
28
  var packageName = "@atlaskit/progress-indicator";
29
- var packageVersion = "10.4.0";
29
+ var packageVersion = "11.0.1";
30
30
 
31
31
  /**
32
32
  * __ProgressDots__
@@ -1,22 +1,18 @@
1
1
  export const progressIndicatorGapMap = {
2
2
  comfortable: {
3
- small: ['space.075', "var(--ds-space-075, 6px)"],
4
3
  default: ['space.100', "var(--ds-space-100, 8px)"],
5
4
  large: ['space.150', "var(--ds-space-150, 12px)"]
6
5
  },
7
6
  cozy: {
8
- small: ['space.050', "var(--ds-space-050, 4px)"],
9
7
  default: ['space.075', "var(--ds-space-075, 6px)"],
10
8
  large: ['space.100', "var(--ds-space-100, 8px)"]
11
9
  },
12
10
  compact: {
13
- small: ['space.025', "var(--ds-space-025, 2px)"],
14
11
  default: ['space.050', "var(--ds-space-050, 4px)"],
15
12
  large: ['space.075', "var(--ds-space-075, 6px)"]
16
13
  }
17
14
  };
18
15
  export const sizes = {
19
- small: 4,
20
16
  default: 8,
21
17
  large: 12
22
18
  };
@@ -5,17 +5,21 @@ import { varDotsMargin, varDotsSize } from './constants';
5
5
  // TODO Token usages are not consistent for dots https://product-fabric.atlassian.net/browse/DSP-3180
6
6
  const colorMap = {
7
7
  default: xcss({
8
- backgroundColor: 'color.background.neutral'
8
+ backgroundColor: 'color.background.neutral',
9
+ border: `${"var(--ds-border-width, 1px)"} solid ${"var(--ds-border-bold, #758195)"}`
9
10
  }),
10
11
  help: xcss({
11
- backgroundColor: 'color.background.neutral'
12
+ backgroundColor: 'color.background.neutral',
13
+ border: `${"var(--ds-border-width, 1px)"} solid ${"var(--ds-border-bold, #758195)"}`
12
14
  }),
13
15
  inverted: xcss({
14
16
  // @ts-expect-error
15
- backgroundColor: "var(--ds-icon-subtle, #626F86)"
17
+ backgroundColor: "var(--ds-icon-subtle, #626F86)",
18
+ border: `${"var(--ds-border-width, 1px)"} solid ${"var(--ds-border-bold, #758195)"}`
16
19
  }),
17
20
  primary: xcss({
18
- backgroundColor: 'color.background.neutral'
21
+ backgroundColor: 'color.background.neutral',
22
+ border: `${"var(--ds-border-width, 1px)"} solid ${"var(--ds-border-bold, #758195)"}`
19
23
  })
20
24
  };
21
25
  const selectedColorMap = {
@@ -59,7 +63,6 @@ const commonStyles = xcss({
59
63
  });
60
64
  const buttonStyles = xcss({
61
65
  padding: 'space.0',
62
- border: 0,
63
66
  cursor: 'pointer',
64
67
  outline: 0
65
68
  });
@@ -13,7 +13,7 @@ import { Box, Inline } from '@atlaskit/primitives';
13
13
  import { progressIndicatorGapMap, sizes, varDotsMargin, varDotsSize } from './constants';
14
14
  import { ButtonIndicator, PresentationalIndicator } from './indicator';
15
15
  const packageName = "@atlaskit/progress-indicator";
16
- const packageVersion = "10.4.0";
16
+ const packageVersion = "11.0.1";
17
17
 
18
18
  /**
19
19
  * __ProgressDots__
@@ -1,22 +1,18 @@
1
1
  export var progressIndicatorGapMap = {
2
2
  comfortable: {
3
- small: ['space.075', "var(--ds-space-075, 6px)"],
4
3
  default: ['space.100', "var(--ds-space-100, 8px)"],
5
4
  large: ['space.150', "var(--ds-space-150, 12px)"]
6
5
  },
7
6
  cozy: {
8
- small: ['space.050', "var(--ds-space-050, 4px)"],
9
7
  default: ['space.075', "var(--ds-space-075, 6px)"],
10
8
  large: ['space.100', "var(--ds-space-100, 8px)"]
11
9
  },
12
10
  compact: {
13
- small: ['space.025', "var(--ds-space-025, 2px)"],
14
11
  default: ['space.050', "var(--ds-space-050, 4px)"],
15
12
  large: ['space.075', "var(--ds-space-075, 6px)"]
16
13
  }
17
14
  };
18
15
  export var sizes = {
19
- small: 4,
20
16
  default: 8,
21
17
  large: 12
22
18
  };
@@ -5,17 +5,21 @@ import { varDotsMargin, varDotsSize } from './constants';
5
5
  // TODO Token usages are not consistent for dots https://product-fabric.atlassian.net/browse/DSP-3180
6
6
  var colorMap = {
7
7
  default: xcss({
8
- backgroundColor: 'color.background.neutral'
8
+ backgroundColor: 'color.background.neutral',
9
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
9
10
  }),
10
11
  help: xcss({
11
- backgroundColor: 'color.background.neutral'
12
+ backgroundColor: 'color.background.neutral',
13
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
12
14
  }),
13
15
  inverted: xcss({
14
16
  // @ts-expect-error
15
- backgroundColor: "var(--ds-icon-subtle, #626F86)"
17
+ backgroundColor: "var(--ds-icon-subtle, #626F86)",
18
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
16
19
  }),
17
20
  primary: xcss({
18
- backgroundColor: 'color.background.neutral'
21
+ backgroundColor: 'color.background.neutral',
22
+ border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)")
19
23
  })
20
24
  };
21
25
  var selectedColorMap = {
@@ -59,7 +63,6 @@ var commonStyles = xcss({
59
63
  });
60
64
  var buttonStyles = xcss({
61
65
  padding: 'space.0',
62
- border: 0,
63
66
  cursor: 'pointer',
64
67
  outline: 0
65
68
  });
@@ -15,7 +15,7 @@ import { Box, Inline } from '@atlaskit/primitives';
15
15
  import { progressIndicatorGapMap, sizes, varDotsMargin, varDotsSize } from './constants';
16
16
  import { ButtonIndicator, PresentationalIndicator } from './indicator';
17
17
  var packageName = "@atlaskit/progress-indicator";
18
- var packageVersion = "10.4.0";
18
+ var packageVersion = "11.0.1";
19
19
 
20
20
  /**
21
21
  * __ProgressDots__
@@ -5,24 +5,20 @@ type ScaleValue = InlineProps['space'];
5
5
  type SpacingTuple = [ScaleValue, TokenValue];
6
6
  type SpacingPropsToTokensMap = {
7
7
  comfortable: {
8
- small: SpacingTuple;
9
8
  default: SpacingTuple;
10
9
  large: SpacingTuple;
11
10
  };
12
11
  cozy: {
13
- small: SpacingTuple;
14
12
  default: SpacingTuple;
15
13
  large: SpacingTuple;
16
14
  };
17
15
  compact: {
18
- small: SpacingTuple;
19
16
  default: SpacingTuple;
20
17
  large: SpacingTuple;
21
18
  };
22
19
  };
23
20
  export declare const progressIndicatorGapMap: SpacingPropsToTokensMap;
24
21
  export declare const sizes: {
25
- small: number;
26
22
  default: number;
27
23
  large: number;
28
24
  };
@@ -1,3 +1,3 @@
1
1
  export type DotsAppearance = 'default' | 'help' | 'inverted' | 'primary';
2
2
  export type Spacing = 'comfortable' | 'cozy' | 'compact';
3
- export type Size = 'small' | 'default' | 'large';
3
+ export type Size = 'default' | 'large';
@@ -8,24 +8,20 @@ type SpacingTuple = [
8
8
  ];
9
9
  type SpacingPropsToTokensMap = {
10
10
  comfortable: {
11
- small: SpacingTuple;
12
11
  default: SpacingTuple;
13
12
  large: SpacingTuple;
14
13
  };
15
14
  cozy: {
16
- small: SpacingTuple;
17
15
  default: SpacingTuple;
18
16
  large: SpacingTuple;
19
17
  };
20
18
  compact: {
21
- small: SpacingTuple;
22
19
  default: SpacingTuple;
23
20
  large: SpacingTuple;
24
21
  };
25
22
  };
26
23
  export declare const progressIndicatorGapMap: SpacingPropsToTokensMap;
27
24
  export declare const sizes: {
28
- small: number;
29
25
  default: number;
30
26
  large: number;
31
27
  };
@@ -1,3 +1,3 @@
1
1
  export type DotsAppearance = 'default' | 'help' | 'inverted' | 'primary';
2
2
  export type Spacing = 'comfortable' | 'cozy' | 'compact';
3
- export type Size = 'small' | 'default' | 'large';
3
+ export type Size = 'default' | 'large';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/progress-indicator",
3
- "version": "10.4.0",
3
+ "version": "11.0.1",
4
4
  "description": "A progress indicator shows the user where they are along the steps of a journey.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -16,11 +16,7 @@
16
16
  "atlaskit:src": "src/index.tsx",
17
17
  "atlassian": {
18
18
  "team": "Design System Team",
19
- "releaseModel": "continuous",
20
19
  "runReact18": true,
21
- "productPushConsumption": [
22
- "jira"
23
- ],
24
20
  "website": {
25
21
  "name": "Progress indicator",
26
22
  "category": "Components"
@@ -28,9 +24,9 @@
28
24
  },
29
25
  "dependencies": {
30
26
  "@atlaskit/analytics-next": "^10.1.0",
31
- "@atlaskit/ds-lib": "^2.4.0",
32
- "@atlaskit/primitives": "^12.0.0",
33
- "@atlaskit/tokens": "^1.58.0",
27
+ "@atlaskit/ds-lib": "^2.5.0",
28
+ "@atlaskit/primitives": "^12.1.0",
29
+ "@atlaskit/tokens": "^1.59.0",
34
30
  "@atlaskit/visually-hidden": "^1.5.0",
35
31
  "@babel/runtime": "^7.0.0",
36
32
  "@emotion/react": "^11.7.1",