diff --git a/demo/script.ts b/demo/script.ts index 06d2b8f..72842d2 100644 --- a/demo/script.ts +++ b/demo/script.ts @@ -12,6 +12,9 @@ window.onload = () => { imageResize: true, table: false, "better-table": { + table: { + tableInTableError: "This inner table was placed outside the parent table", + }, operationMenu: { items: { unmergeCells: { diff --git a/src/modules/better-table/quill-better-table.ts b/src/modules/better-table/quill-better-table.ts index 6ff341d..d241e40 100644 --- a/src/modules/better-table/quill-better-table.ts +++ b/src/modules/better-table/quill-better-table.ts @@ -151,7 +151,7 @@ export default class BetterTable extends Module { // or pasting quill.clipboard.addMatcher("td", matchTableCell); quill.clipboard.addMatcher("th", matchTableHeader); - quill.clipboard.addMatcher("table", matchTable); + quill.clipboard.addMatcher("table", (node, delta) => matchTable(node, delta, quill, options)); quill.clipboard.addMatcher(Node.ELEMENT_NODE, (node, delta) => matchElement(quill, node, delta)); // quill.clipboard.addMatcher('h1, h2, h3, h4, h5, h6', matchHeader) diff --git a/src/modules/better-table/utils/node-matchers.js b/src/modules/better-table/utils/node-matchers.ts similarity index 91% rename from src/modules/better-table/utils/node-matchers.js rename to src/modules/better-table/utils/node-matchers.ts index 896b152..4f3a543 100644 --- a/src/modules/better-table/utils/node-matchers.js +++ b/src/modules/better-table/utils/node-matchers.ts @@ -1,3 +1,5 @@ +// @ts-nocheck + import Quill from "quill"; import { _omit, convertToHex } from "./index"; import { TableCellLine } from "../formats/table"; @@ -162,7 +164,20 @@ export function matchTableHeader(node, delta, scroll) { } // supplement colgroup and col -export function matchTable(node, delta, scroll) { +export function matchTable(node, delta, quill: Quill, options) { + const isBrokenTable = delta.ops.find((op) => "row" in op.attributes && "table-col" in op.attributes); + if (isBrokenTable) { + // delete broken tables from main table + const innerTables = Array.from(node.getElementsByTagName("table")); + const innerTablesHtml = innerTables + .map((table) => `
${options?.table?.tableInTableError ?? ""}` + table.outerHTML) + .join(""); + innerTables.forEach((table) => table.parentNode.removeChild(table)); + + // append inner tables after main table + return quill.clipboard.convert({ html: node.outerHTML + innerTablesHtml }); + } + let newColDelta = new Delta(); const topRow = node.querySelector("tr");