@haklex/rich-plugin-block-handle 0.0.79 → 0.0.81

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 (3) hide show
  1. package/dist/index.mjs +562 -533
  2. package/dist/rich-plugin-block-handle.css +2 -1
  3. package/package.json +3 -3
package/dist/index.mjs CHANGED
@@ -1,561 +1,590 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuSeparator } from "@haklex/rich-editor-ui";
1
+ import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from "@haklex/rich-editor-ui";
3
2
  import { usePortalTheme } from "@haklex/rich-style-token";
4
3
  import { $createCodeNode } from "@lexical/code";
5
4
  import { INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND } from "@lexical/list";
6
5
  import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
7
6
  import { INSERT_HORIZONTAL_RULE_COMMAND } from "@lexical/react/LexicalHorizontalRuleNode";
8
- import { $createQuoteNode, $createHeadingNode } from "@lexical/rich-text";
7
+ import { $createHeadingNode, $createQuoteNode } from "@lexical/rich-text";
9
8
  import { $setBlocksType } from "@lexical/selection";
10
- import { $getNearestNodeFromDOMNode, $getNodeByKey, $createParagraphNode, $isElementNode, $getSelection, $isRangeSelection, DRAGOVER_COMMAND, COMMAND_PRIORITY_HIGH, DROP_COMMAND, DRAGSTART_COMMAND } from "lexical";
11
- import { Plus, GripVertical, Type, Heading1, Heading2, Heading3, List, ListOrdered, ListChecks, TextQuote, Minus, Code2, Copy, ArrowUp, ArrowDown, Trash2 } from "lucide-react";
12
- import { useState, useRef, useCallback, useEffect } from "react";
9
+ import { $createParagraphNode, $getNearestNodeFromDOMNode, $getNodeByKey, $getSelection, $isElementNode, $isRangeSelection, COMMAND_PRIORITY_HIGH, DRAGOVER_COMMAND, DRAGSTART_COMMAND, DROP_COMMAND } from "lexical";
10
+ import { ArrowDown, ArrowUp, Code2, Copy, GripVertical, Heading1, Heading2, Heading3, List, ListChecks, ListOrdered, Minus, Plus, TextQuote, Trash2, Type } from "lucide-react";
11
+ import { useCallback, useEffect, useRef, useState } from "react";
13
12
  import { createPortal } from "react-dom";
13
+ import { jsx, jsxs } from "react/jsx-runtime";
14
+ //#region src/styles.css.ts
14
15
  var handleContainer = "iihqkc0";
15
16
  var handleContainerVisible = "iihqkc1";
16
17
  var handleBtn = "iihqkc2";
17
18
  var draggingBlock = "iihqkc3";
18
19
  var dragPreview = "iihqkc4";
19
- var dropIndicator = "iihqkc5";
20
20
  var menuItemDestructive = "iihqkc6";
