@atlaskit/editor-plugin-block-controls 4.1.10 → 4.1.11

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 (28) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/blockControlsPlugin.js +16 -4
  3. package/dist/cjs/pm-plugins/handle-mouse-down.js +3 -1
  4. package/dist/cjs/pm-plugins/handle-mouse-over.js +2 -1
  5. package/dist/cjs/pm-plugins/main.js +3 -2
  6. package/dist/cjs/pm-plugins/utils/drag-handle-positions.js +3 -2
  7. package/dist/cjs/ui/consts.js +4 -4
  8. package/dist/cjs/ui/drag-handle.js +6 -6
  9. package/dist/cjs/ui/global-styles.js +2 -2
  10. package/dist/es2019/blockControlsPlugin.js +16 -4
  11. package/dist/es2019/pm-plugins/handle-mouse-down.js +3 -1
  12. package/dist/es2019/pm-plugins/handle-mouse-over.js +2 -1
  13. package/dist/es2019/pm-plugins/main.js +3 -2
  14. package/dist/es2019/pm-plugins/utils/drag-handle-positions.js +2 -1
  15. package/dist/es2019/ui/consts.js +1 -1
  16. package/dist/es2019/ui/drag-handle.js +2 -2
  17. package/dist/es2019/ui/global-styles.js +2 -2
  18. package/dist/esm/blockControlsPlugin.js +16 -4
  19. package/dist/esm/pm-plugins/handle-mouse-down.js +3 -1
  20. package/dist/esm/pm-plugins/handle-mouse-over.js +2 -1
  21. package/dist/esm/pm-plugins/main.js +3 -2
  22. package/dist/esm/pm-plugins/utils/drag-handle-positions.js +2 -1
  23. package/dist/esm/ui/consts.js +1 -1
  24. package/dist/esm/ui/drag-handle.js +2 -2
  25. package/dist/esm/ui/global-styles.js +2 -2
  26. package/dist/types/ui/consts.d.ts +0 -1
  27. package/dist/types-ts4.5/ui/consts.d.ts +0 -1
  28. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 4.1.11
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
3
9
  ## 4.1.10
4
10
 
5
11
  ### Patch Changes
package/dist/cjs/blockControlsPlugin.js CHANGED
@@ -65,14 +65,14 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
65
65
  rootAnchorName: rootAnchorName,
66
66
  rootNodeType: rootNodeType
67
67
  },
68
- closeMenu: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? true : undefined
68
+ closeMenu: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && !(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? true : undefined
69
69
  }));
70
70
  return tr;
71
71
  };
72
72
  },
73
73
  toggleBlockMenu: function toggleBlockMenu(options) {
74
74
  return function (_ref4) {
75
- var _options$anchorName;
75
+ var _options$anchorName, _api$blockControls;
76
76
  var tr = _ref4.tr;
77
77
  var currMeta = tr.getMeta(_main.key);
78
78
  if (options !== null && options !== void 0 && options.closeMenu) {
@@ -94,12 +94,24 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
94
94
  anchorName: options === null || options === void 0 ? void 0 : options.anchorName
95
95
  }
96
96
  }));
97
+ var menuTriggerBy = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.sharedState.currentState()) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.menuTriggerBy;
98
+ if (menuTriggerBy === undefined || !!menuTriggerBy && menuTriggerBy === (options === null || options === void 0 ? void 0 : options.anchorName)) {
99
+ var _api$userIntent;
100
+ // Toggled from drag handle
101
+ var currentUserIntent = 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;
102
+ if (currentUserIntent === 'blockMenuOpen') {
103
+ var _api$userIntent2;
104
+ api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent('default')({
105
+ tr: tr
106
+ });
107
+ }
108
+ }
97
109
  return tr;
98
110
  };
99
111
  },
100
112
  setNodeDragged: function setNodeDragged(getPos, anchorName, nodeType) {
101
113
  return function (_ref5) {
102
- var _api$userIntent;
114
+ var _api$userIntent3;
103
115
  var tr = _ref5.tr;
104
116
  var pos = getPos();
105
117
  if (pos === undefined) {
@@ -123,7 +135,7 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
123
135
  tr: tr
124
136
  });
125
137
  }
