pnpm dlx shadcn@latest add @audio-ui/use-simulated-levels
import { useSimulatedLevels } from "@/hooks/use-simulated-levels";| Files | hooks/use-simulated-levels.ts |
|---|---|
| Depends on | Nothing |
| npm | Nothing |
| Used by | meter-size-default-demo, needle-meter-demo |
| Export | Kind | What it is |
|---|---|---|
SimulatedFrame | interface | |
useSimulatedLevels | function | Levels that move on their own, in the shape a Meter paints from: a random walk per channel with a peak that holds for a moment and then falls, like a real signal's. |
Usage
Levels that move on their own, in the shape a Meter paints from: a random walk per channel, with a peak that holds and then falls like a real signal's. For a meter shown without sound, such as a preview that does not ask for the microphone; with a signal, use useAudioLevels.
import { useSimulatedLevels } from "@/hooks/use-simulated-levels";
const levels = useSimulatedLevels(2, { max: -6, min: -48 });
<Meter source={levels} />;It is a live source: each frame costs no React render. min and max keep the levels between two values in dB, for a meter with a narrower scale.