import { CurveFactory } from 'd3-shape';
import type { Font } from '@fluentui/chart-utilities';
import type { JSXElement } from '@fluentui/react-utilities';
import type { Margin } from '@fluentui/chart-utilities';
import { PositioningShorthand } from '@fluentui/react-positioning';
import * as React_2 from 'react';
import { Ref } from 'react';
import { SankeyGraph } from 'd3-sankey';
import { SankeyLayout } from 'd3-sankey';
import { SankeyLink } from 'd3-sankey';
import { SankeyNode } from 'd3-sankey';
import { ScaleBand } from 'd3-scale';
import { ScaleLinear } from 'd3-scale';
import { SVGProps } from 'react';
import { TimeLocaleDefinition } from 'd3-time-format';

/**
 * {@docCategory ChartProps}
 */
export declare interface AccessibilityProps {
    /**
     * Accessibility aria-label
     */
    ariaLabel?: string;
    /**
     * Accessibility aria-labelledBy
     */
    ariaLabelledBy?: string;
    /**
     * Accessibility aria-describedBy
     */
    ariaDescribedBy?: string;
}

/**
 * This is used to introduce dynamic padding for cases where the number of nodes in a column is huge
 * so that we maintain a node to space ratio for such columns as if we fail to do so the
 * chart is devoid of nodes and only shows links.
 */
export declare function adjustPadding(sankey: SankeyLayoutGenerator, height: number, nodesInColumn: NodesInColumns): void;

export declare const AnnotationOnlyChart: React_2.FC<AnnotationOnlyChartProps>;

/**
 * Props for the annotation-only chart renderer.
 */
export declare interface AnnotationOnlyChartProps {
    /**
     * Collection of annotations to render.
     */
    annotations: ChartAnnotation[];
    /** Optional layout title extracted from the Plotly schema. */
    chartTitle?: string;
    /** Optional descriptive text for accessibility. */
    description?: string;
    /** Desired width in pixels (if absent the chart will grow to fit the container). */
    width?: number;
    /** Desired height in pixels. */
    height?: number;
    /** Paper/background colour specified in the Plotly layout. */
    paperBackgroundColor?: string;
    /** Plot area background colour specified in the Plotly layout. */
    plotBackgroundColor?: string;
    /** Global layout font colour. */
    fontColor?: string;
    /** Global layout font family. */
    fontFamily?: string;
    /** Layout margin converted to padding for the outer wrapper. */
    margin?: Partial<Margin>;
    /** Component ref propagated by the DeclarativeChart surface. */
    componentRef?: React_2.Ref<Chart>;
}

export declare interface AnnotationPlotRect {
    x: number;
    y: number;
    width: number;
    height: number;
}

export declare interface AnnotationPoint {
    x: number;
    y: number;
}

export declare const ARC_PADDING = 2;

export declare const AreaChart: React_2.FunctionComponent<AreaChartProps>;

export declare interface AreaChartAreaPoint {
    xVal: string | number;
    values: AreaChartDataSetPoint;
}

export declare interface AreaChartDataSetPoint {
    [key: string]: number | string | number[];
}

/**
 * Area Chart properties.
 * {@docCategory AreaChart}
 */
export declare interface AreaChartProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data: ChartProps;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: CartesianChartStyles;
    /**
     * Define a custom callout renderer for a data point
     */
    onRenderCalloutPerDataPoint?: RenderFunction<CustomizedCalloutData>;
    /**
     * Define a custom callout renderer for a stack; default is to render per data point
     */
    onRenderCalloutPerStack?: RenderFunction<CustomizedCalloutData>;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * @default false
     * The prop used to enable the perf optimization
     */
    enablePerfOptimization?: boolean;
    optimizeLargeData?: boolean;
    /**
     * @default false
     * The prop used to enable gradient fill color for the chart.
     */
    enableGradient?: boolean;
    /**
     * @default tonexty
     * The prop used to define the Y axis mode (tonexty or tozeroy)
     */
    mode?: 'tozeroy' | 'tonexty';
}

/**
 * Area Chart style properties
 * {@docCategory AreaChart}
 */
export declare interface AreaChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Area Chart styles
 * {@docCategory AreaChart}
 */
export declare interface AreaChartStyles extends CartesianChartStyles {
}

/**
 * Represents a areapolar series.
 */
export declare interface AreaPolarSeries extends DataSeries {
    /**
     * Type discriminator: always 'areapolar' for this series.
     */
    type: 'areapolar';
    /**
     * Array of data points for the series.
     */
    data: PolarDataPoint[];
    /**
     * Additional line rendering options (e.g., stroke width, curve type).
     */
    lineOptions?: LineChartLineOptions;
}

/**
 * Specifies the ordering options for axis categories in Cartesian charts.
 *
 * - `'default'`: Uses the original order before custom ordering was supported.
 *   In some charts, this behaves the same as `'data'`.
 * - `'data'`: Preserves the order of categories as provided in the input data.
 * - `string[]`: Explicitly defines the custom order of categories as an array of category names.
 * - `'category ascending' | 'category descending'`: Orders categories alphanumerically.
 * - `'total ascending' | 'total descending'`: Orders categories by the total of their associated values.
 * - `'min ascending' | 'min descending'`: Orders by the minimum value within each category.
 * - `'max ascending' | 'max descending'`: Orders by the maximum value within each category.
 * - `'sum ascending' | 'sum descending'`: Orders by the sum of values for each category (same as 'total').
 * - `'mean ascending' | 'mean descending'`: Orders by the average of values in each category.
 * - `'median ascending' | 'median descending'`: Orders by the median value of each category.
 *
 * {@docCategory CartesianChart}
 */
export declare type AxisCategoryOrder = 'default' | 'data' | string[] | 'category ascending' | 'category descending' | 'total ascending' | 'total descending' | 'min ascending' | 'min descending' | 'max ascending' | 'max descending' | 'sum ascending' | 'sum descending' | 'mean ascending' | 'mean descending' | 'median ascending' | 'median descending';

/**
 * Configuration options for an axis.
 *
 * {@docCategory CartesianChart}
 */
export declare type AxisProps = {
    /**
     * Defines the step between tick marks on the axis.
     * Works in combination with `tick0`.
     * Must be a positive number.
     *
     * - **Log scale**:
     *   - Ticks are placed at `10^(n * tickStep)` where `n` is the tick index.
     *     - Example: `tickStep = 2` → ticks at 1, 100, 10,000...
     *     - Example: `tickStep = log10(5)` → ticks at 1, 5, 25, 125...
     *   - Special format `"L<f>"`: Creates ticks that are linearly spaced in value (not position).
     *     - Example: `tick0 = 0.1`, `tickStep = "L0.5"` → ticks at 0.1, 0.6, 1.1, 1.6...
     *
     * - **Date axis**:
     *   - Must be in milliseconds.
     *     - Example: one day = `tickStep = 86400000`.
     *   - Special format `"M<n>"`: Places ticks every `n` months.
     *     - Example: `tick0 = "2000-01-15"`, `tickStep = "M3"` → ticks on the 15th every third month.
     *     - Example: `tickStep = "M48"` → ticks every 4 years.
     */
    tickStep?: number | string;
    /**
     * Sets the reference value for axis ticks.
     * Works in combination with `tickStep`.
     *
     * - **Log scale**:
     *   - `tick0` must be given as the logarithm of the reference tick.
     *     - Example: to align ticks with 100, use `tick0 = 2`.
     *   - Exception: when `tickStep` uses `"L<f>"`, you can specify the raw value directly.
     */
    tick0?: number | Date;
    /**
     * Sets the text displayed at each tick position specified by `tickValues`. Used with `tickValues`.
     */
    tickText?: string[];
};

/**
 * Available scale types for axes.
 *
 * - `'default'`: Uses an automatic scale (linear, band, or time) based on axis data type.
 * - `'log'`: Uses a logarithmic scale. Only supported for numeric axes in LineChart and ScatterChart.
 *
 * {@docCategory CartesianChart}
 */
export declare type AxisScaleType = 'default' | 'log';

/**
 * Represents a bar series.
 */
export declare interface BarSeries<X extends string | number | Date, Y extends string | number | Date> extends DataSeries {
    /**
     * Type discriminator: always 'bar' for this series.
     */
    type: 'bar';
    /**
     * Array of data points for the series.
     */
    data: DataPointV2<X, Y>[];
    /**
     * Optional group identifier for the series.
     */
    key?: string;
}

/**
 * {@docCategory ChartData}
 */
declare interface BaseDataPoint {
    /**
     * Defines the function that is executed on clicking  line
     */
    onDataPointClick?: () => void;
    /**
     * Callout data for x axis
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     */
    yAxisCalloutData?: string | {
        [id: string]: number;
    };
    /**
     * Whether to hide callout data for the point.
     */
    hideCallout?: boolean;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
    /**
     * X axis Accessibility data for callout
     */
    xAxisCalloutAccessibilityData?: AccessibilityProps;
    /**
     * Marker size of the points
     */
    markerSize?: number;
}

export declare interface Basestate {
    _width?: number;
    _height?: number;
    activeLegend?: string;
    color?: string;
    dataForHoverCard?: number | string;
    isCalloutVisible: boolean;
    isLegendSelected?: boolean;
    isLegendHovered?: boolean;
    refSelected?: any;
    YValueHover?: {
        legend?: string;
        y?: number | string;
        color?: string;
    }[];
    hoverYValue?: string | number | null;
    hoverXValue?: string | number | null;
    xCalloutValue?: string;
    yCalloutValue?: string;
    lineColor?: string;
    hoveredLineColor?: string;
    selectedLegend?: string;
    containerWidth?: number;
    containerHeight?: number;
}

export declare const BREAKPOINTS: {
    minRadius: number;
    arcWidth: number;
    fontSize: number;
}[];

export declare const calcNeedleRotation: (chartValue: number, minValue: number, maxValue: number) => number;

/**
 * Cartesian Chart component
 * {@docCategory CartesianChart}
 */
export declare const CartesianChart: React_2.FunctionComponent<ModifiedCartesianChartProps>;

/**
 * Cartesian Chart properties
 * {@docCategory CartesianChart}
 */
export declare interface CartesianChartProps {
    /**
     * Title styles configuration for the chart title
     */
    titleStyles?: TitleStyles;
    /**
     * Below height used for resizing of the chart
     * Wrap chart in your container and send the updated height and width to these props.
     * These values decide wheather chart re render or not. Please check examples for reference
     */
    height?: number;
    /**
     * Below width used for resizing of the chart
     * Wrap chart in your container and send the updated height and width to these props.
     * These values decide wheather chart re render or not. Please check examples for reference
     */
    width?: number;
    /**
     * this prop takes its parent as a HTML element to define the width and height of the chart
     */
    parentRef?: HTMLElement | null;
    /**
     * Additional CSS class(es) to apply to the Chart.
     */
    className?: string;
    /**
     * Margins for the chart
     * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`
     * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values
     */
    margins?: Margins;
    /** decides wether to show/hide legends
     * @defaultvalue false
     */
    hideLegend?: boolean;
    /**
     * Do not show tooltips in chart
     * @default false
     */
    hideTooltip?: boolean;
    /**
     * this prop takes values that you want the chart to render on x-axis
     * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you
     * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart
     */
    tickValues?: number[] | Date[] | string[] | undefined;
    /**
     * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'
     * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis
     * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.
     */
    tickFormat?: string;
    /**
     * Width of line stroke
     */
    strokeWidth?: number;
    /**
     * x Axis labels tick padding. This defines the gap between tick labels and tick lines.
     * @default 10
     */
    xAxisTickPadding?: number;
    /**
     * the format in for the data on y-axis. For data object this can be specified to your requirement.
     *  Eg: d3.format(".0%")(0.123),d3.format("+20")(42);
     * Please look at https://github.com/d3/d3-format for all the formats supported
     */
    yAxisTickFormat?: any;
    /**
     * Secondary y-scale options
     * By default this is not defined, meaning there will be no secondary y-scale.
     */
    secondaryYScaleOptions?: {
        /** Minimum value (0 by default) */
        yMinValue?: number;
        /** Maximum value (100 by default) */
        yMaxValue?: number;
    };
    /**
     * minimum  data value point in y-axis
     */
    yMinValue?: number;
    /**
     * maximum data value point in y-axis
     */
    yMaxValue?: number;
    /**
     * minimum data value point in x-axis (for numeric x-axis)
     */
    xMinValue?: number;
    /**
     * maximum data value point in x-axis
     */
    xMaxValue?: number;
    /**
     * Number of ticks on the y-axis.
     * Tick count should be factor of difference between (yMinValue, yMaxValue)?
     * @default 4
     */
    yAxisTickCount?: number;
    /**
     * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.
     * Does not work for string axis.
     * @default 6
     */
    xAxisTickCount?: number;
    /**
     * define the size of the tick lines on the x-axis
     * @default 10
     */
    xAxistickSize?: number;
    /**
     * Text annotations rendered on top of the chart area
     */
    annotations?: ChartAnnotation[];
    /**
     * defines the space between the tick line and the data label
     * @default 10
     */
    tickPadding?: number;
    /**
     * Url that the data-viz needs to redirect to upon clicking on it
     */
    href?: string;
    legendsOverflowText?: any;
    /**
     * Enable the legends to wrap lines if there is not enough space to show all legends on a single line
     */
    enabledLegendsWrapLines?: boolean;
    legendProps?: Partial<LegendsProps>;
    /**
     *@default false
     *Used for to elipse x axis labes and show tooltip on x axis labels
     */
    showXAxisLablesTooltip?: boolean;
    /**
     * @default 4
     * Used for X axis labels
     * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.
     */
    noOfCharsToTruncate?: number;
    /**
     * @default false
     * Used to wrap x axis labels values (whole value)
     */
    wrapXAxisLables?: boolean;
    /**
     * @default false
     * Used to rotate x axis labels by 45 degrees
     */
    rotateXAxisLables?: boolean;
    /**
     * The prop used to define the date time localization options
     */
    dateLocalizeOptions?: Intl.DateTimeFormatOptions;
    /**
     * The prop used to define a custom locale for the date time format.
     */
    timeFormatLocale?: TimeLocaleDefinition;
    /**
     * The prop used to define a custom datetime formatter for date axis.
     */
    customDateTimeFormatter?: (dateTime: Date) => string;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: CartesianChartStyles;
    /**
     * Callout customization props
     */
    calloutProps?: Partial<ChartPopoverProps>;
    /**
     * props for the svg; use this to include aria-* or other attributes on the tag
     */
    svgProps?: React_2.SVGProps<SVGSVGElement>;
    /**
     * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows
     * @deprecated Use `reflowProps` instead.
     */
    enableReflow?: boolean;
    /**
     * Props related to reflow behavior of the chart
     */
    reflowProps?: {
        /**
         * Determines the reflow behavior of the chart.
         * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.
         * @default 'none'
         */
        mode: 'none' | 'min-width';
    };
    /**
     * Prop to set the x axis title
     * @default undefined
     * Minimum bottom margin required for x axis title is 55px
     */
    xAxisTitle?: string;
    /**
     * Prop to set the y axis title
     * @default undefined
     * Minimum left margin required for y axis title is 60px and for RTL is 40px
     * Minimum right margin required for y axis title is 40px and for RTL is 60px
     */
    yAxisTitle?: string;
    /**
     * Prop to set the secondary y axis title
     * @default undefined
     * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px
     */
    secondaryYAxistitle?: string;
    /**
     * Whether to use UTC time for axis scale, ticks, and the time display in callouts.
     * When set to `true`, time is displayed equally, regardless of the user's timezone settings.
     * @default true
     */
    useUTC?: string | boolean;
    /**
     * @default false
     * The prop used to decide rounded ticks on y axis
     */
    roundedTicks?: boolean;
    /**
     * Determines whether overlapping x-axis tick labels should be hidden.
     * @default true
     */
    hideTickOverlap?: boolean;
    /**
     * Define a custom callout props override
     */
    calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;
    /**
     * Optional callback to access the Chart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: React_2.Ref<Chart>;
    /**
     * Prop to set the x axis annotation. Used to display additional information on the x-axis.
     * This is shown on the top of the chart.
     * @default undefined
     */
    xAxisAnnotation?: string;
    /**
     * Prop to set the y axis annotation. Used to display additional information on the y-axis.
     * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.
     * @default undefined
     */
    yAxisAnnotation?: string;
    /**
     * Specifies the ordering logic for categories (or string tick labels) on the x-axis.
     * @default 'default'
     */
    xAxisCategoryOrder?: AxisCategoryOrder;
    /**
     * Specifies the ordering logic for categories (or string tick labels) on the y-axis.
     * @default 'default'
     */
    yAxisCategoryOrder?: AxisCategoryOrder;
    /**
     * Defines the scale type for the x-axis.
     * @default 'default'
     */
    xScaleType?: AxisScaleType;
    /**
     * Defines the scale type for the primary y-axis.
     * @default 'default'
     */
    yScaleType?: AxisScaleType;
    /**
     * Defines the scale type for the secondary y-axis.
     * @default 'default'
     */
    secondaryYScaleType?: AxisScaleType;
    /**
     * Explicit set of tick values for the y-axis.
     * If provided, these values override automatic tick generation.
     */
    yAxisTickValues?: number[] | Date[] | string[];
    /**
     * Configuration for the x-axis.
     * Use this to control `tickStep`, `tick0`, etc.
     */
    xAxis?: AxisProps & {
        /**
         * Controls how x-axis tick labels are laid out.
         *
         * - `'auto'`: Tick labels are automatically wrapped, truncated, and staggered
         *   across alternating levels based on the available space to prevent overlap.
         *
         * @default 'default'
         */
        tickLayout?: 'default' | 'auto';
    };
    /**
     * Configuration for the y-axis.
     * Use this to control `tickStep`, `tick0`, etc.
     */
    yAxis?: AxisProps;
    /**
     *@default false
     *Used for showing complete y axis lables   */
    showYAxisLables?: boolean;
    /**
     *@default false
     *Used for to elipse y axis labes and show tooltip on x axis labels
     */
    showYAxisLablesTooltip?: boolean;
}

