Something went wrong. Try again.
small gleam coding and persistent agent daemon with a detachable cli and a canvas ui forked from okami.mom/albedo
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081// Draws what renderMarkdown left as placeholders: maths with KaTeX and// Mermaid diagrams with Pele, each loaded the first time a message needs it.// A placeholder keeps its source as text, so a failure leaves it readable.
let katex: Promise<typeof import('katex')['default']> | null = null;let pele: Promise<typeof import('pele/lazy')> | null = null;
function loadKatex() { return (katex ??= Promise.all([import('katex'), import('katex/dist/katex.min.css')]).then(([module]) => module.default));}
function loadPele() { return (pele ??= import('pele/lazy'));}
// Pele draws from text the model wrote; keep only drawing in what it returns.function clean(svg: string): SVGElement | null { const parsed = new DOMParser().parseFromString(svg, 'image/svg+xml').documentElement; if (parsed.nodeName.toLowerCase() !== 'svg') return null; for (const element of [parsed, ...parsed.querySelectorAll('*')]) { if (['script', 'foreignobject', 'iframe'].includes(element.nodeName.toLowerCase())) element.remove(); for (const attribute of [...element.attributes]) { const value = attribute.value.trim().toLowerCase(); if (attribute.name.startsWith('on') || ((attribute.name === 'href' || attribute.name.endsWith(':href')) && !value.startsWith('#'))) element.removeAttribute(attribute.name); } } return parsed as unknown as SVGElement;}
export async function enhance(root: HTMLElement) { const maths = [...root.querySelectorAll<HTMLElement>('.math[data-tex]:not([data-drawn])')]; const diagrams = [...root.querySelectorAll<HTMLElement>('.diagram[data-source]:not([data-drawn])')]; if (maths.length) { const render = await loadKatex(); for (const element of maths) { element.dataset.drawn = '1'; try { render.render(element.dataset.tex ?? '', element, { displayMode: element.dataset.display === '1', throwOnError: false, trust: false, output: 'htmlAndMathml' }); } catch {} } } if (diagrams.length) { const { renderAsync } = await loadPele(); for (const element of diagrams) { element.dataset.drawn = '1'; try { const { svg } = await renderAsync(element.dataset.source ?? ''); const drawn = clean(svg); if (drawn) element.replaceChildren(drawn); } catch {} } } // A copy button on every code block. The listener is real rather than // inline HTML from the renderer, and the block stays a plain `pre`, so // selecting it still works; the button reports and then falls asleep. for (const pre of [...root.querySelectorAll<HTMLElement>('pre:not([data-copy])')]) { pre.dataset.copy = '1'; const wrap = document.createElement('div'); wrap.className = 'codeblock'; const button = document.createElement('button'); button.type = 'button'; button.className = 'code-copy'; button.textContent = 'copy'; button.addEventListener('click', async () => { try { await navigator.clipboard.writeText(pre.textContent ?? ''); } catch { return; } button.textContent = 'copied'; button.classList.add('done'); setTimeout(() => { button.textContent = 'copy'; button.classList.remove('done'); }, 1200); }); pre.replaceWith(wrap); wrap.append(pre, button); }}