Adding the rich text widget

Adding spinner to unloaded form (data or schema)
Adding a theme to the ts app
2025-04-21 01:30:16 +02:00 · 2025-04-21 01:29:45 +02:00 · 2025-04-21 01:28:54 +02:00
11 changed files with 1264 additions and 8 deletions
--- a/gui/rpk-gui/package-lock.json
+++ b/gui/rpk-gui/package-lock.json
@@ -26,7 +26,17 @@
        "@rjsf/mui": "^5.24.1",
        "@rjsf/utils": "^5.24.1",
        "@rjsf/validator-ajv8": "^5.24.1",
+        "@tiptap/extension-bubble-menu": "^2.11.7",
+        "@tiptap/extension-table": "^2.11.7",
+        "@tiptap/extension-table-cell": "^2.11.7",
+        "@tiptap/extension-table-header": "^2.11.7",
+        "@tiptap/extension-table-row": "^2.11.7",
+        "@tiptap/extension-text-align": "^2.11.7",
+        "@tiptap/extension-underline": "^2.11.7",
+        "@tiptap/react": "^2.11.7",
+        "@tiptap/starter-kit": "^2.11.7",
        "lodash": "^4.17.21",
+        "mui-tiptap": "^1.18.1",
        "react": "^18.0.0",
        "react-dom": "^18.0.0",
        "react-hook-form": "^7.30.0",
@@ -2520,6 +2530,12 @@
        "react-dom": "^17.0.0 || ^18.0.0"
      }
    },
+    "node_modules/@remirror/core-constants": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@remirror/core-constants/-/core-constants-3.0.0.tgz",
+      "integrity": "sha512-42aWfPrimMfDKDi4YegyS7x+/0tlzaqwPQCULLanv3DMIlu96KTJR0fM5isWX2UViOqlGnX6YFgqWepcX+XMNg==",
+      "license": "MIT"
+    },
    "node_modules/@rjsf/core": {
      "version": "5.24.8",
      "resolved": "https://registry.npmjs.org/@rjsf/core/-/core-5.24.8.tgz",
@@ -2930,6 +2946,470 @@
        }
      }
    },
