@atlaskit/avatar 25.14.2 → 25.15.0

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 (11) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/cjs/avatar-content.compiled.css +0 -4
  3. package/dist/cjs/avatar-content.js +4 -14
  4. package/dist/cjs/avatar.js +1 -1
  5. package/dist/es2019/avatar-content.compiled.css +0 -4
  6. package/dist/es2019/avatar-content.js +4 -14
  7. package/dist/es2019/avatar.js +1 -1
  8. package/dist/esm/avatar-content.compiled.css +0 -4
  9. package/dist/esm/avatar-content.js +4 -14
  10. package/dist/esm/avatar.js +1 -1
  11. package/package.json +2 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/avatar
2
2
 
3
+ ## 25.15.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`e52f0046ff01d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e52f0046ff01d) -
8
+ Cleanup feature gate `platform_dst_hexagon_avatar_unified_size`. Hexagonal avatars now
9
+ consistently use unified sizing to align with other avatar types. We have not seen any regression
10
+ with this breaking alignment, but it's possible to have subtle breaking changes with unsafe style
11
+ overrides.
12
+
3
13
  ## 25.14.2
4
14
 
5
15
  ### Patch Changes
package/dist/cjs/avatar-content.compiled.css CHANGED
@@ -13,10 +13,6 @@
13
13
  ._18zr1dm9{padding-inline:var(--ds-border-width-selected,2px)}
14
14
  ._18zruxly{padding-inline:calc(var(--ds-border-width-selected, 2px)*.4)}
15
15
  ._195g1ksc{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1)}
16
- ._195g1ukp{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 8px)}
17
- ._195g8ocb{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 4px)}
18
- ._195gcwjc{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 1px)}
19
- ._195gs7t4{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 2px)}
20
16
  ._195gzwb8{margin-inline:calc(var(--ds-border-width-selected, 2px)*.4*-1)}
21
17
  ._1mou18m8{margin-block:calc(var(--ds-border-width-selected, 2px)*.5*-1)}
22
18
  ._1mou5h37{margin-block:calc(var(--ds-border-width-selected, 2px)*1.25*-1)}
package/dist/cjs/avatar-content.js CHANGED
@@ -29,11 +29,9 @@ var styles = {
29
29
  var unboundStyles = {
30
30
  rootCustomBorder: "_11q7cxp3",
31
31
  root: "_vchh1ntv _bfhkcxp3 _16qs1nhn",
32
- hexagonFocusContainer: "_1rjc1wgn _18zr1dm9 _1mou5h37 _bfhk1j28 _mkrz1k6g _1o9o1v1w",
33
- hexagonFocusContainerMarginFg: "_195g1ksc",
32
+ hexagonFocusContainer: "_1rjc1wgn _18zr1dm9 _1mou5h37 _195g1ksc _bfhk1j28 _mkrz1k6g _1o9o1v1w",
34
33
  hexagonBorderContainerCustomBorder: "_11q7cxp3",
35
- hexagonBorderContainer: "_1rjcf6hp _18zruxly _bfhkcxp3 _mkrz1kw7 _1o9ovuon",
36
- hexagonBorderContainerMarginFg: "_1mou18m8 _195gzwb8",
34
+ hexagonBorderContainer: "_1rjcf6hp _18zruxly _1mou18m8 _195gzwb8 _bfhkcxp3 _mkrz1kw7 _1o9ovuon",
37
35
  hexagon: "_2rkoidpf _mkrz1kw7 _16qsn7od _14mjidpf _1ejjn7od _128midpf _4davidpf",
38
36
  interactive: "_80omtlke _4tpu1f0r _ez1ykb7n _gcm1jer9 _eeh8kb7n _jlxit94y",
39
37
  interactiveMotion: "_v5641krm _1llweo6y"
@@ -46,14 +44,6 @@ var widthHeightMap = {
46
44
  xlarge: "_1bsb16xz _4t3i16xz",
47
45
  xxlarge: "_1bsb1qr7 _4t3i1qr7"
48
46
  };
49
- var marginAdjustmentMap = {
50
- xsmall: "_195gcwjc",
51
- small: "_195gcwjc",
52
- medium: "_195gs7t4",
53
- large: "_195gs7t4",
54
- xlarge: "_195g8ocb",
55
- xxlarge: "_195g1ukp"
56
- };
57
47
  /**
58
48
  * __Avatar content__
59
49
  *
@@ -115,9 +105,9 @@ var AvatarContent = exports.AvatarContent = /*#__PURE__*/(0, _react.forwardRef)(
115
105
  return /*#__PURE__*/React.createElement("div", {
116
106
  style: (0, _defineProperty2.default)((0, _defineProperty2.default)({}, bgColorCssVar, borderColor), boxShadowCssVar, "0 0 0 2px ".concat(borderColor)),
117
107
  "data-testid": testId ? "".concat(testId, "-hexagon-focus-container") : 'hexagon-focus-container',
118
- className: (0, _runtime.ax)([unboundStyles.hexagonFocusContainer, !(0, _platformFeatureFlags.fg)('platform_dst_hexagon_avatar_unified_size') && marginAdjustmentMap[size], (0, _platformFeatureFlags.fg)('platform_dst_hexagon_avatar_unified_size') && unboundStyles.hexagonFocusContainerMarginFg, isInteractive && !isDisabled && (0, _platformFeatureFlags.fg)('platform-dst-motion-uplift') && unboundStyles.interactiveMotion])
108
+ className: (0, _runtime.ax)([unboundStyles.hexagonFocusContainer, isInteractive && !isDisabled && (0, _platformFeatureFlags.fg)('platform-dst-motion-uplift') && unboundStyles.interactiveMotion])
119
109
  }, /*#__PURE__*/React.createElement("div", {
120
110
  "data-testid": testId ? "".concat(testId, "-hexagon-border-container") : 'hexagon-border-container',
121
- className: (0, _runtime.ax)([unboundStyles.hexagonBorderContainer, (0, _platformFeatureFlags.fg)('avatar-custom-border') && unboundStyles.hexagonBorderContainerCustomBorder, (0, _platformFeatureFlags.fg)('platform_dst_hexagon_avatar_unified_size') && unboundStyles.hexagonBorderContainerMarginFg])
111
+ className: (0, _runtime.ax)([unboundStyles.hexagonBorderContainer, (0, _platformFeatureFlags.fg)('avatar-custom-border') && unboundStyles.hexagonBorderContainerCustomBorder])
122
112
  }, renderedContent));
123
113
  });
package/dist/cjs/avatar.js CHANGED
@@ -26,7 +26,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
26
26
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
27
27
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
28
28
  var packageName = "@atlaskit/avatar";
29
- var packageVersion = "25.14.1";
29
+ var packageVersion = "0.0.0-development";
30
30
  var containerStyles = null;
31
31
 
32
32
  // eslint-disable-next-line @repo/internal/react/consistent-types-definitions
package/dist/es2019/avatar-content.compiled.css CHANGED
@@ -13,10 +13,6 @@
13
13
  ._18zr1dm9{padding-inline:var(--ds-border-width-selected,2px)}
14
14
  ._18zruxly{padding-inline:calc(var(--ds-border-width-selected, 2px)*.4)}
15
15
  ._195g1ksc{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1)}
