import { jsxs as C, jsx as i } from "react/jsx-runtime";
/* empty css                    */
import { abbreviateNumber as $ } from "./index-round-number.js";
import { translationService as m } from "./index-translation.service.js";
import { BigLegend as R } from "./index-BigLegend.js";
import { ChartsPlaceholder as v } from "./index-ChartsPlaceholder.js";
import { ComponentContainer as D } from "./index-ComponentContainer.js";
import { Render as I } from "./index-Render.js";
import "react";
import j from "./index-react-apexcharts.min.js";
const X = (n) => {
  const {
    series: d,
    categories: h,
    height: u = "250px",
    showBigLegend: f,
    renderBigLegendFn: c,
    testId: b = "HSBChart_TestId",
    isLoading: x,
    showLegend: w,
    isStacked: g = !0,
    hasPercentageXaxis: p = !1
  } = n, y = (e) => e.map((t) => (t.name = m.get(t.name).value, t)), L = (e) => e.map((t) => (t = m.get(t).value, t)), B = (e) => {
    let t = [], o = !1;
    return e.map((r) => {
      r.data[0] == 0 && (o = !0);
    }), e.length === 1 || o ? t = [8, 8] : t = [0, 8], t;
  }, S = (e = n) => c ? c(e) : i(R, {
    bigLegendData: ((o) => {
      const r = [];
      return o.forEach((s) => {
        typeof s.data[0] == "object" ? s.data.map((a) => {
          const l = a;
          r.push({
            title: s.name,
            currentNumber: l.y
          });
        }) : r.push({
          title: s.name,
          currentNumber: s.data[0]
        });
      }), r;
    })(e.series),
    testId: `${e.testId}_BigLegend`
  }), k = {
    chart: {
      stacked: g,
      stackType: "100%",
      toolbar: {
        show: !1
      }
    },
    plotOptions: {
      bar: {
        horizontal: !0,
        columnWidth: "100%",
        borderRadius: g ? B(d) : 4,
        barHeight: "80%"
      }
    },
    stroke: {
      width: 0
    },
    xaxis: {
      type: "category",
      axisBorder: {
        show: !1
      },
      categories: L(h),
      labels: {
        show: !0,
        style: {
          fontSize: "12px"
        },
        formatter(e) {
          return p ? `${e}%` : $(parseInt(e));
        }
      },
      tooltip: {
        enabled: !1
      }
    },
    yaxis: {
      axisBorder: {
        show: !0
      },
      labels: {
        show: !0,
        style: {
          fontSize: "12px",
          fontFamily: "Roboto",
          fontWeight: 400
        }
      }
    },
    legend: {
      show: w,
      showForSingleSeries: !0,
      position: "bottom",
      fontSize: "12px",
      fontFamily: "Roboto",
      fontWeight: 400,
      markers: {
        width: 15,
        height: 15,
        radius: 10
      },
      labels: {
        colors: "var(--n700)"
      }
    },
    dataLabels: {
      enabled: !1
    },
    grid: {
      show: !0,
      borderColor: "rgba(4, 5, 6, 0.2)",
      strokeDashArray: 6,
      position: "front",
      xaxis: {
        lines: {
          show: !0
        }
      },
      yaxis: {
        lines: {
          show: !1
        }
      }
    },
    tooltip: {
      enabled: !0,
      theme: "dark",
      custom: ({
        series: e,
        dataPointIndex: t,
        w: o
      }) => {
        let r = "";
        return e.forEach((s, a) => {
          const l = p ? "%" : "";
          r += `<div class="tooltip-row">
            <div class="tooltip-color" style="background-color: ${o.config.series[a].color}"></div>
            <span class="tooltip-text-name">${o.config.series[a].name}</span>
            <span class="tooltip-number">${s[t]}${l}</span>
        </div>`;
        }), `<div class="tooltip"><p class="tooltip-title">${o.globals.labels[t]}</p>${r}</div>`;
      }
    }
  };
  return C(D, {
    className: "hsb-chart-container",
    testId: b,
    children: [i(I, {
      if: x,
      children: i(v, {})
    }), f && S(n), i(j, {
      type: "bar",
      options: k,
      series: y(d),
      width: "100%",
      height: u
    })]
  });
};
export {
  X as HSBChart
};
