@atlaskit/media-avatar-picker 24.8.0 → 24.9.1

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/media-avatar-picker
 
+## 24.9.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 24.9.0
+
+### Minor Changes
+
+- [#141754](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/141754)
+  [`71bcccc5aa956`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/71bcccc5aa956) -
+  Enable new icons behind a feature flag.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 24.8.0
 
 ### Minor Changes

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

@@ -8,7 +8,7 @@ exports.SubmitErrorDialog = void 0;
 var _react = require("@emotion/react");
 var _react2 = require("react");
 var _colors = require("@atlaskit/theme/colors");
-var _error = _interopRequireDefault(require("@atlaskit/icon/glyph/error"));
+var _error = _interopRequireDefault(require("@atlaskit/icon/core/migration/error"));
 var _flag = _interopRequireDefault(require("@atlaskit/flag"));
 var _mediaUi = require("@atlaskit/media-ui");
 var _reactIntlNext = require("react-intl-next");
@@ -36,7 +36,9 @@ var SubmitErrorDialog = exports.SubmitErrorDialog = function SubmitErrorDialog()
       appearance: "error",
       icon: (0, _react.jsx)(_error.default, {
         label: "Error",
-        secondaryColor: "var(--ds-background-danger-bold, ".concat(_colors.R400, ")")
+        color: "currentColor",
+        LEGACY_secondaryColor: "var(--ds-background-danger-bold, ".concat(_colors.R400, ")"),
+        spacing: "spacious"
       }),
       id: "avatar-picker-error",
       key: "error",

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

@@ -15,7 +15,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
-var _cross = _interopRequireDefault(require("@atlaskit/icon/glyph/cross"));
+var _closeCross = _interopRequireDefault(require("@atlaskit/icon/core/migration/close--cross"));
 var _reactIntlNext = require("react-intl-next");
 var _mediaUi = require("@atlaskit/media-ui");
 var _isImageRemote = require("./isImageRemote");
@@ -186,8 +186,9 @@ var ImageCropper = exports.ImageCropper = /*#__PURE__*/function (_Component) {
         }, /*#__PURE__*/_react.default.createElement(_new.IconButton, {
           id: "remove-image-button",
           icon: function icon(iconProps) {
-            return /*#__PURE__*/_react.default.createElement(_cross.default, (0, _extends2.default)({}, iconProps, {
-              size: "small"
+            return /*#__PURE__*/_react.default.createElement(_closeCross.default, (0, _extends2.default)({}, iconProps, {
+              LEGACY_size: "small",
+              color: "currentColor"
             }));
           },
           onClick: onRemoveImage,

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

@@ -47,7 +47,9 @@ var Slider = exports.Slider = /*#__PURE__*/function (_Component) {
         }, (0, _react.jsx)(_standardButton.default
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         , {
-          className: "zoom_button zoom_button_small",
+          className: "zoom_button zoom_button_small"
+          // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20874
+          ,
           iconAfter: (0, _react.jsx)(_scaleSmall.default, {
             label: "scale-small-icon"
           }),
@@ -60,7 +62,9 @@ var Slider = exports.Slider = /*#__PURE__*/function (_Component) {
         }), (0, _react.jsx)(_standardButton.default
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         , {
-          className: "zoom_button zoom_button_large",
+          className: "zoom_button zoom_button_large"
+          // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20874
+          ,
           iconAfter: (0, _react.jsx)(_scaleLarge.default, {
             label: "scale-large-icon"
           }),

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

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.PredefinedAvatarList = void 0;
 var _react = require("@emotion/react");
 var _avatarList = require("../avatar-list");
-var _more = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/more"));
+var _showMoreHorizontalEditorMore = _interopRequireDefault(require("@atlaskit/icon/core/migration/show-more-horizontal--editor-more"));
 var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 var _styles = require("./styles");
 var _reactIntlNext = require("react-intl-next");
@@ -43,9 +43,10 @@ var PredefinedAvatarList = exports.PredefinedAvatarList = function PredefinedAva
       ,
       className: "show-more-button",
       appearance: "subtle",
-      iconAfter: (0, _react.jsx)(_more.default, {
+      iconAfter: (0, _react.jsx)(_showMoreHorizontalEditorMore.default, {
         label: "",
-        size: "large"
+        LEGACY_size: "large",
+        color: "currentColor"
       }),
       onClick: onShowMore
     }))

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

@@ -9,7 +9,7 @@ var _react = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
 var _mediaUi = require("@atlaskit/media-ui");
 var _styles = require("./styles");
-var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/glyph/arrow-left"));
+var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/core/migration/arrow-left"));
 var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 /**
  * @jsxRuntime classic
@@ -63,6 +63,7 @@ var PredefinedAvatarView = exports.PredefinedAvatarView = function PredefinedAva
       ,
       className: "back-button",
       iconAfter: (0, _react.jsx)(_arrowLeft.default, {
+        color: "currentColor",
         label: ""
       }),
       onClick: onGoBack

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

@@ -6,7 +6,7 @@
 import { jsx } from '@emotion/react';
 import { useRef, useEffect } from 'react';
 import { R400 } from '@atlaskit/theme/colors';
-import ErrorIcon from '@atlaskit/icon/glyph/error';
+import ErrorIcon from '@atlaskit/icon/core/migration/error';
 import Flag from '@atlaskit/flag';
 import { messages } from '@atlaskit/media-ui';
 import { useIntl } from 'react-intl-next';
@@ -28,7 +28,9 @@ export const SubmitErrorDialog = () => {
       appearance: "error",
       icon: jsx(ErrorIcon, {
         label: "Error",
-        secondaryColor: `var(--ds-background-danger-bold, ${R400})`
+        color: "currentColor",
+        LEGACY_secondaryColor: `var(--ds-background-danger-bold, ${R400})`,
+        spacing: "spacious"
       }),
       id: "avatar-picker-error",
       key: "error",

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

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { Component } from 'react';
-import CrossIcon from '@atlaskit/icon/glyph/cross';
+import CrossIcon from '@atlaskit/icon/core/migration/close--cross';
 import { injectIntl } from 'react-intl-next';
 import { messages, MediaImage } from '@atlaskit/media-ui';
 import { isImageRemote } from './isImageRemote';
@@ -166,7 +166,8 @@ export class ImageCropper extends Component {
       }, /*#__PURE__*/React.createElement(IconButton, {
         id: "remove-image-button",
         icon: iconProps => /*#__PURE__*/React.createElement(CrossIcon, _extends({}, iconProps, {
-          size: "small"
+          LEGACY_size: "small",
+          color: "currentColor"
         })),
         onClick: onRemoveImage,
         label: formatMessage(messages.remove_image),

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

@@ -28,7 +28,9 @@ export class Slider extends Component {
       }, jsx(Button
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       , {
-        className: "zoom_button zoom_button_small",
+        className: "zoom_button zoom_button_small"
+        // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20874
+        ,
         iconAfter: jsx(ScaleSmallIcon, {
           label: "scale-small-icon"
         }),
@@ -39,7 +41,9 @@ export class Slider extends Component {
       }), jsx(Button
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       , {
-        className: "zoom_button zoom_button_large",
+        className: "zoom_button zoom_button_large"
+        // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20874
+        ,
         iconAfter: jsx(ScaleLargeIcon, {
           label: "scale-large-icon"
         }),

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

@@ -5,7 +5,7 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { AvatarList } from '../avatar-list';
-import EditorMoreIcon from '@atlaskit/icon/glyph/editor/more';
+import EditorMoreIcon from '@atlaskit/icon/core/migration/show-more-horizontal--editor-more';
 import Button from '@atlaskit/button/standard-button';
 import { predefinedAvatarsWrapperStyles } from './styles';
 import { useIntl } from 'react-intl-next';
@@ -37,7 +37,8 @@ export const PredefinedAvatarList = ({
       appearance: "subtle",
       iconAfter: jsx(EditorMoreIcon, {
         label: "",
-        size: "large"
+        LEGACY_size: "large",
+        color: "currentColor"
       }),
       onClick: onShowMore
     }))

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

@@ -7,7 +7,7 @@ import { jsx } from '@emotion/react';
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import { messages } from '@atlaskit/media-ui';
 import { largeAvatarImageStyles, predefinedAvatarViewWrapperStyles } from './styles';
-import ArrowLeftIcon from '@atlaskit/icon/glyph/arrow-left';
+import ArrowLeftIcon from '@atlaskit/icon/core/migration/arrow-left';
 import Button from '@atlaskit/button/standard-button';
 export const PredefinedAvatarView = ({
   avatars = [],
@@ -55,6 +55,7 @@ export const PredefinedAvatarView = ({
       ,
       className: "back-button",
       iconAfter: jsx(ArrowLeftIcon, {
+        color: "currentColor",
         label: ""
       }),
       onClick: onGoBack

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

@@ -6,7 +6,7 @@
 import { jsx } from '@emotion/react';
 import { useRef, useEffect } from 'react';
 import { R400 } from '@atlaskit/theme/colors';
-import ErrorIcon from '@atlaskit/icon/glyph/error';
+import ErrorIcon from '@atlaskit/icon/core/migration/error';
 import Flag from '@atlaskit/flag';
 import { messages } from '@atlaskit/media-ui';
 import { useIntl } from 'react-intl-next';
@@ -28,7 +28,9 @@ export var SubmitErrorDialog = function SubmitErrorDialog() {
       appearance: "error",
       icon: jsx(ErrorIcon, {
         label: "Error",
-        secondaryColor: "var(--ds-background-danger-bold, ".concat(R400, ")")
+        color: "currentColor",
+        LEGACY_secondaryColor: "var(--ds-background-danger-bold, ".concat(R400, ")"),
+        spacing: "spacious"
       }),
       id: "avatar-picker-error",
       key: "error",

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

@@ -10,7 +10,7 @@ function _createSuper(t) { var r = _isNativeReflectConstruct(); return function
 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 { Component } from 'react';
-import CrossIcon from '@atlaskit/icon/glyph/cross';
+import CrossIcon from '@atlaskit/icon/core/migration/close--cross';
 import { injectIntl } from 'react-intl-next';
 import { messages, MediaImage } from '@atlaskit/media-ui';
 import { isImageRemote } from './isImageRemote';
@@ -178,7 +178,8 @@ export var ImageCropper = /*#__PURE__*/function (_Component) {
           id: "remove-image-button",
           icon: function icon(iconProps) {
             return /*#__PURE__*/React.createElement(CrossIcon, _extends({}, iconProps, {
-              size: "small"
+              LEGACY_size: "small",
+              color: "currentColor"
             }));
           },
           onClick: onRemoveImage,

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

@@ -42,7 +42,9 @@ export var Slider = /*#__PURE__*/function (_Component) {
         }, jsx(Button
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         , {
-          className: "zoom_button zoom_button_small",
+          className: "zoom_button zoom_button_small"
+          // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20874
+          ,
           iconAfter: jsx(ScaleSmallIcon, {
             label: "scale-small-icon"
           }),
@@ -55,7 +57,9 @@ export var Slider = /*#__PURE__*/function (_Component) {
         }), jsx(Button
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         , {
-          className: "zoom_button zoom_button_large",
+          className: "zoom_button zoom_button_large"
+          // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20874
+          ,
           iconAfter: jsx(ScaleLargeIcon, {
             label: "scale-large-icon"
           }),

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

@@ -5,7 +5,7 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { AvatarList } from '../avatar-list';
-import EditorMoreIcon from '@atlaskit/icon/glyph/editor/more';
+import EditorMoreIcon from '@atlaskit/icon/core/migration/show-more-horizontal--editor-more';
 import Button from '@atlaskit/button/standard-button';
 import { predefinedAvatarsWrapperStyles } from './styles';
 import { useIntl } from 'react-intl-next';
@@ -37,7 +37,8 @@ export var PredefinedAvatarList = function PredefinedAvatarList(_ref) {
       appearance: "subtle",
       iconAfter: jsx(EditorMoreIcon, {
         label: "",
-        size: "large"
+        LEGACY_size: "large",
+        color: "currentColor"
       }),
       onClick: onShowMore
     }))

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

@@ -7,7 +7,7 @@ import { jsx } from '@emotion/react';
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import { messages } from '@atlaskit/media-ui';
 import { largeAvatarImageStyles, predefinedAvatarViewWrapperStyles } from './styles';
-import ArrowLeftIcon from '@atlaskit/icon/glyph/arrow-left';
+import ArrowLeftIcon from '@atlaskit/icon/core/migration/arrow-left';
 import Button from '@atlaskit/button/standard-button';
 export var PredefinedAvatarView = function PredefinedAvatarView(_ref) {
   var _ref$avatars = _ref.avatars,
@@ -55,6 +55,7 @@ export var PredefinedAvatarView = function PredefinedAvatarView(_ref) {
       ,
       className: "back-button",
       iconAfter: jsx(ArrowLeftIcon, {
+        color: "currentColor",
         label: ""
       }),
       onClick: onGoBack

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-avatar-picker",
-	"version": "24.8.0",
+	"version": "24.9.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/"
@@ -33,18 +33,18 @@
 		"runReact18": true
 	},
 	"dependencies": {
-		"@atlaskit/button": "^20.1.0",
+		"@atlaskit/button": "^20.2.0",
 		"@atlaskit/flag": "^15.8.0",
 		"@atlaskit/form": "^10.5.0",
 		"@atlaskit/icon": "^22.18.0",
-		"@atlaskit/media-ui": "^25.12.0",
-		"@atlaskit/modal-dialog": "^12.15.0",
-		"@atlaskit/primitives": "^12.1.0",
+		"@atlaskit/media-ui": "^25.15.0",
+		"@atlaskit/modal-dialog": "^12.17.0",
+		"@atlaskit/primitives": "^12.2.0",
 		"@atlaskit/range": "^7.4.0",
 		"@atlaskit/spinner": "^16.3.0",
 		"@atlaskit/textfield": "^6.5.0",
 		"@atlaskit/theme": "^13.0.0",
-		"@atlaskit/tokens": "^1.60.0",
+		"@atlaskit/tokens": "^2.0.0",
 		"@atlaskit/visually-hidden": "^1.5.0",
 		"@babel/runtime": "^7.0.0",
 		"exenv": "^1.2.2",
@@ -57,7 +57,7 @@
 	},
 	"devDependencies": {
 		"@atlaskit/media-core": "^34.3.0",
-		"@atlaskit/media-test-helpers": "^34.3.0",
+		"@atlaskit/media-test-helpers": "^34.4.0",
 		"@atlaskit/visual-regression": "*",
 		"@testing-library/react": "^12.1.5",
 		"@testing-library/user-event": "^14.4.3",