feat: add KaTeX support for block and inline math rendering in Markdown

[calycekr]

Add KaTeX Support for Block and Inline Math Rendering in Markdown

This update introduces KaTeX support for rendering block and inline math expressions within Markdown content. The changes include new tokenizer and renderer extensions for handling KaTeX syntax.

This update will fix #1599 and any other issues related to LaTeX or Markdown parsing.

Changes

• Added katexBlockExtension and katexInlineExtension for KaTeX block and inline math rendering.
• Removed the escapeHTML and processLatex functions.
• Updated the marked configuration to include the new KaTeX extensions.
• Modified MarkdownRenderer.svelte to import and use the new extensions.

[calycekr]

With this commit, LaTeX rendering is fully functional. For rendering chemical formulas, the mhchem extension needs to be added, which I plan to include in a future PR. Additionally, adding the copy-tex extension could be useful for easier copying.

https://github.com/KaTeX/KaTeX/tree/main/contrib/mhchem
https://github.com/KaTeX/KaTeX/tree/main/contrib/copy-tex

[nsarrazin]

Hi, thanks for the contrib! This looks good and will probably be more maintainable! Tried testing it locally seems to work pretty well.

My only concern is the removed escapeHtml method, could you tell me why it was removed? It was used to prevent things like this:

[calycekr]

@calycekr My mistake. I added escapeHTML in the Marked renderer to prevent any user-supplied HTML from being injected directly into the DOM. This ensures that KaTeX rendering still works as intended, while any raw HTML code is safely escaped, preventing potential security issues.

	const marked = new Marked({
		hooks: {
			preprocess: (md) => addInlineCitations(md, sources),
			postprocess: (html) => DOMPurify.sanitize(html),
		},
		extensions: [katexBlockExtension, katexInlineExtension],
		renderer: {
			html: (html) => escapeHTML(html),
			link: (href, title, text) =>
				`<a href="${href?.replace(/>$/, "")}" target="_blank" rel="noreferrer">${text}</a>`,
		},
		gfm: true,
	});