/**
 * Cartesian Chart style properties
 * {@docCategory CartesianChart}
 */
export declare interface CartesianChartStyleProps {
    /**
     * Additional CSS class(es) to apply to the Chart.
     */
    className?: string;
    /**
     * Width of the chart.
     */
    width?: number;
    /**
     * Height of the chart.
     */
    height?: number;
    /**
     * Color of the chart.
     */
    color?: string;
    /**
     * Link to redirect if click action for graph
     */
    href?: string;
    /**
     * prop to check if the chart is selected or hovered upon to determine opacity
     */
    shouldHighlight?: boolean;
    /**
     * prop to check if the Page is in Rtl
     */
    useRtl?: boolean;
    /**
     * color of the line
     */
    lineColor?: string;
    /**
     * boolean flag which determines if shape is drawn in callout
     */
    toDrawShape?: boolean;
    /**
     * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows
     * @deprecated Use `reflowProps` instead.
     */
    enableReflow?: boolean;
}

/**
 * Cartesian Chart styles
 * {@docCategory CartesianChart}
 */
export declare interface CartesianChartStyles {
    /**
     *  Style for the root element.
     */
    root?: string;
    /**
     * Style for the element containing the x-axis.
     */
    xAxis?: string;
    /**
     * Style for the element containing the y-axis.
     */
    yAxis?: string;
    /**
     * Style for legend container
     */
    legendContainer?: string;
    /**
     * line hover box css
     */
    hover?: string;
    /**
     * styles for description message
     */
    descriptionMessage?: string;
    /**
     * styles for tooltip
     */
    tooltip?: string;
    /**
     * styles for axis title
     */
    axisTitle?: string;
    /**
     * styles for axis annotation
     */
    axisAnnotation?: string;
    /**
     * Style for the chart Title.
     */
    chartTitle?: string;
    /**
     * Style to change the opacity of bars in dataviz when we hover on a single bar or legends
     */
    opacityChangeOnHover?: string;
    /**
     * styles for the shape object in the callout
     */
    shapeStyles?: string;
    /**
     * Styles for the chart wrapper div
     */
    chartWrapper?: string;
    /**
     * Styles for the element wrapping the svg and overlays for annotation
     */
    plotContainer?: string;
    /**
     * Styles for the svg tooltip
     */
    svgTooltip?: string;
    /**
     * Styles applied to the annotation layer root element
     */
    annotationLayer?: string;
    /**
     * Styles for the chart svg element
     */
    chart?: string;
}

/**
 * {@docCategory Chart}
 */
export declare interface Chart {
    chartContainer: HTMLElement | null;
    toImage?: (opts?: ImageExportOptions) => Promise<string>;
}

export declare interface ChartAnnotation {
    /** Optional id for React reconciliation */
    id?: string;
    /** Primary textual content */
    text: string;
    /** Coordinates describing where the annotation should be anchored */
    coordinates: ChartAnnotationCoordinate;
    /** Layout customisation */
    layout?: ChartAnnotationLayoutProps;
    /** Visual styling */
    style?: ChartAnnotationStyleProps;
    /** Optional connector line that links the annotation to its anchor. */
    connector?: ChartAnnotationConnectorProps;
    /** Accessibility metadata */
    accessibility?: ChartAnnotationAccessibilityProps;
    /** Optional application specific metadata */
    data?: Record<string, unknown>;
}

export declare interface ChartAnnotationAccessibilityProps {
    /** Accessible label announced by assistive technologies */
    ariaLabel?: string;
    /** Accessible description id */
    ariaDescribedBy?: string;
    /** Custom role */
    role?: string;
}

export declare type ChartAnnotationArrowHead = 'none' | 'start' | 'end' | 'both';

export declare interface ChartAnnotationConnectorProps {
    /** Distance in pixels between the annotation element and the start of the connector. */
    startPadding?: number;
    /** Distance in pixels between the anchor point and the end of the connector. */
    endPadding?: number;
    /** Stroke colour for the connector. */
    strokeColor?: string;
    /** Stroke width in pixels. */
    strokeWidth?: number;
    /** SVG stroke dash array for dashed connectors. */
    dashArray?: string;
    /** Arrow head placement. Defaults to `'end'`. */
    arrow?: ChartAnnotationArrowHead;
}

export declare interface ChartAnnotationContext {
    /** Rectangle describing the drawable area of the chart (without margins) */
    plotRect: AnnotationPlotRect;
    /** Size of the owning SVG element */
    svgRect: {
        width: number;
        height: number;
    };
    /** Indicates if layout should be mirrored */
    isRtl?: boolean;
    /** Primary x scale mapping data domain to pixels */
    xScale?: (value: any) => number;
    /** Primary y scale mapping data domain to pixels */
    yScalePrimary?: (value: any) => number;
    /** Secondary y scale when present */
    yScaleSecondary?: (value: any) => number;
}

export declare type ChartAnnotationCoordinate = {
    /** Cartesian data coordinates mapped through the chart scales */
    type: 'data';
    /** x-axis value in the data domain */
    x: number | string | Date;
    /** y-axis value in the data domain */
    y: number | string | Date;
    /** Use the secondary y scale when available */
    yAxis?: 'primary' | 'secondary';
} | {
    /** Normalised coordinates within the plot area (0-1) */
    type: 'relative';
    /** Fractional x-position inside the plot area */
    x: number;
    /** Fractional y-position inside the plot area */
    y: number;
} | {
    /** Absolute pixel position relative to the chart's plot origin */
    type: 'pixel';
    /** Horizontal pixel offset from the plot origin */
    x: number;
    /** Vertical pixel offset from the plot origin */
    y: number;
} | {
    /** Mixed coordinate systems per axis (e.g., data X + relative Y) */
    type: 'mixed';
    xCoordinateType: 'data' | 'relative' | 'pixel';
    yCoordinateType: 'data' | 'relative' | 'pixel';
    x: number | string | Date;
    y: number | string | Date;
    /** Use the secondary y scale when the Y coordinate maps to data */
    yAxis?: 'primary' | 'secondary';
};

export declare type ChartAnnotationHorizontalAlign = 'start' | 'center' | 'end';

export declare const ChartAnnotationLayer: React_2.FC<ChartAnnotationLayerProps>;

export declare interface ChartAnnotationLayerProps {
    annotations?: ChartAnnotation[];
    context: ChartAnnotationContext;
    className?: string;
    /**
     * When true, removes default border, shadow, and background styling from annotations.
     * @default false
     */
    hideDefaultStyles?: boolean;
}

export declare interface ChartAnnotationLayoutProps {
    /** Horizontal alignment of the annotation relative to the anchor point */
    align?: ChartAnnotationHorizontalAlign;
    /** Vertical alignment of the annotation relative to the anchor point */
    verticalAlign?: ChartAnnotationVerticalAlign;
    /** Horizontal offset in pixels applied after alignment */
    offsetX?: number;
    /** Vertical offset in pixels applied after alignment */
    offsetY?: number;
    /** Optional maximum width for wrapped text */
    maxWidth?: number;
    /** Whether the annotation should remain inside the plot area */
    clipToBounds?: boolean;
    /** Additional CSS classes applied to the annotation wrapper */
    className?: string;
}

export declare interface ChartAnnotationStyleProps {
    /** Text colour */
    textColor?: string;
    /** Background colour for the annotation container */
    backgroundColor?: string;
    /** Border colour */
    borderColor?: string;
    /** Border width */
    borderWidth?: number;
    /** Border style (solid, dashed, etc.) */
    borderStyle?: React_2.CSSProperties['borderStyle'];
    /** Border radius */
    borderRadius?: number;
    /** Box shadow applied to annotation */
    boxShadow?: string;
    /** Font size override */
    fontSize?: string;
    /** Font weight override */
    fontWeight?: React_2.CSSProperties['fontWeight'];
    /** Padding around the text. Accepts CSS shorthand notation */
    padding?: string;
    /** Opacity for the annotation container */
    opacity?: number;
    /** Optional class name applied to the annotation element */
    className?: string;
    /** Rotation, in degrees, applied to the annotation container */
    rotation?: number;
}

export declare type ChartAnnotationVerticalAlign = 'top' | 'middle' | 'bottom';

/**
 * Chart data mode for chart data text
 * default: show the datapoint.x value
 * fraction: show the fraction of datapoint.x/datapoint.y
 * percentage: show the percentage of (datapoint.x/datapoint.y)%
 * hidden: do not show any data text
 * {@docCategory HorizontalBarChart}
 */
export declare type ChartDataMode = 'default' | 'fraction' | 'percentage' | 'hidden';

/**
 * {@docCategory ChartData}
 */
export declare interface ChartDataPoint {
    /**
     * Legend text for the datapoint in the chart
     */
    legend?: string;
    /**
     * data the datapoint in the chart
     */
    data?: number;
    /**
     * data the datapoint in the chart
     */
    horizontalBarChartdata?: HorizontalDataPoint;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Color for the legend in the chart. If not provided, it will fallback on the default color palette.
     */
    color?: string;
    /**
     * placeholder data point
     */
    placeHolder?: boolean;
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given legend will take
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     * This is an optional prop, If haven't given data will take
     */
    yAxisCalloutData?: string;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
}

export declare const ChartPopover: React_2.FunctionComponent<ChartPopoverProps>;

export declare interface ChartPopoverProps {
    clickPosition?: {
        x: number;
        y: number;
    };
    isPopoverOpen?: boolean;
    xCalloutValue?: string;
    legend?: string | number | Date;
    yCalloutValue?: string;
    YValue?: string | number | Date;
    XValue?: string;
    color?: string;
    culture?: string;
    customCallout?: {
        customizedCallout?: JSXElement;
        customCalloutProps?: ChartPopoverProps;
    };
    isCalloutForStack?: boolean;
    xAxisCalloutAccessibilityData?: {
        ariaLabel?: string;
        data?: string;
    };
    hoverXValue?: string | number;
    YValueHover?: YValueHover[];
    descriptionMessage?: string;
    ratio?: [number, number];
    isCartesian?: boolean;
    styles?: Partial<PopoverComponentStyles>;
    positioning?: PositioningShorthand;
}

/**
 * {@docCategory ChartProps}
 */
export declare interface ChartProps {
    /**
     * chart title for the chart
     */
    chartTitle?: string;
    /**
     * Accessibility data for chart title
     */
    chartTitleAccessibilityData?: AccessibilityProps;
    /**
     * data for the points in the chart
     */
    chartData?: ChartDataPoint[];
    /**
     * Accessibility data for chart data
     */
    chartDataAccessibilityData?: AccessibilityProps;
    /**
     * data for the points in the line chart
     */
    lineChartData?: LineChartPoints[];
    /**
     * data for the points in the scatter chart
     */
    scatterChartData?: ScatterChartPoints[];
    /**
     * data for the points in the line chart
     */
    SankeyChartData?: SankeyChartData;
    /**
     * data for the points in the line chart
     */
    pointOptions?: SVGProps<SVGCircleElement>;
    /**
     * data for the dotted line on hovering the point
     */
    pointLineOptions?: SVGProps<SVGLineElement>;
}

export declare const ChartTable: React_2.FunctionComponent<ChartTableProps>;

/**
 * Chart Table properties
 * {@docCategory ChartTable}
 */
