sebnitu / vrembem / 262 / 1

100%

main: 100%

push

travis-ci

Add modal focus trap feature (#279)

This PR improve the modal component by introducing a focus trap feature. This ensures that while a modal is open, it's not possible to access the rest of the page using tab focus. In addition to this, a new enable and disable state management has been along with a main selector option which will make primary content areas within a page inaccessible while a modal is active. Lastly, to better improve the management of modals, a new move modal option and api was added to move all modals in a document to a specific location. This prevents a modal from inheriting the inaccessible state if it's originally within the main content area. The new modal behavior pattern is as follows:

1. When a modal is opened, focus is moved to the dialog or an element inside.
2. Modals provide standard methods for the user to close such as using the `esc` key or clicking outside the dialog.
3. While the modal is active, contents obscured by the modal are inaccessible to all users.
4. When a modal is closed, focus is returned to the initial trigger element that activated the dialog.

248 of 248 branches covered (100.0%)

Branch coverage included in aggregate %.

515 of 515 relevant lines covered (100.0%)

32.36 hits per line