How to send a

in our chat component, many people don't know they can find the emojis menu by right clicking on the text area and choosing Emojis from the menu. I'd like to Put a button in the UI that would open the emoji menu directly. This way people who don't know about right click and the Context Menu can just click the emoji button and get the built in emojis.

I tried adding a button next to the text input (so not a child of the TextInput) and sending the contextmenu like this:

const showCtxMenu = () => {    var element = document.getElementById("chatti");    var ev2 = new MouseEvent("contextmenu", {      bubbles: true,      cancelable: false,      view: window,      button: 2,      buttons: 0,      clientX: element.getBoundingClientRect().x,      clientY: element.getBoundingClientRect().y    });    element.dispatchEvent(ev2);  }

and the TextInput object is like this in the same functional component:

return (<View      style={[        style.inputView,        {borderColor: primaryColor, height: 40}      ]}><div id="chatti"><TextInput        value={message}        // onContentSizeChange={(event) => {        // causes infinite react state update on ctrl+A -> delete        // setHeight(event.nativeEvent.contentSize.height);        // }}        onChangeText={(text) => onChangeMessage(text)}        style={{

When the button clicks, I'm sending the event but to the parent div, so nothing happens.I don't know how to send the event directly to the TextInput because I don't know how to find it.