feat(editor): 引入多列布局插件并更新依赖

新增 `@blocknote/xl-multi-column` 插件以支持多列布局功能，并在 `package.json` 和 `package-lock.json` 中添加相关依赖。
同时在 `BlockNoteReact.jsx` 组件中导入了多列所需模块，为后续实现

package-lock.json

@@ -11,6 +11,7 @@
         "@blocknote/core": "^0.44.0",
         "@blocknote/mantine": "^0.44.0",
         "@blocknote/react": "^0.44.0",
+        "@blocknote/xl-multi-column": "^0.44.0",
         "axios": "^1.13.2",
         "element-plus": "^2.11.9",
         "pinia": "^3.0.4",
@@ -183,6 +184,27 @@
         "react-dom": "^18.0 || ^19.0 || >= 19.0.0-rc"
       }
     },
+    "node_modules/@blocknote/xl-multi-column": {
+      "version": "0.44.0",
+      "resolved": "https://registry.npmjs.org/@blocknote/xl-multi-column/-/xl-multi-column-0.44.0.tgz",
+      "integrity": "sha512-KVN+7iUdlNcw75Rsx1czVnuVUgpiJOJw1w2OSGMReS0StfLpTMLxqzHIDdGbizwDSn2H5zSl/yFStN3ffa16gw==",
+      "license": "GPL-3.0 OR PROPRIETARY",
+      "dependencies": {
+        "@blocknote/core": "0.44.0",
+        "@blocknote/react": "0.44.0",
+        "@tiptap/core": "^3.11.0",
+        "prosemirror-model": "^1.25.4",
+        "prosemirror-state": "^1.4.4",
+        "prosemirror-tables": "^1.8.1",
+        "prosemirror-transform": "^1.10.5",
+        "prosemirror-view": "^1.41.3",
+        "react-icons": "^5.5.0"
+      },
+      "peerDependencies": {
+        "react": "^18.0 || ^19.0 || >= 19.0.0-rc",
+        "react-dom": "^18.0 || ^19.0 || >= 19.0.0-rc"
+      }
+    },
     "node_modules/@ctrl/tinycolor": {
       "version": "3.6.1",
       "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.6.1.tgz",

package.json

@@ -12,6 +12,7 @@
     "@blocknote/core": "^0.44.0",
     "@blocknote/mantine": "^0.44.0",
     "@blocknote/react": "^0.44.0",
+    "@blocknote/xl-multi-column": "^0.44.0",
     "axios": "^1.13.2",
     "element-plus": "^2.11.9",
     "pinia": "^3.0.4",

src/components/react-components/BlockNoteReact.jsx

@@ -1,14 +1,36 @@
 import React from 'react';
 import { useCreateBlockNote } from '@blocknote/react';
 import { BlockNoteView } from '@blocknote/mantine';
+import { BlockNoteSchema, createHeadingBlockSpec } from "@blocknote/core";
 import { zh } from "@blocknote/core/locales";
 import '@blocknote/mantine/style.css';
 import '@blocknote/core/fonts/inter.css';
+// 正确导入需要的组件
+import { ColumnBlock, ColumnListBlock, withMultiColumn, multiColumnSchema} from "@blocknote/xl-multi-column" 
 
 const BlockNoteReact = ({ modelValue, onUpdateModelValue, editable = true }) => {
   let isEditable = editable;
+  // 创建带有多列支持的 schema
+  // const schema = BlockNoteSchema.create({
+  //   blockSpecs: {
+  //   },
+  // });
   // 在React组件内部使用Hook
   const editor = useCreateBlockNote({
+    // 正确的方式：创建扩展的schema
+    //schema, // 使用扩展后的 schema
+    // schema: BlockNoteSchema.create().extend({
+    //   blockSpecs: {
+    //     heading: createHeadingBlockSpec({
+    //       column: ColumnBlock,
+    //       columnList: ColumnListBlock,
+    //     }),
+    //     // 添加多列相关的块类型
+       
+    //     //  column: ColumnBlock,
+    //     // columnList: ColumnListBlock
+    //   }
+    // }),
     id: 'blocknote-react-editor',
     dictionary: zh,
     initialContent: modelValue || undefined,