import { ChartTokensType } from './chart.tokens';
import { ReactNode } from 'react';
import { TooltipProps } from 'recharts';
import { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent';
import { ButtonProps } from '../Button/types';
import { SkeletonVariant } from '../Skeleton/types';
export type DataPoint = {
    primary: {
        label: string;
        val: number;
    };
    aux?: {
        label: string;
        val: number;
        type?: AxisType;
        dateOnly?: boolean;
        smart?: boolean;
        timeZone?: string;
        hour12?: boolean;
    }[];
    error?: {
        title: string;
        errorData?: {
            label: string;
            value: string;
        }[];
    };
};
export declare enum ChartLegendPosition {
    TOP = "top",
    RIGHT = "right"
}
export declare enum ChartType {
    LINE = "line",
    BAR = "bar",
    LINE_BAR = "lineBar",
    PIE = "pie",
    SCATTER = "scatter",
    AREA = "area",
    SANKEY = "sankey",
    FUNNEL = "funnel"
}
export declare enum LegendsChangeType {
    INCREASE = "increase",
    DECREASE = "decrease"
}
export declare enum AxisIntervalType {
    PRESERVE_START = "preserveStart",
    PRESERVE_END = "preserveEnd",
    PRESERVE_START_END = "preserveStartEnd"
}
export declare enum AxisType {
    DATE_TIME = "dateTime",
    CURRENCY = "currency",
    PERCENTAGE = "percentage",
    NUMBER = "number"
}
export type TickProps = {
    x?: number;
    y?: number;
    payload?: {
        value: string | number;
        index?: number;
        coordinate?: number;
    };
    [key: string]: unknown;
};
export type NoDataProps = {
    title?: string;
    subtitle?: string;
    slot?: ReactNode;
    button?: ButtonProps;
};
export type AxisConfig = {
    label?: string;
    showLabel?: boolean;
    interval?: number | AxisIntervalType;
    show?: boolean;
    type?: AxisType;
    tickFormatter?: (value: string | number) => string;
    customTick?: React.ComponentType<TickProps>;
    dateOnly?: boolean;
    useUTC?: boolean;
    formatString?: string;
    timeOnly?: boolean;
    showYear?: boolean;
    ticks?: (number | string)[];
    autoConsistentTicks?: boolean;
    maxTicks?: number;
    smartDateTimeFormat?: boolean;
};
export type XAxisConfig = AxisConfig;
export type YAxisConfig = AxisConfig;
export type TooltipFormatterParams = {
    seriesName: NameType;
    value: ValueType;
    dataIndex: number;
    color: string;
    payload: unknown;
};
export type TooltipFormatter = (params: TooltipFormatterParams) => ReactNode;
export type FunnelConfig = {
    percentageBase?: 'previous' | 'first';
    showLabels?: boolean;
};
export type TooltipContentProps = TooltipProps<ValueType, NameType> & {
    originalData: NewNestedDataPoint[];
    chartType: ChartType;
    selectedKeys: string[];
    xAxis?: XAxisConfig;
    yAxis?: YAxisConfig;
};
export type TooltipConfig = {
    position?: {
        x?: number;
        y?: number;
    };
    allowEscapeViewBox?: {
        x?: boolean;
        y?: boolean;
    };
    content?: (props: TooltipContentProps) => ReactNode;
    formatter?: TooltipFormatter;
    labelFormatter?: (axisValue: string | number) => ReactNode;
};
export type DotItemDotProps = {
    cx?: number;
    cy?: number;
    value?: number;
    payload?: {
        name?: string;
    };
};
export type NewNestedDataPoint = {
    name: string;
    data: {
        [key: string]: DataPoint;
    };
};
export type StackedLegendsDataPoint = {
    value: number;
    delta: number;
    changeType: LegendsChangeType;
};
export type RenderChartProps = {
    chartName?: string;
    flattenedData: FlattenedDataPoint[];
    chartType: ChartType;
    hoveredKey: string | null;
    lineKeys: string[];
    colors: {
        key: string;
        color: string;
    }[];
    setHoveredKey: (key: string | null) => void;
    data: NewNestedDataPoint[];
    selectedKeys: string[];
    isSmallScreen?: boolean;
    barsize?: number;
    xAxis?: XAxisConfig;
    yAxis?: YAxisConfig;
    tooltip?: TooltipConfig;
    funnelConfig?: FunnelConfig;
    noData?: NoDataProps;
    height?: number | string;
    CustomizedDot?: (props: DotItemDotProps) => React.ReactElement<SVGElement>;
    lineSeriesKeys?: string[];
    onKeyClick?: (key: string) => void;
    /** Resolved CHARTS tokens. renderChart is a plain function, not a
     *  component, so it cannot read them itself; without these the axis falls
     *  back to theme-neutral foundation greys and draws white rules on dark. */
    chartTokens?: ChartTokensType;
};
export type CoreChartProps = {
    chartType?: ChartType;
    data?: NewNestedDataPoint[] | null;
    colors?: {
        key: string;
        color: string;
    }[];
    barsize?: number;
    xAxis?: XAxisConfig;
    yAxis?: YAxisConfig;
    tooltip?: TooltipConfig;
    funnelConfig?: FunnelConfig;
    height?: number | string;
    width?: number | string;
    isSmallScreen?: boolean;
    hoveredKey?: string | null;
    onHoveredKeyChange?: (key: string | null) => void;
    selectedKeys?: string[];
    lineSeriesKeys?: string[];
    enableHover?: boolean;
};
export type ChartsSkeletonProps = {
    show: boolean;
    variant: SkeletonVariant;
};
export type ChartsProps = {
    chartType?: ChartType;
    data?: NewNestedDataPoint[] | null;
    colors?: {
        key: string;
        color: string;
    }[];
    slot1?: ReactNode;
    slot2?: ReactNode;
    slot3?: ReactNode;
    legendPosition?: ChartLegendPosition;
    chartHeaderSlot: ReactNode;
    stackedLegends?: boolean;
    stackedLegendsData?: StackedLegendsDataPoint[];
    showAllLegends?: boolean;
    barsize?: number;
    xAxis?: XAxisConfig;
    yAxis?: YAxisConfig;
    tooltip?: TooltipConfig;
    funnelConfig?: FunnelConfig;
    noData?: NoDataProps;
    height?: number;
    showHeader?: boolean;
    showCollapseIcon?: boolean;
    isExpanded?: boolean;
    onExpandedChange?: (isExpanded: boolean) => void;
    chartName?: string;
    skeleton?: ChartsSkeletonProps;
    legends?: {
        title: string;
        total?: string;
    }[];
    CustomizedDot?: (props: DotItemDotProps) => React.ReactElement<SVGElement>;
    lineSeriesKeys?: string[];
};
export type FlattenedDataPoint = {
    name: string;
    [key: string]: number | string;
};
export type ChartHeaderProps = {
    id?: string;
    slot1: React.ReactNode;
    slot2: React.ReactNode;
    slot3: React.ReactNode;
    chartHeaderSlot: ReactNode;
    onFullscreen?: () => void;
    onExitFullscreen?: () => void;
    isFullscreen?: boolean;
    isSmallScreen?: boolean;
    isExpanded: boolean;
    setIsExpanded: (isExpanded: boolean) => void;
    showCollapseIcon?: boolean;
};
export type ChartLegendsProps = {
    chartContainerRef: React.RefObject<HTMLDivElement>;
    keys: string[];
    colors: {
        key: string;
        color: string;
    }[];
    handleLegendClick: (key: string) => void;
    handleLegendEnter: (key: string) => void;
    handleLegendLeave: () => void;
    selectedKeys: string[];
    setSelectedKeys: (keys: string[]) => void;
    hoveredKey: string | null;
    activeKeys: string[] | null;
    stacked?: boolean;
    isSmallScreen?: boolean;
    stackedLegendsData?: StackedLegendsDataPoint[];
    legends?: {
        title: string;
        total?: string;
    }[];
    showAllLegends?: boolean;
};
export type CustomTooltipProps = Omit<TooltipProps<ValueType, NameType>, 'formatter' | 'labelFormatter'> & {
    hoveredKey: string | null;
    originalData: NewNestedDataPoint[];
    setHoveredKey: (key: string) => void;
    chartType: ChartType;
    selectedKeys: string[];
    xAxis?: XAxisConfig;
    yAxis?: YAxisConfig;
    formatter?: TooltipFormatter;
    labelFormatter?: (axisValue: string | number) => ReactNode;
};
export type SankeyNode = {
    name: string;
    id?: string;
    color?: string;
};
export type SankeyLink = {
    source: number | string;
    target: number | string;
    value: number;
    color?: string;
    hoverColor?: string;
};
export type SankeyData = {
    nodes: SankeyNode[];
    links: SankeyLink[];
};
export type SankeyTooltipData = {
    payload: {
        name?: string;
        value?: number;
        source?: number | string;
        target?: number | string;
        sourceName?: string;
        targetName?: string;
        color?: string;
        hoverColor?: string;
    };
};
export type SankeyNodeProps = {
    x?: number;
    y?: number;
    width?: number;
    height?: number;
    index?: number;
    payload?: SankeyNode & {
        value?: number;
    };
    containerWidth?: number;
    nodeColors?: (string | {
        key: string;
        color: string;
    })[];
    onMouseEnter?: (data: SankeyTooltipData, event: React.MouseEvent) => void;
    onMouseLeave?: () => void;
};
export type SankeyLinkProps = {
    sourceX?: number;
    targetX?: number;
    sourceY?: number;
    targetY?: number;
    sourceControlX?: number;
    targetControlX?: number;
    linkWidth?: number;
    index?: number;
    payload?: SankeyLink;
    linkColors?: (string | {
        key: string;
        color: string;
    })[];
    onMouseEnter?: (data: SankeyTooltipData, event: React.MouseEvent) => void;
    onMouseLeave?: () => void;
};