ComponentsDashboard grid layout

layoutstexulinot agent-emittableapp

Dashboard grid layout

layout-dashboard-grid

Top chrome plus container-query widget grid.

Live examples

Dashboard grid layout

Dashboard grid layout

Loading demo…

Props

Public props for Dashboard grid layout
NameKindRequiredDefaultDescription
mountScreeneventyes—Host callback that mounts the stable routed screen node
navobjectno—NavModel for chrome links
pathstringno—Current hash path
optionsobjectno—Flat data-only layout knobs
storageKeystringno—Scope for persisted UI flags
asideslotno—Optional context panel
classstringno——
hrefTrustenum (developer, untrusted)no"developer"—

Keyboard

Keyboard behavior for Dashboard grid layout
KeyAction
aPrimary navigation is a labelled landmark

Accessibility

  • Skip link targets main when chrome is present
  • Primary navigation is a labelled landmark

Evidence for layout-dashboard-grid

Latest committed gates for layout-dashboard-grid (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-dashboard-grid · 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

  • Analytics and operations dashboards

Don’t use when

Prefer another component

  • Long-form reading