@haklex/rich-plugin-block-handle 0.63.0 → 0.64.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/BlockHandlePlugin.d.ts.map +1 -1
- package/dist/blockMoves.d.ts +4 -0
- package/dist/blockMoves.d.ts.map +1 -1
- package/dist/index.mjs +107 -44
- package/dist/useBlockMoveShortcuts.d.ts +2 -1
- package/dist/useBlockMoveShortcuts.d.ts.map +1 -1
- package/dist/useGapInsert.d.ts +4 -1
- package/dist/useGapInsert.d.ts.map +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlockHandlePlugin.d.ts","sourceRoot":"","sources":["../src/BlockHandlePlugin.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAiC,YAAY,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"BlockHandlePlugin.d.ts","sourceRoot":"","sources":["../src/BlockHandlePlugin.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAiC,YAAY,EAAE,MAAM,OAAO,CAAC;AAwsBzE,wBAAgB,iBAAiB,IAAI,YAAY,CAGhD"}
|
package/dist/blockMoves.d.ts
CHANGED
|
@@ -1,4 +1,8 @@
|
|
|
1
|
+
import { DocumentBlocks } from '@haklex/rich-editor';
|
|
2
|
+
import { LexicalEditor } from 'lexical';
|
|
1
3
|
export declare function $selectionBlockKeys(): string[];
|
|
2
4
|
export declare function $moveBlocks(keys: string[], direction: 'up' | 'down'): boolean;
|
|
3
5
|
export declare function $duplicateBlocks(keys: string[]): boolean;
|
|
6
|
+
export declare function $moveBlocksTo(keys: string[], targetKey: string, before: boolean): boolean;
|
|
7
|
+
export declare function moveDocumentBlocks(editor: LexicalEditor, documentBlocks: DocumentBlocks | undefined, keys: string[], direction: 'up' | 'down'): void;
|
|
4
8
|
//# sourceMappingURL=blockMoves.d.ts.map
|
package/dist/blockMoves.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"blockMoves.d.ts","sourceRoot":"","sources":["../src/blockMoves.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"blockMoves.d.ts","sourceRoot":"","sources":["../src/blockMoves.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,KAAK,EAAE,aAAa,EAAe,MAAM,SAAS,CAAC;AAO1D,wBAAgB,mBAAmB,IAAI,MAAM,EAAE,CAgB9C;AAED,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,OAAO,CAuB7E;AAaD,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,OAAO,CAaxD;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,OAAO,CAmBzF;AAED,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,aAAa,EACrB,cAAc,EAAE,cAAc,GAAG,SAAS,EAC1C,IAAI,EAAE,MAAM,EAAE,EACd,SAAS,EAAE,IAAI,GAAG,MAAM,QAazB"}
|
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
import { useEditorBlock } from "@haklex/rich-editor";
|
|
1
2
|
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuTrigger, detectPlatform } from "@haklex/rich-editor-ui";
|
|
2
3
|
import { usePortalTheme } from "@haklex/rich-style-token";
|
|
3
4
|
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
|
4
|
-
import { $createNodeSelection, $createParagraphNode, $createTabNode, $createTextNode, $getNearestNodeFromDOMNode, $getNodeByKey, $getRoot, $getSelection, $isElementNode, $isNodeSelection, $isParagraphNode, $isRangeSelection, $isTextNode, $parseSerializedNode, $setSelection, COMMAND_PRIORITY_CRITICAL, COMMAND_PRIORITY_HIGH, COPY_COMMAND, CUT_COMMAND, DELETE_CHARACTER_COMMAND, DRAGOVER_COMMAND, DRAGSTART_COMMAND, DROP_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND, KEY_DOWN_COMMAND, KEY_ESCAPE_COMMAND, PASTE_COMMAND, PASTE_TAG, REMOVE_TEXT_COMMAND, SELECT_ALL_COMMAND, createEditor } from "lexical";
|
|
5
|
+
import { $createNodeSelection, $createParagraphNode, $createTabNode, $createTextNode, $getNearestNodeFromDOMNode, $getNodeByKey, $getRoot, $getSelection, $isElementNode, $isNodeSelection, $isParagraphNode, $isRangeSelection, $isTextNode, $parseSerializedNode, $setSelection, COMMAND_PRIORITY_CRITICAL, COMMAND_PRIORITY_HIGH, COPY_COMMAND, CUT_COMMAND, DELETE_CHARACTER_COMMAND, DRAGOVER_COMMAND, DRAGSTART_COMMAND, DROP_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND, KEY_DOWN_COMMAND, KEY_ESCAPE_COMMAND, PASTE_COMMAND, PASTE_TAG, REMOVE_TEXT_COMMAND, SELECT_ALL_COMMAND, createEditor, getNearestEditorFromDOMNode } from "lexical";
|
|
5
6
|
import { ArrowDown, ArrowUp, Copy, GripVertical, Plus, Trash2 } from "lucide-react";
|
|
6
7
|
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
7
8
|
import { createPortal } from "react-dom";
|
|
@@ -11,7 +12,6 @@ import { $createCodeNode } from "@lexical/code-core";
|
|
|
11
12
|
import { $isListNode, INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND } from "@lexical/list";
|
|
12
13
|
import { $createHeadingNode, $createQuoteNode, $isHeadingNode, $isQuoteNode } from "@lexical/rich-text";
|
|
13
14
|
import { $setBlocksType } from "@lexical/selection";
|
|
14
|
-
import { useEditorBlock } from "@haklex/rich-editor";
|
|
15
15
|
import { $generateHtmlFromNodes, $generateNodesFromDOM } from "@lexical/html";
|
|
16
16
|
//#region src/BlockMenu.tsx
|
|
17
17
|
var TURN_INTO_ITEMS = TURN_INTO_COMMAND_IDS.map((id) => getCommandMeta(id));
|
|
@@ -120,6 +120,38 @@ function $duplicateBlocks(keys) {
|
|
|
120
120
|
}
|
|
121
121
|
return true;
|
|
122
122
|
}
|
|
123
|
+
function $moveBlocksTo(keys, targetKey, before) {
|
|
124
|
+
const keySet = new Set(keys);
|
|
125
|
+
if (keySet.has(targetKey)) return false;
|
|
126
|
+
const children = $getRoot().getChildren();
|
|
127
|
+
const target = children.find((child) => child.getKey() === targetKey);
|
|
128
|
+
const blocks = children.filter((child) => keySet.has(child.getKey()));
|
|
129
|
+
if (!target || !blocks.length) return false;
|
|
130
|
+
for (const block of blocks) block.remove();
|
|
131
|
+
if (before) {
|
|
132
|
+
for (const block of blocks) target.insertBefore(block);
|
|
133
|
+
return true;
|
|
134
|
+
}
|
|
135
|
+
let cursor = target;
|
|
136
|
+
for (const block of blocks) {
|
|
137
|
+
cursor.insertAfter(block);
|
|
138
|
+
cursor = block;
|
|
139
|
+
}
|
|
140
|
+
return true;
|
|
141
|
+
}
|
|
142
|
+
function moveDocumentBlocks(editor, documentBlocks, keys, direction) {
|
|
143
|
+
if (!documentBlocks) {
|
|
144
|
+
editor.update(() => {
|
|
145
|
+
$moveBlocks(keys, direction);
|
|
146
|
+
});
|
|
147
|
+
return;
|
|
148
|
+
}
|
|
149
|
+
const documentKeys = documentBlocks.documentKeys(editor, keys);
|
|
150
|
+
if (!documentKeys.length) return;
|
|
151
|
+
documentBlocks.editor.update(() => {
|
|
152
|
+
$moveBlocks(documentKeys, direction);
|
|
153
|
+
});
|
|
154
|
+
}
|
|
123
155
|
//#endregion
|
|
124
156
|
//#region src/blockType.ts
|
|
125
157
|
var LIST_COMMANDS = {
|
|
@@ -226,7 +258,7 @@ var DIRECTIONS = {
|
|
|
226
258
|
ArrowUp: "up",
|
|
227
259
|
ArrowDown: "down"
|
|
228
260
|
};
|
|
229
|
-
function createBlockMoveHandler(editor, getSelectedKeys, isMac) {
|
|
261
|
+
function createBlockMoveHandler(editor, getSelectedKeys, isMac, documentBlocks) {
|
|
230
262
|
return (event, fromEditor) => {
|
|
231
263
|
if (fromEditor !== editor || event.altKey) return false;
|
|
232
264
|
if (isMac ? !event.metaKey || event.ctrlKey : !event.ctrlKey || event.metaKey) return false;
|
|
@@ -238,15 +270,21 @@ function createBlockMoveHandler(editor, getSelectedKeys, isMac) {
|
|
|
238
270
|
if (keys.length === 0) return false;
|
|
239
271
|
event.preventDefault();
|
|
240
272
|
if (duplicate) $duplicateBlocks(keys);
|
|
273
|
+
else if (documentBlocks) moveDocumentBlocks(editor, documentBlocks, keys, direction);
|
|
241
274
|
else $moveBlocks(keys, direction);
|
|
242
275
|
return true;
|
|
243
276
|
};
|
|
244
277
|
}
|
|
245
278
|
function useBlockMoveShortcuts(editor, getSelectedKeys) {
|
|
279
|
+
const documentBlocks = useEditorBlock()?.documentBlocks;
|
|
246
280
|
useEffect(() => {
|
|
247
281
|
const isMac = detectPlatform(typeof navigator === "undefined" ? void 0 : navigator) === "mac";
|
|
248
|
-
return editor.registerCommand(KEY_DOWN_COMMAND, createBlockMoveHandler(editor, getSelectedKeys, isMac), COMMAND_PRIORITY_CRITICAL);
|
|
249
|
-
}, [
|
|
282
|
+
return editor.registerCommand(KEY_DOWN_COMMAND, createBlockMoveHandler(editor, getSelectedKeys, isMac, documentBlocks), COMMAND_PRIORITY_CRITICAL);
|
|
283
|
+
}, [
|
|
284
|
+
documentBlocks,
|
|
285
|
+
editor,
|
|
286
|
+
getSelectedKeys
|
|
287
|
+
]);
|
|
250
288
|
}
|
|
251
289
|
//#endregion
|
|
252
290
|
//#region src/blockSelectionUtils.ts
|
|
@@ -982,12 +1020,34 @@ var GUTTER = 32;
|
|
|
982
1020
|
function rootBlocks(rootElement) {
|
|
983
1021
|
return [...rootElement.children].filter((child) => child instanceof HTMLElement);
|
|
984
1022
|
}
|
|
1023
|
+
function islandBlocks(canvas) {
|
|
1024
|
+
return [...canvas.querySelectorAll("[data-virtual-editor-content]")].flatMap(rootBlocks).filter((block) => block.getBoundingClientRect().height > 0).sort((a, b) => a.getBoundingClientRect().top - b.getBoundingClientRect().top);
|
|
1025
|
+
}
|
|
1026
|
+
function firstVisibleIsland(canvas) {
|
|
1027
|
+
return [...canvas.querySelectorAll("[data-virtual-editor-content]")].find((root) => root.getBoundingClientRect().height > 0);
|
|
1028
|
+
}
|
|
1029
|
+
function documentKeyOf(block, documentBlocks) {
|
|
1030
|
+
const owner = getNearestEditorFromDOMNode(block);
|
|
1031
|
+
if (!owner) return;
|
|
1032
|
+
const key = owner.read(() => $getNearestNodeFromDOMNode(block)?.getKey());
|
|
1033
|
+
return key ? documentBlocks.documentKeys(owner, [key])[0] : void 0;
|
|
1034
|
+
}
|
|
1035
|
+
function $insertSlashParagraph(target, before) {
|
|
1036
|
+
const paragraph = $createParagraphNode();
|
|
1037
|
+
const trigger = $createTextNode("/");
|
|
1038
|
+
paragraph.append(trigger);
|
|
1039
|
+
if (!target) $getRoot().append(paragraph);
|
|
1040
|
+
else if (before) target.insertBefore(paragraph);
|
|
1041
|
+
else target.insertAfter(paragraph);
|
|
1042
|
+
trigger.select(1, 1);
|
|
1043
|
+
}
|
|
985
1044
|
function useGapInsert(editor, isBlockTarget) {
|
|
986
1045
|
const [gap, setGap] = useState(null);
|
|
987
1046
|
const pendingIndexRef = useRef(null);
|
|
988
1047
|
const timerRef = useRef(null);
|
|
989
1048
|
const leaveTimerRef = useRef(null);
|
|
990
1049
|
const hoveringPlusRef = useRef(false);
|
|
1050
|
+
const documentBlocks = useEditorBlock()?.documentBlocks;
|
|
991
1051
|
const clearTimer = useCallback(() => {
|
|
992
1052
|
if (timerRef.current) clearTimeout(timerRef.current);
|
|
993
1053
|
timerRef.current = null;
|
|
@@ -1006,15 +1066,21 @@ function useGapInsert(editor, isBlockTarget) {
|
|
|
1006
1066
|
if (!rootElement) return;
|
|
1007
1067
|
const container = rootElement.closest(".rich-editor") ?? rootElement.parentElement;
|
|
1008
1068
|
if (!container) return;
|
|
1069
|
+
const canvas = documentBlocks ? rootElement.closest("[data-virtual-editor]") : null;
|
|
1009
1070
|
let rafId = null;
|
|
1010
1071
|
const evaluate = (event) => {
|
|
1011
1072
|
const target = event.target;
|
|
1012
|
-
|
|
1073
|
+
if (canvas && firstVisibleIsland(canvas) !== rootElement) {
|
|
1074
|
+
dismiss();
|
|
1075
|
+
return;
|
|
1076
|
+
}
|
|
1077
|
+
const rootRect = (canvas ?? rootElement).getBoundingClientRect();
|
|
1013
1078
|
if (!(event.clientX >= rootRect.left - GUTTER && event.clientX <= rootRect.right) || isBlockTarget(target) || target.closest("[role=\"toolbar\"]")) {
|
|
1014
1079
|
dismiss();
|
|
1015
1080
|
return;
|
|
1016
1081
|
}
|
|
1017
|
-
const
|
|
1082
|
+
const blocks = canvas ? islandBlocks(canvas) : rootBlocks(rootElement);
|
|
1083
|
+
const found = findGap(blocks.map((block) => block.getBoundingClientRect()), event.clientY);
|
|
1018
1084
|
if (!found) {
|
|
1019
1085
|
dismiss();
|
|
1020
1086
|
return;
|
|
@@ -1027,7 +1093,9 @@ function useGapInsert(editor, isBlockTarget) {
|
|
|
1027
1093
|
index: found.index,
|
|
1028
1094
|
top: found.y + window.scrollY,
|
|
1029
1095
|
left: rootRect.left + window.scrollX,
|
|
1030
|
-
width: rootRect.width
|
|
1096
|
+
width: rootRect.width,
|
|
1097
|
+
next: blocks[found.index] ?? null,
|
|
1098
|
+
previous: blocks[found.index - 1] ?? null
|
|
1031
1099
|
});
|
|
1032
1100
|
}, GAP_DELAY);
|
|
1033
1101
|
};
|
|
@@ -1058,6 +1126,7 @@ function useGapInsert(editor, isBlockTarget) {
|
|
|
1058
1126
|
clearLeaveTimer,
|
|
1059
1127
|
clearTimer,
|
|
1060
1128
|
dismiss,
|
|
1129
|
+
documentBlocks,
|
|
1061
1130
|
editor,
|
|
1062
1131
|
isBlockTarget
|
|
1063
1132
|
]);
|
|
@@ -1074,23 +1143,23 @@ function useGapInsert(editor, isBlockTarget) {
|
|
|
1074
1143
|
gap,
|
|
1075
1144
|
insertAtGap: useCallback(() => {
|
|
1076
1145
|
if (!gap) return;
|
|
1077
|
-
const { index } = gap;
|
|
1146
|
+
const { index, next, previous } = gap;
|
|
1078
1147
|
hoveringPlusRef.current = false;
|
|
1079
1148
|
dismiss();
|
|
1080
1149
|
setGap(null);
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
const
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
});
|
|
1150
|
+
const neighbor = next ?? previous;
|
|
1151
|
+
if (documentBlocks && neighbor) {
|
|
1152
|
+
const key = documentKeyOf(neighbor, documentBlocks);
|
|
1153
|
+
if (!key) return;
|
|
1154
|
+
documentBlocks.editor.update(() => $insertSlashParagraph($getNodeByKey(key), neighbor === next), { discrete: true });
|
|
1155
|
+
documentBlocks.focusSelection();
|
|
1156
|
+
return;
|
|
1157
|
+
}
|
|
1158
|
+
editor.update(() => $insertSlashParagraph($getRoot().getChildAtIndex(index), true));
|
|
1091
1159
|
editor.focus();
|
|
1092
1160
|
}, [
|
|
1093
1161
|
dismiss,
|
|
1162
|
+
documentBlocks,
|
|
1094
1163
|
editor,
|
|
1095
1164
|
gap
|
|
1096
1165
|
]),
|
|
@@ -1222,6 +1291,7 @@ function BlockHandleInner({ editor }) {
|
|
|
1222
1291
|
const draggingBlockRef = useRef(null);
|
|
1223
1292
|
const draggingBlockKeysRef = useRef(null);
|
|
1224
1293
|
const { selectBlock, getSelectedKeys, deleteSelectedBlocks } = useBlockSelection(editor);
|
|
1294
|
+
const documentBlocks = useEditorBlock()?.documentBlocks;
|
|
1225
1295
|
const clearHideTimer = useCallback(() => {
|
|
1226
1296
|
if (hideTimerRef.current) {
|
|
1227
1297
|
clearTimeout(hideTimerRef.current);
|
|
@@ -1372,10 +1442,9 @@ function BlockHandleInner({ editor }) {
|
|
|
1372
1442
|
const selectedKeys = getSelectedKeys();
|
|
1373
1443
|
const keys = selectedKeys.length > 0 ? selectedKeys : handle.nodeKey ? [handle.nodeKey] : [];
|
|
1374
1444
|
if (!keys.length) return;
|
|
1375
|
-
editor
|
|
1376
|
-
$moveBlocks(keys, direction);
|
|
1377
|
-
});
|
|
1445
|
+
moveDocumentBlocks(editor, documentBlocks, keys, direction);
|
|
1378
1446
|
}, [
|
|
1447
|
+
documentBlocks,
|
|
1379
1448
|
editor,
|
|
1380
1449
|
getSelectedKeys,
|
|
1381
1450
|
handle.nodeKey
|
|
@@ -1404,7 +1473,8 @@ function BlockHandleInner({ editor }) {
|
|
|
1404
1473
|
if (!event.dataTransfer || !handle.nodeKey) return;
|
|
1405
1474
|
const selectedKeys = getSelectedKeys();
|
|
1406
1475
|
const dragKeys = selectedKeys.length > 0 && selectedKeys.includes(handle.nodeKey) ? selectedKeys : [handle.nodeKey];
|
|
1407
|
-
|
|
1476
|
+
const payloadKeys = documentBlocks ? documentBlocks.documentKeys(editor, dragKeys) : dragKeys;
|
|
1477
|
+
event.dataTransfer.setData(DRAG_DATA_KEY, JSON.stringify(payloadKeys));
|
|
1408
1478
|
event.dataTransfer.effectAllowed = "move";
|
|
1409
1479
|
const block = activeBlockRef.current;
|
|
1410
1480
|
if (!block) return;
|
|
@@ -1444,6 +1514,7 @@ function BlockHandleInner({ editor }) {
|
|
|
1444
1514
|
event.dataTransfer.setDragImage(preview, offsetX, offsetY);
|
|
1445
1515
|
}, [
|
|
1446
1516
|
clearDragVisualState,
|
|
1517
|
+
documentBlocks,
|
|
1447
1518
|
editor,
|
|
1448
1519
|
getSelectedKeys,
|
|
1449
1520
|
handle.nodeKey,
|
|
@@ -1544,26 +1615,14 @@ function BlockHandleInner({ editor }) {
|
|
|
1544
1615
|
if (!draggedKeys.length) return false;
|
|
1545
1616
|
const block = getDropTargetBlock(editor, rootElement, event);
|
|
1546
1617
|
if (!block) return false;
|
|
1547
|
-
editor.
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
const draggedNodes = children.filter((child) => keySet.has(child.getKey()));
|
|
1556
|
-
for (const node of draggedNodes) node.remove();
|
|
1557
|
-
const freshTarget = $getNodeByKey(targetNode.getKey());
|
|
1558
|
-
if (!freshTarget) return;
|
|
1559
|
-
if (insertBefore) for (let i = draggedNodes.length - 1; i >= 0; i--) freshTarget.insertBefore(draggedNodes[i]);
|
|
1560
|
-
else {
|
|
1561
|
-
let cursor = freshTarget;
|
|
1562
|
-
for (const node of draggedNodes) {
|
|
1563
|
-
cursor.insertAfter(node);
|
|
1564
|
-
cursor = node;
|
|
1565
|
-
}
|
|
1566
|
-
}
|
|
1618
|
+
const islandTargetKey = editor.read(() => $getNearestNodeFromDOMNode(block)?.getKey());
|
|
1619
|
+
if (!islandTargetKey) return true;
|
|
1620
|
+
const targetKey = documentBlocks ? documentBlocks.documentKeys(editor, [islandTargetKey])[0] : islandTargetKey;
|
|
1621
|
+
if (!targetKey) return true;
|
|
1622
|
+
const rect = block.getBoundingClientRect();
|
|
1623
|
+
const insertBefore = event.clientY < rect.top + rect.height / 2;
|
|
1624
|
+
(documentBlocks?.editor ?? editor).update(() => {
|
|
1625
|
+
$moveBlocksTo(draggedKeys, targetKey, insertBefore);
|
|
1567
1626
|
});
|
|
1568
1627
|
return true;
|
|
1569
1628
|
}, COMMAND_PRIORITY_HIGH);
|
|
@@ -1596,7 +1655,11 @@ function BlockHandleInner({ editor }) {
|
|
|
1596
1655
|
rootElement.removeEventListener("dragleave", onDragLeave);
|
|
1597
1656
|
clearDragState();
|
|
1598
1657
|
};
|
|
1599
|
-
}, [
|
|
1658
|
+
}, [
|
|
1659
|
+
clearDragVisualState,
|
|
1660
|
+
documentBlocks,
|
|
1661
|
+
editor
|
|
1662
|
+
]);
|
|
1600
1663
|
useEffect(() => {
|
|
1601
1664
|
const rootElement = editor.getRootElement();
|
|
1602
1665
|
if (!rootElement) return;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
+
import { DocumentBlocks } from '@haklex/rich-editor';
|
|
1
2
|
import { CommandListener, LexicalEditor } from 'lexical';
|
|
2
|
-
export declare function createBlockMoveHandler(editor: LexicalEditor, getSelectedKeys: () => string[], isMac: boolean): CommandListener<KeyboardEvent>;
|
|
3
|
+
export declare function createBlockMoveHandler(editor: LexicalEditor, getSelectedKeys: () => string[], isMac: boolean, documentBlocks?: DocumentBlocks): CommandListener<KeyboardEvent>;
|
|
3
4
|
export declare function useBlockMoveShortcuts(editor: LexicalEditor, getSelectedKeys: () => string[]): void;
|
|
4
5
|
//# sourceMappingURL=useBlockMoveShortcuts.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBlockMoveShortcuts.d.ts","sourceRoot":"","sources":["../src/useBlockMoveShortcuts.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useBlockMoveShortcuts.d.ts","sourceRoot":"","sources":["../src/useBlockMoveShortcuts.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAG1D,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAa9D,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,aAAa,EACrB,eAAe,EAAE,MAAM,MAAM,EAAE,EAC/B,KAAK,EAAE,OAAO,EACd,cAAc,CAAC,EAAE,cAAc,GAC9B,eAAe,CAAC,aAAa,CAAC,CAgBhC;AAED,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,MAAM,EAAE,QAW3F"}
|
package/dist/useGapInsert.d.ts
CHANGED
|
@@ -1,10 +1,13 @@
|
|
|
1
|
-
import { LexicalEditor } from 'lexical';
|
|
1
|
+
import { LexicalEditor, LexicalNode } from 'lexical';
|
|
2
2
|
export interface GapState {
|
|
3
3
|
index: number;
|
|
4
4
|
left: number;
|
|
5
|
+
next: HTMLElement | null;
|
|
6
|
+
previous: HTMLElement | null;
|
|
5
7
|
top: number;
|
|
6
8
|
width: number;
|
|
7
9
|
}
|
|
10
|
+
export declare function $insertSlashParagraph(target: LexicalNode | null, before: boolean): void;
|
|
8
11
|
export declare function useGapInsert(editor: LexicalEditor, isBlockTarget: (target: HTMLElement) => boolean): {
|
|
9
12
|
gap: GapState | null;
|
|
10
13
|
insertAtGap: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGapInsert.d.ts","sourceRoot":"","sources":["../src/useGapInsert.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useGapInsert.d.ts","sourceRoot":"","sources":["../src/useGapInsert.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAiB1D,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;CACf;AA4BD,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI,EAAE,MAAM,EAAE,OAAO,QAQhF;AAED,wBAAgB,YAAY,CAC1B,MAAM,EAAE,aAAa,EACrB,aAAa,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,OAAO;;;;;EAsIhD"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@haklex/rich-plugin-block-handle",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.64.0",
|
|
4
4
|
"description": "Block handle plugin with add button and context menu",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -42,9 +42,9 @@
|
|
|
42
42
|
"vite": "^8.3.5"
|
|
43
43
|
},
|
|
44
44
|
"peerDependencies": {
|
|
45
|
-
"@haklex/rich-editor": "^0.
|
|
46
|
-
"@haklex/rich-editor-ui": "^0.
|
|
47
|
-
"@haklex/rich-style-token": "^0.
|
|
45
|
+
"@haklex/rich-editor": "^0.64.0",
|
|
46
|
+
"@haklex/rich-editor-ui": "^0.64.0",
|
|
47
|
+
"@haklex/rich-style-token": "^0.64.0",
|
|
48
48
|
"@lexical/html": "^0.53.0",
|
|
49
49
|
"@lexical/list": "^0.53.0",
|
|
50
50
|
"@lexical/react": "^0.53.0",
|