@ceedcv-maya/shared-editor-react 0.6.0

package/src/lib/editorExtensions.ts

@@ -0,0 +1,73 @@
+/**
+ * Canonical TipTap extension list for the Maya editor.
+ *
+ * Extracted from `MayaEditor` so the exact same schema can be reused outside
+ * the React component — e.g. by `htmlToTiptapDoc`, which spins up a headless
+ * editor and must produce JSON identical to what the live editor persists.
+ *
+ * Keep this the single source of truth: `MayaEditor` consumes it too.
+ */
+import { StarterKit } from '@tiptap/starter-kit';
+import { Link } from '@tiptap/extension-link';
+import { Underline } from '@tiptap/extension-underline';
+import { Table } from '@tiptap/extension-table';
+import { TableRow } from '@tiptap/extension-table-row';
+import { TableHeader } from '@tiptap/extension-table-header';
+import { TableCell } from '@tiptap/extension-table-cell';
+import { Image } from '@tiptap/extension-image';
+import { TaskList } from '@tiptap/extension-task-list';
+import { TaskItem } from '@tiptap/extension-task-item';
+import { Highlight } from '@tiptap/extension-highlight';
+import { TextStyle } from '@tiptap/extension-text-style';
+import { Color } from '@tiptap/extension-color';
+import { TextAlign } from '@tiptap/extension-text-align';
+import type { Extensions } from '@tiptap/core';
+
+import { IframeBlock } from '../extensions/IframeBlock';
+import { AlertBlock } from '../extensions/AlertBlock';
+import { CommentMark } from '../extensions/CommentMark';
+import { Indent } from '../extensions/Indent';
+import type { EditorMode } from '../types';
+
+export function buildMayaEditorExtensions(mode: EditorMode = 'full'): Extensions {
+  const base: Extensions = [
+    // StarterKit v3 already bundles Link + Underline (and other marks).
+    // Disable both so we can add our customised versions without
+    // tripping "Duplicate extension names" warnings.
+    StarterKit.configure({
+      link: false,
+      underline: false,
+    }),
+    Underline,
+    Link.configure({
+      openOnClick: false,
+      autolink: true,
+      protocols: ['http', 'https', 'mailto', 'tel'],
+      HTMLAttributes: { rel: 'noopener noreferrer nofollow' },
+    }),
+    TextStyle,
+    Color,
+    Highlight.configure({ multicolor: true }),
+    CommentMark,
+  ];
+  if (mode === 'full') {
+    base.push(
+      TextAlign.configure({
+        types: ['heading', 'paragraph'],
+        alignments: ['left', 'center', 'right', 'justify'],
+        defaultAlignment: 'left',
+      }),
+      Indent,
+      Table.configure({ resizable: true }),
+      TableRow,
+      TableHeader,
+      TableCell,
+      Image,
+      TaskList,
+      TaskItem.configure({ nested: true }),
+      IframeBlock,
+      AlertBlock,
+    );
+  }
+  return base;
+}

package/src/lib/htmlToMarkdown.ts

