@payloadcms/richtext-lexical 3.0.0-beta.90 → 3.0.0-beta.91

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 (80) hide show
  1. package/dist/exports/client/Field-SUWHJ4HF.js +2 -0
  2. package/dist/exports/client/Field-SUWHJ4HF.js.map +7 -0
  3. package/dist/exports/client/RelationshipComponent-EZORSGUZ.js +2 -0
  4. package/dist/exports/client/RelationshipComponent-EZORSGUZ.js.map +7 -0
  5. package/dist/exports/client/bundled.css +1 -1
  6. package/dist/exports/client/{chunk-NI6Z4GBD.js → chunk-OLSILJA6.js} +1 -1
  7. package/dist/exports/client/{chunk-NI6Z4GBD.js.map → chunk-OLSILJA6.js.map} +1 -1
  8. package/dist/exports/client/{chunk-G5DTIOPI.js → chunk-TD7O23AB.js} +2 -2
  9. package/dist/exports/client/{chunk-G5DTIOPI.js.map → chunk-TD7O23AB.js.map} +2 -2
  10. package/dist/exports/client/{chunk-LGUXX2QH.js → chunk-UJDWBQ2K.js} +2 -2
  11. package/dist/exports/client/{chunk-LGUXX2QH.js.map → chunk-UJDWBQ2K.js.map} +2 -2
  12. package/dist/exports/client/{chunk-OKMIHD2R.js → chunk-YL453UOS.js} +2 -2
  13. package/dist/exports/client/chunk-YSI2QILQ.js +2 -0
  14. package/dist/exports/client/{chunk-TO2W7Q2G.js.map → chunk-YSI2QILQ.js.map} +2 -2
  15. package/dist/exports/client/component-2YLEVOFH.js +2 -0
  16. package/dist/exports/client/component-2YLEVOFH.js.map +7 -0
  17. package/dist/exports/client/{component-LCAAX56T.js → component-7RAP75FW.js} +2 -2
  18. package/dist/exports/client/{componentInline-72VZAAHP.js → componentInline-YSHGRL2J.js} +2 -2
  19. package/dist/exports/client/index.js +12 -12
  20. package/dist/exports/client/index.js.map +3 -3
  21. package/dist/features/debug/testRecorder/client/plugin/index.js +187 -363
  22. package/dist/features/debug/testRecorder/client/plugin/index.js.map +1 -1
  23. package/dist/features/experimental_table/client/plugins/TableActionMenuPlugin/index.js +234 -470
  24. package/dist/features/experimental_table/client/plugins/TableActionMenuPlugin/index.js.map +1 -1
  25. package/dist/features/experimental_table/client/plugins/TableCellResizerPlugin/index.js +3 -16
  26. package/dist/features/experimental_table/client/plugins/TableCellResizerPlugin/index.js.map +1 -1
  27. package/dist/features/experimental_table/client/plugins/TableHoverActionsPlugin/index.js +59 -123
  28. package/dist/features/experimental_table/client/plugins/TableHoverActionsPlugin/index.js.map +1 -1
  29. package/dist/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.d.ts.map +1 -1
  30. package/dist/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.js +5 -3
  31. package/dist/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.js.map +1 -1
  32. package/dist/features/migrations/slateToLexical/converter/converters/link/converter.js +1 -1
  33. package/dist/features/migrations/slateToLexical/converter/converters/link/converter.js.map +1 -1
  34. package/dist/features/relationship/client/components/RelationshipComponent.d.ts.map +1 -1
  35. package/dist/features/relationship/client/components/RelationshipComponent.js +8 -5
  36. package/dist/features/relationship/client/components/RelationshipComponent.js.map +1 -1
  37. package/dist/features/relationship/server/nodes/RelationshipNode.d.ts +6 -4
  38. package/dist/features/relationship/server/nodes/RelationshipNode.d.ts.map +1 -1
  39. package/dist/features/relationship/server/nodes/RelationshipNode.js.map +1 -1
  40. package/dist/features/toolbars/inline/client/Toolbar/index.js +53 -94
  41. package/dist/features/toolbars/inline/client/Toolbar/index.js.map +1 -1
  42. package/dist/features/upload/client/component/index.d.ts.map +1 -1
  43. package/dist/features/upload/client/component/index.js +3 -0
  44. package/dist/features/upload/client/component/index.js.map +1 -1
  45. package/dist/features/upload/server/nodes/UploadNode.d.ts +9 -7
  46. package/dist/features/upload/server/nodes/UploadNode.d.ts.map +1 -1
  47. package/dist/features/upload/server/nodes/UploadNode.js.map +1 -1
  48. package/dist/field/bundled.css +1 -1
  49. package/dist/lexical/config/client/EditorConfigProvider.js +1 -1
  50. package/dist/lexical/config/client/EditorConfigProvider.js.map +1 -1
  51. package/dist/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.js +71 -109
  52. package/dist/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.js.map +1 -1
  53. package/dist/lexical/plugins/handles/AddBlockHandlePlugin/index.js +96 -135
  54. package/dist/lexical/plugins/handles/AddBlockHandlePlugin/index.js.map +1 -1
  55. package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.d.ts.map +1 -1
  56. package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.js +114 -139
  57. package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.js.map +1 -1
  58. package/dist/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.d.ts.map +1 -1
  59. package/dist/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.js +7 -25
  60. package/dist/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.js.map +1 -1
  61. package/dist/lexical/plugins/handles/utils/setHandlePosition.d.ts.map +1 -1
  62. package/dist/lexical/plugins/handles/utils/setHandlePosition.js +4 -6
  63. package/dist/lexical/plugins/handles/utils/setHandlePosition.js.map +1 -1
  64. package/dist/lexical/ui/icons/Caret/index.svg +2 -2
  65. package/dist/lexical/utils/setFloatingElemPosition.js +1 -1
  66. package/dist/lexical/utils/setFloatingElemPosition.js.map +1 -1
  67. package/dist/utilities/migrateSlateToLexical/index.d.ts.map +1 -1
  68. package/dist/utilities/migrateSlateToLexical/index.js +16 -1
  69. package/dist/utilities/migrateSlateToLexical/index.js.map +1 -1
  70. package/package.json +13 -13
  71. package/dist/exports/client/Field-63NGLPJB.js +0 -2
  72. package/dist/exports/client/Field-63NGLPJB.js.map +0 -7
  73. package/dist/exports/client/RelationshipComponent-3QWBV4GT.js +0 -2
  74. package/dist/exports/client/RelationshipComponent-3QWBV4GT.js.map +0 -7
  75. package/dist/exports/client/chunk-TO2W7Q2G.js +0 -2
  76. package/dist/exports/client/component-3OFD6Q4Z.js +0 -2
  77. package/dist/exports/client/component-3OFD6Q4Z.js.map +0 -7
  78. /package/dist/exports/client/{chunk-OKMIHD2R.js.map → chunk-YL453UOS.js.map} +0 -0
  79. /package/dist/exports/client/{component-LCAAX56T.js.map → component-7RAP75FW.js.map} +0 -0
  80. /package/dist/exports/client/{componentInline-72VZAAHP.js.map → componentInline-YSHGRL2J.js.map} +0 -0
@@ -1,6 +1,5 @@
1
1
  'use client';
2
2
 
3
- import { c as _c } from "react/compiler-runtime";
4
3
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
5
4
  import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
6
5
  import { eventFiles } from '@lexical/rich-text';
@@ -53,7 +52,6 @@ function hideTargetLine(targetLineElem, lastTargetBlockElem) {
53
52
  }
54
53
  }
55
54
  function useDraggableBlockMenu(editor, anchorElem, isEditable) {
56
- const $ = _c(19);
57
55
  const scrollerElem = anchorElem.parentElement;
58
56
  const menuRef = useRef(null);
59
57
  const targetLineRef = useRef(null);
@@ -65,99 +63,65 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
65
63
  editorConfig
66
64
  } = useEditorConfigContext();
67
65
  const blockHandleHorizontalOffset = editorConfig?.admin?.hideGutter ? -44 : -8;
