import React from 'react';
import { ChartContainerProps } from '../components';
import { StatisticConfigType } from '../hooks/useChartStatistic';
import { ChartDataItem } from '../utils';
/**
 * @fileoverview 面积图组件文件
 *
 * 该文件提供了面积图组件的实现，基于 Chart.js 和 react-chartjs-2。
 * 支持数据可视化、交互、配置、统计等功能。
 *
 * @author md-editor
 * @version 1.0.0
 * @since 2024
 */
/**
 * 面积图数据项类型
 *
 * 继承自 ChartDataItem，用于面积图的数据表示。
 *
 * @typedef {ChartDataItem} AreaChartDataItem
 * @since 1.0.0
 */
export type AreaChartDataItem = ChartDataItem;
/**
 * 面积图配置项接口
 *
 * 定义了面积图的配置选项，包括数据集、主题、图例、网格等设置。
 *
 * @interface AreaChartConfigItem
 * @since 1.0.0
 *
 * @example
 * ```typescript
 * const config: AreaChartConfigItem = {
 *   datasets: [data1, data2],
 *   theme: 'light',
 *   showLegend: true,
 *   legendPosition: 'top',
 *   showGrid: true,
 *   xAxisLabel: '时间',
 *   yAxisLabel: '数值'
 * };
 * ```
 */
export interface AreaChartConfigItem {
    /** 数据集数组 */
    datasets: Array<(string | {
        x: number;
        y: number;
    })[]>;
    /** 图表主题 */
    theme?: 'light' | 'dark';
    /** 是否显示图例 */
    showLegend?: boolean;
    /** 图例位置 */
    legendPosition?: 'top' | 'left' | 'bottom' | 'right';
    /** 图例水平对齐方式 */
    legendAlign?: 'start' | 'center' | 'end';
    /** 是否显示网格线 */
    showGrid?: boolean;
    /** X轴标签 */
    xAxisLabel?: string;
    /** Y轴标签 */
    yAxisLabel?: string;
    /** X轴最小值 */
    xAxisMin?: number;
    /** X轴最大值 */
    xAxisMax?: number;
    /** Y轴最小值 */
    yAxisMin?: number;
    /** Y轴最大值 */
    yAxisMax?: number;
    /** X轴步长 */
    xAxisStep?: number;
    /** Y轴步长 */
    yAxisStep?: number;
}
/**
 * 面积图组件属性接口
 *
 * 定义了面积图组件的所有属性，继承自 ChartContainerProps。
 * 支持数据配置、样式设置、交互功能等。
 *
 * @interface AreaChartProps
 * @extends ChartContainerProps
 * @since 1.0.0
 *
 * @example
 * ```typescript
 * const props: AreaChartProps = {
 *   title: '销售趋势',
 *   data: [
 *     { x: '2024-01', y: 100, type: '产品A' },
 *     { x: '2024-02', y: 150, type: '产品A' }
 *   ],
 *   width: 800,
 *   height: 400,
 *   showLegend: true,
 *   showGrid: true
 * };
 * ```
 */
export interface AreaChartProps extends ChartContainerProps {
    /** 扁平化数据数组 */
    data: AreaChartDataItem[];
    /** 图表标题 */
    title?: string;
    /** 图表宽度，默认600px */
    width?: number | string;
    /** 图表高度，默认400px */
    height?: number | string;
    /** 自定义CSS类名 */
    className?: string;
    /** 数据时间 */
    dataTime?: string;
    /** 图表主题 */
    theme?: 'dark' | 'light';
    /** 自定义主色（可选），支持 string 或 string[]；数组按序对应各数据序列 */
    color?: string | string[];
    /** 是否显示图例，默认true */
    showLegend?: boolean;
    /** 图例位置 */
    legendPosition?: 'top' | 'left' | 'bottom' | 'right';
    /** 图例水平对齐方式 */
    legendAlign?: 'start' | 'center' | 'end';
    /** 是否显示网格线，默认true */
    showGrid?: boolean;
    /** X轴位置 */
    xPosition?: 'top' | 'bottom';
    /** Y轴位置 */
    yPosition?: 'left' | 'right';
    /** 是否隐藏X轴，默认false */
    hiddenX?: boolean;
    /** 是否隐藏Y轴，默认false */
    hiddenY?: boolean;
    /** 头部工具条额外按钮 */
    toolbarExtra?: React.ReactNode;
    /** 是否将过滤器渲染到工具栏 */
    renderFilterInToolbar?: boolean;
    /** ChartStatistic组件配置：object表示单个配置，array表示多个配置 */
    statistic?: StatisticConfigType;
    /** 是否显示加载状态（当图表未闭合时显示） */
    loading?: boolean;
}
/**
 * 面积图组件
 *
 * 基于 Chart.js 和 react-chartjs-2 实现的面积图组件。
 * 支持数据可视化、交互、配置、统计等功能。
 *
 * @component
 * @param {AreaChartProps} props - 组件属性
 * @returns {React.ReactElement} 面积图组件
 *
 * @example
 * ```tsx
 * <AreaChart
 *   title="销售趋势"
 *   data={[
 *     { x: '2024-01', y: 100, type: '产品A' },
 *     { x: '2024-02', y: 150, type: '产品A' }
 *   ]}
 *   width={800}
 *   height={400}
 *   showLegend={true}
 *   showGrid={true}
 * />
 * ```
 *
 * @since 1.0.0
 */
declare const AreaChart: React.FC<AreaChartProps>;
export default AreaChart;