@@ -0,0 +1,166 @@
+/**
+ * Lightweight HTML → Markdown converter for the editor's "Markdown view".
+ * Symmetric with `markdownToHtml`: supports the subset that round-trips
+ * through StarterKit + link/table/task-list extensions.
+ *
+ * Falls back to the raw text content for unknown elements so nothing is
+ * silently dropped from the source view.
+ */
+
+function unwrapText(node: Node): string {
+  return node.textContent ?? '';
+}
+
+function inlineToMarkdown(node: Node): string {
+  if (node.nodeType === Node.TEXT_NODE) return node.textContent ?? '';
+  if (node.nodeType !== Node.ELEMENT_NODE) return '';
+  const el = node as HTMLElement;
+  const inner = Array.from(el.childNodes).map(inlineToMarkdown).join('');
+
+  switch (el.tagName) {
+    case 'BR': return '\n';
+    case 'STRONG':
+    case 'B': return `**${inner}**`;
+    case 'EM':
+    case 'I': return `*${inner}*`;
+    case 'U': return inner; // Markdown has no underline; preserve the text.
+    case 'S':
+    case 'DEL':
+    case 'STRIKE': return `~~${inner}~~`;
+    case 'CODE': return `\`${inner}\``;
+    case 'A': {
+      const href = el.getAttribute('href') ?? '';
+      return href ? `[${inner}](${href})` : inner;
+    }
+    case 'SPAN': return inner;
+    default: return inner;
+  }
+}
+
+function blockToMarkdown(el: Element, listDepth = 0): string {
+  const indent = '  '.repeat(listDepth);
+
+  switch (el.tagName) {
+    case 'H1':
+    case 'H2':
+    case 'H3':
+    case 'H4':
+    case 'H5':
+    case 'H6': {
+      const level = Number(el.tagName.substring(1));
+      return `${'#'.repeat(level)} ${inlineToMarkdown(el).trim()}\n\n`;
+    }
+    case 'P':
+      return `${inlineToMarkdown(el).trim()}\n\n`;
+    case 'BLOCKQUOTE': {
+      const inner = Array.from(el.children)
+        .map((c) => blockToMarkdown(c, listDepth).trim())
+        .filter(Boolean)
+        .join('\n');
+      const text = inner || inlineToMarkdown(el).trim();
+      return text
+        .split('\n')
+        .map((l) => `> ${l}`)
+        .join('\n') + '\n\n';
+    }
+    case 'PRE': {
+      const code = el.querySelector('code');
+      const text = code ? unwrapText(code) : unwrapText(el);
+      return `\`\`\`\n${text}\n\`\`\`\n\n`;
+    }
+    case 'HR':
+      return '---\n\n';
+    case 'UL': {
+      const isTaskList = el.getAttribute('data-type') === 'taskList';
+      const out = Array.from(el.children).map((li) => {
+        if (isTaskList) {
+          const checked = (li as HTMLElement).getAttribute('data-checked') === 'true';
+          const text = Array.from(li.querySelectorAll('p'))
+            .map(inlineToMarkdown)
+            .join(' ')
+            .trim();
+          return `${indent}- [${checked ? 'x' : ' '}] ${text}`;
+        }
+        return listItemToMarkdown(li, '-', listDepth);
+      }).join('\n');
+      return out + '\n\n';
+    }
+    case 'OL': {
+      let i = 1;
+      const out = Array.from(el.children).map((li) => {
+        const marker = `${i++}.`;
+        return listItemToMarkdown(li, marker, listDepth);
+      }).join('\n');
+      return out + '\n\n';
+    }
+    case 'TABLE': {
+      const rows = Array.from(el.querySelectorAll('tr'));
+      if (rows.length === 0) return '';
+      const tableRows = rows.map((tr) => {
+        const cells = Array.from(tr.children).map((c) => inlineToMarkdown(c).trim().replace(/\n/g, ' '));
+        return `| ${cells.join(' | ')} |`;
+      });
+      // Insert a separator row after the first.
+      if (tableRows.length > 1) {
+        const sep = `| ${Array.from(rows[0].children).map(() => '---').join(' | ')} |`;
+        tableRows.splice(1, 0, sep);
+      }
+      return tableRows.join('\n') + '\n\n';
+    }
+    case 'IMG': {
+      const src = el.getAttribute('src') ?? '';
+      const alt = el.getAttribute('alt') ?? '';
+      return `![${alt}](${src})\n\n`;
+    }
+    case 'IFRAME': {
+      const src = el.getAttribute('src') ?? '';
+      return `<iframe src="${src}"></iframe>\n\n`;
+    }
+    case 'ASIDE':
+      return Array.from(el.children).map((c) => blockToMarkdown(c, listDepth)).join('');
+    case 'FIGURE': {
+      const img = el.querySelector('img');
+      const caption = el.querySelector('figcaption');
+      if (img) {
+        const src = img.getAttribute('src') ?? '';
+        const alt = img.getAttribute('alt') ?? caption?.textContent ?? '';
+        return `![${alt}](${src})\n\n`;
+      }
+      return inlineToMarkdown(el) + '\n\n';
+    }
+    default:
+      return inlineToMarkdown(el) + '\n';
+  }
+}
+
+function listItemToMarkdown(li: Element, marker: string, depth: number): string {
+  const indent = '  '.repeat(depth);
+  const blocks = Array.from(li.children);
+  if (blocks.length === 0) return `${indent}${marker} ${inlineToMarkdown(li).trim()}`;
+
+  const lines: string[] = [];
+  for (const child of blocks) {
+    if (child.tagName === 'UL' || child.tagName === 'OL') {
+      const nested = blockToMarkdown(child, depth + 1).trimEnd();
+      if (nested) lines.push(nested);
+    } else {
+      const text = inlineToMarkdown(child).trim();
+      if (text) {
+        lines.push(lines.length === 0 ? `${indent}${marker} ${text}` : `${indent}  ${text}`);
+      }
+    }
+  }
+  if (lines.length === 0) lines.push(`${indent}${marker}`);
+  return lines.join('\n');
+}
+
+export function htmlToMarkdown(html: string): string {
+  if (typeof window === 'undefined' || typeof DOMParser === 'undefined') {
+    return html;
+  }
+  const doc = new DOMParser().parseFromString(`<div>${html}</div>`, 'text/html');
+  const root = doc.body.firstElementChild;
+  if (!root) return '';
+  const out = Array.from(root.children).map((el) => blockToMarkdown(el)).join('').trim();
+  return out + '\n';
+}