+    "node_modules/@tiptap/core": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/core/-/core-2.11.7.tgz",
+      "integrity": "sha512-zN+NFFxLsxNEL8Qioc+DL6b8+Tt2bmRbXH22Gk6F6nD30x83eaUSFlSv3wqvgyCq3I1i1NO394So+Agmayx6rQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/pm": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-blockquote": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-blockquote/-/extension-blockquote-2.11.7.tgz",
+      "integrity": "sha512-liD8kWowl3CcYCG9JQlVx1eSNc/aHlt6JpVsuWvzq6J8APWX693i3+zFqyK2eCDn0k+vW62muhSBe3u09hA3Zw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-bold": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-bold/-/extension-bold-2.11.7.tgz",
+      "integrity": "sha512-VTR3JlldBixXbjpLTFme/Bxf1xeUgZZY3LTlt5JDlCW3CxO7k05CIa+kEZ8LXpog5annytZDUVtWqxrNjmsuHQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-bubble-menu": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-bubble-menu/-/extension-bubble-menu-2.11.7.tgz",
+      "integrity": "sha512-0vYqSUSSap3kk3/VT4tFE1/6StX70I3/NKQ4J68ZSFgkgyB3ZVlYv7/dY3AkEukjsEp3yN7m8Gw8ei2eEwyzwg==",
+      "license": "MIT",
+      "dependencies": {
+        "tippy.js": "^6.3.7"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0",
+        "@tiptap/pm": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-bullet-list": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-bullet-list/-/extension-bullet-list-2.11.7.tgz",
+      "integrity": "sha512-WbPogE2/Q3e3/QYgbT1Sj4KQUfGAJNc5pvb7GrUbvRQsAh7HhtuO8hqdDwH8dEdD/cNUehgt17TO7u8qV6qeBw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-code": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-code/-/extension-code-2.11.7.tgz",
+      "integrity": "sha512-VpPO1Uy/eF4hYOpohS/yMOcE1C07xmMj0/D989D9aS1x95jWwUVrSkwC+PlWMUBx9PbY2NRsg1ZDwVvlNKZ6yQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-code-block": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-code-block/-/extension-code-block-2.11.7.tgz",
+      "integrity": "sha512-To/y/2H04VWqiANy53aXjV7S6fA86c2759RsH1hTIe57jA1KyE7I5tlAofljOLZK/covkGmPeBddSPHGJbz++Q==",
+      "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-document": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-document/-/extension-document-2.11.7.tgz",
+      "integrity": "sha512-95ouJXPjdAm9+VBRgFo4lhDoMcHovyl/awORDI8gyEn0Rdglt+ZRZYoySFzbVzer9h0cre+QdIwr9AIzFFbfdA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-dropcursor": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-dropcursor/-/extension-dropcursor-2.11.7.tgz",
+      "integrity": "sha512-63mL+nxQILizsr5NbmgDeOjFEWi34BLt7evwL6UUZEVM15K8V1G8pD9Y0kCXrZYpHWz0tqFRXdrhDz0Ppu8oVw==",
+      "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-floating-menu": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-floating-menu/-/extension-floating-menu-2.11.7.tgz",
+      "integrity": "sha512-DG54WoUu2vxHRVzKZiR5I5RMOYj45IlxQMkBAx1wjS0ch41W8DUYEeipvMMjCeKtEI+emz03xYUcOAP9LRmg+w==",
+      "license": "MIT",
+      "dependencies": {
+        "tippy.js": "^6.3.7"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0",
+        "@tiptap/pm": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-gapcursor": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-gapcursor/-/extension-gapcursor-2.11.7.tgz",
+      "integrity": "sha512-EceesmPG7FyjXZ8EgeJPUov9G1mAf2AwdypxBNH275g6xd5dmU/KvjoFZjmQ0X1ve7mS+wNupVlGxAEUYoveew==",
+      "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-hard-break": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-hard-break/-/extension-hard-break-2.11.7.tgz",
+      "integrity": "sha512-zTkZSA6q+F5sLOdCkiC2+RqJQN0zdsJqvFIOVFL/IDVOnq6PZO5THzwRRLvOSnJJl3edRQCl/hUgS0L5sTInGQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-heading": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-heading/-/extension-heading-2.11.7.tgz",
+      "integrity": "sha512-8kWh7y4Rd2fwxfWOhFFWncHdkDkMC1Z60yzIZWjIu72+6yQxvo8w3yeb7LI7jER4kffbMmadgcfhCHC/fkObBA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-history": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-history/-/extension-history-2.11.7.tgz",
+      "integrity": "sha512-Cu5x3aS13I040QSRoLdd+w09G4OCVfU+azpUqxufZxeNs9BIJC+0jowPLeOxKDh6D5GGT2A8sQtxc6a/ssbs8g==",
+      "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-horizontal-rule": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-horizontal-rule/-/extension-horizontal-rule-2.11.7.tgz",
+      "integrity": "sha512-uVmQwD2dzZ5xwmvUlciy0ItxOdOfQjH6VLmu80zyJf8Yu7mvwP8JyxoXUX0vd1xHpwAhgQ9/ozjIWYGIw79DPQ==",
+      "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-italic": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-italic/-/extension-italic-2.11.7.tgz",
+      "integrity": "sha512-r985bkQfG0HMpmCU0X0p/Xe7U1qgRm2mxvcp6iPCuts2FqxaCoyfNZ8YnMsgVK1mRhM7+CQ5SEg2NOmQNtHvPw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-list-item": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-list-item/-/extension-list-item-2.11.7.tgz",
+      "integrity": "sha512-6ikh7Y+qAbkSuIHXPIINqfzmWs5uIGrylihdZ9adaIyvrN1KSnWIqrZIk/NcZTg5YFIJlXrnGSRSjb/QM3WUhw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-ordered-list": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-ordered-list/-/extension-ordered-list-2.11.7.tgz",
+      "integrity": "sha512-bLGCHDMB0vbJk7uu8bRg8vES3GsvxkX7Cgjgm/6xysHFbK98y0asDtNxkW1VvuRreNGz4tyB6vkcVCfrxl4jKw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-paragraph": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-paragraph/-/extension-paragraph-2.11.7.tgz",
+      "integrity": "sha512-Pl3B4q6DJqTvvAdraqZaNP9Hh0UWEHL5nNdxhaRNuhKaUo7lq8wbDSIxIW3lvV0lyCs0NfyunkUvSm1CXb6d4Q==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-strike": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-strike/-/extension-strike-2.11.7.tgz",
+      "integrity": "sha512-D6GYiW9F24bvAY7XMOARNZbC8YGPzdzWdXd8VOOJABhf4ynMi/oW4NNiko+kZ67jn3EGaKoz32VMJzNQgYi1HA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-table": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table/-/extension-table-2.11.7.tgz",
+      "integrity": "sha512-rfwWkNXz/EZuhc8lylsCWPbx0Xr5FlIhreWFyeoXYrDEO3x4ytYcVOpNmbabJYP2semfM0PvPR5o84zfFkLZyg==",
+      "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.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table-cell/-/extension-table-cell-2.11.7.tgz",
+      "integrity": "sha512-JMOkSYRckc5SJP86yGGiHzCxCR8ecrRENvTWAKib6qer2tutxs5u42W+Z8uTcHC2dRz7Fv54snOkDoqPwkf6cw==",
+      "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.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table-header/-/extension-table-header-2.11.7.tgz",
+      "integrity": "sha512-wPRKpliS5QQXgsp//ZjXrHMdLICMkjg2fUrQinOiBa7wDL5C7Y+SehtuK4s2tjeAkyAdj+nepfftyBRIlUSMXg==",
+      "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.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-table-row/-/extension-table-row-2.11.7.tgz",
+      "integrity": "sha512-K254RiXWGXGjz5Cm835hqfQiwnYXm8aw6oOa3isDh4A1B+1Ev4DB2vEDKMrgaOor3nbTsSYmAx2iEMrZSbpaRg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-text": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-text/-/extension-text-2.11.7.tgz",
+      "integrity": "sha512-wObCn8qZkIFnXTLvBP+X8KgaEvTap/FJ/i4hBMfHBCKPGDx99KiJU6VIbDXG8d5ZcFZE0tOetK1pP5oI7qgMlQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-text-align": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-text-align/-/extension-text-align-2.11.7.tgz",
+      "integrity": "sha512-3M8zd9ROADXazVNpgR6Ejs1evSvBveN36qN4GgV71GqrNlTcjqYgQcXFLQrsd2hnE+aXir8/8bLJ+aaJXDninA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-text-style": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-text-style/-/extension-text-style-2.11.7.tgz",
+      "integrity": "sha512-LHO6DBg/9SkCQFdWlVfw9nolUmw+Cid94WkTY+7IwrpyG2+ZGQxnKpCJCKyeaFNbDoYAtvu0vuTsSXeCkgShcA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/extension-underline": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/extension-underline/-/extension-underline-2.11.7.tgz",
+      "integrity": "sha512-NtoQw6PGijOAtXC6G+0Aq0/Z5wwEjPhNHs8nsjXogfWIgaj/aI4/zfBnA06eI3WT+emMYQTl0fTc4CUPnLVU8g==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0"
+      }
+    },
+    "node_modules/@tiptap/pm": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/pm/-/pm-2.11.7.tgz",
+      "integrity": "sha512-7gEEfz2Q6bYKXM07vzLUD0vqXFhC5geWRA6LCozTiLdVFDdHWiBrvb2rtkL5T7mfLq03zc1QhH7rI3F6VntOEA==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-changeset": "^2.2.1",
+        "prosemirror-collab": "^1.3.1",
+        "prosemirror-commands": "^1.6.2",
+        "prosemirror-dropcursor": "^1.8.1",
+        "prosemirror-gapcursor": "^1.3.2",
+        "prosemirror-history": "^1.4.1",
+        "prosemirror-inputrules": "^1.4.0",
+        "prosemirror-keymap": "^1.2.2",
+        "prosemirror-markdown": "^1.13.1",
+        "prosemirror-menu": "^1.2.4",
+        "prosemirror-model": "^1.23.0",
+        "prosemirror-schema-basic": "^1.2.3",
+        "prosemirror-schema-list": "^1.4.1",
+        "prosemirror-state": "^1.4.3",
+        "prosemirror-tables": "^1.6.4",
+        "prosemirror-trailing-node": "^3.0.0",
+        "prosemirror-transform": "^1.10.2",
+        "prosemirror-view": "^1.37.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      }
+    },
+    "node_modules/@tiptap/react": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/react/-/react-2.11.7.tgz",
+      "integrity": "sha512-gQZEUkAoPsBptnB4T2gAtiUxswjVGhfsM9vOElQco+b11DYmy110T2Zuhg+2YGvB/CG3RoWJx34808P0FX1ijA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tiptap/extension-bubble-menu": "^2.11.7",
+        "@tiptap/extension-floating-menu": "^2.11.7",
+        "@types/use-sync-external-store": "^0.0.6",
+        "fast-deep-equal": "^3",
+        "use-sync-external-store": "^1"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      },
+      "peerDependencies": {
+        "@tiptap/core": "^2.7.0",
+        "@tiptap/pm": "^2.7.0",
+        "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/@tiptap/starter-kit": {
+      "version": "2.11.7",
+      "resolved": "https://registry.npmjs.org/@tiptap/starter-kit/-/starter-kit-2.11.7.tgz",
+      "integrity": "sha512-K+q51KwNU/l0kqRuV5e1824yOLVftj6kGplGQLvJG56P7Rb2dPbM/JeaDbxQhnHT/KDGamG0s0Po0M3pPY163A==",
+      "license": "MIT",
+      "dependencies": {
+        "@tiptap/core": "^2.11.7",
+        "@tiptap/extension-blockquote": "^2.11.7",
+        "@tiptap/extension-bold": "^2.11.7",
+        "@tiptap/extension-bullet-list": "^2.11.7",
+        "@tiptap/extension-code": "^2.11.7",
+        "@tiptap/extension-code-block": "^2.11.7",
+        "@tiptap/extension-document": "^2.11.7",
+        "@tiptap/extension-dropcursor": "^2.11.7",
+        "@tiptap/extension-gapcursor": "^2.11.7",
+        "@tiptap/extension-hard-break": "^2.11.7",
+        "@tiptap/extension-heading": "^2.11.7",
+        "@tiptap/extension-history": "^2.11.7",
+        "@tiptap/extension-horizontal-rule": "^2.11.7",
+        "@tiptap/extension-italic": "^2.11.7",
+        "@tiptap/extension-list-item": "^2.11.7",
+        "@tiptap/extension-ordered-list": "^2.11.7",
+        "@tiptap/extension-paragraph": "^2.11.7",
+        "@tiptap/extension-strike": "^2.11.7",
+        "@tiptap/extension-text": "^2.11.7",
+        "@tiptap/extension-text-style": "^2.11.7",
+        "@tiptap/pm": "^2.11.7"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/ueberdosis"
+      }
+    },
    "node_modules/@types/babel__core": {
      "version": "7.20.5",
      "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -3013,6 +3493,12 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/@types/linkify-it": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
+      "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==",
+      "license": "MIT"
+    },
    "node_modules/@types/lodash": {
      "version": "4.17.16",
      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.16.tgz",
@@ -3020,6 +3506,16 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/@types/markdown-it": {
+      "version": "14.1.2",
+      "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.2.tgz",
+      "integrity": "sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/linkify-it": "^5",
+        "@types/mdurl": "^2"
+      }
+    },
    "node_modules/@types/mdast": {
      "version": "3.0.15",
      "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-3.0.15.tgz",
@@ -3029,6 +3525,12 @@
        "@types/unist": "^2"
      }
    },
