react-audio-play - npm Package Compare versions

Comparing version 0.0.14 to 0.0.15

dist/cjs/index.js

@@ -1,2 +0,2 @@
-"use strict";var e=require("react"),n=function(){return n=Object.assign||function(e){for(var n,r=1,t=arguments.length;r<t;r++)for(var a in n=arguments[r])Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a]);return e},n.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var r="M14.667 0v2.747c3.853 1.146 6.666 4.72 6.666 8.946 0 4.227-2.813 7.787-6.666 8.934v2.76C20 22.173 24 17.4 24 11.693 24 5.987 20 1.213 14.667 0zM18 11.693c0-2.36-1.333-4.386-3.333-5.373v10.707c2-.947 3.333-2.987 3.333-5.334zm-18-4v8h5.333L12 22.36V1.027L5.333 7.693H0z",t="M0 7.667v8h5.333L12 22.333V1L5.333 7.667M17.333 11.373C17.333 9.013 16 6.987 14 6v10.707c2-.947 3.333-2.987 3.333-5.334z",a="M0 7.667v8h5.333L12 22.333V1L5.333 7.667",o="M0 0h6v24H0zM12 0h6v24h-6z",i="M18 12L0 24V0",c=function(e){var n=Math.floor(e/60),r=Math.floor(e%60);return n+":"+(r<10?"0"+r:r)};var l=function(e,n){var r,t,a,o=e.target;return"click"===e.type&&(a=o,-1!==Array.from(a.classList).indexOf("rap-pin"))&&(null===(r=null==o?void 0:o.parentElement)||void 0===r?void 0:r.parentElement)&&(o=o.parentElement.parentElement),"mousemove"===e.type&&(null===(t=null==n?void 0:n.parentElement)||void 0===t?void 0:t.parentElement)&&(o=n.parentElement.parentElement),o},p=[],u=[];!function(e,n){if(e&&"undefined"!=typeof document){var r,t=!0===n.prepend?"prepend":"append",a=!0===n.singleTag,o="string"==typeof n.container?document.querySelector(n.container):document.getElementsByTagName("head")[0];if(a){var i=p.indexOf(o);-1===i&&(i=p.push(o)-1,u[i]={}),r=u[i]&&u[i][t]?u[i][t]:u[i][t]=c()}else r=c();65279===e.charCodeAt(0)&&(e=e.substring(1)),r.styleSheet?r.styleSheet.cssText+=e:r.appendChild(document.createTextNode(e))}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),n.attributes)for(var r=Object.keys(n.attributes),a=0;a<r.length;a++)e.setAttribute(r[a],n.attributes[r[a]]);var i="prepend"===t?"afterbegin":"beforeend";return o.insertAdjacentElement(i,e),e}}(".rap-container {\n  width: 400px;\n  min-width: 300px;\n  height: 56px;\n  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.07);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-left: 24px;\n  padding-right: 24px;\n  border-radius: 4px;\n  user-select: none;\n  -webkit-user-select: none;\n  background-color: #fff;\n  color: #55606e;\n}\n.rap-container:focus {\n  outline: none;\n}\n.rap-container .rap-current-time,\n.rap-container .rap-total-time {\n  min-width: 40px;\n}\n.rap-container .rap-total-time {\n  text-align: right;\n}\n.rap-container .rap-pp-button {\n  cursor: pointer;\n}\n.rap-container .rap-spinner {\n  width: 18px;\n  height: 18px;\n  background-image: url('data:image/png;base64,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');\n  background-size: cover;\n  background-repeat: no-repeat;\n  animation: rapSpin 0.4s linear infinite;\n}\n.rap-container .rap-slider {\n  flex-grow: 1;\n  background-color: #d8d8d8;\n  cursor: pointer;\n  position: relative;\n}\n.rap-container .rap-slider .rap-progress {\n  background-color: #007fff;\n  border-radius: inherit;\n  position: absolute;\n  pointer-events: none;\n}\n.rap-container .rap-slider .rap-progress .rap-pin {\n  height: 16px;\n  width: 16px;\n  border-radius: 8px;\n  background-color: #007fff;\n  position: absolute;\n  pointer-events: all;\n  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);\n}\n.rap-container .rap-controls {\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  line-height: 18px;\n  display: flex;\n  flex-grow: 1;\n  justify-content: space-between;\n  align-items: center;\n  margin-left: 24px;\n  margin-right: 24px;\n}\n.rap-container .rap-controls .rap-slider {\n  margin-left: 12px;\n  margin-right: 12px;\n  border-radius: 2px;\n  height: 4px;\n}\n.rap-container .rap-controls .rap-slider .rap-progress {\n  width: 0;\n  height: 100%;\n}\n.rap-container .rap-controls .rap-slider .rap-progress .rap-pin {\n  right: -8px;\n  top: -6px;\n}\n.rap-container .rap-controls span {\n  cursor: default;\n}\n.rap-container .rap-volume {\n  position: relative;\n}\n.rap-container .rap-volume .rap-volume-btn {\n  cursor: pointer;\n}\n.rap-container .rap-volume .rap-volume-controls {\n  width: 30px;\n  height: 135px;\n  background-color: rgba(0, 0, 0, 0.62);\n  border-radius: 7px;\n  position: absolute;\n  left: -3px;\n  bottom: 52px;\n  flex-direction: column;\n  align-items: center;\n  display: flex;\n  z-index: 1;\n}\n.rap-container .rap-volume .rap-hidden {\n  display: none;\n}\n.rap-container .rap-volume .rap-vol-placement-top {\n  position: absolute;\n  left: 0;\n  top: 32px;\n}\n\n.rap-container .rap-volume .rap-vol-placement-bottom {\n  position: absolute;\n  left: 0;\n  top: 230px;\n}\n\n.rap-container .rap-volume .rap-volume-controls .rap-slider {\n  margin-top: 12px;\n  margin-bottom: 12px;\n  width: 6px;\n  border-radius: 3px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress {\n  bottom: 0;\n  height: 100%;\n  width: 6px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress .rap-pin {\n  left: -5px;\n  top: -8px;\n}\n\n.rap-container svg {\n  display: block;\n}\n\n.rap-backdrop {\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  top: 0;\n  left: 0;\n}\n\n@keyframes rapSpin {\n  from {\n    transform: rotateZ(0);\n  }\n  to {\n    transform: rotateZ(1turn);\n  }\n}\n",{});exports.AudioPlayer=function(p){var u=p.className,s=void 0===u?"":u,d=p.src,m=p.loop,v=void 0!==m&&m,f=p.preload,h=void 0===f?"auto":f,g=p.backgroundColor,w=p.color,x=p.width,b=p.style,E=p.sliderColor,A=p.volume,k=void 0===A?100:A,y=p.volumePlacement,N=void 0===y?"top":y,R=p.hasKeyBindings,C=void 0===R||R,S=p.onPlay,T=p.onPause,L=p.onEnd,z=p.onError,M=e.useRef(null),U=e.useRef(null),D=e.useRef(null),I=e.useRef(null),K=e.useState("none"===h),B=K[0],O=K[1],P=e.useState(!1),F=P[0],Y=P[1],G=e.useState(0),W=G[0],X=G[1],j=e.useState("0:00"),J=j[0],H=j[1],Z=e.useState("--:--"),V=Z[0],Q=Z[1],q=e.useState(!1),_=q[0],$=q[1],ee=e.useState(100),ne=ee[0],re=ee[1],te=e.useState(function(e){if((e=isNaN(e)?100:Math.max(0,Math.min(e,100)))>=50)return r;if(e>5)return t;return a}(k)),ae=te[0],oe=te[1],ie=e.useState(0),ce=ie[0],le=ie[1],pe=e.useState(!1),ue=pe[0],se=pe[1];e.useEffect((function(){if(!isNaN(k)){var e=k>100?100:k<0?0:k;re(e),M.current&&(M.current.volume=e/100)}}),[k]);var de=function(){M.current&&("none"!==h||M.current.duration||O(!1),M.current.paused?(M.current.play(),Y(!0),S&&S()):(M.current.pause(),Y(!1),T&&T()))},me=function(e){var n,r,t=l(e,U.current),a=t.getBoundingClientRect();if("horizontal"===t.dataset.direction){if(n=(r=t.offsetLeft)+t.offsetWidth,e.clientX<r||e.clientX>n)return!1}else if(n=(r=a.top)+t.offsetHeight,e.clientY<r||e.clientY>n)return!1;return!0};function ve(e){var n=l(e,U.current),r=n.getBoundingClientRect(),t=0;if("horizontal"===n.dataset.direction)t=(e.clientX-n.offsetLeft)/n.clientWidth;else if("vertical"===n.dataset.direction){var a=n.clientHeight;t=1-(e.clientY-r.top)/a}return t}var fe=function(e){if(me(e)&&M.current)if("none"!==h||M.current.duration){if(M.current.duration){var n=M.current.duration*ve(e);M.current.currentTime=n}}else O(!1),M.current.load(),le(ve(e))},he=function(e){me(e)&&M.current&&(M.current.volume=ve(e))},ge=function(){U.current=D.current,window.addEventListener("mousemove",fe,!1),window.addEventListener("mouseup",(function(){U.current=null,window.removeEventListener("mousemove",fe,!1)}),{once:!0})},we=function(){U.current=I.current,window.addEventListener("mousemove",he,!1),window.addEventListener("mouseup",(function(){U.current=null,window.removeEventListener("mousemove",he,!1)}),!1)},xe=function(e){if(M.current){var n=M.current.currentTime+M.current.duration*(e/100);M.current.currentTime=Math.min(n,M.current.duration)}},be=function(e){M.current&&(M.current.volume=Math.max(0,Math.min(1,M.current.volume+e)))};return e.createElement("div",{tabIndex:-1,onKeyDown:function(e){if(C)switch(e.key){case"ArrowLeft":xe(-5);break;case"ArrowRight":xe(5);break;case"ArrowUp":be(.05);break;case"ArrowDown":be(-.05);break;case" ":de()}},className:"rap-container ".concat(s),style:n(n(n(n({},g?{backgroundColor:g}:{}),w?{color:w}:{}),x?{width:x}:{}),b)},ue&&e.createElement("span",{title:"An error has occurred",className:"rap-pp-button",onClick:function(){M.current&&(O(!1),se(!1),M.current.load())}},e.createElement("svg",{width:"24px",height:"24px",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",fill:"none",className:"rap-pp-icon"},e.createElement("path",{fill:null!=w?w:"#566574",d:"M7.248 1.307A.75.75 0 118.252.193l2.5 2.25a.75.75 0 010 1.114l-2.5 2.25a.75.75 0 01-1.004-1.114l1.29-1.161a4.5 4.5 0 103.655 2.832.75.75 0 111.398-.546A6 6 0 118.018 2l-.77-.693z"}))),!B&&!ue&&e.createElement("div",{className:"rap-loading"},e.createElement("div",{className:"rap-spinner"})),B&&!ue&&e.createElement("div",{className:"rap-pp-button",onClick:function(){return de()}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"24",viewBox:"0 0 18 24",className:"rap-pp-icon"},e.createElement("path",{fill:null!=w?w:"#566574",fillRule:"evenodd",d:F?o:i}))),e.createElement("div",{className:"rap-controls"},e.createElement("span",{className:"rap-current-time"},J),e.createElement("div",{className:"rap-slider","data-direction":"horizontal",onMouseDown:ge,onClick:fe},e.createElement("div",{className:"rap-progress",style:n({width:W+"%"},E?{backgroundColor:E}:{})},e.createElement("div",{ref:D,className:"rap-pin","data-method":"rewind",onMouseDown:ge,style:E?{backgroundColor:E}:{}}))),e.createElement("span",{className:"rap-total-time"},V)),e.createElement("div",{className:"rap-volume"},e.createElement("div",{className:"rap-volume-btn ".concat(_?"rap-volume-open":""),onClick:function(){return $((function(e){return!e}))}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},e.createElement("path",{fill:_?null!=E?E:"#007FFF":null!=w?w:"#566574",fillRule:"evenodd",d:ae}))),e.createElement("div",{className:"".concat("bottom"===N?"rap-vol-placement-bottom":"rap-vol-placement-top"," ").concat(_?"":"rap-hidden")},e.createElement("div",{className:"rap-volume-controls",onClick:function(e){e.preventDefault(),e.stopPropagation()}},e.createElement("div",{className:"rap-slider","data-direction":"vertical",onClick:he,onMouseDown:we},e.createElement("div",{className:"rap-progress",style:n({height:"".concat(ne,"%")},E?{backgroundColor:E}:{})},e.createElement("div",{ref:I,className:"rap-pin","data-method":"changeVolume",style:E?{backgroundColor:E}:{},onMouseDown:we})))),e.createElement("div",{className:"rap-backdrop",onClick:function(){return $(!1)}}))),e.createElement("audio",{ref:M,loop:v,preload:h,onCanPlay:function(){O(!0)},onEnded:function(){Y(!1),M.current&&(M.current.currentTime=0,L&&L())},onError:function(e){if(O(!0),se(!0),z){var n=e.target.error,r="An unknown error occurred.";if(null==n?void 0:n.code)switch(null==n?void 0:n.code){case n.MEDIA_ERR_ABORTED:r="The media playback was aborted.";break;case n.MEDIA_ERR_NETWORK:r="A network error caused the media to fail.";break;case n.MEDIA_ERR_DECODE:r="The media playback was aborted due to a decoding error.";break;case n.MEDIA_ERR_SRC_NOT_SUPPORTED:r="The media source format is not supported.";break;default:r="An unknown error occurred."}z(e,r)}},onLoadedMetadata:function(){var e,n;if(null===(e=M.current)||void 0===e?void 0:e.duration){Q(c(null!==(n=M.current.duration)&&void 0!==n?n:0));var r=M.current.duration*ce;M.current.currentTime=r}},onTimeUpdate:function(){if(M.current){var e=M.current.currentTime,n=e/M.current.duration*100;X(n),H(c(e))}},onVolumeChange:function(){M.current&&(re(100*M.current.volume),M.current.volume>=.5?oe(r):M.current.volume<.5&&M.current.volume>.05?oe(t):M.current.volume<=.05&&oe(a))}},e.createElement("source",{src:d,type:"audio/mpeg"})))};
+"use strict";var e=require("react"),n=function(){return n=Object.assign||function(e){for(var n,r=1,t=arguments.length;r<t;r++)for(var a in n=arguments[r])Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a]);return e},n.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var r="M14.667 0v2.747c3.853 1.146 6.666 4.72 6.666 8.946 0 4.227-2.813 7.787-6.666 8.934v2.76C20 22.173 24 17.4 24 11.693 24 5.987 20 1.213 14.667 0zM18 11.693c0-2.36-1.333-4.386-3.333-5.373v10.707c2-.947 3.333-2.987 3.333-5.334zm-18-4v8h5.333L12 22.36V1.027L5.333 7.693H0z",t="M0 7.667v8h5.333L12 22.333V1L5.333 7.667M17.333 11.373C17.333 9.013 16 6.987 14 6v10.707c2-.947 3.333-2.987 3.333-5.334z",a="M0 7.667v8h5.333L12 22.333V1L5.333 7.667",o="M0 0h6v24H0zM12 0h6v24h-6z",i="M18 12L0 24V0",c=function(e){var n=Math.floor(e/60),r=Math.floor(e%60);return n+":"+(r<10?"0"+r:r)};var l=function(e,n){var r,t,a,o=e.target;return"click"===e.type&&(a=o,-1!==Array.from(a.classList).indexOf("rap-pin"))&&(null===(r=null==o?void 0:o.parentElement)||void 0===r?void 0:r.parentElement)&&(o=o.parentElement.parentElement),"mousemove"===e.type&&(null===(t=null==n?void 0:n.parentElement)||void 0===t?void 0:t.parentElement)&&(o=n.parentElement.parentElement),o},p=[],u=[];!function(e,n){if(e&&"undefined"!=typeof document){var r,t=!0===n.prepend?"prepend":"append",a=!0===n.singleTag,o="string"==typeof n.container?document.querySelector(n.container):document.getElementsByTagName("head")[0];if(a){var i=p.indexOf(o);-1===i&&(i=p.push(o)-1,u[i]={}),r=u[i]&&u[i][t]?u[i][t]:u[i][t]=c()}else r=c();65279===e.charCodeAt(0)&&(e=e.substring(1)),r.styleSheet?r.styleSheet.cssText+=e:r.appendChild(document.createTextNode(e))}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),n.attributes)for(var r=Object.keys(n.attributes),a=0;a<r.length;a++)e.setAttribute(r[a],n.attributes[r[a]]);var i="prepend"===t?"afterbegin":"beforeend";return o.insertAdjacentElement(i,e),e}}(".rap-container {\n  width: 400px;\n  min-width: 300px;\n  height: 56px;\n  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.07);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-left: 24px;\n  padding-right: 24px;\n  border-radius: 4px;\n  user-select: none;\n  -webkit-user-select: none;\n  background-color: #fff;\n  color: #55606e;\n}\n.rap-container:focus {\n  outline: none;\n}\n.rap-container .rap-current-time,\n.rap-container .rap-total-time {\n  min-width: 40px;\n}\n.rap-container .rap-total-time {\n  text-align: right;\n}\n.rap-container .rap-pp-button {\n  cursor: pointer;\n}\n.rap-container .rap-spinner {\n  width: 18px;\n  height: 18px;\n  background-image: url('data:image/png;base64,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');\n  background-size: cover;\n  background-repeat: no-repeat;\n  animation: rapSpin 0.4s linear infinite;\n}\n.rap-container .rap-slider {\n  flex-grow: 1;\n  background-color: #d8d8d8;\n  cursor: pointer;\n  position: relative;\n}\n.rap-container .rap-slider .rap-progress {\n  background-color: #007fff;\n  border-radius: inherit;\n  position: absolute;\n  pointer-events: none;\n}\n.rap-container .rap-slider .rap-progress .rap-pin {\n  height: 16px;\n  width: 16px;\n  border-radius: 8px;\n  background-color: #007fff;\n  position: absolute;\n  pointer-events: all;\n  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);\n}\n.rap-container .rap-controls {\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  line-height: 18px;\n  display: flex;\n  flex-grow: 1;\n  justify-content: space-between;\n  align-items: center;\n  margin-left: 24px;\n  margin-right: 24px;\n}\n.rap-container .rap-controls .rap-slider {\n  margin-left: 12px;\n  margin-right: 12px;\n  border-radius: 2px;\n  height: 4px;\n}\n.rap-container .rap-controls .rap-slider .rap-progress {\n  width: 0;\n  height: 100%;\n}\n.rap-container .rap-controls .rap-slider .rap-progress .rap-pin {\n  right: -8px;\n  top: -6px;\n}\n.rap-container .rap-controls span {\n  cursor: default;\n}\n.rap-container .rap-volume {\n  position: relative;\n}\n.rap-container .rap-volume .rap-volume-btn {\n  cursor: pointer;\n}\n.rap-container .rap-volume .rap-volume-controls {\n  width: 30px;\n  height: 135px;\n  background-color: rgba(0, 0, 0, 0.62);\n  border-radius: 7px;\n  position: absolute;\n  left: -3px;\n  bottom: 52px;\n  flex-direction: column;\n  align-items: center;\n  display: flex;\n  z-index: 1;\n}\n.rap-container .rap-volume .rap-hidden {\n  display: none;\n}\n.rap-container .rap-volume .rap-vol-placement-top {\n  position: absolute;\n  left: 0;\n  top: 32px;\n}\n\n.rap-container .rap-volume .rap-vol-placement-bottom {\n  position: absolute;\n  left: 0;\n  top: 230px;\n}\n\n.rap-container .rap-volume .rap-volume-controls .rap-slider {\n  margin-top: 12px;\n  margin-bottom: 12px;\n  width: 6px;\n  border-radius: 3px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress {\n  bottom: 0;\n  height: 100%;\n  width: 6px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress .rap-pin {\n  left: -5px;\n  top: -8px;\n}\n\n.rap-container svg {\n  display: block;\n}\n\n.rap-backdrop {\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  top: 0;\n  left: 0;\n}\n\n@keyframes rapSpin {\n  from {\n    transform: rotateZ(0);\n  }\n  to {\n    transform: rotateZ(1turn);\n  }\n}\n",{});exports.AudioPlayer=function(p){var u=p.className,s=void 0===u?"":u,d=p.src,m=p.loop,v=void 0!==m&&m,f=p.preload,h=void 0===f?"auto":f,g=p.backgroundColor,w=p.color,x=p.width,b=p.style,E=p.sliderColor,A=p.volume,k=void 0===A?100:A,y=p.volumePlacement,N=void 0===y?"top":y,R=p.hasKeyBindings,C=void 0===R||R,S=p.onPlay,T=p.onPause,L=p.onEnd,z=p.onError,M=e.useRef(null),D=e.useRef(null),U=e.useRef(null),I=e.useRef(null),K=e.useState("none"===h),B=K[0],O=K[1],P=e.useState(!1),F=P[0],Y=P[1],G=e.useState(0),W=G[0],X=G[1],j=e.useState("0:00"),J=j[0],H=j[1],Z=e.useState("--:--"),V=Z[0],Q=Z[1],q=e.useState(!1),_=q[0],$=q[1],ee=e.useState(100),ne=ee[0],re=ee[1],te=e.useState(function(e){if((e=isNaN(e)?100:Math.max(0,Math.min(e,100)))>=50)return r;if(e>5)return t;return a}(k)),ae=te[0],oe=te[1],ie=e.useState(0),ce=ie[0],le=ie[1],pe=e.useState(!1),ue=pe[0],se=pe[1];e.useEffect((function(){if(!isNaN(k)){var e=k>100?100:k<0?0:k;re(e),M.current&&(M.current.volume=e/100)}}),[k]);var de=function(){M.current&&("none"!==h||M.current.duration||O(!1),M.current.paused?(M.current.play(),Y(!0),S&&S()):(M.current.pause(),Y(!1),T&&T()))},me=function(e){var n,r,t=l(e,D.current),a=t.getBoundingClientRect();if("horizontal"===t.dataset.direction){if(n=(r=t.offsetLeft)+t.offsetWidth,e.clientX<r||e.clientX>n)return!1}else if(n=(r=a.top)+t.offsetHeight,e.clientY<r||e.clientY>n)return!1;return!0};function ve(e){var n=l(e,D.current),r=n.getBoundingClientRect(),t=0;if("horizontal"===n.dataset.direction)t=(e.clientX-n.offsetLeft)/n.clientWidth;else if("vertical"===n.dataset.direction){var a=n.clientHeight;t=1-(e.clientY-r.top)/a}return t}var fe=function(e){if(me(e)&&M.current)if("none"!==h||M.current.duration){if(M.current.duration){var n=M.current.duration*ve(e);M.current.currentTime=n}}else O(!1),M.current.load(),le(ve(e))},he=function(e){me(e)&&M.current&&(M.current.volume=ve(e))},ge=function(){D.current=U.current,window.addEventListener("mousemove",fe,!1),window.addEventListener("mouseup",(function(){D.current=null,window.removeEventListener("mousemove",fe,!1)}),{once:!0})},we=function(){D.current=I.current,window.addEventListener("mousemove",he,!1),window.addEventListener("mouseup",(function(){D.current=null,window.removeEventListener("mousemove",he,!1)}),!1)},xe=function(e){if(M.current){var n=M.current.currentTime+M.current.duration*(e/100);M.current.currentTime=Math.min(n,M.current.duration)}},be=function(e){M.current&&(M.current.volume=Math.max(0,Math.min(1,M.current.volume+e)))};return e.createElement("div",{tabIndex:-1,onKeyDown:function(e){if(C)switch(e.preventDefault(),e.key){case"ArrowLeft":xe(-5);break;case"ArrowRight":xe(5);break;case"ArrowUp":be(.05);break;case"ArrowDown":be(-.05);break;case" ":de()}},className:"rap-container ".concat(s),style:n(n(n(n({},g?{backgroundColor:g}:{}),w?{color:w}:{}),x?{width:x}:{}),b)},ue&&e.createElement("span",{title:"An error has occurred",className:"rap-pp-button",onClick:function(){M.current&&(O(!1),se(!1),M.current.load())}},e.createElement("svg",{width:"24px",height:"24px",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",fill:"none",className:"rap-pp-icon"},e.createElement("path",{fill:null!=w?w:"#566574",d:"M7.248 1.307A.75.75 0 118.252.193l2.5 2.25a.75.75 0 010 1.114l-2.5 2.25a.75.75 0 01-1.004-1.114l1.29-1.161a4.5 4.5 0 103.655 2.832.75.75 0 111.398-.546A6 6 0 118.018 2l-.77-.693z"}))),!B&&!ue&&e.createElement("div",{className:"rap-loading"},e.createElement("div",{className:"rap-spinner"})),B&&!ue&&e.createElement("div",{className:"rap-pp-button",onClick:function(){return de()}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"24",viewBox:"0 0 18 24",className:"rap-pp-icon"},e.createElement("path",{fill:null!=w?w:"#566574",fillRule:"evenodd",d:F?o:i}))),e.createElement("div",{className:"rap-controls"},e.createElement("span",{className:"rap-current-time"},J),e.createElement("div",{className:"rap-slider","data-direction":"horizontal",onMouseDown:ge,onClick:fe},e.createElement("div",{className:"rap-progress",style:n({width:W+"%"},E?{backgroundColor:E}:{})},e.createElement("div",{ref:U,className:"rap-pin","data-method":"rewind",onMouseDown:ge,style:E?{backgroundColor:E}:{}}))),e.createElement("span",{className:"rap-total-time"},V)),e.createElement("div",{className:"rap-volume"},e.createElement("div",{className:"rap-volume-btn ".concat(_?"rap-volume-open":""),onClick:function(){return $((function(e){return!e}))}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},e.createElement("path",{fill:_?null!=E?E:"#007FFF":null!=w?w:"#566574",fillRule:"evenodd",d:ae}))),e.createElement("div",{className:"".concat("bottom"===N?"rap-vol-placement-bottom":"rap-vol-placement-top"," ").concat(_?"":"rap-hidden")},e.createElement("div",{className:"rap-volume-controls",onClick:function(e){e.preventDefault(),e.stopPropagation()}},e.createElement("div",{className:"rap-slider","data-direction":"vertical",onClick:he,onMouseDown:we},e.createElement("div",{className:"rap-progress",style:n({height:"".concat(ne,"%")},E?{backgroundColor:E}:{})},e.createElement("div",{ref:I,className:"rap-pin","data-method":"changeVolume",style:E?{backgroundColor:E}:{},onMouseDown:we})))),e.createElement("div",{className:"rap-backdrop",onClick:function(){return $(!1)}}))),e.createElement("audio",{ref:M,loop:v,preload:h,onCanPlay:function(){O(!0)},onEnded:function(){Y(!1),M.current&&(M.current.currentTime=0,L&&L())},onError:function(e){if(O(!0),se(!0),z){var n=e.target.error,r="An unknown error occurred.";if(null==n?void 0:n.code)switch(null==n?void 0:n.code){case n.MEDIA_ERR_ABORTED:r="The media playback was aborted.";break;case n.MEDIA_ERR_NETWORK:r="A network error caused the media to fail.";break;case n.MEDIA_ERR_DECODE:r="The media playback was aborted due to a decoding error.";break;case n.MEDIA_ERR_SRC_NOT_SUPPORTED:r="The media source format is not supported.";break;default:r="An unknown error occurred."}z(e,r)}},onLoadedMetadata:function(){var e,n;if(null===(e=M.current)||void 0===e?void 0:e.duration){Q(c(null!==(n=M.current.duration)&&void 0!==n?n:0));var r=M.current.duration*ce;M.current.currentTime=r}},onTimeUpdate:function(){if(M.current){var e=M.current.currentTime,n=e/M.current.duration*100;X(n),H(c(e))}},onVolumeChange:function(){M.current&&(re(100*M.current.volume),M.current.volume>=.5?oe(r):M.current.volume<.5&&M.current.volume>.05?oe(t):M.current.volume<=.05&&oe(a))}},e.createElement("source",{src:d,type:"audio/mpeg"})))};
 //# sourceMappingURL=index.js.map

dist/esm/index.js

@@ -1,2 +0,2 @@
-import e,{useRef as n,useState as r,useEffect as t}from"react";var o=function(){return o=Object.assign||function(e){for(var n,r=1,t=arguments.length;r<t;r++)for(var o in n=arguments[r])Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o]);return e},o.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var a="M14.667 0v2.747c3.853 1.146 6.666 4.72 6.666 8.946 0 4.227-2.813 7.787-6.666 8.934v2.76C20 22.173 24 17.4 24 11.693 24 5.987 20 1.213 14.667 0zM18 11.693c0-2.36-1.333-4.386-3.333-5.373v10.707c2-.947 3.333-2.987 3.333-5.334zm-18-4v8h5.333L12 22.36V1.027L5.333 7.693H0z",i="M0 7.667v8h5.333L12 22.333V1L5.333 7.667M17.333 11.373C17.333 9.013 16 6.987 14 6v10.707c2-.947 3.333-2.987 3.333-5.334z",c="M0 7.667v8h5.333L12 22.333V1L5.333 7.667",l="M0 0h6v24H0zM12 0h6v24h-6z",p="M18 12L0 24V0",u=function(e){var n=Math.floor(e/60),r=Math.floor(e%60);return n+":"+(r<10?"0"+r:r)};var s=function(e,n){var r,t,o,a=e.target;return"click"===e.type&&(o=a,-1!==Array.from(o.classList).indexOf("rap-pin"))&&(null===(r=null==a?void 0:a.parentElement)||void 0===r?void 0:r.parentElement)&&(a=a.parentElement.parentElement),"mousemove"===e.type&&(null===(t=null==n?void 0:n.parentElement)||void 0===t?void 0:t.parentElement)&&(a=n.parentElement.parentElement),a},d=[],m=[];!function(e,n){if(e&&"undefined"!=typeof document){var r,t=!0===n.prepend?"prepend":"append",o=!0===n.singleTag,a="string"==typeof n.container?document.querySelector(n.container):document.getElementsByTagName("head")[0];if(o){var i=d.indexOf(a);-1===i&&(i=d.push(a)-1,m[i]={}),r=m[i]&&m[i][t]?m[i][t]:m[i][t]=c()}else r=c();65279===e.charCodeAt(0)&&(e=e.substring(1)),r.styleSheet?r.styleSheet.cssText+=e:r.appendChild(document.createTextNode(e))}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),n.attributes)for(var r=Object.keys(n.attributes),o=0;o<r.length;o++)e.setAttribute(r[o],n.attributes[r[o]]);var i="prepend"===t?"afterbegin":"beforeend";return a.insertAdjacentElement(i,e),e}}(".rap-container {\n  width: 400px;\n  min-width: 300px;\n  height: 56px;\n  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.07);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-left: 24px;\n  padding-right: 24px;\n  border-radius: 4px;\n  user-select: none;\n  -webkit-user-select: none;\n  background-color: #fff;\n  color: #55606e;\n}\n.rap-container:focus {\n  outline: none;\n}\n.rap-container .rap-current-time,\n.rap-container .rap-total-time {\n  min-width: 40px;\n}\n.rap-container .rap-total-time {\n  text-align: right;\n}\n.rap-container .rap-pp-button {\n  cursor: pointer;\n}\n.rap-container .rap-spinner {\n  width: 18px;\n  height: 18px;\n  background-image: url('data:image/png;base64,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');\n  background-size: cover;\n  background-repeat: no-repeat;\n  animation: rapSpin 0.4s linear infinite;\n}\n.rap-container .rap-slider {\n  flex-grow: 1;\n  background-color: #d8d8d8;\n  cursor: pointer;\n  position: relative;\n}\n.rap-container .rap-slider .rap-progress {\n  background-color: #007fff;\n  border-radius: inherit;\n  position: absolute;\n  pointer-events: none;\n}\n.rap-container .rap-slider .rap-progress .rap-pin {\n  height: 16px;\n  width: 16px;\n  border-radius: 8px;\n  background-color: #007fff;\n  position: absolute;\n  pointer-events: all;\n  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);\n}\n.rap-container .rap-controls {\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  line-height: 18px;\n  display: flex;\n  flex-grow: 1;\n  justify-content: space-between;\n  align-items: center;\n  margin-left: 24px;\n  margin-right: 24px;\n}\n.rap-container .rap-controls .rap-slider {\n  margin-left: 12px;\n  margin-right: 12px;\n  border-radius: 2px;\n  height: 4px;\n}\n.rap-container .rap-controls .rap-slider .rap-progress {\n  width: 0;\n  height: 100%;\n}\n.rap-container .rap-controls .rap-slider .rap-progress .rap-pin {\n  right: -8px;\n  top: -6px;\n}\n.rap-container .rap-controls span {\n  cursor: default;\n}\n.rap-container .rap-volume {\n  position: relative;\n}\n.rap-container .rap-volume .rap-volume-btn {\n  cursor: pointer;\n}\n.rap-container .rap-volume .rap-volume-controls {\n  width: 30px;\n  height: 135px;\n  background-color: rgba(0, 0, 0, 0.62);\n  border-radius: 7px;\n  position: absolute;\n  left: -3px;\n  bottom: 52px;\n  flex-direction: column;\n  align-items: center;\n  display: flex;\n  z-index: 1;\n}\n.rap-container .rap-volume .rap-hidden {\n  display: none;\n}\n.rap-container .rap-volume .rap-vol-placement-top {\n  position: absolute;\n  left: 0;\n  top: 32px;\n}\n\n.rap-container .rap-volume .rap-vol-placement-bottom {\n  position: absolute;\n  left: 0;\n  top: 230px;\n}\n\n.rap-container .rap-volume .rap-volume-controls .rap-slider {\n  margin-top: 12px;\n  margin-bottom: 12px;\n  width: 6px;\n  border-radius: 3px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress {\n  bottom: 0;\n  height: 100%;\n  width: 6px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress .rap-pin {\n  left: -5px;\n  top: -8px;\n}\n\n.rap-container svg {\n  display: block;\n}\n\n.rap-backdrop {\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  top: 0;\n  left: 0;\n}\n\n@keyframes rapSpin {\n  from {\n    transform: rotateZ(0);\n  }\n  to {\n    transform: rotateZ(1turn);\n  }\n}\n",{});var v=function(d){var m=d.className,v=void 0===m?"":m,f=d.src,h=d.loop,g=void 0!==h&&h,w=d.preload,x=void 0===w?"auto":w,b=d.backgroundColor,E=d.color,A=d.width,k=d.style,y=d.sliderColor,N=d.volume,R=void 0===N?100:N,C=d.volumePlacement,T=void 0===C?"top":C,L=d.hasKeyBindings,z=void 0===L||L,M=d.onPlay,S=d.onPause,U=d.onEnd,D=d.onError,I=n(null),K=n(null),B=n(null),O=n(null),P=r("none"===x),F=P[0],Y=P[1],G=r(!1),W=G[0],X=G[1],j=r(0),J=j[0],H=j[1],Z=r("0:00"),V=Z[0],Q=Z[1],q=r("--:--"),_=q[0],$=q[1],ee=r(!1),ne=ee[0],re=ee[1],te=r(100),oe=te[0],ae=te[1],ie=r(function(e){if((e=isNaN(e)?100:Math.max(0,Math.min(e,100)))>=50)return a;if(e>5)return i;return c}(R)),ce=ie[0],le=ie[1],pe=r(0),ue=pe[0],se=pe[1],de=r(!1),me=de[0],ve=de[1];t((function(){if(!isNaN(R)){var e=R>100?100:R<0?0:R;ae(e),I.current&&(I.current.volume=e/100)}}),[R]);var fe=function(){I.current&&("none"!==x||I.current.duration||Y(!1),I.current.paused?(I.current.play(),X(!0),M&&M()):(I.current.pause(),X(!1),S&&S()))},he=function(e){var n,r,t=s(e,K.current),o=t.getBoundingClientRect();if("horizontal"===t.dataset.direction){if(n=(r=t.offsetLeft)+t.offsetWidth,e.clientX<r||e.clientX>n)return!1}else if(n=(r=o.top)+t.offsetHeight,e.clientY<r||e.clientY>n)return!1;return!0};function ge(e){var n=s(e,K.current),r=n.getBoundingClientRect(),t=0;if("horizontal"===n.dataset.direction)t=(e.clientX-n.offsetLeft)/n.clientWidth;else if("vertical"===n.dataset.direction){var o=n.clientHeight;t=1-(e.clientY-r.top)/o}return t}var we=function(e){if(he(e)&&I.current)if("none"!==x||I.current.duration){if(I.current.duration){var n=I.current.duration*ge(e);I.current.currentTime=n}}else Y(!1),I.current.load(),se(ge(e))},xe=function(e){he(e)&&I.current&&(I.current.volume=ge(e))},be=function(){K.current=B.current,window.addEventListener("mousemove",we,!1),window.addEventListener("mouseup",(function(){K.current=null,window.removeEventListener("mousemove",we,!1)}),{once:!0})},Ee=function(){K.current=O.current,window.addEventListener("mousemove",xe,!1),window.addEventListener("mouseup",(function(){K.current=null,window.removeEventListener("mousemove",xe,!1)}),!1)},Ae=function(e){if(I.current){var n=I.current.currentTime+I.current.duration*(e/100);I.current.currentTime=Math.min(n,I.current.duration)}},ke=function(e){I.current&&(I.current.volume=Math.max(0,Math.min(1,I.current.volume+e)))};return e.createElement("div",{tabIndex:-1,onKeyDown:function(e){if(z)switch(e.key){case"ArrowLeft":Ae(-5);break;case"ArrowRight":Ae(5);break;case"ArrowUp":ke(.05);break;case"ArrowDown":ke(-.05);break;case" ":fe()}},className:"rap-container ".concat(v),style:o(o(o(o({},b?{backgroundColor:b}:{}),E?{color:E}:{}),A?{width:A}:{}),k)},me&&e.createElement("span",{title:"An error has occurred",className:"rap-pp-button",onClick:function(){I.current&&(Y(!1),ve(!1),I.current.load())}},e.createElement("svg",{width:"24px",height:"24px",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",fill:"none",className:"rap-pp-icon"},e.createElement("path",{fill:null!=E?E:"#566574",d:"M7.248 1.307A.75.75 0 118.252.193l2.5 2.25a.75.75 0 010 1.114l-2.5 2.25a.75.75 0 01-1.004-1.114l1.29-1.161a4.5 4.5 0 103.655 2.832.75.75 0 111.398-.546A6 6 0 118.018 2l-.77-.693z"}))),!F&&!me&&e.createElement("div",{className:"rap-loading"},e.createElement("div",{className:"rap-spinner"})),F&&!me&&e.createElement("div",{className:"rap-pp-button",onClick:function(){return fe()}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"24",viewBox:"0 0 18 24",className:"rap-pp-icon"},e.createElement("path",{fill:null!=E?E:"#566574",fillRule:"evenodd",d:W?l:p}))),e.createElement("div",{className:"rap-controls"},e.createElement("span",{className:"rap-current-time"},V),e.createElement("div",{className:"rap-slider","data-direction":"horizontal",onMouseDown:be,onClick:we},e.createElement("div",{className:"rap-progress",style:o({width:J+"%"},y?{backgroundColor:y}:{})},e.createElement("div",{ref:B,className:"rap-pin","data-method":"rewind",onMouseDown:be,style:y?{backgroundColor:y}:{}}))),e.createElement("span",{className:"rap-total-time"},_)),e.createElement("div",{className:"rap-volume"},e.createElement("div",{className:"rap-volume-btn ".concat(ne?"rap-volume-open":""),onClick:function(){return re((function(e){return!e}))}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},e.createElement("path",{fill:ne?null!=y?y:"#007FFF":null!=E?E:"#566574",fillRule:"evenodd",d:ce}))),e.createElement("div",{className:"".concat("bottom"===T?"rap-vol-placement-bottom":"rap-vol-placement-top"," ").concat(ne?"":"rap-hidden")},e.createElement("div",{className:"rap-volume-controls",onClick:function(e){e.preventDefault(),e.stopPropagation()}},e.createElement("div",{className:"rap-slider","data-direction":"vertical",onClick:xe,onMouseDown:Ee},e.createElement("div",{className:"rap-progress",style:o({height:"".concat(oe,"%")},y?{backgroundColor:y}:{})},e.createElement("div",{ref:O,className:"rap-pin","data-method":"changeVolume",style:y?{backgroundColor:y}:{},onMouseDown:Ee})))),e.createElement("div",{className:"rap-backdrop",onClick:function(){return re(!1)}}))),e.createElement("audio",{ref:I,loop:g,preload:x,onCanPlay:function(){Y(!0)},onEnded:function(){X(!1),I.current&&(I.current.currentTime=0,U&&U())},onError:function(e){if(Y(!0),ve(!0),D){var n=e.target.error,r="An unknown error occurred.";if(null==n?void 0:n.code)switch(null==n?void 0:n.code){case n.MEDIA_ERR_ABORTED:r="The media playback was aborted.";break;case n.MEDIA_ERR_NETWORK:r="A network error caused the media to fail.";break;case n.MEDIA_ERR_DECODE:r="The media playback was aborted due to a decoding error.";break;case n.MEDIA_ERR_SRC_NOT_SUPPORTED:r="The media source format is not supported.";break;default:r="An unknown error occurred."}D(e,r)}},onLoadedMetadata:function(){var e,n;if(null===(e=I.current)||void 0===e?void 0:e.duration){$(u(null!==(n=I.current.duration)&&void 0!==n?n:0));var r=I.current.duration*ue;I.current.currentTime=r}},onTimeUpdate:function(){if(I.current){var e=I.current.currentTime,n=e/I.current.duration*100;H(n),Q(u(e))}},onVolumeChange:function(){I.current&&(ae(100*I.current.volume),I.current.volume>=.5?le(a):I.current.volume<.5&&I.current.volume>.05?le(i):I.current.volume<=.05&&le(c))}},e.createElement("source",{src:f,type:"audio/mpeg"})))};export{v as AudioPlayer};
+import e,{useRef as n,useState as r,useEffect as t}from"react";var o=function(){return o=Object.assign||function(e){for(var n,r=1,t=arguments.length;r<t;r++)for(var o in n=arguments[r])Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o]);return e},o.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var a="M14.667 0v2.747c3.853 1.146 6.666 4.72 6.666 8.946 0 4.227-2.813 7.787-6.666 8.934v2.76C20 22.173 24 17.4 24 11.693 24 5.987 20 1.213 14.667 0zM18 11.693c0-2.36-1.333-4.386-3.333-5.373v10.707c2-.947 3.333-2.987 3.333-5.334zm-18-4v8h5.333L12 22.36V1.027L5.333 7.693H0z",i="M0 7.667v8h5.333L12 22.333V1L5.333 7.667M17.333 11.373C17.333 9.013 16 6.987 14 6v10.707c2-.947 3.333-2.987 3.333-5.334z",c="M0 7.667v8h5.333L12 22.333V1L5.333 7.667",l="M0 0h6v24H0zM12 0h6v24h-6z",p="M18 12L0 24V0",u=function(e){var n=Math.floor(e/60),r=Math.floor(e%60);return n+":"+(r<10?"0"+r:r)};var s=function(e,n){var r,t,o,a=e.target;return"click"===e.type&&(o=a,-1!==Array.from(o.classList).indexOf("rap-pin"))&&(null===(r=null==a?void 0:a.parentElement)||void 0===r?void 0:r.parentElement)&&(a=a.parentElement.parentElement),"mousemove"===e.type&&(null===(t=null==n?void 0:n.parentElement)||void 0===t?void 0:t.parentElement)&&(a=n.parentElement.parentElement),a},d=[],m=[];!function(e,n){if(e&&"undefined"!=typeof document){var r,t=!0===n.prepend?"prepend":"append",o=!0===n.singleTag,a="string"==typeof n.container?document.querySelector(n.container):document.getElementsByTagName("head")[0];if(o){var i=d.indexOf(a);-1===i&&(i=d.push(a)-1,m[i]={}),r=m[i]&&m[i][t]?m[i][t]:m[i][t]=c()}else r=c();65279===e.charCodeAt(0)&&(e=e.substring(1)),r.styleSheet?r.styleSheet.cssText+=e:r.appendChild(document.createTextNode(e))}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),n.attributes)for(var r=Object.keys(n.attributes),o=0;o<r.length;o++)e.setAttribute(r[o],n.attributes[r[o]]);var i="prepend"===t?"afterbegin":"beforeend";return a.insertAdjacentElement(i,e),e}}(".rap-container {\n  width: 400px;\n  min-width: 300px;\n  height: 56px;\n  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.07);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-left: 24px;\n  padding-right: 24px;\n  border-radius: 4px;\n  user-select: none;\n  -webkit-user-select: none;\n  background-color: #fff;\n  color: #55606e;\n}\n.rap-container:focus {\n  outline: none;\n}\n.rap-container .rap-current-time,\n.rap-container .rap-total-time {\n  min-width: 40px;\n}\n.rap-container .rap-total-time {\n  text-align: right;\n}\n.rap-container .rap-pp-button {\n  cursor: pointer;\n}\n.rap-container .rap-spinner {\n  width: 18px;\n  height: 18px;\n  background-image: url('data:image/png;base64,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');\n  background-size: cover;\n  background-repeat: no-repeat;\n  animation: rapSpin 0.4s linear infinite;\n}\n.rap-container .rap-slider {\n  flex-grow: 1;\n  background-color: #d8d8d8;\n  cursor: pointer;\n  position: relative;\n}\n.rap-container .rap-slider .rap-progress {\n  background-color: #007fff;\n  border-radius: inherit;\n  position: absolute;\n  pointer-events: none;\n}\n.rap-container .rap-slider .rap-progress .rap-pin {\n  height: 16px;\n  width: 16px;\n  border-radius: 8px;\n  background-color: #007fff;\n  position: absolute;\n  pointer-events: all;\n  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);\n}\n.rap-container .rap-controls {\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  line-height: 18px;\n  display: flex;\n  flex-grow: 1;\n  justify-content: space-between;\n  align-items: center;\n  margin-left: 24px;\n  margin-right: 24px;\n}\n.rap-container .rap-controls .rap-slider {\n  margin-left: 12px;\n  margin-right: 12px;\n  border-radius: 2px;\n  height: 4px;\n}\n.rap-container .rap-controls .rap-slider .rap-progress {\n  width: 0;\n  height: 100%;\n}\n.rap-container .rap-controls .rap-slider .rap-progress .rap-pin {\n  right: -8px;\n  top: -6px;\n}\n.rap-container .rap-controls span {\n  cursor: default;\n}\n.rap-container .rap-volume {\n  position: relative;\n}\n.rap-container .rap-volume .rap-volume-btn {\n  cursor: pointer;\n}\n.rap-container .rap-volume .rap-volume-controls {\n  width: 30px;\n  height: 135px;\n  background-color: rgba(0, 0, 0, 0.62);\n  border-radius: 7px;\n  position: absolute;\n  left: -3px;\n  bottom: 52px;\n  flex-direction: column;\n  align-items: center;\n  display: flex;\n  z-index: 1;\n}\n.rap-container .rap-volume .rap-hidden {\n  display: none;\n}\n.rap-container .rap-volume .rap-vol-placement-top {\n  position: absolute;\n  left: 0;\n  top: 32px;\n}\n\n.rap-container .rap-volume .rap-vol-placement-bottom {\n  position: absolute;\n  left: 0;\n  top: 230px;\n}\n\n.rap-container .rap-volume .rap-volume-controls .rap-slider {\n  margin-top: 12px;\n  margin-bottom: 12px;\n  width: 6px;\n  border-radius: 3px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress {\n  bottom: 0;\n  height: 100%;\n  width: 6px;\n}\n.rap-container .rap-volume .rap-volume-controls .rap-slider .rap-progress .rap-pin {\n  left: -5px;\n  top: -8px;\n}\n\n.rap-container svg {\n  display: block;\n}\n\n.rap-backdrop {\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  top: 0;\n  left: 0;\n}\n\n@keyframes rapSpin {\n  from {\n    transform: rotateZ(0);\n  }\n  to {\n    transform: rotateZ(1turn);\n  }\n}\n",{});var v=function(d){var m=d.className,v=void 0===m?"":m,f=d.src,h=d.loop,g=void 0!==h&&h,w=d.preload,x=void 0===w?"auto":w,b=d.backgroundColor,E=d.color,A=d.width,k=d.style,y=d.sliderColor,N=d.volume,R=void 0===N?100:N,C=d.volumePlacement,T=void 0===C?"top":C,L=d.hasKeyBindings,z=void 0===L||L,M=d.onPlay,S=d.onPause,D=d.onEnd,U=d.onError,I=n(null),K=n(null),B=n(null),O=n(null),P=r("none"===x),F=P[0],Y=P[1],G=r(!1),W=G[0],X=G[1],j=r(0),J=j[0],H=j[1],Z=r("0:00"),V=Z[0],Q=Z[1],q=r("--:--"),_=q[0],$=q[1],ee=r(!1),ne=ee[0],re=ee[1],te=r(100),oe=te[0],ae=te[1],ie=r(function(e){if((e=isNaN(e)?100:Math.max(0,Math.min(e,100)))>=50)return a;if(e>5)return i;return c}(R)),ce=ie[0],le=ie[1],pe=r(0),ue=pe[0],se=pe[1],de=r(!1),me=de[0],ve=de[1];t((function(){if(!isNaN(R)){var e=R>100?100:R<0?0:R;ae(e),I.current&&(I.current.volume=e/100)}}),[R]);var fe=function(){I.current&&("none"!==x||I.current.duration||Y(!1),I.current.paused?(I.current.play(),X(!0),M&&M()):(I.current.pause(),X(!1),S&&S()))},he=function(e){var n,r,t=s(e,K.current),o=t.getBoundingClientRect();if("horizontal"===t.dataset.direction){if(n=(r=t.offsetLeft)+t.offsetWidth,e.clientX<r||e.clientX>n)return!1}else if(n=(r=o.top)+t.offsetHeight,e.clientY<r||e.clientY>n)return!1;return!0};function ge(e){var n=s(e,K.current),r=n.getBoundingClientRect(),t=0;if("horizontal"===n.dataset.direction)t=(e.clientX-n.offsetLeft)/n.clientWidth;else if("vertical"===n.dataset.direction){var o=n.clientHeight;t=1-(e.clientY-r.top)/o}return t}var we=function(e){if(he(e)&&I.current)if("none"!==x||I.current.duration){if(I.current.duration){var n=I.current.duration*ge(e);I.current.currentTime=n}}else Y(!1),I.current.load(),se(ge(e))},xe=function(e){he(e)&&I.current&&(I.current.volume=ge(e))},be=function(){K.current=B.current,window.addEventListener("mousemove",we,!1),window.addEventListener("mouseup",(function(){K.current=null,window.removeEventListener("mousemove",we,!1)}),{once:!0})},Ee=function(){K.current=O.current,window.addEventListener("mousemove",xe,!1),window.addEventListener("mouseup",(function(){K.current=null,window.removeEventListener("mousemove",xe,!1)}),!1)},Ae=function(e){if(I.current){var n=I.current.currentTime+I.current.duration*(e/100);I.current.currentTime=Math.min(n,I.current.duration)}},ke=function(e){I.current&&(I.current.volume=Math.max(0,Math.min(1,I.current.volume+e)))};return e.createElement("div",{tabIndex:-1,onKeyDown:function(e){if(z)switch(e.preventDefault(),e.key){case"ArrowLeft":Ae(-5);break;case"ArrowRight":Ae(5);break;case"ArrowUp":ke(.05);break;case"ArrowDown":ke(-.05);break;case" ":fe()}},className:"rap-container ".concat(v),style:o(o(o(o({},b?{backgroundColor:b}:{}),E?{color:E}:{}),A?{width:A}:{}),k)},me&&e.createElement("span",{title:"An error has occurred",className:"rap-pp-button",onClick:function(){I.current&&(Y(!1),ve(!1),I.current.load())}},e.createElement("svg",{width:"24px",height:"24px",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",fill:"none",className:"rap-pp-icon"},e.createElement("path",{fill:null!=E?E:"#566574",d:"M7.248 1.307A.75.75 0 118.252.193l2.5 2.25a.75.75 0 010 1.114l-2.5 2.25a.75.75 0 01-1.004-1.114l1.29-1.161a4.5 4.5 0 103.655 2.832.75.75 0 111.398-.546A6 6 0 118.018 2l-.77-.693z"}))),!F&&!me&&e.createElement("div",{className:"rap-loading"},e.createElement("div",{className:"rap-spinner"})),F&&!me&&e.createElement("div",{className:"rap-pp-button",onClick:function(){return fe()}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"24",viewBox:"0 0 18 24",className:"rap-pp-icon"},e.createElement("path",{fill:null!=E?E:"#566574",fillRule:"evenodd",d:W?l:p}))),e.createElement("div",{className:"rap-controls"},e.createElement("span",{className:"rap-current-time"},V),e.createElement("div",{className:"rap-slider","data-direction":"horizontal",onMouseDown:be,onClick:we},e.createElement("div",{className:"rap-progress",style:o({width:J+"%"},y?{backgroundColor:y}:{})},e.createElement("div",{ref:B,className:"rap-pin","data-method":"rewind",onMouseDown:be,style:y?{backgroundColor:y}:{}}))),e.createElement("span",{className:"rap-total-time"},_)),e.createElement("div",{className:"rap-volume"},e.createElement("div",{className:"rap-volume-btn ".concat(ne?"rap-volume-open":""),onClick:function(){return re((function(e){return!e}))}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},e.createElement("path",{fill:ne?null!=y?y:"#007FFF":null!=E?E:"#566574",fillRule:"evenodd",d:ce}))),e.createElement("div",{className:"".concat("bottom"===T?"rap-vol-placement-bottom":"rap-vol-placement-top"," ").concat(ne?"":"rap-hidden")},e.createElement("div",{className:"rap-volume-controls",onClick:function(e){e.preventDefault(),e.stopPropagation()}},e.createElement("div",{className:"rap-slider","data-direction":"vertical",onClick:xe,onMouseDown:Ee},e.createElement("div",{className:"rap-progress",style:o({height:"".concat(oe,"%")},y?{backgroundColor:y}:{})},e.createElement("div",{ref:O,className:"rap-pin","data-method":"changeVolume",style:y?{backgroundColor:y}:{},onMouseDown:Ee})))),e.createElement("div",{className:"rap-backdrop",onClick:function(){return re(!1)}}))),e.createElement("audio",{ref:I,loop:g,preload:x,onCanPlay:function(){Y(!0)},onEnded:function(){X(!1),I.current&&(I.current.currentTime=0,D&&D())},onError:function(e){if(Y(!0),ve(!0),U){var n=e.target.error,r="An unknown error occurred.";if(null==n?void 0:n.code)switch(null==n?void 0:n.code){case n.MEDIA_ERR_ABORTED:r="The media playback was aborted.";break;case n.MEDIA_ERR_NETWORK:r="A network error caused the media to fail.";break;case n.MEDIA_ERR_DECODE:r="The media playback was aborted due to a decoding error.";break;case n.MEDIA_ERR_SRC_NOT_SUPPORTED:r="The media source format is not supported.";break;default:r="An unknown error occurred."}U(e,r)}},onLoadedMetadata:function(){var e,n;if(null===(e=I.current)||void 0===e?void 0:e.duration){$(u(null!==(n=I.current.duration)&&void 0!==n?n:0));var r=I.current.duration*ue;I.current.currentTime=r}},onTimeUpdate:function(){if(I.current){var e=I.current.currentTime,n=e/I.current.duration*100;H(n),Q(u(e))}},onVolumeChange:function(){I.current&&(ae(100*I.current.volume),I.current.volume>=.5?le(a):I.current.volume<.5&&I.current.volume>.05?le(i):I.current.volume<=.05&&le(c))}},e.createElement("source",{src:f,type:"audio/mpeg"})))};export{v as AudioPlayer};
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "react-audio-play",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "description": "React audio player component",
@@ -5,0 +5,0 @@ "homepage": "https://riyaddecoder.github.io/react-audio-play/",

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

108038

increased by0.06%

No dependency changes