export declare interface ChartTableProps {
    /**
     * Title styles configuration for the chart title
     */
    titleStyles?: TitleStyles;
    /**
     * 1d or 2d Array of header values.
     */
    headers: {
        value: string | number | boolean | null;
        style?: React_2.CSSProperties;
    }[];
    /**
     * Array of rows. Each row corresponds to one data entry under each column.
     */
    rows: {
        value: string | number | boolean | null;
        style?: React_2.CSSProperties;
    }[][];
    /**
     * Optional width for the table
     * @default '100%'
     */
    width?: string | number;
    /**
     * Optional height for the table
     * @default '650px'
     */
    height?: string | number;
    /**
     * Chart title to display above the table
     */
    chartTitle?: string;
    /**
     * Additional class name(s) to apply to the table chart
     */
    className?: string;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: ChartTableStyles;
    /**
     * Optional callback to access the Chart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: React_2.Ref<Chart>;
}

/**
 * Table Chart styles
 * {@docCategory ChartTable}
 */
export declare interface ChartTableStyles {
    root?: string | React_2.CSSProperties;
    table?: string;
    headerCell?: string;
    bodyCell?: string;
    chart?: string;
    chartTitle?: string;
    svgTooltip?: string;
}

declare enum ChartTypes {
    AreaChart = 0,
    LineChart = 1,
    VerticalBarChart = 2,
    VerticalStackedBarChart = 3,
    GroupedVerticalBarChart = 4,
    HeatMapChart = 5,
    HorizontalBarChartWithAxis = 6,
    ScatterChart = 7,
    GanttChart = 8
}

export declare interface ChildProps {
    xScale?: any;
    yScalePrimary?: any;
    yScaleSecondary?: any;
    containerHeight?: number;
    containerWidth?: number;
    optimizeLargeData?: boolean;
}

/**
 * {@docCategory LineChart}
 */
export declare interface ColorFillBarData {
    startX: number | Date;
    endX: number | Date;
}

/**
 * {@docCategory LineChart}
 */
export declare interface ColorFillBarsProps {
    legend: string;
    color: string;
    data: ColorFillBarData[];
    applyPattern?: boolean;
    onLegendClick?: (selectedLegend: string | string[] | null) => void | undefined;
}

declare type ColorwayType = 'default' | 'builtin' | 'others' | undefined;

export declare type ConnectorRenderData = {
    key: string;
    start: AnnotationPoint;
    end: AnnotationPoint;
    strokeColor: string;
    strokeWidth: number;
    dashArray?: string;
    arrow: ChartAnnotationArrowHead;
    markerSize: number;
    markerStrokeWidth: number;
};

/**
 * Used for custom callout data interface. As Area chart callout data will be prepared from given props.data,
 * Those required data passing to onRenderCalloutPerDataPoint and onRenderCalloutPerStack.
 * {@docCategory ChartData}
 */
export declare interface CustomizedCalloutData {
    x: number | string | Date;
    values: CustomizedCalloutDataPoint[];
}

/**
 * {@docCategory ChartData}
 */
export declare interface CustomizedCalloutDataPoint {
    legend: string;
    y: number;
    color: string;
    xAxisCalloutData?: string;
    yAxisCalloutData?: string | {
        [id: string]: number;
    };
}

declare enum CustomPoints {
    dottedLine = 0
}

/**
 * {@docCategory ChartData}
 */
export declare interface DataPoint {
    /**
     * Independent value of the data point, rendered along the x-axis.
     * If x is a number, then each y-coordinate is plotted at its x-coordinate.
     * If x is a string, then the data is evenly spaced along the x-axis.
     */
    x: number | string;
    /**
     * Dependent value of the data point, rendered along the y-axis.
     */
    y: number;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
}

/**
 * Represents a single data point in a series.
 */
export declare interface DataPointV2<X extends string | number | Date, Y extends string | number | Date> {
    /**
     * X-axis value of the data point.
     */
    x: X;
    /**
     * Y-axis value of the data point.
     */
    y: Y;
    /**
     * Optional click handler for the data point.
     */
    onClick?: () => void;
    /**
     * Custom text to show in the callout in place of the x-axis value.
     */
    xAxisCalloutData?: string;
    /**
     * Custom text to show in the callout in place of the y-axis value.
     */
    yAxisCalloutData?: string;
    /**
     * Accessibility properties for the data point.
     */
    callOutAccessibilityData?: AccessibilityProps;
    /**
     * Custom marker size for the data point.
     */
    markerSize?: number;
    /**
     * Optional text to annotate or label the data point.
     */
    text?: string;
    /**
     * Color of the data point. If not provided, it will inherit the series color.
     */
    color?: string;
}

/**
 * Base interface for a series.
 */
export declare interface DataSeries {
    /**
     * Name of the series to be displayed in the legend.
     */
    legend: string;
    /**
     * Shape used in the legend (e.g., circle, square).
     */
    legendShape?: LegendShape;
    /**
     * Color of the series.
     */
    color?: string;
    /**
     * Opacity of the series.
     */
    opacity?: number;
    /**
     * Gradient fill for the series (start and end colors).
     */
    gradient?: [string, string];
    /**
     * Whether this series should be plotted against a secondary Y-axis.
     */
    useSecondaryYScale?: boolean;
    /**
     * Callback invoked when the legend item is clicked.
     */
    onLegendClick?: (selectedLegend: string | null | string[]) => void;
}

export declare const DataVizPalette: {
    color1: string;
    color2: string;
    color3: string;
    color4: string;
    color5: string;
    color6: string;
    color7: string;
    color8: string;
    color9: string;
    color10: string;
    color11: string;
    color12: string;
    color13: string;
    color14: string;
    color15: string;
    color16: string;
    color17: string;
    color18: string;
    color19: string;
    color20: string;
    color21: string;
    color22: string;
    color23: string;
    color24: string;
    color25: string;
    color26: string;
    color27: string;
    color28: string;
    color29: string;
    color30: string;
    color31: string;
    color32: string;
    color33: string;
    color34: string;
    color35: string;
    color36: string;
    color37: string;
    color38: string;
    color39: string;
    color40: string;
    info: string;
    disabled: string;
    highError: string;
    error: string;
    warning: string;
    success: string;
    highSuccess: string;
};

/**
 * DeclarativeChart component.
 * {@docCategory DeclarativeChart}
 */
export declare const DeclarativeChart: React_2.FunctionComponent<DeclarativeChartProps>;

/**
 * DeclarativeChart props.
 * {@docCategory DeclarativeChart}
 */
export declare interface DeclarativeChartProps extends React_2.RefAttributes<HTMLDivElement> {
    /**
     * The schema representing the chart data, layout and configuration
     */
    chartSchema: Schema;
    /**
     * Callback when an event occurs
     */
    onSchemaChange?: (eventData: Schema) => void;
    /**
     * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: React_2.Ref<IDeclarativeChart>;
    /**
     * Optional prop to specify the colorway type of the chart.
     * - 'default': Use Fluent UI color palette aligning with plotly colorway.
     * - 'builtin': Use Fluent UI colorway.
     * - 'others': Reserved for future colorways.
     * @default 'default'
     */
    colorwayType?: ColorwayType;
}

/**
 * Donutchart component.
 * {@docCategory DonutChart}
 */
export declare const DonutChart: React_2.FunctionComponent<DonutChartProps>;

/**
 * Donut Chart properties.
 * {@docCategory DonutChart}
 */
export declare interface DonutChartProps extends CartesianChartProps {
    /**
     * Title styles configuration for the chart title
     */
    titleStyles?: TitleStyles;
    /**
     * Data to render in the chart.
     */
    data?: ChartProps;
    /**
     * inner radius for donut size
     */
    innerRadius?: number;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: DonutChartStyles;
    /**
     * props for inside donut value
     */
    valueInsideDonut?: string | number;
    /**
     * Define a custom callout renderer for a data point
     */
    onRenderCalloutPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => JSXElement | undefined;
    /**
     * Define a custom callout props override
     */
    calloutPropsPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => ChartPopoverProps;
    /**
     * props for the callout in the chart
     */
    calloutProps?: ChartPopoverProps;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * Prop to show the arc labels in percentage format
     * @default false
     */
    showLabelsInPercent?: boolean;
    /**
     * Prop to hide the arc labels
     * @default true
     */
    hideLabels?: boolean;
    /**
     * Below height used for resizing of the chart
     * Wrap chart in your container and send the updated height and width to these props.
     * These values decide wheather chart re render or not. Please check examples for reference
     */
    height?: number;
    /**
     * Below width used for resizing of the chart
     * Wrap chart in your container and send the updated height and width to these props.
     * These values decide wheather chart re render or not. Please check examples for reference
     */
    width?: number;
    /**
     * this prop takes its parent as a HTML element to define the width and height of the chart
     */
    parentRef?: HTMLElement | null;
    /**
     * Additional CSS class(es) to apply to the Chart.
     */
    className?: string;
    legendsOverflowText?: any;
    legendProps?: Partial<LegendsProps>;
    /** decides wether to show/hide legends
     * @defaultvalue false
     */
    hideLegend?: boolean;
    /**
     * Url that the data-viz needs to redirect to upon clicking on it
     */
    href?: string;
    /**
     * Do not show tooltips in chart
     * @default false
     */
    hideTooltip?: boolean;
    /**
     * Optional callback to access the Chart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: React_2.Ref<Chart>;
    /**
     * Prop to enable the round corners in the chart
     * @default false
     */
    roundCorners?: boolean;
    /**
     * Rendering order of the legend
     * @default 'default'
     * 'default' - as per data provided
     * 'sorted' - in descending order of value
     */
    order?: 'default' | 'sorted';
}

/**
 * Donut Chart style properties
 * {@docCategory DonutChart}
 */
export declare interface DonutChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Donut Chart styles
 * {@docCategory DonutChart}
 */
export declare interface DonutChartStyles {
    /**
     *  Style for the root element.
     */
    root?: string;
    /**
     * Style for the chart.
     */
    chart?: string;
    /**
     * Style for the legend container.
     */
    legendContainer: string;
    /**
     * Style for the chart title.
     */
    chartTitle?: string;
    /**
     * styles for axis annotation
     */
    axisAnnotation?: string;
    /**
     * Styles for the chart wrapper div
     */
    chartWrapper?: string;
    /**
     * Style for SVG tooltip text
     */
    svgTooltip?: string;
}

export declare interface DPointType {
    values: {
        0: number;
        1: number;
        data: {};
    };
    xVal: number | Date;
}

declare interface EventAnnotation {
    date: Date;
    event: string;
    onRenderCard?: () => React_2.ReactNode;
}

/**
 * {@docCategory LineChart}
 */
export declare interface EventsAnnotationProps {
    events: EventAnnotation[];
    strokeColor?: string;
    labelColor?: string;
    labelHeight?: number;
    labelWidth?: number;
    mergedLabel: (count: number) => string;
}

export declare interface ExtendedSegment extends GaugeChartSegment {
    start: number;
    end: number;
}

export declare const FunnelChart: React_2.FunctionComponent<FunnelChartProps>;

/**
 * Data point for funnel chart
 * {@docCategory FunnelChart}
 */
export declare interface FunnelChartDataPoint {
    /**
     * Stage name or identifier
     */
    stage: string | number;
    /**
     * Sub-values for stacked funnel charts
     * Each sub-value represents a category within the stage
     */
    subValues?: Array<{
        category: string;
        value: number;
        color: string;
    }>;
    /**
     * Value for the stage (used for non-stacked funnel charts)
     */
    value?: number;
    /**
     * Color for the stage (used for non-stacked funnel charts)
     */
    color?: string;
}

/**
 * Funnel Chart component props
 * {@docCategory FunnelChart}
 */
export declare interface FunnelChartProps {
    /**
     * Title styles configuration for the chart title
     */
    titleStyles?: TitleStyles;
    /**
     * Data points for the funnel chart
     */
    data: FunnelChartDataPoint[];
    /**
     * Title for the chart
     */
    chartTitle?: string;
    /**
     * Width of the chart
     */
    width?: number;
    /**
     * Height of the chart
     */
    height?: number;
    /**
     * Decides whether to show/hide legends
     * @defaultvalue false
     */
    hideLegend?: boolean;
    /**
     * Props for the legends in the chart
     */
    legendProps?: Partial<LegendsProps>;
    /**
     * Props for the callout in the chart
     */
    calloutProps?: ChartPopoverProps;
    /**
     * Call to provide customized styling that will layer on top of the variant rules
     */
    styles?: FunnelChartStyles;
    /**
     * Defines the culture to localize the numbers and dates
     */
    culture?: string;
    /**
     * Reference to the chart component
     */
    componentRef?: React_2.Ref<Chart>;
    /**
     * Additional CSS class(es) to apply to the chart
     */
    className?: string;
    /**
     * Orientation of the funnel chart
     * @defaultvalue 'horizontal'
     */
    orientation?: 'horizontal' | 'vertical';
}

/**
 * Funnel Chart style properties
 * {@docCategory FunnelChart}
 */
export declare interface FunnelChartStyleProps {
    /**
     * Additional CSS class(es) to apply to the chart
     */
    className?: string;
    /**
     * Width of the chart
     */
    chartWidth: number;
    /**
     * Height of the chart
     */
    chartHeight: number;
}

/**
 * Funnel Chart styles
 * {@docCategory FunnelChart}
 */
export declare interface FunnelChartStyles {
    /**
     * Styles for the root element
     */
    root?: string;
    /**
     * Styles for the chart
     */
    chart?: string;
    /**
     * Style for the chart title.
     */
    chartTitle?: string;
    /**
     * Styles for text elements
     */
    text?: string;
    /**
     * Style for SVG tooltip text
     */
    svgTooltip?: string;
    /**
     * Styles for the callout root element
     */
    calloutContentRoot?: string;
}

export declare const GanttChart: React_2.FunctionComponent<GanttChartProps>;

/**
 * {@docCategory IChartData}
 */
export declare interface GanttChartDataPoint {
    /**
     * Dependent value of the data point, rendered along the x-axis.
     */
    x: {
        start: Date | number;
        end: Date | number;
    };
    /**
     * Independent value of the data point, rendered along the y-axis.
     * If y is a number, then each y-coordinate is plotted at its y-coordinate.
     * If y is a string, then the data is evenly spaced along the y-axis.
     */
    y: number | string;
    /**
     * Legend text for the datapoint in the chart
     */
    legend?: string;
    /**
     * color for the legend in the chart
     */
    color?: string;
    /**
     * Gradient for the legend in the chart. If not provided, it will fallback on the default color palette.
     * If provided, it will override the color prop. granted `enableGradient` is set to true for the chart.
     */
    gradient?: [string, string];
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given legend will take
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     * This is an optional prop, If haven't given data will take
     */
    yAxisCalloutData?: string;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
}

/**
 * Gantt Chart properties
 * {@docCategory GanttChart}
 */
export declare interface GanttChartProps extends CartesianChartProps {
    /**
     * An array of data points to be rendered in the chart.
     */
    data?: GanttChartDataPoint[];
    /**
     * Callback function to render a custom callout for each data point.
     */
    onRenderCalloutPerDataPoint?: RenderFunction<GanttChartDataPoint>;
    /**
     * Height of each bar, in pixels.
     */
    barHeight?: number;
    /**
     * Title of the chart.
     */
    chartTitle?: string;
    /**
     * Locale identifier string used to format numbers and dates according to the specified culture.
     * Example: 'en-US', 'fr-FR'.
     */
    culture?: string;
    /**
     * Padding between bars as a fraction of the [step](https://d3js.org/d3-scale/band#band_step).
     * Takes a number in the range [0, 1].
     * @default 1/2
     */
    yAxisPadding?: number;
    /**
     * If true, enables gradient fills for the bars.
     * @default false
     */
    enableGradient?: boolean;
    /**
     * If true, applies rounded corners to the bars.
     * @default false
     */
    roundCorners?: boolean;
    /**
     * Maximum height of each bar, in pixels.
     * @default 24
     */
    maxBarHeight?: number;
}

/**
 * Gantt Chart style properties
 * {@docCategory GanttChart}
 */
export declare interface GanttChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Gantt Chart styles
 * {@docCategory GanttChart}
 */
export declare interface GanttChartStyles extends CartesianChartStyles {
}

export declare const GaugeChart: React_2.FunctionComponent<GaugeChartProps>;

/**
 * Gauge Chart properties
 * {@docCategory GaugeChart}
 */
export declare interface GaugeChartProps {
    /**
     * Title styles configuration for the chart title
     */
    titleStyles?: TitleStyles;
    /**
     * Width of the chart
     */
    width?: number;
    /**
     * Height of the chart
     */
    height?: number;
    /**
     * Title of the chart
     */
    chartTitle?: string;
    /**
     * Current value of the gauge
     */
    chartValue: number;
    /**
     * Sections of the gauge
     */
    segments: GaugeChartSegment[];
    /**
     * Minimum value of the gauge
     * @defaultvalue 0
     */
    minValue?: number;
    /**
     * Maximum value of the gauge
     */
    maxValue?: number;
    /**
     * Additional text to display below the chart value
     */
    sublabel?: string;
    /**
     * Hide the min and max values of the gauge
     * @defaultvalue false
     */
    hideMinMax?: boolean;
    /**
     * Format of the chart value
     * @defaultvalue GaugeValueFormat.Percentage
     */
    chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string);
    /**
     * Decides whether to show/hide legends
     * @defaultvalue false
     */
    hideLegend?: boolean;
    legendProps?: Partial<LegendsProps>;
    /**
     * Do not show tooltips in chart
     * @defaultvalue false
     */
    hideTooltip?: boolean;
    /**
     * Call to provide customized styling that will layer on top of the variant rules
     */
    styles?: GaugeChartStyles;
    /**
     * Defines the culture to localize the numbers and dates
     */
    culture?: string;
    /**
     * Props for the callout in the chart
     */
    calloutProps?: Partial<ChartPopoverProps>;
    /**
     * Specifies the variant of GaugeChart to be rendered
     * @defaultvalue GaugeChartVariant.MultipleSegments
     */
    variant?: GaugeChartVariant;
    /**
     * Prop to enable the gradient in the chart
     * @default false
     */
    enableGradient?: boolean;
    /**
     * Prop to enable the round corners in the chart
     * @default false
     */
    roundCorners?: boolean;
    /**
     * Optional callback to access the Chart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: React.Ref<Chart>;
}

/**
 * Gauge Chart segment interface.
 * {@docCategory GaugeChart}
 */
export declare interface GaugeChartSegment {
    /**
     * Legend text for a segment
     */
    legend: string;
    /**
     * Size of the segment
     */
    size: number;
    /**
     * Color of the segment
     */
    color?: string;
    /**
     * Gradient color of the segment
     */
    gradient?: [string, string];
    /**
     * Accessibility data for the segment
     */
    accessibilityData?: AccessibilityProps;
}

/**
 * Gauge Chart styles
 * {@docCategory GaugeChart}
 */
export declare interface GaugeChartStyles {
    /**
     * Styles for the root element
     */
    root?: string;
    /**
     * Styles for the chart
     */
    chart?: string;
    /**
     * Styles for the min and max values
     */
    limits?: string;
    /**
     * Styles for the chart value
     */
    chartValue?: string;
    /**
     * Styles for the sublabel
     */
    sublabel?: string;
    /**
     * Styles for the needle
     */
    needle?: string;
    /**
     * Styles for the chart title
     */
    chartTitle?: string;
    /**
     * Style for SVG tooltip text
     */
    svgTooltip?: string;
    /**
     * Styles for the segments
     */
    segment?: string;
    /**
     * Styles for gradient segments
     */
    gradientSegment?: string;
    /**
     * Styles for the legends container
     */
    legendsContainer?: string;
    /**
     * Styles for callout root-content
     */
    calloutContentRoot?: string;
    /**
     * Styles for callout x-content
     */
    calloutContentX?: string;
    /**
     * Styles for callout y-content
     */
    calloutContentY?: string;
    /**
     * Styles for description message
     */
    descriptionMessage?: string;
    /**
     * Styles for callout Date time container
     */
    calloutDateTimeContainer?: string;
    /**
     * Styles for callout info container
     */
    calloutInfoContainer?: string;
    /**
     * Styles for callout block container
     */
    calloutBlockContainer?: string;
    /**
     * Styles for callout legend text
     */
    calloutlegendText?: string;
    /**
     * Styles for the shape object in the callout
     */
    shapeStyles?: string;
    /**
     * Styles for the chart wrapper div
     */
    chartWrapper?: string;
}

/**
 * {@docCategory GaugeChart}
 */
export declare type GaugeChartVariant = 'single-segment' | 'multiple-segments';

/**
 * {@docCategory GaugeChart}
 */
export declare type GaugeValueFormat = 'percentage' | 'fraction';

export declare const getChartValueLabel: (chartValue: number, minValue: number, maxValue: number, chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string), forCallout?: boolean) => string;

export declare const getColorContrast: (c1: string, c2: string) => number;

export declare const getColorFromToken: (token: string, isDarkTheme?: boolean) => string;

export declare function getContrastTextColor(backgroundColor: string, isDarkTheme?: boolean): string;

export declare const getInvertedTextColor: (color: string, isDarkTheme?: boolean) => string;

export declare const getNextColor: (index: number, offset?: number, isDarkTheme?: boolean) => string;

export declare const getSegmentLabel: (segment: ExtendedSegment, minValue: number, maxValue: number, variant?: GaugeChartVariant, isAriaLabel?: boolean) => string;

export declare const GroupedVerticalBarChart: React_2.FC<GroupedVerticalBarChartProps>;

/**
 * {@docCategory ChartData}
 */
export declare interface GroupedVerticalBarChartData {
    /**
     * Data for X axis label
     */
    name: string;
    /**
     * Data points for Grouped vertical bar chart
     */
    series: GVBarChartSeriesPoint[];
    /**
     * Accessibility data for Group Bars Stack Callout
     */
    stackCallOutAccessibilityData?: AccessibilityProps;
}

/**
 * Vertical Bar Chart properties
 * {@docCategory VerticalBarChart}
 */
export declare interface GroupedVerticalBarChartProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data?: GroupedVerticalBarChartData[];
    /**
     * Width of each bar in the chart. When set to `undefined` or `'default'`, the bar width defaults to 16px,
     * which may decrease to prevent overlap. When set to `'auto'`, the bar width is calculated from padding values.
     * @default 16
     */
    barWidth?: number | 'default' | 'auto';
    /**
     * Colors from which to select the color of each bar.
     */
    colors?: string[];
    /**
     * chart title for the chart
     */
    chartTitle?: string;
    /**
     * This prop makes sure that all the bars are of same color.
     * it will take the first color from the array of colors in
     * prop `colors` or if  `colors` prop is not given then default color is  palette.blueLight
     * @default false
     */
    useSingleColor?: boolean;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: GroupedVerticalBarChartStyles;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * To display multi stack callout or single callout
     * @default false
     */
    isCalloutForStack?: boolean;
    /**
     * Prop to hide the bar labels
     * @default false
     */
    hideLabels?: boolean;
    /**
     * Maximum width of a bar, in pixels.
     * @default 24
     */
    maxBarWidth?: number;
    /**
     * Padding between bars as a fraction of the [step](https://d3js.org/d3-scale/band#band_step).
     * Takes a number in the range [0, 1]. Only applicable to string x-axis.
     * @default 2/3
     */
    xAxisInnerPadding?: number;
    /**
     * Padding before the first bar and after the last bar as a fraction of
     * the [step](https://d3js.org/d3-scale/band#band_step). Takes a number in the range [0, 1].
     * Only applicable to string x-axis.
     */
    xAxisOuterPadding?: number;
    /**
     * Specifies the mode of the chart.
     * @default 'default'
     */
    mode?: 'default' | 'plotly';
    /**
     * @default false
     * The prop used to enable rounded corners for the chart.
     */
    roundCorners?: boolean;
    /**
     * New flexible data prop - supports both bar and line series.
     * Use `dataV2` instead of `data` when line series are included.
     */
    dataV2?: (BarSeries<string, number> | LineSeries<string, number>)[];
}

/**
 * Vertical Bar Chart style properties
 * {@docCategory VerticalBarChart}
 */
export declare interface GroupedVerticalBarChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Vertical Bar Chart styles
 * {@docCategory VerticalBarChart}
 */
export declare interface GroupedVerticalBarChartStyles extends CartesianChartStyles {
    /**
     * Style for the bar labels
     */
    barLabel: string;
}

/**
 * This is used to group nodes by column index.
 */
export declare function groupNodesByColumn(graph: SankeyChartData): NodesInColumns;

/**
 * {@docCategory ChartData}
 */
export declare interface GVBarChartSeriesPoint {
    /**
     * Text for // need to check use of this
     */
    key: string;
    /**
     * Data for bar height of Grouped vertical bar chart
     */
    data: number;
    /**
     * Color for the legend in the chart
     */
    color?: string;
    /**
     * Legend text in the chart
     */
    legend: string;
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given legend will take
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     * This is an optional prop, If haven't given data will take
     */
    yAxisCalloutData?: string;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
    /**
     * Whether to use the secondary y scale or not
     * False by default.
     */
    useSecondaryYScale?: boolean;
    /**
     * Label to display on the bar
     */
    barLabel?: string;
}

export declare interface GVDataPoint {
    /**
     * This interface used for - While forming datapoints from given prop "data" in code
     * datapoints are used for to draw graph
     */
    [key: string]: number | string;
}

export declare interface GVForBarChart {
    /**
     * While forming datapoints from given prop "data"
     * These datapoints are used for to draw graph.
     */
    [key: string]: GVBarChartSeriesPoint;
}

export declare interface GVSingleDataPoint {
    /**
     * While forming datapoints from given prop "data" in code.
     * These datapoints are used for to draw graph easily.
     */
    [key: string]: GVDataPoint;
}

export declare const HeatMapChart: React_2.FunctionComponent<HeatMapChartProps>;

/**
 * {@docCategory ChartData}
 */
export declare interface HeatMapChartData {
    /**
     * name of the legend
     */
    legend: string;
    data: HeatMapChartDataPoint[];
    /**
     * This  number will be used to get the color for the legend
     */
    value: number;
}

export declare interface HeatMapChartDataPoint {
    x: string | Date | number;
    y: string | Date | number;
    value: number;
    /**
     * The value/ text to be rendered in the rectange
     */
    rectText?: string | number;
    /**
     * denomination to show in the callout
     */
    ratio?: [number, number];
    /**
     * description message to the callout
     */
    descriptionMessage?: string;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
}

/**
 * Heat Map Chart properties
 * {@docCategory HeatMapChart}
 */
export declare interface HeatMapChartProps extends CartesianChartProps {
    /**
     * chart title for the chart
     */
    chartTitle?: string;
    /**
     * data to provide for Heat Map
     */
    data: HeatMapChartData[];
    /**
     * The domain value for the color scale,
     *
     */
    domainValuesForColorScale: number[];
    /**
     * The range values for the color scale,
     * fill the array with colors in hex format
     * note:- it should contain values exactly as many as values in the array
     * `domainValuesForColorScale`
     */
    rangeValuesForColorScale: string[];
    /**
     * date formatter of x axis,
     * if the x-axis data point are of date type then user can use this
     * prop to format the date
     * refer to https://github.com/d3/d3-time-format for string values
     * @default '%b/%d'
     */
    xAxisDateFormatString?: string;
    /**
     * date formatter of y axis,
     * if the y-axis data point are or date type then user can use this
     * prop to format the date
     * refer to https://github.com/d3/d3-time-format for string values
     * @default '%b/%d'
     */
    yAxisDateFormatString?: string;
    /**
     * number formatter of x axis
     * if the x-axis data pints are of number type then user can
     * use this prop to format the number
     * refer to https://github.com/d3/d3-format for string values
     * @default '.2~s'
     */
    xAxisNumberFormatString?: string;
    /**
     * number formatter of y axis
     * if the y-axis data pints are of number type then user can
     * use this prop to format the number
     * refer to https://github.com/d3/d3-format for string values
     * @default '.2~s'
     */
    yAxisNumberFormatString?: string;
    /**
     * string formatter for x-axis.
     * This prop only applies if the x-axis is of string type
     *
     * For the accessiblity reason we sort the x-axis data point given by the consumer in ascending
     * order and then render in the x-axis. this behaviour would force the order of the data points.
     * to overcome , user can give x-axis point names as p1 p2...etc and map those p1 and p2 to custom name.
     * behind the scene the charting will actually sort the p1 and p2 and then we can attach the custom
     * name to that point by using this prop, hence giving the us the flexiblity of the order in which
     * label should render
     *
     * see the example file for the usage of the prop
     */
    xAxisStringFormatter?: (point: string) => string;
    /**
     * string formatter for y-axis.
     * This prop only applies if the y-axis is of string type
     *
     * For the accessiblity reason we sort the x-axis data point given by the consumer in ascending
     * order and then render in the y-axis. this behaviour would force the order of the data points.
     * to overcome , user can give y-axis point names as p1 p2...etc and map those p1 and p2 to custom name.
     * behind the scene the charting will actually sort the p1 and p2 and then we can attach the custom
     * name to that point by using this prop, hence giving the us the flexiblity of the order in which
     * label should render
     *
     * see the exaple file for the usage of the prop
     */
    yAxisStringFormatter?: (point: string) => string;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: HeatMapChartStyles;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * @default alphabetical
     * The prop used to decide order of string axis labels */
    sortOrder?: 'none' | 'alphabetical';
}

/**
 * Heat Map Chart styles
 * {@docCategory HeatMapChart}
 */
export declare interface HeatMapChartStyles extends CartesianChartStyles {
    root?: string;
    text?: string;
    calloutContentRoot?: string;
}

/**
 * HorizontalBarChart is the context wrapper and container for all HorizontalBarChart content/controls,
 * It has no direct style or slot opinions.
 *
 * HorizontalBarChart also provides API interfaces for callbacks that will occur on navigation events.
 */
export declare const HorizontalBarChart: React_2.FunctionComponent<HorizontalBarChartProps>;

/**
 * Horizontal Bar Chart properties
 * {@docCategory HorizontalBarChart}
 */
export declare interface HorizontalBarChartProps extends React_2.RefAttributes<HTMLDivElement> {
    /**
     * An array of chart data points for the Horizontal bar chart
     */
    data?: ChartProps[];
    /**
     * Width of bar chart
     */
    width?: number;
    /**
     * Height of bar chart
     * @default 15
     */
    barHeight?: number;
    /**
     * Additional CSS class(es) to apply to the StackedBarChart.
     */
    className?: string;
    /**
     * This property tells whether to show ratio on top of stacked bar chart or not.
     */
    hideRatio?: boolean[];
    /**
     * Do not show tooltips in chart
     *
     * @default false
     */
    hideTooltip?: boolean;
    /**
     * This property tells how to show data text on top right of bar chart.
     * If barChartCustomData props added, then this props will be overrided.
     * @default 'default'
     */
    chartDataMode?: ChartDataMode;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: HorizontalBarChartStyles;
    /**
     * Define a custom callout renderer for a horizontal bar
     */
    /**
     * props for the callout in the chart
     */
    calloutProps?: ChartPopoverProps;
    /**
     * Custom text to the chart (right side of the chart)
     * IChartProps will be available as props to the method prop.
     * If this method not given, default values (IHorizontalDataPoint \{x,y\})
     * will be used to display the data/text based on given chartModeData prop.
     */
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * Prop to define the variant of HorizontalBarChart to render
     * @default HorizontalBarChartVariant.PartToWhole
     */
    variant?: HorizontalBarChartVariant;
    /**
     * Prop to hide the bar labels
     * @default false
     */
    hideLabels?: boolean;
    /**
     * line color for callout
     */
    color?: string;
    /**
     * prop to check if benchmark data is provided
     */
    showTriangle?: boolean;
    legendsOverflowText?: any;
    legendProps?: Partial<LegendsProps>;
    /**
     * prop to render the custom callout
     */
    onRenderCalloutPerHorizontalBar?: (props: ChartDataPoint) => JSXElement | undefined;
    /**
     * Define a custom callout props override
     */
    calloutPropsPerDataPoint?: (dataPointCalloutProps: ChartDataPoint) => ChartPopoverProps;
    /**
     * When true, chart will display legends even if a bar ( row ) has only one data point.
     * @default false
     */
    showLegendForSinglePointBar?: boolean;
}

/**
 * Horizontal Bar Chart styles
 * {@docCategory HorizontalBarChart}
 */
export declare interface HorizontalBarChartStyles {
    /**
     * Styling for the root container
     */
    root: string;
    /**
     * Styling for each item in the container
     */
    items: string;
    /**
     * Style for the chart.
     */
    chart: string;
    /**
     * Style for the chart Title.
     */
    chartTitle: string;
    /**
     * Style for the bars.
     */
    barWrapper: string;
    /**
     * Style for left side text of the chart title
     */
    chartTitleLeft: string;
    /**
     * Style for right side text of the chart title
     */
    chartTitleRight: string;
    /**
     * Style for the chart data text denominator.
     */
    chartDataTextDenominator: string;
    /**
     * Style for the benchmark container
     */
    benchmarkContainer: string;
    /**
     * Style for the benchmark triangle
     */
    triangle: string;
    /**
     * Style for the bar labels
     */
    barLabel: string;
    /**
     * Style for the div containing the chart
     */
    chartWrapper: string;
    /**
     * Style for the legend container.
     */
    legendContainer: string;
}

/**
 * {@docCategory HorizontalBarChart}
 */
export declare enum HorizontalBarChartVariant {
    PartToWhole = "part-to-whole",
    AbsoluteScale = "absolute-scale"
}

export declare const HorizontalBarChartWithAxis: React_2.FunctionComponent<HorizontalBarChartWithAxisProps>;

/**
 * {@docCategory ChartData}
 */
export declare interface HorizontalBarChartWithAxisDataPoint {
    /**
     * Dependent value of the data point, rendered along the x-axis.
     */
    x: number;
    /**
     * Independent value of the data point, rendered along the y-axis.
     * If y is a number, then each y-coordinate is plotted at its y-coordinate.
     * If y is a string, then the data is evenly spaced along the y-axis.
     */
    y: number | string;
    /**
     * Legend text for the datapoint in the chart
     */
    legend?: string;
    /**
     * color for the legend in the chart
     */
    color?: string;
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given legend will take
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     * This is an optional prop, If haven't given data will take
     */
    yAxisCalloutData?: string;
    /**
     * Label to display on the bar
     */
    barLabel?: string;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
}

/**
 * Horizontal Bar Chart with Axis properties
 * {@docCategory HorizontalBarChartWithAxis}
 */
export declare interface HorizontalBarChartWithAxisProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data?: HorizontalBarChartWithAxisDataPoint[];
    /**
     * Define a custom callout renderer for a data point.
     */
    onRenderCalloutPerDataPoint?: RenderFunction<HorizontalBarChartWithAxisDataPoint>;
    /**
     * Width of each bar in the chart.
     */
    barHeight?: number;
    /**
     * Colors from which to select the color of each bar.
     */
    colors?: string[];
    /**
     * chart title for the chart
     */
    chartTitle?: string;
    /**
     * This prop makes sure that all the bars are of same color.
     * it will take the first color from the array of colors in
     * prop `colors` or if  `colors` prop is not given then default color is  palette.blueLight
     * @default false
     */
    useSingleColor?: boolean;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: HorizontalBarChartWithAxisStyles;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * it's padding between bar's or lines in the graph
     */
    yAxisPadding?: number;
    /**
     * @default false
     * The prop used to enable gradient fill color for the chart.
     */
    enableGradient?: boolean;
    /**
     * @default false
     * The prop used to enable rounded corners for the bars.
     */
    roundCorners?: boolean;
    /**
     * Prop to hide the bar labels
     * @default false
     */
    hideLabels?: boolean;
}

/**
 * Horizontal Bar Chart with Axis style properties
 * {@docCategory HorizontalBarChartWithAxis}
 */
export declare interface HorizontalBarChartWithAxisStyleProps extends CartesianChartStyleProps {
    /**
     * color of the datapoint legend
     */
    legendColor?: string;
}

/**
 * Horizontal Bar Chart with Axis styles
 * {@docCategory HorizontalBarChartWithAxis}
 */
export declare interface HorizontalBarChartWithAxisStyles extends CartesianChartStyles {
    /**
     * Style for the chart label.
     *
     */
    chartLabel?: string;
    /**
     * Style for the line representing the domain of the x-axis.
     *
     */
    xAxisDomain?: string;
    /**
     * Style for the lines representing the ticks along the x-axis.
     *
     */
    xAxisTicks?: string;
    /**
     * Style for the text labeling each tick along the x-axis.
     *
     */
    xAxisText?: string;
    /**
     * Style for the line representing the domain of the y-axis.
     *
     */
    yAxisDomain?: string;
    /**
     * Style for the lines representing the ticks along the y-axis.
     *
     */
    yAxisTicks?: string;
    /**
     * Style for the text labeling each tick along the y-axis.
     *
     */
    yAxisText?: string;
    /**
     * Style to change the opacity of bars in dataviz when we hover on a single bar or legends
     */
    opacityChangeOnHover: string;
    /**
     * Style for the bar labels displayed at the end of each bar
     */
    barLabel?: string;
}

/**
 * {@docCategory ChartData}
 */
export declare interface HorizontalDataPoint {
    /**
     * Independent value of the data point, rendered along the x-axis.
     * If x is a number, then each y-coordinate is plotted at its x-coordinate.
     * If x is a string, then the data is evenly spaced along the x-axis.
     */
    x: number;
    /**
     * Total value of a single point bar chart.
     */
    total?: number;
}

declare interface IAxisData {
    yAxisDomainValues: number[];
    yAxisTickText: string[];
}

/**
 * {@docCategory DeclarativeChart}
 */
export declare interface IDeclarativeChart {
    exportAsImage: (opts?: ImageExportOptions) => Promise<string>;
}

declare interface IDomainNRange {
    dStartValue: number | Date;
    dEndValue: number | Date;
    rStartValue: number;
    rEndValue: number;
}

/**
 * {@docCategory Chart}
 */
export declare interface ImageExportOptions {
    width?: number;
    height?: number;
    scale?: number;
    background?: string;
}

declare interface IMargins {
    /**
     * left margin for the chart.
     * @default 40
     */
    left?: number;
    /**
     * Right margin for the chart.
     * @default 20
     */
    right?: number;
    /**
     * Top margin for the chart.
     * @default 20
     */
    top?: number;
    /**
     * Bottom margin for the chart.
     * @default 35
     */
    bottom?: number;
}

declare interface IYAxisParams extends AxisProps {
    yMinMaxValues?: {
        startValue: number;
        endValue: number;
    };
    maxOfYVal?: number;
    margins: IMargins;
    containerWidth: number;
    containerHeight: number;
    yAxisElement?: SVGSVGElement | null;
    yAxisTickFormat?: any;
    yAxisTickCount: number;
    yMaxValue?: number;
    yMinValue?: number;
    tickPadding?: number;
    eventAnnotationProps?: EventsAnnotationProps;
    eventLabelHeight?: number;
    yAxisPadding?: number;
    tickValues?: Date[] | number[] | string[];
}

/**
 * @public
 * ILegend interface
 * {@docCategory Legends}
 */
