@ant-design/agentic-ui 2.0.17 → 2.0.20

package/dist/Components/TextAnimate/index.js

@@ -0,0 +1,388 @@
+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/TextAnimate/index.tsx
+import { ConfigProvider } from "antd";
+import classNames from "classnames";
+import { AnimatePresence, motion } from "framer-motion";
+import { isString } from "lodash";
+import toArray from "rc-util/lib/Children/toArray";
+import React, { memo, useContext } from "react";
+import { useTextAnimateStyle } from "./style";
+var staggerTimings = {
+  text: 0.06,
+  word: 0.05,
+  character: 0.03,
+  line: 0.06,
+  mix: 0.06
+};
+var defaultContainerVariants = {
+  hidden: { opacity: 1 },
+  show: {
+    opacity: 1,
+    transition: {
+      delayChildren: 0,
+      staggerChildren: 0.05
+    }
+  },
+  exit: {
+    opacity: 0,
+    transition: {
+      staggerChildren: 0.05,
+      staggerDirection: -1
+    }
+  }
+};
+var defaultItemVariants = {
+  hidden: { opacity: 0 },
+  show: {
+    opacity: 1
+  },
+  exit: {
+    opacity: 0
+  }
+};
+var defaultItemAnimationVariants = {
+  fadeIn: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { opacity: 0, y: 20 },
+      show: {
+        opacity: 1,
+        y: 0,
+        transition: {
+          duration: 0.3
+        }
+      },
+      exit: {
+        opacity: 0,
+        y: 20,
+        transition: { duration: 0.3 }
+      }
+    }
+  },
+  blurIn: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { opacity: 0, filter: "blur(10px)" },
+      show: {
+        opacity: 1,
+        filter: "blur(0px)",
+        transition: {
+          duration: 0.3
+        }
+      },
+      exit: {
+        opacity: 0,
+        filter: "blur(10px)",
+        transition: { duration: 0.3 }
+      }
+    }
+  },
+  blurInUp: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { opacity: 0, filter: "blur(10px)", y: 20 },
+      show: {
+        opacity: 1,
+        filter: "blur(0px)",
+        y: 0,
+        transition: {
+          y: { duration: 0.3 },
+          opacity: { duration: 0.4 },
+          filter: { duration: 0.3 }
+        }
+      },
+      exit: {
+        opacity: 0,
+        filter: "blur(10px)",
+        y: 20,
+        transition: {
+          y: { duration: 0.3 },
+          opacity: { duration: 0.4 },
+          filter: { duration: 0.3 }
+        }
+      }
+    }
+  },
+  blurInDown: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { opacity: 0, filter: "blur(10px)", y: -20 },
+      show: {
+        opacity: 1,
+        filter: "blur(0px)",
+        y: 0,
+        transition: {
+          y: { duration: 0.3 },
+          opacity: { duration: 0.4 },
+          filter: { duration: 0.3 }
+        }
+      }
+    }
+  },
+  slideUp: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { y: 20, opacity: 0 },
+      show: {
+        y: 0,
+        opacity: 1,
+        transition: {
+          duration: 0.3
+        }
+      },
+      exit: {
+        y: -20,
+        opacity: 0,
+        transition: {
+          duration: 0.3
+        }
+      }
+    }
+  },
+  slideDown: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { y: -20, opacity: 0 },
+      show: {
+        y: 0,
+        opacity: 1,
+        transition: { duration: 0.3 }
+      },
+      exit: {
+        y: 20,
+        opacity: 0,
+        transition: { duration: 0.3 }
+      }
+    }
+  },
+  slideLeft: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { x: 20, opacity: 0 },
+      show: {
+        x: 0,
+        opacity: 1,
+        transition: { duration: 0.3 }
+      },
+      exit: {
+        x: -20,
+        opacity: 0,
+        transition: { duration: 0.3 }
+      }
+    }
+  },
+  slideRight: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { x: -20, opacity: 0 },
+      show: {
+        x: 0,
+        opacity: 1,
+        transition: { duration: 0.3 }
+      },
+      exit: {
+        x: 20,
+        opacity: 0,
+        transition: { duration: 0.3 }
+      }
+    }
+  },
+  scaleUp: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { scale: 0.5, opacity: 0 },
+      show: {
+        scale: 1,
+        opacity: 1,
+        transition: {
+          duration: 0.3,
+          scale: {
+            type: "spring",
+            damping: 15,
+            stiffness: 300
+          }
+        }
+      },
+      exit: {
+        scale: 0.5,
+        opacity: 0,
+        transition: { duration: 0.3 }
+      }
+    }
+  },
+  scaleDown: {
+    container: defaultContainerVariants,
+    item: {
+      hidden: { scale: 1.5, opacity: 0 },
+      show: {
+        scale: 1,
+        opacity: 1,
+        transition: {
+          duration: 0.3,
+          scale: {
+            type: "spring",
+            damping: 15,
+            stiffness: 300
+          }
+        }
+      },
+      exit: {
+        scale: 1.5,
+        opacity: 0,
+        transition: { duration: 0.3 }
+      }
+    }
+  }
+};
+var resolveSegments = (children, by) => {
+  if (!isString(children))
+    return toArray(children);
+  switch (by) {
+    case "word":
+      return children.split(/(\s+)/);
+    case "character":
+      return children.split("");
+    case "line":
+      return children.split("\n");
+    case "text":
+    default:
+      return [children];
+  }
+};
+var TextAnimateBase = (_a) => {
+  var _b = _a, {
+    children,
+    delay = 0,
+    duration = 0.3,
+    variants,
+    className,
+    segmentClassName,
+    as: Component = "p",
+    startOnView = true,
+    once = false,
+    by = "word",
+    animation = "fadeIn",
+    accessible = true
+  } = _b, props = __objRest(_b, [
+    "children",
+    "delay",
+    "duration",
+    "variants",
+    "className",
+    "segmentClassName",
+    "as",
+    "startOnView",
+    "once",
+    "by",
+    "animation",
+    "accessible"
+  ]);
+  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls("text-animate");
+  const { wrapSSR, hashId } = useTextAnimateStyle(prefixCls);
+  const MotionComponent = motion(Component);
+  const segments = resolveSegments(children, by);
+  const staggerChildren = segments.length > 0 ? duration / segments.length : 0;
+  const finalVariants = variants ? {
+    container: {
+      hidden: { opacity: 0 },
+      show: {
+        opacity: 1,
+        transition: {
+          opacity: { duration: 0.01, delay },
+          delayChildren: delay,
+          staggerChildren
+        }
+      },
+      exit: {
+        opacity: 0,
+        transition: {
+          staggerChildren,
+          staggerDirection: -1
+        }
+      }
+    },
+    item: variants
+  } : animation ? {
+    container: __spreadProps(__spreadValues({}, defaultItemAnimationVariants[animation].container), {
+      show: __spreadProps(__spreadValues({}, defaultItemAnimationVariants[animation].container.show), {
+        transition: {
+          delayChildren: delay,
+          staggerChildren
+        }
+      }),
+      exit: __spreadProps(__spreadValues({}, defaultItemAnimationVariants[animation].container.exit), {
+        transition: {
+          staggerChildren,
+          staggerDirection: -1
+        }
+      })
+    }),
+    item: defaultItemAnimationVariants[animation].item
+  } : { container: defaultContainerVariants, item: defaultItemVariants };
+  return wrapSSR(
+    /* @__PURE__ */ React.createElement(AnimatePresence, { mode: "popLayout" }, /* @__PURE__ */ React.createElement(
+      MotionComponent,
+      __spreadValues({
+        variants: finalVariants.container,
+        initial: "hidden",
+        whileInView: startOnView ? "show" : void 0,
+        animate: startOnView ? void 0 : "show",
+        exit: "exit",
+        className: classNames(prefixCls, hashId, className),
+        viewport: { once },
+        "aria-label": accessible && isString(children) ? children : void 0
+      }, props),
+      segments.map((segment, i) => /* @__PURE__ */ React.createElement(
+        motion.span,
+        {
+          key: `${by}-${isString(segment) ? segment : segment == null ? void 0 : segment.key}-${i}`,
+          variants: finalVariants.item,
+          custom: i * staggerTimings[by],
+          className: classNames(
+            `${prefixCls}-item-${by}`,
+            hashId,
+            segmentClassName
+          ),
+          "aria-hidden": accessible ? true : void 0
+        },
+        segment
+      ))
+    ))
+  );
+};
+var TextAnimate = memo(TextAnimateBase);
+export {
+  TextAnimate
+};

