function MainComponent() { const [notesVisibility, setNotesVisibility] = React.useState(true); const [tooltipVisible, setTooltipVisible] = React.useState(false); const toggleNotesVisibility = ()=>setNotesVisibility(!notesVisibility); const toggleTooltip = ()=>setTooltipVisible(!tooltipVisible); const tooltipStyle = tooltipVisible ? 'block' : 'hidden'; return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text text-[#121212]", __source: { fileName: "", lineNumber: 9, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#F5EBE0] p-4 border-b border-[#D1C1AC]", __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto flex justify-between items-center", __source: { fileName: "", lineNumber: 11, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-semibold", __source: { fileName: "", lineNumber: 12, columnNumber: 11 }, __self: this }, "KJV Bible App"), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "p-3 rounded-full bg-[#8A7F7C] text-white mr-2", onClick: toggleNotesVisibility, __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${notesVisibility ? 'fa fa-eye-slash' : 'fa fa-eye'}`, __source: { fileName: "", lineNumber: 18, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "p-3 rounded-full bg-[#8A7F7C] text-white relative", onMouseEnter: toggleTooltip, onMouseLeave: toggleTooltip, __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-sync-alt", __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: `absolute w-auto p-2 m-1 left-1/2 transform -translate-x-1/2 text-sm text-white bg-black rounded ${tooltipStyle}`, __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, "Refresh content"))))), /*#__PURE__*/ React.createElement("main", { className: "max-w-7xl mx-auto p-4", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col lg:flex-row", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("aside", { className: "w-full lg:w-1/5", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#FFF8F0] p-4 shadow rounded mb-4", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 text-xl", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, "Books"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "search-books", placeholder: "Search books...", className: "mb-4 p-3 w-full border border-[#D1C1AC] rounded", __source: { fileName: "", lineNumber: 39, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "overflow-y-auto h-[500px]", __source: { fileName: "", lineNumber: 45, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("section", { className: "w-full lg:w-4/5", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#FFF8F0] p-4 shadow rounded mb-4", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }, "Scripture"), /*#__PURE__*/ React.createElement("div", { className: "text-base mb-4 space-y-4", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "bg-[#FFF8F0] p-4 shadow rounded", __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl mb-4", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, "Community Reflections"), /*#__PURE__*/ React.createElement("div", { className: "text-base space-y-4", __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this })))))); }