function MainComponent() { const [prompt, setPrompt] = React.useState(""); const [imageUrl, setImageUrl] = React.useState(null); const [isLoading, setIsLoading] = React.useState(false); const [message, setMessage] = React.useState(""); const handleGenerateImage = async (e)=>{ e.preventDefault(); setIsLoading(true); setMessage(""); try { const response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(prompt)}`, { method: 'GET' }); const data = await response.json(); if (data.data && data.data.length > 0) { setImageUrl(data.data[0]); } else { setMessage("画像を生成できませんでした"); } } catch (error) { setMessage("エラーが発生しました: " + error.message); } finally{ setIsLoading(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#121212] flex flex-col items-center justify-center text-white font-crimson-text p-4", __source: { fileName: "", lineNumber: 31, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl font-bold mb-8", __source: { fileName: "", lineNumber: 32, columnNumber: 7 }, __self: this }, "イメージジェネレーター"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleGenerateImage, className: "w-full max-w-lg space-y-4", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "prompt", className: "block mb-2", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, "プロンプト:"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "prompt", name: "prompt", value: prompt, onChange: (e)=>setPrompt(e.target.value), required: true, className: "w-full p-2 bg-[#1e1e1e] border border-[#333] rounded focus:outline-none", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isLoading, className: "bg-[#333] text-white px-4 py-2 rounded hover:bg-[#444] disabled:bg-[#555]", __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }, isLoading ? "生成中..." : "画像を生成")), message && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-[#333] border border-[#444] rounded", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, message), imageUrl && /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: imageUrl, alt: "Generated image", className: "w-full max-w-md rounded shadow-lg", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }))); }