officeparser 7.2.3 → 7.4.0

package/dist/generators/HtmlGenerator.js

@@ -1,7 +1,87 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.HtmlGenerator = void 0;
+const types_js_1 = require("../types.js");
 const BaseGenerator_js_1 = require("./BaseGenerator.js");
+const errorUtils_js_1 = require("../utils/errorUtils.js");
+const sanitize_js_1 = require("../utils/sanitize.js");
+/**
+ * Attributes that carry a URL and therefore must go through `sanitizeUrl` rather than plain
+ * escaping - an escaped `javascript:` payload is still a `javascript:` payload.
+ */
+const URL_BEARING_ATTRS = new Set([
+    'href', 'src', 'srcset', 'action', 'formaction', 'poster', 'cite', 'data', 'background', 'ping',
+]);
+/**
+ * Renders `node.htmlAttributes` (see `BaseContentNode.htmlAttributes`) as an attribute string.
+ *
+ * This re-applies the parser's filtering rather than trusting it, because an AST can be built
+ * programmatically and handed straight to the generator - the parse-side pass is defence in depth,
+ * not the only gate. `class` is returned separately so the caller can merge it into the class
+ * attribute it already composes: emitting a second `class=` would be invalid HTML and, worse, a
+ * *fatal* XML well-formedness error once EpubGenerator converts the output to XHTML.
+ */
+function renderHtmlAttributeBag(node, alreadyEmitted = []) {
+    const bag = node.htmlAttributes;
+    if (!bag)
+        return { attrs: '' };
+    const taken = new Set([...alreadyEmitted].map(k => k.toLowerCase()));
+    let attrs = '';
+    let className;
+    for (const [rawKey, rawValue] of Object.entries(bag)) {
+        const key = rawKey.toLowerCase();
+        // Same policy as the parser, restated here because this path is independently reachable.
+        if (/^on/i.test(key))
+            continue;
+        if (key === 'srcdoc' || key === 'style' || key === 'id')
+            continue;
+        if (!(0, sanitize_js_1.isSafeHtmlAttributeName)(key))
+            continue;
+        if (taken.has(key))
+            continue;
+        if (key === 'class') {
+            className = String(rawValue);
+            continue;
+        }
+        if (URL_BEARING_ATTRS.has(key)) {
+            const safe = (0, sanitize_js_1.sanitizeUrl)(String(rawValue));
+            if (!safe)
+                continue;
+            attrs += ` ${key}="${safe}"`;
+            continue;
+        }
+        attrs += ` ${key}="${(0, sanitize_js_1.escapeHtml)(String(rawValue))}"`;
+    }
+    return { attrs, className };
+}
+/**
+ * Normalizes `HtmlGeneratorConfig.standalone` (`boolean | StandaloneConfig`) into a fully
+ * resolved object. `true`/undefined turns every part on (a complete standalone document);
+ * `false` turns every part off (a bare content fragment). When an object is passed, any field
+ * left unspecified defaults to its "on" value, matching the boolean-shorthand semantics.
+ */
+function resolveStandalone(standalone) {
+    const uniform = (on) => ({
+        document: on,
+        metaTags: on,
+        styles: on ? 'full' : 'none',
+        scripts: on,
+        headInjections: on,
+        bodyInjections: on,
+    });
+    if (standalone === undefined || typeof standalone === 'boolean') {
+        return uniform(standalone ?? true);
+    }
+    const on = uniform(true);
+    return {
+        document: standalone.document ?? on.document,
+        metaTags: standalone.metaTags ?? on.metaTags,
+        styles: standalone.styles ?? on.styles,
+        scripts: standalone.scripts ?? on.scripts,
+        headInjections: standalone.headInjections ?? on.headInjections,
+        bodyInjections: standalone.bodyInjections ?? on.bodyInjections,
+    };
+}
 /**
  * Generates semantic, high-fidelity HTML from an AST.
  */
