structured-render 0.0.0 → 0.0.1

package/dist/render/browser-rendering.js

@@ -0,0 +1,233 @@
+import { assert, assertWrap } from '@augment-vir/assert';
+import { isRuntimeEnv, mergeDefinedProperties, RuntimeEnv, stringify, } from '@augment-vir/common';
+import DOMPurify from 'dompurify';
+import { convertTemplateToString, html } from 'element-vir';
+import { marked } from 'marked';
+import { importHtml2Pdf } from './html-to-pdf.js';
+import { contentDivClass } from './render-markdown-styles.js';
+import { renderStructuredMarkdown } from './render-markdown.js';
+import { defaultRenderMarkdownOptions, } from './render-types.js';
+const globalStyleId = 'structured-rendering-style-id';
+// cspell:disable
+/**
+ * Output method types for jsPDF. Extracted from:
+ * https://raw.githack.com/MrRio/jsPDF/master/docs/jsPDF.html#output
+ *
+ * @category Internal
+ */
+export var OutputPdfType;
+(function (OutputPdfType) {
+    /** Returns the PDF as an `ArrayBuffer`. */
+    OutputPdfType["ArrayBuffer"] = "arraybuffer";
+    /** Returns the PDF as a `Blob`. */
+    OutputPdfType["Blob"] = "blob";
+    /** Returns a blob URI string pointing to the generated PDF. */
+    OutputPdfType["BlobUri"] = "bloburi";
+    /** Alias for `BlobUri`. Returns a blob URL string pointing to the generated PDF. */
+    OutputPdfType["BlobUrl"] = "bloburl";
+    /** Returns the PDF as a base-64 data URI string. */
+    OutputPdfType["DataUriString"] = "datauristring";
+    /** Alias for `DataUriString`. Returns the PDF as a base-64 data URL string. */
+    OutputPdfType["DataUrlString"] = "dataurlstring";
+    /** Navigates the current page location to the generated data URI. Returns `undefined`. */
+    OutputPdfType["DataUri"] = "datauri";
+    /**
+     * Alias for `DataUri`. Navigates the current page location to the generated data URL. Returns
+     * `undefined`.
+     */
+    OutputPdfType["DataUrl"] = "dataurl";
+    /**
+     * Opens the generated PDF data URL in a new window. Returns the `Window` or `null`. Throws if
+     * the global is not a window object (e.g. Node).
+     */
+    OutputPdfType["DataUrlNewWindow"] = "dataurlnewwindow";
+    /**
+     * Opens a PDF object in a new window. Returns the `Window` or `null`. Throws if the global is
+     * not a window object (e.g. Node).
+     */
+    OutputPdfType["PdfObjectNewWindow"] = "pdfobjectnewwindow";
+    /** Opens the PDF via pdf.js in a new window. Returns the `Window` or `null`. */
+    OutputPdfType["PdfJsNewWindow"] = "pdfjsnewwindow";
+    /** Simply download the file. */
+    OutputPdfType["Download"] = "download";
+})(OutputPdfType || (OutputPdfType = {}));
+// cspell:enable
+// cspell:disable
+/**
+ * Html2Pdf.js image output output types.
+ *
+ * @category Internal
+ */
+export var OutputImageType;
+(function (OutputImageType) {
+    /** Returns an img element as a string. */
+    OutputImageType["Img"] = "img";
+    /** Returns a data URI string. */
+    OutputImageType["DataUriString"] = "datauristring";
+    /** Returns a data URI string. Alias for `DataUriString`. */
+    OutputImageType["DataUrlString"] = "dataurlstring";
+    /** Returns a data URI. */
+    OutputImageType["DataUri"] = "datauri";
+    /** Returns a data URI. Alias for `DataUri`. */
+    OutputImageType["DataUrl"] = "dataurl";
+    /** Simply download the file. */
+    OutputImageType["Download"] = "download";
+})(OutputImageType || (OutputImageType = {}));
+// cspell:enable
+function createHtml2PdfOptions(fileName) {
+    return {
+        margin: [
+            25,
+            15,
+        ],
+        filename: fileName,
+        image: {
+            type: 'jpeg',
+            quality: 0.98,
+        },
+        html2canvas: {
+            scale: 2,
+            logging: false,
+            scrollX: 0,
+            scrollY: 0,
+            useCORS: true,
+        },
+        jsPDF: {
+            unit: 'mm',
+            format: 'a4',
+            orientation: 'portrait',
+        },
+        // cspell:word pagebreak
+        pagebreak: {
+            mode: [
+                'css',
+                'legacy',
+            ],
+        },
+    };
+}
+/**
+ * Internal common in-browser structure render renderer.
+ *
+ * @category Internal
+ */
+export async function renderInBrowser(structuredRenderData, { fileName, outputType, options: userOptions, }) {
+    if (!isRuntimeEnv(RuntimeEnv.Web)) {
+        throw new Error(`${renderInNode.name} cannot run outside of a browser.`);
+    }
+    const options = mergeDefinedProperties(defaultRenderMarkdownOptions, userOptions);
+    const htmlToPdf = await importHtml2Pdf();
+    const dirtyHtml = await marked.parse(renderStructuredMarkdown(structuredRenderData, options));
+    const styleElement = assertWrap.instanceOf(globalThis.document.head.querySelector(`#${globalStyleId}`) ||
+        globalThis.document.createElement('style'), HTMLStyleElement);
+    styleElement.id = globalStyleId;
+    if (!styleElement.isConnected) {
+        globalThis.document.head.append(styleElement);
+    }
+    styleElement.textContent = String(options.styles);
+    const htmlString = convertTemplateToString(html `
+        <div class=${contentDivClass}>${DOMPurify.sanitize(dirtyHtml)}</div>
+    `);
+    const instance = htmlToPdf().set(createHtml2PdfOptions(fileName)).from(htmlString);
+    try {
+        if (outputType.pdf) {
+            if (outputType.pdf === OutputPdfType.Download) {
+                return await instance.save(fileName);
+            }
+            else {
+                return await instance.outputPdf(outputType.pdf, {
+                    filename: fileName,
+                });
+            }
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+        }
+        else if (outputType.image) {
+            if (outputType.image === OutputImageType.Download) {
+                return await instance.toImg().save(fileName);
+            }
+            else {
+                return await instance.outputImg(outputType.image);
+            }
+        }
+        else {
+            assert.tsType(outputType).equals();
+            throw new Error(`Invalid output type: ${stringify(outputType)}`);
+        }
+    }
+    finally {
+        styleElement.remove();
+    }
+}
+/**
+ * Internal common Node.js structure render renderer.
+ *
+ * @category Internal
+ * @returns The output file path.
+ */
+export async function renderInNode(structuredRenderData, { saveLocationPath, outputType, options: userOptions, }) {
+    if (isRuntimeEnv(RuntimeEnv.Web)) {
+        throw new Error(`${renderInNode.name} cannot run inside of a browser.`);
+    }
+    const options = mergeDefinedProperties(defaultRenderMarkdownOptions, userOptions);
+    const { chromium } = await import('playwright');
+    const { readFile, writeFile, mkdir } = await import('node:fs/promises');
+    const { createRequire } = await import('node:module');
+    const { basename, dirname } = await import('node:path');
+    const require = createRequire(import.meta.url);
+    const [html2pdfScript, domPurifyScript,] = await Promise.all([
+        readFile(require.resolve('html2pdf.js/dist/html2pdf.bundle.min.js'), 'utf-8'),
+        readFile(require.resolve('dompurify/dist/purify.min.js'), 'utf-8'),
+    ]);
+    const dirtyHtml = await marked.parse(renderStructuredMarkdown(structuredRenderData, options));
+    const baseHtmlString = convertTemplateToString(html `
+        <style id="styles">
+            ${options.styles}
+        </style>
+    `);
+    const browser = await chromium.launch();
+    try {
+        const page = await browser.newPage();
+        await page.setContent(baseHtmlString, { waitUntil: 'networkidle' });
+        await page.addScriptTag({ content: html2pdfScript });
+        await page.addScriptTag({ content: domPurifyScript });
+        const html2pdfOptions = createHtml2PdfOptions(basename(saveLocationPath));
+        if (outputType.image) {
+            html2pdfOptions.image = { type: 'png' };
+        }
+        const pdfBase64 = await page.evaluate(async ({ html2pdfOptions, outputType, dirtyMarkdown, wrapperClass, outputImageType, outputPdfType, }) => {
+            const cleanHtml = DOMPurify.sanitize(dirtyMarkdown);
+            // eslint-disable-next-line @typescript-eslint/no-deprecated
+            const instance = html2pdf()
+                .set(html2pdfOptions)
+                .from(`<div class="${wrapperClass}">${cleanHtml}</div>`);
+            if (outputType.image) {
+                return await instance.outputImg(outputImageType, {
+                    filename: html2pdfOptions.filename,
+                });
+                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+            }
+            else if (outputType.pdf) {
+                return await instance.outputPdf(outputPdfType, {
+                    filename: html2pdfOptions.filename,
+                });
+            }
+            else {
+                throw new Error('Invalid output type selected.');
+            }
+        }, {
+            html2pdfOptions,
+            outputType,
+            dirtyMarkdown: dirtyHtml,
+            wrapperClass: contentDivClass,
+            outputImageType: OutputImageType.DataUriString,
+            outputPdfType: OutputPdfType.DataUriString,
+        });
+        const base64Data = pdfBase64.split(',')[1];
+        await mkdir(dirname(saveLocationPath), { recursive: true });
+        await writeFile(saveLocationPath, Buffer.from(base64Data, 'base64'));
+    }
+    finally {
+        await browser.close();
+    }
+    return saveLocationPath;
+}

