"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var charting_1 = require("@uifabric/charting");
var Styling_1 = require("office-ui-fabric-react/lib-commonjs/Styling");
exports.HorizontalBarChartCustomAccessibilityExample = function () {
    var data = [
        {
            chartTitle: 'one',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about one' },
            chartDataAccessibilityData: { ariaLabel: 'Data 1543 of 15000' },
            chartData: [
                {
                    legend: 'one',
                    horizontalBarChartdata: { x: 1543, y: 15000 },
                    color: Styling_1.DefaultPalette.tealDark,
                    xAxisCalloutData: '2021/06/10',
                    yAxisCalloutData: '41%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart one 2021/06/10 41%' },
                },
            ],
        },
        {
            chartTitle: 'two',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about two' },
            chartDataAccessibilityData: { ariaLabel: 'Data 800 of 15000' },
            chartData: [
                {
                    legend: 'two',
                    horizontalBarChartdata: { x: 800, y: 15000 },
                    color: Styling_1.DefaultPalette.purple,
                    xAxisCalloutData: '2021/06/11',
                    yAxisCalloutData: '52%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart two 2021/06/11 52%' },
                },
            ],
        },
        {
            chartTitle: 'three',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about three' },
            chartDataAccessibilityData: { ariaLabel: 'Data 8888 of 15000' },
            chartData: [
                {
                    legend: 'three',
                    horizontalBarChartdata: { x: 8888, y: 15000 },
                    color: Styling_1.DefaultPalette.redDark,
                    xAxisCalloutData: '2021/06/12',
                    yAxisCalloutData: '63%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart three 2021/06/12 63%' },
                },
            ],
        },
        {
            chartTitle: 'four',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about four' },
            chartDataAccessibilityData: { ariaLabel: 'Data 15888 of 15000' },
            chartData: [
                {
                    legend: 'four',
                    horizontalBarChartdata: { x: 15888, y: 15000 },
                    color: Styling_1.DefaultPalette.themeDarkAlt,
                    xAxisCalloutData: '2021/06/13',
                    yAxisCalloutData: '74%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart four 2021/06/13 74%' },
                },
            ],
        },
        {
            chartTitle: 'five',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about five' },
            chartDataAccessibilityData: { ariaLabel: 'Data 11444 of 15000' },
            chartData: [
                {
                    legend: 'five',
                    horizontalBarChartdata: { x: 11444, y: 15000 },
                    color: Styling_1.DefaultPalette.themePrimary,
                    xAxisCalloutData: '2021/06/14',
                    yAxisCalloutData: '85%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart five 2021/06/14 85%' },
                },
            ],
        },
        {
            chartTitle: 'six',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about six' },
            chartDataAccessibilityData: { ariaLabel: 'Data 14000 of 15000' },
            chartData: [
                {
                    legend: 'six',
                    horizontalBarChartdata: { x: 14000, y: 15000 },
                    color: Styling_1.DefaultPalette.greenDark,
                    xAxisCalloutData: '2021/06/15',
                    yAxisCalloutData: '96%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart six 2021/06/15 96%' },
                },
            ],
        },
        {
            chartTitle: 'seven',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about seven' },
            chartDataAccessibilityData: { ariaLabel: 'Data 9855 of 15000' },
            chartData: [
                {
                    legend: 'seven',
                    horizontalBarChartdata: { x: 9855, y: 15000 },
                    color: Styling_1.DefaultPalette.accent,
                    xAxisCalloutData: '2021/06/16',
                    yAxisCalloutData: '98%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart seven 2021/06/16 98%' },
                },
            ],
        },
        {
            chartTitle: 'eight',
            chartTitleAccessibilityData: { ariaLabel: 'Bar chart depicting about eight' },
            chartDataAccessibilityData: { ariaLabel: 'Data 4250 of 15000' },
            chartData: [
                {
                    legend: 'eight',
                    horizontalBarChartdata: { x: 4250, y: 15000 },
                    color: Styling_1.DefaultPalette.blueLight,
                    xAxisCalloutData: '2021/06/17',
                    yAxisCalloutData: '99%',
                    callOutAccessibilityData: { ariaLabel: 'Bar series 1 of chart eight 2021/06/17 99%' },
                },
            ],
        },
    ];
    return React.createElement(charting_1.HorizontalBarChart, { data: data, width: 600 });
};
//# sourceMappingURL=HorizontalBarChart.CustomAccessibility.Example.js.map