Nutritious Polygonal Meatball

    @react-corekit/use-idle

    1.1.0 • Public • Published

    @react-corekit/use-idle

    Detecting when the user becomes inactive (idle) or active.

    NPM JavaScript Style Guide

    Install

    npm install --save @react-corekit/use-idle
    yarn add @react-corekit/use-idle

    Usage

    import React from "react";
     
    import { useIdle } from "@react-corekit/use-idle";
     
    const Example = () => {
      const options = { timeToIdle: 1000 };
      const isIdle = useIdle(options);
      return <div>{isIdle ? "Are you still there?" : "Yes, you are here"}</div>;
    };

    mousemove event is ignored by default, to include it add the following line to the options object:

    const options = { ignoredEventsWhenIdle: [] };

    Advanced options

    Activity detector allows you to configure some parameters:

    • timeToIdle: number of milliseconds of inactivity which makes activity detector transition to 'idle' (30000 by default)
    • activityEvents: the user events which make activity detector transition from 'idle' to 'active'. The default list of activityEvents is ['click', 'mousemove', 'keydown', 'DOMMouseScroll', 'mousewheel', 'mousedown', 'touchstart', 'touchmove', 'focus']
    • inactivityEvents: the list of events which make the activity detector transition from 'active' to 'idle' without waiting for timeToIdle timeout. By default: ['blur']
    • ignoredEventsWhenIdle: list of events to ignore in idle state. By default: ['mousemove']
    • initialState: can be "idle" or "active" ("active" by default)

    Visit: https://react-corekit.github.io/use-idle/ for a minimalistic live demo (Including mousemove event).

    Additional documentation

    Activity Detector Reference

    Standard events Reference

    License

    MIT © glongh

    Install

    npm i @react-corekit/use-idle

    DownloadsWeekly Downloads

    53

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    375 kB

    Total Files

    23

    Last publish

    Collaborators

    • glongh