@atlaskit/menu 1.2.4 → 1.2.5

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 (20) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/internal/components/menu-item-primitive.js +10 -10
  3. package/dist/cjs/menu-item/heading-item.js +1 -1
  4. package/dist/cjs/menu-item/skeleton-heading-item.js +1 -1
  5. package/dist/cjs/menu-item/skeleton-item.js +1 -1
  6. package/dist/cjs/menu-section/section.js +1 -1
  7. package/dist/cjs/version.json +1 -1
  8. package/dist/es2019/internal/components/menu-item-primitive.js +10 -10
  9. package/dist/es2019/menu-item/heading-item.js +1 -1
  10. package/dist/es2019/menu-item/skeleton-heading-item.js +1 -1
  11. package/dist/es2019/menu-item/skeleton-item.js +1 -1
  12. package/dist/es2019/menu-section/section.js +1 -1
  13. package/dist/es2019/version.json +1 -1
  14. package/dist/esm/internal/components/menu-item-primitive.js +10 -10
  15. package/dist/esm/menu-item/heading-item.js +1 -1
  16. package/dist/esm/menu-item/skeleton-heading-item.js +1 -1
  17. package/dist/esm/menu-item/skeleton-item.js +1 -1
  18. package/dist/esm/menu-section/section.js +1 -1
  19. package/dist/esm/version.json +1 -1
  20. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/menu
2
2
 
