import type { Datum } from "../shared/datumTypes";
import * as React from "react";
import type { StreamOrdinalFrameProps } from "../../stream/ordinalTypes";
import type { LegendInteractionMode } from "../shared/hooks";
import type { BaseChartProps, ChartAccessor, CategoryFormatFn } from "../shared/types";
import { type TooltipProp } from "../../Tooltip/Tooltip";
import type { RealtimeFrameHandle } from "../../realtime/types";
export interface GroupedBarChartProps<TDatum extends Datum = Datum> extends BaseChartProps {
    data?: TDatum[];
    categoryAccessor?: ChartAccessor<TDatum, string>;
    groupBy: ChartAccessor<TDatum, string>;
    valueAccessor?: ChartAccessor<TDatum, number>;
    orientation?: "vertical" | "horizontal";
    categoryLabel?: string;
    valueLabel?: string;
    valueFormat?: (d: number | string) => string;
    colorBy?: ChartAccessor<TDatum, string>;
    colorScheme?: string | string[];
    /** Category sort order. Default: `false` (data insertion order). `"asc"`/`"desc"` sorts by total grouped value. `"auto"` preserves insertion order while streaming and falls through to value-desc on static data. Custom comparators receive category keys. */
    sort?: boolean | "asc" | "desc" | "auto" | ((a: string, b: string) => number);
    barPadding?: number;
    /** Rounded corner radius on bar ends (away from baseline). */
    roundedTop?: number;
    baselinePadding?: boolean;
    enableHover?: boolean;
    showGrid?: boolean;
    showCategoryTicks?: boolean;
    showLegend?: boolean;
    legendInteraction?: LegendInteractionMode;
    legendPosition?: "right" | "left" | "top" | "bottom";
    tooltip?: TooltipProp;
    annotations?: Datum[];
    /** Custom formatter for category tick labels */
    categoryFormat?: CategoryFormatFn;
    /** Fixed value-axis domain `[min, max]`. Either bound may be `undefined` to leave that side data-derived. */
    valueExtent?: [number | undefined, number | undefined] | [number];
    frameProps?: Partial<Omit<StreamOrdinalFrameProps, "data" | "size">>;
}
/**
 * GroupedBarChart - Multiple bars per category, side by side.
 *
 * Each row contributes to one bar inside the group named by
 * `categoryAccessor`; `groupBy` splits each category into the
 * side-by-side series. Use {@link StackedBarChart} when group totals
 * matter more than individual values.
 *
 * @example
 * ```tsx
 * // Quarterly revenue by region
 * <GroupedBarChart
 *   data={[
 *     { quarter: "Q1", region: "EMEA",     revenue: 120 },
 *     { quarter: "Q1", region: "Americas", revenue: 95 },
 *     { quarter: "Q2", region: "EMEA",     revenue: 140 },
 *     { quarter: "Q2", region: "Americas", revenue: 110 },
 *   ]}
 *   categoryAccessor="quarter"
 *   valueAccessor="revenue"
 *   groupBy="region"
 *   showLegend
 * />
 * ```
 *
 * @example
 * ```tsx
 * // Custom palette + sorted categories
 * <GroupedBarChart
 *   data={data}
 *   categoryAccessor="quarter"
 *   valueAccessor="revenue"
 *   groupBy="region"
 *   colorScheme={["#3b82f6", "#22c55e", "#ef4444"]}
 *   sort="asc"
 * />
 * ```
 */
export declare const GroupedBarChart: {
    <TDatum extends Datum = Datum>(props: GroupedBarChartProps<TDatum> & React.RefAttributes<RealtimeFrameHandle>): React.ReactElement | null;
    displayName?: string;
};
