inline tokenizer

webapp/src/lib/components/CalloutIcon.svelte

@@ -13,8 +13,6 @@
 	import BugIcon from 'svelte-icons/md/MdBugReport.svelte';
 	import QuoteIcon from 'svelte-icons/md/MdFormatQuote.svelte';
 	export let icon: string;
-
-	console.log(icon);
 </script>
 
 {#if icon == 'note'}

webapp/src/lib/components/MarkdownRenderer.svelte

@@ -10,6 +10,7 @@
 	import Highlight from '$lib/marked/renderers/Highlight.svelte';
 	import InternalEmbed from '$lib/marked/renderers/InternalEmbed.svelte';
 	import Blockquote from '$lib/marked/renderers/Blockquote.svelte';
+	import MathInline from '$lib/marked/renderers/MathInline.svelte';
 
 	export let plaintext: string;
 
@@ -34,7 +35,8 @@ prose-blockquote:first:before:content-['']"
 			'internal-embed': InternalEmbed,
 			tag: Tag,
 			highlight: Highlight,
-			blockquote: Blockquote
+			blockquote: Blockquote,
+			'math-inline': MathInline
 		}}
 		source={plaintext}
 		{options}

webapp/src/lib/marked/extensions.ts

@@ -59,6 +59,7 @@ const HighlightExtension = {
 	name: 'highlight',
 	level: 'inline',
 	start(src: string) {
+		// console.log(src);
 		return src.match(/==/)?.index;
 	},
 	tokenizer(src: string) {
@@ -74,6 +75,33 @@ const HighlightExtension = {
 	}
 };
 
-export default [InternalLinkExtension, InternalEmbedExtension, TagExtension, HighlightExtension];
+const MathInline = {
+	name: 'math-inline',
+	level: 'inline',
+	start(src: string) {
+		return src.indexOf('$');
+	},
+
+	tokenizer(src: string) {
+		const match = src.match(/^(\${1})((?:\\.|.)*)\1/);
+		console.log(src, match);
+		if (match) {
+			return {
+				type: 'math-inline',
+				raw: match[0],
+				text: match[2].trim()
+			};
+		}
+		return false;
+	}
+};
+
+export default [
+	InternalLinkExtension,
+	InternalEmbedExtension,
+	TagExtension,
+	HighlightExtension,
+	MathInline
+];
 
 // ^\#([\w\/]+)\W*

webapp/src/lib/marked/renderers/MathInline.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+	export let text: string;
+</script>
+
+<span>{text}</span>