@atlaskit/editor-core 210.2.5 → 210.2.7

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-core
 
+## 210.2.7
+
+### Patch Changes
+
+- [`51f3f2db61f6e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/51f3f2db61f6e) -
+  Update toolbar config across plugins
+- Updated dependencies
+
+## 210.2.6
+
+### Patch Changes
+
+- [`71e4c857f1463`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/71e4c857f1463) -
+  ED-29096: clean up sharedPluginStateHookMigratorFactory in editor-core
+- Updated dependencies
+
 ## 210.2.5
 
 ### Patch Changes

package/dist/cjs/ui/Appearance/Chromeless.js

@@ -111,16 +111,6 @@ var EditorContainer = (0, _platformFeatureFlagsReact.componentWithCondition)(fun
     exposure: true
   });
 }, _EditorContentContainer.default, ContentArea);
-var useEditorViewModePluginState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
-  return (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['editorViewMode'], function (states) {
-    var _states$editorViewMod;
-    return states === null || states === void 0 || (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
-  });
-}, function (pluginInjectionApi) {
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['editorViewMode']),
-    editorViewModeState = _useSharedPluginState.editorViewModeState;
-  return editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
-});
 
 /**
  * Render the editor in a chromeless appearance.
@@ -159,7 +149,10 @@ var Editor = exports.default = /*#__PURE__*/function (_React$Component) {
         pluginHooks = _this$props.pluginHooks,
         featureFlags = _this$props.featureFlags;
       var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
-      var editorViewMode = useEditorViewModePluginState(_this.props.editorAPI);
+      var editorViewMode = (0, _hooks.useSharedPluginStateWithSelector)(_this.props.editorAPI, ['editorViewMode'], function (states) {
+        var _states$editorViewMod;
+        return states === null || states === void 0 || (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
+      });
       return (0, _react2.jsx)(_WithFlash.default, {
         animate: maxContentSizeReached
       }, (0, _react2.jsx)(ChromelessEditorContainer, {
@@ -206,30 +199,18 @@ var Editor = exports.default = /*#__PURE__*/function (_React$Component) {
   }]);
 }(_react.default.Component);
 (0, _defineProperty2.default)(Editor, "displayName", 'ChromelessEditorAppearance');
-var useMaxContentSizePluginState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
-  var maxContentSizeReached = (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['maxContentSize'], function (states) {
+function RenderWithPluginState(_ref2) {
+  var renderChrome = _ref2.renderChrome,
+    editorAPI = _ref2.editorAPI;
+  var maxContentSizeReached = (0, _hooks.useSharedPluginStateWithSelector)(editorAPI, ['maxContentSize'], function (states) {
     var _states$maxContentSiz;
     return states === null || states === void 0 || (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached;
   });
-  return {
-    maxContentSizeState: maxContentSizeReached === undefined ? undefined : {
-      maxContentSizeReached: maxContentSizeReached
-    }
-  };
-}, function (pluginInjectionApi) {
-  var _useSharedPluginState2 = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['maxContentSize']),
-    maxContentSizeState = _useSharedPluginState2.maxContentSizeState;
-  return {
-    maxContentSizeState: maxContentSizeState
+  var maxContentSize = maxContentSizeReached === undefined ? undefined : {
+    maxContentSizeReached: maxContentSizeReached
   };
-});
-function RenderWithPluginState(_ref2) {
-  var renderChrome = _ref2.renderChrome,
-    editorAPI = _ref2.editorAPI;
-  var _useMaxContentSizePlu = useMaxContentSizePluginState(editorAPI),
-    maxContentSizeState = _useMaxContentSizePlu.maxContentSizeState;
   return (0, _react2.jsx)(_react.Fragment, null, renderChrome({
-    maxContentSize: maxContentSizeState
+    maxContentSize: maxContentSize
   }));
 }
 function ChromelessEditorContainerNext(_ref3) {

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

@@ -118,39 +118,20 @@ var EditorContainer = (0, _platformFeatureFlagsReact.componentWithCondition)(fun
     exposure: true
   });
 }, _EditorContentContainer.default, ContentArea);
-var useCommentEditorPluginsStates = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
-  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], function (states) {
+var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEditorWithIntl(props) {
+  var editorAPI = props.editorAPI;
+  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(editorAPI, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], function (states) {
       var _states$maxContentSiz, _states$primaryToolba, _states$editorViewMod;
       return {
-        maxContentSizeReached: (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached,
-        primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
+        maxContentSizeReached: !!((_states$maxContentSiz = states.maxContentSizeState) !== null && _states$maxContentSiz !== void 0 && _states$maxContentSiz.maxContentSizeReached),
+        primaryToolbarComponentsState: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
         editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
       };
     }),
-    maxContentSizeReached = _useSharedPluginState.maxContentSizeReached,
-    primaryToolbarComponents = _useSharedPluginState.primaryToolbarComponents,
-    editorViewMode = _useSharedPluginState.editorViewMode;
-  return {
-    maxContentSizeState: maxContentSizeReached === undefined ? undefined : {
-      maxContentSizeReached: maxContentSizeReached
-    },
-    primaryToolbarState: !primaryToolbarComponents ? undefined : {
-      components: primaryToolbarComponents
-    },
-    editorViewModeState: !editorViewMode ? undefined : {
-      mode: editorViewMode
-    }
-  };
-}, function (pluginInjectionApi) {
-  return (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['maxContentSize', 'primaryToolbar', 'editorViewMode']);
-});
-var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEditorWithIntl(props) {
-  var editorAPI = props.editorAPI;
-  var _useCommentEditorPlug = useCommentEditorPluginsStates(editorAPI),
-    maxContentSizeState = _useCommentEditorPlug.maxContentSizeState,
-    primaryToolbarHookState = _useCommentEditorPlug.primaryToolbarState,
-    editorViewModeState = _useCommentEditorPlug.editorViewModeState;
-  var primaryToolbarState = (0, _getPrimaryToolbarComponents.getPrimaryToolbarComponents)(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
+    editorViewMode = _useSharedPluginState.editorViewMode,
+    primaryToolbarComponentsState = _useSharedPluginState.primaryToolbarComponentsState,
+    maxContentSizeReached = _useSharedPluginState.maxContentSizeReached;
+  var primaryToolbarState = (0, _getPrimaryToolbarComponents.getPrimaryToolbarComponents)(editorAPI, primaryToolbarComponentsState);
   var _useSharedPluginState2 = (0, _hooks.useSharedPluginState)(editorAPI, ['media']),
     mediaState = _useSharedPluginState2.mediaState;
   var intl = (0, _reactIntlNext.useIntl)();
@@ -178,7 +159,6 @@ var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEdit
     pluginHooks = props.pluginHooks,
     featureFlags = props.featureFlags,
     innerRef = props.innerRef;
-  var maxContentSizeReached = Boolean(maxContentSizeState === null || maxContentSizeState === void 0 ? void 0 : maxContentSizeState.maxContentSizeReached);
   var showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
   var containerElement = _react.default.useRef(null);
 
@@ -248,7 +228,8 @@ var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEdit
     twoLineEditorToolbar: isTwoLineToolbarEnabled
   }, (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc', 'isEnabled', true) ? (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_CommentToolbar.CommentToolbar, {
     editorAPI: editorAPI,
-    editorView: editorView
+    editorView: editorView,
+    editorAppearance: appearance
   }), customToolbarSlot) : (0, _react2.jsx)(_uiMenu.ToolbarArrowKeyNavigationProvider, {
     editorView: editorView,
     childComponentSelector: "[data-testid='ak-editor-main-toolbar']",
@@ -305,7 +286,7 @@ var CommentEditorWithIntl = exports.CommentEditorWithIntl = function CommentEdit
         'less-margin': width < _editorSharedStyles.akEditorMobileBreakoutPoint
       }),
       featureFlags: featureFlags,
-      viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+      viewMode: editorViewMode,
       appearance: appearance
     }, customContentComponents && 'before' in customContentComponents ? (0, _contentComponentWrapper.contentComponentClickWrapper)(customContentComponents.before) : (0, _contentComponentWrapper.contentComponentClickWrapper)(customContentComponents), (0, _react2.jsx)(_PluginSlot.default, {
       editorView: editorView,

package/dist/cjs/ui/Appearance/Comment/CommentToolbar.js

@@ -15,7 +15,8 @@ var _Toolbar = require("../../Toolbar/Toolbar");
 var CommentToolbar = exports.CommentToolbar = function CommentToolbar(_ref) {
   var _editorAPI$toolbar;
   var editorAPI = _ref.editorAPI,
-    editorView = _ref.editorView;
+    editorView = _ref.editorView,
+    editorAppearance = _ref.editorAppearance;
   var components = editorAPI === null || editorAPI === void 0 || (_editorAPI$toolbar = editorAPI.toolbar) === null || _editorAPI$toolbar === void 0 ? void 0 : _editorAPI$toolbar.actions.getComponents();
   var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
     return component.key === _toolbar.TOOLBARS.PRIMARY_TOOLBAR;
@@ -27,6 +28,7 @@ var CommentToolbar = exports.CommentToolbar = function CommentToolbar(_ref) {
     toolbar: toolbar,
     components: components,
     editorView: editorView,
-    editorAPI: editorAPI
+    editorAPI: editorAPI,
+    editorAppearance: editorAppearance
   });
 };

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

@@ -69,36 +69,6 @@ var hasCustomComponents = function hasCustomComponents(components) {
   }
   return true;
 };
-var useFullPageEditorPluginsStates = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
-  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['primaryToolbar', 'interaction', 'editorViewMode'], function (states) {
-      var _states$primaryToolba, _states$interactionSt, _states$editorViewMod;
-      return {
-        primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
-        interactionState: (_states$interactionSt = states.interactionState) === null || _states$interactionSt === void 0 ? void 0 : _states$interactionSt.interactionState,
-        editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
-      };
-    }),
-    interactionState = _useSharedPluginState.interactionState,
-    primaryToolbarComponents = _useSharedPluginState.primaryToolbarComponents,
-    editorViewMode = _useSharedPluginState.editorViewMode;
-  return {
-    primaryToolbarState: !primaryToolbarComponents ? undefined : {
-      components: primaryToolbarComponents
-    },
-    editorViewModeState: !editorViewMode ? undefined : {
-      mode: editorViewMode
-    },
-    interactionState: interactionState
-  };
-}, function (pluginInjectionApi) {
-  var _sharedState$interact;
-  var sharedState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['editorViewMode', 'primaryToolbar', 'interaction']);
-  return {
-    primaryToolbarState: sharedState === null || sharedState === void 0 ? void 0 : sharedState.primaryToolbarState,
-    editorViewModeState: sharedState === null || sharedState === void 0 ? void 0 : sharedState.editorViewModeState,
-    interactionState: sharedState === null || sharedState === void 0 || (_sharedState$interact = sharedState.interactionState) === null || _sharedState$interact === void 0 ? void 0 : _sharedState$interact.interactionState
-  };
-});
 var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
   var _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
   var wrapperElementRef = (0, _react.useMemo)(function () {
@@ -107,11 +77,16 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
   var scrollContentContainerRef = (0, _react.useRef)(null);
   var showKeyline = useShowKeyline(scrollContentContainerRef);
   var editorAPI = props.editorAPI;
-  var _useFullPageEditorPlu = useFullPageEditorPluginsStates(editorAPI),
-    editorViewModeState = _useFullPageEditorPlu.editorViewModeState,
-    primaryToolbarHookState = _useFullPageEditorPlu.primaryToolbarState,
-    interactionState = _useFullPageEditorPlu.interactionState;
-  var primaryToolbarState = (0, _getPrimaryToolbarComponents.getPrimaryToolbarComponents)(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
+  var state = (0, _hooks.useSharedPluginStateWithSelector)(editorAPI, ['primaryToolbar', 'interaction', 'editorViewMode'], function (states) {
+    var _states$primaryToolba, _states$interactionSt, _states$editorViewMod;
+    return {
+      primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
+      interactionState: (_states$interactionSt = states.interactionState) === null || _states$interactionSt === void 0 ? void 0 : _states$interactionSt.interactionState,
+      editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
+    };
+  });
+  var interactionState = state.interactionState;
+  var primaryToolbarState = (0, _getPrimaryToolbarComponents.getPrimaryToolbarComponents)(editorAPI, state.primaryToolbarComponents);
   var hasHadInteraction = interactionState !== 'hasNotHadInteraction';
   var toolbarDocking = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(editorAPI, 'selectionToolbar.toolbarDocking', {
     disabled: (0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin')
@@ -145,7 +120,7 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
   if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
     primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
-  var isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  var isEditorToolbarHidden = state.editorViewMode === 'view';
   var customPrimaryToolbarComponents = props.customPrimaryToolbarComponents;
   if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1', {
     exposure: true
@@ -242,7 +217,7 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
     pluginHooks: props.pluginHooks,
     featureFlags: props.featureFlags,
     isEditorToolbarHidden: isEditorToolbarHidden,
-    viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+    viewMode: state.editorViewMode,
     hasHadInteraction: hasHadInteraction
   })));
 };

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

@@ -178,19 +178,12 @@ var SwappableContentAreaInner = /*#__PURE__*/function (_React$PureComponent) {
     }
   }]);
 }(_react.default.PureComponent);
-var useContextPanelSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
-  return (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['contextPanel'], function (states) {
+var SwappableContentArea = exports.SwappableContentArea = (0, _reactIntlNext.injectIntl)(SwappableContentAreaInner);
+function ContextPanel(props) {
+  var contextPanelContents = (0, _hooks.useSharedPluginStateWithSelector)(props.editorAPI, ['contextPanel'], function (states) {
     var _states$contextPanelS;
     return states === null || states === void 0 || (_states$contextPanelS = states.contextPanelState) === null || _states$contextPanelS === void 0 ? void 0 : _states$contextPanelS.contents;
   });
-}, function (pluginInjectionApi) {
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['contextPanel']),
-    contextPanelState = _useSharedPluginState.contextPanelState;
-  return contextPanelState === null || contextPanelState === void 0 ? void 0 : contextPanelState.contents;
-});
-var SwappableContentArea = exports.SwappableContentArea = (0, _reactIntlNext.injectIntl)(SwappableContentAreaInner);
-function ContextPanel(props) {
-  var contextPanelContents = useContextPanelSharedState(props.editorAPI);
   var firstContent = contextPanelContents && contextPanelContents.find(Boolean);
   return (0, _react2.jsx)(SwappableContentArea
   // Ignored via go/ees005

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "210.2.4";
+var version = exports.version = "210.2.6";

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

@@ -7,7 +7,7 @@ import React, { Fragment } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
@@ -96,17 +96,6 @@ ContentArea.displayName = 'ContentArea';
 const EditorContainer = componentWithCondition(() => editorExperiment('platform_editor_core_static_emotion', true, {
   exposure: true
 }), EditorContentContainer, ContentArea);
-const useEditorViewModePluginState = sharedPluginStateHookMigratorFactory(pluginInjectionApi => {
-  return useSharedPluginStateWithSelector(pluginInjectionApi, ['editorViewMode'], states => {
-    var _states$editorViewMod;
-    return states === null || states === void 0 ? void 0 : (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
-  });
-}, pluginInjectionApi => {
-  const {
-    editorViewModeState
-  } = useSharedPluginState(pluginInjectionApi, ['editorViewMode']);
-  return editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
-});
 
 /**
  * Render the editor in a chromeless appearance.
@@ -141,7 +130,10 @@ export default class Editor extends React.Component {
         featureFlags
       } = this.props;
       const maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
-      const editorViewMode = useEditorViewModePluginState(this.props.editorAPI);
+      const editorViewMode = useSharedPluginStateWithSelector(this.props.editorAPI, ['editorViewMode'], states => {
+        var _states$editorViewMod;
+        return states === null || states === void 0 ? void 0 : (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
+      });
       return jsx(WithFlash, {
         animate: maxContentSizeReached
       }, jsx(ChromelessEditorContainer, {
@@ -181,33 +173,19 @@ export default class Editor extends React.Component {
   }
 }
 _defineProperty(Editor, "displayName", 'ChromelessEditorAppearance');
-const useMaxContentSizePluginState = sharedPluginStateHookMigratorFactory(pluginInjectionApi => {
-  const maxContentSizeReached = useSharedPluginStateWithSelector(pluginInjectionApi, ['maxContentSize'], states => {
-    var _states$maxContentSiz;
-    return states === null || states === void 0 ? void 0 : (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached;
-  });
-  return {
-    maxContentSizeState: maxContentSizeReached === undefined ? undefined : {
-      maxContentSizeReached
-    }
-  };
-}, pluginInjectionApi => {
-  const {
-    maxContentSizeState
-  } = useSharedPluginState(pluginInjectionApi, ['maxContentSize']);
-  return {
-    maxContentSizeState
-  };
-});
 function RenderWithPluginState({
   renderChrome,
   editorAPI
 }) {
-  const {
-    maxContentSizeState
-  } = useMaxContentSizePluginState(editorAPI);
+  const maxContentSizeReached = useSharedPluginStateWithSelector(editorAPI, ['maxContentSize'], states => {
+    var _states$maxContentSiz;
+    return states === null || states === void 0 ? void 0 : (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached;
+  });
+  const maxContentSize = maxContentSizeReached === undefined ? undefined : {
+    maxContentSizeReached
+  };
   return jsx(Fragment, null, renderChrome({
-    maxContentSize: maxContentSizeState
+    maxContentSize
   }));
 }
 function ChromelessEditorContainerNext({

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

@@ -10,7 +10,7 @@ import classnames from 'classnames';
 import { useIntl } from 'react-intl-next';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/new';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import messages from '@atlaskit/editor-common/messages';
 import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
 import { WidthConsumer, WidthProvider } from '@atlaskit/editor-common/ui';
@@ -121,43 +121,23 @@ const appearance = 'comment';
 const EditorContainer = componentWithCondition(() => editorExperiment('platform_editor_core_static_emotion', true, {
   exposure: true
 }), EditorContentContainer, ContentArea);
-const useCommentEditorPluginsStates = sharedPluginStateHookMigratorFactory(pluginInjectionApi => {
+export const CommentEditorWithIntl = props => {
+  const {
+    editorAPI
+  } = props;
   const {
-    maxContentSizeReached,
-    primaryToolbarComponents,
-    editorViewMode
-  } = useSharedPluginStateWithSelector(pluginInjectionApi, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], states => {
+    editorViewMode,
+    primaryToolbarComponentsState,
+    maxContentSizeReached
+  } = useSharedPluginStateWithSelector(editorAPI, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], states => {
     var _states$maxContentSiz, _states$primaryToolba, _states$editorViewMod;
     return {
-      maxContentSizeReached: (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached,
-      primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
+      maxContentSizeReached: !!((_states$maxContentSiz = states.maxContentSizeState) !== null && _states$maxContentSiz !== void 0 && _states$maxContentSiz.maxContentSizeReached),
+      primaryToolbarComponentsState: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
       editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
     };
   });
-  return {
-    maxContentSizeState: maxContentSizeReached === undefined ? undefined : {
-      maxContentSizeReached
-    },
-    primaryToolbarState: !primaryToolbarComponents ? undefined : {
-      components: primaryToolbarComponents
-    },
-    editorViewModeState: !editorViewMode ? undefined : {
-      mode: editorViewMode
-    }
-  };
-}, pluginInjectionApi => {
-  return useSharedPluginState(pluginInjectionApi, ['maxContentSize', 'primaryToolbar', 'editorViewMode']);
-});
-export const CommentEditorWithIntl = props => {
-  const {
-    editorAPI
-  } = props;
-  const {
-    maxContentSizeState,
-    primaryToolbarState: primaryToolbarHookState,
-    editorViewModeState
-  } = useCommentEditorPluginsStates(editorAPI);
-  const primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
+  const primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarComponentsState);
   const {
     mediaState
   } = useSharedPluginState(editorAPI, ['media']);
@@ -187,7 +167,6 @@ export const CommentEditorWithIntl = props => {
     featureFlags,
     innerRef
   } = props;
-  const maxContentSizeReached = Boolean(maxContentSizeState === null || maxContentSizeState === void 0 ? void 0 : maxContentSizeState.maxContentSizeReached);
   const showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
   const containerElement = React.useRef(null);
 
@@ -250,7 +229,8 @@ export const CommentEditorWithIntl = props => {
     twoLineEditorToolbar: isTwoLineToolbarEnabled
   }, expValEquals('platform_editor_toolbar_aifc', 'isEnabled', true) ? jsx(React.Fragment, null, jsx(CommentToolbar, {
     editorAPI: editorAPI,
-    editorView: editorView
+    editorView: editorView,
+    editorAppearance: appearance
   }), customToolbarSlot) : jsx(ToolbarArrowKeyNavigationProvider, {
     editorView: editorView,
     childComponentSelector: "[data-testid='ak-editor-main-toolbar']",
@@ -308,7 +288,7 @@ export const CommentEditorWithIntl = props => {
         'less-margin': width < akEditorMobileBreakoutPoint
       }),
       featureFlags: featureFlags,
-      viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+      viewMode: editorViewMode,
       appearance: appearance
     }, customContentComponents && 'before' in customContentComponents ? contentComponentClickWrapper(customContentComponents.before) : contentComponentClickWrapper(customContentComponents), jsx(PluginSlot, {
       editorView: editorView,

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

@@ -7,7 +7,8 @@ import { ToolbarNext } from '../../Toolbar/Toolbar';
  */
 export const CommentToolbar = ({
   editorAPI,
-  editorView
+  editorView,
+  editorAppearance
 }) => {
   var _editorAPI$toolbar;
   const components = editorAPI === null || editorAPI === void 0 ? void 0 : (_editorAPI$toolbar = editorAPI.toolbar) === null || _editorAPI$toolbar === void 0 ? void 0 : _editorAPI$toolbar.actions.getComponents();
@@ -19,6 +20,7 @@ export const CommentToolbar = ({
     toolbar: toolbar,
     components: components,
     editorView: editorView,
-    editorAPI: editorAPI
+    editorAPI: editorAPI,
+    editorAppearance: editorAppearance
   });
 };

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

@@ -8,7 +8,7 @@ import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { IntlProvider } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/browser';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT } from '@atlaskit/editor-shared-styles';
@@ -53,12 +53,13 @@ const hasCustomComponents = components => {
   }
   return true;
 };
-const useFullPageEditorPluginsStates = sharedPluginStateHookMigratorFactory(pluginInjectionApi => {
-  const {
-    interactionState,
-    primaryToolbarComponents,
-    editorViewMode
-  } = useSharedPluginStateWithSelector(pluginInjectionApi, ['primaryToolbar', 'interaction', 'editorViewMode'], states => {
+export const FullPageEditor = props => {
+  var _scrollContentContain, _toolbarDockingPositi, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
+  const wrapperElementRef = useMemo(() => props.innerRef, [props.innerRef]);
+  const scrollContentContainerRef = useRef(null);
+  const showKeyline = useShowKeyline(scrollContentContainerRef);
+  const editorAPI = props.editorAPI;
+  const state = useSharedPluginStateWithSelector(editorAPI, ['primaryToolbar', 'interaction', 'editorViewMode'], states => {
     var _states$primaryToolba, _states$interactionSt, _states$editorViewMod;
     return {
       primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
@@ -66,36 +67,8 @@ const useFullPageEditorPluginsStates = sharedPluginStateHookMigratorFactory(plug
       editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
     };
   });
-  return {
-    primaryToolbarState: !primaryToolbarComponents ? undefined : {
-      components: primaryToolbarComponents
-    },
-    editorViewModeState: !editorViewMode ? undefined : {
-      mode: editorViewMode
-    },
-    interactionState
-  };
-}, pluginInjectionApi => {
-  var _sharedState$interact;
-  const sharedState = useSharedPluginState(pluginInjectionApi, ['editorViewMode', 'primaryToolbar', 'interaction']);
-  return {
-    primaryToolbarState: sharedState === null || sharedState === void 0 ? void 0 : sharedState.primaryToolbarState,
-    editorViewModeState: sharedState === null || sharedState === void 0 ? void 0 : sharedState.editorViewModeState,
-    interactionState: sharedState === null || sharedState === void 0 ? void 0 : (_sharedState$interact = sharedState.interactionState) === null || _sharedState$interact === void 0 ? void 0 : _sharedState$interact.interactionState
-  };
-});
-export const FullPageEditor = props => {
-  var _scrollContentContain, _toolbarDockingPositi, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
-  const wrapperElementRef = useMemo(() => props.innerRef, [props.innerRef]);
-  const scrollContentContainerRef = useRef(null);
-  const showKeyline = useShowKeyline(scrollContentContainerRef);
-  const editorAPI = props.editorAPI;
-  const {
-    editorViewModeState,
-    primaryToolbarState: primaryToolbarHookState,
-    interactionState
-  } = useFullPageEditorPluginsStates(editorAPI);
-  const primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
+  const interactionState = state.interactionState;
+  const primaryToolbarState = getPrimaryToolbarComponents(editorAPI, state.primaryToolbarComponents);
   const hasHadInteraction = interactionState !== 'hasNotHadInteraction';
   let toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking', {
     disabled: fg('platform_editor_use_preferences_plugin')
@@ -130,7 +103,7 @@ export const FullPageEditor = props => {
   if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
     primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
-  let isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  let isEditorToolbarHidden = state.editorViewMode === 'view';
   const {
     customPrimaryToolbarComponents
   } = props;
@@ -229,7 +202,7 @@ export const FullPageEditor = props => {
     pluginHooks: props.pluginHooks,
     featureFlags: props.featureFlags,
     isEditorToolbarHidden: isEditorToolbarHidden,
-    viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+    viewMode: state.editorViewMode,
     hasHadInteraction: hasHadInteraction
   })));
 };

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

@@ -11,7 +11,7 @@ import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import Transition from 'react-transition-group/Transition';
 import { ContextPanelConsumer } from '@atlaskit/editor-common/context-panel';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { contextPanelMessages } from '@atlaskit/editor-common/messages';
 import { akEditorContextPanelWidth, akEditorSwoopCubicBezier } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
@@ -155,20 +155,12 @@ class SwappableContentAreaInner extends React.PureComponent {
     });
   }
 }
-const useContextPanelSharedState = sharedPluginStateHookMigratorFactory(pluginInjectionApi => {
-  return useSharedPluginStateWithSelector(pluginInjectionApi, ['contextPanel'], states => {
+export const SwappableContentArea = injectIntl(SwappableContentAreaInner);
+export function ContextPanel(props) {
+  const contextPanelContents = useSharedPluginStateWithSelector(props.editorAPI, ['contextPanel'], states => {
     var _states$contextPanelS;
     return states === null || states === void 0 ? void 0 : (_states$contextPanelS = states.contextPanelState) === null || _states$contextPanelS === void 0 ? void 0 : _states$contextPanelS.contents;
   });
-}, pluginInjectionApi => {
-  const {
-    contextPanelState
-  } = useSharedPluginState(pluginInjectionApi, ['contextPanel']);
-  return contextPanelState === null || contextPanelState === void 0 ? void 0 : contextPanelState.contents;
-});
-export const SwappableContentArea = injectIntl(SwappableContentAreaInner);
-export function ContextPanel(props) {
-  const contextPanelContents = useContextPanelSharedState(props.editorAPI);
   const firstContent = contextPanelContents && contextPanelContents.find(Boolean);
   return jsx(SwappableContentArea
   // Ignored via go/ees005

package/dist/es2019/version-wrapper.js

@@ -1,2 +1,2 @@
 export const name = "@atlaskit/editor-core";
-export const version = "210.2.4";
+export const version = "210.2.6";

package/dist/esm/ui/Appearance/Chromeless.js

@@ -14,7 +14,7 @@ import React, { Fragment } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
@@ -105,16 +105,6 @@ var EditorContainer = componentWithCondition(function () {
     exposure: true
   });
 }, EditorContentContainer, ContentArea);
-var useEditorViewModePluginState = sharedPluginStateHookMigratorFactory(function (pluginInjectionApi) {
-  return useSharedPluginStateWithSelector(pluginInjectionApi, ['editorViewMode'], function (states) {
-    var _states$editorViewMod;
-    return states === null || states === void 0 || (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
-  });
-}, function (pluginInjectionApi) {
-  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['editorViewMode']),
-    editorViewModeState = _useSharedPluginState.editorViewModeState;
-  return editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
-});
 
 /**
  * Render the editor in a chromeless appearance.
@@ -153,7 +143,10 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         pluginHooks = _this$props.pluginHooks,
         featureFlags = _this$props.featureFlags;
       var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
-      var editorViewMode = useEditorViewModePluginState(_this.props.editorAPI);
+      var editorViewMode = useSharedPluginStateWithSelector(_this.props.editorAPI, ['editorViewMode'], function (states) {
+        var _states$editorViewMod;
+        return states === null || states === void 0 || (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode;
+      });
       return jsx(WithFlash, {
         animate: maxContentSizeReached
       }, jsx(ChromelessEditorContainer, {
@@ -201,30 +194,18 @@ var Editor = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 _defineProperty(Editor, "displayName", 'ChromelessEditorAppearance');
 export { Editor as default };
-var useMaxContentSizePluginState = sharedPluginStateHookMigratorFactory(function (pluginInjectionApi) {
-  var maxContentSizeReached = useSharedPluginStateWithSelector(pluginInjectionApi, ['maxContentSize'], function (states) {
+function RenderWithPluginState(_ref2) {
+  var renderChrome = _ref2.renderChrome,
+    editorAPI = _ref2.editorAPI;
+  var maxContentSizeReached = useSharedPluginStateWithSelector(editorAPI, ['maxContentSize'], function (states) {
     var _states$maxContentSiz;
     return states === null || states === void 0 || (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached;
   });
-  return {
-    maxContentSizeState: maxContentSizeReached === undefined ? undefined : {
-      maxContentSizeReached: maxContentSizeReached
-    }
-  };
-}, function (pluginInjectionApi) {
-  var _useSharedPluginState2 = useSharedPluginState(pluginInjectionApi, ['maxContentSize']),
-    maxContentSizeState = _useSharedPluginState2.maxContentSizeState;
-  return {
-    maxContentSizeState: maxContentSizeState
+  var maxContentSize = maxContentSizeReached === undefined ? undefined : {
+    maxContentSizeReached: maxContentSizeReached
   };
-});
-function RenderWithPluginState(_ref2) {
-  var renderChrome = _ref2.renderChrome,
-    editorAPI = _ref2.editorAPI;
-  var _useMaxContentSizePlu = useMaxContentSizePluginState(editorAPI),
-    maxContentSizeState = _useMaxContentSizePlu.maxContentSizeState;
   return jsx(Fragment, null, renderChrome({
-    maxContentSize: maxContentSizeState
+    maxContentSize: maxContentSize
   }));
 }
 function ChromelessEditorContainerNext(_ref3) {

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

@@ -14,7 +14,7 @@ import classnames from 'classnames';
 import { useIntl } from 'react-intl-next';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/new';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import messages from '@atlaskit/editor-common/messages';
 import { GRID_GUTTER } from '@atlaskit/editor-common/styles';
 import { WidthConsumer, WidthProvider } from '@atlaskit/editor-common/ui';
@@ -110,39 +110,20 @@ var EditorContainer = componentWithCondition(function () {
     exposure: true
   });
 }, EditorContentContainer, ContentArea);
-var useCommentEditorPluginsStates = sharedPluginStateHookMigratorFactory(function (pluginInjectionApi) {
-  var _useSharedPluginState = useSharedPluginStateWithSelector(pluginInjectionApi, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], function (states) {
+export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
+  var editorAPI = props.editorAPI;
+  var _useSharedPluginState = useSharedPluginStateWithSelector(editorAPI, ['maxContentSize', 'primaryToolbar', 'editorViewMode'], function (states) {
       var _states$maxContentSiz, _states$primaryToolba, _states$editorViewMod;
       return {
-        maxContentSizeReached: (_states$maxContentSiz = states.maxContentSizeState) === null || _states$maxContentSiz === void 0 ? void 0 : _states$maxContentSiz.maxContentSizeReached,
-        primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
+        maxContentSizeReached: !!((_states$maxContentSiz = states.maxContentSizeState) !== null && _states$maxContentSiz !== void 0 && _states$maxContentSiz.maxContentSizeReached),
+        primaryToolbarComponentsState: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
         editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
       };
     }),
-    maxContentSizeReached = _useSharedPluginState.maxContentSizeReached,
-    primaryToolbarComponents = _useSharedPluginState.primaryToolbarComponents,
-    editorViewMode = _useSharedPluginState.editorViewMode;
-  return {
-    maxContentSizeState: maxContentSizeReached === undefined ? undefined : {
-      maxContentSizeReached: maxContentSizeReached
-    },
-    primaryToolbarState: !primaryToolbarComponents ? undefined : {
-      components: primaryToolbarComponents
-    },
-    editorViewModeState: !editorViewMode ? undefined : {
-      mode: editorViewMode
-    }
-  };
-}, function (pluginInjectionApi) {
-  return useSharedPluginState(pluginInjectionApi, ['maxContentSize', 'primaryToolbar', 'editorViewMode']);
-});
-export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
-  var editorAPI = props.editorAPI;
-  var _useCommentEditorPlug = useCommentEditorPluginsStates(editorAPI),
-    maxContentSizeState = _useCommentEditorPlug.maxContentSizeState,
-    primaryToolbarHookState = _useCommentEditorPlug.primaryToolbarState,
-    editorViewModeState = _useCommentEditorPlug.editorViewModeState;
-  var primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
+    editorViewMode = _useSharedPluginState.editorViewMode,
+    primaryToolbarComponentsState = _useSharedPluginState.primaryToolbarComponentsState,
+    maxContentSizeReached = _useSharedPluginState.maxContentSizeReached;
+  var primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarComponentsState);
   var _useSharedPluginState2 = useSharedPluginState(editorAPI, ['media']),
     mediaState = _useSharedPluginState2.mediaState;
   var intl = useIntl();
@@ -170,7 +151,6 @@ export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
     pluginHooks = props.pluginHooks,
     featureFlags = props.featureFlags,
     innerRef = props.innerRef;
-  var maxContentSizeReached = Boolean(maxContentSizeState === null || maxContentSizeState === void 0 ? void 0 : maxContentSizeState.maxContentSizeReached);
   var showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
   var containerElement = React.useRef(null);
 
@@ -240,7 +220,8 @@ export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
     twoLineEditorToolbar: isTwoLineToolbarEnabled
   }, expValEquals('platform_editor_toolbar_aifc', 'isEnabled', true) ? jsx(React.Fragment, null, jsx(CommentToolbar, {
     editorAPI: editorAPI,
-    editorView: editorView
+    editorView: editorView,
+    editorAppearance: appearance
   }), customToolbarSlot) : jsx(ToolbarArrowKeyNavigationProvider, {
     editorView: editorView,
     childComponentSelector: "[data-testid='ak-editor-main-toolbar']",
@@ -297,7 +278,7 @@ export var CommentEditorWithIntl = function CommentEditorWithIntl(props) {
         'less-margin': width < akEditorMobileBreakoutPoint
       }),
       featureFlags: featureFlags,
-      viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+      viewMode: editorViewMode,
       appearance: appearance
     }, customContentComponents && 'before' in customContentComponents ? contentComponentClickWrapper(customContentComponents.before) : contentComponentClickWrapper(customContentComponents), jsx(PluginSlot, {
       editorView: editorView,

package/dist/esm/ui/Appearance/Comment/CommentToolbar.js

@@ -8,7 +8,8 @@ import { ToolbarNext } from '../../Toolbar/Toolbar';
 export var CommentToolbar = function CommentToolbar(_ref) {
   var _editorAPI$toolbar;
   var editorAPI = _ref.editorAPI,
-    editorView = _ref.editorView;
+    editorView = _ref.editorView,
+    editorAppearance = _ref.editorAppearance;
   var components = editorAPI === null || editorAPI === void 0 || (_editorAPI$toolbar = editorAPI.toolbar) === null || _editorAPI$toolbar === void 0 ? void 0 : _editorAPI$toolbar.actions.getComponents();
   var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
     return component.key === TOOLBARS.PRIMARY_TOOLBAR;
@@ -20,6 +21,7 @@ export var CommentToolbar = function CommentToolbar(_ref) {
     toolbar: toolbar,
     components: components,
     editorView: editorView,
-    editorAPI: editorAPI
+    editorAPI: editorAPI,
+    editorAppearance: editorAppearance
   });
 };

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

@@ -9,7 +9,7 @@ import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { IntlProvider } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/browser';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { ContextPanelWidthProvider } from '@atlaskit/editor-common/ui';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { FULL_PAGE_EDITOR_TOOLBAR_HEIGHT } from '@atlaskit/editor-shared-styles';
@@ -59,36 +59,6 @@ var hasCustomComponents = function hasCustomComponents(components) {
   }
   return true;
 };
-var useFullPageEditorPluginsStates = sharedPluginStateHookMigratorFactory(function (pluginInjectionApi) {
-  var _useSharedPluginState = useSharedPluginStateWithSelector(pluginInjectionApi, ['primaryToolbar', 'interaction', 'editorViewMode'], function (states) {
-      var _states$primaryToolba, _states$interactionSt, _states$editorViewMod;
-      return {
-        primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
-        interactionState: (_states$interactionSt = states.interactionState) === null || _states$interactionSt === void 0 ? void 0 : _states$interactionSt.interactionState,
-        editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
-      };
-    }),
-    interactionState = _useSharedPluginState.interactionState,
-    primaryToolbarComponents = _useSharedPluginState.primaryToolbarComponents,
-    editorViewMode = _useSharedPluginState.editorViewMode;
-  return {
-    primaryToolbarState: !primaryToolbarComponents ? undefined : {
-      components: primaryToolbarComponents
-    },
-    editorViewModeState: !editorViewMode ? undefined : {
-      mode: editorViewMode
-    },
-    interactionState: interactionState
-  };
-}, function (pluginInjectionApi) {
-  var _sharedState$interact;
-  var sharedState = useSharedPluginState(pluginInjectionApi, ['editorViewMode', 'primaryToolbar', 'interaction']);
-  return {
-    primaryToolbarState: sharedState === null || sharedState === void 0 ? void 0 : sharedState.primaryToolbarState,
-    editorViewModeState: sharedState === null || sharedState === void 0 ? void 0 : sharedState.editorViewModeState,
-    interactionState: sharedState === null || sharedState === void 0 || (_sharedState$interact = sharedState.interactionState) === null || _sharedState$interact === void 0 ? void 0 : _sharedState$interact.interactionState
-  };
-});
 export var FullPageEditor = function FullPageEditor(props) {
   var _scrollContentContain, _scrollContentContain2, _scrollContentContain3, _wrapperElementRef$cu;
   var wrapperElementRef = useMemo(function () {
@@ -97,11 +67,16 @@ export var FullPageEditor = function FullPageEditor(props) {
   var scrollContentContainerRef = useRef(null);
   var showKeyline = useShowKeyline(scrollContentContainerRef);
   var editorAPI = props.editorAPI;
-  var _useFullPageEditorPlu = useFullPageEditorPluginsStates(editorAPI),
-    editorViewModeState = _useFullPageEditorPlu.editorViewModeState,
-    primaryToolbarHookState = _useFullPageEditorPlu.primaryToolbarState,
-    interactionState = _useFullPageEditorPlu.interactionState;
-  var primaryToolbarState = getPrimaryToolbarComponents(editorAPI, primaryToolbarHookState === null || primaryToolbarHookState === void 0 ? void 0 : primaryToolbarHookState.components);
+  var state = useSharedPluginStateWithSelector(editorAPI, ['primaryToolbar', 'interaction', 'editorViewMode'], function (states) {
+    var _states$primaryToolba, _states$interactionSt, _states$editorViewMod;
+    return {
+      primaryToolbarComponents: (_states$primaryToolba = states.primaryToolbarState) === null || _states$primaryToolba === void 0 ? void 0 : _states$primaryToolba.components,
+      interactionState: (_states$interactionSt = states.interactionState) === null || _states$interactionSt === void 0 ? void 0 : _states$interactionSt.interactionState,
+      editorViewMode: (_states$editorViewMod = states.editorViewModeState) === null || _states$editorViewMod === void 0 ? void 0 : _states$editorViewMod.mode
+    };
+  });
+  var interactionState = state.interactionState;
+  var primaryToolbarState = getPrimaryToolbarComponents(editorAPI, state.primaryToolbarComponents);
   var hasHadInteraction = interactionState !== 'hasNotHadInteraction';
   var toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking', {
     disabled: fg('platform_editor_use_preferences_plugin')
@@ -135,7 +110,7 @@ export var FullPageEditor = function FullPageEditor(props) {
   if (Array.isArray(primaryToolbarState === null || primaryToolbarState === void 0 ? void 0 : primaryToolbarState.components) && Array.isArray(primaryToolbarComponents)) {
     primaryToolbarComponents = primaryToolbarState.components.concat(primaryToolbarComponents);
   }
-  var isEditorToolbarHidden = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'view';
+  var isEditorToolbarHidden = state.editorViewMode === 'view';
   var customPrimaryToolbarComponents = props.customPrimaryToolbarComponents;
   if (editorExperiment('platform_editor_controls', 'variant1', {
     exposure: true
@@ -232,7 +207,7 @@ export var FullPageEditor = function FullPageEditor(props) {
     pluginHooks: props.pluginHooks,
     featureFlags: props.featureFlags,
     isEditorToolbarHidden: isEditorToolbarHidden,
-    viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+    viewMode: state.editorViewMode,
     hasHadInteraction: hasHadInteraction
   })));
 };

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

@@ -20,7 +20,7 @@ import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import Transition from 'react-transition-group/Transition';
 import { ContextPanelConsumer } from '@atlaskit/editor-common/context-panel';
-import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { contextPanelMessages } from '@atlaskit/editor-common/messages';
 import { akEditorContextPanelWidth, akEditorSwoopCubicBezier } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
@@ -173,19 +173,12 @@ var SwappableContentAreaInner = /*#__PURE__*/function (_React$PureComponent) {
     }
   }]);
 }(React.PureComponent);
-var useContextPanelSharedState = sharedPluginStateHookMigratorFactory(function (pluginInjectionApi) {
-  return useSharedPluginStateWithSelector(pluginInjectionApi, ['contextPanel'], function (states) {
+export var SwappableContentArea = injectIntl(SwappableContentAreaInner);
+export function ContextPanel(props) {
+  var contextPanelContents = useSharedPluginStateWithSelector(props.editorAPI, ['contextPanel'], function (states) {
     var _states$contextPanelS;
     return states === null || states === void 0 || (_states$contextPanelS = states.contextPanelState) === null || _states$contextPanelS === void 0 ? void 0 : _states$contextPanelS.contents;
   });
-}, function (pluginInjectionApi) {
-  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['contextPanel']),
-    contextPanelState = _useSharedPluginState.contextPanelState;
-  return contextPanelState === null || contextPanelState === void 0 ? void 0 : contextPanelState.contents;
-});
-export var SwappableContentArea = injectIntl(SwappableContentAreaInner);
-export function ContextPanel(props) {
-  var contextPanelContents = useContextPanelSharedState(props.editorAPI);
   var firstContent = contextPanelContents && contextPanelContents.find(Boolean);
   return jsx(SwappableContentArea
   // Ignored via go/ees005

package/dist/esm/version-wrapper.js

@@ -1,2 +1,2 @@
 export var name = "@atlaskit/editor-core";
-export var version = "210.2.4";
+export var version = "210.2.6";

package/dist/types/ui/Appearance/Comment/CommentToolbar.d.ts

@@ -1,14 +1,15 @@
 import React from 'react';
-import type { OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
+import type { EditorAppearance, OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugins/toolbar';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 type ToolbarEditorPlugins = [OptionalPlugin<ToolbarPlugin>];
 type CommentToolbarProps = {
     editorAPI?: PublicPluginAPI<ToolbarEditorPlugins>;
+    editorAppearance: EditorAppearance;
     editorView?: EditorView;
 };
 /**
  * Primary toolbar driven by components registered by `editor-plugin-toolbar`, introduced in `platform_editor_toolbar_aifc`.
  */
-export declare const CommentToolbar: ({ editorAPI, editorView }: CommentToolbarProps) => React.JSX.Element | null;
+export declare const CommentToolbar: ({ editorAPI, editorView, editorAppearance, }: CommentToolbarProps) => React.JSX.Element | null;
 export {};

package/dist/types-ts4.5/ui/Appearance/Comment/CommentToolbar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
+import type { EditorAppearance, OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugins/toolbar';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 type ToolbarEditorPlugins = [
@@ -7,10 +7,11 @@ type ToolbarEditorPlugins = [
 ];
 type CommentToolbarProps = {
     editorAPI?: PublicPluginAPI<ToolbarEditorPlugins>;
+    editorAppearance: EditorAppearance;
     editorView?: EditorView;
 };
 /**
  * Primary toolbar driven by components registered by `editor-plugin-toolbar`, introduced in `platform_editor_toolbar_aifc`.
  */
-export declare const CommentToolbar: ({ editorAPI, editorView }: CommentToolbarProps) => React.JSX.Element | null;
+export declare const CommentToolbar: ({ editorAPI, editorView, editorAppearance, }: CommentToolbarProps) => React.JSX.Element | null;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "210.2.5",
+	"version": "210.2.7",
 	"description": "A package contains Atlassian editor core functionality",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -52,8 +52,8 @@
 		"@atlaskit/editor-plugins": "^10.2.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-shared-styles": "^3.6.0",
-		"@atlaskit/editor-toolbar": "^0.5.0",
-		"@atlaskit/editor-toolbar-model": "^0.1.0",
+		"@atlaskit/editor-toolbar": "^0.6.0",
+		"@atlaskit/editor-toolbar-model": "^0.2.0",
 		"@atlaskit/emoji": "^69.5.0",
 		"@atlaskit/icon": "^28.1.0",
 		"@atlaskit/link": "^3.2.0",
@@ -63,7 +63,7 @@
 		"@atlaskit/platform-feature-flags-react": "^0.2.0",
 		"@atlaskit/react-ufo": "^4.5.0",
 		"@atlaskit/task-decision": "^19.2.0",
-		"@atlaskit/tmp-editor-statsig": "^11.10.0",
+		"@atlaskit/tmp-editor-statsig": "^11.11.0",
 		"@atlaskit/tokens": "^6.1.0",
 		"@atlaskit/tooltip": "^20.4.0",
 		"@atlaskit/width-detector": "^5.0.0",
@@ -80,7 +80,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^107.33.0",
+		"@atlaskit/editor-common": "^107.34.0",
 		"@atlaskit/link-provider": "^3.7.0",
 		"@atlaskit/media-core": "^37.0.0",
 		"react": "^18.2.0",