@atlaskit/media-avatar-picker 28.1.10 → 28.3.0

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

@@ -16,9 +16,10 @@ 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/new';
+import IconButton from '@atlaskit/button/icon/button';
 import { Box } from '@atlaskit/primitives/compiled';
 import { cx } from '@atlaskit/css';
 import { ERROR } from '../avatar-picker-dialog';

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

@@ -17,8 +17,14 @@ import { Component } from 'react';
 import { FormattedMessage, injectIntl } from 'react-intl';
 import Button from '@atlaskit/button/standard-button';
 import ImageCropper from '../image-cropper';
-import Spinner from '@atlaskit/spinner';
-import { fileToDataURI, dataURItoFile, getOrientation, isRotated, Ellipsify, Vector2, messages } from '@atlaskit/media-ui';
+import Spinner from '@atlaskit/spinner/spinner';
+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

@@ -11,8 +11,8 @@ import { ax, ix } from "@compiled/react/runtime";
 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 { Component } from 'react';
-import FieldRange from '@atlaskit/range';
-import { messages } from '@atlaskit/media-ui';
+import FieldRange from '@atlaskit/range/range';
+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/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

@@ -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

@@ -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/predefined-avatar-list/index.js

@@ -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

@@ -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/StatefulAvatarPickerDialog.tsx

@@ -6,7 +6,7 @@
 import React, { type ReactNode } from 'react';
 import { jsx, css } from '@compiled/react';
 import Button from '@atlaskit/button/standard-button';
-import { ModalTransition } from '@atlaskit/modal-dialog';
+import ModalTransition from '@atlaskit/modal-dialog/modal-transition';
 import { type Avatar, AvatarPickerDialog } from '../src';
 import { generateAvatars } from '../example-helpers';
 import {

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.1.10",
+	"version": "28.3.0",
 	"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,23 +30,23 @@
 		}
 	},
 	"dependencies": {
-		"@atlaskit/button": "^25.0.0",
-		"@atlaskit/css": "^1.0.0",
-		"@atlaskit/flag": "^18.2.0",
-		"@atlaskit/form": "^17.0.0",
-		"@atlaskit/icon": "^37.3.0",
-		"@atlaskit/media-ui": "^30.11.0",
-		"@atlaskit/modal-dialog": "^16.3.0",
-		"@atlaskit/platform-feature-flags": "^2.1.0",
-		"@atlaskit/primitives": "^22.2.0",
-		"@atlaskit/range": "^12.0.0",
+		"@atlaskit/button": "^25.3.0",
+		"@atlaskit/css": "^1.1.0",
+		"@atlaskit/flag": "^18.5.0",
+		"@atlaskit/form": "^17.2.0",
+		"@atlaskit/icon": "^37.6.0",
+		"@atlaskit/media-ui": "^30.15.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.1.0",
-		"@atlaskit/textfield": "^10.0.0",
-		"@atlaskit/tokens": "^16.6.0",
-		"@atlaskit/visually-hidden": "^4.2.0",
+		"@atlaskit/spinner": "^20.4.0",
+		"@atlaskit/textfield": "^10.2.0",
+		"@atlaskit/tokens": "^16.10.0",
+		"@atlaskit/visually-hidden": "^4.4.0",
 		"@babel/runtime": "^7.0.0",
-		"@compiled/react": "^1.0.0",
+		"@compiled/react": "^1.0.2",
 		"exenv": "^1.2.2",
 		"react-error-boundary": "^3.1.3"
 	},
@@ -56,10 +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.2.0",
-		"@atlassian/a11y-jest-testing": "^0.15.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",

package/media-avatar-picker.docs.tsx

@@ -1,71 +0,0 @@
-/**
- * Structured MCP docs for `@atlaskit/media-avatar-picker`.
- */
-
-import path from 'path';
-
-import type { StructuredContentSource } from '@atlassian/structured-docs-types/types';
-
-import packageJson from './package.json';
-
-const packagePath = path.resolve(__dirname);
-
-const documentation: StructuredContentSource = {
-	package: {
-		package: '@atlaskit/media-avatar-picker',
-		packagePath,
-		packageJson,
-		overview:
-			'A component to select, drag and resize image avatars. It also provides a default list of predefined avatars.',
-	},
-	components: [
-		{
-			name: 'AvatarPickerDialog',
-			description: 'Main dialog component that orchestrates the avatar selection experience.',
-			status: 'general-availability',
-			import: {
-				name: 'AvatarPickerDialog',
-				package: '@atlaskit/media-avatar-picker',
-				type: 'named',
-				packagePath,
-				packageJson,
-			},
-			usageGuidelines: [
-				'Use `AvatarPickerDialog` when you need to allow users to upload or select an avatar.',
-			],
-			keywords: ['media', 'avatar', 'picker', 'upload'],
-			categories: ['media'],
-			examples: [
-				{
-					name: 'Avatar picker with source',
-					description: 'Basic usage of AvatarPickerDialog with an initial image source.',
-					source: path.resolve(packagePath, './examples/0-avatar-picker-with-source.tsx'),
-				},
-			],
-		},
-		{
-			name: 'ImageCropper',
-			description: 'Interactive component for cropping uploaded images.',
-			status: 'general-availability',
-			import: {
-				name: 'ImageCropper',
-				package: '@atlaskit/media-avatar-picker/image-cropper',
-				type: 'named',
-				packagePath,
-				packageJson,
-			},
-			usageGuidelines: ['Use `ImageCropper` for standalone image cropping functionality.'],
-			keywords: ['media', 'crop', 'image'],
-			categories: ['media'],
-			examples: [
-				{
-					name: 'Image cropper',
-					description: 'Basic usage of ImageCropper.',
-					source: path.resolve(packagePath, './examples/1-image-cropper.tsx'),
-				},
-			],
-		},
-	],
-};
-
-export default documentation;

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-->