Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | 1x 1x 1x 1x 188x 8x 8x 8x 8x 184x 14x 1x | import React from 'react';
import MuiAutocomplete from '@mui/material/Autocomplete';
import TextField from '@mui/material/TextField';
import { DropdownItem, SelectInputProps } from './types';
const SelectInput: React.FunctionComponent<SelectInputProps> = ({
label,
value,
options,
onChange,
freeSolo,
customListItemRender,
renderInput,
...props
}: SelectInputProps) => {
const optionsMap = Object.fromEntries(options.map((option) => [option.value, option]));
let normalizedValue = value;
if (!freeSolo && typeof value === 'string' && value in optionsMap) {
normalizedValue = optionsMap[value];
}
return (
<>
<MuiAutocomplete<DropdownItem, false, boolean, boolean>
{...props}
id={`${label}-selectinput`}
renderOption={(props, options, state) => (
<li {...props}>{customListItemRender ? customListItemRender(options, options.label, state.selected) : options.label}</li>
)}
componentsProps={{
...props.componentsProps,
popupIndicator: {
...props.componentsProps?.popupIndicator,
size: 'small',
},
}}
options={options}
onChange={(_, value, reason) => {
Iif ((value && !(typeof value === 'string')) || freeSolo) {
onChange && onChange(value || '');
}
}}
value={normalizedValue}
renderInput={
renderInput || ((params) => <TextField {...params} variant="outlined" size="small" margin="dense" />)
}
/>
</>
);
};
export { SelectInput };
|