overlaystexulinot agent-emittableapp
AppNav
app-nav
Desktop sidebar shell with mobile sheet drawer and main slot.
Live examples
App shell
App shell
Loading demo…
Props
| Name | Kind | Required | Default | Description |
|---|---|---|---|---|
items | array | no | — | — |
sections | array | no | — | — |
collapsed | boolean | no | false | — |
collapsible | boolean | no | true | — |
variant | enum (default, inset) | no | "default" | — |
header | slot | no | — | — |
footer | slot | no | — | — |
itemIcon | slot | no | — | — |
children | slot | no | — | — |
topBar | slot | no | — | — |
label | string | no | "Main" | — |
menuLabel | string | no | "Open navigation" | — |
drawerTitle | string | no | "Navigation" | — |
hrefTrust | enum (developer, untrusted) | no | "developer" | — |
mobileOpen | boolean | no | false | — |
class | string | no | — | — |
Keyboard
| Key | Action |
|---|---|
a | Menu button opens a labelled sheet; main has a stable id. |
Accessibility
- Menu button opens a labelled sheet; main has a stable id.
Evidence for app-nav
Latest committed gates for app-nav (as of 2026-10-23). Static snapshot — not live CI.
Behavior
n/ano behavior scenario
No dedicated behavior scenario for this catalog id (a styled or display surface, covered by its unit and axe tests).
Size (gzip)
texuli/app-nav · budget 12.0 KiB
Budget from texuli.budgets.json; re-measure with `pnpm size --filter <entry>`.
Axe
documented
tests/e2e/site-component-pages.spec.tsdocs/quality (a11y-*)
Site component pages axe gate; package-level a11y docs under docs/quality when present.
Browsers
chromiumwebkitmobile
Playwright projects: Desktop Chrome, Desktop Safari, Pixel 7. Firefox is a known gap on this host.
When to use
Use when
- Full app chrome with responsive navigation
Don’t use when
Prefer another component
- Sidebar alone inside a custom shell