Tunio Player

Tunio Audio Player Component for React applications.

Installation

npm install tunio-player
# or
yarn add tunio-player
# or
pnpm add tunio-player

Usage

Import the component and styles

import { TunioPlayer } from 'tunio-player'

function App() {
  return (
    <div>
      <TunioPlayer 
        id="your-radio-id" 
        theme="dark" 
        online
      />
    </div>
  )
}

Props

• id (string): Radio station id
• theme ("dark" | "light"): Player theme (default: "dark")
• ambient (boolean): Enable ambient background effect (default: false)
• opacity (number): Player opacity (default: 1)
• online (boolean): online mode by default
• buttonOnly (boolean): Render only the play/pause button without the rest of the widget UI (default: false)
• buttonOnlyClassName (string): Extra class applied to the standalone button for custom styles (background, borders, etc.)
• buttonOnlySize (number): Explicit pixel size for the standalone button; icons and spinner scale automatically with this value

Features

• 🎵 Audio streaming with auto-reconnection
• 🎨 Dark and light themes
• ✨ Ambient background effects
• 📱 Responsive design
• 🔊 Volume control
• 🔇 Mute functionality
• ⏯️ Play/pause controls
• 📡 Real-time track information

TypeScript Support

This package includes TypeScript definitions out of the box.

Local Development

# Install dependencies
pnpm install

# Run demo in development mode
pnpm dev

# Build package
pnpm build

License

MIT