+    "node_modules/@types/mdurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz",
+      "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==",
+      "license": "MIT"
+    },
    "node_modules/@types/node": {
      "version": "18.19.86",
      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.86.tgz",
@@ -3093,6 +3595,12 @@
      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==",
      "license": "MIT"
    },
+    "node_modules/@types/use-sync-external-store": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
+      "integrity": "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==",
+      "license": "MIT"
+    },
    "node_modules/@typescript-eslint/eslint-plugin": {
      "version": "5.62.0",
      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz",
@@ -3469,7 +3977,6 @@
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
-      "dev": true,
      "license": "Python-2.0"
    },
    "node_modules/array-flatten": {
@@ -4209,6 +4716,12 @@
        "node": ">=10"
      }
    },
+    "node_modules/crelt": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/crelt/-/crelt-1.0.6.tgz",
+      "integrity": "sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==",
+      "license": "MIT"
+    },
    "node_modules/cross-spawn": {
      "version": "7.0.6",
      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -6648,6 +7161,15 @@
      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
      "license": "MIT"
    },
+    "node_modules/linkify-it": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
+      "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==",
+      "license": "MIT",
+      "dependencies": {
+        "uc.micro": "^2.0.0"
+      }
+    },
    "node_modules/load-yaml-file": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/load-yaml-file/-/load-yaml-file-0.2.0.tgz",
@@ -6794,6 +7316,29 @@
        "semver": "bin/semver"
      }
    },
+    "node_modules/markdown-it": {
+      "version": "14.1.0",
+      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
+      "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1",
+        "entities": "^4.4.0",
+        "linkify-it": "^5.0.0",
+        "mdurl": "^2.0.0",
+        "punycode.js": "^2.3.1",
+        "uc.micro": "^2.1.0"
+      },
+      "bin": {
+        "markdown-it": "bin/markdown-it.mjs"
+      }
+    },
+    "node_modules/markdown-it/node_modules/mdurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz",
+      "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==",
+      "license": "MIT"
+    },
    "node_modules/markdown-table": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/markdown-table/-/markdown-table-2.0.0.tgz",
@@ -7300,6 +7845,56 @@
      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
      "license": "MIT"
    },
+    "node_modules/mui-tiptap": {
+      "version": "1.18.1",
+      "resolved": "https://registry.npmjs.org/mui-tiptap/-/mui-tiptap-1.18.1.tgz",
+      "integrity": "sha512-ttv75IOUOrcpcPyHQgFQLMKsIcMkppbAfHyjUJOQX3qG0dW0Ait+noaCLFJShU2MjhX2IaqKfFW4MtVhZsYJ9w==",
+      "license": "MIT",
+      "dependencies": {
+        "encodeurl": "^1.0.2",
+        "lodash": "^4.17.21",
+        "react-colorful": "^5.6.1",
+        "tss-react": "^4.8.3",
+        "type-fest": "^3.12.0"
+      },
+      "engines": {
+        "pnpm": ">=9"
+      },
+      "peerDependencies": {
+        "@emotion/react": "^11.4.1",
+        "@mui/icons-material": "^5.0.0 || ^6.0.0 || ^7.0.0",
+        "@mui/material": "^5.0.1 || ^6.0.0 || ^7.0.0",
+        "@tiptap/core": "^2.0.0-beta.210",
+        "@tiptap/extension-heading": "^2.0.0-beta.210",
+        "@tiptap/extension-image": "^2.0.0-beta.210",
+        "@tiptap/extension-table": "^2.0.0-beta.210",
+        "@tiptap/pm": "^2.0.0-beta.210",
+        "@tiptap/react": "^2.0.0-beta.210",
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/mui-tiptap/node_modules/encodeurl": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
+      "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/mui-tiptap/node_modules/type-fest": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
+      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
    "node_modules/mute-stream": {
      "version": "0.0.8",
      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz",
@@ -7637,6 +8232,12 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/orderedmap": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/orderedmap/-/orderedmap-2.1.1.tgz",
+      "integrity": "sha512-TvAWxi0nDe1j/rtMcWcIj94+Ffe6n7zhow33h40SKxmsmozs6dz/e+EajymfoFcHd7sxNn8yHM8839uixMOV6g==",
+      "license": "MIT"
+    },
    "node_modules/os-tmpdir": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
@@ -8153,6 +8754,201 @@
        "url": "https://github.com/sponsors/wooorm"
      }
    },
