{"_id":"@blackbox-vision/mui-audio-player","_rev":"6-4385d6c088d0d2d9af25fb9c21773889","name":"@blackbox-vision/mui-audio-player","dist-tags":{"latest":"2.1.0"},"versions":{"2.0.0":{"name":"@blackbox-vision/mui-audio-player","description":"Material-UI based Audio Player","version":"2.0.0","license":"MIT","esnext":"dist-src/index.js","main":"dist-node/index.js","module":"dist-web/index.js","types":"dist-types/index.d.ts","pika":true,"sideEffects":false,"homepage":"https://github.com/BlackBoxVision/mui-audio-player#readme","bugs":{"url":"https://github.com/BlackBoxVision/mui-audio-player/issues"},"repository":{"type":"git","url":"git+https://github.com/BlackBoxVision/mui-audio-player.git"},"dependencies":{},"peerDependencies":{"react":"^16.8.4","@material-ui/core":"^3.9.2","@material-ui/icons":"^3.0.2","@material-ui/lab":"^3.0.0-alpha.30"},"devDependencies":{"@babel/cli":"^7.0.0","@babel/core":"^7.3.4","@babel/node":"^7.0.0","@babel/plugin-proposal-class-properties":"^7.3.4","@babel/plugin-proposal-object-rest-spread":"^7.3.4","@babel/polyfill":"^7.0.0","@babel/preset-env":"^7.0.0","@babel/preset-react":"^7.0.0","@babel/preset-typescript":"^7.3.3","@babel/register":"^7.0.0","@commitlint/cli":"^7.5.2","@commitlint/config-conventional":"^7.5.0","@material-ui/core":"^3.9.2","@material-ui/icons":"^3.0.2","@material-ui/lab":"^3.0.0-alpha.30","@pika/plugin-build-node":"^0.3.14","@pika/plugin-build-types":"^0.3.14","@pika/plugin-build-web":"^0.3.14","@pika/plugin-standard-pkg":"^0.3.14","@storybook/addon-actions":"^5.0.2","@storybook/addon-info":"^5.0.2","@storybook/addon-links":"^5.0.2","@storybook/addons":"^5.0.2","@storybook/react":"^5.0.2","@storybook/storybook-deployer":"^2.8.1","@storybook/theming":"^5.0.2","@types/react":"^16.8.8","babel-eslint":"^10.0.1","babel-loader":"^8.0.5","chai":"^4.1.2","cross-env":"^5.2.0","eslint":"^5.15.2","eslint-config-react-app":"^3.0.8","eslint-import-resolver-lerna":"^1.1.0","eslint-plugin-flowtype":"^3.4.2","eslint-plugin-import":"^2.16.0","eslint-plugin-jsx-a11y":"^6.2.1","eslint-plugin-react":"^7.12.4","eslint-plugin-react-hooks":"^1.5.1","husky":"^1.3.1","isparta":"^4.1.0","jest":"^24.5.0","lint-staged":"^8.1.5","mocha":"^5.2.0","prettier":"^1.16.4","react":"^16.8.4","rimraf":"^2.6.3"},"private":false,"publishConfig":{"registry":"https://registry.npmjs.org/"},"_id":"@blackbox-vision/mui-audio-player@2.0.0","_npmVersion":"6.4.1","_nodeVersion":"11.5.0","_npmUser":{"name":"jonatansalas","email":"jonatan.salas@blackbox-vision.tech"},"dist":{"integrity":"sha512-PdL8HOhOUlllJgWg9cK070IuIxacCFzJEI5VYIMIyj08ED56kx9yzM9iyBYmssalw92HcbSvcAfGJqbVOgjQBg==","shasum":"5a4c1a422b1526cee729fb69e4083f9082ab40d5","tarball":"https://registry.npmjs.org/@blackbox-vision/mui-audio-player/-/mui-audio-player-2.0.0.tgz","fileCount":15,"unpackedSize":43639,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcjs/5CRA9TVsSAnZWagAAj88P/jPgVagng7Iv1vnv6G2S\nWdgSBmQTYu4uw3jJ/+wfZQMO97tZnlS4T6lIZfD0y7lECU0YNV/apAtjaxpw\nHKkiZrxqvwRCTkkcASbvDTl5UGDnBaRKiJz+FvqiM0yDNxqkVGoHz83yXf3Z\nFaTgBxG6aA2dKo5R159Rgx3rr8nb/hHKVpq10ApvSCMr7q6rz+5qk85wntpo\nagWLLxqMH+UDpxsZB5Qnko+BR/ZarmDOGVc3XYbfjw0AD+mXyxIuVwMUsENs\n5FHcxr2mxRPikKWfEroXTdHUDKOSv+vD0PS2A5JOGrNdO/jew2ciqbj4oiKx\nQKD5Q1t9fGL4xxmBY4oB27DLWJi4m5znyxq6V51RROByPqz/mP9/KIr4I1mb\nw8177EeHSMs4KXu4czCojNph3iEsBJQoDPg2gLjH+3ia7Xm18MVXv3LtLw79\n7h0LXij4dwTEph1+ZV+OJmofdtoLTLSMR3JqH9JHGv95NSrO1VFT7VYS6Q0g\nLaJDbMif4dxqMDhr04I1XzhmEG6eoZXdnJSKQi/MRXgWHxG2Td2y989BmiKd\nb6laTDVbel2rYE13fqTxR18OHJIeTgo5965DPNgkza+w/uq/ITPpwCpdIPzR\nbuFHVqwdC+ksygPagFyY+jcoRanXQD95Df8MqqwXFHM49YsWDSbkVQbkUbTB\n7NdK\r\n=HCxi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD/cK3rku7lGEHQl6rkzmis03/G38jTDTPjw3ARW/DAmgIhAPAGQD8jrOaR1Dko12YAj1J1A8dSnE/yrdsUadzY73B2"}]},"maintainers":[{"name":"jonatansalas","email":"jonatan.salas@blackbox-vision.tech"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/mui-audio-player_2.0.0_1552863224432_0.4941821714506611"},"_hasShrinkwrap":false},"2.1.0":{"name":"@blackbox-vision/mui-audio-player","description":"Material-UI based Audio Player","version":"2.1.0","license":"MIT","esnext":"dist-src/index.js","main":"dist-node/index.js","module":"dist-web/index.js","types":"dist-types/index.d.ts","pika":true,"sideEffects":false,"homepage":"https://github.com/BlackBoxVision/mui-audio-player#readme","bugs":{"url":"https://github.com/BlackBoxVision/mui-audio-player/issues"},"repository":{"type":"git","url":"git+https://github.com/BlackBoxVision/mui-audio-player.git"},"dependencies":{},"peerDependencies":{"react":"^16.8.4","@material-ui/core":"^3.9.2","@material-ui/icons":"^3.0.2","@material-ui/lab":"^3.0.0-alpha.30"},"devDependencies":{"@babel/cli":"^7.0.0","@babel/core":"^7.3.4","@babel/node":"^7.0.0","@babel/plugin-proposal-class-properties":"^7.3.4","@babel/plugin-proposal-object-rest-spread":"^7.3.4","@babel/polyfill":"^7.0.0","@babel/preset-env":"^7.0.0","@babel/preset-react":"^7.0.0","@babel/preset-typescript":"^7.3.3","@babel/register":"^7.0.0","@commitlint/cli":"^7.5.2","@commitlint/config-conventional":"^7.5.0","@material-ui/core":"^3.9.2","@material-ui/icons":"^3.0.2","@material-ui/lab":"^3.0.0-alpha.30","@pika/plugin-build-node":"^0.3.14","@pika/plugin-build-types":"^0.3.14","@pika/plugin-build-web":"^0.3.14","@pika/plugin-standard-pkg":"^0.3.14","@storybook/addon-actions":"^5.0.2","@storybook/addon-info":"^5.0.2","@storybook/addon-links":"^5.0.2","@storybook/addons":"^5.0.2","@storybook/react":"^5.0.2","@storybook/storybook-deployer":"^2.8.1","@storybook/theming":"^5.0.2","@types/react":"^16.8.8","babel-eslint":"^10.0.1","babel-loader":"^8.0.5","chai":"^4.1.2","cross-env":"^5.2.0","eslint":"^5.15.2","eslint-config-react-app":"^3.0.8","eslint-import-resolver-lerna":"^1.1.0","eslint-plugin-flowtype":"^3.4.2","eslint-plugin-import":"^2.16.0","eslint-plugin-jsx-a11y":"^6.2.1","eslint-plugin-react":"^7.12.4","eslint-plugin-react-hooks":"^1.5.1","husky":"^1.3.1","isparta":"^4.1.0","jest":"^24.5.0","lint-staged":"^8.1.5","mocha":"^5.2.0","prettier":"^1.16.4","react":"^16.8.4","rimraf":"^2.6.3"},"private":false,"publishConfig":{"registry":"https://registry.npmjs.org/"},"_id":"@blackbox-vision/mui-audio-player@2.1.0","_nodeVersion":"11.12.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-6KONy+7NAxR87Q2YRUmyb273lLNk1+ZSsj9AUpk3/iZAPeQHvEEhiujLaIIJM0vjNYcE1U4ARssq9OIcjSQmMQ==","shasum":"b714fedde510bd739f124f605731ac91dc9eef08","tarball":"https://registry.npmjs.org/@blackbox-vision/mui-audio-player/-/mui-audio-player-2.1.0.tgz","fileCount":15,"unpackedSize":44115,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh2BirCRA9TVsSAnZWagAAnIsP/2sl7trqG2R1ZJ6S6/ZK\nGlWaSLg0MY9yMMZEQu1qxzl5W7eJyZZ5z8IgDWgRqXXVn4yKbu4r0F+U9rBD\nNpU9IrQeSa9s81dsCkirUqox0guZf273JLRwP6QkoqgODKvJp0xJrZPkssOQ\nrxQMCGnxhgsnKaV4iQLNy2IiMzqXmbXpRq5IqVqhrdpVqXPfG+6nYakjPB2S\nCDMhDmO/tbQONkDmQaP4eXgY2cczJM2W/dlpvYvghukSga32ew2IryhDgeWc\nke9CNlYHahsYfbiV30Ih0zMUa6t16a9kycJ6CSjFfyXCmsSuS7VqhaMcyqHI\niURuczxMPAm50cD6TSRvZZXbBxYVfiTDgRlMBYuFie6joAm0p3lGBPKoXPiw\n7rYzUKBDtDhP3znTSMUH/l20O5DormwxCiBr+2S/0xpLAkh9AlEQVYBM+FWT\nTs/bf/tOMpFaeUIQwcQ60uXt1/oivneLE8QtP77eWkjcNrDTd2fd1cFPnial\nSDN+MajWwnfHuWVy97FFuoOjZVYV/xFw1AoLtGMPQDYNjXLxp3dujXh5HS4C\n0e/2EJfFEK6VJYwZPLcRv6SwGz1y991I7WN1rNWtQ6MrVHVgQECo/etczHXg\nsm4qhDtxfdadAahk0llLo6i+8y1EWuKAqe9yQK7DmucFssoYLu3enHZ+QKyc\nbly6\r\n=08CU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCjt7K922yoJDQQOhcudKMHFqoF+I9nd0qHvhaCXjUuKgIhAMhHENX662K6u717ZN0MwdGDFUji1eqDoVmDOHE2Iu3A"}]},"maintainers":[{"name":"jonatansalas","email":"jonatan.salas@blackbox-vision.tech"}],"_npmUser":{"name":"jonatansalas","email":"jonatan.salas@blackbox-vision.tech"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/mui-audio-player_2.1.0_1554162296568_0.04211873915201236"},"_hasShrinkwrap":false}},"time":{"created":"2019-03-17T22:53:44.247Z","2.0.0":"2019-03-17T22:53:44.568Z","modified":"2022-04-04T19:19:49.364Z","2.1.0":"2019-04-01T23:44:56.685Z"},"maintainers":[{"email":"jonatan.salas@blackbox-vision.tech","name":"jonatansalas"},{"email":"manuel.tuero@blackbox-vision.tech","name":"manutuero"}],"description":"Material-UI based Audio Player","homepage":"https://github.com/BlackBoxVision/mui-audio-player#readme","repository":{"type":"git","url":"git+https://github.com/BlackBoxVision/mui-audio-player.git"},"bugs":{"url":"https://github.com/BlackBoxVision/mui-audio-player/issues"},"license":"MIT","readme":"# MUI Audio Player [![npm version](https://badge.fury.io/js/%40blackbox-vision%2Fmui-audio-player.svg)](https://badge.fury.io/js/%40blackbox-vision%2Fmui-audio-player) [![License: MIT](https://img.shields.io/badge/License-MIT-brightgreen.svg)](https://opensource.org/licenses/MIT) [![Known Vulnerabilities](https://snyk.io/test/github/blackboxvision/mui-audio-player/badge.svg)](https://snyk.io/test/github/blackboxvision/mui-audio-player)\n\nMaterial-UI based Audio Player. Check out the [demo](https://blackboxvision.github.io/mui-audio-player/).\n\n## Installation\n\n### NPM\n\n```bash\nnpm i @blackbox-vision/mui-audio-player\n```\n\n### YARN\n\n```bash\nyarn add @blackbox-vision/mui-audio-player\n```\n\n### Usage\n\nThe usage is really simple:\n\n```javascript\nimport React from 'react';\nimport Grid from '@material-ui/core/Grid';\n\nimport pink from '@material-ui/core/colors/pink';\nimport deepPurple from '@material-ui/core/colors/deepPurple';\n\nimport createTheme from '@material-ui/core/styles/createMuiTheme';\nimport ThemeProvider from '@material-ui/core/styles/MuiThemeProvider';\n\nimport { AudioPlayer } from '@blackbox-vision/mui-audio-player';\n\nconst theme = createTheme({\n  palette: {\n    type: 'light',\n    primary: deepPurple,\n    secondary: pink,\n  },\n});\n\nexport default class App extends React.Component {\n  render() {\n    return (\n      <ThemeProvider theme={theme}>\n        <Grid\n          justify=\"center\"\n          alignContent=\"center\"\n          alignItems=\"center\"\n          container\n          style={{ height: '100vh', backgroundColor: deepPurple['500'] }}\n        >\n          <Grid md={4} item />\n          <Grid md={4} item>\n            <AudioPlayer\n              src=\"https://s9.converto.io/download-file/zwXZbmwDyWGN7qkqvVPMcQm0pIajpwdE/file.mp3\"\n              autoPlay={false}\n              rounded={true}\n              elevation={1}\n              width=\"100%\"\n            />\n          </Grid>\n          <Grid md={4} item />\n        </Grid>\n      </ThemeProvider>\n    );\n  }\n}\n```\n\nAs you can see in the example, this component is pretty well themeable.\n\n## Props\n\nThese are the properties used by the `AudioPlayer` component:\n\n| Properties | Types   | Default Value | Description                                                          |\n| ---------- | ------- | ------------- | -------------------------------------------------------------------- |\n| src        | string  | none          | Determines the url used by the player to load the audio source.      |\n| autoPlay   | boolean | false         | Determines if the player starts reproducing the audio automatically. |\n| rounded    | boolean | false         | Determines if the player container has rounded borders.              |\n| elevation  | number  | 1             | Determines if the player container has box-shadow applied.           |\n| width      | string  | 500px         | Determines the width of the player.                                  |\n| height     | string  | 45px          | Determines the height of the player.                                 |\n| classNames | object  | {}            | Determines the classNames to be applied. (\\*)                        |\n\n(\\*) `classNames` is a special property:\n\n| Properties          | Types  | Default Value | Description                                                       |\n| ------------------- | ------ | ------------- | ----------------------------------------------------------------- |\n| classNames.player   | string | none          | Determines the className to be applied to the root container.     |\n| classNames.loopIcon | string | none          | Determines the classNames to be applied to the loop icon element. |\n| classNames.playIcon | string | none          | Determines the classNames to be applied to the play icon element. |\n| classNames.muteIcon | string | none          | Determines the classNames to be applied to the mute icon element. |\n| classNames.slider   | string | none          | Determines the classNames to be applied to the slider element.    |\n| classNames.track    | string | none          | Determines the classNames to be applied to the track element.     |\n| classNames.thumb    | string | none          | Determines the classNames to be applied to the thumb element.     |\n| classNames.text     | string | none          | Determines the classNames to be applied to the text element.      |\n\n## TODO\n\n- [ ] Add `volume bar`.\n- [ ] Add more tests.\n- [ ] Add better styles for responsive design.\n\n## Issues\n\nPlease, open an [issue](https://github.com/BlackBoxVision/mui-audio-player/issues) following one of the issues templates. We will do our best to fix them.\n\n## Contributing\n\nIf you want to contribute to this project see [contributing](https://github.com/BlackBoxVision/mui-audio-player/blob/master/CONTRIBUTING.md) for more information.\n\n## License\n\nDistributed under the MIT license. See [LICENSE](https://github.com/BlackBoxVision/mui-audio-player/blob/master/LICENSE) for more information.\n","readmeFilename":"README.md"}