68
- let t0;
69
- let t1;
70
- if ($[0] !== scrollerElem || $[1] !== editor || $[2] !== anchorElem || $[3] !== draggableBlockElem) {
71
- t0 = () => {
72
- const onDocumentMouseMove = function onDocumentMouseMove(event) {
73
- const target = event.target;
74
- if (!isHTMLElement(target)) {
75
- return;
76
- }
77
- const distanceFromScrollerElem = calculateDistanceFromScrollerElem(scrollerElem, event.pageX, event.pageY, target);
78
- if (distanceFromScrollerElem === -1) {
79
- setDraggableBlockElem(null);
80
- return;
81
- }
82
- if (isOnHandleElement(target, DRAGGABLE_BLOCK_MENU_CLASSNAME)) {
83
- return;
84
- }
85
- const topLevelNodeKeys = getTopLevelNodeKeys(editor);
86
- const {
87
- blockElem: _draggableBlockElem,
88
- foundAtIndex,
89
- isFoundNodeEmptyParagraph
90
- } = getNodeCloseToPoint({
91
- anchorElem,
92
- cache_threshold: 0,
93
- editor,
94
- horizontalOffset: -distanceFromScrollerElem,
95
- point: new Point(event.x, event.y),
96
- startIndex: getCurrentIndex(topLevelNodeKeys.length),
97
- useEdgeAsDefault: false,
98
- verbose: false
99
- });
100
- prevIndex = foundAtIndex;
101
- if (!_draggableBlockElem && !isFoundNodeEmptyParagraph) {
102
- return;
103
- }
104
- if (draggableBlockElem !== _draggableBlockElem) {
105
- setDraggableBlockElem(_draggableBlockElem);
106
- }
107
- };
108
- document?.addEventListener("mousemove", onDocumentMouseMove);
109
- return () => {
110
- document?.removeEventListener("mousemove", onDocumentMouseMove);
111
- };
112
- };
113
- t1 = [scrollerElem, anchorElem, editor, draggableBlockElem];
114
- $[0] = scrollerElem;
115
- $[1] = editor;
116
- $[2] = anchorElem;
117
- $[3] = draggableBlockElem;
118
- $[4] = t0;
119
- $[5] = t1;
120
- } else {
121
- t0 = $[4];
122
- t1 = $[5];
123
- }
124
- useEffect(t0, t1);
125
- let t2;
126
- let t3;
127
- if ($[6] !== draggableBlockElem || $[7] !== anchorElem || $[8] !== blockHandleHorizontalOffset) {
128
- t2 = () => {
129
- if (menuRef.current) {
130
- setHandlePosition(draggableBlockElem, menuRef.current, anchorElem, blockHandleHorizontalOffset);
66
+ useEffect(() => {
67
+ /**
68
+ * Handles positioning of the drag handle
69
+ */
70
+ function onDocumentMouseMove(event) {
71
+ const target = event.target;
72
+ if (!isHTMLElement(target)) {
73
+ return;
74
+ }
75
+ const distanceFromScrollerElem = calculateDistanceFromScrollerElem(scrollerElem, event.pageX, event.pageY, target);
76
+ if (distanceFromScrollerElem === -1) {
77
+ setDraggableBlockElem(null);
78
+ return;
131
79
  }
80
+ if (isOnHandleElement(target, DRAGGABLE_BLOCK_MENU_CLASSNAME)) {
81
+ return;
82
+ }
83
+ const topLevelNodeKeys = getTopLevelNodeKeys(editor);
84
+ const {
85
+ blockElem: _draggableBlockElem,
86
+ foundAtIndex,
87
+ isFoundNodeEmptyParagraph
88
+ } = getNodeCloseToPoint({
89
+ anchorElem,
90
+ cache_threshold: 0,
91
+ editor,
92
+ horizontalOffset: -distanceFromScrollerElem,
93
+ point: new Point(event.x, event.y),
94
+ startIndex: getCurrentIndex(topLevelNodeKeys.length),
95
+ useEdgeAsDefault: false,
96
+ verbose: false
97
+ });
98
+ prevIndex = foundAtIndex;
99
+ //if (DEBUG && _draggableBlockElem) {
100
+ //targetBlockElem.style.border = '3px solid red'
101
+ // highlightElemOriginalPosition(debugHighlightRef, _draggableBlockElem, anchorElem)
102
+ //}
103
+ if (!_draggableBlockElem && !isFoundNodeEmptyParagraph) {
104
+ return;
105
+ }
106
+ if (draggableBlockElem !== _draggableBlockElem) {
107
+ setDraggableBlockElem(_draggableBlockElem);
108
+ }
109
+ }
110
+ // Since the draggableBlockElem is outside the actual editor, we need to listen to the document
111
+ // to be able to detect when the mouse is outside the editor and respect a buffer around
112
+ // the scrollerElem to avoid the draggableBlockElem disappearing too early.
113
+ document?.addEventListener('mousemove', onDocumentMouseMove);
114
+ return () => {
115
+ document?.removeEventListener('mousemove', onDocumentMouseMove);
132
116
  };
133
- t3 = [anchorElem, draggableBlockElem, blockHandleHorizontalOffset];
134
- $[6] = draggableBlockElem;
135
- $[7] = anchorElem;
136
- $[8] = blockHandleHorizontalOffset;
137
- $[9] = t2;
138
- $[10] = t3;
139
- } else {
140
- t2 = $[9];
141
- t3 = $[10];
142
- }
143
- useEffect(t2, t3);
144
- const t4 = editorConfig?.admin?.hideGutter;
145
- let t5;
146
- if ($[11] !== scrollerElem || $[12] !== blockHandleHorizontalOffset || $[13] !== anchorElem || $[14] !== editor || $[15] !== lastTargetBlock || $[16] !== draggableBlockElem || $[17] !== t4) {
147
- t5 = [scrollerElem, blockHandleHorizontalOffset, anchorElem, editor, lastTargetBlock, draggableBlockElem, t4];
148
- $[11] = scrollerElem;
149
- $[12] = blockHandleHorizontalOffset;
150
- $[13] = anchorElem;
151
- $[14] = editor;
152
- $[15] = lastTargetBlock;
153
- $[16] = draggableBlockElem;
154
- $[17] = t4;
155
- $[18] = t5;
156
- } else {
157
- t5 = $[18];
158
- }
117
+ }, [scrollerElem, anchorElem, editor, draggableBlockElem]);
159
118
  useEffect(() => {
160
- const onDragover = function onDragover(event_0) {
119
+ if (menuRef.current) {
120
+ setHandlePosition(draggableBlockElem, menuRef.current, anchorElem, blockHandleHorizontalOffset);
121
+ }
122
+ }, [anchorElem, draggableBlockElem, blockHandleHorizontalOffset]);
123
+ useEffect(() => {
124
+ function onDragover(event_0) {
161
125
  if (!isDraggingBlockRef.current) {
162
126
  return false;
163
127
  }
@@ -190,6 +154,7 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
190
154
  });
191
155
  prevIndex = foundAtIndex_0;
192
156
  const targetLineElem = targetLineRef.current;
157
+ // targetBlockElem === null shouldn't happen
193
158
  if (targetBlockElem === null || targetLineElem === null) {
194
159
  return false;
195
160
  }
@@ -197,7 +162,10 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
197
162
  const {
198
163
  isBelow,
199
164
  willStayInSamePosition
200
- } = setTargetLine(editorConfig?.admin?.hideGutter ? "0px" : "3rem", blockHandleHorizontalOffset + (editorConfig?.admin?.hideGutter ? menuRef?.current?.getBoundingClientRect()?.width ?? 0 : -(menuRef?.current?.getBoundingClientRect()?.width ?? 0)), targetLineElem, targetBlockElem, lastTargetBlock, pageY, anchorElem, event_0, debugHighlightRef, isFoundNodeEmptyParagraph_0);
165
+ } = setTargetLine(editorConfig?.admin?.hideGutter ? '0px' : '3rem', blockHandleHorizontalOffset + (editorConfig?.admin?.hideGutter ? menuRef?.current?.getBoundingClientRect()?.width ?? 0 : -(menuRef?.current?.getBoundingClientRect()?.width ?? 0)), targetLineElem, targetBlockElem, lastTargetBlock, pageY, anchorElem, event_0, debugHighlightRef, isFoundNodeEmptyParagraph_0);
166
+ // Prevent default event to be able to trigger onDrop events
167
+ // Calling preventDefault() adds the green plus icon to the cursor,
168
+ // indicating that the drop is allowed.
201
169
  event_0.preventDefault();
202
170
  if (!willStayInSamePosition) {
203
171
  setLastTargetBlock({
@@ -215,8 +183,8 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
215
183
  });
216
184
  }
217
185
  return true;
218
- };
219
- const onDrop = function onDrop(event_1) {
186
+ }
187
+ function onDrop(event_1) {
220
188
  if (!isDraggingBlockRef.current) {
221
189
  return false;
222
190
  }
@@ -229,7 +197,7 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
229
197
  pageY: pageY_0,
230
198
  target: target_1
231
199
  } = event_1;
232
- const dragData = dataTransfer?.getData(DRAG_DATA_FORMAT) || "";
200
+ const dragData = dataTransfer?.getData(DRAG_DATA_FORMAT) || '';
233
201
  editor.update(() => {
234
202
  const draggedNode = $getNodeByKey(dragData);
235
203
  if (!draggedNode) {
@@ -268,68 +236,77 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
268
236
  const isBelow_0 = mouseY >= targetBlockElemTop + targetBlockElemHeight / 2 + window.scrollY;
269
237
  if (!isFoundNodeEmptyParagraph_1) {
270
238
  if (isBelow_0) {
239
+ // below targetBlockElem
271
240
  targetNode.insertAfter(draggedNode);
272
241
  } else {
242
+ // above targetBlockElem
273
243
  targetNode.insertBefore(draggedNode);
274
244
  }
275
245
  } else {
246
+ //
276
247
  targetNode.insertBefore(draggedNode);
277
248
  targetNode.remove();
278
249
  }
250
+ /*
251
+ if (pageY >= targetBlockElemTop + targetBlockElemHeight / 2) {
252
+ targetNode.insertAfter(draggedNode)
253
+ } else {
254
+ targetNode.insertBefore(draggedNode)
255
+ }*/
279
256
  if (draggableBlockElem !== null) {
280
257
  setDraggableBlockElem(null);
281
258
  }
282
- const allPrevHighlighters = document.querySelectorAll(".lexical-block-highlighter");
259
+ // find all previous elements with lexical-block-highlighter class and remove them
260
+ const allPrevHighlighters = document.querySelectorAll('.lexical-block-highlighter');
283
261
  allPrevHighlighters.forEach(highlighter => {
284
262
  highlighter.remove();
285
263
  });
286
264
  const newInsertedElem = editor.getElementByKey(draggedNode.getKey());
287
265
  setTimeout(() => {
266
+ // add new temp html element to newInsertedElem with the same height and width and the class block-selected
267
+ // to highlight the new inserted element
288
268
  const newInsertedElemRect = newInsertedElem.getBoundingClientRect();
289
- const highlightElem = document.createElement("div");
290
- highlightElem.className = "lexical-block-highlighter";
291
- if (document.documentElement.getAttribute("data-theme") === "dark") {
292
- highlightElem.style.backgroundColor = "white";
293
- } else {
294
- highlightElem.style.backgroundColor = "black";
295
- }
296
- highlightElem.style.transition = "opacity 0.1s ease-in-out";
297
- highlightElem.style.zIndex = "1";
298
- highlightElem.style.pointerEvents = "none";
299
- highlightElem.style.boxSizing = "border-box";
300
- highlightElem.style.borderRadius = "4px";
301
- highlightElem.style.position = "absolute";
269
+ const highlightElem = document.createElement('div');
270
+ highlightElem.className = 'lexical-block-highlighter';
271
+ highlightElem.style.backgroundColor = 'var(--theme-elevation-1000';
272
+ highlightElem.style.transition = 'opacity 0.5s ease-in-out';
273
+ highlightElem.style.zIndex = '1';
274
+ highlightElem.style.pointerEvents = 'none';
275
+ highlightElem.style.boxSizing = 'border-box';
276
+ highlightElem.style.borderRadius = '4px';
277
+ highlightElem.style.position = 'absolute';
302
278
  document.body.appendChild(highlightElem);
303
- highlightElem.style.opacity = "0.1";
279
+ highlightElem.style.opacity = '0.1';
304
280
  highlightElem.style.height = `${newInsertedElemRect.height + 8}px`;
305
281
  highlightElem.style.width = `${newInsertedElemRect.width + 8}px`;
306
282
  highlightElem.style.top = `${newInsertedElemRect.top + window.scrollY - 4}px`;
307
283
  highlightElem.style.left = `${newInsertedElemRect.left - 4}px`;
308
284
  setTimeout(() => {
309
- highlightElem.style.opacity = "0";
285
+ highlightElem.style.opacity = '0';
310
286
  setTimeout(() => {
311
287
  highlightElem.remove();
312
- }, 1000);
313
- }, 3000);
288
+ }, 500);
289
+ }, 1000);
314
290
  }, 120);
315
291
  });
