@ant-design/agentic-ui 2.0.6 → 2.0.10

package/dist/MarkdownInputField/BeforeToolContainer/BeforeToolContainer.js

@@ -19,8 +19,85 @@ var __spreadValues = (a, b) => {
 import { GripVertical, Menu } from "@sofa-design/icons";
 import { ConfigProvider, Popover } from "antd";
 import classNames from "classnames";
-import React, { useContext, useEffect, useRef, useState } from "react";
+import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
 import { useStyle } from "../../components/ActionItemBox";
+import { useRefFunction } from "../../hooks/useRefFunction";
+var INTERACTIVE_SELECTOR = 'button, a, input, textarea, select, [role="button"], [contenteditable="true"], [data-no-pan]';
+var PAN_THRESHOLD = 6;
+var SCROLL_STYLE = {
+  display: "flex",
+  alignItems: "center",
+  width: "100%",
+  gap: 8,
+  overflowX: "auto",
+  overflowY: "hidden",
+  WebkitOverflowScrolling: "touch",
+  overscrollBehavior: "contain",
+  touchAction: "pan-x"
+};
+var POPOVER_OVERLAY_STYLE = { padding: 0 };
+var DraggablePopupItem = React.memo((props) => {
+  const {
+    entry,
+    index,
+    basePrefixCls,
+    hashId,
+    draggingIndex,
+    overIndex,
+    isHandlePressRef,
+    onDragStart,
+    onDragOver,
+    onDrop,
+    onDragEnd,
+    isHandleTarget,
+    setDraggingIndex
+  } = props;
+  const handleMouseDown = useRefFunction((evt) => {
+    const isHandle = isHandleTarget(evt.target);
+    isHandlePressRef.current = isHandle;
+    setDraggingIndex(isHandle ? index : null);
+  });
+  const handleMouseUp = useRefFunction(() => {
+    if (draggingIndex === null) {
+      isHandlePressRef.current = false;
+    }
+  });
+  const handleGripMouseDown = useRefFunction((evt) => {
+    isHandlePressRef.current = true;
+    setDraggingIndex(index);
+    evt.stopPropagation();
+  });
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      key: entry.key,
+      className: classNames(
+        `${basePrefixCls}-overflow-container-popup-item`,
+        hashId,
+        {
+          [`${basePrefixCls}-dragging`]: draggingIndex === index,
+          [`${basePrefixCls}-drag-over`]: overIndex === index
+        }
+      ),
+      draggable: true,
+      onMouseDown: handleMouseDown,
+      onMouseUp: handleMouseUp,
+      onDragStart: (evt) => onDragStart(evt, index),
+      onDragOver: (evt) => onDragOver(evt, index),
+      onDrop: (evt) => onDrop(evt, index),
+      onDragEnd
+    },
+    /* @__PURE__ */ React.createElement(
+      GripVertical,
+      {
+        className: classNames(`${basePrefixCls}-drag-handle`, hashId),
+        onMouseDown: handleGripMouseDown
+      }
+    ),
+    /* @__PURE__ */ React.createElement("div", { draggable: false }, entry.node)
+  );
+});
+DraggablePopupItem.displayName = "DraggablePopupItem";
 var ActionItemContainer = (props) => {
   const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
   const basePrefixCls = getPrefixCls("agent-chat-action-item-box");
@@ -37,23 +114,24 @@ var ActionItemContainer = (props) => {
   const panStartScrollLeftRef = useRef(0);
   const hasPanMovedRef = useRef(false);
   const panIntentRef = useRef(false);
-  const isInteractiveTarget = (target) => {
+  const isInteractiveTarget = useRefFunction((target) => {
     if (!(target instanceof HTMLElement))
       return false;
-    if (target.closest(
-      'button, a, input, textarea, select, [role="button"], [contenteditable="true"], [data-no-pan]'
-    )) {
-      return true;
-    }
-    return false;
-  };
-  const toEntries = (nodes) => {
+    return !!target.closest(INTERACTIVE_SELECTOR);
+  });
+  const isHandleTarget = useRefFunction((target) => {
+    if (!(target instanceof HTMLElement))
+      return false;
+    const handle = target.closest(`.${basePrefixCls}-drag-handle`);
+    return !!handle;
+  });
+  const toEntries = useRefFunction((nodes) => {
     const array = React.Children.toArray(nodes);
     return array.map((node) => {
       var _a;
       return { key: (_a = node == null ? void 0 : node.key) != null ? _a : null, node };
     });
-  };
+  });
   const [ordered, setOrdered] = useState(
     () => toEntries(props.children)
   );
@@ -91,154 +169,175 @@ var ActionItemContainer = (props) => {
     }
     setOrdered(merged.length === incoming.length ? merged : incoming);
   }, [props.children]);
