ComponentsLayoutDrawer

layoutstexulinot agent-emittableapp

LayoutDrawer

layout-drawer

Mobile navigation drawer built on the dialog primitive.

Live examples

Open drawer

Open drawer

Loading demo…

Props

Public props for LayoutDrawer
NameKindRequiredDefaultDescription
openbooleannofalse—
labelstringyes—Accessible drawer name
closeLabelstringno"Close navigation"—
childrenslotno——

Keyboard

Keyboard behavior for LayoutDrawer
KeyAction
aDrawer is a labelled dialog

Accessibility

  • Drawer is a labelled dialog
  • Close control is named

Evidence for layout-drawer

Latest committed gates for layout-drawer (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/layout-drawer · budget 12.0 KiB

Budget from texuli.budgets.json; re-measure with `pnpm size --filter <entry>`.

Axe

documented

  • tests/e2e/site-component-pages.spec.ts
  • docs/quality (a11y-*)

Site component pages axe gate; package-level a11y docs under docs/quality when present.

Browsers

  • chromium
  • webkit
  • mobile

Playwright projects: Desktop Chrome, Desktop Safari, Pixel 7. Firefox is a known gap on this host.

When to use

Use when

  • Narrow layouts that hide primary nav behind a menu

Don’t use when

Prefer another component

  • Desktop-only sidebars