Nav/Schema

Recipe

Astro integration

Render HTML on the server, then hydrate behavior with tiny-engine on the client.

SSR + init pattern

src/pages/index.astro
---
---
<aside id="sidebar"></aside>
<script>
  import { mountSidebar } from "nav-schema";
  mountSidebar(document.querySelector("#sidebar"), { schema });
</script>

Island host pattern

src/components/DropdownIsland.astro
---
---
<aside id="sidebar"></aside>
<script>
  import { mountSidebar } from "nav-schema";
  mountSidebar(document.querySelector("#sidebar"), { schema });
</script>