assets/App-C7i5J2cl.js

import{r,j as e}from"./index-89fUx0Kn.js";function v({audioUrl:c,mimeType:s}){const l=r.useRef(null),n=r.useRef(null);return r.useEffect(()=>{l.current&&n.current&&(n.current.src=c,l.current.load())},[c]),e.jsx("div",{className:"flex relative z-10 my-4 w-full",children:e.jsx("audio",{ref:l,controls:!0,className:"w-full h-14 rounded-lg bg-white shadow-xl shadow-black/5 ring-1 ring-slate-700/10",children:e.jsx("source",{ref:n,type:s})})})}function y({text:c,percentage:s}){return s??=0,e.jsx("div",{className:"relative text-black bg-white rounded-lg text-left overflow-hidden",children:e.jsxs("div",{className:"px-2 w-[1%] h-full bg-blue-500 whitespace-nowrap",style:{width:`${s}%`},children:[c," (",`${s.toFixed(2)}%`,")"]})})}const k={"US female 1":"cmu_us_slt_arctic-wav-arctic_a0001","US female 2":"cmu_us_clb_arctic-wav-arctic_a0001","US male 1":"cmu_us_bdl_arctic-wav-arctic_a0003","US male 2":"cmu_us_rms_arctic-wav-arctic_a0003","Canadian male":"cmu_us_jmk_arctic-wav-arctic_a0002","Scottish male":"cmu_us_awb_arctic-wav-arctic_b0002","Indian male":"cmu_us_ksp_arctic-wav-arctic_a0007"},S="cmu_us_slt_arctic-wav-arctic_a0001",E=()=>{const[c,s]=r.useState(null),[l,n]=r.useState(!1),[p,d]=r.useState([]),[x,b]=r.useState("I love Hugging Face!"),[f,g]=r.useState(S),[h,w]=r.useState(null),i=r.useRef(null);r.useEffect(()=>{i.current||(i.current=new Worker(new URL(""+new URL("worker-7MiA6Plm.js",import.meta.url).href,import.meta.url),{type:"module"}));const t=a=>{switch(a.data.status){case"initiate":s(!1),d(o=>[...o,a.data]);break;case"progress":d(o=>o.map(u=>u.file===a.data.file?{...u,progress:a.data.progress}:u));break;case"done":d(o=>o.filter(u=>u.file!==a.data.file));break;case"ready":s(!0);break;case"complete":n(!1);const _=URL.createObjectURL(a.data.output);w(_);break}};return i.current.addEventListener("message",t),()=>i.current.removeEventListener("message",t)});const j=()=>{n(!0),i.current.postMessage({text:x,speaker_id:f})},m=c===!1;return e.jsxs("div",{className:"min-h-screen flex items-center justify-center bg-gray-100",children:[e.jsxs("div",{className:"absolute gap-1 z-50 top-0 left-0 w-full h-full transition-all px-8 flex flex-col justify-center text-center",style:{opacity:m?1:0,pointerEvents:m?"all":"none",background:"rgba(0, 0, 0, 0.9)",backdropFilter:"blur(8px)"},children:[m&&e.jsx("label",{className:"text-white text-xl p-3",children:"Loading models... (only run once)"}),p.map(t=>e.jsx("div",{children:e.jsx(y,{text:`${t.name}/${t.file}`,percentage:t.progress})},`${t.name}/${t.file}`))]}),e.jsxs("div",{className:"bg-white p-8 rounded-lg shadow-lg w-full max-w-xl m-2",children:[e.jsx("h1",{className:"text-3xl font-semibold text-gray-800 mb-1 text-center",children:"In-browser Text to Speech"}),e.jsxs("h2",{className:"text-base font-medium text-gray-700 mb-2 text-center",children:["Made with"," ",e.jsx("a",{href:"https://huggingface.co./docs/transformers.js",target:"_blank",rel:"noreferrer",children:"🤗 Transformers.js"})]}),e.jsxs("div",{className:"mb-4",children:[e.jsx("label",{htmlFor:"text",className:"block text-sm font-medium text-gray-600",children:"Text"}),e.jsx("textarea",{id:"text",className:"border border-gray-300 rounded-md p-2 w-full",rows:"4",placeholder:"Enter text here",value:x,onChange:t=>b(t.target.value)})]}),e.jsxs("div",{className:"mb-4",children:[e.jsx("label",{htmlFor:"speaker",className:"block text-sm font-medium text-gray-600",children:"Speaker"}),e.jsx("select",{id:"speaker",className:"border border-gray-300 rounded-md p-2 w-full",value:f,onChange:t=>g(t.target.value),children:Object.entries(k).map(([t,a])=>e.jsx("option",{value:a,children:t},t))})]}),e.jsx("div",{className:"flex justify-center",children:e.jsx("button",{className:`${l?"bg-gray-400 cursor-not-allowed":"bg-blue-500 cursor-pointer hover:bg-blue-600"} text-white rounded-md py-2 px-4`,onClick:j,disabled:l,children:l?"Generating...":"Generate"})}),h&&e.jsx(v,{audioUrl:h,mimeType:"audio/wav"})]})]})};export{E as default};