@atlaskit/avatar 21.17.0 → 21.17.2

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/avatar
 
+## 21.17.2
+
+### Patch Changes
+
+- [#159704](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/159704)
+  [`b3a2ceaf98b77`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b3a2ceaf98b77) -
+  Internal refactoring of file names and resolving of ESLint disables.
+
+## 21.17.1
+
+### Patch Changes
+
+- [#157335](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/157335)
+  [`51a41686c7949`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/51a41686c7949) -
+  Fixes lineheight issue for xxxsmall avatars which was throwing off the positioning of the fallback
+  icon
+
 ## 21.17.0
 
 ### Minor Changes

package/__perf__/default.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
 
-import Avatar from '../src';
+import Avatar from '@atlaskit/avatar';
 
 export default () => <Avatar />;

package/dist/cjs/{AvatarImage.js → avatar-image.js}

@@ -20,8 +20,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; } /**
  * @jsxRuntime classic
  * @jsx jsx
- */ // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+ */
 var avatarDefaultIconStyles = (0, _react2.css)({
   display: 'block',
   width: '100%',
@@ -39,6 +38,7 @@ var nestedAvatarStyles = Object.entries(_constants.AVATAR_SIZES).reduce(function
     key = _ref2[0],
     size = _ref2[1];
   return _objectSpread(_objectSpread({}, styles), {}, (0, _defineProperty2.default)({}, key, (0, _react2.css)({
+    lineHeight: 0,
     // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '& svg': {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

package/dist/cjs/{AvatarItem.js → avatar-item.js}

@@ -20,7 +20,6 @@ var _templateObject;
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 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; }
 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; }
@@ -33,6 +32,7 @@ var avatarItemStyles = (0, _react2.css)({
 });
 var secondaryTextOldStyles = (0, _react2.css)({
   color: "var(--ds-text-subtlest, #626F86)",
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   fontSize: '0.85em'
 });
 var baseTextStyles = (0, _react2.css)({
@@ -108,7 +108,7 @@ var AvatarItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     }), {}, {
       children: (0, _react2.jsx)(_react.Fragment, null, avatar, (0, _react2.jsx)("div", {
         css: avatarItemStyles
-      }, (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.avatar-item-font-size_830x6') ? (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_primitives.Text, {
+      }, (0, _platformFeatureFlags.fg)('platform.design-system-team.avatar-item-font-size_830x6') ? (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_primitives.Text, {
         maxLines: isTruncationDisabled ? undefined : 1
       }, primaryText), (0, _react2.jsx)(_primitives.Text, {
         color: "color.text.subtlest",

package/dist/cjs/{Avatar.js → avatar.js}

@@ -14,23 +14,21 @@ var _useId = require("@atlaskit/ds-lib/use-id");
 var _focusRing = _interopRequireDefault(require("@atlaskit/focus-ring"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
-var _AvatarImage = _interopRequireDefault(require("./AvatarImage"));
+var _avatarImage = _interopRequireDefault(require("./avatar-image"));
 var _constants = require("./constants");
 var _context = require("./context");
-var _Presence = require("./Presence");
-var _Status = require("./Status");
+var _presence = require("./presence");
+var _status = require("./status");
 var _utilities = require("./utilities");
 var _templateObject;
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 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; }
 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; }
 var packageName = "@atlaskit/avatar";
-var packageVersion = "21.17.0";
+var packageVersion = "21.17.2";
 var getTestId = function getTestId(testId, children) {
   return !children ? {
     'data-testid': "".concat(testId, "--inner")
@@ -179,7 +177,7 @@ var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     }, componentProps()), testId && getTestId(testId, children)), (isInteractive || children) && {
       'aria-label': label || defaultLabel
     }), {}, {
-      children: (0, _react2.jsx)(_AvatarImage.default
+      children: (0, _react2.jsx)(_avatarImage.default
       // Only pass in the name if an image is provided and the
       // container is not being used as an `img` role
       , {
@@ -196,12 +194,12 @@ var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     }
     var element = (0, _utilities.getCustomElement)(isDisabled, href, onClick);
     return element === 'a' || element === 'button' ? (0, _react2.jsx)(_focusRing.default, null, /*#__PURE__*/(0, _react.createElement)(element, props)) : ( /*#__PURE__*/(0, _react.createElement)(element, props));
-  }), isPresence && (0, _react2.jsx)(_Presence.PresenceWrapper, {
+  }), isPresence && (0, _react2.jsx)(_presence.PresenceWrapper, {
     appearance: appearance,
     size: size,
     presence: typeof presence === 'string' ? presence : undefined,
     testId: testId
-  }, customPresenceNode), isStatus && (0, _react2.jsx)(_Status.StatusWrapper, {
+  }, customPresenceNode), isStatus && (0, _react2.jsx)(_status.StatusWrapper, {
     appearance: appearance,
     size: size,
     borderColor: borderColor,

package/dist/cjs/constants.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ICON_SIZES = exports.ICON_OFFSET = exports.CSS_VAR_AVATAR_BGCOLOR = exports.BORDER_WIDTH = exports.AVATAR_SIZES = exports.AVATAR_RADIUS = exports.ACTIVE_SCALE_FACTOR = void 0;
 var _constants = require("@atlaskit/theme/constants");
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match, @atlaskit/design-system/no-deprecated-imports
+// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 
 var AVATAR_SIZES = exports.AVATAR_SIZES = {
   xsmall: (0, _constants.gridSize)() * 2,

package/dist/cjs/entry-points/avatar-item.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _AvatarItem.default;
+    return _avatarItem.default;
   }
 });
-var _AvatarItem = _interopRequireDefault(require("../AvatarItem"));
+var _avatarItem = _interopRequireDefault(require("../avatar-item"));

package/dist/cjs/entry-points/avatar.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _Avatar.default;
+    return _avatar.default;
   }
 });
-var _Avatar = _interopRequireDefault(require("../Avatar"));
+var _avatar = _interopRequireDefault(require("../avatar"));

package/dist/cjs/entry-points/presence.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _Presence.default;
+    return _presence.default;
   }
 });
-var _Presence = _interopRequireDefault(require("../Presence"));
+var _presence = _interopRequireDefault(require("../presence"));

package/dist/cjs/entry-points/skeleton.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _Skeleton.default;
+    return _skeleton.default;
   }
 });
-var _Skeleton = _interopRequireDefault(require("../Skeleton"));
+var _skeleton = _interopRequireDefault(require("../skeleton"));

package/dist/cjs/entry-points/status.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _Status.default;
+    return _status.default;
   }
 });
