@ant-design/agentic-ui 2.0.16 → 2.0.18

package/dist/Components/Loading/index.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { LoadingLottieProps } from '../lotties/LoadingLottie';
 /**
  * Loading 组件 - 加载动画组件
  *
@@ -22,4 +23,4 @@ import React from 'react';
  *
  * @returns {React.ReactElement} 渲染的加载动画组件
  */
-export declare const Loading: (props: React.SVGProps<HTMLDivElement>) => React.JSX.Element;
+export declare const Loading: (props: LoadingLottieProps) => React.JSX.Element;

package/dist/Components/Loading/index.js

@@ -1,6 +1,4 @@
 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;
@@ -16,168 +14,12 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // src/Components/Loading/index.tsx
-import { ConfigProvider } from "antd";
-import classNames from "classnames";
-import { motion } from "framer-motion";
-import React, { useContext } from "react";
-import { useStyle } from "./style";
+import React from "react";
+import { LoadingLottie } from "../lotties/LoadingLottie";
 var Loading = (props) => {
-  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
-  const prefixCls = getPrefixCls("loading-container");
-  const { wrapSSR, hashId } = useStyle(prefixCls);
-  return wrapSSR(
-    /* @__PURE__ */ React.createElement(
-      "div",
-      __spreadValues({
-        className: classNames(prefixCls, hashId),
-        "data-testid": "loading-container"
-      }, props),
-      /* @__PURE__ */ React.createElement("svg", { width: "0", height: "0", style: { position: "absolute" } }, /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("linearGradient", { id: "gradient", x1: "60%", y1: "0%", x2: "0%", y2: "100%" }, /* @__PURE__ */ React.createElement("stop", { offset: "0%", stopColor: "#5EF050", stopOpacity: "1" }), /* @__PURE__ */ React.createElement("stop", { offset: "20%", stopColor: "#37ABFF", stopOpacity: "1" }), /* @__PURE__ */ React.createElement("stop", { offset: "55%", stopColor: "#D7B9FF", stopOpacity: "0.95" }), /* @__PURE__ */ React.createElement("stop", { offset: "75%", stopColor: "#D7B9FF", stopOpacity: "1" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "gradient1", x1: "60%", y1: "0%", x2: "0%", y2: "100%" }, /* @__PURE__ */ React.createElement("stop", { offset: "0%", stopColor: "#5EF050", stopOpacity: "1" }), /* @__PURE__ */ React.createElement("stop", { offset: "20%", stopColor: "#37ABFF", stopOpacity: "1" }), /* @__PURE__ */ React.createElement("stop", { offset: "55%", stopColor: "#D7B9FF", stopOpacity: "0.95" }), /* @__PURE__ */ React.createElement("stop", { offset: "75%", stopColor: "#D7B9FF", stopOpacity: "0.05" })))),
-      /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          style: __spreadProps(__spreadValues({}, props.style), {
-            width: "1em",
-            height: "1em"
-          })
-        },
-        /* @__PURE__ */ React.createElement(
-          motion.svg,
-          {
-            width: "1em",
-            height: "1em",
-            viewBox: "0 0 100 100",
-            style: { position: "absolute" },
-            animate: {
-              rotate: [-360, 0]
-              // wrapper2 逆时针旋转渐变
-            },
-            transition: {
-              duration: 3,
-              ease: "linear",
-              repeat: Infinity,
-              repeatType: "loop"
-            }
-          },
-          /* @__PURE__ */ React.createElement(
-            motion.ellipse,
-            {
-              cx: "50",
-              cy: "50",
-              fill: "none",
-              stroke: "url(#gradient1)",
-              strokeWidth: "10",
-              style: { transformOrigin: "center center" },
-              animate: {
-                // 旋转动画：rotation: 300 → (300-25-90=185) → (185+180=365) → (365-25-40=300)
-                rotate: [300, 185, 365, 300],
-                // rx 动画：12 → 0 → 16 → 0 → 8 → 0 → 28 → 0 → 12
-                rx: [12, 0, 16, 0, 8, 0, 28, 0, 12],
-                ry: 32
-                // 保持固定
-              },
-              transition: {
-                rotate: {
-                  duration: 3,
-                  ease: "linear",
-                  times: [0, 0.4167, 0.7667, 1],
-                  // 1.25/3, 2.3/3, 1
-                  repeat: Infinity,
-                  repeatType: "loop"
-                },
-                rx: {
-                  duration: 3,
-                  ease: "linear",
-                  times: [
-                    0,
-                    0.15,
-                    0.2567,
-                    0.4167,
-                    0.5,
-                    0.5333,
-                    0.6667,
-                    0.7667,
-                    1
-                  ],
-                  repeat: Infinity,
-                  repeatType: "loop"
-                }
-              }
-            }
-          )
-        ),
-        /* @__PURE__ */ React.createElement(
-          motion.svg,
-          {
-            width: "1em",
-            height: "1em",
-            viewBox: "0 0 100 100",
-            style: { position: "absolute" },
-            animate: {
-              rotate: [0, -360]
-              // wrapper1 顺时针旋转渐变
-            },
-            transition: {
-              duration: 3,
-              ease: "linear",
-              repeat: Infinity,
-              repeatType: "loop"
-            }
-          },
-          /* @__PURE__ */ React.createElement(
-            motion.ellipse,
-            {
-              cx: "50",
-              cy: "50",
-              fill: "none",
-              stroke: "url(#gradient)",
-              strokeWidth: "10",
-              style: { transformOrigin: "center center" },
-              animate: {
-                // 旋转动画：rotation: 30 → (30-30-30-15-90-45=-180) → (-180+30+30+30+120=30)
-                rotate: [30, -280, 30],
-                // rx 动画：32 → 0 → 8 → 0 → 24 → 0 → 16 → 0 → 30 → 32
-                rx: [32, 0, 8, 0, 24, 0, 16, 0, 30, 32],
-                ry: 32
-                // 保持固定
-              },
-              transition: {
-                rotate: {
-                  duration: 3,
-                  ease: "linear",
-                  times: [0, 0.5267, 1],
-                  // 1.58/3, 1
-                  repeat: Infinity,
-                  repeatType: "loop"
-                },
-                rx: {
-                  duration: 3,
-                  ease: "linear",
-                  times: [
-                    0,
-                    0.2567,
-                    0.3467,
-                    0.38,
-                    0.4867,
-                    0.5967,
-                    0.7067,
-                    0.8167,
-                    0.9433,
-                    1
-                  ],
-                  repeat: Infinity,
-                  repeatType: "loop"
-                }
-              }
-            }
-          )
-        )
-      )
-    )
-  );
+  return /* @__PURE__ */ React.createElement(LoadingLottie, __spreadValues({ size: "1em" }, props));
 };
 export {
   Loading

package/dist/Components/lotties/LoadingLottie/index.d.ts

@@ -0,0 +1,65 @@
+import React from 'react';
+export interface LoadingLottieProps {
+    /**
+     * 是否自动播放动画
+     * @default true
+     */
+    autoplay?: boolean;
+    /**
+     * 是否循环播放动画
+     * @default true
+     */
+    loop?: boolean;
+    /**
+     * 动画容器类名
+     */
+    className?: string;
+    /**
+     * 动画容器样式
+     */
+    style?: React.CSSProperties;
+    /**
+     * 动画尺寸（宽度和高度）
+     * @example size={64}
+     */
+    size?: number | string;
+}
+/**
+ * 加载动画组件
+ *
+ * 使用 Lottie 动画展示加载状态的组件，支持自定义尺寸、样式和播放行为。
+ *
+ * @component
+ * @example
+ * // 基础用法
+ * <LoadingLottie />
+ *
+ * @example
+ * // 自定义尺寸
+ * <LoadingLottie size={64} />
+ *
+ * @example
+ * // 自定义样式
+ * <LoadingLottie
+ *   size={80}
+ *   style={{ margin: '20px' }}
+ *   className="custom-loading"
+ * />
+ *
+ * @example
+ * // 控制播放行为
+ * <LoadingLottie
+ *   autoplay={false}
+ *   loop={false}
+ * />
+ *
+ * @param props - 组件属性
+ * @param props.autoplay - 是否自动播放动画，默认为 true
+ * @param props.loop - 是否循环播放动画，默认为 true
+ * @param props.className - 动画容器类名
+ * @param props.style - 动画容器自定义样式
+ * @param props.size - 动画尺寸（宽度和高度）
+ * @returns 渲染的加载动画组件
+ */
+export declare const LoadingLottie: React.FC<LoadingLottieProps>;
+export default LoadingLottie;

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

@@ -0,0 +1,53 @@
+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/LoadingLottie/index.tsx
+import Lottie from "lottie-react";
+import React from "react";
+import loadingLottie from "./loading.json";
+var LoadingLottie = ({
+  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,
+      "data-testid": "lottie-animation",
+      "aria-hidden": "true",
+      animationData: loadingLottie,
+      loop,
+      autoplay
+    }
+  );
+};
+var LoadingLottie_default = LoadingLottie;
+export {
+  LoadingLottie,
+  LoadingLottie_default as default
+};