function MainComponent() { const [prompt, setPrompt] = React.useState(''); const [imageUrl, setImageUrl] = React.useState(''); const [generating, setGenerating] = React.useState(false); const fetchImage = async ()=>{ setGenerating(true); const response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(prompt)}`, { method: 'GET' }); const data = await response.json(); setGenerating(false); if (data && data.data && data.data.length > 0) { setImageUrl(data.data[0]); } }; const handleInputChange = (event)=>{ setPrompt(event.target.value); }; const handleFormSubmit = (event)=>{ event.preventDefault(); if (prompt.trim()) { fetchImage(); } }; let downloadLink = imageUrl ? imageUrl.replace("http://", "https://") : ""; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f0f0] p-4", __source: { fileName: "", lineNumber: 32, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full block mb-10", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { target: "_blank", href: "https://self-introduction-page.created.app", className: "text-center text-md font-roboto text-gray-800 hover:underline mb-4 block", __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-roboto text-gray-800 text-center mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-robot", __source: { fileName: "", lineNumber: 38, columnNumber: 11 }, __self: this }), " アートメーカーAI")), /*#__PURE__*/ React.createElement("form", { onSubmit: handleFormSubmit, className: "w-full max-w-lg", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "prompt", value: prompt, onChange: handleInputChange, placeholder: "プロンプトを入力...", className: "w-full px-4 py-2 text-2xl font-roboto border-2 border-gray-300 rounded-lg focus:outline-none focus:border-blue-500", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: generating, className: "flex items-center justify-center w-full px-4 py-2 mt-4 text-xl font-roboto text-white bg-blue-500 rounded-lg hover:bg-blue-700 disabled:bg-blue-300", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, !generating && /*#__PURE__*/ React.createElement("i", { className: "fas fa-paper-plane mr-2", __source: { fileName: "", lineNumber: 52, columnNumber: 27 }, __self: this }), generating ? '生成中...' : '生成')), imageUrl && /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center w-full max-w-xs mt-8", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: imageUrl, alt: "AI generated artwork", className: "w-[400px] h-[400px]", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("a", { href: downloadLink, download: prompt ? `${prompt.replace(/\s/g, '_')}.jpg` : 'generated_artwork.jpg', className: "flex items-center justify-center px-4 py-2 mt-4 mb-20 text-xl font-roboto text-white bg-green-500 rounded-lg hover:bg-green-700", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-download mr-2", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }), "ダウンロード"))); }