BarChart¶
What It Does¶
Compares volumes or totals across categories.
Signature¶
db.BarChart(data: 'List[Dict[str, Any]]', x_key: 'str', y_keys: 'List[str]', title: 'Optional[str]' = None, colors: 'Optional[List[str]]' = None, horizontal: 'bool' = False, height: 'int' = 300, loading: 'bool' = False, empty_message: 'str' = 'No chart data available', on_click: 'Optional[Callable[[Dict[str, Any]], None]]' = None) -> 'VNode'
Parameters¶
| Name | Type | Default | Notes |
|---|---|---|---|
data |
List[Dict[str, Any]] |
required |
|
x_key |
str |
required |
|
y_keys |
List[str] |
required |
|
title |
Optional[str] |
None |
|
colors |
Optional[List[str]] |
None |
|
horizontal |
bool |
False |
|
height |
int |
300 |
|
loading |
bool |
False |
|
empty_message |
str |
'No chart data available' |
|
on_click |
Optional[Callable[[Dict[str, Any]], None]] |
None |
Example¶
import brickflowui as db
node = db.BarChart(data=[{"week": "W01", "runs": 24}], x_key="week", y_keys=["runs"], title="Command center")
Integration Notes¶
- This component composes cleanly with layout primitives such as
Card,Grid,Row, andColumn. - Prefer controlled state from Python when the value matters to your business logic or backend query layer.
Responsive Notes¶
Check the component inside a realistic layout, not only in isolation, so spacing, overflow, and action density stay comfortable on smaller screens.
Accessibility Notes¶
Pair this component with clear visible copy and predictable state changes so keyboard and assistive-technology users are not surprised.