@ant-design/agentic-ui 2.0.10 → 2.0.13

package/dist/Components/SuggestionList/style.js

@@ -0,0 +1,196 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/Components/SuggestionList/style.ts
+import {
+  useEditorStyleRegister
+} from "../../Hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      display: "flex",
+      flexDirection: "column",
+      gap: 4,
+      padding: 0,
+      background: "transparent",
+      borderRadius: 0,
+      boxShadow: "none",
+      width: "100%",
+      "&-suggestions": {
+        display: "flex",
+        flexDirection: "column",
+        gap: 4,
+        width: "100%",
+        // 横向布局
+        "&-horizontal": {
+          flexDirection: "row",
+          flexWrap: "wrap",
+          gap: 8
+        }
+      },
+      // 搜索更多
+      "&-more": {
+        alignSelf: "flex-start",
+        display: "inline-flex",
+        alignItems: "center",
+        gap: 4,
+        marginBottom: 4,
+        cursor: "default",
+        [`${token.componentCls}-more-text`]: {
+          color: "var(--color-gray-text-light)",
+          font: "var(--font-text-body-emphasized-base)",
+          letterSpacing: "var(--letter-spacing-body-emphasized-base, normal)"
+        },
+        [`${token.componentCls}-more-icon`]: {
+          display: "inline-flex",
+          alignItems: "center",
+          justifyContent: "center",
+          width: 28,
+          height: 28,
+          fontSize: 14,
+          color: "var(--color-gray-text-light)",
+          borderRadius: "var(--radius-control-base)",
+          cursor: "pointer",
+          transition: "background-color .2s cubic-bezier(0.645, 0.045, 0.355, 1)",
+          "&:hover": {
+            background: "var(--color-gray-control-fill-hover)"
+          },
+          "&:active": {
+            background: "var(--color-gray-control-fill-active)"
+          }
+        }
+      },
+      "&-suggestion": {
+        width: "max-content",
+        maxWidth: "100%",
+        alignSelf: "flex-start",
+        height: 37,
+        padding: 8,
+        boxSizing: "border-box",
+        borderRadius: "var(--radius-card-base)",
+        background: "var(--color-gray-bg-card-white)",
+        border: "none",
+        boxShadow: "var(--shadow-control-base)",
+        color: "var(--color-gray-text-secondary)",
+        cursor: "pointer",
+        fontSize: 13,
+        lineHeight: "21px",
+        textAlign: "left",
+        display: "inline-flex",
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "flex-start",
+        transition: "background-color .2s ease, box-shadow .2s ease, transform .08s ease",
+        // hover 态（非禁用）
+        "&:hover:not(&-disabled)": {
+          background: "var(--color-gray-bg-card-light, var(--color-gray-bg-card-white))",
+          boxShadow: "var(--shadow-control-base)"
+        },
+        // active 态（非禁用）
+        "&:active:not(&-disabled)": {
+          transform: "scale(0.99)"
+        },
+        // 禁用态
+        "&-disabled": {
+          opacity: 0.5,
+          cursor: "not-allowed",
+          boxShadow: "none"
+        },
+        // hover 时箭头位移动画
+        [`&:hover:not(&-disabled) ${token.componentCls}-arrow:not(${token.componentCls}-arrow-action)`]: {
+          transform: "translateX(2px)"
+        }
+      },
+      // 类型：基础版
+      "&-basic": {
+        [`${token.componentCls}-suggestion`]: {
+          background: "var(--color-gray-bg-card-light)",
+          boxShadow: "none",
+          "&:hover:not(&-disabled)": {
+            background: "var(--color-gray-control-fill-active)",
+            boxShadow: "none"
+          }
+        }
+      },
+      // 类型：透明版
+      "&-transparent": {
+        [`${token.componentCls}-suggestion`]: {
+          background: "var(--color-gray-bg-transparent)",
+          boxShadow: "none",
+          "&:hover:not(&-disabled)": {
+            background: "var(--color-gray-control-fill-hover)",
+            boxShadow: "none"
+          }
+        }
+      },
+      // 类型：白色版
+      "&-white": {
+        [`${token.componentCls}-suggestion`]: {
+          background: "var(--color-gray-bg-card-white)",
+          boxShadow: "var(--shadow-control-base)",
+          "&:hover:not(&-disabled)": {
+            background: "var(--color-gray-bg-card-white)",
+            boxShadow: "var(--shadow-control-lg)"
+          }
+        }
+      },
+      "&-icon": {
+        flex: "0 0 auto",
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        fontSize: 16,
+        color: "var(--color-gray-text-secondary)",
+        marginRight: 8
+      },
+      "&-label": {
+        display: "inline-block",
+        minWidth: 0,
+        maxWidth: "100%",
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        color: "var(--color-gray-text-default)",
+        fontSize: 13
+      },
+      "&-arrow": {
+        flex: "0 0 auto",
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        color: "var(--color-gray-text-light)",
+        fontSize: 16,
+        marginLeft: 12,
+        transition: "transform .2s cubic-bezier(0.645, 0.045, 0.355, 1)"
+      }
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("follow-up", (token) => {
+    const followToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(followToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/Components/VisualList/index.js

@@ -0,0 +1,188 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/Components/VisualList/index.tsx
+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 = false,
+  loadingRender,
+  itemStyle,
+  imageStyle,
+  linkStyle,
+  shape = "default",
+  prefixCls = "visual-list",
+  variant = "default",
+  description
+}) => {
+  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();
+    });
+    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: () => {
+            }
+          }
+        )
+      ) : /* @__PURE__ */ React.createElement(
+        ImageComponent,
+        {
+          item,
+          prefixCls,
+          hashId,
+          shape,
+          imageStyle,
+          onImageError: () => {
+          }
+        }
+      ));
+    }
+  );
+  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
+};

