@atlaskit/editor-core 183.1.1 → 184.0.0

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

@@ -6,7 +6,7 @@ import { openHelp, tooltip } from '../../keymaps';
 import WithPluginState from '../../ui/WithPluginState';
 import { HelpDialogLoader } from './ui/HelpDialogLoader';
 import { pluginKey as quickInsertPluginKey } from '../quick-insert';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../../plugins/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import QuestionCircleIcon from '@atlaskit/icon/glyph/question-circle';
 import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 import { openHelpCommand } from './commands';
@@ -37,7 +37,7 @@ export function createPlugin(dispatch, imageEnabled) {
     }
   });
 }
-const helpDialog = (imageUploadProviderExists = false) => ({
+const helpDialog = (imageUploadProviderExists = false, api) => ({
   name: 'helpDialog',
   pmPlugins() {
     return [{
@@ -47,7 +47,10 @@ const helpDialog = (imageUploadProviderExists = false) => ({
       }) => createPlugin(dispatch, imageUploadProviderExists)
     }, {
       name: 'helpDialogKeymap',
-      plugin: () => keymapPlugin()
+      plugin: () => {
+        var _api$dependencies$ana;
+        return keymapPlugin(api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions);
+      }
     }];
   },
   pluginsOptions: {
@@ -63,10 +66,11 @@ const helpDialog = (imageUploadProviderExists = false) => ({
       icon: () => /*#__PURE__*/React.createElement(QuestionCircleIcon, {
         label: ""
       }),
-      action(insert, state) {
+      action(insert) {
+        var _api$dependencies$ana2;
         const tr = insert('');
         openHelpCommand(tr);
-        return addAnalytics(state, tr, {
+        api === null || api === void 0 ? void 0 : (_api$dependencies$ana2 = api.dependencies.analytics) === null || _api$dependencies$ana2 === void 0 ? void 0 : _api$dependencies$ana2.actions.attachAnalyticsEvent({
           action: ACTION.HELP_OPENED,
           actionSubject: ACTION_SUBJECT.HELP,
           actionSubjectId: ACTION_SUBJECT_ID.HELP_QUICK_INSERT,
@@ -74,7 +78,8 @@ const helpDialog = (imageUploadProviderExists = false) => ({
             inputMethod: INPUT_METHOD.QUICK_INSERT
           },
           eventType: EVENT_TYPE.UI
-        });
+        })(tr);
+        return tr;
       }
     }]
   },
@@ -98,7 +103,7 @@ const helpDialog = (imageUploadProviderExists = false) => ({
     });
   }
 });
-const keymapPlugin = () => {
+const keymapPlugin = editorAnalyticsAPI => {
   const list = {};
   keymaps.bindKeymapWithCommand(keymaps.openHelp.common, (state, dispatch) => {
     let {
@@ -106,7 +111,7 @@ const keymapPlugin = () => {
     } = state;
     const isVisible = tr.getMeta(pluginKey);
     if (!isVisible) {
-      tr = addAnalytics(state, tr, {
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
         action: ACTION.CLICKED,
         actionSubject: ACTION_SUBJECT.BUTTON,
         actionSubjectId: ACTION_SUBJECT_ID.BUTTON_HELP,
@@ -114,7 +119,7 @@ const keymapPlugin = () => {
           inputMethod: INPUT_METHOD.SHORTCUT
         },
         eventType: EVENT_TYPE.UI
-      });
+      })(tr);
       openHelpCommand(tr, dispatch);
     }
     return true;

package/dist/es2019/plugins/index.js

@@ -33,11 +33,9 @@ export { default as textColorPlugin } from './text-color';
 export { default as textFormattingPlugin } from './text-formatting';
 export { default as typeAheadPlugin } from './type-ahead';
 export { default as unsupportedContentPlugin } from './unsupported-content';
-export { default as widthPlugin } from './width';
 export { default as cardPlugin } from './card';
 export { default as floatingToolbarPlugin } from './floating-toolbar';
 export { default as statusPlugin } from './status';
-export { default as gridPlugin } from './grid';
 export { default as breakoutPlugin } from './breakout';
 export { default as alignmentPlugin } from './alignment';
 export { default as dataConsumerMarkPlugin } from './data-consumer';

package/dist/es2019/plugins/layout/pm-plugins/main.js

@@ -134,7 +134,6 @@ export default (options => new SafePlugin({
       tr = fixColumnStructure(newState) || tr;
       if (tr.docChanged) {
         tr.setSelection(Selection.fromJSON(tr.doc, selection));
-        tr.setMeta('addToHistory', false);
         return tr;
       }
     }

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

@@ -14,19 +14,26 @@ import ToolbarMedia from './ui/ToolbarMedia';
 import { ReactMediaGroupNode } from './nodeviews/mediaGroup';
 import { ReactMediaSingleNode } from './nodeviews/mediaSingle';
 import { floatingToolbar } from './toolbar';
-import { addAnalytics, ACTION, ACTION_SUBJECT, INPUT_METHOD, EVENT_TYPE, ACTION_SUBJECT_ID } from '../analytics';
+import { ACTION, ACTION_SUBJECT, INPUT_METHOD, EVENT_TYPE, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
 import { IconImages } from '../quick-insert/assets';
 import WithPluginState from '../../ui/WithPluginState';
 import { MediaPickerComponents } from './ui/MediaPicker';
 import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 import { ReactMediaNode } from './nodeviews/mediaNodeView';
 import { ReactMediaInlineNode } from './nodeviews/mediaInline';
+import { stateKey } from './pm-plugins/plugin-key';
 export { insertMediaSingleNode } from './utils/media-single';
 const mediaPlugin = (options = {}, api) => {
   var _api$dependencies, _api$dependencies$fea;
   const featureFlags = (api === null || api === void 0 ? void 0 : (_api$dependencies = api.dependencies) === null || _api$dependencies === void 0 ? void 0 : (_api$dependencies$fea = _api$dependencies.featureFlags) === null || _api$dependencies$fea === void 0 ? void 0 : _api$dependencies$fea.sharedState.currentState()) || {};
   return {
     name: 'media',
+    getSharedState(editorState) {
+      if (!editorState) {
+        return null;
+      }
+      return stateKey.getState(editorState);
+    },
     nodes() {
       const {
         allowMediaGroup = true,
@@ -80,7 +87,7 @@ const mediaPlugin = (options = {}, api) => {
             nodeViews: {
               mediaGroup: ReactMediaGroupNode(portalProviderAPI, eventDispatcher, providerFactory, options),
               mediaSingle: ReactMediaSingleNode(portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent, options, api),
-              media: ReactMediaNode(portalProviderAPI, eventDispatcher, providerFactory, options),
+              media: ReactMediaNode(portalProviderAPI, eventDispatcher, providerFactory, options, api),
               mediaInline: ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory)
             },
             errorReporter,
@@ -207,9 +214,11 @@ const mediaPlugin = (options = {}, api) => {
         keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video'],
         icon: () => /*#__PURE__*/React.createElement(IconImages, null),
         action(insert, state) {
+          var _api$dependencies$ana;
           const pluginState = pluginKey.getState(state);
           pluginState.showMediaPicker();
-          return addAnalytics(state, insert(''), {
+          const tr = insert('');
+          api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions.attachAnalyticsEvent({
             action: ACTION.OPENED,
             actionSubject: ACTION_SUBJECT.PICKER,
             actionSubjectId: ACTION_SUBJECT_ID.PICKER_CLOUD,
@@ -217,7 +226,8 @@ const mediaPlugin = (options = {}, api) => {
               inputMethod: INPUT_METHOD.QUICK_INSERT
             },
             eventType: EVENT_TYPE.UI
-          });
+          })(tr);
+          return tr;
         }
       }],
       floatingToolbar: (state, intl, providerFactory) => floatingToolbar(state, intl, {
@@ -229,7 +239,7 @@ const mediaPlugin = (options = {}, api) => {
         allowAdvancedToolBarOptions: options && options.allowAdvancedToolBarOptions,
         allowAltTextOnImages: options && options.allowAltTextOnImages,
         altTextValidator: options && options.altTextValidator
-      })
+      }, api)
     }
   };
 };

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

@@ -4,11 +4,21 @@ import { DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-comm
 import { NodeSelection } from 'prosemirror-state';
 import React from 'react';
 import { SelectionBasedNodeView } from '../../../../nodeviews';
-import WithPluginState from '../../../../ui/WithPluginState';
-import { pluginKey as widthPluginKey } from '../../../width';
 import MediaNode from './media';
 import { getAttrsFromUrl } from '@atlaskit/media-client';
 import { isMediaBlobUrlFromAttrs } from '../../utils/media-common';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+const MediaNodeWithProviders = ({
+  pluginInjectionApi,
+  innerComponent
+}) => {
+  const {
+    widthState
+  } = useSharedPluginState(pluginInjectionApi, ['width']);
+  return innerComponent({
+    width: widthState
+  });
+};
 class MediaNodeView extends SelectionBasedNodeView {
   constructor(...args) {
     super(...args);
@@ -69,12 +79,12 @@ class MediaNodeView extends SelectionBasedNodeView {
       mediaProvider,
       contextIdentifierProvider
     }) => {
-      return /*#__PURE__*/React.createElement(WithPluginState, {
-        editorView: this.view,
-        plugins: {
-          width: widthPluginKey
-        },
-        render: this.renderMediaNodeWithState(mediaProvider, contextIdentifierProvider)
+      const {
+        pluginInjectionApi
+      } = this.reactComponentProps;
+      return /*#__PURE__*/React.createElement(MediaNodeWithProviders, {
+        pluginInjectionApi: pluginInjectionApi,
+        innerComponent: this.renderMediaNodeWithState(mediaProvider, contextIdentifierProvider)
       });
     });
   }
@@ -124,11 +134,12 @@ class MediaNodeView extends SelectionBasedNodeView {
     });
   }
 }
-export const ReactMediaNode = (portalProviderAPI, eventDispatcher, providerFactory, mediaOptions = {}) => (node, view, getPos) => {
+export const ReactMediaNode = (portalProviderAPI, eventDispatcher, providerFactory, mediaOptions = {}, pluginInjectionApi) => (node, view, getPos) => {
   const hasIntlContext = true;
   return new MediaNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {
     eventDispatcher,
     providerFactory,
-    mediaOptions
+    mediaOptions,
+    pluginInjectionApi
   }, undefined, undefined, undefined, hasIntlContext).init();
 };

package/dist/es2019/plugins/media/nodeviews/mediaSingle.js

@@ -7,11 +7,9 @@ import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { MediaSingle, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/ui';
 import { browser } from '@atlaskit/editor-common/utils';
 import { isNodeSelectedOrInRange } from '../../../utils/nodes';
-import WithPluginState from '../../../ui/WithPluginState';
-import { pluginKey as widthPluginKey } from '../../width';
 import { setNodeSelection, setTextSelection } from '../../../utils';
 import ResizableMediaSingle from '../ui/ResizableMediaSingle';
-import { stateKey as mediaPluginKey, MEDIA_CONTENT_WRAP_CLASS_NAME } from '../pm-plugins/main';
+import { MEDIA_CONTENT_WRAP_CLASS_NAME } from '../pm-plugins/main';
 import { MediaNodeUpdater } from './mediaNodeUpdater';
 import { findParentNodeOfTypeClosestToPos } from 'prosemirror-utils';
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
@@ -24,6 +22,7 @@ import ReactNodeView from '../../../nodeviews/ReactNodeView';
 import CaptionPlaceholder from '../ui/CaptionPlaceholder';
 import { NodeSelection } from 'prosemirror-state';
 import { insertAndSelectCaptionFromMediaSinglePos } from '../commands/captions';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 export default class MediaSingleNode extends Component {
   constructor(...args) {
     super(...args);
@@ -158,12 +157,12 @@ export default class MediaSingleNode extends Component {
       (_this$captionPlaceHol = this.captionPlaceHolderRef.current) === null || _this$captionPlaceHol === void 0 ? void 0 : _this$captionPlaceHol.click();
     });
     _defineProperty(this, "displayGrid", (visible, gridType, highlight) => {
-      var _pluginInjectionApi$d, _pluginInjectionApi$d2;
+      var _pluginInjectionApi$d, _pluginInjectionApi$d2, _pluginInjectionApi$d3;
       const {
         pluginInjectionApi,
         view
       } = this.props;
-      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.grid) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions.displayGrid(view)({
+      pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies) === null || _pluginInjectionApi$d === void 0 ? void 0 : (_pluginInjectionApi$d2 = _pluginInjectionApi$d.grid) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : (_pluginInjectionApi$d3 = _pluginInjectionApi$d2.actions) === null || _pluginInjectionApi$d3 === void 0 ? void 0 : _pluginInjectionApi$d3.displayGrid(view)({
         visible,
         gridType,
         highlight: highlight
@@ -321,6 +320,42 @@ _defineProperty(MediaSingleNode, "defaultProps", {
   mediaOptions: {}
 });
 _defineProperty(MediaSingleNode, "displayName", 'MediaSingleNode');
+const MediaSingleNodeWrapper = ({
+  pluginInjectionApi,
+  mediaProvider,
+  contextIdentifierProvider,
+  node,
+  getPos,
+  mediaOptions,
+  view,
+  fullWidthMode,
+  selected,
+  eventDispatcher,
+  dispatchAnalyticsEvent,
+  forwardRef
+}) => {
+  const {
+    widthState,
+    mediaState
+  } = useSharedPluginState(pluginInjectionApi, ['width', 'media']);
+  return jsx(MediaSingleNode, {
+    width: widthState.width,
+    lineLength: widthState.lineLength,
+    node: node,
+    getPos: getPos,
+    mediaProvider: mediaProvider,
+    contextIdentifierProvider: contextIdentifierProvider,
+    mediaOptions: mediaOptions,
+    view: view,
+    fullWidthMode: fullWidthMode,
+    selected: selected,
+    eventDispatcher: eventDispatcher,
+    mediaPluginState: mediaState !== null && mediaState !== void 0 ? mediaState : undefined,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    forwardRef: forwardRef,
+    pluginInjectionApi: pluginInjectionApi
+  });
+};
 class MediaSingleNodeView extends ReactNodeView {
   constructor(...args) {
     super(...args);
@@ -404,34 +439,19 @@ class MediaSingleNodeView extends ReactNodeView {
         mediaProvider,
         contextIdentifierProvider
       }) => {
-        return jsx(WithPluginState, {
-          editorView: this.view,
-          plugins: {
-            width: widthPluginKey,
-            mediaPluginState: mediaPluginKey
-          },
-          render: ({
-            width,
-            mediaPluginState
-          }) => {
-            return jsx(MediaSingleNode, {
-              width: width.width,
-              lineLength: width.lineLength,
-              node: this.node,
-              getPos: getPos,
-              mediaProvider: mediaProvider,
-              contextIdentifierProvider: contextIdentifierProvider,
-              mediaOptions: mediaOptions,
-              view: this.view,
-              fullWidthMode: fullWidthMode,
-              selected: this.isNodeSelected,
-              eventDispatcher: eventDispatcher,
-              mediaPluginState: mediaPluginState,
-              dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-              forwardRef: forwardRef,
-              pluginInjectionApi: pluginInjectionApi
-            });
-          }
+        return jsx(MediaSingleNodeWrapper, {
+          pluginInjectionApi: pluginInjectionApi,
+          mediaProvider: mediaProvider,
+          contextIdentifierProvider: contextIdentifierProvider,
+          node: this.node,
+          getPos: getPos,
+          mediaOptions: mediaOptions,
+          view: this.view,
+          fullWidthMode: fullWidthMode,
+          selected: this.isNodeSelected,
+          eventDispatcher: eventDispatcher,
+          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+          forwardRef: forwardRef
         });
       }
     });

package/dist/es2019/plugins/media/styles.js

@@ -2,7 +2,7 @@ import { css } from '@emotion/react';
 import { mediaSingleSharedStyle, richMediaClassName } from '@atlaskit/editor-common/styles';
 import { akEditorDeleteBorder, akEditorDeleteBackground, akEditorSelectedBorderBoldSize, akEditorMediaResizeHandlerPaddingWide, akEditorMediaResizeHandlerPadding, akEditorSelectedNodeClassName, akEditorDeleteIconColor } from '@atlaskit/editor-shared-styles';
 import { N60, B200 } from '@atlaskit/theme/colors';
-import { fileCardImageViewSelector, fileCardImageViewSelectedSelector, inlinePlayerClassName, newFileExperienceClassName } from '@atlaskit/media-card';
+import { fileCardImageViewSelector, inlinePlayerClassName, newFileExperienceClassName } from '@atlaskit/media-card';
 export const mediaStyles = css`
   .ProseMirror {
     ${mediaSingleSharedStyle} & [layout='full-width'] .${richMediaClassName},
@@ -120,12 +120,6 @@ export const mediaStyles = css`
       ${`var(--ds-border-danger, ${akEditorDeleteBorder})`};
     transition: background-color 0s, box-shadow 0s;
   }
-  .mediaGroupView-content-wrap.danger {
-    /* Media inline */
-    .${fileCardImageViewSelectedSelector}::after {
-      border: 1px solid ${`var(--ds-border-danger, ${akEditorDeleteIconColor})`};
-    }
-  }
   /* Danger when nested node or common */
   .danger {
     /* Media single */

package/dist/es2019/plugins/media/toolbar/index.js

@@ -187,7 +187,7 @@ const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState) => {
   }];
   return items;
 };
-const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, mediaLinkingState, getEditorFeatureFlags) => {
+const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, mediaLinkingState, widthPluginDependencyApi, getEditorFeatureFlags) => {
   const {
     mediaSingle
   } = state.schema.nodes;
@@ -230,7 +230,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
     });
   }
   if (allowAdvancedToolBarOptions) {
-    toolbarButtons = [...toolbarButtons, ...buildLayoutButtons(state, intl, state.schema.nodes.mediaSingle, allowResizing, allowResizingInTables)];
+    toolbarButtons = [...toolbarButtons, ...buildLayoutButtons(state, intl, state.schema.nodes.mediaSingle, widthPluginDependencyApi, allowResizing, allowResizingInTables)];
     if (toolbarButtons.length) {
       toolbarButtons.push({
         type: 'separator'
@@ -312,7 +312,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
   }, removeButton];
   return items;
 };
-export const floatingToolbar = (state, intl, options = {}) => {
+export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) => {
   const {
     media,
     mediaInline,
@@ -379,7 +379,7 @@ export const floatingToolbar = (state, intl, options = {}) => {
       const element = (_mediaPluginState$ele3 = mediaPluginState.element) === null || _mediaPluginState$ele3 === void 0 ? void 0 : _mediaPluginState$ele3.querySelector(`.${MediaSingleNodeSelector}`);
       return element || mediaPluginState.element;
     };
-    items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, getEditorFeatureFlags);
+    items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.dependencies.width, getEditorFeatureFlags);
   }
   return {
     ...baseToolbar,

package/dist/es2019/plugins/media/ui/ImageBorder/styles.js

@@ -92,6 +92,13 @@ export const line = (size, selected) => css`
     transform: translate(-50%, -50%) rotate(135deg);
   }
 `;
+const getHoverStyles = selector => `&:hover ${selector} {
+    background: ${`var(--ds-background-neutral-subtle-hovered, ${colors.N20A})`};
+
+    &:hover {
+      background: ${`var(--ds-background-neutral-hovered, ${colors.N30A})`};
+    } 
+  }`;
 export const toolbarButtonWrapper = ({
   enabled,
   isOpen
@@ -116,13 +123,6 @@ export const toolbarButtonWrapper = ({
     margin-left: 1px;
   }
 
-  &:hover {
-    .image-border-toolbar-btn {
-      ${!enabled && ` background: ${`var(--ds-background-neutral-subtle-hovered, ${colors.N30A})`};`}
-    }
-
-    .image-border-toolbar-dropdown {
-      ${!isOpen && !enabled && `background: ${`var(--ds-background-neutral-subtle-hovered, ${colors.N30A})`};`}
-    }
-  }
+  ${!enabled && getHoverStyles('.image-border-toolbar-btn')}
+  ${!isOpen && !enabled && getHoverStyles('.image-border-toolbar-dropdown')}
 `;

package/dist/es2019/plugins/paste/pm-plugins/main.js

@@ -29,6 +29,7 @@ import { handlePaste as handlePasteTable } from '@atlaskit/editor-tables/utils';
 import { extractSliceFromStep } from '../../../utils/step';
 import { pluginKey as stateKey, createPluginState } from './plugin-factory';
 export { pluginKey as stateKey } from './plugin-factory';
+import { hasParentNodeOfType } from 'prosemirror-utils';
 export function createPlugin(schema, dispatchAnalyticsEvent, dispatch, featureFlags, cardOptions, sanitizePrivateContent, providerFactory) {
   const atlassianMarkDownParser = new MarkdownTransformer(schema, md);
   function getMarkdownSlice(text, openStart, openEnd) {
@@ -158,6 +159,11 @@ export function createPlugin(schema, dispatchAnalyticsEvent, dispatch, featureFl
           } = state.schema.nodes;
           const isPastingTextInsidePlaceholderText = ((_state$doc$resolve$no = state.doc.resolve(state.selection.$anchor.pos).nodeAfter) === null || _state$doc$resolve$no === void 0 ? void 0 : _state$doc$resolve$no.type) === placeholder;
 
+          // Don't add closeHistory if we're pasting over layout columns, as we will appendTransaction
+          // to cleanup the layout's structure and we want to keep the paste and re-structuring as
+          // one event.
+          const isPastingOverLayoutColumns = hasParentNodeOfType(state.schema.nodes.layoutColumn)(state.selection);
+
           // don't add closeHistory call if we're pasting a table, as some tables may involve additional
           // appendedTransactions to repair them (if they're partial or incomplete) and we don't want
           // to split those repairing transactions in prosemirror-history when they're being added to the
@@ -173,7 +179,7 @@ export function createPlugin(schema, dispatchAnalyticsEvent, dispatch, featureFl
             });
             return tableExists;
           });
-          if (!isPastingTextInsidePlaceholderText && !isPastingTable) {
+          if (!isPastingTextInsidePlaceholderText && !isPastingTable && !isPastingOverLayoutColumns) {
             tr.setMeta(betterTypePluginKey, true);
           }
           addLinkMetadata(view.state.selection, tr, {

package/dist/es2019/test-utils.js

@@ -38,6 +38,9 @@ function lightProcessPluginsList(editorPlugins) {
     if (editorPlugin.nodes) {
       acc.nodes.push(...editorPlugin.nodes());
     }
+    if (editorPlugin.contentComponent) {
+      acc.contentComponents.push(editorPlugin.contentComponent);
+    }
     if (editorPlugin.onEditorViewStateUpdated) {
       acc.onEditorViewStateUpdatedCallbacks.push(editorPlugin.onEditorViewStateUpdated);
     }
@@ -46,6 +49,7 @@ function lightProcessPluginsList(editorPlugins) {
     nodes: [],
     marks: [],
     plugins: [],
+    contentComponents: [],
     onEditorViewStateUpdatedCallbacks: []
   });
 }
@@ -66,7 +70,8 @@ export const createPMSchemaAndPlugins = (inputPreset = new EditorPresetBuilder()
   return {
     plugins,
     schema,
-    onEditorViewStateUpdatedCallbacks: editorConfig.onEditorViewStateUpdatedCallbacks
+    onEditorViewStateUpdatedCallbacks: editorConfig.onEditorViewStateUpdatedCallbacks,
+    editorConfig
   };
 };
 export { PortalProviderAPI } from './ui/PortalProvider';

package/dist/es2019/ui/Appearance/Comment/Comment.js

@@ -17,7 +17,7 @@ import WithFlash from '../../WithFlash';
 import { WidthConsumer } from '@atlaskit/editor-common/ui';
 import { akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
 import WidthEmitter from '../../WidthEmitter';
-import { GRID_GUTTER } from '../../../plugins/grid';
+import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
 import classnames from 'classnames';
 import { injectIntl } from 'react-intl-next';
 import messages from '../../../messages';

package/dist/es2019/ui/Appearance/FullPage/FullPage.js

@@ -5,7 +5,7 @@ import { jsx } from '@emotion/react';
 import rafSchedule from 'raf-schd';
 import { akEditorToolbarKeylineHeight } from '@atlaskit/editor-shared-styles';
 import { fullPageEditorWrapper } from './StyledComponents';
-import { ContextPanelWidthProvider } from '../../ContextPanel/context';
+import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { FullPageContentArea } from './FullPageContentArea';
 import { FullPageToolbar } from './FullPageToolbar';
 export class FullPageEditor extends React.Component {

package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx, useTheme } from '@emotion/react';
 import { WidthConsumer } from '@atlaskit/editor-common/ui';
-import { ContextPanelConsumer } from '../../ContextPanel/context';
+import { ContextPanelConsumer } from '@atlaskit/editor-common/ui';
 import React from 'react';
 import { injectIntl } from 'react-intl-next';
 import { ClickAreaBlock } from '../../Addon';

package/dist/es2019/ui/Appearance/FullPage/FullPageToolbar.js

@@ -7,7 +7,7 @@ import FindReplaceToolbarButtonWithState from '../../../plugins/find-replace/Fin
 import { BeforePrimaryToolbarWrapper } from '../../../plugins/before-primaryToolbar/ui/BeforePrimaryToolbarWrapper';
 import Toolbar from '../../Toolbar';
 import { mainToolbarStyle, mainToolbarIconBeforeStyle, mainToolbarFirstChildStyle, mainToolbarSecondChildStyle, nonCustomToolbarWrapperStyle, customToolbarWrapperStyle, MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT } from './MainToolbar';
-import { ContextPanelConsumer } from '../../ContextPanel/context';
+import { ContextPanelConsumer } from '@atlaskit/editor-common/ui';
 import messages from './messages';
 import { ToolbarArrowKeyNavigationProvider } from '../../ToolbarArrowKeyNavigationProvider';
 export const EditorToolbar = /*#__PURE__*/React.memo(props => {

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

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import React, { useMemo } from 'react';
 import { jsx, css, useTheme } from '@emotion/react';
-import { whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, shadowSharedStyle, dateSharedStyle, tasksAndDecisionsStyles, annotationSharedStyles, smartCardSharedStyles, textColorStyles, resizerStyles } from '@atlaskit/editor-common/styles';
+import { whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, shadowSharedStyle, dateSharedStyle, tasksAndDecisionsStyles, annotationSharedStyles, smartCardSharedStyles, textColorStyles, resizerStyles, gridStyles } from '@atlaskit/editor-common/styles';
 import { editorFontSize } from '@atlaskit/editor-shared-styles';
 import { unsupportedStyles } from '../../plugins/unsupported-content/styles';
 import { telepointerStyle } from '../../plugins/collab-edit/styles';
@@ -20,7 +20,6 @@ import { mentionsStyles } from '../../plugins/mentions/styles';
 import { emojiStyles } from '../../plugins/emoji/styles';
 import { textFormattingStyles } from '../../plugins/text-formatting/styles';
 import { placeholderTextStyles } from '../../plugins/placeholder-text/styles';
-import { gridStyles } from '../../plugins/grid/styles';
 import { linkStyles } from '../../plugins/hyperlink/styles';
 import { extensionStyles } from '../../plugins/extension/ui/styles';
 import { expandStyles } from '../../plugins/expand/ui/styles';