@icos-react/largemodel 1.0.27 → 1.0.28

package/dist/index.js

@@ -2147,17 +2147,91 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
   const { styles, cx } = useStyles4();
   const rootRef = (0, import_react17.useRef)(null);
   const [prefixButtonContainer, setPrefixButtonContainer] = (0, import_react17.useState)(null);
+  const prefixButtonContainerRef = (0, import_react17.useRef)(null);
+  const syncPrefixButtonContainer = (el) => {
+    prefixButtonContainerRef.current = el;
+    setPrefixButtonContainer(el);
+  };
   const [hasUserEdited, setHasUserEdited] = (0, import_react17.useState)(false);
   const [userClearedContent, setUserClearedContent] = (0, import_react17.useState)(false);
   const [contentText, setContentText] = (0, import_react17.useState)("");
   const previousInitialValueRef = (0, import_react17.useRef)(null);
+  const isComposingRef = (0, import_react17.useRef)(false);
+  const EDITABLE_ANCHOR = "\u200B";
+  const stripEditableAnchor = (text) => text.replace(/^[\u200B\s]+/, "").replace(/\u200B/g, "");
+  const getEditableTextNodeAfterPrefix = () => {
+    const container = prefixButtonContainerRef.current;
+    if (!rootRef.current || !container)
+      return null;
+    const children = Array.from(rootRef.current.childNodes);
+    const buttonIndex = children.indexOf(container);
+    if (buttonIndex === -1)
+      return null;
+    for (let i = buttonIndex + 1; i < children.length; i++) {
+      if (children[i].nodeType === Node.TEXT_NODE) {
+        return children[i];
+      }
+    }
+    return null;
+  };
+  const ensureEditableAnchor = () => {
+    if (!rootRef.current || disabled)
+      return null;
+    if (prefixButton) {
+      if (!prefixButtonContainerRef.current)
+        return null;
+      let textNode2 = getEditableTextNodeAfterPrefix();
+      if (!textNode2) {
+        textNode2 = document.createTextNode(EDITABLE_ANCHOR);
+        rootRef.current.appendChild(textNode2);
+        return textNode2;
+      }
+      const visible2 = stripEditableAnchor(textNode2.textContent || "");
+      if (!visible2 && !textNode2.textContent?.includes(EDITABLE_ANCHOR)) {
+        textNode2.textContent = (textNode2.textContent || "") + EDITABLE_ANCHOR;
+      } else if (!visible2 && textNode2.textContent === "") {
+        textNode2.textContent = EDITABLE_ANCHOR;
+      }
+      return textNode2;
+    }
+    let textNode = Array.from(rootRef.current.childNodes).find(
+      (n) => n.nodeType === Node.TEXT_NODE
+    );
+    if (!textNode) {
+      textNode = document.createTextNode(EDITABLE_ANCHOR);
+      rootRef.current.appendChild(textNode);
+      return textNode;
+    }
+    const visible = stripEditableAnchor(textNode.textContent || "");
+    if (!visible && !textNode.textContent?.includes(EDITABLE_ANCHOR)) {
+      textNode.textContent = EDITABLE_ANCHOR;
+    }
+    return textNode;
+  };
+  const placeCursorInEditableAnchor = () => {
+    const textNode = ensureEditableAnchor();
+    if (!textNode)
+      return;
+    const selection = window.getSelection();
+    if (!selection)
+      return;
+    const range = document.createRange();
+    const offset = textNode.textContent?.length ?? 0;
+    try {
+      range.setStart(textNode, offset);
+      range.collapse(true);
+      selection.removeAllRanges();
+      selection.addRange(range);
+    } catch {
+    }
+  };
   const getPureTextContent3 = () => {
     if (!rootRef.current)
       return "";
     let text = "";
     const children = Array.from(rootRef.current.childNodes);
     children.forEach((node) => {
-      if (node === prefixButtonContainer)
+      if (node === prefixButtonContainerRef.current)
         return;
       if (node.nodeType === Node.TEXT_NODE) {
         text += node.textContent || "";
@@ -2165,13 +2239,20 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
         text += node.textContent || "";
       }
     });
-    return text.trim();
+    return stripEditableAnchor(text);
   };
   const initializeContent = (forceInitialize = false) => {
     if (!rootRef.current)
       return;
     if (userClearedContent && !forceInitialize)
       return;
+    let preservedText = "";
+    if (forceInitialize && !prefixButton && rootRef.current) {
+      preservedText = Array.from(rootRef.current.childNodes).filter(
+        (node) => !(node.nodeType === Node.ELEMENT_NODE && node.getAttribute("contenteditable") === "false")
+      ).map((node) => node.textContent || "").join("");
+      preservedText = stripEditableAnchor(preservedText);
+    }
     rootRef.current.innerHTML = "";
     let plainText = "";
     if (prefixButton) {
@@ -2181,11 +2262,11 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
       buttonContainer.style.userSelect = "none";
       buttonContainer.style.display = "inline-block";
       rootRef.current.appendChild(buttonContainer);
-      setPrefixButtonContainer(buttonContainer);
-      const spaceNode = document.createTextNode(" ");
+      syncPrefixButtonContainer(buttonContainer);
+      const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
       rootRef.current.appendChild(spaceNode);
     } else {
-      setPrefixButtonContainer(null);
+      syncPrefixButtonContainer(null);
     }
     if (initialValue && initialValue.length > 0) {
       initialValue.forEach((item) => {
@@ -2215,10 +2296,28 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
         }
       });
     }