export declare interface Legend {
    /**
     * Defines the title of the legend
     */
    title: string;
    /**
     * Defines the function that is executed on clicking this legend
     */
    action?: VoidFunction;
    /**
     * Defines the function that is executed upon hovering over the legend
     */
    hoverAction?: VoidFunction;
    /**
     * Defines the function that is executed upon moving the mouse away from the legend
     */
    onMouseOutAction?: (isLegendFocused?: boolean) => void;
    /**
     * The color for the legend
     */
    color: string;
    /**
     * The opacity of the legend color
     */
    opacity?: number;
    /**
     * The shape for the legend
     */
    shape?: LegendShape;
    /**
     * Indicated whether or not to apply stripe pattern
     */
    stripePattern?: boolean;
    /**
     * Indicates if the legend belongs to a line in the Bar Chart
     */
    isLineLegendInBarChart?: boolean;
    nativeButtonProps?: React_2.ButtonHTMLAttributes<HTMLButtonElement>;
    /**
     * The annotation for the legend, function returning a React node
     */
    legendAnnotation?: () => React_2.ReactNode;
}

/**
 * {@docCategory Legends}
 */
export declare interface LegendContainer {
    toSVG: (svgWidth: number, isRTL?: boolean) => {
        node: SVGSVGElement | null;
        width: number;
        height: number;
    };
}

export declare interface LegendDataItem {
    /**
     * Text to be displayed for legend item.
     */
    legendText: string | number;
    /**
     * Color for the specific legend
     */
    legendColor: string;
}

declare interface LegendMap {
    [key: string]: boolean;
}

export declare const Legends: React_2.FunctionComponent<LegendsProps>;

/**
 * @public
 * The shape for the legend
 * default: show the rect legend
 * triangle: show the triangle legend
 * {@docCategory Legends}
 */
export declare type LegendShape = 'default' | 'triangle' | keyof typeof Points | keyof typeof CustomPoints;

/**
 * @public
 * Legend properties
 * {@docCategory Legends}
 */
export declare interface LegendsProps {
    /**
     * Prop that takes list of legends
     */
    legends: Legend[];
    /**
     * Additional CSS class(es) to apply to the legneds component.
     */
    className?: string;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: LegendsStyles;
    /**
     * This prop makes the legends component align itself to the center in the container it is sitting in
     */
    centerLegends?: boolean;
    /**
     * Enable the legends to wrap lines if there is not enough space to show all legends on a single line
     */
    enabledWrapLines?: boolean;
    /**
     * style for the overflow component
     */
    overflowStyles?: React_2.CSSProperties;
    /**
     * text for overflow legends string
     */
    overflowText?: string;
    /**
     * prop that decides if legends are focusable
     * @default true
     */
    allowFocusOnLegends?: boolean;
    /**
     * prop that decide if we can select multiple legends or single legend at a time
     * @default false
     */
    canSelectMultipleLegends?: boolean;
    /**
     * Callback issued when the selected option changes.
     */
    onChange?: (selectedLegends: string[], event: React_2.MouseEvent<HTMLButtonElement>, currentLegend?: Legend) => void;
    /**
     * Keys (title) that will be initially used to set selected items. This prop is used for multi-select scenarios when
     * canSelectMultipleLegends is true; for single-select, use defaultSelectedLegend.
     *
     * Updating this prop does not change the selection after the component has been initialized. For controlled
     * selections, use selectedLegends instead.
     *
     * @see selectedLegends for setting the selected legends in controlled mode.
     * @see defaultSelectedLegend for setting the initially selected legend when canSelectMultipleLegends is false.
     */
    defaultSelectedLegends?: string[];
    /**
     * Key that will be initially used to set selected item. This prop is used for single-select scenarios when
     * canSelectMultipleLegends is false or unspecified; for multi-select, use defaultSelectedLegends.
     *
     * Updating this prop does not change the selection after the component has been initialized. For controlled
     * selections, use selectedLegend instead.
     *
     * @see selectedLegend for setting the selected legend in controlled mode.
     * @see defaultSelectedLegends for setting the initially selected legends when canSelectMultipleLegends is true.
     */
    defaultSelectedLegend?: string;
    /**
     * Keys (title) that will be used to set selected items in multi-select scenarios when canSelectMultipleLegends is
     * true. For single-select, use selectedLegend.
     *
     * When this prop is provided, the component is controlled and does not automatically update the selection based on
     * user interactions; the parent component must update the value passed to this property by handling the onChange
     * event.
     *
     * @see defaultSelectedLegends for setting the initially-selected legends in uncontrolled mode.
     * @see selectedLegends for setting the selected legends when `canSelectMultipleLegends` is `true`.
     */
    selectedLegends?: string[];
    /**
     * Key (title) that will be used to set the selected item in single-select scenarios when canSelectMultipleLegends is
     * false or unspecified. For multi-select, use selectedLegends.
     *
     * When this prop is provided, the component is controlled and does not automatically update the selection based on
     * user interactions; the parent component must update the value passed to this property by handling the onChange
     * event.
     *
     * @see defaultSelectedLegend for setting the initially-selected legend in uncontrolled mode.
     * @see selectedLegend for setting the selected legend when `canSelectMultipleLegends` is `false`.
     */
    selectedLegend?: string;
    /**
     * The shape for the legend.
     */
    shape?: LegendShape;
    /**
     * Callback to access the public methods and properties of the component.
     */
    legendRef?: React_2.Ref<LegendContainer>;
}

/**
 * @public
 * Legends styles
 * {@docCategory Legends}
 */
export declare interface LegendsStyles {
    /**
     * Style set for the root of the legend component
     */
    root?: string;
    /**
     * Style set for Legend. This is a wrapping class for text of legend and the rectange box that represents a legend
     */
    legend?: string;
    /**
     * Style set for the rectangle that represents a legend
     */
    rect?: string;
    /**
     * styles set for the shape that represents a legend
     */
    shape?: string;
    /**
     * Style set for the triangle that represents a legend
     */
    triangle?: string;
    /**
     * Style for the legend text
     */
    text?: string;
    /**
     * Style for the legend text
     */
    hoverChange?: string;
    /**
     * Style for the area that is resizable
     */
    resizableArea?: string;
    legendContainer?: string;
    /**
     * Style for the annotation that is used in the legend
     */
    annotation?: string;
}

export declare interface LegendState {
    activeLegend: string;
    /** Set of legends selected, both for multiple selection and single selection */
    selectedLegends: LegendMap;
}

/**
 * @public
 * Legend style properties
 * {@docCategory Legends}
 */
export declare interface LegendStyleProps {
    className?: string;
    colorOnSelectedState?: string;
    borderColor?: string;
    opacity?: number;
    overflow?: boolean;
    stripePattern?: boolean;
    isLineLegendInBarChart?: boolean;
}

/**
 * Linechart component
 * {@docCategory LineChart}
 */
export declare const LineChart: React_2.FunctionComponent<LineChartProps>;

/**
 * {@docCategory ChartData}
 */
export declare interface LineChartDataPoint extends BaseDataPoint {
    /**
     * Independent value of the data point, rendered along the x-axis.
     */
    x: number | Date;
    /**
     * Dependent value of the data point, rendered along the y-axis.
     */
    y: number;
    /**
     * text labels of marker points
     */
    text?: string;
    /**
     * Per-point marker color (overrides series color when present)
     */
    markerColor?: string;
}

/**
 * {@docCategory ChartData}
 */
export declare interface LineChartGap {
    /**
     * Starting index of the gap.
     */
    startIndex: number;
    /**
     * Ending index of the gap.
     */
    endIndex: number;
}

/**
 * {@docCategory ChartProps}
 */
export declare interface LineChartLineOptions extends SVGProps<SVGPathElement> {
    /**
     * Width of the line/stroke.
     * Overrides the strokeWidth set on ICartesianChartProps level.
     * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-width
     */
    strokeWidth?: number | string;
    /**
     * Pattern of dashes and gaps.
     * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray
     */
    strokeDasharray?: string | number;
    /**
     * Offset on rendering of stroke dash array.
     * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dashoffset
     */
    strokeDashoffset?: string | number;
    /**
     * Shape at the end of a subpath.
     * Default round.
     * @see https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap
     */
    strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit';
    /**
     * Width of border around the line. Default no border.
     */
    lineBorderWidth?: string | number;
    /**
     * Color of border around the line. Default white.
     */
    lineBorderColor?: string;
    /**
     * Defines the type of interpolation used to render the line.
     * @default 'linear'
     */
    curve?: 'linear' | 'natural' | 'step' | 'stepAfter' | 'stepBefore' | CurveFactory;
    /**
     * Defines the mode of points to be rendered.
     */
    mode?: 'lines' | 'markers' | 'text' | 'lines+markers' | 'text+markers' | 'text+lines' | 'text+lines+markers' | 'none' | 'gauge' | 'number' | 'delta' | 'number+delta' | 'gauge+number' | 'gauge+number+delta' | 'gauge+delta' | 'markers+text' | 'lines+text' | 'lines+markers+text';
}

/**
 * {@docCategory ChartData}
 */
export declare interface LineChartPoints {
    /**
     * Legend text for the datapoint in the chart
     */
    legend: string;
    /**
     * The shape for the legend
     * default: show the rect legend
     */
    legendShape?: LegendShape;
    /**
     * dataPoints for the line chart
     */
    data: LineChartDataPoint[] | ScatterChartDataPoint[];
    /**
     * gaps in the line chart where a line is not drawn
     */
    gaps?: LineChartGap[];
    /**
     * color for the legend in the chart
     */
    color?: string;
    /**
     * opacity for chart fill color
     */
    opacity?: number;
    /**
     * options for the line drawn
     */
    lineOptions?: LineChartLineOptions;
    /**
     * hide dots for points that are not active
     */
    hideNonActiveDots?: boolean;
    /**
     * Defines the function that is executed on clicking this legend
     */
    onLegendClick?: (selectedLegend: string | null | string[]) => void;
    /**
     * Defines the function that is executed on clicking  line
     */
    onLineClick?: () => void;
    /**
     * Whether to use the secondary y scale or not
     * False by default.
     */
    useSecondaryYScale?: boolean;
}

/**
 * Line Chart properties
 * {@docCategory LineChart}
 */
export declare interface LineChartProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data: ChartProps;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: LineChartStyles;
    /**
     * Show event annotation
     */
    eventAnnotationProps?: EventsAnnotationProps;
    /**
     * Define a custom callout renderer for a data point
     */
    onRenderCalloutPerDataPoint?: RenderFunction<CustomizedCalloutData>;
    /**
     * Define a custom callout renderer for a stack; default is to render per data point
     */
    onRenderCalloutPerStack?: RenderFunction<CustomizedCalloutData>;
    /**
     * Callback for getting callout description message
     */
    getCalloutDescriptionMessage?: (calloutDataProps: CustomizedCalloutData) => string | undefined;
    colorFillBars?: ColorFillBarsProps[];
    /**
     * if this is set to true, then for each line there will be a unique shape assigned to the point,
     * there are total 8 shapes which are as follow circle, square, triangele, diamond, pyramid,
     *  hexagon, pentagon and octagon, which will get assigned as respectively, if there are more
     * than 8 lines in the line chart then it will again start from cicle to octagon.
     * setting this flag to true will also change the behavior of the points, like for a
     * line, last point shape and first point shape will be visible all the times, and all
     * other points will get enlarge only when hovered over them
     * if set to false default shape will be circle, with the existing behavior
     * @default false
     */
    allowMultipleShapesForPoints?: boolean;
    optimizeLargeData?: boolean;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * @default false
     * The prop used to enable the perf optimization
     */
    enablePerfOptimization?: boolean;
    /**
     * To enable callout for individual line or complete stack.
     * @default true
     * @type \{boolean \}
     */
    isCalloutForStack?: boolean;
}

/**
 * Line Chart style properties
 * {@docCategory LineChart}
 */
export declare interface LineChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Line Chart styles
 * {@docCategory LineChart}
 */
export declare interface LineChartStyles extends CartesianChartStyles {
    /**
     * styles for line border
     */
    lineBorder?: string;
    /**
     * styles for marker label
     */
    markerLabel?: string;
}

/**
 * {@docCategory ChartData}
 */
export declare interface LineDataInVerticalBarChart {
    y: VerticalBarChartDataPoint['y'];
    yAxisCalloutData?: string | undefined;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Whether to use the secondary y scale or not
     * False by default.
     */
    useSecondaryYScale?: boolean;
}

/**
 * {@docCategory ChartData}
 */
export declare interface LineDataInVerticalStackedBarChart {
    y: number | string;
    color: string;
    legend: string;
    /**
     * The shape for the legend
     * default: show the rect legend
     */
    legendShape?: LegendShape;
    /**
     * Data to show in callout
     */
    data?: number | string;
    yAxisCalloutData?: string;
    /**
     * Whether to use the secondary y scale or not
     * False by default.
     */
    useSecondaryYScale?: boolean;
    /**
     * options for the line drawn
     */
    lineOptions?: LineChartLineOptions;
}

/**
 * Represents a linepolar series.
 */
export declare interface LinePolarSeries extends DataSeries {
    /**
     * Type discriminator: always 'linepolar' for this series.
     */
    type: 'linepolar';
    /**
     * Array of data points for the series.
     */
    data: PolarDataPoint[];
    /**
     * Additional line rendering options (e.g., stroke width, curve type).
     */
    lineOptions?: LineChartLineOptions;
}

/**
 * Represents a line series.
 */
export declare interface LineSeries<X extends string | number | Date, Y extends string | number | Date> extends DataSeries {
    /**
     * Type discriminator: always 'line' for this series.
     */
    type: 'line';
    /**
     * Array of data points for the series.
     */
    data: DataPointV2<X, Y>[];
    /**
     * Optional gaps to render in the line.
     */
    gaps?: LineChartGap[];
    /**
     * Additional line rendering options (e.g., stroke width, curve type).
     */
    lineOptions?: LineChartLineOptions;
    /**
     * If true, hides dots for inactive (unfocused/unhovered) data points.
     */
    hideInactiveDots?: boolean;
    /**
     * Callback invoked when the line itself is clicked.
     */
    onLineClick?: () => void;
}

export declare interface MapXToDataSet {
    [key: string]: LineChartDataPoint[];
    [key: number]: LineChartDataPoint[];
}

/**
 * {@docCategory ChartProps}
 */
export declare interface Margins {
    /**
     * left margin for the chart.
     */
    left?: number;
    /**
     * Right margin for the chart.
     */
    right?: number;
    /**
     * Top margin for the chart.
     */
    top?: number;
    /**
     * Bottom margin for the chart.
     */
    bottom?: number;
}

export declare interface ModifiedCartesianChartProps extends CartesianChartProps {
    /**
     * Define the chart title
     */
    chartTitle?: string;
    /**
     * Only used for Area chart
     * Value used to draw y axis of that chart.
     */
    maxOfYVal?: number;
    /**
     * Data of the chart
     */
    points: any;
    /**
     * Define type of the chart
     */
    chartType: ChartTypes;
    /** X axis type */
    xAxisType: XAxisTypes;
    /** Y axis type */
    yAxisType?: YAxisType;
    /**
     * Legends of the chart.
     */
    legendBars: JSXElement | null;
    /**
     * Callout props
     */
    calloutProps?: ChartPopoverProps;
    /**
     * Callback method used for to get margins to the chart.
     */
    getmargins?: (margins: Margins) => void;
    /**
     * This is a call back method to the chart from cartesian chart.
     * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.
     * It also contians an optional param xAxisElement - defines as x axis scale element.
     * This param used to enable feature word wrap of Xaxis.
     */
    getGraphData?: any;
    /**
     * Used for bar chart graphs.
     * To define width of the bar
     */
    barwidth?: number;
    /**
     * Used for tick styles of the x axis of the chart
     * Tick params are applicable for date axis only.
     */
    tickParams?: {
        tickValues?: number[] | Date[] | string[];
        tickFormat?: string;
    };
    /**
     * it's padding between bar's or lines in the graph
     */
    xAxisPadding?: number;
    /**
     * it's padding between bar's or lines in the graph
     */
    yAxisPadding?: number;
    /**
     * Children elements specific to derived chart types.
     */
    children(props: ChildProps): React_2.ReactNode;
    /**
     * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.
     * @default false
     * @type \{boolean \}
     */
    isCalloutForStack?: boolean;
    /** dataset values to find out domain of the String axis
     * Present using for only vertical stacked bar chart and grouped vertical bar chart
     */
    datasetForXAxisDomain?: string[];
    /** Own callout design */
    customizedCallout?: any;
    /**
     * if the data points for the y-axis is of type string, then we need to give this
     * prop to construct the y-axis
     */
    stringDatasetForYAxisDomain?: string[];
    /**
     * The prop used to define the culture to localize the numbers and date
     */
    culture?: string;
    getAxisData?: any;
    /**
     * Callback method used when mouse leaves the chart boundary.
     */
    onChartMouseLeave?: () => void;
    /** Callback method to get extra margins for domain */
    getDomainMargins?: (containerWidth: number) => Margins;
    /** Callback method to get extra margins for Y-axis domain */
    getYDomainMargins?: (containerHeight: number) => Margins;
    /** Padding between each bar/line-point */
    xAxisInnerPadding?: number;
    /** Padding before first bar/line-point and after last bar/line-point */
    xAxisOuterPadding?: number;
    /**
     *@default false
     *Used for to elipse y axis labes and show tooltip on x axis labels
     */
    showYAxisLablesTooltip?: boolean;
    /**
     *@default false
     *Used for showing complete y axis lables   */
    showYAxisLables?: boolean;
    /**
     * @default false
     * Used to control the first render cycle Performance optimization code.
     */
    enableFirstRenderOptimization?: boolean;
    /**
     * Get the min and max values of the y-axis
     */
    getMinMaxOfYAxis: (points: LineChartPoints[] | HorizontalBarChartWithAxisDataPoint[] | VerticalBarChartDataPoint[] | DataPoint[] | ScatterChartPoints[] | GanttChartDataPoint[], yAxisType: YAxisType | undefined, useSecondaryYScale?: boolean) => {
        startValue: number;
        endValue: number;
    };
    /**
     * Create the y-axis
     */
    createYAxis: (yAxisParams: IYAxisParams, isRtl: boolean, axisData: IAxisData, isIntegralDataset: boolean, chartType: ChartTypes, useSecondaryYScale?: boolean, roundedTicks?: boolean, scaleType?: AxisScaleType, _useRtl?: boolean) => ScaleLinear<number, number, never>;
    /**
     * Get the domain and range values
     */
    getDomainNRangeValues: (points: LineChartPoints[] | VerticalBarChartDataPoint[] | VerticalStackedBarDataPoint[] | HorizontalBarChartWithAxisDataPoint[] | GroupedVerticalBarChartData[] | HeatMapChartDataPoint[] | GanttChartDataPoint[], margins: Margins, width: number, chartType: ChartTypes, isRTL: boolean, xAxisType: XAxisTypes, barWidth: number, tickValues: Date[] | number[] | string[] | undefined) => IDomainNRange;
    /**
     * Create the string y-axis
     */
    createStringYAxis: (yAxisParams: IYAxisParams, dataPoints: string[], isRtl: boolean, axisData: IAxisData, barWidth: number | undefined, chartType?: ChartTypes) => ScaleBand<string>;
    /**
     * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.
     * @default true
     */
    showRoundOffXTickValues?: boolean;
}

