@atlaskit/editor-plugin-extension 1.0.5 → 1.0.7

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.
Files changed (5) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/toolbar.js +10 -20
  3. package/dist/es2019/toolbar.js +10 -20
  4. package/dist/esm/toolbar.js +10 -20
  5. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/editor-plugin-extension
2
2
 
3
+ ## 1.0.7
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 1.0.6
10
+
11
+ ### Patch Changes
12
+
13
+ - [#75087](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/75087) [`ede66b0fc1d5`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ede66b0fc1d5) - [ux] ED-22045 Removing custom logic for MBE floating toolbar.
14
+
3
15
  ## 1.0.5
4
16
 
5
17
  ### Patch Changes
package/dist/cjs/toolbar.js CHANGED
@@ -8,6 +8,7 @@ exports.getToolbarConfig = void 0;
8
8
  var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
9
9
  var _extensions = require("@atlaskit/editor-common/extensions");
10
10
  var _messages = _interopRequireDefault(require("@atlaskit/editor-common/messages"));
11
+ var _styles = require("@atlaskit/editor-common/styles");
11
12
  var _utils = require("@atlaskit/editor-common/utils");
12
13
  var _utils2 = require("@atlaskit/editor-prosemirror/utils");
13
14
  var _edit = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/edit"));
@@ -142,29 +143,18 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(_ref
142
143
  var _editorView$state = editorView.state,
143
144
  schema = _editorView$state.schema,
144
145
  selection = _editorView$state.selection;
145
- var mbeNode = (0, _utils3.getSelectedExtension)(state, true);
146
- var mbeFrame = (0, _utils2.findParentNodeOfType)(schema.nodes.extensionFrame)(selection);
147
- if (!mbeNode || !mbeFrame) {
146
+ var extensionNode = (0, _utils3.getSelectedExtension)(state, true);
147
+ var possibleMbeParent = (0, _utils2.findParentNodeOfType)(schema.nodes.extensionFrame)(selection);
148
+ // We only want to use calculated position in case of a bodiedExtension present inside an MBE node
149
+ var isBodiedExtensionInsideMBE = possibleMbeParent && (extensionNode === null || extensionNode === void 0 ? void 0 : extensionNode.node.type.name) === 'bodiedExtension';
150
+ if (!isBodiedExtensionInsideMBE) {
148
151
  return nextPos;
149
152
  }
150
- var mbeDomElement = editorView.nodeDOM(mbeNode.pos);
151
- var mbeFrameElement = editorView.nodeDOM(mbeFrame.pos);
152
- var mbeNodeRect = mbeDomElement === null || mbeDomElement === void 0 ? void 0 : mbeDomElement.getBoundingClientRect();
153
- var mbeFrameRect = mbeFrameElement.getBoundingClientRect();
154
153
  var scrollWrapper = editorView.dom.closest('.fabric-editor-popup-scroll-parent') || document.body;
155
-
156
- /**
157
- * MbeNodeRect height will include mbeFrameRect height and the navigation toolbar of the MBE
158
- * excluding nav toolbar height from the floaing extention toolbar position calculated.
159
- * In case of new tabs, MBE does not update the frame to the new tab so height comes as 0,
160
- * so we add the min height (100px) + borders (2px) as the default minimum frame height for toolbar to appear
161
- *
162
- */
163
- var frameheight = mbeFrameRect.height > 0 ? mbeFrameRect.height : 102;
164
- // MBE wrapper header height includes, top margin 8px + bottom margin 8px + Line height of 16px + padding top 8px
165
- // Ref: platform/packages/editor/editor-common/src/extensibility/MultiBodiedExtension/styles.ts
166
- var wrapperHeaderHeight = 40;
167
- var toolbarTopPos = mbeNodeRect.top + frameheight + wrapperHeaderHeight + scrollWrapper.scrollTop;
154
+ var nestedBodiedExtensionDomElement = editorView.nodeDOM(extensionNode.pos);
155
+ var nestedBodiedExtensionRect = nestedBodiedExtensionDomElement === null || nestedBodiedExtensionDomElement === void 0 ? void 0 : nestedBodiedExtensionDomElement.getBoundingClientRect();
156
+ var wrapperBounds = scrollWrapper.getBoundingClientRect();
157
+ var toolbarTopPos = nestedBodiedExtensionRect.bottom - wrapperBounds.top + scrollWrapper.scrollTop + _styles.BODIED_EXT_MBE_MARGIN_TOP;
168
158
  return {
169
159
  top: toolbarTopPos,
170
160
  left: nextPos.left
package/dist/es2019/toolbar.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { messages } from '@atlaskit/editor-common/extensions';
2
2
  import commonMessages from '@atlaskit/editor-common/messages';
3
+ import { BODIED_EXT_MBE_MARGIN_TOP } from '@atlaskit/editor-common/styles';
3
4
  import { getChildrenInfo, getNodeName, isReferencedSource } from '@atlaskit/editor-common/utils';
4
5
  import { findParentNodeOfType, hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
5
6
  import EditIcon from '@atlaskit/icon/glyph/editor/edit';
@@ -139,29 +140,18 @@ export const getToolbarConfig = ({
139
140
  selection
140
141
  }
141
142
  } = editorView;
142
- const mbeNode = getSelectedExtension(state, true);
143
- const mbeFrame = findParentNodeOfType(schema.nodes.extensionFrame)(selection);
144
- if (!mbeNode || !mbeFrame) {
143
+ const extensionNode = getSelectedExtension(state, true);
144
+ const possibleMbeParent = findParentNodeOfType(schema.nodes.extensionFrame)(selection);
145
+ // We only want to use calculated position in case of a bodiedExtension present inside an MBE node
146
+ const isBodiedExtensionInsideMBE = possibleMbeParent && (extensionNode === null || extensionNode === void 0 ? void 0 : extensionNode.node.type.name) === 'bodiedExtension';
147
+ if (!isBodiedExtensionInsideMBE) {
145
148
  return nextPos;
146
149
  }
147
- const mbeDomElement = editorView.nodeDOM(mbeNode.pos);
148
- const mbeFrameElement = editorView.nodeDOM(mbeFrame.pos);
149
- const mbeNodeRect = mbeDomElement === null || mbeDomElement === void 0 ? void 0 : mbeDomElement.getBoundingClientRect();
150
- const mbeFrameRect = mbeFrameElement.getBoundingClientRect();
151
150
  const scrollWrapper = editorView.dom.closest('.fabric-editor-popup-scroll-parent') || document.body;
152
-
153
- /**
154
- * MbeNodeRect height will include mbeFrameRect height and the navigation toolbar of the MBE
155
- * excluding nav toolbar height from the floaing extention toolbar position calculated.
156
- * In case of new tabs, MBE does not update the frame to the new tab so height comes as 0,
157
- * so we add the min height (100px) + borders (2px) as the default minimum frame height for toolbar to appear
158
- *
159
- */
160
- const frameheight = mbeFrameRect.height > 0 ? mbeFrameRect.height : 102;
161
- // MBE wrapper header height includes, top margin 8px + bottom margin 8px + Line height of 16px + padding top 8px
162
- // Ref: platform/packages/editor/editor-common/src/extensibility/MultiBodiedExtension/styles.ts
163
- const wrapperHeaderHeight = 40;
164
- const toolbarTopPos = mbeNodeRect.top + frameheight + wrapperHeaderHeight + scrollWrapper.scrollTop;
151
+ const nestedBodiedExtensionDomElement = editorView.nodeDOM(extensionNode.pos);
152
+ const nestedBodiedExtensionRect = nestedBodiedExtensionDomElement === null || nestedBodiedExtensionDomElement === void 0 ? void 0 : nestedBodiedExtensionDomElement.getBoundingClientRect();
153
+ const wrapperBounds = scrollWrapper.getBoundingClientRect();
154
+ const toolbarTopPos = nestedBodiedExtensionRect.bottom - wrapperBounds.top + scrollWrapper.scrollTop + BODIED_EXT_MBE_MARGIN_TOP;
165
155
  return {
166
156
  top: toolbarTopPos,
167
157
  left: nextPos.left
package/dist/esm/toolbar.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
2
2
  import { messages } from '@atlaskit/editor-common/extensions';
3
3
  import commonMessages from '@atlaskit/editor-common/messages';
4
+ import { BODIED_EXT_MBE_MARGIN_TOP } from '@atlaskit/editor-common/styles';
4
5
  import { getChildrenInfo as _getChildrenInfo, getNodeName, isReferencedSource } from '@atlaskit/editor-common/utils';
5
6
  import { findParentNodeOfType, hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
6
7
  import EditIcon from '@atlaskit/icon/glyph/editor/edit';
@@ -135,29 +136,18 @@ export var getToolbarConfig = function getToolbarConfig(_ref) {
135
136
  var _editorView$state = editorView.state,
136
137
  schema = _editorView$state.schema,
137
138
  selection = _editorView$state.selection;
138
- var mbeNode = getSelectedExtension(state, true);
139
- var mbeFrame = findParentNodeOfType(schema.nodes.extensionFrame)(selection);
140
- if (!mbeNode || !mbeFrame) {
139
+ var extensionNode = getSelectedExtension(state, true);
140
+ var possibleMbeParent = findParentNodeOfType(schema.nodes.extensionFrame)(selection);
141
+ // We only want to use calculated position in case of a bodiedExtension present inside an MBE node
142
+ var isBodiedExtensionInsideMBE = possibleMbeParent && (extensionNode === null || extensionNode === void 0 ? void 0 : extensionNode.node.type.name) === 'bodiedExtension';
143
+ if (!isBodiedExtensionInsideMBE) {
141
144
  return nextPos;
142
145
  }
143
- var mbeDomElement = editorView.nodeDOM(mbeNode.pos);
144
- var mbeFrameElement = editorView.nodeDOM(mbeFrame.pos);
145
- var mbeNodeRect = mbeDomElement === null || mbeDomElement === void 0 ? void 0 : mbeDomElement.getBoundingClientRect();
146
- var mbeFrameRect = mbeFrameElement.getBoundingClientRect();
147
146
  var scrollWrapper = editorView.dom.closest('.fabric-editor-popup-scroll-parent') || document.body;
148
-
149
- /**
150
- * MbeNodeRect height will include mbeFrameRect height and the navigation toolbar of the MBE
151
- * excluding nav toolbar height from the floaing extention toolbar position calculated.
152
- * In case of new tabs, MBE does not update the frame to the new tab so height comes as 0,
153
- * so we add the min height (100px) + borders (2px) as the default minimum frame height for toolbar to appear
154
- *
155
- */
156
- var frameheight = mbeFrameRect.height > 0 ? mbeFrameRect.height : 102;
157
- // MBE wrapper header height includes, top margin 8px + bottom margin 8px + Line height of 16px + padding top 8px
158
- // Ref: platform/packages/editor/editor-common/src/extensibility/MultiBodiedExtension/styles.ts
159
- var wrapperHeaderHeight = 40;
160
- var toolbarTopPos = mbeNodeRect.top + frameheight + wrapperHeaderHeight + scrollWrapper.scrollTop;
147
+ var nestedBodiedExtensionDomElement = editorView.nodeDOM(extensionNode.pos);
148
+ var nestedBodiedExtensionRect = nestedBodiedExtensionDomElement === null || nestedBodiedExtensionDomElement === void 0 ? void 0 : nestedBodiedExtensionDomElement.getBoundingClientRect();
149
+ var wrapperBounds = scrollWrapper.getBoundingClientRect();
150
+ var toolbarTopPos = nestedBodiedExtensionRect.bottom - wrapperBounds.top + scrollWrapper.scrollTop + BODIED_EXT_MBE_MARGIN_TOP;
161
151
  return {
162
152
  top: toolbarTopPos,
163
153
  left: nextPos.left
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-extension",
3
- "version": "1.0.5",
3
+ "version": "1.0.7",
4
4
  "description": "editor-plugin-extension plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,7 +31,7 @@
31
31
  "@atlaskit/button": "^17.6.0",
32
32
  "@atlaskit/checkbox": "^13.0.0",
33
33
  "@atlaskit/datetime-picker": "^13.0.3",
34
- "@atlaskit/editor-common": "^78.8.0",
34
+ "@atlaskit/editor-common": "^78.9.0",
35
35
  "@atlaskit/editor-json-transformer": "^8.10.0",
36
36
  "@atlaskit/editor-plugin-analytics": "^1.0.0",
37
37
  "@atlaskit/editor-plugin-context-identifier": "^1.0.0",
@@ -46,7 +46,7 @@
46
46
  "@atlaskit/form": "^9.0.3",
47
47
  "@atlaskit/icon": "^22.1.0",
48
48
  "@atlaskit/platform-feature-flags": "^0.2.0",
49
- "@atlaskit/primitives": "^3.1.0",
49
+ "@atlaskit/primitives": "^4.0.0",
50
50
  "@atlaskit/radio": "^6.0.0",
51
51
  "@atlaskit/section-message": "^6.4.0",
52
52
  "@atlaskit/select": "^17.1.0",
@@ -57,7 +57,7 @@
57
57
  "@atlaskit/textfield": "^6.0.0",
58
58
  "@atlaskit/theme": "^12.6.0",
59
59
  "@atlaskit/toggle": "^13.0.0",
60
- "@atlaskit/tokens": "^1.38.0",
60
+ "@atlaskit/tokens": "^1.39.0",
61
61
  "@atlaskit/tooltip": "^18.1.0",
62
62
  "@babel/runtime": "^7.0.0",
63
63
  "@emotion/react": "^11.7.1",