# browser-keyboard

Tracks which keys are currently held down, from the document's `keydown` / `keyup` events. Exposes the raw pressed keys plus selectors for codes, modifiers, and per-key checks.

## Live example

▶ Live example: [https://valdres.dev/vue/plugins/browser-keyboard](https://valdres.dev/vue/plugins/browser-keyboard)

Press and hold keys — the on-screen keyboard reflects `pressedCodesSelector` live.

## Install

```bash
bun add @valdres/browser-keyboard
```

## Usage

```ts
import { useValue } from "valdres-vue"
import { pressedCodesSelector } from "@valdres/browser-keyboard"

const codes = useValue(pressedCodesSelector) // Ref<KeyboardCode[]>
```

## Exports

| Export                        | Kind                   | Type             |
| ----------------------------- | ---------------------- | ---------------- |
| `pressedKeysAtom`             | atom (read-only)       | `PressedKey[]`   |
| `pressedCodesSelector`        | selector               | `KeyboardCode[]` |
| `pressedKeyValuesSelector`    | selector               | `string[]`       |
| `modifierSelector`            | selector               | `Modifier[]`     |
| `isCodePressedSelector(code)` | selector family        | `boolean`        |
| `isKeyPressedSelector(key)`   | selector family        | `boolean`        |
| `toggleKeyAtom(key)`          | atom family (settable) | `boolean`        |

## Cross-framework

Global atoms and selectors — works in every framework. For higher-level "press this combination → run this callback" hotkeys (rather than raw key state), use `@valdres/hotkeys`.