@atlaskit/editor-plugin-block-controls 8.0.14 → 8.0.15

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 8.0.15
+
+### Patch Changes
+
+- [`131735fb6ad06`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/131735fb6ad06) -
+  [ux] EDITOR-4281 Expand preserved selection edge case
+- Updated dependencies
+
 ## 8.0.14
 
 ### Patch Changes

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.mapPreservedSelection = exports.getSelectedSlicePosition = exports.getMultiSelectionIfPosInside = exports.expandSelectionHeadToNodeAtPos = exports.createPreservedSelection = exports.alignAnchorHeadInDirectionOfPos = void 0;
+exports.mapPreservedSelection = exports.getSelectedSlicePosition = exports.getMultiSelectionIfPosInside = exports.expandSelectionHeadToNodeAtPos = exports.createPreservedSelection = exports.alignAnchorHeadInDirectionOfPos = exports.adjustSelectionBoundsForEdgePositions = void 0;
 var _selection = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-tables/utils");
@@ -103,7 +103,58 @@ var mapPreservedSelection = exports.mapPreservedSelection = function mapPreserve
   }
   return createPreservedSelection(tr.doc.resolve(from), tr.doc.resolve(to));
 };
+var isInsideEmptyTextblock = function isInsideEmptyTextblock($pos) {
+  return $pos.parent.isTextblock && $pos.parent.content.size === 0;
+};
+var isAtEndOfParent = function isAtEndOfParent($pos) {
+  return $pos.parentOffset === $pos.parent.content.size;
+};
+var isAtStartOfParent = function isAtStartOfParent($pos) {
+  return $pos.parentOffset === 0;
+};
 
