@atlaskit/avatar 25.4.3 → 25.5.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlaskit/avatar
2
2
 
3
+ ## 25.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`f70c3197f7179`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f70c3197f7179) -
8
+ [ux] add hexagon appearanceShape to user-picker based on appType as agent
9
+
10
+ ## 25.4.4
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+
3
16
  ## 25.4.3
4
17
 
5
18
  ### Patch Changes
@@ -110,8 +110,10 @@ var AvatarContent = exports.AvatarContent = /*#__PURE__*/(0, _react.forwardRef)(
110
110
  // layer multiple elements and use their background colors to create the different layers.
111
111
  return /*#__PURE__*/React.createElement("div", {
112
112
  style: (0, _defineProperty2.default)((0, _defineProperty2.default)({}, bgColorCssVar, borderColor), boxShadowCssVar, "0 0 0 2px ".concat(borderColor)),
113
+ "data-testid": testId ? "".concat(testId, "-hexagon-focus-container") : 'hexagon-focus-container',
113
114
  className: (0, _runtime.ax)([unboundStyles.hexagonFocusContainer, marginAdjustmentMap[size]])
114
115
  }, /*#__PURE__*/React.createElement("div", {
116
+ "data-testid": testId ? "".concat(testId, "-hexagon-border-container") : 'hexagon-border-container',
115
117
  className: (0, _runtime.ax)([unboundStyles.hexagonBorderContainer])
116
118
  }, renderedContent));
117
119
  });
@@ -24,7 +24,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
24
24
  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; }
25
25
  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; }
26
26
  var packageName = "@atlaskit/avatar";
27
- var packageVersion = "25.4.2";
27
+ var packageVersion = "25.4.4";
28
28
  var containerStyles = null;
29
29
 
30
30
  // eslint-disable-next-line @repo/internal/react/consistent-types-definitions
package/dist/cjs/index.js CHANGED
@@ -70,6 +70,12 @@ Object.defineProperty(exports, "default", {
70
70
  return _avatar.default;
71
71
  }
72
72
  });
73
+ Object.defineProperty(exports, "getAppearanceForAppType", {
74
+ enumerable: true,
75
+ get: function get() {
76
+ return _utilities.getAppearanceForAppType;
77
+ }
78
+ });
73
79
  Object.defineProperty(exports, "useAvatarContext", {
74
80
  enumerable: true,
75
81
  get: function get() {
@@ -82,5 +88,6 @@ var _avatarItem = _interopRequireDefault(require("./avatar-item"));
82
88
  var _presence = _interopRequireDefault(require("./presence"));
83
89
  var _status = _interopRequireDefault(require("./status"));
84
90
  var _skeleton = _interopRequireDefault(require("./skeleton"));
91
+ var _utilities = require("./utilities");
85
92
  var _context = require("./context");
86
93
  var _constants = require("./constants");
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
+ exports.getAppearanceForAppType = getAppearanceForAppType;
6
7
  exports.getCustomElement = void 0;
7
8
  var getCustomElement = exports.getCustomElement = function getCustomElement(isDisabled, href, onClick) {
8
9
  if (href && !isDisabled) {
@@ -12,4 +13,14 @@ var getCustomElement = exports.getCustomElement = function getCustomElement(isDi
12
13
  return 'button';
13
14
  }
14
15
  return 'span';
15
- };
16
+ };
17
+ function getAppearanceForAppType(appType) {
18
+ switch (appType) {
19
+ case 'agent':
20
+ return 'hexagon';
21
+ case 'user':
22
+ case 'system':
23
+ default:
24
+ return 'circle';
25
+ }
26
+ }
@@ -107,8 +107,10 @@ export const AvatarContent = /*#__PURE__*/forwardRef(({
107
107
  [bgColorCssVar]: borderColor,
108
108
  [boxShadowCssVar]: `0 0 0 2px ${borderColor}`
109
109
  },
110
+ "data-testid": testId ? `${testId}-hexagon-focus-container` : 'hexagon-focus-container',
110
111
  className: ax([unboundStyles.hexagonFocusContainer, marginAdjustmentMap[size]])
111
112
  }, /*#__PURE__*/React.createElement("div", {
113
+ "data-testid": testId ? `${testId}-hexagon-border-container` : 'hexagon-border-container',
112
114
  className: ax([unboundStyles.hexagonBorderContainer])
113
115
  }, renderedContent));
114
116
  });
@@ -12,7 +12,7 @@ import { PresenceWrapper } from './presence';
12
12
  import { StatusWrapper } from './status';
13
13
  import { getCustomElement } from './utilities';
14
14
  const packageName = "@atlaskit/avatar";
15
- const packageVersion = "25.4.2";
15
+ const packageVersion = "25.4.4";
16
16
  const containerStyles = null;
17
17
 
18
18
  // eslint-disable-next-line @repo/internal/react/consistent-types-definitions
@@ -4,5 +4,6 @@ export { default as AvatarItem } from './avatar-item';
4
4
  export { default as Presence } from './presence';
5
5
  export { default as Status } from './status';
6
6
  export { default as Skeleton } from './skeleton';
7
+ export { getAppearanceForAppType } from './utilities';
7
8
  export { AvatarContext, useAvatarContext } from './context';
8
9
  export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';
@@ -6,4 +6,14 @@ export const getCustomElement = (isDisabled, href, onClick) => {
6
6
  return 'button';
7
7
  }
8
8
  return 'span';
9
- };
9
+ };
10
+ export function getAppearanceForAppType(appType) {
11
+ switch (appType) {
12
+ case 'agent':
13
+ return 'hexagon';
14
+ case 'user':
15
+ case 'system':
16
+ default:
17
+ return 'circle';
18
+ }
19
+ }
@@ -101,8 +101,10 @@ export var AvatarContent = /*#__PURE__*/forwardRef(function (_ref, ref) {
101
101
  // layer multiple elements and use their background colors to create the different layers.
102
102
  return /*#__PURE__*/React.createElement("div", {
103
103
  style: _defineProperty(_defineProperty({}, bgColorCssVar, borderColor), boxShadowCssVar, "0 0 0 2px ".concat(borderColor)),
104
+ "data-testid": testId ? "".concat(testId, "-hexagon-focus-container") : 'hexagon-focus-container',
104
105
  className: ax([unboundStyles.hexagonFocusContainer, marginAdjustmentMap[size]])
105
106
  }, /*#__PURE__*/React.createElement("div", {
107
+ "data-testid": testId ? "".concat(testId, "-hexagon-border-container") : 'hexagon-border-container',
106
108
  className: ax([unboundStyles.hexagonBorderContainer])
107
109
  }, renderedContent));
108
110
  });