declare type NodesInColumns = {
    [key: number]: SNode[];
};

/**
 * we need to make sure that if we add any property to this, then
 * we need to also add that in  pointTypes below and vise-versa
 */
declare enum Points {
    circle = 0,
    square = 1,
    triangle = 2,
    diamond = 3,
    pyramid = 4,
    hexagon = 5,
    pentagon = 6,
    octagon = 7
}

/**
 * Configuration options for a polar axis.
 * {@docCategory PolarChart}
 */
export declare type PolarAxisProps = AxisProps & {
    /**
     * Values at which ticks should be placed on the axis.
     */
    tickValues?: number[] | Date[] | string[];
    /**
     * Format string for the axis ticks.
     * For numbers, see: https://d3js.org/d3-format.
     * And for dates see: https://d3js.org/d3-time-format.
     */
    tickFormat?: string;
    /**
     * Number of ticks to display on the axis.
     */
    tickCount?: number;
    /**
     * Defines the order of categories on the axis.
     * @default 'default'
     */
    categoryOrder?: AxisCategoryOrder;
    /**
     * Scale type for the axis.
     * @default 'default'
     */
    scaleType?: AxisScaleType;
    /**
     * Start value of the axis range.
     */
    rangeStart?: number | Date;
    /**
     * End value of the axis range.
     */
    rangeEnd?: number | Date;
};

export declare const PolarChart: React_2.FunctionComponent<PolarChartProps>;

/**
 * Polar Chart properties
 * {@docCategory PolarChart}
 */
export declare interface PolarChartProps {
    /**
     * Data series to be rendered in the polar chart.
     */
    data: (AreaPolarSeries | LinePolarSeries | ScatterPolarSeries)[];
    /**
     * Width of the polar chart.
     * @default 200
     */
    width?: number;
    /**
     * Height of the polar chart.
     * @default 200
     */
    height?: number;
    /**
     * Margins around the chart area.
     */
    margins?: Margins;
    /**
     * If true, hides the legend.
     * @default false
     */
    hideLegend?: boolean;
    /**
     * If true, hides the tooltip.
     * @default false
     */
    hideTooltip?: boolean;
    legendProps?: Partial<LegendsProps>;
    /**
     * Style properties for the polar chart.
     */
    styles?: PolarChartStyles;
    /**
     * Title of the chart.
     */
    chartTitle?: string;
    /**
     * Fraction of the radius to cut out from the center of the chart.
     * Accepts values in the range [0, 1].
     */
    hole?: number;
    /**
     * Shape of the polar chart.
     * @default 'circle'
     */
    shape?: 'circle' | 'polygon';
    /**
     * Direction in which the chart is drawn.
     * @default 'counterclockwise'
     */
    direction?: 'clockwise' | 'counterclockwise';
    /**
     * Configuration options for the radial axis.
     */
    radialAxis?: PolarAxisProps;
    /**
     * Configuration options for the angular axis.
     */
    angularAxis?: PolarAxisProps & {
        /**
         * Format unit for angular values.
         * @default 'degrees'
         */
        unit?: 'radians' | 'degrees';
    };
    /**
     * Optional callback to access the Chart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: React_2.Ref<Chart>;
    /**
     * Locale identifier string used to format numbers and dates according to the specified culture.
     * Example: 'en-US', 'fr-FR'.
     */
    culture?: string;
    /**
     * Options for localizing date values.
     */
    dateLocalizeOptions?: Intl.DateTimeFormatOptions;
    /**
     * If true, date values are treated as UTC dates.
     * @default false
     */
    useUTC?: boolean;
}

/**
 * Polar Chart style properties
 * {@docCategory PolarChart}
 */
export declare interface PolarChartStyleProps {
}

/**
 * Polar Chart styles
 * {@docCategory PolarChart}
 */
export declare interface PolarChartStyles {
    /**
     * Style for the root element.
     */
    root?: string;
    /**
     * Style for the chart wrapper element.
     */
    chartWrapper?: string;
    /**
     * Style for the chart element.
     */
    chart?: string;
    /**
     * Style for the inner grid lines.
     */
    gridLineInner?: string;
    /**
     * Style for the outer grid lines.
     */
    gridLineOuter?: string;
    /**
     * Style for the tick labels.
     */
    tickLabel?: string;
    /**
     * Style for the legend container.
     */
    legendContainer?: string;
}

/**
 * Represents a single data point in a polar series.
 */
export declare interface PolarDataPoint {
    /**
     * Radial value of the data point.
     */
    r: string | number | Date;
    /**
     * Angular value of the data point, specified as a category or in degrees.
     */
    theta: string | number;
    /**
     * Optional click handler for the data point.
     */
    onClick?: () => void;
    /**
     * Custom text to show in the callout in place of the radial axis value.
     */
    radialAxisCalloutData?: string;
    /**
     * Custom text to show in the callout in place of the angular axis value.
     */
    angularAxisCalloutData?: string;
    /**
     * Accessibility properties for the data point.
     */
    callOutAccessibilityData?: AccessibilityProps;
    /**
     * Custom marker size for the data point.
     */
    markerSize?: number;
    /**
     * Optional text to annotate or label the data point.
     */
    text?: string;
    /**
     * Color of the data point. If not provided, it will inherit the series color.
     */
    color?: string;
}

export declare interface PopoverComponentStyles {
    calloutContentRoot: string;
    calloutDateTimeContainer: string;
    calloutContentX: string;
    calloutBlockContainer: string;
    calloutBlockContainertoDrawShapefalse: string;
    calloutBlockContainertoDrawShapetrue: string;
    shapeStyles: string;
    calloutlegendText: string;
    calloutContentY: string;
    descriptionMessage: string;
    ratio: string;
    numerator: string;
    denominator: string;
    calloutInfoContainer: string;
    calloutContainer: string;
}

export declare function preRenderLayout(margins: Margins, containerWidth: number, containerHeight: number, isRtl: boolean): {
    sankey: SankeyLayoutGenerator;
    height: number;
    width: number;
};

export declare interface RefArrayData {
    index?: string;
    refElement?: SVGGElement;
}

/**
 * Render function interface for providing overrideable render callbacks.
 *
 * @public
 */
declare interface RenderFunction<P> {
    (props?: P, defaultRender?: (props?: P) => JSXElement | null): JSXElement | null;
}

export declare interface ResolvedAnnotationPosition {
    /** Final absolute position after applying layout and offsets */
    point: AnnotationPoint;
    /** Raw anchor position before offsets (used for connectors) */
    anchor: AnnotationPoint;
}

/**
 * Responsive Child props
 * {@docCategory ResponsiveContainer}
 */
export declare interface ResponsiveChildProps {
    width?: number;
    height?: number;
    shouldResize?: number;
    styles?: ResponsiveChildStyles;
}

/**
 * Responsive Child styles
 * {@docCategory ResponsiveContainer}
 */
export declare interface ResponsiveChildStyles {
    root?: string;
    chartWrapper?: string;
    chart?: string;
}

/**
 * Responsive Container component
 * {@docCategory ResponsiveContainer}
 */
export declare const ResponsiveContainer: React_2.FC<ResponsiveContainerProps>;

/**
 * Responsive Container props
 * {@docCategory ResponsiveContainer}
 */
export declare interface ResponsiveContainerProps {
    /**
     * Aspect ratio (width / height) of the container. If specified, the height will be calculated by width / aspect.
     */
    aspect?: number;
    /**
     * Width of the container
     */
    width?: number | string;
    /**
     * Height of the container
     */
    height?: number | string;
    /**
     * Minimum width of the container
     */
    minWidth?: number | string;
    /**
     * Minimum height of the container
     */
    minHeight?: number | string;
    /**
     * Maximum height of the container
     */
    maxHeight?: number;
    /**
     * Callback providing the updated chart width and height values when the container is resized
     */
    onResize?: (width: number, height: number) => void;
    /**
     * Child component to be rendered within the container
     */
    children: React_2.ReactElement<ResponsiveChildProps>;
}

export declare const SankeyChart: React_2.FunctionComponent<SankeyChartProps>;

/**
 * Set of strings which are used when rendering accessibility information within the chart.
 */
export declare interface SankeyChartAccessibilityProps {
    /**
     * Aria label for when the chart is empty.
     */
    emptyAriaLabel?: string;
    /**
     * A value similar to "node \{0\} with weight \{1\}".
     * \{0\} is the name of the node.
     * \{1\} is the weight of the node (as computed by the sankey layout engine via the links to or from this node).
     */
    nodeAriaLabel?: string;
    /**
     * A value similar to "link from \{0\} to $\{1\} with weight $\{2\}".
     * \{0\} is the source node, \{1\} is the target node, and \{2\} is the value of the link.
     */
    linkAriaLabel?: string;
}

/**
 * {@docCategory ChartData}
 */
export declare interface SankeyChartData {
    nodes: SNode[];
    links: SLink[];
}

/**
 * Sankey Chart properties
 * {@docCategory SankeyChart}
 */
export declare interface SankeyChartProps {
    /**
     * Title styles configuration for the chart title
     */
    titleStyles?: TitleStyles;
    /**
     * Data to render in the chart.
     */
    data: ChartProps;
    /**
     * Width of the chart.
     */
    width?: number;
    /**
     * Height of the chart.
     */
    height?: number;
    /**
     * Additional CSS class(es) to apply to the SankeyChart.
     */
    className?: string;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: SankeyChartStyles;
    /**
     * this prop takes its parent as a HTML element to define the width and height of the Sankey chart
     */
    parentRef?: HTMLElement | null;
    /**
     * should chart resize when parent resize.
     */
    shouldResize?: number;
    /**
     * Color for path
     */
    pathColor?: string;
    /**
     * Colors for nodes
     */
    colorsForNodes?: string[];
    /**
     * Colors for nodes border
     */
    borderColorsForNodes?: string[];
    /**
     * Localized strings to show in the UX.
     */
    strings?: SankeyChartStrings;
    /**
     * Localized strings to use for the chart's accessibility features.
     */
    accessibility?: SankeyChartAccessibilityProps;
    /**
     * Format node and link values.
     */
    formatNumberOptions?: Intl.NumberFormatOptions;
    /**
     * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows
     * @deprecated Use `reflowProps` instead.
     */
    enableReflow?: boolean;
    /**
     * Optional callback to access the Chart interface. Use this instead of ref for accessing
     * the public methods and properties of the component.
     */
    componentRef?: Ref<Chart>;
    /**
     * props for the callout in the chart
     */
    calloutProps?: ChartPopoverProps;
    /**
     * The prop used to define the culture to localize the numbers and date
     */
    culture?: string;
    /**
     * Whether to hide the legend
     * @default false
     */
    hideLegend?: boolean;
    /**
     * Props related to reflow behavior of the chart
     */
    reflowProps?: {
        /**
         * Determines the reflow behavior of the chart.
         * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.
         * @default 'none'
         */
        mode: 'none' | 'min-width';
    };
}

/**
 * Set of strings which are used when rendering the chart.
 */
export declare interface SankeyChartStrings {
    /**
     * A value similar to "from \{0\}" where \{0\} is the name of the source node for a link.
     * This is shown in the `ChartHoverCard` when the user hovers the mouse over a link.
     */
    linkFrom?: string;
}

/**
 * Sankey Chart styles
 * {@docCategory SankeyChart}
 */
export declare interface SankeyChartStyles {
    /**
     *  Style for the root element.
     */
    root?: string;
    /**
     *  Style for the nodes.
     */
    nodes?: string;
    /**
     *  Style for the links.
     */
    links?: string;
    /**
     *  Style for the text inside node.
     */
    nodeTextContainer?: string;
    /**
     *  Style for the tooltip ,when user hover over the truncated node detail.
     */
    toolTip?: string;
    /**
     * Styles for the chart wrapper div
     */
    chartWrapper?: string;
    /**
     * Styles for the chart svg element
     */
    chart?: string;
    /**
     * Style for SVG tooltip text
     */
    svgTooltip?: string;
    /**
     * Style for the chart title.
     */
    chartTitle?: string;
}

declare type SankeyLayoutGenerator = SankeyLayout<SankeyGraph<{}, {}>, {}, {}>;

/**
 * ScatterChart component
 * {@docCategory ScatterChart}
 */
export declare const ScatterChart: React_2.FunctionComponent<ScatterChartProps>;

/**
 * {@docCategory ChartData}
 * ScatterChartDataPoint interface.
 */
export declare interface ScatterChartDataPoint extends BaseDataPoint {
    /**
     * Independent value of the data point, rendered along the x-axis.
     */
    x: number | Date | string;
    /**
     * Dependent value of the data point, rendered along the y-axis.
     */
    y: number;
    /**
     * Marker size of the points
     */
    markerSize?: number;
    /**
     * text labels of marker points
     */
    text?: string;
    /**
     * Per-point marker color (overrides series color when present)
     */
    markerColor?: string;
}

/**
 * {@docCategory IChartData}
 */
export declare interface ScatterChartPoints {
    /**
     * Legend text for the datapoint in the chart
     */
    legend: string;
    /**
     * The shape for the legend
     * default: show the rect legend
     */
    legendShape?: LegendShape;
    /**
     * dataPoints for the line chart
     */
    data: ScatterChartDataPoint[];
    /**
     * color for the legend in the chart
     */
    color?: string;
    /**
     * opacity for chart fill color
     */
    opacity?: number;
    /**
     * hide dots for points that are not active
     */
    hideNonActiveDots?: boolean;
    /**
     * Defines the function that is executed on clicking this legend
     */
    onLegendClick?: (selectedLegend: string | null | string[]) => void;
    /**
     * Whether to use the secondary y scale or not
     * False by default.
     */
    useSecondaryYScale?: boolean;
}

/**
 * Line Chart properties
 * {@docCategory LineChart}
 */
export declare interface ScatterChartProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data: ChartProps;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: ScatterChartStyles;
    /**
     * Define a custom callout renderer for a data point
     */
    onRenderCalloutPerDataPoint?: RenderFunction<CustomizedCalloutData>;
    /**
     * Define a custom callout renderer for a stack; default is to render per data point
     */
    onRenderCalloutPerStack?: RenderFunction<CustomizedCalloutData>;
    /**
     * Callback for getting callout description message
     */
    getCalloutDescriptionMessage?: (calloutDataProps: CustomizedCalloutData) => string | undefined;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
}

/**
 * Scatter Chart style properties
 * {@docCategory ScatterChart}
 */
export declare interface ScatterChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Scatter Chart styles
 * {@docCategory ScatterChart}
 */
export declare interface ScatterChartStyles extends CartesianChartStyles {
    /**
     * Style for the marker label
     */
    markerLabel?: string;
}

/**
 * Represents a scatterpolar series.
 */
export declare interface ScatterPolarSeries extends DataSeries {
    /**
     * Type discriminator: always 'scatterpolar' for this series.
     */
    type: 'scatterpolar';
    /**
     * Array of data points for the series.
     */
    data: PolarDataPoint[];
}

/**
 * DeclarativeChart schema.
 * {@docCategory DeclarativeChart}
 */
export declare interface Schema {
    /**
     * Plotly schema represented as JSON object
     */
    plotlySchema: any;
}

export declare const Shape: React_2.FunctionComponent<ShapeProps>;

export declare interface ShapeProps {
    svgProps: React_2.SVGAttributes<SVGElement>;
    pathProps: React_2.SVGAttributes<SVGPathElement>;
    shape: LegendShape;
    classNameForNonSvg?: string;
    style?: React_2.CSSProperties | undefined;
}

