Loock

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

$3

``
npm install @chialab/loock
`

`
yarn add @chialab/loock
`

$3

`ts
import { focusTrapBehavior } from 'https://unpkg.com/@chialab/loock?module';
`

Usage

`ts
import { focusTrapBehavior } from '@chialab/loock';

const dialog = document.getElementById('.dialog');
const trap = focusTrapBehavior(dialog, {
inert: true,
});

dialog.addEventListener('open', () => {
trap.connect();
});
`

---

Development

![Build status](https://github.com/chialab/loock/actions?query=workflow%3AMain)

$3

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.

$3

Run the test script:

`
yarn test
``

---

License

Loock is released under the MIT license.