package/dist/render/html-to-pdf.d.ts

@@ -0,0 +1,50 @@
+export declare function importHtml2Pdf(): Promise<Html2Pdf>;
+/** Html2pdf.js's internal types are a complete disaster; we have to reconstruct them all like this. */
+export type Html2PdfOptions = {
+    margin?: number | [number, number] | [number, number, number, number];
+    filename?: string;
+    image?: {
+        type?: 'jpeg' | 'png' | 'webp';
+        quality?: number;
+    };
+    enableLinks?: boolean;
+    html2canvas?: object;
+    jsPDF?: {
+        unit?: string;
+        format?: string | [number, number];
+        orientation?: 'portrait' | 'landscape';
+    };
+    pagebreak?: {
+        mode?: ReadonlyArray<string>;
+        before?: string;
+        after?: string;
+        avoid?: string;
+    };
+};
+export interface Html2PdfInstance {
+    from(src: HTMLElement | string | HTMLCanvasElement | HTMLImageElement): this;
+    to(target: 'container' | 'canvas' | 'img' | 'pdf'): this;
+    toContainer(): this;
+    toCanvas(): this;
+    toImg(): this;
+    toPdf(): this;
+    output(type?: string, options?: any, src?: 'pdf' | 'img'): Promise<any>;
+    outputPdf(type?: string, options?: any): Promise<any>;
+    outputImg(type?: string, options?: any): Promise<any>;
+    save(filename?: string): Promise<void>;
+    set(options: Html2PdfOptions): this;
+    get(key: string, cbk?: (value: any) => void): Promise<any>;
+    then<T>(onFulfilled?: (value: any) => T | PromiseLike<T>, onRejected?: (reason: any) => any): Promise<T>;
+    thenCore<T>(onFulfilled?: (value: any) => T | PromiseLike<T>, onRejected?: (reason: any) => any): Promise<T>;
+    thenExternal<T>(onFulfilled?: (value: any) => T | PromiseLike<T>, onRejected?: (reason: any) => any): Promise<T>;
+    catch<T>(onRejected?: (reason: any) => T | PromiseLike<T>): Promise<T>;
+    catchExternal<T>(onRejected?: (reason: any) => T | PromiseLike<T>): Promise<T>;
+    error(msg: string): void;
+}
+export interface Html2Pdf {
+    (): Html2PdfInstance;
+    new (): Html2PdfInstance;
+    (element: HTMLElement, options?: Html2PdfOptions): Promise<void>;
+    new (element: HTMLElement, options?: Html2PdfOptions): Promise<void>;
+    Worker: new () => Html2PdfInstance;
+}

