# useInterval

> Runs a callback on a fixed interval; pause by passing null.

- Category: Effects
- Package: `hookli` (install with `npm i hookli`)
- Docs: https://hookli.vercel.app/docs/use-interval

## Signature

```ts
useInterval(callback: () => void, delay: number | null): void
```

## Parameters

- `callback`: `() => void` — Runs on every tick. Always fires the latest callback — the hook keeps a ref, so you never re-arm the timer just to close over fresh state.
- `delay`: `number | null` — Milliseconds between ticks. Pass null to pause — the interval is cleared, so nothing runs until you set a number again.

## Usage

```tsx
import { useState } from "react";
import { useInterval } from "hookli";

export function Demo() {
  const [count, setCount] = useState(0);
  const [running, setRunning] = useState(true);

  useInterval(() => setCount((prev) => prev + 1), running ? 1000 : null);

  return (
    <div>
      <p>{count}</p>
      <button onClick={() => setRunning((prev) => !prev)}>
        {running ? "Pause" : "Resume"}
      </button>
    </div>
  );
}
```

## Source

`src/hooks/use-interval/use-interval.ts`

```ts
import { useEffect, useRef } from "react";

export const useInterval = (callback: () => void, delay: number | null) => {
  const savedCallback = useRef(callback);

  useEffect(() => {
    savedCallback.current = callback;
  }, [callback]);

  useEffect(() => {
    if (delay === null) return;
    const id = setInterval(() => savedCallback.current(), delay);
    return () => clearInterval(id);
  }, [delay]);
};
```