> ## Documentation Index
> Fetch the complete documentation index at: https://docs.slng.ai/llms.txt
> Use this file to discover all available pages before exploring further.
# Gradium voices
> Browse Gradium TTS voices on SLNG with audio samples — multilingual TTS across English, Spanish, French, German, and Portuguese.
export const AudioPlayer = ({src, title = "Audio", description, autoPlay = false, loop = false, variant = "default"}) => {
const audioId = useId();
const isCompact = variant === "compact";
const audioRef = useRef(null);
const [isPlaying, setIsPlaying] = useState(false);
const [currentTime, setCurrentTime] = useState(0);
const [duration, setDuration] = useState(0);
const togglePlayback = () => {
const audio = audioRef.current;
if (!audio) return;
if (audio.paused) {
void audio.play();
setIsPlaying(true);
return;
}
audio.pause();
setIsPlaying(false);
};
const handleSeek = event => {
const audio = audioRef.current;
if (!audio) return;
const next = Number(event.target.value);
audio.currentTime = next;
setCurrentTime(next);
};
const formatTime = seconds => {
if (!Number.isFinite(seconds)) return "0:00";
const total = Math.floor(seconds);
const mins = Math.floor(total / 60);
const secs = total % 60;
return `${mins}:${secs < 10 ? "0" : ""}${secs}`;
};
const progress = duration > 0 ? currentTime / duration * 100 : 0;
return
{!isCompact &&
{title}
{description &&
{description}
}
Download
}
{isCompact ? <>
: <>
}