# useSilenceHover

> The pause under the pointer on a lane, to draw as a zone while it is there: give the lane its pointer handlers and the zoom it is drawn at.

```bash
npx shadcn@latest add @audio-ui/use-silence-hover
```

```ts
import { useSilenceHover } from "@/hooks/use-silence-hover";
```

- Files: `hooks/use-silence-hover.ts`
- Depends on: nothing; npm: nothing
- Used by: `block-audio-editor`

| Export | Kind | What it is |
| --- | --- | --- |
| `Pause` | type | A stretch of time with nothing in it, as `[from, to]` in the timeline's units. |
| `useSilenceHover` | function | The pause the pointer is over on a lane, to draw as a zone while it is there. |

## Usage

Give it the pauses of a sound, as `[from, to]` pairs, and the zoom the lane is drawn at. It returns the pause under the pointer and the two handlers that find it.

```tsx
import { useSilenceHover } from "@/hooks/use-silence-hover";

const silence = useSilenceHover({ pauses, zoom });

<TimelineLane
  onPointerLeave={silence.onPointerLeave}
  onPointerMove={silence.onPointerMove}
>
  {silence.pause ? <SilenceZone pause={silence.pause} /> : null}
</TimelineLane>;
```

Nothing is under the pointer while a button is held, as in a drag, so a selection is not drawn over by a zone. The pauses come from [`detectSilences`](/docs/engine/analysis#detectsilences).
