@atlaskit/editor-plugin-paste-options-toolbar 0.2.0 → 0.2.2

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 +1,13 @@
1
1
  # @atlaskit/editor-plugin-paste-options-toolbar
2
+
3
+ ## 0.2.2
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 0.2.1
10
+
11
+ ### Patch Changes
12
+
13
+ - [#42128](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/42128) [`8d06cbeae33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d06cbeae33) - ED-20584: Adding logic to show correct positioning for toolbar in confluence
@@ -84,12 +84,22 @@ var buildToolbar = exports.buildToolbar = function buildToolbar(state, pasteStar
84
84
  };
85
85
  };
86
86
  var onPositionCalculated = function onPositionCalculated(editorView, nextPos) {
87
- var toolbar = document.querySelector("div[aria-label=\"".concat(_messages.messages.pasteOptions.defaultMessage, "\"]"));
88
- var cursorHeight = parseFloat(window.getComputedStyle(toolbar, undefined).lineHeight || '');
89
- var from = editorView.state.tr.selection.from;
87
+ var from = editorView.state.selection.from;
90
88
  var fromCoords = editorView.coordsAtPos(from);
89
+ var toolbar = document.querySelector("div[aria-label=\"".concat(_messages.messages.pasteOptions.defaultMessage, "\"]"));
90
+ var offsetParent = (toolbar === null || toolbar === void 0 ? void 0 : toolbar.offsetParent) || editorView.dom;
91
+ var offsetParentRect = offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.getBoundingClientRect();
92
+ var offsetTop = (offsetParentRect === null || offsetParentRect === void 0 ? void 0 : offsetParentRect.top) || 0;
93
+ var offsetLeft = (offsetParentRect === null || offsetParentRect === void 0 ? void 0 : offsetParentRect.left) || 0;
94
+ var offsetScrollTop = (offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.scrollTop) || 0;
95
+ var cursorHeight = getCursorHeight(editorView, from);
91
96
  return {
92
- top: fromCoords.top + cursorHeight,
93
- left: fromCoords.left
97
+ top: fromCoords.top - offsetTop + offsetScrollTop + cursorHeight,
98
+ left: fromCoords.left - offsetLeft
94
99
  };
100
+ };
101
+ var getCursorHeight = function getCursorHeight(editorView, from) {
102
+ var nodeAtFrom = editorView.domAtPos(from).node;
103
+ var nearestNonTextNode = (nodeAtFrom === null || nodeAtFrom === void 0 ? void 0 : nodeAtFrom.nodeType) === Node.TEXT_NODE ? nodeAtFrom.parentNode : nodeAtFrom;
104
+ return parseFloat(window.getComputedStyle(nearestNonTextNode, undefined).lineHeight || '');
95
105
  };
@@ -79,14 +79,24 @@ export const buildToolbar = (state, pasteStartPos, plaintext, intl, editorAnalyt
79
79
  };
80
80
  };
81
81
  const onPositionCalculated = (editorView, nextPos) => {
82
- const toolbar = document.querySelector(`div[aria-label="${messages.pasteOptions.defaultMessage}"]`);
83
- const cursorHeight = parseFloat(window.getComputedStyle(toolbar, undefined).lineHeight || '');
84
82
  const {
85
83
  from
86
- } = editorView.state.tr.selection;
84
+ } = editorView.state.selection;
87
85
  const fromCoords = editorView.coordsAtPos(from);
86
+ const toolbar = document.querySelector(`div[aria-label="${messages.pasteOptions.defaultMessage}"]`);
87
+ const offsetParent = (toolbar === null || toolbar === void 0 ? void 0 : toolbar.offsetParent) || editorView.dom;
88
+ const offsetParentRect = offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.getBoundingClientRect();
89
+ const offsetTop = (offsetParentRect === null || offsetParentRect === void 0 ? void 0 : offsetParentRect.top) || 0;
90
+ const offsetLeft = (offsetParentRect === null || offsetParentRect === void 0 ? void 0 : offsetParentRect.left) || 0;
91
+ const offsetScrollTop = (offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.scrollTop) || 0;
92
+ const cursorHeight = getCursorHeight(editorView, from);
88
93
  return {
89
- top: fromCoords.top + cursorHeight,
90
- left: fromCoords.left
94
+ top: fromCoords.top - offsetTop + offsetScrollTop + cursorHeight,
95
+ left: fromCoords.left - offsetLeft
91
96
  };
