@ant-design/agentic-ui 2.8.0 → 2.10.0

package/dist/Plugins/chart/DonutChart/index.js

@@ -1,547 +1,619 @@
-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]);
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _array_without_holes(arr) {
+    if (Array.isArray(arr)) return _array_like_to_array(arr);
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
     }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
+    return obj;
+}
+function _iterable_to_array(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
     }
-  return target;
-};
-
-// src/Plugins/chart/DonutChart/index.tsx
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _non_iterable_spread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+function _object_without_properties(source, excluded) {
+    if (source == null) return {};
+    var target = _object_without_properties_loose(source, excluded);
+    var key, i;
+    if (Object.getOwnPropertySymbols) {
+        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceSymbolKeys.length; i++){
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+function _object_without_properties_loose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for(i = 0; i < sourceKeys.length; i++){
+        key = sourceKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        target[key] = source[key];
+    }
+    return target;
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _to_consumable_array(arr) {
+    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
 import { ConfigProvider } from "antd";
-import {
-  ArcElement,
-  Chart as ChartJS,
-  Legend,
-  Tooltip
-} from "chart.js";
+import { ArcElement, Chart as ChartJS, Legend, Tooltip } from "chart.js";
 import classNames from "classnames";
 import React, { useContext, useMemo, useRef, useState } from "react";
 import { Doughnut } from "react-chartjs-2";
-import {
-  ChartContainer,
-  ChartFilter,
-  ChartStatistic,
-  ChartToolBar,
-  downloadChart
-} from "../components";
+import { ChartContainer, ChartFilter, ChartStatistic, ChartToolBar, downloadChart } from "../components";
 import { defaultColorList } from "../const";
-import {
-  SINGLE_MODE_DESKTOP_CUTOUT,
-  SINGLE_MODE_MOBILE_CUTOUT
-} from "./constants";
-import {
-  useAutoCategory,
-  useFilterLabels,
-  useMobile,
-  useResponsiveDimensions
-} from "./hooks";
+import { SINGLE_MODE_DESKTOP_CUTOUT, SINGLE_MODE_MOBILE_CUTOUT } from "./constants";
+import { useAutoCategory, useFilterLabels, useMobile, useResponsiveDimensions } from "./hooks";
 import LegendView from "./Legend";
 import { createBackgroundArcPlugin, createCenterTextPlugin } from "./plugins";
 import { useStyle } from "./style";
-var donutChartComponentsRegistered = false;
-var DonutChart = (_a) => {
-  var _b = _a, {
-    data,
-    configs,
-    width = 200,
-    height = 200,
-    className,
-    title,
-    showToolbar = true,
-    onDownload,
-    dataTime,
-    filterList,
-    selectedFilter,
-    onFilterChange,
-    enableAutoCategory = true,
-    singleMode = false,
-    toolbarExtra,
-    renderFilterInToolbar = false,
-    statistic: statisticConfig
-  } = _b, props = __objRest(_b, [
-    "data",
-    "configs",
-    "width",
-    "height",
-    "className",
-    "title",
-    "showToolbar",
-    "onDownload",
-    "dataTime",
-    "filterList",
-    "selectedFilter",
-    "onFilterChange",
-    "enableAutoCategory",
-    "singleMode",
-    "toolbarExtra",
-    "renderFilterInToolbar",
-    "statistic"
-  ]);
-  var _a2;
-  useMemo(() => {
-    if (donutChartComponentsRegistered) {
-      return void 0;
-    }
-    if (typeof window === "undefined") {
-      return void 0;
-    }
-    ChartJS.register(ArcElement, Tooltip, Legend);
-    donutChartComponentsRegistered = true;
-    return void 0;
-  }, []);
-  const { isMobile, windowWidth } = useMobile();
-  const defaultConfigs = [{ showLegend: true }];
-  const finalConfigs = configs || defaultConfigs;
-  const context = useContext(ConfigProvider.ConfigContext);
-  const baseClassName = context == null ? void 0 : context.getPrefixCls("donut-chart");
-  const { hashId } = useStyle(baseClassName);
-  const chartRefs = useRef([]);
-  const [hiddenDataIndicesByChart, setHiddenDataIndicesByChart] = useState({});
-  const {
-    filterLabels,
-    filteredDataByFilterLabel,
-    selectedFilterLabel,
-    setSelectedFilterLabel
-  } = useFilterLabels(data);
-  const {
-    autoCategoryData,
-    internalSelectedCategory,
-    setInternalSelectedCategory,
-    selectedCategory
-  } = useAutoCategory(data, enableAutoCategory, selectedFilter);
-  const filteredData = useMemo(() => {
-    const byCategory = selectedCategory ? data.filter((item) => item.category === selectedCategory) : data;
-    if (!filterLabels || !selectedFilterLabel) {
-      return byCategory;
-    }
-    return byCategory.filter(
-      (item) => item.filterLabel === selectedFilterLabel
-    );
-  }, [data, selectedCategory, filterLabels, selectedFilterLabel]);
-  const handleInternalCategoryChange = (category) => {
-    setInternalSelectedCategory(category);
-  };
-  const handleLegendItemClick = (chartIndex, dataIndex) => {
-    setHiddenDataIndicesByChart((prev) => {
-      var _a3;
-      const next = __spreadValues({}, prev);
-      const currentSet = new Set((_a3 = next[chartIndex]) != null ? _a3 : /* @__PURE__ */ new Set());
-      if (currentSet.has(dataIndex)) {
-        currentSet.delete(dataIndex);
-      } else {
-        currentSet.add(dataIndex);
-      }
-      next[chartIndex] = currentSet;
-      return next;
-    });
-  };
-  if (filterList && filterList.length > 0) {
-    const uniqueItems = new Set(filterList);
-    if (uniqueItems.size !== filterList.length) {
-      const seen = /* @__PURE__ */ new Set();
-      const duplicates = /* @__PURE__ */ new Set();
-      filterList.forEach((item) => {
-        if (seen.has(item)) {
-          duplicates.add(item);
-        } else {
-          seen.add(item);
+/**
+ * @fileoverview 环形图组件文件
+ *
+ * 该文件提供了环形图（甜甜圈图）组件的实现，基于 Chart.js 和 react-chartjs-2。
+ * 支持饼图和环形图两种样式，提供数据可视化、交互、配置、统计等功能。
+ *
+ * @author md-editor
+ * @version 1.0.0
+ * @since 2024
+ */ var donutChartComponentsRegistered = false;
+/**
+ * 环形图组件
+ *
+ * 基于 Chart.js 和 react-chartjs-2 实现的环形图（甜甜圈图）组件。
+ * 支持饼图和环形图两种样式，提供数据可视化、交互、配置、统计等功能。
+ *
+ * @component
+ * @param {DonutChartProps} props - 组件属性
+ * @returns {React.ReactElement} 环形图组件
+ *
+ * @example
+ * ```tsx
+ * <DonutChart
+ *   title="销售占比"
+ *   data={[
+ *     { label: '产品A', value: 30 },
+ *     { label: '产品B', value: 50 },
+ *     { label: '产品C', value: 20 }
+ *   ]}
+ *   configs={[{ chartStyle: 'donut', showLegend: true }]}
+ *   width={400}
+ *   height={400}
+ *   showToolbar={true}
+ * />
+ * ```
+ *
+ * @since 1.0.0
+ */ var DonutChart = function(_param) {
+    var data = _param.data, configs = _param.configs, _param_width = _param.width, width = _param_width === void 0 ? 200 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 200 : _param_height, className = _param.className, title = _param.title, _param_showToolbar = _param.showToolbar, showToolbar = _param_showToolbar === void 0 ? true : _param_showToolbar, onDownload = _param.onDownload, dataTime = _param.dataTime, filterList = _param.filterList, selectedFilter = _param.selectedFilter, onFilterChange = _param.onFilterChange, _param_enableAutoCategory = _param.enableAutoCategory, enableAutoCategory = _param_enableAutoCategory === void 0 ? true : _param_enableAutoCategory, _param_singleMode = _param.singleMode, singleMode = _param_singleMode === void 0 ? false : _param_singleMode, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, statisticConfig = _param.statistic, props = _object_without_properties(_param, [
+        "data",
+        "configs",
+        "width",
+        "height",
+        "className",
+        "title",
+        "showToolbar",
+        "onDownload",
+        "dataTime",
+        "filterList",
+        "selectedFilter",
+        "onFilterChange",
+        "enableAutoCategory",
+        "singleMode",
+        "toolbarExtra",
+        "renderFilterInToolbar",
+        "statistic"
+    ]);
+    var _finalConfigs_;
+    useMemo(function() {
+        if (donutChartComponentsRegistered) {
+            return undefined;
+        }
+        if (typeof window === 'undefined') {
+            return undefined;
+        }
+        ChartJS.register(ArcElement, Tooltip, Legend);
+        donutChartComponentsRegistered = true;
+        return undefined;
+    }, []);
+    var _useMobile = useMobile(), isMobile = _useMobile.isMobile, windowWidth = _useMobile.windowWidth;
+    // 默认配置：当 configs 不传时，使用默认配置，showLegend 默认为 true
+    var defaultConfigs = [
+        {
+            showLegend: true
+        }
+    ];
+    var finalConfigs = configs || defaultConfigs;
+    var context = useContext(ConfigProvider.ConfigContext);
+    var baseClassName = context === null || context === void 0 ? void 0 : context.getPrefixCls('donut-chart');
+    var hashId = useStyle(baseClassName).hashId;
+    // 多图场景下独立管理每个图表实例，避免引用被覆盖
+    var chartRefs = useRef([]);
+    // 多图场景下按图索引隔离 Legend 隐藏状态
+    var _useState = _sliced_to_array(useState({}), 2), hiddenDataIndicesByChart = _useState[0], setHiddenDataIndicesByChart = _useState[1];
+    var _useFilterLabels = useFilterLabels(data), filterLabels = _useFilterLabels.filterLabels, filteredDataByFilterLabel = _useFilterLabels.filteredDataByFilterLabel, selectedFilterLabel = _useFilterLabels.selectedFilterLabel, setSelectedFilterLabel = _useFilterLabels.setSelectedFilterLabel;
+    var _useAutoCategory = useAutoCategory(data, enableAutoCategory, selectedFilter), autoCategoryData = _useAutoCategory.autoCategoryData, internalSelectedCategory = _useAutoCategory.internalSelectedCategory, setInternalSelectedCategory = _useAutoCategory.setInternalSelectedCategory, selectedCategory = _useAutoCategory.selectedCategory;
+    var filteredData = useMemo(function() {
+        var byCategory = selectedCategory ? data.filter(function(item) {
+            return item.category === selectedCategory;
+        }) : data;
+        if (!filterLabels || !selectedFilterLabel) {
+            return byCategory;
+        }
+        return byCategory.filter(function(item) {
+            return item.filterLabel === selectedFilterLabel;
+        });
+    }, [
+        data,
+        selectedCategory,
+        filterLabels,
+        selectedFilterLabel
+    ]);
+    var handleInternalCategoryChange = function(category) {
+        setInternalSelectedCategory(category);
+    };
+    var handleLegendItemClick = function(chartIndex, dataIndex) {
+        setHiddenDataIndicesByChart(function(prev) {
+            var next = _object_spread({}, prev);
+            var _next_chartIndex;
+            var currentSet = new Set((_next_chartIndex = next[chartIndex]) !== null && _next_chartIndex !== void 0 ? _next_chartIndex : new Set());
+            if (currentSet.has(dataIndex)) {
+                currentSet.delete(dataIndex);
+            } else {
+                currentSet.add(dataIndex);
+            }
+            next[chartIndex] = currentSet;
+            return next;
+        });
+    };
+    if (filterList && filterList.length > 0) {
+        var uniqueItems = new Set(filterList);
+        if (uniqueItems.size !== filterList.length) {
+            var seen = new Set();
+            var duplicates = new Set();
+            filterList.forEach(function(item) {
+                if (seen.has(item)) {
+                    duplicates.add(item);
+                } else {
+                    seen.add(item);
+                }
+            });
+            throw new Error("DonutChart filterList 包含重复项: [".concat(Array.from(duplicates).join(', '), "]. 每个筛选项必须唯一。"));
         }
-      });
-      throw new Error(
-        `DonutChart filterList 包含重复项: [${Array.from(duplicates).join(", ")}]. 每个筛选项必须唯一。`
-      );
-    }
-  }
-  const statistics = useMemo(() => {
-    if (!statisticConfig)
-      return null;
-    return Array.isArray(statisticConfig) ? statisticConfig : [statisticConfig];
-  }, [statisticConfig]);
-  const handleDownload = () => {
-    var _a3, _b2;
-    if (onDownload) {
-      onDownload();
-      return;
-    }
-    const instances = (chartRefs.current || []).filter(
-      (c) => !!c
-    );
-    if (instances.length <= 1) {
-      const target = (_a3 = instances[0]) != null ? _a3 : null;
-      downloadChart(target, "donut-chart");
-      return;
-    }
-    try {
-      const canvases = instances.map((inst) => inst == null ? void 0 : inst.canvas).filter(Boolean);
-      if (canvases.length === 0) {
-        return;
-      }
-      const GAP = 16;
-      const widths = canvases.map((c) => c.width);
-      const heights = canvases.map((c) => c.height);
-      const maxWidth = Math.max(...widths);
-      const totalHeight = heights.reduce((sum, h) => sum + h, 0) + GAP * (canvases.length - 1);
-      const composite = document.createElement("canvas");
-      composite.width = maxWidth;
-      composite.height = totalHeight;
-      const ctx = composite.getContext("2d");
-      if (!ctx)
-        return;
-      ctx.fillStyle = "#ffffff";
-      ctx.fillRect(0, 0, composite.width, composite.height);
-      let offsetY = 0;
-      canvases.forEach((c, i) => {
-        const x = Math.floor((maxWidth - c.width) / 2);
-        ctx.drawImage(c, x, offsetY);
-        offsetY += c.height + (i < canvases.length - 1 ? GAP : 0);
-      });
-      const link = document.createElement("a");
-      link.download = `donut-charts-${Date.now()}.png`;
-      link.href = composite.toDataURL("image/png", 1);
-      document.body.appendChild(link);
-      link.click();
-      document.body.removeChild(link);
-    } catch (e) {
-      const target = (_b2 = instances[0]) != null ? _b2 : null;
-      downloadChart(target, "donut-chart");
     }
-  };
-  const shouldShowFilter = filterList && filterList.length > 0 || autoCategoryData;
-  const finalFilterList = filterList || (autoCategoryData ? autoCategoryData.categories : []);
-  const finalSelectedFilter = selectedFilter || internalSelectedCategory;
-  const finalOnFilterChange = onFilterChange || handleInternalCategoryChange;
-  const chartFilterTheme = ((_a2 = finalConfigs[0]) == null ? void 0 : _a2.theme) || "light";
-  const dimensions = useResponsiveDimensions(
-    isMobile,
-    windowWidth,
-    width,
-    height
-  );
-  const renderConfigs = singleMode && !configs ? Array.from({ length: filteredData.length }, (_, i) => ({
-    showLegend: false,
-    showTooltip: false,
-    backgroundColor: [
-      defaultColorList[i % defaultColorList.length],
-      "#F7F8F9"
-    ]
-  })) : finalConfigs;
-  return /* @__PURE__ */ React.createElement(
-    ChartContainer,
-    {
-      baseClassName,
-      className,
-      variant: props.variant,
-      style: {
-        ["--donut-item-min-width"]: `${dimensions.width}px`
-      }
-    },
-    showToolbar && /* @__PURE__ */ React.createElement(
-      ChartContainer,
-      {
-        baseClassName: `${baseClassName}-toolbar-wrapper`,
+    // 处理 ChartStatistic 组件配置
+    var statistics = useMemo(function() {
+        if (!statisticConfig) return null;
+        return Array.isArray(statisticConfig) ? statisticConfig : [
+            statisticConfig
+        ];
+    }, [
+        statisticConfig
+    ]);
+    var handleDownload = function() {
+        if (onDownload) {
+            onDownload();
+            return;
+        }
+        var instances = (chartRefs.current || []).filter(function(c) {
+            return !!c;
+        });
+        if (instances.length <= 1) {
+            var _instances_;
+            var target = (_instances_ = instances[0]) !== null && _instances_ !== void 0 ? _instances_ : null;
+            downloadChart(target, 'donut-chart');
+            return;
+        }
+        try {
+            var _Math;
+            // 将多个 canvas 竖直拼接为一张图片
+            var canvases = instances.map(function(inst) {
+                return inst === null || inst === void 0 ? void 0 : inst.canvas;
+            }).filter(Boolean);
+            if (canvases.length === 0) {
+                return;
+            }
+            var GAP = 16; // 竖向间距
+            var widths = canvases.map(function(c) {
+                return c.width;
+            });
+            var heights = canvases.map(function(c) {
+                return c.height;
+            });
+            var maxWidth = (_Math = Math).max.apply(_Math, _to_consumable_array(widths));
+            var totalHeight = heights.reduce(function(sum, h) {
+                return sum + h;
+            }, 0) + GAP * (canvases.length - 1);
+            var composite = document.createElement('canvas');
+            composite.width = maxWidth;
+            composite.height = totalHeight;
+            var ctx = composite.getContext('2d');
+            if (!ctx) return;
+            // 背景填充为白色，避免透明背景在 jpeg 下变黑
+            ctx.fillStyle = '#ffffff';
+            ctx.fillRect(0, 0, composite.width, composite.height);
+            var offsetY = 0;
+            canvases.forEach(function(c, i) {
+                var x = Math.floor((maxWidth - c.width) / 2);
+                ctx.drawImage(c, x, offsetY);
+                offsetY += c.height + (i < canvases.length - 1 ? GAP : 0);
+            });
+            var link = document.createElement('a');
+            link.download = "donut-charts-".concat(Date.now(), ".png");
+            link.href = composite.toDataURL('image/png', 1);
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+        } catch (e) {
+            var _instances_1;
+            // 兜底：任意异常回退为下载第一张
+            var target1 = (_instances_1 = instances[0]) !== null && _instances_1 !== void 0 ? _instances_1 : null;
+            downloadChart(target1, 'donut-chart');
+        }
+    };
+    var shouldShowFilter = filterList && filterList.length > 0 || autoCategoryData;
+    var finalFilterList = filterList || (autoCategoryData ? autoCategoryData.categories : []);
+    var finalSelectedFilter = selectedFilter || internalSelectedCategory;
+    var finalOnFilterChange = onFilterChange || handleInternalCategoryChange;
+    var chartFilterTheme = ((_finalConfigs_ = finalConfigs[0]) === null || _finalConfigs_ === void 0 ? void 0 : _finalConfigs_.theme) || 'light';
+    var dimensions = useResponsiveDimensions(isMobile, windowWidth, width, height);
+    var renderConfigs = singleMode && !configs ? Array.from({
+        length: filteredData.length
+    }, function(_, i) {
+        return {
+            showLegend: false,
+            showTooltip: false,
+            backgroundColor: [
+                defaultColorList[i % defaultColorList.length],
+                '#F7F8F9'
+            ]
+        };
+    }) : finalConfigs;
+    return /*#__PURE__*/ React.createElement(ChartContainer, {
+        baseClassName: baseClassName,
+        className: className,
+        variant: props.variant,
+        style: _define_property({}, '--donut-item-min-width', "".concat(dimensions.width, "px"))
+    }, showToolbar && /*#__PURE__*/ React.createElement(ChartContainer, {
+        baseClassName: "".concat(baseClassName, "-toolbar-wrapper"),
         variant: "borderless"
-      },
-      title && /* @__PURE__ */ React.createElement(
-        ChartToolBar,
-        {
-          title,
-          onDownload: handleDownload,
-          extra: toolbarExtra,
-          dataTime,
-          filter: renderFilterInToolbar && shouldShowFilter ? /* @__PURE__ */ React.createElement(
-            ChartFilter,
-            __spreadProps(__spreadValues({
-              filterOptions: finalFilterList.map((item) => {
+    }, title && /*#__PURE__*/ React.createElement(ChartToolBar, {
+        title: title,
+        onDownload: handleDownload,
+        extra: toolbarExtra,
+        dataTime: dataTime,
+        filter: renderFilterInToolbar && shouldShowFilter ? /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
+            filterOptions: finalFilterList.map(function(item) {
                 return {
-                  label: item || "",
-                  value: item || ""
+                    label: item || '',
+                    value: item || ''
                 };
-              }),
-              selectedFilter: finalSelectedFilter || "",
-              onFilterChange: finalOnFilterChange
-            }, filterLabels && {
-              customOptions: filteredDataByFilterLabel,
-              selectedCustomSelection: selectedFilterLabel,
-              onSelectionChange: setSelectedFilterLabel
-            }), {
-              theme: chartFilterTheme,
-              variant: "compact"
-            })
-          ) : void 0
-        }
-      ),
-      statistics && /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: classNames(
-            `${baseClassName}-statistic-container`,
-            hashId
-          )
-        },
-        statistics.map((config, index) => /* @__PURE__ */ React.createElement(
-          ChartStatistic,
-          __spreadProps(__spreadValues({
+            }),
+            selectedFilter: finalSelectedFilter || '',
+            onFilterChange: finalOnFilterChange
+        }, filterLabels && {
+            customOptions: filteredDataByFilterLabel,
+            selectedCustomSelection: selectedFilterLabel,
+            onSelectionChange: setSelectedFilterLabel
+        }), {
+            theme: chartFilterTheme,
+            variant: "compact"
+        })) : undefined
+    }), statistics && /*#__PURE__*/ React.createElement("div", {
+        className: classNames("".concat(baseClassName, "-statistic-container"), hashId)
+    }, statistics.map(function(config, index) {
+        return /*#__PURE__*/ React.createElement(ChartStatistic, _object_spread_props(_object_spread({
             key: index
-          }, config), {
+        }, config), {
             theme: chartFilterTheme
-          })
-        ))
-      ),
-      !renderFilterInToolbar && shouldShowFilter && /* @__PURE__ */ React.createElement(
-        ChartFilter,
-        __spreadProps(__spreadValues({
-          filterOptions: finalFilterList.map((item) => {
+        }));
+    })), !renderFilterInToolbar && shouldShowFilter && /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
+        filterOptions: finalFilterList.map(function(item) {
             return {
-              label: item || "",
-              value: item || ""
+                label: item || '',
+                value: item || ''
             };
-          }),
-          selectedFilter: finalSelectedFilter || "",
-          onFilterChange: finalOnFilterChange
-        }, filterLabels && {
-          customOptions: filteredDataByFilterLabel,
-          selectedCustomSelection: selectedFilterLabel,
-          onSelectionChange: setSelectedFilterLabel
-        }), {
-          theme: chartFilterTheme
-        })
-      )
-    ),
-    /* @__PURE__ */ React.createElement(
-      ChartContainer,
-      {
-        baseClassName: `${baseClassName}-content`,
+        }),
+        selectedFilter: finalSelectedFilter || '',
+        onFilterChange: finalOnFilterChange
+    }, filterLabels && {
+        customOptions: filteredDataByFilterLabel,
+        selectedCustomSelection: selectedFilterLabel,
+        onSelectionChange: setSelectedFilterLabel
+    }), {
+        theme: chartFilterTheme
+    }))), /*#__PURE__*/ React.createElement(ChartContainer, {
+        baseClassName: "".concat(baseClassName, "-content"),
         variant: "borderless"
-      },
-      renderConfigs.map((cfg, idx) => {
-        var _a3, _b2;
-        const currentDataItem = filteredData[idx];
-        const isSingleValueMode = Boolean(singleMode && currentDataItem);
-        let chartData = filteredData;
+    }, renderConfigs.map(function(cfg, idx) {
+        var _cfg_backgroundColor;
+        var currentDataItem = filteredData[idx];
+        var isSingleValueMode = Boolean(singleMode && currentDataItem);
+        var chartData = filteredData;
         if (isSingleValueMode && currentDataItem) {
-          const mainValue = typeof currentDataItem.value === "number" ? currentDataItem.value : Number(currentDataItem.value);
-          const remainingValue = Math.max(
-            0,
-            100 - (Number.isFinite(mainValue) ? mainValue : 0)
-          );
-          chartData = [
-            currentDataItem,
-            {
-              label: "剩余",
-              value: remainingValue,
-              category: currentDataItem.category
-            }
-          ];
+            var mainValue = typeof currentDataItem.value === 'number' ? currentDataItem.value : Number(currentDataItem.value);
+            var remainingValue = Math.max(0, 100 - (Number.isFinite(mainValue) ? mainValue : 0));
+            chartData = [
+                currentDataItem,
+                {
+                    label: '剩余',
+                    value: remainingValue,
+                    category: currentDataItem.category
+                }
+            ];
         }
-        const hiddenSetForChart = hiddenDataIndicesByChart[idx] || /* @__PURE__ */ new Set();
-        const visibleData = chartData.filter(
-          (_, index) => !hiddenSetForChart.has(index)
-        );
-        const toNum = (v) => typeof v === "number" ? v : Number(v);
-        const rawLabels = visibleData.map((d) => d.label);
-        const labels = isSingleValueMode ? rawLabels.map((labelText, i) => i === 1 ? "" : labelText) : rawLabels;
-        const values = visibleData.map((d) => toNum(d.value));
-        const safeValues = values.map((v) => Number.isFinite(v) ? v : 0);
-        const total = values.reduce(
-          (sum, v) => sum + (Number.isFinite(v) ? v : 0),
-          0
-        );
-        const backgroundColors = cfg.backgroundColor || defaultColorList;
-        const mainColor = (_b2 = (_a3 = cfg.backgroundColor) == null ? void 0 : _a3[0]) != null ? _b2 : defaultColorList[idx % defaultColorList.length];
-        const chartJsData = {
-          labels,
-          datasets: [
-            {
-              data: safeValues,
-              backgroundColor: isSingleValueMode ? [mainColor, "transparent"] : backgroundColors.slice(0, values.length),
-              borderColor: isSingleValueMode ? [cfg.borderColor || "#fff", "transparent"] : cfg.borderColor || "#fff",
-              hoverBackgroundColor: isSingleValueMode ? [mainColor, "transparent"] : backgroundColors.slice(0, values.length),
-              hoverBorderColor: isSingleValueMode ? [cfg.borderColor || "#fff", "transparent"] : cfg.borderColor || "#fff",
-              borderWidth: cfg.chartStyle === "pie" ? 0 : isMobile ? 1 : 1,
-              spacing: isSingleValueMode ? 0 : cfg.chartStyle === "pie" ? 0 : isMobile ? 3 : 6,
-              borderRadius: cfg.chartStyle === "pie" ? 0 : 4,
-              hoverOffset: (ctx) => isSingleValueMode && (ctx == null ? void 0 : ctx.dataIndex) === 1 ? 0 : isMobile ? 4 : 6
-            }
-          ]
+        var hiddenSetForChart = hiddenDataIndicesByChart[idx] || new Set();
+        var visibleData = chartData.filter(function(_, index) {
+            return !hiddenSetForChart.has(index);
+        });
+        var toNum = function(v) {
+            return typeof v === 'number' ? v : Number(v);
         };
-        const cutout = (() => {
-          var _a4, _b3;
-          if (cfg.chartStyle === "pie") {
-            return 0;
-          }
-          if (isMobile) {
-            if (typeof cfg.cutout === "number")
-              return cfg.cutout * 0.9;
-            return (_a4 = cfg.cutout) != null ? _a4 : isSingleValueMode ? SINGLE_MODE_MOBILE_CUTOUT : "70%";
-          }
-          return (_b3 = cfg.cutout) != null ? _b3 : isSingleValueMode ? SINGLE_MODE_DESKTOP_CUTOUT : "75%";
-        })();
-        const isDarkTheme = cfg.theme === "dark";
-        const tooltipBackgroundColor = isDarkTheme ? "#1F2937" : "#FFFFFF";
-        const tooltipBorderColor = isDarkTheme ? "#374151" : "#E5E7EB";
-        const tooltipTitleColor = isDarkTheme ? "#F9FAFB" : "#111827";
-        const tooltipBodyColor = isDarkTheme ? "#D1D5DB" : "#374151";
-        const options = {
-          responsive: true,
-          maintainAspectRatio: false,
-          cutout,
-          plugins: {
-            legend: {
-              display: false
-            },
-            tooltip: {
-              enabled: cfg.showTooltip !== false,
-              filter: (tooltipItem) => !(isSingleValueMode && tooltipItem.dataIndex === 1),
-              backgroundColor: tooltipBackgroundColor,
-              borderColor: tooltipBorderColor,
-              borderWidth: 1,
-              titleColor: tooltipTitleColor,
-              bodyColor: tooltipBodyColor,
-              padding: isMobile ? 8 : 12,
-              titleFont: {
-                size: isMobile ? 12 : 14
-              },
-              bodyFont: {
-                size: isMobile ? 11 : 13
-              },
-              callbacks: {
-                label: ({ label, raw }) => {
-                  const val = typeof raw === "number" ? raw : Number(raw);
-                  const pct = total > 0 && Number.isFinite(val) ? (val / total * 100).toFixed(0) : "0";
-                  return `${label}: ${Number.isFinite(val) ? val : raw} (${pct}%)`;
+        var rawLabels = visibleData.map(function(d) {
+            return d.label;
+        });
+        var labels = isSingleValueMode ? rawLabels.map(function(labelText, i) {
+            return i === 1 ? '' : labelText;
+        }) : rawLabels;
+        var values = visibleData.map(function(d) {
+            return toNum(d.value);
+        });
+        var safeValues = values.map(function(v) {
+            return Number.isFinite(v) ? v : 0;
+        });
+        var total = values.reduce(function(sum, v) {
+            return sum + (Number.isFinite(v) ? v : 0);
+        }, 0);
+        var backgroundColors = cfg.backgroundColor || defaultColorList;
+        var _cfg_backgroundColor_;
+        var mainColor = (_cfg_backgroundColor_ = (_cfg_backgroundColor = cfg.backgroundColor) === null || _cfg_backgroundColor === void 0 ? void 0 : _cfg_backgroundColor[0]) !== null && _cfg_backgroundColor_ !== void 0 ? _cfg_backgroundColor_ : defaultColorList[idx % defaultColorList.length];
+        var chartJsData = {
+            labels: labels,
+            datasets: [
+                {
+                    data: safeValues,
+                    backgroundColor: isSingleValueMode ? [
+                        mainColor,
+                        'transparent'
+                    ] : backgroundColors.slice(0, values.length),
+                    borderColor: isSingleValueMode ? [
+                        cfg.borderColor || '#fff',
+                        'transparent'
+                    ] : cfg.borderColor || '#fff',
+                    hoverBackgroundColor: isSingleValueMode ? [
+                        mainColor,
+                        'transparent'
+                    ] : backgroundColors.slice(0, values.length),
+                    hoverBorderColor: isSingleValueMode ? [
+                        cfg.borderColor || '#fff',
+                        'transparent'
+                    ] : cfg.borderColor || '#fff',
+                    borderWidth: cfg.chartStyle === 'pie' ? 0 : isMobile ? 1 : 1,
+                    spacing: isSingleValueMode ? 0 : cfg.chartStyle === 'pie' ? 0 : isMobile ? 3 : 6,
+                    borderRadius: cfg.chartStyle === 'pie' ? 0 : 4,
+                    hoverOffset: function(ctx) {
+                        return isSingleValueMode && (ctx === null || ctx === void 0 ? void 0 : ctx.dataIndex) === 1 ? 0 : isMobile ? 4 : 6;
+                    }
                 }
-              }
+            ]
+        };
+        var cutout = function() {
+            // 如果明确指定为饼图，cutout 为 0（实心）
+            if (cfg.chartStyle === 'pie') {
+                return 0;
+            }
+            // 环形图的逻辑
+            if (isMobile) {
+                if (typeof cfg.cutout === 'number') return cfg.cutout * 0.9;
+                var _cfg_cutout;
+                return (_cfg_cutout = cfg.cutout) !== null && _cfg_cutout !== void 0 ? _cfg_cutout : isSingleValueMode ? SINGLE_MODE_MOBILE_CUTOUT : '70%';
+            }
+            var _cfg_cutout1;
+            return (_cfg_cutout1 = cfg.cutout) !== null && _cfg_cutout1 !== void 0 ? _cfg_cutout1 : isSingleValueMode ? SINGLE_MODE_DESKTOP_CUTOUT : '75%';
+        }();
+        var isDarkTheme = cfg.theme === 'dark';
+        var tooltipBackgroundColor = isDarkTheme ? '#1F2937' : '#FFFFFF';
+        var tooltipBorderColor = isDarkTheme ? '#374151' : '#E5E7EB';
+        var tooltipTitleColor = isDarkTheme ? '#F9FAFB' : '#111827';
+        var tooltipBodyColor = isDarkTheme ? '#D1D5DB' : '#374151';
+        var options = {
+            responsive: true,
+            maintainAspectRatio: false,
+            cutout: cutout,
+            plugins: {
+                legend: {
+                    display: false
+                },
+                tooltip: {
+                    enabled: cfg.showTooltip !== false,
+                    filter: function(tooltipItem) {
+                        return !(isSingleValueMode && tooltipItem.dataIndex === 1);
+                    },
+                    backgroundColor: tooltipBackgroundColor,
+                    borderColor: tooltipBorderColor,
+                    borderWidth: 1,
+                    titleColor: tooltipTitleColor,
+                    bodyColor: tooltipBodyColor,
+                    padding: isMobile ? 8 : 12,
+                    titleFont: {
+                        size: isMobile ? 12 : 14
+                    },
+                    bodyFont: {
+                        size: isMobile ? 11 : 13
+                    },
+                    callbacks: {
+                        label: function(param) {
+                            var label = param.label, raw = param.raw;
+                            var val = typeof raw === 'number' ? raw : Number(raw);
+                            var pct = total > 0 && Number.isFinite(val) ? (val / total * 100).toFixed(0) : '0';
+                            return "".concat(label, ": ").concat(Number.isFinite(val) ? val : raw, " (").concat(pct, "%)");
+                        }
+                    }
+                }
+            },
+            animation: {
+                duration: isMobile ? 200 : 1000
+            },
+            interaction: {
+                mode: 'point',
+                intersect: false
+            },
+            layout: {
+                padding: isMobile ? 4 : 6
             }
-          },
-          animation: {
-            duration: isMobile ? 200 : 1e3
-          },
-          interaction: {
-            mode: "point",
-            intersect: false
-          },
-          layout: {
-            padding: isMobile ? 4 : 6
-          }
         };
-        return /* @__PURE__ */ React.createElement(
-          ChartContainer,
-          {
+        var _obj, _obj1;
+        return /*#__PURE__*/ React.createElement(ChartContainer, {
             key: idx,
-            baseClassName: `${baseClassName}-chart-wrapper`,
+            baseClassName: "".concat(baseClassName, "-chart-wrapper"),
             variant: "borderless"
-          },
-          isSingleValueMode ? /* @__PURE__ */ React.createElement(
-            ChartContainer,
-            {
-              baseClassName: `${baseClassName}-single`,
-              variant: "borderless",
-              style: __spreadValues({
-                ["--donut-chart-height"]: `${dimensions.height}px`,
-                ["--donut-chart-width"]: `${dimensions.width}px`,
-                width: dimensions.width,
-                height: dimensions.height,
-                marginTop: "20px"
-              }, isMobile ? { margin: "0 auto" } : {})
+        }, isSingleValueMode ? /*#__PURE__*/ React.createElement(ChartContainer, {
+            baseClassName: "".concat(baseClassName, "-single"),
+            variant: "borderless",
+            style: _object_spread((_obj = {}, _define_property(_obj, '--donut-chart-height', "".concat(dimensions.height, "px")), _define_property(_obj, '--donut-chart-width', "".concat(dimensions.width, "px")), _define_property(_obj, "width", dimensions.width), _define_property(_obj, "height", dimensions.height), _define_property(_obj, "marginTop", '20px'), _obj), isMobile ? {
+                margin: '0 auto'
+            } : {})
+        }, /*#__PURE__*/ React.createElement(Doughnut, {
+            ref: function(instance) {
+                chartRefs.current[idx] = instance;
             },
-            /* @__PURE__ */ React.createElement(
-              Doughnut,
-              {
-                ref: (instance) => {
-                  chartRefs.current[idx] = instance;
-                },
-                data: chartJsData,
-                options,
-                plugins: [
-                  // 只有环形图才显示中心文本和背景
-                  ...cfg.chartStyle !== "pie" ? [
-                    createCenterTextPlugin(
-                      (typeof currentDataItem.value === "number" ? currentDataItem.value : Number(currentDataItem.value)) / (total || 1) * 100,
-                      currentDataItem.label,
-                      isMobile
-                    ),
-                    createBackgroundArcPlugin()
-                    // 背景色
-                  ] : []
-                ]
-              }
-            )
-          ) : /* @__PURE__ */ React.createElement(
-            ChartContainer,
-            {
-              baseClassName: `${baseClassName}-row`,
-              variant: "borderless",
-              style: __spreadValues({}, isMobile ? { flexDirection: "column", alignItems: "stretch" } : {})
+            data: chartJsData,
+            options: options,
+            plugins: // 只有环形图才显示中心文本和背景
+            _to_consumable_array(cfg.chartStyle !== 'pie' ? [
+                createCenterTextPlugin((typeof currentDataItem.value === 'number' ? currentDataItem.value : Number(currentDataItem.value)) / (total || 1) * 100, currentDataItem.label, isMobile),
+                createBackgroundArcPlugin()
+            ] : [])
+        })) : /*#__PURE__*/ React.createElement(ChartContainer, {
+            baseClassName: "".concat(baseClassName, "-row"),
+            variant: "borderless",
+            style: _object_spread({}, isMobile ? {
+                flexDirection: 'column',
+                alignItems: 'stretch'
+            } : {})
+        }, /*#__PURE__*/ React.createElement(ChartContainer, {
+            baseClassName: "".concat(baseClassName, "-chart"),
+            variant: "borderless",
+            style: (_obj1 = {}, _define_property(_obj1, '--donut-chart-width', "".concat(dimensions.chartWidth, "px")), _define_property(_obj1, '--donut-chart-height', "".concat(dimensions.chartHeight, "px")), _define_property(_obj1, "width", dimensions.chartWidth), _define_property(_obj1, "height", dimensions.chartHeight), _define_property(_obj1, "marginTop", '20px'), _obj1)
+        }, /*#__PURE__*/ React.createElement(Doughnut, {
+            ref: function(instance) {
+                chartRefs.current[idx] = instance;
             },
-            /* @__PURE__ */ React.createElement(
-              ChartContainer,
-              {
-                baseClassName: `${baseClassName}-chart`,
-                variant: "borderless",
-                style: {
-                  ["--donut-chart-width"]: `${dimensions.chartWidth}px`,
-                  ["--donut-chart-height"]: `${dimensions.chartHeight}px`,
-                  width: dimensions.chartWidth,
-                  height: dimensions.chartHeight,
-                  marginTop: "20px"
-                }
-              },
-              /* @__PURE__ */ React.createElement(
-                Doughnut,
-                {
-                  ref: (instance) => {
-                    chartRefs.current[idx] = instance;
-                  },
-                  data: chartJsData,
-                  options
-                }
-              )
-            ),
-            cfg.showLegend && /* @__PURE__ */ React.createElement(
-              LegendView,
-              {
-                chartData,
-                backgroundColors,
-                hiddenDataIndicesByChart,
-                chartIndex: idx,
-                onLegendItemClick: (dataIndex) => handleLegendItemClick(idx, dataIndex),
-                total,
-                baseClassName,
-                hashId,
-                isMobile
-              }
-            )
-          )
-        );
-      })
-    )
-  );
-};
-var DonutChart_default = DonutChart;
-export {
-  DonutChart_default as default
+            data: chartJsData,
+            options: options
+        })), cfg.showLegend && /*#__PURE__*/ React.createElement(LegendView, {
+            chartData: chartData,
+            backgroundColors: backgroundColors,
+            hiddenDataIndicesByChart: hiddenDataIndicesByChart,
+            chartIndex: idx,
+            onLegendItemClick: function(dataIndex) {
+                return handleLegendItemClick(idx, dataIndex);
+            },
+            total: total,
+            baseClassName: baseClassName,
+            hashId: hashId,
+            isMobile: isMobile
+        })));
+    })));
 };
+export default DonutChart;