@atlaskit/editor-plugin-insert-block 22.0.3 → 22.0.4

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-insert-block
 
+## 22.0.4
+
+### Patch Changes
+
+- [`7306003a7565b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7306003a7565b) -
+  Fix modal dismissal, category spacing, measured list height, and viewport-aware menu placement
+  under platform_editor_slash_command.
+- Updated dependencies
+
 ## 22.0.3
 
 ### Patch Changes

package/dist/cjs/ui/ToolbarInsertBlock/block-insert-element-browser.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.BlockInsertElementBrowser = void 0;
 var _react = _interopRequireWildcard(require("react"));
+var _useMenuPopupSizing = require("@atlaskit/editor-common/quick-insert/use-menu-popup-sizing");
 var _ui = require("@atlaskit/editor-common/ui");
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _InsertMenu = _interopRequireWildcard(require("../ElementBrowser/InsertMenu"));
@@ -19,6 +20,15 @@ var FIT_HEIGHT_BUFFER = 100;
 var BlockInsertElementBrowser = exports.BlockInsertElementBrowser = function BlockInsertElementBrowser(props) {
   var togglePlusMenuVisibility = props.togglePlusMenuVisibility,
     plusButtonRef = props.plusButtonRef;
+  var isRegisteredMenu = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_slash_command');
+  var menuHeight = (0, _useMenuPopupSizing.useMenuPopupSizing)({
+    target: plusButtonRef,
+    boundariesElement: props.popupsBoundariesElement,
+    scrollableElement: props.popupsScrollableElement,
+    maxHeight: 520,
+    offset: 3,
+    isOpen: props.open && isRegisteredMenu
+  });
   var closeRegisteredMenu = (0, _react.useCallback)(function () {
     return togglePlusMenuVisibility();
   }, [togglePlusMenuVisibility]);
@@ -28,7 +38,7 @@ var BlockInsertElementBrowser = exports.BlockInsertElementBrowser = function Blo
   }, [togglePlusMenuVisibility, plusButtonRef]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, props.open && /*#__PURE__*/_react.default.createElement(_ui.Popup, {
     target: props.plusButtonRef,
-    fitHeight: _InsertMenu.DEFAULT_HEIGHT + FIT_HEIGHT_BUFFER,
+    fitHeight: isRegisteredMenu ? menuHeight : _InsertMenu.DEFAULT_HEIGHT + FIT_HEIGHT_BUFFER,
     fitWidth: 350
     // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
     ,
@@ -38,8 +48,9 @@ var BlockInsertElementBrowser = exports.BlockInsertElementBrowser = function Blo
     scrollableElement: props.popupsScrollableElement,
     preventOverflow: true,
     alignX: "right"
-  }, (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_slash_command') ? /*#__PURE__*/_react.default.createElement(_RegisteredInsertMenuContent.RegisteredInsertMenuContent, {
+  }, isRegisteredMenu ? /*#__PURE__*/_react.default.createElement(_RegisteredInsertMenuContent.RegisteredInsertMenuContent, {
     api: props.pluginInjectionApi,
+    maxHeight: menuHeight,
     editorView: props.editorView,
     isOffline: Boolean(props.isEditorOffline),
     onClose: closeRegisteredMenuAndRestoreFocus,

package/dist/cjs/ui/registered-insert-menu/RegisteredInsertButton.js

@@ -12,6 +12,7 @@ var _reactIntl = require("react-intl");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _messages = require("@atlaskit/editor-common/messages");
+var _useMenuPopupSizing = require("@atlaskit/editor-common/quick-insert/use-menu-popup-sizing");
 var _toolbar = require("@atlaskit/editor-common/toolbar");
 var _ui = require("@atlaskit/editor-common/ui");
 var _connectivityPluginType = require("@atlaskit/editor-plugin-connectivity/connectivityPluginType");
@@ -23,7 +24,6 @@ var _uiContext = require("@atlaskit/editor-toolbar/ui-context");
 var _RegisteredInsertMenuContent = require("./RegisteredInsertMenuContent");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var DEFAULT_MENU_MAX_HEIGHT = 520;
-var FIT_HEIGHT_BUFFER = 100;
 var POPUP_OFFSET = [0, 3];
 /**
  * The toolbar owns its popup lifecycle, but renders the same registered items
@@ -45,6 +45,14 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
     isOpen = _useState2[0],
     setIsOpen = _useState2[1];
   var buttonRef = (0, _react.useRef)(null);
+  var menuHeight = (0, _useMenuPopupSizing.useMenuPopupSizing)({
+    target: buttonRef.current,
+    boundariesElement: popupsBoundariesElement,
+    scrollableElement: popupsScrollableElement,
+    maxHeight: DEFAULT_MENU_MAX_HEIGHT,
+    offset: POPUP_OFFSET[1],
+    isOpen: isOpen
+  });
   var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['connectivity', 'typeAhead'], function (states) {
       var _states$connectivityS, _states$typeAheadStat;
       return {
@@ -101,7 +109,7 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
   })), isOpen && buttonRef.current && /*#__PURE__*/_react.default.createElement(_ui.Popup, {
     alignX: "right",
     boundariesElement: popupsBoundariesElement,
-    fitHeight: DEFAULT_MENU_MAX_HEIGHT + FIT_HEIGHT_BUFFER,
+    fitHeight: menuHeight,
     fitWidth: 350,
     mountTo: popupsMountPoint,
     offset: POPUP_OFFSET,
@@ -112,6 +120,7 @@ var RegisteredInsertButton = exports.RegisteredInsertButton = function Registere
     zIndex: _constants.akEditorMenuZIndex
   }, /*#__PURE__*/_react.default.createElement(_RegisteredInsertMenuContent.RegisteredInsertMenuContent, {
     api: api,
+    maxHeight: menuHeight,
     editorView: editorView,
     isOffline: (0, _connectivityPluginType.isOfflineMode)(connectivityMode),
     onClose: closeAndRestoreFocus,

package/dist/cjs/ui/registered-insert-menu/RegisteredInsertMenu.compiled.css

@@ -1,11 +1,11 @@
-._2rko12b0{border-radius:var(--ds-radius-small,4px)}
-._18zrutpp{padding-inline:var(--ds-space-150,9pt)}
-._1rjcutpp{padding-block:var(--ds-space-150,9pt)}._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}
+._18zrutpp{padding-inline:var(--ds-space-150,9pt)}._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
 ._18m915vq{overflow-y:hidden}
 ._1bsb1edt{width:350px}
 ._1e0c1txw{display:flex}
 ._1o9zidpf{flex-shrink:0}
+._1q51utpp{padding-block-start:var(--ds-space-150,9pt)}
 ._1reo15vq{overflow-x:hidden}
 ._2lx21bp4{flex-direction:column}
-._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
-._c71l1lk4{max-height:520px}
+._85i5u2gc{padding-block-end:var(--ds-space-100,8px)}
+._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}

package/dist/cjs/ui/registered-insert-menu/RegisteredInsertMenu.js

@@ -28,16 +28,21 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 var DEFAULT_MENU_MAX_HEIGHT = 520;
 var styles = {
-  menu: "_2rko12b0 _1reo15vq _18m915vq _bfhk1bhr _16qs130s _1e0c1txw _2lx21bp4 _c71l1lk4 _1bsb1edt",
-  search: "_1rjcutpp _18zrutpp _1o9zidpf"
+  menu: "_2rko1mok _1reo15vq _18m915vq _bfhk1bhr _16qs130s _1e0c1txw _2lx21bp4 _1bsb1edt",
+  search: "_18zrutpp _1o9zidpf _1q51utpp _85i5u2gc"
 };
 var RegisteredInsertMenu = exports.RegisteredInsertMenu = function RegisteredInsertMenu(_ref) {
   var components = _ref.components,
     emptyStateHandler = _ref.emptyStateHandler,
     editorView = _ref.editorView,
     isOffline = _ref.isOffline,
+    _ref$maxHeight = _ref.maxHeight,
+    maxHeight = _ref$maxHeight === void 0 ? DEFAULT_MENU_MAX_HEIGHT : _ref$maxHeight,
     onClose = _ref.onClose,
     onSelect = _ref.onSelect;
+  var menuStyle = {
+    maxHeight: maxHeight
+  };
   var _useIntl = (0, _reactIntl.useIntl)(),
     formatMessage = _useIntl.formatMessage;
   var listId = (0, _react.useId)();
@@ -62,6 +67,13 @@ var RegisteredInsertMenu = exports.RegisteredInsertMenu = function RegisteredIns
     renderedItems = _useState8[0],
     setRenderedItems = _useState8[1];
   var searchRef = (0, _react.useRef)(null);
+  (0, _react.useLayoutEffect)(function () {
+    var _searchRef$current;
+    // Popup positions on the next frame; focusing must not scroll to its initial location.
+    (_searchRef$current = searchRef.current) === null || _searchRef$current === void 0 || _searchRef$current.focus({
+      preventScroll: true
+    });
+  }, []);
   var surfaceContext = (0, _react.useMemo)(function () {
     return (0, _createSurfaceContext.createSurfaceContext)(_typeAheadSurfaceContext.TYPE_AHEAD_SURFACE_CONTEXT, {
       menuOpenId: menuOpenId
@@ -160,14 +172,14 @@ var RegisteredInsertMenu = exports.RegisteredInsertMenu = function RegisteredIns
     "data-keyboard-navigation-independent": "",
     testId: "registered-insert-menu",
     onKeyDownCapture: onKeyDown,
-    xcss: styles.menu
+    xcss: styles.menu,
+    style: menuStyle
   }, /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     xcss: styles.search
   }, /*#__PURE__*/_react.default.createElement(_textField.default, {
     "aria-activedescendant": isActiveItemMounted ? activeItemId : undefined,
     "aria-controls": listId,
     "aria-expanded": "true",
-    autoFocus: true,
     placeholder: "Search",
     ref: searchRef,
     role: "combobox",
@@ -179,7 +191,7 @@ var RegisteredInsertMenu = exports.RegisteredInsertMenu = function RegisteredIns
     isOffline: isOffline,
     listId: listId,
     listLabel: formatMessage(_messages.toolbarInsertBlockMessages.insertMenu),
-    maxHeight: DEFAULT_MENU_MAX_HEIGHT,
+    maxHeight: maxHeight,
     menuOpenId: menuOpenId,
     model: model,
     onClose: onSelect,

package/dist/cjs/ui/registered-insert-menu/RegisteredInsertMenuContent.js

@@ -25,6 +25,7 @@ var RegisteredInsertMenuContent = exports.RegisteredInsertMenuContent = function
   var api = _ref2.api,
     editorView = _ref2.editorView,
     isOffline = _ref2.isOffline,
+    maxHeight = _ref2.maxHeight,
     onClose = _ref2.onClose,
     onDismiss = _ref2.onDismiss,
     onSelect = _ref2.onSelect,
@@ -49,6 +50,7 @@ var RegisteredInsertMenuContent = exports.RegisteredInsertMenuContent = function
     editorView: editorView,
     emptyStateHandler: api === null || api === void 0 || (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 || (_api$quickInsert = _api$quickInsert.sharedState.currentState()) === null || _api$quickInsert === void 0 ? void 0 : _api$quickInsert.emptyStateHandler,
     isOffline: isOffline,
+    maxHeight: maxHeight,
     onClose: onClose,
     onSelect: onSelect
   }));

package/dist/cjs/ui/registered-insert-menu/RegisteredInsertMenuList.js

@@ -15,6 +15,7 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 var _react = _interopRequireWildcard(require("react"));
 var _CellMeasurer = require("react-virtualized/dist/commonjs/CellMeasurer");
 var _List = require("react-virtualized/dist/commonjs/List");
+var _useMenuListHeight2 = require("@atlaskit/editor-common/quick-insert/use-menu-list-height");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _RegisteredInsertMenuItem = require("./RegisteredInsertMenuItem");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -22,7 +23,8 @@ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 var ESTIMATED_ROW_HEIGHT = 56;
-var MENU_FOOTER_HEIGHT = 52;
+// 40px item + 8px block padding + 1px separator.
+var MENU_FOOTER_HEIGHT = 49;
 var MENU_SEARCH_HEIGHT = 64;
 var LIST_WIDTH = 350;
 var listAriaProps = {
@@ -101,6 +103,9 @@ var RegisteredInsertMenuList = exports.RegisteredInsertMenuList = function Regis
       return "".concat(type, ":").concat(key);
     }).join('\0');
   }, [rows]);
+  var _useMenuListHeight = (0, _useMenuListHeight2.useMenuListHeight)(cache, rows.length, rowKeySignature),
+    measuredHeight = _useMenuListHeight.height,
+    updateHeight = _useMenuListHeight.updateHeight;
   (0, _react.useLayoutEffect)(function () {
     var _listRef$current, _listRef$current2;
     cache.clearAll();
@@ -111,6 +116,7 @@ var RegisteredInsertMenuList = exports.RegisteredInsertMenuList = function Regis
     var _indexes$, _indexes;
     var overscanStartIndex = _ref3.overscanStartIndex,
       overscanStopIndex = _ref3.overscanStopIndex;
+    updateHeight();
     var indexes = (0, _toConsumableArray2.default)(itemIndexByRowIndex).filter(function (_ref4) {
       var _ref5 = (0, _slicedToArray2.default)(_ref4, 1),
         rowIndex = _ref5[0];
@@ -124,7 +130,7 @@ var RegisteredInsertMenuList = exports.RegisteredInsertMenuList = function Regis
       startIndex: (_indexes$ = indexes[0]) !== null && _indexes$ !== void 0 ? _indexes$ : -1,
       stopIndex: (_indexes = indexes[indexes.length - 1]) !== null && _indexes !== void 0 ? _indexes : -1
     });
-  }, [itemIndexByRowIndex, onRenderedItemsChange]);
+  }, [itemIndexByRowIndex, onRenderedItemsChange, updateHeight]);
   var renderRow = (0, _react.useCallback)(function (_ref8) {
     var _registration$compone;
     var index = _ref8.index,
@@ -213,7 +219,7 @@ var RegisteredInsertMenuList = exports.RegisteredInsertMenuList = function Regis
   , (0, _extends2.default)({}, listAriaProps, {
     tabIndex: null,
     containerRole: "presentation",
-    height: Math.min(rows.length * ESTIMATED_ROW_HEIGHT, listMaxHeight),
+    height: Math.min(measuredHeight, listMaxHeight),
     overscanRowCount: 3,
     onRowsRendered: onRowsRendered,
     ref: setListRef,

package/dist/es2019/ui/ToolbarInsertBlock/block-insert-element-browser.js

@@ -1,4 +1,5 @@
 import React, { useCallback } from 'react';
+import { useMenuPopupSizing } from '@atlaskit/editor-common/quick-insert/use-menu-popup-sizing';
 import { Popup } from '@atlaskit/editor-common/ui';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import InsertMenu, { DEFAULT_HEIGHT } from '../ElementBrowser/InsertMenu';
@@ -13,6 +14,15 @@ export const BlockInsertElementBrowser = props => {
     togglePlusMenuVisibility,
     plusButtonRef
   } = props;
+  const isRegisteredMenu = isExperimentEnabled('platform_editor_slash_command');
+  const menuHeight = useMenuPopupSizing({
+    target: plusButtonRef,
+    boundariesElement: props.popupsBoundariesElement,
+    scrollableElement: props.popupsScrollableElement,
+    maxHeight: 520,
+    offset: 3,
+    isOpen: props.open && isRegisteredMenu
+  });
   const closeRegisteredMenu = useCallback(() => togglePlusMenuVisibility(), [togglePlusMenuVisibility]);
   const closeRegisteredMenuAndRestoreFocus = useCallback(() => {
     togglePlusMenuVisibility();
@@ -20,7 +30,7 @@ export const BlockInsertElementBrowser = props => {
   }, [togglePlusMenuVisibility, plusButtonRef]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, props.open && /*#__PURE__*/React.createElement(Popup, {
     target: props.plusButtonRef,
-    fitHeight: DEFAULT_HEIGHT + FIT_HEIGHT_BUFFER,
+    fitHeight: isRegisteredMenu ? menuHeight : DEFAULT_HEIGHT + FIT_HEIGHT_BUFFER,
     fitWidth: 350
     // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
     ,
@@ -30,8 +40,9 @@ export const BlockInsertElementBrowser = props => {
     scrollableElement: props.popupsScrollableElement,
     preventOverflow: true,
     alignX: "right"
-  }, isExperimentEnabled('platform_editor_slash_command') ? /*#__PURE__*/React.createElement(RegisteredInsertMenuContent, {
+  }, isRegisteredMenu ? /*#__PURE__*/React.createElement(RegisteredInsertMenuContent, {
     api: props.pluginInjectionApi,
+    maxHeight: menuHeight,
     editorView: props.editorView,
     isOffline: Boolean(props.isEditorOffline),
     onClose: closeRegisteredMenuAndRestoreFocus,

package/dist/es2019/ui/registered-insert-menu/RegisteredInsertButton.js

@@ -3,6 +3,7 @@ import { useIntl } from 'react-intl';
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { getAriaKeyshortcuts, insertElements, ToolTipContent } from '@atlaskit/editor-common/keymaps';
 import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { useMenuPopupSizing } from '@atlaskit/editor-common/quick-insert/use-menu-popup-sizing';
 import { TOOLBAR_BUTTON_TEST_ID, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
 import { Popup } from '@atlaskit/editor-common/ui';
 import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity/connectivityPluginType';
@@ -13,7 +14,6 @@ import { ToolbarTooltip } from '@atlaskit/editor-toolbar/toolbar-tooltip';
 import { useToolbarUI } from '@atlaskit/editor-toolbar/ui-context';
 import { RegisteredInsertMenuContent } from './RegisteredInsertMenuContent';
 const DEFAULT_MENU_MAX_HEIGHT = 520;
-const FIT_HEIGHT_BUFFER = 100;
 const POPUP_OFFSET = [0, 3];
 /**
  * The toolbar owns its popup lifecycle, but renders the same registered items
@@ -36,6 +36,14 @@ export const RegisteredInsertButton = ({
   } = useToolbarUI();
   const [isOpen, setIsOpen] = useState(false);
   const buttonRef = useRef(null);
+  const menuHeight = useMenuPopupSizing({
+    target: buttonRef.current,
+    boundariesElement: popupsBoundariesElement,
+    scrollableElement: popupsScrollableElement,
+    maxHeight: DEFAULT_MENU_MAX_HEIGHT,
+    offset: POPUP_OFFSET[1],
+    isOpen
+  });
   const {
     connectivityMode,
     isAllowed
@@ -86,7 +94,7 @@ export const RegisteredInsertButton = ({
   })), isOpen && buttonRef.current && /*#__PURE__*/React.createElement(Popup, {
     alignX: "right",
     boundariesElement: popupsBoundariesElement,
-    fitHeight: DEFAULT_MENU_MAX_HEIGHT + FIT_HEIGHT_BUFFER,
+    fitHeight: menuHeight,
     fitWidth: 350,
     mountTo: popupsMountPoint,
     offset: POPUP_OFFSET,
@@ -97,6 +105,7 @@ export const RegisteredInsertButton = ({
     zIndex: akEditorMenuZIndex
   }, /*#__PURE__*/React.createElement(RegisteredInsertMenuContent, {
     api: api,
+    maxHeight: menuHeight,
     editorView: editorView,
     isOffline: isOfflineMode(connectivityMode),
     onClose: closeAndRestoreFocus,

package/dist/es2019/ui/registered-insert-menu/RegisteredInsertMenu.compiled.css

@@ -1,11 +1,11 @@
-._2rko12b0{border-radius:var(--ds-radius-small,4px)}
-._18zrutpp{padding-inline:var(--ds-space-150,9pt)}
-._1rjcutpp{padding-block:var(--ds-space-150,9pt)}._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}
+._18zrutpp{padding-inline:var(--ds-space-150,9pt)}._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
 ._18m915vq{overflow-y:hidden}
 ._1bsb1edt{width:350px}
 ._1e0c1txw{display:flex}
 ._1o9zidpf{flex-shrink:0}
+._1q51utpp{padding-block-start:var(--ds-space-150,9pt)}
 ._1reo15vq{overflow-x:hidden}
 ._2lx21bp4{flex-direction:column}
-._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
-._c71l1lk4{max-height:520px}
+._85i5u2gc{padding-block-end:var(--ds-space-100,8px)}
+._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}

package/dist/es2019/ui/registered-insert-menu/RegisteredInsertMenu.js

@@ -15,17 +15,21 @@ import Textfield from '@atlaskit/textfield/text-field';
 import { RegisteredInsertMenuList } from './RegisteredInsertMenuList';
 const DEFAULT_MENU_MAX_HEIGHT = 520;
 const styles = {
-  menu: "_2rko12b0 _1reo15vq _18m915vq _bfhk1bhr _16qs130s _1e0c1txw _2lx21bp4 _c71l1lk4 _1bsb1edt",
-  search: "_1rjcutpp _18zrutpp _1o9zidpf"
+  menu: "_2rko1mok _1reo15vq _18m915vq _bfhk1bhr _16qs130s _1e0c1txw _2lx21bp4 _1bsb1edt",
+  search: "_18zrutpp _1o9zidpf _1q51utpp _85i5u2gc"
 };
 export const RegisteredInsertMenu = ({
   components,
   emptyStateHandler,
   editorView,
   isOffline,
+  maxHeight = DEFAULT_MENU_MAX_HEIGHT,
   onClose,
   onSelect
 }) => {
+  const menuStyle = {
+    maxHeight
+  };
   const {
     formatMessage
   } = useIntl();
@@ -38,6 +42,13 @@ export const RegisteredInsertMenu = ({
     stopIndex: -1
   });
   const searchRef = useRef(null);
+  useLayoutEffect(() => {
+    var _searchRef$current;
+    // Popup positions on the next frame; focusing must not scroll to its initial location.
+    (_searchRef$current = searchRef.current) === null || _searchRef$current === void 0 ? void 0 : _searchRef$current.focus({
+      preventScroll: true
+    });
+  }, []);
   const surfaceContext = useMemo(() => createSurfaceContext(TYPE_AHEAD_SURFACE_CONTEXT, {
     menuOpenId
   }), [menuOpenId]);
@@ -114,14 +125,14 @@ export const RegisteredInsertMenu = ({
     "data-keyboard-navigation-independent": "",
     testId: "registered-insert-menu",
     onKeyDownCapture: onKeyDown,
-    xcss: styles.menu
+    xcss: styles.menu,
+    style: menuStyle
   }, /*#__PURE__*/React.createElement(Box, {
     xcss: styles.search
   }, /*#__PURE__*/React.createElement(Textfield, {
     "aria-activedescendant": isActiveItemMounted ? activeItemId : undefined,
     "aria-controls": listId,
     "aria-expanded": "true",
-    autoFocus: true,
     placeholder: "Search",
     ref: searchRef,
     role: "combobox",
@@ -133,7 +144,7 @@ export const RegisteredInsertMenu = ({
     isOffline: isOffline,
     listId: listId,
     listLabel: formatMessage(messages.insertMenu),
-    maxHeight: DEFAULT_MENU_MAX_HEIGHT,
+    maxHeight: maxHeight,
     menuOpenId: menuOpenId,
     model: model,
     onClose: onSelect,

package/dist/es2019/ui/registered-insert-menu/RegisteredInsertMenuContent.js

@@ -15,6 +15,7 @@ export const RegisteredInsertMenuContent = ({
   api,
   editorView,
   isOffline,
+  maxHeight,
   onClose,
   onDismiss,
   onSelect,
@@ -39,6 +40,7 @@ export const RegisteredInsertMenuContent = ({
     editorView: editorView,
     emptyStateHandler: api === null || api === void 0 ? void 0 : (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 ? void 0 : (_api$quickInsert$shar = _api$quickInsert.sharedState.currentState()) === null || _api$quickInsert$shar === void 0 ? void 0 : _api$quickInsert$shar.emptyStateHandler,
     isOffline: isOffline,
+    maxHeight: maxHeight,
     onClose: onClose,
     onSelect: onSelect
   }));

package/dist/es2019/ui/registered-insert-menu/RegisteredInsertMenuList.js

@@ -5,10 +5,12 @@ import { ax, ix } from "@compiled/react/runtime";
 import React, { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 import { CellMeasurer, CellMeasurerCache } from 'react-virtualized/dist/commonjs/CellMeasurer';
 import { List } from 'react-virtualized/dist/commonjs/List';
+import { useMenuListHeight } from '@atlaskit/editor-common/quick-insert/use-menu-list-height';
 import { Box } from '@atlaskit/primitives/compiled';
 import { RegisteredInsertMenuItem } from './RegisteredInsertMenuItem';
 const ESTIMATED_ROW_HEIGHT = 56;
-const MENU_FOOTER_HEIGHT = 52;
+// 40px item + 8px block padding + 1px separator.
+const MENU_FOOTER_HEIGHT = 49;
 const MENU_SEARCH_HEIGHT = 64;
 const LIST_WIDTH = 350;
 const listAriaProps = {
@@ -72,6 +74,10 @@ export const RegisteredInsertMenuList = ({
     key,
     type
   }) => `${type}:${key}`).join('\0'), [rows]);
+  const {
+    height: measuredHeight,
+    updateHeight
+  } = useMenuListHeight(cache, rows.length, rowKeySignature);
   useLayoutEffect(() => {
     var _listRef$current, _listRef$current2;
     cache.clearAll();
@@ -83,12 +89,13 @@ export const RegisteredInsertMenuList = ({
     overscanStopIndex
   }) => {
     var _indexes$, _indexes;
+    updateHeight();
     const indexes = [...itemIndexByRowIndex].filter(([rowIndex]) => rowIndex >= overscanStartIndex && rowIndex <= overscanStopIndex).map(([, itemIndex]) => itemIndex);
     onRenderedItemsChange({
       startIndex: (_indexes$ = indexes[0]) !== null && _indexes$ !== void 0 ? _indexes$ : -1,
       stopIndex: (_indexes = indexes[indexes.length - 1]) !== null && _indexes !== void 0 ? _indexes : -1
     });
-  }, [itemIndexByRowIndex, onRenderedItemsChange]);
+  }, [itemIndexByRowIndex, onRenderedItemsChange, updateHeight]);
   const renderRow = useCallback(({
     index,
     key,
@@ -169,7 +176,7 @@ export const RegisteredInsertMenuList = ({
   , _extends({}, listAriaProps, {
     tabIndex: null,
     containerRole: "presentation",
-    height: Math.min(rows.length * ESTIMATED_ROW_HEIGHT, listMaxHeight),
+    height: Math.min(measuredHeight, listMaxHeight),
     overscanRowCount: 3,
     onRowsRendered: onRowsRendered,
     ref: setListRef,

package/dist/esm/ui/ToolbarInsertBlock/block-insert-element-browser.js

@@ -1,4 +1,5 @@
 import React, { useCallback } from 'react';
+import { useMenuPopupSizing } from '@atlaskit/editor-common/quick-insert/use-menu-popup-sizing';
 import { Popup } from '@atlaskit/editor-common/ui';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import InsertMenu, { DEFAULT_HEIGHT } from '../ElementBrowser/InsertMenu';
@@ -11,6 +12,15 @@ var FIT_HEIGHT_BUFFER = 100;
 export var BlockInsertElementBrowser = function BlockInsertElementBrowser(props) {
   var togglePlusMenuVisibility = props.togglePlusMenuVisibility,
     plusButtonRef = props.plusButtonRef;
+  var isRegisteredMenu = isExperimentEnabled('platform_editor_slash_command');
+  var menuHeight = useMenuPopupSizing({
+    target: plusButtonRef,
+    boundariesElement: props.popupsBoundariesElement,
+    scrollableElement: props.popupsScrollableElement,
+    maxHeight: 520,
+    offset: 3,
+    isOpen: props.open && isRegisteredMenu
+  });
   var closeRegisteredMenu = useCallback(function () {
     return togglePlusMenuVisibility();
   }, [togglePlusMenuVisibility]);
@@ -20,7 +30,7 @@ export var BlockInsertElementBrowser = function BlockInsertElementBrowser(props)
   }, [togglePlusMenuVisibility, plusButtonRef]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, props.open && /*#__PURE__*/React.createElement(Popup, {
     target: props.plusButtonRef,
-    fitHeight: DEFAULT_HEIGHT + FIT_HEIGHT_BUFFER,
+    fitHeight: isRegisteredMenu ? menuHeight : DEFAULT_HEIGHT + FIT_HEIGHT_BUFFER,
     fitWidth: 350
     // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
     ,
@@ -30,8 +40,9 @@ export var BlockInsertElementBrowser = function BlockInsertElementBrowser(props)
     scrollableElement: props.popupsScrollableElement,
     preventOverflow: true,
     alignX: "right"
-  }, isExperimentEnabled('platform_editor_slash_command') ? /*#__PURE__*/React.createElement(RegisteredInsertMenuContent, {
+  }, isRegisteredMenu ? /*#__PURE__*/React.createElement(RegisteredInsertMenuContent, {
     api: props.pluginInjectionApi,
+    maxHeight: menuHeight,
     editorView: props.editorView,
     isOffline: Boolean(props.isEditorOffline),
     onClose: closeRegisteredMenuAndRestoreFocus,

package/dist/esm/ui/registered-insert-menu/RegisteredInsertButton.js

@@ -4,6 +4,7 @@ import { useIntl } from 'react-intl';
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { getAriaKeyshortcuts, insertElements, ToolTipContent } from '@atlaskit/editor-common/keymaps';
 import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { useMenuPopupSizing } from '@atlaskit/editor-common/quick-insert/use-menu-popup-sizing';
 import { TOOLBAR_BUTTON_TEST_ID, useEditorToolbar } from '@atlaskit/editor-common/toolbar';
 import { Popup } from '@atlaskit/editor-common/ui';
 import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity/connectivityPluginType';
@@ -14,7 +15,6 @@ import { ToolbarTooltip } from '@atlaskit/editor-toolbar/toolbar-tooltip';
 import { useToolbarUI } from '@atlaskit/editor-toolbar/ui-context';
 import { RegisteredInsertMenuContent } from './RegisteredInsertMenuContent';
 var DEFAULT_MENU_MAX_HEIGHT = 520;
-var FIT_HEIGHT_BUFFER = 100;
 var POPUP_OFFSET = [0, 3];
 /**
  * The toolbar owns its popup lifecycle, but renders the same registered items
@@ -36,6 +36,14 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
     isOpen = _useState2[0],
     setIsOpen = _useState2[1];
   var buttonRef = useRef(null);
+  var menuHeight = useMenuPopupSizing({
+    target: buttonRef.current,
+    boundariesElement: popupsBoundariesElement,
+    scrollableElement: popupsScrollableElement,
+    maxHeight: DEFAULT_MENU_MAX_HEIGHT,
+    offset: POPUP_OFFSET[1],
+    isOpen: isOpen
+  });
   var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['connectivity', 'typeAhead'], function (states) {
       var _states$connectivityS, _states$typeAheadStat;
       return {
@@ -92,7 +100,7 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
   })), isOpen && buttonRef.current && /*#__PURE__*/React.createElement(Popup, {
     alignX: "right",
     boundariesElement: popupsBoundariesElement,
-    fitHeight: DEFAULT_MENU_MAX_HEIGHT + FIT_HEIGHT_BUFFER,
+    fitHeight: menuHeight,
     fitWidth: 350,
     mountTo: popupsMountPoint,
     offset: POPUP_OFFSET,
@@ -103,6 +111,7 @@ export var RegisteredInsertButton = function RegisteredInsertButton(_ref) {
     zIndex: akEditorMenuZIndex
   }, /*#__PURE__*/React.createElement(RegisteredInsertMenuContent, {
     api: api,
+    maxHeight: menuHeight,
     editorView: editorView,
     isOffline: isOfflineMode(connectivityMode),
     onClose: closeAndRestoreFocus,

package/dist/esm/ui/registered-insert-menu/RegisteredInsertMenu.compiled.css

@@ -1,11 +1,11 @@
-._2rko12b0{border-radius:var(--ds-radius-small,4px)}
-._18zrutpp{padding-inline:var(--ds-space-150,9pt)}
-._1rjcutpp{padding-block:var(--ds-space-150,9pt)}._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}
+._18zrutpp{padding-inline:var(--ds-space-150,9pt)}._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
 ._18m915vq{overflow-y:hidden}
 ._1bsb1edt{width:350px}
 ._1e0c1txw{display:flex}
 ._1o9zidpf{flex-shrink:0}
+._1q51utpp{padding-block-start:var(--ds-space-150,9pt)}
 ._1reo15vq{overflow-x:hidden}
 ._2lx21bp4{flex-direction:column}
-._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
-._c71l1lk4{max-height:520px}
+._85i5u2gc{padding-block-end:var(--ds-space-100,8px)}
+._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}

package/dist/esm/ui/registered-insert-menu/RegisteredInsertMenu.js

@@ -19,16 +19,21 @@ import Textfield from '@atlaskit/textfield/text-field';
 import { RegisteredInsertMenuList } from './RegisteredInsertMenuList';
 var DEFAULT_MENU_MAX_HEIGHT = 520;
 var styles = {
-  menu: "_2rko12b0 _1reo15vq _18m915vq _bfhk1bhr _16qs130s _1e0c1txw _2lx21bp4 _c71l1lk4 _1bsb1edt",
-  search: "_1rjcutpp _18zrutpp _1o9zidpf"
+  menu: "_2rko1mok _1reo15vq _18m915vq _bfhk1bhr _16qs130s _1e0c1txw _2lx21bp4 _1bsb1edt",
+  search: "_18zrutpp _1o9zidpf _1q51utpp _85i5u2gc"
 };
 export var RegisteredInsertMenu = function RegisteredInsertMenu(_ref) {
   var components = _ref.components,
     emptyStateHandler = _ref.emptyStateHandler,
     editorView = _ref.editorView,
     isOffline = _ref.isOffline,
+    _ref$maxHeight = _ref.maxHeight,
+    maxHeight = _ref$maxHeight === void 0 ? DEFAULT_MENU_MAX_HEIGHT : _ref$maxHeight,
     onClose = _ref.onClose,
     onSelect = _ref.onSelect;
+  var menuStyle = {
+    maxHeight: maxHeight
+  };
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
   var listId = useId();
@@ -53,6 +58,13 @@ export var RegisteredInsertMenu = function RegisteredInsertMenu(_ref) {
     renderedItems = _useState8[0],
     setRenderedItems = _useState8[1];
   var searchRef = useRef(null);
+  useLayoutEffect(function () {
+    var _searchRef$current;
+    // Popup positions on the next frame; focusing must not scroll to its initial location.
+    (_searchRef$current = searchRef.current) === null || _searchRef$current === void 0 || _searchRef$current.focus({
+      preventScroll: true
+    });
+  }, []);
   var surfaceContext = useMemo(function () {
     return createSurfaceContext(TYPE_AHEAD_SURFACE_CONTEXT, {
       menuOpenId: menuOpenId
@@ -151,14 +163,14 @@ export var RegisteredInsertMenu = function RegisteredInsertMenu(_ref) {
     "data-keyboard-navigation-independent": "",
     testId: "registered-insert-menu",
     onKeyDownCapture: onKeyDown,
-    xcss: styles.menu
+    xcss: styles.menu,
+    style: menuStyle
   }, /*#__PURE__*/React.createElement(Box, {
     xcss: styles.search
   }, /*#__PURE__*/React.createElement(Textfield, {
     "aria-activedescendant": isActiveItemMounted ? activeItemId : undefined,
     "aria-controls": listId,
     "aria-expanded": "true",
-    autoFocus: true,
     placeholder: "Search",
     ref: searchRef,
     role: "combobox",
@@ -170,7 +182,7 @@ export var RegisteredInsertMenu = function RegisteredInsertMenu(_ref) {
     isOffline: isOffline,
     listId: listId,
     listLabel: formatMessage(messages.insertMenu),
-    maxHeight: DEFAULT_MENU_MAX_HEIGHT,
+    maxHeight: maxHeight,
     menuOpenId: menuOpenId,
     model: model,
     onClose: onSelect,

package/dist/esm/ui/registered-insert-menu/RegisteredInsertMenuContent.js

@@ -16,6 +16,7 @@ export var RegisteredInsertMenuContent = function RegisteredInsertMenuContent(_r
   var api = _ref2.api,
     editorView = _ref2.editorView,
     isOffline = _ref2.isOffline,
+    maxHeight = _ref2.maxHeight,
     onClose = _ref2.onClose,
     onDismiss = _ref2.onDismiss,
     onSelect = _ref2.onSelect,
@@ -40,6 +41,7 @@ export var RegisteredInsertMenuContent = function RegisteredInsertMenuContent(_r
     editorView: editorView,
     emptyStateHandler: api === null || api === void 0 || (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 || (_api$quickInsert = _api$quickInsert.sharedState.currentState()) === null || _api$quickInsert === void 0 ? void 0 : _api$quickInsert.emptyStateHandler,
     isOffline: isOffline,
+    maxHeight: maxHeight,
     onClose: onClose,
     onSelect: onSelect
   }));

package/dist/esm/ui/registered-insert-menu/RegisteredInsertMenuList.js

@@ -10,10 +10,12 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
 import React, { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 import { CellMeasurer, CellMeasurerCache } from 'react-virtualized/dist/commonjs/CellMeasurer';
 import { List } from 'react-virtualized/dist/commonjs/List';
+import { useMenuListHeight } from '@atlaskit/editor-common/quick-insert/use-menu-list-height';
 import { Box } from '@atlaskit/primitives/compiled';
 import { RegisteredInsertMenuItem } from './RegisteredInsertMenuItem';
 var ESTIMATED_ROW_HEIGHT = 56;
-var MENU_FOOTER_HEIGHT = 52;
+// 40px item + 8px block padding + 1px separator.
+var MENU_FOOTER_HEIGHT = 49;
 var MENU_SEARCH_HEIGHT = 64;
 var LIST_WIDTH = 350;
 var listAriaProps = {
@@ -92,6 +94,9 @@ export var RegisteredInsertMenuList = function RegisteredInsertMenuList(_ref) {
       return "".concat(type, ":").concat(key);
     }).join('\0');
   }, [rows]);
+  var _useMenuListHeight = useMenuListHeight(cache, rows.length, rowKeySignature),
+    measuredHeight = _useMenuListHeight.height,
+    updateHeight = _useMenuListHeight.updateHeight;
   useLayoutEffect(function () {
     var _listRef$current, _listRef$current2;
     cache.clearAll();
@@ -102,6 +107,7 @@ export var RegisteredInsertMenuList = function RegisteredInsertMenuList(_ref) {
     var _indexes$, _indexes;
     var overscanStartIndex = _ref3.overscanStartIndex,
       overscanStopIndex = _ref3.overscanStopIndex;
+    updateHeight();
     var indexes = _toConsumableArray(itemIndexByRowIndex).filter(function (_ref4) {
       var _ref5 = _slicedToArray(_ref4, 1),
         rowIndex = _ref5[0];
@@ -115,7 +121,7 @@ export var RegisteredInsertMenuList = function RegisteredInsertMenuList(_ref) {
       startIndex: (_indexes$ = indexes[0]) !== null && _indexes$ !== void 0 ? _indexes$ : -1,
       stopIndex: (_indexes = indexes[indexes.length - 1]) !== null && _indexes !== void 0 ? _indexes : -1
     });
-  }, [itemIndexByRowIndex, onRenderedItemsChange]);
+  }, [itemIndexByRowIndex, onRenderedItemsChange, updateHeight]);
   var renderRow = useCallback(function (_ref8) {
     var _registration$compone;
     var index = _ref8.index,
@@ -204,7 +210,7 @@ export var RegisteredInsertMenuList = function RegisteredInsertMenuList(_ref) {
   , _extends({}, listAriaProps, {
     tabIndex: null,
     containerRole: "presentation",
-    height: Math.min(rows.length * ESTIMATED_ROW_HEIGHT, listMaxHeight),
+    height: Math.min(measuredHeight, listMaxHeight),
     overscanRowCount: 3,
     onRowsRendered: onRowsRendered,
     ref: setListRef,

package/dist/types/ui/registered-insert-menu/RegisteredInsertMenu.d.ts

@@ -7,8 +7,9 @@ type Props = {
     editorView: EditorView;
     emptyStateHandler?: EmptyStateHandler;
     isOffline: boolean;
+    maxHeight?: number;
     onClose: () => void;
     onSelect: () => void;
 };
-export declare const RegisteredInsertMenu: ({ components, emptyStateHandler, editorView, isOffline, onClose, onSelect, }: Props) => React.JSX.Element;
+export declare const RegisteredInsertMenu: ({ components, emptyStateHandler, editorView, isOffline, maxHeight, onClose, onSelect, }: Props) => React.JSX.Element;
 export {};

package/dist/types/ui/registered-insert-menu/RegisteredInsertMenuContent.d.ts

@@ -6,10 +6,11 @@ type Props = {
     api?: ExtractInjectionAPI<InsertBlockPlugin>;
     editorView: EditorView;
     isOffline: boolean;
+    maxHeight?: number;
     onClose: () => void;
     onDismiss: () => void;
     onSelect: () => void;
     target?: HTMLElement | null;
 };
-export declare const RegisteredInsertMenuContent: ({ api, editorView, isOffline, onClose, onDismiss, onSelect, target, }: Props) => React.JSX.Element;
+export declare const RegisteredInsertMenuContent: ({ api, editorView, isOffline, maxHeight, onClose, onDismiss, onSelect, target, }: Props) => React.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-insert-block",
-	"version": "22.0.3",
+	"version": "22.0.4",
 	"description": "Insert block plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -48,21 +48,21 @@
 		"@atlaskit/editor-plugin-table": "^33.0.0",
 		"@atlaskit/editor-plugin-tasks-and-decisions": "^24.0.0",
 		"@atlaskit/editor-plugin-toolbar": "^18.0.0",
-		"@atlaskit/editor-plugin-type-ahead": "^22.0.0",
+		"@atlaskit/editor-plugin-type-ahead": "^22.1.0",
 		"@atlaskit/editor-plugin-ui-control-registry": "^15.0.0",
 		"@atlaskit/editor-prosemirror": "^9.0.0",
 		"@atlaskit/editor-shared-styles": "^4.3.0",
-		"@atlaskit/editor-toolbar": "^2.7.0",
+		"@atlaskit/editor-toolbar": "^2.8.0",
 		"@atlaskit/editor-toolbar-model": "^1.2.0",
 		"@atlaskit/editor-ui-control-model": "^2.10.0",
 		"@atlaskit/emoji": "^72.4.0",
 		"@atlaskit/icon": "^38.0.0",
-		"@atlaskit/icon-lab": "^7.9.0",
+		"@atlaskit/icon-lab": "^7.10.0",
 		"@atlaskit/platform-feature-experiments": "^0.3.0",
 		"@atlaskit/platform-feature-flags": "^2.2.0",
 		"@atlaskit/primitives": "^22.5.0",
 		"@atlaskit/textfield": "^10.2.0",
-		"@atlaskit/tmp-editor-statsig": "^208.0.0",
+		"@atlaskit/tmp-editor-statsig": "^209.0.0",
 		"@atlaskit/tokens": "^20.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
@@ -72,7 +72,7 @@
 		"react-virtualized": "^9.22.6"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^125.2.0",
+		"@atlaskit/editor-common": "^125.4.0",
 		"react": "^18.2.0 || ^19.2.0",
 		"react-dom": "^18.2.0 || ^19.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"