126
- api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || _api$userIntent.commands.setCurrentUserIntent('dragging')({
138
+ api === null || api === void 0 || (_api$userIntent3 = api.userIntent) === null || _api$userIntent3 === void 0 || _api$userIntent3.commands.setCurrentUserIntent('dragging')({
127
139
  tr: tr
128
140
  });
129
141
  return tr;
package/dist/cjs/pm-plugins/handle-mouse-down.js CHANGED
@@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.handleMouseDown = void 0;
7
+ var _styles = require("@atlaskit/editor-common/styles");
8
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
7
9
  var handleMouseDown = exports.handleMouseDown = function handleMouseDown(api) {
8
10
  return function (view, event) {
9
11
  if (!(event.target instanceof HTMLElement)) {
@@ -20,7 +22,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(api) {
20
22
  }
21
23
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.showDragHandleAt(rootPos, '', (_rootNode$type$name = rootNode.type.name) !== null && _rootNode$type$name !== void 0 ? _rootNode$type$name : '', undefined, rootPos, '', (_rootNode$type$name2 = rootNode.type.name) !== null && _rootNode$type$name2 !== void 0 ? _rootNode$type$name2 : ''));
22
24
  } else {
23
- var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle]') !== null;
25
+ var isDragHandle = event.target.closest((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? _styles.DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle]') !== null;
24
26
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
25
27
  }
26
28
  return false;
package/dist/cjs/pm-plugins/handle-mouse-over.js CHANGED
@@ -131,7 +131,8 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
131
131
  api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(api === null || api === void 0 || (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 ? void 0 : _api$blockControls3.commands.showDragHandleAt(targetPos, anchorName, nodeType));
132
132
  }
133
133
  if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)) {
134
- if (isMenuOpen && originalAnchorName) {
134
+ var _api$userIntent;
135
+ if (isMenuOpen && originalAnchorName && (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') {
135
136
  var _api$core3, _api$blockControls4;
136
137
  api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.toggleBlockMenu());
137
138
  }
package/dist/cjs/pm-plugins/main.js CHANGED
@@ -11,6 +11,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
11
11
  var _browser = require("@atlaskit/editor-common/browser");
12
12
  var _performanceMeasures = require("@atlaskit/editor-common/performance-measures");
13
13
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
14
+ var _styles = require("@atlaskit/editor-common/styles");
14
15
  var _ui = require("@atlaskit/editor-common/ui");
15
16
  var _utils = require("@atlaskit/editor-common/utils");
16
17
  var _state = require("@atlaskit/editor-prosemirror/state");
@@ -743,7 +744,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
743
744
  }
744
745
  }
745
746
  if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
746
- var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
747
+ var isDragHandle = event.target.closest((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? _styles.DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle="true"]') !== null;
747
748
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
748
749
  }
749
750
  if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
@@ -780,7 +781,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
780
781
  }
781
782
  }
782
783
  if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
783
- var _isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
784
+ var _isDragHandle = event.target.closest((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? _styles.DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle="true"]') !== null;
784
785
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(_isDragHandle));
785
786
  }
786
787
  if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
package/dist/cjs/pm-plugins/utils/drag-handle-positions.js CHANGED
@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.shouldMaskNodeControls = exports.shouldBeSticky = exports.getTopPosition = exports.getNodeHeight = exports.getLeftPosition = exports.getControlHeightCSSValue = exports.getControlBottomCSSValue = void 0;
7
+ var _styles = require("@atlaskit/editor-common/styles");
7
8
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
8
9
  var _consts = require("../../ui/consts");
9
10
  var STICKY_NODES = ['panel', 'table', 'expand', 'layoutSection', 'bodiedExtension'];
@@ -42,14 +43,14 @@ var getLeftPosition = exports.getLeftPosition = function getLeftPosition(dom, ty
42
43
  return 'auto';
43
44
  }
44
45
  if (!innerContainer) {
45
- return type === 'layoutColumn' ? "".concat(dom.offsetLeft + dom.clientWidth / 2 - _consts.DRAG_HANDLE_HEIGHT / 2, "px") : "".concat(dom.offsetLeft - (0, _consts.dragHandleGap)(type, parentType) - _consts.DRAG_HANDLE_WIDTH, "px");
46
+ return type === 'layoutColumn' ? "".concat(dom.offsetLeft + dom.clientWidth / 2 - _consts.DRAG_HANDLE_HEIGHT / 2, "px") : "".concat(dom.offsetLeft - (0, _consts.dragHandleGap)(type, parentType) - _styles.DRAG_HANDLE_WIDTH, "px");
46
47
  }
47
48
 
48
49
  // There is a showMacroInteractionDesignUpdates prop in extension node wrapper that can add a relative span under the top level div
49
50
  // We need to adjust the left offset position of the drag handle to account for the relative span
50
51
  var relativeSpan = macroInteractionUpdates ? dom.querySelector('span.relative') : null;
51
52
  var leftAdjustment = relativeSpan ? relativeSpan.offsetLeft : 0;
52
- return getComputedStyle(innerContainer).transform === 'none' ? "".concat(innerContainer.offsetLeft + leftAdjustment - (0, _consts.dragHandleGap)(type, parentType) - _consts.DRAG_HANDLE_WIDTH, "px") : "".concat(innerContainer.offsetLeft + leftAdjustment - innerContainer.offsetWidth / 2 - (0, _consts.dragHandleGap)(type, parentType) - _consts.DRAG_HANDLE_WIDTH, "px");
53
+ return getComputedStyle(innerContainer).transform === 'none' ? "".concat(innerContainer.offsetLeft + leftAdjustment - (0, _consts.dragHandleGap)(type, parentType) - _styles.DRAG_HANDLE_WIDTH, "px") : "".concat(innerContainer.offsetLeft + leftAdjustment - innerContainer.offsetWidth / 2 - (0, _consts.dragHandleGap)(type, parentType) - _styles.DRAG_HANDLE_WIDTH, "px");
53
54
  };
