@j2-health/design-system 0.5.0 → 0.5.2

package/dist/src/components/barchart/BarChart.cjs

@@ -1,155 +1,127 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const antd = require("antd");
-const react = require("@highcharts/react");
+const require_chart_module = require("./chart.module.css.cjs");
+let antd = require("antd");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _highcharts_react = require("@highcharts/react");
 require("@highcharts/react/modules/Accessibility.js");
 require("@highcharts/react/modules/Exporting.js");
-const chart_module = require("./chart.module.css.cjs");
-const server = require("react-dom/server");
-const BarChart = ({
-  categories,
-  series,
-  min,
-  max,
-  tickInterval,
-  tickFormat,
-  xAxisTitle,
-  yAxisTitle,
-  gridLineColor,
-  gridLineDashStyle,
-  xAxisLabelMaxLines,
-  tooltip,
-  exporting,
-  chartRef,
-  height,
-  width,
-  maxBars = 50,
-  barsWidth = void 0
-}) => {
-  var _a, _b, _c, _d, _e;
-  const limitedCategories = categories.slice(0, maxBars);
-  const limitedSeries = series.map((s) => ({
-    ...s,
-    data: s.data.slice(0, maxBars)
-  }));
-  const { token } = antd.theme.useToken();
-  const baseFont = {
-    fontSize: `${token.fontSize}px`,
-    fontFamily: token.fontFamily,
-    color: token.colorText
-  };
-  const options = {
-    credits: {
-      enabled: false
-    },
-    chart: {
-      type: "column",
-      ...height ? { height } : {},
-      ...width ? { width } : {}
-    },
-    plotOptions: {
-      column: {
-        borderRadius: series[0].data.length > 5 ? "20%" : "15%",
-        ...barsWidth !== void 0 ? { pointWidth: barsWidth } : {}
-      }
-    },
-    exporting: {
-      ...exporting,
-      enabled: false,
-      chartOptions: {
-        ...exporting == null ? void 0 : exporting.chartOptions,
-        title: {
-          align: "left",
-          text: (_b = (_a = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _a.title) == null ? void 0 : _b.text,
-          style: {
-            fontSize: `${token.fontSize}px`,
-            fontFamily: "sans-serif",
-            color: token.colorText,
-            ...(_d = (_c = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _c.title) == null ? void 0 : _d.style
-          }
-        },
-        series: limitedSeries.map((s) => ({
-          type: "column",
-          color: s.color ? s.color : "#253761"
-          // --j2-blue-9
-        })),
-        legend: ((_e = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _e.legend) || { enabled: false }
-      }
-    },
-    title: {
-      text: ""
-    },
-    xAxis: {
-      categories: limitedCategories,
-      title: xAxisTitle ? {
-        text: xAxisTitle,
-        style: { ...baseFont, color: token.colorTextDescription }
-      } : void 0,
-      labels: {
-        y: 30,
-        style: baseFont,
-        ...xAxisLabelMaxLines ? {
-          useHTML: true,
-          formatter: function() {
-            return `<div style="overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;">${this.value}</div>`;
-          }
-        } : {}
-      }
-    },
-    yAxis: {
-      min,
-      max,
-      endOnTick: true,
-      gridLineDashStyle: gridLineDashStyle || "Dot",
-      gridLineColor: gridLineColor || "white",
-      title: yAxisTitle ? {
-        text: yAxisTitle,
-        style: { ...baseFont, color: token.colorTextDescription },
-        x: -10
-      } : void 0,
-      tickInterval,
-      labels: {
-        formatter: tickFormat ? ({ value }) => tickFormat(value) : void 0,
-        style: baseFont
-      }
-    },
-    legend: {
-      enabled: false
-    },
-    series: limitedSeries.map((s) => ({
-      data: s.data,
-      name: s.name,
-      type: "column",
-      color: s.color || "var(--j2-blue-11)",
-      states: {
-        hover: {
-          color: s.hoverColor || token.colorPrimaryTextHover
-        }
-      }
-    })),
-    tooltip: {
-      useHTML: true,
-      outside: true,
-      backgroundColor: "transparent",
-      shadow: false,
-      padding: 0,
-      style: { zIndex: 9999 },
-      formatter: function() {
-        return server.renderToString(
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: chart_module.default.tooltip, children: tooltip(this.key, this.y, this.series.name) })
-        );
-      }
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    react.Chart,
-    {
-      ref: chartRef,
-      options,
-      containerProps: { className: "highcharts-light" }
-    }
-  );
+let react_dom_server = require("react-dom/server");
+//#region src/components/barchart/BarChart.tsx
+var BarChart = ({ categories, series, min, max, tickInterval, tickFormat, xAxisTitle, yAxisTitle, gridLineColor, gridLineDashStyle, xAxisLabelMaxLines, tooltip, exporting, chartRef, height, width, maxBars = 50, barsWidth = void 0 }) => {
+	const limitedCategories = categories.slice(0, maxBars);
+	const limitedSeries = series.map((s) => ({
+		...s,
+		data: s.data.slice(0, maxBars)
+	}));
+	const { token } = antd.theme.useToken();
+	const baseFont = {
+		fontSize: `${token.fontSize}px`,
+		fontFamily: token.fontFamily,
+		color: token.colorText
+	};
+	const options = {
+		credits: { enabled: false },
+		chart: {
+			type: "column",
+			...height ? { height } : {},
+			...width ? { width } : {}
+		},
+		plotOptions: { column: {
+			borderRadius: series[0].data.length > 5 ? "20%" : "15%",
+			...barsWidth !== void 0 ? { pointWidth: barsWidth } : {}
+		} },
+		exporting: {
+			...exporting,
+			enabled: false,
+			chartOptions: {
+				...exporting?.chartOptions,
+				title: {
+					align: "left",
+					text: exporting?.chartOptions?.title?.text,
+					style: {
+						fontSize: `${token.fontSize}px`,
+						fontFamily: "sans-serif",
+						color: token.colorText,
+						...exporting?.chartOptions?.title?.style
+					}
+				},
+				series: limitedSeries.map((s) => ({
+					type: "column",
+					color: s.color ? s.color : "#253761"
+				})),
+				legend: exporting?.chartOptions?.legend || { enabled: false }
+			}
+		},
+		title: { text: "" },
+		xAxis: {
+			categories: limitedCategories,
+			title: xAxisTitle ? {
+				text: xAxisTitle,
+				style: {
+					...baseFont,
+					color: token.colorTextDescription
+				}
+			} : void 0,
+			labels: {
+				y: 30,
+				style: baseFont,
+				...xAxisLabelMaxLines ? {
+					useHTML: true,
+					formatter: function() {
+						return `<div style="overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;">${this.value}</div>`;
+					}
+				} : {}
+			}
+		},
+		yAxis: {
+			min,
+			max,
+			endOnTick: true,
+			gridLineDashStyle: gridLineDashStyle || "Dot",
+			gridLineColor: gridLineColor || "white",
+			title: yAxisTitle ? {
+				text: yAxisTitle,
+				style: {
+					...baseFont,
+					color: token.colorTextDescription
+				},
+				x: -10
+			} : void 0,
+			tickInterval,
+			labels: {
+				formatter: tickFormat ? ({ value }) => tickFormat(value) : void 0,
+				style: baseFont
+			}
+		},
+		legend: { enabled: false },
+		series: limitedSeries.map((s) => ({
+			data: s.data,
+			name: s.name,
+			type: "column",
+			color: s.color || "var(--j2-blue-11)",
+			states: { hover: { color: s.hoverColor || token.colorPrimaryTextHover } }
+		})),
+		tooltip: {
+			useHTML: true,
+			outside: true,
+			backgroundColor: "transparent",
+			shadow: false,
+			padding: 0,
+			style: { zIndex: 9999 },
+			formatter: function() {
+				return (0, react_dom_server.renderToString)(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: require_chart_module.default.tooltip,
+					children: tooltip(this.key, this.y, this.series.name)
+				}));
+			}
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_highcharts_react.Chart, {
+		ref: chartRef,
+		options,
+		containerProps: { className: "highcharts-light" }
+	});
 };
+//#endregion
 exports.BarChart = BarChart;
-//# sourceMappingURL=BarChart.cjs.map
+
+//# sourceMappingURL=BarChart.cjs.map

package/dist/src/components/barchart/BarChart.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BarChart.cjs","sources":["../../../../src/components/barchart/BarChart.tsx"],"sourcesContent":["import { theme } from 'antd'\nimport type * as Highcharts from 'highcharts'\nimport {\n  Chart as HighchartsReact,\n  type HighchartsReactRefObject,\n} from '@highcharts/react'\n// `modules/`, not `options/`. @highcharts/react 5 moved the module entry\n// points and left the old `options/` files in the package still importing\n// `highcharts/esm/…`, while the Chart component now loads\n// `highcharts/es-modules/masters/…`. Those are two different Highcharts\n// instances, so the old path composes the module onto one the chart never\n// uses: no error, no missing export, the module just stops taking effect.\nimport '@highcharts/react/modules/Accessibility.js'\nimport '@highcharts/react/modules/Exporting.js'\nimport styles from './chart.module.css'\nimport { renderToString } from 'react-dom/server'\n\ntype Series = {\n  name?: string\n  data: Highcharts.PointOptionsObject[] | number[]\n  color?: string\n  hoverColor?: string\n}\n\ntype BarChartProps = {\n  categories: string[]\n  series: Series[]\n  min: number\n  max: number | undefined | null\n  tickInterval: number | undefined\n  tickFormat?: (value: number) => string\n  xAxisTitle?: string\n  yAxisTitle?: string\n  gridLineColor?: string\n  gridLineDashStyle?: Highcharts.DashStyleValue\n  xAxisLabelMaxLines?: number\n  tooltip: (\n    category: string | number | undefined,\n    value: number | null | undefined,\n    seriesName: string | undefined\n  ) => React.ReactNode\n  chartRef?: React.RefObject<HighchartsReactRefObject>\n  exporting?: Highcharts.ExportingOptions\n  maxBars?: number\n  barsWidth?: number\n  height?: number\n  width?: number\n}\n\nconst BarChart = ({\n  categories,\n  series,\n  min,\n  max,\n  tickInterval,\n  tickFormat,\n  xAxisTitle,\n  yAxisTitle,\n  gridLineColor,\n  gridLineDashStyle,\n  xAxisLabelMaxLines,\n  tooltip,\n  exporting,\n  chartRef,\n  height,\n  width,\n  maxBars = 50,\n  barsWidth = undefined,\n}: BarChartProps) => {\n  const limitedCategories = categories.slice(0, maxBars)\n  const limitedSeries = series.map((s) => ({\n    ...s,\n    data: s.data.slice(0, maxBars),\n  }))\n\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n  }\n\n  const options: Highcharts.Options = {\n    credits: {\n      enabled: false,\n    },\n    chart: {\n      type: 'column',\n      ...(height ? { height } : {}),\n      ...(width ? { width } : {}),\n    },\n    plotOptions: {\n      column: {\n        borderRadius: series[0].data.length > 5 ? '20%' : '15%',\n        ...(barsWidth !== undefined ? { pointWidth: barsWidth } : {}),\n      },\n    },\n    exporting: {\n      ...exporting,\n      enabled: false,\n      chartOptions: {\n        ...exporting?.chartOptions,\n        title: {\n          align: 'left',\n          text: exporting?.chartOptions?.title?.text,\n          style: {\n            fontSize: `${token.fontSize}px`,\n            fontFamily: 'sans-serif',\n            color: token.colorText,\n            ...exporting?.chartOptions?.title?.style,\n          },\n        },\n        series: limitedSeries.map((s) => ({\n          type: 'column',\n          color: s.color ? s.color : '#253761', // --j2-blue-9\n        })),\n        legend: exporting?.chartOptions?.legend || { enabled: false },\n      },\n    },\n    title: {\n      text: '',\n    },\n    xAxis: {\n      categories: limitedCategories,\n      title: xAxisTitle\n        ? {\n            text: xAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n          }\n        : undefined,\n      labels: {\n        y: 30,\n        style: baseFont,\n        ...(xAxisLabelMaxLines\n          ? {\n              useHTML: true,\n              formatter: function (\n                this: Highcharts.AxisLabelsFormatterContextObject\n              ) {\n                return `<div style=\"overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;\">${this.value}</div>`\n              },\n            }\n          : {}),\n      },\n    },\n    yAxis: {\n      min: min,\n      max: max,\n      endOnTick: true,\n      gridLineDashStyle: gridLineDashStyle || 'Dot',\n      gridLineColor: gridLineColor || 'white',\n      title: yAxisTitle\n        ? {\n            text: yAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n            x: -10,\n          }\n        : undefined,\n      tickInterval: tickInterval,\n      labels: {\n        formatter: tickFormat\n          ? ({ value }) => tickFormat(value as number)\n          : undefined,\n        style: baseFont,\n      },\n    },\n    legend: {\n      enabled: false,\n    },\n    series: limitedSeries.map((s) => ({\n      data: s.data,\n      name: s.name,\n      type: 'column',\n      color: s.color || 'var(--j2-blue-11)',\n      states: {\n        hover: {\n          color: s.hoverColor || token.colorPrimaryTextHover,\n        },\n      },\n    })),\n    tooltip: {\n      useHTML: true,\n      outside: true,\n      backgroundColor: 'transparent',\n      shadow: false,\n      padding: 0,\n      style: { zIndex: 9999 },\n      formatter: function (this) {\n        return renderToString(\n          <div className={styles.tooltip}>\n            {tooltip(this.key, this.y, this.series.name)}\n          </div>\n        )\n      },\n    },\n  }\n\n  return (\n    <HighchartsReact\n      ref={chartRef}\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n\nexport { BarChart }\n"],"names":["theme","renderToString","jsx","styles","HighchartsReact"],"mappings":"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"}
+{"version":3,"file":"BarChart.cjs","names":["theme","renderToString","styles","HighchartsReact"],"sources":["../../../../src/components/barchart/BarChart.tsx"],"sourcesContent":["import { theme } from 'antd'\nimport type * as Highcharts from 'highcharts'\nimport {\n  Chart as HighchartsReact,\n  type HighchartsReactRefObject,\n} from '@highcharts/react'\n// `modules/`, not `options/`. @highcharts/react 5 moved the module entry\n// points and left the old `options/` files in the package still importing\n// `highcharts/esm/…`, while the Chart component now loads\n// `highcharts/es-modules/masters/…`. Those are two different Highcharts\n// instances, so the old path composes the module onto one the chart never\n// uses: no error, no missing export, the module just stops taking effect.\nimport '@highcharts/react/modules/Accessibility.js'\nimport '@highcharts/react/modules/Exporting.js'\nimport styles from './chart.module.css'\nimport { renderToString } from 'react-dom/server'\n\ntype Series = {\n  name?: string\n  data: Highcharts.PointOptionsObject[] | number[]\n  color?: string\n  hoverColor?: string\n}\n\ntype BarChartProps = {\n  categories: string[]\n  series: Series[]\n  min: number\n  max: number | undefined | null\n  tickInterval: number | undefined\n  tickFormat?: (value: number) => string\n  xAxisTitle?: string\n  yAxisTitle?: string\n  gridLineColor?: string\n  gridLineDashStyle?: Highcharts.DashStyleValue\n  xAxisLabelMaxLines?: number\n  tooltip: (\n    category: string | number | undefined,\n    value: number | null | undefined,\n    seriesName: string | undefined\n  ) => React.ReactNode\n  chartRef?: React.RefObject<HighchartsReactRefObject>\n  exporting?: Highcharts.ExportingOptions\n  maxBars?: number\n  barsWidth?: number\n  height?: number\n  width?: number\n}\n\nconst BarChart = ({\n  categories,\n  series,\n  min,\n  max,\n  tickInterval,\n  tickFormat,\n  xAxisTitle,\n  yAxisTitle,\n  gridLineColor,\n  gridLineDashStyle,\n  xAxisLabelMaxLines,\n  tooltip,\n  exporting,\n  chartRef,\n  height,\n  width,\n  maxBars = 50,\n  barsWidth = undefined,\n}: BarChartProps) => {\n  const limitedCategories = categories.slice(0, maxBars)\n  const limitedSeries = series.map((s) => ({\n    ...s,\n    data: s.data.slice(0, maxBars),\n  }))\n\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n  }\n\n  const options: Highcharts.Options = {\n    credits: {\n      enabled: false,\n    },\n    chart: {\n      type: 'column',\n      ...(height ? { height } : {}),\n      ...(width ? { width } : {}),\n    },\n    plotOptions: {\n      column: {\n        borderRadius: series[0].data.length > 5 ? '20%' : '15%',\n        ...(barsWidth !== undefined ? { pointWidth: barsWidth } : {}),\n      },\n    },\n    exporting: {\n      ...exporting,\n      enabled: false,\n      chartOptions: {\n        ...exporting?.chartOptions,\n        title: {\n          align: 'left',\n          text: exporting?.chartOptions?.title?.text,\n          style: {\n            fontSize: `${token.fontSize}px`,\n            fontFamily: 'sans-serif',\n            color: token.colorText,\n            ...exporting?.chartOptions?.title?.style,\n          },\n        },\n        series: limitedSeries.map((s) => ({\n          type: 'column',\n          color: s.color ? s.color : '#253761', // --j2-blue-9\n        })),\n        legend: exporting?.chartOptions?.legend || { enabled: false },\n      },\n    },\n    title: {\n      text: '',\n    },\n    xAxis: {\n      categories: limitedCategories,\n      title: xAxisTitle\n        ? {\n            text: xAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n          }\n        : undefined,\n      labels: {\n        y: 30,\n        style: baseFont,\n        ...(xAxisLabelMaxLines\n          ? {\n              useHTML: true,\n              formatter: function (\n                this: Highcharts.AxisLabelsFormatterContextObject\n              ) {\n                return `<div style=\"overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;\">${this.value}</div>`\n              },\n            }\n          : {}),\n      },\n    },\n    yAxis: {\n      min: min,\n      max: max,\n      endOnTick: true,\n      gridLineDashStyle: gridLineDashStyle || 'Dot',\n      gridLineColor: gridLineColor || 'white',\n      title: yAxisTitle\n        ? {\n            text: yAxisTitle,\n            style: { ...baseFont, color: token.colorTextDescription },\n            x: -10,\n          }\n        : undefined,\n      tickInterval: tickInterval,\n      labels: {\n        formatter: tickFormat\n          ? ({ value }) => tickFormat(value as number)\n          : undefined,\n        style: baseFont,\n      },\n    },\n    legend: {\n      enabled: false,\n    },\n    series: limitedSeries.map((s) => ({\n      data: s.data,\n      name: s.name,\n      type: 'column',\n      color: s.color || 'var(--j2-blue-11)',\n      states: {\n        hover: {\n          color: s.hoverColor || token.colorPrimaryTextHover,\n        },\n      },\n    })),\n    tooltip: {\n      useHTML: true,\n      outside: true,\n      backgroundColor: 'transparent',\n      shadow: false,\n      padding: 0,\n      style: { zIndex: 9999 },\n      formatter: function (this) {\n        return renderToString(\n          <div className={styles.tooltip}>\n            {tooltip(this.key, this.y, this.series.name)}\n          </div>\n        )\n      },\n    },\n  }\n\n  return (\n    <HighchartsReact\n      ref={chartRef}\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n\nexport { BarChart }\n"],"mappings":"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"}

package/dist/src/components/barchart/BarChart.d.ts

@@ -26,5 +26,5 @@ type BarChartProps = {
     height?: number;
     width?: number;
 };
-declare const BarChart: ({ categories, series, min, max, tickInterval, tickFormat, xAxisTitle, yAxisTitle, gridLineColor, gridLineDashStyle, xAxisLabelMaxLines, tooltip, exporting, chartRef, height, width, maxBars, barsWidth, }: BarChartProps) => import("react").JSX.Element;
+declare const BarChart: ({ categories, series, min, max, tickInterval, tickFormat, xAxisTitle, yAxisTitle, gridLineColor, gridLineDashStyle, xAxisLabelMaxLines, tooltip, exporting, chartRef, height, width, maxBars, barsWidth, }: BarChartProps) => import('react').JSX.Element;
 export { BarChart };

package/dist/src/components/barchart/BarChart.js

@@ -1,155 +1,127 @@
-import { jsx } from "react/jsx-runtime";
+import chart_module_default from "./chart.module.css.js";
 import { theme } from "antd";
+import { jsx } from "react/jsx-runtime";
 import { Chart } from "@highcharts/react";
 import "@highcharts/react/modules/Accessibility.js";
 import "@highcharts/react/modules/Exporting.js";
-import styles from "./chart.module.css.js";
 import { renderToString } from "react-dom/server";
-const BarChart = ({
-  categories,
-  series,
-  min,
-  max,
-  tickInterval,
-  tickFormat,
-  xAxisTitle,
-  yAxisTitle,
-  gridLineColor,
-  gridLineDashStyle,
-  xAxisLabelMaxLines,
-  tooltip,
-  exporting,
-  chartRef,
-  height,
-  width,
-  maxBars = 50,
-  barsWidth = void 0
-}) => {
-  var _a, _b, _c, _d, _e;
-  const limitedCategories = categories.slice(0, maxBars);
-  const limitedSeries = series.map((s) => ({
-    ...s,
-    data: s.data.slice(0, maxBars)
-  }));
-  const { token } = theme.useToken();
-  const baseFont = {
-    fontSize: `${token.fontSize}px`,
-    fontFamily: token.fontFamily,
-    color: token.colorText
-  };
-  const options = {
-    credits: {
-      enabled: false
-    },
-    chart: {
-      type: "column",
-      ...height ? { height } : {},
-      ...width ? { width } : {}
-    },
-    plotOptions: {
-      column: {
-        borderRadius: series[0].data.length > 5 ? "20%" : "15%",
-        ...barsWidth !== void 0 ? { pointWidth: barsWidth } : {}
-      }
-    },
-    exporting: {
-      ...exporting,
-      enabled: false,
-      chartOptions: {
-        ...exporting == null ? void 0 : exporting.chartOptions,
-        title: {
-          align: "left",
-          text: (_b = (_a = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _a.title) == null ? void 0 : _b.text,
-          style: {
-            fontSize: `${token.fontSize}px`,
-            fontFamily: "sans-serif",
-            color: token.colorText,
-            ...(_d = (_c = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _c.title) == null ? void 0 : _d.style
-          }
-        },
-        series: limitedSeries.map((s) => ({
-          type: "column",
-          color: s.color ? s.color : "#253761"
-          // --j2-blue-9
-        })),
-        legend: ((_e = exporting == null ? void 0 : exporting.chartOptions) == null ? void 0 : _e.legend) || { enabled: false }
-      }
-    },
-    title: {
-      text: ""
-    },
-    xAxis: {
-      categories: limitedCategories,
-      title: xAxisTitle ? {
-        text: xAxisTitle,
-        style: { ...baseFont, color: token.colorTextDescription }
-      } : void 0,
-      labels: {
-        y: 30,
-        style: baseFont,
-        ...xAxisLabelMaxLines ? {
-          useHTML: true,
-          formatter: function() {
-            return `<div style="overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;">${this.value}</div>`;
-          }
-        } : {}
-      }
-    },
-    yAxis: {
-      min,
-      max,
-      endOnTick: true,
-      gridLineDashStyle: gridLineDashStyle || "Dot",
-      gridLineColor: gridLineColor || "white",
-      title: yAxisTitle ? {
-        text: yAxisTitle,
-        style: { ...baseFont, color: token.colorTextDescription },
-        x: -10
-      } : void 0,
-      tickInterval,
-      labels: {
-        formatter: tickFormat ? ({ value }) => tickFormat(value) : void 0,
-        style: baseFont
-      }
-    },
-    legend: {
-      enabled: false
-    },
-    series: limitedSeries.map((s) => ({
-      data: s.data,
-      name: s.name,
-      type: "column",
-      color: s.color || "var(--j2-blue-11)",
-      states: {
-        hover: {
-          color: s.hoverColor || token.colorPrimaryTextHover
-        }
-      }
-    })),
-    tooltip: {
-      useHTML: true,
-      outside: true,
-      backgroundColor: "transparent",
-      shadow: false,
-      padding: 0,
-      style: { zIndex: 9999 },
-      formatter: function() {
-        return renderToString(
-          /* @__PURE__ */ jsx("div", { className: styles.tooltip, children: tooltip(this.key, this.y, this.series.name) })
-        );
-      }
-    }
-  };
-  return /* @__PURE__ */ jsx(
-    Chart,
-    {
-      ref: chartRef,
-      options,
-      containerProps: { className: "highcharts-light" }
-    }
-  );
-};
-export {
-  BarChart
+//#region src/components/barchart/BarChart.tsx
+var BarChart = ({ categories, series, min, max, tickInterval, tickFormat, xAxisTitle, yAxisTitle, gridLineColor, gridLineDashStyle, xAxisLabelMaxLines, tooltip, exporting, chartRef, height, width, maxBars = 50, barsWidth = void 0 }) => {
+	const limitedCategories = categories.slice(0, maxBars);
+	const limitedSeries = series.map((s) => ({
+		...s,
+		data: s.data.slice(0, maxBars)
+	}));
+	const { token } = theme.useToken();
+	const baseFont = {
+		fontSize: `${token.fontSize}px`,
+		fontFamily: token.fontFamily,
+		color: token.colorText
+	};
+	const options = {
+		credits: { enabled: false },
+		chart: {
+			type: "column",
+			...height ? { height } : {},
+			...width ? { width } : {}
+		},
+		plotOptions: { column: {
+			borderRadius: series[0].data.length > 5 ? "20%" : "15%",
+			...barsWidth !== void 0 ? { pointWidth: barsWidth } : {}
+		} },
+		exporting: {
+			...exporting,
+			enabled: false,
+			chartOptions: {
+				...exporting?.chartOptions,
+				title: {
+					align: "left",
+					text: exporting?.chartOptions?.title?.text,
+					style: {
+						fontSize: `${token.fontSize}px`,
+						fontFamily: "sans-serif",
+						color: token.colorText,
+						...exporting?.chartOptions?.title?.style
+					}
+				},
+				series: limitedSeries.map((s) => ({
+					type: "column",
+					color: s.color ? s.color : "#253761"
+				})),
+				legend: exporting?.chartOptions?.legend || { enabled: false }
+			}
+		},
+		title: { text: "" },
+		xAxis: {
+			categories: limitedCategories,
+			title: xAxisTitle ? {
+				text: xAxisTitle,
+				style: {
+					...baseFont,
+					color: token.colorTextDescription
+				}
+			} : void 0,
+			labels: {
+				y: 30,
+				style: baseFont,
+				...xAxisLabelMaxLines ? {
+					useHTML: true,
+					formatter: function() {
+						return `<div style="overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: ${xAxisLabelMaxLines}; -webkit-box-orient: vertical; text-align: center;">${this.value}</div>`;
+					}
+				} : {}
+			}
+		},
+		yAxis: {
+			min,
+			max,
+			endOnTick: true,
+			gridLineDashStyle: gridLineDashStyle || "Dot",
+			gridLineColor: gridLineColor || "white",
+			title: yAxisTitle ? {
+				text: yAxisTitle,
+				style: {
+					...baseFont,
+					color: token.colorTextDescription
+				},
+				x: -10
+			} : void 0,
+			tickInterval,
+			labels: {
+				formatter: tickFormat ? ({ value }) => tickFormat(value) : void 0,
+				style: baseFont
+			}
+		},
+		legend: { enabled: false },
+		series: limitedSeries.map((s) => ({
+			data: s.data,
+			name: s.name,
+			type: "column",
+			color: s.color || "var(--j2-blue-11)",
+			states: { hover: { color: s.hoverColor || token.colorPrimaryTextHover } }
+		})),
+		tooltip: {
+			useHTML: true,
+			outside: true,
+			backgroundColor: "transparent",
+			shadow: false,
+			padding: 0,
+			style: { zIndex: 9999 },
+			formatter: function() {
+				return renderToString(/* @__PURE__ */ jsx("div", {
+					className: chart_module_default.tooltip,
+					children: tooltip(this.key, this.y, this.series.name)
+				}));
+			}
+		}
+	};
+	return /* @__PURE__ */ jsx(Chart, {
+		ref: chartRef,
+		options,
+		containerProps: { className: "highcharts-light" }
+	});
 };
-//# sourceMappingURL=BarChart.js.map
+//#endregion
+export { BarChart };
+
+//# sourceMappingURL=BarChart.js.map