Hello, I'm working on project which has dialogs fired from inside the bottom sheet, but it's not something that I can use sibling for as it's rendered based on context in totally different place of the app.
I'm relying on blocking prop - I thought I could set it dynamically based on dialog being opened or not, so dialog would have its own focus trap, and after it's closed, blocking in set back to true and focus trap is back to bottom sheet. Unfortunately, focus trap works only initially, after blocking is set to false, and then back to true focus trap is lost. I prepared code sandbox which shows the issue:
Hello, I'm working on project which has dialogs fired from inside the bottom sheet, but it's not something that I can use
siblingfor as it's rendered based on context in totally different place of the app.I'm relying on
blockingprop - I thought I could set it dynamically based on dialog being opened or not, so dialog would have its own focus trap, and after it's closed,blockingin set back totrueand focus trap is back to bottom sheet. Unfortunately, focus trap works only initially, afterblockingis set tofalse, and then back totruefocus trap is lost. I prepared code sandbox which shows the issue:https://codesandbox.io/s/late-firefly-fvyfgu?file=/src/App.js