54
55
 
55
56
  // anchorRectCache seems to have a 100% cache miss rate
package/dist/cjs/ui/consts.js CHANGED
@@ -4,19 +4,19 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.topPositionAdjustment = exports.spacingBetweenNodesForPreview = exports.spaceLookupMap = exports.rootElementGap = exports.nodeMargins = exports.getNestedNodeLeftPaddingMargin = exports.dropTargetMarginMap = exports.dragHandleGap = exports.STICKY_CONTROLS_TOP_MARGIN = exports.QUICK_INSERT_WIDTH = exports.QUICK_INSERT_LEFT_OFFSET = exports.QUICK_INSERT_HEIGHT = exports.QUICK_INSERT_DIMENSIONS = exports.DRAG_HANDLE_ZINDEX = exports.DRAG_HANDLE_WIDTH = exports.DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT = exports.DRAG_HANDLE_NARROW_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH = exports.DRAG_HANDLE_MAX_GAP = exports.DRAG_HANDLE_LAYOUT_SECTION_TOP_ADJUSTMENT = exports.DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_H6_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H5_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H4_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H3_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H2_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H1_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DEFAULT_GAP = exports.DRAG_HANDLE_BORDER_RADIUS = exports.DEFAULT_COLUMN_DISTRIBUTIONS = exports.BLOCK_MENU_WIDTH = exports.BLOCK_MENU_ENABLED = void 0;
7
+ exports.topPositionAdjustment = exports.spacingBetweenNodesForPreview = exports.spaceLookupMap = exports.rootElementGap = exports.nodeMargins = exports.getNestedNodeLeftPaddingMargin = exports.dropTargetMarginMap = exports.dragHandleGap = exports.STICKY_CONTROLS_TOP_MARGIN = exports.QUICK_INSERT_WIDTH = exports.QUICK_INSERT_LEFT_OFFSET = exports.QUICK_INSERT_HEIGHT = exports.QUICK_INSERT_DIMENSIONS = exports.DRAG_HANDLE_ZINDEX = exports.DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT = exports.DRAG_HANDLE_NARROW_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH = exports.DRAG_HANDLE_MAX_GAP = exports.DRAG_HANDLE_LAYOUT_SECTION_TOP_ADJUSTMENT = exports.DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_H6_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H5_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H4_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H3_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H2_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H1_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DEFAULT_GAP = exports.DRAG_HANDLE_BORDER_RADIUS = exports.DEFAULT_COLUMN_DISTRIBUTIONS = exports.BLOCK_MENU_WIDTH = exports.BLOCK_MENU_ENABLED = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
+ var _styles = require("@atlaskit/editor-common/styles");
9
10
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
10
11
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
11
12
  var _dropTargetMarginMap;
12
13
  var DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_HEIGHT = 24;
13
- var DRAG_HANDLE_WIDTH = exports.DRAG_HANDLE_WIDTH = 12;
14
14
  var DRAG_HANDLE_BORDER_RADIUS = exports.DRAG_HANDLE_BORDER_RADIUS = 4;
15
15
  var DRAG_HANDLE_ZINDEX = exports.DRAG_HANDLE_ZINDEX = _editorSharedStyles.akRichMediaResizeZIndex + _editorSharedStyles.akEditorUnitZIndex; //place above legacy resizer
16
16
  var DRAG_HANDLE_DEFAULT_GAP = exports.DRAG_HANDLE_DEFAULT_GAP = 8;
17
17
  var DRAG_HANDLE_NARROW_GAP = exports.DRAG_HANDLE_NARROW_GAP = 4;
18
18
  var DRAG_HANDLE_MAX_GAP = exports.DRAG_HANDLE_MAX_GAP = 12;
19
- var DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = DRAG_HANDLE_WIDTH + DRAG_HANDLE_MAX_GAP;
19
+ var DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = _styles.DRAG_HANDLE_WIDTH + DRAG_HANDLE_MAX_GAP;
20
20
  var DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = 4 + 2; // 4px for the divider vertical padding and 2px for the divider height
21
21
  var DRAG_HANDLE_H1_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H1_TOP_ADJUSTMENT = 5;
22
22
  var DRAG_HANDLE_H2_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H2_TOP_ADJUSTMENT = 2;
@@ -94,7 +94,7 @@ var getNestedNodeLeftPaddingMargin = exports.getNestedNodeLeftPaddingMargin = fu
94
94
  case 'tableHeader':
95
95
  return '8px';
96
96
  default:
97
- return "".concat(DRAG_HANDLE_WIDTH + DRAG_HANDLE_NARROW_GAP, "px");
97
+ return "".concat(_styles.DRAG_HANDLE_WIDTH + DRAG_HANDLE_NARROW_GAP, "px");
98
98
  }
99
99
  };
