A click inside a modal portal triggers an onClick handler on a React ancestor outside the portal's DOM container. Why?

Direct answer

Events from a portal propagate according to the React tree, so a React ancestor can receive the event even when the portal's DOM node is physically elsewhere.

App.jsx

function App() {
  return (
    <div onClick={() => console.log("App clicked")}>
      <Modal>
        <button>Save</button>
      </Modal>
    </div>
  );
}

The button may be rendered under document.body in the DOM, but it is still a child of App in the React tree.