function MainComponent() { const [count, setCount] = React.useState(0); const [money, setMoney] = React.useState(0); const [cookieImg, setCookieImg] = React.useState(""); const [autoClickers, setAutoClickers] = React.useState(0); React.useEffect(()=>{ fetch('/integrations/stable-diffusion/?prompt=a+photo+of+a+cookie', { method: 'GET' }).then((response)=>response.json()).then((data)=>{ setCookieImg(data.data[0]); }); const interval = setInterval(()=>{ setMoney(money + autoClickers); }, 1000); return ()=>clearInterval(interval); }, [ money, autoClickers ]); const handleClick = ()=>{ setCount(count + 1); setMoney(money + 1); }; const buyAutoClicker = ()=>{ if (money >= 10) { setAutoClickers(autoClickers + 1); setMoney(money - 10); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-row items-start justify-center min-h-screen bg-[#F3E9D2]", __source: { fileName: "", lineNumber: 36, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center m-4 p-4 bg-[#FFF4E6] rounded-lg shadow-xl", __source: { fileName: "", lineNumber: 37, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleClick, className: "w-[200px] h-[200px] rounded-full mb-4 bg-[#F4F1DE] shadow-lg flex items-center justify-center border-4 border-[#81B29A]", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, cookieImg ? /*#__PURE__*/ React.createElement("img", { src: cookieImg, alt: "Generated cookie image", className: "w-full h-full rounded-full", __source: { fileName: "", lineNumber: 39, columnNumber: 24 }, __self: this }) : /*#__PURE__*/ React.createElement("span", { className: "text-6xl", __source: { fileName: "", lineNumber: 39, columnNumber: 117 }, __self: this }, "🍪")), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-xl text-[#3D405B]", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "所持金: "), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-xl text-[#E07A5F]", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, money))), /*#__PURE__*/ React.createElement("div", { className: "flex-grow m-4 p-4 bg-[#E5E5E5] rounded-lg shadow-xl", __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "block text-center font-roboto text-xl text-[#3D405B]", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, "自動生産視野")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col m-4 p-4 bg-[#D8C3A5] rounded-lg shadow-xl font-roboto", __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl text-[#3D405B] mb-4", __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, "ショップ"), /*#__PURE__*/ React.createElement("button", { onClick: buyAutoClicker, disabled: money < 10, className: `w-full mb-2 p-2 rounded-md ${money >= 10 ? 'bg-[#81B29A] hover:bg-[#9CA3AF]' : 'bg-[#E5E5E5] cursor-not-allowed'} text-white font-bold`, __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, "自動クリッカーを購入 - 10金"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl text-[#3D405B]", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "自動クリッカー数: "), /*#__PURE__*/ React.createElement("span", { className: "text-xl text-[#E07A5F]", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, autoClickers)))); }