16
- ._195g1ukp{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 8px)}
17
- ._195g8ocb{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 4px)}
18
- ._195gcwjc{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 1px)}
19
- ._195gs7t4{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 2px)}
20
16
  ._195gzwb8{margin-inline:calc(var(--ds-border-width-selected, 2px)*.4*-1)}
21
17
  ._1mou18m8{margin-block:calc(var(--ds-border-width-selected, 2px)*.5*-1)}
22
18
  ._1mou5h37{margin-block:calc(var(--ds-border-width-selected, 2px)*1.25*-1)}
package/dist/es2019/avatar-content.js CHANGED
@@ -19,11 +19,9 @@ const styles = {
19
19
  const unboundStyles = {
20
20
  rootCustomBorder: "_11q7cxp3",
21
21
  root: "_vchh1ntv _bfhkcxp3 _16qs1nhn",
22
- hexagonFocusContainer: "_1rjc1wgn _18zr1dm9 _1mou5h37 _bfhk1j28 _mkrz1k6g _1o9o1v1w",
23
- hexagonFocusContainerMarginFg: "_195g1ksc",
22
+ hexagonFocusContainer: "_1rjc1wgn _18zr1dm9 _1mou5h37 _195g1ksc _bfhk1j28 _mkrz1k6g _1o9o1v1w",
24
23
  hexagonBorderContainerCustomBorder: "_11q7cxp3",
25
- hexagonBorderContainer: "_1rjcf6hp _18zruxly _bfhkcxp3 _mkrz1kw7 _1o9ovuon",
26
- hexagonBorderContainerMarginFg: "_1mou18m8 _195gzwb8",
24
+ hexagonBorderContainer: "_1rjcf6hp _18zruxly _1mou18m8 _195gzwb8 _bfhkcxp3 _mkrz1kw7 _1o9ovuon",
27
25
  hexagon: "_2rkoidpf _mkrz1kw7 _16qsn7od _14mjidpf _1ejjn7od _128midpf _4davidpf",
28
26
  interactive: "_80omtlke _4tpu1f0r _ez1ykb7n _gcm1jer9 _eeh8kb7n _jlxit94y",
29
27
  interactiveMotion: "_v5641krm _1llweo6y"
@@ -36,14 +34,6 @@ const widthHeightMap = {
36
34
  xlarge: "_1bsb16xz _4t3i16xz",
37
35
  xxlarge: "_1bsb1qr7 _4t3i1qr7"
38
36
  };
39
- const marginAdjustmentMap = {
40
- xsmall: "_195gcwjc",
41
- small: "_195gcwjc",
42
- medium: "_195gs7t4",
43
- large: "_195gs7t4",
44
- xlarge: "_195g8ocb",
45
- xxlarge: "_195g1ukp"
46
- };
47
37
  /**
48
38
  * __Avatar content__
49
39
  *
@@ -112,9 +102,9 @@ export const AvatarContent = /*#__PURE__*/forwardRef(({
112
102
  [boxShadowCssVar]: `0 0 0 2px ${borderColor}`
113
103
  },
114
104
  "data-testid": testId ? `${testId}-hexagon-focus-container` : 'hexagon-focus-container',
115
- className: ax([unboundStyles.hexagonFocusContainer, !fg('platform_dst_hexagon_avatar_unified_size') && marginAdjustmentMap[size], fg('platform_dst_hexagon_avatar_unified_size') && unboundStyles.hexagonFocusContainerMarginFg, isInteractive && !isDisabled && fg('platform-dst-motion-uplift') && unboundStyles.interactiveMotion])
105
+ className: ax([unboundStyles.hexagonFocusContainer, isInteractive && !isDisabled && fg('platform-dst-motion-uplift') && unboundStyles.interactiveMotion])
116
106
  }, /*#__PURE__*/React.createElement("div", {
117
107
  "data-testid": testId ? `${testId}-hexagon-border-container` : 'hexagon-border-container',
118
- className: ax([unboundStyles.hexagonBorderContainer, fg('avatar-custom-border') && unboundStyles.hexagonBorderContainerCustomBorder, fg('platform_dst_hexagon_avatar_unified_size') && unboundStyles.hexagonBorderContainerMarginFg])
108
+ className: ax([unboundStyles.hexagonBorderContainer, fg('avatar-custom-border') && unboundStyles.hexagonBorderContainerCustomBorder])
119
109
  }, renderedContent));
120
110
  });