@@ -29,11 +109,31 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             containerClass = 'pdf-container';
         let bodyContent = await this.processNodeArray(this.ast.content);
         if (this.collectedNotes.length > 0) {
-            let notesHtml = '';
-            for (const note of this.collectedNotes) {
-                notesHtml += await this.processNodeRecursive(note, this.nodeProcessor.bind(this));
+            // Footnotes/endnotes get their own <section data-footnotes> (the agreed
+            // contract with inscript-editor's footnote node); other note types (e.g.
+            // slide speaker notes) keep the existing generic notes wrapper.
+            const footnotes = this.collectedNotes.filter(n => {
+                const t = n.metadata?.noteType;
+                return t === 'footnote' || t === 'endnote';
+            });
+            const otherNotes = this.collectedNotes.filter(n => !footnotes.includes(n));
+            if (footnotes.length > 0) {
+                let footnotesHtml = '';
+                for (const note of footnotes) {
+                    footnotesHtml += await this.processNodeRecursive(note, this.nodeProcessor.bind(this));
+                }
+                // data-footnotes carries an explicit empty value (not a bare attribute) so
+                // the markup is valid XHTML too - EpubGenerator embeds this verbatim, and
+                // XML rejects valueless attributes. HtmlParser only checks for presence.
+                bodyContent += `\n<section data-footnotes="">\n${footnotesHtml}\n</section>\n`;
+            }
+            if (otherNotes.length > 0) {
+                let notesHtml = '';
+                for (const note of otherNotes) {
+                    notesHtml += await this.processNodeRecursive(note, this.nodeProcessor.bind(this));
+                }
+                bodyContent += `\n<div class="document-notes-section">\n<hr class="page-break">\n${notesHtml}\n</div>\n`;
             }
-            bodyContent += `\n<div class="document-notes-section">\n<hr class="page-break">\n${notesHtml}\n</div>\n`;
         }
         const metadataBlock = this.config.renderMetadata ? this.renderMetadataSummary() : '';
         let title = 'Document';
@@ -214,28 +314,38 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
     else window.addEventListener('load', switchSheet);
 </script>`;
         }
-        if (this.config.htmlConfig.standalone) {
-            title = this.ast.metadata?.title || 'Document';
+        const sa = resolveStandalone(this.config.htmlConfig.standalone);
+        if (sa.document && sa.metaTags) {
+            title = this.effectiveMetadata.title || 'Document';
             metaTags = this.renderMetaTags();
         }
-        const styles = this.config.htmlConfig.standalone ? '' : `<style>${this.getPremiumStyles(this.isSpreadsheetMode, isPresentation, isPdf)}</style>`;
+        const styleBlock = sa.styles === 'none' ? '' : `<style>${sa.styles === 'scoped'
+            ? this.getScopedPremiumStyles(this.isSpreadsheetMode, isPresentation, isPdf)
+            : this.getPremiumStyles(this.isSpreadsheetMode, isPresentation, isPdf)}</style>`;
+        // 'scoped' styles are anchored to this wrapper via CSS @scope, so custom properties and
+        // base body-level styling attach here instead of leaking onto a host page's real <html>/
+        // <body> when the output is embedded as a fragment.
+        const scopeOpen = sa.styles === 'scoped' ? '<div class="op-html-scope">' : '';
+        const scopeClose = sa.styles === 'scoped' ? '</div>' : '';
         const inj = this.config.htmlConfig.injections;
-        const value = this.config.htmlConfig.standalone ? `<!DOCTYPE html>
+        const headInjectionsOn = sa.document && sa.headInjections;
+        const chartScriptTag = (sa.scripts && this.config.includeCharts) ? `<script src="${this.config.htmlConfig.chartJsSrc}"></script>` : '';
+        const spreadsheetScriptOut = sa.scripts ? spreadsheetScript : '';
+        const value = sa.document ? `<!DOCTYPE html>
 <html lang="en">
 <head>
-    ${inj.headStart}
+    ${headInjectionsOn ? inj.headStart : ''}
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>${this.escape(title)}</title>
     ${metaTags}
-    ${this.config.includeCharts ? `<script src="${this.config.htmlConfig.chartJsSrc}"></script>` : ''}
-    <style>
-        ${this.getPremiumStyles(this.isSpreadsheetMode, isPresentation, isPdf)}
-    </style>
-    ${inj.headEnd}
+    ${chartScriptTag}
+    ${styleBlock}
+    ${headInjectionsOn ? inj.headEnd : ''}
 </head>
 <body>
-    ${inj.bodyStart}
+    ${sa.bodyInjections ? inj.bodyStart : ''}
+    ${scopeOpen}
     <div class="${containerClass}">
         <article>
             ${metadataBlock}
@@ -243,10 +353,11 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
         </article>
         ${spreadsheetTabs}
     </div>
-    ${spreadsheetScript}
-    ${inj.bodyEnd}
+    ${scopeClose}
+    ${spreadsheetScriptOut}
+    ${sa.bodyInjections ? inj.bodyEnd : ''}
 </body>
-</html>` : `${styles}<div class="${containerClass}">${metadataBlock}${bodyContent}${spreadsheetTabs}</div>${spreadsheetScript}`;
+</html>` : `${styleBlock}${sa.bodyInjections ? inj.bodyStart : ''}${scopeOpen}<div class="${containerClass}">${metadataBlock}${bodyContent}${spreadsheetTabs}</div>${scopeClose}${spreadsheetScriptOut}${sa.bodyInjections ? inj.bodyEnd : ''}`;
         return {
             value,
             messages: this.messages
@@ -255,18 +366,27 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
     renderMetaTags() {
         if (!this.ast?.metadata)
             return '';
-        const m = this.ast.metadata;
+        const m = this.effectiveMetadata;
         const tags = [];
         if (m.author)
             tags.push(`<meta name="author" content="${this.escape(m.author)}">`);
         if (m.description)
             tags.push(`<meta name="description" content="${this.escape(m.description)}">`);
-        if (m.created)
-            tags.push(`<meta name="dcterms.created" content="${new Date(m.created).toISOString()}">`);
-        if (m.modified)
-            tags.push(`<meta name="dcterms.modified" content="${new Date(m.modified).toISOString()}">`);
+        const created = this.toIsoDate(m.created);
+        const modified = this.toIsoDate(m.modified);
+        if (created)
+            tags.push(`<meta name="dcterms.created" content="${created}">`);
+        if (modified)
+            tags.push(`<meta name="dcterms.modified" content="${modified}">`);
         if (m.lastModifiedBy)
             tags.push(`<meta name="lastModifiedBy" content="${this.escape(m.lastModifiedBy)}">`);
+        // Both are parsed from every OOXML/ODF core-properties block but had no output sink at
+        // all, so they were silently dropped on every conversion. `keywords` is the standard HTML
+        // meta name; `subject` has no standard equivalent, so it uses its Dublin Core name.
+        if (m.keywords)
+            tags.push(`<meta name="keywords" content="${this.escape(m.keywords)}">`);
+        if (m.subject)
+            tags.push(`<meta name="DC.subject" content="${this.escape(m.subject)}">`);
         if (m.customProperties) {
             for (const [key, val] of Object.entries(m.customProperties)) {
                 tags.push(`<meta name="custom:${this.escape(key)}" content="${this.escape(String(val))}">`);
@@ -277,7 +397,7 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
     renderMetadataSummary() {
         if (!this.ast?.metadata)
             return '';
-        const m = this.ast.metadata;
+        const m = this.effectiveMetadata;
         let customPropsHtml = '';
         if (m.customProperties && Object.keys(m.customProperties).length > 0) {
             const items = Object.entries(m.customProperties)
@@ -312,12 +432,18 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
      */
     async processNodeArray(nodes) {
         let html = '';
-        // Stack to track active lists: { indentation, type }
+        // Stack to track active lists: { indentation, type, isTask }
         const listStack = [];
+        const openListTag = (type, isTask) => {
+            if (isTask)
+                return '<ul data-type="taskList">';
+            return type === 'ordered' ? '<ol>' : '<ul>';
+        };
+        const closeListTag = (type) => type === 'ordered' ? '</ol>' : '</ul>';
         const closeListsToLevel = (level) => {
             while (listStack.length > 0 && listStack[listStack.length - 1].indentation > level) {
                 const list = listStack.pop();
-                html += (list?.type === 'ordered' ? '</ol>' : '</ul>') + '\n\n';
+                html += closeListTag(list.type) + '\n\n';
             }
         };
         for (const node of nodes) {
@@ -329,23 +455,24 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             if (node.type === 'list') {
                 const meta = node.metadata;
                 const type = meta?.listType === 'ordered' ? 'ordered' : 'unordered';
+                const isTask = !!meta?.isTask;
                 const indentation = meta?.indentation || 0;
                 // Close deeper lists
                 closeListsToLevel(indentation);
                 // Handle current level
                 if (listStack.length > 0 && listStack[listStack.length - 1].indentation === indentation) {
-                    if (listStack[listStack.length - 1].type !== type) {
+                    if (listStack[listStack.length - 1].type !== type || listStack[listStack.length - 1].isTask !== isTask) {
                         // Type changed at same level
                         const last = listStack.pop();
-                        html += (last?.type === 'ordered' ? '</ol>' : '</ul>') + '\n';
-                        html += (type === 'ordered' ? '<ol>' : '<ul>') + '\n';
-                        listStack.push({ indentation, type });
+                        html += closeListTag(last.type) + '\n';
+                        html += openListTag(type, isTask) + '\n';
+                        listStack.push({ indentation, type, isTask });
                     }
                 }
                 else {
                     // Start a new nested list
-                    html += (type === 'ordered' ? '<ol>' : '<ul>') + '\n';
-                    listStack.push({ indentation, type });
+                    html += openListTag(type, isTask) + '\n';
+                    listStack.push({ indentation, type, isTask });
                 }
                 html += await this.processNodeRecursive(node, this.nodeProcessor.bind(this), override);
             }
@@ -371,6 +498,10 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
      */
     tableNestingLevel = 0;
     async processNodeRecursive(node, processor, override) {
+        // Mirrors the check in BaseGenerator.processNodeRecursive. This override replaces that
+        // method entirely, so without repeating the check here the signal would be silently
+        // inert for this generator - which is exactly how it was missed.
+        (0, errorUtils_js_1.checkAbortSignal)(this.config.abortSignal);
         // Use pre-evaluated override if provided, otherwise call handleOnNode
         const actualOverride = override !== undefined ? override : await this.handleOnNode(node);
         // Returning false skips the node and its children
@@ -405,6 +536,18 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
                 result += await this.processNodeRecursive(note, processor);
             }
         }
+        else if (node.notes && node.notes.length > 0) {
+            // Emit the reference marker at the point of citation. Without this, a
+            // footnote/endnote would only ever show up in the collected footnotes
+            // section, with no indication of where it was originally cited.
+            for (const note of node.notes) {
+                const meta = note.metadata;
+                if (meta?.noteType === 'footnote' || meta?.noteType === 'endnote') {
+                    const key = this.escape(this.getFootnoteKey(note));
+                    result += `<sup data-footnote-ref="${key}" id="footnote-ref-${key}"><a href="#footnote-${key}">${key}</a></sup>`;
+                }
+            }
+        }
         return result;
     }
     /**
@@ -413,17 +556,48 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
     async nodeProcessor(node, childrenOutput) {
         // Handle Style Mapping using the semantic mapping helper
         const mapping = this.getSemanticMapping(node);
-        let tag = mapping?.tag || this.getDefaultTag(node);
-        // Combine classes from mapping and defaults
-        const classes = mapping?.classes ? [...mapping.classes] : [];
-        const className = classes.length > 0 ? ` class="${classes.join(' ')}"` : '';
+        // A styleMap's `output.tag` was previously written here and then shadowed by a `const tag`
+        // in every switch branch, so HtmlGenerator silently ignored it - while MarkdownGenerator
+        // and RtfGenerator both honoured it and the README documented it as working. Honoured now,
+        // but only through the allowlist: the tag is interpolated into both `<TAG>` and `</TAG>`,
+        // and the shadowing bug was the sole reason a hostile value could not inject. A rejected
+        // tag falls back to the default rather than being emitted.
+        const mappedTag = (0, sanitize_js_1.isSafeStyleMapTag)(mapping?.tag) ? mapping.tag.toLowerCase() : undefined;
+        if (mapping?.tag && !mappedTag) {
+            this.warn(types_js_1.OfficeWarningType.INVALID_STYLE_MAP_TAG, mapping.tag, node);
+        }
         // Handle Attributes from mapping
         let mappedAttrs = '';
         if (mapping?.attributes) {
             for (const [key, val] of Object.entries(mapping.attributes)) {
+                // The value is escaped, but the NAME needs validating too: a key containing a
+                // quote closes the attribute and opens another, so `x" onmouseover="alert(1)" z`
+                // yields a live event handler however carefully the value is escaped. The
+                // attribute bag and the parser already apply this policy; this path did not.
+                if (!(0, sanitize_js_1.isSafeHtmlAttributeName)(key))
+                    continue;
                 mappedAttrs += ` ${key}="${this.escape(val)}"`;
             }
         }
