@Oliego/Wavr-Pro

A full-featured browser DAW built on React and the Web Audio API. Drop it into any React app — no backend, no external dependencies, no install beyond the package itself.

SPONSOR: → Oliego.Space - Create without limits!

Install

npm install @oliego/wavr-pro

React 18+ is the only peer dependency.

Usage

import WavrPro from '@oliego/wavr-pro';

export default function App() {
  return <WavrPro />;
}

That's it. WavrPro is a fully self-contained React component. It manages its own state, audio context, IndexedDB sessions, and plugin registry.

Optional: ember theme

import '@oliego/wavr-pro/theme'; // warm charcoal + ember orange colour scheme
import WavrPro from '@oliego/wavr-pro';

What's included

| Feature | Details | | -------------------- | ------------------------------------------------------------------- | | Multi-track timeline | Unlimited tracks · drag-and-drop clips · resize · context menu | | 6-band EQ per track | SUB · BASS · LO-MID · MID · HI-MID · AIR — live BiquadFilter nodes | | 5 visualizer modes | Waveform · spectrum · spectrogram · oscilloscope · VU meter | | Session persistence | IndexedDB named saves · autosave every 60s · 40-step undo/redo | | WAV export | Offline render · 44.1kHz 16-bit stereo · full EQ applied | | Plugin system | VST-style — register any WavrPlugin class with one line | | Templates | 6 synthesized starters: lo-fi, techno, ambient, pop, podcast, blank | | Transport | Pause in place · drag playhead to seek · ruler click | | Mic recording | Arm a track and record from microphone |

Plugins

Extend WavrPro with the wavr-drum-machine and wavr-midi-controller packages, or build your own with the WAVR Plugin SDK.

npm install @oliego/wavr-drum-machine @oliego/wavr-midi-controller

import WavrPro             from '@oliego/wavr-pro';
import { usePluginManager } from '@oliego/wavr-pro/plugin-sdk';
import PluginShell          from '@oliego/wavr-pro/plugin-sdk/shell';
import DrumMachine          from '@oliego/wavr-drum-machine';
import MidiController       from '@oliego/wavr-midi-controller';

// Inside your component — register plugins once
const pluginManager = usePluginManager({ /* DAW refs */ });

useEffect(() => {
  pluginManager.register(DrumMachine);
  pluginManager.register(MidiController);
}, []);

Screenshots

Browser support

Chrome 90+, Firefox 88+, Safari 15+, Edge 90+. Requires Web Audio API and IndexedDB (all modern browsers).

Note: Audio requires a user gesture to start — browser autoplay policy applies.

Known limitations

• No native VST/AU plugins (Web Audio only)
• No MIDI input without wavr-midi-controller
• Audio pauses when the tab loses focus (browser AudioContext throttling)
• Sessions are local to the browser profile — use .wavrproj export to share

Licence

AGPL 3.0