{"version":3,"file":"CodeToFlowchart-3OF-wAs8.js","sources":["../../components/features/CodeToFlowchart.tsx"],"sourcesContent":["\nimport React, { useState, useCallback, useEffect } from 'react';\nimport { generateFlowchart } from '../../services/geminiService';\nimport { MapIcon } from '../icons/FeatureIcons';\nimport { LoadingSpinner } from './shared/LoadingSpinner';\nimport mermaid from 'mermaid';\n\nmermaid.initialize({\n    startOnLoad: false,\n    theme: 'dark',\n    darkMode: true,\n    securityLevel: 'loose',\n    themeVariables: {\n        background: '#1e293b', // slate-800\n        primaryColor: '#334155', // slate-700\n        primaryTextColor: '#cbd5e1', // slate-300\n        lineColor: '#64748b', // slate-500\n        textColor: '#cbd5e1',\n    },\n});\n\nconst exampleCode = `function checkNumber(num) {\n  if (num > 0) {\n    return \"Positive\";\n  } else if (num < 0) {\n    return \"Negative\";\n  } else {\n    return \"Zero\";\n  }\n}`;\n\nexport const CodeToFlowchart: React.FC = () => {\n    const [code, setCode] = useState<string>(exampleCode);\n    const [mermaidCode, setMermaidCode] = useState<string>('');\n    const [isLoading, setIsLoading] = useState<boolean>(false);\n    const [error, setError] = useState<string>('');\n    const chartRef = React.useRef<HTMLDivElement>(null);\n\n    const handleGenerate = useCallback(async () => {\n        if (!code.trim()) {\n            setError('Please enter some code.');\n            return;\n        }\n        setIsLoading(true);\n        setError('');\n        setMermaidCode('');\n        if(chartRef.current) chartRef.current.innerHTML = '';\n\n        try {\n            const result = await generateFlowchart(code);\n            setMermaidCode(result.mermaidCode);\n        } catch (err) {\n            const errorMessage = err instanceof Error ? err.message : 'An unknown error occurred.';\n            setError(`Failed to generate flowchart: ${errorMessage}`);\n        } finally {\n            setIsLoading(false);\n        }\n    }, [code]);\n    \n    useEffect(() => {\n        if (mermaidCode && chartRef.current) {\n            try {\n                mermaid.render('mermaid-chart', mermaidCode).then(({ svg }) => {\n                    if (chartRef.current) {\n                        chartRef.current.innerHTML = svg;\n                    }\n                });\n            } catch (e) {\n                if (e instanceof Error) setError(`Mermaid render error: ${e.message}`);\n                console.error(e);\n            }\n        }\n    }, [mermaidCode]);\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                    <MapIcon />\n                    <span className=\"ml-3\">Code to Flowchart</span>\n                </h1>\n                <p className=\"text-slate-400 mt-1\">Turn your code's logic into a visual flowchart with AI.</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\">Source Code</label>\n                    <textarea\n                        id=\"code-input\"\n                        value={code}\n                        onChange={(e) => setCode(e.target.value)}\n                        className=\"flex-grow p-4 bg-slate-900 border border-slate-700 rounded-md resize-none font-mono text-sm\"\n                    />\n                    <button\n                        onClick={handleGenerate}\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\"\n                    >\n                        {isLoading ? <LoadingSpinner /> : 'Generate Flowchart'}\n                    </button>\n                </div>\n                <div className=\"flex flex-col h-full\">\n                    <label className=\"text-sm font-medium text-slate-400 mb-2\">Generated Flowchart</label>\n                    <div className=\"flex-grow p-4 bg-slate-800/50 border border-slate-700/50 rounded-md overflow-y-auto flex items-center justify-center\">\n                        {isLoading && <LoadingSpinner />}\n                        {error && <p className=\"text-red-400\">{error}</p>}\n                        <div ref={chartRef} className=\"w-full h-full\" />\n                         {!isLoading && !mermaidCode && !error && <div className=\"text-slate-500\">Flowchart will appear here.</div>}\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n"],"names":["mermaid","exampleCode","CodeToFlowchart","code","setCode","useState","mermaidCode","setMermaidCode","isLoading","setIsLoading","error","setError","chartRef","React","handleGenerate","useCallback","result","generateFlowchart","err","errorMessage","useEffect","svg","e","jsxs","jsx","MapIcon","LoadingSpinner"],"mappings":"86EAOAA,EAAQ,WAAW,CACf,YAAa,GACb,MAAO,OACP,SAAU,GACV,cAAe,QACf,eAAgB,CACZ,WAAY,UACZ,aAAc,UACd,iBAAkB,UAClB,UAAW,UACX,UAAW,SAAA,CAEnB,CAAC,EAED,MAAMC,EAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUPC,GAA4B,IAAM,CAC3C,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAiBJ,CAAW,EAC9C,CAACK,EAAaC,CAAc,EAAIF,EAAAA,SAAiB,EAAE,EACnD,CAACG,EAAWC,CAAY,EAAIJ,EAAAA,SAAkB,EAAK,EACnD,CAACK,EAAOC,CAAQ,EAAIN,EAAAA,SAAiB,EAAE,EACvCO,EAAWC,EAAM,OAAuB,IAAI,EAE5CC,EAAiBC,EAAAA,YAAY,SAAY,CAC3C,GAAI,CAACZ,EAAK,OAAQ,CACdQ,EAAS,yBAAyB,EAClC,MACJ,CACAF,EAAa,EAAI,EACjBE,EAAS,EAAE,EACXJ,EAAe,EAAE,EACdK,EAAS,UAASA,EAAS,QAAQ,UAAY,IAElD,GAAI,CACA,MAAMI,EAAS,MAAMC,EAAkBd,CAAI,EAC3CI,EAAeS,EAAO,WAAW,CACrC,OAASE,EAAK,CACV,MAAMC,EAAeD,aAAe,MAAQA,EAAI,QAAU,6BAC1DP,EAAS,iCAAiCQ,CAAY,EAAE,CAC5D,QAAA,CACIV,EAAa,EAAK,CACtB,CACJ,EAAG,CAACN,CAAI,CAAC,EAETiB,OAAAA,EAAAA,UAAU,IAAM,CACZ,GAAId,GAAeM,EAAS,QACxB,GAAI,CACAZ,EAAQ,OAAO,gBAAiBM,CAAW,EAAE,KAAK,CAAC,CAAE,IAAAe,KAAU,CACvDT,EAAS,UACTA,EAAS,QAAQ,UAAYS,EAErC,CAAC,CACL,OAASC,EAAG,CACJA,aAAa,OAAOX,EAAS,yBAAyBW,EAAE,OAAO,EAAE,EACrE,QAAQ,MAAMA,CAAC,CACnB,CAER,EAAG,CAAChB,CAAW,CAAC,EAGZiB,EAAAA,KAAC,MAAA,CAAI,UAAU,yCACX,SAAA,CAAAA,EAAAA,KAAC,SAAA,CAAO,UAAU,OACd,SAAA,CAAAA,EAAAA,KAAC,KAAA,CAAG,UAAU,sDACV,SAAA,CAAAC,EAAAA,IAACC,EAAA,EAAQ,EACTD,EAAAA,IAAC,OAAA,CAAK,UAAU,OAAO,SAAA,mBAAA,CAAiB,CAAA,EAC5C,EACAA,EAAAA,IAAC,IAAA,CAAE,UAAU,sBAAsB,SAAA,yDAAA,CAAuD,CAAA,EAC9F,EACAD,EAAAA,KAAC,MAAA,CAAI,UAAU,yEACX,SAAA,CAAAA,EAAAA,KAAC,MAAA,CAAI,UAAU,uBACX,SAAA,CAAAC,MAAC,QAAA,CAAM,QAAQ,aAAa,UAAU,0CAA0C,SAAA,cAAW,EAC3FA,EAAAA,IAAC,WAAA,CACG,GAAG,aACH,MAAOrB,EACP,SAAWmB,GAAMlB,EAAQkB,EAAE,OAAO,KAAK,EACvC,UAAU,6FAAA,CAAA,EAEdE,EAAAA,IAAC,SAAA,CACG,QAASV,EACT,SAAUN,EACV,UAAU,yGAET,SAAAA,EAAYgB,EAAAA,IAACE,EAAA,CAAA,CAAe,EAAK,oBAAA,CAAA,CACtC,EACJ,EACAH,EAAAA,KAAC,MAAA,CAAI,UAAU,uBACX,SAAA,CAAAC,EAAAA,IAAC,QAAA,CAAM,UAAU,0CAA0C,SAAA,sBAAmB,EAC9ED,EAAAA,KAAC,MAAA,CAAI,UAAU,uHACV,SAAA,CAAAf,SAAckB,EAAA,EAAe,EAC7BhB,GAASc,EAAAA,IAAC,IAAA,CAAE,UAAU,eAAgB,SAAAd,EAAM,EAC7Cc,EAAAA,IAAC,MAAA,CAAI,IAAKZ,EAAU,UAAU,gBAAgB,EAC5C,CAACJ,GAAa,CAACF,GAAe,CAACI,GAASc,EAAAA,IAAC,MAAA,CAAI,UAAU,iBAAiB,SAAA,6BAAA,CAA2B,CAAA,CAAA,CACzG,CAAA,CAAA,CACJ,CAAA,CAAA,CACJ,CAAA,EACJ,CAER"}