Easily integrate Screen Wake Lock API in your app
- Zero-dependencies
- Tiny size (less than 1Kb)
- Typescript support
- Auto reacquiring a wake lock out of the box
- 100% test coverage
npm install react-use-wake-lock --save
or
yarn add react-use-wake-lock
import useWakeLock from "react-use-wake-lock";
function MinimalExampleComponent() {
const { isSupported, isLocked, request, release } = useWakeLock();
return (
<div>
<h3>Screen Wake Lock API supported: {isSupported ? "Yes" : "No"}</h3>
<h3>Locked: {`${isLocked ? "Yes" : "No"}`}</h3>
<button type="button" onClick={() => (isLocked ? release() : request())}>
{isLocked ? "Release" : "Request"}
</button>
</div>
);
}
-
onError(error: Error, errorType: "request" | "release")
- callback called in case of any error during acuqiring lock or releasing it -
onLock(lock: WakeLockSentinel)
- callback for successful acquiring of a lock -
onRelease(lock: WakeLockSentinel)
- callback called on releasing the lock
-
isSupported: boolean
- is Screen Wake Lock API supported by a browser -
isLocked: boolean
- current state of a lock -
request: () => void
- request a lock -
release: () => void
- release the lock