package/dist/Components/TextAnimate/style.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const useTextAnimateStyle: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};

package/dist/Components/TextAnimate/style.js

@@ -0,0 +1,53 @@
+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/TextAnimate/style.ts
+import {
+  useEditorStyleRegister
+} from "../../Hooks/useStyle";
+var genStyle = (token) => {
+  return {
+    [token.componentCls]: {
+      whiteSpace: "pre-wrap",
+      ["&-item"]: {
+        display: "inline-block",
+        whiteSpace: "pre-wrap"
+      },
+      ["&-item-character"]: {
+        whiteSpace: "pre-wrap"
+      },
+      ["&-item-line"]: {
+        display: "block",
+        whiteSpace: "normal"
+      }
+    }
+  };
+};
+var useTextAnimateStyle = (prefixCls) => {
+  return useEditorStyleRegister("text-animate", (token) => {
+    const textAnimateToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(textAnimateToken)];
+  });
+};
+export {
+  useTextAnimateStyle
+};

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

@@ -0,0 +1,19 @@
+import { MotionProps } from 'framer-motion';
+import React from 'react';
+export interface TypingAnimationProps extends MotionProps {
+    children?: string;
+    words?: string[];
+    className?: string;
+    duration?: number;
+    typeSpeed?: number;
+    deleteSpeed?: number;
+    delay?: number;
+    pauseDelay?: number;
+    loop?: boolean;
+    as?: React.ElementType;
+    startOnView?: boolean;
+    showCursor?: boolean;
+    blinkCursor?: boolean;
+    cursorStyle?: 'line' | 'block' | 'underscore';
+}
+export declare function TypingAnimation({ children, words, className, duration, typeSpeed, deleteSpeed, delay, pauseDelay, loop, as: Component, startOnView, showCursor, blinkCursor, cursorStyle, ...props }: TypingAnimationProps): React.JSX.Element;

