@atlaskit/editor-core 187.32.7 → 187.33.0

package/dist/cjs/ui/ElementBrowser/InsertMenu.js

@@ -24,7 +24,7 @@ var _templateObject, _templateObject2;
 // AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 var InsertMenu = function InsertMenu(_ref) {
-  var _pluginInjectionApi$q10, _pluginInjectionApi$q11, _pluginInjectionApi$q12, _pluginInjectionApi$q13;
+  var _pluginInjectionApi$q6, _pluginInjectionApi$q7, _pluginInjectionApi$q8;
   var editorView = _ref.editorView,
     dropdownItems = _ref.dropdownItems,
     showElementBrowserLink = _ref.showElementBrowserLink,
@@ -78,25 +78,23 @@ var InsertMenu = function InsertMenu(_ref) {
      * @see above transform function for more details.
      */
     if (query) {
-      var _pluginInjectionApi$q2, _pluginInjectionApi$q3, _pluginInjectionApi$q4, _pluginInjectionApi$q5;
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q2 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q2 === void 0 ? void 0 : _pluginInjectionApi$q2.commands.search({
+      var _pluginInjectionApi$q2, _pluginInjectionApi$q3;
+      result = (_pluginInjectionApi$q2 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q3 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q3 === void 0 ? void 0 : _pluginInjectionApi$q3.actions.getSuggestions({
         query: query,
         category: category
-      }));
-      result = (_pluginInjectionApi$q3 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 ? void 0 : (_pluginInjectionApi$q5 = _pluginInjectionApi$q4.sharedState.currentState()) === null || _pluginInjectionApi$q5 === void 0 ? void 0 : _pluginInjectionApi$q5.suggestions) !== null && _pluginInjectionApi$q3 !== void 0 ? _pluginInjectionApi$q3 : [];
+      })) !== null && _pluginInjectionApi$q2 !== void 0 ? _pluginInjectionApi$q2 : [];
     } else {
-      var _pluginInjectionApi$q6, _pluginInjectionApi$q7, _pluginInjectionApi$q8, _pluginInjectionApi$q9;
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.commands.search({
+      var _pluginInjectionApi$q4, _pluginInjectionApi$q5;
+      var featuredQuickInsertSuggestions = (_pluginInjectionApi$q4 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q5 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q5 === void 0 ? void 0 : _pluginInjectionApi$q5.actions.getSuggestions({
         category: category,
         featuredItems: true
-      }));
-      var featuredQuickInsertSuggestions = (_pluginInjectionApi$q7 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : (_pluginInjectionApi$q9 = _pluginInjectionApi$q8.sharedState.currentState()) === null || _pluginInjectionApi$q9 === void 0 ? void 0 : _pluginInjectionApi$q9.suggestions) !== null && _pluginInjectionApi$q7 !== void 0 ? _pluginInjectionApi$q7 : [];
+      })) !== null && _pluginInjectionApi$q4 !== void 0 ? _pluginInjectionApi$q4 : [];
       result = quickInsertDropdownItems.concat(featuredQuickInsertSuggestions);
     }
     setItemCount(result.length);
     return result;