100
100
  var topPositionAdjustment = exports.topPositionAdjustment = function topPositionAdjustment(nodeType) {
package/dist/cjs/ui/drag-handle.js CHANGED
@@ -108,7 +108,7 @@ var dragHandleButtonStyles = (0, _react2.css)({
108
108
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
109
109
  height: _consts2.DRAG_HANDLE_HEIGHT,
110
110
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
111
- width: _consts2.DRAG_HANDLE_WIDTH,
111
+ width: _styles.DRAG_HANDLE_WIDTH,
112
112
  border: 'none',
113
113
  background: 'transparent',
114
114
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -154,7 +154,7 @@ var dragHandleButtonStylesOld = (0, _react2.css)({
154
154
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
155
155
  height: _consts2.DRAG_HANDLE_HEIGHT,
156
156
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
157
- width: _consts2.DRAG_HANDLE_WIDTH,
157
+ width: _styles.DRAG_HANDLE_WIDTH,
158
158
  border: 'none',
159
159
  background: 'transparent',
160
160
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -675,8 +675,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
675
675
  if (supportsAnchor) {
676
676
  var bottom = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlBottomCSSValue)(safeAnchorName, isSticky, isTopLevelNode, isLayoutColumn) : {};
677
677
  return _objectSpread({
678
- left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
679
- top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
678
+ left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
679
+ top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
680
680
  }, bottom);
681
681
  }
682
682
  var height = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlHeightCSSValue)((0, _dragHandlePositions.getNodeHeight)(dom, safeAnchorName, anchorRectCache) || 0, isSticky, isTopLevelNode, "".concat(_consts2.DRAG_HANDLE_HEIGHT), isLayoutColumn) : {};
@@ -721,8 +721,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
721
721
  if (supportsAnchor) {
722
722
  var bottom = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlBottomCSSValue)(safeAnchorName, isSticky, isTopLevelNode, isLayoutColumn) : {};
723
723
  return _objectSpread({
724
- left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
725
- top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
724
+ left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
725
+ top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
726
726
  }, bottom);
727
727
  }
728
728
  var height = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlHeightCSSValue)((0, _dragHandlePositions.getNodeHeight)(dom, safeAnchorName, anchorRectCache) || 0, isSticky, isTopLevelNode, "".concat(_consts2.DRAG_HANDLE_HEIGHT), isLayoutColumn) : {};
package/dist/cjs/ui/global-styles.js CHANGED
@@ -74,13 +74,13 @@ var extendedHoverZone = function extendedHoverZone() {
74
74
  content: '""',
75
75
  position: 'absolute',
76
76
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
77
- top: "".concat(-_consts.DRAG_HANDLE_WIDTH / 2, "px"),
77
+ top: "".concat(-_styles.DRAG_HANDLE_WIDTH / 2, "px"),
78
78
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
79
79
  left: 0,
80
80
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
81
81
  width: '100%',
82
82
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
83
- height: "".concat(_consts.DRAG_HANDLE_WIDTH, "px"),
83
+ height: "".concat(_styles.DRAG_HANDLE_WIDTH, "px"),
84
84
  cursor: 'default',
85
85
  zIndex: 1
86
86
  })), 'hr[data-drag-handler-anchor-name]', {
package/dist/es2019/blockControlsPlugin.js CHANGED
@@ -55,14 +55,14 @@ export const blockControlsPlugin = ({
55
55
  rootAnchorName,
56
56
  rootNodeType
57
57
  },
58
- closeMenu: editorExperiment('platform_editor_controls', 'variant1') ? true : undefined
58
+ closeMenu: editorExperiment('platform_editor_controls', 'variant1') && !expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? true : undefined
59
59
  });
60
60
  return tr;
61
61
  },
