crabfit/crabfit-frontend/src/components/SelectField/SelectField.tsx
2021-03-05 05:23:20 +11:00

36 lines
673 B
TypeScript

import {
Wrapper,
StyledLabel,
StyledSubLabel,
StyledSelect,
} from './selectFieldStyle';
const SelectField = ({
label,
subLabel,
id,
options = [],
inline = false,
defaultOption,
register,
...props
}) => (
<Wrapper inline={inline}>
{label && <StyledLabel htmlFor={id} inline={inline}>{label}</StyledLabel>}
{subLabel && <StyledSubLabel htmlFor={id}>{subLabel}</StyledSubLabel>}
<StyledSelect
id={id}
ref={register}
{...props}
>
{defaultOption && <option value="">{defaultOption}</option>}
{options.map((value, i) =>
<option key={i} value={value}>{value}</option>
)}
</StyledSelect>
</Wrapper>
);
export default SelectField;