-  }, [pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q10 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q10 === void 0 ? void 0 : _pluginInjectionApi$q10.commands, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q11 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q11 === void 0 ? void 0 : _pluginInjectionApi$q11.sharedState, quickInsertDropdownItems]);
-  var emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q12 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q12 === void 0 ? void 0 : (_pluginInjectionApi$q13 = _pluginInjectionApi$q12.sharedState.currentState()) === null || _pluginInjectionApi$q13 === void 0 ? void 0 : _pluginInjectionApi$q13.emptyStateHandler;
+  }, [pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions, quickInsertDropdownItems]);
+  var emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q7 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q7 === void 0 ? void 0 : (_pluginInjectionApi$q8 = _pluginInjectionApi$q7.sharedState.currentState()) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : _pluginInjectionApi$q8.emptyStateHandler;
   return (0, _react2.jsx)("div", {
     css: function css(theme) {
       return insertMenuWrapper(theme, itemCount);

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "187.32.7";
+var version = "187.33.0";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/es2019/plugins/help-dialog/index.js

@@ -2,7 +2,6 @@ import React from 'react';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { bindKeymapWithCommand, openHelp, tooltip } from '@atlaskit/editor-common/keymaps';
-import WithPluginState from '../../ui/WithPluginState';
 import { HelpDialogLoader } from './ui/HelpDialogLoader';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import QuestionCircleIcon from '@atlaskit/icon/glyph/question-circle';
@@ -87,19 +86,17 @@ const helpDialog = ({
   contentComponent({
     editorView
   }) {
-    return /*#__PURE__*/React.createElement(WithPluginState, {
-      plugins: {
-        helpDialog: pluginKey
-      },
-      render: ({
-        helpDialog = {}
-      }) => /*#__PURE__*/React.createElement(HelpDialogLoader, {
-        editorView: editorView,
-        isVisible: helpDialog.isVisible,
-        quickInsertEnabled: !!(api !== null && api !== void 0 && api.quickInsert),
-        imageEnabled: helpDialog.imageEnabled
-      })
+    return /*#__PURE__*/React.createElement(HelpDialogLoader, {
+      pluginInjectionApi: api,
+      editorView: editorView,
+      quickInsertEnabled: !!(api !== null && api !== void 0 && api.quickInsert)
     });
+  },
+  getSharedState(editorState) {
+    if (!editorState) {
+      return null;
+    }
+    return pluginKey.getState(editorState) || null;
   }
 });
 const keymapPlugin = editorAnalyticsAPI => {

package/dist/es2019/plugins/help-dialog/ui/index.js

@@ -1,7 +1,6 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
-import React from 'react';
+import { useCallback, useEffect } from 'react';
 import { jsx } from '@emotion/react';
 import { injectIntl, defineMessages, FormattedMessage } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/utils';
@@ -17,6 +16,7 @@ import { messages as undoRedoMessages } from '../../undo-redo/messages';
 import { alignmentMessages } from '../../../ui/Alignment/messages';
 import { closeHelpCommand } from '../commands';
 import { annotationMessages } from '../../annotation/toolbar';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 const messages = defineMessages({
   editorHelp: {
     id: 'fabric.editor.editorHelp',
@@ -365,73 +365,68 @@ const ModalFooter = () => jsx("div", {
     keyMap: getComponentFromKeymap(openHelp)
   }
 })));
-class HelpDialog extends React.Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "formatting", []);
-    _defineProperty(this, "closeDialog", () => {
-      const {
-        state: {
-          tr
-        },
-        dispatch
-      } = this.props.editorView;
-      closeHelpCommand(tr, dispatch);
-    });
-    _defineProperty(this, "handleEsc", e => {
-      if (e.key === 'Escape' && this.props.isVisible) {
-        this.closeDialog();
-      }
-    });
-  }
-  componentDidMount() {
-    document.addEventListener('keydown', this.handleEsc);
-  }
-  componentWillUnmount() {
-    document.removeEventListener('keydown', this.handleEsc);
-  }
-  render() {
+const HelpDialog = ({
+  pluginInjectionApi,
+  editorView,
+  quickInsertEnabled,
+  intl
+}) => {
+  const {
+    helpDialogState
+  } = useSharedPluginState(pluginInjectionApi, ['helpDialog']);
+  const closeDialog = useCallback(() => {
     const {
-      editorView,
-      intl,
-      imageEnabled,
-      quickInsertEnabled
-    } = this.props;
-    this.formatting = getSupportedFormatting(editorView.state.schema, intl, imageEnabled, quickInsertEnabled);
-    return jsx(ModalTransition, null, this.props.isVisible ? jsx(AkModalDialog, {
-      width: "large",
-      onClose: this.closeDialog,
-      testId: "help-modal-dialog"
-    }, jsx(ModalHeader, null), jsx("div", {
-      css: contentWrapper
-    }, jsx("div", {
-      css: line
-    }), jsx("div", {
-      css: content
-    }, jsx("div", {
-      css: column
-    }, jsx("h2", {
-      css: title
-    }, jsx(FormattedMessage, messages.keyboardShortcuts)), jsx("ul", null, this.formatting.filter(form => {
-      const keymap = form.keymap && form.keymap(this.props);
-      return keymap && keymap[browser.mac ? 'mac' : 'windows'];
-    }).map(form => jsx("li", {
-      css: row,
-      key: `textFormatting-${form.name}`
-    }, jsx("span", null, form.name), getComponentFromKeymap(form.keymap()))), this.formatting.filter(form => shortcutNamesWithoutKeymap.indexOf(form.type) !== -1).filter(form => form.autoFormatting).map(form => jsx("li", {
-      css: row,
-      key: `autoFormatting-${form.name}`
-    }, jsx("span", null, form.name), form.autoFormatting())))), jsx("div", {
-      css: line
-    }), jsx("div", {
-      css: column
-    }, jsx("h2", {
-      css: title
-    }, jsx(FormattedMessage, messages.markdown)), jsx("ul", null, this.formatting.filter(form => shortcutNamesWithoutKeymap.indexOf(form.type) === -1).map(form => form.autoFormatting && jsx("li", {
-      key: `autoFormatting-${form.name}`,
-      css: row
-    }, jsx("span", null, form.name), form.autoFormatting())))))), jsx(ModalFooter, null)) : null);
-  }
-}
-_defineProperty(HelpDialog, "displayName", 'HelpDialog');
+      state: {
+        tr
+      },
+      dispatch
+    } = editorView;
+    closeHelpCommand(tr, dispatch);
+  }, [editorView]);
+  const handleEsc = useCallback(e => {
+    if (e.key === 'Escape' && helpDialogState !== null && helpDialogState !== void 0 && helpDialogState.isVisible) {
+      closeDialog();
+    }
+  }, [closeDialog, helpDialogState === null || helpDialogState === void 0 ? void 0 : helpDialogState.isVisible]);
+  useEffect(() => {
+    document.addEventListener('keydown', handleEsc);
+    return () => {
+      document.removeEventListener('keydown', handleEsc);
+    };
+  }, [handleEsc]);
+  const formatting = getSupportedFormatting(editorView.state.schema, intl, helpDialogState === null || helpDialogState === void 0 ? void 0 : helpDialogState.imageEnabled, quickInsertEnabled);
+  return jsx(ModalTransition, null, helpDialogState !== null && helpDialogState !== void 0 && helpDialogState.isVisible ? jsx(AkModalDialog, {
+    width: "large",
+    onClose: closeDialog,
+    testId: "help-modal-dialog"
+  }, jsx(ModalHeader, null), jsx("div", {
+    css: contentWrapper
+  }, jsx("div", {
+    css: line
+  }), jsx("div", {
+    css: content
+  }, jsx("div", {
+    css: column
+  }, jsx("h2", {
+    css: title
+  }, jsx(FormattedMessage, messages.keyboardShortcuts)), jsx("ul", null, formatting.filter(form => {
+    const keymap = form.keymap && form.keymap();
+    return keymap && keymap[browser.mac ? 'mac' : 'windows'];
+  }).map(form => jsx("li", {
+    css: row,
+    key: `textFormatting-${form.name}`
+  }, jsx("span", null, form.name), getComponentFromKeymap(form.keymap()))), formatting.filter(form => shortcutNamesWithoutKeymap.indexOf(form.type) !== -1).filter(form => form.autoFormatting).map(form => jsx("li", {
+    css: row,
+    key: `autoFormatting-${form.name}`
+  }, jsx("span", null, form.name), form.autoFormatting())))), jsx("div", {
+    css: line
+  }), jsx("div", {
+    css: column
+  }, jsx("h2", {
+    css: title
+  }, jsx(FormattedMessage, messages.markdown)), jsx("ul", null, formatting.filter(form => shortcutNamesWithoutKeymap.indexOf(form.type) === -1).map(form => form.autoFormatting && jsx("li", {
+    key: `autoFormatting-${form.name}`,
+    css: row
+  }, jsx("span", null, form.name), form.autoFormatting())))))), jsx(ModalFooter, null)) : null);
+};
 export default injectIntl(HelpDialog);

package/dist/es2019/plugins/media/ui/MediaPicker/ClipboardWrapper.js

@@ -3,7 +3,8 @@ import PickerFacadeProvider from './PickerFacadeProvider';
 import { Clipboard } from '@atlaskit/media-picker';
 export const ClipboardWrapper = ({
   mediaState,
-  featureFlags
+  featureFlags,
+  container
 }) => /*#__PURE__*/React.createElement(PickerFacadeProvider, {
   mediaState: mediaState,
   analyticsName: "clipboard"
@@ -11,11 +12,21 @@ export const ClipboardWrapper = ({
   mediaClientConfig,
   config,
   pickerFacadeInstance
-}) => /*#__PURE__*/React.createElement(Clipboard, {
-  mediaClientConfig: mediaClientConfig,
-  config: config,
-  onError: pickerFacadeInstance.handleUploadError,
-  onPreviewUpdate: pickerFacadeInstance.handleUploadPreviewUpdate,
-  onEnd: pickerFacadeInstance.handleReady,
-  featureFlags: featureFlags
-}));
+}) => {
+  const clipboardConfig = Object.assign({}, config);
+  if ((featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.securedClipboard) === true) {
+    clipboardConfig.container = container;
+    clipboardConfig.onPaste = event => {
+      event.stopPropagation();
+      return false;
+    };
+  }
+  return /*#__PURE__*/React.createElement(Clipboard, {
+    mediaClientConfig: mediaClientConfig,
+    config: clipboardConfig,
+    onError: pickerFacadeInstance.handleUploadError,
+    onPreviewUpdate: pickerFacadeInstance.handleUploadPreviewUpdate,
+    onEnd: pickerFacadeInstance.handleReady,
+    featureFlags: featureFlags
+  });
+});