+    "node_modules/prosemirror-changeset": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-changeset/-/prosemirror-changeset-2.2.1.tgz",
+      "integrity": "sha512-J7msc6wbxB4ekDFj+n9gTW/jav/p53kdlivvuppHsrZXCaQdVgRghoZbSS3kwrRyAstRVQ4/+u5k7YfLgkkQvQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-transform": "^1.0.0"
+      }
+    },
+    "node_modules/prosemirror-collab": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-collab/-/prosemirror-collab-1.3.1.tgz",
+      "integrity": "sha512-4SnynYR9TTYaQVXd/ieUvsVV4PDMBzrq2xPUWutHivDuOshZXqQ5rGbZM84HEaXKbLdItse7weMGOUdDVcLKEQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-state": "^1.0.0"
+      }
+    },
+    "node_modules/prosemirror-commands": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-commands/-/prosemirror-commands-1.7.1.tgz",
+      "integrity": "sha512-rT7qZnQtx5c0/y/KlYaGvtG411S97UaL6gdp6RIZ23DLHanMYLyfGBV5DtSnZdthQql7W+lEVbpSfwtO8T+L2w==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-model": "^1.0.0",
+        "prosemirror-state": "^1.0.0",
+        "prosemirror-transform": "^1.10.2"
+      }
+    },
+    "node_modules/prosemirror-dropcursor": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-dropcursor/-/prosemirror-dropcursor-1.8.1.tgz",
+      "integrity": "sha512-M30WJdJZLyXHi3N8vxN6Zh5O8ZBbQCz0gURTfPmTIBNQ5pxrdU7A58QkNqfa98YEjSAL1HUyyU34f6Pm5xBSGw==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-state": "^1.0.0",
+        "prosemirror-transform": "^1.1.0",
+        "prosemirror-view": "^1.1.0"
+      }
+    },
+    "node_modules/prosemirror-gapcursor": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/prosemirror-gapcursor/-/prosemirror-gapcursor-1.3.2.tgz",
+      "integrity": "sha512-wtjswVBd2vaQRrnYZaBCbyDqr232Ed4p2QPtRIUK5FuqHYKGWkEwl08oQM4Tw7DOR0FsasARV5uJFvMZWxdNxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-keymap": "^1.0.0",
+        "prosemirror-model": "^1.0.0",
+        "prosemirror-state": "^1.0.0",
+        "prosemirror-view": "^1.0.0"
+      }
+    },
+    "node_modules/prosemirror-history": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-history/-/prosemirror-history-1.4.1.tgz",
+      "integrity": "sha512-2JZD8z2JviJrboD9cPuX/Sv/1ChFng+xh2tChQ2X4bB2HeK+rra/bmJ3xGntCcjhOqIzSDG6Id7e8RJ9QPXLEQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-state": "^1.2.2",
+        "prosemirror-transform": "^1.0.0",
+        "prosemirror-view": "^1.31.0",
+        "rope-sequence": "^1.3.0"
+      }
+    },
+    "node_modules/prosemirror-inputrules": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/prosemirror-inputrules/-/prosemirror-inputrules-1.5.0.tgz",
+      "integrity": "sha512-K0xJRCmt+uSw7xesnHmcn72yBGTbY45vm8gXI4LZXbx2Z0jwh5aF9xrGQgrVPu0WbyFVFF3E/o9VhJYz6SQWnA==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-state": "^1.0.0",
+        "prosemirror-transform": "^1.0.0"
+      }
+    },
+    "node_modules/prosemirror-keymap": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/prosemirror-keymap/-/prosemirror-keymap-1.2.2.tgz",
+      "integrity": "sha512-EAlXoksqC6Vbocqc0GtzCruZEzYgrn+iiGnNjsJsH4mrnIGex4qbLdWWNza3AW5W36ZRrlBID0eM6bdKH4OStQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-state": "^1.0.0",
+        "w3c-keyname": "^2.2.0"
+      }
+    },
+    "node_modules/prosemirror-markdown": {
+      "version": "1.13.2",
+      "resolved": "https://registry.npmjs.org/prosemirror-markdown/-/prosemirror-markdown-1.13.2.tgz",
+      "integrity": "sha512-FPD9rHPdA9fqzNmIIDhhnYQ6WgNoSWX9StUZ8LEKapaXU9i6XgykaHKhp6XMyXlOWetmaFgGDS/nu/w9/vUc5g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/markdown-it": "^14.0.0",
+        "markdown-it": "^14.0.0",
+        "prosemirror-model": "^1.25.0"
+      }
+    },
+    "node_modules/prosemirror-menu": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/prosemirror-menu/-/prosemirror-menu-1.2.4.tgz",
+      "integrity": "sha512-S/bXlc0ODQup6aiBbWVsX/eM+xJgCTAfMq/nLqaO5ID/am4wS0tTCIkzwytmao7ypEtjj39i7YbJjAgO20mIqA==",
+      "license": "MIT",
+      "dependencies": {
+        "crelt": "^1.0.0",
+        "prosemirror-commands": "^1.0.0",
+        "prosemirror-history": "^1.0.0",
+        "prosemirror-state": "^1.0.0"
+      }
+    },
+    "node_modules/prosemirror-model": {
+      "version": "1.25.0",
+      "resolved": "https://registry.npmjs.org/prosemirror-model/-/prosemirror-model-1.25.0.tgz",
+      "integrity": "sha512-/8XUmxWf0pkj2BmtqZHYJipTBMHIdVjuvFzMvEoxrtyGNmfvdhBiRwYt/eFwy2wA9DtBW3RLqvZnjurEkHaFCw==",
+      "license": "MIT",
+      "dependencies": {
+        "orderedmap": "^2.0.0"
+      }
+    },
+    "node_modules/prosemirror-schema-basic": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/prosemirror-schema-basic/-/prosemirror-schema-basic-1.2.4.tgz",
+      "integrity": "sha512-ELxP4TlX3yr2v5rM7Sb70SqStq5NvI15c0j9j/gjsrO5vaw+fnnpovCLEGIcpeGfifkuqJwl4fon6b+KdrODYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-model": "^1.25.0"
+      }
+    },
+    "node_modules/prosemirror-schema-list": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-schema-list/-/prosemirror-schema-list-1.5.1.tgz",
+      "integrity": "sha512-927lFx/uwyQaGwJxLWCZRkjXG0p48KpMj6ueoYiu4JX05GGuGcgzAy62dfiV8eFZftgyBUvLx76RsMe20fJl+Q==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-model": "^1.0.0",
+        "prosemirror-state": "^1.0.0",
+        "prosemirror-transform": "^1.7.3"
+      }
+    },
+    "node_modules/prosemirror-state": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/prosemirror-state/-/prosemirror-state-1.4.3.tgz",
+      "integrity": "sha512-goFKORVbvPuAQaXhpbemJFRKJ2aixr+AZMGiquiqKxaucC6hlpHNZHWgz5R7dS4roHiwq9vDctE//CZ++o0W1Q==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-model": "^1.0.0",
+        "prosemirror-transform": "^1.0.0",
+        "prosemirror-view": "^1.27.0"
+      }
+    },
+    "node_modules/prosemirror-tables": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-tables/-/prosemirror-tables-1.7.1.tgz",
+      "integrity": "sha512-eRQ97Bf+i9Eby99QbyAiyov43iOKgWa7QCGly+lrDt7efZ1v8NWolhXiB43hSDGIXT1UXgbs4KJN3a06FGpr1Q==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-keymap": "^1.2.2",
+        "prosemirror-model": "^1.25.0",
+        "prosemirror-state": "^1.4.3",
+        "prosemirror-transform": "^1.10.3",
+        "prosemirror-view": "^1.39.1"
+      }
+    },
+    "node_modules/prosemirror-trailing-node": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/prosemirror-trailing-node/-/prosemirror-trailing-node-3.0.0.tgz",
+      "integrity": "sha512-xiun5/3q0w5eRnGYfNlW1uU9W6x5MoFKWwq/0TIRgt09lv7Hcser2QYV8t4muXbEr+Fwo0geYn79Xs4GKywrRQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@remirror/core-constants": "3.0.0",
+        "escape-string-regexp": "^4.0.0"
+      },
+      "peerDependencies": {
+        "prosemirror-model": "^1.22.1",
+        "prosemirror-state": "^1.4.2",
+        "prosemirror-view": "^1.33.8"
+      }
+    },
+    "node_modules/prosemirror-transform": {
+      "version": "1.10.3",
+      "resolved": "https://registry.npmjs.org/prosemirror-transform/-/prosemirror-transform-1.10.3.tgz",
+      "integrity": "sha512-Nhh/+1kZGRINbEHmVu39oynhcap4hWTs/BlU7NnxWj3+l0qi8I1mu67v6mMdEe/ltD8hHvU4FV6PHiCw2VSpMw==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-model": "^1.21.0"
+      }
+    },
+    "node_modules/prosemirror-view": {
+      "version": "1.39.1",
+      "resolved": "https://registry.npmjs.org/prosemirror-view/-/prosemirror-view-1.39.1.tgz",
+      "integrity": "sha512-GhLxH1xwnqa5VjhJ29LfcQITNDp+f1jzmMPXQfGW9oNrF0lfjPzKvV5y/bjIQkyKpwCX3Fp+GA4dBpMMk8g+ZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "prosemirror-model": "^1.20.0",
+        "prosemirror-state": "^1.0.0",
+        "prosemirror-transform": "^1.1.0"
+      }
+    },
    "node_modules/proxy-addr": {
      "version": "2.0.7",
      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
@@ -8182,6 +8978,15 @@
        "node": ">=6"
      }
    },
