1---
2category: Sensors
3---
4 
5# useIdle
6 
7Tracks whether the user is being inactive.
8 
9## Usage
10 
11```ts
12import { useIdle } from '@vueuse/core'
13 
14const { idle, lastActive } = useIdle(5 * 60 * 1000) // 5 min
15 
16console.log(idle.value) // true or false
17```
18 
19Programatically resetting:
20 
21```ts
22import { useCounter, useIdle } from '@vueuse/core'
23import { watch } from 'vue'
24 
25const { inc, count } = useCounter()
26 
27const { idle, lastActive, reset } = useIdle(5 * 60 * 1000) // 5 min
28 
29watch(idle, (idleValue) => {
30  if (idleValue) {
31    inc()
32    console.log(`Triggered ${count.value} times`)
33    reset() // restarts the idle timer. Does not change lastActive value
34  }
35})
36```
37 
38## Component Usage
39 
40```vue
41<template>
42  <UseIdle v-slot="{ idle }" :timeout="5 * 60 * 1000">
43    Is Idle: {{ idle }}
44  </UseIdle>
45</template>
46```
47 
48## Type Declarations
49 
50```ts
51export interface UseIdleOptions
52  extends ConfigurableWindow, ConfigurableEventFilter {
53  /**
54   * Event names that listen to for detected user activity
55   *
56   * @default ['mousemove', 'mousedown', 'resize', 'keydown', 'touchstart', 'wheel']
57   */
58  events?: WindowEventName[]
59  /**
60   * Listen for document visibility change
61   *
62   * @default true
63   */
64  listenForVisibilityChange?: boolean
65  /**
66   * Initial state of the ref idle
67   *
68   * @default false
69   */
70  initialState?: boolean
71}
72export interface UseIdleReturn extends Stoppable {
73  idle: ShallowRef<boolean>
74  lastActive: ShallowRef<number>
75  reset: () => void
76}
77/**
78 * Tracks whether the user is being inactive.
79 *
80 * @see https://vueuse.org/useIdle
81 * @param timeout default to 1 minute
82 * @param options IdleOptions
83 */
84export declare function useIdle(
85  timeout?: number,
86  options?: UseIdleOptions,
87): UseIdleReturn
88```
89