feat: Tab key handling for tables (simple) (TypeCellOS#1275)

matthewlipski · web-flow · commit a7bf806d71c3 · 2024-11-29T19:28:50.000+01:00
diff --git a/packages/core/src/blocks/TableBlockContent/TableExtension.ts b/packages/core/src/blocks/TableBlockContent/TableExtension.ts
@@ -1,5 +1,5 @@
 import { callOrReturn, Extension, getExtensionField } from "@tiptap/core";
-import { columnResizing, tableEditing } from "prosemirror-tables";
+import { columnResizing, goToNextCell, tableEditing } from "prosemirror-tables";
 
 export const RESIZE_MIN_WIDTH = 35;
 export const EMPTY_CELL_WIDTH = 120;
@@ -53,6 +53,17 @@ export const TableExtension = Extension.create({
           selectionIsInTableParagraphNode
         );
       },
+      // Enables navigating cells using the tab key.
+      Tab: () => {
+        return this.editor.commands.command(({ state, dispatch, view }) =>
+          goToNextCell(1)(state, dispatch, view)
+        );
+      },
+      "Shift-Tab": () => {
+        return this.editor.commands.command(({ state, dispatch, view }) =>
+          goToNextCell(-1)(state, dispatch, view)
+        );
+      },
     };
   },
 