+        // Preserved source attributes (opt-in; absent unless htmlParserConfig.preserveAttributes).
+        // Dedupe against whatever the mapping already emitted so a typed field always wins, and
+        // take the bag's `class` back as a value to merge below rather than a second attribute.
+        const bag = renderHtmlAttributeBag(node, Object.keys(mapping?.attributes || {}));
+        // Fold into mappedAttrs rather than threading a separate fragment through all ~20 emission
+        // sites: every site already interpolates mappedAttrs, so this cannot miss one (a miss would
+        // silently drop preserved attributes), and an empty bag contributes nothing, so output for
+        // nodes without one stays byte-identical.
+        mappedAttrs += bag.attrs;
+        // Combine classes from mapping, defaults, and any preserved source class. Merging here is
+        // what keeps `<p class="lead">` from either losing "lead" or emitting a duplicate `class`.
+        const classes = mapping?.classes ? [...mapping.classes] : [];
+        if (bag.className) {
+            for (const c of bag.className.split(/\s+/).filter(Boolean)) {
+                if (!classes.includes(c))
+                    classes.push(c);
+            }
+        }
+        const className = classes.length > 0 ? ` class="${this.escape(classes.join(' '))}"` : '';
         // Handle ID and Anchors
         let idAttr = '';
         let extraAnchors = '';
