react-voice-visualizer/dist/react-voice-visualizer.umd.cjs

React library for audio recording and visualization using Web Audio API

(function(){"use strict";(r=>{var o;try{if(typeof window>"u")return;var e=document.createElement("style");e.appendChild(document.createTextNode(r));const i=(o=document.querySelector('meta[property="csp-nonce"]'))==null?void 0:o.getAttribute("nonce");i&&e.setAttribute("nonce",i),document.head.appendChild(e)}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})(".voice-visualizer__buttons-container{display:flex;justify-content:center;align-items:center;column-gap:20px;row-gap:15px;flex-wrap:wrap;margin-bottom:40px}.voice-visualizer__btn-center{box-sizing:border-box;flex-shrink:0;width:60px;height:60px;padding:0;display:flex;justify-content:center;align-items:center;border-radius:50%;background-color:#fff;border:4px solid #c5c5c5;outline:none;cursor:pointer;transition:border-color .3s,background-color .3s}.voice-visualizer__btn-center:disabled{opacity:.85;cursor:default}.voice-visualizer__btn-center:hover{background-color:#eaeaea;border:4px solid #9f9f9f}.voice-visualizer__btn-center>img{width:auto;height:50%;max-height:30px}.voice-visualizer__btn-center.voice-visualizer__btn-center-pause{background-color:#ff3030}.voice-visualizer__btn-center.voice-visualizer__btn-center-pause:hover{background-color:#ff4f4f}.voice-visualizer__btn-center.voice-visualizer__btn-center-pause>img{height:50%;max-height:16px}.voice-visualizer__btn-center.voice-visualizer__btn-center--border-transparent{border-color:transparent}.voice-visualizer__btn-center.voice-visualizer__btn-center--border-transparent:hover{background-color:#fff}.voice-visualizer__btn-left{box-sizing:border-box;flex-shrink:0;width:60px;height:60px;padding:0;display:flex;justify-content:center;align-items:center;border-radius:50%;background-color:#ff3030;border:4px solid #c5c5c5;outline:none;cursor:pointer;transition:border-color .3s,background-color .3s,opacity .3s}.voice-visualizer__btn-container{min-width:100px;display:flex;justify-content:flex-end}.voice-visualizer__btn-left:hover{background-color:#ff4f4f}.voice-visualizer__btn-left:disabled{opacity:.6;background-color:#ff3030;cursor:default}.voice-visualizer__btn-left.voice-visualizer__btn-left-microphone{background-color:#fff}.voice-visualizer__btn-left.voice-visualizer__btn-left-microphone>img{width:auto;height:50%;max-height:30px}.voice-visualizer__btn-left>img{width:auto;height:50%;max-height:16px}.voice-visualizer__btn-left:hover{border:4px solid #9f9f9f}.voice-visualizer__btn{box-sizing:border-box;min-width:100px;min-height:60px;padding:5px 20px;border-radius:40px;font-size:15px;background-color:#f0f0f0;transition:background-color .3s,opacity .3s}.voice-visualizer__btn:disabled{opacity:.8;background-color:#f0f0f0;cursor:default}.voice-visualizer__btn:hover{background-color:#bebebe}.voice-visualizer__canvas-container{position:relative;width:fit-content;margin:0 auto;overflow:hidden}.voice-visualizer__canvas-container canvas{display:block}.voice-visualizer__canvas-microphone-btn{position:absolute;top:50%;left:50%;width:auto;max-width:12%;min-width:24px;height:50%;max-height:100px;background-color:transparent;border:none;outline:none;transform:translate(-50%,-50%)}.voice-visualizer__canvas-microphone-icon{width:100%;height:100%;will-change:transform;transition:transform .3s}.voice-visualizer__canvas-microphone-btn:hover .voice-visualizer__canvas-microphone-icon{transform:scale(1.03)}.voice-visualizer__canvas-audio-wave-icon{position:absolute;top:50%;left:50%;width:auto;max-width:40%;height:40%;max-height:100px;transform:translate(-118%,-50%) scale(-1)}.voice-visualizer__canvas-audio-wave-icon2{transform:translate(18%,-50%)}.voice-visualizer__canvas-audio-processing{position:absolute;top:50%;left:50%;margin:0;transform:translate(-50%,-50%)}.voice-visualizer__progress-indicator-hovered{position:absolute;top:0;pointer-events:none;height:100%;width:1px;background-color:#85858599}.voice-visualizer__progress-indicator-hovered-time{position:absolute;top:3%;left:1px;width:fit-content;margin:0;padding:0 7px;opacity:.8;font-size:12px;border-radius:0 4px 4px 0;background-color:#575757;text-align:left}.voice-visualizer__progress-indicator-hovered-time.voice-visualizer__progress-indicator-hovered-time-left{left:unset;right:1px;border-radius:4px 0 0 4px}.voice-visualizer__progress-indicator{position:absolute;top:0;pointer-events:none;height:100%;width:1px;background-color:#efefef}.voice-visualizer__progress-indicator-time{position:absolute;top:3%;left:1px;width:fit-content;box-sizing:border-box;min-width:37px;margin:0;padding:0 7px;font-size:12px;border-radius:0 4px 4px 0;text-align:left;color:#000;font-weight:500;background-color:#efefef}.voice-visualizer__progress-indicator-time.voice-visualizer__progress-indicator-time-left{left:unset;right:1px;border-radius:4px 0 0 4px}.voice-visualizer__audio-info-container{box-sizing:border-box;height:55px;display:flex;align-items:center;justify-content:center;gap:30px}.voice-visualizer__audio-info-time{margin:15px 0;min-width:38px;text-align:left}.voice-visualizer__visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:4px solid #c5c5c5;white-space:nowrap;clip-path:inset(100%);clip:rect(0 0 0 0);overflow:hidden}.voice-visualizer__relative{position:relative}.voice-visualizer__spinner-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;display:flex;justify-content:center;align-items:center}.voice-visualizer__spinner{flex-shrink:0;width:100%;height:100%;border:4px solid rgba(197,197,197,.5);border-radius:50%;border-top-color:#b7b7b7;animation:voice-visualizer__spin 1s ease-in-out infinite;-webkit-animation:voice-visualizer__spin 1s ease-in-out infinite}@keyframes voice-visualizer__spin{to{transform:rotate(360deg)}}@-webkit-keyframes voice-visualizer__spin{to{transform:rotate(360deg)}}")})();
(function(x,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],c):(x=typeof globalThis<"u"?globalThis:x||self,c(x["react-voice-visualizer"]={},x["react/jsx-runtime"],x.React))})(this,function(x,c,t){"use strict";const be=({canvas:e,backgroundColor:r})=>{const n=e.height,i=e.width,o=Math.round(i/2),h=e.getContext("2d");return h?(h.clearRect(0,0,i,n),r!=="transparent"&&(h.fillStyle=r,h.fillRect(0,0,i,n)),{context:h,height:n,width:i,halfWidth:o}):null},we=({context:e,color:r,rounded:n,x:i,y:o,w:h,h:L})=>{e.fillStyle=r,e.beginPath(),e.roundRect?(e.roundRect(i,o,h,L,n),e.fill()):e.fillRect(i,o,h,L)},Ve=({barsData:e,canvas:r,barWidth:n,gap:i,backgroundColor:o,mainBarColor:h,secondaryBarColor:L,currentAudioTime:l=0,rounded:S,duration:m})=>{const w=be({canvas:r,backgroundColor:o});if(!w)return;const{context:z,height:g}=w,N=l/m;e.forEach((v,f)=>{const p=f/e.length,a=N>p;we({context:z,color:a?L:h,rounded:S,x:f*(n+i*n),y:g/2-v.max,h:v.max*2,w:n})})};function Je({context:e,color:r,rounded:n,width:i,height:o,barWidth:h}){we({context:e,color:r,rounded:n,x:i/2+h/2,y:o/2-1,h:2,w:i-(i/2+h/2)})}const Qe=({audioData:e,unit:r,index:n,index2:i,canvas:o,isRecordingInProgress:h,isPausedRecording:L,picks:l,backgroundColor:S,barWidth:m,mainBarColor:w,secondaryBarColor:z,rounded:g,animateCurrentPick:N,fullscreen:v})=>{const f=be({canvas:o,backgroundColor:S});if(!f)return;const{context:p,height:a,width:H,halfWidth:P}=f;if(e!=null&&e.length&&h){const $=Math.max(...e);if(!L){if(i.current>=m){i.current=0;const y=(a-$/258*a)/a*100,Q=(-a+$/258*a*2)/a*100,re=n.current===m?{startY:y,barHeight:Q}:null;n.current>=r?n.current=m:n.current+=m,l.length>(v?H:P)/m&&l.pop(),l.unshift(re)}i.current+=1}!v&&Y(),N&&we({context:p,rounded:g,color:w,x:v?H:P,y:a-$/258*a,h:-a+$/258*a*2,w:m});let G=(v?H:P)-i.current;l.forEach(y=>{y&&we({context:p,color:w,rounded:g,x:G,y:y.startY*a/100>a/2-1?a/2-1:y.startY*a/100,h:y.barHeight*a/100>2?y.barHeight*a/100:2,w:m}),G-=m})}else l.length=0;function Y(){Je({context:p,color:z,rounded:g,width:H,height:a,barWidth:m})}},$e=e=>{const r=Math.floor(e/3600),n=Math.floor(e%3600/60),i=e%60,o=Math.floor((i-Math.floor(i))*1e3);return r>0?`${String(r).padStart(2,"0")}:${String(n).padStart(2,"0")}:${String(Math.floor(i)).padStart(2,"0")}:${String(o).charAt(0)}`:n>0?`${String(n).padStart(2,"0")}:${String(Math.floor(i)).padStart(2,"0")}:${String(o).charAt(0)}`:`${String(Math.floor(i)).padStart(2,"0")}:${String(o).charAt(0)}`},qe=e=>{const r=Math.floor(e/1e3),n=Math.floor(r/3600),i=Math.floor(r%3600/60),o=r%60;return n>0?`${String(n).padStart(2,"0")}:${String(i).padStart(2,"0")}:${String(o).padStart(2,"0")}`:`${String(i).padStart(2,"0")}:${String(o).padStart(2,"0")}`};function Oe(e){if(typeof e=="string"){const r=Number(e);if(!Number.isNaN(r))return`${Math.trunc(r/2)*2}px`}return e}const Re=({bufferData:e,height:r,width:n,barWidth:i,gap:o})=>{const h=n/(i+o*i),L=Math.floor(e.length/h),l=r/2;let S=[],m=0;for(let w=0;w<h;w++){const z=[];let g=0;for(let v=0;v<L&&w*L+v<e.length;v++){const f=e[w*L+v];f>0&&(z.push(f),g++)}const N=z.reduce((v,f)=>v+f,0)/g;N>m&&(m=N),S.push({max:N})}if(l*.95>m*l){const w=l*.95/m;S=S.map(z=>({max:z.max>.01?z.max*w:1}))}return S},Xe=e=>{if(!e)return"";const r=e.match(/audio\/([^;]+)/);return r&&r.length>=2?`.${r[1]}`:""},Ke=e=>{const r=Math.floor(e/3600),n=Math.floor(e%3600/60),i=e%60,o=Math.floor((i-Math.floor(i))*1e3);return r>0?`${String(r).padStart(2,"0")}:${String(n).padStart(2,"0")}:${String(Math.floor(i)).padStart(2,"0")}}h`:n>0?`${String(n).padStart(2,"0")}:${String(Math.floor(i)).padStart(2,"0")}m`:`${String(Math.floor(i)).padStart(2,"0")}:${String(o).charAt(0)}${String(o).charAt(1)}s`},et=e=>{onmessage=r=>{postMessage(e(r.data))}};function tt({fn:e,initialValue:r,onMessageReceived:n}){const[i,o]=t.useState(r);return{result:i,setResult:o,run:L=>{const l=new Worker(URL.createObjectURL(new Blob([`(${et})(${e})`])));l.onmessage=S=>{S.data&&(o(S.data),n&&n(),l.terminate())},l.onerror=S=>{console.error(S.message),l.terminate()},l.postMessage(L)}}}const rt=(e,r=250)=>{const n=t.useRef();return t.useCallback((...i)=>{const o=()=>{clearTimeout(n.current),e(...i)};clearTimeout(n.current),n.current=setTimeout(o,r)},[e,r])},mt="",nt=({color:e="#000000",stroke:r=2,className:n})=>c.jsx("svg",{viewBox:"0 0 23 33",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,children:c.jsx("path",{d:"M1.1 16.72c0 3 .96 5.8 3.61 7.95a9.96 9.96 0 0 0 6.5 2.17m0 0v4.34h4.34-8.67m4.34-4.34c2.35 0 4.42-.48 6.5-2.17a9.87 9.87 0 0 0 3.61-7.95M11.22 1.82c-1.45 0-2.5.37-3.3.93a5.6 5.6 0 0 0-1.84 2.4c-.9 2.06-1.1 4.77-1.1 7.24 0 2.46.2 5.17 1.1 7.24a5.6 5.6 0 0 0 1.84 2.4c.8.55 1.85.92 3.3.92 1.44 0 2.5-.37 3.29-.93a5.6 5.6 0 0 0 1.84-2.4c.9-2.06 1.1-4.77 1.1-7.23 0-2.47-.2-5.18-1.1-7.24a5.6 5.6 0 0 0-1.84-2.4 5.52 5.52 0 0 0-3.3-.93Z",stroke:e,strokeWidth:r,strokeLinecap:"round",strokeLinejoin:"round"})}),Ze=({color:e="#FFFFFF",reflect:r})=>c.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0.92 17.54 48.27 14.92",className:`voice-visualizer__canvas-audio-wave-icon ${r?"voice-visualizer__canvas-audio-wave-icon2":""}`,children:c.jsx("path",{d:"M.92 24.63h.21v.75H.92zm.42-1.39h.21v3.52h-.21zm.43.68h.21v2.17h-.21zM2.2 22h.21v6.01H2.2zm.43-1.27h.21v8.55h-.21zm.43 2.07h.21v4.4h-.21zm.43 1.22h.21v1.97h-.21zm.43.47h.21v1.03h-.21zm.43-1.66h.21v4.35h-.21zm.43-1.74h.21v7.82h-.21zm.43 1.94h.21v3.94h-.21zm.43 1.07h.21v1.81h-.21zm.42-.94h.21v3.68h-.21zm.43.91h.21v1.86h-.21zm.43-.23h.21v2.33h-.21zm.43.46h.21v1.4h-.21zm.43-.7h.21v2.8h-.21zm.43-1.6h.21v6.01h-.21zm.43-2.23h.21v10.46h-.21zm.43-1.4h.21v13.26h-.21zm.43.62h.21v12.02H9.5zm.43 1.64h.21v8.75h-.21zm.43 1.37h.21v6.01h-.21zm.43-1.87H11v9.74h-.21zm.42 1.32h.21v7.1h-.21zm.43-2.64h.21v12.38h-.21zm.43 1.61h.21v9.17h-.21zM12.5 22h.21v6.01h-.21zm.43 1.32h.21v3.37h-.21zm.43-2.51h.21v8.39h-.21zm.43.59H14v7.2h-.21zm.43 1.79h.21v3.62h-.21zm.43.41h.21v2.8h-.21zm.43.57h.21v1.66h-.21zm.43-1.11h.21v3.88h-.21zm.42-2.98h.21v9.84h-.21zm.43 1.06h.21v7.72h-.21zm.43 3.19H17v1.35h-.21zm.86-2.33h.21v6.01h-.21zm-.43 1.4h.21v3.21h-.21zm1.29.15h.21v2.9h-.21zm.43.68h.21v1.55h-.21zm-.86-.76h.21v3.05h-.21zm1.29-.05h.21v3.16h-.21zm.43-.64h.21v4.45h-.21zm.43.38h.21v3.68h-.21zm.42-.49h.21v4.66h-.21zm.43 1.32h.21v2.02h-.21zm.43.37h.21v1.29h-.21zm.43.31h.21v.67h-.21zm.43-.39h.21v1.45h-.21zm.43-1.35h.21v4.14h-.21zm.86.73h.21v2.69h-.21zm-.43.44h.21v1.81h-.21zm1.29-3.45h.21v8.7h-.21zm.43 1.71h.21v5.28h-.21zm-.86-2.3h.21v9.89h-.21zm1.29 3.36h.21v3.16h-.21zM25.8 22h.21v6.01h-.21zm.43 1.42h.21v3.16h-.21zm.43.88h.21v1.4h-.21zm.43-.93h.21v3.26h-.21zm.43-1.37h.21v6.01h-.21zm.43-.93h.21v7.87h-.21zm.43-.76h.21v9.38h-.21zm.43 1.69h.21v6.01h-.21zm.86 1.92h.21v2.17h-.21zm-.43-.6h.21v3.37h-.21zm1.28.05h.21v3.26h-.21zm.43.67h.21v1.91h-.21zm-.85-.51h.21v2.95h-.21zm1.28-.13h.21v3.21h-.21zm.43-1.4h.21v6.01h-.21zm.43-.99h.21v7.98h-.21zm.43 1.77h.21v4.45h-.21zm.43-1.22h.21v6.89h-.21zm.43 1.6h.21v3.68h-.21zm.43-.28h.21v4.25h-.21zm.43-.6h.21v5.44h-.21zm.43-.28h.21v6.01h-.21zm.85 2.02h.21v1.97h-.21zm-.43-.57h.21v3.11h-.21zm1.29.93h.21v1.24h-.21zm.43-.65h.21v2.54h-.21zm-.86-.28h.21v3.11h-.21zm1.29.83h.21v1.45h-.21zm.43-.99h.21v3.42h-.21zm.43-.1h.21v3.62h-.21zm.43-.7h.21v5.02h-.21zm.43.8h.21v3.42h-.21zm.43-1.29h.21v6.01h-.21zm.42-1.71h.21v9.43h-.21zm.43 2.38h.21v4.66h-.21zm.43.65h.21v3.37h-.21zm.86.08h.21v3.21h-.21zm-.43.54h.21v2.12h-.21zm1.29-.05h.21v2.23h-.21zm.43.28h.21v1.66h-.21zm-.86.16h.21v1.35h-.21zm1.29.21h.21v.93h-.21zm.43-6.04h.21v13h-.21zm.43.8h.21v11.4h-.21zm.43-1.76h.21v14.92h-.21zm.42 1.09h.21v12.74h-.21zm.43 1.17h.21v10.41h-.21zm.43 1.32h.21v7.77h-.21zm.43 1.6h.21v4.56h-.21zm.43 1.17h.21v2.23h-.21zm.86-.08h.21v2.38h-.21zm-.43-.34h.21v3.05h-.21zm1.29-.1h.21v3.26h-.21zm.43.93h.21v1.4h-.21zm-.86-.02h.21v1.45h-.21z",fill:e})}),Fe="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjMiIGhlaWdodD0iMzMiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTEuMSAxNi43MmMwIDMgLjk2IDUuOCAzLjYxIDcuOTVhOS45NiA5Ljk2IDAgMCAwIDYuNSAyLjE3bTAgMHY0LjM0aDQuMzQtOC42N200LjM0LTQuMzRjMi4zNSAwIDQuNDItLjQ4IDYuNS0yLjE3YTkuODcgOS44NyAwIDAgMCAzLjYxLTcuOTVNMTEuMjIgMS44MmMtMS40NSAwLTIuNS4zNy0zLjMuOTNhNS42IDUuNiAwIDAgMC0xLjg0IDIuNGMtLjkgMi4wNi0xLjEgNC43Ny0xLjEgNy4yNCAwIDIuNDYuMiA1LjE3IDEuMSA3LjI0YTUuNiA1LjYgMCAwIDAgMS44NCAyLjRjLjguNTUgMS44NS45MiAzLjMuOTIgMS40NCAwIDIuNS0uMzcgMy4yOS0uOTNhNS42IDUuNiAwIDAgMCAxLjg0LTIuNGMuOS0yLjA2IDEuMS00Ljc3IDEuMS03LjIzIDAtMi40Ny0uMi01LjE4LTEuMS03LjI0YTUuNiA1LjYgMCAwIDAtMS44NC0yLjQgNS41MiA1LjUyIDAgMCAwLTMuMy0uOTNaIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K",it="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTE4Ljc1IDYuMTZjNC4zMSAyLjYgNi40NiAzLjkgNi40NiA1Ljg0IDAgMS45NS0yLjE1IDMuMjQtNi40NiA1Ljg0bC00Ljg0IDIuOTJjLTQuMzEgMi42LTYuNDYgMy44OS04LjA4IDIuOTItMS42Mi0uOTgtMS42Mi0zLjU3LTEuNjItOC43NlY5LjA4YzAtNS4xOSAwLTcuNzggMS42Mi04Ljc2IDEuNjItLjk3IDMuNzcuMzMgOC4wOCAyLjkybDQuODQgMi45MloiIGZpbGw9IiNmZmYiLz4KPC9zdmc+Cg==",Ue="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTE0IDMuNWEzLjUgMy41IDAgMSAxIDcgMHYyMmEzLjUgMy41IDAgMSAxLTcgMHYtMjJaIiBmaWxsPSIjZmZmIi8+CiAgPHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjkiIHJ4PSIzLjUiIGZpbGw9IiNmZmYiLz4KPC9zdmc+Cg==",st="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHJlY3QgeD0iLjIxIiB3aWR0aD0iMjYiIGhlaWdodD0iMjUiIHJ4PSI1IiBmaWxsPSIjZmZmIi8+Cjwvc3ZnPgo=",ct=({controls:{audioRef:e,audioData:r,isRecordingInProgress:n,recordedBlob:i,duration:o,currentAudioTime:h,audioSrc:L,bufferFromRecordedBlob:l,togglePauseResume:S,startRecording:m,stopRecording:w,saveAudioFile:z,isAvailableRecordedAudio:g,isPausedRecordedAudio:N,isPausedRecording:v,isProcessingStartRecording:f,isProcessingRecordedAudio:p,isCleared:a,formattedDuration:H,formattedRecordingTime:P,formattedRecordedAudioCurrentTime:Y,clearCanvas:$,setCurrentAudioTime:G,isProcessingOnResize:y,_setIsProcessingOnResize:Q,_setIsProcessingAudioOnComplete:re},width:B="100%",height:me=200,speed:ne=3,backgroundColor:W="transparent",mainBarColor:b="#FFFFFF",secondaryBarColor:O="#5e5e5e",barWidth:ie=2,gap:Ne=1,rounded:Z=5,isControlPanelShown:se=!0,isDownloadAudioButtonShown:q=!1,animateCurrentPick:ce=!0,fullscreen:oe=!1,onlyRecording:R=!1,isDefaultUIShown:fe=!0,defaultMicrophoneIconColor:Ee=b,defaultAudioWaveIconColor:de=b,mainContainerClassName:ze,canvasContainerClassName:ue,isProgressIndicatorShown:ye=!R,progressIndicatorClassName:ae,isProgressIndicatorTimeShown:I=!0,progressIndicatorTimeClassName:F,isProgressIndicatorOnHoverShown:X=!R,progressIndicatorOnHoverClassName:he,isProgressIndicatorTimeOnHoverShown:K=!0,progressIndicatorTimeOnHoverClassName:T,isAudioProcessingTextShown:E=!0,audioProcessingTextClassName:u,controlButtonsClassName:ge})=>{const[Me,_e]=t.useState(0),[A,Ce]=t.useState(0),[le,Ae]=t.useState(0),[Se,xe]=t.useState(0),[k,ve]=t.useState(!1),[je,He]=t.useState(window.innerWidth),[Te,V]=t.useState(!1),De=je<768,ee=Math.trunc(ne),te=Math.trunc(Ne),_=Math.trunc(De&&te>0?ie+1:ie),pe=_+te*_,M=t.useRef(null),s=t.useRef([]),d=t.useRef(ee),U=t.useRef(_),J=t.useRef(_),C=t.useRef(null),{result:Ie,setResult:ut,run:at}=tt({fn:Re,initialValue:[],onMessageReceived:lt}),ht=rt(Pe);t.useEffect(()=>{if(!C.current)return;const j=()=>{He(window.innerWidth),g?(Q(!0),V(!0),ht()):Pe()},D=new ResizeObserver(j);return D.observe(C.current),()=>{D.disconnect()}},[B,g]),t.useLayoutEffect(()=>{M.current&&((d.current>=ee||!r.length)&&(d.current=r.length?0:ee,Qe({audioData:r,unit:pe,index:U,index2:J,canvas:M.current,picks:s.current,isRecordingInProgress:n,isPausedRecording:v,backgroundColor:W,mainBarColor:b,secondaryBarColor:O,barWidth:_,rounded:Z,animateCurrentPick:ce,fullscreen:oe})),d.current+=1)},[M.current,r,_,W,b,O,Z,oe,fe,Se]),t.useEffect(()=>{var j,D;if(g)return k?(j=M.current)==null||j.addEventListener("mouseleave",Ge):(D=M.current)==null||D.addEventListener("mouseenter",Ye),()=>{var Le,ke;k?(Le=M.current)==null||Le.removeEventListener("mouseleave",Ge):(ke=M.current)==null||ke.removeEventListener("mouseenter",Ye)}},[k,g]),t.useEffect(()=>{var D;if(!l||!M.current||n||Te)return;if(R){$();return}s.current=[];const j=l.getChannelData(0);return at({bufferData:j,height:le,width:Se,barWidth:_,gap:te}),(D=M.current)==null||D.addEventListener("mousemove",Be),()=>{var Le;(Le=M.current)==null||Le.removeEventListener("mousemove",Be)}},[l,A,le,Ne,ie,Te]),t.useEffect(()=>{if(!(R||!(Ie!=null&&Ie.length)||!M.current||p)){if(a){ut([]);return}Ve({barsData:Ie,canvas:M.current,barWidth:_,gap:te,backgroundColor:W,mainBarColor:b,secondaryBarColor:O,currentAudioTime:h,rounded:Z,duration:o})}},[Ie,h,a,Z,W,b,O]),t.useEffect(()=>{p&&M.current&&be({canvas:M.current,backgroundColor:W})},[p]);function Pe(){if(!C.current||!M.current)return;d.current=ee;const j=Math.trunc(C.current.clientHeight*window.devicePixelRatio/2)*2;Ce(C.current.clientWidth),Ae(j),xe(Math.round(C.current.clientWidth*window.devicePixelRatio)),V(!1)}function lt(){Q(!1),re(!1),e!=null&&e.current&&!y&&(e.current.src=L)}const Ye=()=>{ve(!0)},Ge=()=>{ve(!1)},Be=j=>{_e(j.offsetX)},vt=j=>{if(e!=null&&e.current&&M.current){const D=o/A*(j.clientX-M.current.getBoundingClientRect().left);e.current.currentTime=D,G(D)}},We=h/o*A;return c.jsxs("div",{className:`voice-visualizer ${ze??""}`,children:[c.jsxs("div",{className:`voice-visualizer__canvas-container ${ue??""}`,ref:C,style:{width:Oe(B)},children:[c.jsx("canvas",{ref:M,width:Se,height:le,onClick:vt,style:{height:Oe(me),width:A},children:"Your browser does not support HTML5 Canvas."}),fe&&a&&c.jsxs(c.Fragment,{children:[c.jsx(Ze,{color:de}),c.jsx(Ze,{color:de,reflect:!0}),c.jsx("button",{type:"button",onClick:m,className:"voice-visualizer__canvas-microphone-btn",children:c.jsx(nt,{color:Ee,stroke:.5,className:"voice-visualizer__canvas-microphone-icon"})})]}),E&&p&&c.jsx("p",{className:`voice-visualizer__canvas-audio-processing ${u??""}`,style:{color:b},children:"Processing Audio..."}),k&&g&&!p&&!De&&X&&c.jsx("div",{className:`voice-visualizer__progress-indicator-hovered ${he??""}`,style:{left:Me},children:K&&c.jsx("p",{className:`voice-visualizer__progress-indicator-hovered-time 
                    ${A-Me<70?"voice-visualizer__progress-indicator-hovered-time-left":""} 
                    ${T??""}`,children:$e(o/A*Me)})}),ye&&g&&!p&&o?c.jsx("div",{className:`voice-visualizer__progress-indicator ${ae??""}`,style:{left:We<A-1?We:A-1},children:I&&c.jsx("p",{className:`voice-visualizer__progress-indicator-time ${A-h*A/o<70?"voice-visualizer__progress-indicator-time-left":""} ${F??""}`,children:Y})}):null]}),se&&c.jsxs(c.Fragment,{children:[c.jsxs("div",{className:"voice-visualizer__audio-info-container",children:[n&&c.jsx("p",{className:"voice-visualizer__audio-info-time",children:P}),o&&!p?c.jsx("p",{children:H}):null]}),c.jsxs("div",{className:"voice-visualizer__buttons-container",children:[n&&c.jsx("div",{className:"voice-visualizer__btn-container",children:c.jsx("button",{type:"button",className:`voice-visualizer__btn-left ${v?"voice-visualizer__btn-left-microphone":""}`,onClick:S,children:c.jsx("img",{src:v?Fe:Ue,alt:v?"Play":"Pause"})})}),!a&&c.jsx("button",{type:"button",className:`voice-visualizer__btn-left ${n||f?"voice-visualizer__visually-hidden":""}`,onClick:S,disabled:p,children:c.jsx("img",{src:N?it:Ue,alt:N?"Play":"Pause"})}),a&&c.jsxs("button",{type:"button",className:`voice-visualizer__btn-center voice-visualizer__relative ${f?"voice-visualizer__btn-center--border-transparent":""}`,onClick:m,disabled:f,children:[f&&c.jsx("div",{className:"voice-visualizer__spinner-wrapper",children:c.jsx("div",{className:"voice-visualizer__spinner"})}),c.jsx("img",{src:Fe,alt:"Microphone"})]}),c.jsx("button",{type:"button",className:`voice-visualizer__btn-center voice-visualizer__btn-center-pause ${n?"":"voice-visualizer__visually-hidden"}`,onClick:w,children:c.jsx("img",{src:st,alt:"Stop"})}),!a&&c.jsx("button",{type:"button",onClick:$,className:`voice-visualizer__btn ${ge??""}`,disabled:p,children:"Clear"}),q&&i&&c.jsx("button",{type:"button",onClick:z,className:`voice-visualizer__btn ${ge??""}`,disabled:p,children:"Download Audio"})]})]})]})};function ot({onStartRecording:e,onStopRecording:r,onPausedRecording:n,onResumedRecording:i,onClearCanvas:o,onEndAudioPlayback:h,onStartAudioPlayback:L,onPausedAudioPlayback:l,onResumedAudioPlayback:S,onErrorPlayingAudio:m,shouldHandleBeforeUnload:w=!0}={}){const[z,g]=t.useState(!1),[N,v]=t.useState(!1),[f,p]=t.useState(null),[a,H]=t.useState(new Uint8Array(0)),[P,Y]=t.useState(!1),[$,G]=t.useState(null),[y,Q]=t.useState(null),[re,B]=t.useState(0),[me,ne]=t.useState(0),[W,b]=t.useState(0),[O,ie]=t.useState(""),[Ne,Z]=t.useState(!0),[se,q]=t.useState(0),[ce,oe]=t.useState(!0),[R,fe]=t.useState(!1),[Ee,de]=t.useState(!1),[ze,ue]=t.useState(null),[ye,ae]=t.useState(!1),I=t.useRef(null),F=t.useRef(null),X=t.useRef(null),he=t.useRef(null),K=t.useRef(null),T=t.useRef(null),E=t.useRef(null),u=t.useRef(null),ge=!!(y&&!P),Me=Ke(W),_e=qe(re),A=$e(se),Ce=R||P;t.useEffect(()=>{if(!z||N)return;const d=setInterval(()=>{const U=performance.now();B(J=>J+(U-me)),ne(U)},1e3);return()=>clearInterval(d)},[me,N,z]),t.useEffect(()=>{if(ze){V();return}},[ze]),t.useEffect(()=>()=>{V()},[]),t.useEffect(()=>(!ce&&w&&window.addEventListener("beforeunload",le),()=>{window.removeEventListener("beforeunload",le)}),[ce,w]);const le=s=>{s.preventDefault(),s.returnValue=""},Ae=async s=>{if(s)try{if(s.size===0)throw new Error("Error: The audio blob is empty");const d=URL.createObjectURL(s);ie(d);const U=await s.arrayBuffer(),C=await new AudioContext().decodeAudioData(U);Q(C),b(C.duration-.06),ue(null)}catch(d){console.error("Error processing the audio blob:",d),ue(d instanceof Error?d:new Error("Error processing the audio blob"))}},Se=s=>{s instanceof Blob&&(V(),de(!0),oe(!1),Y(!0),g(!1),B(0),v(!1),u.current=new Audio,G(s),Ae(s))},xe=()=>{ae(!0),navigator.mediaDevices.getUserMedia({audio:!0}).then(s=>{oe(!1),ae(!1),g(!0),ne(performance.now()),p(s),F.current=new window.AudioContext,X.current=F.current.createAnalyser(),he.current=new Uint8Array(X.current.frequencyBinCount),K.current=F.current.createMediaStreamSource(s),K.current.connect(X.current),I.current=new MediaRecorder(s),I.current.addEventListener("dataavailable",ve),I.current.start(),e&&e(),k()}).catch(s=>{ae(!1),ue(s instanceof Error?s:new Error("Error starting audio recording"))})},k=()=>{X.current.getByteTimeDomainData(he.current),H(new Uint8Array(he.current)),T.current=requestAnimationFrame(k)},ve=s=>{I.current&&(I.current=null,u.current=new Audio,G(s.data),Ae(s.data))},je=()=>{u.current&&(q(u.current.currentTime),E.current=requestAnimationFrame(je))},He=()=>{z||ye||(ce||V(),xe())},Te=()=>{z&&(g(!1),I.current&&(I.current.stop(),I.current.removeEventListener("dataavailable",ve)),f==null||f.getTracks().forEach(s=>s.stop()),T.current&&cancelAnimationFrame(T.current),K.current&&K.current.disconnect(),F.current&&F.current.state!=="closed"&&F.current.close(),Y(!0),B(0),v(!1),r&&r())},V=()=>{T.current&&(cancelAnimationFrame(T.current),T.current=null),E.current&&(cancelAnimationFrame(E.current),E.current=null),I.current&&(I.current.removeEventListener("dataavailable",ve),I.current.stop(),I.current=null),f==null||f.getTracks().forEach(s=>s.stop()),u!=null&&u.current&&(u.current.removeEventListener("ended",pe),u.current.pause(),u.current.src="",u.current=null),F.current=null,X.current=null,he.current=null,K.current=null,p(null),ae(!1),g(!1),de(!1),Y(!1),G(null),Q(null),B(0),ne(0),b(0),ie(""),q(0),Z(!0),v(!1),fe(!1),H(new Uint8Array(0)),ue(null),oe(!0),o&&o()},De=()=>{if(u.current&&u.current.paused){const s=u.current.play();s!==void 0&&s.catch(d=>{console.error(d),m&&m(d instanceof Error?d:new Error("Error playing audio"))})}},ee=()=>{!u.current||z||(requestAnimationFrame(je),De(),u.current.addEventListener("ended",pe),Z(!1),L&&se===0&&L(),S&&se!==0&&S())},te=()=>{if(!u.current||z)return;E.current&&cancelAnimationFrame(E.current),u.current.removeEventListener("ended",pe),u.current.pause(),Z(!0);const s=u.current.currentTime;q(s),u.current.currentTime=s,l&&l()},_=()=>{var s,d,U;if(z){v(J=>!J),((s=I.current)==null?void 0:s.state)==="recording"?((d=I.current)==null||d.pause(),B(J=>J+(performance.now()-me)),T.current&&cancelAnimationFrame(T.current),n&&n()):(T.current=requestAnimationFrame(k),(U=I.current)==null||U.resume(),ne(performance.now()),i&&i());return}u.current&&ge&&(u.current.paused?ee():te())},pe=()=>{E.current&&cancelAnimationFrame(E.current),Z(!0),u!=null&&u.current&&(u.current.currentTime=0,q(0),h&&h())},M=()=>{var d;if(!O)return;const s=document.createElement("a");s.href=O,s.download=`recorded_audio${Xe((d=I.current)==null?void 0:d.mimeType)}`,document.body.appendChild(s),s.click(),document.body.removeChild(s),URL.revokeObjectURL(O)};return{audioRef:u,isRecordingInProgress:z,isPausedRecording:N,audioData:a,recordingTime:re,isProcessingRecordedAudio:Ce,recordedBlob:$,mediaRecorder:I.current,duration:W,currentAudioTime:se,audioSrc:O,isPausedRecordedAudio:Ne,bufferFromRecordedBlob:y,isCleared:ce,isAvailableRecordedAudio:ge,formattedDuration:Me,formattedRecordingTime:_e,formattedRecordedAudioCurrentTime:A,startRecording:He,togglePauseResume:_,startAudioPlayback:ee,stopAudioPlayback:te,stopRecording:Te,saveAudioFile:M,clearCanvas:V,setCurrentAudioTime:q,error:ze,isProcessingOnResize:R,isProcessingStartRecording:ye,isPreloadedBlob:Ee,setPreloadedAudioBlob:Se,_setIsProcessingAudioOnComplete:Y,_setIsProcessingOnResize:fe}}x.VoiceVisualizer=ct,x.useVoiceVisualizer=ot,Object.defineProperty(x,Symbol.toStringTag,{value:"Module"})});