react-native-chart-kit/dist/v2/react-native/charts/bar/types.d.ts

Beautiful React Native charts for dashboards, reports, and data-rich mobile apps.

import type { ReactNode } from "react";
import type { ChartBoxes, ChartViewportInitialIndex, ChartXValue, NumericDomainInput } from "../../../core/index";
import type { CartesianChartPresetValue, CartesianChartTheme, ChartKitThemeContextValue, ChartKitThemeMode, ResolvedCartesianChartTheme } from "../../theme";
import type { LineChartRenderer } from "../line/types";
export type BarChartMode = "grouped" | "stacked" | "stacked100";
export type BarChartOrientation = "vertical" | "horizontal";
export type BarChartInitialIndex = ChartViewportInitialIndex;
export type BarChartRenderer = LineChartRenderer;
export type BarChartSeries<TData extends Record<string, unknown>> = {
    yKey: keyof TData & string;
    key?: string;
    label?: string;
    color?: string;
};
export type BarChartLabelStrategy = "auto" | "show" | "hide";
export type BarChartInteractionMode = "none" | "tap";
export type BarChartSelectedBar = {
    dataIndex: number;
    seriesKey: string;
};
export type BarChartSelectEvent<TData = unknown> = {
    color: string;
    dataIndex: number;
    seriesKey: string;
    seriesLabel: string;
    value: number;
    formattedValue: string;
    x: ChartXValue;
    xLabel: string;
    position: {
        x: number;
        y: number;
    };
    raw: TData | undefined;
};
export type BarChartDeselectEvent = {
    reason: "outsidePress" | "programmatic";
};
export type BarChartInteractionConfig<TData = unknown> = {
    mode?: BarChartInteractionMode;
    deselectOnOutsidePress?: boolean;
    onSelect?: (event: BarChartSelectEvent<TData>) => void;
    onDeselect?: (event: BarChartDeselectEvent) => void;
};
export type BarChartInteraction<TData = unknown> = BarChartInteractionMode | BarChartInteractionConfig<TData>;
export type BarChartTooltipConfig = {
    visible?: boolean;
    anchor?: BarChartTooltipAnchor;
    placement?: BarChartTooltipPlacement;
    offset?: number;
    edgePadding?: number;
    width?: number;
    positionAnimationDuration?: number;
    padding?: number;
    borderRadius?: number;
    backgroundColor?: string;
    borderColor?: string;
    textColor?: string;
    labelColor?: string;
    shadowColor?: string;
    shadowOpacity?: number;
    shadowOffsetX?: number;
    shadowOffsetY?: number;
    fontFamily?: string;
    fontSize?: number;
    labelFontSize?: number;
};
export type BarChartTooltipAnchor = "bar" | "pointer";
export type BarChartTooltipPlacement = "auto" | "above" | "below" | "top";
export type ResolvedBarChartTooltipConfig = {
    visible: boolean;
    anchor: BarChartTooltipAnchor;
    placement: BarChartTooltipPlacement;
    offset: number;
    edgePadding: number;
    width: number;
    positionAnimationDuration: number;
    padding: number;
    borderRadius: number;
    backgroundColor: string;
    borderColor: string;
    textColor: string;
    labelColor: string;
    shadowColor: string;
    shadowOpacity: number;
    shadowOffsetX: number;
    shadowOffsetY: number;
    fontFamily: string | undefined;
    fontSize: number;
    labelFontSize: number;
};
export type BarChartSelectionAnimationConfig = {
    duration?: number;
};
export type BarChartRenderBarProps<TData = unknown> = {
    bar: BarChartBarModel<TData>;
    fill: string;
    radius: number;
    selected: boolean;
    strokeColor: string;
    strokeOpacity: number;
    strokeWidth: number;
    theme: ResolvedCartesianChartTheme;
};
export type BarChartProps<TData extends Record<string, unknown>> = {
    data: TData[];
    xKey: keyof TData & string;
    yKey?: keyof TData & string;
    yKeys?: Array<keyof TData & string>;
    series?: Array<BarChartSeries<TData>>;
    width: number;
    height: number;
    theme?: ChartKitThemeMode | CartesianChartTheme;
    preset?: CartesianChartPresetValue;
    scrollable?: boolean;
    visiblePoints?: number;
    initialIndex?: ChartViewportInitialIndex;
    orientation?: BarChartOrientation;
    mode?: BarChartMode;
    yDomain?: NumericDomainInput;
    barRadius?: number;
    barWidthRatio?: number;
    barGapRatio?: number;
    showValuesOnTopOfBars?: boolean;
    showHorizontalGridLines?: boolean;
    showXAxisLabels?: boolean;
    showYAxisLabels?: boolean;
    yTickCount?: number;
    legend?: boolean;
    interaction?: BarChartInteraction<TData>;
    selectedBar?: BarChartSelectedBar;
    defaultSelectedBar?: BarChartSelectedBar;
    selectionAnimation?: boolean | BarChartSelectionAnimationConfig;
    tooltip?: boolean | BarChartTooltipConfig;
    renderBar?: (props: BarChartRenderBarProps<TData>) => ReactNode;
    renderer?: BarChartRenderer;
    labelStrategy?: BarChartLabelStrategy;
    formatXLabel?: (value: ChartXValue, index: number) => string;
    formatYLabel?: (value: number) => string;
    id?: string;
    accessibilityLabel?: string;
    testID?: string;
};
export type BarChartXLabelModel = {
    index: number;
    text: string;
    x: number;
    y: number;
    textAnchor: "middle";
};
export type BarChartYLabelModel = {
    key: string;
    text: string;
    x: number;
    y: number;
};
export type BarChartValueLabelModel = {
    key: string;
    text: string;
    x: number;
    y: number;
    color: string;
    textAnchor?: "start" | "middle" | "end";
};
export type BarChartLegendItemModel = {
    key: string;
    label: string;
    color: string;
    markerX: number;
    markerY: number;
    labelX: number;
    labelY: number;
};
export type BarChartBarModel<TData = unknown> = {
    key: string;
    seriesKey: string;
    seriesLabel: string;
    seriesIndex: number;
    dataIndex: number;
    xValue: ChartXValue;
    xLabel: string;
    value: number;
    formattedValue: string;
    x: number;
    y: number;
    width: number;
    height: number;
    baselineY: number;
    baselineX?: number;
    color: string;
    raw: TData | undefined;
};
export type BuildBarChartModelOptions<TData extends Record<string, unknown>> = BarChartProps<TData> & {
    chartKitTheme: ChartKitThemeContextValue;
};
export type BarChartModel<TData = unknown> = {
    bars: Array<BarChartBarModel<TData>>;
    boxes: ChartBoxes;
    mode: BarChartMode;
    orientation: BarChartOrientation;
    resolvedTheme: ResolvedCartesianChartTheme;
    legendItems: BarChartLegendItemModel[];
    showHorizontalGridLines: boolean;
    showXAxisLabels: boolean;
    showYAxisLabels: boolean;
    valueLabels: BarChartValueLabelModel[];
    xLabels: BarChartXLabelModel[];
    yLabels: BarChartYLabelModel[];
    yTicks: number[];
};
//# sourceMappingURL=types.d.ts.map