import type { Datum } from "../shared/datumTypes";
import * as React from "react";
import type { StreamXYFrameProps } from "../../stream/types";
import type { RealtimeFrameHandle } from "../../realtime/types";
import type { LegendInteractionMode } from "../shared/hooks";
import type { BaseChartProps, ChartAccessor } from "../shared/types";
import { type TooltipProp } from "../../Tooltip/Tooltip";
/**
 * Heatmap component props
 */
export interface HeatmapProps<TDatum extends Datum = Datum> extends BaseChartProps {
    /**
     * Array of data points with x, y, and value properties.
     * @example
     * ```ts
     * [{x: 1, y: 1, value: 10}, {x: 1, y: 2, value: 20}, {x: 2, y: 1, value: 15}]
     * ```
     */
    data?: TDatum[];
    /**
     * Field name or function to access x values
     * @default "x"
     */
    xAccessor?: ChartAccessor<TDatum, number>;
    /**
     * Field name or function to access y values
     * @default "y"
     */
    yAccessor?: ChartAccessor<TDatum, number>;
    /**
     * Field name or function to access cell values
     * @default "value"
     */
    valueAccessor?: ChartAccessor<TDatum, number>;
    /**
     * Label for the x-axis
     */
    xLabel?: string;
    /**
     * Label for the y-axis
     */
    yLabel?: string;
    /**
     * Format function for x-axis tick labels
     */
    xFormat?: (d: any, index?: number, allTicks?: number[]) => string;
    /**
     * Format function for y-axis tick labels
     */
    yFormat?: (d: number | Date | string) => string;
    /**
     * Color scheme for the heatmap — any d3-scale-chromatic sequential scheme
     * name, `"custom"` (paired with `customColorScale`), or any scheme name
     * emitted by a SemioticTheme's `colors.sequential`. When unset, falls back
     * to the active theme's sequential scheme, then to `"blues"`.
     *
     * @default `theme.colors.sequential` (or `"blues"` when no ThemeProvider)
     */
    colorScheme?: "blues" | "reds" | "greens" | "viridis" | "oranges" | "purples" | "greys" | "plasma" | "inferno" | "magma" | "cividis" | "turbo" | "custom" | (string & {});
    /**
     * Custom color scale (used when colorScheme is "custom")
     * @example
     * ```ts
     * customColorScale={scaleSequential(interpolatePlasma).domain([0, 100])}
     * ```
     */
    customColorScale?: any;
    /**
     * Show values in cells
     * @default false
     */
    showValues?: boolean;
    /**
     * Format function for cell value labels
     */
    valueFormat?: (d: number) => string;
    /**
     * Cell border color
     * @default "#fff"
     */
    cellBorderColor?: string;
    /**
     * Cell border width
     * @default 1
     */
    cellBorderWidth?: number;
    /**
     * Enable hover annotations
     * @default true
     */
    enableHover?: boolean;
    /**
     * Tooltip configuration
     */
    tooltip?: TooltipProp;
    /**
     * Show a gradient legend for the color scale.
     * @default false
     */
    showLegend?: boolean;
    /**
     * Position of the gradient legend.
     * @default "right"
     */
    legendPosition?: "right" | "left" | "top" | "bottom";
    /**
     * Legend interaction mode.
     * - "highlight": hover dims non-hovered categories to 30% opacity
     * - "isolate": click toggles category visibility with checkmark indicators
     * - "none": static legend (default)
     */
    legendInteraction?: LegendInteractionMode;
    /**
     * Annotation objects to render on the chart
     */
    annotations?: Datum[];
    /** Fixed x domain `[min, max]` (either bound may be undefined to leave that side data-derived). */
    xExtent?: [number | undefined, number | undefined] | [number];
    /** Fixed y domain `[min, max]` (either bound may be undefined to leave that side data-derived). */
    yExtent?: [number | undefined, number | undefined] | [number];
    /**
     * Additional StreamXYFrame props for advanced customization
     * For full control, consider using StreamXYFrame directly
     * @see https://semiotic.nteract.io/guides/xy-frame
     */
    frameProps?: Partial<Omit<StreamXYFrameProps, "chartType" | "data" | "size">>;
}
/**
 * Heatmap - Visualize matrix data with color-encoded cells
 *
 * A simplified wrapper around StreamXYFrame for creating heatmaps. Perfect for
 * showing patterns, correlations, and distributions in 2D data.
 *
 * @example
 * ```tsx
 * // Simple heatmap
 * <Heatmap
 *   data={[
 *     {x: 1, y: 1, value: 10},
 *     {x: 1, y: 2, value: 20},
 *     {x: 2, y: 1, value: 15},
 *     {x: 2, y: 2, value: 25}
 *   ]}
 *   xLabel="Time"
 *   yLabel="Category"
 * />
 * ```
 *
 * @example
 * ```tsx
 * // With custom color scheme and value labels
 * <Heatmap
 *   data={data}
 *   colorScheme="viridis"
 *   showValues={true}
 *   valueFormat={d => d.toFixed(1)}
 * />
 * ```
 *
 * @example
 * ```tsx
 * // Advanced: Custom color scale
 * <Heatmap
 *   data={data}
 *   colorScheme="custom"
 *   customColorScale={
 *     scaleSequential(interpolatePlasma).domain([0, 100])
 *   }
 * />
 * ```
 *
 * @remarks
 * This component wraps {@link StreamXYFrame} with sensible defaults for heatmaps.
 * For more advanced features like hexbins, contours, or custom summaries,
 * use StreamXYFrame directly.
 *
 * **Breadcrumb to advanced usage:**
 * - Use the `frameProps` prop to pass any StreamXYFrame prop
 * - See StreamXYFrame documentation: https://semiotic.nteract.io/guides/xy-frame
 * - All StreamXYFrame props are available via `frameProps`
 *
 * @param props - Heatmap configuration
 * @returns Rendered heatmap
 */
export declare const Heatmap: {
    <TDatum extends Datum = Datum>(props: HeatmapProps<TDatum> & React.RefAttributes<RealtimeFrameHandle>): React.ReactElement | null;
    displayName?: string;
};
