@atlaskit/avatar 21.15.0 → 21.15.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/avatar
 
+## 21.15.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 21.15.1
+
+### Patch Changes
+
+- [#135555](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/135555)
+  [`6325e9c5617d5`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6325e9c5617d5) -
+  Use a ID generator that is compatible with React16 and React 18
+
 ## 21.15.0
 
 ### Minor Changes

package/dist/cjs/Avatar.js

@@ -9,8 +9,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("react");
 var _react2 = require("@emotion/react");
-var _reactUid = require("react-uid");
 var _analyticsNext = require("@atlaskit/analytics-next");
+var _reactUid = require("@atlaskit/ds-lib/react-uid");
 var _focusRing = _interopRequireDefault(require("@atlaskit/focus-ring"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
@@ -30,7 +30,7 @@ var _templateObject;
 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.15.0";
+var packageVersion = "21.15.2";
 var getTestId = function getTestId(testId, children) {
   return !children ? {
     'data-testid': "".concat(testId, "--inner")
@@ -93,7 +93,7 @@ var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
   var customStatusNode = /*#__PURE__*/(0, _react.isValidElement)(status) ? status : null;
   var isValidIconSize = size !== 'xxlarge' && size !== 'xsmall';
   var lastAnalytics = (0, _react.useRef)(analyticsContext);
-  var uuid = (0, _reactUid.useUIDSeed)()('avatar');
+  var labelId = (0, _reactUid.useId)();
   (0, _react.useEffect)(function () {
     lastAnalytics.current = analyticsContext;
   }, [analyticsContext]);
@@ -154,7 +154,7 @@ var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
   return (0, _react2.jsx)(AvatarContainer, {
     "data-testid": testId,
     role: containerShouldBeImage ? 'img' : undefined,
-    "aria-labelledby": containerShouldBeImage ? "".concat(uuid, "-label") : undefined,
+    "aria-labelledby": containerShouldBeImage ? labelId : undefined,
     style: {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       display: 'inline-block',
@@ -180,7 +180,7 @@ var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
       'aria-label': label || defaultLabel
     }), {}, {
       children: (0, _react2.jsx)(_AvatarImage.default
-      // Only pass in the name if an image is provded and the
+      // Only pass in the name if an image is provided and the
       // container is not being used as an `img` role
       , {
         alt: !containerShouldBeImage && src ? name : undefined,
@@ -209,7 +209,7 @@ var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     testId: testId
   }, customStatusNode), containerShouldBeImage ? (0, _react2.jsx)("span", {
     "data-testid": testId && "".concat(testId, "--label"),
-    id: "".concat(uuid, "-label"),
+    id: labelId,
     hidden: true
   }, defaultLabel) : undefined);
 });

package/dist/cjs/Presence.js

@@ -11,7 +11,7 @@ var _colors = require("@atlaskit/theme/colors");
 var _constants = require("./constants");
 var _IconWrapper = _interopRequireDefault(require("./IconWrapper"));
 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 && Object.prototype.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; }
+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", {

package/dist/cjs/Status.js

@@ -11,7 +11,7 @@ var _colors = require("@atlaskit/theme/colors");
 var _constants = require("./constants");
 var _IconWrapper = _interopRequireDefault(require("./IconWrapper"));
 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 && Object.prototype.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; }
+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", {

package/dist/es2019/Avatar.js

@@ -7,8 +7,8 @@ import { createElement, forwardRef, isValidElement, useCallback, useEffect, useR
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { ClassNames, jsx } from '@emotion/react';
-import { useUIDSeed } from 'react-uid';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { useId } from '@atlaskit/ds-lib/react-uid';
 import FocusRing from '@atlaskit/focus-ring';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { N0, N70A } from '@atlaskit/theme/colors';
@@ -19,7 +19,7 @@ import { PresenceWrapper } from './Presence';
 import { StatusWrapper } from './Status';
 import { getButtonProps, getCustomElement, getLinkProps } from './utilities';
 const packageName = "@atlaskit/avatar";
-const packageVersion = "21.15.0";
+const packageVersion = "21.15.2";
 const getTestId = (testId, children) => !children ? {
   'data-testid': `${testId}--inner`
 } : {
@@ -164,7 +164,7 @@ const Avatar = /*#__PURE__*/forwardRef(({
   const customStatusNode = /*#__PURE__*/isValidElement(status) ? status : null;
   const isValidIconSize = size !== 'xxlarge' && size !== 'xsmall';
   const lastAnalytics = useRef(analyticsContext);
-  const uuid = useUIDSeed()('avatar');
+  const labelId = useId();
   useEffect(() => {
     lastAnalytics.current = analyticsContext;
   }, [analyticsContext]);
@@ -229,7 +229,7 @@ const Avatar = /*#__PURE__*/forwardRef(({
   return jsx(AvatarContainer, {
     "data-testid": testId,
     role: containerShouldBeImage ? 'img' : undefined,
-    "aria-labelledby": containerShouldBeImage ? `${uuid}-label` : undefined,
+    "aria-labelledby": containerShouldBeImage ? labelId : undefined,
     style: {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       display: 'inline-block',
@@ -258,7 +258,7 @@ const Avatar = /*#__PURE__*/forwardRef(({
         'aria-label': label || defaultLabel
       }),
       children: jsx(AvatarImage
-      // Only pass in the name if an image is provded and the
+      // Only pass in the name if an image is provided and the
       // container is not being used as an `img` role
       , {
         alt: !containerShouldBeImage && src ? name : undefined,
@@ -287,7 +287,7 @@ const Avatar = /*#__PURE__*/forwardRef(({
     testId: testId
   }, customStatusNode), containerShouldBeImage ? jsx("span", {
     "data-testid": testId && `${testId}--label`,
-    id: `${uuid}-label`,
+    id: labelId,
     hidden: true
   }, defaultLabel) : undefined);
 });

package/dist/esm/Avatar.js

@@ -12,8 +12,8 @@ import { createElement, forwardRef, isValidElement, useCallback, useEffect, useR
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { ClassNames, jsx } from '@emotion/react';
-import { useUIDSeed } from 'react-uid';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
+import { useId } from '@atlaskit/ds-lib/react-uid';
 import FocusRing from '@atlaskit/focus-ring';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { N0, N70A } from '@atlaskit/theme/colors';
@@ -24,7 +24,7 @@ import { PresenceWrapper } from './Presence';
 import { StatusWrapper } from './Status';
 import { getButtonProps, getCustomElement, getLinkProps } from './utilities';
 var packageName = "@atlaskit/avatar";
-var packageVersion = "21.15.0";
+var packageVersion = "21.15.2";
 var getTestId = function getTestId(testId, children) {
   return !children ? {
     'data-testid': "".concat(testId, "--inner")
@@ -87,7 +87,7 @@ var Avatar = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   var customStatusNode = /*#__PURE__*/isValidElement(status) ? status : null;
   var isValidIconSize = size !== 'xxlarge' && size !== 'xsmall';
   var lastAnalytics = useRef(analyticsContext);
-  var uuid = useUIDSeed()('avatar');
+  var labelId = useId();
   useEffect(function () {
     lastAnalytics.current = analyticsContext;
   }, [analyticsContext]);
@@ -148,7 +148,7 @@ var Avatar = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   return jsx(AvatarContainer, {
     "data-testid": testId,
     role: containerShouldBeImage ? 'img' : undefined,
-    "aria-labelledby": containerShouldBeImage ? "".concat(uuid, "-label") : undefined,
+    "aria-labelledby": containerShouldBeImage ? labelId : undefined,
     style: {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       display: 'inline-block',
@@ -174,7 +174,7 @@ var Avatar = /*#__PURE__*/forwardRef(function (_ref2, ref) {
       'aria-label': label || defaultLabel
     }), {}, {
       children: jsx(AvatarImage
-      // Only pass in the name if an image is provded and the
+      // Only pass in the name if an image is provided and the
       // container is not being used as an `img` role
       , {
         alt: !containerShouldBeImage && src ? name : undefined,
@@ -203,7 +203,7 @@ var Avatar = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     testId: testId
   }, customStatusNode), containerShouldBeImage ? jsx("span", {
     "data-testid": testId && "".concat(testId, "--label"),
-    id: "".concat(uuid, "-label"),
+    id: labelId,
     hidden: true
   }, defaultLabel) : undefined);
 });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/avatar",
-	"version": "21.15.0",
+	"version": "21.15.2",
 	"description": "An avatar is a visual representation of a user or entity.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -24,10 +24,6 @@
 	"atlaskit:src": "src/index.ts",
 	"atlassian": {
 		"team": "Design System Team",
-		"releaseModel": "continuous",
-		"productPushConsumption": [
-			"jira"
-		],
 		"website": {
 			"name": "Avatar",
 			"category": "Components"
@@ -45,16 +41,16 @@
 	},
 	"dependencies": {
 		"@atlaskit/analytics-next": "^10.1.0",
+		"@atlaskit/ds-lib": "^2.6.0",
 		"@atlaskit/focus-ring": "^1.6.0",
-		"@atlaskit/icon": "^22.12.0",
+		"@atlaskit/icon": "^22.18.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
-		"@atlaskit/primitives": "^12.0.0",
+		"@atlaskit/primitives": "^12.2.0",
 		"@atlaskit/theme": "^13.0.0",
-		"@atlaskit/tokens": "^1.58.0",
+		"@atlaskit/tokens": "^2.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
-		"@emotion/serialize": "^1.1.0",
-		"react-uid": "^2.2.0"
+		"@emotion/serialize": "^1.1.0"
 	},
 	"peerDependencies": {
 		"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
@@ -62,7 +58,6 @@
 	"devDependencies": {
 		"@af/accessibility-testing": "*",
 		"@af/visual-regression": "*",
-		"@atlaskit/ds-lib": "^2.4.0",
 		"@atlaskit/ssr": "*",
 		"@atlaskit/textfield": "^6.5.0",
 		"@atlaskit/tooltip": "^18.7.0",