npm.io
0.1.1 • Published 6d ago

@ailuracode/alpine-attention

Licence
MIT
Version
0.1.1
Deps
0
Size
35 kB
Vulns
0
Weekly
0

@ailuracode/alpine-attention

Screen Wake Lock and Idle Detection magics for Alpine.js.

Full documentation →

Install

npm install @ailuracode/alpine-attention alpinejs

Quick example

import Alpine from "alpinejs";
import attention from "@ailuracode/alpine-attention";

Alpine.plugin(attention);
Alpine.start();
<button @click="$wakelock.request()" x-bind:disabled="$wakelock.isActive">
  Keep screen awake
</button>

<button @click="$idle.start()" x-bind:disabled="$idle.isWatching">
  Detect idle
</button>
<p x-show="$idle.isWatching">
  User: <span x-text="$idle.userState"></span>
</p>

API summary

Magics $wakelock, $idle
Wake lock isSupported, isActive, isRequesting, request(), release()
Idle isSupported, isWatching, userState, screenState, requestPermission(), start(), stop()

License

MIT

Keywords