Modern Caps Lock provides an easy way to check whether Caps Lock is active, and it allows you to run your code whenever the Caps Lock state changes.
Example installation with npm:
npm install @leonabcd123/modern-caps-lock
Runs the provided callback function whenever the Caps Lock state changes.
callback: (capsState: boolean) => void: a function that takes one argument (capsState) and returns nothing. This function is executed after every Caps Lock state change.
void.
Returns the current Caps Lock state.
None.
capsState: boolean: a boolean indicating whether Caps Lock is on. If true, Caps Lock is on; if false, Caps Lock is off.
import { onCapsLockChange } from "@leonabcd123/modern-caps-lock";
onCapsLockChange((capsState) => {
console.log(`Caps Lock is ${capsState ? "on" : "off"}`);
});import { isCapsLockOn } from "@leonabcd123/modern-caps-lock";
if (isCapsLockOn()) {
console.log("Caps Lock is on!");
} else {
console.log("Caps Lock is off!");
}- Windows
- Mac
- Linux
- iPad
- Platforms using GBoard
- Platforms using Samsung keyboard
Because of browser limitations, we can only detect the Caps Lock state after a KeyboardEvent or MouseEvent occurs. We currently detect updates to the Caps Lock state when the following events are fired:
- keydown
- keyup
- mousedown
- mousemove
- wheel
Until one of these events is fired, the Caps Lock state defaults to false.