@payloadcms/richtext-lexical 3.0.0-beta.7 → 3.0.0-beta.70

package/dist/lexical/plugins/handles/AddBlockHandlePlugin/index.js

@@ -0,0 +1,157 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
+import { $createParagraphNode } from 'lexical';
+import * as React from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { useEditorConfigContext } from '../../../config/client/EditorConfigProvider.js';
+import { isHTMLElement } from '../../../utils/guard.js';
+import { Point } from '../../../utils/point.js';
+import { ENABLE_SLASH_MENU_COMMAND } from '../../SlashMenu/LexicalTypeaheadMenuPlugin/index.js';
+import { calculateDistanceFromScrollerElem } from '../utils/calculateDistanceFromScrollerElem.js';
+import { getNodeCloseToPoint } from '../utils/getNodeCloseToPoint.js';
+import { getTopLevelNodeKeys } from '../utils/getTopLevelNodeKeys.js';
+import { isOnHandleElement } from '../utils/isOnHandleElement.js';
+import { setHandlePosition } from '../utils/setHandlePosition.js';
+const ADD_BLOCK_MENU_CLASSNAME = 'add-block-menu';
+let prevIndex = Infinity;
+function getCurrentIndex(keysLength) {
+    if (keysLength === 0) {
+        return Infinity;
+    }
+    if (prevIndex >= 0 && prevIndex < keysLength) {
+        return prevIndex;
+    }
+    return Math.floor(keysLength / 2);
+}
+function useAddBlockHandle(editor, anchorElem, isEditable) {
+    const scrollerElem = anchorElem.parentElement;
+    const { editorConfig } = useEditorConfigContext();
+    const blockHandleHorizontalOffset = editorConfig?.admin?.hideGutter ? -24 : 12;
+    const menuRef = useRef(null);
+    const [hoveredElement, setHoveredElement] = useState(null);
+    useEffect(()=>{
+        function onDocumentMouseMove(event) {
+            const target = event.target;
+            if (!isHTMLElement(target)) {
+                return;
+            }
+            const distanceFromScrollerElem = calculateDistanceFromScrollerElem(scrollerElem, event.pageX, event.pageY, target);
+            if (distanceFromScrollerElem === -1) {
+                setHoveredElement(null);
+                return;
+            }
+            if (isOnHandleElement(target, ADD_BLOCK_MENU_CLASSNAME)) {
+                return;
+            }
+            const topLevelNodeKeys = getTopLevelNodeKeys(editor);
+            const { blockElem: _emptyBlockElem, blockNode, foundAtIndex } = getNodeCloseToPoint({
+                anchorElem,
+                cache_threshold: 0,
+                editor,
+                horizontalOffset: -distanceFromScrollerElem,
+                point: new Point(event.x, event.y),
+                returnEmptyParagraphs: true,
+                startIndex: getCurrentIndex(topLevelNodeKeys.length),
+                useEdgeAsDefault: false
+            });
+            prevIndex = foundAtIndex;
+            if (!_emptyBlockElem) {
+                return;
+            }
+            if (hoveredElement?.node !== blockNode || hoveredElement?.elem !== _emptyBlockElem) {
+                setHoveredElement({
+                    elem: _emptyBlockElem,
+                    node: blockNode
+                });
+            }
+        }
+        // Since the draggableBlockElem is outside the actual editor, we need to listen to the document
+        // to be able to detect when the mouse is outside the editor and respect a buffer around
+        // the scrollerElem to avoid the draggableBlockElem disappearing too early.
+        document?.addEventListener('mousemove', onDocumentMouseMove);
+        return ()=>{
+            document?.removeEventListener('mousemove', onDocumentMouseMove);
+        };
+    }, [
+        scrollerElem,
+        anchorElem,
+        editor,
+        hoveredElement
+    ]);
+    useEffect(()=>{
+        if (menuRef.current && hoveredElement?.node) {
+            setHandlePosition(hoveredElement?.elem, menuRef.current, anchorElem, blockHandleHorizontalOffset);
+        }
+    }, [
+        anchorElem,
+        hoveredElement,
+        blockHandleHorizontalOffset
+    ]);
+    const handleAddClick = useCallback((event)=>{
+        let hoveredElementToUse = hoveredElement;
+        if (!hoveredElementToUse?.node) {
+            return;
+        }
+        // 1. Update hoveredElement.node to a new paragraph node if the hoveredElement.node is not a paragraph node
+        editor.update(()=>{
+            // Check if blockNode is an empty text node
+            let isEmptyParagraph = true;
+            if (hoveredElementToUse.node.getType() !== 'paragraph' || hoveredElementToUse.node.getTextContent() !== '') {
+                isEmptyParagraph = false;
+            }
+            if (!isEmptyParagraph) {
+                const newParagraph = $createParagraphNode();
+                hoveredElementToUse.node.insertAfter(newParagraph);
+                setTimeout(()=>{
+                    hoveredElementToUse = {
+                        elem: editor.getElementByKey(newParagraph.getKey()),
+                        node: newParagraph
+                    };
+                    setHoveredElement(hoveredElementToUse);
+                }, 0);
+            }
+        });
+        // 2. Focus on the new paragraph node
+        setTimeout(()=>{
+            editor.update(()=>{
+                editor.focus();
+                if (hoveredElementToUse.node && 'select' in hoveredElementToUse.node && typeof hoveredElementToUse.node.select === 'function') {
+                    hoveredElementToUse.node.select();
+                }
+            });
+        }, 1);
+        // Make sure this is called AFTER the focusing has been processed by the browser
+        // Otherwise, this won't work
+        setTimeout(()=>{
+            editor.dispatchCommand(ENABLE_SLASH_MENU_COMMAND, {
+                node: hoveredElementToUse.node
+            });
+        }, 2);
+        event.stopPropagation();
+        event.preventDefault();
+    }, [
+        editor,
+        hoveredElement
+    ]);
+    return /*#__PURE__*/ createPortal(/*#__PURE__*/ _jsx(React.Fragment, {
+        children: /*#__PURE__*/ _jsx("button", {
+            className: "icon add-block-menu",
+            onClick: (event)=>{
+                handleAddClick(event);
+            },
+            ref: menuRef,
+            type: "button",
+            children: /*#__PURE__*/ _jsx("div", {
+                className: isEditable ? 'icon' : ''
+            })
+        })
+    }), anchorElem);
+}
+export function AddBlockHandlePlugin({ anchorElem = document.body }) {
+    const [editor] = useLexicalComposerContext();
+    return useAddBlockHandle(editor, anchorElem, editor._editable);
+}
+
+//# sourceMappingURL=index.js.map

