function MainComponent() { const [activeIndex, setActiveIndex] = React.useState(0); const [teams] = React.useState([ 'Lakers', 'Celtics', 'Warriors', 'Bulls', 'Heat', 'Nets' ]); const [scores, setScores] = React.useState([ 0, 0 ]); React.useEffect(()=>{ const intervalId = setInterval(()=>{ setScores((prevScores)=>[ Math.floor(Math.random() * 100), Math.floor(Math.random() * 100) ]); }, 3000); return ()=>clearInterval(intervalId); }, []); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-screen bg-[#121212] text-white", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center p-4 border-b border-gray-700", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-3xl", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, "NBA Live Scores")), /*#__PURE__*/ React.createElement("div", { className: "flex-grow overflow-auto", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between p-4", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, teams[activeIndex]), /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-roboto", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, scores[0], " - ", scores[1]), /*#__PURE__*/ React.createElement("div", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, teams[activeIndex + 1]))), /*#__PURE__*/ React.createElement("div", { className: "flex p-4 space-x-2", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, teams.map((team, index)=>/*#__PURE__*/ React.createElement("button", { key: team, onClick: ()=>setActiveIndex(index), className: `font-roboto p-2 ${index === activeIndex ? 'bg-blue-600' : 'bg-gray-800'} rounded-lg focus:outline-none`, __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, team))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 36, columnNumber: 7 }, __self: this }, ` @keyframes scoreUpdate { 0%, 100% { color: #ffffff; } 50% { color: #4CAF50; } } `)); }