UNPKG

@plteam/chat-ui

Version:

CUI Kit is a free and open-source library for creating AI assistant chat interfaces, built with React, Material UI, and TypeScript

32 lines (31 loc) 1.46 kB
import * as React from 'react'; import { styled } from '@mui/material/styles'; import TextField from '@mui/material/TextField/TextField'; import { outlinedInputClasses } from '@mui/material/OutlinedInput'; import useEnterPress, { handleIgnoreEnterPress } from '../../hooks/useEnterPress'; import { useTablet } from '../../../ui/Responsive'; import { materialDesignSysPalette } from '../../../utils/materialDesign/palette'; const TextFieldStyled = styled(TextField)(() => ({ border: 'unset', [`& .${outlinedInputClasses.root}`]: { '& fieldset': { borderColor: materialDesignSysPalette.outline, }, '&:hover fieldset': { borderColor: materialDesignSysPalette.onSurface, }, [`&.${outlinedInputClasses.focused} fieldset`]: { borderColor: materialDesignSysPalette.primary, } } })); const MessageUserEditorTextfield = ({ newText, setNewText, onEnterPress: onEnterPressCallback }) => { const isTablet = useTablet(); const onEnterPress = useEnterPress(onEnterPressCallback); return (React.createElement(TextFieldStyled, { multiline: true, value: newText, maxRows: 7, // TODO: #ANY onChange: (event) => setNewText(event.target.value), onKeyUp: isTablet ? undefined : onEnterPress, onKeyDown: !isTablet ? handleIgnoreEnterPress : undefined })); }; export default MessageUserEditorTextfield;