package/src/lib/htmlToTiptapDoc.test.ts

@@ -0,0 +1,52 @@
+import { describe, it, expect } from 'vitest';
+import { htmlToTiptapDoc } from './htmlToTiptapDoc';
+
+describe('htmlToTiptapDoc', () => {
+  it('converts a paragraph to a TipTap doc', () => {
+    const doc = htmlToTiptapDoc('<p>hello</p>');
+    expect(doc.type).toBe('doc');
+    const para = doc.content[0];
+    expect(para.type).toBe('paragraph');
+    expect(para.content?.[0]).toMatchObject({ type: 'text', text: 'hello' });
+  });
+
+  it('converts a heading and preserves its level', () => {
+    const doc = htmlToTiptapDoc('<h2>Sección</h2>');
+    expect(doc.content[0]).toMatchObject({ type: 'heading' });
+    expect(doc.content[0].attrs?.level).toBe(2);
+  });
+
+  it('converts a bullet list into listItems', () => {
+    const doc = htmlToTiptapDoc('<ul><li>a</li><li>b</li></ul>');
+    const list = doc.content[0];
+    expect(list.type).toBe('bulletList');
+    expect(list.content).toHaveLength(2);
+    expect(list.content?.[0].type).toBe('listItem');
+  });
+
+  it('converts a table into table nodes', () => {
+    const doc = htmlToTiptapDoc(
+      '<table><tbody><tr><td>a</td><td>b</td></tr></tbody></table>',
+    );
+    expect(doc.content[0].type).toBe('table');
+    const row = doc.content[0].content?.[0];
+    expect(row?.type).toBe('tableRow');
+    expect(row?.content).toHaveLength(2);
+  });
+
+  it('preserves bold marks', () => {
+    const doc = htmlToTiptapDoc('<p>plain <strong>bold</strong></p>');
+    const marks = doc.content[0].content?.find((n) => n.text === 'bold')?.marks;
+    expect(marks?.some((m) => m.type === 'bold')).toBe(true);
+  });
+
+  it('returns a doc with a single empty paragraph for empty input', () => {
+    // TipTap normalises an empty doc to one empty paragraph (a valid doc
+    // must hold at least one block), so that — not [] — is the contract.
+    const doc = htmlToTiptapDoc('');
+    expect(doc.type).toBe('doc');
+    expect(doc.content).toHaveLength(1);
+    expect(doc.content[0].type).toBe('paragraph');
+    expect(doc.content[0].content ?? []).toEqual([]);
+  });
+});

package/src/lib/htmlToTiptapDoc.ts

@@ -0,0 +1,26 @@
+/**
+ * Convert sanitised HTML to a ProseMirror/TipTap JSON doc using a headless
+ * editor configured with the Maya editor extensions, so the round-trip
+ * matches exactly what the live editor persists.
+ *
+ * Callers may pass their own `extensions` (e.g. a `mode='lite'` list); when
+ * omitted, the canonical `full` schema is used. The headless editor is
+ * created detached and destroyed before returning — no DOM node is mounted.
+ */
+import { Editor } from '@tiptap/core';
+import type { Extensions } from '@tiptap/core';
+
+import { buildMayaEditorExtensions } from './editorExtensions';
+import type { TiptapDoc } from '../types';
+
+export function htmlToTiptapDoc(html: string, extensions?: Extensions): TiptapDoc {
+  const editor = new Editor({
+    content: html ?? '',
+    extensions: extensions ?? buildMayaEditorExtensions('full'),
+  });
+  try {
+    return editor.getJSON() as TiptapDoc;
+  } finally {
+    editor.destroy();
+  }
+}