package/dist/Components/VisualList/style.js

@@ -0,0 +1,138 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/Components/VisualList/style.ts
+import {
+  useEditorStyleRegister
+} from "../../Hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      display: "flex",
+      boxSizing: "border-box",
+      listStyle: "none",
+      margin: 0,
+      padding: 0,
+      flexFlow: "wrap",
+      gap: "4px",
+      // 容器样式
+      [`${token.componentCls}-item`]: {
+        marginBottom: "0px",
+        marginRight: "-8px",
+        boxSizing: "border-box",
+        display: "flex",
+        position: "relative",
+        zIndex: 1,
+        cursor: "pointer",
+        'img,[data-type="image"]': {
+          borderRadius: "8px",
+          transition: "all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)"
+        },
+        "&:hover": {
+          'img,[data-type="image"]': {
+            boxShadow: "0 2px 8px rgba(0, 122, 204, 0.15)",
+            transform: "translateY(-16px) scale(1.5)"
+          }
+        }
+      },
+      [`${token.componentCls}-link`]: {
+        display: "flex",
+        textDecoration: "none",
+        color: "inherit",
+        "&:focus": {
+          outline: "2px solid #007acc",
+          outlineOffset: "2px"
+        }
+      },
+      [`${token.componentCls}-image`]: {
+        objectFit: "cover",
+        display: "block",
+        width: "18px",
+        height: "18px"
+      },
+      [`${token.componentCls}-loading`]: {
+        display: "flex",
+        listStyle: "none",
+        margin: 0,
+        padding: 0,
+        alignItems: "center",
+        justifyContent: "center",
+        minHeight: "40px",
+        color: "#666",
+        fontSize: "14px"
+      },
+      [`${token.componentCls}-empty`]: {
+        display: "flex",
+        listStyle: "none",
+        margin: 0,
+        padding: 0,
+        alignItems: "center",
+        justifyContent: "center",
+        minHeight: "40px",
+        color: "#999",
+        fontSize: "14px",
+        fontStyle: "italic"
+      },
+      // 圆形头像样式
+      [`${token.componentCls}-item-circle`]: {
+        borderRadius: "50%"
+      },
+      [`${token.componentCls}-borderless`]: {
+        border: "none",
+        padding: 0,
+        backgroundColor: "transparent"
+      },
+      [`${token.componentCls}-default`]: {
+        // 默认样式，无特殊边框处理
+      }
+    },
+    [`${token.componentCls}-container`]: {
+      position: "relative",
+      borderRadius: "200px",
+      height: 28,
+      display: "flex",
+      alignItems: "center",
+      gap: 6,
+      width: "max-content",
+      padding: "0 8px",
+      background: "#FFFFFF",
+      boxShadow: "var(--shadow-control-base)"
+    },
+    // 描述文字样式
+    [`${token.componentCls}-description`]: {
+      fontSize: "13px",
+      fontWeight: "normal",
+      lineHeight: "22px",
+      letterSpacing: "normal",
+      color: "#767E8B"
+    }
+  };
+};
+function useStyle(prefixCls) {
+  return useEditorStyleRegister("visual-list", (token) => {
+    const visualListToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(visualListToken)];
+  });
+}
+export {
+  useStyle
+};

