DropdownField height increases once a value is set

[michaelx]

Bug Report

Prerequisites

• Can you reproduce the problem in a MWE?
• Are you running the latest version?
• Did you check the FAQs to see if that helps you?
• Are you reporting to the correct repository?
• Did you perform a search in the issues?

Versions

0.8.3

Description

The DropdownField increases in height from 54px to 56px once a value is set. This causes inconsistency if you for example position it next to a SearchField.

Steps to Reproduce

Paste the code below in the PreciseUI playground, and then select an item from the dropdown list (it will increase in height):

const { DropdownField, SearchField, styled } = require('precise-ui');

const items = [
  "Apple",
  "Orange",
];

const Container = styled.div`
	display: flex;
    > * { margin-right: .5em; }
`;

class MyDropdown extends React.Component {
  constructor() {
    super();
    this.state = {
      value: '',
    };
    this.change = (e) => {
      const selected = e.value[0];
      const index = items.indexOf(selected);
      const value = items[(index + 1) % items.length];
      this.setState({
        value,
      });
    };
  }

  render() {
    return <DropdownField data={items} value={this.state.value} onChange={this.change} />;
  }
}

<Container>
	<MyDropdown />
	<SearchField label="Search" onSearch={value => console.log(value)} />
</Container>

Expected behavior: No changing height.

Actual behavior: Height increases once a value is set.

Environment details: macOS, Chrome