@atlaskit/editor-plugin-block-controls 3.8.4 → 3.8.5

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 (42) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/cjs/editor-commands/move-node.js +50 -62
  3. package/dist/cjs/editor-commands/show-drag-handle.js +5 -73
  4. package/dist/cjs/pm-plugins/decorations-anchor.js +9 -10
  5. package/dist/cjs/pm-plugins/decorations-common.js +2 -5
  6. package/dist/cjs/pm-plugins/decorations-drag-handle.js +18 -22
  7. package/dist/cjs/pm-plugins/decorations-drop-target.js +46 -48
  8. package/dist/cjs/pm-plugins/handle-mouse-over.js +5 -10
  9. package/dist/cjs/pm-plugins/keymap.js +10 -13
  10. package/dist/cjs/pm-plugins/main.js +4 -177
  11. package/dist/cjs/ui/drag-handle.js +6 -9
  12. package/dist/cjs/ui/drop-target.js +1 -1
  13. package/dist/cjs/ui/global-styles.js +1 -28
  14. package/dist/es2019/editor-commands/move-node.js +50 -62
  15. package/dist/es2019/editor-commands/show-drag-handle.js +4 -69
  16. package/dist/es2019/pm-plugins/decorations-anchor.js +10 -11
  17. package/dist/es2019/pm-plugins/decorations-common.js +1 -2
  18. package/dist/es2019/pm-plugins/decorations-drag-handle.js +18 -24
  19. package/dist/es2019/pm-plugins/decorations-drop-target.js +47 -49
  20. package/dist/es2019/pm-plugins/handle-mouse-over.js +5 -10
  21. package/dist/es2019/pm-plugins/keymap.js +10 -13
  22. package/dist/es2019/pm-plugins/main.js +3 -158
  23. package/dist/es2019/ui/drag-handle.js +6 -9
  24. package/dist/es2019/ui/drop-target.js +1 -1
  25. package/dist/es2019/ui/global-styles.js +1 -42
  26. package/dist/esm/editor-commands/move-node.js +50 -62
  27. package/dist/esm/editor-commands/show-drag-handle.js +5 -73
  28. package/dist/esm/pm-plugins/decorations-anchor.js +10 -11
  29. package/dist/esm/pm-plugins/decorations-common.js +1 -4
  30. package/dist/esm/pm-plugins/decorations-drag-handle.js +18 -22
  31. package/dist/esm/pm-plugins/decorations-drop-target.js +47 -49
  32. package/dist/esm/pm-plugins/handle-mouse-over.js +5 -10
  33. package/dist/esm/pm-plugins/keymap.js +10 -13
  34. package/dist/esm/pm-plugins/main.js +5 -177
  35. package/dist/esm/ui/drag-handle.js +6 -9
  36. package/dist/esm/ui/drop-target.js +1 -1
  37. package/dist/esm/ui/global-styles.js +1 -28
  38. package/dist/types/pm-plugins/decorations-common.d.ts +1 -1
  39. package/dist/types/pm-plugins/main.d.ts +1 -15
  40. package/dist/types-ts4.5/pm-plugins/decorations-common.d.ts +1 -1
  41. package/dist/types-ts4.5/pm-plugins/main.d.ts +1 -15
  42. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 3.8.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [#133802](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/133802)
8
+ [`f523489c8b68a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f523489c8b68a) -
9
+ [ux] ED-27217 Clean up experiment platform_editor_element_drag_and_drop_nested
10
+ - Updated dependencies
11
+
3
12
  ## 3.8.4
4
13
 
5
14
  ### Patch Changes
@@ -121,7 +121,7 @@ var getCurrentNodePos = function getCurrentNodePos(state) {
121
121
  // 2. caret cursor is inside the node
122
122
  // 3. the start of the selection is inside the node
123
123
  currentNodePos = selection.$from.before(1);
124
- if (selection.$from.depth > 0 && (0, _experiments.editorExperiment)('nested-dnd', true)) {
124
+ if (selection.$from.depth > 0) {
125
125
  currentNodePos = (0, _getNestedNodePosition.getNestedNodePosition)(state);
126
126
  }
127
127
  }
@@ -135,12 +135,8 @@ var getFocusedHandle = function getFocusedHandle(state) {
135
135
  };
136
136
  var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, formatMessage) {
137
137
  return function (state) {
138
- var isParentNodeOfTypeLayout;
139
- var shouldEnableNestedDndA11y = (0, _experiments.editorExperiment)('nested-dnd', true);
140
138
  var selection = state.selection;
141
- if (shouldEnableNestedDndA11y) {
142
- isParentNodeOfTypeLayout = !!(0, _utils2.findParentNodeOfType)([state.schema.nodes.layoutSection])(state.selection);
143
- }
139
+ var isParentNodeOfTypeLayout = !!(0, _utils2.findParentNodeOfType)([state.schema.nodes.layoutSection])(state.selection);
144
140
  var isMultiSelectEnabled = (0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true);
145
141
  var expandedSelection = (0, _selection.expandSelectionBounds)(selection.$anchor, selection.$head);
146
142
  var expandedAnchor = expandedSelection.$anchor.pos;
@@ -161,7 +157,7 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
161
157
  var moveToPos = -1;
162
158
  var nodeIndex = $currentNodePos.index();
163
159
  var isLayoutColumnSelected = selection instanceof _state.NodeSelection && selection.node.type.name === 'layoutColumn';
164
- if (direction === _consts.DIRECTION.LEFT && shouldEnableNestedDndA11y) {
160
+ if (direction === _consts.DIRECTION.LEFT) {
165
161
  if (isTopLevelNode && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
166
162
  var _api$core, _api$core2;
167
163
  var nodeBefore = $currentNodePos.nodeBefore;
@@ -205,7 +201,7 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
205
201
  var previousNode = grandParent ? grandParent.maybeChild(index - 1) : null;
206
202
  moveToPos = $currentNodePos.start() - ((previousNode === null || previousNode === void 0 ? void 0 : previousNode.nodeSize) || 1);
207
203
  }
208
- } else if (direction === _consts.DIRECTION.RIGHT && shouldEnableNestedDndA11y) {
204
+ } else if (direction === _consts.DIRECTION.RIGHT) {
209
205
  if (isTopLevelNode && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
210
206
  var _api$core4, _api$core5;
211
207
  var endOfDoc = $currentNodePos.end();
@@ -257,7 +253,7 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
257
253
  if (isLayoutColumnSelected) {
258
254
  moveToPos = $currentNodePos.start() - 1;
259
255
  } else {
260
- var _nodeBefore = $currentNodePos.depth > 1 && nodeIndex === 0 && shouldEnableNestedDndA11y ? $currentNodePos.node($currentNodePos.depth) : $currentNodePos.nodeBefore;
256
+ var _nodeBefore = $currentNodePos.depth > 1 && nodeIndex === 0 ? $currentNodePos.node($currentNodePos.depth) : $currentNodePos.nodeBefore;
261
257
  if (_nodeBefore) {
262
258
  moveToPos = currentNodePos - _nodeBefore.nodeSize;
263
259
  }
@@ -282,10 +278,10 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
282
278
  if (moveToPos > -1 && (0, _platformFeatureFlags.fg)('platform_editor_elements_dnd_multi_select_patch_2')) {
283
279
  var isDestDepthSameAsSource = $currentNodePos.depth === state.doc.resolve(moveToPos).depth;
284
280
  var isSourceLayoutColumn = nodeType === 'layoutColumn';
285
- shouldMoveNode = (shouldEnableNestedDndA11y ? isDestDepthSameAsSource || isSourceLayoutColumn : true) || isSourceLayoutColumn;
281
+ shouldMoveNode = isDestDepthSameAsSource || isSourceLayoutColumn;
286
282
  } else {
287
283
  // only move the node if the destination is at the same depth, not support moving a nested node to a parent node
288
- shouldMoveNode = (shouldEnableNestedDndA11y ? moveToPos > -1 && $currentNodePos.depth === state.doc.resolve(moveToPos).depth || nodeType === 'layoutColumn' : moveToPos > -1) || nodeType === 'layoutColumn';
284
+ shouldMoveNode = moveToPos > -1 && $currentNodePos.depth === state.doc.resolve(moveToPos).depth || nodeType === 'layoutColumn';
289
285
  }
290
286
  var _expandSelectionBound = (0, _selection.expandSelectionBounds)($currentNodePos, selection.$to),
291
287
  $newAnchor = _expandSelectionBound.$anchor,
@@ -358,7 +354,6 @@ var moveNode = exports.moveNode = function moveNode(api) {
358
354
  }
359
355
  var sliceFrom = start;
360
356
  var sliceTo;
361
- var mappedTo;
362
357
  var sourceNodeTypes, hasSelectedMultipleNodes;
363
358
  var isMultiSelect = (0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true);
364
359
  if ((0, _platformFeatureFlags.fg)('platform_editor_ease_of_use_metrics')) {
@@ -384,60 +379,53 @@ var moveNode = exports.moveNode = function moveNode(api) {
384
379
  nestedExpand = _tr$doc$type$schema$n.nestedExpand;
385
380
  var $to = tr.doc.resolve(to);
386
381
  var $handlePos = tr.doc.resolve(start);
387
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
388
- var nodeCopy = tr.doc.slice(sliceFrom, sliceTo, false); // cut the content
389
- var destType = $to.node().type;
390
- var destParent = $to.node($to.depth);
391
- var sourceNode = $handlePos.nodeAfter;
392
- var dragLayoutColumnToTopLevel = isDragLayoutColumnToTopLevel($handlePos, $to);
393
- var dragLayoutColumnIntoTable = isDragLayoutColumnIntoTable($handlePos, $to);
394
- var dragLayoutColumnIntoPanel = isDragLayoutColumnIntoPanel($handlePos, $to);
382
+ var nodeCopy = tr.doc.slice(sliceFrom, sliceTo, false); // cut the content
383
+ var destType = $to.node().type;
384
+ var destParent = $to.node($to.depth);
385
+ var sourceNode = $handlePos.nodeAfter;
386
+ var dragLayoutColumnToTopLevel = isDragLayoutColumnToTopLevel($handlePos, $to);
387
+ var dragLayoutColumnIntoTable = isDragLayoutColumnIntoTable($handlePos, $to);
388
+ var dragLayoutColumnIntoPanel = isDragLayoutColumnIntoPanel($handlePos, $to);
395
389
 
396
- //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
397
- // Move a layout column to top level
398
- // Move a layout column into a table cell, only moves the content into the cell
399
- // Move a layout column into a panel, only moves the content into the panel
400
- if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable || dragLayoutColumnIntoPanel)) {
401
- // need update after we support single column layout.
402
- var layoutColumnContent = sourceNode.content;
403
- var fragment;
404
- if (dragLayoutColumnIntoTable) {
405
- var contentContainsExpand = (0, _utils2.findChildrenByType)(sourceNode, expand).length > 0;
406
- fragment = contentContainsExpand ? (0, _validation.transformFragmentExpandToNestedExpand)(_model.Fragment.from(layoutColumnContent)) : _model.Fragment.from(layoutColumnContent);
407
- if (!fragment) {
408
- return tr;
409
- }
410
- } else {
411
- fragment = _model.Fragment.from(layoutColumnContent);
390
+ //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
391
+ // Move a layout column to top level
392
+ // Move a layout column into a table cell, only moves the content into the cell
393
+ // Move a layout column into a panel, only moves the content into the panel
394
+ if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable || dragLayoutColumnIntoPanel)) {
395
+ // need update after we support single column layout.
396
+ var layoutColumnContent = sourceNode.content;
397
+ var fragment;
398
+ if (dragLayoutColumnIntoTable) {
399
+ var contentContainsExpand = (0, _utils2.findChildrenByType)(sourceNode, expand).length > 0;
400
+ fragment = contentContainsExpand ? (0, _validation.transformFragmentExpandToNestedExpand)(_model.Fragment.from(layoutColumnContent)) : _model.Fragment.from(layoutColumnContent);
401
+ if (!fragment) {
402
+ return tr;
412
403
  }
413
- (0, _removeFromSource.removeFromSource)(tr, $handlePos, $handlePos.pos + sourceNode.nodeSize);
414
- var _mappedTo = tr.mapping.map(to);
415
- tr.insert(_mappedTo, fragment).setSelection(_state.Selection.near(tr.doc.resolve(_mappedTo))).scrollIntoView();
416
- return tr;
417
- }
418
- if (!(0, _validation.canMoveNodeToIndex)(destParent, $to.index(), $handlePos.node().child($handlePos.index()), $to)) {
419
- return tr;
420
- }
421
- var convertedNodeSlice = transformSourceSlice(nodeCopy, destType);
422
- var convertedNode = convertedNodeSlice === null || convertedNodeSlice === void 0 ? void 0 : convertedNodeSlice.content;
423
- if (!convertedNode) {
424
- return tr;
425
- }
426
- tr.delete(sliceFrom, sliceTo); // delete the content from the original position
427
- mappedTo = tr.mapping.map(to);
428
- var isDestNestedLoneEmptyParagraph = destParent.type.name !== 'doc' && destParent.childCount === 1 && (0, _utils.isEmptyParagraph)($to.nodeAfter);
429
- if (convertedNodeSlice && isDestNestedLoneEmptyParagraph) {
430
- // if only a single empty paragraph within container, replace it
431
- tr.replace(mappedTo, mappedTo + 1, convertedNodeSlice);
432
404
  } else {
433
- // otherwise just insert the content at the new position
434
- tr.insert(mappedTo, convertedNode);
405
+ fragment = _model.Fragment.from(layoutColumnContent);
435
406
  }
407
+ (0, _removeFromSource.removeFromSource)(tr, $handlePos, $handlePos.pos + sourceNode.nodeSize);
408
+ var _mappedTo = tr.mapping.map(to);
409
+ tr.insert(_mappedTo, fragment).setSelection(_state.Selection.near(tr.doc.resolve(_mappedTo))).scrollIntoView();
410
+ return tr;
411
+ }
412
+ if (!(0, _validation.canMoveNodeToIndex)(destParent, $to.index(), $handlePos.node().child($handlePos.index()), $to)) {
413
+ return tr;
414
+ }
415
+ var convertedNodeSlice = transformSourceSlice(nodeCopy, destType);
416
+ var convertedNode = convertedNodeSlice === null || convertedNodeSlice === void 0 ? void 0 : convertedNodeSlice.content;
417
+ if (!convertedNode) {
418
+ return tr;
419
+ }
420
+ tr.delete(sliceFrom, sliceTo); // delete the content from the original position
421
+ var mappedTo = tr.mapping.map(to);
422
+ var isDestNestedLoneEmptyParagraph = destParent.type.name !== 'doc' && destParent.childCount === 1 && (0, _utils.isEmptyParagraph)($to.nodeAfter);
423
+ if (convertedNodeSlice && isDestNestedLoneEmptyParagraph) {
424
+ // if only a single empty paragraph within container, replace it
425
+ tr.replace(mappedTo, mappedTo + 1, convertedNodeSlice);
436
426
  } else {
437
- var _nodeCopy = tr.doc.content.cut(sliceFrom, sliceTo); // cut the content
438
- tr.delete(sliceFrom, sliceTo); // delete the content from the original position
439
- mappedTo = tr.mapping.map(to);
440
- tr.insert(mappedTo, _nodeCopy); // insert the content at the new position
427
+ // otherwise just insert the content at the new position
428
+ tr.insert(mappedTo, convertedNode);
441
429
  }
442
430
  var sliceSize = sliceTo - sliceFrom;
443
431
  tr = inputMethod === _analytics.INPUT_METHOD.DRAG_AND_DROP ? (0, _getSelection.setCursorPositionAtMovedNode)(tr, mappedTo) : isMultiSelect ? (_api$blockControls$co = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
@@ -450,7 +438,7 @@ var moveNode = exports.moveNode = function moveNode(api) {
450
438
  api === null || api === void 0 || api.core.actions.focus();
451
439
  var $mappedTo = tr.doc.resolve(mappedTo);
452
440
  var expandAncestor = (0, _utils2.findParentNodeOfTypeClosestToPos)($to, [expand, nestedExpand]);
453
- if (expandAncestor && (0, _experiments.editorExperiment)('nested-dnd', true) && (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_6')) {
441
+ if (expandAncestor && (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_6')) {
454
442
  var wasExpandExpanded = _expand.expandedState.get(expandAncestor.node);
455
443
  var updatedExpandAncestor = (0, _utils2.findParentNodeOfTypeClosestToPos)($mappedTo, [expand, nestedExpand]);
456
444
  if (wasExpandExpanded !== undefined && updatedExpandAncestor) {
@@ -5,80 +5,17 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.showDragHandleAtSelection = void 0;
7
7
  var _utils = require("@atlaskit/editor-prosemirror/utils");
8
- var _utils2 = require("@atlaskit/editor-tables/utils");
9
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
10
8
  var _decorationsAnchor = require("../pm-plugins/decorations-anchor");
11
9
  var _main = require("../pm-plugins/main");
12
10
  var _getNestedNodePosition = require("../pm-plugins/utils/getNestedNodePosition");
13
- var showDragHandleAtSelectionOld = function showDragHandleAtSelectionOld(api, shouldFocusParentNode) {
14
- return function (state, _, view) {
15
- var $from = state.selection.$from;
16
- var shouldFocusParentNode;
17
- if ($from.depth > 1 && (0, _experiments.editorExperiment)('nested-dnd', true)) {
18
- var _activeNode$handleOpt, _view$domAtPos;
19
- var _ref = _main.key.getState(state) || {},
20
- activeNode = _ref.activeNode;
21
-
22
- // if the node is already focused, pressing the keymap second times should focus the parent node
23
- shouldFocusParentNode = activeNode && ((_activeNode$handleOpt = activeNode.handleOptions) === null || _activeNode$handleOpt === void 0 ? void 0 : _activeNode$handleOpt.isFocused);
24
- var parentPos = (0, _utils2.isInTable)(state) ? $from.before(1) : shouldFocusParentNode ? $from.before(1) : (0, _getNestedNodePosition.getNestedNodePosition)(state) + 1;
25
- var parentElement = view === null || view === void 0 || (_view$domAtPos = view.domAtPos(parentPos, 0)) === null || _view$domAtPos === void 0 ? void 0 : _view$domAtPos.node;
26
- if (parentElement) {
27
- // Ignored via go/ees005
28
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
29
- var anchorName = parentElement.getAttribute('data-drag-handler-anchor-name');
30
- // Ignored via go/ees005
31
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
32
- var nodeType = parentElement.getAttribute('data-drag-handler-node-type');
33
- if (!anchorName || !nodeType) {
34
- // for nodes like panel and mediaSingle, the drag handle decoration is not applied to the dom node at the node position but to the parent node
35
- var closestParentElement = parentElement.closest('[data-drag-handler-anchor-name]');
36
- if (closestParentElement) {
37
- // Ignored via go/ees005
38
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
39
- anchorName = closestParentElement.getAttribute('data-drag-handler-anchor-name');
40
- // Ignored via go/ees005
41
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
42
- nodeType = closestParentElement.getAttribute('data-drag-handler-node-type');
43
- }
44
- }
45
- if (api && anchorName && nodeType) {
46
- api.core.actions.execute(api.blockControls.commands.showDragHandleAt(parentPos - 1, anchorName, nodeType, {
47
- isFocused: true
48
- }));
49
- return true;
50
- }
51
- }
52
- }
53
- var rootPos = $from.before(1);
54
- var dom = view === null || view === void 0 ? void 0 : view.domAtPos(rootPos, 0);
55
- var nodeElement = dom === null || dom === void 0 ? void 0 : dom.node.childNodes[dom === null || dom === void 0 ? void 0 : dom.offset];
56
- var rootNode = nodeElement && !nodeElement.hasAttribute('data-drag-handler-anchor-name') ? nodeElement.querySelector('[data-drag-handler-anchor-name]') : nodeElement;
57
- if (rootNode) {
58
- // Ignored via go/ees005
59
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
60
- var _anchorName = rootNode.getAttribute('data-drag-handler-anchor-name');
61
- // Ignored via go/ees005
62
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
63
- var _nodeType = rootNode.getAttribute('data-drag-handler-node-type');
64
- if (api && _anchorName && _nodeType) {
65
- api.core.actions.execute(api.blockControls.commands.showDragHandleAt(rootPos, _anchorName, _nodeType, {
66
- isFocused: true
67
- }));
68
- return true;
69
- }
70
- }
71
- return false;
72
- };
73
- };
74
11
  var findParentPosForHandle = function findParentPosForHandle(state) {
75
- var _activeNode$handleOpt2;
12
+ var _activeNode$handleOpt;
76
13
  var $from = state.selection.$from;
77
- var _ref2 = _main.key.getState(state) || {},
78
- activeNode = _ref2.activeNode;
14
+ var _ref = _main.key.getState(state) || {},
15
+ activeNode = _ref.activeNode;
79
16
 
80
17
  // if a node handle is already focused, return the parent pos of that node (with focused handle)
81
- if (activeNode && (_activeNode$handleOpt2 = activeNode.handleOptions) !== null && _activeNode$handleOpt2 !== void 0 && _activeNode$handleOpt2.isFocused) {
18
+ if (activeNode && (_activeNode$handleOpt = activeNode.handleOptions) !== null && _activeNode$handleOpt !== void 0 && _activeNode$handleOpt.isFocused) {
82
19
  var $activeNodePos = state.doc.resolve(activeNode.pos);
83
20
 
84
21
  // if the handle is at the top level already, do nothing
@@ -137,7 +74,7 @@ var findNextAnchorDecoration = function findNextAnchorDecoration(state) {
137
74
  // return the closest decoration to the node
138
75
  return nodeDecorations[0];
139
76
  };
140
- var showDragHandleAtSelectionNew = function showDragHandleAtSelectionNew(api) {
77
+ var showDragHandleAtSelection = exports.showDragHandleAtSelection = function showDragHandleAtSelection(api) {
141
78
  return function (state) {
142
79
  var decoration = findNextAnchorDecoration(state);
143
80
  if (api && decoration) {
@@ -148,9 +85,4 @@ var showDragHandleAtSelectionNew = function showDragHandleAtSelectionNew(api) {
148
85
  }
149
86
  return false;
150
87
  };
151
- };
152
- var showDragHandleAtSelection = exports.showDragHandleAtSelection = function showDragHandleAtSelection(api) {
153
- return function (state, dispatch, view) {
154
- return (0, _experiments.editorExperiment)('nested-dnd', true) ? showDragHandleAtSelectionNew(api)(state) : showDragHandleAtSelectionOld(api)(state, dispatch, view);
155
- };
156
88
  };
@@ -88,15 +88,14 @@ var nodeDecorations = exports.nodeDecorations = function nodeDecorations(newStat
88
88
  var shouldDescend = shouldDescendIntoNode(node);
89
89
  var anchorName = (0, _decorationsCommon.getNodeAnchor)(node);
90
90
  var nodeTypeWithLevel = (0, _decorationsCommon.getNodeTypeWithLevel)(node);
91
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
92
- // Doesn't descend into a node
93
- if (node.isInline) {
94
- return false;
95
- }
96
- depth = newState.doc.resolve(pos).depth;
97
- if (shouldIgnoreNode(node, ignore_nodes, depth, parent)) {
98
- return shouldDescend; //skip over, don't consider it a valid depth
99
- }
91
+
92
+ // Doesn't descend into a node
93
+ if (node.isInline) {
94
+ return false;
95
+ }
96
+ depth = newState.doc.resolve(pos).depth;
97
+ if (shouldIgnoreNode(node, ignore_nodes, depth, parent)) {
98
+ return shouldDescend; //skip over, don't consider it a valid depth
100
99
  }
101
100
  var anchorStyles = pos === 0 && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? // why margin-top:0? well it's not possible using CSS to select the first node in the document while excluding n number of nodes, in this case
102
101
  // we're rendering quick insert button and drag handle. For now override margin-top to 0
@@ -109,7 +108,7 @@ var nodeDecorations = exports.nodeDecorations = function nodeDecorations(newStat
109
108
  nodeType: node.type.name,
110
109
  nodeTypeWithLevel: nodeTypeWithLevel
111
110
  }));
112
- return shouldDescend && depth < (0, _decorationsCommon.getNestedDepth)();
111
+ return shouldDescend && depth < _decorationsCommon.NESTED_DEPTH;
113
112
  });
114
113
  return decs;
115
114
  };
@@ -4,19 +4,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.unmountDecorations = exports.getNodeTypeWithLevel = exports.getNodeAnchor = exports.getNestedDepth = exports.TYPE_NODE_DEC = exports.TYPE_HANDLE_DEC = exports.TYPE_DROP_TARGET_DEC = void 0;
7
+ exports.unmountDecorations = exports.getNodeTypeWithLevel = exports.getNodeAnchor = exports.TYPE_NODE_DEC = exports.TYPE_HANDLE_DEC = exports.TYPE_DROP_TARGET_DEC = exports.NESTED_DEPTH = void 0;
8
8
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
9
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
11
  var _reactDom = _interopRequireDefault(require("react-dom"));
12
12
  var _uuid = _interopRequireDefault(require("uuid"));
13
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
14
13
  var TYPE_DROP_TARGET_DEC = exports.TYPE_DROP_TARGET_DEC = 'drop-target-decoration';
15
14
  var TYPE_HANDLE_DEC = exports.TYPE_HANDLE_DEC = 'drag-handle';
16
15
  var TYPE_NODE_DEC = exports.TYPE_NODE_DEC = 'node-decoration';
17
- var getNestedDepth = exports.getNestedDepth = function getNestedDepth() {
18
- return (0, _experiments.editorExperiment)('nested-dnd', true) ? 100 : 0;
19
- };
16
+ var NESTED_DEPTH = exports.NESTED_DEPTH = 100;
20
17
  var getNodeAnchor = exports.getNodeAnchor = function getNodeAnchor(node) {
21
18
  var handleId = ObjHash.getForNode(node);
22
19
  return "--node-anchor-".concat(node.type.name, "-").concat(handleId);
@@ -48,25 +48,23 @@ var dragHandleDecoration = exports.dragHandleDecoration = function dragHandleDec
48
48
  return undefined;
49
49
  }
50
50
  };
51
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
52
- var newPos = getPos();
53
- if (typeof newPos === 'number') {
54
- var $pos = view.state.doc.resolve(newPos);
55
- isTopLevelNode = ($pos === null || $pos === void 0 ? void 0 : $pos.parent.type.name) === 'doc';
56
- }
57
- /*
58
- * We disable mouseover event to fix flickering issue on hover
59
- * However, the tooltip for nested drag handle is no long working.
60
- */
61
- if (newPos === undefined || !isTopLevelNode) {
62
- // This will also hide the tooltip.
63
- unbind = (0, _bindEventListener.bind)(element, {
64
- type: 'mouseover',
65
- listener: function listener(e) {
66
- e.stopPropagation();
67
- }
68
- });
69
- }
51
+ var newPos = getPos();
52
+ if (typeof newPos === 'number') {
53
+ var $pos = view.state.doc.resolve(newPos);
54
+ isTopLevelNode = ($pos === null || $pos === void 0 ? void 0 : $pos.parent.type.name) === 'doc';
55
+ }
56
+ /*
57
+ * We disable mouseover event to fix flickering issue on hover
58
+ * However, the tooltip for nested drag handle is no long working.
59
+ */
60
+ if (newPos === undefined || !isTopLevelNode) {
61
+ // This will also hide the tooltip.
62
+ unbind = (0, _bindEventListener.bind)(element, {
63
+ type: 'mouseover',
64
+ listener: function listener(e) {
65
+ e.stopPropagation();
66
+ }
67
+ });
70
68
  }
71
69
 
72
70
  // There are times when global clear: "both" styles are applied to this decoration causing jumpiness
@@ -124,9 +122,7 @@ var dragHandleDecoration = exports.dragHandleDecoration = function dragHandleDec
124
122
  type: _decorationsCommon.TYPE_HANDLE_DEC,
125
123
  testid: "".concat(_decorationsCommon.TYPE_HANDLE_DEC, "-").concat((0, _uuid.default)()),
126
124
  destroy: function destroy() {
127
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
128
- unbind && unbind();
129
- }
125
+ return unbind && unbind();
130
126
  }
131
127
  });
132
128
  };
@@ -180,62 +180,60 @@ var dropTargetDecorations = exports.dropTargetDecorations = function dropTargetD
180
180
  var endPos;
181
181
  var $pos = newState.doc.resolve(pos);
182
182
  var isSameLayout = $activeNodePos && (0, _validation.isInSameLayout)($activeNodePos, $pos);
183
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
184
- depth = $pos.depth;
185
- if (isAdvancedLayoutsPreRelease2) {
186
- if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.pos) === pos && activeNode.nodeType !== 'layoutColumn') {
187
- return false;
188
- }
189
- if (node.type.name === 'layoutColumn' && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'layoutSection' && index !== 0 && (
190
- // Not the first node
191
- (parent === null || parent === void 0 ? void 0 : parent.childCount) < (0, _consts2.maxLayoutColumnSupported)() || isSameLayout)) {
192
- // Add drop target for layout columns
193
- decs.push(createLayoutDropTargetDecoration(pos, {
194
- api: api,
195
- parent: parent,
196
- formatMessage: formatMessage
197
- }, nodeViewPortalProviderAPI, anchorRectCache));
198
- }
199
- }
200
- if (node.isInline || !parent || DISABLE_CHILD_DROP_TARGET.includes(parent.type.name)) {
201
- pushNodeStack(node, depth);
183
+ depth = $pos.depth;
184
+ if (isAdvancedLayoutsPreRelease2) {
185
+ if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.pos) === pos && activeNode.nodeType !== 'layoutColumn') {
202
186
  return false;
203
187
  }
204
- if (IGNORE_NODES.includes(node.type.name)) {
205
- pushNodeStack(node, depth);
206
- return shouldDescend(node); //skip over, don't consider it a valid depth
188
+ if (node.type.name === 'layoutColumn' && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'layoutSection' && index !== 0 && (
189
+ // Not the first node
190
+ (parent === null || parent === void 0 ? void 0 : parent.childCount) < (0, _consts2.maxLayoutColumnSupported)() || isSameLayout)) {
191
+ // Add drop target for layout columns
192
+ decs.push(createLayoutDropTargetDecoration(pos, {
193
+ api: api,
194
+ parent: parent,
195
+ formatMessage: formatMessage
196
+ }, nodeViewPortalProviderAPI, anchorRectCache));
207
197
  }
198
+ }
199
+ if (node.isInline || !parent || DISABLE_CHILD_DROP_TARGET.includes(parent.type.name)) {
200
+ pushNodeStack(node, depth);
201
+ return false;
202
+ }
203
+ if (IGNORE_NODES.includes(node.type.name)) {
204
+ pushNodeStack(node, depth);
205
+ return shouldDescend(node); //skip over, don't consider it a valid depth
206
+ }
208
207
 
209
- // When multi select is on, validate all the nodes in the selection instead of just the handle node
210
- if (isMultiSelect) {
211
- var selectionSlice = newState.doc.slice(selectionFrom, selectionTo, false);
212
- var selectionSliceChildCount = selectionSlice.content.childCount;
213
- var canDropSingleNode = true;
214
- var canDropMultipleNodes = true;
208
+ // When multi select is on, validate all the nodes in the selection instead of just the handle node
209
+ if (isMultiSelect) {
210
+ var selectionSlice = newState.doc.slice(selectionFrom, selectionTo, false);
211
+ var selectionSliceChildCount = selectionSlice.content.childCount;
212
+ var canDropSingleNode = true;
213
+ var canDropMultipleNodes = true;
215
214
 
216
- // when there is only one node in the slice, use the same logic as when multi select is not on
217
- if (selectionSliceChildCount > 1 && handleInsideSelection) {
218
- canDropMultipleNodes = (0, _validation.canMoveSliceToIndex)(selectionSlice, selectionFrom, selectionTo, parent, index, $pos);
219
- } else {
220
- canDropSingleNode = !!(activePMNode && (0, _validation.canMoveNodeToIndex)(parent, index, activePMNode, $pos, node));
221
- }
222
- if (!canDropMultipleNodes || !canDropSingleNode) {
223
- pushNodeStack(node, depth);
224
- return false; //not valid pos, so nested not valid either
225
- }
215
+ // when there is only one node in the slice, use the same logic as when multi select is not on
216
+ if (selectionSliceChildCount > 1 && handleInsideSelection) {
217
+ canDropMultipleNodes = (0, _validation.canMoveSliceToIndex)(selectionSlice, selectionFrom, selectionTo, parent, index, $pos);
226
218
  } else {
227
- var canDrop = activePMNode && (0, _validation.canMoveNodeToIndex)(parent, index, activePMNode, $pos, node);
228
-
229
- //NOTE: This will block drop targets showing for nodes that are valid after transformation (i.e. expand -> nestedExpand)
230
- if (!canDrop) {
231
- pushNodeStack(node, depth);
232
- return false; //not valid pos, so nested not valid either
233
- }
219
+ canDropSingleNode = !!(activePMNode && (0, _validation.canMoveNodeToIndex)(parent, index, activePMNode, $pos, node));
220
+ }
221
+ if (!canDropMultipleNodes || !canDropSingleNode) {
222
+ pushNodeStack(node, depth);
223
+ return false; //not valid pos, so nested not valid either
234
224
  }
235
- if (parent.lastChild === node && !(0, _utils.isEmptyParagraph)(node) && PARENT_WITH_END_DROP_TARGET.includes(parent.type.name)) {
236
- endPos = pos + node.nodeSize;
225
+ } else {
226
+ var canDrop = activePMNode && (0, _validation.canMoveNodeToIndex)(parent, index, activePMNode, $pos, node);
227
+
228
+ //NOTE: This will block drop targets showing for nodes that are valid after transformation (i.e. expand -> nestedExpand)
229
+ if (!canDrop) {
230
+ pushNodeStack(node, depth);
231
+ return false; //not valid pos, so nested not valid either
237
232
  }
238
233
  }
234
+ if (parent.lastChild === node && !(0, _utils.isEmptyParagraph)(node) && PARENT_WITH_END_DROP_TARGET.includes(parent.type.name)) {
235
+ endPos = pos + node.nodeSize;
236
+ }
239
237
  var previousNode = popNodeStack(depth); // created scoped variable
240
238
 
241
239
  // only table and layout need to render full height drop target
@@ -259,7 +257,7 @@ var dropTargetDecorations = exports.dropTargetDecorations = function dropTargetD
259
257
  }, nodeViewPortalProviderAPI, -1, anchorRectCache));
260
258
  }
261
259
  pushNodeStack(node, depth);
262
- return depth < (0, _decorationsCommon.getNestedDepth)() && shouldDescend(node);
260
+ return depth < _decorationsCommon.NESTED_DEPTH && shouldDescend(node);
263
261
  });
264
262
  if (docTo === POS_END_OF_DOC) {
265
263
  decs.push(createDropTargetDecoration(POS_END_OF_DOC, {
@@ -34,7 +34,7 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
34
34
  if (rootElement) {
35
35
  var _rootElement$parentEl;
36
36
  // We want to exlude handles from showing for empty paragraph and heading nodes
37
- if ((0, _experiments.editorExperiment)('nested-dnd', true) && isEmptyNestedParagraphOrHeading(rootElement)) {
37
+ if (isEmptyNestedParagraphOrHeading(rootElement)) {
38
38
  return false;
39
39
  }
40
40
  if (rootElement.getAttribute('data-drag-handler-node-type') === 'media' && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
@@ -47,12 +47,12 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
47
47
  var parentElementType = parentElement === null || parentElement === void 0 ? void 0 : parentElement.getAttribute('data-drag-handler-node-type');
48
48
  if ((0, _experiments.editorExperiment)('advanced_layouts', true)) {
49
49
  // We want to exclude handles from showing for direct descendant of table nodes (i.e. nodes in cells)
50
- if (parentElement && (parentElementType === 'table' || parentElementType === 'tableRow') && (0, _experiments.editorExperiment)('nested-dnd', true)) {
50
+ if (parentElement && (parentElementType === 'table' || parentElementType === 'tableRow')) {
51
51
  rootElement = parentElement;
52
52
  }
53
53
  } else {
54
54
  // We want to exclude handles from showing for direct descendant of table nodes (i.e. nodes in cells)
55
- if (parentElement && parentElementType === 'table' && (0, _experiments.editorExperiment)('nested-dnd', true)) {
55
+ if (parentElement && parentElementType === 'table') {
56
56
  rootElement = parentElement;
57
57
  }
58
58
  }
@@ -73,7 +73,7 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
73
73
  }
74
74
  var parentRootElement = rootElement.parentElement;
75
75
  var pos;
76
- if (parentRootElement && (0, _experiments.editorExperiment)('nested-dnd', true)) {
76
+ if (parentRootElement) {
77
77
  var _parentRootElement$ch;
78
78
  var childNodes = Array.from(parentRootElement.childNodes);
79
79
  var index = childNodes.indexOf(rootElement);
@@ -91,12 +91,7 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
91
91
  // Don't show drag handle for layout column in a single column layout
92
92
  return false;
93
93
  }
94
- var targetPos;
95
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
96
- targetPos = view.state.doc.resolve(pos).pos;
97
- } else {
98
- targetPos = view.state.doc.resolve(pos).start(1) - 1;
99
- }
94
+ var targetPos = view.state.doc.resolve(pos).pos;
100
95
  var rootAnchorName;
101
96
  var rootNodeType;
102
97
  var rootPos;
@@ -7,7 +7,6 @@ exports.boundKeydownHandler = void 0;
7
7
  var _keymaps = require("@atlaskit/editor-common/keymaps");
8
8
  var _keymap = require("@atlaskit/editor-prosemirror/keymap");
9
9
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
10
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
11
10
  var _moveNode = require("../editor-commands/move-node");
12
11
  var _showDragHandle = require("../editor-commands/show-drag-handle");
13
12
  var _consts = require("./utils/consts");
@@ -17,8 +16,8 @@ function keymapList(api, formatMessage) {
17
16
  (0, _keymaps.bindKeymapWithCommand)(
18
17
  // Ignored via go/ees005
19
18
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
20
- _keymaps.showElementDragHandle.common, function (state, dispatch, view) {
21
- (0, _showDragHandle.showDragHandleAtSelection)(api)(state, dispatch, view);
19
+ _keymaps.showElementDragHandle.common, function (state) {
20
+ (0, _showDragHandle.showDragHandleAtSelection)(api)(state);
22
21
  //we always want to handle this shortcut to prevent default browser special char insert when option + alphabetical key is used
23
22
  return true;
24
23
  }, keymapList);
@@ -30,16 +29,14 @@ function keymapList(api, formatMessage) {
30
29
  // Ignored via go/ees005
31
30
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
32
31
  _keymaps.dragToMoveDown.common, (0, _moveNode.moveNodeViaShortcut)(api, _consts.DIRECTION.DOWN, formatMessage), keymapList);
33
- if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
34
- (0, _keymaps.bindKeymapWithCommand)(
35
- // Ignored via go/ees005
36
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
37
- _keymaps.dragToMoveLeft.common, (0, _moveNode.moveNodeViaShortcut)(api, _consts.DIRECTION.LEFT, formatMessage), keymapList);
38
- (0, _keymaps.bindKeymapWithCommand)(
39
- // Ignored via go/ees005
40
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
41
- _keymaps.dragToMoveRight.common, (0, _moveNode.moveNodeViaShortcut)(api, _consts.DIRECTION.RIGHT, formatMessage), keymapList);
42
- }
32
+ (0, _keymaps.bindKeymapWithCommand)(
33
+ // Ignored via go/ees005
34
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
35
+ _keymaps.dragToMoveLeft.common, (0, _moveNode.moveNodeViaShortcut)(api, _consts.DIRECTION.LEFT, formatMessage), keymapList);
36
+ (0, _keymaps.bindKeymapWithCommand)(
37
+ // Ignored via go/ees005
38
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
39
+ _keymaps.dragToMoveRight.common, (0, _moveNode.moveNodeViaShortcut)(api, _consts.DIRECTION.RIGHT, formatMessage), keymapList);
43
40
  }
44
41
  return keymapList;
45
42
  }