package/dist/es2019/avatar.js CHANGED
@@ -14,7 +14,7 @@ import PresenceWrapper from './internal/presence-wrapper';
14
14
  import StatusWrapper from './internal/status-wrapper';
15
15
  import { useAvatarContext } from './use-avatar-context';
16
16
  const packageName = "@atlaskit/avatar";
17
- const packageVersion = "25.14.1";
17
+ const packageVersion = "0.0.0-development";
18
18
  const containerStyles = null;
19
19
 
20
20
  // eslint-disable-next-line @repo/internal/react/consistent-types-definitions
package/dist/esm/avatar-content.compiled.css CHANGED
@@ -13,10 +13,6 @@
13
13
  ._18zr1dm9{padding-inline:var(--ds-border-width-selected,2px)}
14
14
  ._18zruxly{padding-inline:calc(var(--ds-border-width-selected, 2px)*.4)}
15
15
  ._195g1ksc{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1)}
16
- ._195g1ukp{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 8px)}
17
- ._195g8ocb{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 4px)}
18
- ._195gcwjc{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 1px)}
19
- ._195gs7t4{margin-inline:calc(var(--ds-border-width-selected, 2px)*-1 - 2px)}
20
16
  ._195gzwb8{margin-inline:calc(var(--ds-border-width-selected, 2px)*.4*-1)}
21
17
  ._1mou18m8{margin-block:calc(var(--ds-border-width-selected, 2px)*.5*-1)}
22
18
  ._1mou5h37{margin-block:calc(var(--ds-border-width-selected, 2px)*1.25*-1)}