62
62
  toggleBlockMenu: options => ({
63
63
  tr
64
64
  }) => {
65
- var _options$anchorName;
65
+ var _options$anchorName, _api$blockControls, _api$blockControls$sh;
66
66
  const currMeta = tr.getMeta(key);
67
67
  if (options !== null && options !== void 0 && options.closeMenu) {
68
68
  tr.setMeta(key, {
@@ -86,12 +86,24 @@ export const blockControlsPlugin = ({
86
86
  anchorName: options === null || options === void 0 ? void 0 : options.anchorName
87
87
  }
88
88
  });
89
+ const menuTriggerBy = api === null || api === void 0 ? void 0 : (_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.menuTriggerBy;
90
+ if (menuTriggerBy === undefined || !!menuTriggerBy && menuTriggerBy === (options === null || options === void 0 ? void 0 : options.anchorName)) {
91
+ var _api$userIntent, _api$userIntent$share;
92
+ // Toggled from drag handle
93
+ const currentUserIntent = 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;
94
+ if (currentUserIntent === 'blockMenuOpen') {
95
+ var _api$userIntent2;
96
+ api === null || api === void 0 ? void 0 : (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent('default')({
97
+ tr
98
+ });
99
+ }
100
+ }
89
101
  return tr;
90
102
  },
91
103
  setNodeDragged: (getPos, anchorName, nodeType) => ({
92
104
  tr
93
105
  }) => {
94
- var _api$userIntent;
106
+ var _api$userIntent3;
95
107
  const pos = getPos();
96
108
  if (pos === undefined) {
97
109
  return tr;
@@ -115,7 +127,7 @@ export const blockControlsPlugin = ({
115
127
  tr
116
128
  });
117
129
  }
118
- api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('dragging')({
130
+ api === null || api === void 0 ? void 0 : (_api$userIntent3 = api.userIntent) === null || _api$userIntent3 === void 0 ? void 0 : _api$userIntent3.commands.setCurrentUserIntent('dragging')({
119
131
  tr
120
132
  });
121
133
  return tr;
package/dist/es2019/pm-plugins/handle-mouse-down.js CHANGED
@@ -1,3 +1,5 @@
1
+ import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
2
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
1
3
  export const handleMouseDown = api => (view, event) => {
2
4
  if (!(event.target instanceof HTMLElement)) {
3
5
  return false;
@@ -13,7 +15,7 @@ export const handleMouseDown = api => (view, event) => {
13
15
  }
14
16
  api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.showDragHandleAt(rootPos, '', (_rootNode$type$name = rootNode.type.name) !== null && _rootNode$type$name !== void 0 ? _rootNode$type$name : '', undefined, rootPos, '', (_rootNode$type$name2 = rootNode.type.name) !== null && _rootNode$type$name2 !== void 0 ? _rootNode$type$name2 : ''));
15
17
  } else {
16
- const isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle]') !== null;
18
+ const isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle]') !== null;
17
19
  api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
18
20
  }
19
21
  return false;
package/dist/es2019/pm-plugins/handle-mouse-over.js CHANGED
@@ -126,7 +126,8 @@ export const handleMouseOver = (view, event, api) => {
126
126
  api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 ? void 0 : _api$blockControls3.commands.showDragHandleAt(targetPos, anchorName, nodeType));
127
127
  }
128
128
  if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
129
- if (isMenuOpen && originalAnchorName) {
129
+ var _api$userIntent, _api$userIntent$share;
130
+ if (isMenuOpen && originalAnchorName && (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') {
130
131
  var _api$core3, _api$blockControls4;
131
132
  api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.toggleBlockMenu());
132
133
  }
package/dist/es2019/pm-plugins/main.js CHANGED
@@ -3,6 +3,7 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit
3
3
  import { browser } from '@atlaskit/editor-common/browser';
4
4
  import { isMeasuring, startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
5
5
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
6
+ import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
6
7
  import { EDIT_AREA_ID } from '@atlaskit/editor-common/ui';
7
8
  import { isEmptyDocument } from '@atlaskit/editor-common/utils';
8
9
  import { NodeSelection, PluginKey, TextSelection } from '@atlaskit/editor-prosemirror/state';
@@ -750,7 +751,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
750
751
  }
751
752
  }
752
753
  if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && editorExperiment('platform_editor_controls', 'variant1')) {
753
- const isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
754
+ const isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle="true"]') !== null;
754
755
  api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
755
756
  }
756
757
  if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
@@ -789,7 +790,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
789
790
  }
790
791
  }
791
792
  if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && editorExperiment('platform_editor_controls', 'variant1')) {
792
- const isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
793
+ const isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle="true"]') !== null;
793
794
  api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
794
795
  }
795
796
  if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
