@atlaskit/editor-plugin-block-controls 7.19.0 → 8.0.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 8.0.0
+
+### Patch Changes
+
+- [`4da819b186eaf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4da819b186eaf) -
+  EDITOR-3911 selection preservation key handling
+- Updated dependencies
+
 ## 7.19.0
 
 ### Minor Changes

package/dist/cjs/blockControlsPlugin.js

@@ -13,6 +13,7 @@ var _state = require("@atlaskit/editor-prosemirror/state");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
+var _handleKeyDownWithPreservedSelection = require("./editor-commands/handle-key-down-with-preserved-selection");
 var _moveNode = require("./editor-commands/move-node");
 var _moveNodeWithBlockMenu2 = require("./editor-commands/move-node-with-block-menu");
 var _moveToLayout = require("./editor-commands/move-to-layout");
@@ -102,9 +103,6 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
                 tr: tr
               });
             }
-            (0, _editorCommands.stopPreservingSelection)({
-              tr: tr
-            });
             return tr;
           }
 
@@ -249,6 +247,7 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
       moveNodeWithBlockMenu: function moveNodeWithBlockMenu(direction) {
         return (0, _moveNodeWithBlockMenu2.moveNodeWithBlockMenu)(api, direction);
       },
+      handleKeyDownWithPreservedSelection: (0, _handleKeyDownWithPreservedSelection.handleKeyDownWithPreservedSelection)(api),
       startPreservingSelection: function startPreservingSelection() {
         return _editorCommands.startPreservingSelection;
       },

package/dist/cjs/editor-commands/handle-key-down-with-preserved-selection.js

@@ -0,0 +1,87 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.handleKeyDownWithPreservedSelection = void 0;
+var _selection = require("@atlaskit/editor-common/selection");
+var _editorCommands = require("../pm-plugins/selection-preservation/editor-commands");
+var getKeyboardEventInfo = function getKeyboardEventInfo(event) {
+  var key = event.key.toLowerCase();
+  var isMetaCtrl = event.metaKey || event.ctrlKey;
+  var isDelete = ['backspace', 'delete'].includes(key);
+  var isCut = isMetaCtrl && key === 'x';
+  var isPaste = isMetaCtrl && key === 'v';
+  var isDestructive = isDelete || isCut || isPaste;
+  var isModifierOnly = ['control', 'meta', 'alt', 'shift'].includes(key) && !isMetaCtrl;
+  var isCopy = isMetaCtrl && key === 'c';
+  var isInert = isModifierOnly || isCopy;
+  return {
+    isDelete: isDelete,
+    isDestructive: isDestructive,
+    isInert: isInert
+  };
+};
+
+/**
+ * Handles key presses when a selection is being preserved, when the block menu is open or closed.
+ *
+ * Based on the key pressed and whether the block menu is open or closed:
+ * 1. Handles key presses with custom logic (e.g. delete/backspace)
+ * 2. Closes the block menu
+ * 3. Stops preserving the selection
+ *
+ * This is used in two places:
+ * 1. selection preservation plugin when selection is being preserved, and focus is in the editor.
+ * 2. block menu UI component when focus is in the block menu.
+ *
+ * Ensures consistent behaviour for key presses in both scenarios.
+ */
+var handleKeyDownWithPreservedSelection = exports.handleKeyDownWithPreservedSelection = function handleKeyDownWithPreservedSelection(api) {
+  return function (event) {
+    return function (_ref) {
+      var _api$userIntent;
+      var tr = _ref.tr;
+      if (!api) {
+        return tr;
+      }
+      var _getKeyboardEventInfo = getKeyboardEventInfo(event),
+        isDelete = _getKeyboardEventInfo.isDelete,
+        isDestructive = _getKeyboardEventInfo.isDestructive,
+        isInert = _getKeyboardEventInfo.isInert;
+
+      // Handle delete/backspace key presses with custom logic to ensure preserved selection is used
+      if (isDelete) {
+        var _api$blockControls;
+        tr = (0, _selection.deleteSelectedRange)(tr, (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.sharedState.currentState()) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.preservedSelection);
+      }
+      var isBlockMenuOpen = ((_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'blockMenuOpen';
+
+      // When selected content is being removed and the block menu is open
+      // close the block menu and refocus the editor
+      var shouldCloseBlockMenu = isDestructive && isBlockMenuOpen;
+      if (shouldCloseBlockMenu) {
+        var _api$blockControls2;
+        (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
+          closeMenu: true
+        })({
+          tr: tr
+        });
+        api.core.actions.focus({
+          scrollIntoView: false
+        });
+      }
+
+      // Stop preserving when:
+      // 1. Content is being removed (delete/cut/paste) OR
+      // 2. Menu is closed AND user pressed a non-inert key (i.e. action which modifies selection or content)
+      var shouldStopPreservingSelection = isDestructive || !isBlockMenuOpen && !isInert;
+      if (shouldStopPreservingSelection) {
+        (0, _editorCommands.stopPreservingSelection)({
+          tr: tr
+        });
+      }
+      return tr;
+    };
+  };
+};

package/dist/cjs/pm-plugins/selection-preservation/pm-plugin.js

@@ -75,7 +75,9 @@ var createSelectionPreservationPlugin = exports.createSelectionPreservationPlugi
         if (!savedSel) {
           return null;
         }
-        if ((0, _utils.hasUserSelectionChange)(transactions)) {
+
+        // Auto-stop if user explicitly changes selection or selection is set within a code block
+        if ((0, _utils.hasUserSelectionChange)(transactions) || (0, _utils.isSelectionWithinCodeBlock)(newState.selection)) {
           // Auto-stop if user explicitly changes selection
           return (0, _editorCommands.stopPreservingSelection)({
             tr: newState.tr
@@ -121,7 +123,7 @@ var createSelectionPreservationPlugin = exports.createSelectionPreservationPlugi
           return false;
         },
         handleKeyDown: function handleKeyDown(view, event) {
-          var _api$userIntent;
+          var _api$core, _api$blockControls;
           var _ref2 = _pluginKey.selectionPreservationPluginKey.getState(view.state) || {},
             preservedSelection = _ref2.preservedSelection;
 
@@ -129,26 +131,11 @@ var createSelectionPreservationPlugin = exports.createSelectionPreservationPlugi
           if (!preservedSelection) {
             return false;
           }
+          api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.commands) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.handleKeyDownWithPreservedSelection(event));
 
           // While preserving selection, if user presses delete/backspace, prevent event from being
-          // handled by ProseMirror natively so that we can apply custom delete logic in block menu
-          if (event.key === 'Backspace' || event.key === 'Delete') {
-            return true;
-          }
-          var blockMenuOpen = (api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'blockMenuOpen';
-
-          // When block menu is open, prevent all key events to avoid changing selection or editing content
-          if (blockMenuOpen) {
-            return true;
-          }
-
-          // When block menu isn't open and user presses any key, stop preserving selection
-          var tr = view.state.tr;
-          (0, _editorCommands.stopPreservingSelection)({
-            tr: tr
-          });
-          view.dispatch(tr);
-          return false;
+          // handled by ProseMirror natively so that we can apply logic using the preserved selection.
+          return ['backspace', 'delete'].includes(event.key.toLowerCase());
         }
       }
     });

package/dist/cjs/pm-plugins/selection-preservation/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.hasUserSelectionChange = exports.getSelectionPreservationMeta = void 0;
+exports.isSelectionWithinCodeBlock = exports.hasUserSelectionChange = exports.getSelectionPreservationMeta = void 0;
 var _pluginKey = require("./plugin-key");
 /**
  * Detects if any of the transactions include user-driven selection changes.
@@ -18,4 +18,16 @@ var hasUserSelectionChange = exports.hasUserSelectionChange = function hasUserSe
 };
 var getSelectionPreservationMeta = exports.getSelectionPreservationMeta = function getSelectionPreservationMeta(tr) {
   return tr.getMeta(_pluginKey.selectionPreservationPluginKey);
+};
+
+/**
+ * Checks if the current selection is within a code block.
+ *
+ * @param selection The current selection to check.
+ * @returns True if the selection is within a code block, otherwise false.
+ */
+var isSelectionWithinCodeBlock = exports.isSelectionWithinCodeBlock = function isSelectionWithinCodeBlock(_ref) {
+  var $from = _ref.$from,
+    $to = _ref.$to;
+  return $from.sameParent($to) && $from.parent.type.name === 'codeBlock';
 };

package/dist/es2019/blockControlsPlugin.js

@@ -5,6 +5,7 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { handleKeyDownWithPreservedSelection } from './editor-commands/handle-key-down-with-preserved-selection';
 import { moveNode } from './editor-commands/move-node';
 import { moveNodeWithBlockMenu } from './editor-commands/move-node-with-block-menu';
 import { moveToLayout } from './editor-commands/move-to-layout';
@@ -92,9 +93,6 @@ export const blockControlsPlugin = ({
             tr
           });
         }
-        stopPreservingSelection({
-          tr
-        });
         return tr;
       }
 
@@ -240,9 +238,8 @@ export const blockControlsPlugin = ({
         isSelectedViaDragHandle
       });
     },
-    moveNodeWithBlockMenu: direction => {
-      return moveNodeWithBlockMenu(api, direction);
-    },
+    moveNodeWithBlockMenu: direction => moveNodeWithBlockMenu(api, direction),
+    handleKeyDownWithPreservedSelection: handleKeyDownWithPreservedSelection(api),
     startPreservingSelection: () => startPreservingSelection,
     stopPreservingSelection: () => stopPreservingSelection
   },

package/dist/es2019/editor-commands/handle-key-down-with-preserved-selection.js

@@ -0,0 +1,79 @@
+import { deleteSelectedRange } from '@atlaskit/editor-common/selection';
+import { stopPreservingSelection } from '../pm-plugins/selection-preservation/editor-commands';
+const getKeyboardEventInfo = event => {
+  const key = event.key.toLowerCase();
+  const isMetaCtrl = event.metaKey || event.ctrlKey;
+  const isDelete = ['backspace', 'delete'].includes(key);
+  const isCut = isMetaCtrl && key === 'x';
+  const isPaste = isMetaCtrl && key === 'v';
+  const isDestructive = isDelete || isCut || isPaste;
+  const isModifierOnly = ['control', 'meta', 'alt', 'shift'].includes(key) && !isMetaCtrl;
+  const isCopy = isMetaCtrl && key === 'c';
+  const isInert = isModifierOnly || isCopy;
+  return {
+    isDelete,
+    isDestructive,
+    isInert
+  };
+};
+
+/**
+ * Handles key presses when a selection is being preserved, when the block menu is open or closed.
+ *
+ * Based on the key pressed and whether the block menu is open or closed:
+ * 1. Handles key presses with custom logic (e.g. delete/backspace)
+ * 2. Closes the block menu
+ * 3. Stops preserving the selection
+ *
+ * This is used in two places:
+ * 1. selection preservation plugin when selection is being preserved, and focus is in the editor.
+ * 2. block menu UI component when focus is in the block menu.
+ *
+ * Ensures consistent behaviour for key presses in both scenarios.
+ */
+export const handleKeyDownWithPreservedSelection = api => event => ({
+  tr
+}) => {
+  var _api$userIntent, _api$userIntent$share;
+  if (!api) {
+    return tr;
+  }
+  const {
+    isDelete,
+    isDestructive,
+    isInert
+  } = getKeyboardEventInfo(event);
+
+  // Handle delete/backspace key presses with custom logic to ensure preserved selection is used
+  if (isDelete) {
+    var _api$blockControls, _api$blockControls$sh;
+    tr = deleteSelectedRange(tr, (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : (_api$blockControls$sh = _api$blockControls.sharedState.currentState()) === null || _api$blockControls$sh === void 0 ? void 0 : _api$blockControls$sh.preservedSelection);
+  }
+  const isBlockMenuOpen = ((_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : (_api$userIntent$share = _api$userIntent.sharedState.currentState()) === null || _api$userIntent$share === void 0 ? void 0 : _api$userIntent$share.currentUserIntent) === 'blockMenuOpen';
+
+  // When selected content is being removed and the block menu is open
+  // close the block menu and refocus the editor
+  const shouldCloseBlockMenu = isDestructive && isBlockMenuOpen;
+  if (shouldCloseBlockMenu) {
+    var _api$blockControls2;
+    (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.commands.toggleBlockMenu({
+      closeMenu: true
+    })({
+      tr
+    });
+    api.core.actions.focus({
+      scrollIntoView: false
+    });
+  }
+
+  // Stop preserving when:
+  // 1. Content is being removed (delete/cut/paste) OR
+  // 2. Menu is closed AND user pressed a non-inert key (i.e. action which modifies selection or content)
+  const shouldStopPreservingSelection = isDestructive || !isBlockMenuOpen && !isInert;
+  if (shouldStopPreservingSelection) {
+    stopPreservingSelection({
+      tr
+    });
+  }
+  return tr;
+};

package/dist/es2019/pm-plugins/selection-preservation/pm-plugin.js

@@ -4,8 +4,7 @@ import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
 import { mapPreservedSelection } from '../utils/selection';
 import { stopPreservingSelection } from './editor-commands';
 import { selectionPreservationPluginKey } from './plugin-key';
-import { getSelectionPreservationMeta, hasUserSelectionChange } from './utils';
-
+import { getSelectionPreservationMeta, hasUserSelectionChange, isSelectionWithinCodeBlock } from './utils';
 /**
  * Selection Preservation Plugin
  *
@@ -67,7 +66,9 @@ export const createSelectionPreservationPlugin = api => () => {
       if (!savedSel) {
         return null;
       }
-      if (hasUserSelectionChange(transactions)) {
+
+      // Auto-stop if user explicitly changes selection or selection is set within a code block
+      if (hasUserSelectionChange(transactions) || isSelectionWithinCodeBlock(newState.selection)) {
         // Auto-stop if user explicitly changes selection
         return stopPreservingSelection({
           tr: newState.tr
@@ -114,7 +115,7 @@ export const createSelectionPreservationPlugin = api => () => {
         return false;
       },
       handleKeyDown: (view, event) => {
-        var _api$userIntent, _api$userIntent$share;
+        var _api$core, _api$blockControls, _api$blockControls$co;
         const {
           preservedSelection
         } = selectionPreservationPluginKey.getState(view.state) || {};
@@ -123,26 +124,11 @@ export const createSelectionPreservationPlugin = api => () => {
         if (!preservedSelection) {
           return false;
         }
+        api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : (_api$blockControls$co = _api$blockControls.commands) === null || _api$blockControls$co === void 0 ? void 0 : _api$blockControls$co.handleKeyDownWithPreservedSelection(event));
 
         // While preserving selection, if user presses delete/backspace, prevent event from being
-        // handled by ProseMirror natively so that we can apply custom delete logic in block menu
-        if (event.key === 'Backspace' || event.key === 'Delete') {
-          return true;
-        }
-        const blockMenuOpen = (api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : (_api$userIntent$share = _api$userIntent.sharedState.currentState()) === null || _api$userIntent$share === void 0 ? void 0 : _api$userIntent$share.currentUserIntent) === 'blockMenuOpen';
-
-        // When block menu is open, prevent all key events to avoid changing selection or editing content
-        if (blockMenuOpen) {
-          return true;
-        }
-
-        // When block menu isn't open and user presses any key, stop preserving selection
-        const tr = view.state.tr;
-        stopPreservingSelection({
-          tr
-        });
-        view.dispatch(tr);
-        return false;
+        // handled by ProseMirror natively so that we can apply logic using the preserved selection.
+        return ['backspace', 'delete'].includes(event.key.toLowerCase());
       }
     }
   });

package/dist/es2019/pm-plugins/selection-preservation/utils.js

@@ -10,4 +10,17 @@ export const hasUserSelectionChange = transactions => {
 };
 export const getSelectionPreservationMeta = tr => {
   return tr.getMeta(selectionPreservationPluginKey);
+};
+
+/**
+ * Checks if the current selection is within a code block.
+ *
+ * @param selection The current selection to check.
+ * @returns True if the selection is within a code block, otherwise false.
+ */
+export const isSelectionWithinCodeBlock = ({
+  $from,
+  $to
+}) => {
+  return $from.sameParent($to) && $from.parent.type.name === 'codeBlock';
 };

package/dist/esm/blockControlsPlugin.js

@@ -8,6 +8,7 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { handleKeyDownWithPreservedSelection } from './editor-commands/handle-key-down-with-preserved-selection';
 import { moveNode } from './editor-commands/move-node';
 import { moveNodeWithBlockMenu as _moveNodeWithBlockMenu } from './editor-commands/move-node-with-block-menu';
 import { moveToLayout } from './editor-commands/move-to-layout';
@@ -95,9 +96,6 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
                 tr: tr
               });
             }
-            _stopPreservingSelection({
-              tr: tr
-            });
             return tr;
           }
 
@@ -242,6 +240,7 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
       moveNodeWithBlockMenu: function moveNodeWithBlockMenu(direction) {
         return _moveNodeWithBlockMenu(api, direction);
       },
+      handleKeyDownWithPreservedSelection: handleKeyDownWithPreservedSelection(api),
       startPreservingSelection: function startPreservingSelection() {
         return _startPreservingSelection;
       },

package/dist/esm/editor-commands/handle-key-down-with-preserved-selection.js

@@ -0,0 +1,81 @@
+import { deleteSelectedRange } from '@atlaskit/editor-common/selection';
+import { stopPreservingSelection } from '../pm-plugins/selection-preservation/editor-commands';
+var getKeyboardEventInfo = function getKeyboardEventInfo(event) {
+  var key = event.key.toLowerCase();
+  var isMetaCtrl = event.metaKey || event.ctrlKey;
+  var isDelete = ['backspace', 'delete'].includes(key);
+  var isCut = isMetaCtrl && key === 'x';
+  var isPaste = isMetaCtrl && key === 'v';
+  var isDestructive = isDelete || isCut || isPaste;
+  var isModifierOnly = ['control', 'meta', 'alt', 'shift'].includes(key) && !isMetaCtrl;
+  var isCopy = isMetaCtrl && key === 'c';
+  var isInert = isModifierOnly || isCopy;
+  return {
+    isDelete: isDelete,
+    isDestructive: isDestructive,
+    isInert: isInert
+  };
+};
+
+/**
+ * Handles key presses when a selection is being preserved, when the block menu is open or closed.
+ *
+ * Based on the key pressed and whether the block menu is open or closed:
+ * 1. Handles key presses with custom logic (e.g. delete/backspace)
+ * 2. Closes the block menu
+ * 3. Stops preserving the selection
+ *
+ * This is used in two places:
+ * 1. selection preservation plugin when selection is being preserved, and focus is in the editor.
+ * 2. block menu UI component when focus is in the block menu.
+ *
+ * Ensures consistent behaviour for key presses in both scenarios.
+ */
+export var handleKeyDownWithPreservedSelection = function handleKeyDownWithPreservedSelection(api) {
+  return function (event) {
+    return function (_ref) {
+      var _api$userIntent;
+      var tr = _ref.tr;
+      if (!api) {
+        return tr;
+      }
+      var _getKeyboardEventInfo = getKeyboardEventInfo(event),
+        isDelete = _getKeyboardEventInfo.isDelete,
+        isDestructive = _getKeyboardEventInfo.isDestructive,
+        isInert = _getKeyboardEventInfo.isInert;
+
+      // Handle delete/backspace key presses with custom logic to ensure preserved selection is used
+      if (isDelete) {
+        var _api$blockControls;
+        tr = deleteSelectedRange(tr, (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.sharedState.currentState()) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.preservedSelection);
+      }
+      var isBlockMenuOpen = ((_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'blockMenuOpen';
+
+      // When selected content is being removed and the block menu is open
+      // close the block menu and refocus the editor
+      var shouldCloseBlockMenu = isDestructive && isBlockMenuOpen;
+      if (shouldCloseBlockMenu) {
+        var _api$blockControls2;
+        (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
+          closeMenu: true
+        })({
+          tr: tr
+        });
+        api.core.actions.focus({
+          scrollIntoView: false
+        });
+      }
+
+      // Stop preserving when:
+      // 1. Content is being removed (delete/cut/paste) OR
+      // 2. Menu is closed AND user pressed a non-inert key (i.e. action which modifies selection or content)
+      var shouldStopPreservingSelection = isDestructive || !isBlockMenuOpen && !isInert;
+      if (shouldStopPreservingSelection) {
+        stopPreservingSelection({
+          tr: tr
+        });
+      }
+      return tr;
+    };
+  };
+};

package/dist/esm/pm-plugins/selection-preservation/pm-plugin.js

@@ -7,8 +7,7 @@ import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
 import { mapPreservedSelection } from '../utils/selection';
 import { stopPreservingSelection } from './editor-commands';
 import { selectionPreservationPluginKey } from './plugin-key';
-import { getSelectionPreservationMeta, hasUserSelectionChange } from './utils';
-
+import { getSelectionPreservationMeta, hasUserSelectionChange, isSelectionWithinCodeBlock } from './utils';
 /**
  * Selection Preservation Plugin
  *
@@ -69,7 +68,9 @@ export var createSelectionPreservationPlugin = function createSelectionPreservat
         if (!savedSel) {
           return null;
         }
-        if (hasUserSelectionChange(transactions)) {
+
+        // Auto-stop if user explicitly changes selection or selection is set within a code block
+        if (hasUserSelectionChange(transactions) || isSelectionWithinCodeBlock(newState.selection)) {
           // Auto-stop if user explicitly changes selection
           return stopPreservingSelection({
             tr: newState.tr
@@ -115,7 +116,7 @@ export var createSelectionPreservationPlugin = function createSelectionPreservat
           return false;
         },
         handleKeyDown: function handleKeyDown(view, event) {
-          var _api$userIntent;
+          var _api$core, _api$blockControls;
           var _ref2 = selectionPreservationPluginKey.getState(view.state) || {},
             preservedSelection = _ref2.preservedSelection;
 
@@ -123,26 +124,11 @@ export var createSelectionPreservationPlugin = function createSelectionPreservat
           if (!preservedSelection) {
             return false;
           }
+          api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.commands) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.handleKeyDownWithPreservedSelection(event));
 
           // While preserving selection, if user presses delete/backspace, prevent event from being
-          // handled by ProseMirror natively so that we can apply custom delete logic in block menu
-          if (event.key === 'Backspace' || event.key === 'Delete') {
-            return true;
-          }
-          var blockMenuOpen = (api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'blockMenuOpen';
-
-          // When block menu is open, prevent all key events to avoid changing selection or editing content
-          if (blockMenuOpen) {
-            return true;
-          }
-
-          // When block menu isn't open and user presses any key, stop preserving selection
-          var tr = view.state.tr;
-          stopPreservingSelection({
-            tr: tr
-          });
-          view.dispatch(tr);
-          return false;
+          // handled by ProseMirror natively so that we can apply logic using the preserved selection.
+          return ['backspace', 'delete'].includes(event.key.toLowerCase());
         }
       }
     });

package/dist/esm/pm-plugins/selection-preservation/utils.js

@@ -12,4 +12,16 @@ export var hasUserSelectionChange = function hasUserSelectionChange(transactions
 };
 export var getSelectionPreservationMeta = function getSelectionPreservationMeta(tr) {
   return tr.getMeta(selectionPreservationPluginKey);
+};
+
+/**
+ * Checks if the current selection is within a code block.
+ *
+ * @param selection The current selection to check.
+ * @returns True if the selection is within a code block, otherwise false.
+ */
+export var isSelectionWithinCodeBlock = function isSelectionWithinCodeBlock(_ref) {
+  var $from = _ref.$from,
+    $to = _ref.$to;
+  return $from.sameParent($to) && $from.parent.type.name === 'codeBlock';
 };

package/dist/types/blockControlsPluginType.d.ts

@@ -1,8 +1,8 @@
-import { type IntlShape } from 'react-intl-next';
-import { type INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import type { IntlShape } from 'react-intl-next';
+import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { DIRECTION, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AccessibilityUtilsPlugin } from '@atlaskit/editor-plugin-accessibility-utils';
-import { type AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
@@ -15,8 +15,8 @@ import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
 import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
-import { type Mapping } from '@atlaskit/editor-prosemirror/transform';
-import { type DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import type { Mapping } from '@atlaskit/editor-prosemirror/transform';
+import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 export type ActiveNode = {
     anchorName: string;
     handleOptions?: HandleOptions;
@@ -118,6 +118,7 @@ export type BlockControlsPluginDependencies = [
 ];
 export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
     commands: {
+        handleKeyDownWithPreservedSelection: (event: KeyboardEvent) => EditorCommand;
         moveNode: MoveNode;
         moveNodeWithBlockMenu: (direction: DIRECTION.UP | DIRECTION.DOWN) => EditorCommand;
         /**

package/dist/types/editor-commands/handle-key-down-with-preserved-selection.d.ts

@@ -0,0 +1,17 @@
+import type { EditorCommand, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockControlsPlugin } from '../blockControlsPluginType';
+/**
+ * Handles key presses when a selection is being preserved, when the block menu is open or closed.
+ *
+ * Based on the key pressed and whether the block menu is open or closed:
+ * 1. Handles key presses with custom logic (e.g. delete/backspace)
+ * 2. Closes the block menu
+ * 3. Stops preserving the selection
+ *
+ * This is used in two places:
+ * 1. selection preservation plugin when selection is being preserved, and focus is in the editor.
+ * 2. block menu UI component when focus is in the block menu.
+ *
+ * Ensures consistent behaviour for key presses in both scenarios.
+ */
+export declare const handleKeyDownWithPreservedSelection: (api?: ExtractInjectionAPI<BlockControlsPlugin>) => (event: KeyboardEvent) => EditorCommand;

package/dist/types/pm-plugins/selection-preservation/pm-plugin.d.ts

@@ -32,4 +32,4 @@ import type { SelectionPreservationPluginState } from './types';
  *
  * https://hello.atlassian.net/wiki/spaces/egcuc/pages/6170822503/Block+Menu+Solution+for+multi-select+and+selection+preservation
  */
-export declare const createSelectionPreservationPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined) => () => SafePlugin<SelectionPreservationPluginState>;
+export declare const createSelectionPreservationPlugin: (api?: ExtractInjectionAPI<BlockControlsPlugin>) => () => SafePlugin<SelectionPreservationPluginState>;

package/dist/types/pm-plugins/selection-preservation/utils.d.ts

@@ -1,4 +1,4 @@
-import type { ReadonlyTransaction, Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { ReadonlyTransaction, Selection, Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { SelectionPreservationMeta } from './types';
 /**
  * Detects if any of the transactions include user-driven selection changes.
@@ -8,3 +8,10 @@ import type { SelectionPreservationMeta } from './types';
  */
 export declare const hasUserSelectionChange: (transactions: readonly Transaction[]) => boolean;
 export declare const getSelectionPreservationMeta: (tr: Transaction | ReadonlyTransaction) => SelectionPreservationMeta | undefined;
+/**
+ * Checks if the current selection is within a code block.
+ *
+ * @param selection The current selection to check.
+ * @returns True if the selection is within a code block, otherwise false.
+ */
+export declare const isSelectionWithinCodeBlock: ({ $from, $to }: Selection) => boolean;

package/dist/types-ts4.5/blockControlsPluginType.d.ts

@@ -1,8 +1,8 @@
-import { type IntlShape } from 'react-intl-next';
-import { type INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import type { IntlShape } from 'react-intl-next';
+import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { DIRECTION, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AccessibilityUtilsPlugin } from '@atlaskit/editor-plugin-accessibility-utils';
-import { type AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
@@ -15,8 +15,8 @@ import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
 import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
-import { type Mapping } from '@atlaskit/editor-prosemirror/transform';
-import { type DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import type { Mapping } from '@atlaskit/editor-prosemirror/transform';
+import type { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 export type ActiveNode = {
     anchorName: string;
     handleOptions?: HandleOptions;
@@ -118,6 +118,7 @@ export type BlockControlsPluginDependencies = [
 ];
 export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
     commands: {
+        handleKeyDownWithPreservedSelection: (event: KeyboardEvent) => EditorCommand;
         moveNode: MoveNode;
         moveNodeWithBlockMenu: (direction: DIRECTION.UP | DIRECTION.DOWN) => EditorCommand;
         /**

package/dist/types-ts4.5/editor-commands/handle-key-down-with-preserved-selection.d.ts

@@ -0,0 +1,17 @@
+import type { EditorCommand, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockControlsPlugin } from '../blockControlsPluginType';
+/**
+ * Handles key presses when a selection is being preserved, when the block menu is open or closed.
+ *
+ * Based on the key pressed and whether the block menu is open or closed:
+ * 1. Handles key presses with custom logic (e.g. delete/backspace)
+ * 2. Closes the block menu
+ * 3. Stops preserving the selection
+ *
+ * This is used in two places:
+ * 1. selection preservation plugin when selection is being preserved, and focus is in the editor.
+ * 2. block menu UI component when focus is in the block menu.
+ *
+ * Ensures consistent behaviour for key presses in both scenarios.
+ */
+export declare const handleKeyDownWithPreservedSelection: (api?: ExtractInjectionAPI<BlockControlsPlugin>) => (event: KeyboardEvent) => EditorCommand;

package/dist/types-ts4.5/pm-plugins/selection-preservation/pm-plugin.d.ts

@@ -32,4 +32,4 @@ import type { SelectionPreservationPluginState } from './types';
  *
  * https://hello.atlassian.net/wiki/spaces/egcuc/pages/6170822503/Block+Menu+Solution+for+multi-select+and+selection+preservation
  */
-export declare const createSelectionPreservationPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined) => () => SafePlugin<SelectionPreservationPluginState>;
+export declare const createSelectionPreservationPlugin: (api?: ExtractInjectionAPI<BlockControlsPlugin>) => () => SafePlugin<SelectionPreservationPluginState>;

package/dist/types-ts4.5/pm-plugins/selection-preservation/utils.d.ts

@@ -1,4 +1,4 @@
-import type { ReadonlyTransaction, Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { ReadonlyTransaction, Selection, Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { SelectionPreservationMeta } from './types';
 /**
  * Detects if any of the transactions include user-driven selection changes.
@@ -8,3 +8,10 @@ import type { SelectionPreservationMeta } from './types';
  */
 export declare const hasUserSelectionChange: (transactions: readonly Transaction[]) => boolean;
 export declare const getSelectionPreservationMeta: (tr: Transaction | ReadonlyTransaction) => SelectionPreservationMeta | undefined;
+/**
+ * Checks if the current selection is within a code block.
+ *
+ * @param selection The current selection to check.
+ * @returns True if the selection is within a code block, otherwise false.
+ */
+export declare const isSelectionWithinCodeBlock: ({ $from, $to }: Selection) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "7.19.0",
+	"version": "8.0.0",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -30,19 +30,19 @@
 	"dependencies": {
 		"@atlaskit/adf-schema": "^51.5.0",
 		"@atlaskit/browser-apis": "^0.0.1",
-		"@atlaskit/editor-plugin-accessibility-utils": "^6.0.0",
-		"@atlaskit/editor-plugin-analytics": "^6.2.0",
-		"@atlaskit/editor-plugin-editor-disabled": "^6.1.0",
-		"@atlaskit/editor-plugin-feature-flags": "^5.0.0",
-		"@atlaskit/editor-plugin-interaction": "^11.0.0",
-		"@atlaskit/editor-plugin-limited-mode": "^3.2.0",
-		"@atlaskit/editor-plugin-metrics": "^7.1.0",
-		"@atlaskit/editor-plugin-quick-insert": "^6.2.0",
-		"@atlaskit/editor-plugin-selection": "^6.1.0",
-		"@atlaskit/editor-plugin-toolbar": "^3.5.0",
-		"@atlaskit/editor-plugin-type-ahead": "^6.6.0",
-		"@atlaskit/editor-plugin-user-intent": "^4.0.0",
-		"@atlaskit/editor-plugin-width": "^7.0.0",
+		"@atlaskit/editor-plugin-accessibility-utils": "^7.0.0",
+		"@atlaskit/editor-plugin-analytics": "^7.0.0",
+		"@atlaskit/editor-plugin-editor-disabled": "^7.0.0",
+		"@atlaskit/editor-plugin-feature-flags": "^6.0.0",
+		"@atlaskit/editor-plugin-interaction": "^12.0.0",
+		"@atlaskit/editor-plugin-limited-mode": "^4.0.0",
+		"@atlaskit/editor-plugin-metrics": "^8.0.0",
+		"@atlaskit/editor-plugin-quick-insert": "^7.0.0",
+		"@atlaskit/editor-plugin-selection": "^7.0.0",
+		"@atlaskit/editor-plugin-toolbar": "^4.0.0",
+		"@atlaskit/editor-plugin-type-ahead": "^7.0.0",
+		"@atlaskit/editor-plugin-user-intent": "^5.0.0",
+		"@atlaskit/editor-plugin-width": "^8.0.0",
 		"@atlaskit/editor-prosemirror": "^7.2.0",
 		"@atlaskit/editor-shared-styles": "^3.10.0",
 		"@atlaskit/editor-tables": "^2.9.0",
@@ -66,7 +66,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^110.50.0",
+		"@atlaskit/editor-common": "^111.0.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"