@atlaskit/editor-plugin-media 10.0.10 → 10.1.0

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

@@ -97,12 +97,20 @@ var ImageBorder = function ImageBorder(_ref) {
       ref.style.left = "-".concat(rect.width, "px");
     }
   };
-  var handleTriggerByKeyboard = function handleTriggerByKeyboard(event, callback) {
-    if (event.key === 'Enter' || event.key === ' ') {
-      event.preventDefault();
-      callback();
-      setIsOpenedByKeyboard(true);
+  var handleTriggerByKeyboard = function handleTriggerByKeyboard(event, allowedKeys, callback) {
+    if (!allowedKeys.includes(event.key)) {
+      return;
     }
+    event.preventDefault();
+    callback();
+    setIsOpenedByKeyboard(true);
+  };
+  var handleTriggerToolbarByKeyboard = function handleTriggerToolbarByKeyboard(event, callback) {
+    handleTriggerByKeyboard(event, ['Enter', ' '], callback);
+  };
+  var handleTriggerSubmenuByKeyboard = function handleTriggerSubmenuByKeyboard(event, callback) {
+    var keys = (0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true) ? ['Enter', 'ArrowRight'] : ['Enter', ' '];
+    handleTriggerByKeyboard(event, keys, callback);
   };
   (0, _react.useEffect)(function () {
     var focusFirstOption = function focusFirstOption(submenuRef, isOpen) {
@@ -149,8 +157,18 @@ var ImageBorder = function ImageBorder(_ref) {
       _styles2.dropdownOptionButton,
       "aria-expanded": isColorSubmenuOpen,
       onKeyDown: function onKeyDown(e) {
-        return handleTriggerByKeyboard(e, function () {
-          return setIsColorSubmenuOpen(!isColorSubmenuOpen);
+        return handleTriggerSubmenuByKeyboard(e, function () {
+          if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true)) {
+            setIsColorSubmenuOpen(function (prev) {
+              var next = !prev;
+              if (next) {
+                setIsSizeSubmenuOpen(false);
+              }
+              return next;
+            });
+          } else {
+            setIsColorSubmenuOpen(!isColorSubmenuOpen);
+          }
         });
       }
     }, (0, _react2.jsx)(_compiled.Text, null, formatMessage(_media.imageBorderMessages.borderColor)), (0, _react2.jsx)("div", {
@@ -165,20 +183,26 @@ var ImageBorder = function ImageBorder(_ref) {
       css: (0, _styles2.contextualSubMenu)(0),
       ref: handleSubMenuRef
     }, (0, _react2.jsx)(_uiMenu.ArrowKeyNavigationProvider, {
-      type: _uiMenu.ArrowKeyNavigationType.MENU,
+      type: _uiMenu.ArrowKeyNavigationType.MENU
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+      ,
       handleClose: function handleClose(e) {
         e.preventDefault();
         e.stopPropagation();
         handleColorSubmenuEsc();
       },
       disableCloseOnArrowClick: true
-    }, (0, _react2.jsx)(_uiColor.ColorPalette, {
+    }, (0, _react2.jsx)(_uiColor.ColorPalette
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    , {
       onClick: function onClick(color) {
         setBorder({
           color: color
         });
         setIsOpen(!isOpen);
-      },
+      }
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+      ,
       onKeyDown: function onKeyDown(color, _, event) {
         if (event.key === 'Enter' || event.key === ' ') {
           var _openDropdownButtonRe;
@@ -191,7 +215,9 @@ var ImageBorder = function ImageBorder(_ref) {
           (_openDropdownButtonRe = openDropdownButtonRef.current) === null || _openDropdownButtonRe === void 0 || _openDropdownButtonRe.focus();
         }
       },
-      selectedColor: color !== null && color !== void 0 ? color : null,
+      selectedColor: color !== null && color !== void 0 ? color : null
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+      ,
       paletteOptions: {
         palette: _uiColor.borderColorPalette,
         paletteColorTooltipMessages: _uiColor.borderPaletteTooltipMessages,
@@ -216,8 +242,18 @@ var ImageBorder = function ImageBorder(_ref) {
       "aria-expanded": isSizeSubmenuOpen,
       ref: dropDownSizeOptionButton,
       onKeyDown: function onKeyDown(e) {
-        return handleTriggerByKeyboard(e, function () {
-          return setIsSizeSubmenuOpen(!isSizeSubmenuOpen);
+        return handleTriggerSubmenuByKeyboard(e, function () {
+          if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true)) {
+            setIsSizeSubmenuOpen(function (prev) {
+              var next = !prev;
+              if (next) {
+                setIsColorSubmenuOpen(false);
+              }
+              return next;
+            });
+          } else {
+            setIsSizeSubmenuOpen(!isSizeSubmenuOpen);
+          }
         });
       }
     }, (0, _react2.jsx)(_compiled.Text, null, formatMessage(_media.imageBorderMessages.borderSize)), (0, _react2.jsx)("div", {
@@ -227,7 +263,9 @@ var ImageBorder = function ImageBorder(_ref) {
       className: _styles.DropdownMenuSharedCssClassName.SUBMENU,
       ref: sizeSubmenuRef
     }, isSizeSubmenuOpen && (0, _react2.jsx)(_uiMenu.ArrowKeyNavigationProvider, {
-      type: _uiMenu.ArrowKeyNavigationType.MENU,
+      type: _uiMenu.ArrowKeyNavigationType.MENU
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+      ,
       handleClose: function handleClose(e) {
         e.preventDefault();
         handleSizeSubmenuEsc();
@@ -340,13 +378,17 @@ var ImageBorder = function ImageBorder(_ref) {
       spacing: "spacious",
       label: "",
       size: "small"
-    }),
+    })
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     onClick: function onClick() {
       setIsOpen(!isOpen);
       setIsOpenedByKeyboard(false);
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     onKeyDown: function onKeyDown(e) {
-      return handleTriggerByKeyboard(e, function () {
+      return handleTriggerToolbarByKeyboard(e, function () {
         return setIsOpen(!isOpen);
       });
     }
@@ -357,12 +399,17 @@ var ImageBorder = function ImageBorder(_ref) {
     forcePlacement: true,
     stick: true
   }, (0, _react2.jsx)("div", {
-    /* eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766 */
+    onMouseLeave: (0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true) ? undefined : function () {
+      setIsColorSubmenuOpen(false);
+      setIsSizeSubmenuOpen(false);
+    }
+    /* eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766 */,
     css: _styles2.dropdownWrapper
   }, (0, _react2.jsx)(_uiMenu.DropdownMenu
   //This needs be removed when the a11y is completely handled
   //Disabling key navigation now as it works only partially
   //Same with packages/editor/editor-plugin-table/src/plugins/table/ui/FloatingContextualMenu/ContextualMenu.tsx
+  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
   , {
     arrowKeyNavigationProviderOptions: {
       type: _uiMenu.ArrowKeyNavigationType.MENU,
@@ -374,47 +421,83 @@ var ImageBorder = function ImageBorder(_ref) {
     } : function () {
       var _openDropdownButtonRe3;
       (_openDropdownButtonRe3 = openDropdownButtonRef.current) === null || _openDropdownButtonRe3 === void 0 || _openDropdownButtonRe3.focus();
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     items: [{
       items: items
     }],
-    isOpen: isOpen,
+    isOpen: isOpen
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     shouldFocusFirstItem: function shouldFocusFirstItem() {
       return isOpenByKeyboard;
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     onOpenChange: function onOpenChange() {
       setIsOpen(false);
       setIsColorSubmenuOpen(false);
       setIsSizeSubmenuOpen(false);
       setIsOpenedByKeyboard(false);
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     onItemActivated: function onItemActivated(_ref3) {
       var item = _ref3.item;
       if (item.value.name === 'color') {
-        setIsColorSubmenuOpen(!isColorSubmenuOpen);
+        if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true)) {
+          setIsColorSubmenuOpen(function (prev) {
+            var next = !prev;
+            if (next) {
+              setIsSizeSubmenuOpen(false);
+            }
+            return next;
+          });
+        } else {
+          setIsColorSubmenuOpen(!isColorSubmenuOpen);
+        }
       }
       if (item.value.name === 'size') {
-        setIsSizeSubmenuOpen(!isSizeSubmenuOpen);
+        if ((0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true)) {
+          setIsSizeSubmenuOpen(function (prev) {
+            var next = !prev;
+            if (next) {
+              setIsColorSubmenuOpen(false);
+            }
+            return next;
+          });
+        } else {
+          setIsSizeSubmenuOpen(!isSizeSubmenuOpen);
+        }
       }
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     onMouseEnter: function onMouseEnter(_ref4) {
       var item = _ref4.item;
-      if (item.value.name === 'color') {
-        setIsColorSubmenuOpen(true);
-        setIsOpenedByKeyboard(false);
-      }
-      if (item.value.name === 'size') {
-        setIsSizeSubmenuOpen(true);
-        setIsOpenedByKeyboard(false);
+      if (!(0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true)) {
+        if (item.value.name === 'color') {
+          setIsColorSubmenuOpen(true);
+          setIsOpenedByKeyboard(false);
+        }
+        if (item.value.name === 'size') {
+          setIsSizeSubmenuOpen(true);
+          setIsOpenedByKeyboard(false);
+        }
       }
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
     onMouseLeave: function onMouseLeave(_ref5) {
       var item = _ref5.item;
-      if (item.value.name === 'color') {
-        setIsColorSubmenuOpen(false);
-      }
-      if (item.value.name === 'size') {
-        setIsSizeSubmenuOpen(false);
+      if (!(0, _expValEquals.expValEquals)('platform_editor_toolbar_submenu_open_click', 'isEnabled', true)) {
+        if (item.value.name === 'color') {
+          setIsColorSubmenuOpen(false);
+        }
+        if (item.value.name === 'size') {
+          setIsSizeSubmenuOpen(false);
+        }
       }
     },
     fitWidth: fitWidth + fitTolerance,

package/dist/cjs/ui/MediaLinkingToolbar.js

@@ -126,13 +126,17 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
           icon: (0, _react2.jsx)(_chevronLeft.default, {
             label: formatLinkAddressText,
             size: "small"
-          }),
+          })
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onClick: function onClick() {
             return _this.handleOnBack({
               url: value,
               inputMethod: currentInputMethod
             });
-          },
+          }
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onKeyDown: function onKeyDown(event) {
             if (event.key === 'Enter' || event.key === ' ') {
               event.preventDefault();
@@ -149,7 +153,9 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
           placeholder: getPlaceholder(!!activityProvider),
           autoFocus: true,
           onCancel: _this.handleCancel,
-          defaultValue: value,
+          defaultValue: value
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onSubmit: function onSubmit(inputValue) {
             var validationErrors = _this.getValidationErrors(inputValue, currentInputMethod);
             _this.setState({
@@ -158,7 +164,9 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
             if (!validationErrors.length) {
               _onSubmit();
             }
-          },
+          }
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onChange: function onChange(value) {
             _this.setState({
               validationErrors: []
@@ -175,10 +183,14 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
           title: formatUnlinkText,
           icon: (0, _react2.jsx)(_linkBroken.default, {
             label: formatUnlinkText
-          }),
+          })
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onClick: function onClick() {
             return _this.handleUnlink();
-          },
+          }
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onKeyDown: function onKeyDown(event) {
             if (event.key === 'Enter' || event.key === ' ') {
               event.preventDefault();

package/dist/cjs/ui/MediaPicker/DropzoneWrapper.js

@@ -48,10 +48,14 @@ var DropzoneWrapperInternal = function DropzoneWrapperInternal(_ref) {
     config: dropzoneConfig,
     onError: pickerFacadeInstance.handleUploadError,
     onPreviewUpdate: pickerFacadeInstance.handleUploadPreviewUpdate,
-    onEnd: pickerFacadeInstance.handleReady,
+    onEnd: pickerFacadeInstance.handleReady
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    ,
     onDragEnter: function onDragEnter() {
       return handleDrag === null || handleDrag === void 0 ? void 0 : handleDrag('enter');
-    },
+    }
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    ,
     onDragLeave: function onDragLeave() {
       return handleDrag === null || handleDrag === void 0 ? void 0 : handleDrag('leave');
     },

package/dist/cjs/ui/MediaPicker/PickerFacadeProvider.js

@@ -115,6 +115,7 @@ function PickerFacadeProvider(_ref) {
   }(), [analyticsName, insertFile, mediaOptions, options === null || options === void 0 ? void 0 : options.errorReporter]);
   (0, _react.useEffect)(function () {
     if (mediaProvider) {
+      // eslint-disable-next-line @atlassian/perf-linting/no-chain-state-updates -- Ignored via go/ees017 (to be fixed)
       handleMediaProvider('mediaProvider', Promise.resolve(mediaProvider));
     }
   }, [mediaProvider, handleMediaProvider]);

package/dist/cjs/ui/MediaViewer/MediaViewerContainer.js

@@ -36,6 +36,7 @@ var MediaViewerContainer = exports.MediaViewerContainer = function MediaViewerCo
     isSelected = _ref$isSelected === void 0 ? true : _ref$isSelected,
     _ref$isInline = _ref.isInline,
     isInline = _ref$isInline === void 0 ? false : _ref$isInline,
+    mediaViewerExtensions = _ref.mediaViewerExtensions,
     children = _ref.children;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -66,6 +67,7 @@ var MediaViewerContainer = exports.MediaViewerContainer = function MediaViewerCo
   }, children), shouldShowViewer && (0, _react2.jsx)(_PortalWrapper.RenderMediaViewer, {
     selectedNodeAttrs: selectedNodeAttrs,
     mediaClientConfig: mediaClientConfig,
-    onClose: closeMediaViewer
+    onClose: closeMediaViewer,
+    extensions: mediaViewerExtensions
   })) : children);
 };

package/dist/cjs/ui/MediaViewer/PortalWrapper.js

@@ -31,7 +31,8 @@ var RenderMediaViewer = exports.RenderMediaViewer = function RenderMediaViewer(_
     onClose = _ref.onClose,
     selectedNodeAttrs = _ref.selectedNodeAttrs,
     _ref$items = _ref.items,
-    items = _ref$items === void 0 ? [] : _ref$items;
+    items = _ref$items === void 0 ? [] : _ref$items,
+    extensions = _ref.extensions;
   var identifier = getIdentifier(selectedNodeAttrs);
   var collectionName = (0, _utils.isExternalMedia)(selectedNodeAttrs) ? '' : selectedNodeAttrs.collection;
   return /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, {
@@ -42,6 +43,7 @@ var RenderMediaViewer = exports.RenderMediaViewer = function RenderMediaViewer(_
     ,
     mediaClientConfig: mediaClientConfig,
     selectedItem: identifier,
-    onClose: onClose
+    onClose: onClose,
+    extensions: extensions
   }), document.body);
 };

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

@@ -434,6 +434,7 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
         // when cursor is located below a media with caption,
         // press “Up“ key will result cursor focus on an invalid position, (on the resize handler)
         // This workaround adds an empty div inside the resize handler to prevent the issue.
+        // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
         ,
         handleComponentFunc: function handleComponentFunc() {
           return (0, _react2.jsx)("div", {

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

@@ -305,11 +305,15 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
         var dispatch = editorView.dispatch,
           state = editorView.state;
         var borderMark = (0, _currentMediaNode.currentMediaOrInlineNodeBorderMark)(state);
-        return /*#__PURE__*/_react.default.createElement(_ImageBorder.default, {
+        return /*#__PURE__*/_react.default.createElement(_ImageBorder.default
+        // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+        , {
           toggleBorder: function toggleBorder() {
             var _pluginInjectionApi$a;
             (0, _commands.toggleBorderMark)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions)(state, dispatch);
-          },
+          }
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           setBorder: function setBorder(attrs) {
             var _pluginInjectionApi$a2;
             (0, _commands.setBorderMark)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions)(attrs)(state, dispatch);

package/dist/cjs/ui/toolbar/layout-group.js

@@ -50,7 +50,9 @@ var LayoutGroup = exports.LayoutGroup = function LayoutGroup(_ref) {
           }) : undefined,
           title: item.title,
           selected: item.selected,
-          disabled: item.disabled,
+          disabled: item.disabled
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           onClick: function onClick() {
             dispatchCommand(item.onClick);
             hide();

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

@@ -75,12 +75,16 @@ var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(t
               displayUrl: link,
               providerFactory: providerFactory,
               intl: intl,
-              editing: editing,
+              editing: editing
+              // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+              ,
               onUnlink: function onUnlink(setFocus) {
                 var _pluginInjectionApi$a;
                 (0, _linking.unlink)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions)(view.state, view.dispatch, view);
                 setFocusOnFloatingToolbar(setFocus);
-              },
+              }
+              // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+              ,
               onBack: function onBack(href, meta, setFocus) {
                 if (href.trim() && meta.inputMethod) {
                   var _pluginInjectionApi$a2;
@@ -88,7 +92,9 @@ var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(t
                 }
                 (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view);
                 setFocusOnFloatingToolbar(setFocus);
-              },
+              }
+              // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+              ,
               onCancel: function onCancel() {
                 var _pluginInjectionApi$f2;
                 (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view, true);
@@ -100,13 +106,17 @@ var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(t
                 var selector = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)(Boolean(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.toolbar)) ? FORCE_FOCUS_SELECTOR_EDITOR_CONTROLS : FORCE_FOCUS_SELECTOR;
                 pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 || _pluginInjectionApi$f2.forceFocusSelector(selector)(tr);
                 dispatch(tr);
-              },
+              }
+              // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+              ,
               onSubmit: function onSubmit(href, meta) {
                 var _pluginInjectionApi$a3;
                 (0, _linking.setUrlToMedia)(href, meta.inputMethod, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions)(view.state, view.dispatch, view);
                 (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view);
                 setFocusOnFloatingToolbar(true);
-              },
+              }
+              // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+              ,
               onBlur: function onBlur() {
                 (0, _linking.hideLinkingToolbar)(view.state, view.dispatch, view);
               },

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

@@ -204,11 +204,15 @@ var getMediaInlineImageToolbar = function getMediaInlineImageToolbar(state, intl
         var dispatch = editorView.dispatch,
           state = editorView.state;
         var borderMark = (0, _currentMediaNode.currentMediaOrInlineNodeBorderMark)(state);
-        return /*#__PURE__*/_react.default.createElement(_ImageBorder.default, {
+        return /*#__PURE__*/_react.default.createElement(_ImageBorder.default
+        // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+        , {
           toggleBorder: function toggleBorder() {
             var _pluginInjectionApi$a2;
             (0, _commands.toggleBorderMark)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a2 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a2 === void 0 ? void 0 : _pluginInjectionApi$a2.actions)(state, dispatch);
-          },
+          }
+          // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+          ,
           setBorder: function setBorder(attrs) {
             var _pluginInjectionApi$a3;
             (0, _commands.setBorderMark)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions)(attrs)(state, dispatch);

package/dist/es2019/mediaPlugin.js

@@ -71,7 +71,8 @@ const mediaViewerStateSelector = states => {
 };
 const MediaViewerFunctionalComponent = ({
   api,
-  editorView
+  editorView,
+  mediaViewerExtensions
 }) => {
   // Only traverse document once when media viewer is visible, media viewer items will not update
   // when document changes are made while media viewer is open
@@ -100,7 +101,8 @@ const MediaViewerFunctionalComponent = ({
     mediaClientConfig: mediaClientConfig,
     onClose: handleOnClose,
     selectedNodeAttrs: mediaViewerSelectedMedia,
-    items: mediaItems
+    items: mediaItems,
+    extensions: mediaViewerExtensions
   });
 };
 export const mediaPlugin = ({
@@ -339,7 +341,8 @@ export const mediaPlugin = ({
       }
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MediaViewerFunctionalComponent, {
         api: api,
-        editorView: editorView
+        editorView: editorView,
+        mediaViewerExtensions: options === null || options === void 0 ? void 0 : options.mediaViewerExtensions
       }), /*#__PURE__*/React.createElement(MediaPickerFunctionalComponent, {
         editorDomElement: editorView.dom,
         appearance: appearance,

package/dist/es2019/nodeviews/mediaGroup.js

@@ -35,9 +35,13 @@ class MediaGroupNodeView extends ReactNodeView {
       pluginInjectionApi
     } = props;
     const getPos = this.getPos;
-    return /*#__PURE__*/React.createElement(WithProviders, {
+    return /*#__PURE__*/React.createElement(WithProviders
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    , {
       providers: ['contextIdentifierProvider'],
-      providerFactory: providerFactory,
+      providerFactory: providerFactory
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+      ,
       renderNode: ({
         contextIdentifierProvider
       }) => {

package/dist/es2019/nodeviews/mediaGroupNext.js

@@ -204,6 +204,7 @@ export const MediaGroupNext = injectIntl( /*#__PURE__*/React.memo(props => {
     setViewMediaClientConfig(mediaClientConfig);
   }, [mediaClientConfig]);
   useEffect(() => {
+    // eslint-disable-next-line @atlassian/perf-linting/no-chain-state-updates -- Ignored via go/ees017 (to be fixed)
     mediaNodesWithOffsets.forEach(({
       node,
       offset

package/dist/es2019/nodeviews/mediaInline.js

@@ -55,6 +55,7 @@ const updateMediaNodeAttributes = async (props, mediaNodeUpdater) => {
       addPendingTask(copyNode);
       await copyNode;
     } catch (e) {
+      // eslint-disable-line no-unused-vars
       return;
     }
   }
@@ -132,7 +133,9 @@ export const MediaInline = props => {
       isSelected: props.isSelected,
       alt: alt,
       width: width,
-      height: height,
+      height: height
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+      ,
       border: {
         borderSize: borderMark === null || borderMark === void 0 ? void 0 : borderMark.attrs.size,
         borderColor: borderMark === null || borderMark === void 0 ? void 0 : borderMark.attrs.color
@@ -230,11 +233,15 @@ export class MediaInlineNodeView extends SelectionBasedNodeView {
       view
     } = this;
     const getPos = this.getPos;
-    return jsx(WithProviders, {
+    return jsx(WithProviders
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    , {
       providers: ['contextIdentifierProvider'],
-      providerFactory: providerFactory,
+      providerFactory: providerFactory
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+      ,
       renderNode: ({
-        mediaProvider,
+        mediaProvider: _mediaProvider,
         contextIdentifierProvider
       }) => {
         return jsx(MediaInlineSharedState, {

package/dist/es2019/nodeviews/mediaNodeView/index.js

@@ -257,7 +257,9 @@ class MediaNodeView extends SelectionBasedNodeView {
     const {
       providerFactory
     } = this.reactComponentProps;
-    return /*#__PURE__*/React.createElement(WithProviders, {
+    return /*#__PURE__*/React.createElement(WithProviders
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    , {
       providers: ['contextIdentifierProvider'],
       providerFactory: providerFactory,
       renderNode: this.renderMediaNodeWithProviders

package/dist/es2019/nodeviews/mediaNodeView/media.js

@@ -305,7 +305,9 @@ export class MediaNode extends Component {
       onContextMenu: this.selectMediaSingle,
       borderWidth: borderMark === null || borderMark === void 0 ? void 0 : borderMark.attrs.size,
       selected: selected
-    }, /*#__PURE__*/React.createElement(AnalyticsContext, {
+    }, /*#__PURE__*/React.createElement(AnalyticsContext
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    , {
       data: {
         [MEDIA_CONTEXT]: {
           border: !!borderMark

package/dist/es2019/nodeviews/mediaSingle.js

@@ -211,9 +211,13 @@ class MediaSingleNodeView extends ReactNodeView {
 
     // getPos is a boolean for marks, since this is a node we know it must be a function
     const getPos = this.getPos;
-    return jsx(WithProviders, {
+    return jsx(WithProviders
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+    , {
       providers: ['contextIdentifierProvider'],
-      providerFactory: providerFactory,
+      providerFactory: providerFactory
+      // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) 
+      ,
       renderNode: ({
         contextIdentifierProvider
       }) => {