neuphlo-editor 2.4.3 → 2.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/LICENSE +21 -0
  2. package/dist/highlight.css +83 -1
  3. package/dist/react/index.cjs +224 -162
  4. package/dist/react/index.cjs.map +1 -1
  5. package/dist/react/index.css +50 -2
  6. package/dist/react/index.css.map +1 -1
  7. package/dist/react/index.d.cts +11 -2
  8. package/dist/react/index.d.ts +11 -2
  9. package/dist/react/index.js +79 -14
  10. package/dist/react/index.js.map +1 -1
  11. package/dist/styles.css +52 -2
  12. package/package.json +9 -11
  13. package/dist/chunk-2DWEJI45.js +0 -1296
  14. package/dist/chunk-2DWEJI45.js.map +0 -1
  15. package/dist/chunk-3CLWAYRP.js +0 -1387
  16. package/dist/chunk-3CLWAYRP.js.map +0 -1
  17. package/dist/chunk-457ETWB6.js +0 -1351
  18. package/dist/chunk-457ETWB6.js.map +0 -1
  19. package/dist/chunk-4L7FHW5M.js +0 -1388
  20. package/dist/chunk-4L7FHW5M.js.map +0 -1
  21. package/dist/chunk-4MV3UUZN.js +0 -1073
  22. package/dist/chunk-4MV3UUZN.js.map +0 -1
  23. package/dist/chunk-62DYB7FY.js +0 -1305
  24. package/dist/chunk-62DYB7FY.js.map +0 -1
  25. package/dist/chunk-BVFTQKY7.js +0 -1387
  26. package/dist/chunk-BVFTQKY7.js.map +0 -1
  27. package/dist/chunk-DWGPGRTQ.js +0 -1302
  28. package/dist/chunk-DWGPGRTQ.js.map +0 -1
  29. package/dist/chunk-EG7NQJRA.js +0 -1324
  30. package/dist/chunk-EG7NQJRA.js.map +0 -1
  31. package/dist/chunk-FLLPFFI5.js +0 -1296
  32. package/dist/chunk-FLLPFFI5.js.map +0 -1
  33. package/dist/chunk-FVQHB6VC.js +0 -1128
  34. package/dist/chunk-FVQHB6VC.js.map +0 -1
  35. package/dist/chunk-G5E32MLB.js +0 -1352
  36. package/dist/chunk-G5E32MLB.js.map +0 -1
  37. package/dist/chunk-GXJGZHKR.js +0 -1326
  38. package/dist/chunk-GXJGZHKR.js.map +0 -1
  39. package/dist/chunk-KCPPTLGY.js +0 -1299
  40. package/dist/chunk-KCPPTLGY.js.map +0 -1
  41. package/dist/chunk-LHG2NX6C.js +0 -1123
  42. package/dist/chunk-LHG2NX6C.js.map +0 -1
  43. package/dist/chunk-MSNTVITF.js +0 -1352
  44. package/dist/chunk-MSNTVITF.js.map +0 -1
  45. package/dist/chunk-N4RDYJ5Z.js +0 -1351
  46. package/dist/chunk-N4RDYJ5Z.js.map +0 -1
  47. package/dist/chunk-OCNM37WJ.js +0 -1289
  48. package/dist/chunk-OCNM37WJ.js.map +0 -1
  49. package/dist/chunk-P3YFYEUB.js +0 -1351
  50. package/dist/chunk-P3YFYEUB.js.map +0 -1
  51. package/dist/chunk-RW6QBMJB.js +0 -1300
  52. package/dist/chunk-RW6QBMJB.js.map +0 -1
  53. package/dist/chunk-SJQQVB3M.js +0 -1353
  54. package/dist/chunk-SJQQVB3M.js.map +0 -1
  55. package/dist/chunk-SOXTEP7H.js +0 -6705
  56. package/dist/chunk-SOXTEP7H.js.map +0 -1
  57. package/dist/chunk-VPI26I4P.js +0 -1350
  58. package/dist/chunk-VPI26I4P.js.map +0 -1
