API and Development
Grid wraps Radix UI Themes Grid with design-token backgrounds, borders, elevation, and useSpacing for margin, padding, and gap. It extends BoxProps (minus flex-only props) with columns, rows, areas, flow (GridFlow), align (GridAlign), justify (GridJustify), display (GridDisplay), and useContainerQueries for responsive column templates tied to container width.
Name | Type | Default | Description |
|---|---|---|---|
|
|
| Track template or counts. |
|
|
| Row template. |
|
|
| Auto-placement flow. |
|
|
| Align items. |
|
|
| Justify content. |
|
|
| Gap spacing scale. |
|
|
| Container-based breakpoints. |
See GridProps in @prepared911/ui-core for the full surface (background, border, attach*, overflow, zIndex, etc.).
The previews below mirror the Grid stories in Storybook (Default, Columns, Rows, GridFlowStory, Alignment, MasonryBasic).