@atlaskit/editor-plugin-block-controls 7.13.2 → 7.13.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/blockControlsPlugin.js +1 -1
  3. package/dist/cjs/pm-plugins/selection-preservation/pm-plugin.js +77 -46
  4. package/dist/cjs/ui/drag-handle.js +24 -39
  5. package/dist/es2019/blockControlsPlugin.js +1 -1
  6. package/dist/es2019/pm-plugins/selection-preservation/pm-plugin.js +31 -1
  7. package/dist/es2019/ui/drag-handle.js +4 -20
  8. package/dist/esm/blockControlsPlugin.js +1 -1
  9. package/dist/esm/pm-plugins/selection-preservation/pm-plugin.js +77 -46
  10. package/dist/esm/ui/drag-handle.js +21 -36
  11. package/dist/types/pm-plugins/selection-preservation/pm-plugin.d.ts +3 -1
  12. package/dist/types-ts4.5/pm-plugins/selection-preservation/pm-plugin.d.ts +3 -1
  13. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 7.13.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`7c295bfea1292`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7c295bfea1292) -
8
+ EDITOR-3380 Use preserved selection when deleting selected range
9
+ - Updated dependencies
10
+
3
11
  ## 7.13.2
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/blockControlsPlugin.js CHANGED
@@ -49,7 +49,7 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
49
49
  if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)) {
50
50
  pmPlugins.push({
51
51
  name: 'blockControlsSelectionPreservationPlugin',
52
- plugin: _pmPlugin2.createSelectionPreservationPlugin
52
+ plugin: (0, _pmPlugin2.createSelectionPreservationPlugin)(api)
53
53
  });
54
54
  }
55
55
 
package/dist/cjs/pm-plugins/selection-preservation/pm-plugin.js CHANGED
@@ -42,55 +42,86 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
42
42
  * when modal dialogs are active. In these states, any selection changes are from ProseMirror's
43
43
  * internal behavior (not user input) and should be prevented. Do not use during normal editing.
44
44
  */
