@atlaskit/editor-plugin-insert-block 1.14.5 → 2.0.0

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/editor-plugin-insert-block
 
+## 2.0.0
+
+### Major Changes
+
+- [#141573](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/141573)
+  [`2360742cbceac`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2360742cbceac) -
+  [ux] Removing replacePlusMenuWithElementBrowser option from insert-block plugin. This is to ensure
+  consistent UI and reduce unnecessary code bundled with the editor. If you are currently using this
+  option you must remove it and it will use the new approach only now.
+
+### Minor Changes
+
+- [#140915](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/140915)
+  [`eaccad51157d6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/eaccad51157d6) -
+  [ux] Migrate new icons including color, highlight and task on Editor primary toolbar
+
+## 1.14.6
+
+### Patch Changes
+
+- [#141109](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/141109)
+  [`466f39066bd56`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/466f39066bd56) -
+  Enforce appearance check for all experiment code
+
 ## 1.14.5
 
 ### Patch Changes

package/dist/cjs/plugin.js

@@ -60,7 +60,7 @@ function handleInsertBlockType(insertCodeBlock, insertPanel, insertBlockQuote) {
   };
 }
 var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_ref) {
-  var _api$primaryToolbar;
+  var _api$primaryToolbar, _options$UNSAFE_edito3;
   var _ref$config = _ref.config,
     options = _ref$config === void 0 ? {} : _ref$config,
     api = _ref.api;
@@ -129,7 +129,10 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
       }
     },
     pmPlugins: function pmPlugins() {
-      if (!(0, _experiments.editorExperiment)('insert-menu-in-right-rail', true)) {
+      var _options$UNSAFE_edito;
+      if (
+      // @ts-ignore
+      !['full-page', 'full-width'].includes((_options$UNSAFE_edito = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito !== void 0 ? _options$UNSAFE_edito : '') || !(0, _experiments.editorExperiment)('insert-menu-in-right-rail', true)) {
         [];
       }
       return [{
@@ -213,11 +216,11 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
       // If we decide to ship the feature, we will consider a separate plugin if needed.
       // Experiment one-pager: https://hello.atlassian.net/wiki/spaces/ETM/pages/3983684902/Experiment+Drive+element+usage+via+element+templates
       quickInsert: function quickInsert(intl) {
-        var _options$UNSAFE_edito;
+        var _options$UNSAFE_edito2;
         var locale = intl.locale;
         var isEligible = locale.startsWith('en') &&
         // @ts-ignore
-        ['full-page', 'full-width'].includes((_options$UNSAFE_edito = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito !== void 0 ? _options$UNSAFE_edito : '');
+        ['full-page', 'full-width'].includes((_options$UNSAFE_edito2 = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito2 !== void 0 ? _options$UNSAFE_edito2 : '');
         if (isEligible && (0, _experiments.editorExperiment)('element-level-templates', true, {
           exposure: true
         })) {
@@ -235,7 +238,9 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
     },
     primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
   };
-  if ((0, _experiments.editorExperiment)('insert-menu-in-right-rail', true)) {
+  if (
+  // @ts-ignore
+  ['full-page', 'full-width'].includes((_options$UNSAFE_edito3 = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito3 !== void 0 ? _options$UNSAFE_edito3 : '') && (0, _experiments.editorExperiment)('insert-menu-in-right-rail', true)) {
     plugin.pluginsOptions.contextPanel = function (state) {
       // api.getSharedState() will have an outdated reference to editorState on first mount of this component
       // so instead just rely on plugin key as we don't need to be reactive to changes here
@@ -327,7 +332,6 @@ function ToolbarInsertBlockWithInjectionApi(_ref3) {
     insertMenuItems: options.insertMenuItems,
     editorActions: editorActions,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-    replacePlusMenuWithElementBrowser: options.replacePlusMenuWithElementBrowser,
     showElementBrowserLink: options.showElementBrowserLink,
     showSeparator: !isLastItem && toolbarSize <= _types.ToolbarSize.S,
     registerToggleDropdownMenuOptions: registerToggleDropdownMenuOptions

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

@@ -112,14 +112,14 @@ var InsertMenuRail = exports.InsertMenuRail = function InsertMenuRail(_ref) {
         (_api$emoji = api.emoji) === null || _api$emoji === void 0 || _api$emoji.actions.openTypeAhead(inputMethod);
         break;
       case 'codeblock':
-        (_api$codeBlock = api.codeBlock) === null || _api$codeBlock === void 0 || _api$codeBlock.actions.insertCodeBlock(inputMethod);
+        (_api$codeBlock = api.codeBlock) === null || _api$codeBlock === void 0 || _api$codeBlock.actions.insertCodeBlock(inputMethod)(state, dispatch);
         break;
       case 'blockquote':
         // @ts-expect-error
-        (_api$blockType = api.blockType) === null || _api$blockType === void 0 || _api$blockType.actions.insertBlockQuote(inputMethod);
+        (_api$blockType = api.blockType) === null || _api$blockType === void 0 || _api$blockType.actions.insertBlockQuote(inputMethod)(state, dispatch);
         break;
       case 'panel':
-        (_api$panel = api.panel) === null || _api$panel === void 0 || _api$panel.actions.insertPanel(inputMethod);
+        (_api$panel = api.panel) === null || _api$panel === void 0 || _api$panel.actions.insertPanel(inputMethod)(state, dispatch);
         break;
       case 'action':
         // @ts-expect-error

package/dist/cjs/ui/ToolbarInsertBlock/block-insert-menu.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.BlockInsertMenu = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _blockInsertElementBrowser = require("./block-insert-element-browser");
-var _blockInsertMenuLegacy = require("./block-insert-menu-legacy");
 var _dropdownButton = require("./dropdown-button");
 var BlockInsertMenu = exports.BlockInsertMenu = function BlockInsertMenu(props) {
   if (props.items.length === 0) {
@@ -27,40 +26,23 @@ var BlockInsertMenu = exports.BlockInsertMenu = function BlockInsertMenu(props)
       "aria-keyshortcuts": "/"
     }));
   }
-  if (props.replacePlusMenuWithElementBrowser) {
-    return /*#__PURE__*/_react.default.createElement(_blockInsertElementBrowser.BlockInsertElementBrowser, {
-      disabled: props.disabled,
-      editorView: props.editorView,
-      items: props.items,
-      label: props.label,
-      onClick: props.onClick,
-      onKeyDown: props.onKeyDown,
-      onInsert: props.onInsert,
-      onRef: props.onPlusButtonRef,
-      open: props.open,
-      plusButtonRef: props.plusButtonRef,
-      popupsBoundariesElement: props.popupsBoundariesElement,
-      popupsMountPoint: props.popupsMountPoint,
-      popupsScrollableElement: props.popupsScrollableElement,
-      spacing: props.spacing,
-      togglePlusMenuVisibility: props.togglePlusMenuVisibility,
-      showElementBrowserLink: props.showElementBrowserLink,
-      pluginInjectionApi: props.pluginInjectionApi
-    });
-  }
-  return /*#__PURE__*/_react.default.createElement(_blockInsertMenuLegacy.BlockInsertMenuLegacy, {
+  return /*#__PURE__*/_react.default.createElement(_blockInsertElementBrowser.BlockInsertElementBrowser, {
     disabled: props.disabled,
+    editorView: props.editorView,
     items: props.items,
     label: props.label,
     onClick: props.onClick,
     onKeyDown: props.onKeyDown,
-    onItemActivated: props.onItemActivated,
-    onOpenChange: props.onOpenChange,
-    onRef: props.onRef,
+    onInsert: props.onInsert,
+    onRef: props.onPlusButtonRef,
     open: props.open,
+    plusButtonRef: props.plusButtonRef,
     popupsBoundariesElement: props.popupsBoundariesElement,
     popupsMountPoint: props.popupsMountPoint,
     popupsScrollableElement: props.popupsScrollableElement,
-    spacing: props.spacing
+    spacing: props.spacing,
+    togglePlusMenuVisibility: props.togglePlusMenuVisibility,
+    showElementBrowserLink: props.showElementBrowserLink,
+    pluginInjectionApi: props.pluginInjectionApi
   });
 };

package/dist/cjs/ui/ToolbarInsertBlock/create-items.js

@@ -15,7 +15,6 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _item = require("./item");
 var _messages2 = require("./messages");
 var _shallowEquals = require("./shallow-equals");
-var _sortItems = require("./sort-items");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var buttonToItem = (0, _memoize.default)(function (button) {
@@ -63,8 +62,7 @@ var createInsertBlockItems = function createInsertBlockItems(config) {
     expandEnabled = config.expandEnabled,
     numberOfButtons = config.numberOfButtons,
     schema = config.schema,
-    formatMessage = config.formatMessage,
-    isNewMenuEnabled = config.isNewMenuEnabled;
+    formatMessage = config.formatMessage;
   var items = [];
   if (actionSupported) {
     items.push((0, _item.action)({
@@ -223,7 +221,7 @@ var createInsertBlockItems = function createInsertBlockItems(config) {
     var name = _ref.value.name;
     return name !== 'table selector';
   });
-  var dropdownItems = (!isNewMenuEnabled ? (0, _sortItems.sortItems)(remainingItems) : remainingItems).map(buttonToDropdownItem(formatMessage(_messages2.messages.insertMenu)));
+  var dropdownItems = remainingItems.map(buttonToDropdownItem(formatMessage(_messages2.messages.insertMenu)));
   return [buttonItems, dropdownItems];
 };
 var createItems = exports.createItems = (0, _memoizeOne.default)(createInsertBlockItems, _shallowEquals.shallowEquals);

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

@@ -213,11 +213,12 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
       (_this$unregisterToggl = (_this2 = _this).unregisterToggleDropdownMenuOptions) === null || _this$unregisterToggl === void 0 || _this$unregisterToggl.call(_this2);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClick", function () {
+      var _this$props$editorApp;
       /**
        * For insert menu in right rail experiment
        * - Clean up ticket ED-24801
        */
-      if ((0, _experiments.editorExperiment)('insert-menu-in-right-rail', true, {
+      if (['full-page', 'full-width'].includes((_this$props$editorApp = _this.props.editorAppearance) !== null && _this$props$editorApp !== void 0 ? _this$props$editorApp : '') && (0, _experiments.editorExperiment)('insert-menu-in-right-rail', true, {
         exposure: true
       })) {
         var pluginInjectionApi = _this.props.pluginInjectionApi;
@@ -245,11 +246,12 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleOpenByKeyboard", function (event) {
       if (event.key === 'Enter' || event.key === ' ') {
+        var _this$props$editorApp2;
         /**
          * For insert menu in right rail experiment
          * - Clean up ticket ED-24801
          */
-        if ((0, _experiments.editorExperiment)('insert-menu-in-right-rail', true, {
+        if (['full-page', 'full-width'].includes((_this$props$editorApp2 = _this.props.editorAppearance) !== null && _this$props$editorApp2 !== void 0 ? _this$props$editorApp2 : '') && (0, _experiments.editorExperiment)('insert-menu-in-right-rail', true, {
           exposure: true
         })) {
           var _this$props$pluginInj;
@@ -567,13 +569,12 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
         popupsMountPoint = _this$props11.popupsMountPoint,
         popupsBoundariesElement = _this$props11.popupsBoundariesElement,
         popupsScrollableElement = _this$props11.popupsScrollableElement,
-        emojiProvider = _this$props11.emojiProvider,
-        replacePlusMenuWithElementBrowser = _this$props11.replacePlusMenuWithElementBrowser;
+        emojiProvider = _this$props11.emojiProvider;
       var dropdownEmoji = this.state.dropdownItems.some(function (_ref7) {
         var name = _ref7.value.name;
         return name === 'emoji';
       });
-      var dropDownButtonRef = replacePlusMenuWithElementBrowser ? this.plusButtonRef : this.dropdownButtonRef;
+      var dropDownButtonRef = this.plusButtonRef;
       var ref = dropdownEmoji ? dropDownButtonRef : this.emojiButtonRef;
       if (!emojiPickerOpen || !ref || !emojiProvider) {
         return null;
@@ -658,7 +659,6 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
         _tableSelectorButton5,
         _tableSelectorButton6,
         _this$props$isDisable,
-        _this$props$replacePl,
         _this$props$pluginInj3;
       var _this$state2 = this.state,
         buttons = _this$state2.buttons,
@@ -787,7 +787,6 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
           onInsert: this.insertInsertMenuItem,
           onOpenChange: this.onOpenChange,
           togglePlusMenuVisibility: this.togglePlusMenuVisibility,
-          replacePlusMenuWithElementBrowser: (_this$props$replacePl = this.props.replacePlusMenuWithElementBrowser) !== null && _this$props$replacePl !== void 0 ? _this$props$replacePl : false,
           showElementBrowserLink: this.props.showElementBrowserLink || false,
           pluginInjectionApi: this.props.pluginInjectionApi
         })), !((_this$props$pluginInj3 = this.props.pluginInjectionApi) !== null && _this$props$pluginInj3 !== void 0 && _this$props$pluginInj3.primaryToolbar) && this.props.showSeparator && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */
@@ -827,8 +826,7 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
           insertMenuItems: props.insertMenuItems,
           schema: props.editorView.state.schema,
           numberOfButtons: props.buttons,
-          formatMessage: props.intl.formatMessage,
-          isNewMenuEnabled: props.replacePlusMenuWithElementBrowser
+          formatMessage: props.intl.formatMessage
         }),
         _createItems2 = (0, _slicedToArray2.default)(_createItems, 2),
         buttons = _createItems2[0],

package/dist/cjs/ui/ToolbarInsertBlock/item.js

@@ -10,9 +10,10 @@ var _react2 = require("@emotion/react");
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _shortcut = require("@atlaskit/editor-shared-styles/shortcut");
+var _fieldText = _interopRequireDefault(require("@atlaskit/icon-lab/core/field-text"));
+var _status = _interopRequireDefault(require("@atlaskit/icon-lab/core/status"));
 var _angleBracketsEditorCode = _interopRequireDefault(require("@atlaskit/icon/core/migration/angle-brackets--editor-code"));
 var _calendarEditorDate = _interopRequireDefault(require("@atlaskit/icon/core/migration/calendar--editor-date"));
-var _checkboxCheckedEditorTask = _interopRequireDefault(require("@atlaskit/icon/core/migration/checkbox-checked--editor-task"));
 var _decisionEditorDecision = _interopRequireDefault(require("@atlaskit/icon/core/migration/decision--editor-decision"));
 var _emojiEditorEmoji = _interopRequireDefault(require("@atlaskit/icon/core/migration/emoji--editor-emoji"));
 var _gridEditorTable = _interopRequireDefault(require("@atlaskit/icon/core/migration/grid--editor-table"));
@@ -24,8 +25,10 @@ var _mentionEditorMention = _interopRequireDefault(require("@atlaskit/icon/core/
 var _minusEditorHorizontalRule = _interopRequireDefault(require("@atlaskit/icon/core/migration/minus--editor-horizontal-rule"));
 var _quotationMarkQuote = _interopRequireDefault(require("@atlaskit/icon/core/migration/quotation-mark--quote"));
 var _showMoreHorizontalEditorMore = _interopRequireDefault(require("@atlaskit/icon/core/migration/show-more-horizontal--editor-more"));
+var _task = _interopRequireDefault(require("@atlaskit/icon/core/task"));
+var _task2 = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/task"));
 var _text = _interopRequireDefault(require("@atlaskit/icon/glyph/media-services/text"));
-var _status = _interopRequireDefault(require("@atlaskit/icon/glyph/status"));
+var _status2 = _interopRequireDefault(require("@atlaskit/icon/glyph/status"));
 var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
 var _chevronRightChevronRightCircle = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-right--chevron-right-circle"));
 var _shallowEquals = require("./shallow-equals");
@@ -70,7 +73,14 @@ var action = exports.action = mem(function (init) {
     disabled: init.disabled,
     name: 'action',
     shortcut: '[]',
-    Icon: _checkboxCheckedEditorTask.default,
+    Icon: function Icon() {
+      return (0, _react2.jsx)(_task.default, {
+        label: "",
+        color: "currentColor",
+        spacing: "spacious",
+        LEGACY_fallbackIcon: _task2.default
+      });
+    },
     'aria-keyshortcuts': '[ ] Space'
   });
 });
@@ -244,8 +254,11 @@ var placeholder = exports.placeholder = mem(function (init) {
     disabled: init.disabled,
     name: 'placeholder text',
     Icon: function Icon() {
-      return (0, _react2.jsx)(_text.default, {
-        label: ""
+      return (0, _react2.jsx)(_fieldText.default, {
+        label: "",
+        spacing: "spacious",
+        color: "currentColor",
+        LEGACY_fallbackIcon: _text.default
       });
     }
   });
@@ -256,7 +269,14 @@ var status = exports.status = mem(function (init) {
     tooltipDescription: init.tooltipDescription,
     disabled: init.disabled,
     name: 'status',
-    Icon: _status.default
+    Icon: function Icon() {
+      return (0, _react2.jsx)(_status.default, {
+        label: "",
+        color: "currentColor",
+        spacing: "spacious",
+        LEGACY_fallbackIcon: _status2.default
+      });
+    }
   });
 });
 var more = exports.more = mem(function (init) {

package/dist/es2019/plugin.js

@@ -51,7 +51,7 @@ export const insertBlockPlugin = ({
   config: options = {},
   api
 }) => {
-  var _api$primaryToolbar;
+  var _api$primaryToolbar, _options$UNSAFE_edito3;
   const toggleDropdownMenuOptionsRef = {
     current: null
   };
@@ -118,7 +118,10 @@ export const insertBlockPlugin = ({
       }
     },
     pmPlugins: () => {
-      if (!editorExperiment('insert-menu-in-right-rail', true)) {
+      var _options$UNSAFE_edito;
+      if (
+      // @ts-ignore
+      !['full-page', 'full-width'].includes((_options$UNSAFE_edito = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito !== void 0 ? _options$UNSAFE_edito : '') || !editorExperiment('insert-menu-in-right-rail', true)) {
         [];
       }
       return [{
@@ -204,13 +207,13 @@ export const insertBlockPlugin = ({
       // If we decide to ship the feature, we will consider a separate plugin if needed.
       // Experiment one-pager: https://hello.atlassian.net/wiki/spaces/ETM/pages/3983684902/Experiment+Drive+element+usage+via+element+templates
       quickInsert: intl => {
-        var _options$UNSAFE_edito;
+        var _options$UNSAFE_edito2;
         const {
           locale
         } = intl;
         const isEligible = locale.startsWith('en') &&
         // @ts-ignore
-        ['full-page', 'full-width'].includes((_options$UNSAFE_edito = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito !== void 0 ? _options$UNSAFE_edito : '');
+        ['full-page', 'full-width'].includes((_options$UNSAFE_edito2 = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito2 !== void 0 ? _options$UNSAFE_edito2 : '');
         if (isEligible && editorExperiment('element-level-templates', true, {
           exposure: true
         })) {
@@ -228,7 +231,9 @@ export const insertBlockPlugin = ({
     },
     primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined
   };
-  if (editorExperiment('insert-menu-in-right-rail', true)) {
+  if (
+  // @ts-ignore
+  ['full-page', 'full-width'].includes((_options$UNSAFE_edito3 = options.UNSAFE_editorAppearance) !== null && _options$UNSAFE_edito3 !== void 0 ? _options$UNSAFE_edito3 : '') && editorExperiment('insert-menu-in-right-rail', true)) {
     plugin.pluginsOptions.contextPanel = state => {
       // api.getSharedState() will have an outdated reference to editorState on first mount of this component
       // so instead just rely on plugin key as we don't need to be reactive to changes here
@@ -322,7 +327,6 @@ function ToolbarInsertBlockWithInjectionApi({
     insertMenuItems: options.insertMenuItems,
     editorActions: editorActions,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-    replacePlusMenuWithElementBrowser: options.replacePlusMenuWithElementBrowser,
     showElementBrowserLink: options.showElementBrowserLink,
     showSeparator: !isLastItem && toolbarSize <= ToolbarSize.S,
     registerToggleDropdownMenuOptions: registerToggleDropdownMenuOptions

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

@@ -106,14 +106,14 @@ export const InsertMenuRail = ({
         (_api$emoji = api.emoji) === null || _api$emoji === void 0 ? void 0 : _api$emoji.actions.openTypeAhead(inputMethod);
         break;
       case 'codeblock':
-        (_api$codeBlock = api.codeBlock) === null || _api$codeBlock === void 0 ? void 0 : _api$codeBlock.actions.insertCodeBlock(inputMethod);
+        (_api$codeBlock = api.codeBlock) === null || _api$codeBlock === void 0 ? void 0 : _api$codeBlock.actions.insertCodeBlock(inputMethod)(state, dispatch);
         break;
       case 'blockquote':
         // @ts-expect-error
-        (_api$blockType = api.blockType) === null || _api$blockType === void 0 ? void 0 : _api$blockType.actions.insertBlockQuote(inputMethod);
+        (_api$blockType = api.blockType) === null || _api$blockType === void 0 ? void 0 : _api$blockType.actions.insertBlockQuote(inputMethod)(state, dispatch);
         break;
       case 'panel':
-        (_api$panel = api.panel) === null || _api$panel === void 0 ? void 0 : _api$panel.actions.insertPanel(inputMethod);
+        (_api$panel = api.panel) === null || _api$panel === void 0 ? void 0 : _api$panel.actions.insertPanel(inputMethod)(state, dispatch);
         break;
       case 'action':
         // @ts-expect-error

package/dist/es2019/ui/ToolbarInsertBlock/block-insert-menu.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { BlockInsertElementBrowser } from './block-insert-element-browser';
-import { BlockInsertMenuLegacy } from './block-insert-menu-legacy';
 import { DropDownButton } from './dropdown-button';
 export const BlockInsertMenu = props => {
   if (props.items.length === 0) {
@@ -20,40 +19,23 @@ export const BlockInsertMenu = props => {
       "aria-keyshortcuts": "/"
     }));
   }
-  if (props.replacePlusMenuWithElementBrowser) {
-    return /*#__PURE__*/React.createElement(BlockInsertElementBrowser, {
-      disabled: props.disabled,
-      editorView: props.editorView,
-      items: props.items,
-      label: props.label,
-      onClick: props.onClick,
-      onKeyDown: props.onKeyDown,
-      onInsert: props.onInsert,
-      onRef: props.onPlusButtonRef,
-      open: props.open,
-      plusButtonRef: props.plusButtonRef,
-      popupsBoundariesElement: props.popupsBoundariesElement,
-      popupsMountPoint: props.popupsMountPoint,
-      popupsScrollableElement: props.popupsScrollableElement,
-      spacing: props.spacing,
-      togglePlusMenuVisibility: props.togglePlusMenuVisibility,
-      showElementBrowserLink: props.showElementBrowserLink,
-      pluginInjectionApi: props.pluginInjectionApi
-    });
-  }
-  return /*#__PURE__*/React.createElement(BlockInsertMenuLegacy, {
+  return /*#__PURE__*/React.createElement(BlockInsertElementBrowser, {
     disabled: props.disabled,
+    editorView: props.editorView,
     items: props.items,
     label: props.label,
     onClick: props.onClick,
     onKeyDown: props.onKeyDown,
-    onItemActivated: props.onItemActivated,
-    onOpenChange: props.onOpenChange,
-    onRef: props.onRef,
+    onInsert: props.onInsert,
+    onRef: props.onPlusButtonRef,
     open: props.open,
+    plusButtonRef: props.plusButtonRef,
     popupsBoundariesElement: props.popupsBoundariesElement,
     popupsMountPoint: props.popupsMountPoint,
     popupsScrollableElement: props.popupsScrollableElement,
-    spacing: props.spacing
+    spacing: props.spacing,
+    togglePlusMenuVisibility: props.togglePlusMenuVisibility,
+    showElementBrowserLink: props.showElementBrowserLink,
+    pluginInjectionApi: props.pluginInjectionApi
   });
 };

package/dist/es2019/ui/ToolbarInsertBlock/create-items.js

@@ -6,7 +6,6 @@ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
 import { action, blockquote, codeblock, date, decision, emoji, expand, horizontalrule, imageUpload, layout, link, media, mention, more, panel, placeholder, status, table, tableSelector } from './item';
 import { messages } from './messages';
 import { shallowEquals } from './shallow-equals';
-import { sortItems } from './sort-items';
 const buttonToItem = memoize(button => ({
   ...button,
   title: /*#__PURE__*/React.createElement(ToolTipContent, {
@@ -49,8 +48,7 @@ const createInsertBlockItems = config => {
     expandEnabled,
     numberOfButtons,
     schema,
-    formatMessage,
-    isNewMenuEnabled
+    formatMessage
   } = config;
   const items = [];
   if (actionSupported) {
@@ -205,7 +203,7 @@ const createInsertBlockItems = config => {
       name
     }
   }) => name !== 'table selector');
-  const dropdownItems = (!isNewMenuEnabled ? sortItems(remainingItems) : remainingItems).map(buttonToDropdownItem(formatMessage(messages.insertMenu)));
+  const dropdownItems = remainingItems.map(buttonToDropdownItem(formatMessage(messages.insertMenu)));
   return [buttonItems, dropdownItems];
 };
 export const createItems = memoizeOne(createInsertBlockItems, shallowEquals);

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

@@ -211,11 +211,12 @@ export class ToolbarInsertBlock extends React.PureComponent {
       (_this$unregisterToggl = this.unregisterToggleDropdownMenuOptions) === null || _this$unregisterToggl === void 0 ? void 0 : _this$unregisterToggl.call(this);
     });
     _defineProperty(this, "handleClick", () => {
+      var _this$props$editorApp;
       /**
        * For insert menu in right rail experiment
        * - Clean up ticket ED-24801
        */
-      if (editorExperiment('insert-menu-in-right-rail', true, {
+      if (['full-page', 'full-width'].includes((_this$props$editorApp = this.props.editorAppearance) !== null && _this$props$editorApp !== void 0 ? _this$props$editorApp : '') && editorExperiment('insert-menu-in-right-rail', true, {
         exposure: true
       })) {
         const {
@@ -246,11 +247,12 @@ export class ToolbarInsertBlock extends React.PureComponent {
     });
     _defineProperty(this, "handleOpenByKeyboard", event => {
       if (event.key === 'Enter' || event.key === ' ') {
+        var _this$props$editorApp2;
         /**
          * For insert menu in right rail experiment
          * - Clean up ticket ED-24801
          */
-        if (editorExperiment('insert-menu-in-right-rail', true, {
+        if (['full-page', 'full-width'].includes((_this$props$editorApp2 = this.props.editorAppearance) !== null && _this$props$editorApp2 !== void 0 ? _this$props$editorApp2 : '') && editorExperiment('insert-menu-in-right-rail', true, {
           exposure: true
         })) {
           var _this$props$pluginInj;
@@ -584,8 +586,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
       insertMenuItems: props.insertMenuItems,
       schema: props.editorView.state.schema,
       numberOfButtons: props.buttons,
-      formatMessage: props.intl.formatMessage,
-      isNewMenuEnabled: props.replacePlusMenuWithElementBrowser
+      formatMessage: props.intl.formatMessage
     });
     return {
       ...state,
@@ -627,15 +628,14 @@ export class ToolbarInsertBlock extends React.PureComponent {
       popupsMountPoint,
       popupsBoundariesElement,
       popupsScrollableElement,
-      emojiProvider,
-      replacePlusMenuWithElementBrowser
+      emojiProvider
     } = this.props;
     const dropdownEmoji = this.state.dropdownItems.some(({
       value: {
         name
       }
     }) => name === 'emoji');
-    const dropDownButtonRef = replacePlusMenuWithElementBrowser ? this.plusButtonRef : this.dropdownButtonRef;
+    const dropDownButtonRef = this.plusButtonRef;
     const ref = dropdownEmoji ? dropDownButtonRef : this.emojiButtonRef;
     if (!emojiPickerOpen || !ref || !emojiProvider) {
       return null;
@@ -703,7 +703,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
     });
   }
   render() {
-    var _tableButton, _tableButton2, _tableButton3, _tableButton4, _tableButton5, _tableButton6, _tableButton7, _tableSelectorButton, _tableSelectorButton2, _tableSelectorButton3, _tableSelectorButton4, _tableSelectorButton5, _tableSelectorButton6, _this$props$isDisable, _this$props$replacePl, _this$props$pluginInj7;
+    var _tableButton, _tableButton2, _tableButton3, _tableButton4, _tableButton5, _tableButton6, _tableButton7, _tableSelectorButton, _tableSelectorButton2, _tableSelectorButton3, _tableSelectorButton4, _tableSelectorButton5, _tableSelectorButton6, _this$props$isDisable, _this$props$pluginInj7;
     const {
       buttons,
       dropdownItems,
@@ -822,7 +822,6 @@ export class ToolbarInsertBlock extends React.PureComponent {
         onInsert: this.insertInsertMenuItem,
         onOpenChange: this.onOpenChange,
         togglePlusMenuVisibility: this.togglePlusMenuVisibility,
-        replacePlusMenuWithElementBrowser: (_this$props$replacePl = this.props.replacePlusMenuWithElementBrowser) !== null && _this$props$replacePl !== void 0 ? _this$props$replacePl : false,
         showElementBrowserLink: this.props.showElementBrowserLink || false,
         pluginInjectionApi: this.props.pluginInjectionApi
       })), !((_this$props$pluginInj7 = this.props.pluginInjectionApi) !== null && _this$props$pluginInj7 !== void 0 && _this$props$pluginInj7.primaryToolbar) && this.props.showSeparator && /* eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage */

package/dist/es2019/ui/ToolbarInsertBlock/item.js

@@ -9,9 +9,10 @@ import { jsx } from '@emotion/react';
 import memoizeOne from 'memoize-one';
 import { addLink, getAriaKeyshortcuts, toggleTable, tooltip } from '@atlaskit/editor-common/keymaps';
 import { shortcutStyle } from '@atlaskit/editor-shared-styles/shortcut';
+import FieldTextIcon from '@atlaskit/icon-lab/core/field-text';
+import StatusIcon from '@atlaskit/icon-lab/core/status';
 import AngleBracketsIcon from '@atlaskit/icon/core/migration/angle-brackets--editor-code';
 import CalendarIcon from '@atlaskit/icon/core/migration/calendar--editor-date';
-import CheckboxCheckedIcon from '@atlaskit/icon/core/migration/checkbox-checked--editor-task';
 import DecisionIcon from '@atlaskit/icon/core/migration/decision--editor-decision';
 import EmojiIcon from '@atlaskit/icon/core/migration/emoji--editor-emoji';
 import GridIcon from '@atlaskit/icon/core/migration/grid--editor-table';
@@ -23,8 +24,10 @@ import MentionIcon from '@atlaskit/icon/core/migration/mention--editor-mention';
 import HorizontalRuleIcon from '@atlaskit/icon/core/migration/minus--editor-horizontal-rule';
 import QuotationMarkIcon from '@atlaskit/icon/core/migration/quotation-mark--quote';
 import ShowMoreHorizontalIcon from '@atlaskit/icon/core/migration/show-more-horizontal--editor-more';
+import TaskIcon from '@atlaskit/icon/core/task';
+import CheckboxCheckedIconLegacy from '@atlaskit/icon/glyph/editor/task';
 import PlaceholderTextIcon from '@atlaskit/icon/glyph/media-services/text';
-import StatusIcon from '@atlaskit/icon/glyph/status';
+import StatusIconLegacy from '@atlaskit/icon/glyph/status';
 import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
 import ExpandNodeIcon from '@atlaskit/icon/utility/migration/chevron-right--chevron-right-circle';
 import { shallowEquals } from './shallow-equals';
@@ -58,7 +61,12 @@ export const action = mem(init => {
     disabled: init.disabled,
     name: 'action',
     shortcut: '[]',
-    Icon: CheckboxCheckedIcon,
+    Icon: () => jsx(TaskIcon, {
+      label: "",
+      color: "currentColor",
+      spacing: "spacious",
+      LEGACY_fallbackIcon: CheckboxCheckedIconLegacy
+    }),
     'aria-keyshortcuts': '[ ] Space'
   });
 });
@@ -198,8 +206,11 @@ export const placeholder = mem(init => from({
   tooltipDescription: init.tooltipDescription,
   disabled: init.disabled,
   name: 'placeholder text',
-  Icon: () => jsx(PlaceholderTextIcon, {
-    label: ""
+  Icon: () => jsx(FieldTextIcon, {
+    label: "",
+    spacing: "spacious",
+    color: "currentColor",
+    LEGACY_fallbackIcon: PlaceholderTextIcon
   })
 }));
 export const status = mem(init => from({
@@ -207,7 +218,12 @@ export const status = mem(init => from({
   tooltipDescription: init.tooltipDescription,
   disabled: init.disabled,
   name: 'status',
-  Icon: StatusIcon
+  Icon: () => jsx(StatusIcon, {
+    label: "",
+    color: "currentColor",
+    spacing: "spacious",
+    LEGACY_fallbackIcon: StatusIconLegacy
+  })
 }));
 export const more = mem(init => from({
   content: init.content,