import { CSSObject } from 'styled-components';
import { FoundationTokenType } from '../../tokens/theme.token';
import { BreakpointType } from '../../breakpoints/breakPoints';
export type ChartState = 'default' | 'hover' | 'active' | 'total';
export type ChartHeight = 'default' | 'fullscreen' | 'small';
export type ChartTokensType = {
    border: CSSObject['border'];
    borderRadius: CSSObject['borderRadius'];
    axis: {
        lineColor: CSSObject['color'];
        gridLineColor: CSSObject['color'];
        labelColor: CSSObject['color'];
    };
    header: {
        padding: {
            x: CSSObject['padding'];
            y: CSSObject['padding'];
        };
        backgroundColor: CSSObject['backgroundColor'];
        borderBottom: CSSObject['borderBottom'];
        borderRadius: CSSObject['borderRadius'];
        slots: {
            gap: CSSObject['gap'];
        };
    };
    content: {
        legend: {
            gap: CSSObject['gap'];
            dropdown: {
                maxHeight: CSSObject['maxHeight'];
            };
            item: {
                gap: CSSObject['gap'];
                color: {
                    [key in ChartState]: CSSObject['color'];
                };
                fontSize: CSSObject['fontSize'];
                fontWeight: CSSObject['fontWeight'];
            };
        };
        padding: {
            top: CSSObject['padding'];
            right: CSSObject['padding'];
            bottom: CSSObject['padding'];
            left: CSSObject['padding'];
        };
        gap: CSSObject['gap'];
        backgroundColor: CSSObject['backgroundColor'];
    };
};
export type ResponsiveChartTokens = {
    [key in keyof BreakpointType]: ChartTokensType;
};
export declare const getChartTokens: (foundationToken: FoundationTokenType) => ResponsiveChartTokens;