21
- const DRAG_DATA_KEY = "application/x-rich-editor-drag";
22
- const HIDE_DELAY = 300;
23
- const HANDLE_OFFSET = 52;
24
- const TURN_INTO_ITEMS = [
25
- { key: "paragraph", label: "Text", icon: Type },
26
- { key: "h1", label: "Heading 1", icon: Heading1 },
27
- { key: "h2", label: "Heading 2", icon: Heading2 },
28
- { key: "h3", label: "Heading 3", icon: Heading3 },
29
- { key: "bullet", label: "Bullet List", icon: List },
30
- { key: "numbered", label: "Numbered List", icon: ListOrdered },
31
- { key: "todo", label: "To-do", icon: ListChecks },
32
- { key: "quote", label: "Quote", icon: TextQuote },
33
- { key: "divider", label: "Divider", icon: Minus },
34
- { key: "code", label: "Code", icon: Code2 }
21
+ //#endregion
22
+ //#region src/BlockHandlePlugin.tsx
23
+ var DRAG_DATA_KEY = "application/x-rich-editor-drag";
24
+ var HIDE_DELAY = 300;
25
+ var HANDLE_OFFSET = 52;
26
+ var TURN_INTO_ITEMS = [
27
+ {
28
+ key: "paragraph",
29
+ label: "Text",
30
+ icon: Type
31
+ },
32
+ {
33
+ key: "h1",
34
+ label: "Heading 1",
35
+ icon: Heading1
36
+ },
37
+ {
38
+ key: "h2",
39
+ label: "Heading 2",
40
+ icon: Heading2
41
+ },
42
+ {
43
+ key: "h3",
44
+ label: "Heading 3",
45
+ icon: Heading3
46
+ },
47
+ {
48
+ key: "bullet",
49
+ label: "Bullet List",
50
+ icon: List
51
+ },
52
+ {
53
+ key: "numbered",
54
+ label: "Numbered List",
55
+ icon: ListOrdered
56
+ },
57
+ {
58
+ key: "todo",
59
+ label: "To-do",
60
+ icon: ListChecks
61
+ },
62
+ {
63
+ key: "quote",
64
+ label: "Quote",
65
+ icon: TextQuote
66
+ },
67
+ {
68
+ key: "divider",
69
+ label: "Divider",
70
+ icon: Minus
71
+ },
72
+ {
73
+ key: "code",
74
+ label: "Code",
75
+ icon: Code2
76
+ }
35
77
  ];
36
78
  function getBlockElement(editor, target) {
37
- const rootElement = editor.getRootElement();
38
- if (!rootElement) return null;
39
- let current = target;
40
- while (current && current !== rootElement) {
41
- if (current.parentElement === rootElement) return current;
42
- current = current.parentElement;
43
- }
44
- return null;
79
+ const rootElement = editor.getRootElement();
80
+ if (!rootElement) return null;
81
+ let current = target;
82
+ while (current && current !== rootElement) {
83
+ if (current.parentElement === rootElement) return current;
84
+ current = current.parentElement;
85
+ }
86
+ return null;
45
87
  }
46
88
  function getNearestBlockByY(rootElement, clientY) {
47
- const blocks = [...rootElement.children].filter(
48
- (child) => child instanceof HTMLElement
49
- );
50
- if (!blocks.length) return null;
51
- let nearestBlock = null;
52
- let nearestDistance = Number.POSITIVE_INFINITY;
53
- for (const block of blocks) {
54
- const rect = block.getBoundingClientRect();
55
- if (rect.height <= 0) continue;
56
- if (clientY >= rect.top && clientY <= rect.bottom) return block;
57
- const distance = clientY < rect.top ? rect.top - clientY : clientY - rect.bottom;
58
- if (distance < nearestDistance) {
59
- nearestDistance = distance;
60
- nearestBlock = block;
61
- }
62
- }
63
- return nearestBlock;
89
+ const blocks = [...rootElement.children].filter((child) => child instanceof HTMLElement);
90
+ if (!blocks.length) return null;
91
+ let nearestBlock = null;
92
+ let nearestDistance = Number.POSITIVE_INFINITY;
93
+ for (const block of blocks) {
94
+ const rect = block.getBoundingClientRect();
95
+ if (rect.height <= 0) continue;
96
+ if (clientY >= rect.top && clientY <= rect.bottom) return block;
97
+ const distance = clientY < rect.top ? rect.top - clientY : clientY - rect.bottom;
98
+ if (distance < nearestDistance) {
99
+ nearestDistance = distance;
100
+ nearestBlock = block;
101
+ }
102
+ }
103
+ return nearestBlock;
64
104
  }
65
105
  function getDropTargetBlock(editor, rootElement, event) {
66
- const rootRect = rootElement.getBoundingClientRect();
67
- if (rootRect.width <= 0 || rootRect.height <= 0) return null;
68
- if (event.clientY < rootRect.top || event.clientY > rootRect.bottom) {
69
- return null;
70
- }
71
- const points = [{ x: event.clientX, y: event.clientY }];
72
- const clampedX = Math.min(rootRect.right - 1, Math.max(rootRect.left + 1, event.clientX));
73
- if (clampedX !== event.clientX) {
74
- points.unshift({ x: clampedX, y: event.clientY });
75
- }
76
- for (const point of points) {
77
- const element = document.elementFromPoint(point.x, point.y);
78
- if (!(element instanceof HTMLElement)) continue;
79
- const block = getBlockElement(editor, element);
80
- if (block) return block;
81
- }
82
- const { target } = event;
83
- if (target instanceof HTMLElement) {
84
- const block = getBlockElement(editor, target);
85
- if (block) return block;
86
- }
87
- return getNearestBlockByY(rootElement, event.clientY);
106
+ const rootRect = rootElement.getBoundingClientRect();
107
+ if (rootRect.width <= 0 || rootRect.height <= 0) return null;
108
+ if (event.clientY < rootRect.top || event.clientY > rootRect.bottom) return null;
109
+ const points = [{
110
+ x: event.clientX,
111
+ y: event.clientY
112
+ }];
113
+ const clampedX = Math.min(rootRect.right - 1, Math.max(rootRect.left + 1, event.clientX));
114
+ if (clampedX !== event.clientX) points.unshift({
115
+ x: clampedX,
116
+ y: event.clientY
117
+ });
118
+ for (const point of points) {
119
+ const element = document.elementFromPoint(point.x, point.y);
120
+ if (!(element instanceof HTMLElement)) continue;
121
+ const block = getBlockElement(editor, element);
122
+ if (block) return block;
123
+ }
124
+ const { target } = event;
125
+ if (target instanceof HTMLElement) {
126
+ const block = getBlockElement(editor, target);
127
+ if (block) return block;
128
+ }
129
+ return getNearestBlockByY(rootElement, event.clientY);
88
130
  }
89
131
  function toPagePosition(rect) {
90
- return {
91
- top: rect.top + window.scrollY,
92
- left: rect.left + window.scrollX
93
- };
132
+ return {
133
+ top: rect.top + window.scrollY,
134
+ left: rect.left + window.scrollX
135
+ };
94
136
  }
95
137
  function $cloneNode(node) {
96
- const Klass = node.constructor;
97
- const serialized = node.exportJSON();
98
- const clone = Klass.importJSON(serialized);
99
- if ($isElementNode(node) && $isElementNode(clone)) {
100
- for (const child of node.getChildren()) {
101
- clone.append($cloneNode(child));
102
- }
103
- }
104
- return clone;
138
+ const Klass = node.constructor;
139
+ const serialized = node.exportJSON();
140
+ const clone = Klass.importJSON(serialized);
141
+ if ($isElementNode(node) && $isElementNode(clone)) for (const child of node.getChildren()) clone.append($cloneNode(child));
142
+ return clone;
105
143
  }
106
144
  function BlockHandleInner({ editor }) {
107
- const { className: portalClassName, theme } = usePortalTheme();
108
- const [handle, setHandle] = useState({
109
- visible: false,
110
- top: 0,
111
- left: 0,
112
- nodeKey: null
113
- });
114
- const [dropLine, setDropLine] = useState({
115
- visible: false,
116
- top: 0,
117
- left: 0,
118
- width: 0
119
- });
120
- const activeBlockRef = useRef(null);
121
- const hideTimerRef = useRef(null);
122
- const hoveringHandleRef = useRef(false);
123
- const menuOpenCountRef = useRef(0);
124
- const dragPreviewRef = useRef(null);
125
- const draggingBlockRef = useRef(null);
126
- const clearHideTimer = useCallback(() => {
127
- if (hideTimerRef.current) {
128
- clearTimeout(hideTimerRef.current);
129
- hideTimerRef.current = null;
130
- }
131
- }, []);
132
- const scheduleHide = useCallback(() => {
133
- clearHideTimer();
134
- hideTimerRef.current = setTimeout(() => {
135
- if (!hoveringHandleRef.current && menuOpenCountRef.current === 0) {
136
- activeBlockRef.current = null;
137
- setHandle((s) => ({ ...s, visible: false, nodeKey: null }));
138
- }
139
- }, HIDE_DELAY);
140
- }, [clearHideTimer]);
141
- const onHandleEnter = useCallback(() => {
142
- hoveringHandleRef.current = true;
143
- clearHideTimer();
144
- }, [clearHideTimer]);
145
- const onHandleLeave = useCallback(() => {
146
- hoveringHandleRef.current = false;
147
- scheduleHide();
148
- }, [scheduleHide]);
149
- const onMenuOpenChange = useCallback(
150
- (open) => {
151
- menuOpenCountRef.current += open ? 1 : -1;
152
- if (!open) scheduleHide();
153
- else clearHideTimer();
154
- },
155
- [scheduleHide, clearHideTimer]
156
- );
157
- const updatePositionFromBlock = useCallback(
158
- (block) => {
159
- if (block !== void 0) activeBlockRef.current = block;
160
- const el = activeBlockRef.current;
161
- if (!el || !el.isConnected) {
162
- activeBlockRef.current = null;
163
- setHandle((s) => s.visible ? { ...s, visible: false, nodeKey: null } : s);
164
- return;
165
- }
166
- const rootElement = editor.getRootElement();
167
- if (!rootElement) return;
168
- const blockRect = el.getBoundingClientRect();
169
- const rootRect = rootElement.getBoundingClientRect();
170
- const page = toPagePosition(blockRect);
171
- let nodeKey = null;
172
- editor.read(() => {
173
- const node = $getNearestNodeFromDOMNode(el);
174
- if (node) nodeKey = node.getKey();
175
- });
176
- setHandle({
177
- visible: true,
178
- top: page.top,
179
- left: toPagePosition(rootRect).left - HANDLE_OFFSET,
180
- nodeKey
181
- });
182
- },
183
- [editor]
184
- );
185
- useEffect(() => {
186
- const rootElement = editor.getRootElement();
187
- if (!rootElement) return;
188
- let rafId = null;
189
- const onMouseMove = (e) => {
190
- if (rafId !== null) return;
191
- rafId = requestAnimationFrame(() => {
192
- rafId = null;
193
- const target = e.target;
194
- const block = getBlockElement(editor, target);
195
- if (block) {
196
- clearHideTimer();
197
- updatePositionFromBlock(block);
198
- }
199
- });
200
- };
201
- const onMouseLeave = () => {
202
- if (!hoveringHandleRef.current && menuOpenCountRef.current === 0) {
203
- scheduleHide();
204
- }
205
- };
206
- rootElement.addEventListener("mousemove", onMouseMove);
207
- rootElement.addEventListener("mouseleave", onMouseLeave);
208
- return () => {
209
- if (rafId !== null) cancelAnimationFrame(rafId);
210
- rootElement.removeEventListener("mousemove", onMouseMove);
211
- rootElement.removeEventListener("mouseleave", onMouseLeave);
212
- clearHideTimer();
213
- };
214
- }, [editor, clearHideTimer, scheduleHide, updatePositionFromBlock]);
215
- useEffect(() => {
216
- const update = () => updatePositionFromBlock();
217
- window.addEventListener("scroll", update, true);
218
- window.addEventListener("resize", update);
219
- return () => {
220
- window.removeEventListener("scroll", update, true);
221
- window.removeEventListener("resize", update);
222
- };
223
- }, [updatePositionFromBlock]);
224
- useEffect(
225
- () => editor.registerUpdateListener(() => updatePositionFromBlock()),
226
- [editor, updatePositionFromBlock]
227
- );
228
- const handleAddBlock = useCallback(() => {
229
- if (!handle.nodeKey) return;
230
- editor.update(() => {
231
- const node = $getNodeByKey(handle.nodeKey);
232
- if (!node) return;
233
- const p = $createParagraphNode();
234
- node.insertAfter(p);
235
- p.selectStart();
236
- });
237
- }, [editor, handle.nodeKey]);
238
- const handleTurnInto = useCallback(
239
- (type) => {
240
- const { nodeKey } = handle;
241
- if (!nodeKey) return;
242
- if (["bullet", "numbered", "todo", "divider"].includes(type)) {
243
- editor.update(() => {
244
- const node = $getNodeByKey(nodeKey);
245
- if (!node) return;
246
- if ($isElementNode(node)) node.selectStart();
247
- });
248
- const commands = {
249
- bullet: INSERT_UNORDERED_LIST_COMMAND,
250
- numbered: INSERT_ORDERED_LIST_COMMAND,
251
- todo: INSERT_CHECK_LIST_COMMAND,
252
- divider: INSERT_HORIZONTAL_RULE_COMMAND
253
- };
254
- editor.dispatchCommand(commands[type], void 0);
255
- return;
256
- }
257
- editor.update(() => {
258
- const node = $getNodeByKey(nodeKey);
259
- if (!node || !$isElementNode(node)) return;
260
- node.selectStart();
261
- const sel = $getSelection();
262
- if (!$isRangeSelection(sel)) return;
263
- const creators = {
264
- paragraph: () => $createParagraphNode(),
265
- h1: () => $createHeadingNode("h1"),
266
- h2: () => $createHeadingNode("h2"),
267
- h3: () => $createHeadingNode("h3"),
268
- quote: () => $createQuoteNode(),
269
- code: () => $createCodeNode()
270
- };
271
- const create = creators[type];
272
- if (create) $setBlocksType(sel, create);
273
- });
274
- },
275
- [editor, handle.nodeKey]
276
- );
277
- const handleDelete = useCallback(() => {
278
- if (!handle.nodeKey) return;
279
- editor.update(() => {
280
- const node = $getNodeByKey(handle.nodeKey);
281
- node?.remove();
282
- });
283
- setHandle((s) => ({ ...s, visible: false, nodeKey: null }));
284
- }, [editor, handle.nodeKey]);
285
- const handleDuplicate = useCallback(() => {
286
- if (!handle.nodeKey) return;
287
- editor.update(() => {
288
- const node = $getNodeByKey(handle.nodeKey);
289
- if (!node) return;
290
- const clone = $cloneNode(node);
291
- node.insertAfter(clone);
292
- });
293
- }, [editor, handle.nodeKey]);
294
- const handleMoveUp = useCallback(() => {
295
- if (!handle.nodeKey) return;
296
- editor.update(() => {
297
- const node = $getNodeByKey(handle.nodeKey);
298
- if (!node) return;
299
- const prev = node.getPreviousSibling();
300
- if (prev) {
301
- node.remove();
302
- prev.insertBefore(node);
303
- }
304
- });
305
- }, [editor, handle.nodeKey]);
306
- const handleMoveDown = useCallback(() => {
307
- if (!handle.nodeKey) return;
308
- editor.update(() => {
309
- const node = $getNodeByKey(handle.nodeKey);
310
- if (!node) return;
311
- const next = node.getNextSibling();
312
- if (next) {
313
- node.remove();
314
- next.insertAfter(node);
315
- }
316
- });
317
- }, [editor, handle.nodeKey]);
318
- const [gripMenuOpen, setGripMenuOpen] = useState(false);
319
- const dragStartedRef = useRef(false);
320
- const clearDragVisualState = useCallback(() => {
321
- const preview = dragPreviewRef.current;
322
- if (preview) {
323
- preview.remove();
324
- dragPreviewRef.current = null;
325
- }
326
- const draggingBlock$1 = draggingBlockRef.current;
327
- if (draggingBlock$1) {
328
- draggingBlock$1.classList.remove(draggingBlock);
329
- draggingBlockRef.current = null;
330
- }
331
- }, []);
332
- const onGripDragStart = useCallback(
333
- (e) => {
334
- dragStartedRef.current = true;
335
- if (!e.dataTransfer || !handle.nodeKey) return;
336
- e.dataTransfer.setData(DRAG_DATA_KEY, handle.nodeKey);
337
- e.dataTransfer.effectAllowed = "move";
338
- const block = activeBlockRef.current;
339
- if (!block) return;
340
- clearDragVisualState();
341
- const rect = block.getBoundingClientRect();
342
- const preview = block.cloneNode(true);
343
- preview.classList.add(dragPreview);
344
- preview.style.width = `${rect.width}px`;
345
- if (portalClassName) {
346
- const wrapper = document.createElement("div");
347
- wrapper.className = portalClassName;
348
- wrapper.setAttribute("data-theme", theme);
349
- wrapper.style.cssText = "position:fixed;top:-10000px;left:-10000px;pointer-events:none";
350
- wrapper.appendChild(preview);
351
- document.body.append(wrapper);
352
- dragPreviewRef.current = wrapper;
353
- } else {
354
- document.body.append(preview);
355
- dragPreviewRef.current = preview;
356
- }
357
- draggingBlockRef.current = block;
358
- block.classList.add(draggingBlock);
359
- const offsetX = Math.max(12, Math.min(rect.width - 12, e.clientX - rect.left));
360
- const offsetY = Math.max(8, Math.min(rect.height - 8, e.clientY - rect.top));
361
- e.dataTransfer.setDragImage(preview, offsetX, offsetY);
362
- },
363
- [clearDragVisualState, handle.nodeKey, portalClassName, theme]
364
- );
365
- const onGripOpenChange = useCallback(
366
- (open) => {
367
- setGripMenuOpen((prev) => {
368
- if (prev === open) return prev;
369
- onMenuOpenChange(open);
370
- return open;
371
- });
372
- },
373
- [onMenuOpenChange]
374
- );
375
- const onGripMouseDownCapture = useCallback((e) => {
376
- dragStartedRef.current = false;
377
- if (e.button === 0) e.stopPropagation();
378
- }, []);
379
- const onGripClick = useCallback(
380
- (e) => {
381
- if (e.detail === 0) return;
382
- e.preventDefault();
383
- e.stopPropagation();
384
- if (dragStartedRef.current) {
385
- dragStartedRef.current = false;
386
- return;
387
- }
388
- onGripOpenChange(!gripMenuOpen);
389
- },
390
- [gripMenuOpen, onGripOpenChange]
391
- );
392
- useEffect(() => {
393
- const rootElement = editor.getRootElement();
394
- if (!rootElement) return;
395
- const unregDragOver = editor.registerCommand(
396
- DRAGOVER_COMMAND,
397
- (event) => {
398
- if (!event.dataTransfer?.types.includes(DRAG_DATA_KEY)) return false;
399
- event.preventDefault();
400
- event.dataTransfer.dropEffect = "move";
401
- const block = getDropTargetBlock(editor, rootElement, event);
402
- if (!block) {
403
- setDropLine((s) => s.visible ? { ...s, visible: false } : s);
404
- return true;
405
- }
406
- const rect = block.getBoundingClientRect();
407
- const rootRect = rootElement.getBoundingClientRect();
408
- const midY = rect.top + rect.height / 2;
409
- const y = event.clientY < midY ? rect.top : rect.bottom;
410
- setDropLine({
411
- visible: true,
412
- top: y + window.scrollY,
413
- left: rootRect.left + window.scrollX,
414
- width: rootRect.width
415
- });
416
- return true;
417
- },
418
- COMMAND_PRIORITY_HIGH
419
- );
420
- const unregDrop = editor.registerCommand(
421
- DROP_COMMAND,
422
- (event) => {
423
- const draggedKey = event.dataTransfer?.getData(DRAG_DATA_KEY);
424
- if (!draggedKey) return false;
425
- event.preventDefault();
426
- setDropLine((s) => ({ ...s, visible: false }));
427
- clearDragVisualState();
428
- const block = getDropTargetBlock(editor, rootElement, event);
429
- if (!block) return false;
430
- editor.update(() => {
431
- const draggedNode = $getNodeByKey(draggedKey);
432
- const targetNode = $getNearestNodeFromDOMNode(block);
433
- if (!draggedNode || !targetNode || draggedNode === targetNode) return;
434
- const rect = block.getBoundingClientRect();
435
- const midY = rect.top + rect.height / 2;
436
- draggedNode.remove();
437
- if (event.clientY < midY) {
438
- targetNode.insertBefore(draggedNode);
439
- } else {
440
- targetNode.insertAfter(draggedNode);
441
- }
442
- });
443
- return true;
444
- },
445
- COMMAND_PRIORITY_HIGH
446
- );
447
- const unregDragStart = editor.registerCommand(
448
- DRAGSTART_COMMAND,
449
- (event) => {
450
- if (!event.dataTransfer?.types.includes(DRAG_DATA_KEY)) return false;
451
- return true;
452
- },
453
- COMMAND_PRIORITY_HIGH
454
- );
455
- const clearDropLine = () => {
456
- setDropLine((s) => s.visible ? { ...s, visible: false } : s);
457
- };
458
- const clearDragState = () => {
459
- clearDropLine();
460
- clearDragVisualState();
461
- };
462
- const onDragLeave = (e) => {
463
- if (e.relatedTarget === null || !rootElement.contains(e.relatedTarget)) {
464
- clearDropLine();
465
- }
466
- };
467
- window.addEventListener("dragend", clearDragState);
468
- window.addEventListener("drop", clearDragState);
469
- rootElement.addEventListener("dragleave", onDragLeave);
470
- return () => {
471
- unregDragOver();
472
- unregDrop();
473
- unregDragStart();
474
- window.removeEventListener("dragend", clearDragState);
475
- window.removeEventListener("drop", clearDragState);
476
- rootElement.removeEventListener("dragleave", onDragLeave);
477
- clearDragState();
478
- };
479
- }, [clearDragVisualState, editor]);
480
- const themeWrapperProps = portalClassName ? {
481
- "className": portalClassName,
482
- "data-theme": theme,
483
- "style": { display: "contents" }
484
- } : {};
485
- return /* @__PURE__ */ jsxs("div", { ...themeWrapperProps, children: [
486
- /* @__PURE__ */ jsxs(
487
- "div",
488
- {
489
- className: `${handleContainer} ${handle.visible ? handleContainerVisible : ""}`,
490
- style: { top: handle.top, left: handle.left },
491
- onMouseEnter: onHandleEnter,
492
- onMouseLeave: onHandleLeave,
493
- children: [
494
- /* @__PURE__ */ jsx("button", { "aria-label": "Add block", className: handleBtn, onClick: handleAddBlock, children: /* @__PURE__ */ jsx(Plus, { size: 14 }) }),
495
- /* @__PURE__ */ jsxs(DropdownMenu, { open: gripMenuOpen, onOpenChange: onGripOpenChange, children: [
496
- /* @__PURE__ */ jsx(
497
- DropdownMenuTrigger,
498
- {
499
- draggable: true,
500
- "aria-label": "Block actions",
501
- className: handleBtn,
502
- onClick: onGripClick,
503
- onDragStart: onGripDragStart,
504
- onMouseDownCapture: onGripMouseDownCapture,
505
- children: /* @__PURE__ */ jsx(GripVertical, { size: 14 })
506
- }
507
- ),
508
- /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", side: "bottom", sideOffset: 4, children: [
509
- /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [
510
- /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "TURN INTO" }),
511
- TURN_INTO_ITEMS.map((item) => /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => handleTurnInto(item.key), children: [
512
- /* @__PURE__ */ jsx(item.icon, {}),
513
- item.label
514
- ] }, item.key))
515
- ] }),
516
- /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
517
- /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [
518
- /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "ACTIONS" }),
519
- /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: handleDuplicate, children: [
520
- /* @__PURE__ */ jsx(Copy, {}),
521
- "Duplicate"
522
- ] }),
523
- /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: handleMoveUp, children: [
524
- /* @__PURE__ */ jsx(ArrowUp, {}),
525
- "Move Up"
526
- ] }),
527
- /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: handleMoveDown, children: [
528
- /* @__PURE__ */ jsx(ArrowDown, {}),
529
- "Move Down"
530
- ] })
531
- ] }),
532
- /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
533
- /* @__PURE__ */ jsxs(DropdownMenuItem, { className: menuItemDestructive, onClick: handleDelete, children: [
534
- /* @__PURE__ */ jsx(Trash2, {}),
535
- "Delete"
536
- ] })
537
- ] })
538
- ] })
539
- ]
540
- }
541
- ),
542
- dropLine.visible && /* @__PURE__ */ jsx(
543
- "div",
544
- {
545
- className: dropIndicator,
546
- style: {
547
- top: dropLine.top,
548
- left: dropLine.left,
549
- width: dropLine.width
550
- }
551
- }
552
- )
553
- ] });
145
+ const { className: portalClassName, theme } = usePortalTheme();
146
+ const [handle, setHandle] = useState({
147
+ visible: false,
148
+ top: 0,
149
+ left: 0,
150
+ nodeKey: null
151
+ });
152
+ const [dropLine, setDropLine] = useState({
153
+ visible: false,
154
+ top: 0,
155
+ left: 0,
156
+ width: 0
157
+ });
158
+ const activeBlockRef = useRef(null);
159
+ const hideTimerRef = useRef(null);
160
+ const hoveringHandleRef = useRef(false);
161
+ const menuOpenCountRef = useRef(0);
162
+ const dragPreviewRef = useRef(null);
163
+ const draggingBlockRef = useRef(null);
164
+ const clearHideTimer = useCallback(() => {
165
+ if (hideTimerRef.current) {
166
+ clearTimeout(hideTimerRef.current);
167
+ hideTimerRef.current = null;
168
+ }
169
+ }, []);
170
+ const scheduleHide = useCallback(() => {
171
+ clearHideTimer();
172
+ hideTimerRef.current = setTimeout(() => {
173
+ if (!hoveringHandleRef.current && menuOpenCountRef.current === 0) {
174
+ activeBlockRef.current = null;
175
+ setHandle((s) => ({
176
+ ...s,
177
+ visible: false,
178
+ nodeKey: null
179
+ }));
180
+ }
181
+ }, HIDE_DELAY);
182
+ }, [clearHideTimer]);
183
+ const onHandleEnter = useCallback(() => {
184
+ hoveringHandleRef.current = true;
185
+ clearHideTimer();
186
+ }, [clearHideTimer]);
187
+ const onHandleLeave = useCallback(() => {
188
+ hoveringHandleRef.current = false;
189
+ scheduleHide();
190
+ }, [scheduleHide]);
191
+ const onMenuOpenChange = useCallback((open) => {
192
+ menuOpenCountRef.current += open ? 1 : -1;
193
+ if (!open) scheduleHide();
194
+ else clearHideTimer();
195
+ }, [scheduleHide, clearHideTimer]);
196
+ const updatePositionFromBlock = useCallback((block) => {
197
+ if (block !== void 0) activeBlockRef.current = block;
198
+ const el = activeBlockRef.current;
199
+ if (!el || !el.isConnected) {
200
+ activeBlockRef.current = null;
201
+ setHandle((s) => s.visible ? {
202
+ ...s,
203
+ visible: false,
204
+ nodeKey: null
205
+ } : s);
206
+ return;
207
+ }
208
+ const rootElement = editor.getRootElement();
209
+ if (!rootElement) return;
210
+ const blockRect = el.getBoundingClientRect();
211
+ const rootRect = rootElement.getBoundingClientRect();
212
+ const page = toPagePosition(blockRect);
213
+ let nodeKey = null;
214
+ editor.read(() => {
215
+ const node = $getNearestNodeFromDOMNode(el);
216
+ if (node) nodeKey = node.getKey();
217
+ });
218
+ setHandle({
219
+ visible: true,
220
+ top: page.top,
221
+ left: toPagePosition(rootRect).left - HANDLE_OFFSET,
222
+ nodeKey
223
+ });
224
+ }, [editor]);
225
+ useEffect(() => {
226
+ const rootElement = editor.getRootElement();
227
+ if (!rootElement) return;
228
+ let rafId = null;
229
+ const onMouseMove = (e) => {
230
+ if (rafId !== null) return;
231
+ rafId = requestAnimationFrame(() => {
232
+ rafId = null;
233
+ const target = e.target;
234
+ const block = getBlockElement(editor, target);
235
+ if (block) {
236
+ clearHideTimer();
237
+ updatePositionFromBlock(block);
238
+ }
239
+ });
240
+ };
241
+ const onMouseLeave = () => {
242
+ if (!hoveringHandleRef.current && menuOpenCountRef.current === 0) scheduleHide();
243
+ };
244
+ rootElement.addEventListener("mousemove", onMouseMove);
245
+ rootElement.addEventListener("mouseleave", onMouseLeave);
246
+ return () => {
247
+ if (rafId !== null) cancelAnimationFrame(rafId);
248
+ rootElement.removeEventListener("mousemove", onMouseMove);
249
+ rootElement.removeEventListener("mouseleave", onMouseLeave);
250
+ clearHideTimer();
251
+ };
252
+ }, [
253
+ editor,
254
+ clearHideTimer,
255
+ scheduleHide,
256
+ updatePositionFromBlock
257
+ ]);
258
+ useEffect(() => {
259
+ const update = () => updatePositionFromBlock();
260
+ window.addEventListener("scroll", update, true);
261
+ window.addEventListener("resize", update);
262
+ return () => {
263
+ window.removeEventListener("scroll", update, true);
264
+ window.removeEventListener("resize", update);
265
+ };
266
+ }, [updatePositionFromBlock]);
267
+ useEffect(() => editor.registerUpdateListener(() => updatePositionFromBlock()), [editor, updatePositionFromBlock]);
268
+ const handleAddBlock = useCallback(() => {
269
+ if (!handle.nodeKey) return;
270
+ editor.update(() => {
271
+ const node = $getNodeByKey(handle.nodeKey);
272
+ if (!node) return;
273
+ const p = $createParagraphNode();
274
+ node.insertAfter(p);
275
+ p.selectStart();
276
+ });
277
+ }, [editor, handle.nodeKey]);
278
+ const handleTurnInto = useCallback((type) => {
279
+ const { nodeKey } = handle;
280
+ if (!nodeKey) return;
281
+ if ([
282
+ "bullet",
283
+ "numbered",
284
+ "todo",
285
+ "divider"
286
+ ].includes(type)) {
287
+ editor.update(() => {
288
+ const node = $getNodeByKey(nodeKey);
289
+ if (!node) return;
290
+ if ($isElementNode(node)) node.selectStart();
291
+ });
292
+ const commands = {
293
+ bullet: INSERT_UNORDERED_LIST_COMMAND,
294
+ numbered: INSERT_ORDERED_LIST_COMMAND,
295
+ todo: INSERT_CHECK_LIST_COMMAND,
296
+ divider: INSERT_HORIZONTAL_RULE_COMMAND
297
+ };
298
+ editor.dispatchCommand(commands[type], void 0);
299
+ return;
300
+ }
301
+ editor.update(() => {
302
+ const node = $getNodeByKey(nodeKey);
303
+ if (!node || !$isElementNode(node)) return;
304
+ node.selectStart();
305
+ const sel = $getSelection();
306
+ if (!$isRangeSelection(sel)) return;
307
+ const create = {
308
+ paragraph: () => $createParagraphNode(),
309
+ h1: () => $createHeadingNode("h1"),
310
+ h2: () => $createHeadingNode("h2"),
311
+ h3: () => $createHeadingNode("h3"),
312
+ quote: () => $createQuoteNode(),
313
+ code: () => $createCodeNode()
314
+ }[type];
315
+ if (create) $setBlocksType(sel, create);
316
+ });
317
+ }, [editor, handle.nodeKey]);
318
+ const handleDelete = useCallback(() => {
319
+ if (!handle.nodeKey) return;
320
+ editor.update(() => {
321
+ $getNodeByKey(handle.nodeKey)?.remove();
322
+ });
323
+ setHandle((s) => ({
324
+ ...s,
325
+ visible: false,
326
+ nodeKey: null
327
+ }));
328
+ }, [editor, handle.nodeKey]);
329
+ const handleDuplicate = useCallback(() => {
330
+ if (!handle.nodeKey) return;
331
+ editor.update(() => {
332
+ const node = $getNodeByKey(handle.nodeKey);
333
+ if (!node) return;
334
+ const clone = $cloneNode(node);
335
+ node.insertAfter(clone);
336
+ });
337
+ }, [editor, handle.nodeKey]);
338
+ const handleMoveUp = useCallback(() => {
339
+ if (!handle.nodeKey) return;
340
+ editor.update(() => {
341
+ const node = $getNodeByKey(handle.nodeKey);
342
+ if (!node) return;
343
+ const prev = node.getPreviousSibling();
344
+ if (prev) {
345
+ node.remove();
346
+ prev.insertBefore(node);
347
+ }
348
+ });
349
+ }, [editor, handle.nodeKey]);
350
+ const handleMoveDown = useCallback(() => {
351
+ if (!handle.nodeKey) return;
352
+ editor.update(() => {
353
+ const node = $getNodeByKey(handle.nodeKey);
354
+ if (!node) return;
355
+ const next = node.getNextSibling();
356
+ if (next) {
357
+ node.remove();
358
+ next.insertAfter(node);
359
+ }
360
+ });
361
+ }, [editor, handle.nodeKey]);
362
+ const [gripMenuOpen, setGripMenuOpen] = useState(false);
363
+ const dragStartedRef = useRef(false);
364
+ const clearDragVisualState = useCallback(() => {
365
+ const preview = dragPreviewRef.current;
366
+ if (preview) {
367
+ preview.remove();
368
+ dragPreviewRef.current = null;
369
+ }
370
+ const draggingBlock$1 = draggingBlockRef.current;
371
+ if (draggingBlock$1) {
372
+ draggingBlock$1.classList.remove(draggingBlock);
373
+ draggingBlockRef.current = null;
374
+ }
375
+ }, []);
376
+ const onGripDragStart = useCallback((e) => {
377
+ dragStartedRef.current = true;
378
+ if (!e.dataTransfer || !handle.nodeKey) return;
379
+ e.dataTransfer.setData(DRAG_DATA_KEY, handle.nodeKey);
380
+ e.dataTransfer.effectAllowed = "move";
381
+ const block = activeBlockRef.current;
382
+ if (!block) return;
383
+ clearDragVisualState();
384
+ const rect = block.getBoundingClientRect();
385
+ const preview = block.cloneNode(true);
386
+ preview.classList.add(dragPreview);
387
+ preview.style.width = `${rect.width}px`;
388
+ if (portalClassName) {
389
+ const wrapper = document.createElement("div");
390
+ wrapper.className = portalClassName;
391
+ wrapper.setAttribute("data-theme", theme);
392
+ wrapper.style.cssText = "position:fixed;top:-10000px;left:-10000px;pointer-events:none";
393
+ wrapper.appendChild(preview);
394
+ document.body.append(wrapper);
395
+ dragPreviewRef.current = wrapper;
396
+ } else {
397
+ document.body.append(preview);
398
+ dragPreviewRef.current = preview;
399
+ }
400
+ draggingBlockRef.current = block;
401
+ block.classList.add(draggingBlock);
402
+ const offsetX = Math.max(12, Math.min(rect.width - 12, e.clientX - rect.left));
403
+ const offsetY = Math.max(8, Math.min(rect.height - 8, e.clientY - rect.top));
404
+ e.dataTransfer.setDragImage(preview, offsetX, offsetY);
405
+ }, [
406
+ clearDragVisualState,
407
+ handle.nodeKey,
408
+ portalClassName,
409
+ theme
410
+ ]);
411
+ const onGripOpenChange = useCallback((open) => {
412
+ setGripMenuOpen((prev) => {
413
+ if (prev === open) return prev;
414
+ onMenuOpenChange(open);
415
+ return open;
416
+ });
417
+ }, [onMenuOpenChange]);
418
+ const onGripMouseDownCapture = useCallback((e) => {
419
+ dragStartedRef.current = false;
420
+ if (e.button === 0) e.stopPropagation();
421
+ }, []);
422
+ const onGripClick = useCallback((e) => {
423
+ if (e.detail === 0) return;
424
+ e.preventDefault();
425
+ e.stopPropagation();
426
+ if (dragStartedRef.current) {
427
+ dragStartedRef.current = false;
428
+ return;
429
+ }
430
+ onGripOpenChange(!gripMenuOpen);
431
+ }, [gripMenuOpen, onGripOpenChange]);
432
+ useEffect(() => {
433
+ const rootElement = editor.getRootElement();
434
+ if (!rootElement) return;
435
+ const unregDragOver = editor.registerCommand(DRAGOVER_COMMAND, (event) => {
436
+ if (!event.dataTransfer?.types.includes(DRAG_DATA_KEY)) return false;
437
+ event.preventDefault();
438
+ event.dataTransfer.dropEffect = "move";
439
+ const block = getDropTargetBlock(editor, rootElement, event);
440
+ if (!block) {
441
+ setDropLine((s) => s.visible ? {
442
+ ...s,
443
+ visible: false
444
+ } : s);
445
+ return true;
446
+ }
447
+ const rect = block.getBoundingClientRect();
448
+ const rootRect = rootElement.getBoundingClientRect();
449
+ const midY = rect.top + rect.height / 2;
450
+ setDropLine({
451
+ visible: true,
452
+ top: (event.clientY < midY ? rect.top : rect.bottom) + window.scrollY,
453
+ left: rootRect.left + window.scrollX,
454
+ width: rootRect.width
455
+ });
456
+ return true;
457
+ }, COMMAND_PRIORITY_HIGH);
458
+ const unregDrop = editor.registerCommand(DROP_COMMAND, (event) => {
459
+ const draggedKey = event.dataTransfer?.getData(DRAG_DATA_KEY);
460
+ if (!draggedKey) return false;
461
+ event.preventDefault();
462
+ setDropLine((s) => ({
463
+ ...s,
464
+ visible: false
465
+ }));
466
+ clearDragVisualState();
467
+ const block = getDropTargetBlock(editor, rootElement, event);
468
+ if (!block) return false;
469
+ editor.update(() => {
470
+ const draggedNode = $getNodeByKey(draggedKey);
471
+ const targetNode = $getNearestNodeFromDOMNode(block);
472
+ if (!draggedNode || !targetNode || draggedNode === targetNode) return;
473
+ const rect = block.getBoundingClientRect();
474
+ const midY = rect.top + rect.height / 2;
475
+ draggedNode.remove();
476
+ if (event.clientY < midY) targetNode.insertBefore(draggedNode);
477
+ else targetNode.insertAfter(draggedNode);
478
+ });
479
+ return true;
480
+ }, COMMAND_PRIORITY_HIGH);
481
+ const unregDragStart = editor.registerCommand(DRAGSTART_COMMAND, (event) => {
482
+ if (!event.dataTransfer?.types.includes(DRAG_DATA_KEY)) return false;
483
+ return true;
484
+ }, COMMAND_PRIORITY_HIGH);
485
+ const clearDropLine = () => {
486
+ setDropLine((s) => s.visible ? {
487
+ ...s,
488
+ visible: false
489
+ } : s);
490
+ };
491
+ const clearDragState = () => {
492
+ clearDropLine();
493
+ clearDragVisualState();
494
+ };
495
+ const onDragLeave = (e) => {
496
+ if (e.relatedTarget === null || !rootElement.contains(e.relatedTarget)) clearDropLine();
497
+ };
498
+ window.addEventListener("dragend", clearDragState);
499
+ window.addEventListener("drop", clearDragState);
500
+ rootElement.addEventListener("dragleave", onDragLeave);
501
+ return () => {
502
+ unregDragOver();
503
+ unregDrop();
504
+ unregDragStart();
505
+ window.removeEventListener("dragend", clearDragState);
506
+ window.removeEventListener("drop", clearDragState);
507
+ rootElement.removeEventListener("dragleave", onDragLeave);
508
+ clearDragState();
509
+ };
510
+ }, [clearDragVisualState, editor]);
511
+ return /* @__PURE__ */ jsxs("div", {
512
+ ...portalClassName ? {
513
+ "className": portalClassName,
514
+ "data-theme": theme,
515
+ "style": { display: "contents" }
516
+ } : {},
517
+ children: [/* @__PURE__ */ jsxs("div", {
518
+ className: `${handleContainer} ${handle.visible ? handleContainerVisible : ""}`,
519
+ style: {
520
+ top: handle.top,
521
+ left: handle.left
522
+ },
523
+ onMouseEnter: onHandleEnter,
524
+ onMouseLeave: onHandleLeave,
525
+ children: [/* @__PURE__ */ jsx("button", {
526
+ "aria-label": "Add block",
527
+ className: handleBtn,
528
+ onClick: handleAddBlock,
529
+ children: /* @__PURE__ */ jsx(Plus, { size: 14 })
530
+ }), /* @__PURE__ */ jsxs(DropdownMenu, {
531
+ open: gripMenuOpen,
532
+ onOpenChange: onGripOpenChange,
533
+ children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
534
+ draggable: true,
535
+ "aria-label": "Block actions",
536
+ className: handleBtn,
537
+ onClick: onGripClick,
538
+ onDragStart: onGripDragStart,
539
+ onMouseDownCapture: onGripMouseDownCapture,
540
+ children: /* @__PURE__ */ jsx(GripVertical, { size: 14 })
541
+ }), /* @__PURE__ */ jsxs(DropdownMenuContent, {
542
+ align: "start",
543
+ side: "bottom",
544
+ sideOffset: 4,
545
+ children: [
546
+ /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [/* @__PURE__ */ jsx(DropdownMenuLabel, { children: "TURN INTO" }), TURN_INTO_ITEMS.map((item) => /* @__PURE__ */ jsxs(DropdownMenuItem, {
547
+ onClick: () => handleTurnInto(item.key),
548
+ children: [/* @__PURE__ */ jsx(item.icon, {}), item.label]
549
+ }, item.key))] }),
550
+ /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
551
+ /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [
552
+ /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "ACTIONS" }),
553
+ /* @__PURE__ */ jsxs(DropdownMenuItem, {
554
+ onClick: handleDuplicate,
555
+ children: [/* @__PURE__ */ jsx(Copy, {}), "Duplicate"]
556
+ }),
557
+ /* @__PURE__ */ jsxs(DropdownMenuItem, {
558
+ onClick: handleMoveUp,
559
+ children: [/* @__PURE__ */ jsx(ArrowUp, {}), "Move Up"]
560
+ }),
561
+ /* @__PURE__ */ jsxs(DropdownMenuItem, {
562
+ onClick: handleMoveDown,
563
+ children: [/* @__PURE__ */ jsx(ArrowDown, {}), "Move Down"]
564
+ })
565
+ ] }),
566
+ /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
567
+ /* @__PURE__ */ jsxs(DropdownMenuItem, {
568
+ className: menuItemDestructive,
569
+ onClick: handleDelete,
570
+ children: [/* @__PURE__ */ jsx(Trash2, {}), "Delete"]
571
+ })
572
+ ]
573
+ })]
574
+ })]
575
+ }), dropLine.visible && /* @__PURE__ */ jsx("div", {
576
+ className: "iihqkc5",
577
+ style: {
578
+ top: dropLine.top,
579
+ left: dropLine.left,
580
+ width: dropLine.width
581
+ }
582
+ })]
583
+ });
554
584
  }
