@atlaskit/editor-plugin-block-controls 1.4.2 → 1.4.4

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 1.4.4
+
+### Patch Changes
+
+-   [#104094](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/104094)
+    [`ae80ae898d90`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ae80ae898d90) -
+    Refactor getSelection and add tests
+
+## 1.4.3
+
+### Patch Changes
+
+-   [#103721](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/103721)
+    [`8c44ebf695aa`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8c44ebf695aa) -
+    Adjust drag preview opacity
+
 ## 1.4.2
 
 ### Patch Changes

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

@@ -12,6 +12,7 @@ var dragPreview = exports.dragPreview = function dragPreview(container, domRef)
   var parent = document.createElement('div');
   // ProseMirror class is required to make sure the cloned dom is styled correctly
   parent.classList.add('ProseMirror');
+  parent.style.opacity = '0.3';
   var resizer = domRef.current.querySelector('.resizer-item');
   var clonedDom = resizer ? resizer.cloneNode(true) : domRef.current.cloneNode(true);
 

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

@@ -9,7 +9,7 @@ var _react = require("@emotion/react");
 
 var globalStyles = (0, _react.css)({
   '.ProseMirror-widget:first-child + *': {
-    'margin-top': '0 !important'
+    marginTop: '0 !important'
   }
 });
 var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWrapper() {

package/dist/cjs/utils/getSelection.js

@@ -13,16 +13,22 @@ var getSelection = exports.getSelection = function getSelection(tr, start) {
   if (isNodeSelection) {
     return new _state.NodeSelection($startPos);
   } else {
-    var textNodesPos = [];
+    // To trigger the annotation floating toolbar for non-selectable node, we need to select on the text node
+    // Find the first text node in the node
+    var textNodesPos = start;
+    var foundTextNodes = false;
     tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, function (n, pos) {
+      if (foundTextNodes) {
+        return false;
+      }
       if (n.isText) {
-        textNodesPos.push(pos);
+        textNodesPos = pos;
+        foundTextNodes = true;
         return false;
       }
       return true;
     });
-    var textNodeStart = textNodesPos[0] || start;
-    var textNodeDepth = textNodeStart - start;
-    return new _state.TextSelection(tr.doc.resolve(textNodeStart), tr.doc.resolve(start + nodeSize - textNodeDepth));
+    var textNodeDepth = textNodesPos - start;
+    return new _state.TextSelection(tr.doc.resolve(textNodesPos), tr.doc.resolve(start + nodeSize - textNodeDepth));
   }
 };

package/dist/cjs/utils/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "getSelection", {
+  enumerable: true,
+  get: function get() {
+    return _getSelection.getSelection;
+  }
+});
+var _getSelection = require("./getSelection");

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

@@ -6,6 +6,7 @@ export const dragPreview = (container, domRef) => {
   const parent = document.createElement('div');
   // ProseMirror class is required to make sure the cloned dom is styled correctly
   parent.classList.add('ProseMirror');
+  parent.style.opacity = '0.3';
   const resizer = domRef.current.querySelector('.resizer-item');
   const clonedDom = resizer ? resizer.cloneNode(true) : domRef.current.cloneNode(true);
 

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

@@ -2,7 +2,7 @@
 import { css, Global, jsx } from '@emotion/react';
 const globalStyles = css({
   '.ProseMirror-widget:first-child + *': {
-    'margin-top': '0 !important'
+    marginTop: '0 !important'
   }
 });
 export const GlobalStylesWrapper = () => {

package/dist/es2019/utils/getSelection.js

@@ -7,16 +7,22 @@ export const getSelection = (tr, start) => {
   if (isNodeSelection) {
     return new NodeSelection($startPos);
   } else {
-    const textNodesPos = [];
+    // To trigger the annotation floating toolbar for non-selectable node, we need to select on the text node
+    // Find the first text node in the node
+    let textNodesPos = start;
+    let foundTextNodes = false;
     tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, (n, pos) => {
+      if (foundTextNodes) {
+        return false;
+      }
       if (n.isText) {
-        textNodesPos.push(pos);
+        textNodesPos = pos;
+        foundTextNodes = true;
         return false;
       }
       return true;
     });
-    const textNodeStart = textNodesPos[0] || start;
-    const textNodeDepth = textNodeStart - start;
-    return new TextSelection(tr.doc.resolve(textNodeStart), tr.doc.resolve(start + nodeSize - textNodeDepth));
+    const textNodeDepth = textNodesPos - start;
+    return new TextSelection(tr.doc.resolve(textNodesPos), tr.doc.resolve(start + nodeSize - textNodeDepth));
   }
 };

package/dist/es2019/utils/index.js

@@ -0,0 +1 @@
+export { getSelection } from './getSelection';

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

@@ -6,6 +6,7 @@ export var dragPreview = function dragPreview(container, domRef) {
   var parent = document.createElement('div');
   // ProseMirror class is required to make sure the cloned dom is styled correctly
   parent.classList.add('ProseMirror');
+  parent.style.opacity = '0.3';
   var resizer = domRef.current.querySelector('.resizer-item');
   var clonedDom = resizer ? resizer.cloneNode(true) : domRef.current.cloneNode(true);
 

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

@@ -2,7 +2,7 @@
 import { css, Global, jsx } from '@emotion/react';
 var globalStyles = css({
   '.ProseMirror-widget:first-child + *': {
-    'margin-top': '0 !important'
+    marginTop: '0 !important'
   }
 });
 export var GlobalStylesWrapper = function GlobalStylesWrapper() {

package/dist/esm/utils/getSelection.js

@@ -7,16 +7,22 @@ export var getSelection = function getSelection(tr, start) {
   if (isNodeSelection) {
     return new NodeSelection($startPos);
   } else {
-    var textNodesPos = [];
+    // To trigger the annotation floating toolbar for non-selectable node, we need to select on the text node
+    // Find the first text node in the node
+    var textNodesPos = start;
+    var foundTextNodes = false;
     tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, function (n, pos) {
+      if (foundTextNodes) {
+        return false;
+      }
       if (n.isText) {
-        textNodesPos.push(pos);
+        textNodesPos = pos;
+        foundTextNodes = true;
         return false;
       }
       return true;
     });
-    var textNodeStart = textNodesPos[0] || start;
-    var textNodeDepth = textNodeStart - start;
-    return new TextSelection(tr.doc.resolve(textNodeStart), tr.doc.resolve(start + nodeSize - textNodeDepth));
+    var textNodeDepth = textNodesPos - start;
+    return new TextSelection(tr.doc.resolve(textNodesPos), tr.doc.resolve(start + nodeSize - textNodeDepth));
   }
 };

package/dist/esm/utils/index.js

@@ -0,0 +1 @@
+export { getSelection } from './getSelection';

package/dist/types/utils/index.d.ts

@@ -0,0 +1 @@
+export { getSelection } from './getSelection';

package/dist/types-ts4.5/utils/index.d.ts

@@ -0,0 +1 @@
+export { getSelection } from './getSelection';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-block-controls",
-  "version": "1.4.2",
+  "version": "1.4.4",
   "description": "Block controls plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -31,7 +31,7 @@
     ".": "./src/index.ts"
   },
   "dependencies": {
-    "@atlaskit/editor-common": "^81.0.0",
+    "@atlaskit/editor-common": "^81.1.0",
     "@atlaskit/editor-prosemirror": "4.0.1",
     "@atlaskit/icon": "^22.3.0",
     "@atlaskit/pragmatic-drag-and-drop": "^1.1.0",