From a3be8898728e437da41c39975ffd7fc8290da048 Mon Sep 17 00:00:00 2001
From: Gremlation <192086133+gremlation@users.noreply.github.com>
Date: Fri, 27 Dec 2024 23:30:47 +0800
Subject: [PATCH] Add Markdown table support to the Note node (#2072)

---
 package-lock.json        | 57 ++++++++++++++++++++++++++++++++++++++++
 package.json             |  4 +++
 src/assets/css/style.css | 15 +++++++++++
 src/scripts/widgets.ts   | 14 +++++++++-
 4 files changed, 89 insertions(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index ae4d198a0..3569c00d6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,6 +15,10 @@
         "@primevue/themes": "^4.0.5",
         "@tiptap/core": "^2.10.4",
         "@tiptap/extension-link": "^2.10.4",
+        "@tiptap/extension-table": "^2.10.4",
+        "@tiptap/extension-table-cell": "^2.10.4",
+        "@tiptap/extension-table-header": "^2.10.4",
+        "@tiptap/extension-table-row": "^2.10.4",
         "@tiptap/starter-kit": "^2.10.4",
         "@vueuse/core": "^11.0.0",
         "@xterm/addon-fit": "^0.10.0",
@@ -4762,6 +4766,59 @@
         "@tiptap/core": "^2.7.0"
       }
     },
+    "node_modules/@tiptap/extension-table": {
+      "version": "2.10.4",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table/-/extension-table-2.10.4.tgz",
+      "integrity": "sha512-ak1RT8n0WQFNnVsZ9e6QFLWlRQP0IjT+Yp/PTsx5fSmqkiiwQKGs1ILCJWlBB3H0hV7N69aaOtK3h/35lmqoEg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0",
+        "@tiptap/pm": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-table-cell": {
+      "version": "2.10.4",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table-cell/-/extension-table-cell-2.10.4.tgz",
+      "integrity": "sha512-vYwRYt3xPaAU4hxoz3OMGPQzcAxaxEVri6VSRMWg4BN3x4DwWevBTAk59Ho9nkJpaRuXO6c5pIxcwWCZM0Aw0w==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-table-header": {
+      "version": "2.10.4",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table-header/-/extension-table-header-2.10.4.tgz",
+      "integrity": "sha512-NVi/KMBh9IAzpukjptCsH+gibZB3VxgCc+wuFk41QqI5ABnTPKWflnQ0wRo7IC6wC/tUi4YBahh20dL/wBJn3w==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-table-row": {
+      "version": "2.10.4",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table-row/-/extension-table-row-2.10.4.tgz",
+      "integrity": "sha512-kpQQSZQNYHhencIk+lzs+zWtgg6nUXHIVQKZUg5dVT0VP2JNO7wPM6d8HgnscvxOkJNRVF/Q5dYe0Cb4tROIKg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
     "node_modules/@tiptap/extension-text": {
       "version": "2.10.4",
       "resolved": "https://registry.npmjs.org/@tiptap/extension-text/-/extension-text-2.10.4.tgz",
diff --git a/package.json b/package.json
index 4ef0585a1..133d736a1 100644
--- a/package.json
+++ b/package.json
@@ -87,6 +87,10 @@
     "@primevue/themes": "^4.0.5",
     "@tiptap/core": "^2.10.4",
     "@tiptap/extension-link": "^2.10.4",
+    "@tiptap/extension-table": "^2.10.4",
+    "@tiptap/extension-table-cell": "^2.10.4",
+    "@tiptap/extension-table-header": "^2.10.4",
+    "@tiptap/extension-table-row": "^2.10.4",
     "@tiptap/starter-kit": "^2.10.4",
     "@vueuse/core": "^11.0.0",
     "@xterm/addon-fit": "^0.10.0",
diff --git a/src/assets/css/style.css b/src/assets/css/style.css
index 45eebee4f..736a808c3 100644
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -197,6 +197,21 @@ body {
   padding: 0.5em;
 }
 
+.comfy-markdown .tiptap table {
+  border-collapse: collapse;
+}
+
+.comfy-markdown .tiptap th {
+  text-align: left;
+  background: var(--comfy-menu-bg);
+}
+
+.comfy-markdown .tiptap th,
+.comfy-markdown .tiptap td {
+  padding: 0.5em;
+  border: thin solid;
+}
+
 .comfy-modal {
   display: none; /* Hidden by default */
   position: fixed; /* Stay in place */
diff --git a/src/scripts/widgets.ts b/src/scripts/widgets.ts
index 2a431d56f..795a057dc 100644
--- a/src/scripts/widgets.ts
+++ b/src/scripts/widgets.ts
@@ -11,6 +11,10 @@ import { Editor as TiptapEditor } from '@tiptap/core'
 import TiptapStarterKit from '@tiptap/starter-kit'
 import { Markdown as TiptapMarkdown } from 'tiptap-markdown'
 import TiptapLink from '@tiptap/extension-link'
+import TiptapTable from '@tiptap/extension-table'
+import TiptapTableCell from '@tiptap/extension-table-cell'
+import TiptapTableHeader from '@tiptap/extension-table-header'
+import TiptapTableRow from '@tiptap/extension-table-row'
 
 export type ComfyWidgetConstructor = (
   node: LGraphNode,
@@ -373,7 +377,15 @@ function addMarkdownWidget(node, name: string, opts, app: ComfyApp) {
     transformPastedText: true
   })
   const editor = new TiptapEditor({
-    extensions: [TiptapStarterKit, TiptapMarkdown, TiptapLink],
+    extensions: [
+      TiptapStarterKit,
+      TiptapMarkdown,
+      TiptapLink,
+      TiptapTable,
+      TiptapTableCell,
+      TiptapTableHeader,
+      TiptapTableRow
+    ],
     content: opts.defaultVal,
     editable: false
   })