97
+ };
98
+ const getCursorHeight = (editorView, from) => {
99
+ const nodeAtFrom = editorView.domAtPos(from).node;
100
+ const nearestNonTextNode = (nodeAtFrom === null || nodeAtFrom === void 0 ? void 0 : nodeAtFrom.nodeType) === Node.TEXT_NODE ? nodeAtFrom.parentNode : nodeAtFrom;
101
+ return parseFloat(window.getComputedStyle(nearestNonTextNode, undefined).lineHeight || '');
92
102
  };
@@ -77,12 +77,22 @@ export var buildToolbar = function buildToolbar(state, pasteStartPos, plaintext,
77
77
  };
78
78
  };
79
79
  var onPositionCalculated = function onPositionCalculated(editorView, nextPos) {
80
- var toolbar = document.querySelector("div[aria-label=\"".concat(messages.pasteOptions.defaultMessage, "\"]"));
81
- var cursorHeight = parseFloat(window.getComputedStyle(toolbar, undefined).lineHeight || '');
82
- var from = editorView.state.tr.selection.from;
80
+ var from = editorView.state.selection.from;
83
81
  var fromCoords = editorView.coordsAtPos(from);
82
+ var toolbar = document.querySelector("div[aria-label=\"".concat(messages.pasteOptions.defaultMessage, "\"]"));
83
+ var offsetParent = (toolbar === null || toolbar === void 0 ? void 0 : toolbar.offsetParent) || editorView.dom;
84
+ var offsetParentRect = offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.getBoundingClientRect();
85
+ var offsetTop = (offsetParentRect === null || offsetParentRect === void 0 ? void 0 : offsetParentRect.top) || 0;
86
+ var offsetLeft = (offsetParentRect === null || offsetParentRect === void 0 ? void 0 : offsetParentRect.left) || 0;
87
+ var offsetScrollTop = (offsetParent === null || offsetParent === void 0 ? void 0 : offsetParent.scrollTop) || 0;
88
+ var cursorHeight = getCursorHeight(editorView, from);
84
89
  return {
85
- top: fromCoords.top + cursorHeight,
86
- left: fromCoords.left
90
+ top: fromCoords.top - offsetTop + offsetScrollTop + cursorHeight,
91
+ left: fromCoords.left - offsetLeft
87
92
  };
93
+ };
94
+ var getCursorHeight = function getCursorHeight(editorView, from) {
95
+ var nodeAtFrom = editorView.domAtPos(from).node;
96
+ var nearestNonTextNode = (nodeAtFrom === null || nodeAtFrom === void 0 ? void 0 : nodeAtFrom.nodeType) === Node.TEXT_NODE ? nodeAtFrom.parentNode : nodeAtFrom;
97
+ return parseFloat(window.getComputedStyle(nearestNonTextNode, undefined).lineHeight || '');
88
98
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-paste-options-toolbar",
3
- "version": "0.2.0",
3
+ "version": "0.2.2",
4
4
  "description": "Paste options toolbar for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -36,9 +36,10 @@
36
36
  "./styles": "./src/styles.ts"
37
37
  },
38
38
  "dependencies": {
39
- "@atlaskit/editor-common": "^76.14.0",
39
+ "@atlaskit/editor-common": "^76.17.0",
40
40
  "@atlaskit/editor-markdown-transformer": "^5.2.5",
41
- "@atlaskit/editor-plugin-analytics": "^0.2.0",
41
+ "@atlaskit/editor-plugin-analytics": "^0.3.0",
42
+ "@atlaskit/editor-plugin-paste": "^0.1.0",
42
43
  "@atlaskit/editor-prosemirror": "1.1.0",
43
44
  "@atlaskit/editor-shared-styles": "^2.8.0",
44
45
  "@atlaskit/icon": "^21.12.0",