@etus/ui 0.3.2 → 0.4.0-beta.10

package/dist/chunk-37IIHQP4.js

@@ -0,0 +1,233 @@
+import { ChartTooltipContent, ChartContainer, ChartTooltip, ChartLegend, ChartLegendContent } from './chunk-7I6KK6QE.js';
+import { cn } from './chunk-HRNDJU7D.js';
+import * as React from 'react';
+import { BarChart as BarChart$1, CartesianGrid, XAxis, Label, YAxis, Bar } from 'recharts';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function normalizeSeriesConfig(series) {
+  return series.map(
+    (s) => typeof s === "string" ? { dataKey: s } : s
+  );
+}
+function BarChart({
+  allowDecimals = true,
+  ariaLabel,
+  autoMinValue = false,
+  barCategoryGap,
+  barGap = 4,
+  className,
+  config,
+  customTooltip,
+  data,
+  enableLegendSlider = false,
+  gridDashArray = "3 3",
+  intervalType,
+  layout = "vertical",
+  legendPosition = "bottom",
+  maxValue,
+  minValue,
+  onValueChange,
+  radius = 4,
+  series,
+  showGrid = true,
+  showLegend = false,
+  showTooltip = true,
+  showXAxis = true,
+  showYAxis = true,
+  startEndOnly = false,
+  tickGap,
+  tooltipCallback,
+  tooltipIndicator = "dot",
+  variant = "default",
+  xAxisKey,
+  xAxisLabel,
+  xAxisTickFormatter,
+  yAxisLabel,
+  yAxisTickFormatter,
+  yAxisWidth,
+  ...props
+}) {
+  const normalizedSeries = normalizeSeriesConfig(series);
+  const isStacked = variant === "stacked" || variant === "stacked100";
+  const isHorizontal = layout === "horizontal";
+  const prevTooltipStateRef = React.useRef(false);
+  const handleBarClick = React.useCallback(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (dataKey) => (data2) => {
+      if (!onValueChange || !data2?.payload) return;
+      const payload = data2.payload;
+      const value = payload[dataKey];
+      onValueChange({
+        category: payload[xAxisKey],
+        dataKey,
+        payload,
+        value: typeof value === "number" ? value : 0
+      });
+    },
+    [onValueChange, xAxisKey]
+  );
+  const TooltipContentWithCallback = React.useCallback(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (props2) => {
+      const { active = false, label, payload } = props2;
+      if (tooltipCallback && active !== prevTooltipStateRef.current) {
+        prevTooltipStateRef.current = active;
+        tooltipCallback({
+          active,
+          label,
+          payload: payload?.map((p) => ({
+            dataKey: String(p.dataKey),
+            value: p.value,
+            payload: p.payload
+          }))
+        });
+      }
+      return /* @__PURE__ */ jsx(ChartTooltipContent, { indicator: tooltipIndicator, ...props2 });
+    },
+    [tooltipCallback, tooltipIndicator]
+  );
+  const valueDomain = React.useMemo(() => {
+    const min = minValue ?? (autoMinValue ? "auto" : 0);
+    const max = maxValue ?? "auto";
+    return [min, max];
+  }, [autoMinValue, maxValue, minValue]);
+  const categoryTicks = React.useMemo(() => {
+    if (!startEndOnly || data.length < 2) return;
+    const first = data[0];
+    const last = data[data.length - 1];
+    if (!first || !last) return;
+    return [first[xAxisKey], last[xAxisKey]];
+  }, [data, startEndOnly, xAxisKey]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-label": ariaLabel,
+      "data-slot": "bar-chart",
+      role: ariaLabel ? "img" : void 0,
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        ChartContainer,
+        {
+          className: cn(className),
+          config,
+          children: /* @__PURE__ */ jsxs(
+            BarChart$1,
+            {
+              accessibilityLayer: true,
+              margin: {
+                left: yAxisLabel ? 20 : 12,
+                right: 12,
+                bottom: xAxisLabel ? 20 : 0
+              },
+              barCategoryGap,
+              barGap,
+              data,
+              layout: isHorizontal ? "vertical" : "horizontal",
+              children: [
+                showGrid && /* @__PURE__ */ jsx(
+                  CartesianGrid,
+                  {
+                    horizontal: !isHorizontal,
+                    strokeDasharray: gridDashArray,
+                    vertical: isHorizontal
+                  }
+                ),
+                showXAxis && (isHorizontal ? /* @__PURE__ */ jsx(
+                  XAxis,
+                  {
+                    axisLine: false,
+                    domain: valueDomain,
+                    interval: intervalType,
+                    minTickGap: tickGap,
+                    tickFormatter: xAxisTickFormatter,
+                    tickLine: false,
+                    tickMargin: 8,
+                    type: "number",
+                    children: xAxisLabel && /* @__PURE__ */ jsx(Label, { offset: -5, position: "insideBottom", value: xAxisLabel })
+                  }
+                ) : /* @__PURE__ */ jsx(
+                  XAxis,
+                  {
+                    axisLine: false,
+                    dataKey: xAxisKey,
+                    interval: intervalType,
+                    minTickGap: tickGap,
+                    tickFormatter: xAxisTickFormatter,
+                    tickLine: false,
+                    tickMargin: 8,
+                    ticks: categoryTicks,
+                    children: xAxisLabel && /* @__PURE__ */ jsx(Label, { offset: -5, position: "insideBottom", value: xAxisLabel })
+                  }
+                )),
+                showYAxis && (isHorizontal ? /* @__PURE__ */ jsx(
+                  YAxis,
+                  {
+                    axisLine: false,
+                    dataKey: xAxisKey,
+                    tickFormatter: yAxisTickFormatter,
+                    tickLine: false,
+                    tickMargin: 8,
+                    ticks: categoryTicks,
+                    type: "category",
+                    width: yAxisWidth,
+                    children: yAxisLabel && /* @__PURE__ */ jsx(Label, { angle: -90, offset: -5, position: "insideLeft", value: yAxisLabel })
+                  }
+                ) : /* @__PURE__ */ jsx(
+                  YAxis,
+                  {
+                    allowDecimals,
+                    axisLine: false,
+                    domain: valueDomain,
+                    tickFormatter: yAxisTickFormatter,
+                    tickLine: false,
+                    tickMargin: 8,
+                    width: yAxisWidth,
+                    children: yAxisLabel && /* @__PURE__ */ jsx(Label, { angle: -90, offset: -5, position: "insideLeft", value: yAxisLabel })
+                  }
+                )),
+                showTooltip && /* @__PURE__ */ jsx(
+                  ChartTooltip,
+                  {
+                    content: customTooltip ?? (tooltipCallback ? /* @__PURE__ */ jsx(TooltipContentWithCallback, {}) : /* @__PURE__ */ jsx(ChartTooltipContent, { indicator: tooltipIndicator })),
+                    cursor: false
+                  }
+                ),
+                showLegend && /* @__PURE__ */ jsx(
+                  ChartLegend,
+                  {
+                    align: legendPosition === "left" ? "left" : legendPosition === "right" ? "right" : "center",
+                    content: /* @__PURE__ */ jsx(ChartLegendContent, { enableSlider: enableLegendSlider }),
+                    layout: legendPosition === "left" || legendPosition === "right" ? "vertical" : "horizontal",
+                    verticalAlign: legendPosition === "top" ? "top" : legendPosition === "bottom" ? "bottom" : "middle"
+                  }
+                ),
+                normalizedSeries.map((seriesConfig) => {
+                  const { dataKey, radius: seriesRadius, stackId } = seriesConfig;
+                  const fill = `var(--color-${dataKey})`;
+                  const barRadius = seriesRadius ?? radius;
+                  return /* @__PURE__ */ jsx(
+                    Bar,
+                    {
+                      dataKey,
+                      fill,
+                      radius: barRadius,
+                      stackId: isStacked ? "bar-stack" : stackId,
+                      style: onValueChange ? { cursor: "pointer" } : void 0,
+                      onClick: onValueChange ? handleBarClick(dataKey) : void 0
+                    },
+                    dataKey
+                  );
+                })
+              ]
+            }
+          )
+        }
+      )
+    }
+  );
+}
+BarChart.displayName = "BarChart";
+
+export { BarChart };
+//# sourceMappingURL=chunk-37IIHQP4.js.map
+//# sourceMappingURL=chunk-37IIHQP4.js.map

