Components / Overlays
View Source Modals, Drawers, Slideovers & DataTables
Accessible dialog overlays, mobile-first bottom drawers, slideover sheets, popovers, dropdown menus, context menus, alert banners, and reactive data tables.
Modals, Slideovers & Mobile-First Drawers
Popovers, Tooltips, Dropdowns & Context Menus
Hover for Tooltip User Menu Filters Popover
Accordion (Collapsible FAQ & Panels)
Yaxa is a zero-boilerplate single-package library (like Nuxt UI) rather than a code-copy CLI. Everything updates cleanly via npm/pnpm with full type safety.
Yes! 100% of Yaxa primitives are written natively with Svelte 5 runes ($state, $derived, $effect, and snippet slots) and Tailwind CSS v4.
Yes. Yaxa includes dynamic SVG OG image generation, automated sitemaps with XSL styling, robots.txt handlers, and Schema.org JSON-LD generation.
Breadcrumb Navigation & Pagination Controls
Breadcrumb Trail
Showing page 2 of 10
Localization & Right-to-Left (useLocale / useRtl)
Direction:
Language:
Formatted Price:
€149.99
Formatted Number:
1,250,490
Relative Time:
3 hours ago
Date Display:
Oct 2, 2026
Infinite Scrolling (useInfiniteScroll)
Scroll inside the container below to trigger automated batch loading:
Server deployment succeeded (commit #94a82c)
New paid subscriber joined Pro Plan ($49/mo)
Database backup completed to Cloudflare R2
SSL certificate renewed for api.yaxa.dev
Alert Banners
Svelte 5 Runes Support
Yaxa requires Svelte 5.0.0 or later and SvelteKit 2.7+.
Tailwind CSS v4 Requirement
Make sure to install @tailwindcss/vite and import 'yaxa/yaxa.css' in your root layout.
Reactive DataTable (Pinning, Resizing, Sorting & Search)
Includes sticky column pinning (pinned: 'left' | 'right'), draggable column header width resizing, search filtering, and selectable rows:
Contributor | Release Status | ||||
|---|---|---|---|---|---|
| Button.svelte | Elements | 180 | Alex | Ready | |
| Modal.svelte | Overlays | 140 | Elena | Ready | |
| FormField.svelte | Forms | 110 | Chen | Ready | |
| DataTable.svelte | Elements | 230 | Sarah | Ready | |
| CodeBlock.svelte | Elements | 195 | Marcus | Ready | |
| Dropzone.svelte | Forms | 210 | David | Ready |