function PlayerStats({ hunger = 100, energy = 100, cash = 0 }) { return /*#__PURE__*/ React.createElement("div", { className: "flex gap-4 p-4 bg-[#1a1a1a] rounded-lg text-white font-roboto", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-drumstick-bite text-yellow-500", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, hunger, "%")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt text-blue-500", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, energy, "%")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-dollar-sign text-green-500", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "$", cash))); } function PlayerStatsStory() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-4 p-4", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PlayerStats, { hunger: 75, energy: 50, cash: 1250, __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(PlayerStats, { hunger: 25, energy: 10, cash: 500, __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(PlayerStats, { hunger: 100, energy: 100, cash: 0, __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this })); } function SettingsMenu() { const [settings, setSettings] = useState({ sound: true, difficulty: "medium", controls: "keyboard" }); const handleSettingChange = (setting, value)=>{ setSettings((prev)=>({ ...prev, [setting]: value })); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-6", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-roboto font-bold mb-6 text-gray-800", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, "Settings"), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "font-roboto text-gray-700", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, "Sound"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleSettingChange("sound", !settings.sound), className: `w-14 h-7 rounded-full p-1 transition-colors duration-200 ease-in-out ${settings.sound ? "bg-green-500" : "bg-gray-300"}`, __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `w-5 h-5 rounded-full bg-white transform transition-transform duration-200 ease-in-out ${settings.sound ? "translate-x-7" : "translate-x-0"}`, __source: { fileName: "", lineNumber: 31, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "font-roboto text-gray-700", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, "Difficulty"), /*#__PURE__*/ React.createElement("select", { value: settings.difficulty, onChange: (e)=>handleSettingChange("difficulty", e.target.value), className: "w-full p-2 border border-gray-300 rounded-md font-roboto focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "easy", __source: { fileName: "", lineNumber: 48, columnNumber: 15 }, __self: this }, "Easy"), /*#__PURE__*/ React.createElement("option", { value: "medium", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, "Medium"), /*#__PURE__*/ React.createElement("option", { value: "hard", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, "Hard"))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "font-roboto text-gray-700", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, "Controls"), /*#__PURE__*/ React.createElement("select", { value: settings.controls, onChange: (e)=>handleSettingChange("controls", e.target.value), className: "w-full p-2 border border-gray-300 rounded-md font-roboto focus:outline-none focus:ring-2 focus:ring-blue-500", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "keyboard", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, "Keyboard"), /*#__PURE__*/ React.createElement("option", { value: "mouse", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "Mouse"), /*#__PURE__*/ React.createElement("option", { value: "gamepad", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }, "Gamepad")))))); } function SettingsMenuStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 74, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SettingsMenu, { __source: { fileName: "", lineNumber: 75, columnNumber: 7 }, __self: this })); } function ComputerShop({ credits = 1000, onPurchase }) { const [selectedCategory, setSelectedCategory] = useState("computer"); const shopItems = { computer: [ { id: 1, name: "CPU Upgrade", price: 200, description: "Faster processing speed", icon: "fa-microchip" }, { id: 2, name: "RAM Boost", price: 150, description: "More memory capacity", icon: "fa-memory" }, { id: 3, name: "SSD Drive", price: 300, description: "Quick storage access", icon: "fa-hard-drive" } ], food: [ { id: 4, name: "Energy Drink", price: 50, description: "Temporary speed boost", icon: "fa-bolt" }, { id: 5, name: "Pizza", price: 100, description: "Health restoration", icon: "fa-pizza-slice" }, { id: 6, name: "Coffee", price: 30, description: "Minor energy boost", icon: "fa-mug-hot" } ], hacking: [ { id: 7, name: "Firewall Breaker", price: 400, description: "Bypass security systems", icon: "fa-shield-alt" }, { id: 8, name: "Data Miner", price: 350, description: "Extract valuable data", icon: "fa-network-wired" }, { id: 9, name: "Encryption Key", price: 250, description: "Access encrypted files", icon: "fa-key" } ] }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] text-gray-100 p-6 rounded-lg min-h-screen", __source: { fileName: "", lineNumber: 77, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 78, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-8", __source: { fileName: "", lineNumber: 79, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-cyber", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, "Digital Black Market"), /*#__PURE__*/ React.createElement("div", { className: "text-xl font-roboto", __source: { fileName: "", lineNumber: 81, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-coins mr-2 text-yellow-400", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }), credits, " Credits")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4 mb-6", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, Object.keys(shopItems).map((category)=>/*#__PURE__*/ React.createElement("button", { key: category, onClick: ()=>setSelectedCategory(category), className: `px-6 py-2 rounded-md font-roboto capitalize ${selectedCategory === category ? "bg-[#00ff00] text-black" : "bg-[#333333] hover:bg-[#444444]"}`, __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, category))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 103, columnNumber: 9 }, __self: this }, shopItems[selectedCategory].map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.id, className: "bg-[#2a2a2a] p-6 rounded-lg hover:bg-[#333333] transition-colors", __source: { fileName: "", lineNumber: 105, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-4", __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${item.icon} text-[#00ff00] text-2xl mr-3`, __source: { fileName: "", lineNumber: 111, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-roboto", __source: { fileName: "", lineNumber: 114, columnNumber: 19 }, __self: this }, item.name)), /*#__PURE__*/ React.createElement("span", { className: "text-yellow-400 font-roboto", __source: { fileName: "", lineNumber: 116, columnNumber: 17 }, __self: this }, item.price, " Cr")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 mb-4 font-roboto", __source: { fileName: "", lineNumber: 120, columnNumber: 15 }, __self: this }, item.description), /*#__PURE__*/ React.createElement("button", { onClick: ()=>onPurchase?.(item), disabled: credits < item.price, className: `w-full py-2 rounded-md font-roboto ${credits >= item.price ? "bg-[#00ff00] text-black hover:bg-[#00cc00]" : "bg-gray-600 cursor-not-allowed"}`, __source: { fileName: "", lineNumber: 123, columnNumber: 15 }, __self: this }, credits >= item.price ? "Purchase" : "Insufficient Credits")))))); } function ComputerShopStory() { const [credits, setCredits] = useState(1000); const handlePurchase = (item)=>{ setCredits((prev)=>prev - item.price); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 150, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ComputerShop, { credits: credits, onPurchase: handlePurchase, __source: { fileName: "", lineNumber: 151, columnNumber: 7 }, __self: this })); } function MainMenu({ selectedIndex = 0, onSelect }) { const [currentIndex, setCurrentIndex] = useState(selectedIndex); const menuItems = [ "New Game", "Buildings", "Tasks", "Shop", "Settings" ]; useEffect(()=>{ const handleKeyDown = (e)=>{ if (e.key === "ArrowUp") { setCurrentIndex((prev)=>prev > 0 ? prev - 1 : prev); } else if (e.key === "ArrowDown") { setCurrentIndex((prev)=>prev < menuItems.length - 1 ? prev + 1 : prev); } else if (e.key === "Enter") { onSelect?.(currentIndex); } }; window.addEventListener("keydown", handleKeyDown); return ()=>window.removeEventListener("keydown", handleKeyDown); }, [ onSelect ]); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#121212]", __source: { fileName: "", lineNumber: 23, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, menuItems.map((item, index)=>/*#__PURE__*/ React.createElement("div", { key: item, className: `px-8 py-2 text-2xl font-roboto cursor-pointer ${index === currentIndex ? "text-[#ffffff] bg-[#333333]" : "text-[#888888]"}`, onClick: ()=>{ setCurrentIndex(index); onSelect?.(index); }, __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, item)))); } function MainMenuStory() { return /*#__PURE__*/ React.createElement("div", { className: "w-full h-full", __source: { fileName: "", lineNumber: 48, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainMenu, { onSelect: (index)=>console.log(`Selected: ${index}`), __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this })); } function MainMenu2({ onNewGame, onSettings }) { const [selectedIndex, setSelectedIndex] = useState(0); const menuItems = [ "New Game", "Settings" ]; useEffect(()=>{ const handleKeyPress = (e)=>{ if (e.key === "ArrowUp") { setSelectedIndex((prev)=>prev > 0 ? prev - 1 : prev); } else if (e.key === "ArrowDown") { setSelectedIndex((prev)=>prev < menuItems.length - 1 ? prev + 1 : prev); } else if (e.key === " ") { if (selectedIndex === 0) onNewGame?.(); if (selectedIndex === 1) onSettings?.(); } }; window.addEventListener("keydown", handleKeyPress); return ()=>window.removeEventListener("keydown", handleKeyPress); }, [ selectedIndex, onNewGame, onSettings ]); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#1a1a1a] text-white font-mono", __source: { fileName: "", lineNumber: 24, columnNumber: 5 }, __self: this }, menuItems.map((item, index)=>/*#__PURE__*/ React.createElement("div", { key: item, className: `text-2xl py-4 px-8 ${selectedIndex === index ? "bg-[#333] text-yellow-400" : ""}`, __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, item))); } function MainMenu2Story() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 41, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainMenu2, { onNewGame: ()=>alert("New Game"), onSettings: ()=>alert("Settings"), __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this })); } function MainComponent() { const [view, setView] = useState("menu"); const [player, setPlayer] = useState({ money: 1000, hunger: 100, sleep: 100, location: "hideout", isHacking: false, escaping: false }); const [computer, setComputer] = useState({ cpu: "Basic CPU", ram: "Basic RAM", storage: "Basic SSD", security: "Basic Firewall" }); const locations = [ { name: "Local Bank", risk: "Low", reward: 1000 }, { name: "Tech Company", risk: "Medium", reward: 5000 }, { name: "Government Facility", risk: "High", reward: 10000 } ]; const startHack = (location)=>{ setPlayer((prev)=>({ ...prev, isHacking: true, location: location.name })); setView("hacking"); }; const escape = ()=>{ setPlayer((prev)=>({ ...prev, escaping: true })); setTimeout(()=>{ setPlayer((prev)=>({ ...prev, escaping: false, isHacking: false, location: "hideout", sleep: prev.sleep - 20, hunger: prev.hunger - 15 })); setView("menu"); }, 3000); }; const handleMenuSelect = (index)=>{ switch(index){ case 0: setView("missions"); break; case 1: setView("shop"); break; case 2: setView("settings"); break; default: setView("menu"); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#000] text-[#00ff00] p-4 font-mono", __source: { fileName: "", lineNumber: 63, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PlayerStats, { hunger: player.hunger, energy: player.sleep, cash: player.money, __source: { fileName: "", lineNumber: 64, columnNumber: 7 }, __self: this }), view === "menu" && /*#__PURE__*/ React.createElement(MainMenu2, { onNewGame: ()=>setView("missions"), onSettings: ()=>setView("settings"), __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }), view === "shop" && /*#__PURE__*/ React.createElement(ComputerShop, { credits: player.money, onPurchase: (item)=>{ setPlayer((prev)=>({ ...prev, money: prev.money - item.price })); }, __source: { fileName: "", lineNumber: 78, columnNumber: 9 }, __self: this }), view === "settings" && /*#__PURE__*/ React.createElement(SettingsMenu, { __source: { fileName: "", lineNumber: 86, columnNumber: 31 }, __self: this }), view === "missions" && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 89, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4", __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }, "Available Targets"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, locations.map((loc)=>/*#__PURE__*/ React.createElement("div", { key: loc.name, className: "border border-[#00ff00] p-4 rounded hover:bg-[#003300] cursor-pointer", onClick: ()=>startHack(loc), __source: { fileName: "", lineNumber: 93, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { __source: { fileName: "", lineNumber: 98, columnNumber: 17 }, __self: this }, loc.name), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 99, columnNumber: 17 }, __self: this }, "Risk: ", loc.risk), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this }, "Reward: $", loc.reward))))), view === "hacking" && /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 108, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl", __source: { fileName: "", lineNumber: 109, columnNumber: 11 }, __self: this }, "Hacking ", player.location, "..."), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 110, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#ff0000] text-white px-4 py-2 rounded", onClick: escape, __source: { fileName: "", lineNumber: 111, columnNumber: 13 }, __self: this }, player.escaping ? "Escaping..." : "Emergency Escape!"))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 121, columnNumber: 7 }, __self: this }, ` @keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } .escaping { animation: blink 0.5s infinite; } `)); }