316
292
  return true;
317
- };
318
- document.addEventListener("dragover", onDragover);
319
- document.addEventListener("drop", onDrop);
293
+ }
294
+ // register onDragover event listeners:
295
+ document.addEventListener('dragover', onDragover);
296
+ // register onDrop event listeners:
297
+ document.addEventListener('drop', onDrop);
320
298
  return () => {
321
- document.removeEventListener("dragover", onDragover);
322
- document.removeEventListener("drop", onDrop);
299
+ document.removeEventListener('dragover', onDragover);
300
+ document.removeEventListener('drop', onDrop);
323
301
  };
324
- }, t5);
325
- const onDragStart = function onDragStart(event_2) {
302
+ }, [scrollerElem, blockHandleHorizontalOffset, anchorElem, editor, lastTargetBlock, draggableBlockElem, editorConfig?.admin?.hideGutter]);
303
+ function onDragStart(event_2) {
326
304
  const dataTransfer_0 = event_2.dataTransfer;
327
305
  if (!dataTransfer_0 || !draggableBlockElem) {
328
306
  return;
329
307
  }
330
308
  setDragImage(dataTransfer_0, draggableBlockElem);
331
- let nodeKey;
332
- nodeKey = "";
309
+ let nodeKey = '';
333
310
  editor.update(() => {
334
311
  const node = $getNearestNodeFromDOMNode(draggableBlockElem);
335
312
  if (node) {
@@ -338,35 +315,33 @@ function useDraggableBlockMenu(editor, anchorElem, isEditable) {
338
315
  });
339
316
  isDraggingBlockRef.current = true;
340
317
  dataTransfer_0.setData(DRAG_DATA_FORMAT, nodeKey);
341
- };
342
- const onDragEnd = function onDragEnd() {
318
+ }
319
+ function onDragEnd() {
343
320
  isDraggingBlockRef.current = false;
344
321
  hideTargetLine(targetLineRef.current, lastTargetBlock?.elem);
345
- };
346
- return createPortal(_jsxs(React.Fragment, {
347
- children: [_jsx("div", {
322
+ }
323
+ return /*#__PURE__*/createPortal( /*#__PURE__*/_jsxs(React.Fragment, {
324
+ children: [/*#__PURE__*/_jsx("div", {
348
325
  className: "icon draggable-block-menu",
349
326
  draggable: true,
350
- onDragEnd,
351
- onDragStart,
327
+ onDragEnd: onDragEnd,
328
+ onDragStart: onDragStart,
352
329
  ref: menuRef,
353
- children: _jsx("div", {
354
- className: isEditable ? "icon" : ""
330
+ children: /*#__PURE__*/_jsx("div", {
331
+ className: isEditable ? 'icon' : ''
355
332
  })
356
- }), _jsx("div", {
333
+ }), /*#__PURE__*/_jsx("div", {
357
334
  className: "draggable-block-target-line",
358
335
  ref: targetLineRef
359
- }), _jsx("div", {
336
+ }), /*#__PURE__*/_jsx("div", {
360
337
  className: "debug-highlight",
361
338
  ref: debugHighlightRef
362
339
  })]
363
340
  }), anchorElem);
364
341
  }
365
- export function DraggableBlockPlugin(t0) {
366
- const {
367
- anchorElem: t1
368
- } = t0;
369
- const anchorElem = t1 === undefined ? document.body : t1;
342
+ export function DraggableBlockPlugin({
343
+ anchorElem = document.body
344
+ }) {
370
345
  const [editor] = useLexicalComposerContext();
371
346
  return useDraggableBlockMenu(editor, anchorElem, editor._editable);
372
347
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","eventFiles","$getNearestNodeFromDOMNode","$getNodeByKey","React","useEffect","useRef","useState","createPortal","useEditorConfigContext","isHTMLElement","Point","calculateDistanceFromScrollerElem","getNodeCloseToPoint","getTopLevelNodeKeys","isOnHandleElement","setHandlePosition","getBoundingClientRectWithoutTransform","setTargetLine","DRAGGABLE_BLOCK_MENU_CLASSNAME","DRAG_DATA_FORMAT","prevIndex","Infinity","getCurrentIndex","keysLength","Math","floor","setDragImage","dataTransfer","draggableBlockElem","transform","style","setTimeout","hideTargetLine","targetLineElem","lastTargetBlockElem","opacity","marginBottom","marginTop","useDraggableBlockMenu","editor","anchorElem","isEditable","$","scrollerElem","parentElement","menuRef","targetLineRef","debugHighlightRef","isDraggingBlockRef","setDraggableBlockElem","lastTargetBlock","setLastTargetBlock","editorConfig","blockHandleHorizontalOffset","admin","hideGutter","t0","t1","onDocumentMouseMove","event","target","distanceFromScrollerElem","pageX","pageY","topLevelNodeKeys","blockElem","_draggableBlockElem","foundAtIndex","isFoundNodeEmptyParagraph","cache_threshold","horizontalOffset","point","x","y","startIndex","length","useEdgeAsDefault","verbose","document","addEventListener","removeEventListener","t2","t3","current","t4","t5","onDragover","event_0","isFileTransfer","target_0","distanceFromScrollerElem_0","topLevelNodeKeys_0","targetBlockElem","foundAtIndex_0","isFoundNodeEmptyParagraph_0","fuzzy","isBelow","willStayInSamePosition","getBoundingClientRect","width","preventDefault","boundingBox","elem","onDrop","event_1","isFileTransfer_0","pageY_0","target_1","dragData","getData","update","draggedNode","distanceFromScrollerElem_1","targetBlockElem_0","isFoundNodeEmptyParagraph_1","targetNode","height","targetBlockElemHeight","top","targetBlockElemTop","mouseY","isBelow_0","window","scrollY","insertAfter","insertBefore","remove","allPrevHighlighters","querySelectorAll","forEach","highlighter","newInsertedElem","getElementByKey","getKey","newInsertedElemRect","highlightElem","createElement","className","documentElement","getAttribute","backgroundColor","transition","zIndex","pointerEvents","boxSizing","borderRadius","position","body","appendChild","left","onDragStart","event_2","dataTransfer_0","nodeKey","node","setData","onDragEnd","_jsxs","Fragment","children","_jsx","draggable","ref","DraggableBlockPlugin","undefined","_editable"],"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\nimport type { DragEvent as ReactDragEvent } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { eventFiles } from '@lexical/rich-text'\nimport { $getNearestNodeFromDOMNode, $getNodeByKey } from 'lexical'\nimport * as React from 'react'\nimport { useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { useEditorConfigContext } from '../../../config/client/EditorConfigProvider.js'\nimport { isHTMLElement } from '../../../utils/guard.js'\nimport { Point } from '../../../utils/point.js'\nimport { calculateDistanceFromScrollerElem } from '../utils/calculateDistanceFromScrollerElem.js'\nimport { getNodeCloseToPoint } from '../utils/getNodeCloseToPoint.js'\nimport { getTopLevelNodeKeys } from '../utils/getTopLevelNodeKeys.js'\nimport { isOnHandleElement } from '../utils/isOnHandleElement.js'\nimport { setHandlePosition } from '../utils/setHandlePosition.js'\nimport { getBoundingClientRectWithoutTransform } from './getBoundingRectWithoutTransform.js'\nimport './index.scss'\nimport { setTargetLine } from './setTargetLine.js'\n\nconst DRAGGABLE_BLOCK_MENU_CLASSNAME = 'draggable-block-menu'\nconst DRAG_DATA_FORMAT = 'application/x-lexical-drag-block'\n\nlet prevIndex = Infinity\n\nfunction getCurrentIndex(keysLength: number): number {\n if (keysLength === 0) {\n return Infinity\n }\n if (prevIndex >= 0 && prevIndex < keysLength) {\n return prevIndex\n }\n\n return Math.floor(keysLength / 2)\n}\n\nfunction setDragImage(dataTransfer: DataTransfer, draggableBlockElem: HTMLElement) {\n const { transform } = draggableBlockElem.style\n\n // Remove dragImage borders\n dataTransfer.setDragImage(draggableBlockElem, 0, 0)\n\n setTimeout(() => {\n draggableBlockElem.style.transform = transform\n })\n}\n\nfunction hideTargetLine(\n targetLineElem: HTMLElement | null,\n lastTargetBlockElem: HTMLElement | null,\n) {\n if (targetLineElem) {\n targetLineElem.style.opacity = '0'\n }\n if (lastTargetBlockElem) {\n lastTargetBlockElem.style.opacity = ''\n // Delete marginBottom and marginTop values we set\n lastTargetBlockElem.style.marginBottom = ''\n lastTargetBlockElem.style.marginTop = ''\n //lastTargetBlock.style.border = 'none'\n }\n}\n\nfunction useDraggableBlockMenu(\n editor: LexicalEditor,\n anchorElem: HTMLElement,\n isEditable: boolean,\n): React.ReactElement {\n const scrollerElem = anchorElem.parentElement\n\n const menuRef = useRef<HTMLDivElement>(null)\n const targetLineRef = useRef<HTMLDivElement>(null)\n const debugHighlightRef = useRef<HTMLDivElement>(null)\n const isDraggingBlockRef = useRef<boolean>(false)\n const [draggableBlockElem, setDraggableBlockElem] = useState<HTMLElement | null>(null)\n const [lastTargetBlock, setLastTargetBlock] = useState<{\n boundingBox?: DOMRect\n elem: HTMLElement | null\n isBelow: boolean\n }>(null)\n\n const { editorConfig } = useEditorConfigContext()\n\n const blockHandleHorizontalOffset = editorConfig?.admin?.hideGutter ? -44 : -8\n\n useEffect(() => {\n /**\n * Handles positioning of the drag handle\n */\n function onDocumentMouseMove(event: MouseEvent) {\n const target = event.target\n if (!isHTMLElement(target)) {\n return\n }\n\n const distanceFromScrollerElem = calculateDistanceFromScrollerElem(\n scrollerElem,\n event.pageX,\n event.pageY,\n target,\n )\n if (distanceFromScrollerElem === -1) {\n setDraggableBlockElem(null)\n return\n }\n\n if (isOnHandleElement(target, DRAGGABLE_BLOCK_MENU_CLASSNAME)) {\n return\n }\n\n const topLevelNodeKeys = getTopLevelNodeKeys(editor)\n\n const {\n blockElem: _draggableBlockElem,\n foundAtIndex,\n isFoundNodeEmptyParagraph,\n } = getNodeCloseToPoint({\n anchorElem,\n cache_threshold: 0,\n editor,\n horizontalOffset: -distanceFromScrollerElem,\n point: new Point(event.x, event.y),\n startIndex: getCurrentIndex(topLevelNodeKeys.length),\n useEdgeAsDefault: false,\n verbose: false,\n })\n\n prevIndex = foundAtIndex\n\n //if (DEBUG && _draggableBlockElem) {\n //targetBlockElem.style.border = '3px solid red'\n // highlightElemOriginalPosition(debugHighlightRef, _draggableBlockElem, anchorElem)\n //}\n\n if (!_draggableBlockElem && !isFoundNodeEmptyParagraph) {\n return\n }\n\n if (draggableBlockElem !== _draggableBlockElem) {\n setDraggableBlockElem(_draggableBlockElem)\n }\n }\n\n // Since the draggableBlockElem is outside the actual editor, we need to listen to the document\n // to be able to detect when the mouse is outside the editor and respect a buffer around\n // the scrollerElem to avoid the draggableBlockElem disappearing too early.\n document?.addEventListener('mousemove', onDocumentMouseMove)\n\n return () => {\n document?.removeEventListener('mousemove', onDocumentMouseMove)\n }\n }, [scrollerElem, anchorElem, editor, draggableBlockElem])\n\n useEffect(() => {\n if (menuRef.current) {\n setHandlePosition(\n draggableBlockElem,\n menuRef.current,\n anchorElem,\n blockHandleHorizontalOffset,\n )\n }\n }, [anchorElem, draggableBlockElem, blockHandleHorizontalOffset])\n\n useEffect(() => {\n function onDragover(event: DragEvent): boolean {\n if (!isDraggingBlockRef.current) {\n return false\n }\n const [isFileTransfer] = eventFiles(event)\n if (isFileTransfer) {\n return false\n }\n\n const { pageY, target } = event\n if (!isHTMLElement(target)) {\n return false\n }\n\n const distanceFromScrollerElem = calculateDistanceFromScrollerElem(\n scrollerElem,\n event.pageX,\n event.pageY,\n target,\n 100,\n 50,\n )\n\n const topLevelNodeKeys = getTopLevelNodeKeys(editor)\n\n const {\n blockElem: targetBlockElem,\n foundAtIndex,\n isFoundNodeEmptyParagraph,\n } = getNodeCloseToPoint({\n anchorElem,\n editor,\n fuzzy: true,\n horizontalOffset: -distanceFromScrollerElem,\n point: new Point(event.x, event.y),\n startIndex: getCurrentIndex(topLevelNodeKeys.length),\n useEdgeAsDefault: true,\n verbose: true,\n })\n\n prevIndex = foundAtIndex\n\n const targetLineElem = targetLineRef.current\n // targetBlockElem === null shouldn't happen\n if (targetBlockElem === null || targetLineElem === null) {\n return false\n }\n\n if (draggableBlockElem !== targetBlockElem) {\n const { isBelow, willStayInSamePosition } = setTargetLine(\n editorConfig?.admin?.hideGutter ? '0px' : '3rem',\n blockHandleHorizontalOffset +\n (editorConfig?.admin?.hideGutter\n ? menuRef?.current?.getBoundingClientRect()?.width ?? 0\n : -(menuRef?.current?.getBoundingClientRect()?.width ?? 0)),\n targetLineElem,\n targetBlockElem,\n lastTargetBlock,\n pageY,\n anchorElem,\n event,\n debugHighlightRef,\n isFoundNodeEmptyParagraph,\n )\n\n // Prevent default event to be able to trigger onDrop events\n // Calling preventDefault() adds the green plus icon to the cursor,\n // indicating that the drop is allowed.\n event.preventDefault()\n\n if (!willStayInSamePosition) {\n setLastTargetBlock({\n boundingBox: targetBlockElem.getBoundingClientRect(),\n elem: targetBlockElem,\n isBelow,\n })\n }\n } else {\n hideTargetLine(targetLineElem, lastTargetBlock?.elem)\n setLastTargetBlock({\n boundingBox: targetBlockElem.getBoundingClientRect(),\n elem: targetBlockElem,\n isBelow: false,\n })\n }\n\n return true\n }\n\n function onDrop(event: DragEvent): boolean {\n if (!isDraggingBlockRef.current) {\n return false\n }\n const [isFileTransfer] = eventFiles(event)\n if (isFileTransfer) {\n return false\n }\n const { dataTransfer, pageY, target } = event\n const dragData = dataTransfer?.getData(DRAG_DATA_FORMAT) || ''\n\n editor.update(() => {\n const draggedNode = $getNodeByKey(dragData)\n if (!draggedNode) {\n return false\n }\n if (!isHTMLElement(target)) {\n return false\n }\n const distanceFromScrollerElem = calculateDistanceFromScrollerElem(\n scrollerElem,\n event.pageX,\n event.pageY,\n target,\n 100,\n 50,\n )\n\n const { blockElem: targetBlockElem, isFoundNodeEmptyParagraph } = getNodeCloseToPoint({\n anchorElem,\n editor,\n fuzzy: true,\n horizontalOffset: -distanceFromScrollerElem,\n point: new Point(event.x, event.y),\n useEdgeAsDefault: true,\n })\n\n if (!targetBlockElem) {\n return false\n }\n const targetNode = $getNearestNodeFromDOMNode(targetBlockElem)\n if (!targetNode) {\n return false\n }\n if (targetNode === draggedNode) {\n return true\n }\n\n const { height: targetBlockElemHeight, top: targetBlockElemTop } =\n getBoundingClientRectWithoutTransform(targetBlockElem)\n\n const mouseY = pageY\n const isBelow = mouseY >= targetBlockElemTop + targetBlockElemHeight / 2 + window.scrollY\n\n if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n // below targetBlockElem\n targetNode.insertAfter(draggedNode)\n } else {\n // above targetBlockElem\n targetNode.insertBefore(draggedNode)\n }\n } else {\n //\n targetNode.insertBefore(draggedNode)\n targetNode.remove()\n }\n\n /*\n if (pageY >= targetBlockElemTop + targetBlockElemHeight / 2) {\n targetNode.insertAfter(draggedNode)\n } else {\n targetNode.insertBefore(draggedNode)\n }*/\n if (draggableBlockElem !== null) {\n setDraggableBlockElem(null)\n }\n\n // find all previous elements with lexical-block-highlighter class and remove them\n const allPrevHighlighters = document.querySelectorAll('.lexical-block-highlighter')\n allPrevHighlighters.forEach((highlighter) => {\n highlighter.remove()\n })\n\n const newInsertedElem = editor.getElementByKey(draggedNode.getKey())\n setTimeout(() => {\n // add new temp html element to newInsertedElem with the same height and width and the class block-selected\n // to highlight the new inserted element\n const newInsertedElemRect = newInsertedElem.getBoundingClientRect()\n\n const highlightElem = document.createElement('div')\n highlightElem.className = 'lexical-block-highlighter'\n\n // if html data-theme is dark, set the highlighter color to white\n if (document.documentElement.getAttribute('data-theme') === 'dark') {\n highlightElem.style.backgroundColor = 'white'\n } else {\n highlightElem.style.backgroundColor = 'black'\n }\n\n highlightElem.style.transition = 'opacity 0.1s ease-in-out'\n highlightElem.style.zIndex = '1'\n highlightElem.style.pointerEvents = 'none'\n highlightElem.style.boxSizing = 'border-box'\n highlightElem.style.borderRadius = '4px'\n highlightElem.style.position = 'absolute'\n document.body.appendChild(highlightElem)\n\n highlightElem.style.opacity = '0.1'\n\n highlightElem.style.height = `${newInsertedElemRect.height + 8}px`\n highlightElem.style.width = `${newInsertedElemRect.width + 8}px`\n highlightElem.style.top = `${newInsertedElemRect.top + window.scrollY - 4}px`\n highlightElem.style.left = `${newInsertedElemRect.left - 4}px`\n\n setTimeout(() => {\n highlightElem.style.opacity = '0'\n setTimeout(() => {\n highlightElem.remove()\n }, 1000)\n }, 3000)\n }, 120)\n })\n\n return true\n }\n\n // register onDragover event listeners:\n document.addEventListener('dragover', onDragover)\n // register onDrop event listeners:\n document.addEventListener('drop', onDrop)\n\n return () => {\n document.removeEventListener('dragover', onDragover)\n document.removeEventListener('drop', onDrop)\n }\n }, [\n scrollerElem,\n blockHandleHorizontalOffset,\n anchorElem,\n editor,\n lastTargetBlock,\n draggableBlockElem,\n editorConfig?.admin?.hideGutter,\n ])\n\n function onDragStart(event: ReactDragEvent<HTMLDivElement>): void {\n const dataTransfer = event.dataTransfer\n if (!dataTransfer || !draggableBlockElem) {\n return\n }\n setDragImage(dataTransfer, draggableBlockElem)\n let nodeKey = ''\n editor.update(() => {\n const node = $getNearestNodeFromDOMNode(draggableBlockElem)\n if (node) {\n nodeKey = node.getKey()\n }\n })\n isDraggingBlockRef.current = true\n dataTransfer.setData(DRAG_DATA_FORMAT, nodeKey)\n }\n\n function onDragEnd(): void {\n isDraggingBlockRef.current = false\n hideTargetLine(targetLineRef.current, lastTargetBlock?.elem)\n }\n\n return createPortal(\n <React.Fragment>\n <div\n className=\"icon draggable-block-menu\"\n draggable\n onDragEnd={onDragEnd}\n onDragStart={onDragStart}\n ref={menuRef}\n >\n <div className={isEditable ? 'icon' : ''} />\n </div>\n <div className=\"draggable-block-target-line\" ref={targetLineRef} />\n <div className=\"debug-highlight\" ref={debugHighlightRef} />\n </React.Fragment>,\n anchorElem,\n )\n}\n\nexport function DraggableBlockPlugin({\n anchorElem = document.body,\n}: {\n anchorElem?: HTMLElement\n}): React.ReactElement {\n const [editor] = useLexicalComposerContext()\n return useDraggableBlockMenu(editor, anchorElem, editor._editable)\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["useLexicalComposerContext","eventFiles","$getNearestNodeFromDOMNode","$getNodeByKey","React","useEffect","useRef","useState","createPortal","useEditorConfigContext","isHTMLElement","Point","calculateDistanceFromScrollerElem","getNodeCloseToPoint","getTopLevelNodeKeys","isOnHandleElement","setHandlePosition","getBoundingClientRectWithoutTransform","setTargetLine","DRAGGABLE_BLOCK_MENU_CLASSNAME","DRAG_DATA_FORMAT","prevIndex","Infinity","getCurrentIndex","keysLength","Math","floor","setDragImage","dataTransfer","draggableBlockElem","transform","style","setTimeout","hideTargetLine","targetLineElem","lastTargetBlockElem","opacity","marginBottom","marginTop","useDraggableBlockMenu","editor","anchorElem","isEditable","scrollerElem","parentElement","menuRef","targetLineRef","debugHighlightRef","isDraggingBlockRef","setDraggableBlockElem","lastTargetBlock","setLastTargetBlock","editorConfig","blockHandleHorizontalOffset","admin","hideGutter","onDocumentMouseMove","event","target","distanceFromScrollerElem","pageX","pageY","topLevelNodeKeys","blockElem","_draggableBlockElem","foundAtIndex","isFoundNodeEmptyParagraph","cache_threshold","horizontalOffset","point","x","y","startIndex","length","useEdgeAsDefault","verbose","document","addEventListener","removeEventListener","current","onDragover","isFileTransfer","targetBlockElem","fuzzy","isBelow","willStayInSamePosition","getBoundingClientRect","width","preventDefault","boundingBox","elem","onDrop","dragData","getData","update","draggedNode","targetNode","height","targetBlockElemHeight","top","targetBlockElemTop","mouseY","window","scrollY","insertAfter","insertBefore","remove","allPrevHighlighters","querySelectorAll","forEach","highlighter","newInsertedElem","getElementByKey","getKey","newInsertedElemRect","highlightElem","createElement","className","backgroundColor","transition","zIndex","pointerEvents","boxSizing","borderRadius","position","body","appendChild","left","onDragStart","nodeKey","node","setData","onDragEnd","_jsxs","Fragment","_jsx","draggable","ref","DraggableBlockPlugin","_editable"],"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\nimport type { DragEvent as ReactDragEvent } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { eventFiles } from '@lexical/rich-text'\nimport { $getNearestNodeFromDOMNode, $getNodeByKey } from 'lexical'\nimport * as React from 'react'\nimport { useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { useEditorConfigContext } from '../../../config/client/EditorConfigProvider.js'\nimport { isHTMLElement } from '../../../utils/guard.js'\nimport { Point } from '../../../utils/point.js'\nimport { calculateDistanceFromScrollerElem } from '../utils/calculateDistanceFromScrollerElem.js'\nimport { getNodeCloseToPoint } from '../utils/getNodeCloseToPoint.js'\nimport { getTopLevelNodeKeys } from '../utils/getTopLevelNodeKeys.js'\nimport { isOnHandleElement } from '../utils/isOnHandleElement.js'\nimport { setHandlePosition } from '../utils/setHandlePosition.js'\nimport { getBoundingClientRectWithoutTransform } from './getBoundingRectWithoutTransform.js'\nimport './index.scss'\nimport { setTargetLine } from './setTargetLine.js'\n\nconst DRAGGABLE_BLOCK_MENU_CLASSNAME = 'draggable-block-menu'\nconst DRAG_DATA_FORMAT = 'application/x-lexical-drag-block'\n\nlet prevIndex = Infinity\n\nfunction getCurrentIndex(keysLength: number): number {\n if (keysLength === 0) {\n return Infinity\n }\n if (prevIndex >= 0 && prevIndex < keysLength) {\n return prevIndex\n }\n\n return Math.floor(keysLength / 2)\n}\n\nfunction setDragImage(dataTransfer: DataTransfer, draggableBlockElem: HTMLElement) {\n const { transform } = draggableBlockElem.style\n\n // Remove dragImage borders\n dataTransfer.setDragImage(draggableBlockElem, 0, 0)\n\n setTimeout(() => {\n draggableBlockElem.style.transform = transform\n })\n}\n\nfunction hideTargetLine(\n targetLineElem: HTMLElement | null,\n lastTargetBlockElem: HTMLElement | null,\n) {\n if (targetLineElem) {\n targetLineElem.style.opacity = '0'\n }\n if (lastTargetBlockElem) {\n lastTargetBlockElem.style.opacity = ''\n // Delete marginBottom and marginTop values we set\n lastTargetBlockElem.style.marginBottom = ''\n lastTargetBlockElem.style.marginTop = ''\n //lastTargetBlock.style.border = 'none'\n }\n}\n\nfunction useDraggableBlockMenu(\n editor: LexicalEditor,\n anchorElem: HTMLElement,\n isEditable: boolean,\n): React.ReactElement {\n const scrollerElem = anchorElem.parentElement\n\n const menuRef = useRef<HTMLDivElement>(null)\n const targetLineRef = useRef<HTMLDivElement>(null)\n const debugHighlightRef = useRef<HTMLDivElement>(null)\n const isDraggingBlockRef = useRef<boolean>(false)\n const [draggableBlockElem, setDraggableBlockElem] = useState<HTMLElement | null>(null)\n const [lastTargetBlock, setLastTargetBlock] = useState<{\n boundingBox?: DOMRect\n elem: HTMLElement | null\n isBelow: boolean\n }>(null)\n\n const { editorConfig } = useEditorConfigContext()\n\n const blockHandleHorizontalOffset = editorConfig?.admin?.hideGutter ? -44 : -8\n\n useEffect(() => {\n /**\n * Handles positioning of the drag handle\n */\n function onDocumentMouseMove(event: MouseEvent) {\n const target = event.target\n if (!isHTMLElement(target)) {\n return\n }\n\n const distanceFromScrollerElem = calculateDistanceFromScrollerElem(\n scrollerElem,\n event.pageX,\n event.pageY,\n target,\n )\n if (distanceFromScrollerElem === -1) {\n setDraggableBlockElem(null)\n return\n }\n\n if (isOnHandleElement(target, DRAGGABLE_BLOCK_MENU_CLASSNAME)) {\n return\n }\n\n const topLevelNodeKeys = getTopLevelNodeKeys(editor)\n\n const {\n blockElem: _draggableBlockElem,\n foundAtIndex,\n isFoundNodeEmptyParagraph,\n } = getNodeCloseToPoint({\n anchorElem,\n cache_threshold: 0,\n editor,\n horizontalOffset: -distanceFromScrollerElem,\n point: new Point(event.x, event.y),\n startIndex: getCurrentIndex(topLevelNodeKeys.length),\n useEdgeAsDefault: false,\n verbose: false,\n })\n\n prevIndex = foundAtIndex\n\n //if (DEBUG && _draggableBlockElem) {\n //targetBlockElem.style.border = '3px solid red'\n // highlightElemOriginalPosition(debugHighlightRef, _draggableBlockElem, anchorElem)\n //}\n\n if (!_draggableBlockElem && !isFoundNodeEmptyParagraph) {\n return\n }\n\n if (draggableBlockElem !== _draggableBlockElem) {\n setDraggableBlockElem(_draggableBlockElem)\n }\n }\n\n // Since the draggableBlockElem is outside the actual editor, we need to listen to the document\n // to be able to detect when the mouse is outside the editor and respect a buffer around\n // the scrollerElem to avoid the draggableBlockElem disappearing too early.\n document?.addEventListener('mousemove', onDocumentMouseMove)\n\n return () => {\n document?.removeEventListener('mousemove', onDocumentMouseMove)\n }\n }, [scrollerElem, anchorElem, editor, draggableBlockElem])\n\n useEffect(() => {\n if (menuRef.current) {\n setHandlePosition(\n draggableBlockElem,\n menuRef.current,\n anchorElem,\n blockHandleHorizontalOffset,\n )\n }\n }, [anchorElem, draggableBlockElem, blockHandleHorizontalOffset])\n\n useEffect(() => {\n function onDragover(event: DragEvent): boolean {\n if (!isDraggingBlockRef.current) {\n return false\n }\n const [isFileTransfer] = eventFiles(event)\n if (isFileTransfer) {\n return false\n }\n\n const { pageY, target } = event\n if (!isHTMLElement(target)) {\n return false\n }\n\n const distanceFromScrollerElem = calculateDistanceFromScrollerElem(\n scrollerElem,\n event.pageX,\n event.pageY,\n target,\n 100,\n 50,\n )\n\n const topLevelNodeKeys = getTopLevelNodeKeys(editor)\n\n const {\n blockElem: targetBlockElem,\n foundAtIndex,\n isFoundNodeEmptyParagraph,\n } = getNodeCloseToPoint({\n anchorElem,\n editor,\n fuzzy: true,\n horizontalOffset: -distanceFromScrollerElem,\n point: new Point(event.x, event.y),\n startIndex: getCurrentIndex(topLevelNodeKeys.length),\n useEdgeAsDefault: true,\n verbose: true,\n })\n\n prevIndex = foundAtIndex\n\n const targetLineElem = targetLineRef.current\n // targetBlockElem === null shouldn't happen\n if (targetBlockElem === null || targetLineElem === null) {\n return false\n }\n\n if (draggableBlockElem !== targetBlockElem) {\n const { isBelow, willStayInSamePosition } = setTargetLine(\n editorConfig?.admin?.hideGutter ? '0px' : '3rem',\n blockHandleHorizontalOffset +\n (editorConfig?.admin?.hideGutter\n ? menuRef?.current?.getBoundingClientRect()?.width ?? 0\n : -(menuRef?.current?.getBoundingClientRect()?.width ?? 0)),\n targetLineElem,\n targetBlockElem,\n lastTargetBlock,\n pageY,\n anchorElem,\n event,\n debugHighlightRef,\n isFoundNodeEmptyParagraph,\n )\n\n // Prevent default event to be able to trigger onDrop events\n // Calling preventDefault() adds the green plus icon to the cursor,\n // indicating that the drop is allowed.\n event.preventDefault()\n\n if (!willStayInSamePosition) {\n setLastTargetBlock({\n boundingBox: targetBlockElem.getBoundingClientRect(),\n elem: targetBlockElem,\n isBelow,\n })\n }\n } else {\n hideTargetLine(targetLineElem, lastTargetBlock?.elem)\n setLastTargetBlock({\n boundingBox: targetBlockElem.getBoundingClientRect(),\n elem: targetBlockElem,\n isBelow: false,\n })\n }\n\n return true\n }\n\n function onDrop(event: DragEvent): boolean {\n if (!isDraggingBlockRef.current) {\n return false\n }\n const [isFileTransfer] = eventFiles(event)\n if (isFileTransfer) {\n return false\n }\n const { dataTransfer, pageY, target } = event\n const dragData = dataTransfer?.getData(DRAG_DATA_FORMAT) || ''\n\n editor.update(() => {\n const draggedNode = $getNodeByKey(dragData)\n if (!draggedNode) {\n return false\n }\n if (!isHTMLElement(target)) {\n return false\n }\n const distanceFromScrollerElem = calculateDistanceFromScrollerElem(\n scrollerElem,\n event.pageX,\n event.pageY,\n target,\n 100,\n 50,\n )\n\n const { blockElem: targetBlockElem, isFoundNodeEmptyParagraph } = getNodeCloseToPoint({\n anchorElem,\n editor,\n fuzzy: true,\n horizontalOffset: -distanceFromScrollerElem,\n point: new Point(event.x, event.y),\n useEdgeAsDefault: true,\n })\n\n if (!targetBlockElem) {\n return false\n }\n const targetNode = $getNearestNodeFromDOMNode(targetBlockElem)\n if (!targetNode) {\n return false\n }\n if (targetNode === draggedNode) {\n return true\n }\n\n const { height: targetBlockElemHeight, top: targetBlockElemTop } =\n getBoundingClientRectWithoutTransform(targetBlockElem)\n\n const mouseY = pageY\n const isBelow = mouseY >= targetBlockElemTop + targetBlockElemHeight / 2 + window.scrollY\n\n if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n // below targetBlockElem\n targetNode.insertAfter(draggedNode)\n } else {\n // above targetBlockElem\n targetNode.insertBefore(draggedNode)\n }\n } else {\n //\n targetNode.insertBefore(draggedNode)\n targetNode.remove()\n }\n\n /*\n if (pageY >= targetBlockElemTop + targetBlockElemHeight / 2) {\n targetNode.insertAfter(draggedNode)\n } else {\n targetNode.insertBefore(draggedNode)\n }*/\n if (draggableBlockElem !== null) {\n setDraggableBlockElem(null)\n }\n\n // find all previous elements with lexical-block-highlighter class and remove them\n const allPrevHighlighters = document.querySelectorAll('.lexical-block-highlighter')\n allPrevHighlighters.forEach((highlighter) => {\n highlighter.remove()\n })\n\n const newInsertedElem = editor.getElementByKey(draggedNode.getKey())\n setTimeout(() => {\n // add new temp html element to newInsertedElem with the same height and width and the class block-selected\n // to highlight the new inserted element\n const newInsertedElemRect = newInsertedElem.getBoundingClientRect()\n\n const highlightElem = document.createElement('div')\n highlightElem.className = 'lexical-block-highlighter'\n\n highlightElem.style.backgroundColor = 'var(--theme-elevation-1000'\n highlightElem.style.transition = 'opacity 0.5s ease-in-out'\n highlightElem.style.zIndex = '1'\n highlightElem.style.pointerEvents = 'none'\n highlightElem.style.boxSizing = 'border-box'\n highlightElem.style.borderRadius = '4px'\n highlightElem.style.position = 'absolute'\n document.body.appendChild(highlightElem)\n\n highlightElem.style.opacity = '0.1'\n\n highlightElem.style.height = `${newInsertedElemRect.height + 8}px`\n highlightElem.style.width = `${newInsertedElemRect.width + 8}px`\n highlightElem.style.top = `${newInsertedElemRect.top + window.scrollY - 4}px`\n highlightElem.style.left = `${newInsertedElemRect.left - 4}px`\n\n setTimeout(() => {\n highlightElem.style.opacity = '0'\n setTimeout(() => {\n highlightElem.remove()\n }, 500)\n }, 1000)\n }, 120)\n })\n\n return true\n }\n\n // register onDragover event listeners:\n document.addEventListener('dragover', onDragover)\n // register onDrop event listeners:\n document.addEventListener('drop', onDrop)\n\n return () => {\n document.removeEventListener('dragover', onDragover)\n document.removeEventListener('drop', onDrop)\n }\n }, [\n scrollerElem,\n blockHandleHorizontalOffset,\n anchorElem,\n editor,\n lastTargetBlock,\n draggableBlockElem,\n editorConfig?.admin?.hideGutter,\n ])\n\n function onDragStart(event: ReactDragEvent<HTMLDivElement>): void {\n const dataTransfer = event.dataTransfer\n if (!dataTransfer || !draggableBlockElem) {\n return\n }\n setDragImage(dataTransfer, draggableBlockElem)\n let nodeKey = ''\n editor.update(() => {\n const node = $getNearestNodeFromDOMNode(draggableBlockElem)\n if (node) {\n nodeKey = node.getKey()\n }\n })\n isDraggingBlockRef.current = true\n dataTransfer.setData(DRAG_DATA_FORMAT, nodeKey)\n }\n\n function onDragEnd(): void {\n isDraggingBlockRef.current = false\n hideTargetLine(targetLineRef.current, lastTargetBlock?.elem)\n }\n\n return createPortal(\n <React.Fragment>\n <div\n className=\"icon draggable-block-menu\"\n draggable\n onDragEnd={onDragEnd}\n onDragStart={onDragStart}\n ref={menuRef}\n >\n <div className={isEditable ? 'icon' : ''} />\n </div>\n <div className=\"draggable-block-target-line\" ref={targetLineRef} />\n <div className=\"debug-highlight\" ref={debugHighlightRef} />\n </React.Fragment>,\n anchorElem,\n )\n}\n\nexport function DraggableBlockPlugin({\n anchorElem = document.body,\n}: {\n anchorElem?: HTMLElement\n}): React.ReactElement {\n const [editor] = useLexicalComposerContext()\n return useDraggableBlockMenu(editor, anchorElem, editor._editable)\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"setTargetLine.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.ts"],"names":[],"mappings":"AASA,wBAAgB,aAAa,CAC3B,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,cAAc,EAAE,WAAW,EAC3B,eAAe,EAAE,WAAW,EAC5B,eAAe,EAAE;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,IAAI,EAAE,WAAW,GAAG,IAAI,CAAA;IACxB,OAAO,EAAE,OAAO,CAAA;CACjB,EACD,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,WAAW,EACvB,KAAK,EAAE,SAAS,EAChB,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EACzD,yBAAyB,GAAE,OAAe;;;EA4I3C"}
1
+ {"version":3,"file":"setTargetLine.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.ts"],"names":[],"mappings":"AASA,wBAAgB,aAAa,CAC3B,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,cAAc,EAAE,WAAW,EAC3B,eAAe,EAAE,WAAW,EAC5B,eAAe,EAAE;IACf,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,IAAI,EAAE,WAAW,GAAG,IAAI,CAAA;IACxB,OAAO,EAAE,OAAO,CAAA;CACjB,EACD,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,WAAW,EACvB,KAAK,EAAE,SAAS,EAChB,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EACzD,yBAAyB,GAAE,OAAe;;;EA2H3C"}
@@ -1,8 +1,7 @@
1
1
  'use client';
2
2
 
3
3
  import { getCollapsedMargins } from '../utils/getCollapsedMargins.js';
4
- import { highlightElemOriginalPosition } from './highlightElemOriginalPosition.js';
5
- const TARGET_LINE_HALF_HEIGHT = 25;
4
+ const TARGET_LINE_HALF_HEIGHT = 0;
6
5
  const TEXT_BOX_HORIZONTAL_PADDING = -24;
7
6
  const DEBUG = false;
8
7
  let animationTimer = 0;
@@ -83,29 +82,12 @@ export function setTargetLine(offsetWidth, offsetLeft, targetLineElem, targetBlo
83
82
  const top = lineTop - anchorTop + targetElemTranslate2;
84
83
  const left = TEXT_BOX_HORIZONTAL_PADDING - offsetLeft;
85
84
  targetLineElem.style.width = `calc(${anchorWidth}px - ${offsetWidth})`;
86
- targetLineElem.style.opacity = '.4';
87
- /**
88
- * Move around element below or above the line (= the target / targetBlockElem). Creates "space" for the targetLineElem
89
- *
90
- * Not needed for empty paragraphs, as an empty paragraph is enough space for the targetLineElem anyways.
91
- */ //targetBlockElem.style.opacity = '0.4'
92
- const buffer = 12 // creates more spacing/padding so target line is not directly next to the targetBlockElem
93
- ;
94
- if (!isFoundNodeEmptyParagraph) {
95
- if (isBelow) {
96
- targetBlockElem.style.marginBottom = TARGET_LINE_HALF_HEIGHT * 2 + buffer + 'px';
97
- targetLineElem.style.transform = `translate(${left}px, calc(${top}px - ${'0px'}))`;
98
- } else {
99
- targetBlockElem.style.marginTop = TARGET_LINE_HALF_HEIGHT * 2 + buffer + 'px';
100
- targetLineElem.style.transform = `translate(${left}px, calc(${top - TARGET_LINE_HALF_HEIGHT * 2}px - ${'0px'}))`;
101
- }
102
- } else {
103
- targetLineElem.style.transform = `translate(${left}px, ${top - TARGET_LINE_HALF_HEIGHT}px)`;
104
- }
105
- if (DEBUG) {
106
- //targetBlockElem.style.border = '3px solid red'
107
- highlightElemOriginalPosition(debugHighlightRef, targetBlockElem, anchorElem);
108
- }
85
+ targetLineElem.style.opacity = '.8';
86
+ // if (DEBUG) {
87
+ // //targetBlockElem.style.border = '3px solid red'
88
+ // highlightElemOriginalPosition(debugHighlightRef, targetBlockElem, anchorElem)
89
+ // }
90
+ targetLineElem.style.transform = `translate(${left}px, calc(${top}px - ${'2px'}))`;
109
91
  /**
110
92
  * Properly reset previous targetBlockElem styles
111
93
  */
@@ -1 +1 @@
1
- {"version":3,"file":"setTargetLine.js","names":["getCollapsedMargins","highlightElemOriginalPosition","TARGET_LINE_HALF_HEIGHT","TEXT_BOX_HORIZONTAL_PADDING","DEBUG","animationTimer","setTargetLine","offsetWidth","offsetLeft","targetLineElem","targetBlockElem","lastTargetBlock","mouseY","anchorElem","event","debugHighlightRef","isFoundNodeEmptyParagraph","height","targetBlockElemHeight","top","targetBlockElemTop","getBoundingClientRect","anchorTop","width","anchorWidth","marginBottom","marginTop","lineTop","isBelow","window","scrollY","willStayInSamePosition","elem","nextElementSibling","previousElementSibling","lastBoundingBoxPosition","boundingBox","y","currentBoundingBoxPosition","targetElemTranslate2","left","style","opacity","buffer","transform"],"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.ts"],"sourcesContent":["'use client'\nimport { getCollapsedMargins } from '../utils/getCollapsedMargins.js'\nimport { highlightElemOriginalPosition } from './highlightElemOriginalPosition.js'\nconst TARGET_LINE_HALF_HEIGHT = 25\nconst TEXT_BOX_HORIZONTAL_PADDING = -24\nconst DEBUG = false\n\nlet animationTimer = 0\n\nexport function setTargetLine(\n offsetWidth: string,\n offsetLeft: number,\n targetLineElem: HTMLElement,\n targetBlockElem: HTMLElement,\n lastTargetBlock: {\n boundingBox?: DOMRect\n elem: HTMLElement | null\n isBelow: boolean\n },\n mouseY: number,\n anchorElem: HTMLElement,\n event: DragEvent,\n debugHighlightRef: React.RefObject<HTMLDivElement | null>,\n isFoundNodeEmptyParagraph: boolean = false,\n) {\n const { height: targetBlockElemHeight, top: targetBlockElemTop } =\n targetBlockElem.getBoundingClientRect() // used to be getBoundingClientRectWithoutTransform. Not sure what's better, but the normal getBoundingClientRect seems to work fine\n const { top: anchorTop, width: anchorWidth } = anchorElem.getBoundingClientRect()\n\n const { marginBottom, marginTop } = getCollapsedMargins(targetBlockElem)\n let lineTop = targetBlockElemTop\n\n const isBelow = mouseY >= targetBlockElemTop + targetBlockElemHeight / 2 + window.scrollY\n\n let willStayInSamePosition = false\n\n /**\n * Do not run any transform or changes if the actual new line position would be the same (even if it's now inserted BEFORE rather than AFTER - position would still be the same)\n * This prevents unnecessary flickering.\n *\n * We still need to let it run even if the position (IGNORING the transform) would not change, as the transform animation is not finished yet. This is what animationTimer does. Otherwise, the positioning will be inaccurate\n */\n if (lastTargetBlock?.elem) {\n if (targetBlockElem !== lastTargetBlock?.elem) {\n if (\n isBelow &&\n lastTargetBlock?.elem &&\n lastTargetBlock?.elem === targetBlockElem.nextElementSibling\n ) {\n animationTimer++\n\n if (animationTimer < 200) {\n willStayInSamePosition = true\n }\n } else if (\n !isBelow &&\n lastTargetBlock?.elem &&\n lastTargetBlock?.elem === targetBlockElem.previousElementSibling\n ) {\n animationTimer++\n if (animationTimer < 200) {\n willStayInSamePosition = true\n }\n }\n } else {\n animationTimer++\n\n const lastBoundingBoxPosition = lastTargetBlock?.boundingBox?.y\n const currentBoundingBoxPosition = targetBlockElem.getBoundingClientRect().y\n\n if (\n (isBelow === lastTargetBlock?.isBelow &&\n lastBoundingBoxPosition === currentBoundingBoxPosition) ||\n animationTimer < 200\n ) {\n willStayInSamePosition = false\n }\n }\n }\n if (willStayInSamePosition) {\n return {\n isBelow,\n willStayInSamePosition,\n }\n }\n\n /**\n * Paragraphs need no isBelow/above handling,\n */\n if (!isFoundNodeEmptyParagraph) {\n //if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n // below targetBlockElem\n lineTop += targetBlockElemHeight + marginBottom / 2\n } else {\n // above targetBlockElem\n lineTop -= marginTop / 2\n }\n } else {\n lineTop += targetBlockElemHeight / 2\n }\n\n let targetElemTranslate2 = 0\n\n if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n targetElemTranslate2 = -TARGET_LINE_HALF_HEIGHT\n } else {\n targetElemTranslate2 = TARGET_LINE_HALF_HEIGHT\n }\n }\n\n const top = lineTop - anchorTop + targetElemTranslate2\n\n const left = TEXT_BOX_HORIZONTAL_PADDING - offsetLeft\n\n targetLineElem.style.width = `calc(${anchorWidth}px - ${offsetWidth})`\n targetLineElem.style.opacity = '.4'\n\n /**\n * Move around element below or above the line (= the target / targetBlockElem). Creates \"space\" for the targetLineElem\n *\n * Not needed for empty paragraphs, as an empty paragraph is enough space for the targetLineElem anyways.\n */\n //targetBlockElem.style.opacity = '0.4'\n const buffer = 12 // creates more spacing/padding so target line is not directly next to the targetBlockElem\n if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n targetBlockElem.style.marginBottom = TARGET_LINE_HALF_HEIGHT * 2 + buffer + 'px'\n targetLineElem.style.transform = `translate(${left}px, calc(${top}px - ${'0px'}))`\n } else {\n targetBlockElem.style.marginTop = TARGET_LINE_HALF_HEIGHT * 2 + buffer + 'px'\n targetLineElem.style.transform = `translate(${left}px, calc(${top - TARGET_LINE_HALF_HEIGHT * 2}px - ${'0px'}))`\n }\n } else {\n targetLineElem.style.transform = `translate(${left}px, ${top - TARGET_LINE_HALF_HEIGHT}px)`\n }\n\n if (DEBUG) {\n //targetBlockElem.style.border = '3px solid red'\n highlightElemOriginalPosition(debugHighlightRef, targetBlockElem, anchorElem)\n }\n\n /**\n * Properly reset previous targetBlockElem styles\n */\n lastTargetBlock.elem.style.opacity = ''\n\n if (lastTargetBlock?.elem === targetBlockElem) {\n if (isBelow) {\n lastTargetBlock.elem.style.marginTop = ''\n } else {\n lastTargetBlock.elem.style.marginBottom = ''\n }\n } else {\n lastTargetBlock.elem.style.marginBottom = ''\n lastTargetBlock.elem.style.marginTop = ''\n }\n animationTimer = 0\n return {\n isBelow,\n willStayInSamePosition,\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"setTargetLine.js","names":["getCollapsedMargins","TARGET_LINE_HALF_HEIGHT","TEXT_BOX_HORIZONTAL_PADDING","DEBUG","animationTimer","setTargetLine","offsetWidth","offsetLeft","targetLineElem","targetBlockElem","lastTargetBlock","mouseY","anchorElem","event","debugHighlightRef","isFoundNodeEmptyParagraph","height","targetBlockElemHeight","top","targetBlockElemTop","getBoundingClientRect","anchorTop","width","anchorWidth","marginBottom","marginTop","lineTop","isBelow","window","scrollY","willStayInSamePosition","elem","nextElementSibling","previousElementSibling","lastBoundingBoxPosition","boundingBox","y","currentBoundingBoxPosition","targetElemTranslate2","left","style","opacity","transform"],"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.ts"],"sourcesContent":["'use client'\nimport { getCollapsedMargins } from '../utils/getCollapsedMargins.js'\nimport { highlightElemOriginalPosition } from './highlightElemOriginalPosition.js'\nconst TARGET_LINE_HALF_HEIGHT = 0\nconst TEXT_BOX_HORIZONTAL_PADDING = -24\nconst DEBUG = false\n\nlet animationTimer = 0\n\nexport function setTargetLine(\n offsetWidth: string,\n offsetLeft: number,\n targetLineElem: HTMLElement,\n targetBlockElem: HTMLElement,\n lastTargetBlock: {\n boundingBox?: DOMRect\n elem: HTMLElement | null\n isBelow: boolean\n },\n mouseY: number,\n anchorElem: HTMLElement,\n event: DragEvent,\n debugHighlightRef: React.RefObject<HTMLDivElement | null>,\n isFoundNodeEmptyParagraph: boolean = false,\n) {\n const { height: targetBlockElemHeight, top: targetBlockElemTop } =\n targetBlockElem.getBoundingClientRect() // used to be getBoundingClientRectWithoutTransform. Not sure what's better, but the normal getBoundingClientRect seems to work fine\n const { top: anchorTop, width: anchorWidth } = anchorElem.getBoundingClientRect()\n\n const { marginBottom, marginTop } = getCollapsedMargins(targetBlockElem)\n let lineTop = targetBlockElemTop\n\n const isBelow = mouseY >= targetBlockElemTop + targetBlockElemHeight / 2 + window.scrollY\n\n let willStayInSamePosition = false\n\n /**\n * Do not run any transform or changes if the actual new line position would be the same (even if it's now inserted BEFORE rather than AFTER - position would still be the same)\n * This prevents unnecessary flickering.\n *\n * We still need to let it run even if the position (IGNORING the transform) would not change, as the transform animation is not finished yet. This is what animationTimer does. Otherwise, the positioning will be inaccurate\n */\n if (lastTargetBlock?.elem) {\n if (targetBlockElem !== lastTargetBlock?.elem) {\n if (\n isBelow &&\n lastTargetBlock?.elem &&\n lastTargetBlock?.elem === targetBlockElem.nextElementSibling\n ) {\n animationTimer++\n\n if (animationTimer < 200) {\n willStayInSamePosition = true\n }\n } else if (\n !isBelow &&\n lastTargetBlock?.elem &&\n lastTargetBlock?.elem === targetBlockElem.previousElementSibling\n ) {\n animationTimer++\n if (animationTimer < 200) {\n willStayInSamePosition = true\n }\n }\n } else {\n animationTimer++\n\n const lastBoundingBoxPosition = lastTargetBlock?.boundingBox?.y\n const currentBoundingBoxPosition = targetBlockElem.getBoundingClientRect().y\n\n if (\n (isBelow === lastTargetBlock?.isBelow &&\n lastBoundingBoxPosition === currentBoundingBoxPosition) ||\n animationTimer < 200\n ) {\n willStayInSamePosition = false\n }\n }\n }\n if (willStayInSamePosition) {\n return {\n isBelow,\n willStayInSamePosition,\n }\n }\n\n /**\n * Paragraphs need no isBelow/above handling,\n */\n if (!isFoundNodeEmptyParagraph) {\n //if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n // below targetBlockElem\n lineTop += targetBlockElemHeight + marginBottom / 2\n } else {\n // above targetBlockElem\n lineTop -= marginTop / 2\n }\n } else {\n lineTop += targetBlockElemHeight / 2\n }\n\n let targetElemTranslate2 = 0\n\n if (!isFoundNodeEmptyParagraph) {\n if (isBelow) {\n targetElemTranslate2 = -TARGET_LINE_HALF_HEIGHT\n } else {\n targetElemTranslate2 = TARGET_LINE_HALF_HEIGHT\n }\n }\n\n const top = lineTop - anchorTop + targetElemTranslate2\n\n const left = TEXT_BOX_HORIZONTAL_PADDING - offsetLeft\n\n targetLineElem.style.width = `calc(${anchorWidth}px - ${offsetWidth})`\n targetLineElem.style.opacity = '.8'\n\n // if (DEBUG) {\n // //targetBlockElem.style.border = '3px solid red'\n // highlightElemOriginalPosition(debugHighlightRef, targetBlockElem, anchorElem)\n // }\n\n targetLineElem.style.transform = `translate(${left}px, calc(${top}px - ${'2px'}))`\n\n /**\n * Properly reset previous targetBlockElem styles\n */\n lastTargetBlock.elem.style.opacity = ''\n\n if (lastTargetBlock?.elem === targetBlockElem) {\n if (isBelow) {\n lastTargetBlock.elem.style.marginTop = ''\n } else {\n lastTargetBlock.elem.style.marginBottom = ''\n }\n } else {\n lastTargetBlock.elem.style.marginBottom = ''\n lastTargetBlock.elem.style.marginTop = ''\n }\n animationTimer = 0\n return {\n isBelow,\n willStayInSamePosition,\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"setHandlePosition.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/utils/setHandlePosition.ts"],"names":[],"mappings":"AAGA,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,WAAW,GAAG,IAAI,EAC9B,UAAU,EAAE,WAAW,EACvB,UAAU,EAAE,WAAW,EACvB,UAAU,GAAE,MAAU,QAuCvB"}
1
+ {"version":3,"file":"setHandlePosition.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/utils/setHandlePosition.ts"],"names":[],"mappings":"AAGA,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,WAAW,GAAG,IAAI,EAC9B,UAAU,EAAE,WAAW,EACvB,UAAU,EAAE,WAAW,EACvB,UAAU,GAAE,MAAU,QAmCvB"}
@@ -12,16 +12,14 @@ export function setHandlePosition(targetElem, handleElem, anchorElem, leftOffset
12
12
  const floatingElemRect = handleElem.getBoundingClientRect();
13
13
  const anchorElementRect = anchorElem.getBoundingClientRect();
14
14
  let top;
15
- const shouldDisplayHandleInCenter = targetRect.height < 60;
16
- if (!shouldDisplayHandleInCenter) {
15
+ const isBlockStyle = ['lexical-block', 'lexical-upload', 'lexical-relationship'].some(classes => targetElem.firstElementChild?.classList.contains(classes));
16
+ if (!isBlockStyle) {
17
17
  // No need to let line height affect the re-positioning of the floating element if line height has no
18
18
  // visual effect on the element. Otherwise, the floating element will be positioned incorrectly.
19
19
  const actualLineHeight = doesLineHeightAffectElement(targetElem) ? parseInt(targetStyle.lineHeight, 10) : 0;
20
- top = targetRect.top + (actualLineHeight - floatingElemRect.height) / 2 - anchorElementRect.top - 1 // 1px inaccuracy
21
- ;
20
+ top = targetRect.top + (actualLineHeight - floatingElemRect.height) / 2 - anchorElementRect.top;
22
21
  } else {
23
- top = targetRect.top - floatingElemRect.height / 2 - anchorElementRect.top + targetRect.height / 2 - 1 // 1px inaccuracy
24
- ;
22
+ top = targetRect.top + 8 - anchorElementRect.top;
25
23
  }
26
24
  const left = leftOffset;
27
25
  handleElem.style.opacity = '1';