function MainComponent() { const [prompt, setPrompt] = React.useState(''); const [imageStatus, setImageStatus] = React.useState('idle'); const [isNSFW, setIsNSFW] = React.useState(false); const generateImage = async (e)=>{ e.preventDefault(); if (isNSFW) { alert('NSFW content generation is not allowed.'); return; } setImageStatus('generating'); setTimeout(()=>setImageStatus('completed'), 3000); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f7f7] p-4", __source: { fileName: "", lineNumber: 20, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8 text-3xl font-bold text-[#333] font-roboto", __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }, "AI Image Generator"), /*#__PURE__*/ React.createElement("form", { onSubmit: generateImage, className: "w-full max-w-lg", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap -mx-3 mb-6", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full px-3", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "prompt", className: "block text-gray-700 text-lg font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "Enter your prompt:"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "prompt", name: "prompt", value: prompt, onChange: (e)=>setPrompt(e.target.value), className: "appearance-none block w-full bg-gray-200 text-gray-700 border rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white", placeholder: "Type something...", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("label", { className: "inline-flex items-center mt-3", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", className: "form-checkbox h-5 w-5 text-red-600", checked: isNSFW, onChange: (e)=>setIsNSFW(e.target.checked), __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-gray-700 font-roboto", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, "NSFW")), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline mt-3", disabled: imageStatus === 'generating', __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, "Generate Image")))), imageStatus !== 'idle' && /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg bg-gray-200 rounded-full h-2.5 dark:bg-gray-700 my-4", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `bg-green-500 h-2.5 rounded-full transition-all duration-300 ease-in-out ${imageStatus === 'generating' ? 'w-1/2' : imageStatus === 'completed' ? 'w-full' : 'w-0'}`, __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this })), imageStatus === 'completed' && /*#__PURE__*/ React.createElement("div", { className: "mt-8 w-full max-w-lg", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: `/images/generated/${prompt.replaceAll(' ', '_')}.png`, alt: `AI generated representation of ${prompt}`, className: "w-full h-auto rounded", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }))); }