Closed christopher-francisco closed 1 year ago
focus-lock
all variants are validFocusOn
marks everything except "focused" content as aria-hidden
, effectively hiding the dialog if it is outside the LockLong story short - I would recommend the first variant. Here is an example passing all requirements for "good modal dialog" - https://codesandbox.io/s/good-react-example-modal-dialog-forked-k4imc?file=/src/App.js
Thank you so much @theKashey. Would you recommend going for focus-on library instead for a Modal component? Or perhaps it depends, in which case, any resources you could recommend I read in order to make the call?
FocusLock
/FocusOn
are behavior-only components, even if they leave some DOM-nodes behind.
You are more than welcome to put something, like dialog
inside, and abstract the end combination as a Modal.
This issue has been marked as "stale" because there has been no activity for 2 months. If you have any new information or would like to continue the discussion, please feel free to do so. If this issue got buried among other tasks, maybe this message will reignite the conversation. Otherwise, this issue will be closed in 7 days. Thank you for your contributions so far.
I'm trying to sort out whether the author intetion is for the component to be used like this:
or the other way around
Or maybe in a completely different way:
The reason I'm bringing this up is because of the extra HTML elements that get added to the DOM around the main one. Not sure if those should be wrabbed by the
[role=dialog]
element or whether it even matters.I'm more than happy to submit a PR to add the intended usage example to the docs. Just need come clarification. Thanks in advance!