-  const handleDragStart = (e, index) => {
-    e.stopPropagation();
-    e.dataTransfer.effectAllowed = "move";
-    try {
-      e.dataTransfer.setData("text/plain", String(index));
-    } catch (e2) {
-      console.error(e);
+  const reorder = useRefFunction(
+    (list, from, to) => {
+      const next = list.slice();
+      const [moved] = next.splice(from, 1);
+      next.splice(to, 0, moved);
+      return next;
     }
-    setDraggingIndex(index);
-  };
-  const handleDragOver = (e, index) => {
-    e.preventDefault();
-    e.dataTransfer.dropEffect = "move";
-    if (overIndex !== index)
-      setOverIndex(index);
-  };
-  const reorder = (list, from, to) => {
-    const next = list.slice();
-    const [moved] = next.splice(from, 1);
-    next.splice(to, 0, moved);
-    return next;
-  };
-  const handleDrop = (e, index) => {
-    e.preventDefault();
-    e.stopPropagation();
-    const from = draggingIndex;
-    if (from === null)
-      return;
-    const to = index;
-    if (from === to)
-      return;
-    setOrdered((prev) => reorder(prev, from, to));
-    setDraggingIndex(null);
-    setOverIndex(null);
-    isHandlePressRef.current = false;
-  };
-  const handleDragEnd = () => {
+  );
+  const handleDragStart = useRefFunction(
+    (e, index) => {
+      e.stopPropagation();
+      e.dataTransfer.effectAllowed = "move";
+      try {
+        e.dataTransfer.setData("text/plain", String(index));
+      } catch (e2) {
+        console.error(e);
+      }
+      setDraggingIndex(index);
+    }
+  );
+  const handleDragOver = useRefFunction(
+    (e, index) => {
+      e.preventDefault();
+      e.dataTransfer.dropEffect = "move";
+      if (overIndex !== index)
+        setOverIndex(index);
+    }
+  );
+  const handleDrop = useRefFunction(
+    (e, index) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (draggingIndex === null)
+        return;
+      if (draggingIndex === index)
+        return;
+      setOrdered((prev) => reorder(prev, draggingIndex, index));
+      setDraggingIndex(null);
+      setOverIndex(null);
+      isHandlePressRef.current = false;
+    }
+  );
+  const handleDragEnd = useRefFunction(() => {
     setDraggingIndex(null);
     setOverIndex(null);
     isHandlePressRef.current = false;
-  };
-  const isHandleTarget = (target) => {
-    if (!(target instanceof HTMLElement))
-      return false;
-    const handle = target.closest(`.${basePrefixCls}-drag-handle`);
-    return !!handle;
-  };
+  });
+  const handlePointerDown = useRefFunction(
+    (e) => {
+      const el = scrollRef.current;
+      if (!el || e.button !== 0 || isInteractiveTarget(e.target))
+        return;
+      panIntentRef.current = true;
+      hasPanMovedRef.current = false;
+      panStartXRef.current = e.clientX;
+      panStartScrollLeftRef.current = el.scrollLeft;
+    }
+  );
+  const handlePointerMove = useRefFunction(
+    (e) => {
+      const el = scrollRef.current;
+      if (!el)
+        return;
+      if (!isPanningRef.current && panIntentRef.current) {
+        const dx = e.clientX - panStartXRef.current;
+        if (Math.abs(dx) > PAN_THRESHOLD) {
+          isPanningRef.current = true;
+          hasPanMovedRef.current = true;
+          try {
+            el.setPointerCapture(e.pointerId);
+          } catch (e2) {
+          }
+        }
+      }
+      if (isPanningRef.current) {
+        const dx = e.clientX - panStartXRef.current;
+        el.scrollLeft = panStartScrollLeftRef.current - dx;
+        if (e.cancelable)
+          e.preventDefault();
+        e.stopPropagation();
+      }
+    }
+  );
+  const handlePointerUp = useRefFunction(
+    (e) => {
+      const el = scrollRef.current;
+      if (!el)
+        return;
+      panIntentRef.current = false;
+      if (isPanningRef.current) {
+        isPanningRef.current = false;
+        try {
+          el.releasePointerCapture(e.pointerId);
+        } catch (e2) {
+        }
+      }
+    }
+  );
+  const handlePointerCancel = useRefFunction(() => {
+    isPanningRef.current = false;
+    panIntentRef.current = false;
+  });
+  const handleWheel = useRefFunction((e) => {
+    const el = scrollRef.current;
+    if (!el)
+      return;
+    const horizontalDelta = Math.abs(e.deltaX) > Math.abs(e.deltaY) ? e.deltaX : e.deltaY;
+    if (horizontalDelta !== 0) {
+      el.scrollLeft += horizontalDelta;
+    }
+    e.stopPropagation();
+  });
+  const handleClick = useRefFunction((e) => {
+    if (hasPanMovedRef.current) {
+      e.preventDefault();
+      e.stopPropagation();
+      hasPanMovedRef.current = false;
+    }
+  });
+  const handlePopoverChange = useRefFunction((visible) => {
+    if (!props.menuDisabled) {
+      setShowOverflowPopup(visible);
+    }
+  });
+  const handleMenuMouseEnter = useRefFunction(() => {
+    if (!props.menuDisabled) {
+      setIsIndicatorHover(true);
+    }
+  });
+  const handleMenuMouseLeave = useRefFunction(() => {
+    if (!props.menuDisabled) {
+      setIsIndicatorHover(false);
+    }
+  });
+  const handlePopupWheel = useRefFunction((e) => {
+    e.stopPropagation();
+  });
+  const containerStyle = useMemo(() => __spreadValues({}, props.style), [props.style]);
+  const containerClassName = useMemo(
+    () => classNames(
+      `${basePrefixCls}-container`,
+      {
+        [`${basePrefixCls}-container-${props.size}`]: props.size,
+        [`${basePrefixCls}-container-no-hover`]: isIndicatorHover
+      },
+      hashId
+    ),
+    [basePrefixCls, props.size, isIndicatorHover, hashId]
+  );
   return wrapSSR(
     /* @__PURE__ */ React.createElement(
       "div",
       {
         ref: containerRef,
-        style: __spreadValues({}, props.style),
-        className: classNames(
-          `${basePrefixCls}-container`,
-          {
-            [`${basePrefixCls}-container-${props.size}`]: props.size,
-            [`${basePrefixCls}-container-no-hover`]: isIndicatorHover
-          },
-          hashId
-        ),
-        onPointerDown: (e) => {
-          const el = scrollRef.current;
-          if (!el)
-            return;
-          if (e.button !== 0)
-            return;
-          if (isInteractiveTarget(e.target))
-            return;
-          panIntentRef.current = true;
-          hasPanMovedRef.current = false;
-          panStartXRef.current = e.clientX;
-          panStartScrollLeftRef.current = el.scrollLeft;
-        },
-        onPointerMove: (e) => {
-          const el = scrollRef.current;
-          if (!el)
-            return;
-          if (!isPanningRef.current && panIntentRef.current) {
-            const dx = e.clientX - panStartXRef.current;
-            if (Math.abs(dx) > 6) {
-              isPanningRef.current = true;
-              hasPanMovedRef.current = true;
-              try {
-                el.setPointerCapture(e.pointerId);
-              } catch (e2) {
-              }
-            }
-          }
-          if (isPanningRef.current) {
-            const dx = e.clientX - panStartXRef.current;
-            el.scrollLeft = panStartScrollLeftRef.current - dx;
-            if (e.cancelable)
-              e.preventDefault();
-            e.stopPropagation();
-          }
-        },
-        onPointerUp: (e) => {
-          const el = scrollRef.current;
-          if (!el)
-            return;
-          panIntentRef.current = false;
-          if (isPanningRef.current) {
-            isPanningRef.current = false;
-            try {
-              el.releasePointerCapture(e.pointerId);
-            } catch (e2) {
-            }
-          }
-        },
-        onPointerCancel: () => {
-          isPanningRef.current = false;
-          panIntentRef.current = false;
-        },
-        onWheel: (e) => {
-          const el = scrollRef.current;
-          if (!el)
-            return;
-          const horizontalDelta = Math.abs(e.deltaX) > Math.abs(e.deltaY) ? e.deltaX : e.deltaY;
-          if (horizontalDelta !== 0) {
-            el.scrollLeft += horizontalDelta;
-          }
-          e.stopPropagation();
-        },
-        onClick: (e) => {
-          if (hasPanMovedRef.current) {
-            e.preventDefault();
-            e.stopPropagation();
-            hasPanMovedRef.current = false;
-          }
-        }
+        style: containerStyle,
+        className: containerClassName,
+        onPointerDown: handlePointerDown,
+        onPointerMove: handlePointerMove,
+        onPointerUp: handlePointerUp,
+        onPointerCancel: handlePointerCancel,
+        onWheel: handleWheel,
+        onClick: handleClick
       },
       /* @__PURE__ */ React.createElement(
         "div",
         {
           ref: scrollRef,
           className: classNames(`${basePrefixCls}-scroll`, hashId),
-          style: {
-            display: "flex",
-            alignItems: "center",
-            width: "100%",
-            gap: 8,
-            overflowX: "auto",
-            overflowY: "hidden",
-            WebkitOverflowScrolling: "touch",
-            overscrollBehavior: "contain",
-            touchAction: "pan-x"
-          }
+          style: SCROLL_STYLE
         },
         ordered.map((entry) => /* @__PURE__ */ React.createElement(React.Fragment, { key: entry.key }, entry.node))
       ),
@@ -269,11 +368,11 @@ var ActionItemContainer = (props) => {
             Popover,
             {
               open: showOverflowPopup,
-              onOpenChange: (visible) => !props.menuDisabled && setShowOverflowPopup(visible),
+              onOpenChange: handlePopoverChange,
               trigger: "click",
               placement: "topRight",
               arrow: false,
-              overlayInnerStyle: { padding: 0 },
+              overlayInnerStyle: POPOVER_OVERLAY_STYLE,
               overlayClassName: classNames(
                 `${basePrefixCls}-overflow-popover`,
                 hashId
@@ -285,60 +384,27 @@ var ActionItemContainer = (props) => {
                     `${basePrefixCls}-overflow-container-popup`,
                     hashId
                   ),
-                  onWheel: (e) => {
-                    e.stopPropagation();
-                  }
+                  onWheel: handlePopupWheel
                 },
-                ordered.length > 0 ? ordered.map((entry, index) => /* @__PURE__ */ React.createElement(
-                  "div",
+                ordered.map((entry, index) => /* @__PURE__ */ React.createElement(
+                  DraggablePopupItem,
                   {
                     key: entry.key,
-                    className: classNames(
-                      `${basePrefixCls}-overflow-container-popup-item`,
-                      hashId,
-                      {
-                        [`${basePrefixCls}-dragging`]: draggingIndex === index,
-                        [`${basePrefixCls}-drag-over`]: overIndex === index
-                      }
-                    ),
-                    draggable: true,
-                    onMouseDown: (evt) => {
-                      const isHandle = isHandleTarget(evt.target);
-                      isHandlePressRef.current = isHandle;
-                      if (isHandle) {
-                        setDraggingIndex(index);
-                      } else {
-                        setDraggingIndex(null);
-                      }
-                    },
-                    onMouseUp: () => {
-                      if (draggingIndex === null) {
-                        isHandlePressRef.current = false;
-                      }
-                    },
-                    onDragStart: (evt) => {
-                      handleDragStart(evt, index);
-                    },
-                    onDragOver: (evt) => handleDragOver(evt, index),
-                    onDrop: (evt) => handleDrop(evt, index),
-                    onDragEnd: handleDragEnd
-                  },
-                  /* @__PURE__ */ React.createElement(
-                    GripVertical,
-                    {
-                      className: classNames(
-                        `${basePrefixCls}-drag-handle`,
-                        hashId
-                      ),
-                      onMouseDown: (evt) => {
-                        isHandlePressRef.current = true;
-                        setDraggingIndex(index);
-                        evt.stopPropagation();
-                      }
-                    }
-                  ),
-                  /* @__PURE__ */ React.createElement("div", { draggable: false }, entry.node)
-                )) : null
+                    entry,
+                    index,
+                    basePrefixCls,
+                    hashId,
+                    draggingIndex,
+                    overIndex,
+                    isHandlePressRef,
+                    onDragStart: handleDragStart,
+                    onDragOver: handleDragOver,
+                    onDrop: handleDrop,
+                    onDragEnd: handleDragEnd,
+                    isHandleTarget,
+                    setDraggingIndex
+                  }
+                ))
               )
             },
             /* @__PURE__ */ React.createElement(
@@ -351,8 +417,8 @@ var ActionItemContainer = (props) => {
                     [`${basePrefixCls}-overflow-container-menu-disabled`]: props.menuDisabled
                   }
                 ),
-                onMouseEnter: () => !props.menuDisabled && setIsIndicatorHover(true),
-                onMouseLeave: () => !props.menuDisabled && setIsIndicatorHover(false)
+                onMouseEnter: handleMenuMouseEnter,
+                onMouseLeave: handleMenuMouseLeave
               },
               /* @__PURE__ */ React.createElement(Menu, null)
             )

