@atlaskit/avatar-group 9.2.0 → 9.2.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/avatar-group
 
+## 9.2.2
+
+### Patch Changes
+
+- [`18aeca8c199`](https://bitbucket.org/atlassian/atlassian-frontend/commits/18aeca8c199) - Internal change to update token references. There is no expected behaviour or visual change.
+
+## 9.2.1
+
+### Patch Changes
+
+- [`b0f6dd0bc35`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b0f6dd0bc35) - Updated to use typography tokens. There is no expected behaviour or visual change.
+
 ## 9.2.0
 
 ### Minor Changes

package/dist/cjs/components/avatar-group-item.js

@@ -1,51 +1,40 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _avatar = _interopRequireDefault(require("@atlaskit/avatar"));
-
 var _menu = require("@atlaskit/menu");
-
 var _excluded = ["href", "onClick"],
-    _excluded2 = ["children"];
-
+  _excluded2 = ["children"];
 var AvatarGroupItem = function AvatarGroupItem(_ref) {
   var avatar = _ref.avatar,
-      onAvatarClick = _ref.onAvatarClick,
-      testId = _ref.testId,
-      index = _ref.index;
+    onAvatarClick = _ref.onAvatarClick,
+    testId = _ref.testId,
+    index = _ref.index;
   var href = avatar.href,
-      onClick = avatar.onClick,
-      rest = (0, _objectWithoutProperties2.default)(avatar, _excluded);
-
+    onClick = avatar.onClick,
+    rest = (0, _objectWithoutProperties2.default)(avatar, _excluded);
   var CustomComponent = function CustomComponent(_ref2) {
     var children = _ref2.children,
-        props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
     return /*#__PURE__*/_react.default.createElement("span", props, children);
   };
-
   var AvatarIcon = /*#__PURE__*/_react.default.createElement(_avatar.default, (0, _extends2.default)({}, rest, {
     testId: testId && "".concat(testId, "--avatar"),
     borderColor: "transparent",
     size: "small",
     name: ""
-  })); // onClick handler provided with avatar data takes precedence, same as with the normal avatar item
-
+  }));
 
+  // onClick handler provided with avatar data takes precedence, same as with the normal avatar item
   var callback = onClick || onAvatarClick;
-
   if (href) {
     return /*#__PURE__*/_react.default.createElement(_menu.LinkItem, {
       href: href,
@@ -58,7 +47,6 @@ var AvatarGroupItem = function AvatarGroupItem(_ref) {
       }
     }, avatar.name);
   }
