@atlaskit/avatar-group 8.5.7 → 8.5.10
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 +19 -0
- package/dist/cjs/components/avatar-group-item.js +1 -0
- package/dist/cjs/components/more-indicator.js +3 -3
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/components/avatar-group-item.js +1 -0
- package/dist/es2019/components/more-indicator.js +11 -11
- package/dist/es2019/version.json +1 -1
- package/dist/esm/components/avatar-group-item.js +1 -0
- package/dist/esm/components/more-indicator.js +3 -3
- package/dist/esm/version.json +1 -1
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,24 @@
|
|
|
1
1
|
# @atlaskit/avatar-group
|
|
2
2
|
|
|
3
|
+
## 8.5.10
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 8.5.9
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`58884c2f6c1`](https://bitbucket.org/atlassian/atlassian-frontend/commits/58884c2f6c1) - Internal code change turning on a new linting rule.
|
|
14
|
+
|
|
15
|
+
## 8.5.8
|
|
16
|
+
|
|
17
|
+
### Patch Changes
|
|
18
|
+
|
|
19
|
+
- [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - Updates usage of deprecated token names so they're aligned with the latest naming conventions. No UI or visual changes
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
|
|
3
22
|
## 8.5.7
|
|
4
23
|
|
|
5
24
|
### Patch Changes
|
|
@@ -32,6 +32,7 @@ var AvatarGroupItem = function AvatarGroupItem(_ref) {
|
|
|
32
32
|
var CustomComponent = function CustomComponent(_ref2) {
|
|
33
33
|
var children = _ref2.children,
|
|
34
34
|
props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
|
|
35
|
+
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
35
36
|
return /*#__PURE__*/_react.default.createElement("span", props, children);
|
|
36
37
|
};
|
|
37
38
|
|
|
@@ -44,9 +44,9 @@ var getButtonStyles = function getButtonStyles(css, _ref) {
|
|
|
44
44
|
var size = _ref.size,
|
|
45
45
|
isActive = _ref.isActive;
|
|
46
46
|
// eslint-disable-next-line @repo/internal/react/no-css-string-literals
|
|
47
|
-
var activeStyles = css(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n transform: scale(", ");\n box-shadow: 0 0 0 ", "px ", ";\n color: ", ";\n "])), "var(--ds-background-
|
|
47
|
+
var activeStyles = css(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n transform: scale(", ");\n box-shadow: 0 0 0 ", "px ", ";\n color: ", ";\n "])), "var(--ds-background-brand, ".concat(_colors.B50, ")"), _avatar.ACTIVE_SCALE_FACTOR, _avatar.BORDER_WIDTH, "var(--ds-text-brand, ".concat(_colors.B300, ")"), "var(--ds-text-brand, ".concat(_colors.B400, ")")); // eslint-disable-next-line @repo/internal/react/no-css-string-literals
|
|
48
48
|
|
|
49
|
-
return css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n color: ", ";\n background-color: ", ";\n font-size: ", "px;\n font-family: inherit;\n font-weight: 500;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n opacity: 1;\n }\n }\n\n &:active {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: transparent;\n }\n }\n\n ", "\n "])), "var(--ds-text
|
|
49
|
+
return css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n color: ", ";\n background-color: ", ";\n font-size: ", "px;\n font-family: inherit;\n font-weight: 500;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n opacity: 1;\n }\n }\n\n &:active {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: transparent;\n }\n }\n\n ", "\n "])), "var(--ds-text, ".concat(_colors.N500, ")"), "var(--ds-background-neutral, ".concat(_colors.N20, ")"), FONT_SIZE[size], "var(--ds-background-neutral-hovered, ".concat(_colors.N30, ")"), "var(--ds-text, ".concat(_colors.N500, ")"), "var(--ds-background-neutral-hovered, ".concat(_colors.N30A, ")"), "var(--ds-background-neutral-pressed, ".concat(_colors.B50, ")"), "var(--ds-text, ".concat(_colors.B400, ")"), isActive && activeStyles);
|
|
50
50
|
};
|
|
51
51
|
|
|
52
52
|
var MAX_DISPLAY_COUNT = 99;
|
|
@@ -54,7 +54,7 @@ var MoreIndicator = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
|
|
|
54
54
|
var _ref2$appearance = _ref2.appearance,
|
|
55
55
|
appearance = _ref2$appearance === void 0 ? 'circle' : _ref2$appearance,
|
|
56
56
|
_ref2$borderColor = _ref2.borderColor,
|
|
57
|
-
borderColor = _ref2$borderColor === void 0 ? "var(--ds-
|
|
57
|
+
borderColor = _ref2$borderColor === void 0 ? "var(--ds-surface-overlay, ".concat((0, _colors.background)(), ")") : _ref2$borderColor,
|
|
58
58
|
_ref2$size = _ref2.size,
|
|
59
59
|
size = _ref2$size === void 0 ? 'medium' : _ref2$size,
|
|
60
60
|
_ref2$count = _ref2.count,
|
package/dist/cjs/version.json
CHANGED
|
@@ -20,31 +20,31 @@ const getButtonStyles = (css, {
|
|
|
20
20
|
}) => {
|
|
21
21
|
// eslint-disable-next-line @repo/internal/react/no-css-string-literals
|
|
22
22
|
const activeStyles = css`
|
|
23
|
-
background-color: ${`var(--ds-background-
|
|
23
|
+
background-color: ${`var(--ds-background-brand, ${B50})`};
|
|
24
24
|
transform: scale(${ACTIVE_SCALE_FACTOR});
|
|
25
|
-
box-shadow: 0 0 0 ${BORDER_WIDTH}px ${`var(--ds-text-
|
|
26
|
-
color: ${`var(--ds-text-
|
|
25
|
+
box-shadow: 0 0 0 ${BORDER_WIDTH}px ${`var(--ds-text-brand, ${B300})`};
|
|
26
|
+
color: ${`var(--ds-text-brand, ${B400})`};
|
|
27
27
|
`; // eslint-disable-next-line @repo/internal/react/no-css-string-literals
|
|
28
28
|
|
|
29
29
|
return css`
|
|
30
|
-
color: ${`var(--ds-text
|
|
31
|
-
background-color: ${`var(--ds-background-
|
|
30
|
+
color: ${`var(--ds-text, ${N500})`};
|
|
31
|
+
background-color: ${`var(--ds-background-neutral, ${N20})`};
|
|
32
32
|
font-size: ${FONT_SIZE[size]}px;
|
|
33
33
|
font-family: inherit;
|
|
34
34
|
font-weight: 500;
|
|
35
35
|
|
|
36
36
|
&:hover {
|
|
37
|
-
background-color: ${`var(--ds-background-
|
|
38
|
-
color: ${`var(--ds-text
|
|
37
|
+
background-color: ${`var(--ds-background-neutral-hovered, ${N30})`};
|
|
38
|
+
color: ${`var(--ds-text, ${N500})`};
|
|
39
39
|
&:after {
|
|
40
|
-
background-color: ${`var(--ds-background-
|
|
40
|
+
background-color: ${`var(--ds-background-neutral-hovered, ${N30A})`};
|
|
41
41
|
opacity: 1;
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
&:active {
|
|
46
|
-
background-color: ${`var(--ds-background-
|
|
47
|
-
color: ${`var(--ds-text
|
|
46
|
+
background-color: ${`var(--ds-background-neutral-pressed, ${B50})`};
|
|
47
|
+
color: ${`var(--ds-text, ${B400})`};
|
|
48
48
|
&:after {
|
|
49
49
|
background-color: transparent;
|
|
50
50
|
}
|
|
@@ -57,7 +57,7 @@ const getButtonStyles = (css, {
|
|
|
57
57
|
const MAX_DISPLAY_COUNT = 99;
|
|
58
58
|
const MoreIndicator = /*#__PURE__*/forwardRef(({
|
|
59
59
|
appearance = 'circle',
|
|
60
|
-
borderColor = `var(--ds-
|
|
60
|
+
borderColor = `var(--ds-surface-overlay, ${background()})`,
|
|
61
61
|
size = 'medium',
|
|
62
62
|
count = 0,
|
|
63
63
|
testId,
|
package/dist/es2019/version.json
CHANGED
|
@@ -20,6 +20,7 @@ var AvatarGroupItem = function AvatarGroupItem(_ref) {
|
|
|
20
20
|
var children = _ref2.children,
|
|
21
21
|
props = _objectWithoutProperties(_ref2, _excluded2);
|
|
22
22
|
|
|
23
|
+
// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
|
|
23
24
|
return /*#__PURE__*/React.createElement("span", props, children);
|
|
24
25
|
};
|
|
25
26
|
|
|
@@ -23,9 +23,9 @@ var getButtonStyles = function getButtonStyles(css, _ref) {
|
|
|
23
23
|
var size = _ref.size,
|
|
24
24
|
isActive = _ref.isActive;
|
|
25
25
|
// eslint-disable-next-line @repo/internal/react/no-css-string-literals
|
|
26
|
-
var activeStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: ", ";\n transform: scale(", ");\n box-shadow: 0 0 0 ", "px ", ";\n color: ", ";\n "])), "var(--ds-background-
|
|
26
|
+
var activeStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: ", ";\n transform: scale(", ");\n box-shadow: 0 0 0 ", "px ", ";\n color: ", ";\n "])), "var(--ds-background-brand, ".concat(B50, ")"), ACTIVE_SCALE_FACTOR, BORDER_WIDTH, "var(--ds-text-brand, ".concat(B300, ")"), "var(--ds-text-brand, ".concat(B400, ")")); // eslint-disable-next-line @repo/internal/react/no-css-string-literals
|
|
27
27
|
|
|
28
|
-
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n color: ", ";\n background-color: ", ";\n font-size: ", "px;\n font-family: inherit;\n font-weight: 500;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n opacity: 1;\n }\n }\n\n &:active {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: transparent;\n }\n }\n\n ", "\n "])), "var(--ds-text
|
|
28
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n color: ", ";\n background-color: ", ";\n font-size: ", "px;\n font-family: inherit;\n font-weight: 500;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n opacity: 1;\n }\n }\n\n &:active {\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: transparent;\n }\n }\n\n ", "\n "])), "var(--ds-text, ".concat(N500, ")"), "var(--ds-background-neutral, ".concat(N20, ")"), FONT_SIZE[size], "var(--ds-background-neutral-hovered, ".concat(N30, ")"), "var(--ds-text, ".concat(N500, ")"), "var(--ds-background-neutral-hovered, ".concat(N30A, ")"), "var(--ds-background-neutral-pressed, ".concat(B50, ")"), "var(--ds-text, ".concat(B400, ")"), isActive && activeStyles);
|
|
29
29
|
};
|
|
30
30
|
|
|
31
31
|
var MAX_DISPLAY_COUNT = 99;
|
|
@@ -33,7 +33,7 @@ var MoreIndicator = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
33
33
|
var _ref2$appearance = _ref2.appearance,
|
|
34
34
|
appearance = _ref2$appearance === void 0 ? 'circle' : _ref2$appearance,
|
|
35
35
|
_ref2$borderColor = _ref2.borderColor,
|
|
36
|
-
borderColor = _ref2$borderColor === void 0 ? "var(--ds-
|
|
36
|
+
borderColor = _ref2$borderColor === void 0 ? "var(--ds-surface-overlay, ".concat(background(), ")") : _ref2$borderColor,
|
|
37
37
|
_ref2$size = _ref2.size,
|
|
38
38
|
size = _ref2$size === void 0 ? 'medium' : _ref2$size,
|
|
39
39
|
_ref2$count = _ref2.count,
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/avatar-group",
|
|
3
|
-
"version": "8.5.
|
|
3
|
+
"version": "8.5.10",
|
|
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/"
|
|
@@ -24,10 +24,10 @@
|
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"@atlaskit/avatar": "^20.5.0",
|
|
27
|
-
"@atlaskit/menu": "^1.
|
|
27
|
+
"@atlaskit/menu": "^1.3.0",
|
|
28
28
|
"@atlaskit/popup": "^1.3.0",
|
|
29
29
|
"@atlaskit/theme": "^12.1.0",
|
|
30
|
-
"@atlaskit/tokens": "^0.
|
|
30
|
+
"@atlaskit/tokens": "^0.7.0",
|
|
31
31
|
"@atlaskit/tooltip": "^17.5.0",
|
|
32
32
|
"@babel/runtime": "^7.0.0",
|
|
33
33
|
"@emotion/core": "^10.0.9"
|
|
@@ -37,10 +37,10 @@
|
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
39
|
"@atlaskit/analytics-next": "^8.2.0",
|
|
40
|
-
"@atlaskit/button": "^16.
|
|
40
|
+
"@atlaskit/button": "^16.2.0",
|
|
41
41
|
"@atlaskit/code": "^14.3.0",
|
|
42
42
|
"@atlaskit/docs": "*",
|
|
43
|
-
"@atlaskit/
|
|
43
|
+
"@atlaskit/form": "^8.4.5",
|
|
44
44
|
"@atlaskit/icon": "^21.10.0",
|
|
45
45
|
"@atlaskit/modal-dialog": "^12.2.0",
|
|
46
46
|
"@atlaskit/section-message": "^6.1.0",
|