+    if (preservedText) {
+      const textNode = document.createTextNode(preservedText);
+      rootRef.current.appendChild(textNode);
+      plainText = preservedText;
+      setHasUserEdited(true);
+    }
     setContentText(plainText);
-    onChange?.({ target: { value: plainText } });
-    setHasUserEdited(false);
-    setUserClearedContent(false);
+    if (!isComposingRef.current) {
+      onChange?.({ target: { value: plainText } });
+    }
+    if (!preservedText) {
+      setHasUserEdited(false);
+      setUserClearedContent(false);
+    }
+    if (!plainText && rootRef.current) {
+      const hasTextNode = Array.from(rootRef.current.childNodes).some(
+        (n) => n.nodeType === Node.TEXT_NODE
+      );
+      if (!hasTextNode) {
+        rootRef.current.appendChild(document.createTextNode(EDITABLE_ANCHOR));
+      }
+    }
   };
   const hasInitialValueChanged = () => {
     return initialValue !== previousInitialValueRef.current;
@@ -2229,7 +2328,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
       rootRef.current.setAttribute("contenteditable", "true");
     }
     return () => {
-      setPrefixButtonContainer(null);
+      syncPrefixButtonContainer(null);
     };
   }, []);
   (0, import_react17.useEffect)(() => {
@@ -2238,7 +2337,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
       const shouldHaveButton = !!prefixButton;
       if (currentHasButton !== shouldHaveButton) {
         if (currentHasButton && !shouldHaveButton) {
-          setPrefixButtonContainer(null);
+          syncPrefixButtonContainer(null);
         }
         initializeContent(true);
         if (!currentHasButton && shouldHaveButton) {
@@ -2248,30 +2347,8 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
                 rootRef.current.setAttribute("contenteditable", "true");
                 rootRef.current.setAttribute("tabindex", "0");
                 rootRef.current.focus();
-                const selection = window.getSelection();
-                if (selection && rootRef.current) {
-                  const range = document.createRange();
-                  const children = Array.from(rootRef.current.childNodes);
-                  if (children.length > 1) {
-                    const targetNode = children[1];
-                    try {
-                      range.setStart(targetNode, 0);
-                      range.collapse(true);
-                      selection.removeAllRanges();
-                      selection.addRange(range);
-                    } catch (error) {
-                      range.selectNodeContents(rootRef.current);
-                      range.collapse(false);
-                      selection.removeAllRanges();
-                      selection.addRange(range);
-                    }
-                  } else {
-                    range.selectNodeContents(rootRef.current);
-                    range.collapse(false);
-                    selection.removeAllRanges();
-                    selection.addRange(range);
-                  }
-                }
+                ensureEditableAnchor();
+                placeCursorInEditableAnchor();
               }
             });
           });