+/**
+ * Adjust selection bounds to exclude nodes where the selection only touches
+ * the edge position without selecting any content.
+ *
+ * Exception: Don't adjust if the selection is inside an empty textblock,
+ * as we want to include empty paragraphs in block operations.
+ *
+ * @param $from The resolved position of the start of the selection
+ * @param $to The resolved position of the end of the selection
+ * @returns Adjusted $from and $to positions
+ */
+var adjustSelectionBoundsForEdgePositions = exports.adjustSelectionBoundsForEdgePositions = function adjustSelectionBoundsForEdgePositions($from, $to) {
+  var doc = $from.doc;
+
+  // Walk $from forward while at end of ancestors
+  var adjustedFrom = $from;
+  if (!isInsideEmptyTextblock($from)) {
+    while (adjustedFrom.depth > 0 && isAtEndOfParent(adjustedFrom)) {
+      var nextPos = adjustedFrom.after();
+      if (nextPos > doc.content.size || nextPos === adjustedFrom.pos) {
+        break;
+      }
+      adjustedFrom = doc.resolve(nextPos);
+    }
+  }
+
+  // Walk $to backward while at start of ancestors
+  var adjustedTo = $to;
+  if (!isInsideEmptyTextblock($to)) {
+    while (adjustedTo.depth > 0 && isAtStartOfParent(adjustedTo)) {
+      var prevPos = adjustedTo.before();
+      if (prevPos < 0 || prevPos === adjustedTo.pos) {
+        break;
+      }
+      adjustedTo = doc.resolve(prevPos);
+    }
+  }
+  return {
+    $from: adjustedFrom,
+    $to: adjustedTo
+  };
+};
 /**
  * Creates a preserved selection which is expanded to block boundaries.
  *
@@ -119,9 +170,17 @@ var mapPreservedSelection = exports.mapPreservedSelection = function mapPreserve
 var createPreservedSelection = exports.createPreservedSelection = function createPreservedSelection($from, $to) {
   var _doc$nodeAt;
   var doc = $from.doc;
+  var isCollapsed = $from.pos === $to.pos;
+  var adjusted = isCollapsed ? {
+    $from: $from,
+    $to: $to
+  } : adjustSelectionBoundsForEdgePositions($from, $to);
+  if (!isCollapsed && adjusted.$from.pos >= adjusted.$to.pos) {
+    return undefined;
+  }
 
   // expand the selection range to block boundaries, so selection always includes whole nodes
-  var expanded = (0, _selection.expandToBlockRange)($from, $to);
+  var expanded = (0, _selection.expandToBlockRange)(adjusted.$from, adjusted.$to);
 
   // stop preserving if selection becomes invalid
   if (expanded.$from.pos < 0 || expanded.$to.pos > doc.content.size || expanded.$from.pos >= expanded.$to.pos) {

package/dist/cjs/ui/drag-handle.js

@@ -358,7 +358,11 @@ var getExpandedSelectionRange = function getExpandedSelectionRange(_ref) {
   var selectUp = resolvedStartPos.pos < selection.from;
   var $from = isShiftPressed && selectUp ? resolvedStartPos : selection.$from;
   var $to = isShiftPressed && !selectUp ? doc.resolve(resolvedStartPos.pos + 1) : selection.$to;
-  return (0, _selection.expandToBlockRange)($from, $to);
+  var adjusted = isShiftPressed ? {
+    $from: $from,
+    $to: $to
+  } : (0, _selection2.adjustSelectionBoundsForEdgePositions)($from, $to);
+  return (0, _selection.expandToBlockRange)(adjusted.$from, adjusted.$to);
 };
 /**
  * Updates the transaction with preserved selection logic.

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

@@ -99,7 +99,54 @@ export const mapPreservedSelection = (selection, tr) => {
   }
   return createPreservedSelection(tr.doc.resolve(from), tr.doc.resolve(to));
 };
+const isInsideEmptyTextblock = $pos => $pos.parent.isTextblock && $pos.parent.content.size === 0;
+const isAtEndOfParent = $pos => $pos.parentOffset === $pos.parent.content.size;
+const isAtStartOfParent = $pos => $pos.parentOffset === 0;
 
+/**
+ * Adjust selection bounds to exclude nodes where the selection only touches
+ * the edge position without selecting any content.
+ *
+ * Exception: Don't adjust if the selection is inside an empty textblock,
+ * as we want to include empty paragraphs in block operations.
+ *
+ * @param $from The resolved position of the start of the selection
+ * @param $to The resolved position of the end of the selection
+ * @returns Adjusted $from and $to positions
+ */
+export const adjustSelectionBoundsForEdgePositions = ($from, $to) => {
+  const {
+    doc
+  } = $from;
+
+  // Walk $from forward while at end of ancestors
+  let adjustedFrom = $from;
+  if (!isInsideEmptyTextblock($from)) {
+    while (adjustedFrom.depth > 0 && isAtEndOfParent(adjustedFrom)) {
+      const nextPos = adjustedFrom.after();
+      if (nextPos > doc.content.size || nextPos === adjustedFrom.pos) {
+        break;
+      }
+      adjustedFrom = doc.resolve(nextPos);
+    }
+  }
+
+  // Walk $to backward while at start of ancestors
+  let adjustedTo = $to;
+  if (!isInsideEmptyTextblock($to)) {
+    while (adjustedTo.depth > 0 && isAtStartOfParent(adjustedTo)) {
+      const prevPos = adjustedTo.before();
+      if (prevPos < 0 || prevPos === adjustedTo.pos) {
+        break;
+      }
+      adjustedTo = doc.resolve(prevPos);
+    }
+  }
+  return {
+    $from: adjustedFrom,
+    $to: adjustedTo
+  };
+};
 /**
  * Creates a preserved selection which is expanded to block boundaries.
  *
@@ -117,9 +164,17 @@ export const createPreservedSelection = ($from, $to) => {
   const {
     doc
   } = $from;
+  const isCollapsed = $from.pos === $to.pos;
+  const adjusted = isCollapsed ? {
+    $from,
+    $to
+  } : adjustSelectionBoundsForEdgePositions($from, $to);
+  if (!isCollapsed && adjusted.$from.pos >= adjusted.$to.pos) {
+    return undefined;
+  }
 
   // expand the selection range to block boundaries, so selection always includes whole nodes
-  const expanded = expandToBlockRange($from, $to);
+  const expanded = expandToBlockRange(adjusted.$from, adjusted.$to);
 
   // stop preserving if selection becomes invalid
   if (expanded.$from.pos < 0 || expanded.$to.pos > doc.content.size || expanded.$from.pos >= expanded.$to.pos) {

package/dist/es2019/ui/drag-handle.js

@@ -37,7 +37,7 @@ import { selectionPreservationPluginKey } from '../pm-plugins/selection-preserva
 import { getMultiSelectAnalyticsAttributes } from '../pm-plugins/utils/analytics';
 import { getControlBottomCSSValue, getControlHeightCSSValue, getLeftPosition, getNodeHeight, getTopPosition, shouldBeSticky, shouldMaskNodeControls } from '../pm-plugins/utils/drag-handle-positions';
 import { isHandleCorrelatedToSelection, selectNode } from '../pm-plugins/utils/getSelection';
-import { alignAnchorHeadInDirectionOfPos, expandSelectionHeadToNodeAtPos } from '../pm-plugins/utils/selection';
+import { adjustSelectionBoundsForEdgePositions, alignAnchorHeadInDirectionOfPos, expandSelectionHeadToNodeAtPos } from '../pm-plugins/utils/selection';
 import { DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH, DRAG_HANDLE_ZINDEX, dragHandleGap, nodeMargins, spacingBetweenNodesForPreview, STICKY_CONTROLS_TOP_MARGIN, STICKY_CONTROLS_TOP_MARGIN_FOR_STICKY_HEADER, topPositionAdjustment } from './consts';
 import { dragPreview } from './drag-preview';
 import { refreshAnchorName } from './utils/anchor-name';
@@ -354,7 +354,11 @@ const getExpandedSelectionRange = ({
   const selectUp = resolvedStartPos.pos < selection.from;
   const $from = isShiftPressed && selectUp ? resolvedStartPos : selection.$from;
   const $to = isShiftPressed && !selectUp ? doc.resolve(resolvedStartPos.pos + 1) : selection.$to;
-  return expandToBlockRange($from, $to);
+  const adjusted = isShiftPressed ? {
+    $from,
+    $to
+  } : adjustSelectionBoundsForEdgePositions($from, $to);
+  return expandToBlockRange(adjusted.$from, adjusted.$to);
 };
 /**
  * Updates the transaction with preserved selection logic.

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

@@ -97,7 +97,58 @@ export var mapPreservedSelection = function mapPreservedSelection(selection, tr)
   }
   return createPreservedSelection(tr.doc.resolve(from), tr.doc.resolve(to));
 };
+var isInsideEmptyTextblock = function isInsideEmptyTextblock($pos) {
+  return $pos.parent.isTextblock && $pos.parent.content.size === 0;
+};
+var isAtEndOfParent = function isAtEndOfParent($pos) {
+  return $pos.parentOffset === $pos.parent.content.size;
+};
+var isAtStartOfParent = function isAtStartOfParent($pos) {
+  return $pos.parentOffset === 0;
+};
 
+/**
+ * Adjust selection bounds to exclude nodes where the selection only touches
+ * the edge position without selecting any content.
+ *
+ * Exception: Don't adjust if the selection is inside an empty textblock,
+ * as we want to include empty paragraphs in block operations.
+ *
+ * @param $from The resolved position of the start of the selection
+ * @param $to The resolved position of the end of the selection
+ * @returns Adjusted $from and $to positions
+ */
+export var adjustSelectionBoundsForEdgePositions = function adjustSelectionBoundsForEdgePositions($from, $to) {
+  var doc = $from.doc;
+
+  // Walk $from forward while at end of ancestors
+  var adjustedFrom = $from;
+  if (!isInsideEmptyTextblock($from)) {
+    while (adjustedFrom.depth > 0 && isAtEndOfParent(adjustedFrom)) {
+      var nextPos = adjustedFrom.after();
+      if (nextPos > doc.content.size || nextPos === adjustedFrom.pos) {
+        break;
+      }
+      adjustedFrom = doc.resolve(nextPos);
+    }
+  }
+
+  // Walk $to backward while at start of ancestors
+  var adjustedTo = $to;
+  if (!isInsideEmptyTextblock($to)) {
+    while (adjustedTo.depth > 0 && isAtStartOfParent(adjustedTo)) {
+      var prevPos = adjustedTo.before();
+      if (prevPos < 0 || prevPos === adjustedTo.pos) {
+        break;
+      }
+      adjustedTo = doc.resolve(prevPos);
+    }
+  }
+  return {
+    $from: adjustedFrom,
+    $to: adjustedTo
+  };
+};
 /**
  * Creates a preserved selection which is expanded to block boundaries.
  *
@@ -113,9 +164,17 @@ export var mapPreservedSelection = function mapPreservedSelection(selection, tr)
 export var createPreservedSelection = function createPreservedSelection($from, $to) {
   var _doc$nodeAt;
   var doc = $from.doc;
+  var isCollapsed = $from.pos === $to.pos;
+  var adjusted = isCollapsed ? {
+    $from: $from,
+    $to: $to
+  } : adjustSelectionBoundsForEdgePositions($from, $to);
+  if (!isCollapsed && adjusted.$from.pos >= adjusted.$to.pos) {
+    return undefined;
+  }
 
   // expand the selection range to block boundaries, so selection always includes whole nodes
-  var expanded = expandToBlockRange($from, $to);
+  var expanded = expandToBlockRange(adjusted.$from, adjusted.$to);
 
   // stop preserving if selection becomes invalid
   if (expanded.$from.pos < 0 || expanded.$to.pos > doc.content.size || expanded.$from.pos >= expanded.$to.pos) {

package/dist/esm/ui/drag-handle.js

@@ -42,7 +42,7 @@ import { selectionPreservationPluginKey } from '../pm-plugins/selection-preserva
 import { getMultiSelectAnalyticsAttributes } from '../pm-plugins/utils/analytics';
 import { getControlBottomCSSValue, getControlHeightCSSValue, getLeftPosition, getNodeHeight, getTopPosition, shouldBeSticky, shouldMaskNodeControls } from '../pm-plugins/utils/drag-handle-positions';
 import { isHandleCorrelatedToSelection, selectNode } from '../pm-plugins/utils/getSelection';
-import { alignAnchorHeadInDirectionOfPos, expandSelectionHeadToNodeAtPos } from '../pm-plugins/utils/selection';
+import { adjustSelectionBoundsForEdgePositions, alignAnchorHeadInDirectionOfPos, expandSelectionHeadToNodeAtPos } from '../pm-plugins/utils/selection';
 import { DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH, DRAG_HANDLE_ZINDEX, dragHandleGap, nodeMargins, spacingBetweenNodesForPreview, STICKY_CONTROLS_TOP_MARGIN, STICKY_CONTROLS_TOP_MARGIN_FOR_STICKY_HEADER, topPositionAdjustment } from './consts';
 import { dragPreview } from './drag-preview';
 import { refreshAnchorName } from './utils/anchor-name';
@@ -355,7 +355,11 @@ var getExpandedSelectionRange = function getExpandedSelectionRange(_ref) {
   var selectUp = resolvedStartPos.pos < selection.from;
   var $from = isShiftPressed && selectUp ? resolvedStartPos : selection.$from;
   var $to = isShiftPressed && !selectUp ? doc.resolve(resolvedStartPos.pos + 1) : selection.$to;
-  return expandToBlockRange($from, $to);
+  var adjusted = isShiftPressed ? {
+    $from: $from,
+    $to: $to
+  } : adjustSelectionBoundsForEdgePositions($from, $to);
+  return expandToBlockRange(adjusted.$from, adjusted.$to);
 };
 /**
  * Updates the transaction with preserved selection logic.

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

@@ -39,6 +39,21 @@ export declare const alignAnchorHeadInDirectionOfPos: (selection: Selection, pos
  * @returns The mapped selection or undefined if mapping is not possible
  */
 export declare const mapPreservedSelection: (selection: Selection, tr: ReadonlyTransaction | Transaction) => Selection | undefined;