package/dist/chunk-37IIHQP4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/BarChart/BarChart.tsx"],"names":["data","props","RechartsBarChart"],"mappings":";;;;;;AA6BA,SAAS,sBACP,MAAA,EACwB;AACxB,EAAA,OAAO,MAAA,CAAO,GAAA;AAAA,IAAI,CAAC,MACjB,OAAO,CAAA,KAAM,WAAW,EAAE,OAAA,EAAS,GAAE,GAAI;AAAA,GAC3C;AACF;AA6BO,SAAS,QAAA,CAAS;AAAA,EACvB,aAAA,GAAgB,IAAA;AAAA,EAChB,SAAA;AAAA,EACA,YAAA,GAAe,KAAA;AAAA,EACf,cAAA;AAAA,EACA,MAAA,GAAS,CAAA;AAAA,EACT,SAAA;AAAA,EACA,MAAA;AAAA,EACA,aAAA;AAAA,EACA,IAAA;AAAA,EACA,kBAAA,GAAqB,KAAA;AAAA,EACrB,aAAA,GAAgB,KAAA;AAAA,EAChB,YAAA;AAAA,EACA,MAAA,GAAS,UAAA;AAAA,EACT,cAAA,GAAiB,QAAA;AAAA,EACjB,QAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAA;AAAA,EACA,MAAA,GAAS,CAAA;AAAA,EACT,MAAA;AAAA,EACA,QAAA,GAAW,IAAA;AAAA,EACX,UAAA,GAAa,KAAA;AAAA,EACb,WAAA,GAAc,IAAA;AAAA,EACd,SAAA,GAAY,IAAA;AAAA,EACZ,SAAA,GAAY,IAAA;AAAA,EACZ,YAAA,GAAe,KAAA;AAAA,EACf,OAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA,GAAmB,KAAA;AAAA,EACnB,OAAA,GAAU,SAAA;AAAA,EACV,QAAA;AAAA,EACA,UAAA;AAAA,EACA,kBAAA;AAAA,EACA,UAAA;AAAA,EACA,kBAAA;AAAA,EACA,UAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,MAAM,gBAAA,GAAmB,sBAAsB,MAAM,CAAA;AACrD,EAAA,MAAM,SAAA,GAAY,OAAA,KAAY,SAAA,IAAa,OAAA,KAAY,YAAA;AACvD,EAAA,MAAM,eAAe,MAAA,KAAW,YAAA;AAChC,EAAA,MAAM,mBAAA,GAA4B,aAAgB,KAAK,CAAA;AAGvD,EAAA,MAAM,cAAA,GAAuB,KAAA,CAAA,WAAA;AAAA;AAAA,IAE3B,CAAC,OAAA,KAAoB,CAACA,KAAAA,KAAc;AAElC,MAAA,IAAI,CAAC,aAAA,IAAiB,CAACA,KAAAA,EAAM,OAAA,EAAS;AAEtC,MAAA,MAAM,UAAUA,KAAAA,CAAK,OAAA;AACrB,MAAA,MAAM,KAAA,GAAQ,QAAQ,OAAO,CAAA;AAC7B,MAAA,aAAA,CAAc;AAAA,QACZ,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,QAC1B,OAAA;AAAA,QACA,OAAA;AAAA,QACA,KAAA,EAAO,OAAO,KAAA,KAAU,QAAA,GAAW,KAAA,GAAQ;AAAA,OAC5C,CAAA;AAAA,IACH,CAAA;AAAA,IACA,CAAC,eAAe,QAAQ;AAAA,GAC1B;AAIA,EAAA,MAAM,0BAAA,GAAmC,KAAA,CAAA,WAAA;AAAA;AAAA,IAEvC,CAACC,MAAAA,KAAe;AACd,MAAA,MAAM,EAAE,MAAA,GAAS,KAAA,EAAO,KAAA,EAAO,SAAQ,GAAIA,MAAAA;AAG3C,MAAA,IAAI,eAAA,IAAmB,MAAA,KAAW,mBAAA,CAAoB,OAAA,EAAS;AAC7D,QAAA,mBAAA,CAAoB,OAAA,GAAU,MAAA;AAC9B,QAAA,eAAA,CAAgB;AAAA,UACd,MAAA;AAAA,UACA,KAAA;AAAA,UACA,OAAA,EAAS,OAAA,EAAS,GAAA,CAAI,CAAC,CAAA,MAAuF;AAAA,YAC5G,OAAA,EAAS,MAAA,CAAO,CAAA,CAAE,OAAO,CAAA;AAAA,YACzB,OAAO,CAAA,CAAE,KAAA;AAAA,YACT,SAAS,CAAA,CAAE;AAAA,WACb,CAAE;AAAA,SACH,CAAA;AAAA,MACH;AAEA,MAAA,uBAAO,GAAA,CAAC,mBAAA,EAAA,EAAoB,SAAA,EAAW,gBAAA,EAAmB,GAAGA,MAAAA,EAAO,CAAA;AAAA,IACtE,CAAA;AAAA,IACA,CAAC,iBAAiB,gBAAgB;AAAA,GACpC;AAGA,EAAA,MAAM,WAAA,GAAoB,cAAQ,MAAM;AACtC,IAAA,MAAM,GAAA,GAAM,QAAA,KAAa,YAAA,GAAe,MAAA,GAAS,CAAA,CAAA;AACjD,IAAA,MAAM,MAAM,QAAA,IAAY,MAAA;AACxB,IAAA,OAAO,CAAC,KAAK,GAAG,CAAA;AAAA,EAClB,CAAA,EAAG,CAAC,YAAA,EAAc,QAAA,EAAU,QAAQ,CAAC,CAAA;AAGrC,EAAA,MAAM,aAAA,GAAsB,cAAQ,MAAM;AACxC,IAAA,IAAI,CAAC,YAAA,IAAgB,IAAA,CAAK,MAAA,GAAS,CAAA,EAAG;AACtC,IAAA,MAAM,KAAA,GAAQ,KAAK,CAAC,CAAA;AACpB,IAAA,MAAM,IAAA,GAAO,IAAA,CAAK,IAAA,CAAK,MAAA,GAAS,CAAC,CAAA;AACjC,IAAA,IAAI,CAAC,KAAA,IAAS,CAAC,IAAA,EAAM;AACrB,IAAA,OAAO,CAAC,KAAA,CAAM,QAAQ,CAAA,EAAG,IAAA,CAAK,QAAQ,CAAC,CAAA;AAAA,EACzC,CAAA,EAAG,CAAC,IAAA,EAAM,YAAA,EAAc,QAAQ,CAAC,CAAA;AAEjC,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,YAAA,EAAY,SAAA;AAAA,MACZ,WAAA,EAAU,WAAA;AAAA,MACV,IAAA,EAAM,YAAY,KAAA,GAAQ,MAAA;AAAA,MACzB,GAAG,KAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,SAAS,CAAA;AAAA,UACvB,MAAA;AAAA,UAEA,QAAA,kBAAA,IAAA;AAAA,YAACC,UAAA;AAAA,YAAA;AAAA,cACC,kBAAA,EAAkB,IAAA;AAAA,cAClB,MAAA,EAAQ;AAAA,gBACN,IAAA,EAAM,aAAa,EAAA,GAAK,EAAA;AAAA,gBACxB,KAAA,EAAO,EAAA;AAAA,gBACP,MAAA,EAAQ,aAAa,EAAA,GAAK;AAAA,eAC5B;AAAA,cACA,cAAA;AAAA,cACA,MAAA;AAAA,cACA,IAAA;AAAA,cACA,MAAA,EAAQ,eAAe,UAAA,GAAa,YAAA;AAAA,cAEnC,QAAA,EAAA;AAAA,gBAAA,QAAA,oBACC,GAAA;AAAA,kBAAC,aAAA;AAAA,kBAAA;AAAA,oBACC,YAAY,CAAC,YAAA;AAAA,oBACb,eAAA,EAAiB,aAAA;AAAA,oBACjB,QAAA,EAAU;AAAA;AAAA,iBACZ;AAAA,gBAGD,cACC,YAAA,mBACE,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,QAAA,EAAU,KAAA;AAAA,oBACV,MAAA,EAAQ,WAAA;AAAA,oBACR,QAAA,EAAU,YAAA;AAAA,oBACV,UAAA,EAAY,OAAA;AAAA,oBACZ,aAAA,EAAe,kBAAA;AAAA,oBACf,QAAA,EAAU,KAAA;AAAA,oBACV,UAAA,EAAY,CAAA;AAAA,oBACZ,IAAA,EAAK,QAAA;AAAA,oBAEJ,QAAA,EAAA,UAAA,wBACE,KAAA,EAAA,EAAM,MAAA,EAAQ,IAAI,QAAA,EAAS,cAAA,EAAe,OAAO,UAAA,EAAY;AAAA;AAAA,iBAElE,mBAEA,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,QAAA,EAAU,KAAA;AAAA,oBACV,OAAA,EAAS,QAAA;AAAA,oBACT,QAAA,EAAU,YAAA;AAAA,oBACV,UAAA,EAAY,OAAA;AAAA,oBACZ,aAAA,EAAe,kBAAA;AAAA,oBACf,QAAA,EAAU,KAAA;AAAA,oBACV,UAAA,EAAY,CAAA;AAAA,oBACZ,KAAA,EAAO,aAAA;AAAA,oBAEN,QAAA,EAAA,UAAA,wBACE,KAAA,EAAA,EAAM,MAAA,EAAQ,IAAI,QAAA,EAAS,cAAA,EAAe,OAAO,UAAA,EAAY;AAAA;AAAA,iBAElE,CAAA;AAAA,gBAIH,cACC,YAAA,mBACE,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,QAAA,EAAU,KAAA;AAAA,oBACV,OAAA,EAAS,QAAA;AAAA,oBACT,aAAA,EAAe,kBAAA;AAAA,oBACf,QAAA,EAAU,KAAA;AAAA,oBACV,UAAA,EAAY,CAAA;AAAA,oBACZ,KAAA,EAAO,aAAA;AAAA,oBACP,IAAA,EAAK,UAAA;AAAA,oBACL,KAAA,EAAO,UAAA;AAAA,oBAEN,QAAA,EAAA,UAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAM,KAAA,EAAO,GAAA,EAAK,QAAQ,EAAA,EAAI,QAAA,EAAS,YAAA,EAAa,KAAA,EAAO,UAAA,EAAY;AAAA;AAAA,iBAE5E,mBAEA,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,aAAA;AAAA,oBACA,QAAA,EAAU,KAAA;AAAA,oBACV,MAAA,EAAQ,WAAA;AAAA,oBACR,aAAA,EAAe,kBAAA;AAAA,oBACf,QAAA,EAAU,KAAA;AAAA,oBACV,UAAA,EAAY,CAAA;AAAA,oBACZ,KAAA,EAAO,UAAA;AAAA,oBAEN,QAAA,EAAA,UAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAM,KAAA,EAAO,GAAA,EAAK,QAAQ,EAAA,EAAI,QAAA,EAAS,YAAA,EAAa,KAAA,EAAO,UAAA,EAAY;AAAA;AAAA,iBAE5E,CAAA;AAAA,gBAIH,WAAA,oBACC,GAAA;AAAA,kBAAC,YAAA;AAAA,kBAAA;AAAA,oBACC,OAAA,EACE,kBACM,eAAA,mBACA,GAAA,CAAC,8BAA2B,CAAA,mBAC5B,GAAA,CAAC,mBAAA,EAAA,EAAoB,SAAA,EAAW,gBAAA,EAAkB,CAAA,CAAA;AAAA,oBAE1D,MAAA,EAAQ;AAAA;AAAA,iBACV;AAAA,gBAGD,UAAA,oBACC,GAAA;AAAA,kBAAC,WAAA;AAAA,kBAAA;AAAA,oBACC,OAAO,cAAA,KAAmB,MAAA,GAAS,MAAA,GAAS,cAAA,KAAmB,UAAU,OAAA,GAAU,QAAA;AAAA,oBACnF,OAAA,kBAAS,GAAA,CAAC,kBAAA,EAAA,EAAmB,YAAA,EAAc,kBAAA,EAAoB,CAAA;AAAA,oBAC/D,MAAA,EAAQ,cAAA,KAAmB,MAAA,IAAU,cAAA,KAAmB,UAAU,UAAA,GAAa,YAAA;AAAA,oBAC/E,eAAe,cAAA,KAAmB,KAAA,GAAQ,KAAA,GAAQ,cAAA,KAAmB,WAAW,QAAA,GAAW;AAAA;AAAA,iBAC7F;AAAA,gBAGD,gBAAA,CAAiB,GAAA,CAAI,CAAC,YAAA,KAAiB;AACtC,kBAAA,MAAM,EAAE,OAAA,EAAS,MAAA,EAAQ,YAAA,EAAc,SAAQ,GAAI,YAAA;AAEnD,kBAAA,MAAM,IAAA,GAAO,eAAe,OAAO,CAAA,CAAA,CAAA;AACnC,kBAAA,MAAM,YAAY,YAAA,IAAgB,MAAA;AAElC,kBAAA,uBACE,GAAA;AAAA,oBAAC,GAAA;AAAA,oBAAA;AAAA,sBAEC,OAAA;AAAA,sBACA,IAAA;AAAA,sBACA,MAAA,EAAQ,SAAA;AAAA,sBACR,OAAA,EAAS,YAAY,WAAA,GAAc,OAAA;AAAA,sBACnC,KAAA,EAAO,aAAA,GAAgB,EAAE,MAAA,EAAQ,WAAU,GAAI,MAAA;AAAA,sBAC/C,OAAA,EAAS,aAAA,GAAgB,cAAA,CAAe,OAAO,CAAA,GAAI;AAAA,qBAAA;AAAA,oBAN9C;AAAA,mBAOP;AAAA,gBAEJ,CAAC;AAAA;AAAA;AAAA;AACH;AAAA;AACF;AAAA,GACF;AAEJ;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-37IIHQP4.js","sourcesContent":["\"use client\"\n\nimport type {\n  BarChartProps,\n  BarChartSeriesConfig,\n} from \"./BarChart.types\"\n\nimport * as React from \"react\"\nimport {\n  Bar,\n  CartesianGrid,\n  Label,\n  BarChart as RechartsBarChart,\n  XAxis,\n  YAxis,\n} from \"recharts\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n} from \"../Chart\"\n\n/**\n * Normalize series to BarChartSeriesConfig format\n */\nfunction normalizeSeriesConfig(\n  series: (BarChartSeriesConfig | string)[]\n): BarChartSeriesConfig[] {\n  return series.map((s) =>\n    typeof s === \"string\" ? { dataKey: s } : s\n  )\n}\n\n/**\n * BarChart - Data visualization component for categorical comparisons\n *\n * Displays quantitative values as rectangular bars. The height or width\n * of bars is proportional to the values they represent. Ideal for\n * comparing values between categories.\n *\n * @example\n * ```tsx\n * const data = [\n *   { month: \"Jan\", desktop: 186, mobile: 80 },\n *   { month: \"Feb\", desktop: 305, mobile: 200 },\n * ]\n *\n * const config = {\n *   desktop: { label: \"Desktop\", color: \"hsl(var(--chart-1))\" },\n *   mobile: { label: \"Mobile\", color: \"hsl(var(--chart-2))\" },\n * }\n *\n * <BarChart\n *   data={data}\n *   config={config}\n *   xAxisKey=\"month\"\n *   series={[\"desktop\", \"mobile\"]}\n * />\n * ```\n */\nexport function BarChart({\n  allowDecimals = true,\n  ariaLabel,\n  autoMinValue = false,\n  barCategoryGap,\n  barGap = 4,\n  className,\n  config,\n  customTooltip,\n  data,\n  enableLegendSlider = false,\n  gridDashArray = \"3 3\",\n  intervalType,\n  layout = \"vertical\",\n  legendPosition = \"bottom\",\n  maxValue,\n  minValue,\n  onValueChange,\n  radius = 4,\n  series,\n  showGrid = true,\n  showLegend = false,\n  showTooltip = true,\n  showXAxis = true,\n  showYAxis = true,\n  startEndOnly = false,\n  tickGap,\n  tooltipCallback,\n  tooltipIndicator = \"dot\",\n  variant = \"default\",\n  xAxisKey,\n  xAxisLabel,\n  xAxisTickFormatter,\n  yAxisLabel,\n  yAxisTickFormatter,\n  yAxisWidth,\n  ...props\n}: BarChartProps) {\n  const normalizedSeries = normalizeSeriesConfig(series)\n  const isStacked = variant === \"stacked\" || variant === \"stacked100\"\n  const isHorizontal = layout === \"horizontal\"\n  const prevTooltipStateRef = React.useRef<boolean>(false)\n\n  // Handle bar click for onValueChange\n  const handleBarClick = React.useCallback(\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (dataKey: string) => (data: any) => {\n      // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n      if (!onValueChange || !data?.payload) return\n      // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n      const payload = data.payload as Record<string, unknown>\n      const value = payload[dataKey]\n      onValueChange({\n        category: payload[xAxisKey],\n        dataKey,\n        payload,\n        value: typeof value === \"number\" ? value : 0,\n      })\n    },\n    [onValueChange, xAxisKey]\n  )\n\n  /* eslint-disable react-hooks/static-components, @eslint-react/no-nested-component-definitions, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access -- Intentional: memoized render function with Recharts any-typed props */\n  // Custom tooltip content wrapper for tooltipCallback\n  const TooltipContentWithCallback = React.useCallback(\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (props: any) => {\n      const { active = false, label, payload } = props\n\n      // Call tooltipCallback when state changes\n      if (tooltipCallback && active !== prevTooltipStateRef.current) {\n        prevTooltipStateRef.current = active\n        tooltipCallback({\n          active,\n          label,\n          payload: payload?.map((p: { dataKey: number | string; payload: Record<string, unknown>; value: number; }) => ({\n            dataKey: String(p.dataKey),\n            value: p.value,\n            payload: p.payload,\n          })),\n        })\n      }\n\n      return <ChartTooltipContent indicator={tooltipIndicator} {...props} />\n    },\n    [tooltipCallback, tooltipIndicator]\n  )\n\n  // Calculate value axis domain\n  const valueDomain = React.useMemo(() => {\n    const min = minValue ?? (autoMinValue ? \"auto\" : 0)\n    const max = maxValue ?? \"auto\"\n    return [min, max] as const\n  }, [autoMinValue, maxValue, minValue])\n\n  // Calculate category axis ticks for startEndOnly\n  const categoryTicks = React.useMemo(() => {\n    if (!startEndOnly || data.length < 2) return\n    const first = data[0]\n    const last = data[data.length - 1]\n    if (!first || !last) return\n    return [first[xAxisKey], last[xAxisKey]] as string[]\n  }, [data, startEndOnly, xAxisKey])\n\n  return (\n    <div\n      aria-label={ariaLabel}\n      data-slot=\"bar-chart\"\n      role={ariaLabel ? \"img\" : undefined}\n      {...props}\n    >\n      <ChartContainer\n        className={cn(className)}\n        config={config}\n      >\n        <RechartsBarChart\n          accessibilityLayer\n          margin={{\n            left: yAxisLabel ? 20 : 12,\n            right: 12,\n            bottom: xAxisLabel ? 20 : 0,\n          }}\n          barCategoryGap={barCategoryGap}\n          barGap={barGap}\n          data={data}\n          layout={isHorizontal ? \"vertical\" : \"horizontal\"}\n        >\n          {showGrid && (\n            <CartesianGrid\n              horizontal={!isHorizontal}\n              strokeDasharray={gridDashArray}\n              vertical={isHorizontal}\n            />\n          )}\n\n          {showXAxis && (\n            isHorizontal ? (\n              <XAxis\n                axisLine={false}\n                domain={valueDomain}\n                interval={intervalType}\n                minTickGap={tickGap}\n                tickFormatter={xAxisTickFormatter}\n                tickLine={false}\n                tickMargin={8}\n                type=\"number\"\n              >\n                {xAxisLabel && (\n                  <Label offset={-5} position=\"insideBottom\" value={xAxisLabel} />\n                )}\n              </XAxis>\n            ) : (\n              <XAxis\n                axisLine={false}\n                dataKey={xAxisKey}\n                interval={intervalType}\n                minTickGap={tickGap}\n                tickFormatter={xAxisTickFormatter}\n                tickLine={false}\n                tickMargin={8}\n                ticks={categoryTicks}\n              >\n                {xAxisLabel && (\n                  <Label offset={-5} position=\"insideBottom\" value={xAxisLabel} />\n                )}\n              </XAxis>\n            )\n          )}\n\n          {showYAxis && (\n            isHorizontal ? (\n              <YAxis\n                axisLine={false}\n                dataKey={xAxisKey}\n                tickFormatter={yAxisTickFormatter}\n                tickLine={false}\n                tickMargin={8}\n                ticks={categoryTicks}\n                type=\"category\"\n                width={yAxisWidth}\n              >\n                {yAxisLabel && (\n                  <Label angle={-90} offset={-5} position=\"insideLeft\" value={yAxisLabel} />\n                )}\n              </YAxis>\n            ) : (\n              <YAxis\n                allowDecimals={allowDecimals}\n                axisLine={false}\n                domain={valueDomain}\n                tickFormatter={yAxisTickFormatter}\n                tickLine={false}\n                tickMargin={8}\n                width={yAxisWidth}\n              >\n                {yAxisLabel && (\n                  <Label angle={-90} offset={-5} position=\"insideLeft\" value={yAxisLabel} />\n                )}\n              </YAxis>\n            )\n          )}\n\n          {showTooltip && (\n            <ChartTooltip\n              content={\n                customTooltip\n                  ?? (tooltipCallback\n                    ? <TooltipContentWithCallback />\n                    : <ChartTooltipContent indicator={tooltipIndicator} />)\n              }\n              cursor={false}\n            />\n          )}\n\n          {showLegend && (\n            <ChartLegend\n              align={legendPosition === \"left\" ? \"left\" : legendPosition === \"right\" ? \"right\" : \"center\"}\n              content={<ChartLegendContent enableSlider={enableLegendSlider} />}\n              layout={legendPosition === \"left\" || legendPosition === \"right\" ? \"vertical\" : \"horizontal\"}\n              verticalAlign={legendPosition === \"top\" ? \"top\" : legendPosition === \"bottom\" ? \"bottom\" : \"middle\"}\n            />\n          )}\n\n          {normalizedSeries.map((seriesConfig) => {\n            const { dataKey, radius: seriesRadius, stackId } = seriesConfig\n\n            const fill = `var(--color-${dataKey})`\n            const barRadius = seriesRadius ?? radius\n\n            return (\n              <Bar\n                key={dataKey}\n                dataKey={dataKey}\n                fill={fill}\n                radius={barRadius}\n                stackId={isStacked ? \"bar-stack\" : stackId}\n                style={onValueChange ? { cursor: \"pointer\" } : undefined}\n                onClick={onValueChange ? handleBarClick(dataKey) : undefined}\n              />\n            )\n          })}\n        </RechartsBarChart>\n      </ChartContainer>\n    </div>\n  )\n}\n\nBarChart.displayName = \"BarChart\"\n"]}