function MainComponent() { const [prompt, setPrompt] = useState(""); const [images, setImages] = useState([]); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [selectedModel, setSelectedModel] = useState("dalle"); const generateImages = async ()=>{ if (!prompt.trim()) return; setLoading(true); setError(null); setImages([]); try { let newImages = []; if (selectedModel === "dalle") { const requests = Array.from({ length: 4 }).fill().map(async ()=>{ const response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(prompt)}`); if (!response.ok) throw new Error(`Error: ${response.status}`); const data = await response.json(); return data.data[0]; }); newImages = await Promise.all(requests); } else if (selectedModel === "stable") { const requests = Array.from({ length: 4 }).fill().map(async ()=>{ const response = await fetch(`/integrations/stable-diffusion-v-3/?prompt=${encodeURIComponent(prompt)}`); if (!response.ok) throw new Error(`Error: ${response.status}`); const data = await response.json(); return data.data[0]; }); newImages = await Promise.all(requests); } else { const seeds = Array.from({ length: 4 }).map(()=>Math.floor(Math.random() * (500 - 10 + 1)) + 10); newImages = seeds.map((seed)=>`https://image.pollinations.ai/prompt/${encodeURIComponent(prompt)}?seed=${seed}`); } setImages(newImages); } catch (err) { setError("No se pudo generar las imágenes. Por favor, intente nuevamente."); console.error(err); } finally{ setLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#121212] pb-12", __source: { fileName: "", lineNumber: 64, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 md:p-8", __source: { fileName: "", lineNumber: 65, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto", __source: { fileName: "", lineNumber: 66, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl md:text-5xl font-bold text-white text-center mb-12 font-inter", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, "Generador de Imágenes AI"), /*#__PURE__*/ React.createElement("div", { className: "bg-[#1E1E1E] rounded-xl p-6 md:p-8", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { value: prompt, onChange: (e)=>setPrompt(e.target.value), placeholder: "Describe la imagen que quieres generar...", className: "w-full h-32 bg-[#2C2C2C] text-white rounded-lg p-4 mb-6 focus:outline-none focus:ring-2 focus:ring-[#3C3C3C] font-inter", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4 mb-6", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedModel("dalle"), className: `px-6 py-2 rounded-md font-inter transition-all ${selectedModel === "dalle" ? "bg-[#3B82F6] text-white ring-2 ring-[#60A5FA]" : "bg-[#2C2C2C] text-gray-300 hover:bg-[#3C3C3C]"}`, __source: { fileName: "", lineNumber: 79, columnNumber: 15 }, __self: this }, "DALL-E 3"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedModel("stable"), className: `px-6 py-2 rounded-md font-inter transition-all ${selectedModel === "stable" ? "bg-[#3B82F6] text-white ring-2 ring-[#60A5FA]" : "bg-[#2C2C2C] text-gray-300 hover:bg-[#3C3C3C]"}`, __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }, "Stable Diffusion V3"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedModel("pollinations"), className: `px-6 py-2 rounded-md font-inter transition-all ${selectedModel === "pollinations" ? "bg-[#3B82F6] text-white ring-2 ring-[#60A5FA]" : "bg-[#2C2C2C] text-gray-300 hover:bg-[#3C3C3C]"}`, __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this }, "Pollinations AI")), /*#__PURE__*/ React.createElement("button", { onClick: generateImages, disabled: loading || !prompt.trim(), className: "w-full md:w-auto px-8 py-3 bg-[#2C2C2C] text-white rounded-md font-inter hover:bg-[#3C3C3C] transition-colors disabled:opacity-50 disabled:cursor-not-allowed", __source: { fileName: "", lineNumber: 111, columnNumber: 13 }, __self: this }, loading ? "Generando..." : "Generar Imágenes"), error && /*#__PURE__*/ React.createElement("div", { className: "mt-4 text-red-400 text-center font-inter", __source: { fileName: "", lineNumber: 120, columnNumber: 15 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "mt-8 grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 125, columnNumber: 13 }, __self: this }, loading ? Array.from({ length: 4 }).map((_, i)=>/*#__PURE__*/ React.createElement("div", { key: `loading-${i}`, className: "bg-[#2C2C2C] rounded-xl p-4 animate-pulse aspect-square", __source: { fileName: "", lineNumber: 128, columnNumber: 21 }, __self: this })) : images.map((img, index)=>/*#__PURE__*/ React.createElement("div", { key: `${img}-${index}`, className: "aspect-square", __source: { fileName: "", lineNumber: 134, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: img, alt: `Imagen ${index + 1} generada por AI`, className: "w-full h-full object-cover rounded-xl", __source: { fileName: "", lineNumber: 135, columnNumber: 23 }, __self: this }))))))), /*#__PURE__*/ React.createElement("button", { className: "fixed bottom-4 right-4 text-white font-inter", __source: { fileName: "", lineNumber: 147, columnNumber: 7 }, __self: this }, "Create")); }