ChartBlockRenderer

stable

Renders data visualizations (bar, line, pie, area, radar).

Source: packages/ui/src/components/blocks/ChartBlockRenderer.tsx

Accessibility

No accessibility audit yet. Run the a11y pipeline to generate results.

Playground

Interactive playground coming soon for this component.
tsx
import { ChartBlockRenderer } from "@itu/ui";
 
<ChartBlockRenderer />
3 lines of tsx code

Props

PropTypeDefaultRequiredDescription
blockChartBlockDataRequiredThe chart block data from Payload CMS
localestringRequiredBCP 47 locale string used for localizing content
ChartContainerComponentType<{ config: ChartConfig; className?: string | undefined; style?: CSSProperties | undefined; children: ReactNode; }>RequiredThe chart rendering component. Must accept config, className, style, and children.
renderChart(props: { chartType: string; data: Record<string, unknown>[]; xAxisKey: string; dataKeys: string[]; config: ChartConfig; }) => ReactNodeRequiredRender function for chart content (bar, line, pie, etc.)
renderRichText((data: any) => ReactNode)OptionalCustom render function for rich text content