input to multiline

This commit is contained in:
jrkb 2023-05-02 13:58:48 +02:00
parent b9da444473
commit 94dada8c42
2 changed files with 7 additions and 7 deletions

View file

@ -18,7 +18,7 @@ const Container = deriver(styled.div<{
isHighlighted: PropHighlighted
}>`
display: flex;
height: 30px;
min-height: 30px;
justify-content: flex-start;
align-items: stretch;
// We cannot calculate both the container (details panel) width and the descendant

View file

@ -6,7 +6,7 @@ import mergeRefs from 'react-merge-refs'
import useRefAndState from '@theatre/studio/utils/useRefAndState'
import useOnClickOutside from '@theatre/studio/uiComponents/useOnClickOutside'
const Input = styled.input.attrs({type: 'text'})`
const StyledTextarea = styled.textarea.attrs({type: 'text'})`
background: transparent;
border: 1px solid transparent;
color: rgba(0, 146, 255, 1);
@ -59,7 +59,7 @@ const BasicStringInput: React.FC<{
permanentlySetValue: (v: string) => void
className?: string
isValid?: (v: string) => boolean
inputRef?: MutableRefObject<HTMLInputElement | null>
inputRef?: MutableRefObject<HTMLTextAreaElement | null>
/**
* Called when the user hits Enter. One of the *SetValue() callbacks will be called
* before this, so use this for UI purposes such as closing a popover.
@ -73,7 +73,7 @@ const BasicStringInput: React.FC<{
const propsRef = useRef(props)
propsRef.current = props
const inputRef = useRef<HTMLInputElement | null>(null)
const inputRef = useRef<HTMLTextAreaElement | null>(null)
useOnClickOutside(
inputRef.current,
@ -85,7 +85,7 @@ const BasicStringInput: React.FC<{
const callbacks = useMemo(() => {
const inputChange = (e: React.ChangeEvent) => {
const target = e.target as HTMLInputElement
const target = e.target as HTMLTextAreaElement
const {value} = target
const curState = stateRef.current as IState_EditingViaKeyboard
@ -124,7 +124,7 @@ const BasicStringInput: React.FC<{
propsRef.current.discardTemporaryValue()
stateRef.current = {mode: 'noFocus'}
inputRef.current!.blur()
} else if (e.key === 'Enter' || e.key === 'Tab') {
} else if (e.key === 'Tab') {
commitKeyboardInput()
inputRef.current!.blur()
}
@ -186,7 +186,7 @@ const BasicStringInput: React.FC<{
if (props.inputRef) _refs.push(props.inputRef)
const theInput = (
<Input
<StyledTextarea
key="input"
type="text"
className={`${props.className ?? ''} ${!isValid(value) ? 'invalid' : ''}`}