@@ -442,9 +616,9 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             }
         }
         if (anchorIds.length > 0) {
-            idAttr = ` id="${anchorIds[0]}"`;
+            idAttr = ` id="${this.escape(anchorIds[0])}"`;
             if (anchorIds.length > 1) {
-                extraAnchors = anchorIds.slice(1).map(aid => `<a id="${aid}" name="${aid}"></a>`).join('');
+                extraAnchors = anchorIds.slice(1).map(aid => `<a id="${this.escape(aid)}" name="${this.escape(aid)}"></a>`).join('');
             }
         }
         // Inline Styles for structural nodes
@@ -469,7 +643,30 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
                         src = `data:${attachment.mimeType || 'image/png'};base64,${attachment.data}`;
                     }
                 }
-                const img = `<img src="${this.escape(src)}" alt="${this.escape(node.text || meta?.altText || '')}"${className}${mappedAttrs}${styleAttr}>`;
+                // Match CustomImage's exact data-width/data-align + style contract so a loaded
+                // image re-hydrates the editor node without losing size/alignment.
+                let imgDataAttrs = '';
+                const imgStyleParts = [];
+                const baseImgStyle = this.getInlineStyles(node);
+                if (baseImgStyle)
+                    imgStyleParts.push(baseImgStyle);
+                if (meta?.width) {
+                    imgDataAttrs += ` data-width="${this.escape(meta.width)}"`;
+                    // Sanitize before it enters the style="" attribute: an unescaped width
+                    // (e.g. `1px" onerror="alert(1)`) would otherwise break out and inject an
+                    // event handler, and a CSS `url(...)` would fetch a remote resource.
+                    const safeWidth = (0, sanitize_js_1.sanitizeCssValue)(meta.width);
+                    if (safeWidth)
+                        imgStyleParts.push(`width: ${safeWidth}`);
+                }
+                if (meta?.align) {
+                    imgDataAttrs += ` data-align="${this.escape(meta.align)}"`;
+                    const ml = meta.align === 'left' ? '0' : 'auto';
+                    const mr = meta.align === 'right' ? '0' : 'auto';
+                    imgStyleParts.push('display: block', `margin-left: ${ml}`, `margin-right: ${mr}`);
+                }
+                const imgStyleAttr = imgStyleParts.length > 0 ? ` style="${imgStyleParts.join('; ')}"` : '';
+                const img = `<img src="${(0, sanitize_js_1.sanitizeImageUrl)(src)}" alt="${this.escape(node.text || meta?.altText || '')}"${className}${mappedAttrs}${imgDataAttrs}${imgStyleAttr}>`;
                 const content = this.config.includeFormatting ? `<div class="image-container">${img}<div class="caption">${this.escape(attachmentName || '')}</div></div>` : img;
                 return `${extraAnchors}<div${idAttr}>${content}</div>`;
             }
