function MainComponent() { const [balance, setBalance] = React.useState(3.2); const [side, setSide] = React.useState(''); const [betAmount, setBetAmount] = React.useState(''); const [resultMessage, setResultMessage] = React.useState(''); const qrCode = "your-qr-code.png"; const handleBetAmountChange = (event)=>setBetAmount(event.target.value); const handleSideChange = (event)=>setSide(event.target.value); const handleFormSubmit = (event)=>{ event.preventDefault(); const win = Math.random() < 0.5; if (side && betAmount > 0) { if (win) { setBalance(balance + parseFloat(betAmount)); setResultMessage(`You won! Balance is now ${balance + parseFloat(betAmount)} ETH`); } else { setBalance(balance - parseFloat(betAmount)); setResultMessage(`You lost! Balance is now ${balance - parseFloat(betAmount)} ETH`); } } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-gradient-to-br from-blue-600 to-blue-300 text-white", __source: { fileName: "", lineNumber: 25, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl font-bold mb-10", __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this }, "Crypto Betting Game"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mb-5", __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-lg font-roboto mb-2", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, "Your Balance: ", balance.toFixed(3), " ETH"), /*#__PURE__*/ React.createElement("img", { src: qrCode, alt: "QR code for deposit address", className: "w-[150px] h-[150px]", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-xs font-roboto", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, "Scan to deposit more ETH")), /*#__PURE__*/ React.createElement("form", { className: "flex flex-col items-center", onSubmit: handleFormSubmit, __source: { fileName: "", lineNumber: 32, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "betAmount", className: "font-roboto text-lg mb-2", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, "Enter your bet:"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "betAmount", value: betAmount, onChange: handleBetAmountChange, className: "mb-4 p-2 w-[90%] max-w-sm text-black", min: "0", step: "0.1", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-4", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mr-4", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "radio", id: "heads", name: "side", value: "heads", checked: side === 'heads', onChange: handleSideChange, className: "mr-2 h-4 w-4", __source: { fileName: "", lineNumber: 47, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "heads", className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "🌞 Heads")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "radio", id: "tails", name: "side", value: "tails", checked: side === 'tails', onChange: handleSideChange, className: "mr-2 h-4 w-4", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "tails", className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, "🌜 Tails"))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-purple-600 hover:bg-purple-700 text-white font-bold py-2 px-6 rounded transition-colors", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, "Flip Coin")), resultMessage && /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-lg", __source: { fileName: "", lineNumber: 78, columnNumber: 25 }, __self: this }, resultMessage)); }