audiocn

useWaveformData

Decode an audio file and reduce it to cached waveform peaks.

$ pnpm dlx shadcn@latest add @audiocn/use-waveform-data

Usage

const { peaks, duration, status } = useWaveformData("/episode.mp3", {
  samples: 800,
});

<Waveform loading={status === "loading"} peaks={peaks} duration={duration} />;

Peaks are the loudest sample in each slice, normalised so the loudest slice is

  1. Results are cached per file and sample count. src can also be an AudioBuffer.

Options

Prop

Type

Returns

Prop

Type

computePeaks(buffer, samples) is exported for use outside React.

useSound

Low-latency playback of short sounds decoded into memory.

Blocks

Complete, working assemblies you install once and then make your own.

On this page

UsageOptionsReturns