@atlaskit/avatar-group 9.11.5 → 10.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/components/more-indicator.js +0 -1
  3. package/dist/es2019/components/more-indicator.js +0 -1
  4. package/dist/esm/components/more-indicator.js +0 -1
  5. package/dist/types/components/avatar-group.d.ts +5 -3
  6. package/dist/types/components/more-indicator.d.ts +2 -0
  7. package/dist/types/components/types.d.ts +2 -1
  8. package/dist/types-ts4.5/components/avatar-group.d.ts +5 -3
  9. package/dist/types-ts4.5/components/more-indicator.d.ts +2 -0
  10. package/dist/types-ts4.5/components/types.d.ts +2 -1
  11. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/avatar-group
2
2
 
3
+ ## 10.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 10.0.0
10
+
11
+ ### Major Changes
12
+
13
+ - [`8aee79daf4012`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8aee79daf4012) -
14
+ Removed `xsmall` size option for AvatarGroup since it is too small to display elements like the
15
+ more indicator in an accessible way. Use the `small` size instead. The standalone Avatar component
16
+ will continue to support the `xsmall` size.
17
+
3
18
  ## 9.11.5
4
19
 
5
20
  ### Patch Changes
package/dist/cjs/components/more-indicator.js CHANGED
@@ -22,7 +22,6 @@ var _excluded = ["testId", "className", "ref"];
22
22
  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); }
23
23
  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; }
