React Audio

An audio utility and component library for React.

Peer Dependencies:

npm i @clxrity/react-audio

pnpm add @clxrity/react-audio

yarn add @clxrity/react-audio

---

Usage

"use client"; // Must be used in client components
import { Player } from "@clxrity/react-audio"; // Import the component
import "@clxrity/react-audio/index.css"; // Import CSS

export default function Page() {
  // Create a ref for the audio element (optional)
  const audioRef = useRef<HTMLAudioElement>(null);

  return (
    <Player
      // Audio source (REQUIRED)
      src="https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3"
      audioRef={audioRef} // Pass the ref to the component (optional)
      color="#ff0000" // Color of the player (optional)
      /**
       * Other props (optional):
       */
      autoplay={false} // Autoplay the audio (default: false)
      loop={false} // Loop the audio (default: false)
      showProgress={true} // Show the progress bar (default: true)
      showVolume={true} // Show the volume control (default: true)
    />
  );
}

---