EdgeLoader

import { EdgeLoader } from '@wick-charts/react';
 
<EdgeLoader side='left' onTrigger={loadOlder} />

Subscribes to the chart's viewport and triggers a fetch when the visible range nears the chosen data edge. Handles the boilerplate every load-on-scroll site otherwise has to re-implement: arming after first user pan, deduping via Promise tracking, and exposing the boundary's pixel coordinate so a loader can be anchored to "the wall of available history".

Place as a child of <ChartContainer>. Time X axis only — on a numeric or category axis it renders nothing and never triggers.

Props

sideEdgeSide

Which edge to watch.

threshold?default 5number

Bars from the edge that arms the trigger. Multiplied by the chart's data interval. Default 5.

onTrigger() => void | Promise<unknown>

Called when the visible range moves within EdgeLoaderProps.threshold bars of the data edge. Returning a Promise toggles isLoading for its lifetime. Resolve with `false` to signal "no more data" — the loader stops watching and switches the optional canvas indicator to its 'no-data' state. Any other resolve value (including undefined) means "keep watching for the next near-edge event".

indicator?'canvas' | 'custom' | LoadingIndicatorFn

'canvas' (default): drive the chart's built-in canvas spinner via

ChartInstance.setEdgeState. Renders inside the chart area at the data boundary.

'custom': skip the canvas indicator entirely. Use the render-prop

children to draw your own DOM/SVG loader.

A LoadingIndicatorFn: keep the canvas indicator, but swap its

painter — the built-in skeletonLoadingIndicator (from @wick-charts/core) or a custom one, same pluggable-function contract either way. Drawn in a clipped stage anchored at the data boundary, inside the overshoot zone.

children?(args: EdgeLoaderRenderArgs) => ReactNode

Optional render-prop. Receives the live edge state — render whatever positioned overlay you want, or return null.