Agrid-Reporter Builder

The Agrid Report renders a dynamic, customizable data grid. It's ideal for displaying tabular metrics like browser usage, traffic sources, or performance indicators with support for custom cell renderers.

Agrid Report Example

Properties

The below table lists and explains the properties of the Agrid Report.

Prop	Description	Required
`columns`	Array of column definitions { field, headerName, cellRenderer, ... }	✔
`rows`	Array of row data where each key matches a column field	✔
`field`	Key that identifies the column and maps to data in each row	✔
`headerName`	Display label for the column header	✔
`cellRenderer`	Custom renderer: name, value, badge or rating	✔

Cell Data Format

Each field in a row can include:

Sub-prop	Description	Required
`value`	The main content (number, string, etc.)	✔
`unit`	Unit label (e.g. visits, orders)
`status`	Badge status (used in badge renderer)
`variant`	Variant for ratings (e.g. success, warning, dark-success, light-success)
image	Image object { value, square? }
`properties`	Display properties { className, percentage }

Agrid

Properties#

Cell Data Format#

Code Example#

Properties

Cell Data Format

Code Example