nehan-katex/dist/index.js

nehan plugin for displaying mathematical expression using katex

import { CssStyleSheet, LogicalCssEvaluator } from 'nehan';
import * as katex from 'katex';
function normalizeDefault(markup) {
    return markup.trim()
        .replace(/\n/g, "")
        .replace(/\$dollar/g, "\\text{\\textdollar}")
        .replace(/\$/g, "\\");
}
function attachDefault(dom) {
    document.body.appendChild(dom);
}
function detachDefault(dom) {
    document.body.removeChild(dom);
}
export function create(args) {
    var _a, _b, _c, _d, _e;
    const selector = (_a = args.selector) !== null && _a !== void 0 ? _a : "math";
    const spacingSize = (_b = args.spacingSize) !== null && _b !== void 0 ? _b : 10;
    const normalize = (_c = args.normalize) !== null && _c !== void 0 ? _c : normalizeDefault;
    const attachDOM = (_d = args.attachDOM) !== null && _d !== void 0 ? _d : attachDefault;
    const detachDOM = (_e = args.detachDOM) !== null && _e !== void 0 ? _e : detachDefault;
    const fontSize = "0.8em";
    return new CssStyleSheet({
        [selector]: {
            fontSize,
            "!render": (ctx) => {
                var _a;
                const pcont = ctx.parentContext;
                if (!pcont) {
                    return;
                }
                const isInline = ctx.element.classList.contains("inline");
                const display = isInline ? "inline-block" : "block";
                const margin = isInline ? "0" : (_a = args.margin) !== null && _a !== void 0 ? _a : "0.5em 0";
                const backgroundColor = isInline ? "transparent" : "white";
                const isVert = pcont.env.writingMode.isTextVertical();
                const markup = normalize(ctx.element.$node.textContent || "");
                const maxMeasure = pcont.maxMeasure - spacingSize * 2;
                const $dom = document.createElement("div");
                const writingMode = pcont.env.writingMode;
                const etor = new LogicalCssEvaluator(writingMode);
                pcont.env.font.acceptCssEvaluator(etor).applyTo($dom.style);
                $dom.style.fontSize = fontSize;
                if (isInline) {
                    $dom.style.display = "inline-block";
                }
                else {
                    $dom.style.width = `${maxMeasure}px`;
                    $dom.style.padding = `${spacingSize}px`;
                }
                $dom.style.fontSize = `${ctx.emSize}px`;
                $dom.style.visibility = "hidden";
                katex.render(markup, $dom, {
                    throwOnError: false
                });
                attachDOM($dom);
                const mathMeasure = isInline ? $dom.clientWidth : maxMeasure;
                const mathExtent = $dom.clientHeight;
                detachDOM($dom);
                $dom.style.visibility = "visible";
                ctx.setExternalDOM($dom);
                if (isVert) {
                    $dom.style.transform = `translateX(${mathExtent}px) rotateZ(90deg)`;
                    $dom.style.transformOrigin = "top left";
                }
                const padding = isInline ? "0" : `${spacingSize}px`;
                const width = isVert ? mathExtent : mathMeasure;
                const height = isVert ? mathMeasure : mathExtent;
                return { display, backgroundColor, padding, margin, width, height };
            }
        }
    });
}
//# sourceMappingURL=index.js.map