From 399fccb73b09f8c4c6cd274c5aa2da5953b599db Mon Sep 17 00:00:00 2001
From: rm-dr <96270320+rm-dr@users.noreply.github.com>
Date: Wed, 5 Nov 2025 21:46:49 -0800
Subject: [PATCH] Upgrade mdx parser

---
 .../service-webpage/src/components/md.rs      | 235 +++++++++++++-----
 .../service-webpage/src/pages/handouts.md     |  23 +-
 .../service-webpage/src/pages/index.md        |  30 +--
 3 files changed, 203 insertions(+), 85 deletions(-)

diff --git a/crates/service/service-webpage/src/components/md.rs b/crates/service/service-webpage/src/components/md.rs
index 20a5bbb..89be1c0 100644
--- a/crates/service/service-webpage/src/components/md.rs
+++ b/crates/service/service-webpage/src/components/md.rs
@@ -9,7 +9,7 @@ use std::str::FromStr;
 
 use crate::components::fa::FAIcon;
 use crate::components::mangle::{MangledBetaEmail, MangledGoogleEmail};
-use crate::components::misc::Backlinks;
+use crate::components::misc::{Backlinks, FarLink};
 
 lazy_static! {
 	static ref MdParser: MarkdownIt = {
@@ -159,6 +159,10 @@ impl NodeValue for InlineMdx {
 			return;
 		}
 
+		if mdx_external(&self.0, node, fmt) {
+			return;
+		}
+
 		fmt.open("code", &[]);
 		fmt.text(&self.0);
 		fmt.close("code");
@@ -200,78 +204,83 @@ impl InlineRule for InlineMdx {
 }
 
 fn mdx_style(mdx: &str, _node: &Node, fmt: &mut dyn Renderer) -> bool {
-	// Parse inside of mdx: `style(<style>) <content>`
-	let (style, content) = {
-		let mdx = mdx.trim();
-		if !mdx.starts_with("style(") {
-			return false;
+	// Parse inside of mdx: `color(value, "text")`
+	let mdx = mdx
+		.trim()
+		.trim_start_matches('{')
+		.trim_end_matches('}')
+		.trim();
+
+	// Find the function name (everything before the opening parenthesis)
+	let paren_pos = match mdx.find('(') {
+		Some(x) => x,
+		None => return false,
+	};
+
+	if mdx[..paren_pos].trim() != "color" {
+		return false;
+	};
+
+	// Find matching closing parenthesis
+	let skip = paren_pos + 1;
+	let mut balance = 1;
+	let mut end = skip;
+	for i in mdx[skip..].bytes() {
+		match i {
+			b')' => balance -= 1,
+			b'(' => balance += 1,
+			_ => {}
 		}
 
-		let skip = 6;
-		let mut balance = 1;
-		let mut end = skip;
-		for i in mdx[skip..].bytes() {
-			match i {
-				b')' => balance -= 1,
-				b'(' => balance += 1,
-				_ => {}
-			}
-
-			if balance == 0 {
-				break;
-			}
-
-			end += 1;
+		if balance == 0 {
+			break;
 		}
 
-		if balance != 0 {
-			return false;
-		}
+		end += 1;
+	}
 
-		let style = mdx[skip..end].trim();
-		let content = mdx[end + 1..].trim();
+	if balance != 0 {
+		return false;
+	}
 
-		(style, content)
+	let args = mdx[skip..end].trim();
+
+	// Parse arguments: should be "value, text" or "value, \"text\""
+	let comma_pos = match args.find(',') {
+		Some(x) => x,
+		None => return false,
+	};
+
+	let value = args[..comma_pos].trim();
+	let text = args[comma_pos + 1..].trim();
+
+	// Strip quotes from text if present
+	let text = if (text.starts_with('"') && text.ends_with('"'))
+		|| (text.starts_with('\'') && text.ends_with('\''))
+	{
+		&text[1..text.len() - 1]
+	} else {
+		text
 	};
 
 	let mut style_str = String::new();
 
-	for kv in style.split(";") {
-		let mut s = kv.split(":");
-		let k = s.next();
-		let v = s.next();
-
-		if k.is_none() || v.is_none() || s.next().is_some() {
-			return false;
-		}
-
-		#[expect(clippy::unwrap_used)] // Checked previously
-		let k = k.unwrap().trim();
-
-		#[expect(clippy::unwrap_used)] // Checked previously
-		let v = v.unwrap().trim();
-
-		match k {
-			"color" => {
-				style_str.push_str("color:");
-				style_str.push_str(v);
-				style_str.push(';');
-			}
-
-			"color_var" => {
-				style_str.push_str("color:var(--");
-				style_str.push_str(v);
-				style_str.push_str(");");
-			}
-
-			_ => continue,
-		}
+	if value.starts_with("#") {
+		style_str.push_str("color:");
+		style_str.push_str(value);
+		style_str.push(';');
+	} else if value.starts_with("--") {
+		style_str.push_str("color:var(");
+		style_str.push_str(value);
+		style_str.push_str(");");
+	} else {
+		style_str.push_str("color:");
+		style_str.push_str(value);
+		style_str.push(';');
 	}
 
-	// Only works with text, could be reworked to do basic md styling
-	// (italics, bold, tab, code)
 	fmt.open("span", &[("style", style_str)]);
-	fmt.text(content);
+	fmt.text(text);
 	fmt.close("span");
 
 	return true;
@@ -280,7 +289,12 @@ fn mdx_style(mdx: &str, _node: &Node, fmt: &mut dyn Renderer) -> bool {
 fn mdx_include(mdx: &str, _node: &Node, fmt: &mut dyn Renderer) -> bool {
 	// Parse inside of mdx: `include(<args>)`
 	let args = {
-		let mdx = mdx.trim();
+		let mdx = mdx
+			.trim()
+			.trim_start_matches('{')
+			.trim_end_matches('}')
+			.trim();
+
 		if !mdx.starts_with("include(") {
 			return false;
 		}
@@ -326,6 +340,105 @@ fn mdx_include(mdx: &str, _node: &Node, fmt: &mut dyn Renderer) -> bool {
 	return true;
 }
 
+fn mdx_external(mdx: &str, _node: &Node, fmt: &mut dyn Renderer) -> bool {
+	// Parse inside of mdx: `external("text", "link")`
+	let args = {
+		let mdx = mdx
+			.trim()
+			.trim_start_matches('{')
+			.trim_end_matches('}')
+			.trim();
+
+		if !mdx.starts_with("external(") {
+			return false;
+		}
+
+		let skip = 9;
+		let mut balance = 1;
+		let mut end = skip;
+		for i in mdx[skip..].bytes() {
+			match i {
+				b')' => balance -= 1,
+				b'(' => balance += 1,
+				_ => {}
+			}
+
+			if balance == 0 {
+				break;
+			}
+
+			end += 1;
+		}
+
+		if balance != 0 {
+			return false;
+		}
+
+		let args = mdx[skip..end].trim();
+		let trail = mdx[end + 1..].trim();
+		if !trail.is_empty() {
+			return false;
+		}
+
+		args
+	};
+
+	// TODO: better parsing, handle , in string
+	let mut split = args.split(",");
+
+	let title = match split.next() {
+		Some(mut x) => {
+			x = x.trim();
+
+			if &x[0..1] == "\"" {
+				x = &x[1..]
+			} else {
+				return false;
+			}
+
+			if &x[x.len() - 1..] == "\"" {
+				x = &x[0..x.len() - 1]
+			} else {
+				return false;
+			}
+
+			x
+		}
+
+		None => return false,
+	};
+
+	let link = match split.next() {
+		Some(mut x) => {
+			x = x.trim();
+
+			if &x[0..1] == "\"" {
+				x = &x[1..]
+			} else {
+				return false;
+			}
+
+			if &x[x.len() - 1..] == "\"" {
+				x = &x[0..x.len() - 1]
+			} else {
+				return false;
+			}
+
+			x
+		}
+
+		None => return false,
+	};
+
+	if split.next().is_some() {
+		return false;
+	}
+
+	fmt.text_raw(&FarLink(link, title).render().0);
+
+	return true;
+}
+
 //
 // MARK: yaml frontmatter
 //
diff --git a/crates/service/service-webpage/src/pages/handouts.md b/crates/service/service-webpage/src/pages/handouts.md
index df6d0b4..b786173 100644
--- a/crates/service/service-webpage/src/pages/handouts.md
+++ b/crates/service/service-webpage/src/pages/handouts.md
@@ -6,23 +6,26 @@ slug = "handouts"
 
 # Mark's Handouts
 
-[ORMC]: https://circles.math.ucla.edu/circles
 
-This page lists all the handouts I've written for my classes at the [ORMC],
+This page lists all the handouts I've written for my classes at the
+{{external("ORMC", "https://circles.math.ucla.edu/circles")}},
 arguably the best math circle in the western world. We teach students mathematics
-far beyond the regular school curriculum, much like [AOPS](https://artofproblemsolving.com)
-and the [BMC](https://mathcircle.berkeley.edu).
+far beyond the regular school curriculum, much like
+{{external("AOPS", "https://artofproblemsolving.com")}}
+and the
+{{external("BMC", "https://mathcircle.berkeley.edu")}}
+
 
 <br></br>
 
-{style(color_var:pink) For my students: } \
+{{color(--pink, "For my students:")}} \
 Don't look at solutions we haven't discussed,
 and don't start any handouts before class. That spoils all the fun!
 
-{style(color_var:green) For everyone else:} \
+{{color(--green, "For everyone else:")}} \
 If you're using any of these, please let me know---especially \
 if you find errors, mistakes, or a poorly designed section. \
-Such things must be fixed! { include(email_beta) }
+Such things must be fixed! {{ include(email_beta) }}
 
 <br></br>
 
@@ -33,8 +36,10 @@ are written with this in mind.\
 I do not expect the average student to finish all problems during this two-hour session.
 If the class finishes early, the lesson is either too short or too easy.
 
-The sources for all these handouts are available [here](https://git.betalupi.com/mark/handouts).\
-Some are written in LaTeX, some are in [Typst](https://typst.app). \
+The sources for all these handouts are available
+{{external("here", "https://git.betalupi.com/mark/handouts")}} \
+Some are written in LaTeX, some are in
+{{external("Typst", "https://typst.app")}}. \
 The latter is vastly superior.
 
 <br></br>
diff --git a/crates/service/service-webpage/src/pages/index.md b/crates/service/service-webpage/src/pages/index.md
index b477b63..c73af14 100644
--- a/crates/service/service-webpage/src/pages/index.md
+++ b/crates/service/service-webpage/src/pages/index.md
@@ -9,37 +9,37 @@ Also see [what's a "betalupi?"](/whats-a-betalupi)
 
 ## Projects
 
-- **RedoxOS**, a general-purpose, microkernel-based operating system written in Rust. _{ style(color_var:grey) [enthusiast] }_
+- **RedoxOS**, a general-purpose, microkernel-based operating system written in Rust. _{{color(--grey, "[enthusiast]")}}
 
-  - { style(color_var:grey) Status: } { style(color_var:yellow) Passive. }
-  - { style(color_var:grey) Website: } [:fa-link: redox-os.org](https://www.redox-os.org/)
+  - {{color(--grey, "Status: ")}} {{color(--yellow, "Passive.")}}
+  - {{color(--grey, "Website: ")}} [:fa-link: redox-os.org](https://www.redox-os.org/)
 
 
 <br/>
 
 
 - **Tectonic**, the LaTeX engine that is pleasant to use.
-  Experimental, but fully functional. _{ style(color_var:grey) [co-maintainer] }_
+  Experimental, but fully functional. _{{color(--grey, "[co-maintainer]")}}_
 
-  - { style(color_var:grey) Status: } { style(color_var:yellow) Passive. } [Typst](https://github.com/typst/typst) is better.
-  - { style(color_var:grey) Main repo: } [:fa-github: Tectonic](https://github.com/tectonic-typesetting/tectonic)
-  - { style(color_var:grey) Bundle tools: } [:fa-github: tectonic-texlive-bundles](https://github.com/tectonic-typesetting/tectonic-texlive-bundles)
+  - {{color(--grey, "Status: ")}} {{color(--yellow, "Abandoned. ")}} [Typst](https://github.com/typst/typst) is better.
+  - {{color(--grey, "Main repo: ")}} [:fa-github: Tectonic](https://github.com/tectonic-typesetting/tectonic)
+  - {{color(--grey, "Bundle tools: ")}} [:fa-github: tectonic-texlive-bundles](https://github.com/tectonic-typesetting/tectonic-texlive-bundles)
 
 
 <br/>
 
 
-- **Daisy**, a pretty TUI scientific calculator. _{style(color_var:grey) [author] }_
+- **Daisy**, a pretty TUI scientific calculator. _{{color(--grey, "[author]")}}_
 
-  - {style(color_var:grey) Status: } {style(color_var:orange) Done. } Used this to learn Rust. [Numbat](https://numbat.dev) is better.
-  - {style(color_var:grey) Repository: } [:fa-github: rm-dr/daisy](https://github.com/rm-dr/daisy)
-  - {style(color_var:grey) Website: } [:fa-link: daisy.betalupi.com](https://daisy.betalupi.com) (WASM demo)
+  - {{color(--grey, "Status: ")}} {{color(--orange, "Done. ")}} Used this to learn Rust. [Numbat](https://numbat.dev) is better.
+  - {{color(--grey, "Repository: ")}} [:fa-github: rm-dr/daisy](https://github.com/rm-dr/daisy)
+  - {{color(--grey, "Website: ")}} [:fa-link: daisy.betalupi.com](https://daisy.betalupi.com) (WASM demo)
 
 <br/>
 
-- **Lamb**, a lambda calculus engine. _{style(color_var:grey) [author] }_
-  - {style(color_var:grey) Status: } {style(color_var:orange) Done. } Fun little project.
-  - {style(color_var:grey) Repository: } [:fa-github: rm-dr/lamb](https://github.com/rm-dr/lamb)
-  - {style(color_var:grey) PyPi: } [:fa-python: lamb-engine](https://pypi.org/project/lamb-engine)
+- **Lamb**, a lambda calculus engine. _{{color(--grey, "[author] ")}}_
+  - {{color(--grey, "Status: ")}} {{color(--orange, "Done. ")}} Fun little project.
+  - {{color(--grey, "Repository: ")}} [:fa-github: rm-dr/lamb](https://github.com/rm-dr/lamb)
+  - {{color(--grey, "PyPi: ")}} [:fa-python: lamb-engine](https://pypi.org/project/lamb-engine)
 
 <br/>