import { BarChart } from "../ChartLibrary/BarChart/BarChart";
import React, { useEffect } from "react";
import DataPointUtil from "../Utils/DataPoint";
import NoDataMessage from "../ChartGroup/NoDataMessage";
export const BarChartPalette = [
    "indigo",
    "rose",
    "emerald",
    "amber",
    "cyan",
    "gray",
    "pink",
    "lime",
    "fuchsia",
];
const BarChartElement = (props) => {
    const [records, setRecords] = React.useState([]);
    const categories = props.data.map((item) => {
        return item.seriesName;
    });
    useEffect(() => {
        const records = DataPointUtil.getChartDataPoints({
            seriesPoints: props.data || [],
            xAxis: props.xAxis,
            yAxis: props.yAxis,
        });
        setRecords(records);
    }, [props.data]);
    const className = props.heightInPx ? `` : "h-80";
    const style = props.heightInPx
        ? { height: `${props.heightInPx}px` }
        : {};
    const hasNoData = !props.data ||
        props.data.length === 0 ||
        props.data.every((series) => {
            return series.data.length === 0;
        });
    return (React.createElement("div", { className: "relative" },
        React.createElement(BarChart, { className: className, style: style, data: records, tickGap: 30, index: "Time", categories: categories, colors: BarChartPalette, valueFormatter: props.yAxis.options.formatter || undefined, showTooltip: true, showLegend: props.showLegend !== false, yAxisWidth: 64, syncid: props.sync ? props.syncid : undefined, onValueChange: () => { }, referenceLines: props.referenceLines }),
        hasNoData && React.createElement(NoDataMessage, null)));
};
export default BarChartElement;
//# sourceMappingURL=BarChart.js.map