pdsls.dev
1import { type Accessor, createEffect, createSignal, onCleanup } from 'solid-js';
2
3export const createDebouncedValue = <T>(
4 accessor: Accessor<T>,
5 delay: number,
6 equals?: false | ((prev: T, next: T) => boolean),
7): Accessor<T> => {
8 const initial = accessor();
9 const [state, setState] = createSignal(initial, { equals });
10
11 createEffect((prev: T) => {
12 const next = accessor();
13
14 if (prev !== next) {
15 const timeout = setTimeout(() => setState(() => next), delay);
16 onCleanup(() => clearTimeout(timeout));
17 }
18
19 return next;
20 }, initial);
21
22 return state;
23};