@@ -2292,7 +2369,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
             }
             timeoutId = setTimeout(() => {
               if (prefixButton && rootRef.current && rootRef.current.childNodes.length === 0) {
-                setPrefixButtonContainer(null);
+                syncPrefixButtonContainer(null);
                 initializeContent(true);
               }
             }, 30);
@@ -2323,25 +2400,28 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
     }
   }, [initialValue]);
   (0, import_react17.useEffect)(() => {
+    if (isComposingRef.current) {
+      return;
+    }
     if (value === "" && rootRef.current) {
       const currentContent = getPureTextContent3();
       if (currentContent !== "" || contentText !== "" && !userClearedContent && !hasUserEdited) {
         rootRef.current.innerHTML = "";
         setContentText("");
-        if (prefixButtonContainer) {
-          setPrefixButtonContainer(null);
-        }
-        if (prefixButton) {
-          setTimeout(() => {
-            initializeContent(true);
-          }, 0);
-        }
+        syncPrefixButtonContainer(null);
+        setTimeout(() => {
+          initializeContent(true);
+        }, 0);
       }
     }
   }, [value, contentText, userClearedContent, hasUserEdited, prefixButton, prefixButtonContainer]);
-  const handleInput = () => {
+  const handleInput = (e) => {
     if (disabled)
       return;
+    if (!isComposingRef.current) {
+      ensureEditableAnchor();
+    }
+    const nativeIsComposing = e.nativeEvent?.isComposing ?? false;
     if (rootRef.current && prefixButtonContainer) {
       const selection = window.getSelection();
       if (selection && selection.anchorNode) {
@@ -2365,6 +2445,10 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
       }
     }
     const text = getPureTextContent3();
+    const isComposing = isComposingRef.current || nativeIsComposing;
+    if (isComposing) {
+      return;
+    }
     if (text !== contentText) {
       setHasUserEdited(true);
       setContentText(text);
@@ -2375,7 +2459,7 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
         setUserClearedContent(false);
       }
     }
-    if (rootRef.current && document.activeElement !== rootRef.current) {
+    if (rootRef.current && document.activeElement !== rootRef.current && !isComposingRef.current) {
       requestAnimationFrame(() => {
         if (rootRef.current && document.activeElement !== rootRef.current) {
           rootRef.current.focus();
@@ -2406,7 +2490,6 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
           }
         }
       });
-    } else {
     }
   };
   const handleEnter = (e) => {
@@ -2418,13 +2501,24 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
   const handleKeyDown = (e) => {
     if (disabled)
       return;
+    if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && !isComposingRef.current && !e.nativeEvent.isComposing) {
+      ensureEditableAnchor();
+    }
     if ((e.key === "Backspace" || e.key === "Delete") && rootRef.current) {
       const selection = window.getSelection();
       const pureText = getPureTextContent3();
-      if (selection && selection.isCollapsed && pureText.length <= 1) {
-        e.preventDefault();
-        clearContent();
-        return;
+      if (selection && selection.isCollapsed) {
+        if (pureText.length === 0) {
+          e.preventDefault();
+          ensureEditableAnchor();
+          placeCursorInEditableAnchor();
+          return;
+        }
+        if (pureText.length <= 1) {
+          e.preventDefault();
+          clearContent();
+          return;
+        }
       }
     }
     if (e.key === "Enter" && !e.shiftKey) {
@@ -2471,13 +2565,17 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
             rootRef.current?.removeChild(child);
           }
         });
-        const spaceNode = document.createTextNode(" ");
+        const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
         rootRef.current.appendChild(spaceNode);
+        placeCursorInEditableAnchor();
       } else if (prefixButton && !prefixButtonContainer) {
         initializeContent(true);
         return;
       } else {
         rootRef.current.innerHTML = "";
+        const anchorNode = document.createTextNode(EDITABLE_ANCHOR);
+        rootRef.current.appendChild(anchorNode);
+        placeCursorInEditableAnchor();
       }
     }
     setContentText("");