3
+ ## 1.2.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - The no-unsafe-design-token-usage eslint rule now respects the new token naming conventions when auto-fixing by correctly formatting token ids.
8
+ - [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - The no-unsafe-design-token-usage eslint rule now respects the new token naming conventions when auto-fixing by correctly formatting token ids.
9
+ - Updated dependencies
10
+
3
11
  ## 1.2.4
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/internal/components/menu-item-primitive.js CHANGED
@@ -65,7 +65,7 @@ var wordBreakStyles = (0, _core.css)({
65
65
  });
66
66
  var descriptionStyles = (0, _core.css)({
67
67
  marginTop: itemDescriptionSpacing,
68
- color: "var(--ds-text-lowEmphasis, ".concat(_colors.N200, ")"),
68
+ color: "var(--ds-text-subtlest, ".concat(_colors.N200, ")"),
69
69
  fontSize: _typography.headingSizes.h200.size
70
70
  });
71
71
  var primitiveStyles = (0, _core.css)({
@@ -98,11 +98,11 @@ var unselectedStyles = (0, _core.css)({
98
98
  color: 'currentColor'
99
99
  },
100
100
  ':hover': {
101
- backgroundColor: "var(--ds-background-transparentNeutral-hover, ".concat(_colors.N20, ")"),
101
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N20, ")"),
102
102
  color: 'currentColor'
103
103
  },
104
104
  ':active': {
105
- backgroundColor: "var(--ds-background-transparentNeutral-pressed, ".concat(_colors.N30, ")"),
105
+ backgroundColor: "var(--ds-background-neutral-subtle-pressed, ".concat(_colors.N30, ")"),
106
106
  boxShadow: 'none',
107
107
  color: 'currentColor'
108
108
  }
@@ -115,19 +115,19 @@ var disabledStyles = (0, _core.css)({
115
115
  }
116
116
  });
117
117
  var selectedStyles = (0, _core.css)({
118
- backgroundColor: "var(--ds-background-selected-resting, ".concat(_colors.N20, ")"),
118
+ backgroundColor: "var(--ds-background-brand, ".concat(_colors.N20, ")"),
119
119
  // Fallback set as babel plugin inserts one otherwise
120
- color: "var(--ds-text-selected, currentColor)",
120
+ color: "var(--ds-text-brand, currentColor)",
121
121
  ':visited': {
122
- color: "var(--ds-text-selected, currentColor)"
122
+ color: "var(--ds-text-brand, currentColor)"
123
123
  },
124
124
  ':hover': {
125
- backgroundColor: "var(--ds-background-selected-hover, ".concat(_colors.N20, ")"),
126
- color: "var(--ds-text-selected, currentColor)"
125
+ backgroundColor: "var(--ds-background-brand-hovered, ".concat(_colors.N20, ")"),
126
+ color: "var(--ds-text-brand, currentColor)"
127
127
  },
128
128
  ':active': {
129
- backgroundColor: "var(--ds-background-selected-pressed, ".concat(_colors.N30, ")"),
130
- color: "var(--ds-text-selected, currentColor)"
129
+ backgroundColor: "var(--ds-background-brand-pressed, ".concat(_colors.N30, ")"),
130
+ color: "var(--ds-text-brand, currentColor)"
131
131
  }
132
132
  });
133
133
  /**
package/dist/cjs/menu-item/heading-item.js CHANGED
@@ -30,7 +30,7 @@ var itemHeadingContentHeight = _typography.headingSizes.h100.lineHeight;
30
30
  var itemHeadingFontSize = _typography.headingSizes.h100.size;
31
31
  var headingStyles = (0, _core.css)({
32
32
  padding: "0 ".concat(itemSidePadding, "px"),
33
- color: "var(--ds-text-lowEmphasis, ".concat(_colors.N200, ")"),
33
+ color: "var(--ds-text-subtlest, ".concat(_colors.N200, ")"),
34
34
  fontSize: itemHeadingFontSize,
35
35
  fontWeight: 700,
36
36
  lineHeight: itemHeadingContentHeight / itemHeadingFontSize,
package/dist/cjs/menu-item/skeleton-heading-item.js CHANGED
@@ -22,7 +22,7 @@ var skeletonStyles = (0, _core.css)({
22
22
  display: 'block',
23
23
  width: '30%',
24
24
  height: (0, _constants.gridSize)(),
25
- backgroundColor: "var(--ds-background-subtleNeutral-resting, ".concat((0, _colors.skeleton)(), ")"),
25
+ backgroundColor: "var(--ds-background-neutral, ".concat((0, _colors.skeleton)(), ")"),
26
26
  borderRadius: 100,
27
27
  content: '""'
28
28
  }
package/dist/cjs/menu-item/skeleton-item.js CHANGED
@@ -26,7 +26,7 @@ var skeletonItemElemSize = gridSize * 2.5;
26
26
  var itemElemSkeletonOffset = (itemExpectedElemSize - skeletonItemElemSize) / 2;
27
27
  var skeletonTextBorderRadius = 100;
28
28
  var skeletonContentHeight = 9;
29
- var skeletonColor = "var(--ds-background-subtleNeutral-resting, ".concat((0, _colors.skeleton)(), ")");
29
+ var skeletonColor = "var(--ds-background-neutral, ".concat((0, _colors.skeleton)(), ")");
30
30
  var skeletonStyles = (0, _core.css)({
31
31
  display: 'flex',
32
32
  minHeight: itemMinHeight,
package/dist/cjs/menu-section/section.js CHANGED
@@ -76,7 +76,7 @@ var unscrollableStyles = (0, _core.css)({
76
76
  flexShrink: 0
77
77
  });
78
78
  var separatorStyles = (0, _core.css)({
79
- borderTop: "2px solid var(".concat(VAR_SEPARATOR_COLOR, ", ").concat("var(--ds-border-neutral, ".concat(_colors.N30A, ")"), ")")
79
+ borderTop: "2px solid var(".concat(VAR_SEPARATOR_COLOR, ", ").concat("var(--ds-border, ".concat(_colors.N30A, ")"), ")")
80
80
  });
81
81
  var noSeparatorStyles = (0, _core.css)({
82
82
  // this is to ensure that adjacent sections without separators don't get additional margins.
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/menu",
3
- "version": "1.2.4",
3
+ "version": "1.2.5",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/internal/components/menu-item-primitive.js CHANGED
@@ -49,7 +49,7 @@ const wordBreakStyles = css({
49
49
  });
50
50
  const descriptionStyles = css({
51
51
  marginTop: itemDescriptionSpacing,
52
- color: `var(--ds-text-lowEmphasis, ${N200})`,
52
+ color: `var(--ds-text-subtlest, ${N200})`,
53
53
  fontSize: headingSizes.h200.size
54
54
  });
55
55
  const primitiveStyles = css({
@@ -82,11 +82,11 @@ const unselectedStyles = css({
82
82
  color: 'currentColor'
83
83
  },
84
84
  ':hover': {
85
- backgroundColor: `var(--ds-background-transparentNeutral-hover, ${N20})`,
85
+ backgroundColor: `var(--ds-background-neutral-subtle-hovered, ${N20})`,
86
86
  color: 'currentColor'
87
87
  },
88
88
  ':active': {
89
- backgroundColor: `var(--ds-background-transparentNeutral-pressed, ${N30})`,
89
+ backgroundColor: `var(--ds-background-neutral-subtle-pressed, ${N30})`,
90
90
  boxShadow: 'none',
91
91
  color: 'currentColor'
92
92
  }
@@ -99,19 +99,19 @@ const disabledStyles = css({
99
99
  }
100
100
  });
101
101
  const selectedStyles = css({
102
- backgroundColor: `var(--ds-background-selected-resting, ${N20})`,
102
+ backgroundColor: `var(--ds-background-brand, ${N20})`,
103
103
  // Fallback set as babel plugin inserts one otherwise
104
- color: "var(--ds-text-selected, currentColor)",
104
+ color: "var(--ds-text-brand, currentColor)",
105
105
  ':visited': {
106
- color: "var(--ds-text-selected, currentColor)"
106
+ color: "var(--ds-text-brand, currentColor)"
107
107
  },
108
108
  ':hover': {
109
- backgroundColor: `var(--ds-background-selected-hover, ${N20})`,
110
- color: "var(--ds-text-selected, currentColor)"
109
+ backgroundColor: `var(--ds-background-brand-hovered, ${N20})`,
110
+ color: "var(--ds-text-brand, currentColor)"
111
111
  },
112
112
  ':active': {
113
- backgroundColor: `var(--ds-background-selected-pressed, ${N30})`,
114
- color: "var(--ds-text-selected, currentColor)"
113
+ backgroundColor: `var(--ds-background-brand-pressed, ${N30})`,
114
+ color: "var(--ds-text-brand, currentColor)"
115
115
  }
116
116
  });
117
117
  /**
package/dist/es2019/menu-item/heading-item.js CHANGED
@@ -13,7 +13,7 @@ const itemHeadingContentHeight = headingSizes.h100.lineHeight;
13
13
  const itemHeadingFontSize = headingSizes.h100.size;
14
14
  const headingStyles = css({
15
15
  padding: `0 ${itemSidePadding}px`,
16
- color: `var(--ds-text-lowEmphasis, ${N200})`,
16
+ color: `var(--ds-text-subtlest, ${N200})`,
17
17
  fontSize: itemHeadingFontSize,
18
18
  fontWeight: 700,
19
19
  lineHeight: itemHeadingContentHeight / itemHeadingFontSize,
package/dist/es2019/menu-item/skeleton-heading-item.js CHANGED
@@ -9,7 +9,7 @@ const skeletonStyles = css({
9
9
  display: 'block',
10
10
  width: '30%',
11
11
  height: gridSize(),
12
- backgroundColor: `var(--ds-background-subtleNeutral-resting, ${skeletonColorFn()})`,
12
+ backgroundColor: `var(--ds-background-neutral, ${skeletonColorFn()})`,
13
13
  borderRadius: 100,
14
14
  content: '""'
15
15
  }
package/dist/es2019/menu-item/skeleton-item.js CHANGED
@@ -13,7 +13,7 @@ const skeletonItemElemSize = gridSize * 2.5;
13
13
  const itemElemSkeletonOffset = (itemExpectedElemSize - skeletonItemElemSize) / 2;
14
14
  const skeletonTextBorderRadius = 100;
15
15
  const skeletonContentHeight = 9;
16
- const skeletonColor = `var(--ds-background-subtleNeutral-resting, ${skeletonColorFn()})`;
16
+ const skeletonColor = `var(--ds-background-neutral, ${skeletonColorFn()})`;
17
17
  const skeletonStyles = css({
18
18
  display: 'flex',
19
19
  minHeight: itemMinHeight,
package/dist/es2019/menu-section/section.js CHANGED
@@ -59,7 +59,7 @@ const unscrollableStyles = css({
59
59
  flexShrink: 0
60
60
  });
61
61
  const separatorStyles = css({
62
- borderTop: `2px solid var(${VAR_SEPARATOR_COLOR}, ${`var(--ds-border-neutral, ${N30A})`})`
62
+ borderTop: `2px solid var(${VAR_SEPARATOR_COLOR}, ${`var(--ds-border, ${N30A})`})`
63
63
  });
64
64
  const noSeparatorStyles = css({
65
65
  // this is to ensure that adjacent sections without separators don't get additional margins.
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/menu",
3
- "version": "1.2.4",
3
+ "version": "1.2.5",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/internal/components/menu-item-primitive.js CHANGED
@@ -51,7 +51,7 @@ var wordBreakStyles = css({
51
51
  });
52
52
  var descriptionStyles = css({
53
53
  marginTop: itemDescriptionSpacing,
54
- color: "var(--ds-text-lowEmphasis, ".concat(N200, ")"),
54
+ color: "var(--ds-text-subtlest, ".concat(N200, ")"),
55
55
  fontSize: headingSizes.h200.size
56
56
  });
57
57
  var primitiveStyles = css({
@@ -84,11 +84,11 @@ var unselectedStyles = css({
84
84
  color: 'currentColor'
85
85
  },
86
86
  ':hover': {
87
- backgroundColor: "var(--ds-background-transparentNeutral-hover, ".concat(N20, ")"),
87
+ backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat(N20, ")"),
88
88
  color: 'currentColor'
89
89
  },
90
90
  ':active': {
91
- backgroundColor: "var(--ds-background-transparentNeutral-pressed, ".concat(N30, ")"),
91
+ backgroundColor: "var(--ds-background-neutral-subtle-pressed, ".concat(N30, ")"),
92
92
  boxShadow: 'none',
93
93
  color: 'currentColor'
94
94
  }
@@ -101,19 +101,19 @@ var disabledStyles = css({
101
101
  }
102
102
  });
103
103
  var selectedStyles = css({
104
- backgroundColor: "var(--ds-background-selected-resting, ".concat(N20, ")"),
104
+ backgroundColor: "var(--ds-background-brand, ".concat(N20, ")"),
105
105
  // Fallback set as babel plugin inserts one otherwise
106
- color: "var(--ds-text-selected, currentColor)",
106
+ color: "var(--ds-text-brand, currentColor)",
107
107
  ':visited': {
108
- color: "var(--ds-text-selected, currentColor)"
108
+ color: "var(--ds-text-brand, currentColor)"
109
109
  },
110
110
  ':hover': {
111
- backgroundColor: "var(--ds-background-selected-hover, ".concat(N20, ")"),
112
- color: "var(--ds-text-selected, currentColor)"
111
+ backgroundColor: "var(--ds-background-brand-hovered, ".concat(N20, ")"),
112
+ color: "var(--ds-text-brand, currentColor)"
113
113
  },
114
114
  ':active': {
115
- backgroundColor: "var(--ds-background-selected-pressed, ".concat(N30, ")"),
116
- color: "var(--ds-text-selected, currentColor)"
115
+ backgroundColor: "var(--ds-background-brand-pressed, ".concat(N30, ")"),
116
+ color: "var(--ds-text-brand, currentColor)"
117
117
  }
118
118
  });
119
119
  /**
package/dist/esm/menu-item/heading-item.js CHANGED
@@ -15,7 +15,7 @@ var itemHeadingContentHeight = headingSizes.h100.lineHeight;
15
15
  var itemHeadingFontSize = headingSizes.h100.size;
16
16
  var headingStyles = css({
17
17
  padding: "0 ".concat(itemSidePadding, "px"),
18
- color: "var(--ds-text-lowEmphasis, ".concat(N200, ")"),
18
+ color: "var(--ds-text-subtlest, ".concat(N200, ")"),
19
19
  fontSize: itemHeadingFontSize,
20
20
  fontWeight: 700,
21
21
  lineHeight: itemHeadingContentHeight / itemHeadingFontSize,
package/dist/esm/menu-item/skeleton-heading-item.js CHANGED
@@ -9,7 +9,7 @@ var skeletonStyles = css({
9
9
  display: 'block',
10
10
  width: '30%',
11
11
  height: gridSize(),
12
- backgroundColor: "var(--ds-background-subtleNeutral-resting, ".concat(skeletonColorFn(), ")"),
12
+ backgroundColor: "var(--ds-background-neutral, ".concat(skeletonColorFn(), ")"),
13
13
  borderRadius: 100,
14
14
  content: '""'
15
15
  }
package/dist/esm/menu-item/skeleton-item.js CHANGED
@@ -13,7 +13,7 @@ var skeletonItemElemSize = gridSize * 2.5;
13
13
  var itemElemSkeletonOffset = (itemExpectedElemSize - skeletonItemElemSize) / 2;
14
14
  var skeletonTextBorderRadius = 100;
15
15
  var skeletonContentHeight = 9;
16
- var skeletonColor = "var(--ds-background-subtleNeutral-resting, ".concat(skeletonColorFn(), ")");
16
+ var skeletonColor = "var(--ds-background-neutral, ".concat(skeletonColorFn(), ")");
17
17
  var skeletonStyles = css({
18
18
  display: 'flex',
19
19
  minHeight: itemMinHeight,
package/dist/esm/menu-section/section.js CHANGED
@@ -61,7 +61,7 @@ var unscrollableStyles = css({
61
61
  flexShrink: 0
62
62
  });
63
63
  var separatorStyles = css({
64
- borderTop: "2px solid var(".concat(VAR_SEPARATOR_COLOR, ", ").concat("var(--ds-border-neutral, ".concat(N30A, ")"), ")")
64
+ borderTop: "2px solid var(".concat(VAR_SEPARATOR_COLOR, ", ").concat("var(--ds-border, ".concat(N30A, ")"), ")")
65
65
  });
66
66
  var noSeparatorStyles = css({
67
67
  // this is to ensure that adjacent sections without separators don't get additional margins.
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/menu",
3
- "version": "1.2.4",
3
+ "version": "1.2.5",
4
4
  "sideEffects": false
5
5
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/menu",
3
- "version": "1.2.4",
3
+ "version": "1.2.5",
4
4
  "description": "A collection of composable menu components that can be used anywhere.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -38,7 +38,7 @@
38
38
  "@atlaskit/ds-lib": "^1.2.0",
39
39
  "@atlaskit/focus-ring": "^0.2.4",
40
40
  "@atlaskit/theme": "^12.1.0",
41
- "@atlaskit/tokens": "^0.5.0",
41
+ "@atlaskit/tokens": "^0.6.0",
42
42
  "@babel/runtime": "^7.0.0",
43
43
  "@emotion/core": "^10.0.9"
44
44
  },