function GoldenStartGameButton({ label, onClick }) { return /*#__PURE__*/ React.createElement("button", { onClick: onClick, className: "bg-[#ffda77] px-6 py-3 rounded-full font-roboto text-[#000000] text-lg", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, label); } function GoldenStartGameButtonStory() { const startGame = ()=>console.log("Game started"); return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(GoldenStartGameButton, { label: "Start Game", onClick: startGame, __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this })); } function MainComponent() { const [gameStarted, setGameStarted] = React.useState(false); const [score, setScore] = React.useState(0); const startGame = ()=>{ setGameStarted(true); setScore(0); }; return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-screen bg-[#70c5ff]", __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center gap-8", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl text-[#ffffff] font-bold font-roboto", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, "Flappy bOrder"), /*#__PURE__*/ React.createElement("div", { className: "text-2xl text-[#ffffff] font-roboto", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Score: ", score), gameStarted ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "bg-[#ffffff] w-[60px] h-[60px] rounded-full", style: { animation: 'fly 1.5s linear infinite' }, __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setScore(score + 1), className: "bg-[#ffda77] px-6 py-3 rounded-full font-roboto text-[#000000] text-lg", __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, "Increase Score")) : /*#__PURE__*/ React.createElement("div", { className: "bg-[#ffffff] w-[60px] h-[60px] rounded-full animate-bounce", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement(GoldenStartGameButton, { label: "Start Game", onClick: startGame, __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, ` @keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } } div.animate-bounce { animation: bounce 1s infinite; } @keyframes fly { 0% {transform: translateX(0px) rotate(45deg);} 50% {transform: translateX(20px) rotate(-45deg);} 100% {transform: translateX(0px) rotate(45deg);} } `)); }