victory-native/dist/cartesian/CartesianChart.d.ts

A charting library for React Native with a focus on performance and customization.

import * as React from "react";
import { type CanvasRef } from "@shopify/react-native-skia";
import { type SharedValue } from "react-native-reanimated";
import { type ComposedGesture } from "react-native-gesture-handler";
import { type MutableRefObject } from "react";
import type { ScaleLinear } from "d3-scale";
import type { AxisProps, CartesianChartRenderArg, InputFields, NumericalFields, SidedNumber, ChartBounds, YAxisInputProps, XAxisInputProps, FrameInputProps, ChartPressPanConfig, Viewport, GestureHandlerConfig, CartesianChartOrientation } from "../types";
import type { ChartPressState, ChartPressStateInit } from "./hooks/useChartPressState";
import { type ChartTransformState } from "./hooks/useChartTransformState";
import { type PanTransformGestureConfig, type PinchTransformGestureConfig } from "./utils/transformGestures";
import { type ChartLayoutModeProps } from "../shared/ChartLayoutModeProps";
export type CartesianActionsHandle<T = undefined> = T extends ChartPressState<infer S> ? S extends ChartPressStateInit ? {
    handleTouch: (v: T, x: number, y: number) => void;
} : never : never;
export type CartesianActionsRef<T = undefined> = MutableRefObject<CartesianActionsHandle<T> | null> | SharedValue<CartesianActionsHandle<T> | null>;
export type CartesianChartRef<T = undefined> = {
    /**
     * The Skia canvas ref for imperative drawing. This is `null` in headless mode
     * because no `Canvas` is mounted; the host must supply an offscreen surface.
     */
    canvas: CanvasRef | null;
    actions: CartesianActionsHandle<T>;
};
type CartesianChartAxisProps<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>, XLabel, YLabel> = {
    axisOptions?: Partial<Omit<AxisProps<RawData, XK, YK, XLabel, YLabel>, "xScale" | "yScale">>;
    xAxis?: XAxisInputProps<RawData, XK, XLabel>;
    yAxis?: YAxisInputProps<RawData, YK, YLabel>[];
};
type CartesianChartBaseProps<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>> = {
    data: RawData[];
    xKey: XK;
    yKeys: YK[];
    padding?: SidedNumber;
    domainPadding?: SidedNumber;
    domain?: {
        x?: [number] | [number, number];
        y?: [number] | [number, number];
    };
    viewport?: Viewport;
    chartPressState?: ChartPressState<{
        x: InputFields<RawData>[XK];
        y: Record<YK, number>;
    }> | ChartPressState<{
        x: InputFields<RawData>[XK];
        y: Record<YK, number>;
    }>[];
    chartPressConfig?: {
        pan?: ChartPressPanConfig;
    };
    gestureHandlerConfig?: GestureHandlerConfig;
    children: (args: CartesianChartRenderArg<RawData, YK>) => React.ReactNode;
    renderOutside?: (args: CartesianChartRenderArg<RawData, YK>) => React.ReactNode;
    onChartBoundsChange?: (bounds: ChartBounds) => void;
    onScaleChange?: (xScale: ScaleLinear<number, number>, yScale: ScaleLinear<number, number>) => void;
    /**
     * @deprecated This prop will eventually be replaced by the new `chartPressConfig`. For now it's being kept around for backwards compatibility sake.
     */
    gestureLongPressDelay?: number;
    frame?: FrameInputProps;
    transformState?: ChartTransformState;
    transformConfig?: {
        pan?: PanTransformGestureConfig;
        pinch?: PinchTransformGestureConfig;
    };
    customGestures?: ComposedGesture;
    actionsRef?: CartesianActionsRef<ChartPressState<{
        x: InputFields<RawData>[XK];
        y: Record<YK, number>;
    }> | undefined>;
    ref?: React.Ref<CartesianChartRef<ChartPressState<{
        x: InputFields<RawData>[XK];
        y: Record<YK, number>;
    }> | undefined>>;
} & ChartLayoutModeProps;
type CartesianChartVerticalProps<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>> = CartesianChartBaseProps<RawData, XK, YK> & CartesianChartAxisProps<RawData, XK, YK, InputFields<RawData>[XK], RawData[YK]> & {
    orientation?: "vertical";
};
type CartesianChartHorizontalProps<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>> = CartesianChartBaseProps<RawData, XK, YK> & CartesianChartAxisProps<RawData, XK, YK, number, InputFields<RawData>[XK]> & {
    orientation: "horizontal";
};
type CartesianChartDynamicOrientationProps<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>> = CartesianChartBaseProps<RawData, XK, YK> & CartesianChartAxisProps<RawData, XK, YK, InputFields<RawData>[XK] | number, RawData[YK] | InputFields<RawData>[XK]> & {
    orientation: CartesianChartOrientation;
};
export declare function CartesianChart<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>>(props: CartesianChartHorizontalProps<RawData, XK, YK>): React.ReactElement;
export declare function CartesianChart<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>>(props: CartesianChartVerticalProps<RawData, XK, YK>): React.ReactElement;
export declare function CartesianChart<RawData extends Record<string, unknown>, XK extends keyof InputFields<RawData>, YK extends keyof NumericalFields<RawData>>(props: CartesianChartDynamicOrientationProps<RawData, XK, YK>): React.ReactElement;
export {};