Dropdown Component in flex div can exceed the width of the plugin window

[aashreys]

Encountering another Dropdown component related issue as shown in the video below.

dropdown.issue.mov

Seems like the dropdown doesn't truncate text when it reaches the edge of the window. Here's the relevant HTML layout snippet:

    <div style='display: flex; width: 100%'>

          <Dropdown
          icon={this.getIcon(this.getUiValueFromConfig(navigation.device))}
          onChange={e => this.onDeviceChange(e.currentTarget.value)} 
          options={DEVICES} 
          value={this.getUiValueFromConfig(navigation.device)}
          noBorder />

          <Dropdown
          style={'flex-grow: 1'}
          icon={this.getIcon(this.getUiValueFromConfig(navigation.scheme))}
          onChange={e => this.onSchemeChange(e.currentTarget.value)} 
          options={navigation.device === Device.KEYBOARD ? KEYBOARD_OPTIONS : CONTROLLER_OPTIONS} 
          value={this.getUiValueFromConfig(navigation.scheme)}
          noBorder />

    </div>

Thanks so much for your help on the previous issues btw :)

[yuanqing]

Should be fixed in next. Can you verify locally @aashreys?

[yuanqing]

This will be fixed in 2.0.0