package/dist/MarkdownInputField/FileMapView/style.js

@@ -28,6 +28,7 @@ var genStyle = (token) => {
     [`${token.componentCls}`]: {
       maxWidth: "100%",
       display: "flex",
+      minWidth: "0px",
       flexDirection: "column",
       flexWrap: "nowrap",
       overflow: "auto",

package/dist/MarkdownInputField/FileUploadManager/index.js

@@ -76,7 +76,7 @@ var useFileUploadManager = ({
     input.id = "uploadImage_" + Math.random();
     input.type = "file";
     input.accept = ((_a = supportedFormat == null ? void 0 : supportedFormat.extensions) == null ? void 0 : _a.join(",")) || "image/*";
-    input.multiple = true;
+    input.multiple = false;
     input.style.display = "none";
     input.onchange = (e) => __async(void 0, null, function* () {
       if (input.dataset.readonly) {
@@ -116,14 +116,25 @@ var useFileUploadManager = ({
     }
   }));
   const handleFileRetry = useRefFunction((file) => __async(void 0, null, function* () {
-    var _a;
     try {
       file.status = "uploading";
       const map = new Map(fileMap);
       map.set(file.uuid || "", file);
       updateAttachmentFiles(map);
-      const url = yield (_a = attachment == null ? void 0 : attachment.upload) == null ? void 0 : _a.call(attachment, file);
-      if (url) {
+      let url;
+      let isSuccess = false;
+      let errorMsg = null;
+      if (attachment == null ? void 0 : attachment.uploadWithResponse) {
+        const uploadResult = yield attachment.uploadWithResponse(file, 0);
+        url = uploadResult.fileUrl;
+        isSuccess = uploadResult.uploadStatus === "SUCCESS";
+        errorMsg = uploadResult.errorMessage || null;
+        file.uploadResponse = uploadResult;
+      } else if (attachment == null ? void 0 : attachment.upload) {
+        url = yield attachment.upload(file);
+        isSuccess = !!url;
+      }
+      if (isSuccess && url) {
         file.status = "done";
         file.url = url;
         map.set(file.uuid || "", file);
@@ -133,7 +144,8 @@ var useFileUploadManager = ({
         file.status = "error";
         map.set(file.uuid || "", file);
         updateAttachmentFiles(map);
-        message.error((locale == null ? void 0 : locale.uploadFailed) || "Upload failed");
+        const failedMsg = errorMsg || (locale == null ? void 0 : locale.uploadFailed) || "Upload failed";
+        message.error(failedMsg);
       }
     } catch (error) {
       console.error("Error retrying file upload:", error);
@@ -141,7 +153,8 @@ var useFileUploadManager = ({
       const map = new Map(fileMap);
       map.set(file.uuid || "", file);
       updateAttachmentFiles(map);
-      message.error((locale == null ? void 0 : locale.uploadFailed) || "Upload failed");
+      const errorMessage = error instanceof Error ? error.message : (locale == null ? void 0 : locale.uploadFailed) || "Upload failed";
+      message.error(errorMessage);
     }
   }));
   return {

package/dist/MarkdownInputField/MarkdownInputField.js

@@ -285,7 +285,11 @@ var MarkdownInputField = (_a) => {
           onMouseEnter: () => setHover(true),
           onMouseLeave: () => setHover(false),
           onKeyDown: (e) => {
+            var _a3;
             const { triggerSendKey = "Enter" } = props;
+            if ((_a3 = markdownEditorRef == null ? void 0 : markdownEditorRef.current) == null ? void 0 : _a3.store.inputComposition) {
+              return;
+            }
             if (triggerSendKey === "Enter" && e.key === "Enter" && !(e.ctrlKey || e.metaKey)) {
               e.stopPropagation();
               e.preventDefault();