+/**
+ * Adjust selection bounds to exclude nodes where the selection only touches
+ * the edge position without selecting any content.
+ *
+ * Exception: Don't adjust if the selection is inside an empty textblock,
+ * as we want to include empty paragraphs in block operations.
+ *
+ * @param $from The resolved position of the start of the selection
+ * @param $to The resolved position of the end of the selection
+ * @returns Adjusted $from and $to positions
+ */
+export declare const adjustSelectionBoundsForEdgePositions: ($from: ResolvedPos, $to: ResolvedPos) => {
+    $from: ResolvedPos;
+    $to: ResolvedPos;
+};
 /**
  * Creates a preserved selection which is expanded to block boundaries.
  *

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

@@ -39,6 +39,21 @@ export declare const alignAnchorHeadInDirectionOfPos: (selection: Selection, pos
  * @returns The mapped selection or undefined if mapping is not possible
  */
 export declare const mapPreservedSelection: (selection: Selection, tr: ReadonlyTransaction | Transaction) => Selection | undefined;
+/**
+ * Adjust selection bounds to exclude nodes where the selection only touches
+ * the edge position without selecting any content.
+ *
+ * Exception: Don't adjust if the selection is inside an empty textblock,
+ * as we want to include empty paragraphs in block operations.
+ *
+ * @param $from The resolved position of the start of the selection
+ * @param $to The resolved position of the end of the selection
+ * @returns Adjusted $from and $to positions
+ */
+export declare const adjustSelectionBoundsForEdgePositions: ($from: ResolvedPos, $to: ResolvedPos) => {
+    $from: ResolvedPos;
+    $to: ResolvedPos;
+};
 /**
  * Creates a preserved selection which is expanded to block boundaries.
  *

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "8.0.14",
+	"version": "8.0.15",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -42,7 +42,7 @@
 		"@atlaskit/editor-plugin-toolbar": "^4.1.0",
 		"@atlaskit/editor-plugin-type-ahead": "^7.0.0",
 		"@atlaskit/editor-plugin-user-intent": "^5.0.0",
-		"@atlaskit/editor-plugin-width": "^8.0.0",
+		"@atlaskit/editor-plugin-width": "^8.1.0",
 		"@atlaskit/editor-prosemirror": "^7.2.0",
 		"@atlaskit/editor-shared-styles": "^3.10.0",
 		"@atlaskit/editor-tables": "^2.9.0",
@@ -54,7 +54,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
 		"@atlaskit/primitives": "^17.1.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^16.30.0",
+		"@atlaskit/tmp-editor-statsig": "^16.35.0",
 		"@atlaskit/tokens": "^10.1.0",
 		"@atlaskit/tooltip": "^20.14.0",
 		"@babel/runtime": "^7.0.0",
@@ -66,7 +66,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^111.8.0",
+		"@atlaskit/editor-common": "^111.9.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"