package/dist/es2019/pm-plugins/utils/drag-handle-positions.js CHANGED
@@ -1,5 +1,6 @@
1
+ import { DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
1
2
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
2
- import { DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT, DRAG_HANDLE_H1_TOP_ADJUSTMENT, DRAG_HANDLE_H2_TOP_ADJUSTMENT, DRAG_HANDLE_H4_TOP_ADJUSTMENT, DRAG_HANDLE_H5_TOP_ADJUSTMENT, DRAG_HANDLE_H6_TOP_ADJUSTMENT, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT, DRAG_HANDLE_WIDTH, dragHandleGap } from '../../ui/consts';
3
+ import { DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT, DRAG_HANDLE_H1_TOP_ADJUSTMENT, DRAG_HANDLE_H2_TOP_ADJUSTMENT, DRAG_HANDLE_H4_TOP_ADJUSTMENT, DRAG_HANDLE_H5_TOP_ADJUSTMENT, DRAG_HANDLE_H6_TOP_ADJUSTMENT, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT, dragHandleGap } from '../../ui/consts';
3
4
  const STICKY_NODES = ['panel', 'table', 'expand', 'layoutSection', 'bodiedExtension'];
4
5
  export const getTopPosition = (dom, type) => {
5
6
  if (!dom) {
package/dist/es2019/ui/consts.js CHANGED
@@ -1,7 +1,7 @@
1
+ import { DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
1
2
  import { akEditorUnitZIndex, akRichMediaResizeZIndex } from '@atlaskit/editor-shared-styles';
2
3
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
3
4
  export const DRAG_HANDLE_HEIGHT = 24;
4
- export const DRAG_HANDLE_WIDTH = 12;
5
5
  export const DRAG_HANDLE_BORDER_RADIUS = 4;
6
6
  export const DRAG_HANDLE_ZINDEX = akRichMediaResizeZIndex + akEditorUnitZIndex; //place above legacy resizer
7
7
  export const DRAG_HANDLE_DEFAULT_GAP = 8;
package/dist/es2019/ui/drag-handle.js CHANGED
@@ -13,7 +13,7 @@ import { browser } from '@atlaskit/editor-common/browser';
13
13
  import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
14
14
  import { dragToMoveDown, dragToMoveLeft, dragToMoveRight, dragToMoveUp, getAriaKeyshortcuts, TooltipContentWithMultipleShortcuts } from '@atlaskit/editor-common/keymaps';
15
15
  import { blockControlsMessages } from '@atlaskit/editor-common/messages';
16
- import { tableControlsSpacing } from '@atlaskit/editor-common/styles';
16
+ import { tableControlsSpacing, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
17
17
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
18
18
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
19
19
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
@@ -34,7 +34,7 @@ import { getMultiSelectAnalyticsAttributes } from '../pm-plugins/utils/analytics
34
34
  import { getControlBottomCSSValue, getControlHeightCSSValue, getLeftPosition, getNodeHeight, getTopPosition, shouldBeSticky, shouldMaskNodeControls } from '../pm-plugins/utils/drag-handle-positions';
35
35
  import { isHandleCorrelatedToSelection, selectNode } from '../pm-plugins/utils/getSelection';
36
36
  import { alignAnchorHeadInDirectionOfPos, expandSelectionHeadToNodeAtPos } from '../pm-plugins/utils/selection';
37
- import { BLOCK_MENU_ENABLED, DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH, DRAG_HANDLE_WIDTH, DRAG_HANDLE_ZINDEX, dragHandleGap, nodeMargins, spacingBetweenNodesForPreview, STICKY_CONTROLS_TOP_MARGIN, topPositionAdjustment } from './consts';
37
+ import { BLOCK_MENU_ENABLED, DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH, DRAG_HANDLE_ZINDEX, dragHandleGap, nodeMargins, spacingBetweenNodesForPreview, STICKY_CONTROLS_TOP_MARGIN, topPositionAdjustment } from './consts';
38
38
  import { dragPreview } from './drag-preview';
39
39
  import { refreshAnchorName } from './utils/anchor-name';
40
40
  import { VisibilityContainer } from './visibility-container';
package/dist/es2019/ui/global-styles.js CHANGED
@@ -4,14 +4,14 @@
4
4
  */
5
5
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
6
6
  import { css, Global, jsx } from '@emotion/react';
7
- import { tableControlsSpacing } from '@atlaskit/editor-common/styles';
7
+ import { tableControlsSpacing, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
8
8
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
9
9
  import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
10
10
  import { akEditorBreakoutPadding, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
11
11
  import { layers } from '@atlaskit/theme/constants';
12
12
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
13
13
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
14
- import { DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, DRAG_HANDLE_WIDTH } from './consts';
14
+ import { DRAG_HANDLE_MAX_WIDTH_PLUS_GAP } from './consts';
15
15
 
16
16
  /**
17
17
  * This anchor element selector disregards anchors that are solely utilized for size measurements,
package/dist/esm/blockControlsPlugin.js CHANGED
@@ -58,14 +58,14 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
58
58
  rootAnchorName: rootAnchorName,
59
59
  rootNodeType: rootNodeType
60
60
  },
61
- closeMenu: editorExperiment('platform_editor_controls', 'variant1') ? true : undefined
61
+ closeMenu: editorExperiment('platform_editor_controls', 'variant1') && !expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? true : undefined
62
62
  }));
63
63
  return tr;
64
64
  };
65
65
  },
66
66
  toggleBlockMenu: function toggleBlockMenu(options) {
67
67
  return function (_ref4) {
68
- var _options$anchorName;
68
+ var _options$anchorName, _api$blockControls;
69
69
  var tr = _ref4.tr;
70
70
  var currMeta = tr.getMeta(key);
71
71
  if (options !== null && options !== void 0 && options.closeMenu) {
@@ -87,12 +87,24 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
87
87
  anchorName: options === null || options === void 0 ? void 0 : options.anchorName
88
88
  }
89
89
  }));
90
+ var menuTriggerBy = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.sharedState.currentState()) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.menuTriggerBy;
91
+ if (menuTriggerBy === undefined || !!menuTriggerBy && menuTriggerBy === (options === null || options === void 0 ? void 0 : options.anchorName)) {
92
+ var _api$userIntent;
93
+ // Toggled from drag handle
94
+ var currentUserIntent = 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;
95
+ if (currentUserIntent === 'blockMenuOpen') {
96
+ var _api$userIntent2;
97
+ api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent('default')({
98
+ tr: tr
99
+ });
100
+ }
101
+ }
90
102
  return tr;
91
103
  };
92
104
  },
93
105
  setNodeDragged: function setNodeDragged(getPos, anchorName, nodeType) {
94
106
  return function (_ref5) {
95
- var _api$userIntent;
107
+ var _api$userIntent3;
96
108
  var tr = _ref5.tr;
97
109
  var pos = getPos();
98
110
  if (pos === undefined) {
@@ -116,7 +128,7 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
116
128
  tr: tr
117
129
  });
118
130
  }
119
- api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || _api$userIntent.commands.setCurrentUserIntent('dragging')({
131
+ api === null || api === void 0 || (_api$userIntent3 = api.userIntent) === null || _api$userIntent3 === void 0 || _api$userIntent3.commands.setCurrentUserIntent('dragging')({
120
132
  tr: tr
121
133
  });
122
134
  return tr;
package/dist/esm/pm-plugins/handle-mouse-down.js CHANGED
@@ -1,3 +1,5 @@
1
+ import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
2
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
1
3
  export var handleMouseDown = function handleMouseDown(api) {
2
4
  return function (view, event) {
3
5
  if (!(event.target instanceof HTMLElement)) {
@@ -14,7 +16,7 @@ export var handleMouseDown = function handleMouseDown(api) {
14
16
  }
15
17
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.showDragHandleAt(rootPos, '', (_rootNode$type$name = rootNode.type.name) !== null && _rootNode$type$name !== void 0 ? _rootNode$type$name : '', undefined, rootPos, '', (_rootNode$type$name2 = rootNode.type.name) !== null && _rootNode$type$name2 !== void 0 ? _rootNode$type$name2 : ''));
16
18
  } else {
17
- var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle]') !== null;
19
+ var isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle]') !== null;
18
20
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
19
21
  }
20
22
  return false;
package/dist/esm/pm-plugins/handle-mouse-over.js CHANGED
@@ -125,7 +125,8 @@ export var handleMouseOver = function handleMouseOver(view, event, api) {
125
125
  api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(api === null || api === void 0 || (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 ? void 0 : _api$blockControls3.commands.showDragHandleAt(targetPos, anchorName, nodeType));
126
126
  }
127
127
  if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
128
- if (isMenuOpen && originalAnchorName) {
128
+ var _api$userIntent;
129
+ if (isMenuOpen && originalAnchorName && (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') {
129
130
  var _api$core3, _api$blockControls4;
130
131
  api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.toggleBlockMenu());
131
132
  }
package/dist/esm/pm-plugins/main.js CHANGED
@@ -6,6 +6,7 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit
6
6
  import { browser } from '@atlaskit/editor-common/browser';
7
7
  import { isMeasuring, startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
8
8
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
9
+ import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
9
10
  import { EDIT_AREA_ID } from '@atlaskit/editor-common/ui';
10
11
  import { isEmptyDocument } from '@atlaskit/editor-common/utils';
11
12
  import { NodeSelection, PluginKey, TextSelection } from '@atlaskit/editor-prosemirror/state';
@@ -737,7 +738,7 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
737
738
  }
738
739
  }
739
740
  if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && editorExperiment('platform_editor_controls', 'variant1')) {
740
- var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
741
+ var isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle="true"]') !== null;
741
742
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
742
743
  }
743
744
  if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
@@ -774,7 +775,7 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
774
775
  }
775
776
  }
776
777
  if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && editorExperiment('platform_editor_controls', 'variant1')) {
777
- var _isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
778
+ var _isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle="true"]') !== null;
778
779
  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(_isDragHandle));
779
780
  }
780
781
  if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
package/dist/esm/pm-plugins/utils/drag-handle-positions.js CHANGED
@@ -1,5 +1,6 @@
1
+ import { DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
1
2
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
2
- import { DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT, DRAG_HANDLE_H1_TOP_ADJUSTMENT, DRAG_HANDLE_H2_TOP_ADJUSTMENT, DRAG_HANDLE_H4_TOP_ADJUSTMENT, DRAG_HANDLE_H5_TOP_ADJUSTMENT, DRAG_HANDLE_H6_TOP_ADJUSTMENT, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT, DRAG_HANDLE_WIDTH, dragHandleGap } from '../../ui/consts';
3
+ import { DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT, DRAG_HANDLE_H1_TOP_ADJUSTMENT, DRAG_HANDLE_H2_TOP_ADJUSTMENT, DRAG_HANDLE_H4_TOP_ADJUSTMENT, DRAG_HANDLE_H5_TOP_ADJUSTMENT, DRAG_HANDLE_H6_TOP_ADJUSTMENT, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT, dragHandleGap } from '../../ui/consts';
3
4
  var STICKY_NODES = ['panel', 'table', 'expand', 'layoutSection', 'bodiedExtension'];
4
5
  export var getTopPosition = function getTopPosition(dom, type) {
5
6
  if (!dom) {
package/dist/esm/ui/consts.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  var _dropTargetMarginMap;
3
+ import { DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
3
4
  import { akEditorUnitZIndex, akRichMediaResizeZIndex } from '@atlaskit/editor-shared-styles';
4
5
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
5
6
  export var DRAG_HANDLE_HEIGHT = 24;
6
- export var DRAG_HANDLE_WIDTH = 12;
7
7
  export var DRAG_HANDLE_BORDER_RADIUS = 4;
8
8
  export var DRAG_HANDLE_ZINDEX = akRichMediaResizeZIndex + akEditorUnitZIndex; //place above legacy resizer
9
9
  export var DRAG_HANDLE_DEFAULT_GAP = 8;
package/dist/esm/ui/drag-handle.js CHANGED
@@ -18,7 +18,7 @@ import { browser } from '@atlaskit/editor-common/browser';
18
18
  import { sharedPluginStateHookMigratorFactory, useSharedPluginState, useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
19
19
  import { dragToMoveDown, dragToMoveLeft, dragToMoveRight, dragToMoveUp, getAriaKeyshortcuts, TooltipContentWithMultipleShortcuts } from '@atlaskit/editor-common/keymaps';
20
20
  import { blockControlsMessages } from '@atlaskit/editor-common/messages';
21
- import { tableControlsSpacing } from '@atlaskit/editor-common/styles';
21
+ import { tableControlsSpacing, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
22
22
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
23
23
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
24
24
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
@@ -39,7 +39,7 @@ import { getMultiSelectAnalyticsAttributes } from '../pm-plugins/utils/analytics
39
39
  import { getControlBottomCSSValue, getControlHeightCSSValue, getLeftPosition, getNodeHeight, getTopPosition, shouldBeSticky, shouldMaskNodeControls } from '../pm-plugins/utils/drag-handle-positions';
40
40
  import { isHandleCorrelatedToSelection, selectNode } from '../pm-plugins/utils/getSelection';
41
41
  import { alignAnchorHeadInDirectionOfPos, expandSelectionHeadToNodeAtPos } from '../pm-plugins/utils/selection';
42
- import { BLOCK_MENU_ENABLED, DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH, DRAG_HANDLE_WIDTH, DRAG_HANDLE_ZINDEX, dragHandleGap, nodeMargins, spacingBetweenNodesForPreview, STICKY_CONTROLS_TOP_MARGIN, topPositionAdjustment } from './consts';
42
+ import { BLOCK_MENU_ENABLED, DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH, DRAG_HANDLE_ZINDEX, dragHandleGap, nodeMargins, spacingBetweenNodesForPreview, STICKY_CONTROLS_TOP_MARGIN, topPositionAdjustment } from './consts';
43
43
  import { dragPreview } from './drag-preview';
44
44
  import { refreshAnchorName } from './utils/anchor-name';
45
45
  import { VisibilityContainer } from './visibility-container';
package/dist/esm/ui/global-styles.js CHANGED
@@ -5,14 +5,14 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
5
5
  */
6
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
7
  import { css, Global, jsx } from '@emotion/react';
8
- import { tableControlsSpacing } from '@atlaskit/editor-common/styles';
8
+ import { tableControlsSpacing, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
9
9
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
10
10
  import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/whitespace';
11
11
  import { akEditorBreakoutPadding, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
12
12
  import { layers } from '@atlaskit/theme/constants';
13
13
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
14
14
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
15
- import { DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, DRAG_HANDLE_WIDTH } from './consts';
15
+ import { DRAG_HANDLE_MAX_WIDTH_PLUS_GAP } from './consts';
16
16
 
17
17
  /**
18
18
  * This anchor element selector disregards anchors that are solely utilized for size measurements,
package/dist/types/ui/consts.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  export declare const DRAG_HANDLE_HEIGHT = 24;
2
- export declare const DRAG_HANDLE_WIDTH = 12;
3
2
  export declare const DRAG_HANDLE_BORDER_RADIUS = 4;
4
3
  export declare const DRAG_HANDLE_ZINDEX: number;
5
4
  export declare const DRAG_HANDLE_DEFAULT_GAP = 8;
package/dist/types-ts4.5/ui/consts.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  export declare const DRAG_HANDLE_HEIGHT = 24;
2
- export declare const DRAG_HANDLE_WIDTH = 12;
3
2
  export declare const DRAG_HANDLE_BORDER_RADIUS = 4;
4
3
  export declare const DRAG_HANDLE_ZINDEX: number;
5
4
  export declare const DRAG_HANDLE_DEFAULT_GAP = 8;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "4.1.10",
3
+ "version": "4.1.11",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -37,7 +37,7 @@
37
37
  "@atlaskit/editor-plugin-editor-disabled": "^3.0.0",
38
38
  "@atlaskit/editor-plugin-feature-flags": "^2.0.0",
39
39
  "@atlaskit/editor-plugin-interaction": "^5.0.0",
40
- "@atlaskit/editor-plugin-limited-mode": "^0.0.1",
40
+ "@atlaskit/editor-plugin-limited-mode": "^0.0.2",
41
41
  "@atlaskit/editor-plugin-metrics": "^4.0.0",
42
42
  "@atlaskit/editor-plugin-quick-insert": "^3.0.0",
43
43
  "@atlaskit/editor-plugin-selection": "^3.0.0",
@@ -55,7 +55,7 @@
55
55
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
56
56
  "@atlaskit/primitives": "^14.11.0",
57
57
  "@atlaskit/theme": "^19.0.0",
58
- "@atlaskit/tmp-editor-statsig": "^10.0.0",
58
+ "@atlaskit/tmp-editor-statsig": "^11.0.0",
59
59
  "@atlaskit/tokens": "^6.0.0",
60
60
  "@atlaskit/tooltip": "^20.4.0",
61
61
  "@babel/runtime": "^7.0.0",