@@ -489,7 +686,7 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
     (function() {
         const initChart = () => {
             const ctx = document.getElementById('${chartId}').getContext('2d');
-            const chartData = ${JSON.stringify(chartData)};
+            const chartData = ${(0, sanitize_js_1.serializeForInlineScript)(chartData)};
             const getRandomColor = (index, alpha) => {
                 const colors = [
                     'rgba(255, 99, 132, ' + alpha + ')',
@@ -556,6 +753,15 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
                 return node.metadata?.breakType === 'page' ? '<hr class="page-break">' : '<br>';
             case 'code': {
                 const meta = node.metadata;
+                if (meta?.math) {
+                    // No pinned editor contract yet (inscript-editor's math node is v1.2,
+                    // not built) - this is the proposed shape: data-math signals the
+                    // display mode, and the visible text keeps its $ delimiters so the
+                    // raw LaTeX degrades gracefully without a KaTeX renderer.
+                    const delimited = meta.math === 'block' ? `$$${node.text || ''}$$` : `$${node.text || ''}$`;
+                    const tag = meta.math === 'block' ? 'div' : 'span';
+                    return `${extraAnchors}<${tag} class="math math-${this.escape(meta.math)}" data-math="${this.escape(meta.math)}"${idAttr}${mappedAttrs}${styleAttr}>${this.escape(delimited)}</${tag}>`;
+                }
                 const lang = meta?.language ? ` class="language-${this.escape(meta.language)}"` : '';
                 const codeHtml = `<code${lang}>${this.escape(node.text || '')}</code>`;
                 if (node.text && node.text.includes('\n')) {
@@ -567,6 +773,11 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             }
             case 'list': {
                 const meta = node.metadata;
+                if (meta?.isTask) {
+                    const checkedAttr = ` data-checked="${meta.checked ? 'true' : 'false'}"`;
+                    const checkedBool = meta.checked ? ' checked' : '';
+                    return `${extraAnchors}<li${checkedAttr}${idAttr}${className}${mappedAttrs}${styleAttr}><label><input type="checkbox"${checkedBool}><span></span></label><div>${childrenOutput}</div></li>`;
+                }
                 const value = (meta?.listType === 'ordered' && typeof meta.itemIndex === 'number')
                     ? ` value="${meta.itemIndex + 1}"`
                     : '';
@@ -595,7 +806,21 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
                         finalChildren = `<thead>${headOutput}</thead><tbody>${bodyOutput}</tbody>`;
                     }
                 }
-                const tableHtml = `<table${idAttr}${className}${mappedAttrs}${styleAttr}>${finalChildren}</table>`;
+                // Match CustomTable's exact data-align + margin style contract so a loaded
+                // table re-hydrates the editor node without losing its layout alignment.
+                const tableMeta = node.metadata;
+                let tableDataAttrs = '';
+                let tableStyleAttr = styleAttr;
+                if (tableMeta?.align) {
+                    tableDataAttrs = ` data-align="${this.escape(tableMeta.align)}"`;
+                    const ml = tableMeta.align === 'left' ? '0' : 'auto';
+                    const mr = tableMeta.align === 'right' ? '0' : 'auto';
+                    const marginStyle = `margin-left: ${ml}; margin-right: ${mr}`;
+                    tableStyleAttr = styleAttr
+                        ? ` style="${styleAttr.replace(/^ style="|"$/g, '')}; ${marginStyle}"`
+                        : ` style="${marginStyle}"`;
+                }
+                const tableHtml = `<table${idAttr}${className}${mappedAttrs}${tableDataAttrs}${tableStyleAttr}>${finalChildren}</table>`;
                 const result = this.tableNestingLevel > 1 ? tableHtml : `<div class="table-container">${tableHtml}</div>`;
                 return `${extraAnchors}${result}`;
             }
@@ -706,15 +931,20 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
                             const rClasses = ['excel-row'];
                             if (mapping?.classes)
                                 rClasses.push(...mapping.classes);
-                            trAttrs += ` class="${rClasses.join(' ')}"`;
+                            // Escaped like the `className` built for every other node type. This
+                            // path rebuilds the class attribute from the raw mapping array rather
+                            // than reusing that value, and was the only place it went out unescaped.
+                            trAttrs += ` class="${this.escape(rClasses.join(' '))}"`;
                             if (mapping?.attributes) {
                                 for (const [key, val] of Object.entries(mapping.attributes)) {
+                                    if (!(0, sanitize_js_1.isSafeHtmlAttributeName)(key))
+                                        continue;
                                     trAttrs += ` ${key}="${this.escape(val)}"`;
                                 }
                             }
                             const rAnchorIds = this.config.ignoreInternalLinks ? [] : [...(rowNode.metadata?.anchorIds || [])];
                             if (rAnchorIds.length > 0) {
-                                trAttrs += ` id="${rAnchorIds[0]}"`;
+                                trAttrs += ` id="${this.escape(rAnchorIds[0])}"`;
                             }
                             if (this.config.includeFormatting) {
                                 const styles = this.getInlineStyles(rowNode);
@@ -760,14 +990,18 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
                     mergedClasses.push('active');
                 if (classes.length > 0)
                     mergedClasses.push(...classes);
-                const classAttr = ` class="${mergedClasses.join(' ')}"`;
+                // Escaped for the same reason as the row above; `classes` here also carries the
+                // attribute bag's raw className, so escaping at the join covers both sources.
+                const classAttr = ` class="${this.escape(mergedClasses.join(' '))}"`;
                 // Ensure we don't have duplicate IDs
                 const finalIdAttr = ` id="${sheetId}"`;
                 return `${extraAnchors}<div${finalIdAttr}${classAttr}${mappedAttrs}${styleAttr}>${tableHtml}${nonRowHtml}</div>`;
             }
             case 'paragraph':
             case 'heading': {
-                const tag = node.type === 'heading' ? `h${node.metadata?.level || 1}` : 'p';
+                // The styleMap tag wins over the structural default; that is the whole point of
+                // mapping "Heading 1"/"Intense Quote" onto a semantic element.
+                const tag = mappedTag ?? (node.type === 'heading' ? `h${node.metadata?.level || 1}` : 'p');
                 // Normalize empty paragraphs so DOCX and PPTX empty cells render with consistent height
                 // Strip tags to check if it's purely empty or just contains non-breaking spaces (like PPTX)
                 const textOnly = childrenOutput.replace(/<[^>]+>/g, '').trim();
@@ -779,19 +1013,50 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             }
             case 'slide': {
                 const meta = node.metadata;
-                const slideNum = meta?.slideNumber || '';
+                const slideNum = this.escape(String(meta?.slideNumber || ''));
                 return `${extraAnchors}<section class="slide" data-slide-num="${slideNum}"${idAttr}${className}${mappedAttrs}${styleAttr}>${childrenOutput}</section>`;
             }
             case 'page': {
                 const meta = node.metadata;
-                const pageNum = meta?.pageNumber || '';
+                const pageNum = this.escape(String(meta?.pageNumber || ''));
                 return `${extraAnchors}<section class="page" data-page-num="${pageNum}"${idAttr}${className}${mappedAttrs}${styleAttr}>${childrenOutput}</section>`;
             }
             case 'note': {
                 const meta = node.metadata;
-                const noteClass = meta?.noteType ? ` note-${meta.noteType}` : '';
+                if (meta?.noteType === 'footnote' || meta?.noteType === 'endnote') {
+                    const key = this.escape(this.getFootnoteKey(node));
+                    return `<p id="footnote-${key}" data-footnote-id="${key}">${childrenOutput} <a href="#footnote-ref-${key}">↩</a></p>`;
+                }
+                const noteClass = meta?.noteType ? ` note-${this.escape(meta.noteType)}` : '';
                 return `${extraAnchors}<div class="slide-note${noteClass}"${idAttr}${className}${mappedAttrs}${styleAttr}>${childrenOutput}</div>`;
             }
+            case 'embed': {
+                // Match the Youtube extension's exact wrapper shape so a loaded embed
+                // re-hydrates the editor's Youtube node.
+                const meta = node.metadata;
+                const id = meta?.videoId || '';
+                const width = meta?.width || '100%';
+                const align = meta?.align || 'center';
+                const ml = align === 'left' ? '0' : 'auto';
+                const mr = align === 'right' ? '0' : 'auto';
+                const iframe = id
+                    ? `<iframe src="https://www.youtube.com/embed/${this.escape(id)}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>`
+                    : '';
+                return `${extraAnchors}<div data-youtube-video="${this.escape(id)}" data-width="${this.escape(width)}" data-align="${this.escape(align)}" class="youtube-embed"${idAttr}${mappedAttrs} style="width: ${(0, sanitize_js_1.sanitizeCssValue)(width)}; margin-left: ${ml}; margin-right: ${mr};">${iframe}</div>`;
+            }
+            case 'admonition': {
+                // Match inscript-editor's Admonition node wrapper so a loaded admonition
+                // reaches the editor as that node instead of a plain blockquote.
+                const meta = node.metadata;
+                const admonitionType = this.escape(meta?.admonitionType || 'note');
+                return `${extraAnchors}<div class="admonition admonition-${admonitionType}" data-type="${admonitionType}"${idAttr}${mappedAttrs}${styleAttr}>${childrenOutput}</div>`;
+            }
+            case 'definitionList':
+                return `${extraAnchors}<dl${idAttr}${className}${mappedAttrs}${styleAttr}>${childrenOutput}</dl>`;
+            case 'definitionTerm':
+                return `${extraAnchors}<dt${idAttr}${className}${mappedAttrs}${styleAttr}>${childrenOutput}</dt>`;
+            case 'definitionDescription':
+                return `${extraAnchors}<dd${idAttr}${className}${mappedAttrs}${styleAttr}>${childrenOutput}</dd>`;
             default:
                 return childrenOutput;
         }
@@ -829,24 +1094,50 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             }
         }
         const meta = node.metadata;
-        if (meta?.link) {
+        if (meta?.wikilink) {
+            // No pinned editor contract yet for wikilinks - data-wikilink-page preserves the
+            // exact page name separately from the display text/alias and from href (which
+            // the host app's resolver may rewrite to a real URL).
+            if (!this.config.ignoreInternalLinks) {
+                result = `<a href="#${this.escape(this.slugify(meta.link || ''))}" data-wikilink-page="${this.escape(meta.link || '')}">${result}</a>`;
+            }
+        }
+        else if (meta?.link) {
             const isInternal = meta.linkType !== 'external';
             if (!this.config.ignoreInternalLinks || !isInternal) {
-                result = `<a href="${meta.link}"${meta.linkType === 'external' ? ' target="_blank"' : ''}>${result}</a>`;
+                result = `<a href="${(0, sanitize_js_1.sanitizeUrl)(meta.link)}"${meta.linkType === 'external' ? ' target="_blank"' : ''}>${result}</a>`;
             }
         }
+        if (meta?.abbreviationTitle) {
+            result = `<abbr title="${this.escape(meta.abbreviationTitle)}">${result}</abbr>`;
+        }
+        if (meta?.citationKey) {
+            // No pinned editor contract yet for citations (unlike footnotes/admonitions) -
+            // this is the proposed shape: a <cite> carrying the bare key, matching Pandoc's
+            // [@citekey] on the Markdown side. Keep in sync if inscript-editor's citation
+            // node lands with a different attribute name.
+            result = `<cite data-citation-key="${this.escape(meta.citationKey)}">[@${this.escape(meta.citationKey)}]</cite>`;
+        }
         return result;
     }
     getInlineStyles(node) {
         const styles = [];
+        // Colors/sizes/fonts/alignments are free strings from an untrusted document;
+        // run each through sanitizeCssValue so it can't break out of the style="" attribute
+        // or inject a resource-fetching CSS construct. Drop the declaration if nothing survives.
+        const pushSafe = (prop, value) => {
+            const safe = (0, sanitize_js_1.sanitizeCssValue)(value);
+            if (safe)
+                styles.push(`${prop}: ${safe}`);
+        };
         if (node.metadata) {
             const meta = node.metadata;
             if (meta.alignment)
-                styles.push(`text-align: ${meta.alignment}`);
+                pushSafe('text-align', meta.alignment);
             if (meta.backgroundColor)
-                styles.push(`background-color: ${meta.backgroundColor}`);
+                pushSafe('background-color', meta.backgroundColor);
             if (meta.verticalAlign)
-                styles.push(`vertical-align: ${meta.verticalAlign}`);
+                pushSafe('vertical-align', meta.verticalAlign);
             if (meta.paragraphIndentation) {
                 const ind = meta.paragraphIndentation;
                 if (ind.left)
@@ -860,13 +1151,16 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
         if (node.formatting) {
             const f = node.formatting;
             if (f.color)
-                styles.push(`color: ${f.color}`);
+                pushSafe('color', f.color);
             if (f.backgroundColor)
-                styles.push(`background-color: ${f.backgroundColor}`);
+                pushSafe('background-color', f.backgroundColor);
             if (f.size)
-                styles.push(`font-size: ${f.size}`);
-            if (f.font)
-                styles.push(`font-family: ${f.font}, sans-serif`);
+                pushSafe('font-size', f.size);
+            if (f.font) {
+                const safeFont = (0, sanitize_js_1.sanitizeCssValue)(f.font);
+                if (safeFont)
+                    styles.push(`font-family: ${safeFont}, sans-serif`);
+            }
         }
         return styles.join('; ');
     }
@@ -1431,6 +1725,20 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
             ${this.config.htmlConfig.customCss}
         `;
     }
+    /**
+     * Same as `getPremiumStyles()`, but wrapped in a CSS `@scope` block anchored to the
+     * `.op-html-scope` wrapper so the rules only apply within the generated fragment - they
+     * cannot leak onto a host page's own elements. `:root` and `body` selectors specifically
+     * target the real page root/body, so they're remapped to `:scope` (the scope root, i.e. the
+     * `.op-html-scope` wrapper) first; every other selector is naturally confined by `@scope`
+     * without needing per-selector rewriting. `customCss` is included in this scoping too.
+     */
+    getScopedPremiumStyles(isSpreadsheet = false, isPresentation = false, isPdf = false) {
+        const css = this.getPremiumStyles(isSpreadsheet, isPresentation, isPdf)
+            .replace(/:root(\s*\{)/g, ':scope$1')
+            .replace(/(^|\n)(\s*)body(\s*\{)/g, '$1$2:scope$3');
+        return `@scope (.op-html-scope) {\n${css}\n}`;
+    }
     slugify(text) {
         return text.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/(^-|-$)/g, '');
     }
@@ -1443,10 +1751,19 @@ class HtmlGenerator extends BaseGenerator_js_1.BaseGenerator {
         }
         return letter;
     }
+    // Attribute/text escaping, URL sanitizing, and inline-script serialization all
+    // live in ../utils/sanitize.js so every generator shares one implementation.
+    // escape() stays as a thin wrapper because it has many call sites here.
     escape(text) {
-        if (typeof text !== 'string')
-            return text;
-        return text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+        return (0, sanitize_js_1.escapeHtml)(text);
+    }
+    /** Converts a document-supplied date to an ISO string, or '' if it is invalid
+     *  (a malformed date would otherwise throw a RangeError and abort generation). */
+    toIsoDate(value) {
+        if (value === undefined || value === null || value === '')
+            return '';
+        const d = new Date(value);
+        return isNaN(d.getTime()) ? '' : d.toISOString();
     }
 }
 exports.HtmlGenerator = HtmlGenerator;