A solution to https://github.com/transcriptic/react-map-interaction/issues/40

[ImanYZ]

I first wanted to appreciate developing such a great module.

To solve the issue explained here, I defined a new props for the component to check if the user is hovering on an input or textarea. To do this, one can easily create a textIsHovered state in their parent component and use a piece of code like the following one to inform MapInteraction not to disable dragging and focusing on input and textareas:

<ParentComponent
  onMouseOver={(event) => {
    if (
      event.target.tagName.toLowerCase() === "input" ||
      event.target.tagName.toLowerCase() === "textarea" ||
      event.target.className.includes("EditableTextarea")
    ) {
      setTextIsHovered(true);
    } else {
      setTextIsHovered(false);
    }
  }}
>
  <MapInteraction textIsHovered={textIsHovered}>
</ParentComponent>

In my own project, this is working very well. Let me know if you have any questions or concerns.