-var _Status = _interopRequireDefault(require("../Status"));
+var _status = _interopRequireDefault(require("../status"));

package/dist/cjs/{IconWrapper.js → icon-wrapper.js}

@@ -11,9 +11,6 @@ var _constants = require("./constants");
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 var iconWrapperStyles = (0, _react.css)({
   display: 'flex',

package/dist/cjs/index.js

@@ -31,7 +31,7 @@ Object.defineProperty(exports, "AvatarContext", {
 Object.defineProperty(exports, "AvatarItem", {
   enumerable: true,
   get: function get() {
-    return _AvatarItem.default;
+    return _avatarItem.default;
   }
 });
 Object.defineProperty(exports, "BORDER_WIDTH", {
@@ -43,25 +43,25 @@ Object.defineProperty(exports, "BORDER_WIDTH", {
 Object.defineProperty(exports, "Presence", {
   enumerable: true,
   get: function get() {
-    return _Presence.default;
+    return _presence.default;
   }
 });
 Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
   get: function get() {
-    return _Skeleton.default;
+    return _skeleton.default;
   }
 });
 Object.defineProperty(exports, "Status", {
   enumerable: true,
   get: function get() {
-    return _Status.default;
+    return _status.default;
   }
 });
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _Avatar.default;
+    return _avatar.default;
   }
 });
 Object.defineProperty(exports, "useAvatarContext", {
@@ -70,10 +70,10 @@ Object.defineProperty(exports, "useAvatarContext", {
     return _context.useAvatarContext;
   }
 });
-var _Avatar = _interopRequireDefault(require("./Avatar"));
-var _AvatarItem = _interopRequireDefault(require("./AvatarItem"));
-var _Presence = _interopRequireDefault(require("./Presence"));
-var _Status = _interopRequireDefault(require("./Status"));
-var _Skeleton = _interopRequireDefault(require("./Skeleton"));
+var _avatar = _interopRequireDefault(require("./avatar"));
+var _avatarItem = _interopRequireDefault(require("./avatar-item"));
+var _presence = _interopRequireDefault(require("./presence"));
+var _status = _interopRequireDefault(require("./status"));
+var _skeleton = _interopRequireDefault(require("./skeleton"));
 var _context = require("./context");
 var _constants = require("./constants");

package/dist/cjs/{Presence.js → presence.js}

@@ -9,11 +9,9 @@ exports.default = exports.PresenceWrapper = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("./constants");
-var _IconWrapper = _interopRequireDefault(require("./IconWrapper"));
+var _iconWrapper = _interopRequireDefault(require("./icon-wrapper"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-
 var BusyIndicator = /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("circle", {
   fill: "var(--ds-icon-danger, ".concat(_colors.R300, ")"),
   cx: "4",
@@ -66,7 +64,7 @@ var AvatarPresence = function AvatarPresence(_ref) {
   var borderColor = _ref.borderColor,
     children = _ref.children,
     presence = _ref.presence;
-  return /*#__PURE__*/_react.default.createElement(_IconWrapper.default, {
+  return /*#__PURE__*/_react.default.createElement(_iconWrapper.default, {
     bgColor: borderColor
   }, presence ? /*#__PURE__*/_react.default.createElement("svg", {
     height: "100%",

package/dist/cjs/{Skeleton.js → skeleton.js}

@@ -13,8 +13,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; } /**
  * @jsxRuntime classic
  * @jsx jsx
- */ // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+ */
 var skeletonStyles = (0, _react.css)({
   display: 'inline-block',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -33,8 +32,6 @@ var sizeStyles = Object.entries(_constants.AVATAR_SIZES).reduce(function (styles
     height: "".concat(size, "px")
   })));
 }, {});
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
 var radiusStyles = Object.entries(_constants.AVATAR_RADIUS).reduce(function (styles, _ref3) {
   var _ref4 = (0, _slicedToArray2.default)(_ref3, 2),
     key = _ref4[0],

package/dist/cjs/{Status.js → status.js}

@@ -9,11 +9,9 @@ exports.default = exports.StatusWrapper = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("./constants");
-var _IconWrapper = _interopRequireDefault(require("./IconWrapper"));
+var _iconWrapper = _interopRequireDefault(require("./icon-wrapper"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-
 var ApprovedIndicator = /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("circle", {
   fill: "var(--ds-icon-success, ".concat(_colors.G400, ")"),
   cx: "4",
@@ -64,7 +62,7 @@ var AvatarStatus = function AvatarStatus(_ref) {
   var borderColor = _ref.borderColor,
     children = _ref.children,
     status = _ref.status;
-  return /*#__PURE__*/_react.default.createElement(_IconWrapper.default, {
+  return /*#__PURE__*/_react.default.createElement(_iconWrapper.default, {
     bgColor: borderColor
   }, status ? /*#__PURE__*/_react.default.createElement("svg", {
     height: "100%",

package/dist/cjs/utilities.js

@@ -4,8 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getLinkProps = exports.getCustomElement = exports.getButtonProps = void 0;
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-
 var getLinkProps = exports.getLinkProps = function getLinkProps(href, target) {
   return {
     href: href,

package/dist/es2019/{AvatarImage.js → avatar-image.js}

@@ -2,10 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { useEffect, useState } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import PersonIconLegacy from '@atlaskit/icon/core/migration/person';
 import ReleaseIconMigration from '@atlaskit/icon/core/migration/release--ship';
@@ -30,6 +27,7 @@ const nestedAvatarStyles = Object.entries(AVATAR_SIZES).reduce((styles, [key, si
   return {
     ...styles,
     [key]: css({
+      lineHeight: 0,
       // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       '& svg': {
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

package/dist/es2019/{AvatarItem.js → avatar-item.js}

@@ -2,12 +2,11 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { createElement, forwardRef, Fragment } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { ClassNames, css, jsx } from '@emotion/react';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives';
 import { B200, B50, N30 } from '@atlaskit/theme/colors';
 import { borderRadius } from '@atlaskit/theme/constants';
@@ -22,6 +21,7 @@ const avatarItemStyles = css({
 });
 const secondaryTextOldStyles = css({
   color: "var(--ds-text-subtlest, #626F86)",
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   fontSize: '0.85em'
 });
 const baseTextStyles = css({
@@ -141,7 +141,7 @@ const AvatarItem = /*#__PURE__*/forwardRef(({
       }),
       children: jsx(Fragment, null, avatar, jsx("div", {
         css: avatarItemStyles
-      }, getBooleanFF('platform.design-system-team.avatar-item-font-size_830x6') ? jsx(Fragment, null, jsx(Text, {
+      }, fg('platform.design-system-team.avatar-item-font-size_830x6') ? jsx(Fragment, null, jsx(Text, {
         maxLines: isTruncationDisabled ? undefined : 1
       }, primaryText), jsx(Text, {
         color: "color.text.subtlest",

package/dist/es2019/{Avatar.js → avatar.js}

@@ -2,24 +2,21 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { createElement, forwardRef, isValidElement, useCallback, useEffect, useRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { ClassNames, jsx } from '@emotion/react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { useId } from '@atlaskit/ds-lib/use-id';
 import FocusRing from '@atlaskit/focus-ring';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { N0, N70A } from '@atlaskit/theme/colors';
-import AvatarImage from './AvatarImage';
+import AvatarImage from './avatar-image';
 import { ACTIVE_SCALE_FACTOR, AVATAR_RADIUS, AVATAR_SIZES, BORDER_WIDTH } from './constants';
 import { useAvatarContext } from './context';
-import { PresenceWrapper } from './Presence';
-import { StatusWrapper } from './Status';
+import { PresenceWrapper } from './presence';
+import { StatusWrapper } from './status';
 import { getButtonProps, getCustomElement, getLinkProps } from './utilities';
 const packageName = "@atlaskit/avatar";
-const packageVersion = "21.17.0";
+const packageVersion = "21.17.2";
 const getTestId = (testId, children) => !children ? {
   'data-testid': `${testId}--inner`
 } : {

package/dist/es2019/constants.js

@@ -1,4 +1,4 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match, @atlaskit/design-system/no-deprecated-imports
+// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 import { gridSize } from '@atlaskit/theme/constants';
 export const AVATAR_SIZES = {
   xsmall: gridSize() * 2,

package/dist/es2019/entry-points/avatar-item.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../AvatarItem';
+export { default } from '../avatar-item';

package/dist/es2019/entry-points/avatar.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Avatar';
+export { default } from '../avatar';

package/dist/es2019/entry-points/presence.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Presence';
+export { default } from '../presence';

package/dist/es2019/entry-points/skeleton.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Skeleton';
+export { default } from '../skeleton';

package/dist/es2019/entry-points/status.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Status';
+export { default } from '../status';

package/dist/es2019/{IconWrapper.js → icon-wrapper.js}

@@ -2,9 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N0 } from '@atlaskit/theme/colors';
 import { BORDER_WIDTH } from './constants';

package/dist/es2019/index.js

@@ -1,8 +1,7 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from './Avatar';
-export { default as AvatarItem } from './AvatarItem';
-export { default as Presence } from './Presence';
-export { default as Status } from './Status';
-export { default as Skeleton } from './Skeleton';
+export { default } from './avatar';
+export { default as AvatarItem } from './avatar-item';
+export { default as Presence } from './presence';
+export { default as Status } from './status';
+export { default as Skeleton } from './skeleton';
 export { AvatarContext, useAvatarContext } from './context';
 export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';

package/dist/es2019/{Presence.js → presence.js}

@@ -1,8 +1,7 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import React, { Fragment } from 'react';
 import { G300, N0, N200, N40, P300, R300 } from '@atlaskit/theme/colors';
 import { ICON_OFFSET, ICON_SIZES } from './constants';
-import IconWrapper from './IconWrapper';
+import IconWrapper from './icon-wrapper';
 const BusyIndicator = /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("circle", {
   fill: `var(--ds-icon-danger, ${R300})`,
   cx: "4",

package/dist/es2019/{Skeleton.js → skeleton.js}

@@ -2,9 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { AVATAR_RADIUS, AVATAR_SIZES, BORDER_WIDTH, CSS_VAR_AVATAR_BGCOLOR } from './constants';
 const skeletonStyles = css({
@@ -25,8 +23,6 @@ const sizeStyles = Object.entries(AVATAR_SIZES).reduce((styles, [key, size]) =>
     })
   };
 }, {});
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
 const radiusStyles = Object.entries(AVATAR_RADIUS).reduce((styles, [key, size]) => {
   return {
     ...styles,

package/dist/es2019/{Status.js → status.js}

@@ -1,8 +1,7 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import React, { Fragment } from 'react';
 import { G400, N0, N40, N500, R400 } from '@atlaskit/theme/colors';
 import { ICON_OFFSET, ICON_SIZES } from './constants';
-import IconWrapper from './IconWrapper';
+import IconWrapper from './icon-wrapper';
 const ApprovedIndicator = /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("circle", {
   fill: `var(--ds-icon-success, ${G400})`,
   cx: "4",

package/dist/es2019/utilities.js

@@ -1,5 +1,3 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-
 export const getLinkProps = (href, target) => ({
   href,
   rel: target === '_blank' ? 'noopener noreferrer' : null,

package/dist/esm/{AvatarImage.js → avatar-image.js}

@@ -6,10 +6,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { useEffect, useState } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import PersonIconLegacy from '@atlaskit/icon/core/migration/person';
 import ReleaseIconMigration from '@atlaskit/icon/core/migration/release--ship';
@@ -35,6 +32,7 @@ var nestedAvatarStyles = Object.entries(AVATAR_SIZES).reduce(function (styles, _
     key = _ref2[0],
     size = _ref2[1];
   return _objectSpread(_objectSpread({}, styles), {}, _defineProperty({}, key, css({
+    lineHeight: 0,
     // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '& svg': {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

package/dist/esm/{AvatarItem.js → avatar-item.js}

@@ -7,12 +7,11 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { createElement, forwardRef, Fragment } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { ClassNames, css, jsx } from '@emotion/react';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives';
 import { B200, B50, N30 } from '@atlaskit/theme/colors';
 import { borderRadius } from '@atlaskit/theme/constants';
@@ -27,6 +26,7 @@ var avatarItemStyles = css({
 });
 var secondaryTextOldStyles = css({
   color: "var(--ds-text-subtlest, #626F86)",
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   fontSize: '0.85em'
 });
 var baseTextStyles = css({
@@ -102,7 +102,7 @@ var AvatarItem = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     }), {}, {
       children: jsx(Fragment, null, avatar, jsx("div", {
         css: avatarItemStyles
-      }, getBooleanFF('platform.design-system-team.avatar-item-font-size_830x6') ? jsx(Fragment, null, jsx(Text, {
+      }, fg('platform.design-system-team.avatar-item-font-size_830x6') ? jsx(Fragment, null, jsx(Text, {
         maxLines: isTruncationDisabled ? undefined : 1
       }, primaryText), jsx(Text, {
         color: "color.text.subtlest",

package/dist/esm/{Avatar.js → avatar.js}

@@ -7,24 +7,21 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { createElement, forwardRef, isValidElement, useCallback, useEffect, useRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { ClassNames, jsx } from '@emotion/react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { useId } from '@atlaskit/ds-lib/use-id';
 import FocusRing from '@atlaskit/focus-ring';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { N0, N70A } from '@atlaskit/theme/colors';
-import AvatarImage from './AvatarImage';
+import AvatarImage from './avatar-image';
 import { ACTIVE_SCALE_FACTOR, AVATAR_RADIUS, AVATAR_SIZES, BORDER_WIDTH } from './constants';
 import { useAvatarContext } from './context';
-import { PresenceWrapper } from './Presence';
-import { StatusWrapper } from './Status';
+import { PresenceWrapper } from './presence';
+import { StatusWrapper } from './status';
 import { getButtonProps, getCustomElement, getLinkProps } from './utilities';
 var packageName = "@atlaskit/avatar";
-var packageVersion = "21.17.0";
+var packageVersion = "21.17.2";
 var getTestId = function getTestId(testId, children) {
   return !children ? {
     'data-testid': "".concat(testId, "--inner")

package/dist/esm/constants.js

@@ -1,4 +1,4 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match, @atlaskit/design-system/no-deprecated-imports
+// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 import { gridSize } from '@atlaskit/theme/constants';
 export var AVATAR_SIZES = {
   xsmall: gridSize() * 2,

package/dist/esm/entry-points/avatar-item.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../AvatarItem';
+export { default } from '../avatar-item';

package/dist/esm/entry-points/avatar.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Avatar';
+export { default } from '../avatar';

package/dist/esm/entry-points/presence.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Presence';
+export { default } from '../presence';

package/dist/esm/entry-points/skeleton.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Skeleton';
+export { default } from '../skeleton';

package/dist/esm/entry-points/status.js

@@ -1,2 +1 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from '../Status';
+export { default } from '../status';

package/dist/esm/{IconWrapper.js → icon-wrapper.js}

@@ -2,9 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N0 } from '@atlaskit/theme/colors';
 import { BORDER_WIDTH } from './constants';

package/dist/esm/index.js

@@ -1,8 +1,7 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-export { default } from './Avatar';
-export { default as AvatarItem } from './AvatarItem';
-export { default as Presence } from './Presence';
-export { default as Status } from './Status';
-export { default as Skeleton } from './Skeleton';
+export { default } from './avatar';
+export { default as AvatarItem } from './avatar-item';
+export { default as Presence } from './presence';
+export { default as Status } from './status';
+export { default as Skeleton } from './skeleton';
 export { AvatarContext, useAvatarContext } from './context';
 export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';

package/dist/esm/{Presence.js → presence.js}

@@ -1,8 +1,7 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import React, { Fragment } from 'react';
 import { G300, N0, N200, N40, P300, R300 } from '@atlaskit/theme/colors';
 import { ICON_OFFSET, ICON_SIZES } from './constants';
-import IconWrapper from './IconWrapper';
+import IconWrapper from './icon-wrapper';
 var BusyIndicator = /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("circle", {
   fill: "var(--ds-icon-danger, ".concat(R300, ")"),
   cx: "4",

package/dist/esm/{Skeleton.js → skeleton.js}

@@ -6,9 +6,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { AVATAR_RADIUS, AVATAR_SIZES, BORDER_WIDTH, CSS_VAR_AVATAR_BGCOLOR } from './constants';
 var skeletonStyles = css({
@@ -29,8 +27,6 @@ var sizeStyles = Object.entries(AVATAR_SIZES).reduce(function (styles, _ref) {
     height: "".concat(size, "px")
   })));
 }, {});
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
 var radiusStyles = Object.entries(AVATAR_RADIUS).reduce(function (styles, _ref3) {
   var _ref4 = _slicedToArray(_ref3, 2),
     key = _ref4[0],

package/dist/esm/{Status.js → status.js}

@@ -1,8 +1,7 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import React, { Fragment } from 'react';
 import { G400, N0, N40, N500, R400 } from '@atlaskit/theme/colors';
 import { ICON_OFFSET, ICON_SIZES } from './constants';
-import IconWrapper from './IconWrapper';
+import IconWrapper from './icon-wrapper';
 var ApprovedIndicator = /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("circle", {
   fill: "var(--ds-icon-success, ".concat(G400, ")"),
   cx: "4",

package/dist/esm/utilities.js

@@ -1,5 +1,3 @@
-// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-
 export var getLinkProps = function getLinkProps(href, target) {
   return {
     href: href,

package/dist/types/entry-points/avatar-item.d.ts

@@ -1,2 +1,2 @@
-export { default } from '../AvatarItem';
-export type { AvatarItemProps, CustomAvatarItemProps } from '../AvatarItem';
+export { default } from '../avatar-item';
+export type { AvatarItemProps, CustomAvatarItemProps } from '../avatar-item';

package/dist/types/entry-points/avatar.d.ts

@@ -1 +1 @@
-export { default } from '../Avatar';
+export { default } from '../avatar';

package/dist/types/entry-points/presence.d.ts

@@ -1,3 +1,3 @@
-export { default } from '../Presence';
-export type { PresenceProps } from '../Presence';
+export { default } from '../presence';
+export type { PresenceProps } from '../presence';
 export type { Presence as PresenceType } from '../types';

package/dist/types/entry-points/skeleton.d.ts

@@ -1,2 +1,2 @@
-export { default } from '../Skeleton';
-export type { SkeletonProps } from '../Skeleton';
+export { default } from '../skeleton';
+export type { SkeletonProps } from '../skeleton';

package/dist/types/entry-points/status.d.ts

@@ -1,3 +1,3 @@
-export { default } from '../Status';
-export type { StatusProps } from '../Status';
+export { default } from '../status';
+export type { StatusProps } from '../status';
 export type { Status as StatusType } from '../types';

package/dist/types/index.d.ts

@@ -1,13 +1,13 @@
-export { default } from './Avatar';
-export type { AvatarPropTypes, CustomAvatarProps } from './Avatar';
-export { default as AvatarItem } from './AvatarItem';
-export type { AvatarItemProps, CustomAvatarItemProps } from './AvatarItem';
-export { default as Presence } from './Presence';
-export type { PresenceProps } from './Presence';
-export { default as Status } from './Status';
-export type { StatusProps } from './Status';
-export { default as Skeleton } from './Skeleton';
-export type { SkeletonProps } from './Skeleton';
+export { default } from './avatar';
+export type { AvatarPropTypes, CustomAvatarProps } from './avatar';
+export { default as AvatarItem } from './avatar-item';
+export type { AvatarItemProps, CustomAvatarItemProps } from './avatar-item';
+export { default as Presence } from './presence';
+export type { PresenceProps } from './presence';
+export { default as Status } from './status';
+export type { StatusProps } from './status';
+export { default as Skeleton } from './skeleton';
+export type { SkeletonProps } from './skeleton';
 export { AvatarContext, type AvatarContextProps, useAvatarContext } from './context';
 export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';
 export type { AvatarClickEventHandler, AppearanceType, SizeType, Presence as PresenceType, Status as StatusType, IndicatorSizeType, } from './types';

package/dist/types-ts4.5/entry-points/avatar-item.d.ts

@@ -1,2 +1,2 @@
-export { default } from '../AvatarItem';
-export type { AvatarItemProps, CustomAvatarItemProps } from '../AvatarItem';
+export { default } from '../avatar-item';
+export type { AvatarItemProps, CustomAvatarItemProps } from '../avatar-item';

package/dist/types-ts4.5/entry-points/avatar.d.ts

@@ -1 +1 @@
-export { default } from '../Avatar';
+export { default } from '../avatar';

package/dist/types-ts4.5/entry-points/presence.d.ts

@@ -1,3 +1,3 @@
-export { default } from '../Presence';
-export type { PresenceProps } from '../Presence';
+export { default } from '../presence';
+export type { PresenceProps } from '../presence';
 export type { Presence as PresenceType } from '../types';

package/dist/types-ts4.5/entry-points/skeleton.d.ts

@@ -1,2 +1,2 @@
-export { default } from '../Skeleton';
-export type { SkeletonProps } from '../Skeleton';
+export { default } from '../skeleton';
+export type { SkeletonProps } from '../skeleton';

package/dist/types-ts4.5/entry-points/status.d.ts

@@ -1,3 +1,3 @@
-export { default } from '../Status';
-export type { StatusProps } from '../Status';
+export { default } from '../status';
+export type { StatusProps } from '../status';
 export type { Status as StatusType } from '../types';

package/dist/types-ts4.5/index.d.ts

@@ -1,13 +1,13 @@
-export { default } from './Avatar';
-export type { AvatarPropTypes, CustomAvatarProps } from './Avatar';
-export { default as AvatarItem } from './AvatarItem';
-export type { AvatarItemProps, CustomAvatarItemProps } from './AvatarItem';
-export { default as Presence } from './Presence';
-export type { PresenceProps } from './Presence';
-export { default as Status } from './Status';
-export type { StatusProps } from './Status';
-export { default as Skeleton } from './Skeleton';
-export type { SkeletonProps } from './Skeleton';
+export { default } from './avatar';
+export type { AvatarPropTypes, CustomAvatarProps } from './avatar';
+export { default as AvatarItem } from './avatar-item';
+export type { AvatarItemProps, CustomAvatarItemProps } from './avatar-item';
+export { default as Presence } from './presence';
+export type { PresenceProps } from './presence';
+export { default as Status } from './status';
+export type { StatusProps } from './status';
+export { default as Skeleton } from './skeleton';
+export type { SkeletonProps } from './skeleton';
 export { AvatarContext, type AvatarContextProps, useAvatarContext } from './context';
 export { AVATAR_SIZES, BORDER_WIDTH, AVATAR_RADIUS, ACTIVE_SCALE_FACTOR } from './constants';
 export type { AvatarClickEventHandler, AppearanceType, SizeType, Presence as PresenceType, Status as StatusType, IndicatorSizeType, } from './types';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/avatar",
-	"version": "21.17.0",
+	"version": "21.17.2",
 	"description": "An avatar is a visual representation of a user or entity.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -21,7 +21,7 @@
 		}
 	},
 	"sideEffects": false,
-	"atlaskit:src": "src/index.ts",
+	"atlaskit:src": "src/index.tsx",
 	"atlassian": {
 		"team": "Design System Team",
 		"website": {
@@ -31,23 +31,23 @@
 		"runReact18": true
 	},
 	"af:exports": {
-		"./AvatarItem": "./src/entry-points/avatar-item.ts",
-		"./Avatar": "./src/entry-points/avatar.ts",
-		"./Presence": "./src/entry-points/presence.ts",
-		"./Skeleton": "./src/entry-points/skeleton.ts",
-		"./Status": "./src/entry-points/status.ts",
-		"./types": "./src/entry-points/types.ts",
-		".": "./src/index.ts"
+		"./AvatarItem": "./src/entry-points/avatar-item.tsx",
+		"./Avatar": "./src/entry-points/avatar.tsx",
+		"./Presence": "./src/entry-points/presence.tsx",
+		"./Skeleton": "./src/entry-points/skeleton.tsx",
+		"./Status": "./src/entry-points/status.tsx",
+		"./types": "./src/entry-points/types.tsx",
+		".": "./src/index.tsx"
 	},
 	"dependencies": {
 		"@atlaskit/analytics-next": "^10.1.0",
 		"@atlaskit/ds-lib": "^3.1.0",
-		"@atlaskit/focus-ring": "^1.6.0",
+		"@atlaskit/focus-ring": "^1.7.0",
 		"@atlaskit/icon": "^22.24.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/primitives": "^13.0.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tokens": "^2.0.0",
+		"@atlaskit/tokens": "^2.1.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"@emotion/serialize": "^1.1.0"
@@ -66,6 +66,7 @@
 		"@atlassian/feature-flags-test-utils": "*",
 		"@emotion/styled": "^11.0.0",
 		"@testing-library/react": "^12.1.5",
+		"@testing-library/user-event": "^14.4.3",
 		"@types/jscodeshift": "^0.11.0",
 		"jest-in-case": "^1.0.2",
 		"jscodeshift": "^0.13.0",