@atlaskit/media-viewer 49.0.1 → 49.1.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/media-viewer
 
+## 49.1.0
+
+### Minor Changes
+
+- [#148875](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/148875)
+  [`e5fef6fc65331`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e5fef6fc65331) -
+  [ux] Enable new icons behind a feature flag.
+
 ## 49.0.1
 
 ### Patch 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 = "49.0.1";
+var packageVersion = exports.packageVersion = "49.1.0";
 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 = "49.0.1";
+var packageVersion = "49.1.0";
 var ufoExperience;
 var getExperience = function getExperience() {
   if (!ufoExperience) {

package/dist/cjs/navigation.js

@@ -12,21 +12,69 @@ 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 _chevronLeftCircle = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-left-circle"));
-var _chevronRightCircle = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-right-circle"));
+var _chevronLeftChevronLeftCircle = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-left--chevron-left-circle"));
+var _chevronRightChevronRightCircle = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-right--chevron-right-circle"));
 var _mediaUi = require("@atlaskit/media-ui");
-var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _styleWrappers = require("./styleWrappers");
 var _utils = require("./utils");
 var _navigated = require("./analytics/events/ui/navigated");
 var _analytics = require("./analytics");
+var _primitives = require("@atlaskit/primitives");
 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; }
 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; })(); } /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 var nextNavButtonId = exports.nextNavButtonId = 'media-viewer-navigation-next';
 var prevNavButtonId = exports.prevNavButtonId = 'media-viewer-navigation-prev';
+var wrapperStyles = (0, _primitives.xcss)({
+  width: '40px',
+  height: '40px',
+  borderRadius: '100%',
+  padding: 'space.0',
+  // @ts-ignore
+  backgroundColor: '#9FADBC',
+  // @ts-ignore
+  color: '#161A1D',
+  boxSizing: 'border-box',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  ':hover': {
+    // @ts-ignore
+    backgroundColor: '#B6C2CF'
+  }
+});
+var iconRightStyles = (0, _primitives.xcss)({
+  marginRight: 'space.100'
+});
+var iconLeftStyles = (0, _primitives.xcss)({
+  marginLeft: 'space.100'
+});
+var withIconWrapper = function withIconWrapper(Component) {
+  return function (_ref) {
+    var label = _ref.label,
+      clickHandler = _ref.clickHandler,
+      testId = _ref.testId;
+    return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
+      xcss: [wrapperStyles, label === 'Next' ? iconRightStyles : iconLeftStyles],
+      onClick: clickHandler('mouse'),
+      testId: testId
+    }, /*#__PURE__*/_react.default.createElement(Component, {
+      label: label,
+      LEGACY_size: "xlarge"
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+      ,
+      LEGACY_primaryColor: "#9FADBC"
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+      ,
+      LEGACY_secondaryColor: "#161A1D",
+      color: "currentColor"
+    }));
+  };
+};
+var NextIcon = withIconWrapper(_chevronRightChevronRightCircle.default);
+var PreviousIcon = withIconWrapper(_chevronLeftChevronLeftCircle.default);
 var NavigationBase = exports.NavigationBase = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(NavigationBase, _Component);
   var _super = _createSuper(NavigationBase);
@@ -89,23 +137,10 @@ var NavigationBase = exports.NavigationBase = /*#__PURE__*/function (_Component)
         code: 'ArrowLeft',
         handler: prev('keyboard'),
         eventType: 'keyup'
-      }), /*#__PURE__*/_react.default.createElement(_standardButton.default, {
-        testId: prevNavButtonId,
-        onClick: prev('mouse'),
-        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"
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-          ,
-          secondaryColor: "#161A1D",
-          size: "xlarge",
-          label: "Previous"
-        })
+      }), /*#__PURE__*/_react.default.createElement(PreviousIcon, {
+        label: "Previous",
+        clickHandler: prev,
+        testId: prevNavButtonId
       })) : null), /*#__PURE__*/_react.default.createElement(_styleWrappers.RightWrapper, null, isRightVisible ?
       /*#__PURE__*/
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -115,23 +150,10 @@ var NavigationBase = exports.NavigationBase = /*#__PURE__*/function (_Component)
         code: 'ArrowRight',
         handler: next('keyboard'),
         eventType: 'keyup'
-      }), /*#__PURE__*/_react.default.createElement(_standardButton.default, {
-        testId: nextNavButtonId,
-        onClick: next('mouse'),
-        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"
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-          ,
-          secondaryColor: "#161A1D",
-          size: "xlarge",
-          label: "Next"
-        })
+      }), /*#__PURE__*/_react.default.createElement(NextIcon, {
+        label: "Next",
+        clickHandler: next,
+        testId: nextNavButtonId
       })) : null));
     }
   }]);

package/dist/cjs/styleWrappers.js

