Skip to content

useKeysPressed ​

all currently pressed keyboard keys and their codes

sensors
test coverage
Last changed: last month

Installation ​

Library
CLI
Manual
typescript
import { useKeysPressed } from '@siberiacancode/reactuse';

Usage ​

typescript
const pressedKeys = useKeysPressed(ref);
// or
const { value, ref } = useKeysPressed();

Demo ​

Api ​

Parameters

NameTypeDefaultNote
targetHookTarget | Window-DOM element or ref to attach keyboard listeners to
options.enabled?UseKeysPressedOptionstrueEnable or disable the event listeners

Returns

Array<{ key: string; code: string }>

Parameters

NameTypeDefaultNote
options?UseKeysPressedOptions-- Optional configuration options

Returns

{ keys: Array<{ key: string; code: string }>; ref: StateRef<Target> }

Type declaration ​

typescript
import type { HookTarget } from '@/utils/helpers';

import type { StateRef } from '../useRefState/useRefState';

export interface UseKeysPressedOptions {
  /** Enable or disable the event listeners */
  enabled?: boolean;
}

export interface UseKeysPressed {
  (
    target: HookTarget | Window,
    options?: UseKeysPressedOptions
  ): Array<{ key: string; code: string }>;

  <Target extends Element>(
    options?: UseKeysPressedOptions
  ): {
    value: Array<{ key: string; code: string }>;
    ref: StateRef<Target>;
  };
}

Source ​

Source • Demo

Contributors ​

D
debabin
debabin
H
hywax
hywax
G
Gorilla Dev
Gorilla Dev

Released under the MIT License.