0.1.9 • Published 5 years ago
material-ui-audio v0.1.9
Usage
npm install material-ui-audio # or yarn add material-ui-audio
import React from 'react'
import MaterialUIAudio from 'material-ui-audio'
// Relative URL - play an audio from same origin
<MaterialUIAudio src={'/audio.mp3'} />
// Absolute URL - play an audio from external source
<MaterialUIAudio src={'https://file-examples-com.github.io/uploads/2017/11/file_example_MP3_1MG.mp3'} />
// Promise retrieve URL
<MaterialUIAudio src={fetch('<my url>')} />
Props
Prop | Description | Default |
---|---|---|
src | string or Promise<string> - The url of an audio to play ◦ Can be a relative or absolute url A Promise resolved into a string (the url) after Play button clicked. This case can be useful when you are using Firebase Storage, where you need to call an API to retrieve the download Url. | (mandatory) |
forward | Set to true or falsy to show forward button | undefined |
backward | Set to true or falsy to show backward button | undefined |
autoplay | Set to true or falsy to set autoplay on audio | undefined |
loop | Set to true or falsy to set loop on audio | undefined |
width | Set the width of the player | undefined (fit parent container) |
speed | Set to true or falsy to show speed control | undefined |
Callback props
Callback props take a function that gets fired on various player events:
Prop | Description |
---|---|
onForwardClick | Called when forward button is clicked |
onBackwardClick | Called when backward button is clicked |
onEnded | Called when audio ended |
Please note:
This module has following peerDependencies: React (>=17.0.0) Material UI (@material-ui/core: >=4.0.0, @material-ui/icons: >=4.0.0).