/**
 * @file Chart.tsx
 * @output Root chart container — sets up SVG, scales, and context
 * @position Parent component; all chart marks/axes/interactions are children
 *
 * Handles the d3 margin convention: outer SVG at full size, inner <g> translated
 * by margins. Children receive scales and dimensions via context.
 *
 * Accessibility: the svg is exposed as a named image (role="img" + aria-label,
 * overridable via `label`), and small datasets are mirrored in a visually
 * hidden data table so screen reader users can read the underlying values.
 */
import { type ReactNode } from 'react';
import type { ChartMargin } from './types';
/**
 * Controls how the y-axis domain is computed:
 * - `'auto'` — includes 0 when all values are positive (default, bar-friendly)
 * - `'zero'` — symmetric range centered on 0 (good for +/- data)
 * - `'data'` — tight fit to data extent only (no forced zero)
 */
export type YBaseline = 'auto' | 'zero' | 'data';
export interface ChartProps {
    /** The dataset — array of objects with consistent keys */
    data: Record<string, unknown>[];
    /**
     * Key for the x-axis domain values.
     * String values produce a band scale; numeric values produce a linear scale.
     */
    xKey: string;
    /**
     * Key(s) for the y-axis domain values.
     * Used to compute the y-domain across all series.
     */
    yKeys: string[];
    /** Chart height in pixels. Width is responsive (fills container). */
    height?: number;
    /** Override default margins */
    margin?: Partial<ChartMargin>;
    /**
     * How the y-axis domain is computed.
     * - `'auto'` — includes 0 when all values are positive (default)
     * - `'zero'` — symmetric around 0 (use for profit/loss, sentiment, etc.)
     * - `'data'` — tight fit to data extent
     */
    yBaseline?: YBaseline;
    /**
     * Explicit y-axis domain [min, max].
     * When provided, this is the y-axis range. Data outside it is not clipped
     * visually but will extend beyond the chart area.
     */
    yDomain?: [number, number];
    /**
     * Explicit x-axis domain [min, max] for linear/time scales.
     * When provided, this is the x-axis range — the chart renders exactly
     * this window. Use for streaming charts where the range shifts over time.
     * Ignored for band (categorical) scales.
     */
    xDomain?: [number, number];
    /**
     * Set touch-action on the chart container. Use 'none' when interactive
     * components (brush, zoom, crosshair) are present to prevent scroll
     * interference on mobile.
     */
    interactive?: boolean;
    /**
     * Accessible name for the chart, announced by screen readers (the svg is
     * exposed as `role="img"`). Defaults to an English description derived from
     * the keys (e.g. "Chart of revenue by month") — pass a localized string to
     * override.
     */
    label?: string;
    /** Chart contents — axes, marks, tooltips */
    children: ReactNode;
}
/**
 * Root chart container. Computes scales from data and provides them to children.
 *
 * @example
 * ```
 * <Chart data={data} xKey="month" yKeys={['revenue']} height={300}>
 *   <ChartAxis position="bottom" />
 *   <ChartAxis position="left" />
 *   <ChartBar dataKey="revenue" color={useChartColors().categorical(1)[0]} />
 * </Chart>
 * ```
 */
export declare function Chart({ data, xKey, yKeys, height, margin: marginOverride, yBaseline, yDomain: yDomainProp, xDomain: xDomainProp, interactive, label, children, }: ChartProps): import("react").JSX.Element;
//# sourceMappingURL=Chart.d.ts.map