24
24
  var buttonSizes = {
25
- xsmall: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
26
25
  small: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
27
26
  medium: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
28
27
  large: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
package/dist/es2019/components/more-indicator.js CHANGED
@@ -11,7 +11,6 @@ import Avatar, { ACTIVE_SCALE_FACTOR, BORDER_WIDTH } from '@atlaskit/avatar';
11
11
  import { fg } from '@atlaskit/platform-feature-flags';
12
12
  import { B300, B400, B50, N0, N20, N30, N500 } from '@atlaskit/theme/colors';
13
13
  const buttonSizes = {
14
- xsmall: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
15
14
  small: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
16
15
  medium: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
17
16
  large: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
package/dist/esm/components/more-indicator.js CHANGED
@@ -13,7 +13,6 @@ import Avatar, { ACTIVE_SCALE_FACTOR, BORDER_WIDTH } from '@atlaskit/avatar';
13
13
  import { fg } from '@atlaskit/platform-feature-flags';
14
14
  import { B300, B400, B50, N0, N20, N30, N500 } from '@atlaskit/theme/colors';
15
15
  var buttonSizes = {
16
- xsmall: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
17
16
  small: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
18
17
  medium: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
19
18
  large: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
package/dist/types/components/avatar-group.d.ts CHANGED
@@ -4,9 +4,9 @@
4
4
  */
5
5
  import { type ElementType, type MouseEventHandler } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
- import Avatar, { type SizeType } from '@atlaskit/avatar';
7
+ import Avatar from '@atlaskit/avatar';
8
8
  import { type PositionType } from '@atlaskit/tooltip';
9
- import { type AvatarGroupOverrides, type AvatarProps, type onAvatarClickHandler } from './types';
9
+ import { type AvatarGroupOverrides, type AvatarGroupSize, type AvatarProps, type onAvatarClickHandler } from './types';
10
10
  export interface AvatarGroupProps {
11
11
  /**
12
12
  * Indicates the layout of the avatar group.
@@ -28,8 +28,10 @@ export interface AvatarGroupProps {
28
28
  /**
29
29
  * Defines the size of the avatar.
30
30
  * Defaults to "medium".
31
+ *
32
+ * Note: The "xsmall" size that exists on Avatar is not supported here because elements such as the more indicator cannot be displayed in an accessible manner at that size.
31
33
  */
32
- size?: SizeType;
34
+ size?: AvatarGroupSize;
33
35
  /**
34
36
  * Typically the background color that the avatar is presented on.
35
37
  * Accepts any color argument that the CSS border-color property accepts.
package/dist/types/components/more-indicator.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { type AvatarClickEventHandler, type AvatarPropTypes } from '@atlaskit/avatar';
3
+ import { type AvatarGroupSize } from './types';
3
4
  export interface MoreIndicatorProps extends AvatarPropTypes {
4
5
  count: number;
5
6
  'aria-controls'?: string;
@@ -8,6 +9,7 @@ export interface MoreIndicatorProps extends AvatarPropTypes {
8
9
  buttonProps: Partial<React.HTMLAttributes<HTMLElement>>;
9
10
  onClick: AvatarClickEventHandler;
10
11
  isActive: boolean;
12
+ size: AvatarGroupSize;
11
13
  }
12
14
  declare const MoreIndicator: import("react").ForwardRefExoticComponent<MoreIndicatorProps & import("react").RefAttributes<HTMLButtonElement>>;
13
15
  export default MoreIndicator;
package/dist/types/components/types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { ElementType, ForwardRefExoticComponent, ReactNode, RefAttributes } from 'react';
2
2
  import type { AnalyticsEvent } from '@atlaskit/analytics-next';
3
- import { type default as Avatar, type AvatarPropTypes } from '@atlaskit/avatar';
3
+ import { type default as Avatar, type AvatarPropTypes, type SizeType } from '@atlaskit/avatar';
4
4
  import { type MenuGroupProps } from '@atlaskit/menu';
5
5
  import { type ContentProps } from '@atlaskit/popup';
6
6
  import type { AvatarGroupItemProps } from './avatar-group-item';
@@ -25,3 +25,4 @@ export type Action = 'next' | 'prev' | 'first' | 'last';
25
25
  export interface PopupAvatarGroupProps extends MenuGroupProps {
26
26
  setInitialFocusRef?: ContentProps['setInitialFocusRef'];
27
27
  }
28
+ export type AvatarGroupSize = Exclude<SizeType, 'xsmall'>;
package/dist/types-ts4.5/components/avatar-group.d.ts CHANGED
@@ -4,9 +4,9 @@
4
4
  */
5
5
  import { type ElementType, type MouseEventHandler } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
- import Avatar, { type SizeType } from '@atlaskit/avatar';
7
+ import Avatar from '@atlaskit/avatar';
8
8
  import { type PositionType } from '@atlaskit/tooltip';
9
- import { type AvatarGroupOverrides, type AvatarProps, type onAvatarClickHandler } from './types';
9
+ import { type AvatarGroupOverrides, type AvatarGroupSize, type AvatarProps, type onAvatarClickHandler } from './types';
10
10
  export interface AvatarGroupProps {
11
11
  /**
12
12
  * Indicates the layout of the avatar group.
@@ -28,8 +28,10 @@ export interface AvatarGroupProps {
28
28
  /**
29
29
  * Defines the size of the avatar.
30
30
  * Defaults to "medium".
31
+ *
32
+ * Note: The "xsmall" size that exists on Avatar is not supported here because elements such as the more indicator cannot be displayed in an accessible manner at that size.
31
33
  */
32
- size?: SizeType;
34
+ size?: AvatarGroupSize;
33
35
  /**
34
36
  * Typically the background color that the avatar is presented on.
35
37
  * Accepts any color argument that the CSS border-color property accepts.
package/dist/types-ts4.5/components/more-indicator.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { type AvatarClickEventHandler, type AvatarPropTypes } from '@atlaskit/avatar';
3
+ import { type AvatarGroupSize } from './types';
3
4
  export interface MoreIndicatorProps extends AvatarPropTypes {
4
5
  count: number;
5
6
  'aria-controls'?: string;
@@ -8,6 +9,7 @@ export interface MoreIndicatorProps extends AvatarPropTypes {
8
9
  buttonProps: Partial<React.HTMLAttributes<HTMLElement>>;
9
10
  onClick: AvatarClickEventHandler;
10
11
  isActive: boolean;
12
+ size: AvatarGroupSize;
11
13
  }
12
14
  declare const MoreIndicator: import("react").ForwardRefExoticComponent<MoreIndicatorProps & import("react").RefAttributes<HTMLButtonElement>>;
13
15
  export default MoreIndicator;
package/dist/types-ts4.5/components/types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { ElementType, ForwardRefExoticComponent, ReactNode, RefAttributes } from 'react';
2
2
  import type { AnalyticsEvent } from '@atlaskit/analytics-next';
3
- import { type default as Avatar, type AvatarPropTypes } from '@atlaskit/avatar';
3
+ import { type default as Avatar, type AvatarPropTypes, type SizeType } from '@atlaskit/avatar';
4
4
  import { type MenuGroupProps } from '@atlaskit/menu';
5
5
  import { type ContentProps } from '@atlaskit/popup';
6
6
  import type { AvatarGroupItemProps } from './avatar-group-item';
@@ -25,3 +25,4 @@ export type Action = 'next' | 'prev' | 'first' | 'last';
25
25
  export interface PopupAvatarGroupProps extends MenuGroupProps {
26
26
  setInitialFocusRef?: ContentProps['setInitialFocusRef'];
27
27
  }
28
+ export type AvatarGroupSize = Exclude<SizeType, 'xsmall'>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/avatar-group",
3
- "version": "9.11.5",
3
+ "version": "10.0.1",
4
4
  "description": "An avatar group displays a number of avatars grouped together in a stack or grid.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -24,11 +24,11 @@
24
24
  },
25
25
  "dependencies": {
26
26
  "@atlaskit/avatar": "^21.15.0",
27
- "@atlaskit/ds-lib": "^3.0.0",
28
- "@atlaskit/menu": "^2.12.0",
27
+ "@atlaskit/ds-lib": "^3.1.0",
28
+ "@atlaskit/menu": "^2.13.0",
29
29
  "@atlaskit/platform-feature-flags": "^0.3.0",
30
30
  "@atlaskit/popup": "^1.28.0",
31
- "@atlaskit/theme": "^13.0.0",
31
+ "@atlaskit/theme": "^14.0.0",
32
32
  "@atlaskit/tokens": "^2.0.0",
33
33
  "@atlaskit/tooltip": "^18.8.0",
34
34
  "@babel/runtime": "^7.0.0",