idleTimeout

A zero dependency, ~3KB library to make idle state detection in the browser an ease. With it's simple but yet powerful API it features everything you will ever need.

Installation

Using npm

npm install idle-timeout

Using pnpm

pnpm add idle-timeout

Using yarn

yarn add idle-timeout

Using CDN

<script src="https://unpkg.com/idle-timeout/dist/idle-timeout.min.umd.js"></script>

Usage

idleTimeout is totally easy to use. All you need to do is:

import idleTimeout from 'idle-timeout';

idleTimeout(() => {
  console.log('Idle state detected.');
});

Documentation

The idleTimeout constructor takes two arguments:

• callback [Function] - The callback function (receives element and timeout as arguments)
  • element [Element] - The element that was listened for the timeout
  • timeout [Number] - The current timeout value in milliseconds
• options [Object] - An optional options object
  • element [Element] - The element to listen for the timeout
  • timeout [Number] - The idle timeout (in milliseconds)
  • loop [Boolean] - Whether the timeout should be looped when idle

const instance = idleTimeout(
  (element, timeout) => {
    console.log(`Idle state detected on ${element} after ${timeout} ms`);
  },
  {
    element: document,
    timeout: 1000 * 60 * 5,
    loop: false
  }
);

Methods

pause() - Pauses the timeout

instance.pause();

resume() - Resumes an paused timeout

instance.resume();

reset() - Reset the timeout

instance.reset();

destroy() - Destroy the instance

instance.destroy();

Getters

idle [Boolean] - Whether the current state is idle

instance.idle; // false

Setters

timeout = value [Number] - Set the timeout (in milliseconds)

instance.timeout = 1000 * 60;

loop = value [Boolean] - Set whether the timeout should be looped

instance.loop = true;

idle = value [Boolean] - Set the idle state

instance.idle = true;

License

This project is licensed under the terms of the MIT License.