-
   if (typeof callback === 'function') {
     return /*#__PURE__*/_react.default.createElement(_menu.ButtonItem, {
       onClick: function onClick(event) {
@@ -68,14 +56,13 @@ var AvatarGroupItem = function AvatarGroupItem(_ref) {
       testId: testId
     }, avatar.name);
   }
-
   return /*#__PURE__*/_react.default.createElement(_menu.CustomItem, {
     iconBefore: AvatarIcon,
     component: CustomComponent,
     testId: testId
   }, avatar.name);
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 var _default = AvatarGroupItem;
 exports.default = _default;

package/dist/cjs/components/avatar-group.js

@@ -1,51 +1,31 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = require("react");
-
 var _react2 = require("@emotion/react");
-
 var _avatar = _interopRequireDefault(require("@atlaskit/avatar"));
-
 var _menu = require("@atlaskit/menu");
-
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
-
 var _constants = require("@atlaskit/theme/constants");
-
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-
 var _avatarGroupItem = _interopRequireDefault(require("./avatar-group-item"));
-
 var _grid = _interopRequireDefault(require("./grid"));
-
 var _moreIndicator = _interopRequireDefault(require("./more-indicator"));
-
 var _stack = _interopRequireDefault(require("./stack"));
-
 var _utils = require("./utils");
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var MAX_COUNT = {
   grid: 11,
   stack: 5
 };
-
 function getOverrides(overrides) {
   return {
     AvatarGroupItem: _objectSpread({
@@ -64,6 +44,7 @@ function getOverrides(overrides) {
     }, overrides && overrides.Avatar)
   };
 }
+
 /**
  * __Avatar group__
  *
@@ -73,45 +54,39 @@ function getOverrides(overrides) {
  * - [Code](https://atlassian.design/components/avatar-group/code)
  * - [Usage](https://atlassian.design/components/avatar-group/usage)
  */
-
-
 var AvatarGroup = function AvatarGroup(_ref) {
   var _ref$appearance = _ref.appearance,
-      appearance = _ref$appearance === void 0 ? 'stack' : _ref$appearance,
-      _ref$avatar = _ref.avatar,
-      avatar = _ref$avatar === void 0 ? _avatar.default : _ref$avatar,
-      borderColor = _ref.borderColor,
-      boundariesElement = _ref.boundariesElement,
-      data = _ref.data,
-      isTooltipDisabled = _ref.isTooltipDisabled,
-      maxCount = _ref.maxCount,
-      onAvatarClick = _ref.onAvatarClick,
-      onMoreClick = _ref.onMoreClick,
-      overrides = _ref.overrides,
-      _ref$showMoreButtonPr = _ref.showMoreButtonProps,
-      showMoreButtonProps = _ref$showMoreButtonPr === void 0 ? {} : _ref$showMoreButtonPr,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'medium' : _ref$size,
-      testId = _ref.testId,
-      _ref$label = _ref.label,
-      label = _ref$label === void 0 ? 'avatar group' : _ref$label,
-      _ref$tooltipPosition = _ref.tooltipPosition,
-      tooltipPosition = _ref$tooltipPosition === void 0 ? 'bottom' : _ref$tooltipPosition;
-
+    appearance = _ref$appearance === void 0 ? 'stack' : _ref$appearance,
+    _ref$avatar = _ref.avatar,
+    avatar = _ref$avatar === void 0 ? _avatar.default : _ref$avatar,
+    borderColor = _ref.borderColor,
+    boundariesElement = _ref.boundariesElement,
+    data = _ref.data,
+    isTooltipDisabled = _ref.isTooltipDisabled,
+    maxCount = _ref.maxCount,
+    onAvatarClick = _ref.onAvatarClick,
+    onMoreClick = _ref.onMoreClick,
+    overrides = _ref.overrides,
+    _ref$showMoreButtonPr = _ref.showMoreButtonProps,
+    showMoreButtonProps = _ref$showMoreButtonPr === void 0 ? {} : _ref$showMoreButtonPr,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
+    testId = _ref.testId,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? 'avatar group' : _ref$label,
+    _ref$tooltipPosition = _ref.tooltipPosition,
+    tooltipPosition = _ref$tooltipPosition === void 0 ? 'bottom' : _ref$tooltipPosition;
   var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      isOpen = _useState2[0],
-      setIsOpen = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
   var onClose = (0, _react.useCallback)(function () {
     return setIsOpen(false);
   }, []);
-
   function renderMoreDropdown(max, total) {
     if (total <= max) {
       return null;
     }
-
     var renderMoreButton = function renderMoreButton(props) {
       return (0, _react2.jsx)(_moreIndicator.default, (0, _extends2.default)({
         buttonProps: showMoreButtonProps,
@@ -121,26 +96,23 @@ var AvatarGroup = function AvatarGroup(_ref) {
         testId: testId && "".concat(testId, "--overflow-menu--trigger"),
         isActive: isOpen
       }, props));
-    }; // bail if the consumer wants to handle onClick
-
+    };
 
+    // bail if the consumer wants to handle onClick
     if (typeof onMoreClick === 'function') {
       return renderMoreButton({
         onClick: onMoreClick
       });
-    } // split boundariesElement into `boundary` and `rootBoundary` props for Popup
-
+    }
 
+    // split boundariesElement into `boundary` and `rootBoundary` props for Popup
     var boundary = boundariesElement === 'scrollParent' ? 'clippingParents' : undefined;
-
     var rootBoundary = function () {
       if (boundariesElement === 'scrollParent') {
         return undefined;
       }
-
       return boundariesElement === 'window' ? 'document' : 'viewport';
     }();
-
     return (0, _react2.jsx)(_popup.default, {
       isOpen: isOpen,
       onClose: onClose,
@@ -162,7 +134,8 @@ var AvatarGroup = function AvatarGroup(_ref) {
             onAvatarClick: onAvatarClick,
             testId: testId && "".concat(testId, "--avatar-group-item-").concat(index + max),
             index: index + max
-          }, // This index holds the true index,
+          },
+          // This index holds the true index,
           // adding up the index of non-overflowed avatars and overflowed avatars.
           index + max);
         })));