package/dist/Components/TypingAnimation/index.js

@@ -0,0 +1,182 @@
+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;
+};
+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/TypingAnimation/index.tsx
+import { ConfigProvider } from "antd";
+import classNames from "classnames";
+import { motion, useInView } from "framer-motion";
+import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
+import { useTypingAnimationStyle } from "./style";
+function TypingAnimation(_a) {
+  var _b = _a, {
+    children,
+    words,
+    className,
+    duration = 100,
+    typeSpeed,
+    deleteSpeed,
+    delay = 0,
+    pauseDelay = 1e3,
+    loop = false,
+    as: Component = "span",
+    startOnView = true,
+    showCursor = true,
+    blinkCursor = true,
+    cursorStyle = "line"
+  } = _b, props = __objRest(_b, [
+    "children",
+    "words",
+    "className",
+    "duration",
+    "typeSpeed",
+    "deleteSpeed",
+    "delay",
+    "pauseDelay",
+    "loop",
+    "as",
+    "startOnView",
+    "showCursor",
+    "blinkCursor",
+    "cursorStyle"
+  ]);
+  const MotionComponent = motion(Component, {
+    forwardMotionProps: true
+  });
+  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls("typing-animation");
+  const { wrapSSR, hashId } = useTypingAnimationStyle(prefixCls);
+  const [displayedText, setDisplayedText] = useState("");
+  const [currentWordIndex, setCurrentWordIndex] = useState(0);
+  const [currentCharIndex, setCurrentCharIndex] = useState(0);
+  const [phase, setPhase] = useState("typing");
+  const elementRef = useRef(null);
+  const isInView = useInView(elementRef, {
+    amount: 0.3,
+    once: true
+  });
+  const wordsToAnimate = useMemo(
+    () => words || (children ? [children] : []),
+    [words, children]
+  );
+  const hasMultipleWords = wordsToAnimate.length > 1;
+  const typingSpeed = typeSpeed || duration;
+  const deletingSpeed = deleteSpeed || typingSpeed / 2;
+  const shouldStart = startOnView ? isInView : true;
+  useEffect(() => {
+    if (!shouldStart || wordsToAnimate.length === 0)
+      return;
+    const timeoutDelay = delay > 0 && displayedText === "" ? delay : phase === "typing" ? typingSpeed : phase === "deleting" ? deletingSpeed : pauseDelay;
+    const timeout = setTimeout(() => {
+      const currentWord = wordsToAnimate[currentWordIndex] || "";
+      const graphemes = Array.from(currentWord);
+      switch (phase) {
+        case "typing":
+          if (currentCharIndex < graphemes.length) {
+            setDisplayedText(graphemes.slice(0, currentCharIndex + 1).join(""));
+            setCurrentCharIndex(currentCharIndex + 1);
+          } else {
+            if (hasMultipleWords || loop) {
+              const isLastWord = currentWordIndex === wordsToAnimate.length - 1;
+              if (!isLastWord || loop) {
+                setPhase("pause");
+              }
+            }
+          }
+          break;
+        case "pause":
+          setPhase("deleting");
+          break;
+        case "deleting":
+          if (currentCharIndex > 0) {
+            setDisplayedText(graphemes.slice(0, currentCharIndex - 1).join(""));
+            setCurrentCharIndex(currentCharIndex - 1);
+          } else {
+            const nextIndex = (currentWordIndex + 1) % wordsToAnimate.length;
+            setCurrentWordIndex(nextIndex);
+            setPhase("typing");
+          }
+          break;
+      }
+    }, timeoutDelay);
+    return () => clearTimeout(timeout);
+  }, [
+    shouldStart,
+    phase,
+    currentCharIndex,
+    currentWordIndex,
+    displayedText,
+    wordsToAnimate,
+    hasMultipleWords,
+    loop,
+    typingSpeed,
+    deletingSpeed,
+    pauseDelay,
+    delay
+  ]);
+  const currentWordGraphemes = Array.from(
+    wordsToAnimate[currentWordIndex] || ""
+  );
+  const isComplete = !loop && currentWordIndex === wordsToAnimate.length - 1 && currentCharIndex >= currentWordGraphemes.length && phase !== "deleting";
+  const shouldShowCursor = showCursor && !isComplete && (hasMultipleWords || loop || currentCharIndex < currentWordGraphemes.length);
+  const getCursorChar = () => {
+    switch (cursorStyle) {
+      case "block":
+        return "▌";
+      case "underscore":
+        return "_";
+      case "line":
+      default:
+        return "|";
+    }
+  };
+  return wrapSSR(
+    /* @__PURE__ */ React.createElement(
+      MotionComponent,
+      __spreadValues({
+        ref: elementRef,
+        className: classNames(prefixCls, hashId, className)
+      }, props),
+      displayedText,
+      shouldShowCursor && /* @__PURE__ */ React.createElement(
+        "span",
+        {
+          className: classNames(
+            `${prefixCls}-cursor`,
+            hashId,
+            blinkCursor && `${prefixCls}-cursor-blinking`
+          )
+        },
+        getCursorChar()
+      )
+    )
+  );
+}
+export {
+  TypingAnimation
+};

package/dist/Components/TypingAnimation/style.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const useTypingAnimationStyle: (prefixCls: string) => {
+    wrapSSR: (node: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => import("react").JSX.Element;
+    hashId: string;
+};

package/dist/Components/TypingAnimation/style.js

@@ -0,0 +1,59 @@
+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/TypingAnimation/style.ts
+import { Keyframes } from "@ant-design/cssinjs";
+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"]: {
+        animationName: animation,
+        animationDuration: "1s",
+        animationTimingFunction: "steps(1, end)",
+        animationIterationCount: "infinite"
+      }
+    }
+  };
+};
+var useTypingAnimationStyle = (prefixCls) => {
+  return useEditorStyleRegister("typing-animation", (token) => {
+    const typingAnimationToken = __spreadProps(__spreadValues({}, token), {
+      componentCls: `.${prefixCls}`
+    });
+    return [genStyle(typingAnimationToken)];
+  });
+};
+export {
+  useTypingAnimationStyle
+};