feat(Sender): add files param to the onPasteFile callback

components/sender/__tests__/index.test.tsx

@@ -138,4 +138,79 @@ describe('Sender Component', () => {
     const { container } = render(<Sender readOnly />);
     expect(container.querySelector('textarea')).toHaveAttribute('readonly');
   });
+
+  describe('paste events', () => {
+    it('onPaste callback', () => {
+      const onPaste = jest.fn();
+      const { container } = render(<Sender onPaste={onPaste} />);
+
+      const textarea = container.querySelector('textarea')!;
+      fireEvent.paste(textarea);
+      expect(onPaste).toHaveBeenCalled();
+      const eventArg = onPaste.mock.calls[0][0];
+      expect(eventArg.type).toBe('paste');
+      expect(eventArg.target).toBe(textarea);
+    });
+
+    it('onPasteFile callback with files', () => {
+      const onPasteFile = jest.fn();
+      const { container } = render(<Sender onPasteFile={onPasteFile} />);
+
+      const file = new File(['test'], 'test.png', { type: 'image/png' });
+      const fileList = {
+        0: file,
+        length: 1,
+        item: (idx: number) => (idx === 0 ? file : null),
+      };
+
+      const textarea = container.querySelector('textarea')!;
+      fireEvent.paste(textarea, {
+        clipboardData: {
+          files: fileList,
+          getData: () => '',
+        },
+      });
+
+      expect(onPasteFile).toHaveBeenCalledWith(file, fileList);
+    });
+
+    it('should not trigger onPasteFile when no files', () => {
+      const onPasteFile = jest.fn();
+      const { container } = render(<Sender onPasteFile={onPasteFile} />);
+
+      const textarea = container.querySelector('textarea')!;
+      fireEvent.paste(textarea, {
+        clipboardData: {
+          files: { length: 0 },
+          getData: () => '',
+        },
+      });
+
+      expect(onPasteFile).not.toHaveBeenCalled();
+    });
+
+    it('should handle multiple files paste', () => {
+      const onPasteFile = jest.fn();
+      const { container } = render(<Sender onPasteFile={onPasteFile} />);
+
+      const file1 = new File(['test1'], 'test1.png', { type: 'image/png' });
+      const file2 = new File(['test2'], 'test2.jpg', { type: 'image/jpeg' });
+      const fileList = {
+        0: file1,
+        1: file2,
+        length: 2,
+        item: (idx: number) => (idx === 0 ? file1 : idx === 1 ? file2 : null),
+      };
+
+      const textarea = container.querySelector('textarea')!;
+      fireEvent.paste(textarea, {
+        clipboardData: {
+          files: fileList,
+          getData: () => '',
+        },
+      });
+
+      expect(onPasteFile).toHaveBeenCalledWith(file1, fileList);
+    });
+  });
 });

components/sender/demo/paste-image.md

@@ -1,7 +1,7 @@
 ## zh-CN
 
-配合 Attachments 进行黏贴文件上传。
+使用 `onPasteFile` 获取黏贴的文件，配合 Attachments 进行文件上传。
 
 ## en-US
 
-Paste image to upload files with Attachments.
+Use `onPasteFile` to get pasted files, and upload them with Attachments.

components/sender/demo/paste-image.tsx

@@ -62,8 +62,10 @@ const Demo = () => {
         }
         value={text}
         onChange={setText}
-        onPasteFile={(file) => {
-          attachmentsRef.current?.upload(file);
+        onPasteFile={(_, files) => {
+          for (const file of files) {
+            attachmentsRef.current?.upload(file);
+          }
           setOpen(true);
         }}
         onSubmit={() => {

components/sender/index.en-US.md

@@ -24,7 +24,7 @@ coverDark: https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*cOfrS4fVkOMAAA
 <code src="./demo/header.tsx">Header panel</code>
 <code src="./demo/header-fixed.tsx">Reference</code>
 <code src="./demo/send-style.tsx">Adjust style</code>
-<code src="./demo/paste-image.tsx">Paste image</code>
+<code src="./demo/paste-image.tsx">Paste files</code>
 <code src="./demo/focus.tsx">Focus</code>
 
 ## API
@@ -52,7 +52,7 @@ Common props ref：[Common props](/docs/react/common-props)
 | onSubmit | Callback when click send button | (message: string) => void | - | - |
 | onChange | Callback when input value changes | (value: string, event?: React.FormEvent<`HTMLTextAreaElement`> \| React.ChangeEvent<`HTMLTextAreaElement`> ) => void | - | - |
 | onCancel | Callback when click cancel button | () => void | - | - |
-| onPasteFile | Callback when paste file | (file: File) => void | - | - |
+| onPasteFile | Callback when paste files | (firstFile: File, files: FileList) => void | - | - |
 
 ```typescript | pure
 type SpeechConfig = {

components/sender/index.tsx

@@ -53,7 +53,7 @@ export interface SenderProps extends Pick<TextareaProps, 'placeholder' | 'onKeyP
   onCancel?: VoidFunction;
   onKeyDown?: React.KeyboardEventHandler<any>;
   onPaste?: React.ClipboardEventHandler<HTMLElement>;
-  onPasteFile?: (file: File) => void;
+  onPasteFile?: (firstFile: File, files: FileList) => void;
   components?: SenderComponents;
   styles?: {
     prefix?: React.CSSProperties;
@@ -232,10 +232,10 @@ const ForwardSender = React.forwardRef<SenderRef, SenderProps>((props, ref) => {
 
   // ============================ Paste =============================
   const onInternalPaste: React.ClipboardEventHandler<HTMLElement> = (e) => {
-    // Get file
-    const file = e.clipboardData?.files[0];
-    if (file && onPasteFile) {
-      onPasteFile(file);
+    // Get files
+    const files = e.clipboardData?.files;
+    if (files?.length && onPasteFile) {
+      onPasteFile(files[0], files);
       e.preventDefault();
     }
 

components/sender/index.zh-CN.md

@@ -25,7 +25,7 @@ coverDark: https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*cOfrS4fVkOMAAA
 <code src="./demo/header.tsx">展开面板</code>
 <code src="./demo/header-fixed.tsx">引用</code>
 <code src="./demo/send-style.tsx">调整样式</code>
-<code src="./demo/paste-image.tsx">黏贴图片</code>
+<code src="./demo/paste-image.tsx">黏贴文件</code>
 <code src="./demo/focus.tsx">聚焦</code>
 
 ## API
@@ -53,7 +53,7 @@ coverDark: https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*cOfrS4fVkOMAAA
 | onSubmit | 点击发送按钮的回调 | (message: string) => void | - | - |
 | onChange | 输入框值改变的回调 | (value: string, event?: React.FormEvent<`HTMLTextAreaElement`> \| React.ChangeEvent<`HTMLTextAreaElement`> ) => void | - | - |
 | onCancel | 点击取消按钮的回调 | () => void | - | - |
-| onPasteFile | 黏贴文件的回调 | (file: File) => void | - | - |
+| onPasteFile | 黏贴文件的回调 | (firstFile: File, files: FileList) => void | - | - |
 
 ```typescript | pure
 type SpeechConfig = {