'use client';
import { __rest, __assign } from '../_virtual/_tslib.js';
import classNames from '../external/classnames/index.js';
import React__default from 'react';
import AutoSizer from '../external/react-virtualized-auto-sizer/dist/react-virtualized-auto-sizer.esm.js';
import styles from './bar-chart.module.css.js';
import { createColorMap, ChartTooltip, ChartLegend, DEFAULT_COLORS } from './chart-components.js';
import { Bar } from '../external/recharts/es6/cartesian/Bar.js';
import { BarChart as BarChart$1 } from '../external/recharts/es6/chart/BarChart.js';
import { CartesianGrid } from '../external/recharts/es6/cartesian/CartesianGrid.js';
import { XAxis } from '../external/recharts/es6/cartesian/XAxis.js';
import { YAxis } from '../external/recharts/es6/cartesian/YAxis.js';
import { Tooltip } from '../external/recharts/es6/component/Tooltip.js';
import { Legend } from '../external/recharts/es6/component/Legend.js';

var BarChart = React__default.forwardRef(function BarChart(_a, ref) {
    var className = _a.className, categories = _a.categories, _b = _a.colors, colors = _b === void 0 ? DEFAULT_COLORS : _b, dark = _a.dark, data = _a.data, index = _a.index, stacked = _a.stacked, otherProps = __rest(_a, ["className", "categories", "colors", "dark", "data", "index", "stacked"]);
    var colorMap = createColorMap({ categories: categories, colors: colors });
    var bars = categories.map(function (category, index) {
        var color = colors[index % colors.length];
        return (React__default.createElement(Bar, { key: index, dataKey: category, fill: color, stackId: stacked ? "a" : undefined, isAnimationActive: false }));
    });
    return (React__default.createElement("div", __assign({ className: classNames(className, styles.root), ref: ref }, otherProps, { style: __assign(__assign({}, otherProps.style), { minHeight: 200, minWidth: 300 }) }),
        React__default.createElement(AutoSizer, null, function (_a) {
            var _b;
            var height = _a.height, width = _a.width;
            return (React__default.createElement(BarChart$1, { className: classNames((_b = {}, _b[styles.dark] = dark, _b)), data: data, height: height, width: width },
                React__default.createElement(CartesianGrid, { className: styles.grid, horizontal: true, vertical: false, strokeWidth: 1 }),
                React__default.createElement(XAxis, { axisLine: false, tickLine: false, padding: { left: 20, right: 20 }, dataKey: index }),
                React__default.createElement(YAxis, { axisLine: false, tickLine: false, width: 30 }),
                React__default.createElement(Tooltip, { content: function (_a) {
                        var active = _a.active, payload = _a.payload, label = _a.label;
                        return (React__default.createElement(ChartTooltip, { active: active, colorMap: colorMap, dark: dark, label: label, payload: payload }));
                    }, cursor: { fill: "#D1D5DB", opacity: "0.15" }, isAnimationActive: false }),
                React__default.createElement(Legend, { content: function (_a) {
                        var payload = _a.payload;
                        return React__default.createElement(ChartLegend, { colorMap: colorMap, dark: dark, payload: payload });
                    }, verticalAlign: "bottom" }),
                bars));
        })));
});

export { BarChart };
//# sourceMappingURL=bar-chart.js.map