@@ -166,8 +166,6 @@ var arrowStyles = (0, _react.css)({
   },
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&& button': {
-    height: 'inherit',
-    background: 'none',
     '&:hover': {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       svg: {

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 = "49.0.1";
+const packageVersion = "49.1.0";
 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 = "49.0.1";
+const packageVersion = "49.1.0";
 let ufoExperience;
 const getExperience = () => {
   if (!ufoExperience) {

package/dist/es2019/navigation.js

@@ -1,18 +1,65 @@
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 import React from 'react';
 import { Component } from 'react';
-import ArrowLeftCircleIcon from '@atlaskit/icon/glyph/chevron-left-circle';
-import ArrowRightCircleIcon from '@atlaskit/icon/glyph/chevron-right-circle';
+import ArrowLeftCircleIcon from '@atlaskit/icon/utility/migration/chevron-left--chevron-left-circle';
+import ArrowRightCircleIcon from '@atlaskit/icon/utility/migration/chevron-right--chevron-right-circle';
 import { hideControlsClassName } from '@atlaskit/media-ui';
-import Button from '@atlaskit/button/standard-button';
 import { Shortcut } from '@atlaskit/media-ui';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ArrowsWrapper, RightWrapper, LeftWrapper, Arrow } from './styleWrappers';
 import { getSelectedIndex } from './utils';
 import { createNavigatedEvent } from './analytics/events/ui/navigated';
 import { fireAnalytics } from './analytics';
+import { Pressable, xcss } from '@atlaskit/primitives';
 export const nextNavButtonId = 'media-viewer-navigation-next';
 export const prevNavButtonId = 'media-viewer-navigation-prev';
+const wrapperStyles = xcss({
+  width: '40px',
+  height: '40px',
+  borderRadius: '100%',
+  padding: 'space.0',
+  // @ts-ignore
+  backgroundColor: '#9FADBC',
+  // @ts-ignore
+  color: '#161A1D',
+  boxSizing: 'border-box',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  ':hover': {
+    // @ts-ignore
+    backgroundColor: '#B6C2CF'
+  }
+});
+const iconRightStyles = xcss({
+  marginRight: 'space.100'
+});
+const iconLeftStyles = xcss({
+  marginLeft: 'space.100'
+});
+const withIconWrapper = Component => {
+  return ({
+    label,
+    clickHandler,
+    testId
+  }) => /*#__PURE__*/React.createElement(Pressable, {
+    xcss: [wrapperStyles, label === 'Next' ? iconRightStyles : iconLeftStyles],
+    onClick: clickHandler('mouse'),
+    testId: testId
+  }, /*#__PURE__*/React.createElement(Component, {
+    label: label,
+    LEGACY_size: "xlarge"
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    ,
+    LEGACY_primaryColor: "#9FADBC"
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+    ,
+    LEGACY_secondaryColor: "#161A1D",
+    color: "currentColor"
+  }));
+};
+const NextIcon = withIconWrapper(ArrowRightCircleIcon);
+const PreviousIcon = withIconWrapper(ArrowLeftCircleIcon);
 export class NavigationBase extends Component {
   navigate(direction, source) {
     return () => {
@@ -64,23 +111,10 @@ export class NavigationBase extends Component {
       code: 'ArrowLeft',
       handler: prev('keyboard'),
       eventType: 'keyup'
-    }), /*#__PURE__*/React.createElement(Button, {
-      testId: prevNavButtonId,
-      onClick: prev('mouse'),
-      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"
-        // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-        ,
-        secondaryColor: "#161A1D",
-        size: "xlarge",
-        label: "Previous"
-      })
+    }), /*#__PURE__*/React.createElement(PreviousIcon, {
+      label: "Previous",
+      clickHandler: prev,
+      testId: prevNavButtonId
     })) : null), /*#__PURE__*/React.createElement(RightWrapper, null, isRightVisible ?
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -90,23 +124,10 @@ export class NavigationBase extends Component {
       code: 'ArrowRight',
       handler: next('keyboard'),
       eventType: 'keyup'
-    }), /*#__PURE__*/React.createElement(Button, {
-      testId: nextNavButtonId,
-      onClick: next('mouse'),
-      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"
-        // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-        ,
-        secondaryColor: "#161A1D",
-        size: "xlarge",
-        label: "Next"
-      })
+    }), /*#__PURE__*/React.createElement(NextIcon, {
+      label: "Next",
+      clickHandler: next,
+      testId: nextNavButtonId
     })) : null));
   }
 }

package/dist/es2019/styleWrappers.js

