function MainComponent() { const [chickens, setChickens] = React.useState(0); const [clickPower, setClickPower] = React.useState(1); const [rebirthCost, setRebirthCost] = React.useState(10000); function handleChickenClick() { setChickens((prevState)=>prevState + clickPower); } const upgrades = Array.from({ length: 10 }, (_, index)=>({ cost: Math.max(1, Math.pow(index + 1, 2)), power: index + 1 })); function buyUpgrade(index) { const upgradeCost = upgrades[index].cost; if (chickens >= upgradeCost) { setChickens((prevState)=>prevState - upgradeCost); setClickPower((prevState)=>prevState + upgrades[index].power); upgrades[index].cost += Math.floor(upgradeCost * 0.2); } } function handleRebirth() { if (chickens >= rebirthCost) { setChickens(0); setClickPower((prevState)=>2); upgrades.forEach((upgrade, index)=>{ upgrade.cost = Math.max(1, Math.pow(index + 1, 2)); }); setRebirthCost((prevState)=>prevState + 1000); } } const chickenBtnClasses = "text-3xl p-4 rounded-full bg-yellow-300 transition duration-300 ease-in-out transform hover:scale-110 active:scale-90 hover:bg-yellow-400"; const shopItems = upgrades.map((upgrade, index)=>/*#__PURE__*/ React.createElement("button", { key: index, onClick: ()=>buyUpgrade(index), className: `w-32 p-2 m-1 text-sm font-roboto rounded bg-green-400 ${chickens < upgrade.cost ? "bg-green-200" : ""}`, name: `upgrade_${index}`, __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, "Buy +", upgrade.power, " (", upgrade.cost, ")")); const chickenCountClasses = "fixed top-2 left-2 text-xl font-roboto text-[#121212] bg-yellow-200 p-2 rounded-lg"; const chickenCoinsClasses = "absolute top-0 right-0 text-2xl font-roboto text-[#ffc107] bg-[#121212] p-2 rounded-lg"; return /*#__PURE__*/ React.createElement("div", { className: "w-full h-screen flex flex-col items-center justify-start bg-[#f7f7f7] pt-8", __source: { fileName: "", lineNumber: 50, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4 relative", __source: { fileName: "", lineNumber: 51, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: chickenBtnClasses, onClick: handleChickenClick, style: { animation: 'pop 0.3s ease' }, __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, "🐔"), /*#__PURE__*/ React.createElement("div", { className: chickenCoinsClasses, __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }, chickens, " chicken coins")), /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-[#121212] text-4xl mb-8", __source: { fileName: "", lineNumber: 63, columnNumber: 7 }, __self: this }, "Chicken Clicker"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center mb-6", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, shopItems), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 69, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleRebirth, className: `w-32 p-2 m-1 text-sm font-roboto rounded bg-purple-500 text-white ${chickens < rebirthCost ? "bg-purple-300" : ""}`, name: "rebirth", __source: { fileName: "", lineNumber: 70, columnNumber: 9 }, __self: this }, "Rebirth (", rebirthCost, ")")), /*#__PURE__*/ React.createElement("div", { className: chickenCountClasses, __source: { fileName: "", lineNumber: 77, columnNumber: 7 }, __self: this }, "Click Power: ", clickPower), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 80, columnNumber: 7 }, __self: this }, ` @keyframes pop { 0% { transform: scale(1); } 50% { transform: scale(1.15); } 100% { transform: scale(1); } } `)); }