function MainComponent() { const [showSidebar, setShowSidebar] = React.useState(false); const handleMouseEnter = ()=>{ setShowSidebar(true); }; const handleMouseLeave = ()=>{ setShowSidebar(false); }; return /*#__PURE__*/ React.createElement("div", { className: "relative min-h-screen bg-[#e2e8f0] font-roboto", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-4 left-4", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bars text-2xl cursor-pointer", onMouseEnter: handleMouseEnter, __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: `fixed flex flex-col bg-[#f7f6f3] h-full shadow-lg ${showSidebar ? 'w-[250px]' : 'w-0'} transition-all duration-300`, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between p-3 border-b border-gray-300", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, "Notion"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-search text-lg", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "p-3", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "flex items-center w-full p-2 rounded hover:bg-gray-200", name: "newPage", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus text-lg", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, "New Page"))), /*#__PURE__*/ React.createElement("div", { className: "flex-grow p-3", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "flex items-center w-full p-2 rounded hover:bg-gray-200", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-home text-lg", __source: { fileName: "", lineNumber: 35, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }, "Home")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center w-full p-2 rounded hover:bg-gray-200", __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-book-open text-lg", __source: { fileName: "", lineNumber: 39, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, "Reading List")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center w-full p-2 rounded hover:bg-gray-200", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-calendar-alt text-lg", __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this }, "Calendar")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center w-full p-2 rounded hover:bg-gray-200", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cog text-lg", __source: { fileName: "", lineNumber: 47, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 48, columnNumber: 15 }, __self: this }, "Settings")))))); }