45
- var createSelectionPreservationPlugin = exports.createSelectionPreservationPlugin = function createSelectionPreservationPlugin() {
46
- return new _safePlugin.SafePlugin({
47
- key: _pluginKey.selectionPreservationPluginKey,
48
- state: {
49
- init: function init() {
50
- return {
51
- preservedSelection: undefined
52
- };
45
+ var createSelectionPreservationPlugin = exports.createSelectionPreservationPlugin = function createSelectionPreservationPlugin(api) {
46
+ return function () {
47
+ return new _safePlugin.SafePlugin({
48
+ key: _pluginKey.selectionPreservationPluginKey,
49
+ state: {
50
+ init: function init() {
51
+ return {
52
+ preservedSelection: undefined
53
+ };
54
+ },
55
+ apply: function apply(tr, pluginState) {
56
+ var meta = (0, _utils.getSelectionPreservationMeta)(tr);
57
+ var newState = _objectSpread({}, pluginState);
58
+ if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'startPreserving') {
59
+ newState.preservedSelection = tr.selection;
60
+ } else if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'stopPreserving') {
61
+ newState.preservedSelection = undefined;
62
+ }
63
+ if (newState.preservedSelection && tr.docChanged) {
64
+ newState.preservedSelection = (0, _selection.mapPreservedSelection)(newState.preservedSelection, tr);
65
+ }
66
+ return newState;
67
+ }
53
68
  },
54
- apply: function apply(tr, pluginState) {
55
- var meta = (0, _utils.getSelectionPreservationMeta)(tr);
56
- var newState = _objectSpread({}, pluginState);
57
- if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'startPreserving') {
58
- newState.preservedSelection = tr.selection;
59
- } else if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'stopPreserving') {
60
- newState.preservedSelection = undefined;
69
+ appendTransaction: function appendTransaction(transactions, _oldState, newState) {
70
+ var pluginState = _pluginKey.selectionPreservationPluginKey.getState(newState);
71
+ var savedSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.preservedSelection;
72
+ if (!savedSel) {
73
+ return null;
61
74
  }
62
- if (newState.preservedSelection && tr.docChanged) {
63
- newState.preservedSelection = (0, _selection.mapPreservedSelection)(newState.preservedSelection, tr);
75
+ if ((0, _utils.hasUserSelectionChange)(transactions)) {
76
+ // Auto-stop if user explicitly changes selection
77
+ return (0, _editorCommands.stopPreservingSelection)({
78
+ tr: newState.tr
79
+ });
80
+ }
81
+ var currSel = newState.selection;
82
+ var selectionUnchanged = currSel.from === savedSel.from && currSel.to === savedSel.to;
83
+ var selectionInvalid = savedSel.from < 0 || savedSel.to > newState.doc.content.size;
84
+ if (selectionUnchanged || selectionInvalid) {
85
+ return null;
86
+ }
87
+ try {
88
+ return newState.tr.setSelection(savedSel);
89
+ } catch (error) {
90
+ (0, _monitoring.logException)(error, {
91
+ location: 'editor-plugin-block-controls/SelectionPreservationPlugin'
92
+ });
64
93
  }
65
- return newState;
66
- }
67
- },
68
- appendTransaction: function appendTransaction(transactions, _oldState, newState) {
69
- var pluginState = _pluginKey.selectionPreservationPluginKey.getState(newState);
70
- var savedSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.preservedSelection;
71
- if (!savedSel) {
72
- return null;
73
- }
74
- if ((0, _utils.hasUserSelectionChange)(transactions)) {
75
- // Auto-stop if user explicitly changes selection
76
- return (0, _editorCommands.stopPreservingSelection)({
77
- tr: newState.tr
78
- });
79
- }
80
- var currSel = newState.selection;
81
- var selectionUnchanged = currSel.from === savedSel.from && currSel.to === savedSel.to;
82
- var selectionInvalid = savedSel.from < 0 || savedSel.to > newState.doc.content.size;
83
- if (selectionUnchanged || selectionInvalid) {
84
94
  return null;
95
+ },
96
+ props: {
97
+ handleKeyDown: function handleKeyDown(view, event) {
98
+ var _api$userIntent;
99
+ var _ref = _pluginKey.selectionPreservationPluginKey.getState(view.state) || {},
100
+ preservedSelection = _ref.preservedSelection;
101
+
102
+ // If there is no current preserved selection, do nothing
103
+ if (!preservedSelection) {
104
+ return false;
105
+ }
106
+
107
+ // While preserving selection, if user presses delete/backspace, prevent event from being
108
+ // handled by ProseMirror natively so that we can apply custom delete logic in block menu
109
+ if (event.key === 'Backspace' || event.key === 'Delete') {
110
+ return true;
111
+ }
112
+ 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';
113
+
114
+ // When block menu isn't open and user presses any key, stop preserving selection
115
+ if (!blockMenuOpen) {
116
+ var tr = view.state.tr;
117
+ (0, _editorCommands.stopPreservingSelection)({
118
+ tr: tr
119
+ });
120
+ view.dispatch(tr);
121
+ return false;
122
+ }
123
+ }
85
124
  }
86
- try {
87
- return newState.tr.setSelection(savedSel);
88
- } catch (error) {
89
- (0, _monitoring.logException)(error, {
90
- location: 'editor-plugin-block-controls/SelectionPreservationPlugin'
91
- });
92
- }
93
- return null;
94
- }
95
- });
125
+ });
126
+ };
96
127
  };
package/dist/cjs/ui/drag-handle.js CHANGED
@@ -17,7 +17,6 @@ var _browser = require("@atlaskit/editor-common/browser");
17
17
  var _hooks = require("@atlaskit/editor-common/hooks");
18
18
  var _keymaps = require("@atlaskit/editor-common/keymaps");
19
19
  var _messages = require("@atlaskit/editor-common/messages");
20
- var _selection = require("@atlaskit/editor-common/selection");
21
20
  var _styles = require("@atlaskit/editor-common/styles");
22
21
  var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
23
22
  var _state = require("@atlaskit/editor-prosemirror/state");
@@ -39,7 +38,7 @@ var _pluginKey = require("../pm-plugins/selection-preservation/plugin-key");
39
38
  var _analytics2 = require("../pm-plugins/utils/analytics");
40
39
  var _dragHandlePositions = require("../pm-plugins/utils/drag-handle-positions");
41
40
  var _getSelection = require("../pm-plugins/utils/getSelection");
42
- var _selection2 = require("../pm-plugins/utils/selection");
41
+ var _selection = require("../pm-plugins/utils/selection");
43
42
  var _consts2 = require("./consts");
44
43
  var _dragPreview = require("./drag-preview");
45
44
  var _anchorName = require("./utils/anchor-name");
@@ -482,8 +481,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
482
481
  tr = (0, _getSelection.selectNode)(tr, startPos, nodeType, api);
483
482
  } else if (isTopLevelNode && $anchor.depth <= _consts2.DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH && e.shiftKey && (0, _platformFeatureFlags.fg)('platform_editor_elements_dnd_shift_click_select')) {
484
483
  var _api$blockControls3;
485
- var alignAnchorHeadToSel = (0, _selection2.alignAnchorHeadInDirectionOfPos)(tr.selection, startPos);
486
- var selectionWithExpandedHead = (0, _selection2.expandSelectionHeadToNodeAtPos)(alignAnchorHeadToSel, startPos);
484
+ var alignAnchorHeadToSel = (0, _selection.alignAnchorHeadInDirectionOfPos)(tr.selection, startPos);
485
+ var selectionWithExpandedHead = (0, _selection.expandSelectionHeadToNodeAtPos)(alignAnchorHeadToSel, startPos);
487
486
  tr.setSelection(selectionWithExpandedHead);
488
487
  api === null || api === void 0 || (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 || _api$blockControls3.commands.setMultiSelectPositions()({
489
488
  tr: tr
@@ -574,20 +573,6 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
574
573
  });
575
574
  return tr;
576
575
  });
