@atlaskit/avatar-group 9.0.2 → 9.0.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.
Files changed (8) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/components/more-indicator.js +14 -10
  3. package/dist/cjs/version.json +1 -1
  4. package/dist/es2019/components/more-indicator.js +15 -11
  5. package/dist/es2019/version.json +1 -1
  6. package/dist/esm/components/more-indicator.js +15 -11
  7. package/dist/esm/version.json +1 -1
  8. package/package.json +6 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/avatar-group
2
2
 
3
+ ## 9.0.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`4bc286406f2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4bc286406f2) - [ux] Update more indicator icon to use new design tokens and remove the unnecessary use of the :after element with regards to the consumption of the Avatar component.
8
+ - Updated dependencies
9
+
3
10
  ## 9.0.2
4
11
 
5
12
  ### Patch Changes
package/dist/cjs/components/more-indicator.js CHANGED
@@ -41,7 +41,15 @@ var buttonActiveStyles = (0, _core.css)({
41
41
  backgroundColor: "var(--ds-background-selected, ".concat(_colors.B50, ")"),
42
42
  boxShadow: "0 0 0 ".concat(_avatar.BORDER_WIDTH, "px ", "var(--ds-border-selected, ".concat(_colors.B300, ")")),
43
43
  color: "var(--ds-text-selected, ".concat(_colors.B400, ")"),
44
- transform: "scale(".concat(_avatar.ACTIVE_SCALE_FACTOR, ")")
44
+ transform: "scale(".concat(_avatar.ACTIVE_SCALE_FACTOR, ")"),
45
+ '&:hover': {
46
+ backgroundColor: "var(--ds-background-selected-hovered, ".concat(_colors.N30, ")"),
47
+ color: "var(--ds-text-selected, ".concat(_colors.N500, ")")
48
+ },
49
+ '&:active': {
50
+ backgroundColor: "var(--ds-background-selected-pressed, ".concat(_colors.B50, ")"),
51
+ color: "var(--ds-text-selected, ".concat(_colors.B400, ")")
52
+ }
45
53
  }
46
54
  });