export declare type SLink = SankeyLink<SNodeExtra, SLinkExtra>;

declare interface SLinkExtra {
    /**
     * The index within `ISankeyChartData.nodes` of the source node.
     */
    source: number;
    /**
     * The index within `ISankeyChartData.nodes` of the target node.
     */
    target: number;
    /**
     * The weight of this link between the two nodes.
     */
    value: number;
    unnormalizedValue?: number;
    color?: string;
}

export declare type SNode = SankeyNode<SNodeExtra, SLinkExtra>;

declare interface SNodeExtra {
    /**
     * A unique identifier for this node.
     */
    nodeId: number | string;
    /**
     * The display name for this node in the UX.
     */
    name: string;
    color?: string;
    borderColor?: string;
    actualValue?: number;
    layer?: number;
}

/**
 * Sparkline is the context wrapper and container for all Sparkline content/controls,
 * It has no direct style or slot opinions.
 *
 * Sparkline also provides API interfaces for callbacks that will occur on navigation events.
 */
export declare const Sparkline: React_2.FunctionComponent<SparklineProps>;

/**
 * Sparkline properties
 * {@docCategory SparklineChart}
 */
export declare interface SparklineProps extends React.RefAttributes<HTMLDivElement> {
    /**
     * An array of chart data points for the Sparkline chart
     */
    data?: ChartProps;
    /**
     * Width of chart
     * * @default 80
     */
    width?: number;
    /**
     * Height of chart
     * @default 20
     */
    height?: number;
    /**
     * Width of value text
     * * @default 80
     */
    valueTextWidth?: number;
    /**
     * Additional CSS class(es) to apply to the SparklineChart.
     */
    className?: string;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * Prop used to determine whether to show the legend or not
     */
    showLegend?: boolean;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: SparklineStyles;
}

export declare interface SparklineStyleProps extends CartesianChartStyleProps {
}

/**
 * Sparkline styles
 * {@docCategory SparklineChart}
 */
export declare interface SparklineStyles {
    inlineBlock?: string;
    valueText?: string;
}

export declare const Textbox: React_2.FunctionComponent<TextboxProps>;

declare interface TextboxProps {
    text: string;
    width: number;
    x: number;
    y: number;
    lineHeight: number;
    textAnchor?: 'start' | 'middle' | 'end';
    fontSize?: string;
    fill?: string;
}

/**
 * Shared interface for chart title styling properties.
 * Used by components that display a chart title with customizable font, alignment, and padding.
 * {@docCategory TitleStyles}
 */
declare interface TitleStyles {
    /**
     * Font configuration for the title
     */
    titleFont?: Partial<Font>;
    /**
     * Horizontal anchor/alignment for the chart title
     */
    titleXAnchor?: 'auto' | 'left' | 'center' | 'right';
    /**
     * Vertical anchor/alignment for the chart title
     */
    titleYAnchor?: 'auto' | 'top' | 'middle' | 'bottom';
    /**
     * Padding for the chart title
     */
    titlePad?: {
        t?: number;
        r?: number;
        b?: number;
        l?: number;
    };
}

/**
 * VegaDeclarativeChart - Render Vega-Lite specifications with Fluent UI styling
 *
 * Supported chart types:
 * - Line charts: mark: 'line' or 'point'
 * - Area charts: mark: 'area'
 * - Scatter charts: mark: 'point', 'circle', or 'square'
 * - Vertical bar charts: mark: 'bar' with nominal/ordinal x-axis
 * - Stacked bar charts: mark: 'bar' with color encoding
 * - Grouped bar charts: mark: 'bar' with color encoding (via configuration)
 * - Horizontal bar charts: mark: 'bar' with nominal/ordinal y-axis
 * - Donut/Pie charts: mark: 'arc' with theta encoding
 * - Heatmaps: mark: 'rect' with x, y, and color (quantitative) encodings
 * - Combo charts: Layered specs with bar + line marks render as VerticalStackedBarChart with line overlays
 *
 * Multi-plot Support:
 * - Horizontal concatenation (hconcat): Multiple charts side-by-side
 * - Vertical concatenation (vconcat): Multiple charts stacked vertically
 * - Shared data and encoding are merged from parent spec to each subplot
 *
 * Limitations:
 * - Most layered specifications (multiple chart types) are not fully supported
 * - Bar + Line combinations ARE supported and will render properly
 * - For other composite charts, only the first layer will be rendered
 * - Faceting and repeat operators are not yet supported
 * - Funnel charts are not a native Vega-Lite mark type. The conversion_funnel.json example
 *   uses a horizontal bar chart (y: nominal, x: quantitative) which is the standard way to
 *   represent funnel data in Vega-Lite. For specialized funnel visualizations with tapering
 *   shapes, consider using Plotly's native funnel chart type instead.
 *
 * Note: Sankey, Gantt, and Gauge charts are not standard Vega-Lite marks.
 * These specialized visualizations would require custom extensions or alternative approaches.
 *
 * @example Line Chart
 * ```tsx
 * import { VegaDeclarativeChart } from '@fluentui/react-charts';
 *
 * const spec = {
 *   mark: 'line',
 *   data: { values: [{ x: 1, y: 10 }, { x: 2, y: 20 }] },
 *   encoding: {
 *     x: { field: 'x', type: 'quantitative' },
 *     y: { field: 'y', type: 'quantitative' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: spec }} />
 * ```
 *
 * @example Area Chart
 * ```tsx
 * const areaSpec = {
 *   mark: 'area',
 *   data: { values: [{ date: '2023-01', value: 100 }, { date: '2023-02', value: 150 }] },
 *   encoding: {
 *     x: { field: 'date', type: 'temporal' },
 *     y: { field: 'value', type: 'quantitative' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: areaSpec }} />
 * ```
 *
 * @example Scatter Chart
 * ```tsx
 * const scatterSpec = {
 *   mark: 'point',
 *   data: { values: [{ x: 10, y: 20, size: 100 }, { x: 15, y: 30, size: 200 }] },
 *   encoding: {
 *     x: { field: 'x', type: 'quantitative' },
 *     y: { field: 'y', type: 'quantitative' },
 *     size: { field: 'size', type: 'quantitative' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: scatterSpec }} />
 * ```
 *
 * @example Vertical Bar Chart
 * ```tsx
 * const barSpec = {
 *   mark: 'bar',
 *   data: { values: [{ cat: 'A', val: 28 }, { cat: 'B', val: 55 }] },
 *   encoding: {
 *     x: { field: 'cat', type: 'nominal' },
 *     y: { field: 'val', type: 'quantitative' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: barSpec }} />
 * ```
 *
 * @example Stacked Bar Chart
 * ```tsx
 * const stackedSpec = {
 *   mark: 'bar',
 *   data: { values: [
 *     { cat: 'A', group: 'G1', val: 28 },
 *     { cat: 'A', group: 'G2', val: 15 }
 *   ]},
 *   encoding: {
 *     x: { field: 'cat', type: 'nominal' },
 *     y: { field: 'val', type: 'quantitative' },
 *     color: { field: 'group', type: 'nominal' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: stackedSpec }} />
 * ```
 *
 * @example Donut Chart
 * ```tsx
 * const donutSpec = {
 *   mark: 'arc',
 *   data: { values: [{ category: 'A', value: 30 }, { category: 'B', value: 70 }] },
 *   encoding: {
 *     theta: { field: 'value', type: 'quantitative' },
 *     color: { field: 'category', type: 'nominal' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: donutSpec }} />
 * ```
 *
 * @example Heatmap
 * ```tsx
 * const heatmapSpec = {
 *   mark: 'rect',
 *   data: { values: [
 *     { x: 'A', y: 'Mon', value: 28 },
 *     { x: 'B', y: 'Mon', value: 55 },
 *     { x: 'A', y: 'Tue', value: 43 }
 *   ]},
 *   encoding: {
 *     x: { field: 'x', type: 'nominal' },
 *     y: { field: 'y', type: 'nominal' },
 *     color: { field: 'value', type: 'quantitative' }
 *   }
 * };
 *
 * <VegaDeclarativeChart chartSchema={{ vegaLiteSpec: heatmapSpec }} />
 * ```
 */
export declare const VegaDeclarativeChart: React_2.ForwardRefExoticComponent<VegaDeclarativeChartProps & React_2.RefAttributes<HTMLDivElement>>;

/**
 * Props for VegaDeclarativeChart component
 */
export declare interface VegaDeclarativeChartProps {
    /**
     * Vega-Lite chart schema
     */
    chartSchema: VegaSchema;
    /**
     * Callback when schema changes (e.g., legend selection)
     */
    onSchemaChange?: (newSchema: VegaSchema) => void;
    /**
     * Additional CSS class name
     */
    className?: string;
    /**
     * Additional inline styles
     */
    style?: React_2.CSSProperties;
}

/**
 * Vega-Lite axis configuration
 */
declare interface VegaLiteAxis {
    /**
     * Axis title
     */
    title?: string | null;
    /**
     * Format string for axis tick labels
     * Uses d3-format for quantitative and d3-time-format for temporal
     */
    format?: string;
    /**
     * Tick values to display
     */
    values?: number[] | string[];
    /**
     * Number of ticks
     */
    tickCount?: number;
    /**
     * Grid visibility
     */
    grid?: boolean;
}

/**
 * Vega-Lite binning configuration
 */
declare interface VegaLiteBin {
    /**
     * Maximum number of bins
     */
    maxbins?: number;
    /**
     * Exact step size between bins
     */
    step?: number;
    /**
     * Extent [min, max] for binning
     */
    extent?: [number, number];
    /**
     * Base for nice bin values (e.g., 10 for powers of 10)
     */
    base?: number;
    /**
     * Whether to include the boundary in bins
     */
    anchor?: number;
}

/**
 * Vega-Lite color encoding channel
 */
declare interface VegaLiteColorEncoding {
    /**
     * Field name for color differentiation
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Legend configuration
     */
    legend?: VegaLiteLegend | null;
    /**
     * Scale configuration
     */
    scale?: VegaLiteScale | null;
    /**
     * Fixed color value
     */
    value?: string;
}

/**
 * Vega-Lite inline data
 */
declare interface VegaLiteData {
    /**
     * Inline data values (array of objects)
     */
    values?: Array<Record<string, unknown>>;
    /**
     * URL to load data from
     * TODO: Implement remote data loading
     */
    url?: string;
    /**
     * Named dataset reference
     * TODO: Implement named dataset resolution
     */
    name?: string;
    /**
     * Data format specification
     * TODO: Implement format parsing (csv, json, etc.)
     */
    format?: {
        type?: 'json' | 'csv' | 'tsv';
        parse?: Record<string, string>;
    };
}

/**
 * Vega-Lite encoding channels
 */
declare interface VegaLiteEncoding {
    /**
     * X-axis encoding
     */
    x?: VegaLitePositionEncoding;
    /**
     * Y-axis encoding
     */
    y?: VegaLitePositionEncoding;
    /**
     * Color encoding for series differentiation
     */
    color?: VegaLiteColorEncoding;
    /**
     * Size encoding for point marks
     */
    size?: VegaLiteSizeEncoding;
    /**
     * Shape encoding for point marks
     */
    shape?: VegaLiteShapeEncoding;
    /**
     * Theta encoding for pie/donut charts and polar coordinates
     */
    theta?: VegaLiteThetaEncoding;
    /**
     * Radius encoding for polar charts
     */
    radius?: VegaLiteRadiusEncoding;
    /**
     * X2 encoding for interval marks (rect, rule, bar with ranges)
     */
    x2?: VegaLitePositionEncoding;
    /**
     * Y2 encoding for interval marks (rect, rule, bar with ranges)
     */
    y2?: VegaLitePositionEncoding;
    /**
     * Text encoding for text marks
     */
    text?: VegaLiteTextEncoding;
    /**
     * xOffset encoding for grouped bar charts
     */
    xOffset?: VegaLitePositionEncoding;
    /**
     * Tooltip encoding (single field or array of fields)
     */
    tooltip?: any;
}

/**
 * Vega-Lite interpolation method
 */
declare type VegaLiteInterpolate = 'linear' | 'linear-closed' | 'step' | 'step-before' | 'step-after' | 'basis' | 'cardinal' | 'monotone' | 'natural';

/**
 * Vega-Lite legend configuration
 */
declare interface VegaLiteLegend {
    /**
     * Legend title
     */
    title?: string | null;
    /**
     * Hide the legend
     */
    disable?: boolean;
}

/**
 * Vega-Lite mark types
 */
declare type VegaLiteMark = 'line' | 'point' | 'circle' | 'square' | 'bar' | 'area' | 'rect' | 'rule' | 'text' | 'arc';

/**
 * Vega-Lite mark definition (can be string or object)
 */
declare type VegaLiteMarkDef = VegaLiteMark | {
    type: VegaLiteMark;
    /**
     * Mark color
     */
    color?: string;
    /**
     * Line interpolation method
     */
    interpolate?: VegaLiteInterpolate;
    /**
     * Point marker visibility
     */
    point?: boolean | {
        filled?: boolean;
        size?: number;
    };
    /**
     * Stroke width
     */
    strokeWidth?: number;
    /**
     * Stroke dash pattern (e.g., [5, 5] for dashed, [2, 2] for dotted)
     */
    strokeDash?: number[];
    /**
     * Fill opacity
     */
    fillOpacity?: number;
    /**
     * Stroke opacity
     */
    strokeOpacity?: number;
    /**
     * Overall opacity
     */
    opacity?: number;
    /**
     * Inner radius for arc/pie/donut marks (0-1 or pixel value)
     */
    innerRadius?: number;
    /**
     * Outer radius for arc/pie marks (pixel value)
     */
    outerRadius?: number;
};

/**
 * Vega-Lite position encoding channel (x or y)
 */
declare interface VegaLitePositionEncoding {
    /**
     * Field name in data
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Axis configuration
     */
    axis?: VegaLiteAxis | null;
    /**
     * Constant value for encoding (for reference lines and annotations)
     */
    value?: number | string | Date;
    /**
     * Datum value for encoding (alternative to value)
     */
    datum?: number | string | Date;
    /**
     * Scale configuration
     */
    scale?: VegaLiteScale | null;
    /**
     * Sort order for categorical axes
     * Supports: 'ascending', 'descending', null, array of values, or object with field/op/order
     */
    sort?: VegaLiteSort;
    /**
     * Binning configuration for histograms
     * Set to true for default binning or provide custom bin parameters
     */
    bin?: boolean | VegaLiteBin;
    /**
     * Stack configuration for area/bar charts
     * - null: disable stacking
     * - 'zero': stack from zero baseline (default for area charts)
     * - 'center': center stack
     * - 'normalize': normalize to 100%
     */
    stack?: null | 'zero' | 'center' | 'normalize';
    /**
     * Aggregate function
     */
    aggregate?: 'count' | 'sum' | 'mean' | 'average' | 'median' | 'min' | 'max';
    /**
     * Axis title (shorthand alternative to axis.title)
     */
    title?: string;
    /**
     * Time unit for temporal fields (e.g., 'yearmonth', 'month', 'day')
     */
    timeUnit?: string;
}

/**
 * Vega-Lite radius encoding channel for polar charts
 */
declare interface VegaLiteRadiusEncoding {
    /**
     * Field name
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Aggregate function
     */
    aggregate?: 'count' | 'sum' | 'mean' | 'average' | 'median' | 'min' | 'max';
    /**
     * Axis configuration
     */
    axis?: VegaLiteAxis | null;
    /**
     * Scale configuration
     */
    scale?: VegaLiteScale | null;
}

/**
 * Vega-Lite scale configuration
 */
declare interface VegaLiteScale {
    /**
     * Scale type
     */
    type?: VegaLiteScaleType;
    /**
     * Domain values [min, max]
     */
    domain?: (number | string)[];
    /**
     * Range values [min, max]
     */
    range?: [number | string, number | string] | string[];
    /**
     * Color scheme name (e.g., 'category10', 'tableau10')
     */
    scheme?: string;
    /**
     * Whether scale domain should include zero
     */
    zero?: boolean;
    /**
     * Whether to reverse the scale
     */
    reverse?: boolean;
}

/**
 * Vega-Lite scale type
 */
declare type VegaLiteScaleType = 'linear' | 'log' | 'pow' | 'sqrt' | 'symlog' | 'time' | 'utc' | 'ordinal' | 'band' | 'point';

/**
 * Vega-Lite shape encoding channel
 */
declare interface VegaLiteShapeEncoding {
    /**
     * Field name for shape encoding
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Fixed shape value
     */
    value?: string;
}

/**
 * Vega-Lite size encoding channel
 */
declare interface VegaLiteSizeEncoding {
    /**
     * Field name for size encoding
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Fixed size value
     */
    value?: number;
}

/**
 * Vega-Lite sort specification
 */
declare type VegaLiteSort = 'ascending' | 'descending' | null | {
    field?: string;
    op?: 'count' | 'sum' | 'mean' | 'average' | 'median' | 'min' | 'max';
    order?: 'ascending' | 'descending';
} | string[];

/**
 * Top-level Vega-Lite specification
 */