577
- } else if (e.key === 'Backspace' || e.key === 'Delete') {
578
- e.preventDefault();
579
- e.stopPropagation();
580
- api === null || api === void 0 || api.core.actions.execute(function (_ref7) {
581
- var _api$blockControls5;
582
- var tr = _ref7.tr;
583
- (0, _selection.deleteSelectedRange)(tr);
584
- api === null || api === void 0 || (_api$blockControls5 = api.blockControls) === null || _api$blockControls5 === void 0 || _api$blockControls5.commands.toggleBlockMenu({
585
- closeMenu: true
586
- })({
587
- tr: tr
588
- });
589
- return tr;
590
- });
591
576
  } else if (![e.altKey, e.ctrlKey, e.shiftKey].some(function (pressed) {
592
577
  return pressed;
593
578
  })) {
@@ -609,21 +594,21 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
609
594
  start: start
610
595
  };
611
596
  },
612
- onGenerateDragPreview: function onGenerateDragPreview(_ref8) {
597
+ onGenerateDragPreview: function onGenerateDragPreview(_ref7) {
613
598
  var _api$blockControls$sh2;
614
- var nativeSetDragImage = _ref8.nativeSetDragImage;
599
+ var nativeSetDragImage = _ref7.nativeSetDragImage;
615
600
  if (isMultiSelect) {
616
601
  var _api$core6;
617
- api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(function (_ref9) {
618
- var tr = _ref9.tr;
602
+ api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(function (_ref8) {
603
+ var tr = _ref8.tr;
619
604
  var handlePos = getPos();
620
605
  if (typeof handlePos !== 'number') {
621
606
  return tr;
622
607
  }
623
608
  var newHandlePosCheck = (0, _getSelection.isHandleCorrelatedToSelection)(view.state, tr.selection, handlePos);
624
609
  if (!tr.selection.empty && newHandlePosCheck) {
625
- var _api$blockControls6;
626
- api === null || api === void 0 || (_api$blockControls6 = api.blockControls) === null || _api$blockControls6 === void 0 || _api$blockControls6.commands.setMultiSelectPositions()({
610
+ var _api$blockControls5;
611
+ api === null || api === void 0 || (_api$blockControls5 = api.blockControls) === null || _api$blockControls5 === void 0 || _api$blockControls5.commands.setMultiSelectPositions()({
627
612
  tr: tr
628
613
  });
629
614
  } else if ((0, _platformFeatureFlags.fg)('platform_editor_elements_dnd_select_node_on_drag')) {
@@ -693,8 +678,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
693
678
  };
694
679
  }
695
680
  },
696
- render: function render(_ref0) {
697
- var container = _ref0.container;
681
+ render: function render(_ref9) {
682
+ var container = _ref9.container;
698
683
  var dom = view.dom.querySelector("[".concat((0, _domAttrName.getAnchorAttrName)(), "=\"").concat(anchorName, "\"]"));
699
684
  if (!dom) {
700
685
  return;
@@ -730,9 +715,9 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
730
715
  if (start === undefined) {
731
716
  return;
732
717
  }
733
- api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 || _api$core7.actions.execute(function (_ref1) {
734
- var _api$blockControls$sh3, _api$blockControls7, _api$analytics3;
735
- var tr = _ref1.tr;
718
+ api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 || _api$core7.actions.execute(function (_ref0) {
719
+ var _api$blockControls$sh3, _api$blockControls6, _api$analytics3;
720
+ var tr = _ref0.tr;
736
721
  var nodeTypes, hasSelectedMultipleNodes;
737
722
  var resolvedMovingNode = tr.doc.resolve(start);
738
723
  var maybeNode = resolvedMovingNode.nodeAfter;
@@ -745,7 +730,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
745
730
  nodeTypes = maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.type.name;
746
731
  hasSelectedMultipleNodes = false;
747
732
  }
748
- api === null || api === void 0 || (_api$blockControls7 = api.blockControls) === null || _api$blockControls7 === void 0 || _api$blockControls7.commands.setNodeDragged(getPos, anchorName, nodeType)({
733
+ api === null || api === void 0 || (_api$blockControls6 = api.blockControls) === null || _api$blockControls6 === void 0 || _api$blockControls6.commands.setNodeDragged(getPos, anchorName, nodeType)({
749
734
  tr: tr
750
735
  });
751
736
  tr.setMeta('scrollIntoView', false);
@@ -1128,15 +1113,15 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
1128
1113
  var render = isTooltip ? buttonWithTooltip() : renderButton();
1129
1114
  return (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? stickyRender : render;
1130
1115
  };
1131
- var DragHandleWithVisibility = exports.DragHandleWithVisibility = function DragHandleWithVisibility(_ref10) {
1132
- var view = _ref10.view,
1133
- api = _ref10.api,
1134
- formatMessage = _ref10.formatMessage,
1135
- getPos = _ref10.getPos,
1136
- anchorName = _ref10.anchorName,
1137
- nodeType = _ref10.nodeType,
1138
- handleOptions = _ref10.handleOptions,
1139
- anchorRectCache = _ref10.anchorRectCache;
1116
+ var DragHandleWithVisibility = exports.DragHandleWithVisibility = function DragHandleWithVisibility(_ref1) {
1117
+ var view = _ref1.view,
1118
+ api = _ref1.api,
1119
+ formatMessage = _ref1.formatMessage,
1120
+ getPos = _ref1.getPos,
1121
+ anchorName = _ref1.anchorName,
1122
+ nodeType = _ref1.nodeType,
1123
+ handleOptions = _ref1.handleOptions,
1124
+ anchorRectCache = _ref1.anchorRectCache;
1140
1125
  return (0, _react2.jsx)(_visibilityContainer.VisibilityContainer, {
1141
1126
  api: api
1142
1127
  }, (0, _react2.jsx)(DragHandle, {
package/dist/es2019/blockControlsPlugin.js CHANGED
@@ -38,7 +38,7 @@ export const blockControlsPlugin = ({
38
38
  if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
39
39
  pmPlugins.push({
40
40
  name: 'blockControlsSelectionPreservationPlugin',
41
- plugin: createSelectionPreservationPlugin
41
+ plugin: createSelectionPreservationPlugin(api)
42
42
  });
43
43
  }
44
44
 
package/dist/es2019/pm-plugins/selection-preservation/pm-plugin.js CHANGED
@@ -33,7 +33,7 @@ import { getSelectionPreservationMeta, hasUserSelectionChange } from './utils';
33
33
  * when modal dialogs are active. In these states, any selection changes are from ProseMirror's
34
34
  * internal behavior (not user input) and should be prevented. Do not use during normal editing.
35
35
  */
36
- export const createSelectionPreservationPlugin = () => {
36
+ export const createSelectionPreservationPlugin = api => () => {
37
37
  return new SafePlugin({
38
38
  key: selectionPreservationPluginKey,
39
39
  state: {
@@ -84,6 +84,36 @@ export const createSelectionPreservationPlugin = () => {
84
84
  });
85
85
  }
86
86
  return null;
87
+ },
88
+ props: {
89
+ handleKeyDown: (view, event) => {
90
+ var _api$userIntent, _api$userIntent$share;
91
+ const {
92
+ preservedSelection
93
+ } = selectionPreservationPluginKey.getState(view.state) || {};
94
+
95
+ // If there is no current preserved selection, do nothing
96
+ if (!preservedSelection) {
97
+ return false;
98
+ }
99
+
100
+ // While preserving selection, if user presses delete/backspace, prevent event from being
101
+ // handled by ProseMirror natively so that we can apply custom delete logic in block menu
102
+ if (event.key === 'Backspace' || event.key === 'Delete') {
103
+ return true;
104
+ }
105
+ 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';
106
+
107
+ // When block menu isn't open and user presses any key, stop preserving selection
108
+ if (!blockMenuOpen) {
109
+ const tr = view.state.tr;
110
+ stopPreservingSelection({
111
+ tr
112
+ });
113
+ view.dispatch(tr);
114
+ return false;
115
+ }
116
+ }
87
117
  }
88
118
  });
89
119
  };
package/dist/es2019/ui/drag-handle.js CHANGED
@@ -14,7 +14,6 @@ import { browser as browserLegacy, getBrowserInfo } from '@atlaskit/editor-commo
14
14
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
15
15
  import { dragToMoveDown, dragToMoveLeft, dragToMoveRight, dragToMoveUp, getAriaKeyshortcuts, TooltipContentWithMultipleShortcuts } from '@atlaskit/editor-common/keymaps';
16
16
  import { blockControlsMessages } from '@atlaskit/editor-common/messages';
17
- import { deleteSelectedRange } from '@atlaskit/editor-common/selection';
18
17
  import { DRAG_HANDLE_WIDTH, tableControlsSpacing } from '@atlaskit/editor-common/styles';
19
18
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
20
19
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
@@ -553,21 +552,6 @@ export const DragHandle = ({
553
552
  });
554
553
  return tr;
555
554
  });
556
- } else if (e.key === 'Backspace' || e.key === 'Delete') {
557
- e.preventDefault();
558
- e.stopPropagation();
559
- api === null || api === void 0 ? void 0 : api.core.actions.execute(({
560
- tr
561
- }) => {
562
- var _api$blockControls5;
563
- deleteSelectedRange(tr);
564
- api === null || api === void 0 ? void 0 : (_api$blockControls5 = api.blockControls) === null || _api$blockControls5 === void 0 ? void 0 : _api$blockControls5.commands.toggleBlockMenu({
565
- closeMenu: true
566
- })({
567
- tr
568
- });
569
- return tr;
570
- });
571
555
  } else if (![e.altKey, e.ctrlKey, e.shiftKey].some(pressed => pressed)) {
572
556
  // If not trying to press shortcut keys,
573
557
  // return focus to editor to resume editing from caret position
@@ -600,8 +584,8 @@ export const DragHandle = ({
600
584
  }
601
585
  const newHandlePosCheck = isHandleCorrelatedToSelection(view.state, tr.selection, handlePos);
602
586
  if (!tr.selection.empty && newHandlePosCheck) {
603
- var _api$blockControls6;
604
- api === null || api === void 0 ? void 0 : (_api$blockControls6 = api.blockControls) === null || _api$blockControls6 === void 0 ? void 0 : _api$blockControls6.commands.setMultiSelectPositions()({
587
+ var _api$blockControls5;
588
+ api === null || api === void 0 ? void 0 : (_api$blockControls5 = api.blockControls) === null || _api$blockControls5 === void 0 ? void 0 : _api$blockControls5.commands.setMultiSelectPositions()({
605
589
  tr
606
590
  });
607
591
  } else if (fg('platform_editor_elements_dnd_select_node_on_drag')) {
@@ -716,7 +700,7 @@ export const DragHandle = ({
716
700
  api === null || api === void 0 ? void 0 : (_api$core7 = api.core) === null || _api$core7 === void 0 ? void 0 : _api$core7.actions.execute(({
717
701
  tr
718
702
  }) => {
719
- var _api$blockControls$sh3, _api$blockControls7, _api$analytics3;
703
+ var _api$blockControls$sh3, _api$blockControls6, _api$analytics3;
720
704
  let nodeTypes, hasSelectedMultipleNodes;
721
705
  const resolvedMovingNode = tr.doc.resolve(start);
722
706
  const maybeNode = resolvedMovingNode.nodeAfter;
@@ -729,7 +713,7 @@ export const DragHandle = ({
729
713
  nodeTypes = maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.type.name;
730
714
  hasSelectedMultipleNodes = false;
731
715
  }
732
- api === null || api === void 0 ? void 0 : (_api$blockControls7 = api.blockControls) === null || _api$blockControls7 === void 0 ? void 0 : _api$blockControls7.commands.setNodeDragged(getPos, anchorName, nodeType)({
716
+ api === null || api === void 0 ? void 0 : (_api$blockControls6 = api.blockControls) === null || _api$blockControls6 === void 0 ? void 0 : _api$blockControls6.commands.setNodeDragged(getPos, anchorName, nodeType)({
733
717
  tr
734
718
  });
735
719
  tr.setMeta('scrollIntoView', false);
package/dist/esm/blockControlsPlugin.js CHANGED
@@ -42,7 +42,7 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
42
42
  if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
43
43
  pmPlugins.push({
44
44
  name: 'blockControlsSelectionPreservationPlugin',
45
- plugin: createSelectionPreservationPlugin
45
+ plugin: createSelectionPreservationPlugin(api)
46
46
  });
47
47
  }
48
48
 
package/dist/esm/pm-plugins/selection-preservation/pm-plugin.js CHANGED
@@ -36,55 +36,86 @@ import { getSelectionPreservationMeta, hasUserSelectionChange } from './utils';
36
36
  * when modal dialogs are active. In these states, any selection changes are from ProseMirror's
37
37
  * internal behavior (not user input) and should be prevented. Do not use during normal editing.
38
38
  */
39
- export var createSelectionPreservationPlugin = function createSelectionPreservationPlugin() {
40
- return new SafePlugin({
41
- key: selectionPreservationPluginKey,
42
- state: {
43
- init: function init() {
44
- return {
45
- preservedSelection: undefined
46
- };
39
+ export var createSelectionPreservationPlugin = function createSelectionPreservationPlugin(api) {
40
+ return function () {
41
+ return new SafePlugin({
42
+ key: selectionPreservationPluginKey,
43
+ state: {
44
+ init: function init() {
45
+ return {
46
+ preservedSelection: undefined
47
+ };
48
+ },
49
+ apply: function apply(tr, pluginState) {
50
+ var meta = getSelectionPreservationMeta(tr);
51
+ var newState = _objectSpread({}, pluginState);
52
+ if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'startPreserving') {
53
+ newState.preservedSelection = tr.selection;
54
+ } else if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'stopPreserving') {
55
+ newState.preservedSelection = undefined;
56
+ }
57
+ if (newState.preservedSelection && tr.docChanged) {
58
+ newState.preservedSelection = mapPreservedSelection(newState.preservedSelection, tr);
59
+ }
60
+ return newState;
61
+ }
47
62
  },
48
- apply: function apply(tr, pluginState) {
49
- var meta = getSelectionPreservationMeta(tr);
50
- var newState = _objectSpread({}, pluginState);
51
- if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'startPreserving') {
52
- newState.preservedSelection = tr.selection;
53
- } else if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'stopPreserving') {
54
- newState.preservedSelection = undefined;
63
+ appendTransaction: function appendTransaction(transactions, _oldState, newState) {
64
+ var pluginState = selectionPreservationPluginKey.getState(newState);
65
+ var savedSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.preservedSelection;
66
+ if (!savedSel) {
67
+ return null;
55
68
  }
56
- if (newState.preservedSelection && tr.docChanged) {
57
- newState.preservedSelection = mapPreservedSelection(newState.preservedSelection, tr);
69
+ if (hasUserSelectionChange(transactions)) {
70
+ // Auto-stop if user explicitly changes selection
71
+ return stopPreservingSelection({
72
+ tr: newState.tr
73
+ });
74
+ }
75
+ var currSel = newState.selection;
76
+ var selectionUnchanged = currSel.from === savedSel.from && currSel.to === savedSel.to;
77
+ var selectionInvalid = savedSel.from < 0 || savedSel.to > newState.doc.content.size;
78
+ if (selectionUnchanged || selectionInvalid) {
79
+ return null;
80
+ }
81
+ try {
82
+ return newState.tr.setSelection(savedSel);
83
+ } catch (error) {
84
+ logException(error, {
85
+ location: 'editor-plugin-block-controls/SelectionPreservationPlugin'
86
+ });
58
87
  }
59
- return newState;
60
- }
61
- },
62
- appendTransaction: function appendTransaction(transactions, _oldState, newState) {
63
- var pluginState = selectionPreservationPluginKey.getState(newState);
64
- var savedSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.preservedSelection;
65
- if (!savedSel) {
66
- return null;
67
- }
68
- if (hasUserSelectionChange(transactions)) {
69
- // Auto-stop if user explicitly changes selection
70
- return stopPreservingSelection({
71
- tr: newState.tr
72
- });
73
- }
74
- var currSel = newState.selection;
75
- var selectionUnchanged = currSel.from === savedSel.from && currSel.to === savedSel.to;
76
- var selectionInvalid = savedSel.from < 0 || savedSel.to > newState.doc.content.size;
77
- if (selectionUnchanged || selectionInvalid) {
78
88
  return null;
89
+ },
90
+ props: {
91
+ handleKeyDown: function handleKeyDown(view, event) {
92
+ var _api$userIntent;
93
+ var _ref = selectionPreservationPluginKey.getState(view.state) || {},
94
+ preservedSelection = _ref.preservedSelection;
95
+
96
+ // If there is no current preserved selection, do nothing
97
+ if (!preservedSelection) {
98
+ return false;
99
+ }
100
+
101
+ // While preserving selection, if user presses delete/backspace, prevent event from being
102
+ // handled by ProseMirror natively so that we can apply custom delete logic in block menu
103
+ if (event.key === 'Backspace' || event.key === 'Delete') {
104
+ return true;
105
+ }
106
+ 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';
107
+
108
+ // When block menu isn't open and user presses any key, stop preserving selection
109
+ if (!blockMenuOpen) {
110
+ var tr = view.state.tr;
111
+ stopPreservingSelection({
112
+ tr: tr
113
+ });
114
+ view.dispatch(tr);
115
+ return false;
116
+ }
117
+ }
79
118
  }
80
- try {
81
- return newState.tr.setSelection(savedSel);
82
- } catch (error) {
83
- logException(error, {
84
- location: 'editor-plugin-block-controls/SelectionPreservationPlugin'
85
- });
86
- }
87
- return null;
88
- }
89
- });
119
+ });
120
+ };
90
121
  };
package/dist/esm/ui/drag-handle.js CHANGED
@@ -19,7 +19,6 @@ import { browser as browserLegacy, getBrowserInfo } from '@atlaskit/editor-commo
19
19
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
20
20
  import { dragToMoveDown, dragToMoveLeft, dragToMoveRight, dragToMoveUp, getAriaKeyshortcuts, TooltipContentWithMultipleShortcuts } from '@atlaskit/editor-common/keymaps';
21
21
  import { blockControlsMessages } from '@atlaskit/editor-common/messages';
22
- import { deleteSelectedRange } from '@atlaskit/editor-common/selection';
23
22
  import { DRAG_HANDLE_WIDTH, tableControlsSpacing } from '@atlaskit/editor-common/styles';
24
23
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
25
24
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
@@ -571,20 +570,6 @@ export var DragHandle = function DragHandle(_ref2) {
571
570
  });
572
571
  return tr;
573
572
  });
574
- } else if (e.key === 'Backspace' || e.key === 'Delete') {
575
- e.preventDefault();
576
- e.stopPropagation();
577
- api === null || api === void 0 || api.core.actions.execute(function (_ref7) {
578
- var _api$blockControls5;
579
- var tr = _ref7.tr;
580
- deleteSelectedRange(tr);
581
- api === null || api === void 0 || (_api$blockControls5 = api.blockControls) === null || _api$blockControls5 === void 0 || _api$blockControls5.commands.toggleBlockMenu({
582
- closeMenu: true
583
- })({
584
- tr: tr
585
- });
586
- return tr;
587
- });
588
573
  } else if (![e.altKey, e.ctrlKey, e.shiftKey].some(function (pressed) {
589
574
  return pressed;
590
575
  })) {
@@ -606,21 +591,21 @@ export var DragHandle = function DragHandle(_ref2) {
606
591
  start: start
607
592
  };
608
593
  },
609
- onGenerateDragPreview: function onGenerateDragPreview(_ref8) {
594
+ onGenerateDragPreview: function onGenerateDragPreview(_ref7) {
610
595
  var _api$blockControls$sh2;
611
- var nativeSetDragImage = _ref8.nativeSetDragImage;
596
+ var nativeSetDragImage = _ref7.nativeSetDragImage;
612
597
  if (isMultiSelect) {
613
598
  var _api$core6;
614
- api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(function (_ref9) {
615
- var tr = _ref9.tr;
599
+ api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(function (_ref8) {
600
+ var tr = _ref8.tr;
616
601
  var handlePos = getPos();
617
602
  if (typeof handlePos !== 'number') {
618
603
  return tr;
619
604
  }
620
605
  var newHandlePosCheck = isHandleCorrelatedToSelection(view.state, tr.selection, handlePos);
621
606
  if (!tr.selection.empty && newHandlePosCheck) {
622
- var _api$blockControls6;
623
- api === null || api === void 0 || (_api$blockControls6 = api.blockControls) === null || _api$blockControls6 === void 0 || _api$blockControls6.commands.setMultiSelectPositions()({
607
+ var _api$blockControls5;
608
+ api === null || api === void 0 || (_api$blockControls5 = api.blockControls) === null || _api$blockControls5 === void 0 || _api$blockControls5.commands.setMultiSelectPositions()({
624
609
  tr: tr
625
610
  });
626
611
  } else if (fg('platform_editor_elements_dnd_select_node_on_drag')) {
@@ -690,8 +675,8 @@ export var DragHandle = function DragHandle(_ref2) {
690
675
  };
691
676
  }
692
677
  },
693
- render: function render(_ref0) {
694
- var container = _ref0.container;
678
+ render: function render(_ref9) {
679
+ var container = _ref9.container;
695
680
  var dom = view.dom.querySelector("[".concat(getAnchorAttrName(), "=\"").concat(anchorName, "\"]"));
696
681
  if (!dom) {
697
682
  return;
@@ -727,9 +712,9 @@ export var DragHandle = function DragHandle(_ref2) {
727
712
  if (start === undefined) {
728
713
  return;
729
714
  }
730
- api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 || _api$core7.actions.execute(function (_ref1) {
731
- var _api$blockControls$sh3, _api$blockControls7, _api$analytics3;
732
- var tr = _ref1.tr;
715
+ api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 || _api$core7.actions.execute(function (_ref0) {
716
+ var _api$blockControls$sh3, _api$blockControls6, _api$analytics3;
717
+ var tr = _ref0.tr;
733
718
  var nodeTypes, hasSelectedMultipleNodes;
734
719
  var resolvedMovingNode = tr.doc.resolve(start);
735
720
  var maybeNode = resolvedMovingNode.nodeAfter;
@@ -742,7 +727,7 @@ export var DragHandle = function DragHandle(_ref2) {
742
727
  nodeTypes = maybeNode === null || maybeNode === void 0 ? void 0 : maybeNode.type.name;
743
728
  hasSelectedMultipleNodes = false;
744
729
  }
745
- api === null || api === void 0 || (_api$blockControls7 = api.blockControls) === null || _api$blockControls7 === void 0 || _api$blockControls7.commands.setNodeDragged(getPos, anchorName, nodeType)({
730
+ api === null || api === void 0 || (_api$blockControls6 = api.blockControls) === null || _api$blockControls6 === void 0 || _api$blockControls6.commands.setNodeDragged(getPos, anchorName, nodeType)({
746
731
  tr: tr
747
732
  });
748
733
  tr.setMeta('scrollIntoView', false);
@@ -1125,15 +1110,15 @@ export var DragHandle = function DragHandle(_ref2) {
1125
1110
  var render = isTooltip ? buttonWithTooltip() : renderButton();
1126
1111
  return editorExperiment('platform_editor_controls', 'variant1') ? stickyRender : render;
1127
1112
  };
1128
- export var DragHandleWithVisibility = function DragHandleWithVisibility(_ref10) {
1129
- var view = _ref10.view,
1130
- api = _ref10.api,
1131
- formatMessage = _ref10.formatMessage,
1132
- getPos = _ref10.getPos,
1133
- anchorName = _ref10.anchorName,
1134
- nodeType = _ref10.nodeType,
1135
- handleOptions = _ref10.handleOptions,
1136
- anchorRectCache = _ref10.anchorRectCache;
1113
+ export var DragHandleWithVisibility = function DragHandleWithVisibility(_ref1) {
1114
+ var view = _ref1.view,
1115
+ api = _ref1.api,
1116
+ formatMessage = _ref1.formatMessage,
1117
+ getPos = _ref1.getPos,
1118
+ anchorName = _ref1.anchorName,
1119
+ nodeType = _ref1.nodeType,
1120
+ handleOptions = _ref1.handleOptions,
1121
+ anchorRectCache = _ref1.anchorRectCache;
1137
1122
  return jsx(VisibilityContainer, {
1138
1123
  api: api
1139
1124
  }, jsx(DragHandle, {
package/dist/types/pm-plugins/selection-preservation/pm-plugin.d.ts CHANGED
@@ -1,4 +1,6 @@
1
1
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
+ import type { BlockControlsPlugin } from '../../blockControlsPluginType';
2
4
  import type { SelectionPreservationPluginState } from './types';
3
5
  /**
4
6
  * Selection Preservation Plugin
@@ -28,4 +30,4 @@ import type { SelectionPreservationPluginState } from './types';
28
30
  * when modal dialogs are active. In these states, any selection changes are from ProseMirror's
29
31
  * internal behavior (not user input) and should be prevented. Do not use during normal editing.
30
32
  */
31
- export declare const createSelectionPreservationPlugin: () => SafePlugin<SelectionPreservationPluginState>;
33
+ export declare const createSelectionPreservationPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined) => () => SafePlugin<SelectionPreservationPluginState>;
package/dist/types-ts4.5/pm-plugins/selection-preservation/pm-plugin.d.ts CHANGED
@@ -1,4 +1,6 @@
1
1
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
+ import type { BlockControlsPlugin } from '../../blockControlsPluginType';
2
4
  import type { SelectionPreservationPluginState } from './types';
3
5
  /**
4
6
  * Selection Preservation Plugin
@@ -28,4 +30,4 @@ import type { SelectionPreservationPluginState } from './types';
28
30
  * when modal dialogs are active. In these states, any selection changes are from ProseMirror's
29
31
  * internal behavior (not user input) and should be prevented. Do not use during normal editing.
30
32
  */
31
- export declare const createSelectionPreservationPlugin: () => SafePlugin<SelectionPreservationPluginState>;
33
+ export declare const createSelectionPreservationPlugin: (api: ExtractInjectionAPI<BlockControlsPlugin> | undefined) => () => SafePlugin<SelectionPreservationPluginState>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "7.13.2",
3
+ "version": "7.13.3",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -10,7 +10,7 @@
10
10
  "atlassian": {
11
11
  "team": "Editor: Jenga"
12
12
  },
13
- "repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
13
+ "repository": "https://bitbucket.org/atlassian/atlassian-frontend-monorepo",
14
14
  "main": "dist/cjs/index.js",
15
15
  "module": "dist/esm/index.js",
16
16
  "module:es2019": "dist/es2019/index.js",
@@ -54,7 +54,7 @@
54
54
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
55
55
  "@atlaskit/primitives": "^16.4.0",
56
56
  "@atlaskit/theme": "^21.0.0",
57
- "@atlaskit/tmp-editor-statsig": "^15.0.0",
57
+ "@atlaskit/tmp-editor-statsig": "^15.6.0",
58
58
  "@atlaskit/tokens": "^8.4.0",
59
59
  "@atlaskit/tooltip": "^20.11.0",
60
60
  "@babel/runtime": "^7.0.0",
@@ -66,7 +66,7 @@
66
66
  "uuid": "^3.1.0"
67
67
  },
68
68
  "peerDependencies": {
69
- "@atlaskit/editor-common": "^110.40.0",
69
+ "@atlaskit/editor-common": "^110.41.0",
70
70
  "react": "^18.2.0",
71
71
  "react-dom": "^18.2.0",
72
72
  "react-intl-next": "npm:react-intl@^5.18.1"