Input keeps hidden after selecting option with openMenuOnClick=false

I set openMenuOnClick=false.

1. Select a option
2. Click outside the component
3. Click back inside the component

The cursor dos not show up. The options are filtered when typing but the actual input value is not displayed either.

1. Repeat 2. and 3.

The cursor is shown. The input value is displayed as well.

I found that the isHidden property in the Input field remains true and the Input element is not displayed after selecting the option and clicking out of the component (step 1. to 3.). It is reset to false after step 4 (see console output in the sandbox example).

Please refer to this Codesandbox.

[sullyslegacy]

I agree the opacity isn’t reset this is just a workaround

[haejinjo]

Fixed my issue (might not be the root cause of yours, but hopefully it saves somebody time)

My selected option text wasn’t showing up after fiddling with the closeMenuOnSelect prop as well.

I debugged for hours and tried everything on this thread – to no avail. It turns out inputValue was fine and I was making a silly mistake by omitting the label field in the object I pass into the value prop.

For example my code that hid the selected option value:

<DialogSelect
  ...otherProps
  inputValue={'option title'}
  value= { { value: 'option title' } }
/>

and my code that successfully renders the selected option value:

<DialogSelect
  ...otherProps
  inputValue={'option title'}
  value= { { label: 'option title', value: 'option title' } } // god damn it
/>