Grid

CSS grid layout canvas (renders as div with Tailwind grid utilities). Use for responsive columns, card grids, and bento-style layouts. Use Table + TableSection + TableRow + TableCell for semantic data tables.

Required Props: idSupports Children: any

Structure

All layout styling is in props.className. Presets in the editor map to grid-cols/grid-rows/gap. root.layoutPreset stores the selected preset slug.

Properties

PropertyTypeDescriptionExamples
canDeleteboolean
-
Default: true
-
canEditNameboolean
-
Default: true
-
customobject
-
-
classNamestring
Tailwind utilities including grid, grid-cols-*, grid-rows-*, gap-*, place-items-*, and responsive breakpoints.
grid w-full min-w-0 grid-cols-1 gap-space-md md:grid-cols-2grid grid-cols-2 grid-rows-2 gap-space-md
rootobject
-
-