Keep textarea focused while clicking on dropdown in react

Question

I have a scenario where I need to make the textarea focused even if I interact with other components like a dropdown. I know we can't have two elements focused simultaneously but I am wondering if this can be done using refs in react.

I have seen sites like JIRA, which do these kind of things. Eg: In the image below, the date input remains in focus even if I interact with the above calendar.

This is my code. I want the Textarea component to be in focus even if we interact with the Dropdown component. How to achieve this in react?

import React from "react";
import "./styles.css";

export default function App() {
  return (
    <div className="App">
      <Textarea />
      <br />
      <Dropdown />
    </div>
  );
}

function Textarea() {
  return <textarea rows="10" cols="40"></textarea>;
}

function Dropdown() {
  return (
    <select>
      <option>Pizza</option>
      <option>Pasta</option>
      <option>Burger</option>
    </select>
  );
}