function MainComponent() { const [divisionsCollapsed, setDivisionsCollapsed] = React.useState(true); const [adminCollapsed, setAdminCollapsed] = React.useState(true); const [patrolCollapsed, setPatrolCollapsed] = React.useState(true); const [detectivesCollapsed, setDetectivesCollapsed] = React.useState(true); const [subAdminDetailsCollapsed, setSubAdminDetailsCollapsed] = React.useState(true); const [contactCollapsed, setContactCollapsed] = React.useState(true); const ref = React.useRef(null); const [center, setCenter] = React.useState({ lat: 47.5989, lng: -115.1025 }); React.useEffect(()=>{ let timer; if (!divisionsCollapsed) { timer = setTimeout(()=>setDivisionsCollapsed(true), 10000); } return ()=>clearTimeout(timer); }, [ divisionsCollapsed ]); const handleClickOutside = (event)=>{ if (!event.target.closest('#dropdown') && !event.target.closest('#dropdown-contact')) { setDivisionsCollapsed(true); setAdminCollapsed(true); setPatrolCollapsed(true); setDetectivesCollapsed(true); setContactCollapsed(true); } }; React.useEffect(()=>{ document.addEventListener('click', handleClickOutside, true); return ()=>{ document.removeEventListener('click', handleClickOutside, true); }; }, []); return /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-center mt-6 bg-cover h-screen", style: { backgroundColor: 'black', color: 'gold' }, __source: { fileName: "", lineNumber: 37, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-4 flex items-center justify-center underline decoration-green-500", __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/sheriff-star.png", alt: "Sheriff's star", className: "w-12 h-12 mr-2", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }), "Sanders County Sheriff's Office"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4 cursor-pointer", onMouseEnter: ()=>setDivisionsCollapsed(false), __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, "Divisions"), !divisionsCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-lg bg-black text-white", id: "dropdown", onMouseEnter: ()=>setDivisionsCollapsed(false), onMouseLeave: ()=>setDivisionsCollapsed(true), __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2 cursor-pointer relative", onMouseEnter: ()=>setAdminCollapsed(false), onMouseLeave: ()=>setAdminCollapsed(true), __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, "Administration", !adminCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-base pl-5 absolute bg-black text-white left-full top-0", onMouseEnter: ()=>setAdminCollapsed(false), onMouseLeave: ()=>setAdminCollapsed(true), __source: { fileName: "", lineNumber: 63, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2 cursor-pointer", onMouseEnter: ()=>setSubAdminDetailsCollapsed(false), onMouseLeave: ()=>setSubAdminDetailsCollapsed(true), __source: { fileName: "", lineNumber: 66, columnNumber: 21 }, __self: this }, "Sheriff", !subAdminDetailsCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-base pl-5 absolute bg-black text-white top-0 left-full", onMouseEnter: ()=>setSubAdminDetailsCollapsed(false), onMouseLeave: ()=>setSubAdminDetailsCollapsed(true), __source: { fileName: "", lineNumber: 71, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 74, columnNumber: 27 }, __self: this }, "Sheriff Details"))), /*#__PURE__*/ React.createElement("li", { className: "cursor-pointer", onMouseEnter: ()=>setSubAdminDetailsCollapsed(false), onMouseLeave: ()=>setSubAdminDetailsCollapsed(true), __source: { fileName: "", lineNumber: 78, columnNumber: 21 }, __self: this }, "Undersheriff", !subAdminDetailsCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-base pl-5 absolute bg-black text-white top-0 left-full", onMouseEnter: ()=>setSubAdminDetailsCollapsed(false), onMouseLeave: ()=>setSubAdminDetailsCollapsed(true), __source: { fileName: "", lineNumber: 83, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 86, columnNumber: 27 }, __self: this }, "Undersheriff Details"))))), /*#__PURE__*/ React.createElement("li", { className: "mb-2 cursor-pointer relative", onMouseEnter: ()=>setPatrolCollapsed(false), onMouseLeave: ()=>setPatrolCollapsed(true), __source: { fileName: "", lineNumber: 93, columnNumber: 15 }, __self: this }, "Patrol Deputies", !patrolCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-base pl-5 absolute bg-black text-white left-full top-0", onMouseEnter: ()=>setPatrolCollapsed(false), onMouseLeave: ()=>setPatrolCollapsed(true), __source: { fileName: "", lineNumber: 100, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 103, columnNumber: 21 }, __self: this }, "What We Do"), /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 104, columnNumber: 21 }, __self: this }, "How The County is Patrolled"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 105, columnNumber: 21 }, __self: this }, "Recruitment"))), /*#__PURE__*/ React.createElement("li", { className: "mb-2 cursor-pointer relative", onMouseEnter: ()=>setDetectivesCollapsed(false), onMouseLeave: ()=>setDetectivesCollapsed(true), __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this }, "Detectives", !detectivesCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-base pl-5 absolute bg-black text-white left-full top-0", onMouseEnter: ()=>setDetectivesCollapsed(false), onMouseLeave: ()=>setDetectivesCollapsed(true), __source: { fileName: "", lineNumber: 116, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 119, columnNumber: 21 }, __self: this }, "Who We Are"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 120, columnNumber: 21 }, __self: this }, "Submit a Tip Online"))), /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 124, columnNumber: 15 }, __self: this }, "Detention Officers"), /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 125, columnNumber: 15 }, __self: this }, "911 Dispatch"), /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, "Civil"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 127, columnNumber: 15 }, __self: this }, "Reserve Deputies"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 131, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4 cursor-pointer", onMouseEnter: ()=>setContactCollapsed(false), __source: { fileName: "", lineNumber: 132, columnNumber: 11 }, __self: this }, "Contact Us"), !contactCollapsed && /*#__PURE__*/ React.createElement("ul", { className: "text-lg bg-black text-white", id: "dropdown-contact", onMouseLeave: ()=>setContactCollapsed(true), __source: { fileName: "", lineNumber: 139, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 143, columnNumber: 15 }, __self: this }, "Phone: (555) 123-4567"), /*#__PURE__*/ React.createElement("li", { className: "mb-2", __source: { fileName: "", lineNumber: 144, columnNumber: 15 }, __self: this }, "Email: contact@sanderscountysheriff.org"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 145, columnNumber: 15 }, __self: this }, "Address: 123 Main St, Sanders County"))))); }