import { jsx, jsxs, Fragment } from "react/jsx-runtime";
import { SSRSafeResponsiveContainer } from "./ssr-safe-container.js";
import { cn } from "../utils/cn.js";
import { calculateLabelSettings, extractDataRange, calculateYAxisWidth, defaultYAxisWidth, getChartMargin, defaultGridProps, CustomXAxisTick, defaultYAxisTickFormatter, CustomYAxisTick, defaultLegendProps, getDefaultChartColor } from "./chart-utils.js";
import * as React from "react";
import { forwardRef } from "react";
import { J as arrayTooltipSearcher, T as Tooltip } from "../../RechartsWrapper-B6DckFGn.js";
import { C as CartesianChart } from "../../CartesianChart-6PlEqMR8.js";
import { C as CartesianGrid, X as XAxis, Y as YAxis } from "../../YAxis-DXrEaAmy.js";
import { L as Legend } from "../../CategoricalChart-B4Tr_94h.js";
import { B as Bar } from "../../barSelectors-BJrDdWIm.js";
var allowedTooltipTypes = ["axis", "item"];
var BarChart$1 = /* @__PURE__ */ forwardRef((props, ref) => {
  return /* @__PURE__ */ React.createElement(CartesianChart, {
    chartName: "BarChart",
    defaultTooltipEventType: "axis",
    validateTooltipEventTypes: allowedTooltipTypes,
    tooltipPayloadSearcher: arrayTooltipSearcher,
    categoricalChartProps: props,
    ref
  });
});
const CustomTooltip = ({ active, payload, label }) => {
  if (active && payload && payload.length) {
    return /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-subtle bg-popover/95 backdrop-blur-md p-3 shadow-2xl", children: [
      /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-strong mb-2", children: label }),
      /* @__PURE__ */ jsx("div", { className: "space-y-1", children: payload.map((entry, index) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ jsx(
          "div",
          {
            className: "w-2 h-2 rounded-full",
            style: { backgroundColor: entry.color }
          }
        ),
        /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium text-subtle", children: [
          entry.name,
          ":"
        ] }),
        /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-strong ml-auto", children: typeof entry.value === "number" ? entry.value.toLocaleString() : entry.value })
      ] }, index)) })
    ] });
  }
  return null;
};
function BarChart({
  data,
  config,
  className,
  showGrid = true,
  showTooltip = true,
  showLegend = false,
  showXAxis = true,
  showYAxis = true,
  xAxisKey = "name",
  xAxisProps,
  yAxisProps,
  tooltipProps,
  legendProps,
  barProps,
  height = 400,
  width = "100%",
  layout = "horizontal"
}) {
  const getColor = (index, customColor) => {
    if (customColor) return customColor;
    return getDefaultChartColor(index);
  };
  const xLabels = data.map((item) => String(item[xAxisKey] || ""));
  const labelSettings = calculateLabelSettings(
    xLabels,
    typeof width === "number" ? width : 800
  );
  const dataRange = layout === "horizontal" ? extractDataRange(data, Object.keys(config)) : null;
  const yAxisWidth = dataRange && layout === "horizontal" ? calculateYAxisWidth(dataRange.min, dataRange.max, 10) : defaultYAxisWidth;
  return /* @__PURE__ */ jsx("div", { className: cn("w-full focus:outline-none", className), children: /* @__PURE__ */ jsx(SSRSafeResponsiveContainer, { width, height, children: /* @__PURE__ */ jsxs(
    BarChart$1,
    {
      data,
      layout,
      margin: getChartMargin(showLegend),
      children: [
        showGrid && /* @__PURE__ */ jsx(CartesianGrid, { ...defaultGridProps }),
        layout === "horizontal" ? /* @__PURE__ */ jsxs(Fragment, { children: [
          showXAxis && /* @__PURE__ */ jsx(
            XAxis,
            {
              dataKey: xAxisKey,
              stroke: "var(--text-subtle)",
              tick: (props) => /* @__PURE__ */ jsx(
                CustomXAxisTick,
                {
                  ...props,
                  angle: labelSettings.angle,
                  fontSize: labelSettings.fontSize,
                  truncateLength: labelSettings.truncateLength,
                  showTooltip: labelSettings.showTooltip,
                  formatLabels: labelSettings.formatLabels,
                  locale: labelSettings.locale
                }
              ),
              axisLine: false,
              tickLine: { stroke: "var(--border-default)" },
              height: labelSettings.angle !== 0 ? 80 : 30,
              ...xAxisProps
            }
          ),
          showYAxis && /* @__PURE__ */ jsx(
            YAxis,
            {
              stroke: "var(--text-subtle)",
              tick: { fill: "var(--text-subtle)", fontSize: 10 },
              axisLine: false,
              tickLine: false,
              width: yAxisWidth,
              tickFormatter: defaultYAxisTickFormatter,
              ...yAxisProps
            }
          )
        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
          showXAxis && /* @__PURE__ */ jsx(
            XAxis,
            {
              type: "number",
              stroke: "var(--text-subtle)",
              tick: { fill: "var(--text-subtle)", fontSize: 10 },
              axisLine: false,
              ...xAxisProps
            }
          ),
          showYAxis && /* @__PURE__ */ jsx(
            YAxis,
            {
              dataKey: xAxisKey,
              type: "category",
              stroke: "var(--text-subtle)",
              tick: (props) => /* @__PURE__ */ jsx(
                CustomYAxisTick,
                {
                  ...props,
                  fontSize: 10,
                  truncateLength: 25,
                  formatLabels: labelSettings.formatLabels,
                  locale: labelSettings.locale
                }
              ),
              axisLine: { stroke: "var(--border-default)" },
              width: 150,
              ...yAxisProps
            }
          )
        ] }),
        showTooltip && /* @__PURE__ */ jsx(
          Tooltip,
          {
            content: /* @__PURE__ */ jsx(CustomTooltip, {}),
            cursor: { fill: "var(--bg-subtle)" },
            ...tooltipProps
          }
        ),
        showLegend && /* @__PURE__ */ jsx(Legend, { ...defaultLegendProps, ...legendProps }),
        Object.entries(config).map(([key, value], index) => /* @__PURE__ */ jsx(
          Bar,
          {
            dataKey: key,
            name: value.label || key,
            fill: getColor(index, value.color),
            stackId: value.stackId,
            radius: value.stackId ? 0 : [3, 3, 0, 0],
            isAnimationActive: false,
            ...barProps
          },
          key
        ))
      ]
    }
  ) }) });
}
BarChart.displayName = "BarChart";
export {
  BarChart
};
