Select
A styled e-mail input ready to be used containing all input attributes. It is responsible and has validations by default.
Props:
options
Description: An array of {value: string, label: string}. Type: OptionsProps[]. Required.
selectPlaceholder
Description: A placeholder for disabled default option. Type: String. Required.
inputStyle
Description: Input style. Type: CSS Properties.
inputClassName
Description: Input className. Type: String.
optionsStyle
Description: Options style. Type: CSS Properties.
optionsClassName
Description: Options className. Type: String.
Code
const [selected, setSelected] = useState('') const handleChangeSelection = (e: ChangeEvent<HTMLSelectElement>) => { setSelected(e.target.value) } <SelectComponent name='foods' options={options} onChange={handleChangeSelection} value={selected} selectPlaceholder='Select an option' />