@atlaskit/editor-plugin-media 5.1.2 → 5.1.4

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-media
 
+## 5.1.4
+
+### Patch Changes
+
+- [#184004](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/184004)
+  [`a08a65a80b5a3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a08a65a80b5a3) -
+  [ux] Ensure data security policy enforced for download buttons in mediaInline and mediaSingle
+  floating toolbars
+- Updated dependencies
+
+## 5.1.3
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 5.1.2
 
 ### Patch Changes

package/dist/cjs/ui/toolbar/index.js

@@ -120,9 +120,8 @@ var handleShowMediaViewer = exports.handleShowMediaViewer = function handleShowM
   api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.media.commands.showMediaViewer(selectedNodeAttrs));
 };
 var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) {
-  var _mediaPluginState$med, _pluginInjectionApi$c;
-  var enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 || (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
-  var disableDownloadButton = typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
+  var _pluginInjectionApi$c;
+  var disableDownloadButton = (0, _utils2.getIsDownloadDisabledByDataSecurityPolicy)(mediaPluginState);
   var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
   var preview = {
     id: 'editor.media.viewer',
@@ -279,6 +278,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
   var _ref2 = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
     hoverDecoration = _ref2.hoverDecoration;
   var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
+  var disableDownloadButton = (0, _utils2.getIsDownloadDisabledByDataSecurityPolicy)(pluginState);
   if ((0, _imageBorder.shouldShowImageBorder)(state)) {
     toolbarButtons.push({
       type: 'custom',
@@ -576,6 +576,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
         (0, _utils2.downloadMedia)(pluginState, isViewOnly);
         return true;
       },
+      disabled: disableDownloadButton,
       title: intl.formatMessage(_mediaUi.messages.download),
       supportsViewMode: true
     }, {

package/dist/cjs/ui/toolbar/mediaInline.js

@@ -64,6 +64,7 @@ var generateMediaInlineFloatingToolbar = exports.generateMediaInlineFloatingTool
   }, isEditorControlsEnabled && {
     supportsViewMode: true
   });
+  var disableDownloadButton = (0, _utils.getIsDownloadDisabledByDataSecurityPolicy)(mediaPluginState);
   var download = _objectSpread({
     id: 'editor.media.card.download',
     type: 'button',
@@ -72,6 +73,7 @@ var generateMediaInlineFloatingToolbar = exports.generateMediaInlineFloatingTool
       (0, _utils.downloadMedia)(mediaPluginState);
       return true;
     },
+    disabled: disableDownloadButton,
     title: intl.formatMessage(_mediaUi.messages.download)
   }, isEditorControlsEnabled && {
     supportsViewMode: true

package/dist/cjs/ui/toolbar/utils.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.updateToFullHeightSeparator = exports.removeMediaGroupNode = exports.isExternalMedia = exports.getSelectedNearestMediaContainerNodeAttrsFunction = exports.getSelectedNearestMediaContainerNodeAttrs = exports.getSelectedMediaSingle = exports.getSelectedLayoutIcon = exports.getPixelWidthOfElement = exports.getMediaSingleAndMediaInlineSwitcherDropdown = exports.getMaxToolbarWidth = exports.downloadMedia = exports.canShowSwitchButtons = exports.calcNewLayout = void 0;
+exports.updateToFullHeightSeparator = exports.removeMediaGroupNode = exports.isExternalMedia = exports.getSelectedNearestMediaContainerNodeAttrsFunction = exports.getSelectedNearestMediaContainerNodeAttrs = exports.getSelectedMediaSingle = exports.getSelectedLayoutIcon = exports.getPixelWidthOfElement = exports.getMediaSingleAndMediaInlineSwitcherDropdown = exports.getMaxToolbarWidth = exports.getIsDownloadDisabledByDataSecurityPolicy = exports.downloadMedia = exports.canShowSwitchButtons = exports.calcNewLayout = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _react = _interopRequireDefault(require("react"));
@@ -49,6 +49,11 @@ var getSelectedNearestMediaContainerNodeAttrsFunction = exports.getSelectedNeare
 var getSelectedNearestMediaContainerNodeAttrs = exports.getSelectedNearestMediaContainerNodeAttrs = function getSelectedNearestMediaContainerNodeAttrs(mediaPluginState) {
   return getSelectedNearestMediaContainerNodeAttrsFunction(mediaPluginState.selectedMediaContainerNode);
 };
+var getIsDownloadDisabledByDataSecurityPolicy = exports.getIsDownloadDisabledByDataSecurityPolicy = function getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState) {
+  var _mediaPluginState$med;
+  var enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 || (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
+  return typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
+};
 var downloadMedia = exports.downloadMedia = /*#__PURE__*/function () {
   var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(mediaPluginState, isViewMode) {
     var selectedNodeAttrs, id, _selectedNodeAttrs$co, collection, mediaClient, fileState, fileName;

package/dist/es2019/ui/toolbar/index.js

@@ -39,7 +39,7 @@ import { getLinkingDropdownOptions, getLinkingToolbar, getOpenLinkToolbarButtonO
 import { LinkToolbarAppearance } from './linking-toolbar-appearance';
 import { generateMediaInlineFloatingToolbar } from './mediaInline';
 import { getPixelResizingToolbar, getResizeDropdownOption } from './pixel-resizing';
-import { canShowSwitchButtons, downloadMedia, getMaxToolbarWidth, getMediaSingleAndMediaInlineSwitcherDropdown, getSelectedLayoutIcon, getSelectedMediaSingle, getSelectedNearestMediaContainerNodeAttrs, removeMediaGroupNode, updateToFullHeightSeparator } from './utils';
+import { canShowSwitchButtons, downloadMedia, getIsDownloadDisabledByDataSecurityPolicy, getMaxToolbarWidth, getMediaSingleAndMediaInlineSwitcherDropdown, getSelectedLayoutIcon, getSelectedMediaSingle, getSelectedNearestMediaContainerNodeAttrs, removeMediaGroupNode, updateToFullHeightSeparator } from './utils';
 const mediaTypeMessages = {
   image: messages.file_image_is_selected,
   video: messages.file_video_is_selected,
@@ -108,9 +108,8 @@ export const handleShowMediaViewer = ({
   api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.media.commands.showMediaViewer(selectedNodeAttrs));
 };
 const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) => {
-  var _mediaPluginState$med, _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$c3;
-  const enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 ? void 0 : (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
-  const disableDownloadButton = typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
+  var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$c3;
+  const disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
   const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
   const preview = {
     id: 'editor.media.viewer',
@@ -269,6 +268,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
     hoverDecoration
   } = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {};
   const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
+  const disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(pluginState);
   if (shouldShowImageBorder(state)) {
     toolbarButtons.push({
       type: 'custom',
@@ -574,6 +574,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
         downloadMedia(pluginState, isViewOnly);
         return true;
       },
+      disabled: disableDownloadButton,
       title: intl.formatMessage(messages.download),
       supportsViewMode: true
     }, {

package/dist/es2019/ui/toolbar/mediaInline.js

@@ -21,7 +21,7 @@ import { changeInlineToMediaCard, changeMediaInlineToMediaSingle, removeInlineCa
 import { shouldShowImageBorder } from './imageBorder';
 import { getOpenLinkToolbarButtonOption, shouldShowMediaLinkToolbar } from './linking';
 import { LinkToolbarAppearance } from './linking-toolbar-appearance';
-import { downloadMedia, getMediaSingleAndMediaInlineSwitcherDropdown } from './utils';
+import { downloadMedia, getIsDownloadDisabledByDataSecurityPolicy, getMediaSingleAndMediaInlineSwitcherDropdown } from './utils';
 import { handleShowMediaViewer } from './index';
 export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options = {}) => {
   var _pluginInjectionApi$a, _pluginInjectionApi$f, _pluginInjectionApi$f2;
@@ -54,6 +54,7 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
       supportsViewMode: true
     })
   };
+  const disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
   const download = {
     id: 'editor.media.card.download',
     type: 'button',
@@ -62,6 +63,7 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
       downloadMedia(mediaPluginState);
       return true;
     },
+    disabled: disableDownloadButton,
     title: intl.formatMessage(messages.download),
     ...(isEditorControlsEnabled && {
       supportsViewMode: true

package/dist/es2019/ui/toolbar/utils.js

@@ -40,6 +40,11 @@ export const getSelectedNearestMediaContainerNodeAttrsFunction = selectedMediaCo
 export const getSelectedNearestMediaContainerNodeAttrs = mediaPluginState => {
   return getSelectedNearestMediaContainerNodeAttrsFunction(mediaPluginState.selectedMediaContainerNode);
 };
+export const getIsDownloadDisabledByDataSecurityPolicy = mediaPluginState => {
+  var _mediaPluginState$med;
+  const enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 ? void 0 : (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
+  return typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
+};
 export const downloadMedia = async (mediaPluginState, isViewMode) => {
   try {
     const selectedNodeAttrs = isViewMode ? getSelectedNearestMediaContainerNodeAttrs(mediaPluginState) : getSelectedMediaContainerNodeAttrs(mediaPluginState);

package/dist/esm/ui/toolbar/index.js

@@ -43,7 +43,7 @@ import { getLinkingDropdownOptions, getLinkingToolbar, getOpenLinkToolbarButtonO
 import { LinkToolbarAppearance } from './linking-toolbar-appearance';
 import { generateMediaInlineFloatingToolbar } from './mediaInline';
 import { getPixelResizingToolbar, getResizeDropdownOption } from './pixel-resizing';
-import { canShowSwitchButtons, downloadMedia, getMaxToolbarWidth, getMediaSingleAndMediaInlineSwitcherDropdown, getSelectedLayoutIcon, getSelectedMediaSingle, getSelectedNearestMediaContainerNodeAttrs, removeMediaGroupNode, updateToFullHeightSeparator } from './utils';
+import { canShowSwitchButtons, downloadMedia, getIsDownloadDisabledByDataSecurityPolicy, getMaxToolbarWidth, getMediaSingleAndMediaInlineSwitcherDropdown, getSelectedLayoutIcon, getSelectedMediaSingle, getSelectedNearestMediaContainerNodeAttrs, removeMediaGroupNode, updateToFullHeightSeparator } from './utils';
 var mediaTypeMessages = {
   image: messages.file_image_is_selected,
   video: messages.file_video_is_selected,
@@ -111,9 +111,8 @@ export var handleShowMediaViewer = function handleShowMediaViewer(_ref) {
   api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.media.commands.showMediaViewer(selectedNodeAttrs));
 };
 var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) {
-  var _mediaPluginState$med, _pluginInjectionApi$c;
-  var enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 || (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
-  var disableDownloadButton = typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
+  var _pluginInjectionApi$c;
+  var disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
   var isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
   var preview = {
     id: 'editor.media.viewer',
@@ -270,6 +269,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
   var _ref2 = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
     hoverDecoration = _ref2.hoverDecoration;
   var isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
+  var disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(pluginState);
   if (shouldShowImageBorder(state)) {
     toolbarButtons.push({
       type: 'custom',
@@ -567,6 +567,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
         downloadMedia(pluginState, isViewOnly);
         return true;
       },
+      disabled: disableDownloadButton,
       title: intl.formatMessage(messages.download),
       supportsViewMode: true
     }, {

package/dist/esm/ui/toolbar/mediaInline.js

@@ -24,7 +24,7 @@ import { changeInlineToMediaCard, changeMediaInlineToMediaSingle, removeInlineCa
 import { shouldShowImageBorder } from './imageBorder';
 import { getOpenLinkToolbarButtonOption, shouldShowMediaLinkToolbar } from './linking';
 import { LinkToolbarAppearance } from './linking-toolbar-appearance';
-import { downloadMedia, getMediaSingleAndMediaInlineSwitcherDropdown } from './utils';
+import { downloadMedia, getIsDownloadDisabledByDataSecurityPolicy, getMediaSingleAndMediaInlineSwitcherDropdown } from './utils';
 import { handleShowMediaViewer } from './index';
 export var generateMediaInlineFloatingToolbar = function generateMediaInlineFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi) {
   var _pluginInjectionApi$a, _pluginInjectionApi$f;
@@ -55,6 +55,7 @@ export var generateMediaInlineFloatingToolbar = function generateMediaInlineFloa
   }, isEditorControlsEnabled && {
     supportsViewMode: true
   });
+  var disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
   var download = _objectSpread({
     id: 'editor.media.card.download',
     type: 'button',
@@ -63,6 +64,7 @@ export var generateMediaInlineFloatingToolbar = function generateMediaInlineFloa
       downloadMedia(mediaPluginState);
       return true;
     },
+    disabled: disableDownloadButton,
     title: intl.formatMessage(messages.download)
   }, isEditorControlsEnabled && {
     supportsViewMode: true

package/dist/esm/ui/toolbar/utils.js

@@ -42,6 +42,11 @@ export var getSelectedNearestMediaContainerNodeAttrsFunction = function getSelec
 export var getSelectedNearestMediaContainerNodeAttrs = function getSelectedNearestMediaContainerNodeAttrs(mediaPluginState) {
   return getSelectedNearestMediaContainerNodeAttrsFunction(mediaPluginState.selectedMediaContainerNode);
 };
+export var getIsDownloadDisabledByDataSecurityPolicy = function getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState) {
+  var _mediaPluginState$med;
+  var enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 || (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
+  return typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
+};
 export var downloadMedia = /*#__PURE__*/function () {
   var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(mediaPluginState, isViewMode) {
     var selectedNodeAttrs, id, _selectedNodeAttrs$co, collection, mediaClient, fileState, fileName;

package/dist/types/ui/toolbar/utils.d.ts

@@ -11,6 +11,7 @@ import type { MediaPluginState } from '../../pm-plugins/types';
 export declare const isExternalMedia: (attrs: MediaADFAttrs) => attrs is ExternalMediaAttributes;
 export declare const getSelectedNearestMediaContainerNodeAttrsFunction: (selectedMediaContainerNode: () => ProseMirrorNode | undefined) => MediaADFAttrs | null;
 export declare const getSelectedNearestMediaContainerNodeAttrs: (mediaPluginState: MediaPluginState) => MediaADFAttrs | null;
+export declare const getIsDownloadDisabledByDataSecurityPolicy: (mediaPluginState: MediaPluginState) => boolean;
 export declare const downloadMedia: (mediaPluginState: MediaPluginState, isViewMode?: boolean) => Promise<boolean>;
 export declare const removeMediaGroupNode: (state: EditorState) => import("prosemirror-state").Transaction;
 export declare const getSelectedMediaSingle: (state: EditorState) => ReturnType<ReturnType<typeof findSelectedNodeOfType>> | ReturnType<ReturnType<typeof findParentNodeOfType>>;

package/dist/types-ts4.5/ui/toolbar/utils.d.ts

@@ -11,6 +11,7 @@ import type { MediaPluginState } from '../../pm-plugins/types';
 export declare const isExternalMedia: (attrs: MediaADFAttrs) => attrs is ExternalMediaAttributes;
 export declare const getSelectedNearestMediaContainerNodeAttrsFunction: (selectedMediaContainerNode: () => ProseMirrorNode | undefined) => MediaADFAttrs | null;
 export declare const getSelectedNearestMediaContainerNodeAttrs: (mediaPluginState: MediaPluginState) => MediaADFAttrs | null;
+export declare const getIsDownloadDisabledByDataSecurityPolicy: (mediaPluginState: MediaPluginState) => boolean;
 export declare const downloadMedia: (mediaPluginState: MediaPluginState, isViewMode?: boolean) => Promise<boolean>;
 export declare const removeMediaGroupNode: (state: EditorState) => import("prosemirror-state").Transaction;
 export declare const getSelectedMediaSingle: (state: EditorState) => ReturnType<ReturnType<typeof findSelectedNodeOfType>> | ReturnType<ReturnType<typeof findParentNodeOfType>>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "5.1.2",
+	"version": "5.1.4",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -68,8 +68,8 @@
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.10.0",
 		"@atlaskit/textfield": "^8.0.0",
-		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^9.0.0",
+		"@atlaskit/theme": "^19.0.0",
+		"@atlaskit/tmp-editor-statsig": "^9.2.0",
 		"@atlaskit/tokens": "^5.4.0",
 		"@atlaskit/tooltip": "^20.3.0",
 		"@babel/runtime": "^7.0.0",