import type { Datum } from "../shared/datumTypes";
import * as React from "react";
import type { StreamXYFrameProps, CurveType } from "../../stream/types";
import type { RealtimeFrameHandle } from "../../realtime/types";
import type { BaseChartProps, AxisConfig, ChartAccessor } from "../shared/types";
import { type TooltipProp } from "../../Tooltip/Tooltip";
import type { LegendInteractionMode, LegendPosition } from "../shared/hooks";
/**
 * Configuration for a single series in a MultiAxisLineChart.
 */
export interface MultiAxisSeriesConfig<TDatum = Datum> {
    /** Field name or function to access y values for this series */
    yAccessor: ChartAccessor<TDatum, number>;
    /** Axis label for this series */
    label?: string;
    /** Override color for this series (defaults to theme palette) */
    color?: string;
    /** Tick format function for this series' axis */
    format?: (d: number) => string;
    /** Fixed extent [min, max] for this series. Required for push API streaming.
     *  If omitted, computed from data. */
    extent?: [number, number];
}
/**
 * MultiAxisLineChart component props
 */
export interface MultiAxisLineChartProps<TDatum extends Datum = Datum> extends BaseChartProps, AxisConfig {
    /** Array of data points shared by both series */
    data?: TDatum[];
    /** Field name or function to access x values @default "x" */
    xAccessor?: ChartAccessor<TDatum, number>;
    /** Series configuration — exactly 2 for dual-axis mode.
     *  If not exactly 2, renders as a normal line chart with a console warning. */
    series: MultiAxisSeriesConfig<TDatum>[];
    /** Color scheme or custom colors array @default "category10" */
    colorScheme?: string | string[];
    /** Enable hover annotations @default true */
    enableHover?: boolean;
    /** Curve interpolation @default "monotoneX" */
    curve?: CurveType;
    /** Line width in pixels @default 2 */
    lineWidth?: number;
    /** Show legend @default true */
    showLegend?: boolean;
    /** Show grid lines @default false */
    showGrid?: boolean;
    /** Tooltip configuration */
    tooltip?: TooltipProp;
    /** Legend interaction mode */
    legendInteraction?: LegendInteractionMode;
    /** Legend position */
    legendPosition?: LegendPosition;
    /** Annotations */
    annotations?: Datum[];
    /** Additional StreamXYFrame props */
    frameProps?: Partial<Omit<StreamXYFrameProps, "chartType" | "data" | "size">>;
}
/**
 * MultiAxisLineChart — Dual Y-axis line chart for comparing two series
 * with different scales on the same time/x axis.
 *
 * Data is unitized (normalized to [0,1]) internally so both series share
 * a common visual scale. The left axis shows series[0] values and the
 * right axis shows series[1] values in their original units.
 *
 * If `series` does not contain exactly 2 entries, renders as a standard
 * multi-line chart with a dev-mode console warning.
 *
 * @example
 * ```tsx
 * // Revenue (left axis, $) vs. signups (right axis, count)
 * <MultiAxisLineChart
 *   data={metrics}
 *   xAccessor="month"
 *   series={[
 *     { yAccessor: "revenue", label: "Revenue", color: "#3b82f6", format: (v) => `$${v}` },
 *     { yAccessor: "signups", label: "Signups", color: "#22c55e" },
 *   ]}
 *   legendPosition="bottom"
 * />
 * ```
 *
 * @example
 * ```tsx
 * // Pinning each axis extent independently
 * <MultiAxisLineChart
 *   data={metrics}
 *   xAccessor="t"
 *   series={[
 *     { yAccessor: "tempC",   label: "°C", color: "#ef4444", extent: [-10, 40] },
 *     { yAccessor: "humidity", label: "%", color: "#06b6d4", extent: [0, 100] },
 *   ]}
 * />
 * ```
 */
export declare const MultiAxisLineChart: {
    <TDatum extends Datum = Datum>(props: MultiAxisLineChartProps<TDatum> & React.RefAttributes<RealtimeFrameHandle>): React.ReactElement | null;
    displayName?: string;
};
