Components
Interactive primitives, grouped by what they do. Each custom element manages behavior and ARIA while links, buttons, and content stay in light DOM for styling and SEO. For full-page building blocks see Sections; for form-specific elements see Forms.
Navigation
cui-navbar with sticky positioning, responsive collapse, dropdowns, and nested menus.
Atoms
Buttons, tab panels, code blocks, and the cui-tree element — small primitives that
compose into larger surfaces.
Motion
cui-scroll-stage publishes focus and offset as CSS custom properties;
cui-reveal layers entry animations on top. Reduced-motion aware.
Overlays
cui-modal over native <dialog>, cui-disclosure over
<details>, and the toast() notifications API.
Map
cui-map — Leaflet-backed map with semantic markers, GeoJSON regions, and a
lazy-loaded library. SEO-friendly, theme-aware.
What lives where
The component surface used to be one long page. It's now four thematic pages, plus a fifth (Sections) for page-level marketing blocks like heroes, CTAs, and content grids. Use the table below if you're looking for something specific.
| Looking for… | Page |
|---|---|
| Hero, page intro, CTA, content grids, media blocks | Sections |
| Navbar with dropdowns and mobile collapse | Navigation |
| Buttons, tabs, code blocks, tree | Atoms |
| Scroll stage, reveal, scroll-driven animation | Motion |
| Modal, disclosure, toast notifications | Overlays |
| Interactive map with points, regions, and clustering | Map |
| Fields, validation, async validators, i18n | Forms |