@atlaskit/editor-core 185.2.25 → 185.2.26

package/dist/cjs/plugins/media/pm-plugins/main.js

@@ -40,6 +40,7 @@ var _utils2 = require("../../../utils");
 var _CaptionPlaceholder = require("../ui/CaptionPlaceholder");
 var _reactIntlNext = require("react-intl-next");
 var _mediaTaskManager = require("./mediaTaskManager");
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
@@ -638,7 +639,6 @@ var createPlugin = function createPlugin(_schema, options, reactContext, getIntl
             // we shift it to the media single parent as other code is opinionated about
             // the selection landing there. In particular the caption insertion and selection
             // action.
-
             return newState.tr.setSelection(_prosemirrorState.NodeSelection.create(newState.doc, transaction.selection.$from.pos - 1));
           }
         }
@@ -662,12 +662,29 @@ var createPlugin = function createPlugin(_schema, options, reactContext, getIntl
     },
     props: {
       decorations: function decorations(state) {
+        // Use this to indicate that the media node is selected
+        var mediaNodes = [];
+        var schema = state.schema,
+          $anchor = state.selection.$anchor,
+          doc = state.doc;
+
+        // Find any media nodes in the current selection
+        if (state.selection instanceof _prosemirrorState.TextSelection || state.selection instanceof _prosemirrorState.AllSelection || state.selection instanceof _prosemirrorState.NodeSelection || state.selection instanceof _cellSelection.CellSelection) {
+          doc.nodesBetween(state.selection.from, state.selection.to, function (node, pos) {
+            if (node.type === schema.nodes.media) {
+              mediaNodes.push(_prosemirrorView.Decoration.node(pos, pos + node.nodeSize, {}, {
+                type: 'media',
+                selected: true
+              }));
+              return false;
+            }
+            return true;
+          });
+        }
         var pluginState = getMediaPluginState(state);
         if (!pluginState.showDropzone) {
-          return;
+          return _prosemirrorView.DecorationSet.create(state.doc, mediaNodes);
         }
-        var schema = state.schema,
-          $anchor = state.selection.$anchor;
 
         // When a media is already selected
         if (state.selection instanceof _prosemirrorState.NodeSelection) {
@@ -676,20 +693,20 @@ var createPlugin = function createPlugin(_schema, options, reactContext, getIntl
             var deco = _prosemirrorView.Decoration.node(state.selection.from, state.selection.to, {
               class: 'richMedia-selected'
             });
-            return _prosemirrorView.DecorationSet.create(state.doc, [deco]);
+            return _prosemirrorView.DecorationSet.create(state.doc, [deco].concat(mediaNodes));
           }
-          return;
+          return _prosemirrorView.DecorationSet.create(state.doc, mediaNodes);
         }
         var pos = $anchor.pos;
         if ($anchor.parent.type !== schema.nodes.paragraph && $anchor.parent.type !== schema.nodes.codeBlock) {
           pos = (0, _prosemirrorTransform.insertPoint)(state.doc, pos, schema.nodes.mediaGroup);
         }
         if (pos === null || pos === undefined) {
-          return;
+          return _prosemirrorView.DecorationSet.create(state.doc, mediaNodes);
         }
         var dropPlaceholders = [_prosemirrorView.Decoration.widget(pos, dropPlaceholder, {
           key: 'drop-placeholder'
-        })];
+        })].concat(mediaNodes);
         return _prosemirrorView.DecorationSet.create(state.doc, dropPlaceholders);
       },
       nodeViews: options.nodeViews,

package/dist/cjs/plugins/tasks-and-decisions/nodeviews/decisionItem.js

@@ -12,7 +12,7 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _react = _interopRequireDefault(require("react"));
-var _nodeviews = require("../../../nodeviews");
+var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
 var _Decision = _interopRequireDefault(require("../ui/Decision"));
 var _utils = require("../../type-ahead/utils");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -77,7 +77,7 @@ var Decision = /*#__PURE__*/function (_ReactNodeView) {
     }
   }]);
   return Decision;
-}(_nodeviews.ReactNodeView);
+}(_reactNodeView.default);
 var decisionItemNodeView = function decisionItemNodeView(portalProviderAPI, eventDispatcher) {
   return function (node, view, getPos) {
     var hasIntlContext = true;

package/dist/cjs/plugins/tasks-and-decisions/nodeviews/taskItem.js

@@ -16,7 +16,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _steps = require("@atlaskit/adf-schema/steps");
-var _nodeviews = require("../../../nodeviews");
+var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
 var _WithPluginState = _interopRequireDefault(require("../../../ui/WithPluginState"));
 var _pluginKey = require("../pm-plugins/plugin-key");
 var _Task = _interopRequireDefault(require("../ui/Task"));
@@ -159,7 +159,7 @@ var Task = /*#__PURE__*/function (_ReactNodeView) {
     }
   }]);
   return Task;
