@atlaskit/editor-plugin-block-controls 1.10.0 → 1.10.1

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 (8) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/pm-plugins/main.js +2 -1
  3. package/dist/cjs/ui/drag-handle.js +30 -25
  4. package/dist/es2019/pm-plugins/main.js +2 -1
  5. package/dist/es2019/ui/drag-handle.js +30 -25
  6. package/dist/esm/pm-plugins/main.js +2 -1
  7. package/dist/esm/ui/drag-handle.js +30 -25
  8. package/package.json +6 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 1.10.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#125542](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/125542)
8
+ [`06bc2f65f892e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/06bc2f65f892e) -
9
+ ED-24304 resolve range error issue
10
+
3
11
  ## 1.10.0
4
12
 
5
13
  ### Minor Changes
package/dist/cjs/pm-plugins/main.js CHANGED
@@ -408,7 +408,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl) {
408
408
  if (!nodeElement) {
409
409
  return false;
410
410
  }
411
- var nodeTarget = state.doc.nodeAt(view.posAtDOM(nodeElement, 0) - 1);
411
+ var domPos = (0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_24304') ? Math.max(view.posAtDOM(nodeElement, 0) - 1, 0) : view.posAtDOM(nodeElement, 0) - 1;
412
+ var nodeTarget = state.doc.nodeAt(domPos);
412
413
  isSameNode = !!(nodeTarget && draggable !== null && draggable !== void 0 && draggable.eq(nodeTarget));
413
414
  }
414
415
  if (isSameNode) {
package/dist/cjs/ui/drag-handle.js CHANGED
@@ -68,6 +68,7 @@ var selectedStyles = (0, _react2.css)({
68
68
  color: "var(--ds-icon-selected, #0C66E4)"
69
69
  });
70
70
  var DragHandleInternal = function DragHandleInternal(_ref) {
71
+ var _api$core2, _api$analytics2, _api$core5, _api$core7;
71
72
  var view = _ref.view,
72
73
  api = _ref.api,
73
74
  getPos = _ref.getPos,
@@ -110,14 +111,15 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
110
111
  api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref2) {
111
112
  var _api$analytics;
112
113
  var tr = _ref2.tr;
113
- if (start === undefined) {
114
+ var startPos = (0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
115
+ if (startPos === undefined) {
114
116
  return tr;
115
117
  }
116
- tr = (0, _utils.selectNode)(tr, start, nodeType);
118
+ tr = (0, _utils.selectNode)(tr, startPos, nodeType);
117
119
  tr.setMeta(_main.key, {
118
- pos: start
120
+ pos: startPos
119
121
  });
120
- var resolvedMovingNode = tr.doc.resolve(start);
122
+ var resolvedMovingNode = tr.doc.resolve(startPos);
121
123
  var maybeNode = resolvedMovingNode.nodeAfter;
122
124
  (0, _platformFeatureFlags.fg)('platform.editor.elements.drag-and-drop-long-node-scroll') && tr.setMeta('scrollIntoView', false);
123
125
  api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.attachAnalyticsEvent({
@@ -133,14 +135,14 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
133
135
  return tr;
134
136
  });
135
137
  view.focus();
136
- }, [start, api, view, dragHandleSelected, setDragHandleSelected, nodeType]);
138
+ }, [dragHandleSelected, api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, view, getPos, start, nodeType]);
137
139
 
138
140
  // handleMouseDown required along with onClick to ensure the correct selection
139
141
  // is set immediately when the drag handle is clicked. Otherwise browser native
140
142
  // drag and drop can take over and cause unpredictable behaviour.
141
143
  var handleMouseDown = (0, _react.useCallback)(function () {
142
- var _api$core2;
143
- api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(function (_ref3) {
144
+ var _api$core3;
145
+ api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(function (_ref3) {
144
146
  var tr = _ref3.tr;
145
147
  if (start === undefined) {
146
148
  return tr;
@@ -158,44 +160,47 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
158
160
  // as expected with a node selection. This workaround sets the selection to the node on mouseDown,
159
161
  // but ensures the preview is generated correctly.
160
162
  var handleMouseDownWrapperRemoved = (0, _react.useCallback)(function () {
161
- var _api$core3;
162
- api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(function (_ref4) {
163
+ var _api$core4;
164
+ api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(function (_ref4) {
163
165
  var tr = _ref4.tr;
164
- if (start === undefined) {
166
+ var startPos = (0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
167
+ if (startPos === undefined) {
165
168
  return tr;
166
169
  }
167
- var node = tr.doc.nodeAt(start);
170
+ var node = tr.doc.nodeAt(startPos);
168
171
  if (!node) {
169
172
  return tr;
170
173
  }
171
- var $startPos = tr.doc.resolve(start + node.nodeSize);
174
+ var $startPos = tr.doc.resolve(startPos + node.nodeSize);
172
175
  var selection = new _state.TextSelection($startPos);
173
176
  tr.setSelection(selection);
174
177
  tr.setMeta(_main.key, {
175
- pos: start
178
+ pos: startPos
176
179
  });
177
180
  return tr;
178
181
  });
179
- }, [start, api]);
182
+ }, [api === null || api === void 0 || (_api$core5 = api.core) === null || _api$core5 === void 0 ? void 0 : _api$core5.actions, getPos, start]);
180
183
  var handleKeyDown = (0, _react.useCallback)(function (e) {
181
184
  if ((0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_23873')) {
182
185
  // allow user to use spacebar to select the node
186
+
183
187
  if (!e.repeat && e.key === ' ') {
184
- var _api$core4;
185
- api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(function (_ref5) {
188
+ var _api$core6;
189
+ var startPos = (0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
190
+ api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(function (_ref5) {
186
191
  var tr = _ref5.tr;
187
- if (start === undefined) {
192
+ if (startPos === undefined) {
188
193
  return tr;
189
194
  }
190
- var node = tr.doc.nodeAt(start);
195
+ var node = tr.doc.nodeAt(startPos);
191
196
  if (!node) {
192
197
  return tr;
193
198
  }
194
- var $startPos = tr.doc.resolve(start + node.nodeSize);
199
+ var $startPos = tr.doc.resolve(startPos + node.nodeSize);
195
200
  var selection = new _state.TextSelection($startPos);
196
201
  tr.setSelection(selection);
197
202
  tr.setMeta(_main.key, {
198
- pos: start
203
+ pos: startPos
199
204
  });
200
205
  return tr;
201
206
  });
@@ -207,7 +212,7 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
207
212
  view.focus();
208
213
  }
209
214
  }
210
- }, [start, api, view]);
215
+ }, [getPos, start, api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 ? void 0 : _api$core7.actions, view]);
211
216
  (0, _react.useEffect)(function () {
212
217
  var element = buttonRef.current;
213
218
  if (!element) {
@@ -236,12 +241,12 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
236
241
  });
237
242
  },
238
243
  onDragStart: function onDragStart() {
239
- var _api$core5;
244
+ var _api$core8;
240
245
  if (start === undefined) {
241
246
  return;
242
247
  }
243
- api === null || api === void 0 || (_api$core5 = api.core) === null || _api$core5 === void 0 || _api$core5.actions.execute(function (_ref8) {
244
- var _api$blockControls, _api$analytics2;
248
+ api === null || api === void 0 || (_api$core8 = api.core) === null || _api$core8 === void 0 || _api$core8.actions.execute(function (_ref8) {
249
+ var _api$blockControls, _api$analytics3;
245
250
  var tr = _ref8.tr;
246
251
  api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || _api$blockControls.commands.setNodeDragged(start, anchorName, nodeType)({
247
252
  tr: tr
@@ -249,7 +254,7 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
249
254
  var resolvedMovingNode = tr.doc.resolve(start);
250
255
  var maybeNode = resolvedMovingNode.nodeAfter;
251
256
  tr.setMeta('scrollIntoView', false);
252
- api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.attachAnalyticsEvent({
257
+ api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 || _api$analytics3.actions.attachAnalyticsEvent({
253
258
  eventType: _analytics.EVENT_TYPE.UI,
254
259
  action: _analytics.ACTION.DRAGGED,
255
260
  actionSubject: _analytics.ACTION_SUBJECT.ELEMENT,
package/dist/es2019/pm-plugins/main.js CHANGED
@@ -398,7 +398,8 @@ export const createPlugin = (api, getIntl) => {
398
398
  if (!nodeElement) {
399
399
  return false;
400
400
  }
401
- const nodeTarget = state.doc.nodeAt(view.posAtDOM(nodeElement, 0) - 1);
401
+ const domPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? Math.max(view.posAtDOM(nodeElement, 0) - 1, 0) : view.posAtDOM(nodeElement, 0) - 1;
402
+ const nodeTarget = state.doc.nodeAt(domPos);
402
403
  isSameNode = !!(nodeTarget && draggable !== null && draggable !== void 0 && draggable.eq(nodeTarget));
403
404
  }
404
405
  if (isSameNode) {
package/dist/es2019/ui/drag-handle.js CHANGED
@@ -68,6 +68,7 @@ const DragHandleInternal = ({
68
68
  },
69
69
  handleOptions
70
70
  }) => {
71
+ var _api$core2, _api$analytics2, _api$core5, _api$core7;
71
72
  const start = getPos();
72
73
  const buttonRef = useRef(null);
73
74
  const [blockCardWidth, setBlockCardWidth] = useState(768);
@@ -97,14 +98,15 @@ const DragHandleInternal = ({
97
98
  tr
98
99
  }) => {
99
100
  var _api$analytics;
100
- if (start === undefined) {
101
+ const startPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
102
+ if (startPos === undefined) {
101
103
  return tr;
102
104
  }
103
- tr = selectNode(tr, start, nodeType);
105
+ tr = selectNode(tr, startPos, nodeType);
104
106
  tr.setMeta(key, {
105
- pos: start
107
+ pos: startPos
106
108
  });
107
- const resolvedMovingNode = tr.doc.resolve(start);
109
+ const resolvedMovingNode = tr.doc.resolve(startPos);
108
110
  const maybeNode = resolvedMovingNode.nodeAfter;
109
111
  fg('platform.editor.elements.drag-and-drop-long-node-scroll') && tr.setMeta('scrollIntoView', false);
110
112
  api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.attachAnalyticsEvent({
@@ -120,14 +122,14 @@ const DragHandleInternal = ({
120
122
  return tr;
121
123
  });
122
124
  view.focus();
123
- }, [start, api, view, dragHandleSelected, setDragHandleSelected, nodeType]);
125
+ }, [dragHandleSelected, api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, view, getPos, start, nodeType]);
124
126
 
125
127
  // handleMouseDown required along with onClick to ensure the correct selection
126
128
  // is set immediately when the drag handle is clicked. Otherwise browser native
127
129
  // drag and drop can take over and cause unpredictable behaviour.
128
130
  const handleMouseDown = useCallback(() => {
129
- var _api$core2;
130
- api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(({
131
+ var _api$core3;
132
+ api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(({
131
133
  tr
132
134
  }) => {
133
135
  if (start === undefined) {
@@ -146,46 +148,49 @@ const DragHandleInternal = ({
146
148
  // as expected with a node selection. This workaround sets the selection to the node on mouseDown,
147
149
  // but ensures the preview is generated correctly.
148
150
  const handleMouseDownWrapperRemoved = useCallback(() => {
149
- var _api$core3;
150
- api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(({
151
+ var _api$core4;
152
+ api === null || api === void 0 ? void 0 : (_api$core4 = api.core) === null || _api$core4 === void 0 ? void 0 : _api$core4.actions.execute(({
151
153
  tr
152
154
  }) => {
153
- if (start === undefined) {
155
+ const startPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
156
+ if (startPos === undefined) {
154
157
  return tr;
155
158
  }
156
- const node = tr.doc.nodeAt(start);
159
+ const node = tr.doc.nodeAt(startPos);
157
160
  if (!node) {
158
161
  return tr;
159
162
  }
160
- const $startPos = tr.doc.resolve(start + node.nodeSize);
163
+ const $startPos = tr.doc.resolve(startPos + node.nodeSize);
161
164
  const selection = new TextSelection($startPos);
162
165
  tr.setSelection(selection);
163
166
  tr.setMeta(key, {
164
- pos: start
167
+ pos: startPos
165
168
  });
166
169
  return tr;
167
170
  });
168
- }, [start, api]);
171
+ }, [api === null || api === void 0 ? void 0 : (_api$core5 = api.core) === null || _api$core5 === void 0 ? void 0 : _api$core5.actions, getPos, start]);
169
172
  const handleKeyDown = useCallback(e => {
170
173
  if (fg('platform_editor_element_drag_and_drop_ed_23873')) {
171
174
  // allow user to use spacebar to select the node
175
+
172
176
  if (!e.repeat && e.key === ' ') {
173
- var _api$core4;
174
- api === null || api === void 0 ? void 0 : (_api$core4 = api.core) === null || _api$core4 === void 0 ? void 0 : _api$core4.actions.execute(({
177
+ var _api$core6;
178
+ const startPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
179
+ api === null || api === void 0 ? void 0 : (_api$core6 = api.core) === null || _api$core6 === void 0 ? void 0 : _api$core6.actions.execute(({
175
180
  tr
176
181
  }) => {
177
- if (start === undefined) {
182
+ if (startPos === undefined) {
178
183
  return tr;
179
184
  }
180
- const node = tr.doc.nodeAt(start);
185
+ const node = tr.doc.nodeAt(startPos);
181
186
  if (!node) {
182
187
  return tr;
183
188
  }
184
- const $startPos = tr.doc.resolve(start + node.nodeSize);
189
+ const $startPos = tr.doc.resolve(startPos + node.nodeSize);
185
190
  const selection = new TextSelection($startPos);
186
191
  tr.setSelection(selection);
187
192
  tr.setMeta(key, {
188
- pos: start
193
+ pos: startPos
189
194
  });
190
195
  return tr;
191
196
  });
@@ -195,7 +200,7 @@ const DragHandleInternal = ({
195
200
  view.focus();
196
201
  }
197
202
  }
198
- }, [start, api, view]);
203
+ }, [getPos, start, api === null || api === void 0 ? void 0 : (_api$core7 = api.core) === null || _api$core7 === void 0 ? void 0 : _api$core7.actions, view]);
199
204
  useEffect(() => {
200
205
  const element = buttonRef.current;
201
206
  if (!element) {
@@ -224,21 +229,21 @@ const DragHandleInternal = ({
224
229
  });
225
230
  },
226
231
  onDragStart() {
227
- var _api$core5;
232
+ var _api$core8;
228
233
  if (start === undefined) {
229
234
  return;
230
235
  }
231
- api === null || api === void 0 ? void 0 : (_api$core5 = api.core) === null || _api$core5 === void 0 ? void 0 : _api$core5.actions.execute(({
236
+ api === null || api === void 0 ? void 0 : (_api$core8 = api.core) === null || _api$core8 === void 0 ? void 0 : _api$core8.actions.execute(({
232
237
  tr
233
238
  }) => {
234
- var _api$blockControls, _api$analytics2;
239
+ var _api$blockControls, _api$analytics3;
235
240
  api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.commands.setNodeDragged(start, anchorName, nodeType)({
236
241
  tr
237
242
  });
238
243
  const resolvedMovingNode = tr.doc.resolve(start);
239
244
  const maybeNode = resolvedMovingNode.nodeAfter;
240
245
  tr.setMeta('scrollIntoView', false);
241
- api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.attachAnalyticsEvent({
246
+ api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.attachAnalyticsEvent({
242
247
  eventType: EVENT_TYPE.UI,
243
248
  action: ACTION.DRAGGED,
244
249
  actionSubject: ACTION_SUBJECT.ELEMENT,
package/dist/esm/pm-plugins/main.js CHANGED
@@ -401,7 +401,8 @@ export var createPlugin = function createPlugin(api, getIntl) {
401
401
  if (!nodeElement) {
402
402
  return false;
403
403
  }
404
- var nodeTarget = state.doc.nodeAt(view.posAtDOM(nodeElement, 0) - 1);
404
+ var domPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? Math.max(view.posAtDOM(nodeElement, 0) - 1, 0) : view.posAtDOM(nodeElement, 0) - 1;
405
+ var nodeTarget = state.doc.nodeAt(domPos);
405
406
  isSameNode = !!(nodeTarget && draggable !== null && draggable !== void 0 && draggable.eq(nodeTarget));
406
407
  }
407
408
  if (isSameNode) {
package/dist/esm/ui/drag-handle.js CHANGED
@@ -59,6 +59,7 @@ var selectedStyles = css({
59
59
  color: "var(--ds-icon-selected, #0C66E4)"
60
60
  });
61
61
  var DragHandleInternal = function DragHandleInternal(_ref) {
62
+ var _api$core2, _api$analytics2, _api$core5, _api$core7;
62
63
  var view = _ref.view,
63
64
  api = _ref.api,
64
65
  getPos = _ref.getPos,
@@ -101,14 +102,15 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
101
102
  api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref2) {
102
103
  var _api$analytics;
103
104
  var tr = _ref2.tr;
104
- if (start === undefined) {
105
+ var startPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
106
+ if (startPos === undefined) {
105
107
  return tr;
106
108
  }
107
- tr = selectNode(tr, start, nodeType);
109
+ tr = selectNode(tr, startPos, nodeType);
108
110
  tr.setMeta(key, {
109
- pos: start
111
+ pos: startPos
110
112
  });
111
- var resolvedMovingNode = tr.doc.resolve(start);
113
+ var resolvedMovingNode = tr.doc.resolve(startPos);
112
114
  var maybeNode = resolvedMovingNode.nodeAfter;
113
115
  fg('platform.editor.elements.drag-and-drop-long-node-scroll') && tr.setMeta('scrollIntoView', false);
114
116
  api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.attachAnalyticsEvent({
@@ -124,14 +126,14 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
124
126
  return tr;
125
127
  });
126
128
  view.focus();
127
- }, [start, api, view, dragHandleSelected, setDragHandleSelected, nodeType]);
129
+ }, [dragHandleSelected, api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, view, getPos, start, nodeType]);
128
130
 
129
131
  // handleMouseDown required along with onClick to ensure the correct selection
130
132
  // is set immediately when the drag handle is clicked. Otherwise browser native
131
133
  // drag and drop can take over and cause unpredictable behaviour.
132
134
  var handleMouseDown = useCallback(function () {
133
- var _api$core2;
134
- api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(function (_ref3) {
135
+ var _api$core3;
136
+ api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(function (_ref3) {
135
137
  var tr = _ref3.tr;
136
138
  if (start === undefined) {
137
139
  return tr;
@@ -149,44 +151,47 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
149
151
  // as expected with a node selection. This workaround sets the selection to the node on mouseDown,
150
152
  // but ensures the preview is generated correctly.
151
153
  var handleMouseDownWrapperRemoved = useCallback(function () {
152
- var _api$core3;
153
- api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(function (_ref4) {
154
+ var _api$core4;
155
+ api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(function (_ref4) {
154
156
  var tr = _ref4.tr;
155
- if (start === undefined) {
157
+ var startPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
158
+ if (startPos === undefined) {
156
159
  return tr;
157
160
  }
158
- var node = tr.doc.nodeAt(start);
161
+ var node = tr.doc.nodeAt(startPos);
159
162
  if (!node) {
160
163
  return tr;
161
164
  }
162
- var $startPos = tr.doc.resolve(start + node.nodeSize);
165
+ var $startPos = tr.doc.resolve(startPos + node.nodeSize);
163
166
  var selection = new TextSelection($startPos);
164
167
  tr.setSelection(selection);
165
168
  tr.setMeta(key, {
166
- pos: start
169
+ pos: startPos
167
170
  });
168
171
  return tr;
169
172
  });
170
- }, [start, api]);
173
+ }, [api === null || api === void 0 || (_api$core5 = api.core) === null || _api$core5 === void 0 ? void 0 : _api$core5.actions, getPos, start]);
171
174
  var handleKeyDown = useCallback(function (e) {
172
175
  if (fg('platform_editor_element_drag_and_drop_ed_23873')) {
173
176
  // allow user to use spacebar to select the node
177
+
174
178
  if (!e.repeat && e.key === ' ') {
175
- var _api$core4;
176
- api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(function (_ref5) {
179
+ var _api$core6;
180
+ var startPos = fg('platform_editor_element_drag_and_drop_ed_24304') ? getPos() : start;
181
+ api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(function (_ref5) {
177
182
  var tr = _ref5.tr;
178
- if (start === undefined) {
183
+ if (startPos === undefined) {
179
184
  return tr;
180
185
  }
181
- var node = tr.doc.nodeAt(start);
186
+ var node = tr.doc.nodeAt(startPos);
182
187
  if (!node) {
183
188
  return tr;
184
189
  }
185
- var $startPos = tr.doc.resolve(start + node.nodeSize);
190
+ var $startPos = tr.doc.resolve(startPos + node.nodeSize);
186
191
  var selection = new TextSelection($startPos);
187
192
  tr.setSelection(selection);
188
193
  tr.setMeta(key, {
189
- pos: start
194
+ pos: startPos
190
195
  });
191
196
  return tr;
192
197
  });
@@ -198,7 +203,7 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
198
203
  view.focus();
199
204
  }
200
205
  }
201
- }, [start, api, view]);
206
+ }, [getPos, start, api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 ? void 0 : _api$core7.actions, view]);
202
207
  useEffect(function () {
203
208
  var element = buttonRef.current;
204
209
  if (!element) {
@@ -227,12 +232,12 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
227
232
  });
228
233
  },
229
234
  onDragStart: function onDragStart() {
230
- var _api$core5;
235
+ var _api$core8;
231
236
  if (start === undefined) {
232
237
  return;
233
238
  }
234
- api === null || api === void 0 || (_api$core5 = api.core) === null || _api$core5 === void 0 || _api$core5.actions.execute(function (_ref8) {
235
- var _api$blockControls, _api$analytics2;
239
+ api === null || api === void 0 || (_api$core8 = api.core) === null || _api$core8 === void 0 || _api$core8.actions.execute(function (_ref8) {
240
+ var _api$blockControls, _api$analytics3;
236
241
  var tr = _ref8.tr;
237
242
  api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || _api$blockControls.commands.setNodeDragged(start, anchorName, nodeType)({
238
243
  tr: tr
@@ -240,7 +245,7 @@ var DragHandleInternal = function DragHandleInternal(_ref) {
240
245
  var resolvedMovingNode = tr.doc.resolve(start);
241
246
  var maybeNode = resolvedMovingNode.nodeAfter;
242
247
  tr.setMeta('scrollIntoView', false);
243
- api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.attachAnalyticsEvent({
248
+ api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 || _api$analytics3.actions.attachAnalyticsEvent({
244
249
  eventType: EVENT_TYPE.UI,
245
250
  action: ACTION.DRAGGED,
246
251
  actionSubject: ACTION_SUBJECT.ELEMENT,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "1.10.0",
3
+ "version": "1.10.1",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -32,7 +32,7 @@
32
32
  },
33
33
  "dependencies": {
34
34
  "@atlaskit/adf-schema": "^40.3.0",
35
- "@atlaskit/editor-common": "^87.0.0",
35
+ "@atlaskit/editor-common": "^87.2.0",
36
36
  "@atlaskit/editor-plugin-analytics": "^1.6.0",
37
37
  "@atlaskit/editor-plugin-editor-disabled": "^1.2.0",
38
38
  "@atlaskit/editor-plugin-feature-flags": "^1.2.0",
@@ -40,7 +40,7 @@
40
40
  "@atlaskit/editor-prosemirror": "5.0.1",
41
41
  "@atlaskit/editor-shared-styles": "^2.13.0",
42
42
  "@atlaskit/editor-tables": "^2.8.0",
43
- "@atlaskit/icon": "^22.7.0",
43
+ "@atlaskit/icon": "^22.8.0",
44
44
  "@atlaskit/platform-feature-flags": "^0.3.0",
45
45
  "@atlaskit/pragmatic-drag-and-drop": "^1.2.0",
46
46
  "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^1.4.0",
@@ -172,6 +172,9 @@
172
172
  },
173
173
  "platform_editor_elements_dnd_nested": {
174
174
  "type": "boolean"
175
+ },
176
+ "platform_editor_element_drag_and_drop_ed_24304": {
177
+ "type": "boolean"
175
178
  }
176
179
  }
177
180
  }