Slots replace how a single region of the chart renders while the spec still owns whether that region exists and what data it receives. Your override gets the same render-ready props the default would. Pass them through the slots prop.
Regions
Two kinds of slot
The distinction matters when you write an override:
Layout-safe slots (Header, Footer, Tooltip, Grid, Swatch) are bare components. They paint inside a box the layout already sized, so you just provide a component:
Layout-coupled slots (Legend, Headline, AxisTicks, AxisLabel) reserve edge space, so they’re an object with both a render component and a measure function that reports the region’s size. Paint and reserved space must agree, so the layout calls measure to know how much room to leave:
Give a layout-coupled slot’s measure a stable reference (define it outside
render or memoize it). A measure whose identity changes every render
repaints but doesn’t re-trigger the layout, so paint and reserved space drift.
measure receives a SlotMeasureContext with measureText (the same Canvas-backed measurer the built-in regions use) and the active textScale, so your reserved size matches what actually paints.
Related
- Geom renderers — replace a whole geom’s paint, not just a region
- Interactivity — the
Tooltip slot in context
- Theming — restyle regions with tokens before reaching for a slot
