React-Bootstrap Modal Focus Trapping with Third-Party Portal Content
0 reputation · 03 Mar 2025, 04:08 UTC
React-Bootstrap Modal Focus Trapping with Third-Party Portal Content
The goal is to maintain keyboard focus inside a Modal when the modal’s content includes focusable elements that are rendered via a third‑party portal (e.g., a tooltip library or a dropdown that appends its own DOM node outside the modal’s subtree).
It is unclear whether the built‑in focus‑trapping mechanism automatically encompasses such portal‑rendered nodes, or if additional configuration is required to extend the trap boundary. This uncertainty depends on the version of react‑bootstrap and the way the third‑party library manages focus.
Does react‑bootstrap expose a prop or API to customize the focus‑trap container? How can developers verify that focus remains trapped when portal‑based children are present? Are there documented workarounds or configuration options to ensure accessibility compliance in this scenario?