useKey
A powerful sensor hook for handling keyboard shortcuts, sequences, and modifiers.
Installation
npx sse-tool add use-key
npm install sse-hooks
Usage
import { useKey } from "./{hooks file}";
const { bindings } = useKey(
{
// Simple binding
Escape: () => setModalOpen(false),
// Modifier binding with config
"Ctrl+S": {
action: (e) => saveDocument(),
preventDefault: true,
description: "Save changes",
category: "File",
},
// Sequence binding (Gmail style)
"g i": {
action: () => navigate("/inbox"),
description: "Go to Inbox",
category: "Navigation",
},
},
{
debug: true,
allowInInputs: false,
},
);
import { useKey } from "sse-hooks";
const { bindings } = useKey(
{
// Simple binding
Escape: () => setModalOpen(false),
// Modifier binding with config
"Ctrl+S": {
action: (e) => saveDocument(),
preventDefault: true,
description: "Save changes",
category: "File",
},
// Sequence binding (Gmail style)
"g i": {
action: () => navigate("/inbox"),
description: "Go to Inbox",
category: "Navigation",
},
},
{
debug: true,
allowInInputs: false,
},
);
API
Parameters
| Name | Type | Description |
|---|---|---|
| keyMap | KeyMap | An object defining the key bindings and their actions. |
| options | UseKeyOptions | Global configuration options. |
Return Value
Returns Object.
Metadata about the registered bindings for UI display.
Changelog
1ae55 — feat: add useKey hook for keyboard shortcuts and sequences