@ant-design/agentic-ui 2.7.1 → 2.9.0

package/dist/Components/TypingAnimation/style.js

@@ -1,59 +1,83 @@
-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 _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));
-
-// src/Components/TypingAnimation/style.ts
+    return obj;
+}
+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;
+}
 import { Keyframes } from "@ant-design/cssinjs";
-import {
-  useEditorStyleRegister
-} from "../../Hooks/useStyle";
-var animation = new Keyframes("animation", {
-  "0%": {
-    opacity: 0
-  },
-  "100%": {
-    opacity: 1
-  }
+import { useEditorStyleRegister } from "../../Hooks/useStyle";
+var animation = new Keyframes('animation', {
+    '0%': {
+        opacity: 0
+    },
+    '100%': {
+        opacity: 1
+    }
 });
-var genStyle = (token) => {
-  return {
-    [token.componentCls]: {
-      ["&-cursor"]: {
-        display: "inline-block"
-      },
-      ["&-cursor-blinking"]: {
+var genStyle = function(token) {
+    var _obj;
+    return _define_property({}, token.componentCls, (_obj = {}, _define_property(_obj, '&-cursor', {
+        display: 'inline-block'
+    }), _define_property(_obj, '&-cursor-blinking', {
         animationName: animation,
-        animationDuration: "1s",
-        animationTimingFunction: "steps(1, end)",
-        animationIterationCount: "infinite"
-      }
-    }
-  };
+        animationDuration: '1s',
+        animationTimingFunction: 'steps(1, end)',
+        animationIterationCount: 'infinite'
+    }), _obj));
 };
-var useTypingAnimationStyle = (prefixCls) => {
-  return useEditorStyleRegister("typing-animation", (token) => {
-    const typingAnimationToken = __spreadProps(__spreadValues({}, token), {
-      componentCls: `.${prefixCls}`
+export var useTypingAnimationStyle = function(prefixCls) {
+    return useEditorStyleRegister('typing-animation', function(token) {
+        var typingAnimationToken = _object_spread_props(_object_spread({}, token), {
+            componentCls: ".".concat(prefixCls)
+        });
+        return [
+            genStyle(typingAnimationToken)
+        ];
     });
-    return [genStyle(typingAnimationToken)];
-  });
-};
-export {
-  useTypingAnimationStyle
 };

package/dist/Components/VisualList/index.js

@@ -1,190 +1,277 @@
-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 _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));
-
-// src/Components/VisualList/index.tsx
+    return obj;
+}
+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 _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 _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 { SquareArrowUpRight } from "@sofa-design/icons";
 import classNames from "classnames";
 import React, { memo, useMemo, useState } from "react";
 import { useRefFunction } from "../../Hooks/useRefFunction";
 import { useStyle } from "./style";
-var VisualListComponent = ({
-  className,
-  style,
-  data,
-  filter,
-  emptyRender,
-  renderItem,
-  loading: legacyLoading = false,
-  isLoading,
-  loadingRender,
-  itemStyle,
-  imageStyle,
-  linkStyle,
-  shape = "default",
-  prefixCls = "visual-list",
-  variant = "default",
-  description
-}) => {
-  const loading = isLoading != null ? isLoading : legacyLoading;
-  const { wrapSSR, hashId } = useStyle(prefixCls);
-  const displayList = useMemo(() => {
-    if (!filter) {
-      return data || [];
-    }
-    return (data == null ? void 0 : data.filter(filter)) || [];
-  }, [data, filter]);
-  const containerClassName = useMemo(() => {
-    return classNames(
-      `${prefixCls}-container`,
-      hashId,
-      {
-        [`${prefixCls}-outline`]: variant === "outline",
-        [`${prefixCls}-borderless`]: variant === "borderless",
-        [`${prefixCls}-default`]: variant === "default"
-      },
-      className
-    );
-  }, [prefixCls, hashId, variant, className]);
-  const ImageComponent = memo(({ item, prefixCls: prefixCls2, hashId: hashId2, shape: shape2, imageStyle: imageStyle2, onImageError }) => {
-    const [imageError, setImageError] = useState(false);
-    const handleImageError = useRefFunction(() => {
-      setImageError(true);
-      onImageError();
+/**
+ * VisualList 组件 - 视觉列表组件
+ *
+ * 一个灵活的图片列表组件，支持多种尺寸、形状和自定义渲染。
+ * 基于 css-in-js 样式系统，提供良好的主题支持和样式隔离。
+ *
+ * @component
+ * @description 用于展示图片列表的组件，支持头像、缩略图等多种场景
+ * @example
+ * ```tsx
+ * import { VisualList, VisualListItem } from '@ant-design/agentic-ui';
+ *
+ * const imageData: VisualListItem[] = [
+ *   {
+ *     id: '1',
+ *     src: 'https://example.com/image1.jpg',
+ *     alt: 'Image 1',
+ *     title: 'Image Title',
+ *     href: 'https://example.com/profile/1'
+ *   }
+ * ];
+ *
+ * // 基础用法
+ * <VisualList data={imageData} />
+ *
+ * // 大尺寸圆形头像
+ * <VisualList data={imageData} shape="circle" />
+ *
+ * // 带边框的列表
+ * <VisualList data={imageData} variant="outline" />
+ *
+ * // 无边框的列表
+ * <VisualList data={imageData} variant="borderless" />
+ *
+ * // 带描述文字的列表
+ * <VisualList data={imageData} description="用户头像列表" />
+ *
+ * // 过滤数据
+ * <VisualList data={imageData} filter={(item) => item.href !== undefined} />
+ * ```
+ *
+ * @param props - 组件属性
+ * @returns 渲染的视觉列表组件
+ */ var VisualListComponent = function(param) {
+    var className = param.className, style = param.style, data = param.data, filter = param.filter, emptyRender = param.emptyRender, renderItem = param.renderItem, tmp = param.loading, legacyLoading = tmp === void 0 ? false : tmp, isLoading = param.isLoading, loadingRender = param.loadingRender, itemStyle = param.itemStyle, imageStyle = param.imageStyle, linkStyle = param.linkStyle, _param_shape = param.shape, shape = _param_shape === void 0 ? 'default' : _param_shape, _param_prefixCls = param.prefixCls, prefixCls = _param_prefixCls === void 0 ? 'visual-list' : _param_prefixCls, _param_variant = param.variant, variant = _param_variant === void 0 ? 'default' : _param_variant, description = param.description;
+    // 兼容旧属性
+    var loading = isLoading !== null && isLoading !== void 0 ? isLoading : legacyLoading;
+    var _useStyle = useStyle(prefixCls), wrapSSR = _useStyle.wrapSSR, hashId = _useStyle.hashId;
+    // 使用 useMemo 优化过滤后的数据计算
+    var displayList = useMemo(function() {
+        if (!filter) {
+            return data || [];
+        }
+        return (data === null || data === void 0 ? void 0 : data.filter(filter)) || [];
+    }, [
+        data,
+        filter
+    ]);
+    // 使用 useMemo 优化容器类名计算
+    var containerClassName = useMemo(function() {
+        var _obj;
+        return classNames("".concat(prefixCls, "-container"), hashId, (_obj = {}, _define_property(_obj, "".concat(prefixCls, "-outline"), variant === 'outline'), _define_property(_obj, "".concat(prefixCls, "-borderless"), variant === 'borderless'), _define_property(_obj, "".concat(prefixCls, "-default"), variant === 'default'), _obj), className);
+    }, [
+        prefixCls,
+        hashId,
+        variant,
+        className
+    ]);
+    /**
+   * 图片组件 - 独立的 memo 组件，避免不必要的重渲染
+   */ var ImageComponent = /*#__PURE__*/ memo(function(param) {
+        var item = param.item, prefixCls = param.prefixCls, hashId = param.hashId, shape = param.shape, imageStyle = param.imageStyle, onImageError = param.onImageError;
+        var _useState = _sliced_to_array(useState(false), 2), imageError = _useState[0], setImageError = _useState[1];
+        var handleImageError = useRefFunction(function() {
+            setImageError(true);
+            onImageError();
+        });
+        if (imageError || !item.src) {
+            return /*#__PURE__*/ React.createElement("div", {
+                "data-type": "image",
+                className: classNames("".concat(prefixCls, "-default-icon"), hashId),
+                style: _object_spread_props(_object_spread({}, imageStyle), {
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    backgroundColor: '#f5f5f5',
+                    border: '1px solid #d9d9d9',
+                    borderRadius: shape === 'circle' ? '50%' : '4px'
+                })
+            }, /*#__PURE__*/ React.createElement(SquareArrowUpRight, null));
+        }
+        return /*#__PURE__*/ React.createElement("img", {
+            src: item.src,
+            alt: item.alt || item.title || '',
+            title: item.title,
+            className: classNames("".concat(prefixCls, "-image"), hashId),
+            style: imageStyle,
+            onError: handleImageError
+        });
     });
-    if (imageError || !item.src) {
-      return /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          "data-type": "image",
-          className: classNames(`${prefixCls2}-default-icon`, hashId2),
-          style: __spreadProps(__spreadValues({}, imageStyle2), {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            backgroundColor: "#f5f5f5",
-            border: "1px solid #d9d9d9",
-            borderRadius: shape2 === "circle" ? "50%" : "4px"
-          })
-        },
-        /* @__PURE__ */ React.createElement(SquareArrowUpRight, null)
-      );
-    }
-    return /* @__PURE__ */ React.createElement(
-      "img",
-      {
-        src: item.src,
-        alt: item.alt || item.title || "",
-        title: item.title,
-        className: classNames(`${prefixCls2}-image`, hashId2),
-        style: imageStyle2,
-        onError: handleImageError
-      }
-    );
-  });
-  const defaultRenderItem = useRefFunction(
-    (item, index) => {
-      const itemClassNames = [
-        `${prefixCls}-item`,
-        shape === "circle" ? `${prefixCls}-item-circle` : "",
-        hashId
-      ].filter(Boolean).join(" ");
-      return /* @__PURE__ */ React.createElement("li", { key: item.id || index, className: itemClassNames, style: itemStyle }, item.href ? /* @__PURE__ */ React.createElement(
-        "a",
-        {
-          href: item.href,
-          className: classNames(`${prefixCls}-link`, hashId),
-          style: linkStyle
-        },
-        /* @__PURE__ */ React.createElement(
-          ImageComponent,
-          {
-            item,
-            prefixCls,
-            hashId,
-            shape,
-            imageStyle,
-            onImageError: () => {
+    /**
+   * 默认列表项渲染函数 - 使用 useRefFunction 优化
+   */ var defaultRenderItem = useRefFunction(function(item, index) {
+        var itemClassNames = [
+            "".concat(prefixCls, "-item"),
+            shape === 'circle' ? "".concat(prefixCls, "-item-circle") : '',
+            hashId
+        ].filter(Boolean).join(' ');
+        return /*#__PURE__*/ React.createElement("li", {
+            key: item.id || index,
+            className: itemClassNames,
+            style: itemStyle
+        }, item.href ? /*#__PURE__*/ React.createElement("a", {
+            href: item.href,
+            className: classNames("".concat(prefixCls, "-link"), hashId),
+            style: linkStyle
+        }, /*#__PURE__*/ React.createElement(ImageComponent, {
+            item: item,
+            prefixCls: prefixCls,
+            hashId: hashId,
+            shape: shape,
+            imageStyle: imageStyle,
+            onImageError: function() {}
+        })) : /*#__PURE__*/ React.createElement(ImageComponent, {
+            item: item,
+            prefixCls: prefixCls,
+            hashId: hashId,
+            shape: shape,
+            imageStyle: imageStyle,
+            onImageError: function() {}
+        }));
+    });
+    // 使用 useMemo 优化列表渲染
+    var listItems = useMemo(function() {
+        return displayList.map(function(item, index) {
+            if (renderItem) {
+                return renderItem(item, index);
             }
-          }
-        )
-      ) : /* @__PURE__ */ React.createElement(
-        ImageComponent,
-        {
-          item,
-          prefixCls,
-          hashId,
-          shape,
-          imageStyle,
-          onImageError: () => {
-          }
-        }
-      ));
+            return defaultRenderItem(item, index);
+        });
+    }, [
+        displayList,
+        renderItem,
+        defaultRenderItem
+    ]);
+    // 加载状态渲染
+    if (loading) {
+        return wrapSSR(/*#__PURE__*/ React.createElement("ul", {
+            className: classNames(prefixCls, "".concat(prefixCls, "-loading"), hashId, className),
+            style: style
+        }, loadingRender ? loadingRender() : /*#__PURE__*/ React.createElement("span", null, "加载中...")));
     }
-  );
-  const listItems = useMemo(() => {
-    return displayList.map((item, index) => {
-      if (renderItem) {
-        return renderItem(item, index);
-      }
-      return defaultRenderItem(item, index);
-    });
-  }, [displayList, renderItem, defaultRenderItem]);
-  if (loading) {
-    return wrapSSR(
-      /* @__PURE__ */ React.createElement(
-        "ul",
-        {
-          className: classNames(
-            prefixCls,
-            `${prefixCls}-loading`,
-            hashId,
-            className
-          ),
-          style
-        },
-        loadingRender ? loadingRender() : /* @__PURE__ */ React.createElement("span", null, "加载中...")
-      )
-    );
-  }
-  if (displayList.length === 0) {
-    return wrapSSR(
-      /* @__PURE__ */ React.createElement(
-        "ul",
-        {
-          className: classNames(
-            prefixCls,
-            `${prefixCls}-empty`,
-            hashId,
-            className
-          ),
-          style
-        },
-        emptyRender ? emptyRender() : /* @__PURE__ */ React.createElement("span", null, "暂无数据")
-      )
-    );
-  }
-  return wrapSSR(
-    /* @__PURE__ */ React.createElement("div", { className: containerClassName, style }, /* @__PURE__ */ React.createElement("ul", { className: classNames(prefixCls, hashId) }, listItems), /* @__PURE__ */ React.createElement("div", { style: { width: 4 } }), description && /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-description`, hashId) }, description))
-  );
-};
-var VisualList = memo(VisualListComponent);
-export {
-  VisualList
+    // 空状态渲染
+    if (displayList.length === 0) {
+        return wrapSSR(/*#__PURE__*/ React.createElement("ul", {
+            className: classNames(prefixCls, "".concat(prefixCls, "-empty"), hashId, className),
+            style: style
+        }, emptyRender ? emptyRender() : /*#__PURE__*/ React.createElement("span", null, "暂无数据")));
+    }
+    return wrapSSR(/*#__PURE__*/ React.createElement("div", {
+        className: containerClassName,
+        style: style
+    }, /*#__PURE__*/ React.createElement("ul", {
+        className: classNames(prefixCls, hashId)
+    }, listItems), /*#__PURE__*/ React.createElement("div", {
+        style: {
+            width: 4
+        }
+    }), description && /*#__PURE__*/ React.createElement("div", {
+        className: classNames("".concat(prefixCls, "-description"), hashId)
+    }, description)));
 };
+// 使用 React.memo 优化组件重渲染
+export var VisualList = /*#__PURE__*/ memo(VisualListComponent);