@mui/x-charts
Version:
The community edition of the charts components (MUI X).
84 lines (83 loc) • 2.97 kB
TypeScript
import * as React from 'react';
import { ResponsiveChartContainerProps } from '../ResponsiveChartContainer';
import { ChartsTooltipProps, ChartsTooltipSlotProps, ChartsTooltipSlots } from '../ChartsTooltip';
import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
import { AxisConfig } from '../models/axis';
import { MakeOptional } from '../models/helpers';
import { LineSeriesType } from '../models/seriesType/line';
import { AreaPlotSlots, AreaPlotSlotProps } from '../LineChart/AreaPlot';
import { LinePlotSlots, LinePlotSlotProps } from '../LineChart/LinePlot';
import { MarkPlotSlots, MarkPlotSlotProps } from '../LineChart/MarkPlot';
import { LineHighlightPlotSlots, LineHighlightPlotSlotProps } from '../LineChart/LineHighlightPlot';
import { BarPlotSlots, BarPlotSlotProps } from '../BarChart/BarPlot';
export interface SparkLineChartSlots extends AreaPlotSlots, LinePlotSlots, MarkPlotSlots, LineHighlightPlotSlots, BarPlotSlots, ChartsTooltipSlots {
}
export interface SparkLineChartSlotProps extends AreaPlotSlotProps, LinePlotSlotProps, MarkPlotSlotProps, LineHighlightPlotSlotProps, BarPlotSlotProps, ChartsTooltipSlotProps {
}
export interface SparkLineChartProps extends Omit<ResponsiveChartContainerProps, 'series' | 'xAxis' | 'yAxis'> {
/**
* The xAxis configuration.
* Notice it is a single configuration object, not an array of configuration.
*/
xAxis?: MakeOptional<AxisConfig, 'id'>;
tooltip?: ChartsTooltipProps;
axisHighlight?: ChartsAxisHighlightProps;
/**
* Type of plot used.
* @default 'line'
*/
plotType?: 'line' | 'bar';
/**
* Data to plot.
*/
data: number[];
/**
* Formatter used by the tooltip.
* @param {number} value The value to format.
* @returns {string} the formatted value.
*/
valueFormatter?: (value: number) => string;
/**
* Set to `true` to enable the tooltip in the sparkline.
* @default false
*/
showTooltip?: boolean;
/**
* Set to `true` to highlight the value.
* With line, it shows a point.
* With bar, it shows a highlight band.
* @default false
*/
showHighlight?: boolean;
/**
* Set to `true` to fill spark line area.
* Has no effect if plotType='bar'.
* @default false
*/
area?: LineSeriesType['area'];
/**
* @default 'linear'
*/
curve?: LineSeriesType['curve'];
/**
* Overridable component slots.
* @default {}
*/
slots?: SparkLineChartSlots;
/**
* The props used for each component slot.
* @default {}
*/
slotProps?: SparkLineChartSlotProps;
}
/**
* Demos:
*
* - [SparkLine](https://mui.com/x/react-charts/sparkline/)
*
* API:
*
* - [SparkLineChart API](https://mui.com/x/api/charts/spark-line-chart/)
*/
declare const SparkLineChart: React.ForwardRefExoticComponent<SparkLineChartProps & React.RefAttributes<unknown>>;
export { SparkLineChart };