@atlaskit/editor-plugin-block-menu 0.0.1 → 0.0.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,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-block-menu
2
2
 
3
+ ## 0.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#199487](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/199487)
8
+ [`53b66ca466092`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/53b66ca466092) -
9
+ ED-28963 Update block menu to be aligned with drag handle
10
+ - Updated dependencies
11
+
3
12
  ## 0.0.1
4
13
 
5
14
  ### Patch Changes
@@ -30,6 +30,9 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
30
30
  var styles = {
31
31
  base: "_2rkoglpi _bfhk1bhr _16qs1cd0"
32
32
  };
33
+ var DRAG_HANDLE_SELECTOR = '[data-editor-block-ctrl-drag-handle=true]';
34
+ var DRAG_HANDLE_WIDTH = 12;
35
+ var DRAG_HANDLE_PADDING = 5;
33
36
  var PopupWithListeners = (0, _uiReact.withReactEditorViewOuterListeners)(_ui.Popup);
34
37
  var FormatDropdown = function FormatDropdown() {
35
38
  return /*#__PURE__*/_react.default.createElement(_dropdownMenu.default, {
@@ -92,7 +95,7 @@ var BlockMenuContent = function BlockMenuContent() {
92
95
  }, "Delete")));
93
96
  };
94
97
  var BlockMenu = function BlockMenu(_ref2) {
95
- var _editorView$hasFocus;
98
+ var _editorView$hasFocus, _editorView$dom;
96
99
  var editorView = _ref2.editorView,
97
100
  api = _ref2.api,
98
101
  mountTo = _ref2.mountTo,
@@ -126,8 +129,7 @@ var BlockMenu = function BlockMenu(_ref2) {
126
129
  closeMenu();
127
130
  return null;
128
131
  }
129
- var activeNodeSelector = menuTriggerBy && "[data-drag-handler-anchor-name=".concat(menuTriggerBy, "]");
130
- var targetHandleRef = activeNodeSelector ? document.querySelector(activeNodeSelector) : null;
132
+ var targetHandleRef = (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
131
133
  if (targetHandleRef instanceof HTMLElement) {
132
134
  return /*#__PURE__*/_react.default.createElement(PopupWithListeners, {
133
135
  alignX: 'left',
@@ -141,7 +143,7 @@ var BlockMenu = function BlockMenu(_ref2) {
141
143
  zIndex: _editorSharedStyles.akEditorFloatingOverlapPanelZIndex,
142
144
  forcePlacement: true,
143
145
  stick: true,
144
- offset: [-6, 8]
146
+ offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_PADDING, 0]
145
147
  }, /*#__PURE__*/_react.default.createElement(BlockMenuContent, null));
146
148
  } else {
147
149
  return null;
@@ -21,6 +21,9 @@ import { Box } from '@atlaskit/primitives/compiled';
21
21
  const styles = {
22
22
  base: "_2rkoglpi _bfhk1bhr _16qs1cd0"
23
23
  };
24
+ const DRAG_HANDLE_SELECTOR = '[data-editor-block-ctrl-drag-handle=true]';
25
+ const DRAG_HANDLE_WIDTH = 12;
26
+ const DRAG_HANDLE_PADDING = 5;
24
27
  const PopupWithListeners = withReactEditorViewOuterListeners(Popup);
25
28
  const FormatDropdown = () => {
26
29
  return /*#__PURE__*/React.createElement(DropdownMenu, {
@@ -88,7 +91,7 @@ const BlockMenu = ({
88
91
  boundariesElement,
89
92
  scrollableElement
90
93
  }) => {
91
- var _editorView$hasFocus;
94
+ var _editorView$hasFocus, _editorView$dom;
92
95
  const {
93
96
  menuTriggerBy,
94
97
  isSelectedViaDragHandle,
@@ -118,8 +121,7 @@ const BlockMenu = ({
118
121
  closeMenu();
119
122
  return null;
120
123
  }
121
- const activeNodeSelector = menuTriggerBy && `[data-drag-handler-anchor-name=${menuTriggerBy}]`;
122
- const targetHandleRef = activeNodeSelector ? document.querySelector(activeNodeSelector) : null;
124
+ const targetHandleRef = (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
123
125
  if (targetHandleRef instanceof HTMLElement) {
124
126
  return /*#__PURE__*/React.createElement(PopupWithListeners, {
125
127
  alignX: 'left',
@@ -133,7 +135,7 @@ const BlockMenu = ({
133
135
  zIndex: akEditorFloatingOverlapPanelZIndex,
134
136
  forcePlacement: true,
135
137
  stick: true,
136
- offset: [-6, 8]
138
+ offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_PADDING, 0]
137
139
  }, /*#__PURE__*/React.createElement(BlockMenuContent, null));
138
140
  } else {
139
141
  return null;
@@ -21,6 +21,9 @@ import { Box } from '@atlaskit/primitives/compiled';
21
21
  var styles = {
22
22
  base: "_2rkoglpi _bfhk1bhr _16qs1cd0"
23
23
  };
24
+ var DRAG_HANDLE_SELECTOR = '[data-editor-block-ctrl-drag-handle=true]';
25
+ var DRAG_HANDLE_WIDTH = 12;
26
+ var DRAG_HANDLE_PADDING = 5;
24
27
  var PopupWithListeners = withReactEditorViewOuterListeners(Popup);
25
28
  var FormatDropdown = function FormatDropdown() {
26
29
  return /*#__PURE__*/React.createElement(DropdownMenu, {
@@ -83,7 +86,7 @@ var BlockMenuContent = function BlockMenuContent() {
83
86
  }, "Delete")));
84
87
  };
85
88
  var BlockMenu = function BlockMenu(_ref2) {
86
- var _editorView$hasFocus;
89
+ var _editorView$hasFocus, _editorView$dom;
87
90
  var editorView = _ref2.editorView,
88
91
  api = _ref2.api,
89
92
  mountTo = _ref2.mountTo,
@@ -117,8 +120,7 @@ var BlockMenu = function BlockMenu(_ref2) {
117
120
  closeMenu();
118
121
  return null;
119
122
  }
120
- var activeNodeSelector = menuTriggerBy && "[data-drag-handler-anchor-name=".concat(menuTriggerBy, "]");
121
- var targetHandleRef = activeNodeSelector ? document.querySelector(activeNodeSelector) : null;
123
+ var targetHandleRef = (_editorView$dom = editorView.dom) === null || _editorView$dom === void 0 ? void 0 : _editorView$dom.querySelector(DRAG_HANDLE_SELECTOR);
122
124
  if (targetHandleRef instanceof HTMLElement) {
123
125
  return /*#__PURE__*/React.createElement(PopupWithListeners, {
124
126
  alignX: 'left',
@@ -132,7 +134,7 @@ var BlockMenu = function BlockMenu(_ref2) {
132
134
  zIndex: akEditorFloatingOverlapPanelZIndex,
133
135
  forcePlacement: true,
134
136
  stick: true,
135
- offset: [-6, 8]
137
+ offset: [DRAG_HANDLE_WIDTH + DRAG_HANDLE_PADDING, 0]
136
138
  }, /*#__PURE__*/React.createElement(BlockMenuContent, null));
137
139
  } else {
138
140
  return null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-menu",
3
- "version": "0.0.1",
3
+ "version": "0.0.2",
4
4
  "description": "BlockMenu plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -36,15 +36,15 @@
36
36
  "@atlaskit/editor-plugin-block-controls": "^4.1.0",
37
37
  "@atlaskit/editor-plugin-user-intent": "^1.1.0",
38
38
  "@atlaskit/editor-prosemirror": "7.0.0",
39
- "@atlaskit/editor-shared-styles": "^3.5.0",
40
- "@atlaskit/icon": "^27.9.0",
41
- "@atlaskit/icon-lab": "^5.3.0",
39
+ "@atlaskit/editor-shared-styles": "^3.6.0",
40
+ "@atlaskit/icon": "^27.11.0",
41
+ "@atlaskit/icon-lab": "^5.4.0",
42
42
  "@atlaskit/primitives": "^14.11.0",
43
43
  "@atlaskit/tokens": "^6.0.0",
44
44
  "@babel/runtime": "^7.0.0"
45
45
  },
46
46
  "peerDependencies": {
47
- "@atlaskit/editor-common": "^107.18.0",
47
+ "@atlaskit/editor-common": "^107.20.0",
48
48
  "react": "^18.2.0",
49
49
  "react-intl-next": "npm:react-intl@^5.18.1"
50
50
  },