@aquera/nile-elements 2.0.15 → 2.0.17

package/dist/src/nile-wysiwyg-editor/engine/sanitize.js

@@ -6,6 +6,7 @@
  * set the schema understands.
  */
 import { isAllowedEmbedSrc, EMBED_SANDBOX, EMBED_REFERRER_POLICY } from './plugins/embeds';
+import { isExtensionValueValid } from './email-css';
 /** Elements removed together with their content. */
 const DROP_WITH_CONTENT = new Set([
     'script', 'frame', 'frameset', 'object', 'embed',
@@ -101,6 +102,380 @@ function filterStyle(value, tag) {
     })
         .join('; ');
 }
+/* --- email-fidelity: container styles become node attrs, not per-run marks (flag-gated) --- */
+/** Containers whose inline styles must not become per-run marks. */
+const CONTAINER_TAGS = new Set([
+    'table', 'td', 'th', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
+    'div', 'li', 'blockquote', 'tr', 'tbody',
+]);
+/** Mark-triggering declarations dropped on any container. */
+const CONTAINER_DROP = new Set([
+    'color', 'background-color', 'font-family', 'font-size', 'font-weight',
+    'font-style', 'text-decoration', 'text-decoration-line',
+    'text-decoration-style', 'text-decoration-color',
+]);
+/** Layout declarations allowed on cells with fidelity. */
+const CELL_LAYOUT = new Set([
+    'padding', 'padding-top', 'padding-right', 'padding-bottom', 'padding-left',
+    'width', 'vertical-align', 'border', 'border-top', 'border-right',
+    'border-bottom', 'border-left', 'border-radius',
+]);
+/** `border-width`, `border-top-color`, … — resolved per side through CSSOM instead. */
+const CELL_BORDER_LONGHAND = /^border-(?:(?:top|right|bottom|left)-)?(?:width|style|color)$/;
+/** Layout declarations allowed on tables with fidelity. */
+const TABLE_LAYOUT = new Set(['width', 'max-width', 'border', 'margin-left', 'margin-right']);
+/** Block margins allowed on paragraphs/headings with fidelity. */
+const BLOCK_LAYOUT = new Set(['margin', 'margin-top', 'margin-bottom']);
+const BORDER_STYLES = new Set(['solid', 'dashed', 'dotted', 'double', 'none']);
+const VALIGN_KEYWORDS = new Set([
+    'top', 'middle', 'bottom', 'baseline', 'sub', 'super', 'text-top', 'text-bottom',
+]);
+const LENGTH_TOKEN = /^-?(?:\d+\.?\d*|\.\d+)(?:px|%|em|rem|pt)$/;
+function isAscii(value) {
+    // eslint-disable-next-line no-control-regex
+    return !/[^\x00-\x7f]/.test(value);
+}
+/** Forbidden function-ish / escape tokens shared by the length & border grammars. */
+function hasUnsafeToken(value) {
+    return /[\\/(]|url|var|calc|expression/i.test(value);
+}
+function isLengthToken(token) {
+    return token === '0' || token === 'auto' || LENGTH_TOKEN.test(token);
+}
+/** 1–4 whitespace-separated length tokens (padding/margin/width/radius). */
+function isLengthList(value) {
+    if (!isAscii(value) || hasUnsafeToken(value))
+        return false;
+    const tokens = value.trim().split(/\s+/);
+    return tokens.length >= 1 && tokens.length <= 4 && tokens.every(isLengthToken);
+}
+function isColor(value) {
+    if (!isAscii(value))
+        return false;
+    const v = value.trim();
+    if (/^[a-z]+$/i.test(v))
+        return true;
+    if (/^#[0-9a-f]{3,8}$/i.test(v))
+        return true;
+    // rgb()/rgba() with numeric (optionally %) arguments only.
+    if (/^rgba?\(\s*[\d.]+%?(?:\s*,\s*[\d.]+%?){2,3}\s*\)$/i.test(v))
+        return true;
+    // hsl()/hsla() with numeric (optionally %) arguments only — numeric-only, so a
+    // smuggled `hsl(var(--x))` still fails (it has letters inside the parens).
+    return /^hsla?\(\s*[\d.]+%?(?:\s*,\s*[\d.]+%?){2,3}\s*\)$/i.test(v);
+}
+/** Line-height for tables: a unitless number or a single length token. */
+function isLineHeight(value) {
+    if (!isAscii(value) || hasUnsafeToken(value))
+        return false;
+    const v = value.trim();
+    if (/^\d+(?:\.\d+)?$/.test(v))
+        return true;
+    return isLengthToken(v);
+}
+/** Cell `text-align` keyword set (also the legacy `align` conversion source). */
+const TEXT_ALIGN_KEYWORDS = new Set(['left', 'center', 'right', 'justify', 'start', 'end']);
+const LEGACY_ALIGN_KEYWORDS = new Set(['left', 'center', 'right', 'justify']);
+function isBorder(value) {
+    if (!isAscii(value))
+        return false;
+    if (/[\\/]|url|var|calc|expression/i.test(value))
+        return false;
+    const tokens = value.trim().match(/rgba?\([^)]*\)|\S+/gi) ?? [];
+    if (!tokens.length)
+        return false;
+    let hasStyle = false;
+    for (const token of tokens) {
+        if (BORDER_STYLES.has(token.toLowerCase())) {
+            hasStyle = true;
+            continue;
+        }
+        if (isLengthToken(token) || isColor(token))
+            continue;
+        return false;
+    }
+    return hasStyle;
+}
+function isValign(value) {
+    const v = value.trim().toLowerCase();
+    return VALIGN_KEYWORDS.has(v) || isLengthToken(v);
+}
+function isLayoutValid(name, value) {
+    if (name === 'vertical-align')
+        return isValign(value);
+    // `border-radius` is a length list (a corner rounding), not the width/style/
+    // colour grammar the `border*` shorthands use — validate it as such.
+    if (name === 'border-radius')
+        return isLengthList(value);
+    if (name.startsWith('border'))
+        return isBorder(value);
+    return isLengthList(value);
+}
+/** Validates a cell `color`/`font-*` declaration kept as part of `textStyle`. */
+function isCellTextValid(name, value) {
+    if (!isAscii(value) || /url|expression|var|calc/i.test(value))
+        return false;
+    if (name === 'color')
+        return isColor(value);
+    if (name === 'font-size')
+        return isLengthToken(value);
+    if (name === 'font-weight') {
+        return /^(normal|bold|bolder|lighter|[1-9]00)$/i.test(value.trim());
+    }
+    // font-family: names, commas and quotes only — no function-ish characters.
+    return !/[(){}<>;\\]/.test(value);
+}
+/** A container's kept style under fidelity: validated layout, carried background/font, legacy attrs. */
+function computeContainerStyle(el, tag) {
+    const isCell = tag === 'td' || tag === 'th';
+    const isTable = tag === 'table';
+    const isBlock = /^(?:p|h[1-6])$/.test(tag);
+    const extra = SIZED_TAGS[tag];
+    const kept = [];
+    for (const decl of (el.getAttribute('style') ?? '').split(';')) {
+        const idx = decl.indexOf(':');
+        if (idx === -1)
+            continue;
+        const name = decl.slice(0, idx).trim().toLowerCase();
+        const value = decl.slice(idx + 1).trim();
+        if (!value || /url\s*\(|expression\s*\(/i.test(decl))
+            continue;
+        if (name === 'background-color') {
+            if ((isCell || isTable) && isColor(value))
+                kept.push(`${name}: ${value}`);
+            continue;
+        }
+        if (name === 'color' || name === 'font-family' || name === 'font-size' || name === 'font-weight') {
+            // Blocks and tables keep their own text style; cells inherit the table's.
+            if ((isCell || isBlock || isTable) && isCellTextValid(name, value)) {
+                kept.push(`${name}: ${value}`);
+            }
+            continue;
+        }
+        if (name === 'text-align') {
+            // Cells keep a validated text-align (lifted to data-cell-align); blocks let
+            // it fall through to the align attr via the ALLOWED_STYLES branch below.
+            if (isCell && TEXT_ALIGN_KEYWORDS.has(value.toLowerCase())) {
+                kept.push(`text-align: ${value.toLowerCase()}`);
+                continue;
+            }
+        }
+        if (name === 'line-height' && isTable) {
+            if (isLineHeight(value))
+                kept.push(`line-height: ${value}`);
+            continue;
+        }
+        if (name === 'margin' && isTable) {
+            // `margin: 0 auto` centring: keep only the horizontal parts as longhands so
+            // the table parseDOM's `margin-left/right: auto` check recognises it.
+            if (isLengthList(value)) {
+                const tokens = value.trim().split(/\s+/);
+                const [, right] = tokens.length === 1
+                    ? [tokens[0], tokens[0]]
+                    : [tokens[0], tokens[1]];
+                const left = tokens.length >= 4 ? tokens[3] : right;
+                kept.push(`margin-left: ${left}`, `margin-right: ${right}`);
+            }
+            continue;
+        }
+        if (CONTAINER_DROP.has(name))
+            continue;
+        // Border longhand groups (`border-width/-style/-color`, per side or not) are
+        // how the browser re-serializes four equal sides; recombined per side below.
+        if (isCell && CELL_BORDER_LONGHAND.test(name))
+            continue;
+        if (isCell && CELL_LAYOUT.has(name) && isLayoutValid(name, value)) {
+            kept.push(`${name}: ${value}`);
+        }
+        else if (isTable && TABLE_LAYOUT.has(name) && isLayoutValid(name, value)) {
+            kept.push(`${name}: ${value}`);
+        }
+        else if (isBlock && BLOCK_LAYOUT.has(name) && isLengthList(value)) {
+            kept.push(`${name}: ${value}`);
+        }
+        else if (ALLOWED_STYLES.has(name)) {
+            kept.push(`${name}: ${value}`);
+        }
+        else if (extra && extra.has(name)) {
+            kept.push(`${name}: ${value}`);
+        }
+    }
+    // A cell border written as longhand groups: read each side back through CSSOM,
+    // which resolves any mix of shorthands and longhands to `width style color`.
+    if (isCell && !kept.some(d => d.startsWith('border:'))) {
+        const style = el.style;
+        for (const side of ['top', 'right', 'bottom', 'left']) {
+            const prop = `border-${side}`;
+            if (kept.some(d => d.startsWith(`${prop}:`)))
+                continue;
+            const value = style?.getPropertyValue(prop);
+            if (value && isBorder(value))
+                kept.push(`${prop}: ${value}`);
+        }
+    }
+    // Legacy presentational attributes → validated styles (raw attr removed by the
+    // standard attribute pass, which doesn't list them).
+    if (isCell || isTable) {
+        const bgcolor = el.getAttribute('bgcolor');
+        if (bgcolor && isColor(bgcolor) && !kept.some(d => d.startsWith('background-color'))) {
+            kept.push(`background-color: ${bgcolor}`);
+        }
+        const widthAttr = el.getAttribute('width');
+        if (widthAttr && !kept.some(d => d.startsWith('width'))) {
+            const width = /^\d+$/.test(widthAttr)
+                ? `${widthAttr}px`
+                : /^\d+%$/.test(widthAttr)
+                    ? widthAttr
+                    : null;
+            if (width)
+                kept.push(`width: ${width}`);
+        }
+        const valign = el.getAttribute('valign');
+        if (isCell && valign && isValign(valign) && !kept.some(d => d.startsWith('vertical-align'))) {
+            kept.push(`vertical-align: ${valign}`);
+        }
+        // Legacy cell align → text-align; the attr stays for table centring.
+        const alignAttr = el.getAttribute('align');
+        if (isCell &&
+            alignAttr &&
+            LEGACY_ALIGN_KEYWORDS.has(alignAttr.toLowerCase()) &&
+            !kept.some(d => d.startsWith('text-align'))) {
+            kept.push(`text-align: ${alignAttr.toLowerCase()}`);
+        }
+    }
+    return kept.join('; ');
+}
+/** Cell text declarations lifted onto `data-cell-text-style` before PM parse. */
+const CELL_TEXT_PROPS = ['color', 'font-family', 'font-size', 'font-weight'];
+/** Table text declarations lifted onto `data-table-text-style` before PM parse. */
+const TABLE_TEXT_PROPS = ['color', 'font-family', 'font-size', 'font-weight', 'line-height'];
+/** Moves carried background/font declarations onto data-attrs so they never become marks. */
+function relocateElement(el, tag) {
+    if (tag === 'td' || tag === 'th') {
+        const bg = el.style.backgroundColor;
+        if (bg) {
+            el.setAttribute('data-cell-bg', bg);
+            el.style.removeProperty('background-color');
+        }
+        const parts = [];
+        for (const prop of CELL_TEXT_PROPS) {
+            const value = el.style.getPropertyValue(prop);
+            if (value) {
+                parts.push(`${prop}: ${value}`);
+                el.style.removeProperty(prop);
+            }
+        }
+        if (parts.length)
+            el.setAttribute('data-cell-text-style', parts.join('; '));
+        // Cell text-align → data-cell-align (so it stays a node attr, never a mark).
+        const align = el.style.textAlign;
+        if (align) {
+            el.setAttribute('data-cell-align', align);
+            el.style.removeProperty('text-align');
+        }
+        if (!el.getAttribute('style'))
+            el.removeAttribute('style');
+    }
+    else if (tag === 'table') {
+        const bg = el.style.backgroundColor;
+        if (bg) {
+            el.setAttribute('data-table-bg', bg);
+            el.style.removeProperty('background-color');
+        }
+        const textParts = [];
+        for (const prop of TABLE_TEXT_PROPS) {
+            const value = el.style.getPropertyValue(prop);
+            if (value) {
+                textParts.push(`${prop}: ${value}`);
+                el.style.removeProperty(prop);
+            }
+        }
+        if (textParts.length)
+            el.setAttribute('data-table-text-style', textParts.join('; '));
+        // Email containers are centred with `align="center"` on the table or on
+        // the cell that holds it.
+        const holder = el.parentElement?.closest('td, th');
+        if (el.getAttribute('align')?.toLowerCase() === 'center' ||
+            holder?.getAttribute('align')?.toLowerCase() === 'center') {
+            el.setAttribute('data-table-align', 'center');
+        }
+        if (!el.getAttribute('style'))
+            el.removeAttribute('style');
+    }
+}
+function relocateWalk(node) {
+    for (const child of Array.from(node.children)) {
+        relocateElement(child, child.tagName.toLowerCase());
+        relocateWalk(child);
+    }
+}
+/** A `<col>` width (style width or `width` attr) normalized to a px/% token. */
+function colWidth(col) {
+    const styleWidth = /width\s*:\s*([^;]+)/i.exec(col.getAttribute('style') ?? '')?.[1]?.trim();
+    const v = (styleWidth || col.getAttribute('width') || '').trim();
+    if (!v)
+        return null;
+    if (/^\d+$/.test(v))
+        return `${v}px`;
+    if (LENGTH_TOKEN.test(v) && /(?:px|%)$/.test(v))
+        return v;
+    return null;
+}
+/** Per-column widths of a table's own colgroup, expanding `span`. */
+function tableColWidths(table) {
+    const widths = [];
+    for (const col of Array.from(table.querySelectorAll(':scope > colgroup > col, :scope > col'))) {
+        const span = parseInt(col.getAttribute('span') ?? '1', 10);
+        const n = Number.isFinite(span) && span > 0 ? span : 1;
+        const w = colWidth(col);
+        for (let i = 0; i < n; i += 1)
+            widths.push(w);
+    }
+    return widths;
+}
+/** A table's own rows (not nested tables' rows). */
+function directRows(table) {
+    const rows = [];
+    for (const child of Array.from(table.children)) {
+        const t = child.tagName.toLowerCase();
+        if (t === 'tr')
+            rows.push(child);
+        else if (t === 'thead' || t === 'tbody' || t === 'tfoot') {
+            for (const row of Array.from(child.children)) {
+                if (row.tagName.toLowerCase() === 'tr')
+                    rows.push(row);
+            }
+        }
+    }
+    return rows;
+}
+/** Copies colgroup widths onto unsized cells (rows with a colspan are skipped). */
+function applyColgroupWidths(table) {
+    const widths = tableColWidths(table);
+    if (!widths.some(Boolean))
+        return;
+    for (const row of directRows(table)) {
+        const cells = Array.from(row.children).filter(c => /^t[dh]$/.test(c.tagName.toLowerCase()));
+        if (cells.some(c => parseInt(c.getAttribute('colspan') ?? '1', 10) > 1))
+            continue;
+        cells.forEach((cell, idx) => {
+            const w = widths[idx];
+            if (!w)
+                return;
+            const hasWidth = /(?:^|;)\s*width\s*:/i.test(cell.getAttribute('style') ?? '') || cell.hasAttribute('width');
+            if (hasWidth)
+                return;
+            const style = cell.getAttribute('style') ?? '';
+            cell.setAttribute('style', style ? `${style}; width: ${w}` : `width: ${w}`);
+        });
+    }
+}
+/** Fidelity-only pass run right before parsing; see `relocateElement`. */
+export function relocateEmailContainers(html) {
+    const doc = new DOMParser().parseFromString(`<body>${html}</body>`, 'text/html');
+    relocateWalk(doc.body);
+    return doc.body.innerHTML;
+}
 /**
  * Sanitizes the CSS inside a <style> block. Neutralizes the vectors that make
  * a raw stylesheet dangerous while leaving ordinary rules intact:
@@ -129,8 +504,55 @@ export function sanitizeCss(css) {
     })
         .trim();
 }
-function sanitizeElement(el) {
+/** Container tags an app may widen with `allowedStyles`. */
+const EXTENSION_TAGS = new Set(['td', 'th', 'table', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6']);
+/** The allowlisted, grammar-valid extension declarations for a container, or ''. */
+function computeExtraStyle(el, allowed) {
+    if (!allowed)
+        return '';
+    const kept = [];
+    for (const decl of (el.getAttribute('style') ?? '').split(';')) {
+        const idx = decl.indexOf(':');
+        if (idx === -1)
+            continue;
+        const name = decl.slice(0, idx).trim().toLowerCase();
+        const value = decl.slice(idx + 1).trim();
+        if (allowed.has(name) && isExtensionValueValid(value))
+            kept.push(`${name}: ${value}`);
+    }
+    return kept.join('; ');
+}
+/** Re-validates a stored cell/table text style on write-back. */
+export function sanitizeTableTextStyleForWrite(s) {
+    const kept = [];
+    for (const decl of String(s ?? '').split(';')) {
+        const idx = decl.indexOf(':');
+        if (idx === -1)
+            continue;
+        const name = decl.slice(0, idx).trim().toLowerCase();
+        const value = decl.slice(idx + 1).trim();
+        if (!value)
+            continue;
+        const ok = name === 'line-height'
+            ? isLineHeight(value)
+            : TABLE_TEXT_PROPS.includes(name) && isCellTextValid(name, value);
+        if (ok)
+            kept.push(`${name}: ${value}`);
+    }
+    return kept.join('; ');
+}
+function sanitizeElement(el, emailFidelity = false, allowedStyles) {
     const tag = el.tagName.toLowerCase();
+    // With fidelity, a table pushes its colgroup column widths down onto its own
+    // cells before they are sanitized (the <col> widths are stripped otherwise).
+    if (emailFidelity && tag === 'table')
+        applyColgroupWidths(el);
+    // Fidelity recomputes the container style, written back after the attribute pass.
+    const email = emailFidelity && CONTAINER_TAGS.has(tag) ? computeContainerStyle(el, tag) : null;
+    // Extension declarations come from the original style and move to data-extra-style.
+    const extra = emailFidelity && EXTENSION_TAGS.has(tag)
+        ? computeExtraStyle(el, allowedStyles?.get(tag))
+        : '';
     const allowed = TAG_ATTRS[tag];
     for (const attr of Array.from(el.attributes)) {
         const name = attr.name.toLowerCase();
@@ -170,14 +592,31 @@ function sanitizeElement(el) {
                 el.removeAttribute('target');
         }
     }
+    if (email !== null) {
+        if (email)
+            el.setAttribute('style', email);
+        else
+            el.removeAttribute('style');
+    }
+    if (extra)
+        el.setAttribute('data-extra-style', extra);
 }
-function walk(node) {
+function walk(node, emailFidelity = false, allowedStyles) {
     for (const child of Array.from(node.children)) {
         const tag = child.tagName.toLowerCase();
         if (DROP_WITH_CONTENT.has(tag)) {
             child.remove();
             continue;
         }
+        // Email preheaders: elements hidden with display:none / mso-hide are dropped
+        // together with their content so they don't surface as 1px text.
+        if (emailFidelity) {
+            const style = child.getAttribute('style') ?? '';
+            if (/display\s*:\s*none/i.test(style) || /mso-hide\s*:\s*all/i.test(style)) {
+                child.remove();
+                continue;
+            }
+        }
         // iframes are allowed for any https src, but always force-sandboxed so an
         // untrusted embed can never navigate the top window or run unrestricted.
         if (tag === 'iframe') {
@@ -200,24 +639,308 @@ function walk(node) {
         if (!ALLOWED_TAGS.has(tag)) {
             // Unknown wrapper (article, section, table for now, …): keep its
             // content, drop the element itself.
-            walk(child);
+            walk(child, emailFidelity, allowedStyles);
             child.replaceWith(...Array.from(child.childNodes));
             continue;
         }
-        sanitizeElement(child);
-        walk(child);
+        sanitizeElement(child, emailFidelity, allowedStyles);
+        walk(child, emailFidelity, allowedStyles);
+    }
+}
+/* --- email-fidelity: button links → one-cell table buttons (flag-gated) --- */
+/** Box declarations an email "button" link carries; moved onto the new cell. */
+const BUTTON_CELL_PROPS = new Set([
+    'background-color', 'padding', 'padding-top', 'padding-right',
+    'padding-bottom', 'padding-left', 'border-radius', 'width', 'border',
+    'border-top', 'border-right', 'border-bottom', 'border-left', 'text-align',
+]);
+/** Text-level declarations kept on the link (they become marks on its text). */
+const BUTTON_LINK_PROPS = new Set([
+    'color', 'font-size', 'font-weight', 'font-family', 'font-style',
+    'text-decoration', 'text-decoration-line', 'line-height',
+]);
+/** Block parents whose sole-child button link may be lifted into a table. */
+const BUTTON_PARENT_TAGS = new Set(['td', 'th', 'div', 'p']);
+/** Splits an inline `style` into `{name, value}` pairs (names lowercased). */
+function parseDecls(style) {
+    const out = [];
+    for (const decl of style.split(';')) {
+        const idx = decl.indexOf(':');
+        if (idx === -1)
+            continue;
+        const name = decl.slice(0, idx).trim().toLowerCase();
+        const value = decl.slice(idx + 1).trim();
+        if (name && value)
+            out.push({ name, value });
+    }
+    return out;
+}
+/** A button link: `display:inline-block|block` plus a background or padding. */
+function isButtonLink(decls) {
+    const display = decls.find(d => d.name === 'display')?.value.toLowerCase();
+    if (display !== 'inline-block' && display !== 'block')
+        return false;
+    return decls.some(d => d.name === 'background-color' || d.name.startsWith('padding'));
+}
+/** True when the link is horizontally auto-centred (`margin: 0 auto`, etc.). */
+function hasAutoHMargin(decls) {
+    const ml = decls.find(d => d.name === 'margin-left')?.value.toLowerCase();
+    const mr = decls.find(d => d.name === 'margin-right')?.value.toLowerCase();
+    if (ml === 'auto' || mr === 'auto')
+        return true;
+    const margin = decls.find(d => d.name === 'margin')?.value;
+    if (!margin)
+        return false;
+    const tokens = margin.trim().split(/\s+/);
+    const right = tokens.length >= 2 ? tokens[1] : tokens[0];
+    const left = tokens.length >= 4 ? tokens[3] : right;
+    return left.toLowerCase() === 'auto' || right.toLowerCase() === 'auto';
+}
+/** True when a block centres its content via text-align / legacy align. */
+function blockCentered(el) {
+    if (/text-align\s*:\s*center/i.test(el.getAttribute('style') ?? ''))
+        return true;
+    return el.getAttribute('align')?.toLowerCase() === 'center';
+}
+/** The link is the only non-whitespace content of its parent block. */
+function isSoleContent(parent, child) {
+    for (const node of Array.from(parent.childNodes)) {
+        if (node === child)
+            continue;
+        if (node.nodeType === 3) {
+            if ((node.textContent ?? '').trim() !== '')
+                return false;
+        }
+        else {
+            return false;
+        }
+    }
+    return true;
+}
+/** Rebuilds each email button link as a one-cell layout table. */
+function convertButtonLinks(body) {
+    const doc = body.ownerDocument;
+    for (const a of Array.from(body.querySelectorAll('a[href]'))) {
+        const decls = parseDecls(a.getAttribute('style') ?? '');
+        if (!isButtonLink(decls))
+            continue;
+        const parent = a.parentElement;
+        if (!parent)
+            continue;
+        if (!BUTTON_PARENT_TAGS.has(parent.tagName.toLowerCase()))
+            continue;
+        if (!isSoleContent(parent, a))
+            continue;
+        // Box declarations go to the cell; text declarations stay on the link;
+        // margins/display are dropped (margins only inform centring below).
+        const cell = decls.filter(d => BUTTON_CELL_PROPS.has(d.name));
+        if (!cell.some(d => d.name === 'text-align')) {
+            cell.push({ name: 'text-align', value: 'center' });
+        }
+        const linkStyle = decls
+            .filter(d => BUTTON_LINK_PROPS.has(d.name))
+            .map(d => `${d.name}: ${d.value}`)
+            .join('; ');
+        const centred = hasAutoHMargin(decls) || blockCentered(parent);
+        const table = doc.createElement('table');
+        table.setAttribute('role', 'presentation');
+        if (centred)
+            table.setAttribute('align', 'center');
+        const tbody = doc.createElement('tbody');
+        const tr = doc.createElement('tr');
+        const td = doc.createElement('td');
+        td.setAttribute('style', cell.map(d => `${d.name}: ${d.value}`).join('; '));
+        if (linkStyle)
+            a.setAttribute('style', linkStyle);
+        else
+            a.removeAttribute('style');
+        td.appendChild(a); // detaches the link from its original parent
+        tr.appendChild(td);
+        tbody.appendChild(tr);
+        table.appendChild(tbody);
+        const parentTag = parent.tagName.toLowerCase();
+        if (parentTag === 'p' || parentTag === 'div')
+            parent.replaceWith(table);
+        else
+            parent.appendChild(table);
+    }
+}
+/* --- email-fidelity: push centring onto blocks that can carry it (flag-gated) --- */
+/** Inline tags: loose runs of these (and text) inside a div/center are wrapped. */
+const INLINE_TAGS = new Set([
+    'a', 'b', 'strong', 'i', 'em', 'u', 's', 'strike', 'del', 'span', 'code',
+    'sub', 'sup', 'font', 'br', 'img', 'small', 'big', 'mark', 'abbr', 'q', 'cite',
+    'label', 'bdi', 'bdo', 'wbr', 'time', 'kbd', 'samp', 'var',
+]);
+/** A node that may be lifted into a wrapping paragraph (inline element or text). */
+function isLooseInline(node) {
+    if (node.nodeType === 3)
+        return true;
+    if (node.nodeType !== 1)
+        return false;
+    return INLINE_TAGS.has(node.tagName.toLowerCase());
+}
+/** True when `el` already declares a valid `text-align` or legacy `align`. */
+function hasOwnTextAlign(el) {
+    const styleAlign = /text-align\s*:\s*([a-z-]+)/i.exec(el.getAttribute('style') ?? '')?.[1];
+    if (styleAlign && TEXT_ALIGN_KEYWORDS.has(styleAlign.toLowerCase()))
+        return true;
+    const attr = el.getAttribute('align');
+    return !!(attr && LEGACY_ALIGN_KEYWORDS.has(attr.toLowerCase()));
+}
+/** Appends `text-align: value` to an element's inline style. */
+function addTextAlign(el, value) {
+    const style = (el.getAttribute('style') ?? '').trim();
+    el.setAttribute('style', style ? `${style}; text-align: ${value}` : `text-align: ${value}`);
+}
+/** Direct cells of a table (its own rows', not a nested table's). */
+function directCells(table) {
+    const cells = [];
+    for (const row of directRows(table)) {
+        for (const child of Array.from(row.children)) {
+            if (/^t[dh]$/.test(child.tagName.toLowerCase()))
+                cells.push(child);
+        }
+    }
+    return cells;
+}
+/** True when `el` sits inside a table that is itself a descendant of `wrapper`. */
+function insideNestedTable(el, wrapper) {
+    let p = el.parentElement;
+    while (p && p !== wrapper) {
+        if (p.tagName.toLowerCase() === 'table')
+            return true;
+        p = p.parentElement;
+    }
+    return false;
+}
+/** The block descendants (p/h1-6/li) of `wrapper` not inside a nested table. */
+function alignableBlocks(wrapper) {
+    return Array.from(wrapper.querySelectorAll('p, h1, h2, h3, h4, h5, h6, li')).filter(el => !insideNestedTable(el, wrapper));
+}
+/** Wraps each loose inline run directly inside `wrapper` in an aligned `<p>`. */
+function wrapLooseInline(wrapper, value) {
+    const doc = wrapper.ownerDocument;
+    let group = [];
+    const flush = () => {
+        // Trim trailing whitespace-only text nodes so they stay outside the paragraph.
+        while (group.length && group[group.length - 1].nodeType === 3
+            && (group[group.length - 1].textContent ?? '').trim() === '') {
+            group.pop();
+        }
+        if (!group.length)
+            return;
+        const p = doc.createElement('p');
+        p.setAttribute('style', `text-align: ${value}`);
+        group[0].before(p);
+        for (const node of group)
+            p.appendChild(node);
+        group = [];
+    };
+    for (const node of Array.from(wrapper.childNodes)) {
+        if (isLooseInline(node)) {
+            const blank = node.nodeType === 3 && (node.textContent ?? '').trim() === '';
+            // Leading whitespace with nothing accumulated is left where it is.
+            if (blank && !group.length)
+                continue;
+            group.push(node);
+        }
+        else {
+            flush();
+        }
+    }
+    flush();
+}
+/** Pushes a `<center>`/aligned-`<div>` alignment onto its blocks (and tables, for legacy forms). */
+function propagateBlockAlignment(wrapper, value, centreTables) {
+    wrapLooseInline(wrapper, value);
+    for (const block of alignableBlocks(wrapper)) {
+        if (!hasOwnTextAlign(block))
+            addTextAlign(block, value);
+    }
+    if (centreTables) {
+        for (const table of Array.from(wrapper.querySelectorAll('table'))) {
+            if (insideNestedTable(table, wrapper))
+                continue;
+            if (!table.getAttribute('align'))
+                table.setAttribute('align', value);
+        }
+    }
+}
+/** Pre-pass: resolve container-level alignment onto blocks/cells (see above). */
+function propagateEmailAlignment(body) {
+    // Cases 2–4: <center>, div[align], div[style text-align].
+    for (const el of Array.from(body.querySelectorAll('center, div'))) {
+        const tag = el.tagName.toLowerCase();
+        if (tag === 'center') {
+            propagateBlockAlignment(el, 'center', true);
+            continue;
+        }
+        const attr = el.getAttribute('align')?.toLowerCase();
+        if (attr && LEGACY_ALIGN_KEYWORDS.has(attr)) {
+            propagateBlockAlignment(el, attr, true);
+            continue;
+        }
+        const styleAlign = /text-align\s*:\s*([a-z-]+)/i.exec(el.getAttribute('style') ?? '')?.[1]
+            ?.toLowerCase();
+        if (styleAlign && TEXT_ALIGN_KEYWORDS.has(styleAlign)) {
+            propagateBlockAlignment(el, styleAlign, false);
+        }
+    }
+    // Case 1: a cell's align must not leak into a table nested directly in it.
+    for (const cell of Array.from(body.querySelectorAll('td[align], th[align]'))) {
+        const attr = cell.getAttribute('align')?.toLowerCase();
+        if (!attr || !LEGACY_ALIGN_KEYWORDS.has(attr))
+            continue;
+        for (const table of Array.from(cell.querySelectorAll('table'))) {
+            if (table.closest('td, th') !== cell)
+                continue;
+            for (const nested of directCells(table)) {
+                if (!hasOwnTextAlign(nested))
+                    addTextAlign(nested, 'left');
+            }
+        }
+    }
+    // Case 5: CSS text-align on a table → its direct cells that have none.
+    for (const table of Array.from(body.querySelectorAll('table'))) {
+        const styleAlign = /text-align\s*:\s*([a-z-]+)/i.exec(table.getAttribute('style') ?? '')?.[1]
+            ?.toLowerCase();
+        if (!styleAlign || !TEXT_ALIGN_KEYWORDS.has(styleAlign))
+            continue;
+        for (const cell of directCells(table)) {
+            if (!hasOwnTextAlign(cell))
+                addTextAlign(cell, styleAlign);
+        }
+    }
+    // Case 6: tr[align] → its own cells that have none.
+    for (const tr of Array.from(body.querySelectorAll('tr[align]'))) {
+        const attr = tr.getAttribute('align')?.toLowerCase();
+        if (!attr || !LEGACY_ALIGN_KEYWORDS.has(attr))
+            continue;
+        for (const child of Array.from(tr.children)) {
+            if (!/^t[dh]$/.test(child.tagName.toLowerCase()))
+                continue;
+            if (!hasOwnTextAlign(child))
+                addTextAlign(child, attr);
+        }
     }
 }
 /**
  * Sanitizes an HTML string. Parsing happens in an inert document created by
  * DOMParser, so embedded scripts never execute and images never load.
  */
-export function sanitizeHtml(html) {
+export function sanitizeHtml(html, options) {
     // Wrap in an explicit <body> so metadata-like tags (notably <style>) stay in
     // the body instead of being hoisted into <head> by the HTML parser — which
     // would drop them before walk() ever sees them. Mirrors htmlToDoc's parse.
     const doc = new DOMParser().parseFromString(`<body>${html}</body>`, 'text/html');
-    walk(doc.body);
+    // Button links are restructured into one-cell tables before the walk, so the
+    // cell/link styles they produce pass through the normal validators.
+    if (options?.emailFidelity) {
+        convertButtonLinks(doc.body);
+        propagateEmailAlignment(doc.body);
+    }
+    walk(doc.body, options?.emailFidelity ?? false, options?.allowedStyles);
     return doc.body.innerHTML;
 }
 //# sourceMappingURL=sanitize.js.map