+    "node_modules/punycode.js": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz",
+      "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
    "node_modules/qs": {
      "version": "6.14.0",
      "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz",
@@ -8271,6 +9076,16 @@
        "node": ">=0.10.0"
      }
    },
+    "node_modules/react-colorful": {
+      "version": "5.6.1",
+      "resolved": "https://registry.npmjs.org/react-colorful/-/react-colorful-5.6.1.tgz",
+      "integrity": "sha512-1exovf0uGTGyq5mXQT0zgQ80uvj2PCwvF8zY1RN9/vbJVSjSo3fsB/4L3ObbF7u70NduSiK4xu4Y6q1MHoUGEw==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": ">=16.8.0",
+        "react-dom": ">=16.8.0"
+      }
+    },
    "node_modules/react-dom": {
      "version": "18.3.1",
      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
@@ -8695,6 +9510,12 @@
        "fsevents": "~2.3.2"
      }
    },
+    "node_modules/rope-sequence": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/rope-sequence/-/rope-sequence-1.3.4.tgz",
+      "integrity": "sha512-UT5EDe2cu2E/6O4igUr5PSFs23nvvukicWHx6GnOPlHAiiYbzNuCRQCuiUdHJQcqKalLKlrYJnjY0ySGsXNQXQ==",
+      "license": "MIT"
+    },
    "node_modules/run-async": {
      "version": "2.4.1",
      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
@@ -9419,6 +10240,15 @@
      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
      "license": "MIT"
    },
+    "node_modules/tippy.js": {
+      "version": "6.3.7",
+      "resolved": "https://registry.npmjs.org/tippy.js/-/tippy.js-6.3.7.tgz",
+      "integrity": "sha512-E1d3oP2emgJ9dRQZdf3Kkn0qJgI6ZLpyS5z6ZkY1DF3kaQaBsGZsndEpHwx+eC+tYM41HaSNvNtLx8tU57FzTQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@popperjs/core": "^2.9.0"
+      }
+    },
    "node_modules/tmp": {
      "version": "0.0.33",
      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
@@ -9474,6 +10304,32 @@
      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
      "license": "0BSD"
    },
+    "node_modules/tss-react": {
+      "version": "4.9.16",
+      "resolved": "https://registry.npmjs.org/tss-react/-/tss-react-4.9.16.tgz",
+      "integrity": "sha512-7g9B96gdmR7klrYcslLdw0maeyS+PnWsID28eBkKQEbEJNbMjlgvgTFlGUyURrfafmbpkfjRzE5+lDMRT91LEQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@emotion/cache": "*",
+        "@emotion/serialize": "*",
+        "@emotion/utils": "*"
+      },
+      "peerDependencies": {
+        "@emotion/react": "^11.4.1",
+        "@emotion/server": "^11.4.0",
+        "@mui/material": "^5.0.0 || ^6.0.0 || ^7.0.0",
+        "@types/react": "^16.8.0 || ^17.0.2 || ^18.0.0 || ^19.0.0",
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@emotion/server": {
+          "optional": true
+        },
+        "@mui/material": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/tsutils": {
      "version": "3.21.0",
      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz",