package/src/lib/markdownToHtml.ts

@@ -0,0 +1,234 @@
+/**
+ * Lightweight Markdown → HTML converter for the editor's "Insert Markdown"
+ * action. Supports the subset that maps cleanly to the ProseMirror schema
+ * we ship (StarterKit + extension-link + extension-table-ish lists +
+ * task lists). Anything else is preserved as plain text.
+ *
+ * Not a full CommonMark implementation — for a richer parse, callers can
+ * swap this for `marked`/`markdown-it` and feed the result to
+ * `editor.commands.insertContent`.
+ */
+
+function escapeHtml(s: string): string {
+  return s
+    .replace(/&/g, '&')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;');
+}
+
+const BLOCK_HTML_TAGS = new Set([
+  'address', 'article', 'aside', 'blockquote', 'div', 'dl', 'dd', 'dt',
+  'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3',
+  'h4', 'h5', 'h6', 'header', 'hr', 'iframe', 'main', 'nav', 'noscript',
+  'ol', 'p', 'pre', 'section', 'table', 'tbody', 'td', 'tfoot', 'th',
+  'thead', 'tr', 'ul', 'video', 'img', 'caption', 'colgroup', 'col',
+  'label', 'input',
+]);
+
+const VOID_HTML_TAGS = new Set([
+  'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'link',
+  'meta', 'param', 'source', 'track', 'wbr',
+]);
+
+function isBlockHtmlTag(name: string): boolean {
+  return BLOCK_HTML_TAGS.has(name.toLowerCase());
+}
+
+function applyInline(text: string): string {
+  let out = escapeHtml(text);
+  // Inline code first so its content isn't re-formatted.
+  out = out.replace(/`([^`]+)`/g, (_m, code) => `<code>${code}</code>`);
+  // Bold + italic.
+  out = out.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
+  out = out.replace(/__([^_]+)__/g, '<strong>$1</strong>');
+  out = out.replace(/(?<!\*)\*([^*\n]+)\*(?!\*)/g, '<em>$1</em>');
+  out = out.replace(/(?<!_)_([^_\n]+)_(?!_)/g, '<em>$1</em>');
+  // Strikethrough.
+  out = out.replace(/~~([^~]+)~~/g, '<s>$1</s>');
+  // Links — only http/https/mailto/tel; reject `javascript:` etc.
+  out = out.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (_m, label, url) => {
+    const safe = /^(https?:|mailto:|tel:|\/|#)/i.test(url) ? url : '#';
+    return `<a href="${safe}">${label}</a>`;
+  });
+  // Auto-link bare URLs (idempotent — won't double-link inside <a>).
+  out = out.replace(/(?<!href=")(?<!>)\b(https?:\/\/[^\s<]+)(?![^<]*<\/a>)/g, (m) => `<a href="${m}">${m}</a>`);
+  return out;
+}
+
+export function markdownToHtml(markdown: string): string {
+  const lines = markdown.replace(/\r\n?/g, '\n').split('\n');
+  const out: string[] = [];
+
+  let i = 0;
+  while (i < lines.length) {
+    const line = lines[i];
+
+    // Fenced code block (``` … ```).
+    const fenceMatch = line.match(/^```(\w+)?\s*$/);
+    if (fenceMatch) {
+      i++;
+      const code: string[] = [];
+      while (i < lines.length && !/^```\s*$/.test(lines[i])) {
+        code.push(lines[i]);
+        i++;
+      }
+      i++; // skip closing fence
+      out.push(`<pre><code>${escapeHtml(code.join('\n'))}</code></pre>`);
+      continue;
+    }
+
+    // ATX heading.
+    const heading = line.match(/^(#{1,6})\s+(.*)$/);
+    if (heading) {
+      const level = heading[1].length;
+      out.push(`<h${level}>${applyInline(heading[2].trim())}</h${level}>`);
+      i++;
+      continue;
+    }
+
+    // Horizontal rule.
+    if (/^\s*(-{3,}|\*{3,}|_{3,})\s*$/.test(line)) {
+      out.push('<hr>');
+      i++;
+      continue;
+    }
+
+    // GitHub-Flavoured pipe table.
+    //   | h1 | h2 |
+    //   | -- | -- |
+    //   | c1 | c2 |
+    if (
+      /^\s*\|.*\|\s*$/.test(line) &&
+      i + 1 < lines.length &&
+      /^\s*\|?\s*:?-{3,}:?\s*(\|\s*:?-{3,}:?\s*)+\|?\s*$/.test(lines[i + 1])
+    ) {
+      const split = (row: string) =>
+        row
+          .trim()
+          .replace(/^\|/, '')
+          .replace(/\|$/, '')
+          .split('|')
+          .map((c) => c.trim());
+      const headers = split(line);
+      i += 2; // header + separator
+      const rows: string[][] = [];
+      while (i < lines.length && /^\s*\|.*\|\s*$/.test(lines[i])) {
+        rows.push(split(lines[i]));
+        i++;
+      }
+      let table = '<table><tbody><tr>';
+      for (const h of headers) table += `<th>${applyInline(h)}</th>`;
+      table += '</tr>';
+      for (const r of rows) {
+        table += '<tr>';
+        for (const c of r) table += `<td>${applyInline(c)}</td>`;
+        table += '</tr>';
+      }
+      table += '</tbody></table>';
+      out.push(table);
+      continue;
+    }
+
+    // Raw HTML block — line that opens with a known block-level tag is
+    // passed through verbatim up to its closing tag (or until a blank line).
+    // Lets `htmlToMarkdown` round-trip elements that have no markdown
+    // analogue (iframe, aside.alert, figure/figcaption, span with style).
+    const rawTag = line.match(/^<\s*([a-zA-Z][a-zA-Z0-9]*)\b[^>]*>/);
+    if (rawTag && isBlockHtmlTag(rawTag[1])) {
+      const tag = rawTag[1].toLowerCase();
+      const isSelfClosing = /\/\s*>\s*$/.test(line) || VOID_HTML_TAGS.has(tag);
+      const buf: string[] = [line];
+      i++;
+      if (!isSelfClosing) {
+        const closeRe = new RegExp(`</\\s*${tag}\\s*>`, 'i');
+        while (i < lines.length && !closeRe.test(lines[i - 1])) {
+          if (lines[i].trim() === '') break;
+          buf.push(lines[i]);
+          if (closeRe.test(lines[i])) {
+            i++;
+            break;
+          }
+          i++;
+        }
+      }
+      out.push(buf.join('\n'));
+      continue;
+    }
+
+    // Blockquote — group consecutive `> ` lines.
+    if (/^>\s?/.test(line)) {
+      const buf: string[] = [];
+      while (i < lines.length && /^>\s?/.test(lines[i])) {
+        buf.push(lines[i].replace(/^>\s?/, ''));
+        i++;
+      }
+      out.push(`<blockquote><p>${applyInline(buf.join(' '))}</p></blockquote>`);
+      continue;
+    }
+
+    // Task list — `- [ ]` / `- [x]`.
+    if (/^\s*[-*]\s+\[[ xX]\]\s+/.test(line)) {
+      out.push('<ul data-type="taskList">');
+      while (i < lines.length && /^\s*[-*]\s+\[[ xX]\]\s+/.test(lines[i])) {
+        const m = lines[i].match(/^\s*[-*]\s+\[([ xX])\]\s+(.*)$/);
+        if (!m) break;
+        const checked = m[1].toLowerCase() === 'x';
+        out.push(
+          `<li data-type="taskItem" data-checked="${checked}"><label><input type="checkbox" ${checked ? 'checked' : ''}><span></span></label><div><p>${applyInline(m[2])}</p></div></li>`,
+        );
+        i++;
+      }
+      out.push('</ul>');
+      continue;
+    }
+
+    // Unordered list.
+    if (/^\s*[-*+]\s+/.test(line)) {
+      out.push('<ul>');
+      while (i < lines.length && /^\s*[-*+]\s+/.test(lines[i])) {
+        const m = lines[i].match(/^\s*[-*+]\s+(.*)$/);
+        if (!m) break;
+        out.push(`<li><p>${applyInline(m[1])}</p></li>`);
+        i++;
+      }
+      out.push('</ul>');
+      continue;
+    }
+
+    // Ordered list.
+    if (/^\s*\d+\.\s+/.test(line)) {
+      out.push('<ol>');
+      while (i < lines.length && /^\s*\d+\.\s+/.test(lines[i])) {
+        const m = lines[i].match(/^\s*\d+\.\s+(.*)$/);
+        if (!m) break;
+        out.push(`<li><p>${applyInline(m[1])}</p></li>`);
+        i++;
+      }
+      out.push('</ol>');
+      continue;
+    }
+
+    // Blank line.
+    if (line.trim() === '') {
+      i++;
+      continue;
+    }
+
+    // Paragraph — coalesce consecutive non-blank lines (single `\n` becomes a space).
+    const para: string[] = [line];
+    i++;
+    while (
+      i < lines.length &&
+      lines[i].trim() !== '' &&
+      !/^(#{1,6}\s|>|```|\s*[-*+]\s|\s*\d+\.\s|\s*(-{3,}|\*{3,}|_{3,})\s*$|\s*\|)/.test(lines[i]) &&
+      !/^<\s*[a-zA-Z]/.test(lines[i])
+    ) {
+      para.push(lines[i]);
+      i++;
+    }
+    out.push(`<p>${applyInline(para.join(' '))}</p>`);
+  }
+
+  return out.join('');
+}