package/dist/render/html-to-pdf.js

@@ -0,0 +1,7 @@
+export async function importHtml2Pdf() {
+    // @ts-expect-error: this module is so messed up it has to be imported all funky
+    const html2pdfImport = await import('html2pdf.js/src');
+    const html2pdf = html2pdfImport.default ||
+        html2pdfImport;
+    return html2pdf;
+}

package/dist/render/render-html.d.ts

@@ -0,0 +1,38 @@
+import { type PartialWithUndefined } from '@augment-vir/common';
+import { type HtmlInterpolation } from 'element-vir';
+import { StructuredRenderSectionType } from '../structured-render-data/structured-render-section.js';
+import { type RenderHtmlOptions, type RenderInput } from './render-types.js';
+/**
+ * Render Structured Render data to HTML templates.
+ *
+ * @category Render
+ */
+export declare function renderStructuredHtml(data: Readonly<RenderInput>, options?: Readonly<PartialWithUndefined<RenderHtmlOptions>> | undefined): HtmlInterpolation;
+/**
+ * Used for both HTML class names and test ids.
+ *
+ * @category Internal
+ */
+export declare const structuredRenderSectionHtmlNames: Record<StructuredRenderSectionType, string>;
+/**
+ * A test id that you can use to target a section in the Structured Render HTML output.
+ *
+ * @category Internal
+ */
+export declare const structuredRenderSectionHtmlTestId = "structured-render-section";
+/**
+ * This event is emitted when source sections have been expanded and can be used to track which
+ * sections are expanded.
+ *
+ * @category Internal
+ */
+export declare const SourceExpansionEvent: import("element-vir").DefinedTypedEvent<"source-expansion", Readonly<{
+    expanded: boolean;
+    key: string;
+}>>;
+/**
+ * Makes a chain key used to track which HTML sections are opened.
+ *
+ * @category Internal
+ */
+export declare function makeChainKey(keyChain: ReadonlyArray<PropertyKey>): string;