Installation

waves-cn components are not a package — you copy the source into your project and own it.

Prerequisites

Install the shadcn/ui primitives

Each component requires specific shadcn primitives. Check the component page for the exact list.

npx shadcn@latest add button slider skeleton

Add the component

npx jsrepo add @waves-cn/ui/wave-player

wave-cn (core), wavesurfer.js and lucide-react are installed automatically.

Install the dependencies

npm install wavesurfer.js lucide-react

Install the shadcn/ui primitives

npx shadcn@latest add button slider skeleton

Copy wave-cn.tsx into your project

Every component depends on wave-cn. Copy it into src/lib/wave-cn.tsx.

Copy the component file

Copy the component source from its doc page into src/components/ui/.

Update the import paths

Adjust any @/ aliases to match your project structure.

Component	Required primitives
`wave-player`	`card button slider skeleton`
`wave-recorder`	`button skeleton`
`wave-speed`	`button slider switch label skeleton`
`wave-zoom`	`button slider skeleton`
`wave-video`	`button skeleton`
`wave-timeline`	`button slider card skeleton`