re-audio)

> Creating audio players in React has never been easier

!re-audio banner

> Make sure to visit the documentation website at https://sina-byn.github.io/re-audio/

- Built with TypeScript for seamless integration in TypeScript projects
- Fully customizable with a headless component architecture
- Developer-friendly with an intuitive API
- Includes custom React hooks for easily creating audio visualizers

Compatibility Notice

Starting from version 2.0.0, this library is built on React 19 and is not compatible with previous versions of React.

If you are using React 18, please install version 1.1.1 of this library:

``

bash

npm install --save @sina_byn/re-audio@1.1.1





Installation

bash

npm i --save @sina_byn/re-audio





Usage

tsx

// * AudioPlayer.tsx



import { Audio, formatTime } from '@sina_byn/re-audio';



// * components

import PlayBackControls from './PlayBackControls';



const AudioPlayer = () => {

  return (

    

  );

};



export default AudioPlayer;

tsx

// * PlayBackControls.tsx



import { useAudio } from '@sina_byn/re-audio';



const PlayBackControls = () => {

  const { playing, togglePlay, prevTrack, nextTrack } = useAudio();



  return (

    <>

      



      



      

    

  );

};



export default PlayBackControls;

re-audio ![NPM version](https://www.npmjs.com/package/@sina_byn/re-audio) ![NPM monthly downloads](https://npmjs.org/package/@sina_byn/re-audio) ![NPM total downloads](https://npmjs.org/package/@sina_byn/re-audio)

Compatibility Notice

bash

npm install --save @sina_byn/re-audio@1.1.1





Installation

bash

npm i --save @sina_byn/re-audio





Usage

tsx

// * AudioPlayer.tsx



import { Audio, formatTime } from '@sina_byn/re-audio';



// * components

import PlayBackControls from './PlayBackControls';



const AudioPlayer = () => {

  return (

    

  );

};



export default AudioPlayer;

tsx

// * PlayBackControls.tsx



import { useAudio } from '@sina_byn/re-audio';



const PlayBackControls = () => {

  const { playing, togglePlay, prevTrack, nextTrack } = useAudio();



  return (

    <>

      



      



      

    

  );

};



export default PlayBackControls;