function MainComponent() { const [seedsSelected, setSeedsSelected] = React.useState(false); const [waterLevel, setWaterLevel] = React.useState(0); const [cactusSize, setCactusSize] = React.useState(0); const [cactusAlive, setCactusAlive] = React.useState(true); const [money, setMoney] = React.useState(0); const chooseSeeds = ()=>{ setSeedsSelected(true); }; const growCactus = ()=>{ if (cactusAlive && seedsSelected) { if (waterLevel >= 2 && waterLevel <= 5) { setCactusSize(cactusSize + 1); setWaterLevel(0); // Resets water level after a growth cycle } } }; const sellCactus = ()=>{ if (cactusAlive && cactusSize > 0) { setMoney(money + cactusSize * 10); // Price based on size resetCactus(); } }; const resetCactus = ()=>{ setCactusSize(0); setSeedsSelected(false); setCactusAlive(true); }; const waterCactus = ()=>{ if (cactusAlive) { setWaterLevel(waterLevel + 1); if (waterLevel > 5) { setCactusAlive(false); // Too much water kills the cactus } } }; const underWaterCactus = ()=>{ setWaterLevel(waterLevel - 1); if (waterLevel < 2) { setCactusAlive(false); // Not enough water kills the cactus } }; const trimCactus = ()=>{ if (cactusAlive && cactusSize > 0) { setCactusSize(cactusSize - 1); } }; const scareBirds = ()=>{ // Functionality to implement bird scaring logic, if needed }; const seedChooser = !seedsSelected ? /*#__PURE__*/ React.createElement("button", { className: "bg-[#a2d2ff] p-2 rounded font-roboto", onClick: chooseSeeds, __source: { fileName: "", lineNumber: 61, columnNumber: 5 }, __self: this }, "Choose Seeds") : null; const cactus = cactusAlive ? /*#__PURE__*/ React.createElement("div", { className: "h-[50px] w-[50px] bg-[#6a994e] m-2", __source: { fileName: "", lineNumber: 67, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }, `Size: ${cactusSize}`)) : /*#__PURE__*/ React.createElement("div", { className: "h-[50px] w-[50px] bg-[#d62828] m-2", __source: { fileName: "", lineNumber: 71, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 72, columnNumber: 7 }, __self: this }, "Cactus Died")); const growButton = cactusAlive && seedsSelected ? /*#__PURE__*/ React.createElement("button", { className: "bg-[#fcbf49] p-2 rounded font-roboto", onClick: growCactus, __source: { fileName: "", lineNumber: 77, columnNumber: 5 }, __self: this }, "Grow") : null; const sellButton = cactusAlive && cactusSize > 0 ? /*#__PURE__*/ React.createElement("button", { className: "bg-[#8338ec] p-2 rounded font-roboto", onClick: sellCactus, __source: { fileName: "", lineNumber: 83, columnNumber: 5 }, __self: this }, "Sell") : null; return /*#__PURE__*/ React.createElement("div", { className: "w-full h-screen p-4 flex flex-col items-center justify-center bg-[#ffc6ff]", __source: { fileName: "", lineNumber: 89, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-[#073b4c] mb-4", __source: { fileName: "", lineNumber: 90, columnNumber: 7 }, __self: this }, `Money: $${money}`), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 91, columnNumber: 7 }, __self: this }, seedChooser, cactus, /*#__PURE__*/ React.createElement("button", { className: "bg-[#ffc8dd] p-2 rounded font-roboto", onClick: waterCactus, __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, "Water"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#ffc8dd] p-2 rounded font-roboto", onClick: underWaterCactus, __source: { fileName: "", lineNumber: 95, columnNumber: 9 }, __self: this }, "Less Water"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#ffc8dd] p-2 rounded font-roboto", onClick: trimCactus, __source: { fileName: "", lineNumber: 96, columnNumber: 9 }, __self: this }, "Trim"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#ffc8dd] p-2 rounded font-roboto", onClick: scareBirds, __source: { fileName: "", lineNumber: 97, columnNumber: 9 }, __self: this }, "🐦"), growButton, sellButton), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 101, columnNumber: 7 }, __self: this }, ` @keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } `)); }