{"version":3,"file":"AiCodeExplainer-B2pZiqoI.js","sources":["../../components/AiCodeExplainer.tsx"],"sourcesContent":["\nimport React, { useState, useCallback } from 'react';\nimport { explainCode } from '../services/geminiService.ts';\nimport { CpuChipIcon } from './icons/InterfaceIcons.tsx';\nimport { marked } from 'marked';\n\nconst LoadingSpinner: React.FC = () => (\n    <div className=\"flex items-center justify-center space-x-2\">\n        <div className=\"w-2 h-2 rounded-full bg-cyan-400 animate-pulse\" style={{ animationDelay: '0s' }}></div>\n        <div className=\"w-2 h-2 rounded-full bg-cyan-400 animate-pulse\" style={{ animationDelay: '0.2s' }}></div>\n        <div className=\"w-2 h-2 rounded-full bg-cyan-400 animate-pulse\" style={{ animationDelay: '0.4s' }}></div>\n        <span className=\"text-slate-400 ml-2\">AI is thinking...</span>\n    </div>\n);\n\nconst exampleCode = `const bubbleSort = (arr) => {\n  for (let i = 0; i < arr.length; i++) {\n    for (let j = 0; j < arr.length - i - 1; j++) {\n      if (arr[j] > arr[j + 1]) {\n        [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];\n      }\n    }\n  }\n  return arr;\n};`;\n\nexport const AiCodeExplainer: React.FC = () => {\n    const [code, setCode] = useState<string>(exampleCode);\n    const [explanation, setExplanation] = useState<string>('');\n    const [isLoading, setIsLoading] = useState<boolean>(false);\n    const [error, setError] = useState<string>('');\n\n    const handleExplain = useCallback(async () => {\n        if (!code.trim()) {\n            setError('Please enter some code to explain.');\n            return;\n        }\n        setIsLoading(true);\n        setError('');\n        setExplanation('');\n        try {\n            const result = await explainCode(code);\n            setExplanation(result);\n        } catch (err) {\n            const errorMessage = err instanceof Error ? err.message : 'An unknown error occurred.';\n            setError(`Failed to get explanation: ${errorMessage}`);\n        } finally {\n            setIsLoading(false);\n        }\n    }, [code]);\n\n    return (\n        <div className=\"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-slate-300\">\n            <header className=\"mb-6\">\n                <h1 className=\"text-3xl font-bold text-slate-100 flex items-center\">\n                    <CpuChipIcon />\n                    <span className=\"ml-3\">AI Code Explainer</span>\n                </h1>\n                <p className=\"text-slate-400 mt-1\">Paste a code snippet below and let Gemini explain it to you.</p>\n            </header>\n            <div className=\"flex-grow grid grid-cols-1 lg:grid-cols-2 gap-6 h-full overflow-hidden\">\n                <div className=\"flex flex-col h-full\">\n                    <label htmlFor=\"code-input\" className=\"text-sm font-medium text-slate-400 mb-2\">Your Code</label>\n                    <textarea\n                        id=\"code-input\"\n                        value={code}\n                        onChange={(e) => setCode(e.target.value)}\n                        placeholder=\"Paste your code here...\"\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                    <button\n                        onClick={handleExplain}\n                        disabled={isLoading}\n                        className=\"mt-4 w-full flex items-center justify-center px-6 py-3 bg-cyan-500 text-slate-900 font-bold rounded-md hover:bg-cyan-400 transition-colors disabled:bg-slate-600 disabled:cursor-not-allowed\"\n                    >\n                        {isLoading ? <LoadingSpinner /> : 'Generate Explanation'}\n                    </button>\n                </div>\n                <div className=\"flex flex-col h-full\">\n                    <label className=\"text-sm font-medium text-slate-400 mb-2\">AI Explanation</label>\n                    <div className=\"flex-grow p-4 bg-slate-800/50 border border-slate-700/50 rounded-md overflow-y-auto\">\n                        {isLoading && (\n                             <div className=\"flex items-center justify-center h-full\">\n                                <LoadingSpinner />\n                             </div>\n                        )}\n                        {error && <p className=\"text-red-400\">{error}</p>}\n                        {explanation && !isLoading && (\n                            <div\n                                className=\"prose prose-sm prose-invert max-w-none prose-headings:text-slate-200 prose-p:text-slate-300 prose-strong:text-slate-100 prose-code:text-cyan-300 prose-code:before:content-none prose-code:after:content-none prose-pre:bg-slate-900/50 prose-pre:border prose-pre:border-slate-700\"\n                                dangerouslySetInnerHTML={{ __html: marked(explanation) }}\n                            />\n                        )}\n                         {!isLoading && !explanation && !error && (\n                            <div className=\"text-slate-500 h-full flex items-center justify-center\">\n                                The explanation will appear here.\n                            </div>\n                        )}\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};"],"names":["LoadingSpinner","jsxs","jsx","exampleCode","AiCodeExplainer","code","setCode","useState","explanation","setExplanation","isLoading","setIsLoading","error","setError","handleExplain","useCallback","result","explainCode","err","errorMessage","CpuChipIcon","e","marked"],"mappings":"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"}