@@ -157,8 +157,6 @@ const arrowStyles = css({
   },
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&& button': {
-    height: 'inherit',
-    background: 'none',
     '&:hover': {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       svg: {

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 = "49.0.1";
+var packageVersion = "49.1.0";
 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 = "49.0.1";
+var packageVersion = "49.1.0";
 var ufoExperience;
 var getExperience = function getExperience() {
   if (!ufoExperience) {

package/dist/esm/navigation.js

@@ -8,18 +8,66 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 import React from 'react';
 import { Component } from 'react';
-import ArrowLeftCircleIcon from '@atlaskit/icon/glyph/chevron-left-circle';
-import ArrowRightCircleIcon from '@atlaskit/icon/glyph/chevron-right-circle';
+import ArrowLeftCircleIcon from '@atlaskit/icon/utility/migration/chevron-left--chevron-left-circle';
+import ArrowRightCircleIcon from '@atlaskit/icon/utility/migration/chevron-right--chevron-right-circle';
 import { hideControlsClassName } from '@atlaskit/media-ui';
-import Button from '@atlaskit/button/standard-button';
 import { Shortcut } from '@atlaskit/media-ui';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ArrowsWrapper, RightWrapper, LeftWrapper, Arrow } from './styleWrappers';
 import { getSelectedIndex } from './utils';
 import { createNavigatedEvent } from './analytics/events/ui/navigated';
 import { fireAnalytics } from './analytics';
+import { Pressable, xcss } from '@atlaskit/primitives';
 export var nextNavButtonId = 'media-viewer-navigation-next';
 export var prevNavButtonId = 'media-viewer-navigation-prev';
+var wrapperStyles = xcss({
+  width: '40px',
+  height: '40px',
+  borderRadius: '100%',
+  padding: 'space.0',
+  // @ts-ignore
+  backgroundColor: '#9FADBC',
+  // @ts-ignore
+  color: '#161A1D',
+  boxSizing: 'border-box',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  ':hover': {
+    // @ts-ignore
+    backgroundColor: '#B6C2CF'
+  }
+});
+var iconRightStyles = xcss({
+  marginRight: 'space.100'
+});
+var iconLeftStyles = xcss({
+  marginLeft: 'space.100'
+});
+var withIconWrapper = function withIconWrapper(Component) {
+  return function (_ref) {
+    var label = _ref.label,
+      clickHandler = _ref.clickHandler,
+      testId = _ref.testId;
+    return /*#__PURE__*/React.createElement(Pressable, {
+      xcss: [wrapperStyles, label === 'Next' ? iconRightStyles : iconLeftStyles],
+      onClick: clickHandler('mouse'),
+      testId: testId
+    }, /*#__PURE__*/React.createElement(Component, {
+      label: label,
+      LEGACY_size: "xlarge"
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+      ,
+      LEGACY_primaryColor: "#9FADBC"
+      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+      ,
+      LEGACY_secondaryColor: "#161A1D",
+      color: "currentColor"
+    }));
+  };
+};
+var NextIcon = withIconWrapper(ArrowRightCircleIcon);
+var PreviousIcon = withIconWrapper(ArrowLeftCircleIcon);
 export var NavigationBase = /*#__PURE__*/function (_Component) {
   _inherits(NavigationBase, _Component);
   var _super = _createSuper(NavigationBase);
@@ -82,23 +130,10 @@ export var NavigationBase = /*#__PURE__*/function (_Component) {
         code: 'ArrowLeft',
         handler: prev('keyboard'),
         eventType: 'keyup'
-      }), /*#__PURE__*/React.createElement(Button, {
-        testId: prevNavButtonId,
-        onClick: prev('mouse'),
-        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"
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-          ,
-          secondaryColor: "#161A1D",
-          size: "xlarge",
-          label: "Previous"
-        })
+      }), /*#__PURE__*/React.createElement(PreviousIcon, {
+        label: "Previous",
+        clickHandler: prev,
+        testId: prevNavButtonId
       })) : null), /*#__PURE__*/React.createElement(RightWrapper, null, isRightVisible ?
       /*#__PURE__*/
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -108,23 +143,10 @@ export var NavigationBase = /*#__PURE__*/function (_Component) {
         code: 'ArrowRight',
         handler: next('keyboard'),
         eventType: 'keyup'
-      }), /*#__PURE__*/React.createElement(Button, {
-        testId: nextNavButtonId,
-        onClick: next('mouse'),
-        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"
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-          ,
-          secondaryColor: "#161A1D",
-          size: "xlarge",
-          label: "Next"
-        })
+      }), /*#__PURE__*/React.createElement(NextIcon, {
+        label: "Next",
+        clickHandler: next,
+        testId: nextNavButtonId
       })) : null));
     }
   }]);

package/dist/esm/styleWrappers.js

@@ -158,8 +158,6 @@ var arrowStyles = css({
   },
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&& button': {
-    height: 'inherit',
-    background: 'none',
     '&:hover': {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       svg: {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-viewer",
-	"version": "49.0.1",
+	"version": "49.1.0",
 	"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/"