47
55
  var buttonStyles = (0, _core.css)({
@@ -53,18 +61,14 @@ var buttonStyles = (0, _core.css)({
53
61
  fontWeight: 500,
54
62
  '&:hover': {
55
63
  backgroundColor: "var(--ds-background-neutral-hovered, ".concat(_colors.N30, ")"),
56
- color: "var(--ds-text, ".concat(_colors.N500, ")"),
57
- '&:after': {
58
- backgroundColor: "var(--ds-background-neutral-hovered, ".concat(_colors.N30A, ")"),
59
- opacity: 1
60
- }
64
+ color: "var(--ds-text, ".concat(_colors.N500, ")")
61
65
  },
62
66
  '&:active': {
63
67
  backgroundColor: "var(--ds-background-neutral-pressed, ".concat(_colors.B50, ")"),
64
- color: "var(--ds-text, ".concat(_colors.B400, ")"),
65
- '&:after': {
66
- backgroundColor: 'transparent'
67
- }
68
+ color: "var(--ds-text, ".concat(_colors.B400, ")")
69
+ },
70
+ '&:after': {
71
+ display: 'none'
68
72
  }
69
73
  }
70
74
  });
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar-group",
3
- "version": "9.0.2",
3
+ "version": "9.0.3",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/components/more-indicator.js CHANGED
@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/extends";
4
4
  import { forwardRef, useCallback } from 'react';
5
5
  import { css, jsx } from '@emotion/core';
6
6
  import Avatar, { ACTIVE_SCALE_FACTOR, BORDER_WIDTH } from '@atlaskit/avatar';
7
- import { B300, B400, B50, N0, N20, N30, N30A, N500 } from '@atlaskit/theme/colors';
7
+ import { B300, B400, B50, N0, N20, N30, N500 } from '@atlaskit/theme/colors';
8
8
  const FONT_SIZE = {
9
9
  xsmall: '10px',
10
10
  small: '10px',
@@ -19,7 +19,15 @@ const buttonActiveStyles = css({
19
19
  backgroundColor: `var(--ds-background-selected, ${B50})`,
20
20
  boxShadow: `0 0 0 ${BORDER_WIDTH}px ${`var(--ds-border-selected, ${B300})`}`,
21
21
  color: `var(--ds-text-selected, ${B400})`,
22
- transform: `scale(${ACTIVE_SCALE_FACTOR})`
22
+ transform: `scale(${ACTIVE_SCALE_FACTOR})`,
23
+ '&:hover': {
24
+ backgroundColor: `var(--ds-background-selected-hovered, ${N30})`,
25
+ color: `var(--ds-text-selected, ${N500})`
26
+ },
27
+ '&:active': {
28
+ backgroundColor: `var(--ds-background-selected-pressed, ${B50})`,
29
+ color: `var(--ds-text-selected, ${B400})`
30
+ }
23
31
  }
24
32
  });
25
33
  const buttonStyles = css({
@@ -31,18 +39,14 @@ const buttonStyles = css({
31
39
  fontWeight: 500,
32
40
  '&:hover': {
33
41
  backgroundColor: `var(--ds-background-neutral-hovered, ${N30})`,
34
- color: `var(--ds-text, ${N500})`,
35
- '&:after': {
36
- backgroundColor: `var(--ds-background-neutral-hovered, ${N30A})`,
37
- opacity: 1
38
- }
42
+ color: `var(--ds-text, ${N500})`
39
43
  },
40
44
  '&:active': {
41
45
  backgroundColor: `var(--ds-background-neutral-pressed, ${B50})`,
42
- color: `var(--ds-text, ${B400})`,
43
- '&:after': {
44
- backgroundColor: 'transparent'
45
- }
46
+ color: `var(--ds-text, ${B400})`
47
+ },
48
+ '&:after': {
49
+ display: 'none'
46
50
  }
47
51
  }
48
52
  });
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar-group",
3
- "version": "9.0.2",
3
+ "version": "9.0.3",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/components/more-indicator.js CHANGED
@@ -6,7 +6,7 @@ var _excluded = ["testId", "className", "ref"];
6
6
  import { forwardRef, useCallback } from 'react';
7
7
  import { css, jsx } from '@emotion/core';
8
8
  import Avatar, { ACTIVE_SCALE_FACTOR, BORDER_WIDTH } from '@atlaskit/avatar';
9
- import { B300, B400, B50, N0, N20, N30, N30A, N500 } from '@atlaskit/theme/colors';
9
+ import { B300, B400, B50, N0, N20, N30, N500 } from '@atlaskit/theme/colors';
10
10
  var FONT_SIZE = {
11
11
  xsmall: '10px',
12
12
  small: '10px',
@@ -21,7 +21,15 @@ var buttonActiveStyles = css({
21
21
  backgroundColor: "var(--ds-background-selected, ".concat(B50, ")"),
22
22
  boxShadow: "0 0 0 ".concat(BORDER_WIDTH, "px ", "var(--ds-border-selected, ".concat(B300, ")")),
23
23
  color: "var(--ds-text-selected, ".concat(B400, ")"),
24
- transform: "scale(".concat(ACTIVE_SCALE_FACTOR, ")")
24
+ transform: "scale(".concat(ACTIVE_SCALE_FACTOR, ")"),
25
+ '&:hover': {
26
+ backgroundColor: "var(--ds-background-selected-hovered, ".concat(N30, ")"),
27
+ color: "var(--ds-text-selected, ".concat(N500, ")")
28
+ },
29
+ '&:active': {
30
+ backgroundColor: "var(--ds-background-selected-pressed, ".concat(B50, ")"),
31
+ color: "var(--ds-text-selected, ".concat(B400, ")")
32
+ }
25
33
  }
26
34
  });
27
35
  var buttonStyles = css({
@@ -33,18 +41,14 @@ var buttonStyles = css({
33
41
  fontWeight: 500,
34
42
  '&:hover': {
35
43
  backgroundColor: "var(--ds-background-neutral-hovered, ".concat(N30, ")"),
36
- color: "var(--ds-text, ".concat(N500, ")"),
37
- '&:after': {
38
- backgroundColor: "var(--ds-background-neutral-hovered, ".concat(N30A, ")"),
39
- opacity: 1
40
- }
44
+ color: "var(--ds-text, ".concat(N500, ")")
41
45
  },
42
46
  '&:active': {
43
47
  backgroundColor: "var(--ds-background-neutral-pressed, ".concat(B50, ")"),
44
- color: "var(--ds-text, ".concat(B400, ")"),
45
- '&:after': {
46
- backgroundColor: 'transparent'
47
- }
48
+ color: "var(--ds-text, ".concat(B400, ")")
49
+ },
50
+ '&:after': {
51
+ display: 'none'
48
52
  }
49
53
  }
50
54
  });
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar-group",
3
- "version": "9.0.2",
3
+ "version": "9.0.3",
4
4
  "sideEffects": false
5
5
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar-group",
3
- "version": "9.0.2",
3
+ "version": "9.0.3",
4
4
  "description": "An avatar group displays a number of avatars grouped together in a stack or grid.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
29
29
  "@atlaskit/avatar": "^21.0.0",
30
30
  "@atlaskit/menu": "^1.3.0",
31
31
  "@atlaskit/popup": "^1.4.0",
32
- "@atlaskit/theme": "^12.1.0",
32
+ "@atlaskit/theme": "^12.2.0",
33
33
  "@atlaskit/tokens": "^0.10.0",
34
34
  "@atlaskit/tooltip": "^17.5.0",
35
35
  "@babel/runtime": "^7.0.0",
@@ -45,14 +45,14 @@
45
45
  "@atlaskit/docs": "*",
46
46
  "@atlaskit/form": "^8.4.5",
47
47
  "@atlaskit/icon": "^21.10.0",
48
- "@atlaskit/modal-dialog": "^12.2.0",
49
- "@atlaskit/section-message": "^6.1.0",
48
+ "@atlaskit/modal-dialog": "^12.3.0",
49
+ "@atlaskit/section-message": "^6.2.0",
50
50
  "@atlaskit/ssr": "*",
51
- "@atlaskit/toggle": "^12.4.0",
51
+ "@atlaskit/toggle": "^12.5.0",
52
52
  "@atlaskit/visual-regression": "*",
53
53
  "@atlaskit/webdriver-runner": "*",
54
54
  "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
55
- "@emotion/styled": "^10.0.7",
55
+ "@emotion/styled": "^11.0.0",
56
56
  "@testing-library/react": "^8.0.1",
57
57
  "lodash": "^4.17.21",
58
58
  "react-dom": "^16.8.0",