@@ -9555,6 +10411,12 @@
        "node": ">=14.17"
      }
    },
+    "node_modules/uc.micro": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
+      "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==",
+      "license": "MIT"
+    },
    "node_modules/uglify-js": {
      "version": "3.19.3",
      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.19.3.tgz",
@@ -9928,6 +10790,12 @@
        }
      }
    },
+    "node_modules/w3c-keyname": {
+      "version": "2.2.8",
+      "resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.8.tgz",
+      "integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==",
+      "license": "MIT"
+    },
    "node_modules/warn-once": {
      "version": "0.1.1",
      "resolved": "https://registry.npmjs.org/warn-once/-/warn-once-0.1.1.tgz",
--- a/gui/rpk-gui/package.json
+++ b/gui/rpk-gui/package.json
@@ -22,7 +22,17 @@
    "@rjsf/mui": "^5.24.1",
    "@rjsf/utils": "^5.24.1",
    "@rjsf/validator-ajv8": "^5.24.1",
+    "@tiptap/extension-bubble-menu": "^2.11.7",
+    "@tiptap/extension-table": "^2.11.7",
+    "@tiptap/extension-table-cell": "^2.11.7",
+    "@tiptap/extension-table-header": "^2.11.7",
+    "@tiptap/extension-table-row": "^2.11.7",
+    "@tiptap/extension-text-align": "^2.11.7",
+    "@tiptap/extension-underline": "^2.11.7",
+    "@tiptap/react": "^2.11.7",
+    "@tiptap/starter-kit": "^2.11.7",
    "lodash": "^4.17.21",
+    "mui-tiptap": "^1.18.1",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-hook-form": "^7.30.0",
--- a/gui/rpk-gui/src/App.tsx
+++ b/gui/rpk-gui/src/App.tsx
@@ -1,9 +1,6 @@
 import { Authenticated, Refine } from "@refinedev/core";

-import {
-  RefineSnackbarProvider, RefineThemes,
-  useNotificationProvider,
-} from "@refinedev/mui";
+import { RefineSnackbarProvider, useNotificationProvider } from "@refinedev/mui";

 import CssBaseline from "@mui/material/CssBaseline";
 import GlobalStyles from "@mui/material/GlobalStyles";
@@ -14,7 +11,7 @@ import routerBindings, {
  DocumentTitleHandler,
  UnsavedChangesNotifier,
 } from "@refinedev/react-router";
-import { BrowserRouter, Link, Outlet, Route, Routes } from "react-router";
+import { BrowserRouter, Outlet, Route, Routes } from "react-router";
 import { authProvider } from "./providers/auth-provider";
 import { dataProvider } from "./providers/data-provider";
 import { ColorModeContextProvider } from "./contexts/color-mode";
@@ -26,11 +23,12 @@ import { UpdatePassword } from "./components/auth/UpdatePassword";
 import { Header } from "./components";
 import { HubRoutes } from "./pages/hub";
 import { FirmRoutes } from "./pages/firm";
+import rpcTheme from "./theme";

 function App() {
  return (
    <BrowserRouter>
-      <ThemeProvider theme={RefineThemes.Blue}>
+      <ThemeProvider theme={rpcTheme}>
        <ColorModeContextProvider>
          <CssBaseline />
          <GlobalStyles styles={{ html: { WebkitFontSmoothing: "auto" } }} />
--- a/gui/rpk-gui/src/lib/LabelledOutlined.tsx
+++ b/gui/rpk-gui/src/lib/LabelledOutlined.tsx
@@ -0,0 +1,66 @@
+import React, { ReactElement, ReactNode } from "react";
+
+import clsx from "clsx";
+import { InputLabel, styled } from "@mui/material";
+import NotchedOutline from "@mui/material/OutlinedInput/NotchedOutline";
+
+const DivRoot = styled("div")(({ theme }) => ({
+  position: "relative",
+  marginTop: "8px",
+}));
+
+const DivContentWrapper = styled("div")(({ theme }) => ({
+  position: "relative",
+}));
+
+const DivContent = styled("div")(({ theme }) => ({
+  paddingTop: "1px",
+  paddingLeft: theme.spacing(1),
+  paddingRight: theme.spacing(1),
+}));
+
+const StyledInputLabel = styled(InputLabel)(({ theme }) => ({
+  position: "absolute",
+  left: 0,
+  top: 0,
+}));
+
+const StyledNotchedOutline = styled(NotchedOutline)(({ theme }) => [
+  {
+    borderRadius: theme.shape.borderRadius,
+    borderColor: theme.palette.grey["400"]
+  },
+  theme.applyStyles('dark', {
+    borderRadius: theme.shape.borderRadius,
+    borderColor: theme.palette.grey["800"]
+  })
+]);
+
+interface Props {
+  id: string;
+  label: string;
+  children: ReactNode;
+  className?: string;
+}
+
+export default function LabelledOutlined({ id, label, children, className }: Props): ReactElement {
+  const labelRef = React.useRef(null);
+  return (
+    <DivRoot className={clsx(className)}>
+      <StyledInputLabel
+        ref={labelRef}
+        htmlFor={id}
+        variant="outlined"
+        shrink
+      >
+        {label}
+      </StyledInputLabel>
+      <DivContentWrapper>
+        <DivContent id={id}>
+          {children}
+          <StyledNotchedOutline notched label={label + "*"} />
+        </DivContent>
+      </DivContentWrapper>
+    </DivRoot>
+  );
+}
--- a/gui/rpk-gui/src/lib/crud/components/crud-form.tsx
+++ b/gui/rpk-gui/src/lib/crud/components/crud-form.tsx
@@ -6,6 +6,7 @@ import { jsonschemaProvider } from "../providers/jsonschema-provider";
 import { useForm } from "@refinedev/core";
 import CrudTextWidget from "./widgets/crud-text-widget";
 import UnionEnumField from "./fields/union-enum";
+import { CircularProgress } from "@mui/material";

 type CrudFormProps = {
  schemaName: string,
@@ -54,6 +55,11 @@ export const CrudForm: React.FC<CrudFormProps> = (props) => {
    fetchSchema();
  }, []);

+
+  if(formLoading || loading) {
+    return <CircularProgress />
+  }
+
  return (
    <Form
      schema={schema}
--- a/gui/rpk-gui/src/lib/crud/components/widgets/crud-text-widget.tsx
+++ b/gui/rpk-gui/src/lib/crud/components/widgets/crud-text-widget.tsx
@@ -3,7 +3,7 @@ import { FormContextType, getTemplate, RJSFSchema, WidgetProps } from "@rjsf/uti
 import Typography from "@mui/material/Typography";

 import ForeignKeyWidget from "./foreign-key";
-import Typography from "@mui/material/Typography";
+import RichtextWidget from "./richtext";

 export type CrudTextRJSFSchema = RJSFSchema & { props? : any };

@@ -15,6 +15,8 @@ export default function CrudTextWidget<T = any, S extends CrudTextRJSFSchema = C
    return <ForeignKeyWidget {...props} />;
  } else if (schema.hasOwnProperty("const")) {
    return <Typography >{schema.const as string}</Typography>;
+  } else if (schema.props?.hasOwnProperty("richtext")) {
+    return <RichtextWidget {...props} />;
  } else {
    const { options, registry } = props;
    const BaseInputTemplate = getTemplate<'BaseInputTemplate', T, S, F>('BaseInputTemplate', registry, options);
--- a/gui/rpk-gui/src/lib/crud/components/widgets/richtext/IndentExtension.tsx
+++ b/gui/rpk-gui/src/lib/crud/components/widgets/richtext/IndentExtension.tsx
@@ -0,0 +1,119 @@
+import { Extension } from "@tiptap/core";
+
+type IndentOptions = {
+  /**
+   * @default ["paragraph", "heading"]
+   */
+  types: string[];
+  /**
+   * Amount of margin to increase and decrease the indent
+   *
+   * @default 40
+   */
+  margin: number;
+};
+
+declare module "@tiptap/core" {
+  interface Commands<ReturnType> {
+    indent: {
+      indent: () => ReturnType;
+      outdent: () => ReturnType;
+    };
+  }
+}
+
+export default Extension.create<IndentOptions>({
+  name: "indent",
+
+  defaultOptions: {
+    types: ["paragraph", "heading"],
+    margin: 40
+  },
+
+  addGlobalAttributes() {
+    return [
+      {
+        types: this.options.types,
+        attributes: {
+          indent: {
+            default: 0,
+            renderHTML: (attrs) => ({
+              style: `margin-left: ${(attrs.indent || 0) * this.options.margin}px`
+            }),
+            parseHTML: (attrs) => parseInt(attrs.style.marginLeft) / this.options.margin || 0
+          }
+        }
+      }
+    ];
+  },
+
+  addCommands() {
+    return {
+      indent:
+        () =>
+        ({ editor, chain, commands }) => {
+          // Check for a list
+          if (
+            editor.isActive("listItem") ||
+            editor.isActive("bulletList") ||
+            editor.isActive("orderedList")
+          ) {
+            return chain().sinkListItem("listItem").run();
+          }
+
+          return this.options.types
+            .map((type) => {
+              const attrs = editor.getAttributes(type).indent;
+              const indent = (attrs || 0) + 1;
+              return commands.updateAttributes(type, { indent });
+            })
+            .every(Boolean);
+        },
+      outdent:
+        () =>
+        ({ editor, chain, commands }) => {
+          // Check for a list
+          if (
+            editor.isActive("listItem") ||
+            editor.isActive("bulletList") ||
+            editor.isActive("orderedList")
+          ) {
+            return chain().liftListItem("listItem").run();
+          }
+
+          const result = this.options.types
+            .filter((type) => {
+              const attrs = editor.getAttributes(type).indent;
+              return attrs > 0;
+            })
+            .map((type) => {
+              const attrs = editor.getAttributes(type).indent;
+              const indent = (attrs || 0) - 1;
+              return commands.updateAttributes(type, { indent });
+            });
+          return result.every(Boolean) && result.length > 0;
+        }
+    };
+  },
+
+  // addKeyboardShortcuts() {
+  //   return {
+  //     Tab: ({ editor }) => {
+  //       return editor.commands.indent();
+  //     },
+  //     "Shift-Tab": ({ editor }) => {
+  //       return editor.commands.outdent();
+  //     },
+  //     Backspace: ({ editor }) => {
+  //       const { selection } = editor.state;
+  //
+  //       // Make sure we are at the start of the node
+  //       if (selection.$anchor.parentOffset > 0 || selection.from !== selection.to) {
+  //         return false;
+  //       }
+  //
+  //       return editor.commands.outdent();
+  //     }
+  //   };
+  // }
+});
--- a/gui/rpk-gui/src/lib/crud/components/widgets/richtext/MenuButtonIndent.tsx
+++ b/gui/rpk-gui/src/lib/crud/components/widgets/richtext/MenuButtonIndent.tsx
@@ -0,0 +1,19 @@
+import FormatIndentIncrease from "@mui/icons-material/FormatIndentIncrease";
+import { MenuButton, MenuButtonProps, useRichTextEditorContext } from "mui-tiptap";
+
+
+export type MenuButtonIndentProps = Partial<MenuButtonProps>;
+
+export default function MenuButtonIndent(props: MenuButtonIndentProps) {
+  const editor = useRichTextEditorContext();
+  return (
+    <MenuButton
+      tooltipLabel="Indent"
+      tooltipShortcutKeys={["Tab"]}
+      IconComponent={FormatIndentIncrease}
+      disabled={!editor?.isEditable || (!editor.can().indent())}
+      onClick={() => editor?.chain().focus().indent().run()}
+      {...props}
+    />
+  );
+}
--- a/gui/rpk-gui/src/lib/crud/components/widgets/richtext/MenuButtonUnindent.tsx
+++ b/gui/rpk-gui/src/lib/crud/components/widgets/richtext/MenuButtonUnindent.tsx
@@ -0,0 +1,18 @@
+import FormatIndentDecrease from "@mui/icons-material/FormatIndentDecrease";
+import { MenuButton, MenuButtonProps, useRichTextEditorContext } from "mui-tiptap";
+
+export type MenuButtonUnindentProps = Partial<MenuButtonProps>;
+
+export default function MenuButtonUnindent(props: MenuButtonUnindentProps) {
+  const editor = useRichTextEditorContext();
+  return (
+    <MenuButton
+      tooltipLabel="Unindent"
+      tooltipShortcutKeys={["Shift", "Tab"]}
+      IconComponent={FormatIndentDecrease}
+      disabled={!editor?.isEditable || !editor.can().outdent()}
+      onClick={() => editor?.chain().focus().outdent().run()}
+      {...props}
+    />
+  );
+}
--- a/gui/rpk-gui/src/lib/crud/components/widgets/richtext/index.tsx
+++ b/gui/rpk-gui/src/lib/crud/components/widgets/richtext/index.tsx
@@ -0,0 +1,145 @@
+import { FormContextType, WidgetProps } from "@rjsf/utils";
+import React from "react";
+import { CrudTextRJSFSchema } from "../crud-text-widget";
+import { useEditor, BubbleMenu } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import Underline from "@tiptap/extension-underline"
+import TextAlign from "@tiptap/extension-text-align"
+import TableCell from '@tiptap/extension-table-cell'
+import TableHeader from '@tiptap/extension-table-header'
+import TableRow from '@tiptap/extension-table-row'
+import {
+  MenuButtonAddTable, MenuButtonAlignCenter, MenuButtonAlignJustify, MenuButtonAlignLeft, MenuButtonAlignRight,
+  MenuButtonBold, MenuButtonBulletedList, MenuButtonItalic, MenuButtonOrderedList, MenuButtonRedo, MenuButtonUnderline,
+  MenuButtonUndo, MenuControlsContainer, MenuDivider, RichTextEditorProvider, RichTextField, TableBubbleMenu,
+  TableImproved,
+} from "mui-tiptap";
+
+import { UseEditorOptions } from "@tiptap/react/src/useEditor";
+import LabelledOutlined from "../../../../LabelledOutlined";
+import MenuButtonUnindent from "./MenuButtonUnindent";
+import MenuButtonIndent from "./MenuButtonIndent";
+import IndentExtension from "./IndentExtension"
+import { Container, Paper, styled } from "@mui/material";
+import Stack from "@mui/material/Stack";
+
+
+const LeftContainer = styled(Container)(({ theme }) => [{
+    width: "2cm",
+    borderLeft: "8px ridge black",
+    borderRight: "1px dashed grey",
+    padding: "0px !important",
+    margin: "0px !important"
+  },
+]);
+
+const TextContainer = styled(Container)(({ theme }) => [{
+    maxWidth: "580px",
+    padding: "0px !important",
+    margin: "0px !important"
+  },
+]);
+
+const RightContainer = styled(Container)(({ theme }) => [{
+    width: "2cm",
+    borderRight: "8px groove black",
+    borderLeft: "1px dashed grey",
+    padding: "0px !important",
+    margin: "0px !important"
+  },
+]);
+
+const StyledLabelledOutlined = styled(LabelledOutlined)(({ theme }) => [{
+    padding: "1px !important",
+  },
+]);
+
+const RichtextWidget = <T = any, S extends CrudTextRJSFSchema = CrudTextRJSFSchema, F extends FormContextType = any>(
+  props: WidgetProps<T, S, F>
+) => {
+  const { schema, value, onChange, label, id } = props;
+  const isMultiline = schema.props.multiline === true;
+
+  let editorOptions: UseEditorOptions;
+  if (isMultiline) {
+    editorOptions = {
+      extensions: [StarterKit, Underline, TextAlign.configure({types: ['paragraph', "table"]}), TableImproved.configure({resizable: true}), TableRow, TableHeader, TableCell, IndentExtension],
+      onUpdate: ({ editor }) => {
+        onChange(editor.getHTML())
+      }
+    }
+  } else {
+    editorOptions = {
+      extensions: [StarterKit, Underline,],
+      onUpdate: ({ editor }) => {
+        let text = editor.getText();
+        if (text.includes("\n")) {
+          text = text.replace("\n", " ");
+          editor.commands.setContent(text);
+        }
+        onChange(text);
+      }
+    }
+  }
+  editorOptions.content = value
+
+  const editor = useEditor(editorOptions)
+
+  return (
+    <StyledLabelledOutlined label={label} id={id}>
+      <Stack direction="row" spacing={0} sx={{justifyContent: "center", alignItems: "stretch"}}>
+        <LeftContainer>&nbsp;</LeftContainer>
+        <TextContainer>
+          <RichTextEditorProvider editor={editor}>
+            <TableBubbleMenu />
+            <RichTextField
+              controls={
+                <MenuControlsContainer>
+                  {isMultiline ? multilineButtons : singlelineButtons}
+                </MenuControlsContainer>
+              }
+              variant="standard"
+            />
+          </RichTextEditorProvider>
+        </TextContainer>
+        <RightContainer>&nbsp;</RightContainer>
+      </Stack>
+    </StyledLabelledOutlined>
+  )
+}
+
+export default RichtextWidget
+
+const singlelineButtons = (
+  <>
+    <MenuButtonUndo tabIndex={-1} />
+    <MenuButtonRedo tabIndex={-1} />
+    <MenuDivider />
+    <MenuButtonBold tabIndex={-1} />
+    <MenuButtonItalic tabIndex={-1} />
+    <MenuButtonUnderline tabIndex={-1} />
+  </>
+);
+
+const multilineButtons = (
+  <>
+    <MenuButtonUndo tabIndex={-1} />
+    <MenuButtonRedo tabIndex={-1} />
+    <MenuDivider />
+    <MenuButtonBold tabIndex={-1} />
+    <MenuButtonItalic tabIndex={-1} />
+    <MenuButtonUnderline tabIndex={-1} />
+    <MenuDivider />
+    <MenuButtonAlignLeft tabIndex={-1} />
+    <MenuButtonAlignCenter tabIndex={-1} />
+    <MenuButtonAlignRight tabIndex={-1} />
+    <MenuButtonAlignJustify tabIndex={-1} />
+    <MenuDivider />
+    <MenuButtonUnindent tabIndex={-1} />
+    <MenuButtonIndent tabIndex={-1} />
+    <MenuButtonBulletedList tabIndex={-1} />
+    <MenuButtonOrderedList tabIndex={-1} />
+    <MenuDivider />
+    <MenuButtonAddTable tabIndex={-1} />
+  </>
+);
--- a/gui/rpk-gui/src/theme.tsx
+++ b/gui/rpk-gui/src/theme.tsx
@@ -0,0 +1,5 @@
+import { createTheme } from "@mui/material/styles";
+
+const rpcTheme = createTheme({});
+
+export default rpcTheme
Author	SHA1	Message	Date
ewandor	6c480a4971	Adding the rich text widget	2025-04-21 01:30:16 +02:00
ewandor	3fbb82642b	Adding spinner to unloaded form (data or schema)	2025-04-21 01:29:45 +02:00
ewandor	c90acc2765	Adding a theme to the ts app	2025-04-21 01:28:54 +02:00