Update node input component
This commit is contained in:
parent
1544f61407
commit
951fda75c8
|
|
@ -1,6 +1,6 @@
|
||||||
import { useState, useEffect, useRef } from 'react'
|
import { useState, useEffect, useRef } from 'react'
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import { FormControl, OutlinedInput, Popover } from '@mui/material'
|
import { FormControl, OutlinedInput, InputBase, Popover } from '@mui/material'
|
||||||
import SelectVariable from 'ui-component/json/SelectVariable'
|
import SelectVariable from 'ui-component/json/SelectVariable'
|
||||||
import { getAvailableNodesForVariable } from 'utils/genericHelper'
|
import { getAvailableNodesForVariable } from 'utils/genericHelper'
|
||||||
|
|
||||||
|
|
@ -50,29 +50,61 @@ export const Input = ({ inputParam, value, nodes, edges, nodeId, onChange, disab
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<FormControl sx={{ mt: 1, width: '100%' }} size='small'>
|
{inputParam.name === 'note' ? (
|
||||||
<OutlinedInput
|
<FormControl sx={{ width: '100%', height: 'auto' }} size='small'>
|
||||||
id={inputParam.name}
|
<InputBase
|
||||||
size='small'
|
id={inputParam.name}
|
||||||
disabled={disabled}
|
size='small'
|
||||||
type={getInputType(inputParam.type)}
|
disabled={disabled}
|
||||||
placeholder={inputParam.placeholder}
|
type={getInputType(inputParam.type)}
|
||||||
multiline={!!inputParam.rows}
|
placeholder={inputParam.placeholder}
|
||||||
rows={inputParam.rows ?? 1}
|
multiline={!!inputParam.rows}
|
||||||
value={myValue}
|
minRows={inputParam.rows ?? 1}
|
||||||
name={inputParam.name}
|
value={myValue}
|
||||||
onChange={(e) => {
|
name={inputParam.name}
|
||||||
setMyValue(e.target.value)
|
onChange={(e) => {
|
||||||
onChange(e.target.value)
|
setMyValue(e.target.value)
|
||||||
}}
|
onChange(e.target.value)
|
||||||
inputProps={{
|
}}
|
||||||
step: inputParam.step ?? 1,
|
inputProps={{
|
||||||
style: {
|
step: inputParam.step ?? 1,
|
||||||
height: inputParam.rows ? '90px' : 'inherit'
|
style: {
|
||||||
}
|
border: 'none',
|
||||||
}}
|
background: 'none'
|
||||||
/>
|
}
|
||||||
</FormControl>
|
}}
|
||||||
|
sx={{
|
||||||
|
border: 'none',
|
||||||
|
background: 'none',
|
||||||
|
padding: '10px 14px'
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
) : (
|
||||||
|
<FormControl sx={{ mt: 1, width: '100%' }} size='small'>
|
||||||
|
<OutlinedInput
|
||||||
|
id={inputParam.name}
|
||||||
|
size='small'
|
||||||
|
disabled={disabled}
|
||||||
|
type={getInputType(inputParam.type)}
|
||||||
|
placeholder={inputParam.placeholder}
|
||||||
|
multiline={!!inputParam.rows}
|
||||||
|
rows={inputParam.rows ?? 1}
|
||||||
|
value={myValue}
|
||||||
|
name={inputParam.name}
|
||||||
|
onChange={(e) => {
|
||||||
|
setMyValue(e.target.value)
|
||||||
|
onChange(e.target.value)
|
||||||
|
}}
|
||||||
|
inputProps={{
|
||||||
|
step: inputParam.step ?? 1,
|
||||||
|
style: {
|
||||||
|
height: inputParam.rows ? '90px' : 'inherit'
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
)}
|
||||||
<div ref={ref}></div>
|
<div ref={ref}></div>
|
||||||
{inputParam?.acceptVariable && (
|
{inputParam?.acceptVariable && (
|
||||||
<Popover
|
<Popover
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue