DocsBlog
  • 1.0.0

  • light

    dark

    system

    Switch mode
  • Cerberus

    Acheron

    Elysium

Get Started
Components
Data Grid
Styling
Theming

Get Started

OverviewQuick StartColumnsContext

Layout

DimensionsSizingToolbarPagination

Features

PinningSorting

Reference

API

On this page

  • Edit this page on Github

Data Grid API

The API reference for the Data Grid component.

  • source

API

The Data Grid API provides the following props:

ParamsRequiredDescription
datatrueThe full set of data to display in the grid.
columnstrueThe list of defined columns using the column helper.
initialStatefalseThe initial state of the grid for pagination settings.
rowSizefalseThe size of each row in pixels or one of the predefined sizes.
toolbarfalseThe component to render in the grid toolbar slot.
footerfalseThe component to render in the grid footer slot.

Slot Attributes

Each slot layer is assigned a unique data-part attribute for styling and targeting specific slot layers.

NameValueDescription
data-scopedata-gridThe scope of the components.
data-parttoolbarThe container of the toolbar slot.
data-partrootThe container Data Grid family.
data-partviewportThe container of the viewport slot.
data-parthead-cellThe container of the head cell slot.
data-partrowThe container of the row slot.
data-partrow-cellThe container of the row cell slot.
data-partfooterThe container of the footer slot.

Note

Any other slot part displayed in the Grid is inherited from the Cerberus React component API for that item.

Cerberus Design System | Docs