Expand description
markdown_view_leptos โ Render Markdown at compile time with inline Leptos components
This crate provides two procedural macros:
markdown_view!: Converts a string literal orfile = "..."/url = "..."into a Leptosview!tree at compile time. Dynamic strings and computed file paths render at runtime.markdown_anchors!: ReturnsVec<(String, String)>of(title, id)heading pairs from the same input sources, matching the IDs generated bymarkdown_view!.
The macro allows embedding real Leptos components inline using a lightweight MDX-like syntax:
- Embed components with:
{{ <MyComponent prop=value/> }} - Include file content:
markdown_view!(file = "README.md") - Fetch remote content (build-time):
markdown_view!(url = "https://...")
Notes and caveats:
- The macro injects generated HTML into the DOM via
inner_html. Avoid untrusted Markdown if you need strict sanitization. - Remote
url = "..."fetch happens at compile time and is disabled under rust-analyzer to keep IDEs responsive. Preferfile = "..."for stability. - Dynamic sources (
markdown_view!(my_string)orfile = format!(...)) render at runtime using a lightweight built-in Markdown renderer (no extra user dependencies). It supports headings/paragraphs and heading IDs but does not expand inline{{ ... }}components. If the macro can see a string literal binding in the same file (for examplelet body = r#"..."#;followed bymarkdown_view!(body)), it treats it like an inline literal so inline{{ ... }}components still expand. file = <expr>paths depend onstd::fsand therefore are not supported on wasm32 unless the macro can resolve the path during compilation to embed it.- Component parsing looks for
{{ ... }}and treats the inner content as a Rust/RSX snippet. We intentionally keep this flexible and resilient: if parsing fails, the content is rendered as plain Markdown to avoid breaking your build.
Example
โ
use leptos::prelude::*;
use markdown_view_leptos::markdown_view;
#[component]
fn Counter() -> impl IntoView { let (n, set_n) = signal(0); view! { <button on:click=move |_| set_n.update(|v| *v+=1)>{n}</button> } }
#[component]
pub fn App() -> impl IntoView {
view! { <main>{markdown_view!(r#"Hello {{ <Counter/> }}!"#)}</main> }
}Macrosยง
- markdown_
anchors - Collect all heading anchors from Markdown sources at compile time or runtime.
- markdown_
view - Compile-time Markdown to a Leptos
view!tree with optional inline components.