docs: support table-up

zzxming · Jan 13, 2025 · 4f91d18 · 4f91d18
1 parent 18c3d43
commit 4f91d18
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 23 deletions.
diff --git a/README.md b/README.md
@@ -75,6 +75,8 @@ interface MenuItemsGroup extends MenuCommonOptions {
 
 ### Table
 
+use the module `quill-table-up`. you need install it first
+
 ```ts
 import QuillShortcutKey, { defaultMenuItems, generateTableUpShortKeyMenu } from 'quill-shortcut-key';
 import { createSelectBox } from 'quill-table-up';

diff --git a/docs/index.html b/docs/index.html
@@ -20,6 +20,9 @@
     <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/quill.snow.css" rel="stylesheet" />
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.umd.js"></script>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.css" />
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.umd.js"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/table-creator.css" />
     <link rel="stylesheet" href="./index.css" />
     <script src="./dev.js"></script>
     <style>

diff --git a/docs/index.js b/docs/index.js
@@ -3,14 +3,14 @@ const {
   default: QuillShortcutKey,
   defaultMenuItems,
   defaultShortKey,
-  // generateTableUpShortKeyMenu,
+  generateTableUpShortKeyMenu,
 } = window.QuillShortcutKey;
-// const { default: TableUp, defaultCustomSelect, createSelectBox, TableAlign, TableMenuContextmenu, TableResizeBox, TableResizeScale, TableSelection, TableVirtualScrollbar } = window.TableUp;
+const { default: TableUp, defaultCustomSelect, createSelectBox, TableAlign, TableMenuContextmenu, TableResizeBox, TableResizeScale, TableSelection, TableVirtualScrollbar } = window.TableUp;
 const { default: QuillToolbarTip } = window.QuillToolbarTip;
 
 Quill.register({
   [`modules/shortcut-key`]: QuillShortcutKey,
-  // [`modules/${TableUp.moduleName}`]: TableUp,
+  [`modules/${TableUp.moduleName}`]: TableUp,
   [`modules/${QuillToolbarTip.moduleName}`]: QuillToolbarTip,
 }, true);
 
@@ -27,11 +27,10 @@ const toolbarConfig = [
   [{ header: [1, 2, 3, 4, 5, 6, false] }, { header: 1 }, { header: 2 }, { header: 3 }, { header: 4 }, { header: 5 }, { header: 6 }],
   [{ font: [] }, { color: [] }, { background: [] }],
   [{ align: '' }, { align: 'center' }, { align: 'right' }, { align: 'justify' }],
-  // [{ [TableUp.toolName]: [] }],
+  [{ [TableUp.toolName]: [] }],
 ];
 
-console.log(defaultShortKey);
-// const { tableUpConfig, tableUpKeyboardControl } = generateTableUpShortKeyMenu(createSelectBox);
+const { tableUpConfig, tableUpKeyboardControl } = generateTableUpShortKeyMenu(createSelectBox);
 const quill1 = new Quill('#editor1', {
   // debug: 'info',
   theme: 'snow',
@@ -87,26 +86,26 @@ const quill1 = new Quill('#editor1', {
     },
     'shortcut-key': {
       menuItems: [
-        // tableUpConfig,
+        tableUpConfig,
         ...defaultMenuItems,
       ],
-      // menuKeyboardControls(event, data) {
-      //   let result = false;
-      //   result = tableUpKeyboardControl(event, data) || result;
-      //   return result;
-      // },
+      menuKeyboardControls(event, data) {
+        let result = false;
+        result = tableUpKeyboardControl(event, data) || result;
+        return result;
+      },
+    },
+    [TableUp.moduleName]: {
+      scrollbar: TableVirtualScrollbar,
+      align: TableAlign,
+      resize: TableResizeBox,
+      resizeScale: TableResizeScale,
+      customSelect: defaultCustomSelect,
+      selection: TableSelection,
+      selectionOptions: {
+        tableMenu: TableMenuContextmenu,
+      },
     },
-  //   [TableUp.moduleName]: {
-  //     scrollbar: TableVirtualScrollbar,
-  //     align: TableAlign,
-  //     resize: TableResizeBox,
-  //     resizeScale: TableResizeScale,
-  //     customSelect: defaultCustomSelect,
-  //     selection: TableSelection,
-  //     selectionOptions: {
-  //       tableMenu: TableMenuContextmenu,
-  //     },
-  //   },
   },
 });