-}(_nodeviews.ReactNodeView);
+}(_reactNodeView.default);
 function taskItemNodeViewFactory(portalProviderAPI, eventDispatcher, providerFactory) {
   return function (node, view, getPos) {
     var hasIntlContext = true;

package/dist/cjs/plugins/unsupported-content/index.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +10,9 @@ var _prosemirrorState = require("prosemirror-state");
 var _adfSchema = require("@atlaskit/adf-schema");
 var _ui = require("@atlaskit/editor-common/ui");
 var _unsupportedInlineNodeView = require("./unsupported-inline-node-view");
-var _nodeviews = require("../../nodeviews");
-var _reactNodeView = require("@atlaskit/editor-common/react-node-view");
+var _reactNodeView = _interopRequireWildcard(require("@atlaskit/editor-common/react-node-view"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var pluginKey = new _prosemirrorState.PluginKey('unsupportedContentPlugin');
 exports.pluginKey = pluginKey;
 var createPlugin = function createPlugin(pmPluginFactoryParams) {
@@ -22,7 +24,7 @@ var createPlugin = function createPlugin(pmPluginFactoryParams) {
     key: pluginKey,
     props: {
       nodeViews: {
-        confluenceUnsupportedBlock: _nodeviews.ReactNodeView.fromComponent(_ui.UnsupportedBlock, portalProviderAPI, eventDispatcher, {
+        confluenceUnsupportedBlock: _reactNodeView.default.fromComponent(_ui.UnsupportedBlock, portalProviderAPI, eventDispatcher, {
           dispatchAnalyticsEvent: dispatchAnalyticsEvent
         }, undefined, hasIntlContext),
         confluenceUnsupportedInline: (0, _reactNodeView.getInlineNodeViewProducer)({
@@ -32,7 +34,7 @@ var createPlugin = function createPlugin(pmPluginFactoryParams) {
             dispatchAnalyticsEvent: dispatchAnalyticsEvent
           }
         }),
-        unsupportedBlock: _nodeviews.ReactNodeView.fromComponent(_ui.UnsupportedBlock, portalProviderAPI, eventDispatcher, {
+        unsupportedBlock: _reactNodeView.default.fromComponent(_ui.UnsupportedBlock, portalProviderAPI, eventDispatcher, {
           dispatchAnalyticsEvent: dispatchAnalyticsEvent
         }, undefined, hasIntlContext),
         unsupportedInline: (0, _reactNodeView.getInlineNodeViewProducer)({

package/dist/cjs/test-utils.js

@@ -22,12 +22,6 @@ Object.defineProperty(exports, "GapCursorSide", {
     return _selection.Side;
   }
 });
-Object.defineProperty(exports, "PortalProviderAPI", {
-  enumerable: true,
-  get: function get() {
-    return _PortalProvider.PortalProviderAPI;
-  }
-});
 exports.createPMSchemaAndPlugins = void 0;
 Object.defineProperty(exports, "createTypeAheadTools", {
   enumerable: true,
@@ -47,7 +41,6 @@ var _base = _interopRequireDefault(require("./plugins/base"));
 var _pluginKey = require("./plugins/analytics/plugin-key");
 var _api = require("./plugins/type-ahead/api");
 var _preset = require("@atlaskit/editor-common/preset");
-var _PortalProvider = require("./ui/PortalProvider");
 var _eventDispatcher = require("./event-dispatcher");
 var _selection = require("./plugins/selection/gap-cursor/selection");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

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 = "185.2.25";
+var version = "185.2.26";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.2.25",
+	"version": "185.2.26",
 	"sideEffects": false
 }

package/dist/es2019/editor-next/editor-internal.js

@@ -10,7 +10,7 @@ import { createFeatureFlagsFromProps } from '../create-editor/feature-flags-from
 import { ContextAdapter } from '../nodeviews/context-adapter';
 import { ACTION, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import EditorContext from '../ui/EditorContext';
-import { PortalProviderWithThemeProviders, PortalRenderer } from '../ui/PortalProvider';
+import { PortalProviderWithThemeProviders, PortalRenderer } from '@atlaskit/editor-common/portal-provider';
 import { RenderTracking } from '../utils/performance/components/RenderTracking';
 import { getBaseFontSize } from './utils/getBaseFontSize';
 import useMeasureEditorMountTime from './hooks/useMeasureEditorMountTime';

package/dist/es2019/index.js

@@ -51,7 +51,7 @@ export { getDefaultPresetOptionsFromEditorProps } from './create-editor';
 export { default as EditorActions } from './actions';
 // Re-export from provider factory to not cause a breaking change
 
-export { PortalProvider, PortalProviderAPI, PortalRenderer } from './ui/PortalProvider';
+export { PortalProvider, PortalProviderAPI, PortalRenderer } from '@atlaskit/editor-common/portal-provider';
 export { GapCursorSelection, Side as GapCursorSide } from './plugins/selection/gap-cursor-selection';
 export { selectionPluginKey } from './plugins/mobile-selection';
 export { insertExpand } from './plugins/expand/commands';

package/dist/es2019/labs/next/Editor.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { IntlProvider } from 'react-intl-next';
-import { PortalRenderer, PortalProvider } from '../../ui/PortalProvider';
+import { PortalRenderer, PortalProvider } from '@atlaskit/editor-common/portal-provider';
 import { EditorInternal } from './internal/components/EditorInternal';
 import { usePresetContext, PresetProvider } from './internal/context/preset-context';
 import { EditorSharedConfigConsumer, useEditorSharedConfig } from './internal/context/shared-config';

package/dist/es2019/nodeviews/index.js

@@ -1,2 +1 @@
-export { default as ReactNodeView } from './ReactNodeView';
-export { SelectionBasedNodeView } from './SelectionBasedNodeView';
+export {};

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

@@ -1,14 +1,13 @@
 import React from 'react';
 import { annotation } from '@atlaskit/adf-schema';
-import WithPluginState from '../../ui/WithPluginState';
-import { stateKey as reactPluginKey } from '../../plugins/base/pm-plugins/react-nodeview';
 import { keymapPlugin } from './pm-plugins/keymap';
 import { inlineCommentPlugin } from './pm-plugins/inline-comment';
 import { AnnotationUpdateEmitter } from './update-provider';
-import { getPluginState, inlineCommentPluginKey } from './utils';
+import { getPluginState } from './utils';
 import { buildToolbar } from './toolbar';
 import { InlineCommentView } from './ui/InlineCommentView';
-const annotationPlugin = annotationProviders => {
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
+const annotationPlugin = (annotationProviders, api) => {
   return {
     name: 'annotation',
     marks() {
@@ -17,6 +16,12 @@ const annotationPlugin = annotationProviders => {
         mark: annotation
       }];
     },
+    getSharedState(editorState) {
+      if (!editorState) {
+        return undefined;
+      }
+      return getPluginState(editorState);
+    },
     pmPlugins: () => [{
       name: 'annotation',
       plugin: ({
@@ -64,28 +69,34 @@ const annotationPlugin = annotationProviders => {
       if (!annotationProviders) {
         return null;
       }
-      return /*#__PURE__*/React.createElement(WithPluginState, {
-        plugins: {
-          selectionState: reactPluginKey,
-          inlineCommentState: inlineCommentPluginKey
-        },
-        render: ({
-          inlineCommentState
-        }) => {
-          if (inlineCommentState && !inlineCommentState.isVisible) {
-            return null;
-          }
-          return /*#__PURE__*/React.createElement("div", {
-            "data-editor-popup": "true"
-          }, /*#__PURE__*/React.createElement(InlineCommentView, {
-            providers: annotationProviders,
-            editorView: editorView,
-            dispatchAnalyticsEvent: dispatchAnalyticsEvent
-          }));
-        }
+      return /*#__PURE__*/React.createElement(AnnotationContentComponent, {
+        api: api,
+        editorView: editorView,
+        annotationProviders: annotationProviders,
+        dispatchAnalyticsEvent: dispatchAnalyticsEvent
       });
     }
   };
 };
+function AnnotationContentComponent({
+  api,
+  editorView,
+  annotationProviders,
+  dispatchAnalyticsEvent
+}) {
+  const {
+    annotationState: inlineCommentState
+  } = useSharedPluginState(api, ['annotation']);
+  if (inlineCommentState && !inlineCommentState.isVisible) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    "data-editor-popup": "true"
+  }, /*#__PURE__*/React.createElement(InlineCommentView, {
+    providers: annotationProviders,
+    editorView: editorView,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  }));
+}
 export default annotationPlugin;
 export { AnnotationUpdateEmitter };

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import { AnnotationSharedClassNames } from '@atlaskit/editor-common/styles';
-import { ReactNodeView } from '../../../nodeviews';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 export class AnnotationNodeView extends ReactNodeView {
   createDomRef() {
     return document.createElement('span');

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

@@ -10,7 +10,6 @@ import contextIdentifierPlugin from './pm-plugins/context-identifier';
 import newlinePreserveMarksPlugin from './pm-plugins/newline-preserve-marks';
 import inlineCursorTargetPlugin from './pm-plugins/inline-cursor-target';
 import betterTypeHistoryPlugin from './pm-plugins/better-type-history';
-import { plugin as reactNodeView } from './pm-plugins/react-nodeview';
 import scrollGutter from './pm-plugins/scroll-gutter';
 import { keymap } from '../../utils/keymap';
 import frozenEditor from './pm-plugins/frozen-editor';
@@ -50,9 +49,6 @@ const basePlugin = (options, api) => {
       }, {
         name: 'newlinePreserveMarksPlugin',
         plugin: newlinePreserveMarksPlugin
-      }, {
-        name: 'reactNodeView',
-        plugin: () => reactNodeView
       }, {
         name: 'frozenEditor',
         plugin: ({

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

@@ -18,10 +18,7 @@ const captionPlugin = (_, api) => {
           providerFactory,
           eventDispatcher,
           dispatch
-        }) => {
-          var _api$dependencies$ana;
-          return createCaptionPlugin(portalProviderAPI, eventDispatcher, providerFactory, dispatch, 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);
-        }
+        }) => createCaptionPlugin(portalProviderAPI, eventDispatcher, providerFactory, dispatch, api)
       }, {
         name: 'captionKeymap',
         plugin: captionKeymap

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

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { Caption } from '@atlaskit/editor-common/ui';
-import { SelectionBasedNodeView } from '../../../nodeviews/';
+import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
 export class CaptionNodeView extends SelectionBasedNodeView {
   constructor(...args) {
     super(...args);
@@ -39,7 +39,7 @@ export class CaptionNodeView extends SelectionBasedNodeView {
     return selectedStateChange;
   }
 }
-export default function captionNodeView(portalProviderAPI, eventDispatcher) {
+export default function captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi) {
   return (node, view, getPos) => {
     const hasIntlContext = true;
     return new CaptionNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {}, undefined, undefined, undefined, hasIntlContext).init();

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

@@ -11,7 +11,9 @@ const fireAnalytics = (tr, action, analyticsApi) => {
     actionSubjectId: ACTION_SUBJECT_ID.CAPTION
   })(tr);
 };
-export default ((portalProviderAPI, eventDispatcher, providerFactory, dispatch, analyticsApi) => {
+export default ((portalProviderAPI, eventDispatcher, providerFactory, dispatch, pluginInjectionApi) => {
+  var _pluginInjectionApi$d;
+  const analyticsApi = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies.analytics) === null || _pluginInjectionApi$d === void 0 ? void 0 : _pluginInjectionApi$d.actions;
   return new SafePlugin({
     appendTransaction(transactions, oldState, newState) {
       // only run for transactions that change selection
@@ -41,7 +43,7 @@ export default ((portalProviderAPI, eventDispatcher, providerFactory, dispatch,
     key: pluginKey,
     props: {
       nodeViews: {
-        caption: captionNodeView(portalProviderAPI, eventDispatcher)
+        caption: captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi)
       }
     }
   });

package/dist/es2019/plugins/card/nodeviews/embedCard.js

@@ -7,7 +7,7 @@ import rafSchedule from 'raf-schd';
 import { Card } from './genericCard';
 import { UnsupportedBlock, MediaSingle as RichMediaWrapper, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
 import { DEFAULT_EMBED_CARD_HEIGHT, DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
-import { SelectionBasedNodeView } from '../../../nodeviews/';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { registerCard } from '../pm-plugins/actions';
 import ResizableEmbedCard from '../ui/ResizableEmbedCard';
 import { floatingLayouts, isRichMediaInsideOfBlockNode } from '@atlaskit/editor-common/utils';
@@ -327,7 +327,7 @@ _defineProperty(EmbedCardComponent, "contextTypes", {
   contextAdapter: PropTypes.object
 });
 const WrappedBlockCard = Card(EmbedCardComponent, UnsupportedBlock);
-export class EmbedCard extends SelectionBasedNodeView {
+export class EmbedCard extends ReactNodeView {
   viewShouldUpdate(nextNode) {
     if (this.node.attrs !== nextNode.attrs) {
       return true;

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ReactNodeView } from '../../../nodeviews';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import Extension from '../ui/Extension';
 import ExtensionNodeWrapper from '../ui/Extension/ExtensionNodeWrapper';
 // getInlineNodeViewProducer is a new api to use instead of ReactNodeView

package/dist/es2019/plugins/jira-issue/index.js

@@ -1,7 +1,7 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from 'prosemirror-state';
 import { confluenceJiraIssue } from '@atlaskit/adf-schema';
-import { ReactNodeView } from '../../nodeviews';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import ReactJIRAIssueNode from './nodeviews/jira-issue';
 export const pluginKey = new PluginKey('jiraIssuePlugin');
 const createPlugin = ({

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

@@ -85,10 +85,10 @@ const mediaPlugin = (options = {}, api) => {
           return createPlugin(schema, {
             providerFactory,
             nodeViews: {
-              mediaGroup: ReactMediaGroupNode(portalProviderAPI, eventDispatcher, providerFactory, options),
+              mediaGroup: ReactMediaGroupNode(portalProviderAPI, eventDispatcher, providerFactory, options, api),
               mediaSingle: ReactMediaSingleNode(portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent, options, api),
               media: ReactMediaNode(portalProviderAPI, eventDispatcher, providerFactory, options, api),
-              mediaInline: ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory)
+              mediaInline: ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory, api)
             },
             errorReporter,
             uploadErrorHandler: options && options.uploadErrorHandler,

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

@@ -3,17 +3,15 @@ import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 import EditorCloseIcon from '@atlaskit/icon/glyph/editor/close';
 import { Filmstrip } from '@atlaskit/media-filmstrip';
 import React from 'react';
-import ReactNodeView from '../../../nodeviews/ReactNodeView';
-import { stateKey as reactNodeViewStateKey } from '../../../plugins/base/pm-plugins/react-nodeview';
-import WithPluginState from '../../../ui/WithPluginState';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { setNodeSelection } from '../../../utils';
 import { isNodeSelectedOrInRange, SelectedState } from '../../../utils/nodes';
-import { pluginKey as editorDisabledPluginKey } from '../../editor-disabled';
 import { stateKey as mediaStateKey } from '../pm-plugins/plugin-key';
 import { MediaNodeUpdater } from './mediaNodeUpdater';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
 import { injectIntl } from 'react-intl-next';
 import { messages } from './messages';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 const isMediaGroupSelectedFromProps = props => {
   return isNodeSelectedOrInRange(props.anchorPos, props.headPos, props.getPos(), props.node.nodeSize);
 };
@@ -202,11 +200,23 @@ class MediaGroup extends React.Component {
 _defineProperty(MediaGroup, "displayName", 'MediaGroup');
 const IntlMediaGroup = injectIntl(MediaGroup);
 export default IntlMediaGroup;
+function MediaGroupNodeViewInternal({
+  renderFn,
+  pluginInjectionApi
+}) {
+  const {
+    editorDisabledState: editorDisabledPlugin
+  } = useSharedPluginState(pluginInjectionApi, ['editorDisabled']);
+  return renderFn({
+    editorDisabledPlugin
+  });
+}
 class MediaGroupNodeView extends ReactNodeView {
   render(props, forwardRef) {
     const {
       providerFactory,
-      mediaOptions
+      mediaOptions,
+      pluginInjectionApi
     } = props;
     const getPos = this.getPos;
     return /*#__PURE__*/React.createElement(WithProviders, {
@@ -237,22 +247,19 @@ class MediaGroupNodeView extends ReactNodeView {
             mediaOptions: mediaOptions
           });
         };
-        return /*#__PURE__*/React.createElement(WithPluginState, {
-          editorView: this.view,
-          plugins: {
-            reactNodeViewState: reactNodeViewStateKey,
-            editorDisabledPlugin: editorDisabledPluginKey
-          },
-          render: renderFn
+        return /*#__PURE__*/React.createElement(MediaGroupNodeViewInternal, {
+          renderFn: renderFn,
+          pluginInjectionApi: pluginInjectionApi
         });
       }
     });
   }
 }
-export const ReactMediaGroupNode = (portalProviderAPI, eventDispatcher, providerFactory, mediaOptions = {}) => (node, view, getPos) => {
+export const ReactMediaGroupNode = (portalProviderAPI, eventDispatcher, providerFactory, mediaOptions = {}, pluginInjectionApi) => (node, view, getPos) => {
   const hasIntlContext = true;
   return new MediaGroupNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {
     providerFactory,
-    mediaOptions
+    mediaOptions,
+    pluginInjectionApi
   }, undefined, undefined, undefined, hasIntlContext).init();
 };

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

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { SelectionBasedNodeView } from '../../../nodeviews/';
+import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
 import WithPluginState from '../../../ui/WithPluginState';
 import { MediaInlineCard } from '@atlaskit/media-card';
 import { WithProviders } from '@atlaskit/editor-common/provider-factory';
@@ -175,7 +175,7 @@ export class MediaInlineNodeView extends SelectionBasedNodeView {
     });
   }
 }
-export const ReactMediaInlineNode = (portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent) => (node, view, getPos) => {
+export const ReactMediaInlineNode = (portalProviderAPI, eventDispatcher, providerFactory, pluginInjectionApi, dispatchAnalyticsEvent) => (node, view, getPos) => {
   return new MediaInlineNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {
     providerFactory,
     dispatchAnalyticsEvent

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

@@ -1,9 +1,8 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/ui';
-import { NodeSelection } from 'prosemirror-state';
 import React from 'react';
-import { SelectionBasedNodeView } from '../../../../nodeviews';
+import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
 import MediaNode from './media';
 import { getAttrsFromUrl } from '@atlaskit/media-client';
 import { isMediaBlobUrlFromAttrs } from '../../utils/media-common';
@@ -19,9 +18,13 @@ const MediaNodeWithProviders = ({
     width: widthState
   });
 };
+function isMediaDecorationSpec(decoration) {
+  return decoration.spec.type !== undefined && decoration.spec.selected !== undefined;
+}
 class MediaNodeView extends SelectionBasedNodeView {
   constructor(...args) {
     super(...args);
+    _defineProperty(this, "isSelected", false);
     _defineProperty(this, "renderMediaNodeWithState", (mediaProvider, contextIdentifierProvider) => {
       return ({
         width: editorWidth
@@ -30,10 +33,6 @@ class MediaNodeView extends SelectionBasedNodeView {
         const {
           mediaOptions
         } = this.reactComponentProps;
-        const {
-          selection
-        } = this.view.state;
-        const isSelected = () => this.isNodeInsideSelection(selection.from, selection.to) || selection instanceof NodeSelection && selection.from === getPos();
         const attrs = this.getAttrs();
         const url = attrs.type === 'external' ? attrs.url : '';
         let {
@@ -65,7 +64,7 @@ class MediaNodeView extends SelectionBasedNodeView {
           view: this.view,
           node: this.node,
           getPos: getPos,
-          selected: isSelected(),
+          selected: this.nodeInsideSelection(),
           originalDimensions: originalDimensions,
           maxDimensions: maxDimensions,
           url: url,
@@ -97,11 +96,16 @@ class MediaNodeView extends SelectionBasedNodeView {
     }
     return domRef;
   }
-  viewShouldUpdate(nextNode) {
+  viewShouldUpdate(nextNode, decorations) {
+    const hasMediaNodeSelectedDecoration = decorations.some(decoration => isMediaDecorationSpec(decoration) && decoration.spec.type === 'media' && decoration.spec.selected);
+    if (this.isSelected !== hasMediaNodeSelectedDecoration) {
+      this.isSelected = hasMediaNodeSelectedDecoration;
+      return true;
+    }
     if (this.node.attrs !== nextNode.attrs) {
       return true;
     }
-    return super.viewShouldUpdate(nextNode);
+    return super.viewShouldUpdate(nextNode, decorations);
   }
   stopEvent(event) {
     // Don't trap right click events on media node

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

@@ -18,7 +18,7 @@ import { floatingLayouts, isRichMediaInsideOfBlockNode } from '@atlaskit/editor-
 import { getAttrsFromUrl } from '@atlaskit/media-client';
 import { isMediaBlobUrlFromAttrs } from '../utils/media-common';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
-import ReactNodeView from '../../../nodeviews/ReactNodeView';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import CaptionPlaceholder from '../ui/CaptionPlaceholder';
 import { NodeSelection } from 'prosemirror-state';
 import { insertAndSelectCaptionFromMediaSinglePos } from '../commands/captions';