@@ -2508,33 +2606,17 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
   (0, import_react17.useEffect)(() => {
     if (prefixButton && prefixButtonContainer && rootRef.current) {
       const timer = setTimeout(() => {
-        if (rootRef.current) {
-          if (!disabled) {
-            const currentContentEditable = rootRef.current.getAttribute("contenteditable");
-            const currentTabIndex = rootRef.current.getAttribute("tabindex");
-            if (currentContentEditable === "false" || currentTabIndex === "-1") {
-              rootRef.current.setAttribute("contenteditable", "true");
-              rootRef.current.setAttribute("tabindex", "0");
-            }
-            if (rootRef.current.childNodes.length > 0) {
-              rootRef.current.focus();
-              const selection = window.getSelection();
-              if (selection && rootRef.current) {
-                const children = Array.from(rootRef.current.childNodes);
-                const buttonIndex = children.indexOf(prefixButtonContainer);
-                if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
-                  const targetNode = children[buttonIndex + 1];
-                  const range = document.createRange();
-                  try {
-                    range.setStart(targetNode, 0);
-                    range.collapse(true);
-                    selection.removeAllRanges();
-                    selection.addRange(range);
-                  } catch (error) {
-                  }
-                }
-              }
-            }
+        if (rootRef.current && !disabled) {
+          const currentContentEditable = rootRef.current.getAttribute("contenteditable");
+          const currentTabIndex = rootRef.current.getAttribute("tabindex");
+          if (currentContentEditable === "false" || currentTabIndex === "-1") {
+            rootRef.current.setAttribute("contenteditable", "true");
+            rootRef.current.setAttribute("tabindex", "0");
+          }
+          if (rootRef.current.childNodes.length > 0) {
+            rootRef.current.focus();
+            ensureEditableAnchor();
+            placeCursorInEditableAnchor();
           }
         }
       }, 100);
@@ -2638,11 +2720,13 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
       onPaste: handlePaste,
       onKeyDown: handleKeyDown,
       onCompositionStart: (e) => {
+        isComposingRef.current = true;
         if (!disabled && onCompositionStart) {
           onCompositionStart(e);
         }
       },
       onCompositionEnd: (e) => {
+        isComposingRef.current = false;
         if (!disabled) {
           onCompositionEnd?.(e);
           syncContentToParent();
@@ -2656,24 +2740,13 @@ var CustomInput = (0, import_react17.forwardRef)((props, ref) => {
       onFocus: () => {
         if (!disabled) {
           setTimeout(() => {
+            if (ensureEditableAnchor()) {
+              placeCursorInEditableAnchor();
+              return;
+            }
             const selection = window.getSelection();
             if (selection && rootRef.current) {
               const range = document.createRange();
-              if (prefixButtonContainer && rootRef.current.contains(prefixButtonContainer)) {
-                const children = Array.from(rootRef.current.childNodes);
-                const buttonIndex = children.indexOf(prefixButtonContainer);
-                if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
-                  const targetNode = children[buttonIndex + 1];
-                  try {
-                    range.setStart(targetNode, 0);
-                    range.collapse(true);
-                    selection.removeAllRanges();
-                    selection.addRange(range);
-                    return;
-                  } catch (error) {
-                  }
-                }
-              }
               range.selectNodeContents(rootRef.current);
               range.collapse(false);
               selection.removeAllRanges();
@@ -6315,7 +6388,9 @@ var ChatDemo = (0, import_react21.forwardRef)(
             CustomInput_default,
             {
               value: content,
-              onChange: (e) => !isLoading && !isEventChangeProcessing && setContent(e.target.value),
+              onChange: (e) => {
+                return !isLoading && !isEventChangeProcessing && setContent(e.target.value);
+              },
               onPressEnter: () => !isLoading && !isEventChangeProcessing && onSubmit(content),
               placeholder: isLoading || isEventChangeProcessing ? "\u7B49\u5F85\u54CD\u5E94\u4E2D..." : "\u8BF7\u8F93\u5165\u60A8\u7684\u95EE\u9898...",
               initialValue: customInitialValue || [],

package/dist/index.mjs

@@ -2098,17 +2098,91 @@ var CustomInput = forwardRef4((props, ref) => {
   const { styles, cx } = useStyles4();
   const rootRef = useRef7(null);
   const [prefixButtonContainer, setPrefixButtonContainer] = useState7(null);
+  const prefixButtonContainerRef = useRef7(null);
+  const syncPrefixButtonContainer = (el) => {
+    prefixButtonContainerRef.current = el;
+    setPrefixButtonContainer(el);
+  };
   const [hasUserEdited, setHasUserEdited] = useState7(false);
   const [userClearedContent, setUserClearedContent] = useState7(false);
   const [contentText, setContentText] = useState7("");
   const previousInitialValueRef = useRef7(null);
+  const isComposingRef = useRef7(false);
+  const EDITABLE_ANCHOR = "\u200B";
+  const stripEditableAnchor = (text) => text.replace(/^[\u200B\s]+/, "").replace(/\u200B/g, "");
+  const getEditableTextNodeAfterPrefix = () => {
+    const container = prefixButtonContainerRef.current;
+    if (!rootRef.current || !container)
+      return null;
+    const children = Array.from(rootRef.current.childNodes);
+    const buttonIndex = children.indexOf(container);
+    if (buttonIndex === -1)
+      return null;
+    for (let i = buttonIndex + 1; i < children.length; i++) {
+      if (children[i].nodeType === Node.TEXT_NODE) {
+        return children[i];
+      }
+    }
+    return null;
+  };
+  const ensureEditableAnchor = () => {
+    if (!rootRef.current || disabled)
+      return null;
+    if (prefixButton) {
+      if (!prefixButtonContainerRef.current)
+        return null;
+      let textNode2 = getEditableTextNodeAfterPrefix();
+      if (!textNode2) {
+        textNode2 = document.createTextNode(EDITABLE_ANCHOR);
+        rootRef.current.appendChild(textNode2);
+        return textNode2;
+      }
+      const visible2 = stripEditableAnchor(textNode2.textContent || "");
+      if (!visible2 && !textNode2.textContent?.includes(EDITABLE_ANCHOR)) {
+        textNode2.textContent = (textNode2.textContent || "") + EDITABLE_ANCHOR;
+      } else if (!visible2 && textNode2.textContent === "") {
+        textNode2.textContent = EDITABLE_ANCHOR;
+      }
+      return textNode2;
+    }
+    let textNode = Array.from(rootRef.current.childNodes).find(
+      (n) => n.nodeType === Node.TEXT_NODE
+    );
+    if (!textNode) {
+      textNode = document.createTextNode(EDITABLE_ANCHOR);
+      rootRef.current.appendChild(textNode);
+      return textNode;
+    }
+    const visible = stripEditableAnchor(textNode.textContent || "");
+    if (!visible && !textNode.textContent?.includes(EDITABLE_ANCHOR)) {
+      textNode.textContent = EDITABLE_ANCHOR;
+    }
+    return textNode;
+  };
+  const placeCursorInEditableAnchor = () => {
+    const textNode = ensureEditableAnchor();
+    if (!textNode)
+      return;
+    const selection = window.getSelection();
+    if (!selection)
+      return;
+    const range = document.createRange();
+    const offset = textNode.textContent?.length ?? 0;
+    try {
+      range.setStart(textNode, offset);
+      range.collapse(true);
+      selection.removeAllRanges();
+      selection.addRange(range);
+    } catch {
+    }
+  };
   const getPureTextContent3 = () => {
     if (!rootRef.current)
       return "";
     let text = "";
     const children = Array.from(rootRef.current.childNodes);
     children.forEach((node) => {
-      if (node === prefixButtonContainer)
+      if (node === prefixButtonContainerRef.current)
         return;
       if (node.nodeType === Node.TEXT_NODE) {
         text += node.textContent || "";
@@ -2116,13 +2190,20 @@ var CustomInput = forwardRef4((props, ref) => {
         text += node.textContent || "";
       }
     });
-    return text.trim();
+    return stripEditableAnchor(text);
   };
   const initializeContent = (forceInitialize = false) => {
     if (!rootRef.current)
       return;
     if (userClearedContent && !forceInitialize)
       return;
+    let preservedText = "";
+    if (forceInitialize && !prefixButton && rootRef.current) {
+      preservedText = Array.from(rootRef.current.childNodes).filter(
+        (node) => !(node.nodeType === Node.ELEMENT_NODE && node.getAttribute("contenteditable") === "false")
+      ).map((node) => node.textContent || "").join("");
+      preservedText = stripEditableAnchor(preservedText);
+    }
     rootRef.current.innerHTML = "";
     let plainText = "";
     if (prefixButton) {
@@ -2132,11 +2213,11 @@ var CustomInput = forwardRef4((props, ref) => {
       buttonContainer.style.userSelect = "none";
       buttonContainer.style.display = "inline-block";
       rootRef.current.appendChild(buttonContainer);
-      setPrefixButtonContainer(buttonContainer);
-      const spaceNode = document.createTextNode(" ");
+      syncPrefixButtonContainer(buttonContainer);
+      const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
       rootRef.current.appendChild(spaceNode);
     } else {
-      setPrefixButtonContainer(null);
+      syncPrefixButtonContainer(null);
     }
     if (initialValue && initialValue.length > 0) {
       initialValue.forEach((item) => {
@@ -2166,10 +2247,28 @@ var CustomInput = forwardRef4((props, ref) => {
         }
       });
     }
+    if (preservedText) {
+      const textNode = document.createTextNode(preservedText);
+      rootRef.current.appendChild(textNode);
+      plainText = preservedText;
+      setHasUserEdited(true);
+    }
     setContentText(plainText);
-    onChange?.({ target: { value: plainText } });
-    setHasUserEdited(false);
-    setUserClearedContent(false);
+    if (!isComposingRef.current) {
+      onChange?.({ target: { value: plainText } });
+    }
+    if (!preservedText) {
+      setHasUserEdited(false);
+      setUserClearedContent(false);
+    }
+    if (!plainText && rootRef.current) {
+      const hasTextNode = Array.from(rootRef.current.childNodes).some(
+        (n) => n.nodeType === Node.TEXT_NODE
+      );
+      if (!hasTextNode) {
+        rootRef.current.appendChild(document.createTextNode(EDITABLE_ANCHOR));
+      }
+    }
   };
   const hasInitialValueChanged = () => {
     return initialValue !== previousInitialValueRef.current;
@@ -2180,7 +2279,7 @@ var CustomInput = forwardRef4((props, ref) => {
       rootRef.current.setAttribute("contenteditable", "true");
     }
     return () => {
-      setPrefixButtonContainer(null);
+      syncPrefixButtonContainer(null);
     };
   }, []);
   useEffect6(() => {
@@ -2189,7 +2288,7 @@ var CustomInput = forwardRef4((props, ref) => {
       const shouldHaveButton = !!prefixButton;
       if (currentHasButton !== shouldHaveButton) {
         if (currentHasButton && !shouldHaveButton) {
-          setPrefixButtonContainer(null);
+          syncPrefixButtonContainer(null);
         }
         initializeContent(true);
         if (!currentHasButton && shouldHaveButton) {
@@ -2199,30 +2298,8 @@ var CustomInput = forwardRef4((props, ref) => {
                 rootRef.current.setAttribute("contenteditable", "true");
                 rootRef.current.setAttribute("tabindex", "0");
                 rootRef.current.focus();
-                const selection = window.getSelection();
-                if (selection && rootRef.current) {
-                  const range = document.createRange();
-                  const children = Array.from(rootRef.current.childNodes);
-                  if (children.length > 1) {
-                    const targetNode = children[1];
-                    try {
-                      range.setStart(targetNode, 0);
-                      range.collapse(true);
-                      selection.removeAllRanges();
-                      selection.addRange(range);
-                    } catch (error) {
-                      range.selectNodeContents(rootRef.current);
-                      range.collapse(false);
-                      selection.removeAllRanges();
-                      selection.addRange(range);
-                    }
-                  } else {
-                    range.selectNodeContents(rootRef.current);
-                    range.collapse(false);
-                    selection.removeAllRanges();
-                    selection.addRange(range);
-                  }
-                }
+                ensureEditableAnchor();
+                placeCursorInEditableAnchor();
               }
             });
           });
@@ -2243,7 +2320,7 @@ var CustomInput = forwardRef4((props, ref) => {
             }
             timeoutId = setTimeout(() => {
               if (prefixButton && rootRef.current && rootRef.current.childNodes.length === 0) {
-                setPrefixButtonContainer(null);
+                syncPrefixButtonContainer(null);
                 initializeContent(true);
               }
             }, 30);
@@ -2274,25 +2351,28 @@ var CustomInput = forwardRef4((props, ref) => {
     }
   }, [initialValue]);
   useEffect6(() => {
+    if (isComposingRef.current) {
+      return;
+    }
     if (value === "" && rootRef.current) {
       const currentContent = getPureTextContent3();
       if (currentContent !== "" || contentText !== "" && !userClearedContent && !hasUserEdited) {
         rootRef.current.innerHTML = "";
         setContentText("");
-        if (prefixButtonContainer) {
-          setPrefixButtonContainer(null);
-        }
-        if (prefixButton) {
-          setTimeout(() => {
-            initializeContent(true);
-          }, 0);
-        }
+        syncPrefixButtonContainer(null);
+        setTimeout(() => {
+          initializeContent(true);
+        }, 0);
       }
     }
   }, [value, contentText, userClearedContent, hasUserEdited, prefixButton, prefixButtonContainer]);
-  const handleInput = () => {
+  const handleInput = (e) => {
     if (disabled)
       return;
+    if (!isComposingRef.current) {
+      ensureEditableAnchor();
+    }
+    const nativeIsComposing = e.nativeEvent?.isComposing ?? false;
     if (rootRef.current && prefixButtonContainer) {
       const selection = window.getSelection();
       if (selection && selection.anchorNode) {
@@ -2316,6 +2396,10 @@ var CustomInput = forwardRef4((props, ref) => {
       }
     }
     const text = getPureTextContent3();
+    const isComposing = isComposingRef.current || nativeIsComposing;
+    if (isComposing) {
+      return;
+    }
     if (text !== contentText) {
       setHasUserEdited(true);
       setContentText(text);
@@ -2326,7 +2410,7 @@ var CustomInput = forwardRef4((props, ref) => {
         setUserClearedContent(false);
       }
     }
-    if (rootRef.current && document.activeElement !== rootRef.current) {
+    if (rootRef.current && document.activeElement !== rootRef.current && !isComposingRef.current) {
       requestAnimationFrame(() => {
         if (rootRef.current && document.activeElement !== rootRef.current) {
           rootRef.current.focus();
@@ -2357,7 +2441,6 @@ var CustomInput = forwardRef4((props, ref) => {
           }
         }
       });
-    } else {
     }
   };
   const handleEnter = (e) => {
@@ -2369,13 +2452,24 @@ var CustomInput = forwardRef4((props, ref) => {
   const handleKeyDown = (e) => {
     if (disabled)
       return;
+    if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && !isComposingRef.current && !e.nativeEvent.isComposing) {
+      ensureEditableAnchor();
+    }
     if ((e.key === "Backspace" || e.key === "Delete") && rootRef.current) {
       const selection = window.getSelection();
       const pureText = getPureTextContent3();
-      if (selection && selection.isCollapsed && pureText.length <= 1) {
-        e.preventDefault();
-        clearContent();
-        return;
+      if (selection && selection.isCollapsed) {
+        if (pureText.length === 0) {
+          e.preventDefault();
+          ensureEditableAnchor();
+          placeCursorInEditableAnchor();
+          return;
+        }
+        if (pureText.length <= 1) {
+          e.preventDefault();
+          clearContent();
+          return;
+        }
       }
     }
     if (e.key === "Enter" && !e.shiftKey) {
@@ -2422,13 +2516,17 @@ var CustomInput = forwardRef4((props, ref) => {
             rootRef.current?.removeChild(child);
           }
         });
-        const spaceNode = document.createTextNode(" ");
+        const spaceNode = document.createTextNode(EDITABLE_ANCHOR);
         rootRef.current.appendChild(spaceNode);
+        placeCursorInEditableAnchor();
       } else if (prefixButton && !prefixButtonContainer) {
         initializeContent(true);
         return;
       } else {
         rootRef.current.innerHTML = "";
+        const anchorNode = document.createTextNode(EDITABLE_ANCHOR);
+        rootRef.current.appendChild(anchorNode);
+        placeCursorInEditableAnchor();
       }
     }
     setContentText("");
@@ -2459,33 +2557,17 @@ var CustomInput = forwardRef4((props, ref) => {
   useEffect6(() => {
     if (prefixButton && prefixButtonContainer && rootRef.current) {
       const timer = setTimeout(() => {
-        if (rootRef.current) {
-          if (!disabled) {
-            const currentContentEditable = rootRef.current.getAttribute("contenteditable");
-            const currentTabIndex = rootRef.current.getAttribute("tabindex");
-            if (currentContentEditable === "false" || currentTabIndex === "-1") {
-              rootRef.current.setAttribute("contenteditable", "true");
-              rootRef.current.setAttribute("tabindex", "0");
-            }
-            if (rootRef.current.childNodes.length > 0) {
-              rootRef.current.focus();
-              const selection = window.getSelection();
-              if (selection && rootRef.current) {
-                const children = Array.from(rootRef.current.childNodes);
-                const buttonIndex = children.indexOf(prefixButtonContainer);
-                if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
-                  const targetNode = children[buttonIndex + 1];
-                  const range = document.createRange();
-                  try {
-                    range.setStart(targetNode, 0);
-                    range.collapse(true);
-                    selection.removeAllRanges();
-                    selection.addRange(range);
-                  } catch (error) {
-                  }
-                }
-              }
-            }
+        if (rootRef.current && !disabled) {
+          const currentContentEditable = rootRef.current.getAttribute("contenteditable");
+          const currentTabIndex = rootRef.current.getAttribute("tabindex");
+          if (currentContentEditable === "false" || currentTabIndex === "-1") {
+            rootRef.current.setAttribute("contenteditable", "true");
+            rootRef.current.setAttribute("tabindex", "0");
+          }
+          if (rootRef.current.childNodes.length > 0) {
+            rootRef.current.focus();
+            ensureEditableAnchor();
+            placeCursorInEditableAnchor();
           }
         }
       }, 100);
@@ -2589,11 +2671,13 @@ var CustomInput = forwardRef4((props, ref) => {
       onPaste: handlePaste,
       onKeyDown: handleKeyDown,
       onCompositionStart: (e) => {
+        isComposingRef.current = true;
         if (!disabled && onCompositionStart) {
           onCompositionStart(e);
         }
       },
       onCompositionEnd: (e) => {
+        isComposingRef.current = false;
         if (!disabled) {
           onCompositionEnd?.(e);
           syncContentToParent();
@@ -2607,24 +2691,13 @@ var CustomInput = forwardRef4((props, ref) => {
       onFocus: () => {
         if (!disabled) {
           setTimeout(() => {
+            if (ensureEditableAnchor()) {
+              placeCursorInEditableAnchor();
+              return;
+            }
             const selection = window.getSelection();
             if (selection && rootRef.current) {
               const range = document.createRange();
-              if (prefixButtonContainer && rootRef.current.contains(prefixButtonContainer)) {
-                const children = Array.from(rootRef.current.childNodes);
-                const buttonIndex = children.indexOf(prefixButtonContainer);
-                if (buttonIndex !== -1 && children.length > buttonIndex + 1) {
-                  const targetNode = children[buttonIndex + 1];
-                  try {
-                    range.setStart(targetNode, 0);
-                    range.collapse(true);
-                    selection.removeAllRanges();
-                    selection.addRange(range);
-                    return;
-                  } catch (error) {
-                  }
-                }
-              }
               range.selectNodeContents(rootRef.current);
               range.collapse(false);
               selection.removeAllRanges();
@@ -6266,7 +6339,9 @@ var ChatDemo = forwardRef5(
             CustomInput_default,
             {
               value: content,
-              onChange: (e) => !isLoading && !isEventChangeProcessing && setContent(e.target.value),
+              onChange: (e) => {
+                return !isLoading && !isEventChangeProcessing && setContent(e.target.value);
+              },
               onPressEnter: () => !isLoading && !isEventChangeProcessing && onSubmit(content),
               placeholder: isLoading || isEventChangeProcessing ? "\u7B49\u5F85\u54CD\u5E94\u4E2D..." : "\u8BF7\u8F93\u5165\u60A8\u7684\u95EE\u9898...",
               initialValue: customInitialValue || [],

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@icos-react/largemodel",
   "displayName": "大模型组件",
-  "version": "1.0.27",
+  "version": "1.0.28",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",