audiocn Solid: Audio Components for Solid Apps

audiocn Solid ports audiocn/ui to Solid. Like shadcn, the CLI copies component source into your project, and you edit that copy. The repository has 23 components, 6 blocks, and 18 hooks.

What it includes

• Meters and visualizers: a level meter with peak, RMS, peak hold, and clip detection, plus spectrum, waveform, and bar visualizers.
• Controls: a decibel fader, knobs, a parameter slider, and a volume control.
• Mixing: channel strips and a mixer with shared meter settings and keyboard navigation.
• Playback: an audio player, a track list, and sound pads with hotkeys.
• Blocks: a system audio mixer, a music player, a soundboard, and a microphone setup.

Components receive data

The components never open a microphone. They take levels and values as props. The Web Audio hooks handle capture: useMicrophone opens a MediaStream, useSystemAudio captures tab or system audio through the browser picker, and useAudioAnalyser reads streams, media elements, or audio nodes. You can also feed the components from another audio engine.

Solid 1 and Solid 2

The Solid 1 registry targets Solid 1.9.15 or later and is stable. The Solid 2 registry is experimental and targets a Solid 2 release candidate. The two registries use different JSX transforms, so configure the matching runtime before you add components.

License

The project is MIT licensed, and parts are adapted from audiocn/ui. The docs site plays a Warcraft audio clip that the MIT license does not cover, and the registry items do not install it.

The source repository has the component code, registry build, and tests. The live docs are also available.