555
585
  function BlockHandlePlugin() {
556
- const [editor] = useLexicalComposerContext();
557
- return createPortal(/* @__PURE__ */ jsx(BlockHandleInner, { editor }), document.body);
586
+ const [editor] = useLexicalComposerContext();
587
+ return createPortal(/* @__PURE__ */ jsx(BlockHandleInner, { editor }), document.body);
558
588
  }
559
- export {
560
- BlockHandlePlugin
561
- };
589
+ //#endregion
590
+ export { BlockHandlePlugin };
package/dist/rich-plugin-block-handle.css CHANGED
@@ -1 +1,2 @@
1
- :root{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}:root.dark{--rc-text: #fafafa;--rc-text-secondary: #a1a1aa;--rc-text-tertiary: #71717a;--rc-text-quaternary: #52525b;--rc-bg: #09090b;--rc-bg-secondary: #18181b;--rc-bg-tertiary: #27272a;--rc-fill: #2a2a2f;--rc-fill-secondary: #222226;--rc-fill-tertiary: #1b1b1f;--rc-fill-quaternary: #131316;--rc-border: #27272a;--rc-accent: #60a5fa;--rc-accent-light: #60a5fa20;--rc-link: #60a5fa;--rc-code-text: #e4e4e7;--rc-code-bg: #27272a;--rc-hr-border: #27272a;--rc-quote-border: #60a5fa;--rc-quote-bg: #1e3a5f;--rc-alert-info: #7db9e5;--rc-alert-warning: #da864a;--rc-alert-tip: #54da48;--rc-alert-caution: #e16973;--rc-alert-important: #9966e0;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.35);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.25), 0 4px 16px rgba(0,0,0,.4);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}._1bfi5uc0{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.7;--rc-line-height-tight: 1.4;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}._1bfi5uc1{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #2563eb;--rc-quote-bg: #eff6ff;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: 700px;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 4px;--rc-space-sm: 8px;--rc-space-md: 16px;--rc-space-lg: 24px;--rc-space-xl: 32px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 16px;--rc-font-size-small: 14px;--rc-line-height: 1.8;--rc-line-height-tight: 1.4;--rc-font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm: 4px;--rc-radius-md: 8px;--rc-radius-lg: 12px}._1bfi5uc2{--rc-text: #000;--rc-text-secondary: #27272a;--rc-text-tertiary: #71717a;--rc-text-quaternary: #a1a1aa;--rc-bg: #ffffff;--rc-bg-secondary: #fafafa;--rc-bg-tertiary: #f4f4f5;--rc-fill: #e8e8ec;--rc-fill-secondary: #eeeeef;--rc-fill-tertiary: #f4f4f6;--rc-fill-quaternary: #f9f9fa;--rc-border: #f4f4f5;--rc-accent: #2563eb;--rc-accent-light: #2563eb20;--rc-link: #2563eb;--rc-code-text: #3f3f46;--rc-code-bg: #f4f4f5;--rc-hr-border: #e4e4e7;--rc-quote-border: #a1a1aa;--rc-quote-bg: #fafafa;--rc-alert-info: #006bb7;--rc-alert-warning: #cc5500;--rc-alert-tip: #11cc00;--rc-alert-caution: #cc0011;--rc-alert-important: #5500cc;--rc-max-width: none;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .12), 0 2px 8px rgba(0, 0, 0, .06);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.08);--rc-space-xs: 2px;--rc-space-sm: 4px;--rc-space-md: 10px;--rc-space-lg: 16px;--rc-space-xl: 20px;--rc-font-family-sans: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono: "SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs: .625em;--rc-font-size-xs: .75em;--rc-font-size-sm: .8125em;--rc-font-size-md: .875em;--rc-font-size-lg: 1.25em;--rc-font-size-base: 14px;--rc-font-size-small: 12px;--rc-line-height: 1.5;--rc-line-height-tight: 1.3;--rc-font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm: 3px;--rc-radius-md: 6px;--rc-radius-lg: 12px}.dark ._1bfi5uc0,[data-theme=dark] ._1bfi5uc0,.dark._1bfi5uc0,[data-theme=dark]._1bfi5uc0,.dark ._1bfi5uc1,[data-theme=dark] ._1bfi5uc1,.dark._1bfi5uc1,[data-theme=dark]._1bfi5uc1,.dark ._1bfi5uc2,[data-theme=dark] ._1bfi5uc2,.dark._1bfi5uc2,[data-theme=dark]._1bfi5uc2{--rc-text: #fafafa;--rc-text-secondary: #a1a1aa;--rc-text-tertiary: #71717a;--rc-text-quaternary: #52525b;--rc-bg: #09090b;--rc-bg-secondary: #18181b;--rc-bg-tertiary: #27272a;--rc-fill: #2a2a2f;--rc-fill-secondary: #222226;--rc-fill-tertiary: #1b1b1f;--rc-fill-quaternary: #131316;--rc-border: #27272a;--rc-accent: #60a5fa;--rc-accent-light: #60a5fa20;--rc-link: #60a5fa;--rc-code-text: #e4e4e7;--rc-code-bg: #27272a;--rc-hr-border: #27272a;--rc-quote-border: #60a5fa;--rc-quote-bg: #1e3a5f;--rc-alert-info: #7db9e5;--rc-alert-warning: #da864a;--rc-alert-tip: #54da48;--rc-alert-caution: #e16973;--rc-alert-important: #9966e0;--rc-shadow-top-bar: 0 8px 30px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .3);--rc-shadow-modal: 0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -4px rgba(0,0,0,.35);--rc-shadow-menu: 0 1px 4px rgba(0,0,0,.25), 0 4px 16px rgba(0,0,0,.4)}.iihqkc0{display:flex;align-items:center;gap:1px;position:absolute;z-index:30;opacity:0;pointer-events:none;transition:opacity .15s}.iihqkc1{opacity:1;pointer-events:auto}.iihqkc2{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;border:none;background:transparent;color:color-mix(in srgb,var(--rc-text) 35%,transparent);cursor:pointer;padding:0;transition:background-color .15s,color .15s}.iihqkc2:hover{background:color-mix(in srgb,var(--rc-text) 8%,transparent);color:color-mix(in srgb,var(--rc-text) 70%,transparent)}.iihqkc3{opacity:.35}.iihqkc4{position:fixed;top:-10000px;left:-10000px;z-index:40;pointer-events:none;margin:0;box-sizing:border-box;opacity:.9;background-color:var(--rc-bg);border:1px solid var(--rc-border);border-radius:var(--rc-radius-sm);box-shadow:var(--rc-shadow-top-bar)}.iihqkc5{position:absolute;height:2px;background:var(--rc-accent);border-radius:1px;z-index:30;pointer-events:none}.iihqkc6{color:var(--rc-alert-caution)}.iihqkc6[data-highlighted]{color:var(--rc-alert-caution);background-color:color-mix(in srgb,var(--rc-alert-caution) 8%,transparent)}.iihqkc6 svg{color:var(--rc-alert-caution)}.iihqkc6[data-highlighted] svg{color:var(--rc-alert-caution)}
1
+ :root{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}:root.dark{--rc-text:#fafafa;--rc-text-secondary:#a1a1aa;--rc-text-tertiary:#71717a;--rc-text-quaternary:#52525b;--rc-bg:#09090b;--rc-bg-secondary:#18181b;--rc-bg-tertiary:#27272a;--rc-fill:#2a2a2f;--rc-fill-secondary:#222226;--rc-fill-tertiary:#1b1b1f;--rc-fill-quaternary:#131316;--rc-border:#27272a;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#e4e4e7;--rc-code-bg:#27272a;--rc-hr-border:#27272a;--rc-quote-border:#60a5fa;--rc-quote-bg:#1e3a5f;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}._1bfi5uc0{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}._1bfi5uc1{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#2563eb;--rc-quote-bg:#eff6ff;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.8;--rc-line-height-tight:1.4;--rc-font-family:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}._1bfi5uc2{--rc-text:#000;--rc-text-secondary:#27272a;--rc-text-tertiary:#71717a;--rc-text-quaternary:#a1a1aa;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f4f4f5;--rc-fill:#e8e8ec;--rc-fill-secondary:#eeeeef;--rc-fill-tertiary:#f4f4f6;--rc-fill-quaternary:#f9f9fa;--rc-border:#f4f4f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#3f3f46;--rc-code-bg:#f4f4f5;--rc-hr-border:#e4e4e7;--rc-quote-border:#a1a1aa;--rc-quote-bg:#fafafa;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:none;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:2px;--rc-space-sm:4px;--rc-space-md:10px;--rc-space-lg:16px;--rc-space-xl:20px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:14px;--rc-font-size-small:12px;--rc-line-height:1.5;--rc-line-height-tight:1.3;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:3px;--rc-radius-md:6px;--rc-radius-lg:12px}.dark ._1bfi5uc0,[data-theme=dark] ._1bfi5uc0,.dark._1bfi5uc0,[data-theme=dark]._1bfi5uc0,.dark ._1bfi5uc1,[data-theme=dark] ._1bfi5uc1,.dark._1bfi5uc1,[data-theme=dark]._1bfi5uc1,.dark ._1bfi5uc2,[data-theme=dark] ._1bfi5uc2,.dark._1bfi5uc2,[data-theme=dark]._1bfi5uc2{--rc-text:#fafafa;--rc-text-secondary:#a1a1aa;--rc-text-tertiary:#71717a;--rc-text-quaternary:#52525b;--rc-bg:#09090b;--rc-bg-secondary:#18181b;--rc-bg-tertiary:#27272a;--rc-fill:#2a2a2f;--rc-fill-secondary:#222226;--rc-fill-tertiary:#1b1b1f;--rc-fill-quaternary:#131316;--rc-border:#27272a;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#e4e4e7;--rc-code-bg:#27272a;--rc-hr-border:#27272a;--rc-quote-border:#60a5fa;--rc-quote-bg:#1e3a5f;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006}.iihqkc0{z-index:30;opacity:0;pointer-events:none;align-items:center;gap:1px;transition:opacity .15s;display:flex;position:absolute}.iihqkc1{opacity:1;pointer-events:auto}.iihqkc2{width:24px;height:24px;color:color-mix(in srgb, var(--rc-text) 35%, transparent);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s;display:flex}.iihqkc2:hover{background:color-mix(in srgb, var(--rc-text) 8%, transparent);color:color-mix(in srgb, var(--rc-text) 70%, transparent)}.iihqkc3{opacity:.35}.iihqkc4{z-index:40;pointer-events:none;box-sizing:border-box;opacity:.9;background-color:var(--rc-bg);border:1px solid var(--rc-border);border-radius:var(--rc-radius-sm);box-shadow:var(--rc-shadow-top-bar);margin:0;position:fixed;top:-10000px;left:-10000px}.iihqkc5{background:var(--rc-accent);z-index:30;pointer-events:none;border-radius:1px;height:2px;position:absolute}.iihqkc6{color:var(--rc-alert-caution)}.iihqkc6[data-highlighted]{color:var(--rc-alert-caution);background-color:color-mix(in srgb, var(--rc-alert-caution) 8%, transparent)}.iihqkc6 svg,.iihqkc6[data-highlighted] svg{color:var(--rc-alert-caution)}
2
+ /*$vite$:1*/
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@haklex/rich-plugin-block-handle",
3
- "version": "0.0.79",
3
+ "version": "0.0.81",
4
4
  "description": "Block handle plugin with add button and context menu",
5
5
  "repository": {
6
6
  "type": "git",
@@ -22,8 +22,8 @@
22
22
  ],
23
23
  "dependencies": {
24
24
  "@lexical/code": "npm:lexical-code-no-prism@0.41.0",
25
- "@haklex/rich-editor-ui": "0.0.79",
26
- "@haklex/rich-style-token": "0.0.79"
25
+ "@haklex/rich-editor-ui": "0.0.81",
26
+ "@haklex/rich-style-token": "0.0.81"
27
27
  },
28
28
  "devDependencies": {
29
29
  "@lexical/list": "^0.41.0",