FormSelect

This form select component is a primitive component. It only renders a single styled html select element without handling the rendering of options.

It can be used to create a fully featured form select field that contains a select element, options and other important things a form field needs like a label and error message.

<FormSelect>
  <option>Something</option>
  <option>Something</option>
</FormSelect>

Error state

<Spacings.Stack>
  <FormSelect invalid>
    <option>Something</option>
    <option>Something</option>
  </FormSelect>
</Spacings.Stack>

Custom Styling

In case you need to adapt the looks of this component you can either just pass a class name of use styled components extension like so:

const CustomFormSelect = styled(FormSelect)`
  border-top: 0;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
`

Props