@ant-design/agentic-ui 2.16.0 → 2.17.0

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

@@ -3,9 +3,6 @@ function _array_like_to_array(arr, len) {
     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);
 }
@@ -25,33 +22,6 @@ function _define_property(obj, key, value) {
 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 _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.");
 }
@@ -121,9 +91,6 @@ function _object_without_properties_loose(source, excluded) {
     }
     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();
 }
@@ -136,17 +103,16 @@ function _unsupported_iterable_to_array(o, minLen) {
     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 { CategoryScale, Chart as ChartJS, Filler, Legend, LinearScale, LineElement, PointElement, Tooltip } from "chart.js";
 import classNames from "classnames";
-import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
+import React, { useContext, useMemo, useRef } from "react";
 import { Line } from "react-chartjs-2";
 import { ChartContainer, ChartFilter, ChartStatistic, ChartToolBar, downloadChart } from "../components";
 import { defaultColorList } from "../const";
-import { extractAndSortXValues, findDataPointByXValue, getDataHash } from "../utils";
+import { useChartDataFilter, useChartStatistics, useChartTheme, useResponsiveSize } from "../hooks";
+import { extractAndSortXValues, findDataPointByXValue, registerLineChartComponents } from "../utils";
 import { useStyle } from "./style";
-var lineChartComponentsRegistered = false;
 var LineChart = function(_param) {
-    var title = _param.title, data = _param.data, _param_width = _param.width, width = _param_width === void 0 ? 600 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 400 : _param_height, className = _param.className, dataTime = _param.dataTime, _param_theme = _param.theme, theme = _param_theme === void 0 ? 'light' : _param_theme, color = _param.color, _param_showLegend = _param.showLegend, showLegend = _param_showLegend === void 0 ? true : _param_showLegend, _param_legendPosition = _param.legendPosition, legendPosition = _param_legendPosition === void 0 ? 'bottom' : _param_legendPosition, _param_legendAlign = _param.legendAlign, legendAlign = _param_legendAlign === void 0 ? 'start' : _param_legendAlign, _param_showGrid = _param.showGrid, showGrid = _param_showGrid === void 0 ? true : _param_showGrid, _param_xPosition = _param.xPosition, xPosition = _param_xPosition === void 0 ? 'bottom' : _param_xPosition, _param_yPosition = _param.yPosition, yPosition = _param_yPosition === void 0 ? 'left' : _param_yPosition, _param_hiddenX = _param.hiddenX, hiddenX = _param_hiddenX === void 0 ? false : _param_hiddenX, _param_hiddenY = _param.hiddenY, hiddenY = _param_hiddenY === void 0 ? false : _param_hiddenY, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, statisticConfig = _param.statistic, props = _object_without_properties(_param, [
+    var title = _param.title, data = _param.data, _param_width = _param.width, width = _param_width === void 0 ? 600 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 400 : _param_height, className = _param.className, dataTime = _param.dataTime, _param_theme = _param.theme, theme = _param_theme === void 0 ? 'light' : _param_theme, color = _param.color, _param_showLegend = _param.showLegend, showLegend = _param_showLegend === void 0 ? true : _param_showLegend, _param_legendPosition = _param.legendPosition, legendPosition = _param_legendPosition === void 0 ? 'bottom' : _param_legendPosition, _param_legendAlign = _param.legendAlign, legendAlign = _param_legendAlign === void 0 ? 'start' : _param_legendAlign, _param_showGrid = _param.showGrid, showGrid = _param_showGrid === void 0 ? true : _param_showGrid, _param_xPosition = _param.xPosition, xPosition = _param_xPosition === void 0 ? 'bottom' : _param_xPosition, _param_yPosition = _param.yPosition, yPosition = _param_yPosition === void 0 ? 'left' : _param_yPosition, _param_hiddenX = _param.hiddenX, hiddenX = _param_hiddenX === void 0 ? false : _param_hiddenX, _param_hiddenY = _param.hiddenY, hiddenY = _param_hiddenY === void 0 ? false : _param_hiddenY, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, statisticConfig = _param.statistic, _param_loading = _param.loading, loading = _param_loading === void 0 ? false : _param_loading, props = _object_without_properties(_param, [
         "title",
         "data",
         "width",
@@ -165,111 +131,24 @@ var LineChart = function(_param) {
         "hiddenY",
         "toolbarExtra",
         "renderFilterInToolbar",
-        "statistic"
-    ]);
-    useMemo(function() {
-        if (lineChartComponentsRegistered) {
-            return undefined;
-        }
-        if (typeof window === 'undefined') {
-            return undefined;
-        }
-        ChartJS.register(CategoryScale, LinearScale, PointElement, LineElement, Filler, Tooltip, Legend);
-        lineChartComponentsRegistered = true;
-        return undefined;
-    }, []);
-    var safeData = Array.isArray(data) ? data : [];
-    // 使用数据哈希来优化依赖项比较
-    var dataHash = useMemo(function() {
-        return getDataHash(safeData);
-    }, [
-        safeData
+        "statistic",
+        "loading"
     ]);
-    // 响应式尺寸计算
-    var _useState = _sliced_to_array(useState(typeof window !== 'undefined' ? window.innerWidth : 768), 2), windowWidth = _useState[0], setWindowWidth = _useState[1];
-    var isMobile = windowWidth <= 768;
-    var responsiveWidth = isMobile ? '100%' : width;
-    var responsiveHeight = isMobile ? Math.min(windowWidth * 0.8, 400) : height;
-    // 监听窗口大小变化
-    useEffect(function() {
-        var handleResize = function() {
-            setWindowWidth(window.innerWidth);
-        };
-        if (typeof window !== 'undefined') {
-            window.addEventListener('resize', handleResize);
-            return function() {
-                return window.removeEventListener('resize', handleResize);
-            };
-        }
-    }, []);
+    // 注册 Chart.js 组件
+    registerLineChartComponents();
+    // 响应式尺寸
+    var _useResponsiveSize = useResponsiveSize(width, height), responsiveWidth = _useResponsiveSize.responsiveWidth, responsiveHeight = _useResponsiveSize.responsiveHeight, isMobile = _useResponsiveSize.isMobile;
     // 样式注册
     var context = useContext(ConfigProvider.ConfigContext);
     var baseClassName = context === null || context === void 0 ? void 0 : context.getPrefixCls('line-chart-container');
     var _useStyle = useStyle(baseClassName), wrapSSR = _useStyle.wrapSSR, hashId = _useStyle.hashId;
     var chartRef = useRef(null);
     // 处理 ChartStatistic 组件配置
-    var statistics = useMemo(function() {
-        if (!statisticConfig) return null;
-        return Array.isArray(statisticConfig) ? statisticConfig : [
-            statisticConfig
-        ];
-    }, [
-        statisticConfig
-    ]);
-    // 从数据中提取唯一的类别作为筛选选项
-    var categories = useMemo(function() {
-        var uniqueCategories = _to_consumable_array(new Set(safeData.map(function(item) {
-            return item.category;
-        }))).filter(Boolean);
-        return uniqueCategories;
-    }, [
-        dataHash
-    ]);
-    // 从数据中提取 filterLabel，过滤掉 undefined 值
-    var validFilterLabels = useMemo(function() {
-        return safeData.map(function(item) {
-            return item.filterLabel;
-        }).filter(function(filterLabel) {
-            return filterLabel !== undefined;
-        });
-    }, [
-        dataHash
-    ]);
-    var filterLabels = useMemo(function() {
-        return validFilterLabels.length > 0 ? _to_consumable_array(new Set(validFilterLabels)) : undefined;
-    }, [
-        validFilterLabels
-    ]);
-    // 状态管理
-    var _useState1 = _sliced_to_array(useState(categories.find(Boolean) || ''), 2), selectedFilter = _useState1[0], setSelectedFilter = _useState1[1];
-    var _useState2 = _sliced_to_array(useState(filterLabels && filterLabels.length > 0 ? filterLabels[0] : undefined), 2), selectedFilterLabel = _useState2[0], setSelectedFilterLabel = _useState2[1];
-    // 当数据变化导致当前选中分类失效时，自动回退到首个有效分类或空（显示全部）
-    useEffect(function() {
-        if (selectedFilter && !categories.includes(selectedFilter)) {
-            setSelectedFilter(categories.find(Boolean) || '');
-        }
-    }, [
-        categories,
-        selectedFilter
-    ]);
-    // 筛选数据
-    var filteredData = useMemo(function() {
-        var base = selectedFilter ? safeData.filter(function(item) {
-            return item.category === selectedFilter;
-        }) : safeData;
-        var withFilterLabel = !filterLabels || !selectedFilterLabel ? base : base.filter(function(item) {
-            return item.filterLabel === selectedFilterLabel;
-        });
-        // 统一过滤掉 x 为空（null/undefined）的数据，避免后续 toString 报错
-        return withFilterLabel.filter(function(item) {
-            return item.x !== null && item.x !== undefined;
-        });
-    }, [
-        dataHash,
-        selectedFilter,
-        filterLabels,
-        selectedFilterLabel
-    ]);
+    var statistics = useChartStatistics(statisticConfig);
+    // 数据筛选
+    var _useChartDataFilter = useChartDataFilter(data), filteredData = _useChartDataFilter.filteredData, filterOptions = _useChartDataFilter.filterOptions, filterLabels = _useChartDataFilter.filterLabels, selectedFilter = _useChartDataFilter.selectedFilter, setSelectedFilter = _useChartDataFilter.setSelectedFilter, selectedFilterLabel = _useChartDataFilter.selectedFilterLabel, setSelectedFilterLabel = _useChartDataFilter.setSelectedFilterLabel, filteredDataByFilterLabel = _useChartDataFilter.filteredDataByFilterLabel;
+    // 主题颜色
+    var _useChartTheme = useChartTheme(theme), axisTextColor = _useChartTheme.axisTextColor, gridColor = _useChartTheme.gridColor, isLight = _useChartTheme.isLight;
     // 从数据中提取唯一的类型
     var types = useMemo(function() {
         return _to_consumable_array(new Set(filteredData.map(function(item) {
@@ -338,31 +217,6 @@ var LineChart = function(_param) {
         types,
         xValues
     ]);
-    // 筛选器选项
-    var filterOptions = useMemo(function() {
-        return categories.map(function(category) {
-            return {
-                label: category || '默认',
-                value: category || '默认'
-            };
-        });
-    }, [
-        categories
-    ]);
-    // 根据 filterLabel 筛选数据 - 只有当 filterLabels 存在时才生成
-    var filteredDataByFilterLabel = useMemo(function() {
-        return filterLabels === null || filterLabels === void 0 ? void 0 : filterLabels.map(function(item) {
-            return {
-                key: item,
-                label: item
-            };
-        });
-    }, [
-        filterLabels
-    ]);
-    var isLight = theme === 'light';
-    var axisTextColor = isLight ? 'rgba(0, 25, 61, 0.3255)' : 'rgba(255, 255, 255, 0.8)';
-    var gridColor = isLight ? 'rgba(0,0,0,0.08)' : 'rgba(255,255,255,0.2)';
     var options = {
         responsive: true,
         maintainAspectRatio: false,
@@ -500,6 +354,7 @@ var LineChart = function(_param) {
         onDownload: handleDownload,
         extra: toolbarExtra,
         dataTime: dataTime,
+        loading: loading,
         filter: renderFilterInToolbar && filterOptions && filterOptions.length > 1 ? /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
             filterOptions: filterOptions,
             selectedFilter: selectedFilter,
@@ -520,7 +375,7 @@ var LineChart = function(_param) {
         }, config), {
             theme: theme
         }));
-    })), !renderFilterInToolbar && filterOptions && filterOptions.length > 1 && /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
+    })), /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
         filterOptions: filterOptions,
         selectedFilter: selectedFilter,
         onFilterChange: setSelectedFilter

package/dist/Plugins/chart/RadarChart/index.d.ts

@@ -40,6 +40,8 @@ interface RadarChartProps extends ChartContainerProps {
     statistic?: StatisticConfigType;
     /** 图例文字最大宽度（像素），超出则显示省略号，默认80px */
     textMaxWidth?: number;
+    /** 是否显示加载状态（当图表未闭合时显示） */
+    loading?: boolean;
 }
 declare const RadarChart: React.FC<RadarChartProps>;
 export default RadarChart;

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

@@ -138,7 +138,7 @@ import { defaultColorList } from "../const";
 import { useStyle } from "./style";
 var radarChartComponentsRegistered = false;
 var RadarChart = function(_param) {
-    var data = _param.data, title = _param.title, _param_width = _param.width, width = _param_width === void 0 ? 600 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 400 : _param_height, className = _param.className, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, dataTime = _param.dataTime, color = _param.color, statisticConfig = _param.statistic, _param_textMaxWidth = _param.textMaxWidth, textMaxWidth = _param_textMaxWidth === void 0 ? 80 : _param_textMaxWidth, props = _object_without_properties(_param, [
+    var data = _param.data, title = _param.title, _param_width = _param.width, width = _param_width === void 0 ? 600 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 400 : _param_height, className = _param.className, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, dataTime = _param.dataTime, color = _param.color, statisticConfig = _param.statistic, _param_textMaxWidth = _param.textMaxWidth, textMaxWidth = _param_textMaxWidth === void 0 ? 80 : _param_textMaxWidth, _param_loading = _param.loading, loading = _param_loading === void 0 ? false : _param_loading, props = _object_without_properties(_param, [
         "data",
         "title",
         "width",
@@ -149,7 +149,8 @@ var RadarChart = function(_param) {
         "dataTime",
         "color",
         "statistic",
-        "textMaxWidth"
+        "textMaxWidth",
+        "loading"
     ]);
     useMemo(function() {
         if (radarChartComponentsRegistered) {
@@ -267,7 +268,8 @@ var RadarChart = function(_param) {
             title: title || '雷达图',
             onDownload: function() {},
             extra: toolbarExtra,
-            dataTime: dataTime
+            dataTime: dataTime,
+            loading: loading
         }), /*#__PURE__*/ React.createElement("div", {
             className: classNames("".concat(prefixCls, "-empty-wrapper"), hashId),
             style: {
@@ -551,6 +553,7 @@ var RadarChart = function(_param) {
             onDownload: handleDownload,
             extra: toolbarExtra,
             dataTime: dataTime,
+            loading: loading,
             filter: renderFilterInToolbar && filterEnum.length > 0 ? /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
                 filterOptions: filterEnum,
                 selectedFilter: selectedFilter,
@@ -604,7 +607,8 @@ var RadarChart = function(_param) {
             title: title || '雷达图',
             onDownload: function() {},
             extra: toolbarExtra,
-            dataTime: dataTime
+            dataTime: dataTime,
+            loading: loading
         }), /*#__PURE__*/ React.createElement("div", {
             className: classNames("".concat(prefixCls, "-error-wrapper"), hashId),
             style: {

package/dist/Plugins/chart/ScatterChart/index.d.ts

@@ -49,6 +49,8 @@ export interface ScatterChartProps extends ChartContainerProps {
     statistic?: StatisticConfigType;
     /** 图例文字最大宽度（像素），超出则显示省略号，默认80px */
     textMaxWidth?: number;
+    /** 是否显示加载状态（当图表未闭合时显示） */
+    loading?: boolean;
 }
 declare const ScatterChart: React.FC<ScatterChartProps>;
 export default ScatterChart;

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

@@ -138,7 +138,7 @@ import { defaultColorList } from "../const";
 import { useStyle } from "./style";
 var scatterChartComponentsRegistered = false;
 var ScatterChart = function(_param) {
-    var data = _param.data, _param_width = _param.width, width = _param_width === void 0 ? 600 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 400 : _param_height, className = _param.className, title = _param.title, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, dataTime = _param.dataTime, _param_xUnit = _param.xUnit, xUnit = _param_xUnit === void 0 ? '月' : _param_xUnit, yUnit = _param.yUnit, xAxisLabel = _param.xAxisLabel, yAxisLabel = _param.yAxisLabel, _param_xPosition = _param.xPosition, xPosition = _param_xPosition === void 0 ? 'bottom' : _param_xPosition, _param_yPosition = _param.yPosition, yPosition = _param_yPosition === void 0 ? 'left' : _param_yPosition, _param_hiddenX = _param.hiddenX, hiddenX = _param_hiddenX === void 0 ? false : _param_hiddenX, _param_hiddenY = _param.hiddenY, hiddenY = _param_hiddenY === void 0 ? false : _param_hiddenY, _param_showGrid = _param.showGrid, showGrid = _param_showGrid === void 0 ? true : _param_showGrid, color = _param.color, statisticConfig = _param.statistic, _param_textMaxWidth = _param.textMaxWidth, textMaxWidth = _param_textMaxWidth === void 0 ? 80 : _param_textMaxWidth, props = _object_without_properties(_param, [
+    var data = _param.data, _param_width = _param.width, width = _param_width === void 0 ? 600 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 400 : _param_height, className = _param.className, title = _param.title, toolbarExtra = _param.toolbarExtra, _param_renderFilterInToolbar = _param.renderFilterInToolbar, renderFilterInToolbar = _param_renderFilterInToolbar === void 0 ? false : _param_renderFilterInToolbar, dataTime = _param.dataTime, _param_xUnit = _param.xUnit, xUnit = _param_xUnit === void 0 ? '月' : _param_xUnit, yUnit = _param.yUnit, xAxisLabel = _param.xAxisLabel, yAxisLabel = _param.yAxisLabel, _param_xPosition = _param.xPosition, xPosition = _param_xPosition === void 0 ? 'bottom' : _param_xPosition, _param_yPosition = _param.yPosition, yPosition = _param_yPosition === void 0 ? 'left' : _param_yPosition, _param_hiddenX = _param.hiddenX, hiddenX = _param_hiddenX === void 0 ? false : _param_hiddenX, _param_hiddenY = _param.hiddenY, hiddenY = _param_hiddenY === void 0 ? false : _param_hiddenY, _param_showGrid = _param.showGrid, showGrid = _param_showGrid === void 0 ? true : _param_showGrid, color = _param.color, statisticConfig = _param.statistic, _param_textMaxWidth = _param.textMaxWidth, textMaxWidth = _param_textMaxWidth === void 0 ? 80 : _param_textMaxWidth, _param_loading = _param.loading, loading = _param_loading === void 0 ? false : _param_loading, props = _object_without_properties(_param, [
         "data",
         "width",
         "height",
@@ -158,7 +158,8 @@ var ScatterChart = function(_param) {
         "showGrid",
         "color",
         "statistic",
-        "textMaxWidth"
+        "textMaxWidth",
+        "loading"
     ]);
     useMemo(function() {
         if (scatterChartComponentsRegistered) {
@@ -271,7 +272,8 @@ var ScatterChart = function(_param) {
             title: title || '散点图',
             onDownload: function() {},
             extra: toolbarExtra,
-            dataTime: dataTime
+            dataTime: dataTime,
+            loading: loading
         }), /*#__PURE__*/ React.createElement("div", {
             className: classNames("".concat(prefixCls, "-empty-wrapper"), hashId),
             style: {
@@ -602,6 +604,7 @@ var ScatterChart = function(_param) {
             onDownload: handleDownload,
             extra: toolbarExtra,
             dataTime: dataTime,
+            loading: loading,
             filter: renderFilterInToolbar && filterEnum.length > 0 ? /*#__PURE__*/ React.createElement(ChartFilter, _object_spread_props(_object_spread({
                 filterOptions: filterEnum,
                 selectedFilter: selectedFilter,
@@ -658,7 +661,8 @@ var ScatterChart = function(_param) {
             title: title || '散点图',
             onDownload: function() {},
             extra: toolbarExtra,
-            dataTime: dataTime
+            dataTime: dataTime,
+            loading: loading
         }), /*#__PURE__*/ React.createElement("div", {
             className: classNames("".concat(prefixCls, "-error-wrapper"), hashId),
             style: {

package/dist/Plugins/chart/components/ChartContainer/ChartContainer.d.ts

@@ -19,6 +19,7 @@ export interface ChartContainerProps {
         /** 错误回调函数 */
         onError?: (error: Error, errorInfo: React.ErrorInfo) => void;
     };
+    loading?: boolean;
 }
 export interface ChartContainerRef {
     hashId: string;

package/dist/Plugins/chart/components/ChartFilter/ChartFilter.d.ts

@@ -18,5 +18,5 @@ export interface ChartFilterProps {
     theme?: 'light' | 'dark';
     variant?: 'default' | 'compact';
 }
-declare const ChartFilter: React.FC<ChartFilterProps>;
+declare const ChartFilter: React.NamedExoticComponent<ChartFilterProps>;
 export default ChartFilter;

package/dist/Plugins/chart/components/ChartFilter/ChartFilter.js

@@ -1,36 +1,228 @@
+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 _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 _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 _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 _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 { ChevronDown } from "@sofa-design/icons";
 import { Button, ConfigProvider, Dropdown, Segmented } from "antd";
 import classNames from "classnames";
-import React, { useContext } from "react";
+import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
 import { I18nContext } from "../../../../I18n";
+import { debounce } from "../../utils";
 import { useStyle } from "./style";
-var ChartFilter = function(param) {
+/**
+ * 比较两个数组是否相等（浅比较）
+ */ var areArraysEqual = function(a, b) {
+    if (a === b) return true;
+    if (!a || !b) return false;
+    if (a.length !== b.length) return false;
+    return a.every(function(item, index) {
+        var other = b[index];
+        if (!other) return false;
+        // 比较所有属性
+        return Object.keys(item).every(function(key) {
+            return item[key] === other[key];
+        });
+    });
+};
+/**
+ * ChartFilter 组件的 props 比较函数
+ * 用于 React.memo 优化，只在真正需要时重新渲染
+ *
+ * 注意：由于组件内部使用 ref 保存上一次有效的 filterOptions，
+ * 即使 filterOptions 暂时为空也不会导致组件消失。
+ * 因此比较时，如果当前值为空但之前有值，我们仍然认为它们"相等"（使用稳定值）。
+ */ var arePropsEqual = function(prevProps, nextProps) {
+    // 比较基本属性
+    if (prevProps.selectedFilter !== nextProps.selectedFilter || prevProps.selectedCustomSelection !== nextProps.selectedCustomSelection || prevProps.className !== nextProps.className || prevProps.theme !== nextProps.theme || prevProps.variant !== nextProps.variant) {
+        return false;
+    }
+    // 比较数组属性（filterOptions 和 customOptions）
+    // 如果两个都是空或都有效，比较内容
+    // 如果一个为空一个有效，认为不相等（需要更新稳定值）
+    var prevFilterValid = prevProps.filterOptions && prevProps.filterOptions.length > 1;
+    var nextFilterValid = nextProps.filterOptions && nextProps.filterOptions.length > 1;
+    // 如果两个都有效，比较内容
+    if (prevFilterValid && nextFilterValid) {
+        if (!areArraysEqual(prevProps.filterOptions, nextProps.filterOptions)) {
+            return false;
+        }
+    } else if (prevFilterValid !== nextFilterValid) {
+        return false;
+    }
+    // 如果两个都无效，认为相等（使用上一次的稳定值）
+    var prevCustomValid = prevProps.customOptions && prevProps.customOptions.length > 1;
+    var nextCustomValid = nextProps.customOptions && nextProps.customOptions.length > 1;
+    if (prevCustomValid && nextCustomValid) {
+        if (!areArraysEqual(prevProps.customOptions, nextProps.customOptions)) {
+            return false;
+        }
+    } else if (prevCustomValid !== nextCustomValid) {
+        return false;
+    }
+    // 回调函数比较
+    // 由于我们已经用 ref 处理回调，即使引用变化也不会影响防抖逻辑
+    // 为了 memo 优化，我们只检查回调是否存在，不比较引用
+    var prevHasFilterChange = prevProps.onFilterChange !== undefined;
+    var nextHasFilterChange = nextProps.onFilterChange !== undefined;
+    if (prevHasFilterChange !== nextHasFilterChange) {
+        return false;
+    }
+    var prevHasSelectionChange = prevProps.onSelectionChange !== undefined;
+    var nextHasSelectionChange = nextProps.onSelectionChange !== undefined;
+    if (prevHasSelectionChange !== nextHasSelectionChange) {
+        return false;
+    }
+    // 所有关键属性都相同，可以跳过重新渲染
+    return true;
+};
+var ChartFilterComponent = function(param) {
     var filterOptions = param.filterOptions, selectedFilter = param.selectedFilter, onFilterChange = param.onFilterChange, customOptions = param.customOptions, selectedCustomSelection = param.selectedCustomSelection, onSelectionChange = param.onSelectionChange, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, _param_theme = param.theme, theme = _param_theme === void 0 ? 'light' : _param_theme, _param_variant = param.variant, variant = _param_variant === void 0 ? 'default' : _param_variant;
-    var _customOptions_find, _i18n_locale;
+    var _stableCustomOptions_find, _i18n_locale;
     var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
     var i18n = useContext(I18nContext);
     var prefixCls = getPrefixCls('chart-filter');
     var _useStyle = useStyle(prefixCls), wrapSSR = _useStyle.wrapSSR, hashId = _useStyle.hashId;
-    var handleRegionChange = function(region) {
-        if (onSelectionChange) {
-            onSelectionChange(region);
+    // 使用 useRef 保存最新的回调函数，避免防抖函数闭包问题
+    var onFilterChangeRef = useRef(onFilterChange);
+    var onSelectionChangeRef = useRef(onSelectionChange);
+    // 更新 ref，确保总是使用最新的回调
+    React.useEffect(function() {
+        onFilterChangeRef.current = onFilterChange;
+        onSelectionChangeRef.current = onSelectionChange;
+    }, [
+        onFilterChange,
+        onSelectionChange
+    ]);
+    // 创建防抖的回调函数，1秒更新一次
+    var debouncedFilterChange = useMemo(function() {
+        return debounce(function(value) {
+            if (onFilterChangeRef.current) {
+                onFilterChangeRef.current(value);
+            }
+        }, 1000);
+    }, []);
+    var debouncedSelectionChange = useMemo(function() {
+        return debounce(function(region) {
+            if (onSelectionChangeRef.current) {
+                onSelectionChangeRef.current(region);
+            }
+        }, 1000);
+    }, []);
+    // 组件卸载时清理防抖函数
+    React.useEffect(function() {
+        return function() {
+            var _debouncedFilterChange_cancel, _debouncedSelectionChange_cancel;
+            debouncedFilterChange === null || debouncedFilterChange === void 0 ? void 0 : (_debouncedFilterChange_cancel = debouncedFilterChange.cancel) === null || _debouncedFilterChange_cancel === void 0 ? void 0 : _debouncedFilterChange_cancel.call(debouncedFilterChange);
+            debouncedSelectionChange === null || debouncedSelectionChange === void 0 ? void 0 : (_debouncedSelectionChange_cancel = debouncedSelectionChange.cancel) === null || _debouncedSelectionChange_cancel === void 0 ? void 0 : _debouncedSelectionChange_cancel.call(debouncedSelectionChange);
+        };
+    }, [
+        debouncedFilterChange,
+        debouncedSelectionChange
+    ]);
+    // 稳定化 filterOptions 和 customOptions，避免在流式更新时频繁变化导致组件跳动
+    // 使用 useState 保存稳定的值，只在内容真正变化时才更新
+    var _useState = _sliced_to_array(useState(function() {
+        return filterOptions && filterOptions.length > 1 ? filterOptions : undefined;
+    }), 2), stableFilterOptions = _useState[0], setStableFilterOptions = _useState[1];
+    var _useState1 = _sliced_to_array(useState(function() {
+        return customOptions && customOptions.length > 1 ? customOptions : undefined;
+    }), 2), stableCustomOptions = _useState1[0], setStableCustomOptions = _useState1[1];
+    // 使用 useRef 保存上一次的值用于内容比较
+    var prevFilterOptionsRef = useRef(filterOptions);
+    var prevCustomOptionsRef = useRef(customOptions);
+    // 当 filterOptions 变化时，只在内容真正变化时才更新
+    useEffect(function() {
+        if (filterOptions && filterOptions.length > 1) {
+            // 比较内容是否真的变化
+            var contentChanged = !areArraysEqual(prevFilterOptionsRef.current, filterOptions);
+            if (contentChanged) {
+                // 内容变化，更新稳定值
+                setStableFilterOptions(filterOptions);
+                prevFilterOptionsRef.current = filterOptions;
+            }
+        // 如果内容相同，不更新，避免不必要的重新渲染
+        } else if (filterOptions && filterOptions.length <= 1) {
+        // 如果新值无效（长度 <= 1），但之前有有效值，保持上一次的值（不更新）
+        // 这样 filter 不会消失
+        }
+    // 注意：如果 filterOptions 变为 undefined 或 null，我们不更新稳定值，保持上一次的值
+    }, [
+        filterOptions
+    ]);
+    useEffect(function() {
+        if (customOptions && customOptions.length > 1) {
+            var contentChanged = !areArraysEqual(prevCustomOptionsRef.current, customOptions);
+            if (contentChanged) {
+                setStableCustomOptions(customOptions);
+                prevCustomOptionsRef.current = customOptions;
+            }
         }
+    }, [
+        customOptions
+    ]);
+    var handleRegionChange = function(region) {
+        debouncedSelectionChange(region);
+    };
+    var handleFilterChange = function(value) {
+        debouncedFilterChange(value);
     };
-    var hasMain = Array.isArray(filterOptions) && filterOptions.length > 1;
-    var hasSecondary = Array.isArray(customOptions) && customOptions.length > 1;
+    var hasMain = Array.isArray(stableFilterOptions) && stableFilterOptions.length > 1;
+    var hasSecondary = Array.isArray(stableCustomOptions) && stableCustomOptions.length > 1;
     if (!hasMain && !hasSecondary) {
         return null;
     }
-    if (!filterOptions || filterOptions.length < 2) {
+    if (!stableFilterOptions || stableFilterOptions.length < 2) {
         return null;
     }
     return wrapSSR(/*#__PURE__*/ React.createElement("div", {
         className: classNames(prefixCls, "".concat(prefixCls, "-").concat(theme), "".concat(prefixCls, "-").concat(variant), hashId, className)
-    }, customOptions && customOptions.length > 1 && /*#__PURE__*/ React.createElement("div", {
+    }, stableCustomOptions && stableCustomOptions.length > 1 && /*#__PURE__*/ React.createElement("div", {
         className: classNames("".concat(prefixCls, "-region-filter"), hashId)
     }, /*#__PURE__*/ React.createElement(Dropdown, {
         menu: {
-            items: customOptions.map(function(item) {
+            items: stableCustomOptions.map(function(item) {
                 return {
                     key: item.key,
                     label: item.label,
@@ -52,18 +244,20 @@ var ChartFilter = function(param) {
         type: "default",
         size: "small",
         className: classNames("".concat(prefixCls, "-region-dropdown-btn"), hashId)
-    }, /*#__PURE__*/ React.createElement("span", null, ((_customOptions_find = customOptions.find(function(r) {
+    }, /*#__PURE__*/ React.createElement("span", null, ((_stableCustomOptions_find = stableCustomOptions.find(function(r) {
         return r.key === selectedCustomSelection;
-    })) === null || _customOptions_find === void 0 ? void 0 : _customOptions_find.label) || (i18n === null || i18n === void 0 ? void 0 : (_i18n_locale = i18n.locale) === null || _i18n_locale === void 0 ? void 0 : _i18n_locale.all) || '全部'), /*#__PURE__*/ React.createElement(ChevronDown, {
+    })) === null || _stableCustomOptions_find === void 0 ? void 0 : _stableCustomOptions_find.label) || (i18n === null || i18n === void 0 ? void 0 : (_i18n_locale = i18n.locale) === null || _i18n_locale === void 0 ? void 0 : _i18n_locale.all) || '全部'), /*#__PURE__*/ React.createElement(ChevronDown, {
         className: classNames("".concat(prefixCls, "-dropdown-icon"), hashId)
-    })))), filterOptions && filterOptions.length > 1 && /*#__PURE__*/ React.createElement(Segmented, {
-        options: filterOptions || [],
+    })))), stableFilterOptions && stableFilterOptions.length > 1 && /*#__PURE__*/ React.createElement(Segmented, {
+        options: stableFilterOptions || [],
         value: selectedFilter,
         size: "small",
         className: classNames("".concat(prefixCls, "-segmented-filter"), 'custom-segmented', hashId),
         onChange: function(value) {
-            return onFilterChange === null || onFilterChange === void 0 ? void 0 : onFilterChange(value);
+            return handleFilterChange(value);
         }
     })));
 };
+// 使用 React.memo 包装组件，确保内容稳定，只在 props 真正变化时重新渲染
+var ChartFilter = /*#__PURE__*/ React.memo(ChartFilterComponent, arePropsEqual);
 export default ChartFilter;