package/dist/esm/avatar-content.js CHANGED
@@ -20,11 +20,9 @@ var styles = {
20
20
  var unboundStyles = {
21
21
  rootCustomBorder: "_11q7cxp3",
22
22
  root: "_vchh1ntv _bfhkcxp3 _16qs1nhn",
23
- hexagonFocusContainer: "_1rjc1wgn _18zr1dm9 _1mou5h37 _bfhk1j28 _mkrz1k6g _1o9o1v1w",
24
- hexagonFocusContainerMarginFg: "_195g1ksc",
23
+ hexagonFocusContainer: "_1rjc1wgn _18zr1dm9 _1mou5h37 _195g1ksc _bfhk1j28 _mkrz1k6g _1o9o1v1w",
25
24
  hexagonBorderContainerCustomBorder: "_11q7cxp3",
26
- hexagonBorderContainer: "_1rjcf6hp _18zruxly _bfhkcxp3 _mkrz1kw7 _1o9ovuon",
27
- hexagonBorderContainerMarginFg: "_1mou18m8 _195gzwb8",
25
+ hexagonBorderContainer: "_1rjcf6hp _18zruxly _1mou18m8 _195gzwb8 _bfhkcxp3 _mkrz1kw7 _1o9ovuon",
28
26
  hexagon: "_2rkoidpf _mkrz1kw7 _16qsn7od _14mjidpf _1ejjn7od _128midpf _4davidpf",
29
27
  interactive: "_80omtlke _4tpu1f0r _ez1ykb7n _gcm1jer9 _eeh8kb7n _jlxit94y",
30
28
  interactiveMotion: "_v5641krm _1llweo6y"
@@ -37,14 +35,6 @@ var widthHeightMap = {
37
35
  xlarge: "_1bsb16xz _4t3i16xz",
38
36
  xxlarge: "_1bsb1qr7 _4t3i1qr7"
39
37
  };
40
- var marginAdjustmentMap = {
41
- xsmall: "_195gcwjc",
42
- small: "_195gcwjc",
43
- medium: "_195gs7t4",
44
- large: "_195gs7t4",
45
- xlarge: "_195g8ocb",
46
- xxlarge: "_195g1ukp"
47
- };
48
38
  /**
49
39
  * __Avatar content__
50
40
  *
@@ -106,9 +96,9 @@ export var AvatarContent = /*#__PURE__*/forwardRef(function (_ref, ref) {
106
96
  return /*#__PURE__*/React.createElement("div", {
107
97
  style: _defineProperty(_defineProperty({}, bgColorCssVar, borderColor), boxShadowCssVar, "0 0 0 2px ".concat(borderColor)),
108
98
  "data-testid": testId ? "".concat(testId, "-hexagon-focus-container") : 'hexagon-focus-container',
109
- className: ax([unboundStyles.hexagonFocusContainer, !fg('platform_dst_hexagon_avatar_unified_size') && marginAdjustmentMap[size], fg('platform_dst_hexagon_avatar_unified_size') && unboundStyles.hexagonFocusContainerMarginFg, isInteractive && !isDisabled && fg('platform-dst-motion-uplift') && unboundStyles.interactiveMotion])
99
+ className: ax([unboundStyles.hexagonFocusContainer, isInteractive && !isDisabled && fg('platform-dst-motion-uplift') && unboundStyles.interactiveMotion])
110
100
  }, /*#__PURE__*/React.createElement("div", {
111
101
  "data-testid": testId ? "".concat(testId, "-hexagon-border-container") : 'hexagon-border-container',
112
- className: ax([unboundStyles.hexagonBorderContainer, fg('avatar-custom-border') && unboundStyles.hexagonBorderContainerCustomBorder, fg('platform_dst_hexagon_avatar_unified_size') && unboundStyles.hexagonBorderContainerMarginFg])
102
+ className: ax([unboundStyles.hexagonBorderContainer, fg('avatar-custom-border') && unboundStyles.hexagonBorderContainerCustomBorder])
113
103
  }, renderedContent));
114
104
  });
package/dist/esm/avatar.js CHANGED
@@ -17,7 +17,7 @@ import PresenceWrapper from './internal/presence-wrapper';
17
17
  import StatusWrapper from './internal/status-wrapper';
18
18
  import { useAvatarContext } from './use-avatar-context';
19
19
  var packageName = "@atlaskit/avatar";
20
- var packageVersion = "25.14.1";
20
+ var packageVersion = "0.0.0-development";
21
21
  var containerStyles = null;
22
22
 
23
23
  // eslint-disable-next-line @repo/internal/react/consistent-types-definitions
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar",
3
- "version": "25.14.2",
3
+ "version": "25.15.0",
4
4
  "description": "An avatar is a visual representation of a user or entity.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -63,7 +63,7 @@
63
63
  "@atlaskit/heading": "^5.4.0",
64
64
  "@atlaskit/link": "^3.4.0",
65
65
  "@atlaskit/range": "^10.1.0",
66
- "@atlaskit/section-message": "^8.12.0",
66
+ "@atlaskit/section-message": "^8.13.0",
67
67
  "@atlaskit/textfield": "^8.3.0",
68
68
  "@atlaskit/tooltip": "^22.2.0",
69
69
  "@atlassian/feature-flags-test-utils": "^1.1.0",
@@ -109,10 +109,6 @@
109
109
  "avatar-custom-border": {
110
110
  "type": "boolean"
111
111
  },
112
- "platform_dst_hexagon_avatar_unified_size": {
113
- "type": "boolean",
114
- "showOnWebsiteForTransitiveDependencies": true
115
- },
116
112
  "platform-dst-motion-uplift": {
117
113
  "type": "boolean"
118
114
  }