@atlaskit/editor-plugin-block-controls 1.5.5 → 1.5.7

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 1.5.7
+
+### Patch Changes
+
+- [`2f20977ad803d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2f20977ad803d) -
+  Fix paragraph to blockquotes with refactor
+  platform.editor.elements.drag-and-drop-remove-wrapper_fyqr2 FF off
+- [#114548](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/114548)
+  [`8b2d47bffb50e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8b2d47bffb50e) -
+  bump adf-schema version
+- Updated dependencies
+
+## 1.5.6
+
+### Patch Changes
+
+- [`e7c8b06889c5a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e7c8b06889c5a) -
+  [ux] Fix scroll issue for layout node when drap and drop
+
 ## 1.5.5
 
 ### Patch Changes

package/dist/cjs/pm-plugins/main.js

@@ -109,6 +109,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
           isResizerResizing = currentState.isResizerResizing,
           isDragging = currentState.isDragging,
           isPMDragging = currentState.isPMDragging;
+        var activeNodeWithNewNodeType = null;
         var meta = tr.getMeta(key);
         // when creating analytics during drag/drop events, PM thinks the doc has changed
         // so tr.docChange is true and causes some decorations to not render
@@ -184,6 +185,11 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
             if (newActiveNode && (newActiveNode === null || newActiveNode === void 0 ? void 0 : newActiveNode.type.name) !== activeNode.nodeType) {
               nodeType = newActiveNode.type.name;
               anchorName = activeNode.anchorName.replace(activeNode.nodeType, nodeType);
+              activeNodeWithNewNodeType = {
+                pos: prevMappedPos,
+                nodeType: nodeType,
+                anchorName: anchorName
+              };
             }
             var draghandleDec = (0, _decorations.dragHandleDecoration)(activeNode.pos, anchorName, nodeType, api);
             decorations = decorations.add(newState.doc, [draghandleDec]);
@@ -200,21 +206,33 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
           var decs = (0, _decorations.dragHandleDecoration)(meta.activeNode.pos, meta.activeNode.anchorName, meta.activeNode.nodeType, api);
           decorations = decorations.add(newState.doc, [decs]);
         }
-
+        if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.elements.drag-and-drop-ed-23816')) {
+          var _activeNodeWithNewNod;
+          // Remove previous drag handle widget and draw new drag handle widget when node type changes
+          if (activeNodeWithNewNodeType && ((_activeNodeWithNewNod = activeNodeWithNewNodeType) === null || _activeNodeWithNewNod === void 0 ? void 0 : _activeNodeWithNewNod.nodeType) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) && api) {
+            var _oldHandle2 = decorations.find().filter(function (_ref9) {
+              var spec = _ref9.spec;
+              return spec.id === 'drag-handle';
+            });
+            decorations = decorations.remove(_oldHandle2);
+            var _decs = (0, _decorations.dragHandleDecoration)(activeNodeWithNewNodeType.pos, activeNodeWithNewNodeType.anchorName, activeNodeWithNewNodeType.nodeType, api);
+            decorations = decorations.add(newState.doc, [_decs]);
+          }
+        }
         // Add drop targets when node is being dragged
         // if the transaction is only for analytics and user is dragging, continue to draw drop targets
         if (meta !== null && meta !== void 0 && meta.isDragging && (!tr.docChanged || tr.docChanged && isAnalyticTr) && api) {
           var _dropTargetDecoration = (0, _decorations.dropTargetDecorations)(oldState, newState, api),
-            _decs = _dropTargetDecoration.decs,
+            _decs2 = _dropTargetDecoration.decs,
             updatedDecorationState = _dropTargetDecoration.decorationState;
           decorationState = updatedDecorationState;
-          decorations = decorations.add(newState.doc, _decs);
+          decorations = decorations.add(newState.doc, _decs2);
         }
 
         // Remove drop target decoration when dragging stops
         if ((meta === null || meta === void 0 ? void 0 : meta.isDragging) === false && !tr.docChanged) {
-          var dropTargetDecs = decorations.find().filter(function (_ref9) {
-            var spec = _ref9.spec;
+          var dropTargetDecs = decorations.find().filter(function (_ref10) {
+            var spec = _ref10.spec;
             return spec.type === 'drop-target-decoration';
           });
           decorations = decorations.remove(dropTargetDecs);
@@ -222,9 +240,9 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
 
         // Map drop target decoration positions when the document changes
         if (tr.docChanged && isDragging) {
-          decorationState = decorationState.map(function (_ref10) {
-            var index = _ref10.index,
-              pos = _ref10.pos;
+          decorationState = decorationState.map(function (_ref11) {
+            var index = _ref11.index,
+              pos = _ref11.pos;
             return {
               index: index,
               pos: tr.mapping.map(pos)
@@ -237,8 +255,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
           decorations = decorations.map(tr.mapping, tr.doc);
         }
         var isEmptyDoc = newState.doc.childCount === 1 && newState.doc.nodeSize <= 4;
-        var hasNodeDecoration = decorations.find().some(function (_ref11) {
-          var spec = _ref11.spec;
+        var hasNodeDecoration = decorations.find().some(function (_ref12) {
+          var spec = _ref12.spec;
           return spec.type === 'node-decoration';
         });
         if (!hasNodeDecoration && isEmptyDoc) {
@@ -246,11 +264,20 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
         }
 
         // Map active node position when the document changes
-        var mappedActiveNodePos = tr.docChanged && activeNode ? {
-          pos: tr.mapping.map(activeNode.pos),
-          anchorName: activeNode.anchorName,
-          nodeType: activeNode.nodeType
-        } : activeNode;
+        var mappedActiveNodePos;
+        if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.elements.drag-and-drop-ed-23816')) {
+          mappedActiveNodePos = tr.docChanged && activeNode ? activeNodeWithNewNodeType || {
+            pos: tr.mapping.map(activeNode.pos),
+            anchorName: activeNode.anchorName,
+            nodeType: activeNode.nodeType
+          } : activeNode;
+        } else {
+          mappedActiveNodePos = tr.docChanged && activeNode ? {
+            pos: tr.mapping.map(activeNode.pos),
+            anchorName: activeNode.anchorName,
+            nodeType: activeNode.nodeType
+          } : activeNode;
+        }
         return {
           decorations: decorations,
           decorationState: decorationState,

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

@@ -105,6 +105,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
       });
       var resolvedMovingNode = tr.doc.resolve(start);
       var maybeNode = resolvedMovingNode.nodeAfter;
+      (0, _platformFeatureFlags.getBooleanFF)('platform.editor.elements.drag-and-drop-long-node-scroll') && tr.setMeta('scrollIntoView', false);
       api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.attachAnalyticsEvent({
         eventType: _analytics.EVENT_TYPE.UI,
         action: _analytics.ACTION.CLICKED,

package/dist/es2019/pm-plugins/main.js

@@ -105,6 +105,7 @@ export const createPlugin = api => {
           isDragging,
           isPMDragging
         } = currentState;
+        let activeNodeWithNewNodeType = null;
         const meta = tr.getMeta(key);
         // when creating analytics during drag/drop events, PM thinks the doc has changed
         // so tr.docChange is true and causes some decorations to not render
@@ -175,6 +176,11 @@ export const createPlugin = api => {
             if (newActiveNode && (newActiveNode === null || newActiveNode === void 0 ? void 0 : newActiveNode.type.name) !== activeNode.nodeType) {
               nodeType = newActiveNode.type.name;
               anchorName = activeNode.anchorName.replace(activeNode.nodeType, nodeType);
+              activeNodeWithNewNodeType = {
+                pos: prevMappedPos,
+                nodeType,
+                anchorName
+              };
             }
             const draghandleDec = dragHandleDecoration(activeNode.pos, anchorName, nodeType, api);
             decorations = decorations.add(newState.doc, [draghandleDec]);
@@ -190,7 +196,18 @@ export const createPlugin = api => {
           const decs = dragHandleDecoration(meta.activeNode.pos, meta.activeNode.anchorName, meta.activeNode.nodeType, api);
           decorations = decorations.add(newState.doc, [decs]);
         }
-
+        if (getBooleanFF('platform.editor.elements.drag-and-drop-ed-23816')) {
+          var _activeNodeWithNewNod;
+          // Remove previous drag handle widget and draw new drag handle widget when node type changes
+          if (activeNodeWithNewNodeType && ((_activeNodeWithNewNod = activeNodeWithNewNodeType) === null || _activeNodeWithNewNod === void 0 ? void 0 : _activeNodeWithNewNod.nodeType) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) && api) {
+            const oldHandle = decorations.find().filter(({
+              spec
+            }) => spec.id === 'drag-handle');
+            decorations = decorations.remove(oldHandle);
+            const decs = dragHandleDecoration(activeNodeWithNewNodeType.pos, activeNodeWithNewNodeType.anchorName, activeNodeWithNewNodeType.nodeType, api);
+            decorations = decorations.add(newState.doc, [decs]);
+          }
+        }
         // Add drop targets when node is being dragged
         // if the transaction is only for analytics and user is dragging, continue to draw drop targets
         if (meta !== null && meta !== void 0 && meta.isDragging && (!tr.docChanged || tr.docChanged && isAnalyticTr) && api) {
@@ -236,11 +253,20 @@ export const createPlugin = api => {
         }
 
         // Map active node position when the document changes
-        const mappedActiveNodePos = tr.docChanged && activeNode ? {
-          pos: tr.mapping.map(activeNode.pos),
-          anchorName: activeNode.anchorName,
-          nodeType: activeNode.nodeType
-        } : activeNode;
+        let mappedActiveNodePos;
+        if (getBooleanFF('platform.editor.elements.drag-and-drop-ed-23816')) {
+          mappedActiveNodePos = tr.docChanged && activeNode ? activeNodeWithNewNodeType || {
+            pos: tr.mapping.map(activeNode.pos),
+            anchorName: activeNode.anchorName,
+            nodeType: activeNode.nodeType
+          } : activeNode;
+        } else {
+          mappedActiveNodePos = tr.docChanged && activeNode ? {
+            pos: tr.mapping.map(activeNode.pos),
+            anchorName: activeNode.anchorName,
+            nodeType: activeNode.nodeType
+          } : activeNode;
+        }
         return {
           decorations,
           decorationState,

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

@@ -91,6 +91,7 @@ export const DragHandle = ({
       });
       const resolvedMovingNode = tr.doc.resolve(start);
       const maybeNode = resolvedMovingNode.nodeAfter;
+      getBooleanFF('platform.editor.elements.drag-and-drop-long-node-scroll') && tr.setMeta('scrollIntoView', false);
       api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.attachAnalyticsEvent({
         eventType: EVENT_TYPE.UI,
         action: ACTION.CLICKED,

package/dist/esm/pm-plugins/main.js

@@ -102,6 +102,7 @@ export var createPlugin = function createPlugin(api) {
           isResizerResizing = currentState.isResizerResizing,
           isDragging = currentState.isDragging,
           isPMDragging = currentState.isPMDragging;
+        var activeNodeWithNewNodeType = null;
         var meta = tr.getMeta(key);
         // when creating analytics during drag/drop events, PM thinks the doc has changed
         // so tr.docChange is true and causes some decorations to not render
@@ -177,6 +178,11 @@ export var createPlugin = function createPlugin(api) {
             if (newActiveNode && (newActiveNode === null || newActiveNode === void 0 ? void 0 : newActiveNode.type.name) !== activeNode.nodeType) {
               nodeType = newActiveNode.type.name;
               anchorName = activeNode.anchorName.replace(activeNode.nodeType, nodeType);
+              activeNodeWithNewNodeType = {
+                pos: prevMappedPos,
+                nodeType: nodeType,
+                anchorName: anchorName
+              };
             }
             var draghandleDec = dragHandleDecoration(activeNode.pos, anchorName, nodeType, api);
             decorations = decorations.add(newState.doc, [draghandleDec]);
@@ -193,21 +199,33 @@ export var createPlugin = function createPlugin(api) {
           var decs = dragHandleDecoration(meta.activeNode.pos, meta.activeNode.anchorName, meta.activeNode.nodeType, api);
           decorations = decorations.add(newState.doc, [decs]);
         }
-
+        if (getBooleanFF('platform.editor.elements.drag-and-drop-ed-23816')) {
+          var _activeNodeWithNewNod;
+          // Remove previous drag handle widget and draw new drag handle widget when node type changes
+          if (activeNodeWithNewNodeType && ((_activeNodeWithNewNod = activeNodeWithNewNodeType) === null || _activeNodeWithNewNod === void 0 ? void 0 : _activeNodeWithNewNod.nodeType) !== (activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) && api) {
+            var _oldHandle2 = decorations.find().filter(function (_ref9) {
+              var spec = _ref9.spec;
+              return spec.id === 'drag-handle';
+            });
+            decorations = decorations.remove(_oldHandle2);
+            var _decs = dragHandleDecoration(activeNodeWithNewNodeType.pos, activeNodeWithNewNodeType.anchorName, activeNodeWithNewNodeType.nodeType, api);
+            decorations = decorations.add(newState.doc, [_decs]);
+          }
+        }
         // Add drop targets when node is being dragged
         // if the transaction is only for analytics and user is dragging, continue to draw drop targets
         if (meta !== null && meta !== void 0 && meta.isDragging && (!tr.docChanged || tr.docChanged && isAnalyticTr) && api) {
           var _dropTargetDecoration = dropTargetDecorations(oldState, newState, api),
-            _decs = _dropTargetDecoration.decs,
+            _decs2 = _dropTargetDecoration.decs,
             updatedDecorationState = _dropTargetDecoration.decorationState;
           decorationState = updatedDecorationState;
-          decorations = decorations.add(newState.doc, _decs);
+          decorations = decorations.add(newState.doc, _decs2);
         }
 
         // Remove drop target decoration when dragging stops
         if ((meta === null || meta === void 0 ? void 0 : meta.isDragging) === false && !tr.docChanged) {
-          var dropTargetDecs = decorations.find().filter(function (_ref9) {
-            var spec = _ref9.spec;
+          var dropTargetDecs = decorations.find().filter(function (_ref10) {
+            var spec = _ref10.spec;
             return spec.type === 'drop-target-decoration';
           });
           decorations = decorations.remove(dropTargetDecs);
@@ -215,9 +233,9 @@ export var createPlugin = function createPlugin(api) {
 
         // Map drop target decoration positions when the document changes
         if (tr.docChanged && isDragging) {
-          decorationState = decorationState.map(function (_ref10) {
-            var index = _ref10.index,
-              pos = _ref10.pos;
+          decorationState = decorationState.map(function (_ref11) {
+            var index = _ref11.index,
+              pos = _ref11.pos;
             return {
               index: index,
               pos: tr.mapping.map(pos)
@@ -230,8 +248,8 @@ export var createPlugin = function createPlugin(api) {
           decorations = decorations.map(tr.mapping, tr.doc);
         }
         var isEmptyDoc = newState.doc.childCount === 1 && newState.doc.nodeSize <= 4;
-        var hasNodeDecoration = decorations.find().some(function (_ref11) {
-          var spec = _ref11.spec;
+        var hasNodeDecoration = decorations.find().some(function (_ref12) {
+          var spec = _ref12.spec;
           return spec.type === 'node-decoration';
         });
         if (!hasNodeDecoration && isEmptyDoc) {
@@ -239,11 +257,20 @@ export var createPlugin = function createPlugin(api) {
         }
 
         // Map active node position when the document changes
-        var mappedActiveNodePos = tr.docChanged && activeNode ? {
-          pos: tr.mapping.map(activeNode.pos),
-          anchorName: activeNode.anchorName,
-          nodeType: activeNode.nodeType
-        } : activeNode;
+        var mappedActiveNodePos;
+        if (getBooleanFF('platform.editor.elements.drag-and-drop-ed-23816')) {
+          mappedActiveNodePos = tr.docChanged && activeNode ? activeNodeWithNewNodeType || {
+            pos: tr.mapping.map(activeNode.pos),
+            anchorName: activeNode.anchorName,
+            nodeType: activeNode.nodeType
+          } : activeNode;
+        } else {
+          mappedActiveNodePos = tr.docChanged && activeNode ? {
+            pos: tr.mapping.map(activeNode.pos),
+            anchorName: activeNode.anchorName,
+            nodeType: activeNode.nodeType
+          } : activeNode;
+        }
         return {
           decorations: decorations,
           decorationState: decorationState,

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

@@ -97,6 +97,7 @@ export var DragHandle = function DragHandle(_ref) {
       });
       var resolvedMovingNode = tr.doc.resolve(start);
       var maybeNode = resolvedMovingNode.nodeAfter;
+      getBooleanFF('platform.editor.elements.drag-and-drop-long-node-scroll') && tr.setMeta('scrollIntoView', false);
       api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.attachAnalyticsEvent({
         eventType: EVENT_TYPE.UI,
         action: ACTION.CLICKED,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "1.5.5",
+	"version": "1.5.7",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -31,8 +31,8 @@
 		".": "./src/index.ts"
 	},
 	"dependencies": {
-		"@atlaskit/adf-schema": "^38.0.0",
-		"@atlaskit/editor-common": "^83.4.0",
+		"@atlaskit/adf-schema": "^39.0.3",
+		"@atlaskit/editor-common": "^83.5.0",
 		"@atlaskit/editor-plugin-analytics": "^1.4.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.1.5",
 		"@atlaskit/editor-plugin-feature-flags": "^1.1.0",
@@ -101,12 +101,18 @@
 		"platform.editor.elements.drag-and-drop-remove-wrapper_fyqr2": {
 			"type": "boolean"
 		},
+		"platform.editor.elements.drag-and-drop-long-node-scroll": {
+			"type": "boolean"
+		},
 		"platform.editor.media.extended-resize-experience": {
 			"type": "boolean",
 			"referenceOnly": true
 		},
 		"platform.editor.elements.drag-and-drop-ed-23892": {
 			"type": "boolean"
+		},
+		"platform.editor.elements.drag-and-drop-ed-23816": {
+			"type": "boolean"
 		}
 	}
 }