package/dist/es2019/plugins/media/ui/MediaPicker/index.js

@@ -16,9 +16,11 @@ const MediaPicker = ({
     focusState
   } = useSharedPluginState(api, ['focus']);
   const featureFlags = mediaState.mediaOptions && mediaState.mediaOptions.featureFlags;
+  const container = editorDomElement;
   const clipboard = focusState !== null && focusState !== void 0 && focusState.hasFocus ? /*#__PURE__*/React.createElement(ClipboardWrapper, {
     mediaState: mediaState,
-    featureFlags: featureFlags
+    featureFlags: featureFlags,
+    container: container
   }) : null;
   return /*#__PURE__*/React.createElement(React.Fragment, null, clipboard, /*#__PURE__*/React.createElement(DropzoneWrapper, {
     mediaState: mediaState,

package/dist/es2019/plugins/quick-insert/index.js

@@ -2,12 +2,13 @@ import React from 'react';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { TypeAheadAvailableNodes } from '@atlaskit/editor-common/type-ahead';
 import { pluginKey } from './plugin-key';
-import { search } from './search';
 import ModalElementBrowser from './ui/ModalElementBrowser';
 import { openElementBrowserModal, insertItem } from './commands';
-import { memoProcessQuickInsertItems, getQuickInsertSuggestions } from '@atlaskit/editor-common/quick-insert';
+import { memoProcessQuickInsertItems } from '@atlaskit/editor-common/quick-insert';
+import { getQuickInsertSuggestions } from './search';
 const quickInsertPlugin = ({
-  config: options
+  config: options,
+  api
 }) => ({
   name: 'quickInsert',
   pmPlugins(defaultItems) {
@@ -32,13 +33,9 @@ const quickInsertPlugin = ({
       }) {
         const quickInsertState = pluginKey.getState(editorState);
         return Promise.resolve(getQuickInsertSuggestions({
-          searchOptions: {
-            query,
-            disableDefaultItems: options === null || options === void 0 ? void 0 : options.disableDefaultItems
-          },
-          lazyDefaultItems: quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.lazyDefaultItems,
-          providedItems: quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.providedItems
-        }));
+          query,
+          disableDefaultItems: options === null || options === void 0 ? void 0 : options.disableDefaultItems
+        }, quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.lazyDefaultItems, quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.providedItems));
       },
       selectItem: (state, item, insert) => {
         return item.action(insert, state);
@@ -57,7 +54,6 @@ const quickInsertPlugin = ({
     return null;
   },
   getSharedState(editorState) {
-    var _quickInsertState$sug;
     if (!editorState) {
       return null;
     }
@@ -66,16 +62,23 @@ const quickInsertPlugin = ({
       return null;
     }
     return {
-      suggestions: (_quickInsertState$sug = quickInsertState.suggestions) !== null && _quickInsertState$sug !== void 0 ? _quickInsertState$sug : [],
       lazyDefaultItems: quickInsertState.lazyDefaultItems,
-      emptyStateHandler: quickInsertState.emptyStateHandler
+      emptyStateHandler: quickInsertState.emptyStateHandler,
+      providedItems: quickInsertState.providedItems
     };
   },
   actions: {
-    insertItem
+    insertItem,
+    getSuggestions: searchOptions => {
+      var _api$quickInsert$shar;
+      const {
+        lazyDefaultItems,
+        providedItems
+      } = (_api$quickInsert$shar = api === null || api === void 0 ? void 0 : api.quickInsert.sharedState.currentState()) !== null && _api$quickInsert$shar !== void 0 ? _api$quickInsert$shar : {};
+      return getQuickInsertSuggestions(searchOptions, lazyDefaultItems, providedItems);
+    }
   },
   commands: {
-    search,
     openElementBrowserModal
   }
 });
@@ -97,20 +100,12 @@ function quickInsertPluginFactory(defaultItems, providerFactory, getIntl, dispat
           // lazy so it doesn't run on editor initialization
           // memo here to avoid using a singleton cache, avoids editor
           // getting confused when two editors exist within the same page.
-          lazyDefaultItems: () => memoProcessQuickInsertItems(defaultItems || [], getIntl()),
-          suggestions: []
+          lazyDefaultItems: () => memoProcessQuickInsertItems(defaultItems || [], getIntl())
         };
       },
       apply(tr, pluginState) {
         const meta = tr.getMeta(pluginKey);
         if (meta) {
-          if ('searchOptions' in meta) {
-            meta.suggestions = getQuickInsertSuggestions({
-              searchOptions: meta.searchOptions,
-              lazyDefaultItems: pluginState.lazyDefaultItems,
-              providedItems: pluginState.providedItems
-            });
-          }
           const keys = Object.keys(meta);
           const changed = keys.some(key => {
             return pluginState[key] !== meta[key];

package/dist/es2019/plugins/quick-insert/search.js

@@ -1,16 +1,16 @@
-import { pluginKey } from './plugin-key';
-export const search = ({
-  query,
-  category,
-  disableDefaultItems,
-  featuredItems
-}) => ({
-  tr
-}) => tr.setMeta(pluginKey, {
-  searchOptions: {
+import { dedupe } from '@atlaskit/editor-common/utils';
+import { find } from '@atlaskit/editor-common/quick-insert';
+export const getQuickInsertSuggestions = (searchOptions, lazyDefaultItems = () => [], providedItems) => {
+  const {
     query,
     category,
     disableDefaultItems,
     featuredItems
+  } = searchOptions;
+  const defaultItems = disableDefaultItems ? [] : lazyDefaultItems();
+  const items = providedItems ? dedupe([...defaultItems, ...providedItems], item => item.title) : defaultItems;
+  if (featuredItems) {
+    return items.filter(item => item.featured);
   }
-});
+  return find(query || '', category === 'all' || !category ? items : items.filter(item => item.categories && item.categories.includes(category)));
+};

package/dist/es2019/plugins/quick-insert/ui/ModalElementBrowser/index.js

@@ -3,20 +3,16 @@ import WithPluginState from '../../../../ui/WithPluginState';
 import { pluginKey } from '../../plugin-key';
 import ModalElementBrowser from '../../../../ui/ElementBrowser/ModalElementBrowser';
 import { closeElementBrowserModal, insertItem } from '../../commands';
-import { getQuickInsertSuggestions } from '@atlaskit/editor-common/quick-insert';
+import { getQuickInsertSuggestions } from '../../search';
 const Modal = ({
   quickInsertState,
   editorView,
   helpUrl
 }) => {
   const getItems = useCallback((query, category) => getQuickInsertSuggestions({
-    searchOptions: {
-      query,
-      category
-    },
-    lazyDefaultItems: quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.lazyDefaultItems,
-    providedItems: quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.providedItems
-  }), [quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.lazyDefaultItems, quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.providedItems]);
+    query,
+    category
+  }, quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.lazyDefaultItems, quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.providedItems), [quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.lazyDefaultItems, quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.providedItems]);
   const focusInEditor = useCallback(() => {
     if (!editorView.hasFocus()) {
       editorView.focus();

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

@@ -6,11 +6,12 @@ import { css, jsx } from '@emotion/react';
 import Transition from 'react-transition-group/Transition';
 import { N30 } from '@atlaskit/theme/colors';
 import { akEditorSwoopCubicBezier, akEditorDefaultLayoutWidth, akEditorWideLayoutWidth, akEditorBreakoutPadding, akEditorContextPanelWidth, ATLASSIAN_NAVIGATION_HEIGHT } from '@atlaskit/editor-shared-styles';
-import { ContextPanelConsumer } from '@atlaskit/editor-common/ui';
+import { ContextPanelConsumer, WidthContext } from '@atlaskit/editor-common/ui';
 import WithPluginState from '../WithPluginState';
 import WithEditorActions from '../WithEditorActions';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { getChildBreakoutModes } from '../../utils/document';
-import { WidthContext } from '@atlaskit/editor-common/ui';
+import { findChildrenByType } from '@atlaskit/editor-prosemirror/utils';
 const ANIM_SPEED_MS = 500;
 const EDITOR_WIDTH = akEditorDefaultLayoutWidth + akEditorBreakoutPadding;
 const WIDE_EDITOR_WIDTH = akEditorWideLayoutWidth + akEditorBreakoutPadding;
@@ -21,7 +22,12 @@ const absolutePanelStyles = css`
   right: 0;
   height: calc(100% - ${ATLASSIAN_NAVIGATION_HEIGHT});
 `;
-export const shouldPanelBePositionedOverEditor = (editorWidth, panelWidth) => {
+const checkTableExistsInDoc = editorView => {
+  const tableNodeSchema = editorView.state.schema.nodes.table;
+  let findResult = findChildrenByType(editorView.state.doc, tableNodeSchema);
+  return findResult.length > 0;
+};
+export const shouldPanelBePositionedOverEditor = (editorWidth, panelWidth, editorView) => {
   const {
     lineLength,
     containerWidth = 0,
@@ -30,7 +36,17 @@ export const shouldPanelBePositionedOverEditor = (editorWidth, panelWidth) => {
   const editorNotFullWidth = !(lineLength && lineLength > akEditorDefaultLayoutWidth);
   const hasSpaceForPanel = !contentBreakoutModes.length && containerWidth >= panelWidth * 2 + EDITOR_WIDTH;
   const hasSpaceForWideBreakoutsAndPanel = !contentBreakoutModes.includes(FULLWIDTH_MODE) && contentBreakoutModes.includes(WIDE_MODE) && containerWidth >= panelWidth * 2 + WIDE_EDITOR_WIDTH;
-  return editorNotFullWidth && (hasSpaceForPanel || hasSpaceForWideBreakoutsAndPanel);
+  if (!getBooleanFF('platform.editor.custom-table-width') || !editorView) {
+    return editorNotFullWidth && (hasSpaceForPanel || hasSpaceForWideBreakoutsAndPanel);
+  } else {
+    // when custom table width feature flag is on,
+    // there are scenarios when a table has attr layout default, but width is in full-width or very wide
+    // but in this case we still want the shouldPanelBePositionedOverEditor return false
+    // previous logic is returning false when table layout default
+    // but when custom table width feature flag is one, we want to return false whenever there is a table in the doc
+    const isTableInDoc = checkTableExistsInDoc(editorView);
+    return editorNotFullWidth && (hasSpaceForPanel || hasSpaceForWideBreakoutsAndPanel) && !isTableInDoc;
+  }
 };
 const panelHidden = css`
   width: 0;
@@ -122,7 +138,8 @@ export class SwappableContentArea extends React.PureComponent {
   }
   render() {
     const {
-      editorWidth
+      editorWidth,
+      editorView
     } = this.props;
     const width = akEditorContextPanelWidth;
     const userVisible = !!this.props.visible;
@@ -133,7 +150,7 @@ export class SwappableContentArea extends React.PureComponent {
       positionedOverEditor
     }) => {
       const contextPanelWidth = visible ? width : 0;
-      const newPosition = editorWidth ? shouldPanelBePositionedOverEditor(editorWidth, width) : false;
+      const newPosition = editorWidth ? shouldPanelBePositionedOverEditor(editorWidth, width, editorView) : false;
       broadcastWidth(contextPanelWidth);
       (newPosition && visible) !== positionedOverEditor && broadcastPosition(newPosition && visible);
       return jsx("div", {

package/dist/es2019/ui/ElementBrowser/InsertMenu.js

@@ -20,7 +20,7 @@ const InsertMenu = ({
   toggleVisiblity,
   pluginInjectionApi
 }) => {
-  var _pluginInjectionApi$q10, _pluginInjectionApi$q11, _pluginInjectionApi$q12, _pluginInjectionApi$q13;
+  var _pluginInjectionApi$q6, _pluginInjectionApi$q7, _pluginInjectionApi$q8;
   const [itemCount, setItemCount] = useState(0);
   const transform = useCallback(item => ({
     title: item.content,
@@ -59,25 +59,23 @@ const InsertMenu = ({
      * @see above transform function for more details.
      */
     if (query) {
-      var _pluginInjectionApi$q2, _pluginInjectionApi$q3, _pluginInjectionApi$q4, _pluginInjectionApi$q5;
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q2 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q2 === void 0 ? void 0 : _pluginInjectionApi$q2.commands.search({
+      var _pluginInjectionApi$q2, _pluginInjectionApi$q3;
+      result = (_pluginInjectionApi$q2 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q3 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q3 === void 0 ? void 0 : _pluginInjectionApi$q3.actions.getSuggestions({
         query,
         category
-      }));
-      result = (_pluginInjectionApi$q3 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q4 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q4 === void 0 ? void 0 : (_pluginInjectionApi$q5 = _pluginInjectionApi$q4.sharedState.currentState()) === null || _pluginInjectionApi$q5 === void 0 ? void 0 : _pluginInjectionApi$q5.suggestions) !== null && _pluginInjectionApi$q3 !== void 0 ? _pluginInjectionApi$q3 : [];
+      })) !== null && _pluginInjectionApi$q2 !== void 0 ? _pluginInjectionApi$q2 : [];
     } else {
-      var _pluginInjectionApi$q6, _pluginInjectionApi$q7, _pluginInjectionApi$q8, _pluginInjectionApi$q9;
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.commands.search({
+      var _pluginInjectionApi$q4, _pluginInjectionApi$q5;
+      const featuredQuickInsertSuggestions = (_pluginInjectionApi$q4 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q5 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q5 === void 0 ? void 0 : _pluginInjectionApi$q5.actions.getSuggestions({
         category,
         featuredItems: true
-      }));
-      const featuredQuickInsertSuggestions = (_pluginInjectionApi$q7 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q8 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : (_pluginInjectionApi$q9 = _pluginInjectionApi$q8.sharedState.currentState()) === null || _pluginInjectionApi$q9 === void 0 ? void 0 : _pluginInjectionApi$q9.suggestions) !== null && _pluginInjectionApi$q7 !== void 0 ? _pluginInjectionApi$q7 : [];
+      })) !== null && _pluginInjectionApi$q4 !== void 0 ? _pluginInjectionApi$q4 : [];
       result = quickInsertDropdownItems.concat(featuredQuickInsertSuggestions);
     }
     setItemCount(result.length);
     return result;
-  }, [pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.core.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q10 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q10 === void 0 ? void 0 : _pluginInjectionApi$q10.commands, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q11 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q11 === void 0 ? void 0 : _pluginInjectionApi$q11.sharedState, quickInsertDropdownItems]);
-  const emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q12 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q12 === void 0 ? void 0 : (_pluginInjectionApi$q13 = _pluginInjectionApi$q12.sharedState.currentState()) === null || _pluginInjectionApi$q13 === void 0 ? void 0 : _pluginInjectionApi$q13.emptyStateHandler;
+  }, [pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q6 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q6 === void 0 ? void 0 : _pluginInjectionApi$q6.actions, quickInsertDropdownItems]);
+  const emptyStateHandler = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$q7 = pluginInjectionApi.quickInsert) === null || _pluginInjectionApi$q7 === void 0 ? void 0 : (_pluginInjectionApi$q8 = _pluginInjectionApi$q7.sharedState.currentState()) === null || _pluginInjectionApi$q8 === void 0 ? void 0 : _pluginInjectionApi$q8.emptyStateHandler;
   return jsx("div", {
     css: theme => insertMenuWrapper(theme, itemCount)
   }, jsx(ElementBrowserWrapper, {

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "187.32.7";
+export const version = "187.33.0";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/plugins/help-dialog/index.js

@@ -5,7 +5,6 @@ import React from 'react';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { bindKeymapWithCommand, openHelp, tooltip } from '@atlaskit/editor-common/keymaps';
-import WithPluginState from '../../ui/WithPluginState';
 import { HelpDialogLoader } from './ui/HelpDialogLoader';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import QuestionCircleIcon from '@atlaskit/icon/glyph/question-circle';
@@ -93,21 +92,17 @@ var helpDialog = function helpDialog(_ref) {
     },
     contentComponent: function contentComponent(_ref4) {
       var editorView = _ref4.editorView;
-      return /*#__PURE__*/React.createElement(WithPluginState, {
-        plugins: {
-          helpDialog: pluginKey
-        },
-        render: function render(_ref5) {
-          var _ref5$helpDialog = _ref5.helpDialog,
-            helpDialog = _ref5$helpDialog === void 0 ? {} : _ref5$helpDialog;
-          return /*#__PURE__*/React.createElement(HelpDialogLoader, {
-            editorView: editorView,
-            isVisible: helpDialog.isVisible,
-            quickInsertEnabled: !!(api !== null && api !== void 0 && api.quickInsert),
-            imageEnabled: helpDialog.imageEnabled
-          });
-        }
+      return /*#__PURE__*/React.createElement(HelpDialogLoader, {
+        pluginInjectionApi: api,
+        editorView: editorView,
+        quickInsertEnabled: !!(api !== null && api !== void 0 && api.quickInsert)
       });
+    },
+    getSharedState: function getSharedState(editorState) {
+      if (!editorState) {
+        return null;
+      }
+      return pluginKey.getState(editorState) || null;
     }
   };
 };