/reactuse

usePointerLock

Provides reactive pointer lock controls.

Usage

import { usePointerLock } from "@siberiacancode/reactuse";

const pointerLock = usePointerLock();

Example

import { usePointerLock } from "@siberiacancode/reactuse";

export const Canvas = () => {
  const pointer = usePointerLock();
  return <div onClick={pointer.lock}>Click to lock</div>;
};

Notes

• Hook uses the pointerLockElement API.

Type Declarations

import type { MouseEvent } from "react";

interface UsePointerLockReturn {
  element?: Element;
  supported: boolean;
  lock: (event: MouseEvent) => void;
  unlock: () => boolean;
}
export declare const usePointerLock: () => UsePointerLockReturn;