function MainComponent() { const [user, setUser] = React.useState({ name: "Алекс Футурист", bio: "Исследователь будущего и технологический энтузиаст", stats: { followers: 5280, following: 420, posts: 69 } }); const [activeSection, setActiveSection] = React.useState("profile"); const menuItems = [ { label: "Профиль", icon: "person", section: "profile" }, { label: "Посты", icon: "article", section: "posts" }, { label: "Галерея", icon: "photo_library", section: "gallery" }, { label: "Настройки", icon: "settings", section: "settings" } ]; return /*#__PURE__*/ React.createElement("q-page", { class: "bg-gradient-to-br from-purple-600 to-blue-500 text-white", __source: { fileName: "", lineNumber: 20, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("q-page-container", { __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { class: "row q-pa-md", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { class: "col-12 col-md-3", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("q-list", { bordered: true, class: "rounded-borders bg-white bg-opacity-10", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, menuItems.map((item)=>/*#__PURE__*/ React.createElement("q-item", { key: item.section, clickable: true, "v-ripple": true, onClick: ()=>setActiveSection(item.section), active: activeSection === item.section, "active-class": "text-white bg-primary", __source: { fileName: "", lineNumber: 26, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("q-item-section", { avatar: true, __source: { fileName: "", lineNumber: 34, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("q-icon", { name: item.icon, __source: { fileName: "", lineNumber: 35, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("q-item-section", { __source: { fileName: "", lineNumber: 37, columnNumber: 19 }, __self: this }, item.label))))), /*#__PURE__*/ React.createElement("div", { class: "col-12 col-md-9 q-pl-md-lg", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("q-card", { flat: true, bordered: true, class: "bg-white bg-opacity-10", __source: { fileName: "", lineNumber: 44, columnNumber: 13 }, __self: this }, activeSection === "profile" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("q-card-section", { __source: { fileName: "", lineNumber: 47, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { class: "row items-center q-col-gutter-md", __source: { fileName: "", lineNumber: 48, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { class: "col-12 col-md-auto", __source: { fileName: "", lineNumber: 49, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("q-avatar", { size: "120px", color: "primary", "text-color": "white", __source: { fileName: "", lineNumber: 50, columnNumber: 25 }, __self: this }, user.name.charAt(0))), /*#__PURE__*/ React.createElement("div", { class: "col", __source: { fileName: "", lineNumber: 58, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { class: "text-h3 q-mb-sm", __source: { fileName: "", lineNumber: 59, columnNumber: 25 }, __self: this }, user.name), /*#__PURE__*/ React.createElement("p", { class: "text-h6 text-blue-2", __source: { fileName: "", lineNumber: 60, columnNumber: 25 }, __self: this }, user.bio)))), /*#__PURE__*/ React.createElement("q-card-section", { __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { class: "row q-col-gutter-md", __source: { fileName: "", lineNumber: 66, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { class: "col text-center", __source: { fileName: "", lineNumber: 67, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("p", { class: "text-h4", __source: { fileName: "", lineNumber: 68, columnNumber: 25 }, __self: this }, user.stats.followers), /*#__PURE__*/ React.createElement("p", { class: "text-caption", __source: { fileName: "", lineNumber: 69, columnNumber: 25 }, __self: this }, "Подписчики")), /*#__PURE__*/ React.createElement("div", { class: "col text-center", __source: { fileName: "", lineNumber: 71, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("p", { class: "text-h4", __source: { fileName: "", lineNumber: 72, columnNumber: 25 }, __self: this }, user.stats.following), /*#__PURE__*/ React.createElement("p", { class: "text-caption", __source: { fileName: "", lineNumber: 73, columnNumber: 25 }, __self: this }, "Подписки")), /*#__PURE__*/ React.createElement("div", { class: "col text-center", __source: { fileName: "", lineNumber: 75, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("p", { class: "text-h4", __source: { fileName: "", lineNumber: 76, columnNumber: 25 }, __self: this }, user.stats.posts), /*#__PURE__*/ React.createElement("p", { class: "text-caption", __source: { fileName: "", lineNumber: 77, columnNumber: 25 }, __self: this }, "Посты")))), /*#__PURE__*/ React.createElement("q-card-actions", { vertical: true, class: "q-gutter-y-md q-px-md", __source: { fileName: "", lineNumber: 82, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("q-btn", { color: "primary", label: "Редактировать профиль", class: "full-width", __source: { fileName: "", lineNumber: 83, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("q-btn", { color: "secondary", label: "Поделиться профилем", class: "full-width", __source: { fileName: "", lineNumber: 88, columnNumber: 21 }, __self: this }))), activeSection === "posts" && /*#__PURE__*/ React.createElement("q-card-section", { __source: { fileName: "", lineNumber: 97, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { class: "text-h4", __source: { fileName: "", lineNumber: 98, columnNumber: 19 }, __self: this }, "Посты пользователя"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 99, columnNumber: 19 }, __self: this }, "Здесь будет список постов")), activeSection === "gallery" && /*#__PURE__*/ React.createElement("q-card-section", { __source: { fileName: "", lineNumber: 103, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { class: "text-h4", __source: { fileName: "", lineNumber: 104, columnNumber: 19 }, __self: this }, "Галерея"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 105, columnNumber: 19 }, __self: this }, "Здесь будет галерея изображений")), activeSection === "settings" && /*#__PURE__*/ React.createElement("q-card-section", { __source: { fileName: "", lineNumber: 109, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { class: "text-h4", __source: { fileName: "", lineNumber: 110, columnNumber: 19 }, __self: this }, "Настройки"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 111, columnNumber: 19 }, __self: this }, "Здесь будут настройки профиля"))))))); }