@atlaskit/editor-plugin-block-controls 3.3.16 → 3.3.18

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 3.3.18
4
+
5
+ ### Patch Changes
6
+
7
+ - [#128661](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/128661)
8
+ [`4e5d4eee96907`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4e5d4eee96907) -
9
+ Add validation when recreating quick insert button, avoid recreating when root node is stable
10
+ - Updated dependencies
11
+
12
+ ## 3.3.17
13
+
14
+ ### Patch Changes
15
+
16
+ - [#128300](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/128300)
17
+ [`b26295480eb23`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b26295480eb23) -
18
+ Always add left offset for quick insert to avoid it flicking in and out
19
+ - Updated dependencies
20
+
3
21
  ## 3.3.16
4
22
 
5
23
  ### Patch Changes
@@ -187,7 +187,7 @@ var getDecorationAtPos = function getDecorationAtPos(decorations, pos, to) {
187
187
  return nodeDecAtActivePos;
188
188
  };
189
189
  var newApply = exports.newApply = function newApply(api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache) {
190
- var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _meta$isDragging, _latestActiveNode11, _latestActiveNode12, _meta$isDragging2, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
190
+ var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _activeNode3, _activeNode4, _meta$isDragging, _latestActiveNode11, _latestActiveNode12, _meta$isDragging2, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
191
191
  var activeNode = currentState.activeNode,
192
192
  decorations = currentState.decorations,
193
193
  isResizerResizing = currentState.isResizerResizing,
@@ -315,12 +315,14 @@ var newApply = exports.newApply = function newApply(api, formatMessage, tr, curr
315
315
 
316
316
  // Check if there's a new active node, and it differs from the last
317
317
  var activeNodeChanged = (meta === null || meta === void 0 ? void 0 : meta.activeNode) && ((meta === null || meta === void 0 ? void 0 : meta.activeNode.pos) !== ((_activeNode = activeNode) === null || _activeNode === void 0 ? void 0 : _activeNode.pos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.anchorName) !== ((_activeNode2 = activeNode) === null || _activeNode2 === void 0 ? void 0 : _activeNode2.anchorName) || (meta === null || meta === void 0 || (_meta$activeNode$hand = meta.activeNode.handleOptions) === null || _meta$activeNode$hand === void 0 ? void 0 : _meta$activeNode$hand.isFocused));
318
+ var rootActiveNodeChanged = (meta === null || meta === void 0 ? void 0 : meta.activeNode) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.rootPos) !== ((_activeNode3 = activeNode) === null || _activeNode3 === void 0 ? void 0 : _activeNode3.rootPos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.rootAnchorName) !== ((_activeNode4 = activeNode) === null || _activeNode4 === void 0 ? void 0 : _activeNode4.rootAnchorName);
318
319
 
319
320
  // Some browsers don't support anchor positioning, meaning we need to replace the handle when nodes change
320
321
  var handleNeedsRedraw = shouldRedrawNodeDecs && !(0, _anchorUtils.isAnchorSupported)();
321
322
 
322
323
  // Create/recreate handle dec when the active node is missing/changes, or the editor viewport has changed (non-anchor pos workaround)
323
324
  var shouldRecreateHandle = latestActiveNode && (activeNodeChanged || isActiveNodeModified || editorSizeChanged || handleNeedsRedraw);
325
+ var shouldRecreateQuickInsertButton = latestActiveNode && (rootActiveNodeChanged || isActiveNodeModified || editorSizeChanged || handleNeedsRedraw);
324
326
  var shouldRemoveHandle = false;
325
327
  if ((0, _platformFeatureFlags.fg)('platform_editor_remove_drag_handle_fix')) {
326
328
  // If the active node is missing, we need to remove the handle
@@ -330,29 +332,29 @@ var newApply = exports.newApply = function newApply(api, formatMessage, tr, curr
330
332
  shouldRemoveHandle = latestActiveNode && (isResizerResizing || isActiveNodeDeleted || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved));
331
333
  }
332
334
  if (shouldRemoveHandle) {
333
- var _activeNode3, _activeNode4;
334
- var oldHandle = (0, _decorationsDragHandle.findHandleDec)(decorations, (_activeNode3 = activeNode) === null || _activeNode3 === void 0 ? void 0 : _activeNode3.pos, (_activeNode4 = activeNode) === null || _activeNode4 === void 0 ? void 0 : _activeNode4.pos);
335
+ var _activeNode5, _activeNode6;
336
+ var oldHandle = (0, _decorationsDragHandle.findHandleDec)(decorations, (_activeNode5 = activeNode) === null || _activeNode5 === void 0 ? void 0 : _activeNode5.pos, (_activeNode6 = activeNode) === null || _activeNode6 === void 0 ? void 0 : _activeNode6.pos);
335
337
  decorations = decorations.remove(oldHandle);
336
338
  if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
337
339
  var oldQuickInsertButton = (0, _decorationsQuickInsertButton.findQuickInsertInsertButtonDecoration)(decorations);
338
340
  decorations = decorations.remove(oldQuickInsertButton);
339
341
  }
340
- } else if (api && shouldRecreateHandle) {
341
- var _activeNode5, _activeNode6, _latestActiveNode, _latestActiveNode2, _latestActiveNode3, _latestActiveNode4;
342
- var _oldHandle = (0, _decorationsDragHandle.findHandleDec)(decorations, (_activeNode5 = activeNode) === null || _activeNode5 === void 0 ? void 0 : _activeNode5.pos, (_activeNode6 = activeNode) === null || _activeNode6 === void 0 ? void 0 : _activeNode6.pos);
343
- decorations = decorations.remove(_oldHandle);
344
- var handleDec = (0, _decorationsDragHandle.dragHandleDecoration)(api, formatMessage, (_latestActiveNode = latestActiveNode) === null || _latestActiveNode === void 0 ? void 0 : _latestActiveNode.pos, (_latestActiveNode2 = latestActiveNode) === null || _latestActiveNode2 === void 0 ? void 0 : _latestActiveNode2.anchorName, (_latestActiveNode3 = latestActiveNode) === null || _latestActiveNode3 === void 0 ? void 0 : _latestActiveNode3.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode4 = latestActiveNode) === null || _latestActiveNode4 === void 0 ? void 0 : _latestActiveNode4.handleOptions);
345
- if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
346
- var _latestActiveNode5;
347
- if (((_latestActiveNode5 = latestActiveNode) === null || _latestActiveNode5 === void 0 ? void 0 : _latestActiveNode5.rootPos) !== undefined) {
348
- var _latestActiveNode6, _latestActiveNode7, _latestActiveNode8, _latestActiveNode9, _latestActiveNode10;
349
- var _oldQuickInsertButton = (0, _decorationsQuickInsertButton.findQuickInsertInsertButtonDecoration)(decorations);
350
- decorations = decorations.remove(_oldQuickInsertButton);
351
- var quickInsertButton = (0, _decorationsQuickInsertButton.quickInsertButtonDecoration)(api, formatMessage, (_latestActiveNode6 = latestActiveNode) === null || _latestActiveNode6 === void 0 ? void 0 : _latestActiveNode6.rootPos, (_latestActiveNode7 = latestActiveNode) === null || _latestActiveNode7 === void 0 ? void 0 : _latestActiveNode7.anchorName, (_latestActiveNode8 = latestActiveNode) === null || _latestActiveNode8 === void 0 ? void 0 : _latestActiveNode8.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode9 = latestActiveNode) === null || _latestActiveNode9 === void 0 ? void 0 : _latestActiveNode9.rootAnchorName, (_latestActiveNode10 = latestActiveNode) === null || _latestActiveNode10 === void 0 ? void 0 : _latestActiveNode10.rootNodeType);
352
- decorations = decorations.add(newState.doc, [quickInsertButton]);
353
- }
342
+ } else if (api) {
343
+ var _latestActiveNode5;
344
+ if (shouldRecreateHandle) {
345
+ var _activeNode7, _activeNode8, _latestActiveNode, _latestActiveNode2, _latestActiveNode3, _latestActiveNode4;
346
+ var _oldHandle = (0, _decorationsDragHandle.findHandleDec)(decorations, (_activeNode7 = activeNode) === null || _activeNode7 === void 0 ? void 0 : _activeNode7.pos, (_activeNode8 = activeNode) === null || _activeNode8 === void 0 ? void 0 : _activeNode8.pos);
347
+ decorations = decorations.remove(_oldHandle);
348
+ var handleDec = (0, _decorationsDragHandle.dragHandleDecoration)(api, formatMessage, (_latestActiveNode = latestActiveNode) === null || _latestActiveNode === void 0 ? void 0 : _latestActiveNode.pos, (_latestActiveNode2 = latestActiveNode) === null || _latestActiveNode2 === void 0 ? void 0 : _latestActiveNode2.anchorName, (_latestActiveNode3 = latestActiveNode) === null || _latestActiveNode3 === void 0 ? void 0 : _latestActiveNode3.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode4 = latestActiveNode) === null || _latestActiveNode4 === void 0 ? void 0 : _latestActiveNode4.handleOptions);
349
+ decorations = decorations.add(newState.doc, [handleDec]);
350
+ }
351
+ if (shouldRecreateQuickInsertButton && ((_latestActiveNode5 = latestActiveNode) === null || _latestActiveNode5 === void 0 ? void 0 : _latestActiveNode5.rootPos) !== undefined && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
352
+ var _activeNode9, _activeNode10, _latestActiveNode6, _latestActiveNode7, _latestActiveNode8, _latestActiveNode9, _latestActiveNode10;
353
+ var _oldQuickInsertButton = (0, _decorationsQuickInsertButton.findQuickInsertInsertButtonDecoration)(decorations, (_activeNode9 = activeNode) === null || _activeNode9 === void 0 ? void 0 : _activeNode9.rootPos, (_activeNode10 = activeNode) === null || _activeNode10 === void 0 ? void 0 : _activeNode10.rootPos);
354
+ decorations = decorations.remove(_oldQuickInsertButton);
355
+ var quickInsertButton = (0, _decorationsQuickInsertButton.quickInsertButtonDecoration)(api, formatMessage, (_latestActiveNode6 = latestActiveNode) === null || _latestActiveNode6 === void 0 ? void 0 : _latestActiveNode6.rootPos, (_latestActiveNode7 = latestActiveNode) === null || _latestActiveNode7 === void 0 ? void 0 : _latestActiveNode7.anchorName, (_latestActiveNode8 = latestActiveNode) === null || _latestActiveNode8 === void 0 ? void 0 : _latestActiveNode8.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode9 = latestActiveNode) === null || _latestActiveNode9 === void 0 ? void 0 : _latestActiveNode9.rootAnchorName, (_latestActiveNode10 = latestActiveNode) === null || _latestActiveNode10 === void 0 ? void 0 : _latestActiveNode10.rootNodeType);
356
+ decorations = decorations.add(newState.doc, [quickInsertButton]);
354
357
  }