package/dist/lexical/plugins/handles/AddBlockHandlePlugin/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/lexical/plugins/handles/AddBlockHandlePlugin/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor, LexicalNode, ParagraphNode } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $createParagraphNode } from 'lexical'\nimport * as React from 'react'\nimport { type JSX, useCallback, 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 { ENABLE_SLASH_MENU_COMMAND } from '../../SlashMenu/LexicalTypeaheadMenuPlugin/index.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 './index.scss'\n\nconst ADD_BLOCK_MENU_CLASSNAME = 'add-block-menu'\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 useAddBlockHandle(\n  editor: LexicalEditor,\n  anchorElem: HTMLElement,\n  isEditable: boolean,\n): React.ReactElement {\n  const scrollerElem = anchorElem.parentElement\n\n  const { editorConfig } = useEditorConfigContext()\n  const blockHandleHorizontalOffset = editorConfig?.admin?.hideGutter ? -24 : 12\n\n  const menuRef = useRef<HTMLButtonElement>(null)\n  const [hoveredElement, setHoveredElement] = useState<{\n    elem: HTMLElement\n    node: LexicalNode\n  } | null>(null)\n\n  useEffect(() => {\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\n      if (distanceFromScrollerElem === -1) {\n        setHoveredElement(null)\n        return\n      }\n\n      if (isOnHandleElement(target, ADD_BLOCK_MENU_CLASSNAME)) {\n        return\n      }\n      const topLevelNodeKeys = getTopLevelNodeKeys(editor)\n\n      const {\n        blockElem: _emptyBlockElem,\n        blockNode,\n        foundAtIndex,\n      } = getNodeCloseToPoint({\n        anchorElem,\n        cache_threshold: 0,\n        editor,\n        horizontalOffset: -distanceFromScrollerElem,\n        point: new Point(event.x, event.y),\n        returnEmptyParagraphs: true,\n        startIndex: getCurrentIndex(topLevelNodeKeys.length),\n        useEdgeAsDefault: false,\n      })\n\n      prevIndex = foundAtIndex\n\n      if (!_emptyBlockElem) {\n        return\n      }\n      if (hoveredElement?.node !== blockNode || hoveredElement?.elem !== _emptyBlockElem) {\n        setHoveredElement({\n          elem: _emptyBlockElem,\n          node: blockNode,\n        })\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, hoveredElement])\n\n  useEffect(() => {\n    if (menuRef.current && hoveredElement?.node) {\n      setHandlePosition(\n        hoveredElement?.elem,\n        menuRef.current,\n        anchorElem,\n        blockHandleHorizontalOffset,\n      )\n    }\n  }, [anchorElem, hoveredElement, blockHandleHorizontalOffset])\n\n  const handleAddClick = useCallback(\n    (event) => {\n      let hoveredElementToUse = hoveredElement\n      if (!hoveredElementToUse?.node) {\n        return\n      }\n\n      // 1. Update hoveredElement.node to a new paragraph node if the hoveredElement.node is not a paragraph node\n      editor.update(() => {\n        // Check if blockNode is an empty text node\n        let isEmptyParagraph = true\n        if (\n          hoveredElementToUse.node.getType() !== 'paragraph' ||\n          hoveredElementToUse.node.getTextContent() !== ''\n        ) {\n          isEmptyParagraph = false\n        }\n\n        if (!isEmptyParagraph) {\n          const newParagraph = $createParagraphNode()\n          hoveredElementToUse.node.insertAfter(newParagraph)\n\n          setTimeout(() => {\n            hoveredElementToUse = {\n              elem: editor.getElementByKey(newParagraph.getKey()),\n              node: newParagraph,\n            }\n            setHoveredElement(hoveredElementToUse)\n          }, 0)\n        }\n      })\n\n      // 2. Focus on the new paragraph node\n      setTimeout(() => {\n        editor.update(() => {\n          editor.focus()\n\n          if (\n            hoveredElementToUse.node &&\n            'select' in hoveredElementToUse.node &&\n            typeof hoveredElementToUse.node.select === 'function'\n          ) {\n            hoveredElementToUse.node.select()\n          }\n        })\n      }, 1)\n\n      // Make sure this is called AFTER the focusing has been processed by the browser\n      // Otherwise, this won't work\n      setTimeout(() => {\n        editor.dispatchCommand(ENABLE_SLASH_MENU_COMMAND, {\n          node: hoveredElementToUse.node as ParagraphNode,\n        })\n      }, 2)\n\n      event.stopPropagation()\n      event.preventDefault()\n    },\n    [editor, hoveredElement],\n  )\n\n  return createPortal(\n    <React.Fragment>\n      <button\n        className=\"icon add-block-menu\"\n        onClick={(event) => {\n          handleAddClick(event)\n        }}\n        ref={menuRef}\n        type=\"button\"\n      >\n        <div className={isEditable ? 'icon' : ''} />\n      </button>\n    </React.Fragment>,\n    anchorElem,\n  )\n}\n\nexport function AddBlockHandlePlugin({\n  anchorElem = document.body,\n}: {\n  anchorElem?: HTMLElement\n}): React.ReactElement {\n  const [editor] = useLexicalComposerContext()\n  return useAddBlockHandle(editor, anchorElem, editor._editable)\n}\n"],"names":["useLexicalComposerContext","$createParagraphNode","React","useCallback","useEffect","useRef","useState","createPortal","useEditorConfigContext","isHTMLElement","Point","ENABLE_SLASH_MENU_COMMAND","calculateDistanceFromScrollerElem","getNodeCloseToPoint","getTopLevelNodeKeys","isOnHandleElement","setHandlePosition","ADD_BLOCK_MENU_CLASSNAME","prevIndex","Infinity","getCurrentIndex","keysLength","Math","floor","useAddBlockHandle","editor","anchorElem","isEditable","scrollerElem","parentElement","editorConfig","blockHandleHorizontalOffset","admin","hideGutter","menuRef","hoveredElement","setHoveredElement","onDocumentMouseMove","event","target","distanceFromScrollerElem","pageX","pageY","topLevelNodeKeys","blockElem","_emptyBlockElem","blockNode","foundAtIndex","cache_threshold","horizontalOffset","point","x","y","returnEmptyParagraphs","startIndex","length","useEdgeAsDefault","node","elem","document","addEventListener","removeEventListener","current","handleAddClick","hoveredElementToUse","update","isEmptyParagraph","getType","getTextContent","newParagraph","insertAfter","setTimeout","getElementByKey","getKey","focus","select","dispatchCommand","stopPropagation","preventDefault","Fragment","button","className","onClick","ref","type","div","AddBlockHandlePlugin","body","_editable"],"mappings":"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"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/debounce.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"debounce.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/debounce.ts"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,aAEzB,GAAG,EAAE,UAUhC"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/debounce.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/debounce.ts"],"sourcesContent":["export function debounce(func: Function, wait: number) {\n  let timeout: null | number = null\n  return function (...args: any[]) {\n    const later = () => {\n      clearTimeout(timeout)\n      timeout = null\n      func(...args)\n    }\n\n    clearTimeout(timeout)\n    timeout = window.setTimeout(later, wait)\n  }\n}\n"],"names":["debounce","func","wait","timeout","args","later","clearTimeout","window","setTimeout"],"mappings":"AAAA,OAAO,SAASA,SAASC,IAAc,EAAEC,IAAY;IACnD,IAAIC,UAAyB;IAC7B,OAAO,SAAU,GAAGC,IAAW;QAC7B,MAAMC,QAAQ;YACZC,aAAaH;YACbA,UAAU;YACVF,QAAQG;QACV;QAEAE,aAAaH;QACbA,UAAUI,OAAOC,UAAU,CAACH,OAAOH;IACrC;AACF"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/getBoundingRectWithoutTransform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getBoundingRectWithoutTransform.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/getBoundingRectWithoutTransform.ts"],"names":[],"mappings":"AAAA,wBAAgB,qCAAqC,CAAC,IAAI,EAAE,WAAW,GAAG,OAAO,CAchF"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/getBoundingRectWithoutTransform.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/getBoundingRectWithoutTransform.ts"],"sourcesContent":["export function getBoundingClientRectWithoutTransform(elem: HTMLElement): DOMRect {\n  const rect = elem.getBoundingClientRect()\n\n  // Extract the translation value from the transform style\n  const transformValue = getComputedStyle(elem).getPropertyValue('transform')\n  if (!transformValue || transformValue === 'none') {\n    return rect\n  }\n\n  const lastNumberOfTransformValue = transformValue.split(',').pop()\n  rect.y = rect.y - Number(lastNumberOfTransformValue.replace(')', ''))\n\n  // Return the original bounding rect if no translation is applied\n  return rect\n}\n"],"names":["getBoundingClientRectWithoutTransform","elem","rect","getBoundingClientRect","transformValue","getComputedStyle","getPropertyValue","lastNumberOfTransformValue","split","pop","y","Number","replace"],"mappings":"AAAA,OAAO,SAASA,sCAAsCC,IAAiB;IACrE,MAAMC,OAAOD,KAAKE,qBAAqB;IAEvC,yDAAyD;IACzD,MAAMC,iBAAiBC,iBAAiBJ,MAAMK,gBAAgB,CAAC;IAC/D,IAAI,CAACF,kBAAkBA,mBAAmB,QAAQ;QAChD,OAAOF;IACT;IAEA,MAAMK,6BAA6BH,eAAeI,KAAK,CAAC,KAAKC,GAAG;IAChEP,KAAKQ,CAAC,GAAGR,KAAKQ,CAAC,GAAGC,OAAOJ,2BAA2BK,OAAO,CAAC,KAAK;IAEjE,iEAAiE;IACjE,OAAOV;AACT"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/highlightElemOriginalPosition.d.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+export declare function highlightElemOriginalPosition(debugHighlightRef: React.RefObject<HTMLDivElement | null>, htmlElem: HTMLElement, anchorElem: HTMLElement): void;
+//# sourceMappingURL=highlightElemOriginalPosition.d.ts.map

