@ant-design/agentic-ui 2.0.0

package/dist/plugins/chart/AreaChart/style.js

@@ -0,0 +1,89 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/plugins/chart/AreaChart/style.ts
+import {
+  useEditorStyleRegister
+} from "../../../hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      // 面积图容器样式
+      ".chart-wrapper": {
+        width: "100%",
+        height: "calc(100% - 120px)",
+        minHeight: 300,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        overflow: "hidden"
+      },
+      // 确保图表不会超出容器边界
+      canvas: {
+        maxWidth: "100% !important",
+        maxHeight: "100% !important"
+      },
+      // 移动端响应式样式
+      "@media (max-width: 768px)": {
+        // 移动端优化
+        ".chart-wrapper": {
+          height: "calc(100% - 100px)",
+          // 移动端减少更多空间
+          minHeight: 250
+          // 移动端最小高度
+        },
+        // 移动端图表标题样式优化
+        ".chart-title": {
+          fontSize: 14,
+          marginBottom: 8,
+          textAlign: "center"
+        },
+        // 移动端筛选器样式优化
+        ".chart-filter": {
+          flexWrap: "wrap",
+          gap: 8,
+          marginBottom: 12,
+          ".filter-button": {
+            fontSize: 12,
+            padding: "6px 12px"
+          }
+        }
+      },
+      // 超小屏幕优化 (375px以下)
+      "@media (max-width: 375px)": {
+        padding: 8,
+        ".chart-wrapper": {
+          minHeight: 220
+        }
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("AreaChart", (token) => {
+    const areaToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(areaToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/plugins/chart/BarChart/index.d.ts

@@ -0,0 +1,73 @@
+import React from 'react';
+import { ChartContainerProps } from '../components';
+import { StatisticConfigType } from '../hooks/useChartStatistic';
+import { ChartDataItem } from '../utils';
+export type BarChartDataItem = ChartDataItem;
+export interface BarChartConfigItem {
+    datasets: Array<(string | {
+        x: number;
+        y: number;
+    })[]>;
+    theme?: 'light' | 'dark';
+    showLegend?: boolean;
+    legendPosition?: 'top' | 'left' | 'bottom' | 'right';
+    legendAlign?: 'start' | 'center' | 'end';
+    showGrid?: boolean;
+    xAxisLabel?: string;
+    yAxisLabel?: string;
+    xAxisMin?: number;
+    xAxisMax?: number;
+    yAxisMin?: number;
+    yAxisMax?: number;
+    xAxisStep?: number;
+    yAxisStep?: number;
+    stacked?: boolean;
+    indexAxis?: 'x' | 'y';
+}
+export interface BarChartProps extends ChartContainerProps {
+    /** 图表标题 */
+    title?: string;
+    /** 扁平化数据数组 */
+    data: BarChartDataItem[];
+    /** 图表宽度，默认600px */
+    width?: number | string;
+    /** 图表高度，默认400px */
+    height?: number | string;
+    /** 自定义CSS类名 */
+    className?: string;
+    /** 数据时间 */
+    dataTime?: string;
+    /** 图表主题 */
+    theme?: 'dark' | 'light';
+    /** 自定义主色（可选），支持 string 或 string[]；
+     *  - 非正负图：数组按序对应各数据序列
+     *  - 正负图：取数组前两位分别作为正/负色；仅一位则全用同色
+     */
+    color?: string | string[];
+    /** 是否显示图例，默认true */
+    showLegend?: boolean;
+    /** 图例位置 */
+    legendPosition?: 'top' | 'left' | 'bottom' | 'right';
+    /** 图例水平对齐方式 */
+    legendAlign?: 'start' | 'center' | 'end';
+    /** 是否显示网格线，默认true */
+    showGrid?: boolean;
+    /** X轴位置 */
+    xPosition?: 'top' | 'bottom';
+    /** Y轴位置 */
+    yPosition?: 'left' | 'right';
+    /** 是否启用堆叠显示，将多个数据集叠加显示 */
+    stacked?: boolean;
+    /** 图表轴向，'x'为垂直柱状图，'y'为水平柱状图 */
+    indexAxis?: 'x' | 'y';
+    /** 头部工具条额外按钮 */
+    toolbarExtra?: React.ReactNode;
+    /** ChartStatistic组件配置：object表示单个配置，array表示多个配置 */
+    statistic?: StatisticConfigType;
+    /** 是否显示数据标签，默认false */
+    showDataLabels?: boolean;
+    /** 数据标签格式化函数 */
+    dataLabelFormatter?: (value: number) => string;
+}
+declare const BarChart: React.FC<BarChartProps>;
+export default BarChart;

package/dist/plugins/chart/BarChart/index.js

@@ -0,0 +1,516 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/plugins/chart/BarChart/index.tsx
+import { ConfigProvider } from "antd";
+import {
+  BarElement,
+  CategoryScale,
+  Chart as ChartJS,
+  Legend,
+  LinearScale,
+  Tooltip
+} from "chart.js";
+import ChartDataLabels from "chartjs-plugin-datalabels";
+import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
+import { Bar } from "react-chartjs-2";
+import {
+  ChartContainer,
+  ChartFilter,
+  ChartStatistic,
+  ChartToolBar,
+  downloadChart
+} from "../components";
+import {
+  useChartStatistic
+} from "../hooks/useChartStatistic";
+import {
+  extractAndSortXValues,
+  findDataPointByXValue
+} from "../utils";
+ChartJS.register(CategoryScale, LinearScale, BarElement, Tooltip, Legend);
+var defaultColors = ["#917EF7", "#2AD8FC", "#388BFF", "#718AB6", "#84DC18"];
+var hexToRgba = (hex, alpha) => {
+  const sanitized = hex.replace("#", "");
+  const isShort = sanitized.length === 3;
+  const r = parseInt(
+    isShort ? sanitized[0] + sanitized[0] : sanitized.slice(0, 2),
+    16
+  );
+  const g = parseInt(
+    isShort ? sanitized[1] + sanitized[1] : sanitized.slice(2, 4),
+    16
+  );
+  const b = parseInt(
+    isShort ? sanitized[2] + sanitized[2] : sanitized.slice(4, 6),
+    16
+  );
+  const a = Math.max(0, Math.min(1, alpha));
+  return `rgba(${r}, ${g}, ${b}, ${a})`;
+};
+var POSITIVE_COLOR_HEX = "#388BFF";
+var NEGATIVE_COLOR_HEX = "#F78826";
+var BarChart = ({
+  title,
+  data,
+  width = 600,
+  height = 400,
+  className,
+  dataTime,
+  theme = "light",
+  color,
+  showLegend = true,
+  legendPosition = "bottom",
+  legendAlign = "start",
+  showGrid = true,
+  xPosition = "bottom",
+  yPosition = "left",
+  stacked = false,
+  indexAxis = "x",
+  toolbarExtra,
+  statistic: statisticConfig,
+  variant,
+  showDataLabels = false,
+  dataLabelFormatter
+}) => {
+  const safeData = Array.isArray(data) ? data : [];
+  const [windowWidth, setWindowWidth] = useState(
+    typeof window !== "undefined" ? window.innerWidth : 768
+  );
+  const isMobile = windowWidth <= 768;
+  const responsiveWidth = isMobile ? "100%" : width;
+  const responsiveHeight = isMobile ? Math.min(windowWidth * 0.8, 400) : height;
+  useEffect(() => {
+    const handleResize = () => {
+      setWindowWidth(window.innerWidth);
+    };
+    if (typeof window !== "undefined") {
+      window.addEventListener("resize", handleResize);
+      return () => window.removeEventListener("resize", handleResize);
+    }
+  }, []);
+  const context = useContext(ConfigProvider.ConfigContext);
+  const baseClassName = context == null ? void 0 : context.getPrefixCls("bar-chart-container");
+  const chartRef = useRef(null);
+  const statisticComponentConfigs = useChartStatistic(statisticConfig);
+  const categories = useMemo(() => {
+    const uniqueCategories = [
+      ...new Set(safeData.map((item) => item.category))
+    ].filter(Boolean);
+    return uniqueCategories;
+  }, [safeData]);
+  const validFilterLabels = useMemo(() => {
+    return safeData.map((item) => item.filterLabel).filter(
+      (filterLabel) => filterLabel !== void 0
+    );
+  }, [safeData]);
+  const filterLabels = useMemo(() => {
+    return validFilterLabels.length > 0 ? [...new Set(validFilterLabels)] : void 0;
+  }, [validFilterLabels]);
+  const [selectedFilter, setSelectedFilter] = useState(
+    categories.find(Boolean) || ""
+  );
+  const [selectedFilterLabel, setSelectedFilterLabel] = useState(
+    filterLabels && filterLabels.length > 0 ? filterLabels[0] : void 0
+  );
+  useEffect(() => {
+    if (selectedFilter && !categories.includes(selectedFilter)) {
+      setSelectedFilter(categories.find(Boolean) || "");
+    }
+  }, [categories, selectedFilter]);
+  const filteredData = useMemo(() => {
+    const base = selectedFilter ? safeData.filter((item) => item.category === selectedFilter) : safeData;
+    const withFilterLabel = !filterLabels || !selectedFilterLabel ? base : base.filter((item) => item.filterLabel === selectedFilterLabel);
+    return withFilterLabel.filter(
+      (item) => item.x !== null && item.x !== void 0
+    );
+  }, [safeData, selectedFilter, filterLabels, selectedFilterLabel]);
+  const types = useMemo(() => {
+    return [...new Set(filteredData.map((item) => item.type))];
+  }, [filteredData]);
+  const xValues = useMemo(() => {
+    if (indexAxis === "y") {
+      const uniqueValues = [
+        ...new Set(
+          filteredData.map((item) => item.x).filter((x) => x !== null && x !== void 0)
+        )
+      ];
+      return uniqueValues;
+    }
+    return extractAndSortXValues(filteredData);
+  }, [filteredData, indexAxis]);
+  const xTitle = useMemo(() => {
+    const titles = [
+      ...new Set(filteredData.map((item) => item.xtitle).filter(Boolean))
+    ];
+    return titles[0] || "";
+  }, [filteredData]);
+  const yTitle = useMemo(() => {
+    const titles = [
+      ...new Set(filteredData.map((item) => item.ytitle).filter(Boolean))
+    ];
+    return titles[0] || "";
+  }, [filteredData]);
+  const hasPositive = useMemo(() => {
+    return filteredData.some((item) => {
+      const v = typeof item.y === "number" ? item.y : Number(item.y);
+      return Number.isFinite(v) && v > 0;
+    });
+  }, [filteredData]);
+  const hasNegative = useMemo(() => {
+    return filteredData.some((item) => {
+      const v = typeof item.y === "number" ? item.y : Number(item.y);
+      return Number.isFinite(v) && v < 0;
+    });
+  }, [filteredData]);
+  const isDiverging = hasPositive && hasNegative;
+  const processedData = useMemo(() => {
+    const labels = xValues.map((x) => x.toString());
+    const datasets = types.map((type, index) => {
+      const provided = color;
+      const pickByIndex = (i) => Array.isArray(provided) ? provided[i] || provided[0] || defaultColors[i % defaultColors.length] : provided || defaultColors[i % defaultColors.length];
+      const baseColor = pickByIndex(index);
+      const typeData = xValues.map((x) => {
+        const dataPoint = findDataPointByXValue(filteredData, x, type);
+        const v = dataPoint == null ? void 0 : dataPoint.y;
+        const n = typeof v === "number" ? v : Number(v);
+        return Number.isFinite(n) ? n : null;
+      });
+      return {
+        label: type || "默认",
+        data: typeData,
+        borderColor: (ctx) => {
+          const parsed = ctx.parsed;
+          const value = indexAxis === "y" ? typeof (parsed == null ? void 0 : parsed.x) === "number" ? parsed.x : 0 : typeof (parsed == null ? void 0 : parsed.y) === "number" ? parsed.y : 0;
+          let base = baseColor;
+          if (!color && isDiverging) {
+            base = value >= 0 ? POSITIVE_COLOR_HEX : NEGATIVE_COLOR_HEX;
+          } else if (Array.isArray(color) && isDiverging) {
+            const pos = color[0] || baseColor;
+            const neg = color[1] || color[0] || baseColor;
+            base = value >= 0 ? pos : neg;
+          }
+          return hexToRgba(base, 0.95);
+        },
+        backgroundColor: (ctx) => {
+          const chart = ctx.chart;
+          const chartArea = chart.chartArea;
+          const parsed = ctx.parsed;
+          if (!chartArea)
+            return hexToRgba(baseColor, 0.6);
+          const xScale = chart.scales["x"];
+          const yScale = chart.scales["y"];
+          const startAlpha = 0.65;
+          const endAlpha = 0.95;
+          if (!xScale || !yScale || typeof xScale.getPixelForValue !== "function" || typeof yScale.getPixelForValue !== "function") {
+            return hexToRgba(baseColor, 0.6);
+          }
+          if (indexAxis === "y") {
+            const value2 = typeof (parsed == null ? void 0 : parsed.x) === "number" ? parsed.x : 0;
+            let base2 = baseColor;
+            if (!color && isDiverging) {
+              base2 = value2 >= 0 ? POSITIVE_COLOR_HEX : NEGATIVE_COLOR_HEX;
+            } else if (Array.isArray(color) && isDiverging) {
+              const pos = color[0] || baseColor;
+              const neg = color[1] || color[0] || baseColor;
+              base2 = value2 >= 0 ? pos : neg;
+            }
+            const x0 = xScale.getPixelForValue(0);
+            const x1 = xScale.getPixelForValue(value2);
+            if (!Number.isFinite(x0) || !Number.isFinite(x1)) {
+              return hexToRgba(base2, endAlpha);
+            }
+            const gradient2 = chart.ctx.createLinearGradient(x0, 0, x1, 0);
+            gradient2.addColorStop(0, hexToRgba(base2, startAlpha));
+            gradient2.addColorStop(1, hexToRgba(base2, endAlpha));
+            return gradient2;
+          }
+          const value = typeof (parsed == null ? void 0 : parsed.y) === "number" ? parsed.y : 0;
+          let base = baseColor;
+          if (!color && isDiverging) {
+            base = value >= 0 ? POSITIVE_COLOR_HEX : NEGATIVE_COLOR_HEX;
+          } else if (Array.isArray(color) && isDiverging) {
+            const pos = color[0] || baseColor;
+            const neg = color[1] || color[0] || baseColor;
+            base = value >= 0 ? pos : neg;
+          }
+          const y0 = yScale.getPixelForValue(0);
+          const y1 = yScale.getPixelForValue(value);
+          if (!Number.isFinite(y0) || !Number.isFinite(y1)) {
+            return hexToRgba(base, endAlpha);
+          }
+          const gradient = chart.ctx.createLinearGradient(0, y0, 0, y1);
+          gradient.addColorStop(0, hexToRgba(base, startAlpha));
+          gradient.addColorStop(1, hexToRgba(base, endAlpha));
+          return gradient;
+        },
+        borderWidth: 0,
+        categoryPercentage: 0.7,
+        barPercentage: 0.8,
+        stack: stacked ? "stack" : void 0,
+        borderRadius: (ctx) => {
+          var _a, _b;
+          const rawValue = ctx == null ? void 0 : ctx.raw;
+          const value = typeof rawValue === "number" ? rawValue : Number(rawValue != null ? rawValue : 0);
+          const isHorizontal = indexAxis === "y";
+          const radius = 6;
+          const chart = ctx == null ? void 0 : ctx.chart;
+          let isTopOfStack = true;
+          if (stacked && chart) {
+            const dsIndex = ctx == null ? void 0 : ctx.datasetIndex;
+            const dIndex = ctx == null ? void 0 : ctx.dataIndex;
+            const currentStack = (_b = (_a = chart.data.datasets) == null ? void 0 : _a[dsIndex]) == null ? void 0 : _b.stack;
+            const sameStackIndexes = chart.data.datasets.map((_, i) => i).filter((i) => {
+              var _a2, _b2, _c;
+              const ds = (_a2 = chart.data.datasets) == null ? void 0 : _a2[i];
+              if (!chart.isDatasetVisible(i))
+                return false;
+              if (currentStack) {
+                if ((ds == null ? void 0 : ds.stack) !== currentStack)
+                  return false;
+              }
+              const v = Number((_c = (_b2 = ds == null ? void 0 : ds.data) == null ? void 0 : _b2[dIndex]) != null ? _c : 0);
+              return v >= 0 && value >= 0 || v < 0 && value < 0;
+            });
+            const topIndex = sameStackIndexes.length ? Math.max(...sameStackIndexes) : dsIndex;
+            isTopOfStack = dsIndex === topIndex;
+          }
+          if (!isTopOfStack)
+            return 0;
+          if (isHorizontal) {
+            if (value >= 0) {
+              return {
+                topRight: radius,
+                bottomRight: radius,
+                topLeft: 0,
+                bottomLeft: 0
+              };
+            } else {
+              return {
+                topLeft: radius,
+                bottomLeft: radius,
+                topRight: 0,
+                bottomRight: 0
+              };
+            }
+          } else {
+            if (value >= 0) {
+              return {
+                topLeft: radius,
+                topRight: radius,
+                bottomLeft: 0,
+                bottomRight: 0
+              };
+            } else {
+              return {
+                bottomLeft: radius,
+                bottomRight: radius,
+                topLeft: 0,
+                topRight: 0
+              };
+            }
+          }
+        },
+        borderSkipped: false
+      };
+    });
+    return { labels, datasets };
+  }, [filteredData, types, xValues, stacked, indexAxis]);
+  const filterOptions = useMemo(() => {
+    return categories.map((category) => ({
+      label: category || "默认",
+      value: category || "默认"
+    }));
+  }, [categories]);
+  const filteredDataByFilterLabel = useMemo(() => {
+    return filterLabels == null ? void 0 : filterLabels.map((item) => ({
+      key: item,
+      label: item
+    }));
+  }, [filterLabels]);
+  const isLight = theme === "light";
+  const axisTextColor = isLight ? "rgba(0, 25, 61, 0.3255)" : "rgba(255, 255, 255, 0.8)";
+  const gridColor = isLight ? "rgba(0,0,0,0.08)" : "rgba(255,255,255,0.2)";
+  const options = {
+    responsive: true,
+    maintainAspectRatio: false,
+    indexAxis,
+    plugins: __spreadValues({
+      legend: {
+        display: showLegend,
+        position: legendPosition,
+        align: legendAlign,
+        labels: {
+          color: axisTextColor,
+          font: { size: isMobile ? 10 : 12, weight: "normal" },
+          padding: isMobile ? 10 : 12,
+          usePointStyle: true,
+          pointStyle: "rectRounded"
+        }
+      },
+      tooltip: {
+        backgroundColor: isLight ? "rgba(255,255,255,0.95)" : "rgba(0,0,0,0.85)",
+        titleColor: isLight ? "#333" : "#fff",
+        bodyColor: isLight ? "#333" : "#fff",
+        borderColor: isLight ? "rgba(0,0,0,0.12)" : "rgba(255,255,255,0.2)",
+        borderWidth: 1,
+        cornerRadius: isMobile ? 6 : 8,
+        displayColors: true
+      }
+    }, ChartDataLabels && {
+      datalabels: {
+        display: showDataLabels,
+        anchor: indexAxis === "y" ? "end" : "end",
+        align: indexAxis === "y" ? "end" : "top",
+        offset: 4,
+        color: axisTextColor,
+        font: {
+          size: isMobile ? 10 : 11,
+          weight: "normal"
+        },
+        formatter: (value) => {
+          if (value === null || value === void 0)
+            return "";
+          if (dataLabelFormatter) {
+            return dataLabelFormatter(value);
+          }
+          return value.toLocaleString();
+        }
+      }
+    }),
+    scales: {
+      x: {
+        stacked,
+        position: xPosition,
+        title: {
+          display: !!xTitle,
+          text: xTitle,
+          color: axisTextColor,
+          font: { size: isMobile ? 10 : 12, weight: "normal" },
+          align: "end"
+        },
+        grid: {
+          display: showGrid,
+          color: gridColor,
+          lineWidth: 1,
+          drawTicks: false,
+          tickLength: 0
+        },
+        ticks: {
+          color: axisTextColor,
+          font: { size: isMobile ? 10 : 12 },
+          padding: isMobile ? 10 : 12
+        },
+        border: {
+          color: gridColor
+        }
+      },
+      y: {
+        stacked,
+        position: yPosition,
+        beginAtZero: true,
+        title: {
+          display: !!yTitle,
+          text: yTitle,
+          color: axisTextColor,
+          font: { size: isMobile ? 10 : 12, weight: "normal" },
+          align: "end"
+        },
+        grid: {
+          display: showGrid,
+          color: gridColor,
+          lineWidth: 1,
+          drawTicks: false,
+          tickLength: 0
+        },
+        ticks: {
+          color: axisTextColor,
+          font: { size: isMobile ? 10 : 12 },
+          padding: isMobile ? 10 : 12
+        },
+        border: {
+          color: gridColor
+        }
+      }
+    }
+  };
+  const handleDownload = () => {
+    downloadChart(chartRef.current, "bar-chart");
+  };
+  return /* @__PURE__ */ React.createElement(
+    ChartContainer,
+    {
+      baseClassName,
+      className,
+      theme,
+      isMobile,
+      variant,
+      style: {
+        width: responsiveWidth,
+        height: responsiveHeight
+      }
+    },
+    /* @__PURE__ */ React.createElement(
+      ChartToolBar,
+      {
+        title,
+        theme,
+        onDownload: handleDownload,
+        extra: toolbarExtra,
+        dataTime
+      }
+    ),
+    statisticComponentConfigs && /* @__PURE__ */ React.createElement("div", { className: "chart-statistic-container" }, statisticComponentConfigs.map((config, index) => /* @__PURE__ */ React.createElement(ChartStatistic, __spreadProps(__spreadValues({ key: index }, config), { theme })))),
+    /* @__PURE__ */ React.createElement(
+      ChartFilter,
+      __spreadProps(__spreadValues({
+        filterOptions,
+        selectedFilter,
+        onFilterChange: setSelectedFilter
+      }, filterLabels && {
+        customOptions: filteredDataByFilterLabel,
+        selectedCustomSelection: selectedFilterLabel,
+        onSelectionChange: setSelectedFilterLabel
+      }), {
+        theme
+      })
+    ),
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: "chart-wrapper",
+        style: { marginTop: "20px", height: responsiveHeight }
+      },
+      /* @__PURE__ */ React.createElement(
+        Bar,
+        {
+          ref: chartRef,
+          data: processedData,
+          options,
+          plugins: [ChartDataLabels]
+        }
+      )
+    )
+  );
+};
+var BarChart_default = BarChart;
+export {
+  BarChart_default as default
+};

package/dist/plugins/chart/BarChart/style.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare function useStyle(prefixCls?: string): {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};