I need to know when I click on a react-select component. So I thought by giving it an id and then handle it with window.addEventListener. Based on their official guide, it seems that I have simply to pass id as its prop but it doesn't work.

I have this code:

<Select
  defaultValue={defaultValue}
  options={options}
  styles={selectStyle()}
  onFocus={onFocus}
  onChange={onChange}
  placeholder={placeholder}
  value={value}
  inputProps={{ id: labelId }}
  id="123"
/>

Then I found this answer here, but id doesn't work.

So I tried passing idName and inputProps={{ id: 'fieldId' }} but nothing happens. I check the select id by inspecting with chrome tools and by logging it. It simply doesn't have one. Is there a way to pass an id to the component or another way to check whether I click on the select or outside?