@@ -15,7 +15,7 @@ import { PresenceWrapper } from './presence';
15
15
  import { StatusWrapper } from './status';
16
16
  import { getCustomElement } from './utilities';
17
17
  var packageName = "@atlaskit/avatar";
18
- var packageVersion = "25.4.2";
18
+ var packageVersion = "25.4.4";
19
19
  var containerStyles = null;
20
20
 
21
21
  // eslint-disable-next-line @repo/internal/react/consistent-types-definitions
package/dist/esm/index.js CHANGED
@@ -4,5 +4,6 @@ export { default as AvatarItem } from './avatar-item';
4
4
  export { default as Presence } from './presence';
5
5
  export { default as Status } from './status';
6
6
  export { default as Skeleton } from './skeleton';
7
+ export { getAppearanceForAppType } from './utilities';
7
8
  export { AvatarContext, useAvatarContext } from './context';
8
9
  export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';
@@ -6,4 +6,14 @@ export var getCustomElement = function getCustomElement(isDisabled, href, onClic
6
6
  return 'button';
7
7
  }
8
8
  return 'span';
9
- };
9
+ };
10
+ export function getAppearanceForAppType(appType) {
11
+ switch (appType) {
12
+ case 'agent':
13
+ return 'hexagon';
14
+ case 'user':
15
+ case 'system':
16
+ default:
17
+ return 'circle';
18
+ }
19
+ }
@@ -9,6 +9,7 @@ export { default as Status } from './status';
9
9
  export type { StatusProps } from './status';
10
10
  export { default as Skeleton } from './skeleton';
11
11
  export type { SkeletonProps } from './skeleton';
12
+ export { getAppearanceForAppType } from './utilities';
12
13
  export { AvatarContext, type AvatarContextProps, useAvatarContext } from './context';
13
14
  export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';
14
15
  export type { AvatarClickEventHandler, AppearanceType, SizeType, Presence as PresenceType, Status as StatusType, IndicatorSizeType, } from './types';
@@ -1,2 +1,4 @@
1
1
  import { type MouseEventHandler } from 'react';
2
+ import type { AppearanceType } from './types';
2
3
  export declare const getCustomElement: (isDisabled?: boolean, href?: string, onClick?: MouseEventHandler) => "a" | "button" | "span";
4
+ export declare function getAppearanceForAppType(appType: string | null | undefined): AppearanceType;
@@ -9,6 +9,7 @@ export { default as Status } from './status';
9
9
  export type { StatusProps } from './status';
10
10
  export { default as Skeleton } from './skeleton';
11
11
  export type { SkeletonProps } from './skeleton';
12
+ export { getAppearanceForAppType } from './utilities';
12
13
  export { AvatarContext, type AvatarContextProps, useAvatarContext } from './context';
13
14
  export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';
14
15
  export type { AvatarClickEventHandler, AppearanceType, SizeType, Presence as PresenceType, Status as StatusType, IndicatorSizeType, } from './types';
@@ -1,2 +1,4 @@
1
1
  import { type MouseEventHandler } from 'react';
2
+ import type { AppearanceType } from './types';
2
3
  export declare const getCustomElement: (isDisabled?: boolean, href?: string, onClick?: MouseEventHandler) => "a" | "button" | "span";
4
+ export declare function getAppearanceForAppType(appType: string | null | undefined): AppearanceType;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar",
3
- "version": "25.4.3",
3
+ "version": "25.5.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/"
@@ -38,7 +38,7 @@
38
38
  "@atlaskit/focus-ring": "^3.0.0",
39
39
  "@atlaskit/icon": "^28.5.0",
40
40
  "@atlaskit/platform-feature-flags": "^1.1.0",
41
- "@atlaskit/primitives": "^15.0.0",
41
+ "@atlaskit/primitives": "^16.0.0",
42
42
  "@atlaskit/theme": "^21.0.0",
43
43
  "@atlaskit/tokens": "^7.0.0",
44
44
  "@babel/runtime": "^7.0.0",
@@ -60,8 +60,8 @@
60
60
  "@atlaskit/range": "^9.2.0",
61
61
  "@atlaskit/section-message": "^8.7.0",
62
62
  "@atlaskit/textfield": "^8.0.0",
63
- "@atlaskit/tooltip": "^20.5.0",
64
- "@atlassian/feature-flags-test-utils": "^0.3.0",
63
+ "@atlaskit/tooltip": "^20.6.0",
64
+ "@atlassian/feature-flags-test-utils": "^1.0.0",
65
65
  "@atlassian/ssr-tests": "^0.3.0",
66
66
  "@testing-library/react": "^13.4.0",
67
67
  "@testing-library/user-event": "^14.4.3",