Skip to main content

IsIdle

사용자가 유휴 상태인지와 마지막 활동 시간을 추적합니다.

IsIdle은 사용자 활동을 추적하고 구성 가능한 타임아웃을 기반으로 유휴 상태인지 판단합니다. 마우스 움직임, 키보드 입력 및 터치 이벤트를 모니터링하여 사용자 상호작용을 감지합니다.

데모

Idle: false

Last active: 0s ago

By default, the time of inactivity before marking the user as idle is 1 minute.

In this demo, it's 1 second.

사용법

		<script lang="ts">
	import { AnimationFrames, IsIdle } from "runed";
 
	const idle = new IsIdle({ timeout: 1000 });
</script>
 
<p>Idle: {idle.current}</p>
<p>
	Last active: {new Date(idle.lastActive).toLocaleTimeString()}
</p>
	

타입 정의

		interface IsIdleOptions {
	/**
	 * The events that should set the idle state to `true`
	 *
	 * @default ['mousemove', 'mousedown', 'resize', 'keydown', 'touchstart', 'wheel']
	 */
	events?: MaybeGetter<(keyof WindowEventMap)[]>;
	/**
	 * The timeout in milliseconds before the idle state is set to `true`. Defaults to 60 seconds.
	 *
	 * @default 60000
	 */
	timeout?: MaybeGetter<number>;
	/**
	 * Detect document visibility changes
	 *
	 * @default false
	 */
	detectVisibilityChanges?: MaybeGetter<boolean>;
	/**
	 * The initial state of the idle property
	 *
	 * @default false
	 */
	initialState?: boolean;
}
 
class IsIdle {
	constructor(options?: IsIdleOptions);
	readonly current: boolean;
	readonly lastActive: number;
}
	

Contributors