@atlaskit/avatar-group 9.4.1 → 9.4.3

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/avatar-group
 
+## 9.4.3
+
+### Patch Changes
+
+- [`6900f89eb0e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6900f89eb0e) - Internal changes to use space tokens. There is no expected visual or behaviour change.
+
+## 9.4.2
+
+### Patch Changes
+
+- [`3c114ea4257`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3c114ea4257) - Update type definitions to conform to inherited changes from `@types/react@16.14.15`.
+
 ## 9.4.1
 
 ### Patch Changes

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

@@ -26,8 +26,8 @@ var _popupAvatarGroup = _interopRequireDefault(require("./internal/components/po
 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; } /** @jsx jsx */
+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; } /** @jsx jsx */
 var MAX_COUNT = {
   grid: 11,
   stack: 5

package/dist/cjs/components/grid.js

@@ -6,21 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = require("react");
 var _react2 = require("@emotion/react");
-var _constants = require("@atlaskit/theme/constants");
 /** @jsx jsx */
 
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-
-var gridSize = (0, _constants.gridSize)();
-var gutter = gridSize / 2;
+var gutter = "var(--ds-space-negative-050, -4px)";
 var listStyles = (0, _react2.css)({
   // removes default ul styles. Needs !important to override contextual styles in product.
   display: 'flex',
   margin: "var(--ds-space-0, 0px)",
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginRight: -gutter,
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginLeft: -gutter,
+  marginRight: gutter,
+  marginLeft: gutter,
   padding: "var(--ds-space-0, 0px)",
   justifyContent: 'flex-start',
   flexWrap: 'wrap',

package/dist/es2019/components/grid.js

@@ -1,19 +1,13 @@
 /** @jsx jsx */
 import { Children } from 'react';
 import { css, jsx } from '@emotion/react';
-
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import { gridSize as getGridSize } from '@atlaskit/theme/constants';
-const gridSize = getGridSize();
-const gutter = gridSize / 2;
+const gutter = "var(--ds-space-negative-050, -4px)";
 const listStyles = css({
   // removes default ul styles. Needs !important to override contextual styles in product.
   display: 'flex',
   margin: "var(--ds-space-0, 0px)",
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginRight: -gutter,
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginLeft: -gutter,
+  marginRight: gutter,
+  marginLeft: gutter,
   padding: "var(--ds-space-0, 0px)",
   justifyContent: 'flex-start',
   flexWrap: 'wrap',

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

@@ -1,8 +1,8 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-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) { _defineProperty(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; }
+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) { _defineProperty(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; }
 /** @jsx jsx */
 import { useCallback, useEffect, useState } from 'react';
 import { jsx } from '@emotion/react';

package/dist/esm/components/grid.js

@@ -1,19 +1,13 @@
 /** @jsx jsx */
 import { Children } from 'react';
 import { css, jsx } from '@emotion/react';
-
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import { gridSize as getGridSize } from '@atlaskit/theme/constants';
-var gridSize = getGridSize();
-var gutter = gridSize / 2;
+var gutter = "var(--ds-space-negative-050, -4px)";
 var listStyles = css({
   // removes default ul styles. Needs !important to override contextual styles in product.
   display: 'flex',
   margin: "var(--ds-space-0, 0px)",
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginRight: -gutter,
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-  marginLeft: -gutter,
+  marginRight: gutter,
+  marginLeft: gutter,
   padding: "var(--ds-space-0, 0px)",
   justifyContent: 'flex-start',
   flexWrap: 'wrap',

package/dist/types/components/avatar-group.d.ts

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { ElementType, MouseEventHandler } from 'react';
 import { jsx } from '@emotion/react';
-import { SizeType } from '@atlaskit/avatar';
+import Avatar, { SizeType } from '@atlaskit/avatar';
 import { PositionType } from '@atlaskit/tooltip';
 import { AvatarGroupOverrides, AvatarProps, onAvatarClickHandler } from './types';
 export interface AvatarGroupProps {
@@ -15,7 +15,7 @@ export interface AvatarGroupProps {
     /**
      * Component used to render each avatar
      */
-    avatar?: ElementType<AvatarProps>;
+    avatar?: typeof Avatar | ElementType<AvatarProps>;
     /**
      * The maximum number of avatars allowed in the list.
      * Defaults to 5 when displayed as a stack,

package/dist/types/components/types.d.ts

@@ -1,6 +1,6 @@
 import type { ElementType, ReactNode } from 'react';
 import type { AnalyticsEvent } from '@atlaskit/analytics-next';
-import type { AvatarPropTypes } from '@atlaskit/avatar';
+import { default as Avatar, type AvatarPropTypes } from '@atlaskit/avatar';
 import { MenuGroupProps } from '@atlaskit/menu';
 import { ContentProps } from '@atlaskit/popup';
 import type { AvatarGroupItemProps } from './avatar-group-item';
@@ -16,7 +16,7 @@ export interface AvatarGroupOverrides {
         render?: (Component: ElementType<AvatarGroupItemProps>, props: AvatarGroupItemProps, index: number) => ReactNode;
     };
     Avatar?: {
-        render?: (Component: ElementType<AvatarProps>, props: AvatarProps, index: number) => ReactNode;
+        render?: (Component: typeof Avatar | ElementType<AvatarProps>, props: AvatarProps, index: number) => ReactNode;
     };
 }
 export type onAvatarClickHandler = (event: React.MouseEvent, analyticsEvent: AnalyticsEvent | undefined, index: number) => void;

package/dist/types-ts4.5/components/avatar-group.d.ts

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { ElementType, MouseEventHandler } from 'react';
 import { jsx } from '@emotion/react';
-import { SizeType } from '@atlaskit/avatar';
+import Avatar, { SizeType } from '@atlaskit/avatar';
 import { PositionType } from '@atlaskit/tooltip';
 import { AvatarGroupOverrides, AvatarProps, onAvatarClickHandler } from './types';
 export interface AvatarGroupProps {
@@ -15,7 +15,7 @@ export interface AvatarGroupProps {
     /**
      * Component used to render each avatar
      */
-    avatar?: ElementType<AvatarProps>;
+    avatar?: typeof Avatar | ElementType<AvatarProps>;
     /**
      * The maximum number of avatars allowed in the list.
      * Defaults to 5 when displayed as a stack,

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

@@ -1,6 +1,6 @@
 import type { ElementType, ReactNode } from 'react';
 import type { AnalyticsEvent } from '@atlaskit/analytics-next';
-import type { AvatarPropTypes } from '@atlaskit/avatar';
+import { default as Avatar, type AvatarPropTypes } from '@atlaskit/avatar';
 import { MenuGroupProps } from '@atlaskit/menu';
 import { ContentProps } from '@atlaskit/popup';
 import type { AvatarGroupItemProps } from './avatar-group-item';
@@ -16,7 +16,7 @@ export interface AvatarGroupOverrides {
         render?: (Component: ElementType<AvatarGroupItemProps>, props: AvatarGroupItemProps, index: number) => ReactNode;
     };
     Avatar?: {
-        render?: (Component: ElementType<AvatarProps>, props: AvatarProps, index: number) => ReactNode;
+        render?: (Component: typeof Avatar | ElementType<AvatarProps>, props: AvatarProps, index: number) => ReactNode;
     };
 }
 export type onAvatarClickHandler = (event: React.MouseEvent, analyticsEvent: AnalyticsEvent | undefined, index: number) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/avatar-group",
-  "version": "9.4.1",
+  "version": "9.4.3",
   "description": "An avatar group displays a number of avatars grouped together in a stack or grid.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -25,10 +25,10 @@
   "dependencies": {
     "@atlaskit/avatar": "^21.3.0",
     "@atlaskit/ds-lib": "^2.1.0",
-    "@atlaskit/menu": "^1.9.0",
+    "@atlaskit/menu": "^1.10.0",
     "@atlaskit/popup": "^1.9.0",
-    "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.15.0",
+    "@atlaskit/theme": "^12.6.0",
+    "@atlaskit/tokens": "^1.21.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",

package/report.api.md

@@ -16,7 +16,9 @@
 
 ```ts
 import type { AnalyticsEvent } from '@atlaskit/analytics-next';
-import type { AvatarPropTypes } from '@atlaskit/avatar';
+import Avatar from '@atlaskit/avatar';
+import { AvatarPropTypes } from '@atlaskit/avatar';
+import { default as default_2 } from '@atlaskit/avatar';
 import { ElementType } from 'react';
 import { jsx } from '@emotion/react';
 import { MouseEventHandler } from 'react';
@@ -65,7 +67,7 @@ interface AvatarGroupOverrides {
   // (undocumented)
   Avatar?: {
     render?: (
-      Component: ElementType<AvatarProps>,
+      Component: ElementType<AvatarProps> | typeof default_2,
       props: AvatarProps,
       index: number,
     ) => ReactNode;
@@ -83,7 +85,7 @@ interface AvatarGroupOverrides {
 // @public (undocumented)
 export interface AvatarGroupProps {
   appearance?: 'grid' | 'stack';
-  avatar?: ElementType<AvatarProps>;
+  avatar?: ElementType<AvatarProps> | typeof Avatar;
   borderColor?: string;
   boundariesElement?: 'scrollParent' | 'viewport' | 'window';
   data: Array<AvatarProps>;

package/tmp/api-report-tmp.d.ts

@@ -5,7 +5,9 @@
 ```ts
 
 import type { AnalyticsEvent } from '@atlaskit/analytics-next';
-import type { AvatarPropTypes } from '@atlaskit/avatar';
+import Avatar from '@atlaskit/avatar';
+import { AvatarPropTypes } from '@atlaskit/avatar';
+import { default as default_2 } from '@atlaskit/avatar';
 import { ElementType } from 'react';
 import { jsx } from '@emotion/react';
 import { MouseEventHandler } from 'react';
@@ -37,7 +39,7 @@ interface AvatarGroupItemProps {
 interface AvatarGroupOverrides {
     // (undocumented)
     Avatar?: {
-        render?: (Component: ElementType<AvatarProps>, props: AvatarProps, index: number) => ReactNode;
+        render?: (Component: ElementType<AvatarProps> | typeof default_2, props: AvatarProps, index: number) => ReactNode;
     };
     // (undocumented)
     AvatarGroupItem?: {
@@ -48,7 +50,7 @@ interface AvatarGroupOverrides {
 // @public (undocumented)
 export interface AvatarGroupProps {
     appearance?: 'grid' | 'stack';
-    avatar?: ElementType<AvatarProps>;
+    avatar?: ElementType<AvatarProps> | typeof Avatar;
     borderColor?: string;
     boundariesElement?: 'scrollParent' | 'viewport' | 'window';
     data: Array<AvatarProps>;