package/dist/lexical/plugins/handles/DraggableBlockPlugin/highlightElemOriginalPosition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlightElemOriginalPosition.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/highlightElemOriginalPosition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,wBAAgB,6BAA6B,CAC3C,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EACzD,QAAQ,EAAE,WAAW,EACrB,UAAU,EAAE,WAAW,QA4BxB"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/highlightElemOriginalPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/highlightElemOriginalPosition.ts"],"sourcesContent":["import type React from 'react'\n\nimport { getBoundingClientRectWithoutTransform } from './getBoundingRectWithoutTransform.js'\n\nexport function highlightElemOriginalPosition(\n  debugHighlightRef: React.RefObject<HTMLDivElement | null>,\n  htmlElem: HTMLElement,\n  anchorElem: HTMLElement,\n) {\n  if (!debugHighlightRef.current) {\n    // If the ref doesn't point to an existing element, we can't set styles\n    return\n  }\n\n  const { left: anchorLeft, top: anchorTop } = anchorElem.getBoundingClientRect()\n\n  // Get computed styles of the given element\n  const boundingRect = getBoundingClientRectWithoutTransform(htmlElem)\n\n  // Extract necessary styles (ignoring transform)\n  const width = boundingRect.width\n  const height = boundingRect.height\n  const top = boundingRect.top - anchorTop\n  const left = boundingRect.left - anchorLeft\n\n  debugHighlightRef.current.style.border = '2px solid green'\n  debugHighlightRef.current.style.boxSizing = 'border-box'\n  debugHighlightRef.current.style.height = height + 'px'\n  debugHighlightRef.current.style.pointerEvents = 'none'\n  debugHighlightRef.current.style.position = 'absolute'\n  debugHighlightRef.current.style.top = top + 'px'\n  debugHighlightRef.current.style.left = left + 'px'\n  debugHighlightRef.current.style.width = width + 'px'\n  debugHighlightRef.current.style.zIndex = '1000'\n  debugHighlightRef.current.style.opacity = '0.5'\n}\n"],"names":["getBoundingClientRectWithoutTransform","highlightElemOriginalPosition","debugHighlightRef","htmlElem","anchorElem","current","left","anchorLeft","top","anchorTop","getBoundingClientRect","boundingRect","width","height","style","border","boxSizing","pointerEvents","position","zIndex","opacity"],"mappings":"AAEA,SAASA,qCAAqC,QAAQ,uCAAsC;AAE5F,OAAO,SAASC,8BACdC,iBAAyD,EACzDC,QAAqB,EACrBC,UAAuB;IAEvB,IAAI,CAACF,kBAAkBG,OAAO,EAAE;QAC9B,uEAAuE;QACvE;IACF;IAEA,MAAM,EAAEC,MAAMC,UAAU,EAAEC,KAAKC,SAAS,EAAE,GAAGL,WAAWM,qBAAqB;IAE7E,2CAA2C;IAC3C,MAAMC,eAAeX,sCAAsCG;IAE3D,gDAAgD;IAChD,MAAMS,QAAQD,aAAaC,KAAK;IAChC,MAAMC,SAASF,aAAaE,MAAM;IAClC,MAAML,MAAMG,aAAaH,GAAG,GAAGC;IAC/B,MAAMH,OAAOK,aAAaL,IAAI,GAAGC;IAEjCL,kBAAkBG,OAAO,CAACS,KAAK,CAACC,MAAM,GAAG;IACzCb,kBAAkBG,OAAO,CAACS,KAAK,CAACE,SAAS,GAAG;IAC5Cd,kBAAkBG,OAAO,CAACS,KAAK,CAACD,MAAM,GAAGA,SAAS;IAClDX,kBAAkBG,OAAO,CAACS,KAAK,CAACG,aAAa,GAAG;IAChDf,kBAAkBG,OAAO,CAACS,KAAK,CAACI,QAAQ,GAAG;IAC3ChB,kBAAkBG,OAAO,CAACS,KAAK,CAACN,GAAG,GAAGA,MAAM;IAC5CN,kBAAkBG,OAAO,CAACS,KAAK,CAACR,IAAI,GAAGA,OAAO;IAC9CJ,kBAAkBG,OAAO,CAACS,KAAK,CAACF,KAAK,GAAGA,QAAQ;IAChDV,kBAAkBG,OAAO,CAACS,KAAK,CAACK,MAAM,GAAG;IACzCjB,kBAAkBG,OAAO,CAACS,KAAK,CAACM,OAAO,GAAG;AAC5C"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import './index.scss';
+export declare function DraggableBlockPlugin({ anchorElem, }: {
+    anchorElem?: HTMLElement;
+}): React.ReactElement;
+//# sourceMappingURL=index.d.ts.map

