neuphlo-editor 2.4.3 → 2.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1384,6 +1384,8 @@ var handleCommandNavigation = (event) => {
1384
1384
  var import_extension_collaboration = __toESM(require("@tiptap/extension-collaboration"), 1);
1385
1385
  var import_extension_collaboration_caret = __toESM(require("@tiptap/extension-collaboration-caret"), 1);
1386
1386
  var import_extension_underline = __toESM(require("@tiptap/extension-underline"), 1);
1387
+ var import_extension_list = require("@tiptap/extension-list");
1388
+ var import_react12 = require("@tiptap/react");
1387
1389
 
1388
1390
  // src/headless/extensions/VideoBlock/VideoBlock.ts
1389
1391
  var import_core5 = require("@tiptap/core");
@@ -1460,6 +1462,21 @@ var VideoBlock = import_core5.Node.create({
1460
1462
  });
1461
1463
 
1462
1464
  // src/headless/extensions/extension-kit.ts
1465
+ var TaskItem = import_extension_list.TaskItem.extend({
1466
+ addOptions() {
1467
+ return {
1468
+ ...this.parent?.(),
1469
+ nodeView: null
1470
+ };
1471
+ },
1472
+ addNodeView() {
1473
+ const custom = this.options.nodeView;
1474
+ if (custom) {
1475
+ return (0, import_react12.ReactNodeViewRenderer)(custom);
1476
+ }
1477
+ return this.parent?.();
1478
+ }
1479
+ });
1463
1480
  var ExtensionKit = (options) => {
1464
1481
  const enableSlashCommand = options?.slashCommand !== false;
1465
1482
  const extensions = [
@@ -1467,6 +1484,8 @@ var ExtensionKit = (options) => {
1467
1484
  CodeBlock,
1468
1485
  Link,
1469
1486
  import_extension_underline.default,
1487
+ import_extension_list.TaskList,
1488
+ TaskItem.configure({ nested: true, nodeView: options?.taskItemView }),
1470
1489
  ImageBlock.configure({
1471
1490
  uploadImage: options?.uploadImage,
1472
1491
  browseAssets: options?.browseAssets,
@@ -1565,13 +1584,13 @@ var extension_kit_default = ExtensionKit;
1565
1584
 
1566
1585
  // src/react/menus/TextMenu.tsx
1567
1586
  var import_state4 = require("@tiptap/pm/state");
1568
- var import_react13 = require("@tiptap/react");
1587
+ var import_react14 = require("@tiptap/react");
1569
1588
  var import_menus = require("@tiptap/react/menus");
1570
1589
  var import_icons_react2 = require("@tabler/icons-react");
1571
- var import_react14 = require("react");
1590
+ var import_react15 = require("react");
1572
1591
 
1573
1592
  // src/react/menus/MenuList.tsx
1574
- var import_react12 = require("react");
1593
+ var import_react13 = require("react");
1575
1594
  var import_icons_react = require("@tabler/icons-react");
1576
1595
  var import_jsx_runtime6 = require("react/jsx-runtime");
1577
1596
  function MenuList({
@@ -1581,10 +1600,10 @@ function MenuList({
1581
1600
  onSelect,
1582
1601
  buttonClassName
1583
1602
  }) {
1584
- const [open, setOpen] = (0, import_react12.useState)(false);
1585
- const [label, setLabel] = (0, import_react12.useState)("Paragraph");
1586
- const rootRef = (0, import_react12.useRef)(null);
1587
- const computeLabel = (0, import_react12.useCallback)(() => {
1603
+ const [open, setOpen] = (0, import_react13.useState)(false);
1604
+ const [label, setLabel] = (0, import_react13.useState)("Paragraph");
1605
+ const rootRef = (0, import_react13.useRef)(null);
1606
+ const computeLabel = (0, import_react13.useCallback)(() => {
1588
1607
  if (!editor) return "Paragraph";
1589
1608
  if (editor.isActive("heading", { level: 1 })) return "Heading 1";
1590
1609
  if (editor.isActive("heading", { level: 2 })) return "Heading 2";
@@ -1597,7 +1616,7 @@ function MenuList({
1597
1616
  if (editor.isActive("codeBlock")) return "Code Block";
1598
1617
  return "Paragraph";
1599
1618
  }, [editor]);
1600
- (0, import_react12.useEffect)(() => {
1619
+ (0, import_react13.useEffect)(() => {
1601
1620
  setLabel(computeLabel());
1602
1621
  if (!editor) return;
1603
1622
  const update = () => setLabel(computeLabel());
@@ -1610,7 +1629,7 @@ function MenuList({
1610
1629
  editor.off("update", update);
1611
1630
  };
1612
1631
  }, [editor, computeLabel]);
1613
- (0, import_react12.useEffect)(() => {
1632
+ (0, import_react13.useEffect)(() => {
1614
1633
  if (!editor) return;
1615
1634
  const close = () => setOpen(false);
1616
1635
  editor.on("selectionUpdate", close);
@@ -1620,7 +1639,7 @@ function MenuList({
1620
1639
  editor.off("blur", close);
1621
1640
  };
1622
1641
  }, [editor]);
1623
- (0, import_react12.useEffect)(() => {
1642
+ (0, import_react13.useEffect)(() => {
1624
1643
  const handlePointerDown = (e) => {
1625
1644
  if (!open) return;
1626
1645
  const el = rootRef.current;
@@ -1635,7 +1654,7 @@ function MenuList({
1635
1654
  onSelect?.();
1636
1655
  setOpen(false);
1637
1656
  };
1638
- const isActive = (0, import_react12.useCallback)((name) => label === name, [label]);
1657
+ const isActive = (0, import_react13.useCallback)((name) => label === name, [label]);
1639
1658
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { ref: rootRef, className: "nph-dropdown", children: [
1640
1659
  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
1641
1660
  "button",
@@ -1831,11 +1850,11 @@ function TextMenu({
1831
1850
  leadingExtras,
1832
1851
  trailingExtras
1833
1852
  }) {
1834
- const { editor } = (0, import_react13.useCurrentEditor)();
1835
- const [isAddingLink, setIsAddingLink] = (0, import_react14.useState)(false);
1836
- const [linkUrl, setLinkUrl] = (0, import_react14.useState)("");
1837
- const linkInputRef = (0, import_react14.useRef)(null);
1838
- const editorState = (0, import_react13.useEditorState)({
1853
+ const { editor } = (0, import_react14.useCurrentEditor)();
1854
+ const [isAddingLink, setIsAddingLink] = (0, import_react15.useState)(false);
1855
+ const [linkUrl, setLinkUrl] = (0, import_react15.useState)("");
1856
+ const linkInputRef = (0, import_react15.useRef)(null);
1857
+ const editorState = (0, import_react14.useEditorState)({
1839
1858
  editor,
1840
1859
  selector: (ctx) => {
1841
1860
  if (!ctx.editor) return null;
@@ -1853,7 +1872,7 @@ function TextMenu({
1853
1872
  };
1854
1873
  }
1855
1874
  });
1856
- (0, import_react14.useEffect)(() => {
1875
+ (0, import_react15.useEffect)(() => {
1857
1876
  if (isAddingLink && linkInputRef.current) {
1858
1877
  linkInputRef.current.focus();
1859
1878
  }
@@ -1912,7 +1931,7 @@ function TextMenu({
1912
1931
  return true;
1913
1932
  },
1914
1933
  children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: className ? `bubble-menu ${className}` : "bubble-menu", children: [
1915
- leadingExtras && editor ? leadingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react14.Fragment, { children: renderExtra(editor) }, `leading-extra-${index}`)) : null,
1934
+ leadingExtras && editor ? leadingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react15.Fragment, { children: renderExtra(editor) }, `leading-extra-${index}`)) : null,
1916
1935
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MenuList, { editor }),
1917
1936
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Separator, {}),
1918
1937
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
@@ -2074,17 +2093,17 @@ function TextMenu({
2074
2093
  )
2075
2094
  ] });
2076
2095
  })(),
2077
- trailingExtras && editor ? trailingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react14.Fragment, { children: renderExtra(editor) }, `trailing-extra-${index}`)) : null
2096
+ trailingExtras && editor ? trailingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react15.Fragment, { children: renderExtra(editor) }, `trailing-extra-${index}`)) : null
2078
2097
  ] })
2079
2098
  }
2080
2099
  );
2081
2100
  }
2082
2101
 
2083
2102
  // src/react/menus/SlashMenu.tsx
2084
- var import_react15 = require("@tiptap/react");
2103
+ var import_react16 = require("@tiptap/react");
2085
2104
  var import_jotai6 = require("jotai");
2086
2105
  var import_icons_react3 = require("@tabler/icons-react");
2087
- var import_react16 = require("react");
2106
+ var import_react17 = require("react");
2088
2107
  var import_jsx_runtime8 = require("react/jsx-runtime");
2089
2108
  var SLASH_COMMANDS = [
2090
2109
  {
@@ -2214,9 +2233,9 @@ var SLASH_COMMANDS = [
2214
2233
  }
2215
2234
  ];
2216
2235
  function SlashMenu({ className }) {
2217
- const { editor } = (0, import_react15.useCurrentEditor)();
2236
+ const { editor } = (0, import_react16.useCurrentEditor)();
2218
2237
  const query = (0, import_jotai6.useAtomValue)(queryAtom, { store: novelStore });
2219
- const filteredGroups = (0, import_react16.useMemo)(() => {
2238
+ const filteredGroups = (0, import_react17.useMemo)(() => {
2220
2239
  if (!query) return SLASH_COMMANDS;
2221
2240
  const q = query.toLowerCase();
2222
2241
  return SLASH_COMMANDS.map((group) => ({
@@ -2257,37 +2276,37 @@ function SlashMenu({ className }) {
2257
2276
  }
2258
2277
 
2259
2278
  // src/react/menus/LinkMenu.tsx
2260
- var import_react17 = require("@tiptap/react");
2279
+ var import_react18 = require("@tiptap/react");
2261
2280
  var import_menus2 = require("@tiptap/react/menus");
2262
- var import_react18 = require("react");
2281
+ var import_react19 = require("react");
2263
2282
  var import_icons_react4 = require("@tabler/icons-react");
2264
2283
  var import_jsx_runtime9 = require("react/jsx-runtime");
2265
2284
  function LinkMenu() {
2266
- const { editor } = (0, import_react17.useCurrentEditor)();
2267
- const [url, setUrl] = (0, import_react18.useState)("");
2268
- const [isEditing, setIsEditing] = (0, import_react18.useState)(false);
2269
- const inputRef = (0, import_react18.useRef)(null);
2285
+ const { editor } = (0, import_react18.useCurrentEditor)();
2286
+ const [url, setUrl] = (0, import_react19.useState)("");
2287
+ const [isEditing, setIsEditing] = (0, import_react19.useState)(false);
2288
+ const inputRef = (0, import_react19.useRef)(null);
2270
2289
  const currentUrl = editor?.getAttributes("link")?.href || "";
2271
- (0, import_react18.useEffect)(() => {
2290
+ (0, import_react19.useEffect)(() => {
2272
2291
  setUrl(currentUrl);
2273
2292
  }, [currentUrl]);
2274
- (0, import_react18.useEffect)(() => {
2293
+ (0, import_react19.useEffect)(() => {
2275
2294
  if (isEditing && inputRef.current) {
2276
2295
  inputRef.current.focus();
2277
2296
  inputRef.current.select();
2278
2297
  }
2279
2298
  }, [isEditing]);
2280
- const handleSetLink = (0, import_react18.useCallback)(() => {
2299
+ const handleSetLink = (0, import_react19.useCallback)(() => {
2281
2300
  if (!editor || !url) return;
2282
2301
  editor.chain().focus().extendMarkRange("link").setLink({ href: url }).run();
2283
2302
  setIsEditing(false);
2284
2303
  }, [editor, url]);
2285
- const handleRemoveLink = (0, import_react18.useCallback)(() => {
2304
+ const handleRemoveLink = (0, import_react19.useCallback)(() => {
2286
2305
  if (!editor) return;
2287
2306
  editor.chain().focus().unsetLink().run();
2288
2307
  setIsEditing(false);
2289
2308
  }, [editor]);
2290
- const handleOpenLink = (0, import_react18.useCallback)(() => {
2309
+ const handleOpenLink = (0, import_react19.useCallback)(() => {
2291
2310
  if (url || currentUrl) {
2292
2311
  window.open(url || currentUrl, "_blank", "noopener,noreferrer");
2293
2312
  }
@@ -2403,20 +2422,20 @@ function LinkMenu() {
2403
2422
 
2404
2423
  // src/react/menus/ImageMenu.tsx
2405
2424
  var import_state5 = require("@tiptap/pm/state");
2406
- var import_react19 = require("@tiptap/react");
2425
+ var import_react20 = require("@tiptap/react");
2407
2426
  var import_menus3 = require("@tiptap/react/menus");
2408
2427
  var import_icons_react5 = require("@tabler/icons-react");
2409
- var import_react20 = require("react");
2428
+ var import_react21 = require("react");
2410
2429
  var import_jsx_runtime10 = require("react/jsx-runtime");
2411
2430
  function ImageMenu({
2412
2431
  className,
2413
2432
  leadingExtras,
2414
2433
  trailingExtras
2415
2434
  }) {
2416
- const { editor } = (0, import_react19.useCurrentEditor)();
2417
- const [size, setSize] = (0, import_react20.useState)(100);
2418
- const [align, setAlign] = (0, import_react20.useState)("left");
2419
- (0, import_react20.useEffect)(() => {
2435
+ const { editor } = (0, import_react20.useCurrentEditor)();
2436
+ const [size, setSize] = (0, import_react21.useState)(100);
2437
+ const [align, setAlign] = (0, import_react21.useState)("left");
2438
+ (0, import_react21.useEffect)(() => {
2420
2439
  if (!editor) return;
2421
2440
  const update = () => {
2422
2441
  if (!editor.isActive("imageBlock")) return;
@@ -2470,7 +2489,7 @@ function ImageMenu({
2470
2489
  },
2471
2490
  updateDelay: 0,
2472
2491
  children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: className ? `bubble-menu ${className}` : "bubble-menu", children: [
2473
- leadingExtras && editor ? leadingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react20.Fragment, { children: renderExtra(editor) }, `image-leading-extra-${index}`)) : null,
2492
+ leadingExtras && editor ? leadingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react21.Fragment, { children: renderExtra(editor) }, `image-leading-extra-${index}`)) : null,
2474
2493
  /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
2475
2494
  "div",
2476
2495
  {
@@ -2570,32 +2589,32 @@ function ImageMenu({
2570
2589
  children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_react5.IconTrash, { size: 16 })
2571
2590
  }
2572
2591
  ),
2573
- trailingExtras && editor ? trailingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react20.Fragment, { children: renderExtra(editor) }, `image-trailing-extra-${index}`)) : null
2592
+ trailingExtras && editor ? trailingExtras.map((renderExtra, index) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react21.Fragment, { children: renderExtra(editor) }, `image-trailing-extra-${index}`)) : null
2574
2593
  ] })
2575
2594
  }
2576
2595
  );
2577
2596
  }
2578
2597
 
2579
2598
  // src/react/menus/ImageBlock/ImageBlockView.tsx
2580
- var import_react26 = require("@tiptap/react");
2581
- var import_react27 = require("react");
2599
+ var import_react27 = require("@tiptap/react");
2600
+ var import_react28 = require("react");
2582
2601
  var import_icons_react9 = require("@tabler/icons-react");
2583
2602
 
2584
2603
  // src/react/menus/ImageBlock/ImageBlockMenu.tsx
2585
2604
  var import_state6 = require("@tiptap/pm/state");
2586
- var import_react22 = require("@tiptap/react");
2587
- var import_react23 = require("react");
2605
+ var import_react23 = require("@tiptap/react");
2606
+ var import_react24 = require("react");
2588
2607
 
2589
2608
  // src/react/menus/ImageBlock/ImageBlockWidth.tsx
2590
- var import_react21 = require("react");
2609
+ var import_react22 = require("react");
2591
2610
  var import_jsx_runtime11 = require("react/jsx-runtime");
2592
- var ImageBlockWidth = (0, import_react21.memo)(
2611
+ var ImageBlockWidth = (0, import_react22.memo)(
2593
2612
  ({ onChange, value }) => {
2594
- const [currentValue, setCurrentValue] = (0, import_react21.useState)(value);
2595
- (0, import_react21.useEffect)(() => {
2613
+ const [currentValue, setCurrentValue] = (0, import_react22.useState)(value);
2614
+ (0, import_react22.useEffect)(() => {
2596
2615
  setCurrentValue(value);
2597
2616
  }, [value]);
2598
- const handleChange = (0, import_react21.useCallback)(
2617
+ const handleChange = (0, import_react22.useCallback)(
2599
2618
  (e) => {
2600
2619
  const nextValue = parseInt(e.target.value);
2601
2620
  onChange(nextValue);
@@ -2650,8 +2669,8 @@ ImageBlockWidth.displayName = "ImageBlockWidth";
2650
2669
  var import_icons_react6 = require("@tabler/icons-react");
2651
2670
  var import_jsx_runtime12 = require("react/jsx-runtime");
2652
2671
  var ImageBlockMenu = ({ editor, getPos, appendTo }) => {
2653
- const menuRef = (0, import_react23.useRef)(null);
2654
- const { isVisible, align, width } = (0, import_react22.useEditorState)({
2672
+ const menuRef = (0, import_react24.useRef)(null);
2673
+ const { isVisible, align, width } = (0, import_react23.useEditorState)({
2655
2674
  editor,
2656
2675
  selector: (ctx) => {
2657
2676
  if (!ctx.editor) return { isVisible: false, align: "center", width: 100 };
@@ -2673,22 +2692,22 @@ var ImageBlockMenu = ({ editor, getPos, appendTo }) => {
2673
2692
  return { isVisible: visible, align: currentAlign, width: currentWidth };
2674
2693
  }
2675
2694
  });
2676
- const onAlignImageLeft = (0, import_react23.useCallback)(() => {
2695
+ const onAlignImageLeft = (0, import_react24.useCallback)(() => {
2677
2696
  editor.chain().focus(void 0, { scrollIntoView: false }).setImageBlockAlign("left").run();
2678
2697
  }, [editor]);
2679
- const onAlignImageCenter = (0, import_react23.useCallback)(() => {
2698
+ const onAlignImageCenter = (0, import_react24.useCallback)(() => {
2680
2699
  editor.chain().focus(void 0, { scrollIntoView: false }).setImageBlockAlign("center").run();
2681
2700
  }, [editor]);
2682
- const onAlignImageRight = (0, import_react23.useCallback)(() => {
2701
+ const onAlignImageRight = (0, import_react24.useCallback)(() => {
2683
2702
  editor.chain().focus(void 0, { scrollIntoView: false }).setImageBlockAlign("right").run();
2684
2703
  }, [editor]);
2685
- const onWidthChange = (0, import_react23.useCallback)(
2704
+ const onWidthChange = (0, import_react24.useCallback)(
2686
2705
  (value) => {
2687
2706
  editor.chain().focus(void 0, { scrollIntoView: false }).setImageBlockWidth(value).run();
2688
2707
  },
2689
2708
  [editor]
2690
2709
  );
2691
- const onRemoveImage = (0, import_react23.useCallback)(() => {
2710
+ const onRemoveImage = (0, import_react24.useCallback)(() => {
2692
2711
  editor.chain().focus(void 0, { scrollIntoView: false }).deleteSelection().run();
2693
2712
  }, [editor]);
2694
2713
  if (!isVisible) return null;
@@ -2771,7 +2790,7 @@ var ImageBlockMenu = ({ editor, getPos, appendTo }) => {
2771
2790
 
2772
2791
  // src/react/menus/ImageBlock/ImageUploader.tsx
2773
2792
  var import_icons_react8 = require("@tabler/icons-react");
2774
- var import_react24 = require("react");
2793
+ var import_react25 = require("react");
2775
2794
 
2776
2795
  // src/react/menus/ImageBlock/ImageBlockLoading.tsx
2777
2796
  var import_icons_react7 = require("@tabler/icons-react");
@@ -2789,14 +2808,14 @@ var ImageBlockLoading = () => {
2789
2808
  // src/react/menus/ImageBlock/ImageUploader.tsx
2790
2809
  var import_jsx_runtime14 = require("react/jsx-runtime");
2791
2810
  var ImageUploader = ({ onUpload, editor }) => {
2792
- const [loading, setLoading] = (0, import_react24.useState)(false);
2793
- const [draggedInside, setDraggedInside] = (0, import_react24.useState)(false);
2794
- const fileInputRef = (0, import_react24.useRef)(null);
2811
+ const [loading, setLoading] = (0, import_react25.useState)(false);
2812
+ const [draggedInside, setDraggedInside] = (0, import_react25.useState)(false);
2813
+ const fileInputRef = (0, import_react25.useRef)(null);
2795
2814
  const imageExtension = editor.extensionManager.extensions.find(
2796
2815
  (ext) => ext.name === "imageBlock"
2797
2816
  );
2798
2817
  const browseAssets = imageExtension?.options?.browseAssets;
2799
- const uploadFile = (0, import_react24.useCallback)(
2818
+ const uploadFile = (0, import_react25.useCallback)(
2800
2819
  async (file) => {
2801
2820
  setLoading(true);
2802
2821
  try {
@@ -2815,10 +2834,10 @@ var ImageUploader = ({ onUpload, editor }) => {
2815
2834
  },
2816
2835
  [imageExtension, onUpload]
2817
2836
  );
2818
- const handleUploadClick = (0, import_react24.useCallback)(() => {
2837
+ const handleUploadClick = (0, import_react25.useCallback)(() => {
2819
2838
  fileInputRef.current?.click();
2820
2839
  }, []);
2821
- const onFileChange = (0, import_react24.useCallback)(
2840
+ const onFileChange = (0, import_react25.useCallback)(
2822
2841
  (e) => {
2823
2842
  const file = e.target.files?.[0];
2824
2843
  if (file) {
@@ -2827,7 +2846,7 @@ var ImageUploader = ({ onUpload, editor }) => {
2827
2846
  },
2828
2847
  [uploadFile]
2829
2848
  );
2830
- const onDrop = (0, import_react24.useCallback)(
2849
+ const onDrop = (0, import_react25.useCallback)(
2831
2850
  (e) => {
2832
2851
  e.preventDefault();
2833
2852
  e.stopPropagation();
@@ -2839,12 +2858,12 @@ var ImageUploader = ({ onUpload, editor }) => {
2839
2858
  },
2840
2859
  [uploadFile]
2841
2860
  );
2842
- const onDragEnter = (0, import_react24.useCallback)((e) => {
2861
+ const onDragEnter = (0, import_react25.useCallback)((e) => {
2843
2862
  e.preventDefault();
2844
2863
  e.stopPropagation();
2845
2864
  setDraggedInside(true);
2846
2865
  }, []);
2847
- const onDragLeave = (0, import_react24.useCallback)((e) => {
2866
+ const onDragLeave = (0, import_react25.useCallback)((e) => {
2848
2867
  e.preventDefault();
2849
2868
  e.stopPropagation();
2850
2869
  setDraggedInside(false);
@@ -2919,16 +2938,16 @@ var ImageUploader = ({ onUpload, editor }) => {
2919
2938
  };
2920
2939
 
2921
2940
  // src/react/menus/ImageBlock/ImageResizeHandle.tsx
2922
- var import_react25 = require("react");
2941
+ var import_react26 = require("react");
2923
2942
  var import_jsx_runtime15 = require("react/jsx-runtime");
2924
2943
  function ImageResizeHandle({
2925
2944
  children,
2926
2945
  onResize,
2927
2946
  currentWidth
2928
2947
  }) {
2929
- const containerRef = (0, import_react25.useRef)(null);
2930
- const [isResizing, setIsResizing] = (0, import_react25.useState)(false);
2931
- const handleMouseDown = (0, import_react25.useCallback)(
2948
+ const containerRef = (0, import_react26.useRef)(null);
2949
+ const [isResizing, setIsResizing] = (0, import_react26.useState)(false);
2950
+ const handleMouseDown = (0, import_react26.useCallback)(
2932
2951
  (e, side) => {
2933
2952
  e.preventDefault();
2934
2953
  e.stopPropagation();
@@ -2988,19 +3007,19 @@ function ImageResizeHandle({
2988
3007
  var import_jsx_runtime16 = require("react/jsx-runtime");
2989
3008
  var ImageBlockView = (props) => {
2990
3009
  const { editor, getPos, node, updateAttributes } = props;
2991
- const imageWrapperRef = (0, import_react27.useRef)(null);
2992
- const [imageError, setImageError] = (0, import_react27.useState)(false);
3010
+ const imageWrapperRef = (0, import_react28.useRef)(null);
3011
+ const [imageError, setImageError] = (0, import_react28.useState)(false);
2993
3012
  const { src, width, align, alt, loading } = node.attrs;
2994
- const handleUpload = (0, import_react27.useCallback)(
3013
+ const handleUpload = (0, import_react28.useCallback)(
2995
3014
  (url) => {
2996
3015
  updateAttributes({ src: url, loading: false });
2997
3016
  },
2998
3017
  [updateAttributes]
2999
3018
  );
3000
- const onClick = (0, import_react27.useCallback)(() => {
3019
+ const onClick = (0, import_react28.useCallback)(() => {
3001
3020
  editor.commands.setNodeSelection(getPos());
3002
3021
  }, [getPos, editor.commands]);
3003
- const handleResize = (0, import_react27.useCallback)(
3022
+ const handleResize = (0, import_react28.useCallback)(
3004
3023
  (widthPercent) => {
3005
3024
  updateAttributes({ width: `${widthPercent}%` });
3006
3025
  },
@@ -3023,14 +3042,14 @@ var ImageBlockView = (props) => {
3023
3042
  position: "relative"
3024
3043
  });
3025
3044
  if (!src || src === "") {
3026
- if (!editor.isEditable) return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react26.NodeViewWrapper, {});
3027
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react26.NodeViewWrapper, { style: { width: "100%", marginTop: "0.5rem", marginBottom: "0.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: imageWrapperRef, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageUploader, { onUpload: handleUpload, editor }) }) });
3045
+ if (!editor.isEditable) return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react27.NodeViewWrapper, {});
3046
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react27.NodeViewWrapper, { style: { width: "100%", marginTop: "0.5rem", marginBottom: "0.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: imageWrapperRef, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageUploader, { onUpload: handleUpload, editor }) }) });
3028
3047
  }
3029
3048
  if (loading) {
3030
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react26.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: imageWrapperRef, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageBlockLoading, {}) }) });
3049
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react27.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: imageWrapperRef, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageBlockLoading, {}) }) });
3031
3050
  }
3032
3051
  if (imageError) {
3033
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react26.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { contentEditable: false, ref: imageWrapperRef, style: getContentStyle(), children: [
3052
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react27.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { contentEditable: false, ref: imageWrapperRef, style: getContentStyle(), children: [
3034
3053
  /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "nph-image-block-error", onClick, children: [
3035
3054
  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_icons_react9.IconPhotoOff, { size: 32 }),
3036
3055
  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { children: "Image could not be loaded" })
@@ -3038,7 +3057,7 @@ var ImageBlockView = (props) => {
3038
3057
  editor.isEditable && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageBlockMenu, { editor, getPos, appendTo: imageWrapperRef })
3039
3058
  ] }) });
3040
3059
  }
3041
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react26.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { contentEditable: false, ref: imageWrapperRef, style: getContentStyle(), children: [
3060
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react27.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { contentEditable: false, ref: imageWrapperRef, style: getContentStyle(), children: [
3042
3061
  editor.isEditable ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ImageResizeHandle, { onResize: handleResize, currentWidth: width, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
3043
3062
  "img",
3044
3063
  {
@@ -3063,18 +3082,18 @@ var ImageBlockView = (props) => {
3063
3082
 
3064
3083
  // src/react/menus/VideoBlock/VideoBlockView.tsx
3065
3084
  var import_state8 = require("@tiptap/pm/state");
3066
- var import_react30 = require("@tiptap/react");
3067
- var import_react31 = require("react");
3085
+ var import_react31 = require("@tiptap/react");
3086
+ var import_react32 = require("react");
3068
3087
 
3069
3088
  // src/react/menus/VideoBlock/VideoBlockMenu.tsx
3070
3089
  var import_state7 = require("@tiptap/pm/state");
3071
- var import_react28 = require("@tiptap/react");
3072
- var import_react29 = require("react");
3090
+ var import_react29 = require("@tiptap/react");
3091
+ var import_react30 = require("react");
3073
3092
  var import_icons_react10 = require("@tabler/icons-react");
3074
3093
  var import_jsx_runtime17 = require("react/jsx-runtime");
3075
3094
  var VideoBlockMenu = ({ editor, getPos }) => {
3076
- const menuRef = (0, import_react29.useRef)(null);
3077
- const { isVisible, align, width } = (0, import_react28.useEditorState)({
3095
+ const menuRef = (0, import_react30.useRef)(null);
3096
+ const { isVisible, align, width } = (0, import_react29.useEditorState)({
3078
3097
  editor,
3079
3098
  selector: (ctx) => {
3080
3099
  if (!ctx.editor) return { isVisible: false, align: "center", width: 100 };
@@ -3094,22 +3113,22 @@ var VideoBlockMenu = ({ editor, getPos }) => {
3094
3113
  return { isVisible: isThisNode, align: currentAlign, width: currentWidth };
3095
3114
  }
3096
3115
  });
3097
- const onAlignLeft = (0, import_react29.useCallback)(() => {
3116
+ const onAlignLeft = (0, import_react30.useCallback)(() => {
3098
3117
  editor.chain().focus(void 0, { scrollIntoView: false }).setVideoBlockAlign("left").run();
3099
3118
  }, [editor]);
3100
- const onAlignCenter = (0, import_react29.useCallback)(() => {
3119
+ const onAlignCenter = (0, import_react30.useCallback)(() => {
3101
3120
  editor.chain().focus(void 0, { scrollIntoView: false }).setVideoBlockAlign("center").run();
3102
3121
  }, [editor]);
3103
- const onAlignRight = (0, import_react29.useCallback)(() => {
3122
+ const onAlignRight = (0, import_react30.useCallback)(() => {
3104
3123
  editor.chain().focus(void 0, { scrollIntoView: false }).setVideoBlockAlign("right").run();
3105
3124
  }, [editor]);
3106
- const onWidthChange = (0, import_react29.useCallback)(
3125
+ const onWidthChange = (0, import_react30.useCallback)(
3107
3126
  (value) => {
3108
3127
  editor.chain().focus(void 0, { scrollIntoView: false }).setVideoBlockWidth(value).run();
3109
3128
  },
3110
3129
  [editor]
3111
3130
  );
3112
- const onRemove = (0, import_react29.useCallback)(() => {
3131
+ const onRemove = (0, import_react30.useCallback)(() => {
3113
3132
  editor.chain().focus(void 0, { scrollIntoView: false }).deleteSelection().run();
3114
3133
  }, [editor]);
3115
3134
  if (!isVisible) return null;
@@ -3215,11 +3234,11 @@ function toEmbedUrl(url) {
3215
3234
  }
3216
3235
  var VideoBlockView = (props) => {
3217
3236
  const { editor, getPos, node, updateAttributes } = props;
3218
- const wrapperRef = (0, import_react31.useRef)(null);
3237
+ const wrapperRef = (0, import_react32.useRef)(null);
3219
3238
  const { src, width, align } = node.attrs;
3220
- const [inputUrl, setInputUrl] = (0, import_react31.useState)("");
3221
- const [videoError, setVideoError] = (0, import_react31.useState)(false);
3222
- const isSelected = (0, import_react30.useEditorState)({
3239
+ const [inputUrl, setInputUrl] = (0, import_react32.useState)("");
3240
+ const [videoError, setVideoError] = (0, import_react32.useState)(false);
3241
+ const isSelected = (0, import_react31.useEditorState)({
3223
3242
  editor,
3224
3243
  selector: (ctx) => {
3225
3244
  if (!ctx.editor) return false;
@@ -3227,12 +3246,12 @@ var VideoBlockView = (props) => {
3227
3246
  return selection instanceof import_state8.NodeSelection && selection.from === getPos();
3228
3247
  }
3229
3248
  });
3230
- const handleEmbed = (0, import_react31.useCallback)(() => {
3249
+ const handleEmbed = (0, import_react32.useCallback)(() => {
3231
3250
  if (!inputUrl.trim()) return;
3232
3251
  const embedUrl = toEmbedUrl(inputUrl.trim());
3233
3252
  updateAttributes({ src: embedUrl });
3234
3253
  }, [inputUrl, updateAttributes]);
3235
- const handleKeyDown = (0, import_react31.useCallback)(
3254
+ const handleKeyDown = (0, import_react32.useCallback)(
3236
3255
  (e) => {
3237
3256
  if (e.key === "Enter") {
3238
3257
  e.preventDefault();
@@ -3241,7 +3260,7 @@ var VideoBlockView = (props) => {
3241
3260
  },
3242
3261
  [handleEmbed]
3243
3262
  );
3244
- const onClick = (0, import_react31.useCallback)(() => {
3263
+ const onClick = (0, import_react32.useCallback)(() => {
3245
3264
  editor.commands.setNodeSelection(getPos());
3246
3265
  }, [getPos, editor.commands]);
3247
3266
  const getWrapperStyle = () => {
@@ -3258,8 +3277,8 @@ var VideoBlockView = (props) => {
3258
3277
  }
3259
3278
  };
3260
3279
  if (!src || src === "") {
3261
- if (!editor.isEditable) return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react30.NodeViewWrapper, {});
3262
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react30.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { ref: wrapperRef, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "nph-video-placeholder", onClick, children: [
3280
+ if (!editor.isEditable) return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react31.NodeViewWrapper, {});
3281
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react31.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { ref: wrapperRef, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "nph-video-placeholder", onClick, children: [
3263
3282
  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "nph-video-placeholder__icon", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_icons_react11.IconVideo, { size: 28, stroke: 1.5 }) }),
3264
3283
  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: "2px" }, children: [
3265
3284
  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { fontSize: "14px", fontWeight: 600, lineHeight: "20px" }, children: "Add a video" }),
@@ -3295,7 +3314,7 @@ var VideoBlockView = (props) => {
3295
3314
  ] }) }) });
3296
3315
  }
3297
3316
  if (videoError) {
3298
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react30.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { contentEditable: false, ref: wrapperRef, style: { position: "relative" }, children: [
3317
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react31.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { contentEditable: false, ref: wrapperRef, style: { position: "relative" }, children: [
3299
3318
  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "nph-video-block-error", onClick, children: [
3300
3319
  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_icons_react11.IconVideoOff, { size: 32 }),
3301
3320
  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: "Video could not be loaded" }),
@@ -3304,7 +3323,7 @@ var VideoBlockView = (props) => {
3304
3323
  editor.isEditable && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(VideoBlockMenu, { editor, getPos })
3305
3324
  ] }) });
3306
3325
  }
3307
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react30.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
3326
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react31.NodeViewWrapper, { style: getWrapperStyle(), children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
3308
3327
  "div",
3309
3328
  {
3310
3329
  contentEditable: false,
@@ -3338,22 +3357,22 @@ var VideoBlockView = (props) => {
3338
3357
 
3339
3358
  // src/react/menus/DragHandle/BlockActionMenu.tsx
3340
3359
  var import_icons_react12 = require("@tabler/icons-react");
3341
- var import_react32 = require("react");
3360
+ var import_react33 = require("react");
3342
3361
  var import_jsx_runtime19 = require("react/jsx-runtime");
3343
3362
  function BlockActionMenu({ editor, onClose }) {
3344
- const executeAndClose = (0, import_react32.useCallback)(
3363
+ const executeAndClose = (0, import_react33.useCallback)(
3345
3364
  (fn) => {
3346
3365
  fn();
3347
3366
  onClose();
3348
3367
  },
3349
3368
  [onClose]
3350
3369
  );
3351
- const handleDelete = (0, import_react32.useCallback)(() => {
3370
+ const handleDelete = (0, import_react33.useCallback)(() => {
3352
3371
  executeAndClose(() => {
3353
3372
  editor.commands.deleteSelection();
3354
3373
  });
3355
3374
  }, [editor, executeAndClose]);
3356
- const handleDuplicate = (0, import_react32.useCallback)(() => {
3375
+ const handleDuplicate = (0, import_react33.useCallback)(() => {
3357
3376
  executeAndClose(() => {
3358
3377
  const { state } = editor;
3359
3378
  const { selection } = state;
@@ -3368,7 +3387,7 @@ function BlockActionMenu({ editor, onClose }) {
3368
3387
  }
3369
3388
  });
3370
3389
  }, [editor, executeAndClose]);
3371
- const handleMoveUp = (0, import_react32.useCallback)(() => {
3390
+ const handleMoveUp = (0, import_react33.useCallback)(() => {
3372
3391
  executeAndClose(() => {
3373
3392
  const { state } = editor;
3374
3393
  const { selection } = state;
@@ -3391,7 +3410,7 @@ function BlockActionMenu({ editor, onClose }) {
3391
3410
  }).run();
3392
3411
  });
3393
3412
  }, [editor, executeAndClose]);
3394
- const handleMoveDown = (0, import_react32.useCallback)(() => {
3413
+ const handleMoveDown = (0, import_react33.useCallback)(() => {
3395
3414
  executeAndClose(() => {
3396
3415
  const { state } = editor;
3397
3416
  const { selection } = state;
@@ -3416,7 +3435,7 @@ function BlockActionMenu({ editor, onClose }) {
3416
3435
  }).run();
3417
3436
  });
3418
3437
  }, [editor, executeAndClose]);
3419
- const handleCopyToClipboard = (0, import_react32.useCallback)(() => {
3438
+ const handleCopyToClipboard = (0, import_react33.useCallback)(() => {
3420
3439
  executeAndClose(() => {
3421
3440
  const { state } = editor;
3422
3441
  const { selection } = state;
@@ -3501,14 +3520,14 @@ function BlockActionMenu({ editor, onClose }) {
3501
3520
  }
3502
3521
 
3503
3522
  // src/react/menus/TableMenu.tsx
3504
- var import_react33 = require("@tiptap/react");
3523
+ var import_react34 = require("@tiptap/react");
3505
3524
  var import_icons_react13 = require("@tabler/icons-react");
3506
- var import_react34 = require("react");
3525
+ var import_react35 = require("react");
3507
3526
  var import_react_dom2 = require("react-dom");
3508
3527
  var import_jsx_runtime20 = require("react/jsx-runtime");
3509
3528
  function TableMenu({ className: _className }) {
3510
- const { editor } = (0, import_react33.useCurrentEditor)();
3511
- const tableInfo = (0, import_react33.useEditorState)({
3529
+ const { editor } = (0, import_react34.useCurrentEditor)();
3530
+ const tableInfo = (0, import_react34.useEditorState)({
3512
3531
  editor,
3513
3532
  selector: (ctx) => {
3514
3533
  if (!ctx.editor) return null;
@@ -3521,19 +3540,19 @@ function TableMenu({ className: _className }) {
3521
3540
  return null;
3522
3541
  }
3523
3542
  });
3524
- const [colGrips, setColGrips] = (0, import_react34.useState)([]);
3525
- const [rowGrips, setRowGrips] = (0, import_react34.useState)([]);
3526
- const [dropdown, setDropdown] = (0, import_react34.useState)(null);
3527
- const [tableRect, setTableRect] = (0, import_react34.useState)(null);
3528
- const [isHovering, setIsHovering] = (0, import_react34.useState)(false);
3529
- const [drag, setDrag] = (0, import_react34.useState)(null);
3530
- const dropdownRef = (0, import_react34.useRef)(null);
3531
- const dragRef = (0, import_react34.useRef)(null);
3532
- const getTableDom = (0, import_react34.useCallback)(() => {
3543
+ const [colGrips, setColGrips] = (0, import_react35.useState)([]);
3544
+ const [rowGrips, setRowGrips] = (0, import_react35.useState)([]);
3545
+ const [dropdown, setDropdown] = (0, import_react35.useState)(null);
3546
+ const [tableRect, setTableRect] = (0, import_react35.useState)(null);
3547
+ const [isHovering, setIsHovering] = (0, import_react35.useState)(false);
3548
+ const [drag, setDrag] = (0, import_react35.useState)(null);
3549
+ const dropdownRef = (0, import_react35.useRef)(null);
3550
+ const dragRef = (0, import_react35.useRef)(null);
3551
+ const getTableDom = (0, import_react35.useCallback)(() => {
3533
3552
  if (!editor || !tableInfo) return null;
3534
3553
  return editor.view.nodeDOM(tableInfo.pos);
3535
3554
  }, [editor, tableInfo]);
3536
- const measureGrips = (0, import_react34.useCallback)(() => {
3555
+ const measureGrips = (0, import_react35.useCallback)(() => {
3537
3556
  const tableDom = getTableDom();
3538
3557
  if (!tableDom) {
3539
3558
  setColGrips([]);
@@ -3570,7 +3589,7 @@ function TableMenu({ className: _className }) {
3570
3589
  });
3571
3590
  setRowGrips(newRowGrips);
3572
3591
  }, [getTableDom]);
3573
- (0, import_react34.useEffect)(() => {
3592
+ (0, import_react35.useEffect)(() => {
3574
3593
  if (!tableInfo) {
3575
3594
  setColGrips([]);
3576
3595
  setRowGrips([]);
@@ -3604,7 +3623,7 @@ function TableMenu({ className: _className }) {
3604
3623
  window.removeEventListener("scroll", handleScroll);
3605
3624
  };
3606
3625
  }, [tableInfo, getTableDom, measureGrips]);
3607
- (0, import_react34.useEffect)(() => {
3626
+ (0, import_react35.useEffect)(() => {
3608
3627
  if (!dropdown) return;
3609
3628
  const handlePointerDown = (e) => {
3610
3629
  if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
@@ -3614,7 +3633,7 @@ function TableMenu({ className: _className }) {
3614
3633
  document.addEventListener("pointerdown", handlePointerDown);
3615
3634
  return () => document.removeEventListener("pointerdown", handlePointerDown);
3616
3635
  }, [dropdown]);
3617
- (0, import_react34.useEffect)(() => {
3636
+ (0, import_react35.useEffect)(() => {
3618
3637
  if (!editor || !dropdown) return;
3619
3638
  const handleTransaction = () => setDropdown(null);
3620
3639
  editor.on("transaction", handleTransaction);
@@ -3622,7 +3641,7 @@ function TableMenu({ className: _className }) {
3622
3641
  editor.off("transaction", handleTransaction);
3623
3642
  };
3624
3643
  }, [editor, dropdown]);
3625
- const handleColGripClick = (0, import_react34.useCallback)(
3644
+ const handleColGripClick = (0, import_react35.useCallback)(
3626
3645
  (index, e) => {
3627
3646
  e.preventDefault();
3628
3647
  e.stopPropagation();
@@ -3646,7 +3665,7 @@ function TableMenu({ className: _className }) {
3646
3665
  },
3647
3666
  [editor, tableInfo, getTableDom]
3648
3667
  );
3649
- const handleRowGripClick = (0, import_react34.useCallback)(
3668
+ const handleRowGripClick = (0, import_react35.useCallback)(
3650
3669
  (index, e) => {
3651
3670
  e.preventDefault();
3652
3671
  e.stopPropagation();
@@ -3671,7 +3690,7 @@ function TableMenu({ className: _className }) {
3671
3690
  },
3672
3691
  [editor, tableInfo, getTableDom]
3673
3692
  );
3674
- const moveColumn = (0, import_react34.useCallback)(
3693
+ const moveColumn = (0, import_react35.useCallback)(
3675
3694
  (from, to) => {
3676
3695
  if (!editor || !tableInfo || from === to) return;
3677
3696
  const { state } = editor;
@@ -3698,7 +3717,7 @@ function TableMenu({ className: _className }) {
3698
3717
  },
3699
3718
  [editor, tableInfo]
3700
3719
  );
3701
- const moveRow = (0, import_react34.useCallback)(
3720
+ const moveRow = (0, import_react35.useCallback)(
3702
3721
  (from, to) => {
3703
3722
  if (!editor || !tableInfo || from === to) return;
3704
3723
  const { state } = editor;
@@ -3721,7 +3740,7 @@ function TableMenu({ className: _className }) {
3721
3740
  },
3722
3741
  [editor, tableInfo]
3723
3742
  );
3724
- const handleGripDragStart = (0, import_react34.useCallback)(
3743
+ const handleGripDragStart = (0, import_react35.useCallback)(
3725
3744
  (type, index, e) => {
3726
3745
  e.preventDefault();
3727
3746
  e.stopPropagation();
@@ -4017,9 +4036,44 @@ function TableMenu({ className: _className }) {
4017
4036
  );
4018
4037
  }
4019
4038
 
4020
- // src/react/Editor.tsx
4021
- var import_react35 = require("react");
4039
+ // src/react/menus/TaskItem/TaskItemView.tsx
4040
+ var import_react36 = require("@tiptap/react");
4022
4041
  var import_jsx_runtime21 = require("react/jsx-runtime");
4042
+ var createTaskItemView = (Checkbox) => {
4043
+ const TaskItemView = ({ node, updateAttributes }) => {
4044
+ const checked = !!node.attrs.checked;
4045
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
4046
+ import_react36.NodeViewWrapper,
4047
+ {
4048
+ as: "li",
4049
+ "data-checked": checked,
4050
+ className: "nph-task-item",
4051
+ children: [
4052
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("label", { contentEditable: false, className: "nph-task-item__checkbox", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4053
+ Checkbox,
4054
+ {
4055
+ checked,
4056
+ onCheckedChange: (value) => updateAttributes({ checked: value === true })
4057
+ }
4058
+ ) }),
4059
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4060
+ import_react36.NodeViewContent,
4061
+ {
4062
+ as: "div",
4063
+ className: "nph-task-item__content" + (checked ? " nph-task-item__content--checked" : "")
4064
+ }
4065
+ )
4066
+ ]
4067
+ }
4068
+ );
4069
+ };
4070
+ TaskItemView.displayName = "TaskItemView";
4071
+ return TaskItemView;
4072
+ };
4073
+
4074
+ // src/react/Editor.tsx
4075
+ var import_react37 = require("react");
4076
+ var import_jsx_runtime22 = require("react/jsx-runtime");
4023
4077
  function Editor5({
4024
4078
  content,
4025
4079
  className,
@@ -4039,12 +4093,19 @@ function Editor5({
4039
4093
  mentionOptions,
4040
4094
  referenceOptions,
4041
4095
  slashCommand,
4042
- placeholder
4096
+ placeholder,
4097
+ taskItemView,
4098
+ checkboxComponent
4043
4099
  }) {
4044
- const [actionMenuAnchor, setActionMenuAnchor] = (0, import_react35.useState)(null);
4045
- const [actionMenuEditor, setActionMenuEditor] = (0, import_react35.useState)(null);
4046
- const actionMenuRef = (0, import_react35.useRef)(null);
4047
- (0, import_react35.useEffect)(() => {
4100
+ const resolvedTaskItemView = (0, import_react37.useMemo)(() => {
4101
+ if (taskItemView) return taskItemView;
4102
+ if (checkboxComponent) return createTaskItemView(checkboxComponent);
4103
+ return void 0;
4104
+ }, [taskItemView, checkboxComponent]);
4105
+ const [actionMenuAnchor, setActionMenuAnchor] = (0, import_react37.useState)(null);
4106
+ const [actionMenuEditor, setActionMenuEditor] = (0, import_react37.useState)(null);
4107
+ const actionMenuRef = (0, import_react37.useRef)(null);
4108
+ (0, import_react37.useEffect)(() => {
4048
4109
  if (!actionMenuAnchor) return;
4049
4110
  const handlePointerDown = (e) => {
4050
4111
  if (actionMenuRef.current && !actionMenuRef.current.contains(e.target)) {
@@ -4054,7 +4115,7 @@ function Editor5({
4054
4115
  document.addEventListener("pointerdown", handlePointerDown);
4055
4116
  return () => document.removeEventListener("pointerdown", handlePointerDown);
4056
4117
  }, [actionMenuAnchor]);
4057
- const dragHandleCallbacks = (0, import_react35.useMemo)(
4118
+ const dragHandleCallbacks = (0, import_react37.useMemo)(
4058
4119
  () => ({
4059
4120
  onAddBlock: (editor) => {
4060
4121
  const { state } = editor;
@@ -4092,11 +4153,11 @@ function Editor5({
4092
4153
  };
4093
4154
  const textExtras = normalizeExtras(bubbleMenuExtras?.text);
4094
4155
  const imageExtras = normalizeExtras(bubbleMenuExtras?.image);
4095
- const handleCloseActionMenu = (0, import_react35.useCallback)(() => {
4156
+ const handleCloseActionMenu = (0, import_react37.useCallback)(() => {
4096
4157
  setActionMenuAnchor(null);
4097
4158
  }, []);
4098
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className, children: [
4099
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(EditorRoot, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
4159
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className, children: [
4160
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EditorRoot, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
4100
4161
  EditorContent,
4101
4162
  {
4102
4163
  onUpdate,
@@ -4111,6 +4172,7 @@ function Editor5({
4111
4172
  collaboration,
4112
4173
  imageBlockView: ImageBlockView,
4113
4174
  videoBlockView: VideoBlockView,
4175
+ taskItemView: resolvedTaskItemView,
4114
4176
  mention: mentionOptions,
4115
4177
  reference: referenceOptions,
4116
4178
  slashCommand,
@@ -4129,27 +4191,27 @@ function Editor5({
4129
4191
  }
4130
4192
  },
4131
4193
  children: [
4132
- showTextMenu ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4194
+ showTextMenu ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4133
4195
  TextMenu,
4134
4196
  {
4135
4197
  leadingExtras: textExtras.start,
4136
4198
  trailingExtras: textExtras.end
4137
4199
  }
4138
4200
  ) : null,
4139
- showImageMenu ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4201
+ showImageMenu ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4140
4202
  ImageMenu,
4141
4203
  {
4142
4204
  leadingExtras: imageExtras.start,
4143
4205
  trailingExtras: imageExtras.end
4144
4206
  }
4145
4207
  ) : null,
4146
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LinkMenu, {}),
4147
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(TableMenu, {}),
4148
- showSlashMenu ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SlashMenu, {}) : null
4208
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LinkMenu, {}),
4209
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(TableMenu, {}),
4210
+ showSlashMenu ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SlashMenu, {}) : null
4149
4211
  ]
4150
4212
  }
4151
4213
  ) }),
4152
- actionMenuAnchor && actionMenuEditor && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4214
+ actionMenuAnchor && actionMenuEditor && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4153
4215
  "div",
4154
4216
  {
4155
4217
  ref: actionMenuRef,
@@ -4159,7 +4221,7 @@ function Editor5({
4159
4221
  top: actionMenuAnchor.getBoundingClientRect().bottom + 4,
4160
4222
  left: actionMenuAnchor.getBoundingClientRect().left
4161
4223
  },
4162
- children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4224
+ children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4163
4225
  BlockActionMenu,
4164
4226
  {
4165
4227
  editor: actionMenuEditor,
@@ -4172,18 +4234,18 @@ function Editor5({
4172
4234
  }
4173
4235
 
4174
4236
  // src/react/TableOfContents.tsx
4175
- var import_react36 = require("@tiptap/react");
4176
- var import_react37 = require("react");
4177
- var import_jsx_runtime22 = require("react/jsx-runtime");
4237
+ var import_react38 = require("@tiptap/react");
4238
+ var import_react39 = require("react");
4239
+ var import_jsx_runtime23 = require("react/jsx-runtime");
4178
4240
  function TableOfContents({
4179
4241
  className,
4180
4242
  itemClassName,
4181
4243
  activeClassName
4182
4244
  }) {
4183
- const { editor } = (0, import_react36.useCurrentEditor)();
4184
- const [activeId, setActiveId] = (0, import_react37.useState)(null);
4185
- const observerRef = (0, import_react37.useRef)(null);
4186
- const headings = (0, import_react36.useEditorState)({
4245
+ const { editor } = (0, import_react38.useCurrentEditor)();
4246
+ const [activeId, setActiveId] = (0, import_react39.useState)(null);
4247
+ const observerRef = (0, import_react39.useRef)(null);
4248
+ const headings = (0, import_react38.useEditorState)({
4187
4249
  editor,
4188
4250
  selector: (ctx) => {
4189
4251
  if (!ctx.editor) return [];
@@ -4202,7 +4264,7 @@ function TableOfContents({
4202
4264
  return items;
4203
4265
  }
4204
4266
  });
4205
- (0, import_react37.useEffect)(() => {
4267
+ (0, import_react39.useEffect)(() => {
4206
4268
  if (!editor || !headings || headings.length === 0) return;
4207
4269
  observerRef.current?.disconnect();
4208
4270
  const callback = (entries) => {
@@ -4233,7 +4295,7 @@ function TableOfContents({
4233
4295
  observer.disconnect();
4234
4296
  };
4235
4297
  }, [editor, headings]);
4236
- const handleClick = (0, import_react37.useCallback)(
4298
+ const handleClick = (0, import_react39.useCallback)(
4237
4299
  (pos) => {
4238
4300
  if (!editor) return;
4239
4301
  editor.chain().focus().setTextSelection(pos + 1).run();
@@ -4248,13 +4310,13 @@ function TableOfContents({
4248
4310
  [editor]
4249
4311
  );
4250
4312
  if (!editor || !headings || headings.length === 0) return null;
4251
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("nav", { className: className ?? "nph-toc", children: headings.map((heading) => {
4313
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("nav", { className: className ?? "nph-toc", children: headings.map((heading) => {
4252
4314
  const isActive = activeId === heading.id;
4253
4315
  const itemClass = [
4254
4316
  itemClassName ?? "nph-toc__item",
4255
4317
  isActive ? activeClassName ?? "nph-toc__item--active" : ""
4256
4318
  ].filter(Boolean).join(" ");
4257
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4319
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
4258
4320
  "button",
4259
4321
  {
4260
4322
  type: "button",