package/dist/Components/icons/LoadingSpinnerIcon.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+interface LoadingSpinnerIconProps extends React.SVGProps<SVGSVGElement> {
+    size?: number;
+}
+/**
+ * LoadingSpinnerIcon 组件 - 加载旋转图标组件
+ *
+ * 该组件显示一个旋转的加载图标，支持自定义大小和 SVG 属性。
+ * 主要用于表示加载状态或处理中的 UI 元素。
+ *
+ * @component
+ * @description 加载旋转图标组件，支持自定义大小和 SVG 属性
+ * @param {LoadingSpinnerIconProps} props - 组件属性
+ * @param {number} [props.size=24] - 图标大小（像素）
+ * @param {React.SVGProps<SVGSVGElement>} props - 其他 SVG 属性
+ *
+ * @example
+ * ```tsx
+ * import { LoadingSpinnerIcon } from './Components/icons/LoadingSpinnerIcon';
+ *
+ * // 基本用法
+ * <LoadingSpinnerIcon size={24} />
+ *
+ * // 自定义样式
+ * <LoadingSpinnerIcon size={32} className="custom-spinner" />
+ * ```
+ *
+ * @returns {React.ReactElement} 渲染的加载旋转图标组件
+ *
+ * @remarks
+ * - 默认大小为 24px
+ * - 支持所有标准的 SVG 属性
+ * - 内置 CSS 动画，自动旋转
+ * - 使用 24x24 的 viewBox
+ * - 包含背景圆环和前景进度条
+ */
+export declare const LoadingSpinnerIcon: React.FC<LoadingSpinnerIconProps>;
+export {};

package/dist/Components/icons/LoadingSpinnerIcon.js

@@ -0,0 +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]);
+    }
+  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 target;
+};
+
+// src/Components/icons/LoadingSpinnerIcon.tsx
+import React from "react";
+var LoadingSpinnerIcon = (_a) => {
+  var _b = _a, {
+    size = 24
+  } = _b, props = __objRest(_b, [
+    "size"
+  ]);
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    __spreadProps(__spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none"
+    }, props), {
+      style: __spreadValues({
+        animation: "spin 1s linear infinite"
+      }, props.style)
+    }),
+    /* @__PURE__ */ React.createElement("style", null, `
+          @keyframes spin {
+            from {
+              transform: rotate(0deg);
+            }
+            to {
+              transform: rotate(360deg);
+            }
+          }
+        `),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12C4 7.58172 7.58172 4 12 4Z",
+        fill: "#4E5969",
+        fillOpacity: "0.2"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M12 2C6.47715 2 2 6.47715 2 12C2 12.6522 2.06545 13.2886 2.19175 13.9025L4.03341 13.3089C3.94757 12.8865 3.90196 12.4492 3.90196 12C3.90196 7.52684 7.52684 3.90196 12 3.90196C16.4732 3.90196 20.098 7.52684 20.098 12C20.098 16.4732 16.4732 20.098 12 20.098C11.5508 20.098 11.1135 20.0524 10.6911 19.9666L10.0975 21.8082C10.7114 21.9346 11.3478 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2Z",
+        fill: "#4E5969"
+      }
+    )
+  );
+};
+export {
+  LoadingSpinnerIcon
+};

package/dist/Components/lotties/DazingLottie/index.js

@@ -0,0 +1,52 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+
+// src/Components/lotties/DazingLottie/index.tsx
+import Lottie from "lottie-react";
+import React from "react";
+import dazingLottie from "./dazing.json";
+var DazingLottie = ({
+  autoplay = true,
+  loop = true,
+  className,
+  style,
+  size
+}) => {
+  const containerStyle = __spreadValues({
+    width: size,
+    height: size,
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center"
+  }, style);
+  return /* @__PURE__ */ React.createElement(
+    Lottie,
+    {
+      style: containerStyle,
+      className,
+      "aria-hidden": "true",
+      animationData: dazingLottie,
+      loop,
+      autoplay
+    }
+  );
+};
+var DazingLottie_default = DazingLottie;
+export {
+  DazingLottie,
+  DazingLottie_default as default
+};