Waveform Player for React

A React component wrapper for @arraypress/waveform-player. Typed props for every option, an imperative ref handle, and SSR-safe dynamic loading.

Documentation · npm

Install

npm install @arraypress/waveform-player-react @arraypress/waveform-player react

Requires @arraypress/waveform-player 1.27.0 or newer. The component loads the core library's /no-autoinit entry point, so that it never scans the page for markup it doesn't own — that subpath was added in 1.27.0. If you're upgrading this package on its own, bump the core alongside it.

Import the core CSS once in your app entry, then render the component:

import '@arraypress/waveform-player/dist/waveform-player.css';
import { WaveformPlayer } from '@arraypress/waveform-player-react';

<WaveformPlayer url="/track.mp3" title="My Song" artist="The Artist" waveformStyle="mirror" />

Documentation

Full props, the imperative API, colours, markers and SSR notes live in the docs.

-> docs.waveformplayer.com

React guide — install, props, the imperative API, and SSR notes. All four React wrappers (player / bar / playlist) are on that page.

License

MIT © ArrayPress