function ClickButton({ onClick, disabled, text = "Нажми на хомяка! 🐹" }) { return /*#__PURE__*/ React.createElement("button", { onClick: onClick, disabled: disabled, className: "inline-block px-8 py-4 text-xl font-roboto bg-[#F4EBE4] hover:bg-[#E8D5C7] text-[#725A48] rounded-full transform transition-transform hover:scale-105 disabled:opacity-50 disabled:hover:scale-100", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, text, " 🐹"); } function ClickButtonStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-8 space-y-4", __source: { fileName: "", lineNumber: 15, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ClickButton, { onClick: ()=>alert("Хомяк счастлив!"), __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ClickButton, { onClick: ()=>alert("Хомяк спит..."), disabled: true, __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ClickButton, { onClick: ()=>alert("Хомяк танцует!"), text: "Потанцуй со мной", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this })); } function Header({ coins, coinsPerClick, coinsPerHour, energy }) { return /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] text-white p-4 rounded-lg shadow-lg flex items-center justify-between", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-6", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-coins text-yellow-400 mr-2", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, coins)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-hand-pointer text-blue-400 mr-2", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, coinsPerClick, "/клик")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock text-green-400 mr-2", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this }, coinsPerHour, "/час")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt text-yellow-300 mr-2", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, energy, "/2500")))); } function HeaderStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 28, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(Header, { coins: 1000, coinsPerClick: 10, coinsPerHour: 150, energy: 1200, __source: { fileName: "", lineNumber: 29, columnNumber: 7 }, __self: this })); } function MainComponent() { const [coins, setCoins] = useState(0); const [activeSection, setActiveSection] = useState("main"); const coinsPerClick = 1; const coinsPerHour = 100; const energy = 1500; const maxEnergy = 2500; const menuItems = [ { id: "main", title: "Главная" }, { id: "profile", title: "Профиль" }, { id: "shop", title: "Магазин" }, { id: "settings", title: "Настройки" } ]; const handleClick = ()=>{ setCoins((prev)=>prev + coinsPerClick); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#121212]", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(React.Fragment, null), /*#__PURE__*/ React.createElement("nav", { className: "bg-[#1a1a1a] p-4", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex flex-wrap justify-center gap-4", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, menuItems.map((item)=>/*#__PURE__*/ React.createElement("li", { key: item.id, __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveSection(item.id), className: `px-6 py-2 rounded-lg font-roboto transition-colors ${activeSection === item.id ? "bg-[#2a2a2a] text-[#ffffff]" : "bg-[#232323] text-[#a0a0a0] hover:bg-[#2a2a2a] hover:text-[#ffffff]"}`, __source: { fileName: "", lineNumber: 28, columnNumber: 15 }, __self: this }, item.title))))), /*#__PURE__*/ React.createElement("main", { className: "container mx-auto px-4 py-8", __source: { fileName: "", lineNumber: 44, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center gap-8", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center gap-2", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 47, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-coins text-[#FFD700] text-xl", __source: { fileName: "", lineNumber: 48, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-2xl font-bold text-white font-roboto", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, coins)), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4 text-center", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] p-3 rounded-lg", __source: { fileName: "", lineNumber: 55, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#888] text-sm font-roboto", __source: { fileName: "", lineNumber: 56, columnNumber: 17 }, __self: this }, "За клик"), /*#__PURE__*/ React.createElement("p", { className: "text-white font-roboto", __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, coinsPerClick)), /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] p-3 rounded-lg", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#888] text-sm font-roboto", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }, "В час"), /*#__PURE__*/ React.createElement("p", { className: "text-white font-roboto", __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, coinsPerHour))), /*#__PURE__*/ React.createElement("div", { className: "w-48 bg-[#1a1a1a] rounded-full h-3", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#4CAF50] h-3 rounded-full", style: { width: `${energy / maxEnergy * 100}%` }, __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-[#888] text-sm font-roboto", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "Энергия: ", energy, "/", maxEnergy)), /*#__PURE__*/ React.createElement("div", { className: "transform hover:scale-105 transition-transform", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(ClickButton, { onClick: handleClick, text: "Кликни на хомяка!", __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }))))); }