@atlaskit/editor-plugin-block-controls 7.12.0 → 7.13.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 7.13.0
+
+### Minor Changes
+
+- [`b3a509f727a0f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b3a509f727a0f) -
+  ED-29696 update CSS anchor selector to enable less anchors
+
+### Patch Changes
+
+- Updated dependencies
+
+## 7.12.1
+
+### Patch Changes
+
+- [`79cafe9f09a05`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/79cafe9f09a05) -
+  EDITOR-3756 More general approach to support custom preserved selection mapping
+
 ## 7.12.0
 
 ### Minor Changes

package/dist/cjs/editor-commands/move-node.js

@@ -15,6 +15,7 @@ var _types = require("@atlaskit/editor-common/types");
 var _utils = require("@atlaskit/editor-common/utils");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _transform = require("@atlaskit/editor-prosemirror/transform");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _utils3 = require("@atlaskit/editor-tables/utils");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -426,7 +427,11 @@ var moveNode = exports.moveNode = function moveNode(api) {
       if (inputMethod === _analytics.INPUT_METHOD.DRAG_AND_DROP) {
         tr = (0, _getSelection.setCursorPositionAtMovedNode)(tr, mappedTo, api);
       } else if (preservedSelection) {
-        // do nothing here to allow the selection preservation plugin to handle mapping the selection
+        var _currMeta = tr.getMeta(_main.key);
+        var nodeMovedOffset = mappedTo - sliceFrom;
+        tr.setMeta(_main.key, _objectSpread(_objectSpread({}, _currMeta), {}, {
+          preservedSelectionMapping: new _transform.Mapping([new _transform.StepMap([0, 0, nodeMovedOffset])])
+        }));
       } else if (isMultiSelect) {
         var _api$blockControls$co;
         tr = (_api$blockControls$co = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
@@ -437,8 +442,7 @@ var moveNode = exports.moveNode = function moveNode(api) {
       }
       var currMeta = tr.getMeta(_main.key);
       tr.setMeta(_main.key, _objectSpread(_objectSpread({}, currMeta), {}, {
-        nodeMoved: true,
-        nodeMovedOffset: mappedTo - sliceFrom
+        nodeMoved: true
       }));
       api === null || api === void 0 || api.core.actions.focus();
       var $mappedTo = tr.doc.resolve(mappedTo);

package/dist/cjs/pm-plugins/handle-mouse-over.js

@@ -32,7 +32,7 @@ var getNodeSelector = function getNodeSelector(ignoreNodes, ignoreNodeDescendant
   var ignoreNodeDescendantsSelectorList = ignoreNodeDescendants.map(function (node) {
     if (node === 'table') {
       // Special case for table to exclude its direct descendants
-      return ["[data-prosemirror-node-name=\"tableCell\"] > [data-node-anchor]", "[data-prosemirror-node-name=\"tableHeader\"] > [data-node-anchor]"];
+      return ["[data-prosemirror-node-name=\"tableCell\"] > [data-node-anchor]", "[data-prosemirror-node-name=\"tableCell\"] > *:not([data-node-anchor]) > [data-node-anchor]", "[data-prosemirror-node-name=\"tableHeader\"] > [data-node-anchor]", "[data-prosemirror-node-name=\"tableHeader\"] > *:not([data-node-anchor]) > [data-node-anchor]"];
     }
     return "[data-prosemirror-node-name=\"".concat(node, "\"] [data-node-anchor]");
   });

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

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.mapPreservedSelection = exports.getSelectedSlicePosition = exports.getMultiSelectionIfPosInside = exports.expandSelectionHeadToNodeAtPos = exports.alignAnchorHeadInDirectionOfPos = void 0;
 var _selection = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
-var _transform = require("@atlaskit/editor-prosemirror/transform");
 var _main = require("../main");
 var _getSelection = require("./getSelection");
 var getMultiSelectionIfPosInside = exports.getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(api, pos, tr) {
@@ -91,9 +90,8 @@ var alignAnchorHeadInDirectionOfPos = exports.alignAnchorHeadInDirectionOfPos =
  */
 var mapPreservedSelection = exports.mapPreservedSelection = function mapPreservedSelection(selection, tr) {
   var _ref = (0, _main.getBlockControlsMeta)(tr) || {},
-    nodeMoved = _ref.nodeMoved,
-    nodeMovedOffset = _ref.nodeMovedOffset;
-  var mapping = nodeMoved && typeof nodeMovedOffset === 'number' ? new _transform.Mapping([new _transform.StepMap([0, 0, nodeMovedOffset])]) : tr.mapping;
+    preservedSelectionMapping = _ref.preservedSelectionMapping;
+  var mapping = preservedSelectionMapping || tr.mapping;
   if (selection instanceof _state.TextSelection) {
     var from = mapping.map(selection.from);
     var to = mapping.map(selection.to);

package/dist/cjs/ui/global-styles.js

@@ -407,11 +407,11 @@ var blockCardWithoutLayout = (0, _react.css)({
 });
 var nextAnchorSelector = ['&[data-node-anchor]',
 // adjacent sibling with anchor
-'&:not([data-node-anchor]) [data-node-anchor]',
-// nested anchor inside adjacent sibling
+'&:not([data-node-anchor]) [data-node-anchor]:first-of-type',
+// first nested anchor inside adjacent sibling
 '&.ProseMirror-widget + [data-node-anchor]',
 // adjacent sibling with anchor (when next to a widget like gap cursor)
-'&.ProseMirror-widget + :not([data-node-anchor]) [data-node-anchor]' // nested anchor inside adjacent sibling (when next to a widget like gap cursor)
+'&.ProseMirror-widget + :not([data-node-anchor]) [data-node-anchor]:first-of-type' // first nested anchor inside adjacent sibling (when next to a widget like gap cursor)
 ].join(', ');
 var dragHandlerAnchorStyles = (0, _react.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

package/dist/es2019/editor-commands/move-node.js

@@ -7,6 +7,7 @@ import { DIRECTION } from '@atlaskit/editor-common/types';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection, Selection } from '@atlaskit/editor-prosemirror/state';
+import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
 import { findChildrenByType, findParentNodeOfType, findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
 import { findTable, isInTable, isTableSelected } from '@atlaskit/editor-tables/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
@@ -426,7 +427,12 @@ export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_D
   if (inputMethod === INPUT_METHOD.DRAG_AND_DROP) {
     tr = setCursorPositionAtMovedNode(tr, mappedTo, api);
   } else if (preservedSelection) {
-    // do nothing here to allow the selection preservation plugin to handle mapping the selection
+    const currMeta = tr.getMeta(key);
+    const nodeMovedOffset = mappedTo - sliceFrom;
+    tr.setMeta(key, {
+      ...currMeta,
+      preservedSelectionMapping: new Mapping([new StepMap([0, 0, nodeMovedOffset])])
+    });
   } else if (isMultiSelect) {
     var _api$blockControls$co2;
     tr = (_api$blockControls$co2 = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
@@ -438,8 +444,7 @@ export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_D
   const currMeta = tr.getMeta(key);
   tr.setMeta(key, {
     ...currMeta,
-    nodeMoved: true,
-    nodeMovedOffset: mappedTo - sliceFrom
+    nodeMoved: true
   });
   api === null || api === void 0 ? void 0 : api.core.actions.focus();
   const $mappedTo = tr.doc.resolve(mappedTo);

package/dist/es2019/pm-plugins/handle-mouse-over.js

@@ -22,7 +22,7 @@ const getNodeSelector = (ignoreNodes, ignoreNodeDescendants) => {
   const ignoreNodeDescendantsSelectorList = ignoreNodeDescendants.map(node => {
     if (node === 'table') {
       // Special case for table to exclude its direct descendants
-      return [`[data-prosemirror-node-name="tableCell"] > [data-node-anchor]`, `[data-prosemirror-node-name="tableHeader"] > [data-node-anchor]`];
+      return [`[data-prosemirror-node-name="tableCell"] > [data-node-anchor]`, `[data-prosemirror-node-name="tableCell"] > *:not([data-node-anchor]) > [data-node-anchor]`, `[data-prosemirror-node-name="tableHeader"] > [data-node-anchor]`, `[data-prosemirror-node-name="tableHeader"] > *:not([data-node-anchor]) > [data-node-anchor]`];
     }
     return `[data-prosemirror-node-name="${node}"] [data-node-anchor]`;
   });

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

@@ -1,6 +1,5 @@
 import { expandToBlockRange } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
 import { getBlockControlsMeta, key } from '../main';
 import { collapseToSelectionRange } from './getSelection';
 export const getMultiSelectionIfPosInside = (api, pos, tr) => {
@@ -86,10 +85,9 @@ export const alignAnchorHeadInDirectionOfPos = (selection, pos) => {
  */
 export const mapPreservedSelection = (selection, tr) => {
   const {
-    nodeMoved,
-    nodeMovedOffset
+    preservedSelectionMapping
   } = getBlockControlsMeta(tr) || {};
-  const mapping = nodeMoved && typeof nodeMovedOffset === 'number' ? new Mapping([new StepMap([0, 0, nodeMovedOffset])]) : tr.mapping;
+  const mapping = preservedSelectionMapping || tr.mapping;
   if (selection instanceof TextSelection) {
     const from = mapping.map(selection.from);
     const to = mapping.map(selection.to);

package/dist/es2019/ui/global-styles.js

@@ -485,11 +485,11 @@ const blockCardWithoutLayout = css({
 });
 const nextAnchorSelector = ['&[data-node-anchor]',
 // adjacent sibling with anchor
-'&:not([data-node-anchor]) [data-node-anchor]',
-// nested anchor inside adjacent sibling
+'&:not([data-node-anchor]) [data-node-anchor]:first-of-type',
+// first nested anchor inside adjacent sibling
 '&.ProseMirror-widget + [data-node-anchor]',
 // adjacent sibling with anchor (when next to a widget like gap cursor)
-'&.ProseMirror-widget + :not([data-node-anchor]) [data-node-anchor]' // nested anchor inside adjacent sibling (when next to a widget like gap cursor)
+'&.ProseMirror-widget + :not([data-node-anchor]) [data-node-anchor]:first-of-type' // first nested anchor inside adjacent sibling (when next to a widget like gap cursor)
 ].join(', ');
 const dragHandlerAnchorStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

package/dist/esm/editor-commands/move-node.js

@@ -10,6 +10,7 @@ import { DIRECTION } from '@atlaskit/editor-common/types';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection, Selection } from '@atlaskit/editor-prosemirror/state';
+import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
 import { findChildrenByType, findParentNodeOfType, findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
 import { findTable, isInTable, isTableSelected } from '@atlaskit/editor-tables/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
@@ -420,7 +421,11 @@ export var moveNode = function moveNode(api) {
       if (inputMethod === INPUT_METHOD.DRAG_AND_DROP) {
         tr = setCursorPositionAtMovedNode(tr, mappedTo, api);
       } else if (preservedSelection) {
-        // do nothing here to allow the selection preservation plugin to handle mapping the selection
+        var _currMeta = tr.getMeta(key);
+        var nodeMovedOffset = mappedTo - sliceFrom;
+        tr.setMeta(key, _objectSpread(_objectSpread({}, _currMeta), {}, {
+          preservedSelectionMapping: new Mapping([new StepMap([0, 0, nodeMovedOffset])])
+        }));
       } else if (isMultiSelect) {
         var _api$blockControls$co;
         tr = (_api$blockControls$co = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
@@ -431,8 +436,7 @@ export var moveNode = function moveNode(api) {
       }
       var currMeta = tr.getMeta(key);
       tr.setMeta(key, _objectSpread(_objectSpread({}, currMeta), {}, {
-        nodeMoved: true,
-        nodeMovedOffset: mappedTo - sliceFrom
+        nodeMoved: true
       }));
       api === null || api === void 0 || api.core.actions.focus();
       var $mappedTo = tr.doc.resolve(mappedTo);

package/dist/esm/pm-plugins/handle-mouse-over.js

@@ -25,7 +25,7 @@ var getNodeSelector = function getNodeSelector(ignoreNodes, ignoreNodeDescendant
   var ignoreNodeDescendantsSelectorList = ignoreNodeDescendants.map(function (node) {
     if (node === 'table') {
       // Special case for table to exclude its direct descendants
-      return ["[data-prosemirror-node-name=\"tableCell\"] > [data-node-anchor]", "[data-prosemirror-node-name=\"tableHeader\"] > [data-node-anchor]"];
+      return ["[data-prosemirror-node-name=\"tableCell\"] > [data-node-anchor]", "[data-prosemirror-node-name=\"tableCell\"] > *:not([data-node-anchor]) > [data-node-anchor]", "[data-prosemirror-node-name=\"tableHeader\"] > [data-node-anchor]", "[data-prosemirror-node-name=\"tableHeader\"] > *:not([data-node-anchor]) > [data-node-anchor]"];
     }
     return "[data-prosemirror-node-name=\"".concat(node, "\"] [data-node-anchor]");
   });

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

@@ -1,6 +1,5 @@
 import { expandToBlockRange } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
 import { getBlockControlsMeta, key } from '../main';
 import { collapseToSelectionRange } from './getSelection';
 export var getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(api, pos, tr) {
@@ -85,9 +84,8 @@ export var alignAnchorHeadInDirectionOfPos = function alignAnchorHeadInDirection
  */
 export var mapPreservedSelection = function mapPreservedSelection(selection, tr) {
   var _ref = getBlockControlsMeta(tr) || {},
-    nodeMoved = _ref.nodeMoved,
-    nodeMovedOffset = _ref.nodeMovedOffset;
-  var mapping = nodeMoved && typeof nodeMovedOffset === 'number' ? new Mapping([new StepMap([0, 0, nodeMovedOffset])]) : tr.mapping;
+    preservedSelectionMapping = _ref.preservedSelectionMapping;
+  var mapping = preservedSelectionMapping || tr.mapping;
   if (selection instanceof TextSelection) {
     var from = mapping.map(selection.from);
     var to = mapping.map(selection.to);

package/dist/esm/ui/global-styles.js

@@ -400,11 +400,11 @@ var blockCardWithoutLayout = css({
 });
 var nextAnchorSelector = ['&[data-node-anchor]',
 // adjacent sibling with anchor
-'&:not([data-node-anchor]) [data-node-anchor]',
-// nested anchor inside adjacent sibling
+'&:not([data-node-anchor]) [data-node-anchor]:first-of-type',
+// first nested anchor inside adjacent sibling
 '&.ProseMirror-widget + [data-node-anchor]',
 // adjacent sibling with anchor (when next to a widget like gap cursor)
-'&.ProseMirror-widget + :not([data-node-anchor]) [data-node-anchor]' // nested anchor inside adjacent sibling (when next to a widget like gap cursor)
+'&.ProseMirror-widget + :not([data-node-anchor]) [data-node-anchor]:first-of-type' // first nested anchor inside adjacent sibling (when next to a widget like gap cursor)
 ].join(', ');
 var dragHandlerAnchorStyles = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors

package/dist/types/blockControlsPluginType.d.ts

@@ -15,6 +15,7 @@ import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
 import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
+import { type Mapping } from '@atlaskit/editor-prosemirror/transform';
 import { type DecorationSet } from '@atlaskit/editor-prosemirror/view';
 export type ActiveNode = {
     anchorName: string;
@@ -162,7 +163,7 @@ export type BlockControlsMeta = {
     editorBlurred: boolean;
     editorHeight: number;
     nodeMoved: boolean;
-    nodeMovedOffset: number;
+    preservedSelectionMapping: Mapping;
     type: string;
 };
 export type MoveNodeMethod = INPUT_METHOD.DRAG_AND_DROP | INPUT_METHOD.SHORTCUT | INPUT_METHOD.BLOCK_MENU;

package/dist/types-ts4.5/blockControlsPluginType.d.ts

@@ -15,6 +15,7 @@ import type { TypeAheadPlugin } from '@atlaskit/editor-plugin-type-ahead';
 import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
+import { type Mapping } from '@atlaskit/editor-prosemirror/transform';
 import { type DecorationSet } from '@atlaskit/editor-prosemirror/view';
 export type ActiveNode = {
     anchorName: string;
@@ -162,7 +163,7 @@ export type BlockControlsMeta = {
     editorBlurred: boolean;
     editorHeight: number;
     nodeMoved: boolean;
-    nodeMovedOffset: number;
+    preservedSelectionMapping: Mapping;
     type: string;
 };
 export type MoveNodeMethod = INPUT_METHOD.DRAG_AND_DROP | INPUT_METHOD.SHORTCUT | INPUT_METHOD.BLOCK_MENU;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "7.12.0",
+	"version": "7.13.0",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -54,7 +54,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
 		"@atlaskit/primitives": "^16.4.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^14.6.0",
+		"@atlaskit/tmp-editor-statsig": "^14.7.0",
 		"@atlaskit/tokens": "^8.4.0",
 		"@atlaskit/tooltip": "^20.10.0",
 		"@babel/runtime": "^7.0.0",
@@ -66,7 +66,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^110.38.0",
+		"@atlaskit/editor-common": "^110.39.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"