UNPKG

@tanstack/charts

Version:

A chart grammar for TypeScript and JavaScript. Marks consume your data directly, channels describe visual encodings, and the engine compiles them into a renderer-neutral keyed scene. TanStack's compact scales cover common numeric and categorical mappings.

29 lines (28 loc) 1.96 kB
import * as React from 'react'; import type { ChartPoint, ChartRenderContext, ChartSvgRenderer, ChartTextMeasurer, ChartTooltipBodyTarget, ChartValue, DomChartDefinition } from '@tanstack/charts'; export interface ChartCommonProps<TDatum = unknown, TXValue extends ChartValue = ChartValue, TYValue extends ChartValue = ChartValue> { ariaLabel: string; ariaDescription?: string; height?: number; aspectRatio?: number; width?: number; initialWidth?: number; className?: string; style?: React.CSSProperties; tabIndex?: number; idPrefix?: string; renderSvg?: ChartSvgRenderer<NoInfer<TDatum>, NoInfer<TXValue>, NoInfer<TYValue>>; measureText?: ChartTextMeasurer; onFocusChange?: (point: ChartPoint<TDatum, TXValue, TYValue> | null) => void; onFocusGroupChange?: (points: readonly ChartPoint<TDatum, TXValue, TYValue>[]) => void; onSelect?: (point: ChartPoint<TDatum, TXValue, TYValue> | null) => void; onRender?: (context: ChartRenderContext<TDatum, TXValue, TYValue>) => void; } export type ChartProps<TDatum = unknown, TXValue extends ChartValue = ChartValue, TYValue extends ChartValue = ChartValue> = ChartCommonProps<TDatum, TXValue, TYValue> & { definition: DomChartDefinition<TDatum, TXValue, TYValue>; }; export type ChartImplementationProps<TDatum = unknown, TXValue extends ChartValue = ChartValue, TYValue extends ChartValue = ChartValue> = ChartProps<TDatum, TXValue, TYValue> & { onTooltipBodyChange?: (target: ChartTooltipBodyTarget<TDatum, TXValue, TYValue> | null) => void; }; export declare function Chart<TDatum, TXValue extends ChartValue = ChartValue, TYValue extends ChartValue = ChartValue>(props: ChartProps<TDatum, TXValue, TYValue>): React.JSX.Element; export declare function ChartImplementation<TDatum, TXValue extends ChartValue = ChartValue, TYValue extends ChartValue = ChartValue>(props: ChartImplementationProps<TDatum, TXValue, TYValue>): React.JSX.Element;