audiocn

useLevel

Read a meter source into React state at a low rate, for labels and conditional UI.

Meters paint every frame without React. When you need the level in React, for a label or to show a warning, useLevel samples the source a few times a second.

$ pnpm dlx shadcn@latest add @audiocn/use-level

Usage

const { peakDb, zone } = useLevel(analyser.meter);

return zone === "clip" ? <p>Turn your microphone down.</p> : null;

Options

Prop

Type

Returns

Prop

Type

useFrameSource

Subscribe a callback to a frame source, with a stable callback and automatic cleanup.

useClipHold

Clip detection with a hold time, a clip count and a reset.

On this page

UsageOptionsReturns