/**
 * @fileoverview Chart primitive — themed chart container and tooltip/legend components for data visualization.
 * Built on Recharts. Provides a ChartConfig-driven theming system with
 * light/dark mode support, custom tooltips, and accessible legends.
 * Part of the Saasflare base component layer.
 * @module packages/ui/components/ui/chart
 * @layer core
 *
 * @requires recharts — peer dependency. Shipped via the `/chart` subpath:
 *   `import { ChartContainer } from "@saasflare/ui/chart"`.
 *
 * @component
 * @example
 * import { ChartContainer, ChartTooltip, ChartTooltipContent } from '@saasflare/ui/chart';
 * const config = { revenue: { label: "Revenue", color: "var(--chart-1)" } };
 * <ChartContainer config={config}>
 *   <BarChart data={data}>
 *     <Bar dataKey="revenue" />
 *     <ChartTooltip content={<ChartTooltipContent />} />
 *   </BarChart>
 * </ChartContainer>
 */
import * as React from "react";
import * as RechartsPrimitive from "recharts";
import { type SaasflareComponentProps } from "../../providers";
declare const THEMES: {
    readonly light: "";
    readonly dark: ".dark";
};
/**
 * Per-series chart configuration keyed by data key. Each entry supplies an
 * optional `label` and `icon` plus either a static `color` or a per-theme
 * (`light`/`dark`) color map. Consumed by {@link ChartContainer}, which exposes
 * each color as a `--color-{key}` CSS variable, and read by the tooltip and
 * legend content components.
 */
export type ChartConfig = {
    [k in string]: {
        label?: React.ReactNode;
        icon?: React.ComponentType;
    } & ({
        color?: string;
        theme?: never;
    } | {
        color?: never;
        theme: Record<keyof typeof THEMES, string>;
    });
};
/**
 * Props for {@link ChartContainer}. `config` drives series colors, labels, and
 * icons; `children` must satisfy Recharts' `ResponsiveContainer` child
 * contract (a single chart element).
 */
interface ChartContainerProps extends Omit<React.ComponentProps<"div">, keyof SaasflareComponentProps>, SaasflareComponentProps {
    config: ChartConfig;
    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
}
/**
 * Themed wrapper for Recharts charts. Provides the {@link ChartConfig} to
 * descendant tooltip/legend components via context, injects per-series
 * `--color-{key}` CSS variables (light/dark aware), and renders children in a
 * responsive 16:9 container with Saasflare token styling applied to Recharts
 * internals. Required ancestor for {@link ChartTooltipContent} and
 * {@link ChartLegendContent}.
 *
 * @component
 * @layer core
 */
declare function ChartContainer({ id, className, children, config, surface, radius, animated, iconWeight, ...props }: ChartContainerProps): import("react/jsx-runtime").JSX.Element;
/**
 * ChartStyle — injects per-chart CSS custom properties (`--color-{key}`)
 * derived from the {@link ChartConfig}, scoped by `[data-chart={id}]` and
 * theme prefix so light/dark color overrides resolve correctly.
 *
 * @component
 */
declare const ChartStyle: ({ id, config }: {
    id: string;
    config: ChartConfig;
}) => import("react/jsx-runtime").JSX.Element | null;
/**
 * Re-export of the Recharts `Tooltip` component. Place inside a chart and pass
 * {@link ChartTooltipContent} via `content` to get the themed, config-driven
 * tooltip body.
 *
 * @component
 */
declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
interface ChartTooltipPayloadItem {
    name?: string;
    value?: number | string;
    dataKey?: string | number;
    type?: string;
    color?: string;
    fill?: string;
    payload?: Record<string, unknown>;
}
interface ChartTooltipContentProps extends Omit<React.ComponentProps<"div">, keyof SaasflareComponentProps>, SaasflareComponentProps {
    active?: boolean;
    payload?: ChartTooltipPayloadItem[];
    label?: string | number;
    labelFormatter?: (label: unknown, payload: ChartTooltipPayloadItem[]) => React.ReactNode;
    labelClassName?: string;
    formatter?: (value: unknown, name: string, entry: ChartTooltipPayloadItem, index: number, payload: unknown) => React.ReactNode;
    color?: string;
    hideLabel?: boolean;
    hideIndicator?: boolean;
    indicator?: "line" | "dot" | "dashed";
    nameKey?: string;
    labelKey?: string;
}
/**
 * ChartTooltipContent — themed tooltip body for Recharts charts. Renders the
 * label, per-series indicator chips (or config-supplied icons), and formatted
 * values driven by the surrounding {@link ChartConfig}.
 *
 * @component
 */
declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, surface, radius, animated, iconWeight, }: ChartTooltipContentProps): import("react/jsx-runtime").JSX.Element | null;
/**
 * Re-export of the Recharts `Legend` component. Place inside a chart and pass
 * {@link ChartLegendContent} via `content` to get the themed, config-driven
 * legend body.
 *
 * @component
 */
declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
interface ChartLegendPayloadItem {
    value?: string;
    type?: string;
    color?: string;
    dataKey?: string | number;
}
interface ChartLegendContentProps extends Omit<React.ComponentProps<"div">, keyof SaasflareComponentProps>, SaasflareComponentProps {
    payload?: ChartLegendPayloadItem[];
    verticalAlign?: "top" | "bottom" | "middle";
    hideIcon?: boolean;
    nameKey?: string;
}
/**
 * ChartLegendContent — themed legend body for Recharts charts. Renders each
 * series with its config-supplied icon (or a color swatch) and label, driven
 * by the surrounding {@link ChartConfig}.
 *
 * @component
 */
declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, surface, radius, animated, iconWeight, }: ChartLegendContentProps): import("react/jsx-runtime").JSX.Element | null;
export { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle, type ChartContainerProps, };