@@ -1,1289 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all2) => {
6
- for (var name in all2)
7
- __defProp(target, name, { get: all2[name], enumerable: true });
8
- };
9
- var __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from === "object" || typeof from === "function") {
11
- for (let key of __getOwnPropNames(from))
12
- if (!__hasOwnProp.call(to, key) && key !== except)
13
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
14
- }
15
- return to;
16
- };
17
- var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
18
-
19
- // src/headless/index.ts
20
- import { useCurrentEditor as useCurrentEditor4 } from "@tiptap/react";
21
-
22
- // src/headless/components/editor.tsx
23
- import { EditorProvider } from "@tiptap/react";
24
- import { forwardRef } from "react";
25
- import { Provider } from "jotai";
26
-
27
- // src/headless/utils/store.ts
28
- var store_exports = {};
29
- __export(store_exports, {
30
- novelStore: () => novelStore
31
- });
32
- __reExport(store_exports, jotai_star);
33
- import { createStore } from "jotai";
34
- import * as jotai_star from "jotai";
35
- var novelStore = createStore();
36
-
37
- // src/headless/components/editor.tsx
38
- import { jsx } from "react/jsx-runtime";
39
- var EditorRoot = ({ children }) => {
40
- return /* @__PURE__ */ jsx(Provider, { store: novelStore, children });
41
- };
42
- var EditorContent = forwardRef(
43
- ({ className, children, initialContent, content, ...rest }, ref) => {
44
- const effectiveContent = content ?? initialContent;
45
- return /* @__PURE__ */ jsx("div", { ref, className, children: /* @__PURE__ */ jsx(EditorProvider, { ...rest, content: effectiveContent, children }) });
46
- }
47
- );
48
- EditorContent.displayName = "EditorContent";
49
-
50
- // src/headless/components/editor-bubble.tsx
51
- import { useCurrentEditor } from "@tiptap/react";
52
- import { BubbleMenu as BubbleMenuReact } from "@tiptap/react/menus";
53
- import { jsx as jsx2 } from "react/jsx-runtime";
54
- function EditorBubble({ className, children, ...rest }) {
55
- const { editor } = useCurrentEditor();
56
- if (!editor) return null;
57
- return /* @__PURE__ */ jsx2(BubbleMenuReact, { editor, ...rest, children: /* @__PURE__ */ jsx2("div", { className, children }) });
58
- }
59
-
60
- // src/headless/components/editor-bubble-item.tsx
61
- import { forwardRef as forwardRef2, isValidElement, cloneElement } from "react";
62
- import { useCurrentEditor as useCurrentEditor2 } from "@tiptap/react";
63
- import { jsx as jsx3 } from "react/jsx-runtime";
64
- var EditorBubbleItem = forwardRef2(({ children, asChild, onSelect, ...rest }, ref) => {
65
- const { editor } = useCurrentEditor2();
66
- if (!editor) return null;
67
- const handleClick = (e) => {
68
- e.preventDefault();
69
- onSelect?.(editor);
70
- };
71
- if (asChild && isValidElement(children)) {
72
- const child = children;
73
- const childOnClick = child.props?.onClick;
74
- const mergedOnClick = (e) => {
75
- childOnClick?.(e);
76
- if (!e?.defaultPrevented) onSelect?.(editor);
77
- };
78
- return cloneElement(child, {
79
- ...rest,
80
- ref: child.ref ?? ref,
81
- onClick: mergedOnClick
82
- });
83
- }
84
- return /* @__PURE__ */ jsx3("div", { ref, ...rest, onClick: handleClick, children });
85
- });
86
- EditorBubbleItem.displayName = "EditorBubbleItem";
87
-
88
- // src/headless/components/editor-command.tsx
89
- import { useAtomValue } from "jotai";
90
- import { forwardRef as forwardRef3, useRef, useEffect, useLayoutEffect } from "react";
91
- import { createPortal } from "react-dom";
92
-
93
- // src/headless/utils/atoms.ts
94
- import { atom } from "jotai";
95
- var queryAtom = atom("");
96
- var rangeAtom = atom(null);
97
- var slashMenuOpenAtom = atom(false);
98
- var slashMenuRectAtom = atom(null);
99
-
100
- // src/headless/components/editor-command.tsx
101
- import { jsx as jsx4 } from "react/jsx-runtime";
102
- var EditorCommandOut = () => null;
103
- var EditorCommand = forwardRef3(
104
- ({ children, className, ...rest }, ref) => {
105
- const isOpen = useAtomValue(slashMenuOpenAtom, { store: novelStore });
106
- const rect = useAtomValue(slashMenuRectAtom, { store: novelStore });
107
- const containerRef = useRef(null);
108
- if (typeof document !== "undefined" && !containerRef.current) {
109
- const el = document.createElement("div");
110
- el.style.position = "fixed";
111
- el.style.zIndex = "9999";
112
- el.style.minWidth = "240px";
113
- el.style.display = "none";
114
- containerRef.current = el;
115
- }
116
- useEffect(() => {
117
- const el = containerRef.current;
118
- if (!el) return;
119
- document.body.appendChild(el);
120
- return () => {
121
- el.remove();
122
- };
123
- }, []);
124
- useLayoutEffect(() => {
125
- const container = containerRef.current;
126
- if (!container) return;
127
- if (!isOpen || !rect) {
128
- container.style.display = "none";
129
- return;
130
- }
131
- container.style.display = "";
132
- const menuHeight = container.offsetHeight || 360;
133
- const viewportHeight = window.innerHeight;
134
- const spaceBelow = viewportHeight - rect.bottom;
135
- const spaceAbove = rect.top;
136
- let top;
137
- if (spaceBelow < menuHeight + 16 && spaceAbove > spaceBelow) {
138
- top = Math.round(rect.top - menuHeight - 8);
139
- if (top < 8) top = 8;
140
- } else {
141
- top = Math.round(rect.bottom + 8);
142
- }
143
- let left = Math.round(rect.left);
144
- const menuWidth = container.offsetWidth || 280;
145
- if (left + menuWidth > window.innerWidth - 8) {
146
- left = window.innerWidth - menuWidth - 8;
147
- }
148
- if (left < 8) left = 8;
149
- container.style.top = `${top}px`;
150
- container.style.left = `${left}px`;
151
- }, [isOpen, rect]);
152
- if (!isOpen || !containerRef.current) return null;
153
- return createPortal(
154
- /* @__PURE__ */ jsx4(
155
- "div",
156
- {
157
- ref,
158
- id: "slash-command",
159
- className,
160
- onKeyDown: (e) => {
161
- e.stopPropagation();
162
- },
163
- ...rest,
164
- children
165
- }
166
- ),
167
- containerRef.current
168
- );
169
- }
170
- );
171
- var EditorCommandList = forwardRef3(
172
- ({ children, ...rest }, ref) => {
173
- const query = useAtomValue(queryAtom, { store: novelStore });
174
- return /* @__PURE__ */ jsx4("div", { ref, role: "listbox", ...rest, "data-query": query, children });
175
- }
176
- );
177
- EditorCommand.displayName = "EditorCommand";
178
- EditorCommandList.displayName = "EditorCommandList";
179
-
180
- // src/headless/components/editor-command-item.tsx
181
- import { forwardRef as forwardRef4 } from "react";
182
- import { CommandEmpty, CommandItem } from "cmdk";
183
- import { useCurrentEditor as useCurrentEditor3 } from "@tiptap/react";
184
- import { useAtomValue as useAtomValue2 } from "jotai";
185
- import { jsx as jsx5 } from "react/jsx-runtime";
186
- var CommandItemAny = CommandItem;
187
- var CommandEmptyAny = CommandEmpty;
188
- var EditorCommandItem = forwardRef4(({ children, onCommand, ...rest }, ref) => {
189
- const { editor } = useCurrentEditor3();
190
- const range = useAtomValue2(rangeAtom);
191
- if (!editor || !range) return null;
192
- return /* @__PURE__ */ jsx5(
193
- CommandItemAny,
194
- {
195
- ref,
196
- ...rest,
197
- onSelect: () => onCommand({ editor, range }),
198
- children
199
- }
200
- );
201
- });
202
- EditorCommandItem.displayName = "EditorCommandItem";
203
- var EditorCommandEmpty = CommandEmptyAny;
204
-
205
- // src/headless/extensions/index.ts
206
- import { StarterKit } from "@tiptap/starter-kit";
207
- import { Placeholder } from "@tiptap/extension-placeholder";
208
-
209
- // src/headless/extensions/CodeBlock/CodeBlock.ts
210
- import { CodeBlockLowlight } from "@tiptap/extension-code-block-lowlight";
211
- import { all, createLowlight } from "lowlight";
212
- var lowlight = createLowlight(all);
213
- var CodeBlock = CodeBlockLowlight.configure({
214
- lowlight
215
- });
216
-
217
- // src/headless/extensions/Link/Link.ts
218
- import { mergeAttributes } from "@tiptap/core";
219
- import TiptapLink from "@tiptap/extension-link";
220
- import { Plugin } from "@tiptap/pm/state";
221
- var Link = TiptapLink.extend({
222
- inclusive: false,
223
- parseHTML() {
224
- return [
225
- {
226
- tag: 'a[href]:not([data-type="button"]):not([href *= "javascript:" i])'
227
- }
228
- ];
229
- },
230
- renderHTML({ HTMLAttributes }) {
231
- return [
232
- "a",
233
- mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, {
234
- class: "link"
235
- }),
236
- 0
237
- ];
238
- },
239
- addProseMirrorPlugins() {
240
- const { editor } = this;
241
- return [
242
- ...this.parent?.() || [],
243
- new Plugin({
244
- props: {
245
- handleKeyDown: (view, event) => {
246
- const { selection } = editor.state;
247
- if (event.key === "Escape" && selection.empty !== true) {
248
- editor.commands.focus(selection.to, { scrollIntoView: false });
249
- }
250
- return false;
251
- }
252
- }
253
- })
254
- ];
255
- }
256
- }).configure({
257
- openOnClick: false,
258
- autolink: true,
259
- enableClickSelection: true
260
- });
261
-
262
- // src/headless/extensions/ImageBlock/ImageBlock.ts
263
- import { mergeAttributes as mergeAttributes2 } from "@tiptap/core";
264
- import { Image as TiptapImage } from "@tiptap/extension-image";
265
- import { ReactNodeViewRenderer } from "@tiptap/react";
266
- import { Plugin as Plugin2, PluginKey } from "@tiptap/pm/state";
267
- var ImageBlock = TiptapImage.extend({
268
- name: "imageBlock",
269
- group: "block",
270
- defining: true,
271
- isolating: true,
272
- addOptions() {
273
- return {
274
- ...this.parent?.(),
275
- uploadImage: void 0,
276
- inline: false
277
- };
278
- },
279
- addAttributes() {
280
- return {
281
- src: {
282
- default: "",
283
- parseHTML: (element) => element.getAttribute("src"),
284
- renderHTML: (attributes) => ({
285
- src: attributes.src
286
- })
287
- },
288
- width: {
289
- default: "100%",
290
- parseHTML: (element) => element.getAttribute("data-width"),
291
- renderHTML: (attributes) => ({
292
- "data-width": attributes.width
293
- })
294
- },
295
- align: {
296
- default: "center",
297
- parseHTML: (element) => element.getAttribute("data-align"),
298
- renderHTML: (attributes) => ({
299
- "data-align": attributes.align
300
- })
301
- },
302
- alt: {
303
- default: void 0,
304
- parseHTML: (element) => element.getAttribute("alt"),
305
- renderHTML: (attributes) => ({
306
- alt: attributes.alt
307
- })
308
- },
309
- loading: {
310
- default: false,
311
- parseHTML: () => false,
312
- renderHTML: () => ({})
313
- }
314
- };
315
- },
316
- parseHTML() {
317
- return [
318
- {
319
- tag: 'img[src]:not([src^="data:"])',
320
- getAttrs: (element) => {
321
- const el = element;
322
- return {
323
- src: el.getAttribute("src"),
324
- alt: el.getAttribute("alt"),
325
- width: el.getAttribute("data-width") || "100%",
326
- align: el.getAttribute("data-align") || "center"
327
- };
328
- }
329
- }
330
- ];
331
- },
332
- renderHTML({ HTMLAttributes }) {
333
- return ["img", mergeAttributes2(HTMLAttributes)];
334
- },
335
- addCommands() {
336
- return {
337
- setImageBlock: (attrs) => ({ commands }) => {
338
- return commands.insertContent({
339
- type: "imageBlock",
340
- attrs: { src: attrs.src }
341
- });
342
- },
343
- setImageBlockAt: (attrs) => ({ commands }) => {
344
- return commands.insertContentAt(attrs.pos, {
345
- type: "imageBlock",
346
- attrs: { src: attrs.src }
347
- });
348
- },
349
- setImageBlockAlign: (align) => ({ commands }) => commands.updateAttributes("imageBlock", { align }),
350
- setImageBlockWidth: (width) => ({ commands }) => commands.updateAttributes("imageBlock", {
351
- width: `${Math.max(0, Math.min(100, width))}%`
352
- })
353
- };
354
- },
355
- addNodeView() {
356
- if (this.options.nodeView) {
357
- return ReactNodeViewRenderer(this.options.nodeView);
358
- }
359
- return null;
360
- },
361
- addProseMirrorPlugins() {
362
- return [
363
- new Plugin2({
364
- key: new PluginKey("imageBlockDrop"),
365
- props: {
366
- handleDOMEvents: {
367
- drop: (view, event) => {
368
- const hasFiles = event.dataTransfer && event.dataTransfer.files && event.dataTransfer.files.length;
369
- if (!hasFiles) {
370
- return false;
371
- }
372
- const images = Array.from(event.dataTransfer.files).filter(
373
- (file) => /image/i.test(file.type)
374
- );
375
- if (images.length === 0) {
376
- return false;
377
- }
378
- event.preventDefault();
379
- const { schema } = view.state;
380
- const coordinates = view.posAtCoords({
381
- left: event.clientX,
382
- top: event.clientY
383
- });
384
- if (!coordinates) return false;
385
- images.forEach(async (image) => {
386
- if (this.options.uploadImage) {
387
- try {
388
- const placeholderNode = schema.nodes.imageBlock.create({
389
- src: "",
390
- loading: true
391
- });
392
- const placeholderTr = view.state.tr.insert(
393
- coordinates.pos,
394
- placeholderNode
395
- );
396
- view.dispatch(placeholderTr);
397
- const url = await this.options.uploadImage(image);
398
- const node = schema.nodes.imageBlock.create({ src: url });
399
- const currentState = view.state;
400
- let foundPos = -1;
401
- currentState.doc.descendants((node2, pos) => {
402
- if (node2.type.name === "imageBlock" && node2.attrs.loading) {
403
- foundPos = pos;
404
- return false;
405
- }
406
- });
407
- if (foundPos !== -1) {
408
- const transaction = view.state.tr.replaceWith(
409
- foundPos,
410
- foundPos + 1,
411
- node
412
- );
413
- view.dispatch(transaction);
414
- }
415
- } catch (error) {
416
- console.error("Failed to upload image:", error);
417
- const currentState = view.state;
418
- let foundPos = -1;
419
- currentState.doc.descendants((node, pos) => {
420
- if (node.type.name === "imageBlock" && node.attrs.loading) {
421
- foundPos = pos;
422
- return false;
423
- }
424
- });
425
- if (foundPos !== -1) {
426
- const transaction = view.state.tr.delete(
427
- foundPos,
428
- foundPos + 1
429
- );
430
- view.dispatch(transaction);
431
- }
432
- }
433
- }
434
- });
435
- return true;
436
- },
437
- paste: (view, event) => {
438
- const hasFiles = event.clipboardData && event.clipboardData.files && event.clipboardData.files.length;
439
- if (!hasFiles) {
440
- return false;
441
- }
442
- const images = Array.from(event.clipboardData.files).filter(
443
- (file) => /image/i.test(file.type)
444
- );
445
- if (images.length === 0) {
446
- return false;
447
- }
448
- event.preventDefault();
449
- images.forEach(async (image) => {
450
- if (this.options.uploadImage) {
451
- try {
452
- const placeholderNode = view.state.schema.nodes.imageBlock.create({
453
- src: "",
454
- loading: true
455
- });
456
- view.dispatch(
457
- view.state.tr.replaceSelectionWith(placeholderNode)
458
- );
459
- const url = await this.options.uploadImage(image);
460
- const node = view.state.schema.nodes.imageBlock.create({
461
- src: url
462
- });
463
- const currentState = view.state;
464
- let foundPos = -1;
465
- currentState.doc.descendants((node2, pos) => {
466
- if (node2.type.name === "imageBlock" && node2.attrs.loading) {
467
- foundPos = pos;
468
- return false;
469
- }
470
- });
471
- if (foundPos !== -1) {
472
- const transaction = view.state.tr.replaceWith(
473
- foundPos,
474
- foundPos + 1,
475
- node
476
- );
477
- view.dispatch(transaction);
478
- }
479
- } catch (error) {
480
- console.error("Failed to upload image:", error);
481
- const currentState = view.state;
482
- let foundPos = -1;
483
- currentState.doc.descendants((node, pos) => {
484
- if (node.type.name === "imageBlock" && node.attrs.loading) {
485
- foundPos = pos;
486
- return false;
487
- }
488
- });
489
- if (foundPos !== -1) {
490
- const transaction = view.state.tr.delete(
491
- foundPos,
492
- foundPos + 1
493
- );
494
- view.dispatch(transaction);
495
- }
496
- }
497
- }
498
- });
499
- return true;
500
- }
501
- }
502
- }
503
- })
504
- ];
505
- }
506
- });
507
-
508
- // src/headless/extensions/Mention/mention.tsx
509
- import { ReactRenderer, ReactNodeViewRenderer as ReactNodeViewRenderer2 } from "@tiptap/react";
510
- import Mention from "@tiptap/extension-mention";
511
-
512
- // src/headless/extensions/Mention/mention-command.tsx
513
- import { forwardRef as forwardRef5, useEffect as useEffect2, useImperativeHandle, useState } from "react";
514
- import { jsx as jsx6, jsxs } from "react/jsx-runtime";
515
- function Avatar({ src, fallback }) {
516
- return /* @__PURE__ */ jsx6("div", { style: {
517
- position: "relative",
518
- display: "flex",
519
- height: "24px",
520
- width: "24px",
521
- flexShrink: 0,
522
- overflow: "hidden",
523
- borderRadius: "9999px"
524
- }, children: src ? /* @__PURE__ */ jsx6(
525
- "img",
526
- {
527
- style: {
528
- aspectRatio: "1",
529
- height: "100%",
530
- width: "100%"
531
- },
532
- src,
533
- alt: fallback
534
- }
535
- ) : /* @__PURE__ */ jsx6("div", { style: {
536
- display: "flex",
537
- height: "100%",
538
- width: "100%",
539
- alignItems: "center",
540
- justifyContent: "center",
541
- borderRadius: "9999px",
542
- backgroundColor: "var(--muted)",
543
- color: "var(--muted-foreground)",
544
- fontSize: "10px",
545
- fontWeight: 600
546
- }, children: fallback }) });
547
- }
548
- function ReferenceIcon({ type }) {
549
- if (type === "node") {
550
- return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: { flexShrink: 0 }, children: [
551
- /* @__PURE__ */ jsx6("path", { d: "M12 3l8 4.5v9l-8 4.5l-8-4.5v-9l8-4.5" }),
552
- /* @__PURE__ */ jsx6("path", { d: "M12 12l8-4.5" }),
553
- /* @__PURE__ */ jsx6("path", { d: "M12 12v9" }),
554
- /* @__PURE__ */ jsx6("path", { d: "M12 12l-8-4.5" })
555
- ] });
556
- }
557
- return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: { flexShrink: 0 }, children: [
558
- /* @__PURE__ */ jsx6("path", { d: "M14 3v4a1 1 0 0 0 1 1h4" }),
559
- /* @__PURE__ */ jsx6("path", { d: "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" }),
560
- /* @__PURE__ */ jsx6("path", { d: "M9 9l1 0" }),
561
- /* @__PURE__ */ jsx6("path", { d: "M9 13l6 0" }),
562
- /* @__PURE__ */ jsx6("path", { d: "M9 17l6 0" })
563
- ] });
564
- }
565
- var MentionCommand = forwardRef5((props, ref) => {
566
- const [selectedIndex, setSelectedIndex] = useState(0);
567
- const selectItem = (index) => {
568
- const item = props.items[index];
569
- if (item) {
570
- props.command(item);
571
- }
572
- };
573
- const upHandler = () => {
574
- setSelectedIndex((selectedIndex + props.items.length - 1) % props.items.length);
575
- };
576
- const downHandler = () => {
577
- setSelectedIndex((selectedIndex + 1) % props.items.length);
578
- };
579
- const enterHandler = () => {
580
- selectItem(selectedIndex);
581
- };
582
- useEffect2(() => setSelectedIndex(0), [props.items]);
583
- useImperativeHandle(ref, () => ({
584
- onKeyDown: ({ event }) => {
585
- if (event.key === "ArrowUp") {
586
- upHandler();
587
- return true;
588
- }
589
- if (event.key === "ArrowDown") {
590
- downHandler();
591
- return true;
592
- }
593
- if (event.key === "Enter") {
594
- enterHandler();
595
- return true;
596
- }
597
- return false;
598
- }
599
- }));
600
- return /* @__PURE__ */ jsx6(
601
- "div",
602
- {
603
- id: "mention-list",
604
- style: {
605
- backgroundColor: "var(--popover)",
606
- color: "var(--foreground)",
607
- maxHeight: "300px",
608
- minWidth: "280px",
609
- overflow: "hidden",
610
- overflowY: "auto",
611
- borderRadius: "12px",
612
- border: "1px solid var(--border)",
613
- padding: "4px",
614
- boxShadow: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)"
615
- },
616
- children: props.items.length ? props.items.map((item, index) => /* @__PURE__ */ jsxs(
617
- "button",
618
- {
619
- type: "button",
620
- onClick: () => selectItem(index),
621
- onMouseEnter: () => setSelectedIndex(index),
622
- style: {
623
- position: "relative",
624
- display: "flex",
625
- width: "100%",
626
- cursor: "default",
627
- userSelect: "none",
628
- alignItems: "center",
629
- gap: "8px",
630
- borderRadius: "4px",
631
- padding: "10px 8px",
632
- fontSize: "14px",
633
- outline: "none",
634
- backgroundColor: index === selectedIndex ? "var(--accent)" : "transparent",
635
- color: index === selectedIndex ? "var(--accent-foreground)" : "inherit",
636
- border: "none",
637
- textAlign: "left"
638
- },
639
- children: [
640
- item.type ? /* @__PURE__ */ jsx6(ReferenceIcon, { type: item.type }) : /* @__PURE__ */ jsx6(
641
- Avatar,
642
- {
643
- src: item.avatar,
644
- fallback: item.label.slice(0, 2).toUpperCase()
645
- }
646
- ),
647
- /* @__PURE__ */ jsx6("span", { style: {
648
- flex: 1,
649
- overflow: "hidden",
650
- textOverflow: "ellipsis",
651
- whiteSpace: "nowrap"
652
- }, children: item.label })
653
- ]
654
- },
655
- item.id
656
- )) : /* @__PURE__ */ jsx6("div", { style: {
657
- padding: "24px 0",
658
- textAlign: "center",
659
- fontSize: "14px",
660
- color: "var(--muted-foreground)"
661
- }, children: "No results found" })
662
- }
663
- );
664
- });
665
- MentionCommand.displayName = "MentionCommand";
666
-
667
- // src/headless/extensions/Mention/mention-node-view.tsx
668
- import { NodeViewWrapper } from "@tiptap/react";
669
- import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
670
- function NodeIcon() {
671
- return /* @__PURE__ */ jsxs2("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: { flexShrink: 0 }, children: [
672
- /* @__PURE__ */ jsx7("path", { d: "M12 3l8 4.5v9l-8 4.5l-8-4.5v-9l8-4.5" }),
673
- /* @__PURE__ */ jsx7("path", { d: "M12 12l8-4.5" }),
674
- /* @__PURE__ */ jsx7("path", { d: "M12 12v9" }),
675
- /* @__PURE__ */ jsx7("path", { d: "M12 12l-8-4.5" })
676
- ] });
677
- }
678
- function ArticleIcon() {
679
- return /* @__PURE__ */ jsxs2("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: { flexShrink: 0 }, children: [
680
- /* @__PURE__ */ jsx7("path", { d: "M14 3v4a1 1 0 0 0 1 1h4" }),
681
- /* @__PURE__ */ jsx7("path", { d: "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z" }),
682
- /* @__PURE__ */ jsx7("path", { d: "M9 9l1 0" }),
683
- /* @__PURE__ */ jsx7("path", { d: "M9 13l6 0" }),
684
- /* @__PURE__ */ jsx7("path", { d: "M9 17l6 0" })
685
- ] });
686
- }
687
- var MentionNodeView = (props) => {
688
- const { node } = props;
689
- const { id, label, avatar, type } = node.attrs;
690
- const isNode = type === "node";
691
- const isArticle = type === "article";
692
- const isReference = isNode || isArticle;
693
- const backgroundColor = isArticle ? "rgba(249, 115, 22, 0.15)" : isNode ? "rgba(107, 114, 128, 0.15)" : "var(--accent)";
694
- const color = isArticle ? "rgb(234, 88, 12)" : isNode ? "rgb(75, 85, 99)" : "var(--accent-foreground)";
695
- const border = isArticle ? "1px solid rgba(249, 115, 22, 0.3)" : isNode ? "1px solid rgba(107, 114, 128, 0.3)" : "none";
696
- return /* @__PURE__ */ jsxs2(
697
- NodeViewWrapper,
698
- {
699
- as: "span",
700
- style: {
701
- display: "inline-flex",
702
- alignItems: "center",
703
- gap: "3px",
704
- backgroundColor,
705
- color,
706
- border,
707
- padding: isReference ? "1px 6px" : "1px 6px 1px 1px",
708
- borderRadius: "12px",
709
- fontSize: "13px",
710
- fontWeight: 500,
711
- verticalAlign: "middle"
712
- },
713
- children: [
714
- isNode && /* @__PURE__ */ jsx7(NodeIcon, {}),
715
- isArticle && /* @__PURE__ */ jsx7(ArticleIcon, {}),
716
- !isReference && avatar && /* @__PURE__ */ jsx7(
717
- "img",
718
- {
719
- src: avatar,
720
- alt: label || id,
721
- style: {
722
- width: "20px",
723
- height: "20px",
724
- borderRadius: "50%",
725
- flexShrink: 0
726
- }
727
- }
728
- ),
729
- !isReference && !avatar && /* @__PURE__ */ jsx7(
730
- "div",
731
- {
732
- style: {
733
- width: "20px",
734
- height: "20px",
735
- borderRadius: "50%",
736
- backgroundColor: "var(--muted)",
737
- color: "var(--muted-foreground)",
738
- display: "flex",
739
- alignItems: "center",
740
- justifyContent: "center",
741
- fontSize: "10px",
742
- fontWeight: 600,
743
- flexShrink: 0
744
- },
745
- children: (label || id).slice(0, 2).toUpperCase()
746
- }
747
- ),
748
- /* @__PURE__ */ jsx7("span", { children: label || id })
749
- ]
750
- }
751
- );
752
- };
753
-
754
- // src/headless/extensions/Mention/mention.tsx
755
- var createMentionExtension = (options) => {
756
- const extensionName = options?.name ?? "mention";
757
- return Mention.extend({
758
- name: extensionName,
759
- addAttributes() {
760
- return {
761
- id: {
762
- default: null,
763
- parseHTML: (element) => element.getAttribute("data-id"),
764
- renderHTML: (attributes) => {
765
- if (!attributes.id) {
766
- return {};
767
- }
768
- return {
769
- "data-id": attributes.id
770
- };
771
- }
772
- },
773
- label: {
774
- default: null,
775
- parseHTML: (element) => element.getAttribute("data-label"),
776
- renderHTML: (attributes) => {
777
- if (!attributes.label) {
778
- return {};
779
- }
780
- return {
781
- "data-label": attributes.label
782
- };
783
- }
784
- },
785
- avatar: {
786
- default: null,
787
- parseHTML: (element) => element.getAttribute("data-avatar"),
788
- renderHTML: (attributes) => {
789
- if (!attributes.avatar) {
790
- return {};
791
- }
792
- return {
793
- "data-avatar": attributes.avatar
794
- };
795
- }
796
- },
797
- type: {
798
- default: null,
799
- parseHTML: (element) => element.getAttribute("data-ref-type"),
800
- renderHTML: (attributes) => {
801
- if (!attributes.type) {
802
- return {};
803
- }
804
- return {
805
- "data-ref-type": attributes.type
806
- };
807
- }
808
- },
809
- nodeId: {
810
- default: null,
811
- parseHTML: (element) => element.getAttribute("data-node-id"),
812
- renderHTML: (attributes) => {
813
- if (!attributes.nodeId) {
814
- return {};
815
- }
816
- return {
817
- "data-node-id": attributes.nodeId
818
- };
819
- }
820
- },
821
- slug: {
822
- default: null,
823
- parseHTML: (element) => element.getAttribute("data-slug"),
824
- renderHTML: (attributes) => {
825
- if (!attributes.slug) {
826
- return {};
827
- }
828
- return {
829
- "data-slug": attributes.slug
830
- };
831
- }
832
- }
833
- };
834
- },
835
- addNodeView() {
836
- return ReactNodeViewRenderer2(MentionNodeView);
837
- }
838
- }).configure({
839
- HTMLAttributes: {
840
- class: "mention"
841
- },
842
- suggestion: {
843
- char: options?.char ?? "@",
844
- items: async ({ query }) => {
845
- if (!options?.items) return [];
846
- const items = await options.items(query);
847
- return items;
848
- },
849
- command: ({ editor, range, props: item }) => {
850
- editor.chain().focus().insertContentAt(range, [
851
- {
852
- type: extensionName,
853
- attrs: {
854
- id: item.id,
855
- label: item.label,
856
- avatar: item.avatar,
857
- type: item.type,
858
- nodeId: item.nodeId,
859
- slug: item.slug
860
- }
861
- }
862
- ]).run();
863
- },
864
- render: renderMentionSuggestion
865
- },
866
- renderLabel: options?.renderLabel ?? ((props) => {
867
- return `@${props.node.attrs.label ?? props.node.attrs.id}`;
868
- })
869
- });
870
- };
871
- var renderMentionSuggestion = () => {
872
- let component = null;
873
- let container = null;
874
- const destroy = () => {
875
- component?.destroy();
876
- component = null;
877
- if (container) {
878
- container.remove();
879
- container = null;
880
- }
881
- };
882
- const updatePosition = (clientRect) => {
883
- if (!container || !clientRect) return;
884
- const gap = 8;
885
- const maxDropdownHeight = 300;
886
- const spaceBelow = window.innerHeight - clientRect.bottom;
887
- const spaceAbove = clientRect.top;
888
- const shouldPositionAbove = spaceBelow < maxDropdownHeight && spaceAbove > spaceBelow;
889
- const left = Math.round(clientRect.left);
890
- if (shouldPositionAbove) {
891
- const bottom = Math.round(window.innerHeight - clientRect.top + gap);
892
- container.style.bottom = `${bottom}px`;
893
- container.style.top = "auto";
894
- } else {
895
- const top = Math.round(clientRect.bottom + gap);
896
- container.style.top = `${top}px`;
897
- container.style.bottom = "auto";
898
- }
899
- container.style.left = `${left}px`;
900
- };
901
- return {
902
- onStart: (props) => {
903
- component = new ReactRenderer(MentionCommand, {
904
- props: {
905
- items: props.items ?? [],
906
- command: props.command ?? (() => {
907
- }),
908
- query: props.query ?? ""
909
- },
910
- editor: props.editor
911
- });
912
- container = document.createElement("div");
913
- container.style.position = "fixed";
914
- container.style.zIndex = "9999";
915
- document.body.appendChild(container);
916
- container.appendChild(component.element);
917
- const rect = typeof props.clientRect === "function" ? props.clientRect() : null;
918
- if (rect) updatePosition(rect);
919
- },
920
- onUpdate: (props) => {
921
- component?.updateProps({
922
- items: props.items ?? [],
923
- command: props.command ?? (() => {
924
- }),
925
- query: props.query ?? ""
926
- });
927
- const rect = typeof props.clientRect === "function" ? props.clientRect() : null;
928
- if (rect) updatePosition(rect);
929
- },
930
- onKeyDown: ({ event }) => {
931
- if (!component) return false;
932
- if (event.key === "Escape") {
933
- event.preventDefault();
934
- event.stopPropagation();
935
- destroy();
936
- return true;
937
- }
938
- if (["ArrowUp", "ArrowDown", "Enter"].includes(event.key)) {
939
- event.preventDefault();
940
- event.stopPropagation();
941
- return component.ref?.onKeyDown?.({ event }) ?? false;
942
- }
943
- return false;
944
- },
945
- onExit: () => {
946
- destroy();
947
- }
948
- };
949
- };
950
-
951
- // src/headless/extensions/DragHandle/DragHandle.ts
952
- import BaseDragHandle from "@tiptap/extension-drag-handle";
953
- var currentCallbacks = {};
954
- var currentNode = null;
955
- var currentEditor = null;
956
- function setDragHandleCallbacks(callbacks) {
957
- currentCallbacks = callbacks;
958
- }
959
- function createDragHandleElement() {
960
- const container = document.createElement("div");
961
- container.className = "nph-drag-handle";
962
- const plusBtn = document.createElement("button");
963
- plusBtn.className = "nph-drag-handle__btn";
964
- plusBtn.type = "button";
965
- plusBtn.setAttribute("aria-label", "Add block");
966
- plusBtn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14"/><path d="M5 12h14"/></svg>`;
967
- plusBtn.addEventListener("click", (e) => {
968
- e.preventDefault();
969
- e.stopPropagation();
970
- if (currentEditor) {
971
- currentCallbacks.onAddBlock?.(currentEditor, currentNode);
972
- }
973
- });
974
- const gripBtn = document.createElement("button");
975
- gripBtn.className = "nph-drag-handle__btn nph-drag-handle__grip";
976
- gripBtn.type = "button";
977
- gripBtn.setAttribute("aria-label", "Drag to reorder");
978
- gripBtn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="5" r="1"/><circle cx="9" cy="12" r="1"/><circle cx="9" cy="19" r="1"/><circle cx="15" cy="5" r="1"/><circle cx="15" cy="12" r="1"/><circle cx="15" cy="19" r="1"/></svg>`;
979
- gripBtn.addEventListener("click", (e) => {
980
- e.preventDefault();
981
- e.stopPropagation();
982
- if (currentEditor) {
983
- currentCallbacks.onGripClick?.(currentEditor, currentNode, container);
984
- }
985
- });
986
- container.appendChild(plusBtn);
987
- container.appendChild(gripBtn);
988
- return container;
989
- }
990
- var DragHandle = BaseDragHandle.configure({
991
- render: createDragHandleElement,
992
- nested: true,
993
- onNodeChange: ({ node, editor }) => {
994
- currentNode = node;
995
- currentEditor = editor;
996
- }
997
- });
998
-
999
- // src/headless/extensions/Table/index.ts
1000
- import { TableKit } from "@tiptap/extension-table";
1001
- import { Table, TableCell, TableHeader, TableRow } from "@tiptap/extension-table";
1002
-
1003
- // src/headless/extensions/MarkdownPaste.ts
1004
- import { Extension } from "@tiptap/core";
1005
- import { Plugin as Plugin3, PluginKey as PluginKey2 } from "@tiptap/pm/state";
1006
- import { MarkdownParser, defaultMarkdownParser } from "@tiptap/pm/markdown";
1007
- var markdownPastePluginKey = new PluginKey2("markdownPaste");
1008
- function looksLikeMarkdown(text) {
1009
- const patterns = [
1010
- /^#{1,6}\s/m,
1011
- // headings
1012
- /^\s*[-*+]\s/m,
1013
- // unordered list
1014
- /^\s*\d+\.\s/m,
1015
- // ordered list
1016
- /^\s*>\s/m,
1017
- // blockquote
1018
- /\|.+\|/m,
1019
- // table
1020
- /^```/m,
1021
- // fenced code block
1022
- /\*\*.+\*\*/,
1023
- // bold
1024
- /\*.+\*/,
1025
- // italic
1026
- /~~.+~~/,
1027
- // strikethrough
1028
- /`[^`]+`/,
1029
- // inline code
1030
- /^\s*---\s*$/m,
1031
- // horizontal rule
1032
- /^\s*\*\*\*\s*$/m,
1033
- // horizontal rule alt
1034
- /\[.+\]\(.+\)/,
1035
- // links
1036
- /!\[.*\]\(.+\)/
1037
- // images
1038
- ];
1039
- const hasMarkdown = patterns.some((p) => p.test(text));
1040
- const isHtml = /^<[a-z][\s\S]*>/i.test(text.trim());
1041
- return hasMarkdown && !isHtml;
1042
- }
1043
- function buildParser(schema) {
1044
- const md = defaultMarkdownParser.tokenizer;
1045
- const tokens = {};
1046
- if (schema.nodes.paragraph) tokens.paragraph = { block: "paragraph" };
1047
- if (schema.nodes.heading) {
1048
- tokens.heading = {
1049
- block: "heading",
1050
- getAttrs: (tok) => ({ level: Number(tok.tag.slice(1)) })
1051
- };
1052
- }
1053
- if (schema.nodes.blockquote) tokens.blockquote = { block: "blockquote" };
1054
- if (schema.nodes.bulletList) tokens.bullet_list = { block: "bulletList" };
1055
- if (schema.nodes.orderedList) {
1056
- tokens.ordered_list = {
1057
- block: "orderedList",
1058
- getAttrs: (tok) => ({ start: Number(tok.attrGet("start") || 1) })
1059
- };
1060
- }
1061
- if (schema.nodes.listItem) tokens.list_item = { block: "listItem" };
1062
- if (schema.nodes.codeBlock) {
1063
- tokens.code_block = { block: "codeBlock", noCloseToken: true };
1064
- tokens.fence = {
1065
- block: "codeBlock",
1066
- getAttrs: (tok) => ({ language: tok.info || "" }),
1067
- noCloseToken: true
1068
- };
1069
- }
1070
- if (schema.nodes.horizontalRule) {
1071
- tokens.hr = { node: "horizontalRule" };
1072
- }
1073
- if (schema.nodes.hardBreak) {
1074
- tokens.hardbreak = { node: "hardBreak" };
1075
- }
1076
- if (schema.nodes.image) {
1077
- tokens.image = {
1078
- node: "image",
1079
- getAttrs: (tok) => ({
1080
- src: tok.attrGet("src"),
1081
- title: tok.attrGet("title") || null,
1082
- alt: tok.children?.[0]?.content || null
1083
- })
1084
- };
1085
- }
1086
- if (schema.nodes.table) {
1087
- tokens.table = { block: "table" };
1088
- tokens.thead = { ignore: true };
1089
- tokens.tbody = { ignore: true };
1090
- tokens.tr = { block: "tableRow" };
1091
- tokens.th = { block: "tableHeader" };
1092
- tokens.td = { block: "tableCell" };
1093
- }
1094
- if (schema.marks.bold || schema.marks.strong) {
1095
- tokens.strong = { mark: schema.marks.bold ? "bold" : "strong" };
1096
- }
1097
- if (schema.marks.italic || schema.marks.em) {
1098
- tokens.em = { mark: schema.marks.italic ? "italic" : "em" };
1099
- }
1100
- if (schema.marks.code) {
1101
- tokens.code_inline = { mark: "code", noCloseToken: true };
1102
- }
1103
- if (schema.marks.link) {
1104
- tokens.link = {
1105
- mark: "link",
1106
- getAttrs: (tok) => ({
1107
- href: tok.attrGet("href"),
1108
- title: tok.attrGet("title") || null
1109
- })
1110
- };
1111
- }
1112
- if (schema.marks.strike || schema.marks.strikethrough) {
1113
- tokens.s = { mark: schema.marks.strike ? "strike" : "strikethrough" };
1114
- }
1115
- try {
1116
- return new MarkdownParser(schema, md, tokens);
1117
- } catch {
1118
- return null;
1119
- }
1120
- }
1121
- var MarkdownPaste = Extension.create({
1122
- name: "markdownPaste",
1123
- addProseMirrorPlugins() {
1124
- const schema = this.editor.schema;
1125
- let parser = null;
1126
- return [
1127
- new Plugin3({
1128
- key: markdownPastePluginKey,
1129
- props: {
1130
- handlePaste(view, event) {
1131
- const clipboardData = event.clipboardData;
1132
- if (!clipboardData) return false;
1133
- const html = clipboardData.getData("text/html");
1134
- if (html && html.trim().length > 0) return false;
1135
- const text = clipboardData.getData("text/plain");
1136
- if (!text || !looksLikeMarkdown(text)) return false;
1137
- if (!parser) {
1138
- parser = buildParser(schema);
1139
- }
1140
- if (!parser) return false;
1141
- try {
1142
- const doc = parser.parse(text);
1143
- if (!doc || doc.content.size === 0) return false;
1144
- const { tr } = view.state;
1145
- const slice = doc.slice(0, doc.content.size);
1146
- tr.replaceSelection(slice);
1147
- view.dispatch(tr);
1148
- return true;
1149
- } catch {
1150
- return false;
1151
- }
1152
- }
1153
- }
1154
- })
1155
- ];
1156
- }
1157
- });
1158
-
1159
- // src/headless/extensions/slash-command.tsx
1160
- import Suggestion from "@tiptap/suggestion";
1161
- import { Extension as Extension2 } from "@tiptap/core";
1162
- var Command = Extension2.create({
1163
- name: "slash-command",
1164
- addOptions() {
1165
- return {
1166
- suggestion: {
1167
- char: "/",
1168
- command: (ctx) => {
1169
- ctx.props.command({ editor: ctx.editor, range: ctx.range });
1170
- }
1171
- }
1172
- };
1173
- },
1174
- addProseMirrorPlugins() {
1175
- const base = this.options.suggestion ?? {};
1176
- return [
1177
- Suggestion({
1178
- editor: this.editor,
1179
- char: base.char ?? "/",
1180
- startOfLine: base.startOfLine ?? true,
1181
- items: base.items ?? (() => ["/"]),
1182
- command: (ctx) => {
1183
- if (typeof ctx?.props?.command === "function") {
1184
- ctx.props.command({ editor: ctx.editor, range: ctx.range });
1185
- }
1186
- },
1187
- ...base,
1188
- render: () => {
1189
- return {
1190
- onStart: (props) => {
1191
- const { selection } = props.editor.state;
1192
- const parentNode = selection.$from.node(selection.$from.depth);
1193
- const blockType = parentNode.type.name;
1194
- if (blockType === "codeBlock") return false;
1195
- const { $from } = selection;
1196
- const marks = $from.marks();
1197
- if (marks.some((mark) => mark.type.name === "code" || mark.type.name === "link")) {
1198
- return false;
1199
- }
1200
- novelStore.set(queryAtom, props.query ?? "");
1201
- novelStore.set(rangeAtom, props.range ?? null);
1202
- novelStore.set(slashMenuOpenAtom, true);
1203
- const rect = typeof props.clientRect === "function" ? props.clientRect() : null;
1204
- novelStore.set(slashMenuRectAtom, rect);
1205
- },
1206
- onUpdate: (props) => {
1207
- novelStore.set(queryAtom, props.query ?? "");
1208
- novelStore.set(rangeAtom, props.range ?? null);
1209
- const rect = typeof props.clientRect === "function" ? props.clientRect() : null;
1210
- novelStore.set(slashMenuRectAtom, rect);
1211
- },
1212
- onKeyDown: ({ event }) => {
1213
- if (event.key === "Escape") {
1214
- novelStore.set(slashMenuOpenAtom, false);
1215
- return true;
1216
- }
1217
- if (["ArrowUp", "ArrowDown", "Enter"].includes(event.key)) {
1218
- const slashCommand = document.querySelector("#slash-command");
1219
- if (slashCommand) {
1220
- slashCommand.dispatchEvent(
1221
- new KeyboardEvent("keydown", {
1222
- key: event.key,
1223
- cancelable: true,
1224
- bubbles: true
1225
- })
1226
- );
1227
- return true;
1228
- }
1229
- }
1230
- return false;
1231
- },
1232
- onExit: () => {
1233
- novelStore.set(slashMenuOpenAtom, false);
1234
- novelStore.set(queryAtom, "");
1235
- novelStore.set(rangeAtom, null);
1236
- novelStore.set(slashMenuRectAtom, null);
1237
- }
1238
- };
1239
- }
1240
- })
1241
- ];
1242
- }
1243
- });
1244
- var renderItems = () => ({
1245
- onStart: () => {
1246
- },
1247
- onUpdate: () => {
1248
- },
1249
- onKeyDown: () => false,
1250
- onExit: () => {
1251
- }
1252
- });
1253
- var createSuggestionItems = (items) => items;
1254
- var handleCommandNavigation = (event) => {
1255
- if (["ArrowUp", "ArrowDown", "Enter"].includes(event.key)) {
1256
- const slashCommand = document.querySelector("#slash-command");
1257
- if (slashCommand) return true;
1258
- }
1259
- };
1260
-
1261
- export {
1262
- EditorRoot,
1263
- EditorContent,
1264
- EditorBubble,
1265
- EditorBubbleItem,
1266
- EditorCommandOut,
1267
- EditorCommand,
1268
- EditorCommandList,
1269
- EditorCommandItem,
1270
- EditorCommandEmpty,
1271
- CodeBlock,
1272
- Link,
1273
- ImageBlock,
1274
- MentionCommand,
1275
- createMentionExtension,
1276
- renderMentionSuggestion,
1277
- setDragHandleCallbacks,
1278
- DragHandle,
1279
- TableKit,
1280
- MarkdownPaste,
1281
- StarterKit,
1282
- Placeholder,
1283
- Command,
1284
- renderItems,
1285
- createSuggestionItems,
1286
- handleCommandNavigation,
1287
- useCurrentEditor4 as useCurrentEditor
1288
- };
1289
- //# sourceMappingURL=chunk-OCNM37WJ.js.map