import { HTMLAttributes } from "react";
import { DatasetComponentOption, ECharts, EChartsOption, ScatterSeriesOption } from "echarts";

//#region src/core/HeatmapChart/hooks/utils.d.ts
interface CreateChartOptionsProps {
  /**
   * The crosshair following the pointer. One object applies to both axes; a
   * two-entry array configures them separately.
   * https://echarts.apache.org/en/option.html#axisPointer
   */
  axisPointer?: EChartsOption["axisPointer"];
  /**
   * The cells, as a flat array of objects whose fields are named by `encode`.
   * The data point object shape can be whatever you like, but it must be consistent with the `encode` option
   * For example, if the data point shape is:
   * {
   *   geneIndex: 0,
   *   cellTypeIndex: 0,
   *   percentage: 0.5
   * }
   * and you want geneIndex to be encoded to x axis and cellTypeIndex to be encoded to y axis, then make sure your encode option is:
   * encode: {
   *   x: 'geneIndex',
   *   y: 'cellTypeIndex'
   * }
   */
  data: DatasetComponentOption["source"];
  /**
   * ECharts' dataZoom configuration for that window, merged over the defaults
   * it sets. One object applies to both axes; a two-entry array configures them
   * separately. It reaches the chart only while `camera.active` is true.
   *
   * The `dataZoom` prop is utilized for implementing zoom functionality within a
   * specific area of the chart. This feature empowers users to inspect data in
   * granular detail, obtain an overview of the entire dataset, or eliminate
   * outlier points.
   * By applying the `dataZoom` prop while locking the zoom level, the chart
   * efficiently renders a confined portion of the heatmap. This selective
   * rendering strategy becomes especially advantageous when dealing with
   * extensive datasets. Instead of rendering the entire heatmap at once,
   * the chart dynamically loads and renders specific segments as the user
   * scrolls through the data. This approach optimizes performance and enables
   * the creation of heatmaps with large amounts of data.
   * https://echarts.apache.org/en/option.html#dataZoom
   */
  dataZoom?: EChartsOption["dataZoom"];
  /**
   * Renders only a window of the grid, measured in cells, and lets the pointer
   * pan it. Sizes are ignored unless `active` is true.
   *
   * The `camera` prop is utilized for implementing camera view port functionality
   * within a specific area of the chart. This feature empowers users to render
   * a confined portion of the heatmap. This selective rendering strategy becomes
   * especially advantageous when dealing with extensive datasets. Instead of
   * rendering the entire heatmap at once, the chart dynamically loads and renders
   * specific segments as the user scrolls through the data. This approach optimizes
   * performance and enables the creation of heatmaps with large amounts of data.
   *
   * The `height` and `width` properties are used to specify the dimensions of the
   * camera view port. The `active` property is used to enable or disable the camera
   * view port functionality.
   */
  camera?: {
    active: boolean;
    height: number;
    width: number;
  };
  /**
   * How a cell is drawn while the pointer is over it. Takes the same shape as
   * `itemStyle`: color, border, opacity.
   * https://echarts.apache.org/en/option.html#series-scatter.emphasis
   */
  emphasis?: ScatterSeriesOption["emphasis"];
  /**
   * The categories along the x axis. A cell's encoded x value is an index into
   * this array.
   * For example:
   * [{ value: "gene1", textStyle: { color: "red" } }, "gene2", "gene3"]
   */
  xAxisData: CategoryAxisData;
  /**
   * The categories along the y axis.
   * For example:
   * [{ value: "cellType1", textStyle: { color: "red" } }, "cellType2", "cellType3"]
   */
  yAxisData: CategoryAxisData;
  /**
   * Width of the chart in pixels. Must be greater than zero; the component
   * throws otherwise.
   */
  width: number;
  /**
   * Height of the chart in pixels, under the same rule.
   */
  height: number;
  /**
   * Which fields of a data item place it on each axis. Omitting it leaves
   * ECharts to guess from the field order.
   * For example, if the data is:
   * {
   *   geneIndex: 0,
   *   cellTypeIndex: 0,
   *   percentage: 0.5
   * }
   * and we want to encode `geneIndex` to x axis and `cellTypeIndex` to y axis, then
   * encode: {
   *  x: 'geneIndex',
   *  y: 'cellTypeIndex'
   * }
   * https://echarts.apache.org/en/option.html#series-scatter.encode
   */
  encode?: {
    x: string;
    y: string;
  };
  /**
   * How a cell is painted. Its color accepts a callback receiving the data
   * item, which is how a value becomes a color.
   * https://echarts.apache.org/en/option.html#series-scatter.itemStyle
   */
  itemStyle?: ScatterSeriesOption["itemStyle"];
  /**
   * The shape of a cell. Circles turn the grid into a dot plot, where diameter
   * can carry a second measurement.
   */
  symbol?: "circle" | "rect" | "roundRect";
  /**
   * Cell size in pixels: one number, a [width, height] pair, or a callback
   * given the data item. Set it to the cell pitch for a solid grid.
   *
   * `symbolSize` can be set to single numbers like 10, or use an array to represent width and height. For example, [20, 10] means symbol width is 20, and height is 10.
   *
   * If size of symbols needs to be different, you can set with callback function in the following format:
   *
   * (value: Array|number, params: Object) => number|Array
   *
   * The first parameter value is the value in data, and the second parameter params is the rest parameters of data item.
   * https://echarts.apache.org/en/option.html#series-scatter.symbolSize
   */
  symbolSize?: ScatterSeriesOption["symbolSize"];
  /**
   * Where the plotting area sits inside the container. The function form
   * receives the computed default, for insetting it without recomputing the
   * size.
   * https://echarts.apache.org/en/option.html#grid
   */
  grid?: EChartsOption["grid"] | ((defaultOption: EChartsOption["grid"]) => EChartsOption["grid"]);
  /**
   * Anything else ECharts understands, merged over the generated options.
   * https://echarts.apache.org/en/option.html
   */
  options?: EChartsOption;
  /**
   * ECharts event listeners by name. Each handler gets the raw event, whose
   * data property is the cell, and the chart instance.
   * https://echarts.apache.org/en/api.html#events
   */
  onEvents?: Record<string, (event: unknown, chart: ECharts) => void>;
}
type OrdinalRawValue = string | number;
/**
 * (thuang): This copies echarts' CategoryAxisBaseOption["data"] type, since it's not exported
 */
type CategoryAxisData = (OrdinalRawValue | {
  value: OrdinalRawValue;
  /**
   * (thuang): This should be echarts `TextCommonOption` type, but it's not exported
   */
  textStyle?: never;
})[];
//#endregion
//#region src/core/HeatmapChart/index.d.ts
interface HeatmapChartProps extends HTMLAttributes<HTMLDivElement>, CreateChartOptionsProps {
  /**
   * Which renderer ECharts initialises with. Canvas copes better with very
   * large grids. Changing it rebuilds the chart.
   * @default "svg"
   */
  echartsRendererMode?: "svg" | "canvas";
}
declare const _default: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<HeatmapChartProps & import("react").RefAttributes<HTMLDivElement>>>;
//#endregion
export { _default as n, HeatmapChartProps as t };