@fe-free/ai 4.0.0 → 4.0.2

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @fe-free/ai
 
+## 4.0.2
+
+### Patch Changes
+
+- fix: ai
+  - @fe-free/core@4.0.2
+  - @fe-free/icons@4.0.2
+  - @fe-free/tool@4.0.2
+
+## 4.0.1
+
+### Patch Changes
+
+- fix: ai
+  - @fe-free/core@4.0.1
+  - @fe-free/icons@4.0.1
+  - @fe-free/tool@4.0.1
+
 ## 4.0.0
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/ai",
-  "version": "4.0.0",
+  "version": "4.0.2",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -12,14 +12,14 @@
   "dependencies": {
     "ahooks": "^3.7.8",
     "classnames": "^2.5.1",
-    "@fe-free/core": "4.0.0"
+    "@fe-free/core": "4.0.2"
   },
   "peerDependencies": {
     "antd": "^5.27.1",
     "dayjs": "~1.11.10",
     "react": "^19.2.0",
-    "@fe-free/icons": "4.0.0",
-    "@fe-free/tool": "4.0.0"
+    "@fe-free/icons": "4.0.2",
+    "@fe-free/tool": "4.0.2"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

package/src/sender/actions.tsx

@@ -1,6 +1,7 @@
 import Icons from '@fe-free/icons';
+import type { UploadFile } from 'antd';
 import { Button, Divider } from 'antd';
-import type { RefObject } from 'react';
+import { useCallback, type RefObject } from 'react';
 import SendIcon from '../svgs/send.svg?react';
 import { FileAction } from './files';
 import { RecordAction } from './record';
@@ -9,18 +10,24 @@ import type { SenderProps } from './types';
 
 function Actions(
   props: SenderProps & {
+    refText: RefObject<HTMLTextAreaElement>;
     refUpload: RefObject<HTMLDivElement>;
     isUploading: boolean;
+    fileList: UploadFile[];
+    setFileList: (fileList: UploadFile[]) => void;
     fileUrls: string[];
     setFileUrls: (fileUrls: string[]) => void;
   },
 ) {
   const {
+    refText,
     loading,
     onSubmit,
     value,
+    onChange,
     refUpload,
     isUploading,
+    setFileList,
     fileUrls,
     setFileUrls,
     allowUpload,
@@ -29,6 +36,30 @@ function Actions(
 
   const isLoading = loading || isUploading;
 
+  const handleSubmit = useCallback(async () => {
+    if (isLoading) {
+      return;
+    }
+
+    const newValue = {
+      ...value,
+      text: value?.text?.trim(),
+    };
+
+    // 有内容才提交
+    if (newValue.text || (newValue.files && newValue.files.length > 0)) {
+      await Promise.resolve(onSubmit?.(newValue));
+
+      // reset
+      setFileList([]);
+      setFileUrls([]);
+      onChange?.({});
+
+      // focus
+      refText.current?.focus();
+    }
+  }, [isLoading, value, onSubmit, setFileList, setFileUrls, onChange, refText]);
+
   return (
     <div className="flex items-center gap-2">
       <div className="flex flex-1 gap-1">
@@ -50,21 +81,7 @@ function Actions(
           icon={<Icons component={SendIcon} className="!text-lg" />}
           loading={isLoading}
           // disabled={loading}
-          onClick={() => {
-            if (isLoading) {
-              return;
-            }
-
-            const newValue = {
-              ...value,
-              text: value?.text?.trim(),
-            };
-
-            // 有内容才提交
-            if (newValue.text || (newValue.files && newValue.files.length > 0)) {
-              onSubmit?.(newValue);
-            }
-          }}
+          onClick={handleSubmit}
         />
       </div>
     </div>

package/src/sender/index.tsx

@@ -2,17 +2,19 @@ import { useDrop } from 'ahooks';
 import { Input } from 'antd';
 import type { UploadFile } from 'antd/lib';
 import classNames from 'classnames';
+import type { RefObject } from 'react';
 import { useCallback, useMemo, useRef, useState } from 'react';
 import { Actions } from './actions';
 import { FileUpload, Files } from './files';
 import './style.scss';
 import type { SenderProps, SenderRef } from './types';
 
-function Text(props: SenderProps) {
-  const { value, onChange, placeholder } = props;
+function Text(props: SenderProps & { refText: RefObject<HTMLTextAreaElement> }) {
+  const { value, onChange, placeholder, refText } = props;
 
   return (
     <Input.TextArea
+      ref={refText}
       value={value?.text}
       onChange={(e) => {
         onChange?.({ ...value, text: e.target.value });
@@ -37,7 +39,10 @@ function Sender(originProps: SenderProps) {
     };
   }, [originProps]);
 
-  const { value, onChange, filesMaxCount } = props;
+  const refText = useRef<HTMLTextAreaElement>(null);
+
+  const { value, onChange, allowUpload } = props;
+  const { filesMaxCount } = allowUpload || {};
 
   const refContainer = useRef<HTMLDivElement>(null);
   const refUpload = useRef<HTMLDivElement>(null);
@@ -75,7 +80,7 @@ function Sender(originProps: SenderProps) {
       originSetFileUrls(fileUrls);
       handleFilesChange({ fileUrls, fileList });
     },
-    [fileList],
+    [fileList, handleFilesChange],
   );
 
   const setFileList = useCallback(
@@ -83,7 +88,7 @@ function Sender(originProps: SenderProps) {
       originSetFileList(fileList);
       handleFilesChange({ fileUrls, fileList });
     },
-    [fileUrls],
+    [fileUrls, handleFilesChange],
   );
 
   const isUploading = useMemo(() => {
@@ -95,9 +100,12 @@ function Sender(originProps: SenderProps) {
     <div className="fea-sender-wrap">
       <div
         ref={refContainer}
-        className={classNames('fea-sender relative flex flex-col rounded-lg border border-01 p-2', {
-          'fea-sender-drag-hover': dragHover,
-        })}
+        className={classNames(
+          'fea-sender relative flex flex-col rounded-lg border border-01 bg-white p-2',
+          {
+            'fea-sender-drag-hover': dragHover,
+          },
+        )}
       >
         <Files
           {...props}
@@ -107,12 +115,15 @@ function Sender(originProps: SenderProps) {
           setFileUrls={setFileUrls}
         />
         <div className="flex">
-          <Text {...props} />
+          <Text {...props} refText={refText} />
         </div>
         <Actions
           {...props}
+          refText={refText}
           refUpload={refUpload}
           isUploading={isUploading}
+          fileList={fileList}
+          setFileList={setFileList}
           fileUrls={fileUrls}
           setFileUrls={setFileUrls}
         />

package/src/sender/sender.stories.tsx

@@ -11,7 +11,7 @@ const meta: Meta<typeof Sender> = {
 
 type Story = StoryObj<typeof Sender>;
 
-function Component(props: Omit<SenderProps, 'value' | 'onChange'>) {
+function Component(props: Omit<SenderProps, 'value' | 'onChange' | 'onSubmit'>) {
   const [v, setV] = useState<SenderValue | undefined>(undefined);
 
   return (
@@ -21,6 +21,9 @@ function Component(props: Omit<SenderProps, 'value' | 'onChange'>) {
         console.log('newValue', v);
         setV(v);
       }}
+      onSubmit={(value) => {
+        console.log('onSubmit', value);
+      }}
       {...props}
     />
   );

package/src/sender/types.ts

@@ -12,7 +12,7 @@ interface SenderProps {
   onChange: (value?: SenderValue) => void;
 
   loading?: boolean;
-  onSubmit: (value?: SenderValue) => void;
+  onSubmit: (value?: SenderValue) => void | Promise<void>;
 
   placeholder?: string;