@@ -177,7 +150,6 @@ var AvatarGroup = function AvatarGroup(_ref) {
       testId: testId && "".concat(testId, "--overflow-menu")
     });
   }
-
   var max = maxCount === undefined || maxCount === 0 ? MAX_COUNT[appearance] : maxCount;
   var total = data.length;
   var maxAvatar = total > max ? max - 1 : max;
@@ -204,6 +176,5 @@ var AvatarGroup = function AvatarGroup(_ref) {
     }, finalAvatar) : finalAvatar;
   }), renderMoreDropdown(+maxAvatar, total));
 };
-
 var _default = AvatarGroup;
 exports.default = _default;

package/dist/cjs/components/grid.js

@@ -4,45 +4,35 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _react2 = require("@emotion/react");
-
 var _constants = require("@atlaskit/theme/constants");
-
 /** @jsx jsx */
+
 var gridSize = (0, _constants.gridSize)();
 var gutter = gridSize / 2;
 var listStyles = (0, _react2.css)({
   // removes default ul styles. Needs !important to override contextual styles in product.
   display: 'flex',
-  // TODO Delete this comment after verifying spacing token -> previous value `0`
-  margin: "var(--ds-scale-0, 0px)",
+  margin: "var(--ds-space-0, 0px)",
   marginRight: -gutter,
   marginLeft: -gutter,
-  // TODO Delete this comment after verifying spacing token -> previous value `0`
-  padding: "var(--ds-scale-0, 0px)",
+  padding: "var(--ds-space-0, 0px)",
   justifyContent: 'flex-start',
   flexWrap: 'wrap',
   lineHeight: 1,
   listStyleType: 'none !important'
 });
 var listItemStyles = (0, _react2.css)({
-  // TODO Delete this comment after verifying spacing token -> previous value `0`
-  margin: "var(--ds-scale-0, 0px)",
-  // TODO Delete this comment after verifying spacing token -> previous value `gridSize`
-  marginBottom: "var(--ds-scale-100, 8px)",
-  // TODO Delete this comment after verifying spacing token -> previous value `gutter`
-  paddingRight: "var(--ds-scale-050, 4px)",
-  // TODO Delete this comment after verifying spacing token -> previous value `gutter`
-  paddingLeft: "var(--ds-scale-050, 4px)"
+  margin: "var(--ds-space-0, 0px)",
+  marginBottom: "var(--ds-space-100, 8px)",
+  paddingRight: "var(--ds-space-050, 4px)",
+  paddingLeft: "var(--ds-space-050, 4px)"
 });
-
 var Grid = function Grid(_ref) {
   var children = _ref.children,
-      testId = _ref.testId,
-      label = _ref['aria-label'];
+    testId = _ref.testId,
+    label = _ref['aria-label'];
   return (0, _react2.jsx)("ul", {
     "data-testid": testId,
     "aria-label": label,
@@ -52,8 +42,8 @@ var Grid = function Grid(_ref) {
       css: listItemStyles
     }, child);
   }));
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 var _default = Grid;
 exports.default = _default;

package/dist/cjs/components/more-indicator.js

@@ -1,32 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _react = require("react");
-
 var _react2 = require("@emotion/react");
