How to release the focus programmatically ?

[iroy2000]

I'm having a component ( pseudo code )

<ComponentA>
   <ReactAutosuggest
      // ... some props
   />
  <Modal>
     <textarea></textarea>
  </Modal>
</ComponentA>

The problem I have is when the ReactAutosuggest is focus, I open the Modal, even though I programmatically do focus() on the textarea, the textarea is not focused.

Seems like to me the autosuggest is capturing the focus, how to programmatically release the focus ?

Thanks

[eef]

Have you tried creating a Ref to the textarea and, depending on how you open the modal, set the focus on the textarea Ref? How are you setting the focus currently?

constructor(props) {
  super(props);
  this.textareaInput = React.createRef();
}
function openModal () {
  // Code to open modal
  this.textareaInput.current.focus();
}
<ComponentA>
   <ReactAutosuggest
      // ... some props
   />
  <Modal>
     <textarea ref={this.textareaInput}></textarea>
  </Modal>
</ComponentA>

The above is pseudo code also but you would want to set the focus of the ref when you are opening the modal. If you are using functional components then set the refs at the appropriate point.

[aberezkin]

I need more concrete code examples to answer this question. How do you focus your textarea?

[aberezkin]

Closing as stale