@mui/x-charts/ChartsLegend/ChartsLegend.d.ts

The community edition of the charts components (MUI X).

import * as React from 'react';
import { Theme } from '@mui/material/styles';
import { DrawingArea } from '../context/DrawingProvider';
import { AnchorPosition, Direction } from './utils';
import { FormattedSeries } from '../context/SeriesContextProvider';
import { ChartsLegendClasses } from './chartsLegendClasses';
import { DefaultizedProps } from '../models/helpers';
import { LegendParams } from '../models/seriesType/config';
import { ChartsTextStyle } from '../ChartsText';
import { CardinalDirections } from '../models/layout';
export interface ChartsLegendSlots {
    legend?: React.JSXElementConstructor<LegendRendererProps>;
}
export interface ChartsLegendSlotProps {
    legend?: Partial<LegendRendererProps>;
}
export type ChartsLegendProps = {
    position?: AnchorPosition;
    /**
     * Override or extend the styles applied to the component.
     */
    classes?: Partial<ChartsLegendClasses>;
    /**
     * Set to true to hide the legend.
     * @default false
     */
    hidden?: boolean;
    /**
     * The direction of the legend layout.
     * The default depends on the chart.
     */
    direction?: Direction;
    /**
     * Overridable component slots.
     * @default {}
     */
    slots?: ChartsLegendSlots;
    /**
     * The props used for each component slot.
     * @default {}
     */
    slotProps?: ChartsLegendSlotProps;
};
type DefaultizedChartsLegendProps = DefaultizedProps<ChartsLegendProps, 'direction' | 'position'>;
export type ChartsLegendRootOwnerState = {
    position: AnchorPosition;
    direction: Direction;
    drawingArea: DrawingArea;
    offsetX?: number;
    offsetY?: number;
    seriesNumber: number;
};
export declare const ChartsLegendRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme>, Pick<React.SVGProps<SVGGElement>, keyof React.SVGProps<SVGGElement>>, {}>;
export interface LegendRendererProps extends Omit<DefaultizedChartsLegendProps, 'slots' | 'slotProps'> {
    series: FormattedSeries;
    seriesToDisplay: LegendParams[];
    drawingArea: DrawingArea;
    classes: Record<'mark' | 'series' | 'root', string>;
    /**
     * Style applied to legend labels.
     * @default theme.typography.subtitle1
     */
    labelStyle?: ChartsTextStyle;
    /**
     * Width of the item mark (in px).
     * @default 20
     */
    itemMarkWidth?: number;
    /**
     * Height of the item mark (in px).
     * @default 20
     */
    itemMarkHeight?: number;
    /**
     * Space between the mark and the label (in px).
     * @default 5
     */
    markGap?: number;
    /**
     * Space between two legend items (in px).
     * @default 10
     */
    itemGap?: number;
    /**
     * Legend padding (in px).
     * Can either be a single number, or an object with top, left, bottom, right properties.
     * @default 0
     */
    padding?: number | Partial<CardinalDirections<number>>;
}
declare function ChartsLegend(inProps: ChartsLegendProps): React.JSX.Element;
declare namespace ChartsLegend {
    var propTypes: any;
}
export { ChartsLegend };