export declare interface VegaLiteSpec {
    /**
     * Schema version
     */
    $schema?: string;
    /**
     * Chart title - can be a string or a detailed title configuration
     */
    title?: string | VegaLiteTitleParams;
    /**
     * Chart description
     */
    description?: string;
    /**
     * Chart width
     */
    width?: number | 'container';
    /**
     * Chart height
     */
    height?: number | 'container';
    /**
     * Data specification (for single/layer specs)
     */
    data?: VegaLiteData;
    /**
     * Mark type (for single view)
     */
    mark?: VegaLiteMarkDef;
    /**
     * Encoding channels (for single view)
     */
    encoding?: VegaLiteEncoding;
    /**
     * Horizontal concatenation for multi-plot layouts
     */
    hconcat?: VegaLiteSpec[];
    /**
     * Vertical concatenation for multi-plot layouts
     */
    vconcat?: VegaLiteSpec[];
    /**
     * Layer specification
     */
    layer?: VegaLiteUnitSpec[];
    /**
     * Data transformations
     * TODO: Implement transform pipeline
     */
    transform?: Array<Record<string, unknown>>;
    /**
     * Background color
     */
    background?: string;
    /**
     * Padding configuration
     */
    padding?: number | {
        top?: number;
        bottom?: number;
        left?: number;
        right?: number;
    };
    /**
     * Auto-size configuration
     */
    autosize?: string | {
        type?: string;
        contains?: string;
    };
    /**
     * Configuration overrides
     * TODO: Implement config resolution
     */
    config?: Record<string, unknown>;
    /**
     * Interactive selection definitions
     * TODO: Implement selection support
     */
    selection?: Record<string, unknown>;
    /**
     * Facet specification for small multiples
     * TODO: Implement facet support
     */
    facet?: Record<string, unknown>;
    /**
     * Repeat specification for small multiples
     * TODO: Implement repeat support
     */
    repeat?: Record<string, unknown>;
    /**
     * Scale resolution configuration
     * Controls whether scales are shared or independent across views
     */
    resolve?: {
        scale?: {
            x?: 'shared' | 'independent';
            y?: 'shared' | 'independent';
            color?: 'shared' | 'independent';
            opacity?: 'shared' | 'independent';
            size?: 'shared' | 'independent';
            shape?: 'shared' | 'independent';
        };
        axis?: {
            x?: 'shared' | 'independent';
            y?: 'shared' | 'independent';
        };
        legend?: {
            color?: 'shared' | 'independent';
            opacity?: 'shared' | 'independent';
            size?: 'shared' | 'independent';
            shape?: 'shared' | 'independent';
        };
    };
}

/**
 * Vega-Lite text encoding channel
 */
declare interface VegaLiteTextEncoding {
    /**
     * Field name
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Fixed text value
     */
    value?: string;
    /**
     * Datum value for text encoding
     */
    datum?: string | number;
}

/**
 * Vega-Lite theta encoding channel for pie/donut charts and polar coordinates
 */
declare interface VegaLiteThetaEncoding {
    /**
     * Field name
     */
    field?: string;
    /**
     * Data type
     */
    type?: VegaLiteType;
    /**
     * Aggregate function
     */
    aggregate?: 'count' | 'sum' | 'mean' | 'average' | 'median' | 'min' | 'max';
    /**
     * Axis configuration for polar charts
     */
    axis?: VegaLiteAxis | null;
    /**
     * Scale configuration for polar charts
     */
    scale?: VegaLiteScale | null;
}

/**
 * Vega-Lite title configuration with styling options
 */
declare interface VegaLiteTitleParams {
    /**
     * Title text
     */
    text: string;
    /**
     * Subtitle text
     */
    subtitle?: string;
    /**
     * Font for the title
     */
    font?: string;
    /**
     * Font size for the title
     */
    fontSize?: number;
    /**
     * Font style for the title (e.g., 'normal', 'italic')
     */
    fontStyle?: string;
    /**
     * Font weight for the title (e.g., 'normal', 'bold', 100-900)
     */
    fontWeight?: string | number;
    /**
     * Color of the title text
     */
    color?: string;
    /**
     * Horizontal anchor position for the title
     * - 'start': left-aligned
     * - 'middle': centered
     * - 'end': right-aligned
     */
    anchor?: 'start' | 'middle' | 'end';
    /**
     * Vertical offset from the top of the chart
     */
    offset?: number;
    /**
     * Additional padding around the subtitle
     */
    subtitlePadding?: number;
}

/**
 * Vega-Lite TypeScript interfaces for declarative chart specifications.
 * This is a minimal subset focused on line/point charts with basic encodings.
 *
 * RECOMMENDED: For full type coverage, install the official vega-lite package:
 * ```
 * npm install vega-lite
 * ```
 * Then import `TopLevelSpec` from 'vega-lite' for complete schema support.
 *
 * The types provided here are a lightweight alternative that covers common use cases
 * without requiring the full vega-lite dependency (~5.8MB unpacked).
 *
 * Full Vega-Lite spec: https://vega.github.io/vega-lite/docs/
 *
 * TODO: Add support for:
 * - Transform operations (filter, aggregate, calculate, etc.)
 * - Remote data sources (url, named datasets)
 * - Facet and concatenation for multi-view layouts
 * - Selection interactions
 * - Additional mark types (bar, area, etc.)
 * - Conditional encodings
 * - Tooltip customization
 */
/**
 * Vega-Lite data type for field encodings
 */
declare type VegaLiteType = 'quantitative' | 'temporal' | 'ordinal' | 'nominal' | 'geojson';

/**
 * Base Vega-Lite spec unit (single view)
 */
declare interface VegaLiteUnitSpec {
    /**
     * Mark type
     */
    mark: VegaLiteMarkDef;
    /**
     * Encoding channels
     */
    encoding?: VegaLiteEncoding;
    /**
     * Data specification
     */
    data?: VegaLiteData;
    /**
     * Data transformations
     * TODO: Implement transform pipeline
     */
    transform?: Array<Record<string, unknown>>;
}

/**
 * Schema for VegaDeclarativeChart component
 */
export declare interface VegaSchema {
    /**
     * Vega-Lite specification
     *
     * @see https://vega.github.io/vega-lite/docs/spec.html
     */
    vegaLiteSpec: VegaLiteSpec;
    /**
     * Selected legends for filtering
     */
    selectedLegends?: string[];
}

/**
 * VerticalBarchart component
 * {@docCategory VerticalBarChart}
 */
export declare const VerticalBarChart: React_2.FunctionComponent<VerticalBarChartProps>;

/**
 * {@docCategory ChartData}
 */
export declare interface VerticalBarChartDataPoint {
    /**
     * Independent value of the data point, rendered along the x-axis.
     * If x is a number, then each y-coordinate is plotted at its x-coordinate.
     * If x is a string, then the data is evenly spaced along the x-axis.
     */
    x: number | string | Date;
    /**
     * Dependent value of the data point, rendered along the y-axis.
     */
    y: number;
    /**
     * Legend text for the datapoint in the chart
     */
    legend?: string;
    /**
     * color for the legend in the chart
     */
    color?: string;
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given legend will take
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     * This is an optional prop, If haven't given data will take
     */
    yAxisCalloutData?: string;
    /**
     * data to render the line along with bars
     */
    lineData?: LineDataInVerticalBarChart;
    /**
     * onClick action for each datapoint in the chart
     */
    onClick?: VoidFunction;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
    /**
     * Label to display on the bar
     * This is an optional prop that can be used to show custom text on bars
     */
    barLabel?: string;
}

/**
 * Vertical Bar Chart properties
 * {@docCategory VerticalBarChart}
 */
export declare interface VerticalBarChartProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data?: VerticalBarChartDataPoint[];
    /**
     * Define a custom callout renderer for a data point.
     */
    onRenderCalloutPerDataPoint?: RenderFunction<VerticalBarChartDataPoint>;
    /**
     * Width of each bar in the chart. When set to `undefined` or `'default'`, the bar width defaults to 16px,
     * which may decrease to prevent overlap. When set to `'auto'`, the bar width is calculated from padding values.
     * @default 16
     */
    barWidth?: number | 'default' | 'auto';
    /**
     * Colors from which to select the color of each bar.
     */
    colors?: string[];
    /**
     * chart title for the chart
     */
    chartTitle?: string;
    /**
     * Legend text for the line datapoint in the chart
     */
    lineLegendText?: string;
    /**
     * color for the legend  of the line in the chart
     * @default theme.yellow
     */
    lineLegendColor?: string;
    /**
     * This prop makes sure that all the bars are of same color.
     * it will take the first color from the array of colors in
     * prop `colors` or if  `colors` prop is not given then default color is  palette.blueLight
     * @default false
     */
    useSingleColor?: boolean;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: Partial<VerticalBarChartStyles>;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * it's padding between bar's or lines in the graph
     */
    xAxisPadding?: number;
    /**
     * options for the line drawn
     */
    lineOptions?: LineChartLineOptions;
    /**
     * Prop to hide the bar labels
     * @default false
     */
    hideLabels?: boolean;
    /**
     * Maximum width of a bar, in pixels.
     * @default 24
     */
    maxBarWidth?: number;
    /**
     * Padding between bars as a fraction of the [step](https://d3js.org/d3-scale/band#band_step).
     * Takes a number in the range [0, 1]. Only applicable to string x-axis.
     * @default 2/3
     */
    xAxisInnerPadding?: number;
    /**
     * Padding before the first bar and after the last bar as a fraction of
     * the [step](https://d3js.org/d3-scale/band#band_step). Takes a number in the range [0, 1].
     * Only applicable to string x-axis.
     */
    xAxisOuterPadding?: number;
    /**
     * @default false
     * The prop used to enable gradient fill color for the chart.
     */
    enableGradient?: boolean;
    /**
     * @default false
     * The prop used to enable rounded corners for the chart.
     */
    roundCorners?: boolean;
    /**
     * Specifies the mode of the chart.
     * @default 'default'
     */
    mode?: 'default' | 'plotly' | 'histogram';
}

/**
 * Vertical Bar Chart style properties
 * {@docCategory VerticalBarChart}
 */
export declare interface VerticalBarChartStyleProps extends CartesianChartStyleProps {
    /**
     * color of the datapoint legend
     */
    legendColor?: string;
}

/**
 * Vertical Bar Chart styles
 * {@docCategory VerticalBarChart}
 */
export declare interface VerticalBarChartStyles extends CartesianChartStyles {
    /**
     * Style for the bar labels
     */
    barLabel: string;
    /**
     * Styles for line border
     */
    lineBorder: string;
}

export declare const VerticalStackedBarChart: React_2.FunctionComponent<VerticalStackedBarChartProps>;

/**
 * Vertical Stacked Bar Chart properties
 * {@docCategory VerticalStackedBarChart}
 */
export declare interface VerticalStackedBarChartProps extends CartesianChartProps {
    /**
     * Data to render in the chart.
     */
    data: VerticalStackedChartProps[];
    /**
     * Width of each bar in the chart. When set to `undefined` or `'default'`, the bar width defaults to 16px,
     * which may decrease to prevent overlap. When set to `'auto'`, the bar width is calculated from padding values.
     */
    barWidth?: number | 'default' | 'auto';
    /**
     * Gap (max) between bars in a stack. When non-zero, the bars in a stack will
     * be separated by gaps. The actual size of each gap is calculated as 20% of
     * the height of that stack, with a minimum size of 1px and a maximum given by
     * this prop.
     * @default 0
     */
    barGapMax?: number;
    /**
     * Corner radius of the bars
     * @default 0
     */
    barCornerRadius?: number;
    /**
     * The minimum height of a bar; bars below this height will be displayed at
     * this height. Note that this setting will result in the height of these data
     * points not being to scale.
     * @default 0
     */
    barMinimumHeight?: number;
    /**
     * chart title for the chart
     */
    chartTitle?: string;
    /**
     * To display multi stack callout or single callout
     * @default flase
     */
    isCalloutForStack?: boolean;
    /**
     * Call to provide customized styling that will layer on top of the variant rules.
     */
    styles?: Partial<VerticalStackedBarChartStyles>;
    /**
     * Define a custom callout renderer for a stack; default is to render per data point
     */
    onRenderCalloutPerStack?: RenderFunction<VerticalStackedChartProps>;
    /**
     * Define a custom callout renderer for a data point
     */
    onRenderCalloutPerDataPoint?: RenderFunction<VSChartDataPoint>;
    /**
     * yMinValue is supported for bar charts that has only lines
     */
    yMinValue?: number | undefined;
    /**
     * Allow hover actions on the legend
     * @default true
     */
    allowHoverOnLegend?: boolean;
    /**
     * Click handler for bars; type of data is dependant on isCalloutForStack
     */
    onBarClick?: (event: React_2.MouseEvent<SVGElement>, data: VerticalStackedChartProps | VSChartDataPoint) => void;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * it's padding between bar's or lines in the graph
     */
    xAxisPadding?: number;
    /**
     * options for the line drawn
     */
    lineOptions?: LineChartLineOptions;
    /**
     * Prop to hide the bar labels
     * @default false
     */
    hideLabels?: boolean;
    /**
     * Maximum width of a bar, in pixels.
     * @default 24
     */
    maxBarWidth?: number;
    /**
     * Padding between bars as a fraction of the [step](https://d3js.org/d3-scale/band#band_step).
     * Takes a number in the range [0, 1]. Only applicable to string x-axis.
     * @default 2/3
     */
    xAxisInnerPadding?: number;
    /**
     * Padding before the first bar and after the last bar as a fraction of
     * the [step](https://d3js.org/d3-scale/band#band_step). Takes a number in the range [0, 1].
     * Only applicable to string x-axis.
     */
    xAxisOuterPadding?: number;
    /**
     * @default false
     * The prop used to enable gradient fill color for the chart.
     */
    enableGradient?: boolean;
    /**
     * @default false
     * The prop used to enable rounded corners for the chart.
     */
    roundCorners?: boolean;
    /**
     * Specifies the mode of the chart.
     * @default 'default'
     */
    mode?: 'default' | 'plotly';
}

/**
 * Vertical Stacked Bar Chart style properties
 * {@docCategory VerticalStackedBarChart}
 */
export declare interface VerticalStackedBarChartStyleProps extends CartesianChartStyleProps {
}

/**
 * Vertical Stacked Bar Chart styles
 * {@docCategory VerticalStackedBarChart}
 */
export declare interface VerticalStackedBarChartStyles extends CartesianChartStyles {
    /**
     * Style to change the opacity of bars in dataviz when we hover on a single bar or legends
     */
    opacityChangeOnHover?: string;
    /**
     * Style for the bar labels
     */
    barLabel: string;
}

/**
 * {@docCategory ChartData}
 */
export declare interface VerticalStackedBarDataPoint extends Omit<DataPoint, 'x'> {
    /**
     * Independent value of the data point, rendered along the x-axis.
     * If x is a number, then each y-coordinate is plotted at its x-coordinate.
     * If x is a string, then the data is evenly spaced along the x-axis.
     * If data type on x is Date, then the data is spaced evenly by d3-scale.
     */
    x: number | string | Date;
}

/**
 * {@docCategory ChartProps}
 */
export declare interface VerticalStackedChartProps {
    /**
     * data for the points in the chart
     */
    chartData: VSChartDataPoint[];
    /**
     * Data for x axis label for multistacked Vertical bar chart
     */
    xAxisPoint: number | string | Date;
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given, legend will take
     */
    xAxisCalloutData?: string;
    /**
     * line data to render lines on stacked bar chart
     */
    lineData?: LineDataInVerticalStackedBarChart[];
    /**
     * Accessibility data for Whole stack callout
     */
    stackCallOutAccessibilityData?: AccessibilityProps;
}

/**
 * {@docCategory ChartData}
 */
export declare interface VSChartDataPoint {
    /**
     * data the datapoint in the chart
     */
    data: number | string;
    /**
     * Legend text for the datapoint in the chart
     */
    legend: string;
    /**
     * color for the legend in the chart
     */
    color?: string;
    /**
     * Callout data for x axis
     * This is an optional prop, If haven't given legend will take
     */
    xAxisCalloutData?: string;
    /**
     * Callout data for y axis
     * This is an optional prop, If haven't given data will take
     */
    yAxisCalloutData?: string;
    /**
     * Accessibility data for callout
     */
    callOutAccessibilityData?: AccessibilityProps;
    /**
     * The prop used to define the culture to localized the numbers
     */
    culture?: string;
    /**
     * Label to display on the bar
     * This is an optional prop that can be used to show custom text on bars
     */
    barLabel?: string;
}

/**
 * An HOC to update wrapped component on container resize.
 * {@docCategory ResponsiveContainer}
 */
export declare function withResponsiveContainer<TProps extends Omit<ResponsiveContainerProps, 'children'>>(WrappedComponent: React_2.ComponentType<TProps>): React_2.FC<TProps>;

declare enum XAxisTypes {
    NumericAxis = 0,
    DateAxis = 1,
    StringAxis = 2
}

declare enum YAxisType {
    NumericAxis = 0,
    DateAxis = 1,
    StringAxis = 2
}

export declare interface YValueHover {
    legend?: string;
    y?: number | string;
    color?: string;
    data?: string | number;
    shouldDrawBorderBottom?: boolean;
    yAxisCalloutData?: string | {
        [id: string]: number;
    };
    index?: number;
    callOutAccessibilityData?: AccessibilityProps;
}

export { }