import type { Datum } from "../charts/shared/datumTypes";
import * as React from "react";
import type { StreamScales, MarginalGraphicsConfig, XYFrameAxisConfig } from "./types";
import type { AnnotationContext } from "../realtime/types";
import type { ReactNode } from "react";
import type { LegendGroup, GradientLegendConfig, LegendLayout } from "../types/legendTypes";
import { type AutoPlaceAnnotations } from "../recipes/annotationLayout";
export type AxisConfig = XYFrameAxisConfig;
interface SVGOverlayProps {
    width: number;
    height: number;
    totalWidth: number;
    totalHeight: number;
    margin: {
        top: number;
        right: number;
        bottom: number;
        left: number;
    };
    scales: StreamScales | null;
    showAxes?: boolean;
    axes?: AxisConfig[];
    xLabel?: string;
    yLabel?: string;
    /** Label for the right Y axis (dual-axis charts) */
    yLabelRight?: string;
    xFormat?: (d: number | Date | string, index?: number, allTicks?: number[]) => string | ReactNode;
    yFormat?: (d: number | Date | string) => string | ReactNode;
    /** Axis extent mode. "nice" (default) uses d3-scale's rounded
     *  tick generator — labels stay round but the first/last tick
     *  may sit inside the data domain. "exact" pins the first and
     *  last tick to the actual data min and max with equidistant
     *  intermediate ticks. Applies to both x and y axes. */
    axisExtent?: import("../charts/shared/axisExtent").AxisExtentMode;
    showGrid?: boolean;
    title?: string | ReactNode;
    legend?: ReactNode | {
        legendGroups: LegendGroup[];
    } | {
        gradient: GradientLegendConfig;
    };
    /** Callback when hovering a legend item */
    legendHoverBehavior?: (item: {
        label: string;
    } | null) => void;
    /** Callback when clicking a legend item */
    legendClickBehavior?: (item: {
        label: string;
    }) => void;
    /** Currently highlighted category label (for hover dimming) */
    legendHighlightedCategory?: string | null;
    /** Set of isolated category labels (for click isolation) */
    legendIsolatedCategories?: Set<string>;
    /** Legend position relative to chart area */
    legendPosition?: "right" | "left" | "top" | "bottom";
    legendLayout?: LegendLayout;
    foregroundGraphics?: ReactNode;
    marginalGraphics?: MarginalGraphicsConfig;
    xValues?: number[];
    yValues?: number[];
    annotations?: Datum[];
    autoPlaceAnnotations?: AutoPlaceAnnotations;
    svgAnnotationRules?: (annotation: Datum, index: number, context: AnnotationContext) => ReactNode;
    annotationFrame?: number;
    xAccessor?: string;
    yAccessor?: string;
    annotationData?: Datum[];
    pointNodes?: {
        pointId?: string;
        x: number;
        y: number;
        r: number;
    }[];
    /** Curve interpolation type for envelope annotations */
    curve?: string;
    /** When true, grid lines and axis baselines are skipped (rendered by SVGUnderlay instead) */
    underlayRendered?: boolean;
    /**
     * Hint from the frame about whether the canvas is painting an opaque
     * background that will hide `SVGUnderlay`. When `true`, this overlay
     * also renders grid + baselines (otherwise nothing shows in the CSR
     * steady state — the canvas covers the underlay copy). When `false`
     * — e.g. `background="transparent"` or a `backgroundGraphics` SVG
     * sibling — the underlay is visible and we skip the overlay copy to
     * avoid the doubled / slightly-darker stroke. Defaults to `true` so
     * existing callers behave the same as the post-jagged-base-fix
     * baseline.
     */
    canvasObscuresUnderlay?: boolean;
    /** Name of the linked crosshair store entry to read */
    linkedCrosshairName?: string;
    /** Source chart ID — crosshair line is suppressed on the source to avoid double rendering */
    linkedCrosshairSourceId?: string;
    children?: ReactNode;
}
interface SVGUnderlayProps {
    width: number;
    height: number;
    totalWidth: number;
    totalHeight: number;
    margin: {
        top: number;
        right: number;
        bottom: number;
        left: number;
    };
    scales: StreamScales | null;
    showAxes?: boolean;
    axes?: AxisConfig[];
    showGrid?: boolean;
    xFormat?: (d: number | Date | string, index?: number, allTicks?: number[]) => string | ReactNode;
    yFormat?: (d: number | Date | string) => string | ReactNode;
    axisExtent?: import("../charts/shared/axisExtent").AxisExtentMode;
}
export declare function SVGUnderlay(props: SVGUnderlayProps): React.JSX.Element | null;
export declare function SVGOverlay(props: SVGOverlayProps): React.JSX.Element | null;
export {};