355
- decorations = decorations.add(newState.doc, [handleDec]);
356
358
  }
357
359
 
358
360
  // Drop targets may be missing when the node count is being changed during a drag
@@ -4,10 +4,9 @@ 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.QUICK_INSERT_WIDTH = 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.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;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
10
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
11
10
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
12
11
  var _dropTargetMarginMap;
13
12
  var DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_HEIGHT = 24;
@@ -41,9 +40,10 @@ var QUICK_INSERT_DIMENSIONS = exports.QUICK_INSERT_DIMENSIONS = {
41
40
  width: QUICK_INSERT_WIDTH,
42
41
  height: QUICK_INSERT_HEIGHT
43
42
  };
43
+ var QUICK_INSERT_LEFT_OFFSET = exports.QUICK_INSERT_LEFT_OFFSET = 16;
44
44
  var nodeTypeExcludeList = ['embedCard', 'mediaSingle', 'table'];
45
45
  var dragHandleGap = exports.dragHandleGap = function dragHandleGap(nodeType, parentNodeType) {
46
- if (nodeType === 'layoutSection' && (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_2')) {
46
+ if (nodeType === 'layoutSection') {
47
47
  return DRAG_HANDLE_DEFAULT_GAP + 20;
48
48
  }
49
49
  if (parentNodeType && parentNodeType !== 'doc') {
@@ -58,8 +58,6 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
58
58
  api = _ref.api,
59
59
  formatMessage = _ref.formatMessage,
60
60
  getPos = _ref.getPos,
61
- nodeType = _ref.nodeType,
62
- anchorName = _ref.anchorName,
63
61
  rootAnchorName = _ref.rootAnchorName,
64
62
  rootNodeType = _ref.rootNodeType;
65
63
  var macroInteractionUpdates = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'featureFlags.macroInteractionUpdates');
@@ -97,18 +95,17 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
97
95
  }
98
96
  }
99
97
  var isEdgeCase = (hasResizer || isExtension || isEmbedCard || isBlockCard) && innerContainer;
100
- var neighboringWidthOffset = anchorName === rootAnchorName ? '-16px' : '0px';
101
98
  if (supportsAnchor) {
102
99
  return {
103
- left: isEdgeCase ? "calc(anchor(".concat(rootAnchorName, " start) + ").concat((0, _widgetPositions.getLeftPositionForRootElement)(dom, rootNodeType, _consts.QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + ").concat(neighboringWidthOffset, ")") : "calc(anchor(".concat(rootAnchorName, " start) - ").concat(_consts.QUICK_INSERT_DIMENSIONS.width, "px - ").concat((0, _consts.rootElementGap)(rootNodeType), "px + ").concat(neighboringWidthOffset, ")"),
100
+ left: isEdgeCase ? "calc(anchor(".concat(rootAnchorName, " start) + ").concat((0, _widgetPositions.getLeftPositionForRootElement)(dom, rootNodeType, _consts.QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + -").concat(_consts.QUICK_INSERT_LEFT_OFFSET, "px)") : "calc(anchor(".concat(rootAnchorName, " start) - ").concat(_consts.QUICK_INSERT_DIMENSIONS.width, "px - ").concat((0, _consts.rootElementGap)(rootNodeType), "px + -").concat(_consts.QUICK_INSERT_LEFT_OFFSET, "px)"),
104
101
  top: "calc(anchor(".concat(rootAnchorName, " start) + ").concat((0, _consts.topPositionAdjustment)(rootNodeType), "px)")
105
102
  };
106
103
  }
107
104
  return {
108
- left: isEdgeCase ? "calc(".concat((dom === null || dom === void 0 ? void 0 : dom.offsetLeft) || 0, "px + ").concat((0, _widgetPositions.getLeftPositionForRootElement)(dom, rootNodeType, _consts.QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + ").concat(neighboringWidthOffset, ")") : "calc(".concat((0, _widgetPositions.getLeftPositionForRootElement)(dom, rootNodeType, _consts.QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + ").concat(neighboringWidthOffset, ")"),
105
+ left: isEdgeCase ? "calc(".concat((dom === null || dom === void 0 ? void 0 : dom.offsetLeft) || 0, "px + ").concat((0, _widgetPositions.getLeftPositionForRootElement)(dom, rootNodeType, _consts.QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + -").concat(_consts.QUICK_INSERT_LEFT_OFFSET, "px)") : "calc(".concat((0, _widgetPositions.getLeftPositionForRootElement)(dom, rootNodeType, _consts.QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + -").concat(_consts.QUICK_INSERT_LEFT_OFFSET, "px)"),
109
106
  top: (0, _dragHandlePositions.getTopPosition)(dom, rootNodeType)
110
107
  };
111
- }, [rootAnchorName, view.dom, rootNodeType, macroInteractionUpdates, anchorName]);
108
+ }, [rootAnchorName, view.dom, rootNodeType, macroInteractionUpdates]);
112
109
  (0, _react.useEffect)(function () {
113
110
  var cleanUpTransitionListener;
114
111
  if (rootNodeType === 'extension' || rootNodeType === 'embedCard') {
@@ -181,7 +181,7 @@ const getDecorationAtPos = (decorations, pos, to) => {
181
181
  return nodeDecAtActivePos;
182
182
  };
183
183
  export const newApply = (api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache) => {
184
- var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _meta$isDragging, _latestActiveNode11, _latestActiveNode12, _meta$isDragging2, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
184
+ var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _activeNode3, _activeNode4, _meta$isDragging, _latestActiveNode11, _latestActiveNode12, _meta$isDragging2, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
185
185
  let {
186
186
  activeNode,
187
187
  decorations,
@@ -312,12 +312,14 @@ export const newApply = (api, formatMessage, tr, currentState, newState, flags,
312
312
 
313
313
  // Check if there's a new active node, and it differs from the last
314
314
  const activeNodeChanged = (meta === null || meta === void 0 ? void 0 : meta.activeNode) && ((meta === null || meta === void 0 ? void 0 : meta.activeNode.pos) !== ((_activeNode = activeNode) === null || _activeNode === void 0 ? void 0 : _activeNode.pos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.anchorName) !== ((_activeNode2 = activeNode) === null || _activeNode2 === void 0 ? void 0 : _activeNode2.anchorName) || (meta === null || meta === void 0 ? void 0 : (_meta$activeNode$hand = meta.activeNode.handleOptions) === null || _meta$activeNode$hand === void 0 ? void 0 : _meta$activeNode$hand.isFocused));
315
+ const rootActiveNodeChanged = (meta === null || meta === void 0 ? void 0 : meta.activeNode) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.rootPos) !== ((_activeNode3 = activeNode) === null || _activeNode3 === void 0 ? void 0 : _activeNode3.rootPos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.rootAnchorName) !== ((_activeNode4 = activeNode) === null || _activeNode4 === void 0 ? void 0 : _activeNode4.rootAnchorName);
315
316
 
316
317
  // Some browsers don't support anchor positioning, meaning we need to replace the handle when nodes change
317
318
  const handleNeedsRedraw = shouldRedrawNodeDecs && !isAnchorSupported();
318
319
 
319
320
  // Create/recreate handle dec when the active node is missing/changes, or the editor viewport has changed (non-anchor pos workaround)
320
321
  const shouldRecreateHandle = latestActiveNode && (activeNodeChanged || isActiveNodeModified || editorSizeChanged || handleNeedsRedraw);
322
+ const shouldRecreateQuickInsertButton = latestActiveNode && (rootActiveNodeChanged || isActiveNodeModified || editorSizeChanged || handleNeedsRedraw);
321
323
  let shouldRemoveHandle = false;
322
324
  if (fg('platform_editor_remove_drag_handle_fix')) {
323
325
  // If the active node is missing, we need to remove the handle
@@ -327,29 +329,29 @@ export const newApply = (api, formatMessage, tr, currentState, newState, flags,
327
329
  shouldRemoveHandle = latestActiveNode && (isResizerResizing || isActiveNodeDeleted || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved));
328
330
  }
329
331
  if (shouldRemoveHandle) {
330
- var _activeNode3, _activeNode4;
331
- const oldHandle = findHandleDec(decorations, (_activeNode3 = activeNode) === null || _activeNode3 === void 0 ? void 0 : _activeNode3.pos, (_activeNode4 = activeNode) === null || _activeNode4 === void 0 ? void 0 : _activeNode4.pos);
332
+ var _activeNode5, _activeNode6;
333
+ const oldHandle = findHandleDec(decorations, (_activeNode5 = activeNode) === null || _activeNode5 === void 0 ? void 0 : _activeNode5.pos, (_activeNode6 = activeNode) === null || _activeNode6 === void 0 ? void 0 : _activeNode6.pos);
332
334
  decorations = decorations.remove(oldHandle);
333
335
  if (editorExperiment('platform_editor_controls', 'variant1')) {
334
336
  const oldQuickInsertButton = findQuickInsertInsertButtonDecoration(decorations);
335
337
  decorations = decorations.remove(oldQuickInsertButton);
336
338
  }
337
- } else if (api && shouldRecreateHandle) {
338
- var _activeNode5, _activeNode6, _latestActiveNode, _latestActiveNode2, _latestActiveNode3, _latestActiveNode4;
339
- const oldHandle = findHandleDec(decorations, (_activeNode5 = activeNode) === null || _activeNode5 === void 0 ? void 0 : _activeNode5.pos, (_activeNode6 = activeNode) === null || _activeNode6 === void 0 ? void 0 : _activeNode6.pos);
340
- decorations = decorations.remove(oldHandle);
341
- const handleDec = dragHandleDecoration(api, formatMessage, (_latestActiveNode = latestActiveNode) === null || _latestActiveNode === void 0 ? void 0 : _latestActiveNode.pos, (_latestActiveNode2 = latestActiveNode) === null || _latestActiveNode2 === void 0 ? void 0 : _latestActiveNode2.anchorName, (_latestActiveNode3 = latestActiveNode) === null || _latestActiveNode3 === void 0 ? void 0 : _latestActiveNode3.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode4 = latestActiveNode) === null || _latestActiveNode4 === void 0 ? void 0 : _latestActiveNode4.handleOptions);
342
- if (editorExperiment('platform_editor_controls', 'variant1')) {
343
- var _latestActiveNode5;
344
- if (((_latestActiveNode5 = latestActiveNode) === null || _latestActiveNode5 === void 0 ? void 0 : _latestActiveNode5.rootPos) !== undefined) {
345
- var _latestActiveNode6, _latestActiveNode7, _latestActiveNode8, _latestActiveNode9, _latestActiveNode10;
346
- const oldQuickInsertButton = findQuickInsertInsertButtonDecoration(decorations);
347
- decorations = decorations.remove(oldQuickInsertButton);
348
- const quickInsertButton = quickInsertButtonDecoration(api, formatMessage, (_latestActiveNode6 = latestActiveNode) === null || _latestActiveNode6 === void 0 ? void 0 : _latestActiveNode6.rootPos, (_latestActiveNode7 = latestActiveNode) === null || _latestActiveNode7 === void 0 ? void 0 : _latestActiveNode7.anchorName, (_latestActiveNode8 = latestActiveNode) === null || _latestActiveNode8 === void 0 ? void 0 : _latestActiveNode8.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode9 = latestActiveNode) === null || _latestActiveNode9 === void 0 ? void 0 : _latestActiveNode9.rootAnchorName, (_latestActiveNode10 = latestActiveNode) === null || _latestActiveNode10 === void 0 ? void 0 : _latestActiveNode10.rootNodeType);
349
- decorations = decorations.add(newState.doc, [quickInsertButton]);
350
- }
339
+ } else if (api) {
340
+ var _latestActiveNode5;
341
+ if (shouldRecreateHandle) {
342
+ var _activeNode7, _activeNode8, _latestActiveNode, _latestActiveNode2, _latestActiveNode3, _latestActiveNode4;
343
+ const oldHandle = findHandleDec(decorations, (_activeNode7 = activeNode) === null || _activeNode7 === void 0 ? void 0 : _activeNode7.pos, (_activeNode8 = activeNode) === null || _activeNode8 === void 0 ? void 0 : _activeNode8.pos);
344
+ decorations = decorations.remove(oldHandle);
345
+ const handleDec = dragHandleDecoration(api, formatMessage, (_latestActiveNode = latestActiveNode) === null || _latestActiveNode === void 0 ? void 0 : _latestActiveNode.pos, (_latestActiveNode2 = latestActiveNode) === null || _latestActiveNode2 === void 0 ? void 0 : _latestActiveNode2.anchorName, (_latestActiveNode3 = latestActiveNode) === null || _latestActiveNode3 === void 0 ? void 0 : _latestActiveNode3.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode4 = latestActiveNode) === null || _latestActiveNode4 === void 0 ? void 0 : _latestActiveNode4.handleOptions);
346
+ decorations = decorations.add(newState.doc, [handleDec]);
347
+ }
348
+ if (shouldRecreateQuickInsertButton && ((_latestActiveNode5 = latestActiveNode) === null || _latestActiveNode5 === void 0 ? void 0 : _latestActiveNode5.rootPos) !== undefined && editorExperiment('platform_editor_controls', 'variant1')) {
349
+ var _activeNode9, _activeNode10, _latestActiveNode6, _latestActiveNode7, _latestActiveNode8, _latestActiveNode9, _latestActiveNode10;
350
+ const oldQuickInsertButton = findQuickInsertInsertButtonDecoration(decorations, (_activeNode9 = activeNode) === null || _activeNode9 === void 0 ? void 0 : _activeNode9.rootPos, (_activeNode10 = activeNode) === null || _activeNode10 === void 0 ? void 0 : _activeNode10.rootPos);
351
+ decorations = decorations.remove(oldQuickInsertButton);
352
+ const quickInsertButton = quickInsertButtonDecoration(api, formatMessage, (_latestActiveNode6 = latestActiveNode) === null || _latestActiveNode6 === void 0 ? void 0 : _latestActiveNode6.rootPos, (_latestActiveNode7 = latestActiveNode) === null || _latestActiveNode7 === void 0 ? void 0 : _latestActiveNode7.anchorName, (_latestActiveNode8 = latestActiveNode) === null || _latestActiveNode8 === void 0 ? void 0 : _latestActiveNode8.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode9 = latestActiveNode) === null || _latestActiveNode9 === void 0 ? void 0 : _latestActiveNode9.rootAnchorName, (_latestActiveNode10 = latestActiveNode) === null || _latestActiveNode10 === void 0 ? void 0 : _latestActiveNode10.rootNodeType);
353
+ decorations = decorations.add(newState.doc, [quickInsertButton]);
351
354
  }
352
- decorations = decorations.add(newState.doc, [handleDec]);
353
355
  }
354
356
 
355
357
  // Drop targets may be missing when the node count is being changed during a drag
@@ -1,5 +1,4 @@
1
1
  import { akEditorUnitZIndex, akRichMediaResizeZIndex } from '@atlaskit/editor-shared-styles';
2
- import { fg } from '@atlaskit/platform-feature-flags';
3
2
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
4
3
  export const DRAG_HANDLE_HEIGHT = 24;
5
4
  export const DRAG_HANDLE_WIDTH = 12;
@@ -32,9 +31,10 @@ export const QUICK_INSERT_DIMENSIONS = {
32
31
  width: QUICK_INSERT_WIDTH,
33
32
  height: QUICK_INSERT_HEIGHT
34
33
  };
34
+ export const QUICK_INSERT_LEFT_OFFSET = 16;
35
35
  const nodeTypeExcludeList = ['embedCard', 'mediaSingle', 'table'];
36
36
  export const dragHandleGap = (nodeType, parentNodeType) => {
37
- if (nodeType === 'layoutSection' && fg('platform_editor_advanced_layouts_post_fix_patch_2')) {
37
+ if (nodeType === 'layoutSection') {
38
38
  return DRAG_HANDLE_DEFAULT_GAP + 20;
39
39
  }
40
40
  if (parentNodeType && parentNodeType !== 'doc') {
@@ -9,7 +9,7 @@ import { Box, Pressable, xcss } from '@atlaskit/primitives';
9
9
  import Tooltip from '@atlaskit/tooltip';
10
10
  import { getTopPosition } from '../pm-plugins/utils/drag-handle-positions';
11
11
  import { getLeftPositionForRootElement } from '../pm-plugins/utils/widget-positions';
12
- import { QUICK_INSERT_DIMENSIONS, rootElementGap, topPositionAdjustment } from './consts';
12
+ import { rootElementGap, topPositionAdjustment, QUICK_INSERT_DIMENSIONS, QUICK_INSERT_LEFT_OFFSET } from './consts';
13
13
  import { isNestedNodeSelected, isNonEditableBlock, isSelectionInNode } from './utils/document-checks';
14
14
  import { createNewLine } from './utils/editor-commands';
15
15
  const buttonStyles = xcss({
@@ -47,8 +47,6 @@ export const TypeAheadControl = ({
47
47
  api,
48
48
  formatMessage,
49
49
  getPos,
50
- nodeType,
51
- anchorName,
52
50
  rootAnchorName,
53
51
  rootNodeType
54
52
  }) => {
@@ -84,18 +82,17 @@ export const TypeAheadControl = ({
84
82
  }
85
83
  }
86
84
  const isEdgeCase = (hasResizer || isExtension || isEmbedCard || isBlockCard) && innerContainer;
87
- const neighboringWidthOffset = anchorName === rootAnchorName ? '-16px' : '0px';
88
85
  if (supportsAnchor) {
89
86
  return {
90
- left: isEdgeCase ? `calc(anchor(${rootAnchorName} start) + ${getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates)} + ${neighboringWidthOffset})` : `calc(anchor(${rootAnchorName} start) - ${QUICK_INSERT_DIMENSIONS.width}px - ${rootElementGap(rootNodeType)}px + ${neighboringWidthOffset})`,
87
+ left: isEdgeCase ? `calc(anchor(${rootAnchorName} start) + ${getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates)} + -${QUICK_INSERT_LEFT_OFFSET}px)` : `calc(anchor(${rootAnchorName} start) - ${QUICK_INSERT_DIMENSIONS.width}px - ${rootElementGap(rootNodeType)}px + -${QUICK_INSERT_LEFT_OFFSET}px)`,
91
88
  top: `calc(anchor(${rootAnchorName} start) + ${topPositionAdjustment(rootNodeType)}px)`
92
89
  };
93
90
  }
94
91
  return {
95
- left: isEdgeCase ? `calc(${(dom === null || dom === void 0 ? void 0 : dom.offsetLeft) || 0}px + ${getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates)} + ${neighboringWidthOffset})` : `calc(${getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates)} + ${neighboringWidthOffset})`,
92
+ left: isEdgeCase ? `calc(${(dom === null || dom === void 0 ? void 0 : dom.offsetLeft) || 0}px + ${getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates)} + -${QUICK_INSERT_LEFT_OFFSET}px)` : `calc(${getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates)} + -${QUICK_INSERT_LEFT_OFFSET}px)`,
96
93
  top: getTopPosition(dom, rootNodeType)
97
94
  };
98
- }, [rootAnchorName, view.dom, rootNodeType, macroInteractionUpdates, anchorName]);
95
+ }, [rootAnchorName, view.dom, rootNodeType, macroInteractionUpdates]);
99
96
  useEffect(() => {
100
97
  let cleanUpTransitionListener;
101
98
  if (rootNodeType === 'extension' || rootNodeType === 'embedCard') {
@@ -180,7 +180,7 @@ var getDecorationAtPos = function getDecorationAtPos(decorations, pos, to) {
180
180
  return nodeDecAtActivePos;
181
181
  };
182
182
  export var newApply = function newApply(api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache) {
183
- var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _meta$isDragging, _latestActiveNode11, _latestActiveNode12, _meta$isDragging2, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
183
+ var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _activeNode3, _activeNode4, _meta$isDragging, _latestActiveNode11, _latestActiveNode12, _meta$isDragging2, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
184
184
  var activeNode = currentState.activeNode,
185
185
  decorations = currentState.decorations,
186
186
  isResizerResizing = currentState.isResizerResizing,
@@ -308,12 +308,14 @@ export var newApply = function newApply(api, formatMessage, tr, currentState, ne
308
308
 
309
309
  // Check if there's a new active node, and it differs from the last
310
310
  var activeNodeChanged = (meta === null || meta === void 0 ? void 0 : meta.activeNode) && ((meta === null || meta === void 0 ? void 0 : meta.activeNode.pos) !== ((_activeNode = activeNode) === null || _activeNode === void 0 ? void 0 : _activeNode.pos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.anchorName) !== ((_activeNode2 = activeNode) === null || _activeNode2 === void 0 ? void 0 : _activeNode2.anchorName) || (meta === null || meta === void 0 || (_meta$activeNode$hand = meta.activeNode.handleOptions) === null || _meta$activeNode$hand === void 0 ? void 0 : _meta$activeNode$hand.isFocused));
311
+ var rootActiveNodeChanged = (meta === null || meta === void 0 ? void 0 : meta.activeNode) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.rootPos) !== ((_activeNode3 = activeNode) === null || _activeNode3 === void 0 ? void 0 : _activeNode3.rootPos) && (meta === null || meta === void 0 ? void 0 : meta.activeNode.rootAnchorName) !== ((_activeNode4 = activeNode) === null || _activeNode4 === void 0 ? void 0 : _activeNode4.rootAnchorName);
311
312
 
312
313
  // Some browsers don't support anchor positioning, meaning we need to replace the handle when nodes change
313
314
  var handleNeedsRedraw = shouldRedrawNodeDecs && !isAnchorSupported();
314
315
 
315
316
  // Create/recreate handle dec when the active node is missing/changes, or the editor viewport has changed (non-anchor pos workaround)
316
317
  var shouldRecreateHandle = latestActiveNode && (activeNodeChanged || isActiveNodeModified || editorSizeChanged || handleNeedsRedraw);
318
+ var shouldRecreateQuickInsertButton = latestActiveNode && (rootActiveNodeChanged || isActiveNodeModified || editorSizeChanged || handleNeedsRedraw);
317
319
  var shouldRemoveHandle = false;
318
320
  if (fg('platform_editor_remove_drag_handle_fix')) {
319
321
  // If the active node is missing, we need to remove the handle
@@ -323,29 +325,29 @@ export var newApply = function newApply(api, formatMessage, tr, currentState, ne
323
325
  shouldRemoveHandle = latestActiveNode && (isResizerResizing || isActiveNodeDeleted || (meta === null || meta === void 0 ? void 0 : meta.nodeMoved));
324
326
  }
325
327
  if (shouldRemoveHandle) {
326
- var _activeNode3, _activeNode4;
327
- var oldHandle = findHandleDec(decorations, (_activeNode3 = activeNode) === null || _activeNode3 === void 0 ? void 0 : _activeNode3.pos, (_activeNode4 = activeNode) === null || _activeNode4 === void 0 ? void 0 : _activeNode4.pos);
328
+ var _activeNode5, _activeNode6;
329
+ var oldHandle = findHandleDec(decorations, (_activeNode5 = activeNode) === null || _activeNode5 === void 0 ? void 0 : _activeNode5.pos, (_activeNode6 = activeNode) === null || _activeNode6 === void 0 ? void 0 : _activeNode6.pos);
328
330
  decorations = decorations.remove(oldHandle);
329
331
  if (editorExperiment('platform_editor_controls', 'variant1')) {
330
332
  var oldQuickInsertButton = findQuickInsertInsertButtonDecoration(decorations);
331
333
  decorations = decorations.remove(oldQuickInsertButton);
332
334
  }
333
- } else if (api && shouldRecreateHandle) {
334
- var _activeNode5, _activeNode6, _latestActiveNode, _latestActiveNode2, _latestActiveNode3, _latestActiveNode4;
335
- var _oldHandle = findHandleDec(decorations, (_activeNode5 = activeNode) === null || _activeNode5 === void 0 ? void 0 : _activeNode5.pos, (_activeNode6 = activeNode) === null || _activeNode6 === void 0 ? void 0 : _activeNode6.pos);
336
- decorations = decorations.remove(_oldHandle);
337
- var handleDec = dragHandleDecoration(api, formatMessage, (_latestActiveNode = latestActiveNode) === null || _latestActiveNode === void 0 ? void 0 : _latestActiveNode.pos, (_latestActiveNode2 = latestActiveNode) === null || _latestActiveNode2 === void 0 ? void 0 : _latestActiveNode2.anchorName, (_latestActiveNode3 = latestActiveNode) === null || _latestActiveNode3 === void 0 ? void 0 : _latestActiveNode3.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode4 = latestActiveNode) === null || _latestActiveNode4 === void 0 ? void 0 : _latestActiveNode4.handleOptions);
338
- if (editorExperiment('platform_editor_controls', 'variant1')) {
339
- var _latestActiveNode5;
340
- if (((_latestActiveNode5 = latestActiveNode) === null || _latestActiveNode5 === void 0 ? void 0 : _latestActiveNode5.rootPos) !== undefined) {
341
- var _latestActiveNode6, _latestActiveNode7, _latestActiveNode8, _latestActiveNode9, _latestActiveNode10;
342
- var _oldQuickInsertButton = findQuickInsertInsertButtonDecoration(decorations);
343
- decorations = decorations.remove(_oldQuickInsertButton);
344
- var quickInsertButton = quickInsertButtonDecoration(api, formatMessage, (_latestActiveNode6 = latestActiveNode) === null || _latestActiveNode6 === void 0 ? void 0 : _latestActiveNode6.rootPos, (_latestActiveNode7 = latestActiveNode) === null || _latestActiveNode7 === void 0 ? void 0 : _latestActiveNode7.anchorName, (_latestActiveNode8 = latestActiveNode) === null || _latestActiveNode8 === void 0 ? void 0 : _latestActiveNode8.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode9 = latestActiveNode) === null || _latestActiveNode9 === void 0 ? void 0 : _latestActiveNode9.rootAnchorName, (_latestActiveNode10 = latestActiveNode) === null || _latestActiveNode10 === void 0 ? void 0 : _latestActiveNode10.rootNodeType);
345
- decorations = decorations.add(newState.doc, [quickInsertButton]);
346
- }
335
+ } else if (api) {
336
+ var _latestActiveNode5;
337
+ if (shouldRecreateHandle) {
338
+ var _activeNode7, _activeNode8, _latestActiveNode, _latestActiveNode2, _latestActiveNode3, _latestActiveNode4;
339
+ var _oldHandle = findHandleDec(decorations, (_activeNode7 = activeNode) === null || _activeNode7 === void 0 ? void 0 : _activeNode7.pos, (_activeNode8 = activeNode) === null || _activeNode8 === void 0 ? void 0 : _activeNode8.pos);
340
+ decorations = decorations.remove(_oldHandle);
341
+ var handleDec = dragHandleDecoration(api, formatMessage, (_latestActiveNode = latestActiveNode) === null || _latestActiveNode === void 0 ? void 0 : _latestActiveNode.pos, (_latestActiveNode2 = latestActiveNode) === null || _latestActiveNode2 === void 0 ? void 0 : _latestActiveNode2.anchorName, (_latestActiveNode3 = latestActiveNode) === null || _latestActiveNode3 === void 0 ? void 0 : _latestActiveNode3.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode4 = latestActiveNode) === null || _latestActiveNode4 === void 0 ? void 0 : _latestActiveNode4.handleOptions);
342
+ decorations = decorations.add(newState.doc, [handleDec]);
343
+ }
344
+ if (shouldRecreateQuickInsertButton && ((_latestActiveNode5 = latestActiveNode) === null || _latestActiveNode5 === void 0 ? void 0 : _latestActiveNode5.rootPos) !== undefined && editorExperiment('platform_editor_controls', 'variant1')) {
345
+ var _activeNode9, _activeNode10, _latestActiveNode6, _latestActiveNode7, _latestActiveNode8, _latestActiveNode9, _latestActiveNode10;
346
+ var _oldQuickInsertButton = findQuickInsertInsertButtonDecoration(decorations, (_activeNode9 = activeNode) === null || _activeNode9 === void 0 ? void 0 : _activeNode9.rootPos, (_activeNode10 = activeNode) === null || _activeNode10 === void 0 ? void 0 : _activeNode10.rootPos);
347
+ decorations = decorations.remove(_oldQuickInsertButton);
348
+ var quickInsertButton = quickInsertButtonDecoration(api, formatMessage, (_latestActiveNode6 = latestActiveNode) === null || _latestActiveNode6 === void 0 ? void 0 : _latestActiveNode6.rootPos, (_latestActiveNode7 = latestActiveNode) === null || _latestActiveNode7 === void 0 ? void 0 : _latestActiveNode7.anchorName, (_latestActiveNode8 = latestActiveNode) === null || _latestActiveNode8 === void 0 ? void 0 : _latestActiveNode8.nodeType, nodeViewPortalProviderAPI, (_latestActiveNode9 = latestActiveNode) === null || _latestActiveNode9 === void 0 ? void 0 : _latestActiveNode9.rootAnchorName, (_latestActiveNode10 = latestActiveNode) === null || _latestActiveNode10 === void 0 ? void 0 : _latestActiveNode10.rootNodeType);
349
+ decorations = decorations.add(newState.doc, [quickInsertButton]);
347
350
  }
348
- decorations = decorations.add(newState.doc, [handleDec]);
349
351
  }
350
352
 
351
353
  // Drop targets may be missing when the node count is being changed during a drag
@@ -1,7 +1,6 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  var _dropTargetMarginMap;
3
3
  import { akEditorUnitZIndex, akRichMediaResizeZIndex } from '@atlaskit/editor-shared-styles';
4
- import { fg } from '@atlaskit/platform-feature-flags';
5
4
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
6
5
  export var DRAG_HANDLE_HEIGHT = 24;
7
6
  export var DRAG_HANDLE_WIDTH = 12;
@@ -34,9 +33,10 @@ export var QUICK_INSERT_DIMENSIONS = {
34
33
  width: QUICK_INSERT_WIDTH,
35
34
  height: QUICK_INSERT_HEIGHT
36
35
  };
36
+ export var QUICK_INSERT_LEFT_OFFSET = 16;
37
37
  var nodeTypeExcludeList = ['embedCard', 'mediaSingle', 'table'];
38
38
  export var dragHandleGap = function dragHandleGap(nodeType, parentNodeType) {
39
- if (nodeType === 'layoutSection' && fg('platform_editor_advanced_layouts_post_fix_patch_2')) {
39
+ if (nodeType === 'layoutSection') {
40
40
  return DRAG_HANDLE_DEFAULT_GAP + 20;
41
41
  }
42
42
  if (parentNodeType && parentNodeType !== 'doc') {
@@ -10,7 +10,7 @@ import { Box, Pressable, xcss } from '@atlaskit/primitives';
10
10
  import Tooltip from '@atlaskit/tooltip';
11
11
  import { getTopPosition } from '../pm-plugins/utils/drag-handle-positions';
12
12
  import { getLeftPositionForRootElement } from '../pm-plugins/utils/widget-positions';
13
- import { QUICK_INSERT_DIMENSIONS, rootElementGap, topPositionAdjustment } from './consts';
13
+ import { rootElementGap, topPositionAdjustment, QUICK_INSERT_DIMENSIONS, QUICK_INSERT_LEFT_OFFSET } from './consts';
14
14
  import { isNestedNodeSelected, isNonEditableBlock, isSelectionInNode } from './utils/document-checks';
15
15
  import { createNewLine } from './utils/editor-commands';
16
16
  var buttonStyles = xcss({
@@ -48,8 +48,6 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
48
48
  api = _ref.api,
49
49
  formatMessage = _ref.formatMessage,
50
50
  getPos = _ref.getPos,
51
- nodeType = _ref.nodeType,
52
- anchorName = _ref.anchorName,
53
51
  rootAnchorName = _ref.rootAnchorName,
54
52
  rootNodeType = _ref.rootNodeType;
55
53
  var macroInteractionUpdates = useSharedPluginStateSelector(api, 'featureFlags.macroInteractionUpdates');
@@ -87,18 +85,17 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
87
85
  }
88
86
  }
89
87
  var isEdgeCase = (hasResizer || isExtension || isEmbedCard || isBlockCard) && innerContainer;
90
- var neighboringWidthOffset = anchorName === rootAnchorName ? '-16px' : '0px';
91
88
  if (supportsAnchor) {
92
89
  return {
93
- left: isEdgeCase ? "calc(anchor(".concat(rootAnchorName, " start) + ").concat(getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + ").concat(neighboringWidthOffset, ")") : "calc(anchor(".concat(rootAnchorName, " start) - ").concat(QUICK_INSERT_DIMENSIONS.width, "px - ").concat(rootElementGap(rootNodeType), "px + ").concat(neighboringWidthOffset, ")"),
90
+ left: isEdgeCase ? "calc(anchor(".concat(rootAnchorName, " start) + ").concat(getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + -").concat(QUICK_INSERT_LEFT_OFFSET, "px)") : "calc(anchor(".concat(rootAnchorName, " start) - ").concat(QUICK_INSERT_DIMENSIONS.width, "px - ").concat(rootElementGap(rootNodeType), "px + -").concat(QUICK_INSERT_LEFT_OFFSET, "px)"),
94
91
  top: "calc(anchor(".concat(rootAnchorName, " start) + ").concat(topPositionAdjustment(rootNodeType), "px)")
95
92
  };
96
93
  }
97
94
  return {
98
- left: isEdgeCase ? "calc(".concat((dom === null || dom === void 0 ? void 0 : dom.offsetLeft) || 0, "px + ").concat(getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + ").concat(neighboringWidthOffset, ")") : "calc(".concat(getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + ").concat(neighboringWidthOffset, ")"),
95
+ left: isEdgeCase ? "calc(".concat((dom === null || dom === void 0 ? void 0 : dom.offsetLeft) || 0, "px + ").concat(getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + -").concat(QUICK_INSERT_LEFT_OFFSET, "px)") : "calc(".concat(getLeftPositionForRootElement(dom, rootNodeType, QUICK_INSERT_DIMENSIONS, innerContainer, isMacroInteractionUpdates), " + -").concat(QUICK_INSERT_LEFT_OFFSET, "px)"),
99
96
  top: getTopPosition(dom, rootNodeType)
100
97
  };
101
- }, [rootAnchorName, view.dom, rootNodeType, macroInteractionUpdates, anchorName]);
98
+ }, [rootAnchorName, view.dom, rootNodeType, macroInteractionUpdates]);
102
99
  useEffect(function () {
103
100
  var cleanUpTransitionListener;
104
101
  if (rootNodeType === 'extension' || rootNodeType === 'embedCard') {
@@ -28,6 +28,7 @@ export declare const QUICK_INSERT_DIMENSIONS: {
28
28
  width: number;
29
29
  height: number;
30
30
  };
31
+ export declare const QUICK_INSERT_LEFT_OFFSET = 16;
31
32
  export declare const dragHandleGap: (nodeType: string, parentNodeType?: string) => number;
32
33
  export declare const rootElementGap: (nodeType: string) => number;
33
34
  export declare const getNestedNodeLeftPaddingMargin: (nodeType?: string) => "8px" | "16px" | "20px" | "24px" | "28px" | "40px";
@@ -13,5 +13,5 @@ type Props = {
13
13
  rootAnchorName?: string;
14
14
  rootNodeType: string;
15
15
  };
16
- export declare const TypeAheadControl: ({ view, api, formatMessage, getPos, nodeType, anchorName, rootAnchorName, rootNodeType, }: Props) => React.JSX.Element;
16
+ export declare const TypeAheadControl: ({ view, api, formatMessage, getPos, rootAnchorName, rootNodeType, }: Props) => React.JSX.Element;
17
17
  export {};
@@ -28,6 +28,7 @@ export declare const QUICK_INSERT_DIMENSIONS: {
28
28
  width: number;
29
29
  height: number;
30
30
  };
31
+ export declare const QUICK_INSERT_LEFT_OFFSET = 16;
31
32
  export declare const dragHandleGap: (nodeType: string, parentNodeType?: string) => number;
32
33
  export declare const rootElementGap: (nodeType: string) => number;
33
34
  export declare const getNestedNodeLeftPaddingMargin: (nodeType?: string) => "8px" | "16px" | "20px" | "24px" | "28px" | "40px";
@@ -13,5 +13,5 @@ type Props = {
13
13
  rootAnchorName?: string;
14
14
  rootNodeType: string;
15
15
  };
16
- export declare const TypeAheadControl: ({ view, api, formatMessage, getPos, nodeType, anchorName, rootAnchorName, rootNodeType, }: Props) => React.JSX.Element;
16
+ export declare const TypeAheadControl: ({ view, api, formatMessage, getPos, rootAnchorName, rootNodeType, }: Props) => React.JSX.Element;
17
17
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "3.3.16",
3
+ "version": "3.3.18",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -122,9 +122,6 @@
122
122
  "platform_editor_use_nested_table_pm_nodes": {
123
123
  "type": "boolean"
124
124
  },
125
- "platform_editor_advanced_layouts_post_fix_patch_2": {
126
- "type": "boolean"
127
- },
128
125
  "platform_editor_advanced_layouts_post_fix_patch_3": {
129
126
  "type": "boolean"
130
127
  },