Loock
Refined keyboard navigation for websites and components.
Refined keyboard navigation for websites and components.
Introducing Loock
- Organize your web page or web application by navigation areas.
- Never lose the context while navigating the area with the
TAB
key. - Leave the context with the
ESC
key.
Install
NPM
npm install @chialab/loock
yarn add @chialab/loock
CDN
import { focusTrapBehavior } from 'https://unpkg.com/@chialab/loock?module';
Usage
import { focusTrapBehavior } from '@chialab/loock'; const dialog = document.getElementById('.dialog'); const trap = focusTrapBehavior(dialog, { inert: true, }); dialog.addEventListener('open', () => { trap.connect(); });
Development
Build
Install the dependencies and run the build
script:
yarn install
yarn build
This will generate the bundles in the dist
folder, as well as the declaration file.
Test
Run the test
script:
yarn test
License
Loock is released under the MIT license.