@atlaskit/editor-core 153.1.5 → 157.0.0

package/dist/es2019/plugins/card/ui/assets/card.js

@@ -0,0 +1,24 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Icon from '@atlaskit/icon';
+
+const IconCardGlyph = props => {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M8 9c-1.10457 0-2 .89543-2 2v10c0 1.1046.89543 2 2 2h16c1.1046 0 2-.8954 2-2V11c0-1.10457-.8954-2-2-2H8Zm0 3c0-.5523.44772-1 1-1h2c.5523 0 1 .4477 1 1v2c0 .5523-.4477 1-1 1H9c-.55228 0-1-.4477-1-1v-2Zm5 1c0-.2761.2239-.5.5-.5h10c.2761 0 .5.2239.5.5s-.2239.5-.5.5h-10c-.2761 0-.5-.2239-.5-.5Zm-4 3c-.55228 0-1 .4477-1 1s.44772 1 1 1h14c.5523 0 1-.4477 1-1s-.4477-1-1-1H9Zm-1 4c0-.5523.44772-1 1-1h6c.5523 0 1 .4477 1 1s-.4477 1-1 1H9c-.55228 0-1-.4477-1-1Z",
+    fill: "#42526E"
+  }));
+};
+
+export const IconCard = props => {
+  return /*#__PURE__*/React.createElement(Icon, _extends({
+    glyph: IconCardGlyph
+  }, props));
+};

package/dist/es2019/plugins/card/ui/assets/embed.js

@@ -0,0 +1,24 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Icon from '@atlaskit/icon';
+
+const IconEmbedGlyph = props => {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M8 6c-1.10457 0-2 .89543-2 2v16c0 1.1046.89543 2 2 2h16c1.1046 0 2-.8954 2-2V8c0-1.10457-.8954-2-2-2H8Zm1 2c-.55228 0-1 .44772-1 1v2c0 .5523.44772 1 1 1h2c.5523 0 1-.4477 1-1V9c0-.55228-.4477-1-1-1H9Zm4.5 1.5c-.2761 0-.5.22386-.5.5 0 .2761.2239.5.5.5h10c.2761 0 .5-.2239.5-.5 0-.27614-.2239-.5-.5-.5h-10ZM9 14c-.55228 0-1 .4477-1 1v8c0 .5523.44772 1 1 1h14c.5523 0 1-.4477 1-1v-8c0-.5523-.4477-1-1-1H9Zm6 2.5c0 .8284-.6716 1.5-1.5 1.5s-1.5-.6716-1.5-1.5.6716-1.5 1.5-1.5 1.5.6716 1.5 1.5Zm0 5.5-1-1-2 2h8v-1.8L18 19l-3 3Z",
+    fill: "#42526E"
+  }));
+};
+
+export const IconEmbed = props => {
+  return /*#__PURE__*/React.createElement(Icon, _extends({
+    glyph: IconEmbedGlyph
+  }, props));
+};

package/dist/es2019/plugins/card/ui/assets/inline.js

@@ -0,0 +1,24 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Icon from '@atlaskit/icon';
+
+const IconInlineGlyph = props => {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M8 12c-1.10457 0-2 .8954-2 2v4c0 1.1046.89543 2 2 2h16c1.1046 0 2-.8954 2-2v-4c0-1.1046-.8954-2-2-2H8Zm0 3c0-.5523.44772-1 1-1h2c.5523 0 1 .4477 1 1v2c0 .5523-.4477 1-1 1H9c-.55228 0-1-.4477-1-1v-2Zm5 1c0-.2761.2239-.5.5-.5h10c.2761 0 .5.2239.5.5s-.2239.5-.5.5h-10c-.2761 0-.5-.2239-.5-.5Z",
+    fill: "#42526E"
+  }));
+};
+
+export const IconInline = props => {
+  return /*#__PURE__*/React.createElement(Icon, _extends({
+    glyph: IconInlineGlyph
+  }, props));
+};

package/dist/es2019/plugins/card/ui/assets/url.js

@@ -0,0 +1,26 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Icon from '@atlaskit/icon';
+
+const IconUrlGlyph = props => {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "15",
+    width: "20",
+    height: "2",
+    rx: "1",
+    fill: "#42526E"
+  }));
+};
+
+export const IconUrl = props => {
+  return /*#__PURE__*/React.createElement(Icon, _extends({
+    glyph: IconUrlGlyph
+  }, props));
+};

package/dist/es2019/plugins/card/ui/styled.js

