51 lines
1.0 KiB
JavaScript
51 lines
1.0 KiB
JavaScript
import React from 'react';
|
|
|
|
export const SelectWithInput = (props) => {
|
|
const {
|
|
selectName,
|
|
selectId,
|
|
selectValue,
|
|
options,
|
|
inputName,
|
|
inputId,
|
|
inputType,
|
|
inputValue,
|
|
selectOnChange,
|
|
inputOnChange,
|
|
showInput,
|
|
inputOnBlur,
|
|
labelText,
|
|
disabled,
|
|
} = props;
|
|
return (
|
|
<div className="d-flex flex-column pb-3">
|
|
<label htmlFor={selectName}>{labelText}</label>
|
|
<select
|
|
autoFocus
|
|
className="form-control"
|
|
name={selectName}
|
|
id={selectId}
|
|
onChange={selectOnChange}
|
|
value={selectValue}
|
|
disabled={disabled}
|
|
>
|
|
{options}
|
|
</select>
|
|
{showInput &&
|
|
<input
|
|
className="form-control"
|
|
aria-label={`${selectName} description field`}
|
|
type={inputType}
|
|
name={inputName}
|
|
id={inputId}
|
|
onChange={inputOnChange}
|
|
onBlur={inputOnBlur}
|
|
value={inputValue}
|
|
disabled={disabled}
|
|
maxLength={255}
|
|
/>
|
|
}
|
|
</div>
|
|
)
|
|
}
|