typst-tag.js

/**
 * typst-tag.js - Hexo tag for rendering Typst code
 */
const compileTypst = require('./lib/typst-compiler');

/**
 * Default Typst wrapper that adds page settings
 * @param {string} code - Raw Typst code
 * @returns {string} - Wrapped Typst code
 */
function wrapTypstCode(code) {
    return `#set page(width: auto, height: auto, margin: 0in, fill: rgb("#f9fafb"))
#set text(font: ("Fira Sans", "LXGW Wenkai"), size: 16pt)
${code}`;
}

/**
 * Default SVG wrapper that adds necessary HTML and styling
 * @param {string} svg - SVG code
 * @returns {string} - Wrapped SVG with styling
 */
function wrapSvgOutput(svg) {
    // 替换SVG内部的白色背景为#f9fafb
    svg = svg.replace(/fill="white"/gi, 'fill="#f9fafb"')
             .replace(/background:white/gi, 'background:#f9fafb')
             .replace(/fill:#fff/gi, 'fill:#f9fafb')
             .replace(/fill:#ffffff/gi, 'fill:#f9fafb');
    return `<div class="typst-container" style="background:#f9fafb;">
<div class="typst-svg">
${svg}
</div>
</div>`;
}

/**
 * Typst tag handler
 */
module.exports = function (ctx) {
    return function typstTag(args, content) {
        // Parse tag options (future enhancement)
        const options = {};

        try {
            // Prepare Typst code
            const typstCode = wrapTypstCode(content);

            // Compile to SVG
            const svg = compileTypst(typstCode);

            // Return wrapped SVG
            let v = wrapSvgOutput(svg);
            // console.warn("[typst-tag] SVG output:", v);
            return '' + wrapSvgOutput(svg) + '';
        } catch (error) {
            console.error("[typst-tag] Error:", error);
            return `<div class="typst-error">Error rendering Typst: ${error.message}</div>`;
        }
    };
};