@atlaskit/media-avatar-picker 28.2.0 → 28.3.1

package/dist/esm/avatar-picker-dialog/SubmitErrorDialog.js

@@ -1,11 +1,11 @@
-/* SubmitErrorDialog.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* SubmitErrorDialog.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./SubmitErrorDialog.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { useRef, useEffect } from 'react';
 import ErrorIcon from '@atlaskit/icon/core/status-error';
 import Flag from '@atlaskit/flag/flag';
-import { messages } from '@atlaskit/media-ui';
+import { messages } from '@atlaskit/media-ui/messages';
 import { useIntl } from 'react-intl';
 var avatarPickerErrorStyles = null;
 export var SubmitErrorDialog = function SubmitErrorDialog() {

package/dist/esm/avatar-picker-dialog/custom-spinner.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ModalSpinner } from '@atlaskit/media-ui';
+import ModalSpinner from '@atlaskit/media-ui/modalSpinner';
 export var CustomSpinner = function CustomSpinner() {
   return /*#__PURE__*/React.createElement(ModalSpinner, {
     blankedColor: "var(--ds-blanket, #050C1F75)",

package/dist/esm/avatar-picker-dialog/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* index.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
@@ -23,7 +23,9 @@ import Button from '@atlaskit/button/standard-button';
 import { FormattedMessage, IntlProvider, injectIntl } from 'react-intl';
 import Field from '@atlaskit/form/field';
 import { HelperMessage } from '@atlaskit/form/helper-message';
-import { fileToDataURI, dataURItoFile, messages } from '@atlaskit/media-ui';
+import { fileToDataURI } from '@atlaskit/media-ui/fileToDataURI';
+import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
+import { messages } from '@atlaskit/media-ui/messages';
 import { Box } from '@atlaskit/primitives/compiled';
 import Textfield from '@atlaskit/textfield/text-field';
 import ImageNavigator from '../image-navigator';

package/dist/esm/avatar-picker-dialog/layout-const.js

@@ -1,4 +1,4 @@
-import { Rectangle } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
 export var DEFAULT_VISIBLE_PREDEFINED_AVATARS = 5;
 export var AVATAR_DIALOG_WIDTH = 375;
 export var AVATAR_DIALOG_HEIGHT = 470;

package/dist/esm/image-cropper/crop-to-data-uri.js

@@ -1,4 +1,4 @@
-import { isRotated } from '@atlaskit/media-ui';
+import { isRotated } from '@atlaskit/media-ui/imageMetaData/isRotated';
 import { getCanvas } from '../util';
 var CONTAINER_PADDING = 28;
 export var cropToDataURI = function cropToDataURI(imageElement, imageRect, cropRect, scale, imageOrientation) {

package/dist/esm/image-cropper/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* index.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
@@ -16,7 +16,8 @@ import React from 'react';
 import { Component } from 'react';
 import CrossIcon from '@atlaskit/icon/core/cross';
 import { injectIntl } from 'react-intl';
-import { messages, MediaImage } from '@atlaskit/media-ui';
+import { messages } from '@atlaskit/media-ui/messages';
+import { MediaImage } from '@atlaskit/media-ui/mediaImage';
 import { isImageRemote } from './isImageRemote';
 import IconButton from '@atlaskit/button/icon/button';
 import { Box } from '@atlaskit/primitives/compiled';

package/dist/esm/image-navigator/dragZone.js

@@ -1,4 +1,4 @@
-/* dragZone.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* dragZone.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["showBorder", "isDroppingFile", "children"];

package/dist/esm/image-navigator/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* index.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
@@ -18,7 +18,13 @@ import { FormattedMessage, injectIntl } from 'react-intl';
 import Button from '@atlaskit/button/standard-button';
 import ImageCropper from '../image-cropper';
 import Spinner from '@atlaskit/spinner/spinner';
-import { fileToDataURI, dataURItoFile, getOrientation, isRotated, Ellipsify, Vector2, messages } from '@atlaskit/media-ui';
+import { fileToDataURI } from '@atlaskit/media-ui/fileToDataURI';
+import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
+import { getOrientation } from '@atlaskit/media-ui/imageMetaData/getOrientation';
+import { isRotated } from '@atlaskit/media-ui/imageMetaData/isRotated';
+import { Ellipsify } from '@atlaskit/media-ui/ellipsify/ellipsify';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
+import { messages } from '@atlaskit/media-ui/messages';
 import * as exenv from 'exenv';
 import { uploadPlaceholder, errorIcon } from './images';
 import { fileSizeMb } from '../util';

package/dist/esm/image-navigator/slider.js

@@ -1,4 +1,4 @@
-/* slider.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* slider.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
@@ -12,7 +12,7 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import { Component } from 'react';
 import FieldRange from '@atlaskit/range/range';
-import { messages } from '@atlaskit/media-ui';
+import { messages } from '@atlaskit/media-ui/messages';
 import ScaleLargeIcon from '@atlaskit/icon/core/image';
 import ScaleSmallIcon from '@atlaskit/icon/core/image';
 import Button from '@atlaskit/button/standard-button';

package/dist/esm/image-placer/constraints.js

@@ -1,4 +1,5 @@
-import { Rectangle, Vector2 } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 export function zoomToFit(imageWidth, imageHeight, visibleBounds) {
   var itemRect = new Rectangle(imageWidth, imageHeight);
   var scaleFactor = itemRect.scaleToFitSmallestSide(visibleBounds);

package/dist/esm/image-placer/container.js

@@ -11,7 +11,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * This way, you can still move the image without clicking directly on it.
  */
 import React from 'react';
-import { Vector2 } from '@atlaskit/media-ui';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 import { ContainerWrapper } from './containerWrapper';
 export var ImagePlacerContainer = /*#__PURE__*/function (_React$Component) {
   function ImagePlacerContainer() {

package/dist/esm/image-placer/containerWrapper.js

@@ -1,4 +1,4 @@
-/* containerWrapper.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* containerWrapper.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["width", "height", "margin", "children"];

package/dist/esm/image-placer/imagePlacerErrorWrapper.js

@@ -1,4 +1,4 @@
-/* imagePlacerErrorWrapper.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* imagePlacerErrorWrapper.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./imagePlacerErrorWrapper.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/image-placer/imageProcessor.js

@@ -1,6 +1,8 @@
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import { Rectangle, loadImage, getOrientation } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import { loadImage } from '@atlaskit/media-ui/loadImage';
+import { getOrientation } from '@atlaskit/media-ui/imageMetaData/getOrientation';
 import { getCanvas } from '../util';
 export function radians(deg) {
   return deg * (Math.PI / 180);

package/dist/esm/image-placer/imageWrapper.js

@@ -1,4 +1,4 @@
-/* imageWrapper.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* imageWrapper.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["x", "y", "width", "height", "transform"];
@@ -6,7 +6,7 @@ import "./imageWrapper.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { useIntl } from 'react-intl';
-import { messages } from '@atlaskit/media-ui';
+import { messages } from '@atlaskit/media-ui/messages';
 var imageWrapperStyles = null;
 export var ImageWrapper = function ImageWrapper(_ref) {
   var x = _ref.x,

package/dist/esm/image-placer/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* index.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
@@ -12,7 +12,12 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
-import { Rectangle, Vector2, Bounds, dataURItoFile, getFileInfo, getFileInfoFromSrc } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
+import { Bounds } from '@atlaskit/media-ui/bounds';
+import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
+import { getFileInfo } from '@atlaskit/media-ui/getFileInfo';
+import { getFileInfoFromSrc } from '@atlaskit/media-ui/getFileInfoFromSrc';
 import { ImagePlacerContainer } from './container';
 import { ImagePlacerImage } from './image';
 import { Margin } from './margin';

package/dist/esm/image-placer/margin.js

@@ -1,4 +1,4 @@
-/* margin.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* margin.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";

package/dist/esm/predefined-avatar-list/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* index.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
@@ -6,7 +6,7 @@ import { AvatarList } from '../avatar-list';
 import EditorMoreIcon from '@atlaskit/icon/core/show-more-horizontal';
 import Button from '@atlaskit/button/standard-button';
 import { useIntl } from 'react-intl';
-import { messages } from '@atlaskit/media-ui';
+import { messages } from '@atlaskit/media-ui/messages';
 import { forwardRef } from 'react';
 var predefinedAvatarsWrapperStyles = null;
 var showMoreButtonStyles = null;

package/dist/esm/predefined-avatar-view/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* index.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./index.compiled.css";
@@ -7,7 +7,7 @@ import { ax, ix } from "@compiled/react/runtime";
 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; }
 import { FormattedMessage, useIntl } from 'react-intl';
-import { messages } from '@atlaskit/media-ui';
+import { messages } from '@atlaskit/media-ui/messages';
 import ArrowLeftIcon from '@atlaskit/icon/core/arrow-left';
 import Button from '@atlaskit/button/standard-button';
 import { forwardRef, useState } from 'react';

package/dist/esm/viewport/viewport.js

@@ -1,7 +1,9 @@
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { Rectangle, Bounds, Vector2 } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import { Bounds } from '@atlaskit/media-ui/bounds';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 
 /**
  * maximum amount to allow scaling up from "100%"

package/dist/types/avatar-picker-dialog/layout-const.d.ts

@@ -1,4 +1,4 @@
-import { Rectangle } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
 export declare const DEFAULT_VISIBLE_PREDEFINED_AVATARS = 5;
 export declare const AVATAR_DIALOG_WIDTH = 375;
 export declare const AVATAR_DIALOG_HEIGHT = 470;

package/dist/types/image-navigator/index.d.ts

@@ -5,7 +5,7 @@
 import React from 'react';
 import { Component } from 'react';
 import { type WrappedComponentProps } from 'react-intl';
-import { Vector2 } from '@atlaskit/media-ui';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 import { Viewport } from '../viewport';
 export declare const AVATAR_DIALOG_WIDTH = 375;
 export interface LoadParameters {

package/dist/types/image-placer/constraints.d.ts

@@ -1,4 +1,6 @@
-import { Rectangle, type Bounds, Vector2 } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import type { Bounds } from '@atlaskit/media-ui/bounds';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 export declare function zoomToFit(imageWidth: number, imageHeight: number, visibleBounds: Bounds): Rectangle;
 export declare function applyConstraints(useConstraints: boolean, imageBounds: Bounds, visibleBounds: Bounds): Vector2;
 export declare function applyFullConstraints(imageBounds: Bounds, visibleBounds: Bounds): Vector2;

package/dist/types/image-placer/container.d.ts

@@ -3,7 +3,7 @@
  * This way, you can still move the image without clicking directly on it.
  */
 import React from 'react';
-import { Vector2 } from '@atlaskit/media-ui';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 export interface ImagePlacerContainerProps {
     children?: React.ReactNode;
     width: number;

package/dist/types/image-placer/imageProcessor.d.ts

@@ -1,4 +1,6 @@
-import { Rectangle, type Bounds, type FileInfo } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import type { Bounds } from '@atlaskit/media-ui/bounds';
+import type { FileInfo } from '@atlaskit/media-ui/imageMetaData/types';
 export declare function radians(deg: number): number;
 export interface ViewInfo {
     containerRect: Rectangle;

package/dist/types/image-placer/index.d.ts

@@ -1,5 +1,8 @@
 import React from 'react';
-import { Rectangle, Vector2, Bounds, type FileInfo } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
+import { Bounds } from '@atlaskit/media-ui/bounds';
+import type { FileInfo } from '@atlaskit/media-ui/imageMetaData/types';
 export interface ImageActions {
     toCanvas: () => HTMLCanvasElement;
     toDataURL: () => string;

package/dist/types/viewport/viewport.d.ts

@@ -1,4 +1,6 @@
-import { Rectangle, Bounds, Vector2 } from '@atlaskit/media-ui';
+import { Rectangle } from '@atlaskit/media-ui/rectangle';
+import { Bounds } from '@atlaskit/media-ui/bounds';
+import { Vector2 } from '@atlaskit/media-ui/vector2';
 /**
  * maximum amount to allow scaling up from "100%"
  * - when the image is smaller than the view size, "100%" is the view size

package/example-helpers/viewport-debug.ts

@@ -1,4 +1,4 @@
-import { Bounds } from '@atlaskit/media-ui';
+import { Bounds } from '@atlaskit/media-ui/bounds';
 import { type Viewport } from '../src/viewport/viewport';
 import { renderViewport } from '../src/viewport/viewport-render';
 import { viewport as instance } from '../src/image-navigator';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-avatar-picker",
-	"version": "28.2.0",
+	"version": "28.3.1",
 	"description": "A component to select, drag and resize image avatars. It also provides a default list of predefined avatars.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,21 +30,21 @@
 		}
 	},
 	"dependencies": {
-		"@atlaskit/button": "^25.2.0",
-		"@atlaskit/css": "^1.0.0",
-		"@atlaskit/flag": "^18.4.0",
-		"@atlaskit/form": "^17.1.0",
-		"@atlaskit/icon": "^37.5.0",
-		"@atlaskit/media-ui": "^30.12.0",
-		"@atlaskit/modal-dialog": "^16.5.0",
-		"@atlaskit/platform-feature-flags": "^2.1.0",
-		"@atlaskit/primitives": "^22.4.0",
-		"@atlaskit/range": "^12.1.0",
+		"@atlaskit/button": "^25.3.0",
+		"@atlaskit/css": "^1.1.0",
+		"@atlaskit/flag": "^18.5.0",
+		"@atlaskit/form": "^17.2.0",
+		"@atlaskit/icon": "^37.7.0",
+		"@atlaskit/media-ui": "^30.16.0",
+		"@atlaskit/modal-dialog": "^16.6.0",
+		"@atlaskit/platform-feature-flags": "^2.2.0",
+		"@atlaskit/primitives": "^22.5.0",
+		"@atlaskit/range": "^12.2.0",
 		"@atlaskit/react-compiler-gating": "^0.2.0",
-		"@atlaskit/spinner": "^20.3.0",
-		"@atlaskit/textfield": "^10.1.0",
-		"@atlaskit/tokens": "^16.8.0",
-		"@atlaskit/visually-hidden": "^4.3.0",
+		"@atlaskit/spinner": "^20.4.0",
+		"@atlaskit/textfield": "^10.2.0",
+		"@atlaskit/tokens": "^17.0.0",
+		"@atlaskit/visually-hidden": "^4.4.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
 		"exenv": "^1.2.2",
@@ -56,11 +56,11 @@
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
 	},
 	"devDependencies": {
-		"@atlaskit/media-core": "^38.0.0",
-		"@atlaskit/media-test-helpers": "^42.3.0",
-		"@atlaskit/page": "^15.2.0",
-		"@atlassian/a11y-jest-testing": "^0.16.0",
-		"@atlassian/feature-flags-test-utils": "^1.2.0",
+		"@atlaskit/media-core": "^38.2.0",
+		"@atlaskit/media-test-helpers": "^42.4.0",
+		"@atlaskit/page": "^15.3.0",
+		"@atlassian/a11y-jest-testing": "^0.17.0",
+		"@atlassian/feature-flags-test-utils": "^1.3.0",
 		"@atlassian/testing-library": "^0.11.0",
 		"@testing-library/react": "^16.3.0",
 		"@testing-library/user-event": "^14.4.3",
@@ -73,16 +73,5 @@
 		"platform_media_a11y_avatar_radio_label": {
 			"type": "boolean"
 		}
-	},
-	"techstack": {
-		"@repo/internal": {
-			"design-tokens": [
-				"color",
-				"spacing"
-			],
-			"styling": [
-				"compiled"
-			]
-		}
 	}
 }

package/report.api.md

@@ -1,144 +0,0 @@
-<!-- API Report Version: 2.3 -->
-
-## API Report File for "@atlaskit/media-avatar-picker"
-
-> Do not edit this file. This report is auto-generated using
-> [API Extractor](https://api-extractor.com/).
-> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
-
-### Table of contents
-
-- [Main Entry Types](#main-entry-types)
-- [Peer Dependencies](#peer-dependencies)
-
-### Main Entry Types
-
-<!--SECTION START: Main Entry Types-->
-
-```ts
-import { default as React_2 } from 'react';
-import { ReactNode } from 'react';
-
-// @public (undocumented)
-export type AsyncAvatarPickerDialogProps = AvatarPickerDialogProps & {
-	placeholder?: ReactNode;
-};
-
-// @public (undocumented)
-interface AsyncAvatarPickerDialogState {
-	// (undocumented)
-	AvatarPickerDialog?: typeof _default;
-}
-
-// @public (undocumented)
-export interface Avatar {
-	// (undocumented)
-	dataURI: string;
-	// (undocumented)
-	name?: string;
-}
-
-// @public (undocumented)
-export class AvatarPickerDialog extends React_2.PureComponent<
-	AsyncAvatarPickerDialogProps,
-	AsyncAvatarPickerDialogState
-> {
-	// (undocumented)
-	static AvatarPickerDialog?: typeof _default;
-	// (undocumented)
-	static displayName: string;
-	// (undocumented)
-	render(): {};
-	// (undocumented)
-	state: {
-		AvatarPickerDialog: React_2.FC<AvatarPickerDialogProps> | undefined;
-	};
-	// (undocumented)
-	UNSAFE_componentWillMount(): Promise<void>;
-}
-
-// @public (undocumented)
-interface AvatarPickerDialogProps {
-	avatars: Array<Avatar>;
-	defaultSelectedAvatar?: Avatar;
-	errorMessage?: string;
-	imageSource?: string;
-	isLoading?: boolean;
-	maxImageSize?: number;
-	onAvatarPicked: (avatar: Avatar) => void;
-	onCancel: () => void;
-	onImagePicked?: (file: File, crop: CropProperties) => void;
-	onImagePickedDataURI?: (dataUri: string) => void;
-	outputSize?: number;
-	predefinedAvatarsText?: string;
-	primaryButtonText?: string;
-	title?: string;
-}
-
-// @public (undocumented)
-interface CropProperties {
-	// (undocumented)
-	size: number;
-	// (undocumented)
-	x: number;
-	// (undocumented)
-	y: number;
-}
-
-// @public (undocumented)
-const _default: React_2.FC<AvatarPickerDialogProps>;
-
-// @public (undocumented)
-export const ImageNavigator: React_2.FC<ImageNavigatorProps>;
-
-// @public (undocumented)
-export interface ImageNavigatorProps {
-	// (undocumented)
-	errorMessage?: string;
-	// (undocumented)
-	imageSource?: string;
-	// (undocumented)
-	isLoading?: boolean;
-	// (undocumented)
-	maxImageSize?: number;
-	// (undocumented)
-	onCropChanged?: (x: number, y: number, size: number) => void;
-	// (undocumented)
-	onImageError: (errorMessage: string) => void;
-	// (undocumented)
-	onImageLoaded: (file: File) => void;
-	// (undocumented)
-	onImageUploaded: (file: File) => void;
-	// (undocumented)
-	onLoad?: OnLoadHandler;
-	// (undocumented)
-	onRemoveImage: () => void;
-}
-
-// @public (undocumented)
-export interface LoadParameters {
-	// (undocumented)
-	export: (outputSize?: number) => string;
-}
-
-// @public (undocumented)
-export type OnLoadHandler = (params: LoadParameters) => void;
-
-// (No @packageDocumentation comment for this package)
-```
-
-<!--SECTION END: Main Entry Types-->
-
-### Peer Dependencies
-
-<!--SECTION START: Peer Dependencies-->
-
-```json
-{
-	"@emotion/react": "^11.7.1",
-	"react": "^16.8.0",
-	"react-intl": "npm:react-intl@^5.18.1"
-}
-```
-
-<!--SECTION END: Peer Dependencies-->