-
 var _avatar = _interopRequireWildcard(require("@atlaskit/avatar"));
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _excluded = ["testId", "className", "ref"];
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var FONT_SIZE = {
   xsmall: '10px',
   small: '10px',
@@ -57,8 +45,9 @@ var buttonStyles = (0, _react2.css)({
   '&&': {
     backgroundColor: "var(--ds-background-neutral, ".concat(_colors.N20, ")"),
     color: "var(--ds-text, ".concat(_colors.N500, ")"),
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     fontFamily: 'inherit',
-    fontWeight: 500,
+    fontWeight: "var(--ds-font-weight-medium, 500)",
     '&:hover': {
       backgroundColor: "var(--ds-background-neutral-hovered, ".concat(_colors.N30, ")"),
       color: "var(--ds-text, ".concat(_colors.N500, ")")
@@ -75,28 +64,28 @@ var buttonStyles = (0, _react2.css)({
 var MAX_DISPLAY_COUNT = 99;
 var MoreIndicator = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _ref$appearance = _ref.appearance,
-      appearance = _ref$appearance === void 0 ? 'circle' : _ref$appearance,
-      _ref$borderColor = _ref.borderColor,
-      borderColor = _ref$borderColor === void 0 ? "var(--ds-border-inverse, ".concat(_colors.N0, ")") : _ref$borderColor,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'medium' : _ref$size,
-      _ref$count = _ref.count,
-      count = _ref$count === void 0 ? 0 : _ref$count,
-      testId = _ref.testId,
-      onClick = _ref.onClick,
-      ariaControls = _ref['aria-controls'],
-      ariaExpanded = _ref['aria-expanded'],
-      ariaHaspopup = _ref['aria-haspopup'],
-      _ref$buttonProps = _ref.buttonProps,
-      buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
-      isActive = _ref.isActive;
+    appearance = _ref$appearance === void 0 ? 'circle' : _ref$appearance,
+    _ref$borderColor = _ref.borderColor,
+    borderColor = _ref$borderColor === void 0 ? "var(--ds-border-inverse, ".concat(_colors.N0, ")") : _ref$borderColor,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
+    _ref$count = _ref.count,
+    count = _ref$count === void 0 ? 0 : _ref$count,
+    testId = _ref.testId,
+    onClick = _ref.onClick,
+    ariaControls = _ref['aria-controls'],
+    ariaExpanded = _ref['aria-expanded'],
+    ariaHaspopup = _ref['aria-haspopup'],
+    _ref$buttonProps = _ref.buttonProps,
+    buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
+    isActive = _ref.isActive;
   var onClickHander = (0, _react.useCallback)(function (event, analyticsEvent) {
     if (buttonProps.onClick) {
       buttonProps.onClick(event);
     }
-
     onClick(event, analyticsEvent);
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   [buttonProps.onClick, onClick]);
   return (0, _react2.jsx)(_avatar.default, {
     appearance: appearance,
@@ -106,9 +95,9 @@ var MoreIndicator = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     onClick: onClickHander
   }, function (_ref2) {
     var _ = _ref2.testId,
-        className = _ref2.className,
-        ref = _ref2.ref,
-        props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+      className = _ref2.className,
+      ref = _ref2.ref,
+      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
     return (0, _react2.jsx)("button", (0, _extends2.default)({
       type: "submit"
     }, buttonProps, props, {
@@ -125,7 +114,8 @@ var MoreIndicator = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     }), "+", count > MAX_DISPLAY_COUNT ? MAX_DISPLAY_COUNT : count);
   });
 });
-MoreIndicator.displayName = 'MoreIndicator'; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+MoreIndicator.displayName = 'MoreIndicator';
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 var _default = MoreIndicator;
 exports.default = _default;

package/dist/cjs/components/stack.js

@@ -4,37 +4,29 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _react2 = require("@emotion/react");
-
 var _avatar = require("@atlaskit/avatar");
-
 var _constants = require("@atlaskit/theme/constants");
-
 /** @jsx jsx */
+
 var gutter = _avatar.BORDER_WIDTH * 2 + (0, _constants.gridSize)() / 2;
 var listStyles = (0, _react2.css)({
   display: 'flex',
-  // TODO Delete this comment after verifying spacing token -> previous value `0`
-  margin: "var(--ds-scale-0, 0px)",
+  margin: "var(--ds-space-0, 0px)",
   marginRight: gutter,
-  // TODO Delete this comment after verifying spacing token -> previous value `0`
-  padding: "var(--ds-scale-0, 0px)",
+  padding: "var(--ds-space-0, 0px)",
   lineHeight: 1,
   listStyleType: 'none !important'
 });
 var listItemStyles = (0, _react2.css)({
-  // TODO Delete this comment after verifying spacing token -> previous value `0`
-  margin: "var(--ds-scale-0, 0px)",
+  margin: "var(--ds-space-0, 0px)",
   marginRight: -gutter
 });
-
 var Stack = function Stack(_ref) {
   var children = _ref.children,
-      testId = _ref.testId,
-      label = _ref['aria-label'];
+    testId = _ref.testId,
+    label = _ref['aria-label'];
   return (0, _react2.jsx)("ul", {
     "data-testid": testId,
     "aria-label": label,
@@ -44,8 +36,8 @@ var Stack = function Stack(_ref) {
       css: listItemStyles
     }, child);
   }));
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 var _default = Stack;
 exports.default = _default;

package/dist/cjs/components/utils.js

@@ -4,13 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.composeUniqueKey = void 0;
-
 var composeUniqueKey = function composeUniqueKey(props, index) {
   if (props.key) {
     return props.key;
   }
-
   return index;
 };
-
 exports.composeUniqueKey = composeUniqueKey;

package/dist/cjs/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _avatarGroup.default;
   }
 });
-
 var _avatarGroup = _interopRequireDefault(require("./components/avatar-group"));

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/avatar-group",
-	"version": "9.2.0",
+	"version": "9.2.2",
 	"sideEffects": false
 }

package/dist/es2019/components/avatar-group-item.js

@@ -2,7 +2,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import Avatar from '@atlaskit/avatar';
 import { ButtonItem, CustomItem, LinkItem } from '@atlaskit/menu';
-
 const AvatarGroupItem = ({
   avatar,
   onAvatarClick,
@@ -14,7 +13,6 @@ const AvatarGroupItem = ({
     onClick,
     ...rest
   } = avatar;
-
   const CustomComponent = ({
     children,
     ...props
@@ -22,16 +20,15 @@ const AvatarGroupItem = ({
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
     return /*#__PURE__*/React.createElement("span", props, children);
   };
-
   const AvatarIcon = /*#__PURE__*/React.createElement(Avatar, _extends({}, rest, {
     testId: testId && `${testId}--avatar`,
     borderColor: "transparent",
     size: "small",
     name: ""
-  })); // onClick handler provided with avatar data takes precedence, same as with the normal avatar item
+  }));
 
+  // onClick handler provided with avatar data takes precedence, same as with the normal avatar item
   const callback = onClick || onAvatarClick;
-
   if (href) {
     return /*#__PURE__*/React.createElement(LinkItem, {
       href: href,
@@ -42,7 +39,6 @@ const AvatarGroupItem = ({
       onClick: event => callback && callback(event, undefined, index)
     }, avatar.name);
   }
-
   if (typeof callback === 'function') {
     return /*#__PURE__*/React.createElement(ButtonItem, {
       onClick: event => callback && callback(event, undefined, index),
@@ -50,13 +46,12 @@ const AvatarGroupItem = ({
       testId: testId
     }, avatar.name);
   }
-
   return /*#__PURE__*/React.createElement(CustomItem, {
     iconBefore: AvatarIcon,
     component: CustomComponent,
     testId: testId
   }, avatar.name);
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export default AvatarGroupItem;