package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/handles/DraggableBlockPlugin/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAa9B,OAAO,cAAc,CAAA;AAuarB,wBAAgB,oBAAoB,CAAC,EACnC,UAA0B,GAC3B,EAAE;IACD,UAAU,CAAC,EAAE,WAAW,CAAA;CACzB,GAAG,KAAK,CAAC,YAAY,CAGrB"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.js

@@ -0,0 +1,342 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
+import { eventFiles } from '@lexical/rich-text';
+import { $getNearestNodeFromDOMNode, $getNodeByKey } from 'lexical';
+import * as React from 'react';
+import { useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { useEditorConfigContext } from '../../../config/client/EditorConfigProvider.js';
+import { isHTMLElement } from '../../../utils/guard.js';
+import { Point } from '../../../utils/point.js';
+import { calculateDistanceFromScrollerElem } from '../utils/calculateDistanceFromScrollerElem.js';
+import { getNodeCloseToPoint } from '../utils/getNodeCloseToPoint.js';
+import { getTopLevelNodeKeys } from '../utils/getTopLevelNodeKeys.js';
+import { isOnHandleElement } from '../utils/isOnHandleElement.js';
+import { setHandlePosition } from '../utils/setHandlePosition.js';
+import { getBoundingClientRectWithoutTransform } from './getBoundingRectWithoutTransform.js';
+import { setTargetLine } from './setTargetLine.js';
+const DRAGGABLE_BLOCK_MENU_CLASSNAME = 'draggable-block-menu';
+const DRAG_DATA_FORMAT = 'application/x-lexical-drag-block';
+let prevIndex = Infinity;
+function getCurrentIndex(keysLength) {
+    if (keysLength === 0) {
+        return Infinity;
+    }
+    if (prevIndex >= 0 && prevIndex < keysLength) {
+        return prevIndex;
+    }
+    return Math.floor(keysLength / 2);
+}
+function setDragImage(dataTransfer, draggableBlockElem) {
+    const { transform } = draggableBlockElem.style;
+    // Remove dragImage borders
+    dataTransfer.setDragImage(draggableBlockElem, 0, 0);
+    setTimeout(()=>{
+        draggableBlockElem.style.transform = transform;
+    });
+}
+function hideTargetLine(targetLineElem, lastTargetBlockElem) {
+    if (targetLineElem) {
+        targetLineElem.style.opacity = '0';
+    }
+    if (lastTargetBlockElem) {
+        lastTargetBlockElem.style.opacity = '';
+        // Delete marginBottom and marginTop values we set
+        lastTargetBlockElem.style.marginBottom = '';
+        lastTargetBlockElem.style.marginTop = '';
+    //lastTargetBlock.style.border = 'none'
+    }
+}
+function useDraggableBlockMenu(editor, anchorElem, isEditable) {
+    const scrollerElem = anchorElem.parentElement;
+    const menuRef = useRef(null);
+    const targetLineRef = useRef(null);
+    const debugHighlightRef = useRef(null);
+    const isDraggingBlockRef = useRef(false);
+    const [draggableBlockElem, setDraggableBlockElem] = useState(null);
+    const [lastTargetBlock, setLastTargetBlock] = useState(null);
+    const { editorConfig } = useEditorConfigContext();
+    const blockHandleHorizontalOffset = editorConfig?.admin?.hideGutter ? -44 : -8;
+    useEffect(()=>{
+        /**
+     * Handles positioning of the drag handle
+     */ function onDocumentMouseMove(event) {
+            const target = event.target;
+            if (!isHTMLElement(target)) {
+                return;
+            }
+            const distanceFromScrollerElem = calculateDistanceFromScrollerElem(scrollerElem, event.pageX, event.pageY, target);
+            if (distanceFromScrollerElem === -1) {
+                setDraggableBlockElem(null);
+                return;
+            }
+            if (isOnHandleElement(target, DRAGGABLE_BLOCK_MENU_CLASSNAME)) {
+                return;
+            }
+            const topLevelNodeKeys = getTopLevelNodeKeys(editor);
+            const { blockElem: _draggableBlockElem, foundAtIndex, isFoundNodeEmptyParagraph } = getNodeCloseToPoint({
+                anchorElem,
+                cache_threshold: 0,
+                editor,
+                horizontalOffset: -distanceFromScrollerElem,
+                point: new Point(event.x, event.y),
+                startIndex: getCurrentIndex(topLevelNodeKeys.length),
+                useEdgeAsDefault: false,
+                verbose: false
+            });
+            prevIndex = foundAtIndex;
+            //if (DEBUG && _draggableBlockElem) {
+            //targetBlockElem.style.border = '3px solid red'
+            // highlightElemOriginalPosition(debugHighlightRef, _draggableBlockElem, anchorElem)
+            //}
+            if (!_draggableBlockElem && !isFoundNodeEmptyParagraph) {
+                return;
+            }
+            if (draggableBlockElem !== _draggableBlockElem) {
+                setDraggableBlockElem(_draggableBlockElem);
+            }
+        }
+        // Since the draggableBlockElem is outside the actual editor, we need to listen to the document
+        // to be able to detect when the mouse is outside the editor and respect a buffer around
+        // the scrollerElem to avoid the draggableBlockElem disappearing too early.
+        document?.addEventListener('mousemove', onDocumentMouseMove);
+        return ()=>{
+            document?.removeEventListener('mousemove', onDocumentMouseMove);
+        };
+    }, [
+        scrollerElem,
+        anchorElem,
+        editor,
+        draggableBlockElem
+    ]);
+    useEffect(()=>{
+        if (menuRef.current) {
+            setHandlePosition(draggableBlockElem, menuRef.current, anchorElem, blockHandleHorizontalOffset);
+        }
+    }, [
+        anchorElem,
+        draggableBlockElem,
+        blockHandleHorizontalOffset
+    ]);
+    useEffect(()=>{
+        function onDragover(event) {
+            if (!isDraggingBlockRef.current) {
+                return false;
+            }
+            const [isFileTransfer] = eventFiles(event);
+            if (isFileTransfer) {
+                return false;
+            }
+            const { pageY, target } = event;
+            if (!isHTMLElement(target)) {
+                return false;
+            }
+            const distanceFromScrollerElem = calculateDistanceFromScrollerElem(scrollerElem, event.pageX, event.pageY, target, 100, 50);
+            const topLevelNodeKeys = getTopLevelNodeKeys(editor);
+            const { blockElem: targetBlockElem, foundAtIndex, isFoundNodeEmptyParagraph } = getNodeCloseToPoint({
+                anchorElem,
+                editor,
+                fuzzy: true,
+                horizontalOffset: -distanceFromScrollerElem,
+                point: new Point(event.x, event.y),
+                startIndex: getCurrentIndex(topLevelNodeKeys.length),
+                useEdgeAsDefault: true,
+                verbose: true
+            });
+            prevIndex = foundAtIndex;
+            const targetLineElem = targetLineRef.current;
+            // targetBlockElem === null shouldn't happen
+            if (targetBlockElem === null || targetLineElem === null) {
+                return false;
+            }
+            if (draggableBlockElem !== targetBlockElem) {
+                const { isBelow, willStayInSamePosition } = 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, debugHighlightRef, isFoundNodeEmptyParagraph);
+                // Prevent default event to be able to trigger onDrop events
+                // Calling preventDefault() adds the green plus icon to the cursor,
+                // indicating that the drop is allowed.
+                event.preventDefault();
+                if (!willStayInSamePosition) {
+                    setLastTargetBlock({
+                        boundingBox: targetBlockElem.getBoundingClientRect(),
+                        elem: targetBlockElem,
+                        isBelow
+                    });
+                }
+            } else {
+                hideTargetLine(targetLineElem, lastTargetBlock?.elem);
+                setLastTargetBlock({
+                    boundingBox: targetBlockElem.getBoundingClientRect(),
+                    elem: targetBlockElem,
+                    isBelow: false
+                });
+            }
+            return true;
+        }
+        function onDrop(event) {
+            if (!isDraggingBlockRef.current) {
+                return false;
+            }
+            const [isFileTransfer] = eventFiles(event);
+            if (isFileTransfer) {
+                return false;
+            }
+            const { dataTransfer, pageY, target } = event;
+            const dragData = dataTransfer?.getData(DRAG_DATA_FORMAT) || '';
+            editor.update(()=>{
+                const draggedNode = $getNodeByKey(dragData);
+                if (!draggedNode) {
+                    return false;
+                }
+                if (!isHTMLElement(target)) {
+                    return false;
+                }
+                const distanceFromScrollerElem = calculateDistanceFromScrollerElem(scrollerElem, event.pageX, event.pageY, target, 100, 50);
+                const { blockElem: targetBlockElem, isFoundNodeEmptyParagraph } = getNodeCloseToPoint({
+                    anchorElem,
+                    editor,
+                    fuzzy: true,
+                    horizontalOffset: -distanceFromScrollerElem,
+                    point: new Point(event.x, event.y),
+                    useEdgeAsDefault: true
+                });
+                if (!targetBlockElem) {
+                    return false;
+                }
+                const targetNode = $getNearestNodeFromDOMNode(targetBlockElem);
+                if (!targetNode) {
+                    return false;
+                }
+                if (targetNode === draggedNode) {
+                    return true;
+                }
+                const { height: targetBlockElemHeight, top: targetBlockElemTop } = getBoundingClientRectWithoutTransform(targetBlockElem);
+                const mouseY = pageY;
+                const isBelow = mouseY >= targetBlockElemTop + targetBlockElemHeight / 2 + window.scrollY;
+                if (!isFoundNodeEmptyParagraph) {
+                    if (isBelow) {
+                        // below targetBlockElem
+                        targetNode.insertAfter(draggedNode);
+                    } else {
+                        // above targetBlockElem
+                        targetNode.insertBefore(draggedNode);
+                    }
+                } else {
+                    //
+                    targetNode.insertBefore(draggedNode);
+                    targetNode.remove();
+                }
+                /*
+        if (pageY >= targetBlockElemTop + targetBlockElemHeight / 2) {
+          targetNode.insertAfter(draggedNode)
+        } else {
+          targetNode.insertBefore(draggedNode)
+        }*/ if (draggableBlockElem !== null) {
+                    setDraggableBlockElem(null);
+                }
+                // find all previous elements with lexical-block-highlighter class and remove them
+                const allPrevHighlighters = document.querySelectorAll('.lexical-block-highlighter');
+                allPrevHighlighters.forEach((highlighter)=>{
+                    highlighter.remove();
+                });
+                const newInsertedElem = editor.getElementByKey(draggedNode.getKey());
+                setTimeout(()=>{
+                    // add new temp html element to newInsertedElem with the same height and width and the class block-selected
+                    // to highlight the new inserted element
+                    const newInsertedElemRect = newInsertedElem.getBoundingClientRect();
+                    const highlightElem = document.createElement('div');
+                    highlightElem.className = 'lexical-block-highlighter';
+                    // if html data-theme is dark, set the highlighter color to white
+                    if (document.documentElement.getAttribute('data-theme') === 'dark') {
+                        highlightElem.style.backgroundColor = 'white';
+                    } else {
+                        highlightElem.style.backgroundColor = 'black';
+                    }
+                    highlightElem.style.transition = 'opacity 0.1s ease-in-out';
+                    highlightElem.style.zIndex = '1';
+                    highlightElem.style.pointerEvents = 'none';
+                    highlightElem.style.boxSizing = 'border-box';
+                    highlightElem.style.borderRadius = '4px';
+                    highlightElem.style.position = 'absolute';
+                    document.body.appendChild(highlightElem);
+                    highlightElem.style.opacity = '0.1';
+                    highlightElem.style.height = `${newInsertedElemRect.height + 8}px`;
+                    highlightElem.style.width = `${newInsertedElemRect.width + 8}px`;
+                    highlightElem.style.top = `${newInsertedElemRect.top + window.scrollY - 4}px`;
+                    highlightElem.style.left = `${newInsertedElemRect.left - 4}px`;
+                    setTimeout(()=>{
+                        highlightElem.style.opacity = '0';
+                        setTimeout(()=>{
+                            highlightElem.remove();
+                        }, 1000);
+                    }, 3000);
+                }, 120);
+            });
+            return true;
+        }
+        // register onDragover event listeners:
+        document.addEventListener('dragover', onDragover);
+        // register onDrop event listeners:
+        document.addEventListener('drop', onDrop);
+        return ()=>{
+            document.removeEventListener('dragover', onDragover);
+            document.removeEventListener('drop', onDrop);
+        };
+    }, [
+        scrollerElem,
+        blockHandleHorizontalOffset,
+        anchorElem,
+        editor,
+        lastTargetBlock,
+        draggableBlockElem,
+        editorConfig?.admin?.hideGutter
+    ]);
+    function onDragStart(event) {
+        const dataTransfer = event.dataTransfer;
+        if (!dataTransfer || !draggableBlockElem) {
+            return;
+        }
+        setDragImage(dataTransfer, draggableBlockElem);
+        let nodeKey = '';
+        editor.update(()=>{
+            const node = $getNearestNodeFromDOMNode(draggableBlockElem);
+            if (node) {
+                nodeKey = node.getKey();
+            }
+        });
+        isDraggingBlockRef.current = true;
+        dataTransfer.setData(DRAG_DATA_FORMAT, nodeKey);
+    }
+    function onDragEnd() {
+        isDraggingBlockRef.current = false;
+        hideTargetLine(targetLineRef.current, lastTargetBlock?.elem);
+    }
+    return /*#__PURE__*/ createPortal(/*#__PURE__*/ _jsxs(React.Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: "icon draggable-block-menu",
+                draggable: true,
+                onDragEnd: onDragEnd,
+                onDragStart: onDragStart,
+                ref: menuRef,
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: isEditable ? 'icon' : ''
+                })
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: "draggable-block-target-line",
+                ref: targetLineRef
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: "debug-highlight",
+                ref: debugHighlightRef
+            })
+        ]
+    }), anchorElem);
+}
+export function DraggableBlockPlugin({ anchorElem = document.body }) {
+    const [editor] = useLexicalComposerContext();
+    return useDraggableBlockMenu(editor, anchorElem, editor._editable);
+}
+
+//# sourceMappingURL=index.js.map

package/dist/lexical/plugins/handles/DraggableBlockPlugin/index.js.map

@@ -0,0 +1 @@
+{"version":3,"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"],"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","documentElement","getAttribute","backgroundColor","transition","zIndex","pointerEvents","boxSizing","borderRadius","position","body","appendChild","left","onDragStart","nodeKey","node","setData","onDragEnd","Fragment","div","draggable","ref","DraggableBlockPlugin","_editable"],"mappings":"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"}

package/dist/lexical/plugins/handles/DraggableBlockPlugin/setTargetLine.d.ts

@@ -0,0 +1,9 @@
+export declare function setTargetLine(offsetWidth: string, offsetLeft: number, targetLineElem: HTMLElement, targetBlockElem: HTMLElement, lastTargetBlock: {
+    boundingBox?: DOMRect;
+    elem: HTMLElement | null;
+    isBelow: boolean;
+}, mouseY: number, anchorElem: HTMLElement, event: DragEvent, debugHighlightRef: React.RefObject<HTMLDivElement | null>, isFoundNodeEmptyParagraph?: boolean): {
+    isBelow: boolean;
+    willStayInSamePosition: boolean;
+};
+//# sourceMappingURL=setTargetLine.d.ts.map