Hozo components in Astro MDX

The card below is a .tsx component built from Hozo’s static primitives, imported into this MDX page and used with no client: directive.

Astro renders it at build time, so this page ships no JavaScript for it — no island, no hydration, no React in the bundle. Hozo compiled the primitives to plain HTML and a stylesheet before Astro ever saw them.

Compiled at build time

Every element below was a Hozo primitive in the source and is plain HTML in this page.

No runtime import
No event handler
No client bundle

The compiler that produced this

A primitive written inline in this file compiles too. @astrojs/mdx exposes no jsx: true (#137), so Hozo is handed _jsx() calls rather than the JSX it reads – and the Vite integration puts them back before reading and folds them again afterwards, which it was already doing to its own output.

inline in Astro MDX