package/src/lib/normalizeTableHtml.ts

@@ -0,0 +1,74 @@
+/**
+ * Pre-processes pasted/imported HTML so that complex table structures
+ * survive TipTap's table parser.
+ *
+ * TipTap's schema is:
+ *   table → tableRow → (tableHeader | tableCell)
+ *
+ * It does NOT model `<caption>`, `<colgroup>`/`<col>`, or `<tfoot>` as
+ * distinct nodes. Without preprocessing, those elements silently
+ * disappear during `editor.commands.setContent`.
+ *
+ * Transformations applied:
+ *   - `<caption>` is lifted out of the table and rendered as a
+ *     `<p><strong><em>…</em></strong></p>` placed immediately before the
+ *     table (visually equivalent to a caption, schema-compatible).
+ *   - `<tfoot>` rows are appended to `<tbody>` (TipTap doesn't care
+ *     about the section wrapper — only about the `<tr>` children).
+ *   - `<colgroup>` / `<col>` are stripped (TipTap manages column sizing
+ *     dynamically via `Table.configure({ resizable: true })`).
+ *   - `<th scope="row">` is preserved as `<th>` (TipTap renders any
+ *     `<th>` as a `tableHeader` regardless of scope).
+ *
+ * Anything outside `<table>` is left untouched.
+ */
+export function normalizeTableHtml(html: string): string {
+  if (typeof window === 'undefined' || typeof DOMParser === 'undefined') {
+    return html;
+  }
+  const parsed = new DOMParser().parseFromString(`<div>${html}</div>`, 'text/html');
+  const root = parsed.body.firstElementChild;
+  if (!root) return html;
+
+  const tables = Array.from(root.querySelectorAll('table'));
+  for (const table of tables) {
+    // 1. Caption → paragraph injected right before the table.
+    const caption = table.querySelector(':scope > caption');
+    if (caption) {
+      const text = caption.textContent?.trim() ?? '';
+      if (text) {
+        const captionPara = parsed.createElement('p');
+        const strong = parsed.createElement('strong');
+        const em = parsed.createElement('em');
+        em.textContent = text;
+        strong.appendChild(em);
+        captionPara.appendChild(strong);
+        table.parentNode?.insertBefore(captionPara, table);
+      }
+      caption.remove();
+    }
+
+    // 2. <tfoot> rows → appended to <tbody>.
+    const tfoots = Array.from(table.querySelectorAll(':scope > tfoot'));
+    for (const tfoot of tfoots) {
+      let tbody = table.querySelector(':scope > tbody');
+      if (!tbody) {
+        tbody = parsed.createElement('tbody');
+        table.appendChild(tbody);
+      }
+      while (tfoot.firstElementChild) {
+        tbody.appendChild(tfoot.firstElementChild);
+      }
+      tfoot.remove();
+    }
+
+    // 3. <colgroup>/<col> stripped — handled by Table.configure({ resizable }).
+    table.querySelectorAll(':scope > colgroup').forEach((cg) => cg.remove());
+  }
+
+  // Safe to use innerHTML here because:
+  // 1. The input HTML is parsed fresh from a local string (not user-controlled)
+  // 2. Manipulations are DOM API only (no string injection)
+  // 3. Output is always passed through sanitizeEditorHtml before editor render
+  return root.innerHTML;
+}