@atlaskit/media-viewer 48.9.0 → 48.10.1

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/media-viewer
 
+## 48.10.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 48.10.0
+
+### Minor Changes
+
+- [#141509](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/141509)
+  [`60385582ed07f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/60385582ed07f) -
+  [ux] Enable new icons behind a feature flag.
+
 ## 48.9.0
 
 ### Minor Changes

package/dist/cjs/analytics/index.js

@@ -10,7 +10,7 @@ exports.packageVersion = exports.packageName = void 0;
 var _analytics = require("@atlaskit/media-common/analytics");
 var componentName = exports.component = exports.componentName = 'mediaViewer';
 var packageName = exports.packageName = "@atlaskit/media-viewer";
-var packageVersion = exports.packageVersion = "48.9.0";
+var packageVersion = exports.packageVersion = "48.10.1";
 function getFileAttributes(fileState) {
   if (!fileState) {
     return {

package/dist/cjs/analytics/ufoExperiences.js

@@ -12,7 +12,7 @@ var _mediaCommon = require("@atlaskit/media-common");
 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; }
 var packageName = "@atlaskit/media-viewer";
-var packageVersion = "48.9.0";
+var packageVersion = "48.10.1";
 var ufoExperience;
 var getExperience = function getExperience() {
   if (!ufoExperience) {

package/dist/cjs/content.js

@@ -12,7 +12,7 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _react = _interopRequireWildcard(require("react"));
-var _cross = _interopRequireDefault(require("@atlaskit/icon/glyph/cross"));
+var _closeCross = _interopRequireDefault(require("@atlaskit/icon/core/migration/close--cross"));
 var _mediaUi = require("@atlaskit/media-ui");
 var _styleWrappers = require("./styleWrappers");
 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); }
@@ -49,7 +49,9 @@ var Content = exports.Content = /*#__PURE__*/function (_Component) {
         }, /*#__PURE__*/_react.default.createElement(_mediaUi.MediaButton, {
           testId: "media-viewer-close-button",
           onClick: onClose,
-          iconBefore: /*#__PURE__*/_react.default.createElement(_cross.default, {
+          iconBefore: /*#__PURE__*/_react.default.createElement(_closeCross.default, {
+            color: "currentColor",
+            spacing: "spacious",
             label: "Close"
           })
         })), children);

package/dist/cjs/download.js

@@ -10,7 +10,7 @@ exports.DownloadButton = DownloadButton;
 exports.createItemDownloader = exports.ToolbarDownloadButton = exports.ErrorViewDownloadButton = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _download = _interopRequireDefault(require("@atlaskit/icon/glyph/download"));
+var _download = _interopRequireDefault(require("@atlaskit/icon/core/migration/download"));
 var _mediaClient = require("@atlaskit/media-client");
 var _mediaUi = require("@atlaskit/media-ui");
 var _react = _interopRequireWildcard(require("react"));
@@ -23,6 +23,8 @@ var _excluded = ["analyticspayload", "onClick"];
 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); }
 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; }
 var downloadIcon = /*#__PURE__*/_react.default.createElement(_download.default, {
+  color: "currentColor",
+  spacing: "spacious",
   label: "Download"
 });
 function noop() {}

package/dist/cjs/navigation.js

@@ -92,7 +92,11 @@ var NavigationBase = exports.NavigationBase = /*#__PURE__*/function (_Component)
       }), /*#__PURE__*/_react.default.createElement(_standardButton.default, {
         testId: prevNavButtonId,
         onClick: prev('mouse'),
-        iconBefore: /*#__PURE__*/_react.default.createElement(_chevronLeftCircle.default
+        iconBefore:
+        /*#__PURE__*/
+        // TODO: https://product-fabric.atlassian.net/browse/DSP-20917
+        // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons
+        _react.default.createElement(_chevronLeftCircle.default
         // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
         , {
           primaryColor: "#9FADBC"
@@ -114,7 +118,11 @@ var NavigationBase = exports.NavigationBase = /*#__PURE__*/function (_Component)
       }), /*#__PURE__*/_react.default.createElement(_standardButton.default, {
         testId: nextNavButtonId,
         onClick: next('mouse'),
-        iconBefore: /*#__PURE__*/_react.default.createElement(_chevronRightCircle.default
+        iconBefore:
+        /*#__PURE__*/
+        // TODO: https://product-fabric.atlassian.net/browse/DSP-20917
+        // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons
+        _react.default.createElement(_chevronRightCircle.default
         // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
         , {
           primaryColor: "#9FADBC"

package/dist/cjs/styleWrappers.js

@@ -324,6 +324,7 @@ var defaultCoverWrapperStyles = (0, _react.css)({
   display: 'flex',
   alignItems: 'center',
   justifyContent: 'center',
+  color: "var(--ds-text, #9FADBC)",
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> *': {
     transform: 'scale(2)'

package/dist/cjs/viewers/archiveSidebar/archive-sidebar-folder-entry.js

@@ -17,7 +17,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _sideNavigation = require("@atlaskit/side-navigation");
 var _ = _interopRequireDefault(require("@atlaskit/icon-file-type/glyph/folder/24"));
-var _download = _interopRequireDefault(require("@atlaskit/icon/glyph/download"));
+var _download = _interopRequireDefault(require("@atlaskit/icon/core/migration/download"));
 var _mediaCommon = require("@atlaskit/media-common");
 var _mediaTypeIcon = require("@atlaskit/media-ui/media-type-icon");
 var _styleWrappers = require("./styleWrappers");
@@ -72,6 +72,8 @@ var ArchiveSidebarFolderEntry = exports.ArchiveSidebarFolderEntry = /*#__PURE__*
           return _this.downloadZipEntry(entry, root);
         }
       }, /*#__PURE__*/_react.default.createElement(_download.default, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Download"
       }));
     });

package/dist/cjs/viewers/archiveSidebar/archive-sidebar-header.js

@@ -13,9 +13,9 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
-var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/glyph/arrow-left"));
+var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/core/migration/arrow-left"));
 var _sideNavigation = require("@atlaskit/side-navigation");
-var _home = _interopRequireDefault(require("@atlaskit/icon/glyph/home"));
+var _home = _interopRequireDefault(require("@atlaskit/icon/core/migration/home"));
 var _utils = require("../../utils");
 var _styleWrappers = require("./styleWrappers");
 var _styles = require("./styles");
@@ -33,8 +33,12 @@ var ArchiveSidebarHeader = exports.ArchiveSidebarHeader = /*#__PURE__*/function
     _this = _super.call.apply(_super, [this].concat(args));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getHeaderIcon", function () {
       return !!_this.props.folderName ? /*#__PURE__*/_react.default.createElement(_arrowLeft.default, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Back"
       }) : /*#__PURE__*/_react.default.createElement(_home.default, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Home"
       });
     });

package/dist/cjs/viewers/archiveSidebar/archive.js

@@ -21,12 +21,11 @@ var _mediaUi = require("@atlaskit/media-ui");
 var _codeViewer = require("@atlaskit/media-ui/codeViewer");
 var _domain = require("../../domain");
 var _styleWrappers = require("../../styleWrappers");
-var _audio = _interopRequireDefault(require("@atlaskit/icon/glyph/media-services/audio"));
+var _audioMediaServicesAudio = _interopRequireDefault(require("@atlaskit/icon/core/migration/audio--media-services-audio"));
 var _errorMessage = _interopRequireDefault(require("../../errorMessage"));
 var _baseViewer = require("../base-viewer");
 var _interactiveImg = require("../image/interactive-img");
 var _pdfRenderer = require("../doc/pdfRenderer");
-var _styles = require("../../styles");
 var _styleWrappers2 = require("./styleWrappers");
 var _archiveSidebarRenderer = _interopRequireDefault(require("./archive-sidebar-renderer"));
 var _utils = require("../../utils");
@@ -296,13 +295,16 @@ var ArchiveViewerBase = exports.ArchiveViewerBase = /*#__PURE__*/function (_Base
           case 'audio':
             return /*#__PURE__*/_react.default.createElement(_styleWrappers2.ArchiveItemViewerWrapper, null, /*#__PURE__*/_react.default.createElement(_styleWrappers.AudioPlayer, {
               "data-testid": "media-viewer-audio-content"
-            }, /*#__PURE__*/_react.default.createElement(_styleWrappers.DefaultCoverWrapper, null, /*#__PURE__*/_react.default.createElement(_audio.default, {
+            }, /*#__PURE__*/_react.default.createElement(_styleWrappers.DefaultCoverWrapper, null, /*#__PURE__*/_react.default.createElement(_audioMediaServicesAudio.default, {
               label: "cover",
-              size: "xlarge",
-              primaryColor: _styles.blanketColor
+              LEGACY_size: "xlarge",
+              color: "currentColor"
               // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
               ,
-              secondaryColor: "#9FADBC"
+              LEGACY_primaryColor: "#22272B"
+              // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+              ,
+              LEGACY_secondaryColor: "#9FADBC"
             })), /*#__PURE__*/_react.default.createElement(_styleWrappers.CustomAudioPlayerWrapper, null, /*#__PURE__*/_react.default.createElement(_mediaUi.CustomMediaPlayer, {
               type: "audio",
               isAutoPlay: false,

package/dist/cjs/viewers/audio.js

@@ -16,7 +16,7 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _mediaClient = require("@atlaskit/media-client");
-var _audio = _interopRequireDefault(require("@atlaskit/icon/glyph/media-services/audio"));
+var _audioMediaServicesAudio = _interopRequireDefault(require("@atlaskit/icon/core/migration/audio--media-services-audio"));
 var _domain = require("../domain");
 var _errors = require("../errors");
 var _styleWrappers = require("../styleWrappers");
@@ -24,16 +24,18 @@ var _baseViewer = require("./base-viewer");
 var _isIE = require("../utils/isIE");
 var _mediaUi = require("@atlaskit/media-ui");
 var _getObjectUrlFromFileState = require("../utils/getObjectUrlFromFileState");
-var _styles = require("../styles");
 function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-var defaultCover = /*#__PURE__*/_react.default.createElement(_styleWrappers.DefaultCoverWrapper, null, /*#__PURE__*/_react.default.createElement(_audio.default, {
+var defaultCover = /*#__PURE__*/_react.default.createElement(_styleWrappers.DefaultCoverWrapper, null, /*#__PURE__*/_react.default.createElement(_audioMediaServicesAudio.default, {
   label: "cover",
-  size: "xlarge",
-  primaryColor: _styles.blanketColor
+  LEGACY_size: "xlarge",
+  color: "currentColor"
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   ,
-  secondaryColor: "#9FADBC"
+  LEGACY_primaryColor: "#22272B"
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  ,
+  LEGACY_secondaryColor: "#9FADBC"
 }));
 var getCoverUrl = function getCoverUrl(item, mediaClient, collectionName) {
   return mediaClient.getImageUrl(item.id, {

package/dist/cjs/viewers/doc/pdfPasswordInput.js

@@ -11,13 +11,13 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("react");
 var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
-var _lock = _interopRequireDefault(require("@atlaskit/icon/glyph/lock"));
+var _lockLockedLock = _interopRequireDefault(require("@atlaskit/icon/core/migration/lock-locked--lock"));
 var _form = _interopRequireWildcard(require("@atlaskit/form"));
 var _reactIntlNext = require("react-intl-next");
 var _mediaUi = require("@atlaskit/media-ui");
 var _primitives = require("@atlaskit/primitives");
 var _react2 = require("@emotion/react");
-var _error = _interopRequireDefault(require("@atlaskit/icon/glyph/error"));
+var _error = _interopRequireDefault(require("@atlaskit/icon/utility/migration/error"));
 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); }
 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; }
 /**
@@ -39,7 +39,8 @@ var errorMessageWrapperStyle = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   color: '#FD9891',
   font: "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)",
-  display: 'flex'
+  display: 'flex',
+  alignItems: 'center'
 });
 var errorMessageStyle = (0, _react2.css)({
   marginTop: '0px',
@@ -87,10 +88,10 @@ var PDFPasswordInput = exports.PDFPasswordInput = function PDFPasswordInput(_ref
       submitting = _ref2.submitting;
     return (0, _react2.jsx)("form", formProps, (0, _react2.jsx)(_primitives.Flex, {
       justifyContent: "center"
-    }, (0, _react2.jsx)(_lock.default, {
+    }, (0, _react2.jsx)(_lockLockedLock.default, {
       label: "",
-      size: "xlarge",
-      primaryColor: COLOR_SHADE
+      LEGACY_size: "xlarge",
+      color: COLOR_SHADE
     })), (0, _react2.jsx)(_primitives.Box, {
       xcss: headerStyles
     }, (0, _react2.jsx)("h1", {
@@ -117,7 +118,8 @@ var PDFPasswordInput = exports.PDFPasswordInput = function PDFPasswordInput(_ref
         css: errorMessageWrapperStyle,
         id: "".concat(fieldProps.id, "-error")
       }, (0, _react2.jsx)(_error.default, {
-        size: "small",
+        color: "currentColor",
+        LEGACY_size: "small",
         label: ""
       }), (0, _react2.jsx)("p", {
         css: errorMessageStyle

package/dist/cjs/zoomControls.js

@@ -15,8 +15,8 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _mediaUi = require("@atlaskit/media-ui");
-var _zoomOut = _interopRequireDefault(require("@atlaskit/icon/glyph/media-services/zoom-out"));
-var _zoomIn = _interopRequireDefault(require("@atlaskit/icon/glyph/media-services/zoom-in"));
+var _zoomOutMediaServicesZoomOut = _interopRequireDefault(require("@atlaskit/icon/core/migration/zoom-out--media-services-zoom-out"));
+var _zoomInMediaServicesZoomIn = _interopRequireDefault(require("@atlaskit/icon/core/migration/zoom-in--media-services-zoom-in"));
 var _styleWrappers = require("./styleWrappers");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _analytics = require("./analytics/");
@@ -76,13 +76,17 @@ var ZoomControlsBase = exports.ZoomControlsBase = /*#__PURE__*/function (_Compon
         }, /*#__PURE__*/_react.default.createElement(_styleWrappers.ZoomCenterControls, null, /*#__PURE__*/_react.default.createElement(_mediaUi.MediaButton, {
           isDisabled: !zoomLevel.canZoomOut,
           onClick: this.zoomOut,
-          iconBefore: /*#__PURE__*/_react.default.createElement(_zoomOut.default, {
+          iconBefore: /*#__PURE__*/_react.default.createElement(_zoomOutMediaServicesZoomOut.default, {
+            color: "currentColor",
+            spacing: "spacious",
             label: formatMessage(_mediaUi.messages.zoom_out)
           })
         }), /*#__PURE__*/_react.default.createElement(_mediaUi.MediaButton, {
           isDisabled: !zoomLevel.canZoomIn,
           onClick: this.zoomIn,
-          iconBefore: /*#__PURE__*/_react.default.createElement(_zoomIn.default, {
+          iconBefore: /*#__PURE__*/_react.default.createElement(_zoomInMediaServicesZoomIn.default, {
+            color: "currentColor",
+            spacing: "spacious",
             label: formatMessage(_mediaUi.messages.zoom_in)
           })
         })), /*#__PURE__*/_react.default.createElement(_styleWrappers.ZoomRightControls, null, children, /*#__PURE__*/_react.default.createElement(_styleWrappers.ZoomLevelIndicator, null, zoomLevel.asPercentage)))

package/dist/es2019/analytics/index.js

@@ -1,7 +1,7 @@
 import { ANALYTICS_MEDIA_CHANNEL, sanitiseAnalyticsPayload } from '@atlaskit/media-common/analytics';
 const componentName = 'mediaViewer';
 const packageName = "@atlaskit/media-viewer";
-const packageVersion = "48.9.0";
+const packageVersion = "48.10.1";
 export { packageName, packageVersion, componentName, componentName as component };
 export function getFileAttributes(fileState) {
   if (!fileState) {

package/dist/es2019/analytics/ufoExperiences.js

@@ -2,7 +2,7 @@ import { UFOExperience, ExperiencePerformanceTypes, ExperienceTypes } from '@atl
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 const packageName = "@atlaskit/media-viewer";
-const packageVersion = "48.9.0";
+const packageVersion = "48.10.1";
 let ufoExperience;
 const getExperience = () => {
   if (!ufoExperience) {

package/dist/es2019/content.js

@@ -1,6 +1,6 @@
 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 { MediaButton, hideControlsClassName, InactivityDetector } from '@atlaskit/media-ui';
 import { CloseButtonWrapper, ContentWrapper } from './styleWrappers';
 export class Content extends Component {
@@ -25,6 +25,8 @@ export class Content extends Component {
         testId: "media-viewer-close-button",
         onClick: onClose,
         iconBefore: /*#__PURE__*/React.createElement(CrossIcon, {
+          color: "currentColor",
+          spacing: "spacious",
           label: "Close"
         })
       })), children);

package/dist/es2019/download.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
-import DownloadIcon from '@atlaskit/icon/glyph/download';
+import DownloadIcon from '@atlaskit/icon/core/migration/download';
 import { isErrorFileState, isExternalImageIdentifier } from '@atlaskit/media-client';
 import { MediaButton, messages } from '@atlaskit/media-ui';
 import React, { useCallback } from 'react';
@@ -9,6 +9,8 @@ import { createDownloadButtonClickedEvent } from './analytics/events/ui/download
 import { createFailedPreviewDownloadButtonClickedEvent } from './analytics/events/ui/failedPreviewDownloadButtonClicked';
 import { DownloadButtonWrapper } from './styleWrappers';
 const downloadIcon = /*#__PURE__*/React.createElement(DownloadIcon, {
+  color: "currentColor",
+  spacing: "spacious",
   label: "Download"
 });
 function noop() {}

package/dist/es2019/navigation.js

@@ -67,7 +67,11 @@ export class NavigationBase extends Component {
     }), /*#__PURE__*/React.createElement(Button, {
       testId: prevNavButtonId,
       onClick: prev('mouse'),
-      iconBefore: /*#__PURE__*/React.createElement(ArrowLeftCircleIcon
+      iconBefore:
+      /*#__PURE__*/
+      // TODO: https://product-fabric.atlassian.net/browse/DSP-20917
+      // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons
+      React.createElement(ArrowLeftCircleIcon
       // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
       , {
         primaryColor: "#9FADBC"
@@ -89,7 +93,11 @@ export class NavigationBase extends Component {
     }), /*#__PURE__*/React.createElement(Button, {
       testId: nextNavButtonId,
       onClick: next('mouse'),
-      iconBefore: /*#__PURE__*/React.createElement(ArrowRightCircleIcon
+      iconBefore:
+      /*#__PURE__*/
+      // TODO: https://product-fabric.atlassian.net/browse/DSP-20917
+      // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons
+      React.createElement(ArrowRightCircleIcon
       // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
       , {
         primaryColor: "#9FADBC"

package/dist/es2019/styleWrappers.js

@@ -319,6 +319,7 @@ const defaultCoverWrapperStyles = css({
   display: 'flex',
   alignItems: 'center',
   justifyContent: 'center',
+  color: "var(--ds-text, #9FADBC)",
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> *': {
     transform: 'scale(2)'

package/dist/es2019/viewers/archiveSidebar/archive-sidebar-folder-entry.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { ButtonItem } from '@atlaskit/side-navigation';
 import Folder24Icon from '@atlaskit/icon-file-type/glyph/folder/24';
-import DownloadIcon from '@atlaskit/icon/glyph/download';
+import DownloadIcon from '@atlaskit/icon/core/migration/download';
 import { downloadUrl } from '@atlaskit/media-common';
 import { MediaTypeIcon } from '@atlaskit/media-ui/media-type-icon';
 import { ArchiveSidebarFolderWrapper, ArchiveSidebarFileEntryWrapper, ArchiveDownloadButtonWrapper, SidebarItemWrapper } from './styleWrappers';
@@ -43,6 +43,8 @@ export class ArchiveSidebarFolderEntry extends React.Component {
       return /*#__PURE__*/React.createElement(ArchiveDownloadButtonWrapper, {
         onClick: () => this.downloadZipEntry(entry, root)
       }, /*#__PURE__*/React.createElement(DownloadIcon, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Download"
       }));
     });

package/dist/es2019/viewers/archiveSidebar/archive-sidebar-header.js

@@ -1,8 +1,8 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import ArrowLeftIcon from '@atlaskit/icon/glyph/arrow-left';
+import ArrowLeftIcon from '@atlaskit/icon/core/migration/arrow-left';
 import { ButtonItem } from '@atlaskit/side-navigation';
-import HomeIcon from '@atlaskit/icon/glyph/home';
+import HomeIcon from '@atlaskit/icon/core/migration/home';
 import { getFormattedFolderName } from '../../utils';
 import { SidebarHeaderEntry, SidebarHeaderIcon, SidebarHeaderWrapper } from './styleWrappers';
 import { itemStyle } from './styles';
@@ -10,8 +10,12 @@ export class ArchiveSidebarHeader extends React.Component {
   constructor(...args) {
     super(...args);
     _defineProperty(this, "getHeaderIcon", () => !!this.props.folderName ? /*#__PURE__*/React.createElement(ArrowLeftIcon, {
+      color: "currentColor",
+      spacing: "spacious",
       label: "Back"
     }) : /*#__PURE__*/React.createElement(HomeIcon, {
+      color: "currentColor",
+      spacing: "spacious",
       label: "Home"
     }));
   }

package/dist/es2019/viewers/archiveSidebar/archive.js

@@ -7,12 +7,11 @@ import { CustomMediaPlayer, messages } from '@atlaskit/media-ui';
 import { getLanguageType, isCodeViewerItem } from '@atlaskit/media-ui/codeViewer';
 import { Outcome } from '../../domain';
 import { CustomVideoPlayerWrapper, AudioPlayer, CustomAudioPlayerWrapper, DefaultCoverWrapper, ListWrapper } from '../../styleWrappers';
-import AudioIcon from '@atlaskit/icon/glyph/media-services/audio';
+import AudioIcon from '@atlaskit/icon/core/migration/audio--media-services-audio';
 import ErrorMessage from '../../errorMessage';
 import { BaseViewer } from '../base-viewer';
 import { InteractiveImg } from '../image/interactive-img';
 import { PDFRenderer } from '../doc/pdfRenderer';
-import { blanketColor } from '../../styles';
 import { ArchiveItemViewerWrapper, ArchiveLayout, ArchiveViewerWrapper } from './styleWrappers';
 import ArchiveSidebarRenderer from './archive-sidebar-renderer';
 import { getMediaTypeFromFilename, getMimeTypeFromFilename, rejectAfter } from '../../utils';
@@ -202,11 +201,14 @@ export class ArchiveViewerBase extends BaseViewer {
             "data-testid": "media-viewer-audio-content"
           }, /*#__PURE__*/React.createElement(DefaultCoverWrapper, null, /*#__PURE__*/React.createElement(AudioIcon, {
             label: "cover",
-            size: "xlarge",
-            primaryColor: blanketColor
+            LEGACY_size: "xlarge",
+            color: "currentColor"
             // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
             ,
-            secondaryColor: "#9FADBC"
+            LEGACY_primaryColor: "#22272B"
+            // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+            ,
+            LEGACY_secondaryColor: "#9FADBC"
           })), /*#__PURE__*/React.createElement(CustomAudioPlayerWrapper, null, /*#__PURE__*/React.createElement(CustomMediaPlayer, {
             type: "audio",
             isAutoPlay: false,

package/dist/es2019/viewers/audio.js

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { globalMediaEventEmitter } from '@atlaskit/media-client';
-import AudioIcon from '@atlaskit/icon/glyph/media-services/audio';
+import AudioIcon from '@atlaskit/icon/core/migration/audio--media-services-audio';
 import { Outcome } from '../domain';
 import { MediaViewerError } from '../errors';
 import { AudioPlayer, AudioCover, Audio, DefaultCoverWrapper, CustomAudioPlayerWrapper } from '../styleWrappers';
@@ -9,14 +9,16 @@ import { BaseViewer } from './base-viewer';
 import { isIE } from '../utils/isIE';
 import { CustomMediaPlayer } from '@atlaskit/media-ui';
 import { getObjectUrlFromFileState } from '../utils/getObjectUrlFromFileState';
-import { blanketColor } from '../styles';
 const defaultCover = /*#__PURE__*/React.createElement(DefaultCoverWrapper, null, /*#__PURE__*/React.createElement(AudioIcon, {
   label: "cover",
-  size: "xlarge",
-  primaryColor: blanketColor
+  LEGACY_size: "xlarge",
+  color: "currentColor"
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   ,
-  secondaryColor: "#9FADBC"
+  LEGACY_primaryColor: "#22272B"
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  ,
+  LEGACY_secondaryColor: "#9FADBC"
 }));
 const getCoverUrl = (item, mediaClient, collectionName) => mediaClient.getImageUrl(item.id, {
   collection: collectionName

package/dist/es2019/viewers/doc/pdfPasswordInput.js

@@ -6,14 +6,14 @@ import _extends from "@babel/runtime/helpers/extends";
 import { useEffect, useRef, useState } from 'react';
 import Button from '@atlaskit/button/new';
 import TextField from '@atlaskit/textfield';
-import LockIcon from '@atlaskit/icon/glyph/lock';
+import LockIcon from '@atlaskit/icon/core/migration/lock-locked--lock';
 import Form, { Field } from '@atlaskit/form';
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import { messages } from '@atlaskit/media-ui';
 import { xcss, Box, Flex } from '@atlaskit/primitives';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx, css } from '@emotion/react';
-import ErrorIcon from '@atlaskit/icon/glyph/error';
+import ErrorIcon from '@atlaskit/icon/utility/migration/error';
 const COLOR_SHADE = '#b6c2cf';
 const headingStyle = css({
   font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
@@ -26,7 +26,8 @@ const errorMessageWrapperStyle = css({
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   color: '#FD9891',
   font: "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)",
-  display: 'flex'
+  display: 'flex',
+  alignItems: 'center'
 });
 const errorMessageStyle = css({
   marginTop: '0px',
@@ -74,8 +75,8 @@ export const PDFPasswordInput = ({
     justifyContent: "center"
   }, jsx(LockIcon, {
     label: "",
-    size: "xlarge",
-    primaryColor: COLOR_SHADE
+    LEGACY_size: "xlarge",
+    color: COLOR_SHADE
   })), jsx(Box, {
     xcss: headerStyles
   }, jsx("h1", {
@@ -102,7 +103,8 @@ export const PDFPasswordInput = ({
     css: errorMessageWrapperStyle,
     id: `${fieldProps.id}-error`
   }, jsx(ErrorIcon, {
-    size: "small",
+    color: "currentColor",
+    LEGACY_size: "small",
     label: ""
   }), jsx("p", {
     css: errorMessageStyle

package/dist/es2019/zoomControls.js

@@ -2,8 +2,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { Component } from 'react';
 import { hideControlsClassName, MediaButton } from '@atlaskit/media-ui';
-import ZoomOutIcon from '@atlaskit/icon/glyph/media-services/zoom-out';
-import ZoomInIcon from '@atlaskit/icon/glyph/media-services/zoom-in';
+import ZoomOutIcon from '@atlaskit/icon/core/migration/zoom-out--media-services-zoom-out';
+import ZoomInIcon from '@atlaskit/icon/core/migration/zoom-in--media-services-zoom-in';
 import { ZoomWrapper, ZoomCenterControls, ZoomRightControls, ZoomLevelIndicator } from './styleWrappers';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { fireAnalytics } from './analytics/';
@@ -56,12 +56,16 @@ export class ZoomControlsBase extends Component {
         isDisabled: !zoomLevel.canZoomOut,
         onClick: this.zoomOut,
         iconBefore: /*#__PURE__*/React.createElement(ZoomOutIcon, {
+          color: "currentColor",
+          spacing: "spacious",
           label: formatMessage(messages.zoom_out)
         })
       }), /*#__PURE__*/React.createElement(MediaButton, {
         isDisabled: !zoomLevel.canZoomIn,
         onClick: this.zoomIn,
         iconBefore: /*#__PURE__*/React.createElement(ZoomInIcon, {
+          color: "currentColor",
+          spacing: "spacious",
           label: formatMessage(messages.zoom_in)
         })
       })), /*#__PURE__*/React.createElement(ZoomRightControls, null, children, /*#__PURE__*/React.createElement(ZoomLevelIndicator, null, zoomLevel.asPercentage)))

package/dist/esm/analytics/index.js

@@ -1,7 +1,7 @@
 import { ANALYTICS_MEDIA_CHANNEL, sanitiseAnalyticsPayload } from '@atlaskit/media-common/analytics';
 var componentName = 'mediaViewer';
 var packageName = "@atlaskit/media-viewer";
-var packageVersion = "48.9.0";
+var packageVersion = "48.10.1";
 export { packageName, packageVersion, componentName, componentName as component };
 export function getFileAttributes(fileState) {
   if (!fileState) {

package/dist/esm/analytics/ufoExperiences.js

@@ -5,7 +5,7 @@ import { UFOExperience, ExperiencePerformanceTypes, ExperienceTypes } from '@atl
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 import { getFeatureFlagKeysAllProducts } from '@atlaskit/media-common';
 var packageName = "@atlaskit/media-viewer";
-var packageVersion = "48.9.0";
+var packageVersion = "48.10.1";
 var ufoExperience;
 var getExperience = function getExperience() {
   if (!ufoExperience) {

package/dist/esm/content.js

@@ -7,7 +7,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 { MediaButton, hideControlsClassName, InactivityDetector } from '@atlaskit/media-ui';
 import { CloseButtonWrapper, ContentWrapper } from './styleWrappers';
 export var Content = /*#__PURE__*/function (_Component) {
@@ -41,6 +41,8 @@ export var Content = /*#__PURE__*/function (_Component) {
           testId: "media-viewer-close-button",
           onClick: onClose,
           iconBefore: /*#__PURE__*/React.createElement(CrossIcon, {
+            color: "currentColor",
+            spacing: "spacious",
             label: "Close"
           })
         })), children);

package/dist/esm/download.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["analyticspayload", "onClick"];
-import DownloadIcon from '@atlaskit/icon/glyph/download';
+import DownloadIcon from '@atlaskit/icon/core/migration/download';
 import { isErrorFileState, isExternalImageIdentifier } from '@atlaskit/media-client';
 import { MediaButton, messages } from '@atlaskit/media-ui';
 import React, { useCallback } from 'react';
@@ -11,6 +11,8 @@ import { createDownloadButtonClickedEvent } from './analytics/events/ui/download
 import { createFailedPreviewDownloadButtonClickedEvent } from './analytics/events/ui/failedPreviewDownloadButtonClicked';
 import { DownloadButtonWrapper } from './styleWrappers';
 var downloadIcon = /*#__PURE__*/React.createElement(DownloadIcon, {
+  color: "currentColor",
+  spacing: "spacious",
   label: "Download"
 });
 function noop() {}

package/dist/esm/navigation.js

@@ -85,7 +85,11 @@ export var NavigationBase = /*#__PURE__*/function (_Component) {
       }), /*#__PURE__*/React.createElement(Button, {
         testId: prevNavButtonId,
         onClick: prev('mouse'),
-        iconBefore: /*#__PURE__*/React.createElement(ArrowLeftCircleIcon
+        iconBefore:
+        /*#__PURE__*/
+        // TODO: https://product-fabric.atlassian.net/browse/DSP-20917
+        // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons
+        React.createElement(ArrowLeftCircleIcon
         // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
         , {
           primaryColor: "#9FADBC"
@@ -107,7 +111,11 @@ export var NavigationBase = /*#__PURE__*/function (_Component) {
       }), /*#__PURE__*/React.createElement(Button, {
         testId: nextNavButtonId,
         onClick: next('mouse'),
-        iconBefore: /*#__PURE__*/React.createElement(ArrowRightCircleIcon
+        iconBefore:
+        /*#__PURE__*/
+        // TODO: https://product-fabric.atlassian.net/browse/DSP-20917
+        // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons
+        React.createElement(ArrowRightCircleIcon
         // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
         , {
           primaryColor: "#9FADBC"

package/dist/esm/styleWrappers.js

@@ -316,6 +316,7 @@ var defaultCoverWrapperStyles = css({
   display: 'flex',
   alignItems: 'center',
   justifyContent: 'center',
+  color: "var(--ds-text, #9FADBC)",
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> *': {
     transform: 'scale(2)'

package/dist/esm/viewers/archiveSidebar/archive-sidebar-folder-entry.js

@@ -12,7 +12,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import React from 'react';
 import { ButtonItem } from '@atlaskit/side-navigation';
 import Folder24Icon from '@atlaskit/icon-file-type/glyph/folder/24';
-import DownloadIcon from '@atlaskit/icon/glyph/download';
+import DownloadIcon from '@atlaskit/icon/core/migration/download';
 import { downloadUrl } from '@atlaskit/media-common';
 import { MediaTypeIcon } from '@atlaskit/media-ui/media-type-icon';
 import { ArchiveSidebarFolderWrapper, ArchiveSidebarFileEntryWrapper, ArchiveDownloadButtonWrapper, SidebarItemWrapper } from './styleWrappers';
@@ -65,6 +65,8 @@ export var ArchiveSidebarFolderEntry = /*#__PURE__*/function (_React$Component)
           return _this.downloadZipEntry(entry, root);
         }
       }, /*#__PURE__*/React.createElement(DownloadIcon, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Download"
       }));
     });

package/dist/esm/viewers/archiveSidebar/archive-sidebar-header.js

@@ -8,9 +8,9 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, 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 ArrowLeftIcon from '@atlaskit/icon/glyph/arrow-left';
+import ArrowLeftIcon from '@atlaskit/icon/core/migration/arrow-left';
 import { ButtonItem } from '@atlaskit/side-navigation';
-import HomeIcon from '@atlaskit/icon/glyph/home';
+import HomeIcon from '@atlaskit/icon/core/migration/home';
 import { getFormattedFolderName } from '../../utils';
 import { SidebarHeaderEntry, SidebarHeaderIcon, SidebarHeaderWrapper } from './styleWrappers';
 import { itemStyle } from './styles';
@@ -26,8 +26,12 @@ export var ArchiveSidebarHeader = /*#__PURE__*/function (_React$Component) {
     _this = _super.call.apply(_super, [this].concat(args));
     _defineProperty(_assertThisInitialized(_this), "getHeaderIcon", function () {
       return !!_this.props.folderName ? /*#__PURE__*/React.createElement(ArrowLeftIcon, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Back"
       }) : /*#__PURE__*/React.createElement(HomeIcon, {
+        color: "currentColor",
+        spacing: "spacious",
         label: "Home"
       });
     });

package/dist/esm/viewers/archiveSidebar/archive.js

@@ -19,12 +19,11 @@ import { CustomMediaPlayer, messages } from '@atlaskit/media-ui';
 import { getLanguageType, isCodeViewerItem } from '@atlaskit/media-ui/codeViewer';
 import { Outcome } from '../../domain';
 import { CustomVideoPlayerWrapper, AudioPlayer, CustomAudioPlayerWrapper, DefaultCoverWrapper, ListWrapper } from '../../styleWrappers';
-import AudioIcon from '@atlaskit/icon/glyph/media-services/audio';
+import AudioIcon from '@atlaskit/icon/core/migration/audio--media-services-audio';
 import ErrorMessage from '../../errorMessage';
 import { BaseViewer } from '../base-viewer';
 import { InteractiveImg } from '../image/interactive-img';
 import { PDFRenderer } from '../doc/pdfRenderer';
-import { blanketColor } from '../../styles';
 import { ArchiveItemViewerWrapper, ArchiveLayout, ArchiveViewerWrapper } from './styleWrappers';
 import ArchiveSidebarRenderer from './archive-sidebar-renderer';
 import { getMediaTypeFromFilename, getMimeTypeFromFilename, rejectAfter } from '../../utils';
@@ -292,11 +291,14 @@ export var ArchiveViewerBase = /*#__PURE__*/function (_BaseViewer) {
               "data-testid": "media-viewer-audio-content"
             }, /*#__PURE__*/React.createElement(DefaultCoverWrapper, null, /*#__PURE__*/React.createElement(AudioIcon, {
               label: "cover",
-              size: "xlarge",
-              primaryColor: blanketColor
+              LEGACY_size: "xlarge",
+              color: "currentColor"
               // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
               ,
-              secondaryColor: "#9FADBC"
+              LEGACY_primaryColor: "#22272B"
+              // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+              ,
+              LEGACY_secondaryColor: "#9FADBC"
             })), /*#__PURE__*/React.createElement(CustomAudioPlayerWrapper, null, /*#__PURE__*/React.createElement(CustomMediaPlayer, {
               type: "audio",
               isAutoPlay: false,

package/dist/esm/viewers/audio.js

@@ -11,7 +11,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 { globalMediaEventEmitter } from '@atlaskit/media-client';
-import AudioIcon from '@atlaskit/icon/glyph/media-services/audio';
+import AudioIcon from '@atlaskit/icon/core/migration/audio--media-services-audio';
 import { Outcome } from '../domain';
 import { MediaViewerError } from '../errors';
 import { AudioPlayer, AudioCover, Audio, DefaultCoverWrapper, CustomAudioPlayerWrapper } from '../styleWrappers';
@@ -19,14 +19,16 @@ import { BaseViewer } from './base-viewer';
 import { isIE } from '../utils/isIE';
 import { CustomMediaPlayer } from '@atlaskit/media-ui';
 import { getObjectUrlFromFileState } from '../utils/getObjectUrlFromFileState';
-import { blanketColor } from '../styles';
 var defaultCover = /*#__PURE__*/React.createElement(DefaultCoverWrapper, null, /*#__PURE__*/React.createElement(AudioIcon, {
   label: "cover",
-  size: "xlarge",
-  primaryColor: blanketColor
+  LEGACY_size: "xlarge",
+  color: "currentColor"
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   ,
-  secondaryColor: "#9FADBC"
+  LEGACY_primaryColor: "#22272B"
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  ,
+  LEGACY_secondaryColor: "#9FADBC"
 }));
 var getCoverUrl = function getCoverUrl(item, mediaClient, collectionName) {
   return mediaClient.getImageUrl(item.id, {

package/dist/esm/viewers/doc/pdfPasswordInput.js

@@ -7,14 +7,14 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useEffect, useRef, useState } from 'react';
 import Button from '@atlaskit/button/new';
 import TextField from '@atlaskit/textfield';
-import LockIcon from '@atlaskit/icon/glyph/lock';
+import LockIcon from '@atlaskit/icon/core/migration/lock-locked--lock';
 import Form, { Field } from '@atlaskit/form';
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import { messages } from '@atlaskit/media-ui';
 import { xcss, Box, Flex } from '@atlaskit/primitives';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx, css } from '@emotion/react';
-import ErrorIcon from '@atlaskit/icon/glyph/error';
+import ErrorIcon from '@atlaskit/icon/utility/migration/error';
 var COLOR_SHADE = '#b6c2cf';
 var headingStyle = css({
   font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
@@ -27,7 +27,8 @@ var errorMessageWrapperStyle = css({
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   color: '#FD9891',
   font: "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)",
-  display: 'flex'
+  display: 'flex',
+  alignItems: 'center'
 });
 var errorMessageStyle = css({
   marginTop: '0px',
@@ -77,8 +78,8 @@ export var PDFPasswordInput = function PDFPasswordInput(_ref) {
       justifyContent: "center"
     }, jsx(LockIcon, {
       label: "",
-      size: "xlarge",
-      primaryColor: COLOR_SHADE
+      LEGACY_size: "xlarge",
+      color: COLOR_SHADE
     })), jsx(Box, {
       xcss: headerStyles
     }, jsx("h1", {
@@ -105,7 +106,8 @@ export var PDFPasswordInput = function PDFPasswordInput(_ref) {
         css: errorMessageWrapperStyle,
         id: "".concat(fieldProps.id, "-error")
       }, jsx(ErrorIcon, {
-        size: "small",
+        color: "currentColor",
+        LEGACY_size: "small",
         label: ""
       }), jsx("p", {
         css: errorMessageStyle

package/dist/esm/zoomControls.js

@@ -10,8 +10,8 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import React from 'react';
 import { Component } from 'react';
 import { hideControlsClassName, MediaButton } from '@atlaskit/media-ui';
-import ZoomOutIcon from '@atlaskit/icon/glyph/media-services/zoom-out';
-import ZoomInIcon from '@atlaskit/icon/glyph/media-services/zoom-in';
+import ZoomOutIcon from '@atlaskit/icon/core/migration/zoom-out--media-services-zoom-out';
+import ZoomInIcon from '@atlaskit/icon/core/migration/zoom-in--media-services-zoom-in';
 import { ZoomWrapper, ZoomCenterControls, ZoomRightControls, ZoomLevelIndicator } from './styleWrappers';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { fireAnalytics } from './analytics/';
@@ -69,12 +69,16 @@ export var ZoomControlsBase = /*#__PURE__*/function (_Component) {
           isDisabled: !zoomLevel.canZoomOut,
           onClick: this.zoomOut,
           iconBefore: /*#__PURE__*/React.createElement(ZoomOutIcon, {
+            color: "currentColor",
+            spacing: "spacious",
             label: formatMessage(messages.zoom_out)
           })
         }), /*#__PURE__*/React.createElement(MediaButton, {
           isDisabled: !zoomLevel.canZoomIn,
           onClick: this.zoomIn,
           iconBefore: /*#__PURE__*/React.createElement(ZoomInIcon, {
+            color: "currentColor",
+            spacing: "spacious",
             label: formatMessage(messages.zoom_in)
           })
         })), /*#__PURE__*/React.createElement(ZoomRightControls, null, children, /*#__PURE__*/React.createElement(ZoomLevelIndicator, null, zoomLevel.asPercentage)))

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-viewer",
-	"version": "48.9.0",
+	"version": "48.10.1",
 	"description": "MediaViewer is Atlassian's powerful solution for viewing files on the web. It's both powerful and extendable yet easy-to-integrate",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -35,23 +35,23 @@
 	},
 	"dependencies": {
 		"@atlaskit/analytics-next": "^10.1.0",
-		"@atlaskit/button": "^20.1.0",
+		"@atlaskit/button": "^20.2.0",
 		"@atlaskit/code": "^15.6.0",
 		"@atlaskit/form": "^10.5.0",
 		"@atlaskit/icon": "^22.18.0",
 		"@atlaskit/icon-file-type": "^6.5.0",
 		"@atlaskit/media-client": "^28.0.0",
 		"@atlaskit/media-client-react": "^2.2.0",
-		"@atlaskit/media-common": "^11.4.0",
+		"@atlaskit/media-common": "^11.5.0",
 		"@atlaskit/media-svg": "^0.2.0",
-		"@atlaskit/media-ui": "^25.12.0",
+		"@atlaskit/media-ui": "^25.15.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
-		"@atlaskit/primitives": "^12.1.0",
+		"@atlaskit/primitives": "^12.2.0",
 		"@atlaskit/side-navigation": "^3.5.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/ufo": "^0.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@kenjiuno/msgreader": "^1.2.6",
@@ -79,9 +79,9 @@
 		"@atlaskit/media-integration-test-helpers": "^3.1.0",
 		"@atlaskit/media-state": "^1.1.0",
 		"@atlaskit/media-test-data": "^2.6.0",
-		"@atlaskit/media-test-helpers": "^34.3.0",
+		"@atlaskit/media-test-helpers": "^34.4.0",
 		"@atlaskit/ssr": "*",
-		"@atlaskit/toggle": "13.4.1",
+		"@atlaskit/toggle": "13.4.2",
 		"@atlaskit/visual-regression": "*",
 		"@atlassian/feature-flags-test-utils": "*",
 		"@atlassian/ufo": "^0.4.0",