30 lines
841 B
TypeScript
30 lines
841 B
TypeScript
|
import { React, h, Box, Text, TextInput } from './plugins.js';
|
||
|
|
|
||
|
|
interface IInputAreaProps {
|
||
|
|
disabled: boolean;
|
||
|
|
onSubmit: (text: string) => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function InputArea({ disabled, onSubmit }: IInputAreaProps): React.ReactElement {
|
||
|
|
const [value, setValue] = React.useState('');
|
||
|
|
|
||
|
|
const handleSubmit = (text: string) => {
|
||
|
|
if (!text.trim()) return;
|
||
|
|
onSubmit(text.trim());
|
||
|
|
setValue('');
|
||
|
|
};
|
||
|
|
|
||
|
|
return h(
|
||
|
|
Box,
|
||
|
|
{ borderStyle: 'single' as const, borderTop: true, borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1 },
|
||
|
|
h(Text, { bold: true, color: disabled ? 'gray' : 'cyan' }, '> '),
|
||
|
|
h(TextInput, {
|
||
|
|
value,
|
||
|
|
onChange: setValue,
|
||
|
|
onSubmit: handleSubmit,
|
||
|
|
placeholder: disabled ? 'Waiting for response...' : 'Type a message...',
|
||
|
|
focus: !disabled,
|
||
|
|
}),
|
||
|
|
);
|
||
|
|
}
|