Audio

Audio provides ambiance for your users.

Examples

Crowd Cheering

import React from 'react';
import ReactDOM from 'react-dom';
import { Audio } from 'furl-components';

ReactDOM.render(
  <Audio
    src="./raindrops.mp3"
    alt="Rainy sounds"
    withCaption
    volume={0.5}
  />, 
  document.getElementById('root')
);

API

Audio props
Property	Description	Type	Default
src	audio source url	string
alt	audio alternate text	string	'An audio clip'
withCaption	render captioned figure	boolean	false
volume	audio volume	number	1.0
autoplay	start automatically	boolean	false
controls	display controls	boolean	true
loop	loop audio	boolean	false
muted	mute audio	boolean	false

Notes

It is highly recommended you specify a descriptive value for alt to make your audio accessible to screen-readers. This is why we already provide a default value instead of using an empty string or undefined.
If you provide withCaption, the component will render a <figure> and a <figcaption> accompanying the <audio> element. The value of alt will be used for the <figcaption>.
For more information on the <audio> element itself, visit MDN Web Docs.