{"version":3,"file":"CodeAudioNarrator-0iRIzTGo.js","sources":["../../components/features/CodeAudioNarrator.tsx"],"sourcesContent":["\nimport React, { useState, useEffect } from 'react';\nimport { SparklesIcon } from '../icons/FeatureIcons.tsx';\n\nexport const CodeAudioNarrator: React.FC = () => {\n    const [text, setText] = useState('function helloWorld() {\\n  console.log(\"Hello, world!\");\\n}');\n    const [voices, setVoices] = useState<SpeechSynthesisVoice[]>([]);\n    const [selectedVoice, setSelectedVoice] = useState<string | undefined>();\n    const [rate, setRate] = useState(1);\n    const [pitch, setPitch] = useState(1);\n\n    useEffect(() => {\n        const loadVoices = () => {\n            const availableVoices = window.speechSynthesis.getVoices();\n            setVoices(availableVoices);\n            if(availableVoices.length > 0) {\n                setSelectedVoice(availableVoices.find(v => v.lang.startsWith('en'))?.name || availableVoices[0].name);\n            }\n        };\n        loadVoices();\n        window.speechSynthesis.onvoiceschanged = loadVoices;\n    }, []);\n\n    const speak = () => {\n        if (window.speechSynthesis.speaking) {\n            window.speechSynthesis.cancel();\n        }\n        const utterance = new SpeechSynthesisUtterance(text);\n        const voice = voices.find(v => v.name === selectedVoice);\n        if (voice) {\n            utterance.voice = voice;\n        }\n        utterance.rate = rate;\n        utterance.pitch = pitch;\n        window.speechSynthesis.speak(utterance);\n    };\n    \n    const stop = () => {\n        window.speechSynthesis.cancel();\n    }\n\n    return (\n        <div className=\"h-full flex flex-col p-4 sm:p-6 lg:p-8\">\n            <header className=\"mb-6\">\n                <h1 className=\"text-3xl font-bold text-slate-100 flex items-center\">\n                    <SparklesIcon />\n                    <span className=\"ml-3\">Code Audio Narrator</span>\n                </h1>\n                <p className=\"text-slate-400 mt-1\">Have your code read aloud for accessibility or proof-listening.</p>\n            </header>\n            <div className=\"flex-grow grid grid-cols-1 lg:grid-cols-3 gap-6 min-h-0\">\n                <div className=\"lg:col-span-2 flex flex-col h-full\">\n                     <label htmlFor=\"code-narrator-input\" className=\"text-sm font-medium text-slate-400 mb-2\">Code to Read</label>\n                     <textarea\n                        id=\"code-narrator-input\"\n                        value={text}\n                        onChange={e => setText(e.target.value)}\n                        className=\"flex-grow p-4 bg-slate-900 border border-slate-700 rounded-md resize-none font-mono text-sm text-cyan-300 focus:ring-2 focus:ring-cyan-500 focus:outline-none\"\n                    />\n                </div>\n                 <div className=\"flex flex-col gap-4 bg-slate-800/50 p-6 rounded-lg\">\n                    <h3 className=\"text-xl font-bold\">Controls</h3>\n                    <div>\n                        <label htmlFor=\"voice-select\" className=\"block text-sm font-medium text-slate-400\">Voice</label>\n                        <select\n                            id=\"voice-select\"\n                            value={selectedVoice}\n                            onChange={e => setSelectedVoice(e.target.value)}\n                            className=\"w-full mt-1 px-3 py-2 rounded-md bg-slate-800 border border-slate-700\"\n                        >\n                            {voices.map(voice => (\n                                <option key={voice.name} value={voice.name}>{voice.name} ({voice.lang})</option>\n                            ))}\n                        </select>\n                    </div>\n                    <div>\n                        <label htmlFor=\"rate\" className=\"block text-sm font-medium text-slate-400\">Rate ({rate.toFixed(1)})</label>\n                        <input id=\"rate\" type=\"range\" min=\"0.5\" max=\"2\" step=\"0.1\" value={rate} onChange={e => setRate(Number(e.target.value))} className=\"w-full h-2 bg-slate-700 rounded-lg appearance-none cursor-pointer\" />\n                    </div>\n                    <div>\n                        <label htmlFor=\"pitch\" className=\"block text-sm font-medium text-slate-400\">Pitch ({pitch.toFixed(1)})</label>\n                        <input id=\"pitch\" type=\"range\" min=\"0\" max=\"2\" step=\"0.1\" value={pitch} onChange={e => setPitch(Number(e.target.value))} className=\"w-full h-2 bg-slate-700 rounded-lg appearance-none cursor-pointer\" />\n                    </div>\n                     <div className=\"flex gap-2 mt-auto\">\n                        <button onClick={speak} className=\"flex-1 px-6 py-3 bg-cyan-500 text-slate-900 font-bold rounded-md\">Speak</button>\n                        <button onClick={stop} className=\"flex-1 px-6 py-3 bg-slate-700 text-slate-200 font-bold rounded-md\">Stop</button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};"],"names":["CodeAudioNarrator","text","setText","useState","voices","setVoices","selectedVoice","setSelectedVoice","rate","setRate","pitch","setPitch","useEffect","loadVoices","availableVoices","_a","v","speak","utterance","voice","stop","jsxs","jsx","SparklesIcon","e"],"mappings":"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"}