ComponentsGrid layout

layoutstexuliagent-emittablecontent

Grid layout

layout-grid

Responsive content grid for agent-authored tiles.

Live examples

Grid layout

Grid layout

Loading demo…

Props

Public props for Grid layout
NameKindRequiredDefaultDescription
columnsnumberno2—
gapstringno"1rem"—
childrenslotno——
classstringno——

Keyboard

Keyboard behavior for Grid layout
KeyAction
—See accessibility notes for keyboard behavior.

Accessibility

  • Structure is semantic regions the host maps to real layout components
  • No HTML strings; children are nested catalog nodes

Evidence for layout-grid

Latest committed gates for layout-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-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

  • Compose grid layout structure in agent-authored trees

Don’t use when

Prefer another component

  • App chrome shells (sidebar, top-nav, dialogs)