svelte-focus-trap

!npm

A svelte directive that will trap focus within an element.
You can navigate child focusable elements with up, down, tab, shift + tab, alt + tab. I have attempted to match the accesibility best practices listed here.

This could be useful if you wanted to trap focus within something like a modal. When you gotta... focus-trap and focus-wrap.

* Does not auto focus the first item.

* When pressing down or tab:
* When the known focusables are not focused, gives focus to the first item.
* If focus is on the last known focusable, it gives focus to the first item.
* Gives focus to the next item.
* When pressing up or shift+tab or alt+tab:
* When the known focusables are not focused, gives focus to the last item.
* If focus is on the first known focuable, it gives focus to the last item.
* Gives focus to the previous item.
* When pressing home:
* Gives focus to the first item.
* When pressing end:
* Gives focus to the last item.
* Attempts to skip hidden items and items with display none of tabindex="-1".

Todos:
- [ ] Demo
- [ ] Tests + Ci

Installation
------------------------------------------------------------------------------

``
npm install --save-dev svelte-focus-trap
`

Usage
------------------------------------------------------------------------------

`html


{#if showing}
use:focusTrap
>