fix: readonly editor table responsiveness

This commit is contained in:
Philipinho
2025-08-31 12:04:27 -07:00
parent 73ee6ee8c3
commit 60a373f488

View File

@ -1,29 +1,34 @@
import Table from "@tiptap/extension-table"; import Table from "@tiptap/extension-table";
import { Editor } from "@tiptap/core"; import { Editor } from "@tiptap/core";
import { DOMOutputSpec } from "@tiptap/pm/model";
const LIST_TYPES = ["bulletList", "orderedList", "taskList"]; const LIST_TYPES = ["bulletList", "orderedList", "taskList"];
function isInList(editor: Editor): boolean { function isInList(editor: Editor): boolean {
const { $from } = editor.state.selection; const { $from } = editor.state.selection;
for (let depth = $from.depth; depth > 0; depth--) { for (let depth = $from.depth; depth > 0; depth--) {
const node = $from.node(depth); const node = $from.node(depth);
if (LIST_TYPES.includes(node.type.name)) { if (LIST_TYPES.includes(node.type.name)) {
return true; return true;
} }
} }
return false; return false;
} }
function handleListIndent(editor: Editor): boolean { function handleListIndent(editor: Editor): boolean {
return editor.commands.sinkListItem("listItem") || return (
editor.commands.sinkListItem("taskItem"); editor.commands.sinkListItem("listItem") ||
editor.commands.sinkListItem("taskItem")
);
} }
function handleListOutdent(editor: Editor): boolean { function handleListOutdent(editor: Editor): boolean {
return editor.commands.liftListItem("listItem") || return (
editor.commands.liftListItem("taskItem"); editor.commands.liftListItem("listItem") ||
editor.commands.liftListItem("taskItem")
);
} }
export const CustomTable = Table.extend({ export const CustomTable = Table.extend({
@ -62,4 +67,15 @@ export const CustomTable = Table.extend({
}, },
}; };
}, },
});
renderHTML({ node, HTMLAttributes }) {
// https://github.com/ueberdosis/tiptap/issues/4872#issuecomment-2717554498
const originalRender = this.parent?.({ node, HTMLAttributes });
const wrapper: DOMOutputSpec = [
"div",
{ class: "tableWrapper" },
originalRender,
];
return wrapper;
},
});