@@ -1,4 +1,4 @@
-import { css } from 'styled-components';
+import styled, { css } from 'styled-components';
 export const embedCardStyles = css`
   .ProseMirror {
     .embedCardView-content-wrap[layout^='wrap-'] {
@@ -18,4 +18,7 @@ export const embedCardStyles = css`
       clear: both;
     }
   }
+`;
+export const EmbedSpacing = styled.div`
+  margin: 0 10px;
 `;

package/dist/es2019/plugins/clear-marks-on-change-to-empty-document/index.js

@@ -1,8 +1,9 @@
-import { Plugin, PluginKey } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from 'prosemirror-state';
 import { isEmptyDocument } from '../../utils';
 export const pluginKey = new PluginKey('clearMarksOnChangeToEmptyDocumentPlugin');
 export function createPlugin() {
-  return new Plugin({
+  return new SafePlugin({
     key: pluginKey,
     appendTransaction: (_transactions, oldState, newState) => {
       // ED-2973: When a user clears the editor's content, remove the current active marks

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

@@ -1,10 +1,11 @@
-import { Plugin, TextSelection } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { TextSelection } from 'prosemirror-state';
 import { clipboardPluginKey } from '../plugin-key';
 import { getNodeSelectionAnalyticsPayload, getAllSelectionAnalyticsPayload, getRangeSelectionAnalyticsPayload, getCellSelectionAnalyticsPayload } from '../../selection/utils';
 import { EVENT_TYPE, ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID } from '../../analytics/types/enums';
 export const createPlugin = ({
   dispatchAnalyticsEvent
-}) => new Plugin({
+}) => new SafePlugin({
   key: clipboardPluginKey,
   props: {
     handleDOMEvents: {

package/dist/es2019/plugins/code-bidi-warning/pm-plugins/main.js

@@ -1,4 +1,4 @@
-import { Plugin } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
 import { codeBidiWarningPluginKey } from '../plugin-key';
 import { createBidiWarningsDecorationSetFromDoc, createPluginState, getPluginState } from './plugin-factory';
@@ -10,7 +10,7 @@ export const createPlugin = ({
 }) => {
   const intl = getIntl();
   const codeBidiWarningLabel = intl.formatMessage(codeBidiWarningMessages.label);
-  return new Plugin({
+  return new SafePlugin({
     key: codeBidiWarningPluginKey,
     state: createPluginState(dispatch, state => {
       // The appearance being mobile indicates we are in an editor being

package/dist/es2019/plugins/code-block/pm-plugins/ide-ux.js

@@ -1,4 +1,5 @@
-import { Plugin, TextSelection } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { TextSelection } from 'prosemirror-state';
 import { keydownHandler } from 'prosemirror-keymap';
 import { setTextSelection } from 'prosemirror-utils';
 import { getCursor } from '../../../utils';
@@ -8,7 +9,7 @@ import { getAutoClosingBracketInfo, shouldAutoCloseBracket } from '../ide-ux/bra
 import { getAutoClosingQuoteInfo, shouldAutoCloseQuote } from '../ide-ux/quote-handling';
 import { getEndOfCurrentLine, getStartOfCurrentLine, isCursorInsideCodeBlock, isSelectionEntirelyInsideCodeBlock, getLineInfo } from '../ide-ux/line-handling';
 import { insertIndent, outdent, indent, insertNewlineWithIndent } from '../ide-ux/commands';
-export default new Plugin({
+export default new SafePlugin({
   props: {
     handleTextInput(view, from, to, text) {
       const {

package/dist/es2019/plugins/code-block/pm-plugins/keymaps.js

@@ -4,7 +4,7 @@ import { findParentNodeOfTypeClosestToPos, hasParentNodeOfType } from 'prosemirr
 import { getCursor, isEmptyNode, pipe } from '../../../utils';
 
 const deleteCurrentItem = $from => tr => {
-  return tr.delete($from.before($from.depth) - 1, $from.end($from.depth) + 1);
+  return tr.delete($from.before($from.depth), $from.after($from.depth));
 };
 
 const setTextSelection = pos => tr => {

package/dist/es2019/plugins/code-block/pm-plugins/main.js

@@ -1,4 +1,5 @@
-import { Plugin, NodeSelection } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { NodeSelection } from 'prosemirror-state';
 import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
 import { codeBlockNodeView } from '../nodeviews/code-block';
 import { highlightingCodeBlockNodeView } from '../nodeviews/highlighting-code-block';
@@ -31,7 +32,7 @@ export const createPlugin = ({
     };
   }
 
-  return new Plugin({
+  return new SafePlugin({
     state: {
       init(_, state) {
         const node = findCodeBlock(state, state.selection);

package/dist/es2019/plugins/code-block/toolbar.js

@@ -64,7 +64,8 @@ export const getToolbarConfig = (allowCopyToClipboard = false) => (state, {
     title: formatMessage(codeBlockState.contentCopied ? commonMessages.copiedToClipboard : commonMessages.copyToClipboard),
     onMouseLeave: resetCopiedState,
     hideTooltipOnClick: false,
-    disabled: codeBlockState.isNodeSelected
+    disabled: codeBlockState.isNodeSelected,
+    tabIndex: null
   }, separator];
   const deleteButton = {
     id: 'editor.codeBlock.delete',
@@ -76,7 +77,8 @@ export const getToolbarConfig = (allowCopyToClipboard = false) => (state, {
     onFocus: hoverDecoration(nodeType, true),
     onBlur: hoverDecoration(nodeType, false),
     onClick: removeCodeBlock,
-    title: formatMessage(commonMessages.remove)
+    title: formatMessage(commonMessages.remove),
+    tabIndex: null
   };
   return {
     title: 'CodeBlock floating controls',

package/dist/es2019/plugins/collab-edit/actions.js

@@ -76,12 +76,22 @@ export const applyRemoteSteps = (json, userIds, view, options) => {
       to
     } = state.selection;
     const [firstStep] = json;
+    /*
+     * Persist marks across transactions. Fixes an issue where
+     * marks are lost if remote transactions are dispatched
+     * between a user creating the mark and typing.
+     */
+
+    if (state.tr.storedMarks) {
+      tr.setStoredMarks(state.tr.storedMarks);
+    }
     /**
      * If the cursor is a the same position as the first step in
      * the remote data, we need to manually set it back again
      * in order to prevent the cursor from moving.
      */
 
+
     if (from === firstStep.from && to === firstStep.to) {
       tr.setSelection(state.selection.map(tr.doc, tr.mapping));
     }

package/dist/es2019/plugins/collab-edit/events/initialize.js

@@ -4,7 +4,16 @@ import { subscribe } from './handlers';
 import { pluginKey } from '../plugin-key';
 
 const initCollab = (collabEditProvider, view) => {
-  collabEditProvider.initialize(() => view.state, json => Step.fromJSON(view.state.schema, json));
+  if (collabEditProvider.initialize) {
+    collabEditProvider.initialize(() => view.state, json => Step.fromJSON(view.state.schema, json));
+  }
+};
+
+const initNewCollab = (collabEditProvider, view, onSyncUpError) => {
+  collabEditProvider.setup({
+    getState: () => view.state,
+    onSyncUpError
+  });
 };
 
 const initCollabMemo = memoizeOne(initCollab);
@@ -25,7 +34,7 @@ export const initialize = ({
   if (options.useNativePlugin) {
     // ED-13912 For NCS we don't want to use memoizeOne because it causes
     // infinite text while changing page-width
-    initCollab(provider, view);
+    initNewCollab(provider, view, options.onSyncUpError);
   } else {
     /**
      * We only want to initialise once, if we reload/reconfigure this plugin

package/dist/es2019/plugins/collab-edit/index.js

@@ -1,8 +1,8 @@
 import { collab } from 'prosemirror-collab';
 import { createPlugin, pluginKey } from './plugin';
-export { CollabProvider } from './provider';
 import { sendTransaction } from './events/send-transaction';
 import { addSynchronyErrorAnalytics } from './analytics';
+import { nativeCollabProviderPlugin } from './native-collab-provider-plugin';
 export { pluginKey };
 
 const providerBuilder = collabEditProviderPromise => async (codeToExecute, onError) => {
@@ -42,6 +42,11 @@ const collabEditPlugin = options => {
         plugin: () => collab({
           clientID: userId
         })
+      }, {
+        name: 'nativeCollabProviderPlugin',
+        plugin: () => nativeCollabProviderPlugin({
+          providerPromise: collabEditProviderPromise
+        })
       }] : []), {
         name: 'collab',
         plugin: ({

package/dist/es2019/plugins/collab-edit/native-collab-provider-plugin.js

@@ -0,0 +1,32 @@
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from 'prosemirror-state';
+const nativeCollabProviderPluginKey = new PluginKey('nativeCollabProviderPlugin');
+export const nativeCollabProviderPlugin = ({
+  providerPromise
+}) => {
+  return new SafePlugin({
+    key: nativeCollabProviderPluginKey,
+    state: {
+      init: () => null,
+      apply: (tr, currentPluginState) => {
+        const provider = tr.getMeta(nativeCollabProviderPluginKey);
+        return provider ? provider : currentPluginState;
+      }
+    },
+    view: editorView => {
+      providerPromise.then(provider => {
+        const {
+          dispatch,
+          state
+        } = editorView;
+        const tr = state.tr;
+        tr.setMeta(nativeCollabProviderPluginKey, provider);
+        dispatch(tr);
+      });
+      return {};
+    }
+  });
+};
+export const getCollabProvider = editorState => {
+  return nativeCollabProviderPluginKey.getState(editorState);
+};

package/dist/es2019/plugins/collab-edit/plugin.js

@@ -1,11 +1,14 @@
-import { Plugin } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { initialize } from './events/initialize';
 import { PluginState } from './plugin-state';
 import { pluginKey } from './plugin-key';
 import { addSynchronyErrorAnalytics } from './analytics';
+import { fireAnalyticsEvent } from '../analytics/fire-analytics-event';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../analytics';
 export { PluginState, pluginKey };
 export const createPlugin = (dispatch, providerFactory, collabProviderCallback, options) => {
-  return new Plugin({
+  const fireAnalyticsCallback = fireAnalyticsEvent(options === null || options === void 0 ? void 0 : options.createAnalyticsEvent);
+  return new SafePlugin({
     key: pluginKey,
     state: {
       init(config) {
@@ -44,6 +47,19 @@ export const createPlugin = (dispatch, providerFactory, collabProviderCallback,
 
     view(view) {
       const addErrorAnalytics = addSynchronyErrorAnalytics(view.state, view.state.tr);
+
+      const onSyncUpError = attributes => {
+        fireAnalyticsCallback({
+          payload: {
+            action: ACTION.NEW_COLLAB_SYNC_UP_ERROR_NO_STEPS,
+            actionSubject: ACTION_SUBJECT.EDITOR,
+            eventType: EVENT_TYPE.OPERATIONAL,
+            attributes
+          }
+        });
+      };
+
+      options.onSyncUpError = onSyncUpError;
       const cleanup = collabProviderCallback(initialize({
         view,
         options,

package/dist/es2019/plugins/collab-edit/provider/index.js

@@ -1,2 +1 @@
-export { PubSubSpecialEventType } from './types';
-export { CollabProvider } from './collab-provider';
+export { PubSubSpecialEventType } from './types';

package/dist/es2019/plugins/context-panel/index.js

@@ -1,11 +1,12 @@
-import { Plugin, PluginKey } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from 'prosemirror-state';
 export const pluginKey = new PluginKey('contextPanelPluginKey');
 export function getPluginState(state) {
   return pluginKey.getState(state);
 }
 
 function contextPanelPluginFactory(contextPanels, dispatch) {
-  return new Plugin({
+  return new SafePlugin({
     key: pluginKey,
     state: {
       init(_config, state) {

package/dist/es2019/plugins/custom-autoformat/index.js

@@ -1,4 +1,4 @@
-import { Plugin as PMPlugin } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { keydownHandler } from 'prosemirror-keymap';
 import reducers from './reducers';
 import { triggerInputRule } from './input-rules';
@@ -8,7 +8,7 @@ export const createPMPlugin = ({
   providerFactory
 }) => {
   const rules = [];
-  return new PMPlugin({
+  return new SafePlugin({
     state: {
       init() {
         return {

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

@@ -1,4 +1,4 @@
-import { Plugin } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import DateNodeView from '../nodeviews/date';
 import { ReactNodeView } from '../../../nodeviews';
 import { pluginFactory } from '../../../utils/plugin-state-factory';
@@ -24,7 +24,7 @@ const createPlugin = ({
     focusDateInput: false
   };
   const hasIntlContext = true;
-  return new Plugin({
+  return new SafePlugin({
     state: createPluginState(dispatch, newPluginState),
     key: pluginKey,
     props: {

package/dist/es2019/plugins/editor-disabled/index.js

@@ -1,4 +1,5 @@
-import { Plugin, PluginKey } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from 'prosemirror-state';
 import { pluginFactory } from '../../utils/plugin-state-factory';
 export const pluginKey = new PluginKey('editorDisabledPlugin');
 
@@ -17,7 +18,7 @@ won't re-render when it changes.
 */
 
 export function createPlugin(dispatch) {
-  return new Plugin({
+  return new SafePlugin({
     key: pluginKey,
     state: createPluginState(dispatch, {
       editorDisabled: false

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

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Plugin, PluginKey } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from 'prosemirror-state';
 import { emoji } from '@atlaskit/adf-schema';
 import { Fragment } from 'prosemirror-model';
 import { TypeAheadAvailableNodes } from '@atlaskit/editor-common/type-ahead';
@@ -271,7 +272,7 @@ export function getEmojiPluginState(state) {
   return emojiPluginKey.getState(state) || {};
 }
 export function emojiPluginFactory(dispatch, providerFactory, portalProviderAPI, eventDispatcher, options) {
-  return new Plugin({
+  return new SafePlugin({
     key: emojiPluginKey,
     state: {
       init() {

package/dist/es2019/plugins/emoji/nodeviews/emoji-next.js

@@ -1,10 +1,9 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { DOMSerializer } from 'prosemirror-model';
 import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/utils';
-import { createMobileInlineDomRef } from '../../../ui/InlineNodeWrapper';
 export class EmojiNodeView {
   constructor(node, _, context) {
-    var _this$options, _this$options2, _this$options3;
+    var _this$options;
 
     _defineProperty(this, "hasProvider", false);
 
@@ -18,17 +17,10 @@ export class EmojiNodeView {
     this.providers = context.providerFactory;
     this.options = context.options;
     this.dom = EmojiNodeView.toDom(node);
-
-    if ((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.useInlineWrapper) {
-      const dom = createMobileInlineDomRef();
-      dom.appendChild(this.dom);
-      this.dom = dom;
-    }
-
-    this.el = (_this$options2 = this.options) !== null && _this$options2 !== void 0 && _this$options2.useInlineWrapper ? this.dom.firstElementChild : this.dom;
+    this.el = this.dom;
     this.providers.subscribe('emojiProvider', this.subscribe);
 
-    if ((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.allowZeroWidthSpaceAfter) {
+    if ((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.allowZeroWidthSpaceAfter) {
       this.el.after(document.createTextNode(ZERO_WIDTH_SPACE));
     }
 

package/dist/es2019/plugins/emoji/nodeviews/emoji.js

@@ -2,13 +2,8 @@ import React from 'react';
 import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/utils';
 import Emoji from '../ui/Emoji';
 import { ReactNodeView } from '../../../nodeviews';
-import InlineNodeWrapper, { createMobileInlineDomRef } from '../../../ui/InlineNodeWrapper';
 export class EmojiNodeView extends ReactNodeView {
   createDomRef() {
-    if (this.reactComponentProps.options && this.reactComponentProps.options.useInlineWrapper) {
-      return createMobileInlineDomRef();
-    }
-
     return super.createDomRef();
   }
 
@@ -22,9 +17,7 @@ export class EmojiNodeView extends ReactNodeView {
       id,
       text
     } = this.node.attrs;
-    return /*#__PURE__*/React.createElement(InlineNodeWrapper, {
-      useInlineWrapper: options && options.useInlineWrapper
-    }, /*#__PURE__*/React.createElement(Emoji, {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Emoji, {
       providers: providerFactory,
       id: id,
       shortName: shortName,

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

@@ -28,7 +28,7 @@ const expandPlugin = (options = {}) => ({
         dispatch,
         getIntl
       }) => {
-        return createPlugin(dispatch, getIntl, options.useLongPressSelection);
+        return createPlugin(dispatch, getIntl, options.appearance, options.useLongPressSelection);
       }
     }, {
       name: 'expandKeymap',

package/dist/es2019/plugins/expand/nodeviews/index.js

@@ -51,9 +51,11 @@ const toDOM = (node, intl) => ['div', {
 }, 0]];
 
 export class ExpandNodeView {
-  constructor(node, view, getPos, getIntl) {
+  constructor(node, view, getPos, getIntl, isMobile) {
     _defineProperty(this, "allowInteractiveExpand", true);
 
+    _defineProperty(this, "isMobile", false);
+
     _defineProperty(this, "focusTitle", () => {
       if (this.input) {
         const {
@@ -343,6 +345,7 @@ export class ExpandNodeView {
     this.node = node;
     this.dom = dom;
     this.contentDOM = contentDOM;
+    this.isMobile = isMobile;
     this.icon = this.dom.querySelector(`.${expandClassNames.icon}`);
     this.input = this.dom.querySelector(`.${expandClassNames.titleInput}`);
     this.titleContainer = this.dom.querySelector(`.${expandClassNames.titleContainer}`);
@@ -393,6 +396,12 @@ export class ExpandNodeView {
   }
 
   ignoreMutation(mutationRecord) {
+    // ME-1931: Mobile relies on composition which creates dom mutations. If we ignore them, prosemirror
+    // does not recognise the changes and reverts them.
+    if (this.isMobile && (mutationRecord.type === 'characterData' || mutationRecord.type === 'childList')) {
+      return false;
+    }
+
     if (mutationRecord.type === 'selection') {
       return false;
     }
@@ -459,6 +468,9 @@ export class ExpandNodeView {
   }
 
 }
-export default function (getIntl) {
-  return (node, view, getPos) => new ExpandNodeView(node, view, getPos, getIntl);
+export default function ({
+  getIntl,
+  isMobile
+}) {
+  return (node, view, getPos) => new ExpandNodeView(node, view, getPos, getIntl, isMobile);
 }

package/dist/es2019/plugins/expand/pm-plugins/keymap.js

@@ -9,7 +9,11 @@ import { deleteExpand, focusTitle } from '../commands';
 import { getPluginState as getSelectionPluginState } from '../../selection/plugin-factory';
 import { RelativeSelectionPos } from '../../selection/types';
 
-const isExpandSelected = selection => selection instanceof NodeSelection && (selection.node.type.name === 'expand' || selection.node.type.name === 'nestedExpand');
+const isExpandNode = node => {
+  return (node === null || node === void 0 ? void 0 : node.type.name) === 'expand' || (node === null || node === void 0 ? void 0 : node.type.name) === 'nestedExpand';
+};
+
+const isExpandSelected = selection => selection instanceof NodeSelection && isExpandNode(selection.node);
 
 export function expandKeymap() {
   const list = {};
@@ -172,6 +176,9 @@ export function expandKeymap() {
     const {
       selection
     } = state;
+    const {
+      $from
+    } = selection;
 
     if (!editorView || !selection.empty) {
       return false;
@@ -195,6 +202,13 @@ export function expandKeymap() {
       return false;
     }
 
+    const parentNode = state.doc.nodeAt($from.before(Math.max($from.depth - 1, 1))); // ED-10012 catch cases where the expand has another node nested within it and
+    // the backspace should be applied only to the inner node instead of the expand
+
+    if (parentNode && !isExpandNode(parentNode)) {
+      return false;
+    }
+
     const textSel = Selection.findFrom(state.doc.resolve(expandNode.pos), 1, true);
 
     if (textSel && selection.$from.pos === textSel.$from.pos && isEmptyNode(state.schema)(expandNode.node) && dispatch) {

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

@@ -1,4 +1,4 @@
-import { Plugin } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { findDomRefAtPos } from 'prosemirror-utils';
 import { createSelectionClickHandler } from '../../selection/utils';
 import ExpandNodeView from '../nodeviews';
@@ -11,15 +11,22 @@ function containsClass(element, className) {
   return !!element && element.classList.contains(className);
 }
 
-export const createPlugin = (dispatch, getIntl, useLongPressSelection = false) => {
+export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLongPressSelection = false) => {
   const state = createPluginState(dispatch, {});
-  return new Plugin({
+  const isMobile = appearance === 'mobile';
+  return new SafePlugin({
     state: state,
     key: pluginKey,
     props: {
       nodeViews: {
-        expand: ExpandNodeView(getIntl),
-        nestedExpand: ExpandNodeView(getIntl)
+        expand: ExpandNodeView({
+          getIntl,
+          isMobile
+        }),
+        nestedExpand: ExpandNodeView({
+          getIntl,
+          isMobile
+        })
       },
 
       handleKeyDown(_view, event) {

package/dist/es2019/plugins/expand/toolbar.js

@@ -30,7 +30,8 @@ export const getToolbarConfig = (state, {
         onMouseLeave: hoverDecoration([nestedExpand, expand], false),
         onFocus: hoverDecoration([nestedExpand, expand], true),
         onBlur: hoverDecoration([nestedExpand, expand], false),
-        title: formatMessage(commonMessages.remove)
+        title: formatMessage(commonMessages.remove),
+        tabIndex: null
       }]
     };
   }