diff --git a/src/components/Composer/index.tsx b/src/components/Composer/index.tsx index 8daba04e..ba927182 100644 --- a/src/components/Composer/index.tsx +++ b/src/components/Composer/index.tsx @@ -1,7 +1,7 @@ /* eslint-disable react/forbid-prop-types */ import React, { useState, useRef, useEffect, useImperativeHandle } from 'react'; import clsx from 'clsx'; -import { IconButton, IconButtonProps } from '../IconButton'; +import { IconButtonProps } from '../IconButton'; import { Input } from '../Input'; import { Recorder, RecorderProps } from '../Recorder'; import { Toolbar } from '../Toolbar'; @@ -234,14 +234,16 @@ export const Composer = React.forwardRef((props, return {accessory}; } - const inputTypeIcon = inputType === 'text' ? 'mic' : 'keyboard'; + const isInputText = inputType === 'text'; + const inputTypeIcon = isInputText ? 'mic' : 'keyboard'; const hasToolbar = toolbar.length > 0; - const renderInput = () => ( -
+ const renderInput = (minRows: number) => ( +
((props, onChange={handleTextChange} onPaste={onImageSend ? handlePaste : undefined} /> - {handlePaste && ( )} @@ -288,7 +284,15 @@ export const Composer = React.forwardRef((props, {accessoryContent} )} -
{renderInput()}
+
{renderInput(3)}
+
); } @@ -302,15 +306,24 @@ export const Composer = React.forwardRef((props, data-icon={inputTypeIcon} icon={inputTypeIcon} onClick={handleInputTypeChange} - aria-label={inputType === 'text' ? '切换到语音输入' : '切换到键盘输入'} + aria-label={isInputText ? '切换到语音输入' : '切换到键盘输入'} /> )}
- {renderInput()} - {inputType === 'voice' && } + {renderInput(1)} + {!isInputText && }
- {rightAction && } - {hasToolbar && ( + {text && ( + + )} + {!text && rightAction && } + {!text && hasToolbar && (