import React, { Key } from 'react';
import { StandardProps } from '../../util/component-types';
import { Collection } from '../../util/chart-helpers';
interface IBarChartProps extends StandardProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
    /** Child components of LineChart */
    EmptyStateWrapper?: React.ReactNode;
    /**
     * Height of the chart.
     */
    height: number;
    /** Width of the chart. */
    width: number;
    /** An object defining the margins of the chart. These margins typically
     * contain the axis and labels. */
    margin: {
        top: number;
        right: number;
        bottom: number;
        left: number;
    };
    /** Data for the chart. E.g.
     * [
     * 	{ x: 'Monday'    , y: 1 } ,
     * 	{ x: 'Tuesday'   , y: 2 } ,
     * 	{ x: 'Wednesday' , y: 3 } ,
     * 	{ x: 'Thursday'  , y: 2 } ,
     * 	{ x: 'Friday'    , y: 5 } ,
     * ]
     */
    data: Collection;
    /** An object with human readable names for fields that will be used for legends and tooltips. E.g:
     * {
     * 	x: 'Date',
     * 	y: 'Impressions',
     * }
     */
    legend?: {};
    /** Controls the visibility of the \`LoadingMessage\`. */
    isLoading?: boolean;
    /** Show tool tips on hover. */
    hasToolTips: boolean;
    /** Show a legend at the bottom of the chart. */
    hasLegend: boolean;
    /** Takes one of the palettes exported from \`lucid.chartConstants\`. Available palettes:
     * - \`PALETTE_7\` (default)
     * - \`PALETTE_30\`
     * - \`PALETTE_MONOCHROME_0_5\`
     * - \`PALETTE_MONOCHROME_1_5\`
     * - \`PALETTE_MONOCHROME_2_5\`
     * - \`PALETTE_MONOCHROME_3_5\`
     * - \`PALETTE_MONOCHROME_4_5\`
     * - \`PALETTE_MONOCHROME_5_5\`
     * - \`PALETTE_MONOCHROME_6_5\`
     */
    palette: string[];
    /** You can pass in an object if you want to map x values to \`lucid.chartConstants\` or custom colors:
     * {
     * 	'imps': COLOR_0,
     * 	'rev': COLOR_3,
     * 	'clicks': '#abc123',
     * }
     */
    colorMap?: {};
    /** The field we should look up your x data by. Your actual x data must be
     * strings.
     */
    xAxisField: string;
    /** There are some cases where you need to only show a "sampling" of ticks on
     * the x axis. This number will control that.
     */
    xAxisTickCount: number | null;
    /** An optional function used to format your x axis data. If you don't
     * provide anything, we'll use an identity function.
     */
    xAxisFormatter: (d: number | Date) => string;
    /** Set a title for the x axis. */
    xAxisTitle: string | null;
    /** Set a color for the x axis title. Use the color constants exported off \`lucid.chartConstants\`. E.g.:
     * 	- \`COLOR_0\`
     * 	- \`COLOR_GOOD\`
     * 	- \`'#123abc'\`  * custom color hex
     *  \`number\` is supported only for backwards compatability.
     */
    xAxisTitleColor: string | number;
    /** An array of your y axis fields. Typically this will just be a single item
     * unless you need to display grouped or stacked bars. The order of the
     * array determines the series order in the chart.
     */
    yAxisFields: string[];
    /** The minimum number the y axis should display. Typically this should be be
     * \`0\`.
     */
    yAxisMin: number;
    /** The maximum number the y axis should display. This should almost always
     * be the largest number from your dataset.
     */
    yAxisMax?: number;
    /** An optional function used to format your y axis data. If you don't
     * provide anything, we use the default D3 number formatter.
     */
    yAxisFormatter?: (v: unknown) => string;
    /** Stack the y axis data instead of showing it as groups. This is only
     * useful if you have multiple \`yAxisFields\`. Stacking will cause the
     * chart to be aggregated by sum.
     */
    yAxisIsStacked: boolean;
    /** There are some cases where you need to only show a "sampling" of ticks on
     * the y axis. This number will control that.
     */
    yAxisTickCount: number | null;
    /** Set a title for the y axis.
     */
    yAxisTitle: string | null;
    /** Set a color for the y axis title. Use the color constants exported off \`lucid.chartConstants\`. E.g.:
     * - \`COLOR_0\`
     * - \`COLOR_GOOD\`
     * - \`'#123abc'\`  * custom color hex
     * \`number\` is supported only for backwards compatability.
     */
    yAxisTitleColor: number | string;
    /** An optional function used to format your y axis titles and data in the
     * tooltip legends. The first value is the name of your y field, the second value
     * is your post-formatted y value, and the third value is your non-formatted
     * y-value.  Signature: \`(yField, yValueFormatted, yValue) => {}\`
     */
    yAxisTooltipFormatter: (yField: string, yValueFormatted: Key, yValue: number) => Key;
    /** An optional function used to format y-values in the tooltip legends. */
    yAxisTooltipDataFormatter?: (d: number | Date) => string;
    /** An optional function used to format the entire tooltip body. The only arg is
     * the associated data point. This formatter will over-ride yAxisTooltipFormatter
     * and yAxisTooltipDataFormatter. Signature:
     * \`dataPoint => {}\`
     */
    renderTooltipBody: (dataPoint: string | number | object) => {};
    /** Determines the orientation of the tick text. This may override what the orient prop
     * tries to determine.
     */
    xAxisTextOrientation: 'vertical' | 'horizontal' | 'diagonal';
    /** Determines the orientation of the tick text. This may override what the orient prop
     * tries to determine.
     */
    yAxisTextOrientation: 'vertical' | 'horizontal' | 'diagonal';
}
export declare const BarChart: {
    (props: IBarChartProps): React.ReactElement;
    displayName: string;
    propTypes: {
        className: any;
        height: any;
        width: any;
        margin: any;
        data: any;
        legend: any;
        isLoading: any;
        hasToolTips: any;
        hasLegend: any;
        palette: any;
        colorMap: any;
        xAxisField: any;
        xAxisTickCount: any;
        xAxisFormatter: any;
        xAxisTitle: any;
        xAxisTitleColor: any;
        yAxisFields: any;
        yAxisMin: any;
        yAxisMax: any;
        yAxisFormatter: any;
        yAxisIsStacked: any;
        yAxisTickCount: any;
        yAxisTitle: any;
        yAxisTitleColor: any;
        yAxisTooltipFormatter: any;
        yAxisTooltipDataFormatter: any;
        renderTooltipBody: any;
        xAxisTextOrientation: any;
        yAxisTextOrientation: any;
    };
    defaultProps: {
        height: number;
        width: number;
        margin: {
            top: number;
            right: number;
            bottom: number;
            left: number;
        };
        palette: string[];
        hasToolTips: boolean;
        hasLegend: boolean;
        renderTooltipBody: null;
        xAxisField: string;
        xAxisTickCount: null;
        xAxisTitle: null;
        xAxisTitleColor: string;
        xAxisFormatter: {
            <T>(value: T): T;
            (): undefined;
        };
        xAxisTextOrientation: string;
        yAxisFields: string[];
        yAxisTickCount: null;
        yAxisIsStacked: boolean;
        yAxisMin: number;
        yAxisTitle: null;
        yAxisTitleColor: string;
        yAxisTooltipFormatter: (yField: unknown, yValueFormatted: unknown) => string;
        yAxisTextOrientation: string;
    };
    peek: {
        description: string;
        categories: string[];
        madeFrom: string[];
    };
    EmptyStateWrapper: {
        (props: import("../EmptyStateWrapper/EmptyStateWrapper").IEmptyStateWrapperProps): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)>;
        _isPrivate: boolean;
        peek: {
            /** An optional function used to format your x axis data. If you don't
             * provide anything, we'll use an identity function.
             */
            description: string;
            categories: string[];
            madeFrom: string[]; /** Set a title for the x axis. */
        };
        displayName: string;
        defaultProps: {
            isEmpty: boolean;
            isLoading: boolean;
            anchorMessage: boolean;
        };
        propTypes: {
            className: any;
            children: any;
            isEmpty: any;
            isLoading: any;
            anchorMessage: any;
            Body: any;
            Title: any;
        };
        Body: {
            (_props: import("../EmptyStateWrapper/EmptyStateWrapper").IEmptyStateWrapperBodyProps): null;
            displayName: string;
            peek: {
                description: string;
            };
            propName: string;
        };
        Title: {
            (_props: import("../EmptyStateWrapper/EmptyStateWrapper").IEmptyStateWrapperTitleProps): null;
            displayName: string;
            peek: {
                description: string;
            };
            propName: string;
        };
    };
    PADDING: number;
    PADDING_GROUPED_OR_STACKED: number;
    MARGIN: {
        top: number;
        right: number;
        bottom: number;
        left: number;
    };
};
export default BarChart;