@blocklet/discuss-kit-ux 1.6.253 → 1.6.255

package/dist/index.umd.js

@@ -1,6 +1,6 @@
 (function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("@blocklet/labels"), require("react/jsx-runtime"), require("@mui/material/styles"), require("@arcblock/ux/lib/Theme"), require("react"), require("@mui/material"), require("lodash/isNil"), require("@blocklet/editor/lib/config"), require("react-lazy-with-preload"), require("@lexical/react/LexicalComposerContext"), require("lexical"), require("ahooks"), require("@mui/material/Box"), require("@mui/lab/LoadingButton"), require("@mui/icons-material"), require("@arcblock/ux/lib/Locale/context"), require("@mui/material/Alert"), require("lodash/isBoolean"), require("@mui/material/Button"), require("@arcblock/did-connect/lib/Avatar"), require("@mui/material/AvatarGroup"), require("@mui/material/colors"), require("@mui/material/useMediaQuery"), require("@arcblock/ux/lib/DID"), require("@mui/material/Tooltip"), require("react-router-dom"), require("@arcblock/ux/lib/RelativeTime"), require("@mui/material/Chip"), require("@mui/material/Stack"), require("lodash/groupBy"), require("lodash/flatMap"), require("lodash/uniqBy"), require("lodash/trim"), require("@mui/material/Avatar"), require("@mui/icons-material/BrokenImage"), require("@iconify/react"), require("@arcblock/ux/lib/Empty"), require("@arcblock/did-connect/lib/Session"), require("@mui/icons-material/NotificationsActiveOutlined"), require("@blocklet/editor/lib/ext/CheckboxPlugin"), require("@arcblock/did-connect/lib/Address"), require("@mui/material/MenuItem"), require("clsx"), require("@mui/material/IconButton"), require("@mui/material/Menu"), require("@arcblock/ux/lib/Dialog"), require("lodash/orderBy"), require("@mui/material/Typography"), require("@mui/material/Skeleton"), require("url-join"), require("react-dom"), require("dayjs"), require("dayjs/plugin/relativeTime"), require("mitt"), require("@mui/material/CircularProgress"), require("react-helmet"), require("react-flip-toolkit"), require("@mui/material/colors/grey"), require("semver-compare"), require("@arcblock/bridge"), require("@mui/material/Fab"), require("lodash/debounce"), require("@mui/material/TextField"), require("@mui/icons-material/Add"), require("axios"), require("@arcblock/ux/lib/Toast"), require("@mui/material/Pagination"), require("unstated-next"), require("js-cookie"), require("@arcblock/ws"), require("@emotion/css"), require("@blocklet/editor/lib/ext/OnContentChangePlugin"), require("@blocklet/editor/lib/ext/ShortcutPlugin"), require("@blocklet/editor/lib/ext/SafeAreaPlugin"), require("@lexical/text"), require("@blocklet/editor/lib/main/nodes/ImageNode"), require("@blocklet/editor/lib/ext/VideoPlugin/VideoNode")) : typeof define === "function" && define.amd ? define(["exports", "@blocklet/labels", "react/jsx-runtime", "@mui/material/styles", "@arcblock/ux/lib/Theme", "react", "@mui/material", "lodash/isNil", "@blocklet/editor/lib/config", "react-lazy-with-preload", "@lexical/react/LexicalComposerContext", "lexical", "ahooks", "@mui/material/Box", "@mui/lab/LoadingButton", "@mui/icons-material", "@arcblock/ux/lib/Locale/context", "@mui/material/Alert", "lodash/isBoolean", "@mui/material/Button", "@arcblock/did-connect/lib/Avatar", "@mui/material/AvatarGroup", "@mui/material/colors", "@mui/material/useMediaQuery", "@arcblock/ux/lib/DID", "@mui/material/Tooltip", "react-router-dom", "@arcblock/ux/lib/RelativeTime", "@mui/material/Chip", "@mui/material/Stack", "lodash/groupBy", "lodash/flatMap", "lodash/uniqBy", "lodash/trim", "@mui/material/Avatar", "@mui/icons-material/BrokenImage", "@iconify/react", "@arcblock/ux/lib/Empty", "@arcblock/did-connect/lib/Session", "@mui/icons-material/NotificationsActiveOutlined", "@blocklet/editor/lib/ext/CheckboxPlugin", "@arcblock/did-connect/lib/Address", "@mui/material/MenuItem", "clsx", "@mui/material/IconButton", "@mui/material/Menu", "@arcblock/ux/lib/Dialog", "lodash/orderBy", "@mui/material/Typography", "@mui/material/Skeleton", "url-join", "react-dom", "dayjs", "dayjs/plugin/relativeTime", "mitt", "@mui/material/CircularProgress", "react-helmet", "react-flip-toolkit", "@mui/material/colors/grey", "semver-compare", "@arcblock/bridge", "@mui/material/Fab", "lodash/debounce", "@mui/material/TextField", "@mui/icons-material/Add", "axios", "@arcblock/ux/lib/Toast", "@mui/material/Pagination", "unstated-next", "js-cookie", "@arcblock/ws", "@emotion/css", "@blocklet/editor/lib/ext/OnContentChangePlugin", "@blocklet/editor/lib/ext/ShortcutPlugin", "@blocklet/editor/lib/ext/SafeAreaPlugin", "@lexical/text", "@blocklet/editor/lib/main/nodes/ImageNode", "@blocklet/editor/lib/ext/VideoPlugin/VideoNode"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.DiscussKitComponents = {}, global.labels, global.jsxRuntime, global.styles, global.Theme, global.require$$0, global.material, global.isNil, global.config, global.reactLazyWithPreload, global.LexicalComposerContext, global.lexical$1, global.ahooks, global.Box, global.LoadingButton, global.iconsMaterial, global.context, global.Alert, global.isBoolean, global.Button, global.DidAvatar, global.AvatarGroup, global.colors, global.useMediaQuery, global.DID, global.Tooltip, global.reactRouterDom, global.UxRelativeTime, global.Chip, global.Stack, global.groupBy, global.flatMap, global.uniqBy, global.trim, global.Avatar$1, global.BrokenImageIcon, global.react, global.Empty$3, global.Session, global.NotificationsActiveOutlinedIcon, global.CheckboxPlugin, global.DIDAddress, global.MuiMenuItem, global.clsx, global.IconButton$1, global.MuiMenu, global.Dialog, global.orderBy, global.Typography, global.Skeleton, global.joinUrl, global.ReactDOM, global.dayjs, global.relativeTime, global.mitt, global.CircularProgress, global.reactHelmet, global.reactFlipToolkit, global.grey, global.cmp, global.bridge, global.Fab, global.debounce, global.TextField, global.AddIcon, global.axios, global.Toast, global.MuiPagination, global.unstatedNext, global.Cookie, global.ws, global.css, global.OnContentChangePlugin, global.ShortcutPlugin, global.SafeAreaPlugin, global.text, global.ImageNode, global.VideoNode));
-})(this, function(exports2, labels, jsxRuntime, styles, Theme, require$$0, material, isNil, config, reactLazyWithPreload, LexicalComposerContext, lexical$1, ahooks, Box, LoadingButton, iconsMaterial, context, Alert, isBoolean, Button, DidAvatar, AvatarGroup, colors, useMediaQuery, DID, Tooltip, reactRouterDom, UxRelativeTime, Chip, Stack, groupBy, flatMap, uniqBy, trim, Avatar$1, BrokenImageIcon, react, Empty$3, Session, NotificationsActiveOutlinedIcon, CheckboxPlugin, DIDAddress, MuiMenuItem, clsx, IconButton$1, MuiMenu, Dialog, orderBy, Typography, Skeleton, joinUrl, ReactDOM, dayjs, relativeTime, mitt, CircularProgress, reactHelmet, reactFlipToolkit, grey, cmp, bridge, Fab, debounce, TextField, AddIcon, axios, Toast, MuiPagination, unstatedNext, Cookie, ws, css, OnContentChangePlugin, ShortcutPlugin, SafeAreaPlugin, text, ImageNode, VideoNode) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("@blocklet/labels"), require("react/jsx-runtime"), require("@mui/material/styles"), require("@arcblock/ux/lib/Theme"), require("react"), require("@mui/material"), require("lodash/isNil"), require("@blocklet/editor/lib/config"), require("react-lazy-with-preload"), require("@lexical/react/LexicalComposerContext"), require("lexical"), require("ahooks"), require("@mui/material/Box"), require("@mui/lab/LoadingButton"), require("@mui/icons-material"), require("@arcblock/ux/lib/Locale/context"), require("@mui/material/Alert"), require("lodash/isBoolean"), require("@mui/material/Button"), require("@arcblock/did-connect/lib/Avatar"), require("@mui/material/AvatarGroup"), require("@mui/material/colors"), require("@mui/material/useMediaQuery"), require("@arcblock/ux/lib/DID"), require("@mui/material/Tooltip"), require("react-router-dom"), require("@arcblock/ux/lib/RelativeTime"), require("@mui/material/Chip"), require("@mui/material/Stack"), require("lodash/groupBy"), require("lodash/flatMap"), require("lodash/uniqBy"), require("lodash/trim"), require("@mui/material/Avatar"), require("@mui/icons-material/BrokenImage"), require("@iconify/react"), require("@arcblock/ux/lib/Empty"), require("@arcblock/did-connect/lib/Session"), require("@mui/icons-material/NotificationsActiveOutlined"), require("@blocklet/editor/lib/ext/CheckboxPlugin"), require("@arcblock/did-connect/lib/Address"), require("@mui/material/MenuItem"), require("clsx"), require("@mui/material/IconButton"), require("@mui/material/Menu"), require("@arcblock/ux/lib/Dialog"), require("lodash/orderBy"), require("@mui/material/Typography"), require("@mui/material/Skeleton"), require("url-join"), require("react-dom"), require("dayjs"), require("dayjs/plugin/relativeTime"), require("mitt"), require("@mui/material/CircularProgress"), require("react-helmet"), require("react-flip-toolkit"), require("@mui/material/colors/grey"), require("semver-compare"), require("@arcblock/bridge"), require("@arcblock/react-hooks"), require("@mui/material/Fab"), require("lodash/debounce"), require("@mui/material/TextField"), require("@mui/icons-material/Add"), require("axios"), require("@arcblock/ux/lib/Toast"), require("@mui/material/Pagination"), require("unstated-next"), require("js-cookie"), require("@arcblock/ws"), require("@emotion/css"), require("@blocklet/editor/lib/ext/OnContentChangePlugin"), require("@blocklet/editor/lib/ext/ShortcutPlugin"), require("@blocklet/editor/lib/ext/SafeAreaPlugin"), require("@lexical/text"), require("@blocklet/editor/lib/main/nodes/ImageNode"), require("@blocklet/editor/lib/ext/VideoPlugin/VideoNode")) : typeof define === "function" && define.amd ? define(["exports", "@blocklet/labels", "react/jsx-runtime", "@mui/material/styles", "@arcblock/ux/lib/Theme", "react", "@mui/material", "lodash/isNil", "@blocklet/editor/lib/config", "react-lazy-with-preload", "@lexical/react/LexicalComposerContext", "lexical", "ahooks", "@mui/material/Box", "@mui/lab/LoadingButton", "@mui/icons-material", "@arcblock/ux/lib/Locale/context", "@mui/material/Alert", "lodash/isBoolean", "@mui/material/Button", "@arcblock/did-connect/lib/Avatar", "@mui/material/AvatarGroup", "@mui/material/colors", "@mui/material/useMediaQuery", "@arcblock/ux/lib/DID", "@mui/material/Tooltip", "react-router-dom", "@arcblock/ux/lib/RelativeTime", "@mui/material/Chip", "@mui/material/Stack", "lodash/groupBy", "lodash/flatMap", "lodash/uniqBy", "lodash/trim", "@mui/material/Avatar", "@mui/icons-material/BrokenImage", "@iconify/react", "@arcblock/ux/lib/Empty", "@arcblock/did-connect/lib/Session", "@mui/icons-material/NotificationsActiveOutlined", "@blocklet/editor/lib/ext/CheckboxPlugin", "@arcblock/did-connect/lib/Address", "@mui/material/MenuItem", "clsx", "@mui/material/IconButton", "@mui/material/Menu", "@arcblock/ux/lib/Dialog", "lodash/orderBy", "@mui/material/Typography", "@mui/material/Skeleton", "url-join", "react-dom", "dayjs", "dayjs/plugin/relativeTime", "mitt", "@mui/material/CircularProgress", "react-helmet", "react-flip-toolkit", "@mui/material/colors/grey", "semver-compare", "@arcblock/bridge", "@arcblock/react-hooks", "@mui/material/Fab", "lodash/debounce", "@mui/material/TextField", "@mui/icons-material/Add", "axios", "@arcblock/ux/lib/Toast", "@mui/material/Pagination", "unstated-next", "js-cookie", "@arcblock/ws", "@emotion/css", "@blocklet/editor/lib/ext/OnContentChangePlugin", "@blocklet/editor/lib/ext/ShortcutPlugin", "@blocklet/editor/lib/ext/SafeAreaPlugin", "@lexical/text", "@blocklet/editor/lib/main/nodes/ImageNode", "@blocklet/editor/lib/ext/VideoPlugin/VideoNode"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.DiscussKitComponents = {}, global.labels, global.jsxRuntime, global.styles, global.Theme, global.react, global.material, global.isNil, global.config, global.reactLazyWithPreload, global.LexicalComposerContext, global.lexical$1, global.ahooks, global.Box, global.LoadingButton, global.iconsMaterial, global.context, global.Alert, global.isBoolean, global.Button, global.DidAvatar, global.AvatarGroup, global.colors, global.useMediaQuery, global.DID, global.Tooltip, global.reactRouterDom, global.UxRelativeTime, global.Chip, global.Stack, global.groupBy, global.flatMap, global.uniqBy, global.trim, global.Avatar$1, global.BrokenImageIcon, global.react$1, global.Empty$3, global.Session, global.NotificationsActiveOutlinedIcon, global.CheckboxPlugin, global.DIDAddress, global.MuiMenuItem, global.clsx, global.IconButton$1, global.MuiMenu, global.Dialog, global.orderBy, global.Typography, global.Skeleton, global.joinUrl, global.ReactDOM, global.dayjs, global.relativeTime, global.mitt, global.CircularProgress, global.reactHelmet, global.reactFlipToolkit, global.grey, global.cmp, global.bridge, global.reactHooks, global.Fab, global.debounce, global.TextField, global.AddIcon, global.axios, global.Toast, global.MuiPagination, global.unstatedNext, global.Cookie, global.ws, global.css, global.OnContentChangePlugin, global.ShortcutPlugin, global.SafeAreaPlugin, global.text, global.ImageNode, global.VideoNode));
+})(this, function(exports2, labels, jsxRuntime, styles, Theme, react, material, isNil, config, reactLazyWithPreload, LexicalComposerContext, lexical$1, ahooks, Box, LoadingButton, iconsMaterial, context, Alert, isBoolean, Button, DidAvatar, AvatarGroup, colors, useMediaQuery, DID, Tooltip, reactRouterDom, UxRelativeTime, Chip, Stack, groupBy, flatMap, uniqBy, trim, Avatar$1, BrokenImageIcon, react$1, Empty$3, Session, NotificationsActiveOutlinedIcon, CheckboxPlugin, DIDAddress, MuiMenuItem, clsx, IconButton$1, MuiMenu, Dialog, orderBy, Typography, Skeleton, joinUrl, ReactDOM, dayjs, relativeTime, mitt, CircularProgress, reactHelmet, reactFlipToolkit, grey, cmp, bridge, reactHooks, Fab, debounce, TextField, AddIcon, axios, Toast, MuiPagination, unstatedNext, Cookie, ws, css, OnContentChangePlugin, ShortcutPlugin, SafeAreaPlugin, text, ImageNode, VideoNode) {
   "use strict";var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => {
@@ -365,7 +365,7 @@ var __publicField = (obj, key, value) => {
   }, Symbol.toStringTag, { value: "Module" }));
   function CmdEnterShortcutPlugin({ callback, shortcut = "CMD_ENTER" }) {
     const [editor2] = LexicalComposerContext.useLexicalComposerContext();
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       return editor2.registerCommand(
         lexical$1.KEY_ENTER_COMMAND,
         (e) => {
@@ -406,7 +406,7 @@ var __publicField = (obj, key, value) => {
   }
   function ImagePathFixerPlugin() {
     const [editor2] = LexicalComposerContext.useLexicalComposerContext();
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       return editor2.registerNodeTransform(ImageNode.ImageNode, imageNodeTransform);
     }, [editor2]);
     return null;
@@ -431,14 +431,14 @@ var __publicField = (obj, key, value) => {
   }
   function VideoPathFixerPlugin() {
     const [editor2] = LexicalComposerContext.useLexicalComposerContext();
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       return editor2.registerNodeTransform(VideoNode.VideoNode, VideoNodeTransform);
     }, [editor2]);
     return null;
   }
   function AutoClearPlugin({ value, isChanged }) {
     const [editor2] = LexicalComposerContext.useLexicalComposerContext();
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       try {
         if (!isChanged)
           return;
@@ -463,7 +463,7 @@ var __publicField = (obj, key, value) => {
     return null;
   }
   const useMeasure = () => {
-    const ref = require$$0.useRef(null);
+    const ref = react.useRef(null);
     const size = ahooks.useSize(ref);
     return [ref, size || { width: 0, height: 0 }];
   };
@@ -484,11 +484,11 @@ var __publicField = (obj, key, value) => {
   }) => {
     var _a2;
     const sessionKey = draftKey ? `${getDraftSessionKeyPrefix()}${draftKey}` : "";
-    const [content, setContent] = require$$0.useState(null);
-    const [error, setError] = require$$0.useState("");
-    const [loading, setLoading] = require$$0.useState(false);
+    const [content, setContent] = react.useState(null);
+    const [error, setError] = react.useState("");
+    const [loading, setLoading] = react.useState(false);
     const [ref, { width }] = useMeasure();
-    const isChanged = require$$0.useRef(false);
+    const isChanged = react.useRef(false);
     const editorConfig = config.useEditorConfig();
     const inSmallView = width < 700;
     const draftContent = sessionStorage.getItem(sessionKey);
@@ -573,7 +573,7 @@ var __publicField = (obj, key, value) => {
       },
       rest.sx
     );
-    return /* @__PURE__ */ require$$0.createElement(material.Box, { ref, ...rest, key: draftKey, sx: mergedSx }, /* @__PURE__ */ jsxRuntime.jsx(config.EditorConfigProvider, { value: mergedEditorConfig, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ react.createElement(material.Box, { ref, ...rest, key: draftKey, sx: mergedSx }, /* @__PURE__ */ jsxRuntime.jsx(config.EditorConfigProvider, { value: mergedEditorConfig, children: /* @__PURE__ */ jsxRuntime.jsxs(
       BlockletEditor$3,
       {
         placeholder,
@@ -612,7 +612,7 @@ var __publicField = (obj, key, value) => {
     draftKey = "",
     ...rest
   }) {
-    const { t } = require$$0.useContext(context.LocaleContext);
+    const { t } = react.useContext(context.LocaleContext);
     return /* @__PURE__ */ jsxRuntime.jsx(
       StyledInput,
       {
@@ -690,7 +690,7 @@ var __publicField = (obj, key, value) => {
     );
   }
   function PostEdit({ content, send, onCancel, onSuccess, ...rest }) {
-    const { t } = require$$0.useContext(context.LocaleContext);
+    const { t } = react.useContext(context.LocaleContext);
     return /* @__PURE__ */ jsxRuntime.jsx(
       Input,
       {
@@ -885,7 +885,7 @@ var __publicField = (obj, key, value) => {
             if (badgeIcon) {
               const isHttpIcon = ["http", "/", "data"].some((prefix2) => badgeIcon.startsWith(prefix2));
               if (!isHttpIcon) {
-                icon = /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { className: "badge-icon", icon: badgeIcon, color: badgeColor, style: { ...iconStyle } });
+                icon = /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { className: "badge-icon", icon: badgeIcon, color: badgeColor, style: { ...iconStyle } });
               } else {
                 icon = /* @__PURE__ */ jsxRuntime.jsx(
                   Avatar$1,
@@ -958,9 +958,9 @@ var __publicField = (obj, key, value) => {
   }
   const useSessionContext = () => {
     var _a2, _b2, _c, _d;
-    const ctx = require$$0.useContext(Session.SessionContext) || {};
+    const ctx = react.useContext(Session.SessionContext) || {};
     const loginRole = (_b2 = (_a2 = ctx == null ? void 0 : ctx.session) == null ? void 0 : _a2.user) == null ? void 0 : _b2.role;
-    const permissionSet = require$$0.useMemo(() => {
+    const permissionSet = react.useMemo(() => {
       var _a3, _b3;
       return new Set(((_b3 = (_a3 = ctx.session) == null ? void 0 : _a3.user) == null ? void 0 : _b3.permissions) || []);
     }, [(_d = (_c = ctx.session) == null ? void 0 : _c.user) == null ? void 0 : _d.permissions]);
@@ -990,9 +990,9 @@ var __publicField = (obj, key, value) => {
     return a === b;
   };
   const useChanged = (values2, options) => {
-    const [trackingStarted, setTrackingStarted] = require$$0.useState(false);
-    const [changed, setChanged] = require$$0.useState(false);
-    const initialValues = require$$0.useRef(values2);
+    const [trackingStarted, setTrackingStarted] = react.useState(false);
+    const [changed, setChanged] = react.useState(false);
+    const initialValues = react.useRef(values2);
     const detectChanges = () => {
       var _a2;
       const changesDetected = Object.keys(initialValues.current).some(
@@ -1007,7 +1007,7 @@ var __publicField = (obj, key, value) => {
       initialValues.current = { ...values2, ...overrides };
       detectChanges();
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (trackingStarted) {
         detectChanges();
       } else if (options.tracking(values2) && !trackingStarted) {
@@ -1018,9 +1018,9 @@ var __publicField = (obj, key, value) => {
     return { changed, reset, initialValues: initialValues.current };
   };
   const useNow = (interval = 1e3) => {
-    const [time, setTime] = require$$0.useState(/* @__PURE__ */ new Date());
+    const [time, setTime] = react.useState(/* @__PURE__ */ new Date());
     const updateTime = () => setTime(/* @__PURE__ */ new Date());
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       const timer = setInterval(updateTime, interval);
       return () => clearInterval(timer);
     }, [interval]);
@@ -1164,7 +1164,7 @@ var __publicField = (obj, key, value) => {
     const theme = styles.useTheme();
     const downMd = useMediaQuery(theme.breakpoints.down("md"));
     const navigate = reactRouterDom.useNavigate();
-    const [open, setOpen] = require$$0.useState(false);
+    const [open, setOpen] = react.useState(false);
     const sm = size === "sm";
     let fontSize = sm ? 12 : 14;
     let avatarSize = profileUse ? 24 : sm ? 40 : 48;
@@ -1176,7 +1176,7 @@ var __publicField = (obj, key, value) => {
       if (!createdAt) {
         return null;
       }
-      if (require$$0.isValidElement(createdAt)) {
+      if (react.isValidElement(createdAt)) {
         return createdAt;
       }
       createdAt = typeof createdAt === "string" ? new Date(createdAt) : createdAt;
@@ -1332,7 +1332,7 @@ var __publicField = (obj, key, value) => {
 `;
   function ViewMore({ children, ...rest }) {
     const { t } = context.useLocaleContext();
-    const [collapsed, setCollapsed] = require$$0.useState(true);
+    const [collapsed, setCollapsed] = react.useState(true);
     const [ref, { height }] = useMeasure();
     const _collapsed = collapsed && height > MAX_HEIGHT;
     return /* @__PURE__ */ jsxRuntime.jsxs(Root$3, { ...rest, className: `${rest.className || ""} ${_collapsed ? "markdown-viewer-collapsed" : ""}`, children: [
@@ -1357,7 +1357,7 @@ var __publicField = (obj, key, value) => {
       )
     ] });
   }
-  const BlockletEditor$2 = require$$0.lazy(() => import("@blocklet/editor"));
+  const BlockletEditor$2 = react.lazy(() => import("@blocklet/editor"));
   const StyledBlockletEditor = styles.styled(BlockletEditor$2)`
   .editor-scroller {
     min-height: initial;
@@ -1389,7 +1389,7 @@ var __publicField = (obj, key, value) => {
       );
     }
     if (!autoCollapse) {
-      return /* @__PURE__ */ jsxRuntime.jsx(require$$0.Suspense, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+      return /* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { children: /* @__PURE__ */ jsxRuntime.jsxs(
         StyledBlockletEditor,
         {
           editable: false,
@@ -1404,7 +1404,7 @@ var __publicField = (obj, key, value) => {
         }
       ) });
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(require$$0.Suspense, { children: /* @__PURE__ */ jsxRuntime.jsx(ViewMore, { ...rest, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { children: /* @__PURE__ */ jsxRuntime.jsx(ViewMore, { ...rest, children: /* @__PURE__ */ jsxRuntime.jsxs(
       StyledBlockletEditor,
       {
         editable: false,
@@ -1426,7 +1426,7 @@ var __publicField = (obj, key, value) => {
   }
 `;
   function Menu({ items = [], ...rest }) {
-    const [anchorEl, setAnchorEl] = require$$0.useState(null);
+    const [anchorEl, setAnchorEl] = react.useState(null);
     const open = Boolean(anchorEl);
     const handleClick = (event) => {
       setAnchorEl(event.currentTarget);
@@ -1519,10 +1519,10 @@ var __publicField = (obj, key, value) => {
     const isAuthor = post.author.did === ((_a2 = session == null ? void 0 : session.user) == null ? void 0 : _a2.did);
     const commentUrl = window.location.hash.substring(1);
     const { t } = context.useLocaleContext();
-    const [editing, setEditing] = require$$0.useState(false);
+    const [editing, setEditing] = react.useState(false);
     const postContext = { isAdmin, isAuthor, interactive, post };
     const [inViewport] = ahooks.useInViewport(() => document == null ? void 0 : document.getElementById(post.id));
-    const [hasEnteredViewport, setHasEnteredViewport] = require$$0.useState(false);
+    const [hasEnteredViewport, setHasEnteredViewport] = react.useState(false);
     let menuItems = [];
     if (isAuthor && !post.deletedAt) {
       menuItems.push(
@@ -1558,7 +1558,7 @@ var __publicField = (obj, key, value) => {
       systemTip = t("emptyContent");
     }
     const showSystemTip = systemTip && !editing;
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (inViewport) {
         setHasEnteredViewport(inViewport);
       }
@@ -1662,7 +1662,7 @@ var __publicField = (obj, key, value) => {
         countPerValue: { ...prevState.countPerValue, [value]: (prevState.countPerValue[value] || 0) + inc }
       }));
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       setState({
         countPerValue: countPerValue || {},
         selectedValue
@@ -1702,15 +1702,15 @@ var __publicField = (obj, key, value) => {
   const values = ["1", "-1"];
   function BinaryThumb({ data = [], variant = "default", size = "sm", ...rest }) {
     const { session } = useSessionContext();
-    const [raterListVisible, setRaterListVisible] = require$$0.useState(null);
-    const [loading, setLoading] = require$$0.useState(false);
-    const countPerValue = require$$0.useMemo(() => {
+    const [raterListVisible, setRaterListVisible] = react.useState(null);
+    const [loading, setLoading] = react.useState(false);
+    const countPerValue = react.useMemo(() => {
       return data.reduce((acc, cur) => {
         acc[cur.value] = (acc[cur.value] || 0) + 1;
         return acc;
       }, {});
     }, [data]);
-    const selectedValue = require$$0.useMemo(() => {
+    const selectedValue = react.useMemo(() => {
       var _a2;
       return (_a2 = data.find((x) => {
         var _a3, _b2;
@@ -1868,9 +1868,9 @@ var __publicField = (obj, key, value) => {
     ...rest
   }) {
     const { session } = useSessionContext();
-    const [open, setOpen] = require$$0.useState(false);
-    const [raters, setRaters] = require$$0.useState(null);
-    const [myReaction, setMyReaction] = require$$0.useState(null);
+    const [open, setOpen] = react.useState(false);
+    const [raters, setRaters] = react.useState(null);
+    const [myReaction, setMyReaction] = react.useState(null);
     const options = [
       { value: "thumbs_up", label: "👍" },
       { value: "thumbs_down", label: "👎" },
@@ -1881,7 +1881,7 @@ var __publicField = (obj, key, value) => {
       { value: "rocket", label: "🚀" },
       { value: "eyes", label: "👀" }
     ];
-    const ratings = require$$0.useMemo(() => {
+    const ratings = react.useMemo(() => {
       var _a2;
       const mapped = data.map((x) => {
         var _a3;
@@ -1898,7 +1898,7 @@ var __publicField = (obj, key, value) => {
       }
       return mapped;
     }, [data, myReaction, session.user]);
-    const countPerValue = require$$0.useMemo(() => {
+    const countPerValue = react.useMemo(() => {
       return ratings.reduce((acc, cur) => {
         cur.value.forEach((item) => {
           acc[item] = (acc[item] || 0) + 1;
@@ -1906,14 +1906,14 @@ var __publicField = (obj, key, value) => {
         return acc;
       }, {});
     }, [ratings]);
-    const selectedValues = require$$0.useMemo(() => {
+    const selectedValues = react.useMemo(() => {
       var _a2;
       return ((_a2 = ratings.find((x) => {
         var _a3, _b2;
         return ((_a3 = x.rater) == null ? void 0 : _a3.did) === ((_b2 = session == null ? void 0 : session.user) == null ? void 0 : _b2.did);
       })) == null ? void 0 : _a2.value) || [];
     }, [ratings, session.user]);
-    const selectedValuesMap = require$$0.useMemo(() => {
+    const selectedValuesMap = react.useMemo(() => {
       return selectedValues.reduce((acc, cur) => ({ ...acc, [cur]: true }), {});
     }, [selectedValues]);
     const toggleRate = (value) => {
@@ -2082,7 +2082,7 @@ var __publicField = (obj, key, value) => {
     const fullScreen = material.useMediaQuery(theme.breakpoints.down("md"));
     const { t } = context.useLocaleContext();
     const renderDesc = () => {
-      if (require$$0.isValidElement(description)) {
+      if (react.isValidElement(description)) {
         return description;
       }
       return /* @__PURE__ */ jsxRuntime.jsx(material.DialogContentText, { children: description });
@@ -2106,12 +2106,12 @@ var __publicField = (obj, key, value) => {
       /* @__PURE__ */ jsxRuntime.jsx(material.DialogActions, { children: renderActions() })
     ] });
   }
-  const ConfirmContext = require$$0.createContext({});
-  const useConfirm = () => require$$0.useContext(ConfirmContext);
+  const ConfirmContext = react.createContext({});
+  const useConfirm = () => react.useContext(ConfirmContext);
   function ConfirmProvider({ children }) {
-    const [open, setOpen] = require$$0.useState(false);
-    const [currentOptions, setCurrentOptions] = require$$0.useState({});
-    const resolver = require$$0.useRef();
+    const [open, setOpen] = react.useState(false);
+    const [currentOptions, setCurrentOptions] = react.useState({});
+    const resolver = react.useRef();
     const handleOk = () => {
       var _a2;
       (_a2 = resolver.current) == null ? void 0 : _a2.call(resolver, true);
@@ -2129,7 +2129,7 @@ var __publicField = (obj, key, value) => {
         resolver.current = resolve;
       });
     };
-    const value = require$$0.useMemo(
+    const value = react.useMemo(
       () => ({
         open,
         confirm
@@ -2168,7 +2168,7 @@ var __publicField = (obj, key, value) => {
   }) {
     const { session } = useSessionContext();
     const { t } = context.useLocaleContext();
-    const [inputVisible, setInputVisible] = require$$0.useState(false);
+    const [inputVisible, setInputVisible] = react.useState(false);
     const { confirm } = useConfirm();
     const handleDelete = async (...args) => {
       const proceed = await confirm({
@@ -2309,9 +2309,9 @@ var __publicField = (obj, key, value) => {
     return sorted;
   };
   const useAutoScroll = (data, containerHeight) => {
-    const highlightedRef = require$$0.useRef(window.location.hash.substring(1));
-    const lastHeightRef = require$$0.useRef(containerHeight);
-    const autoScrolledRef = require$$0.useRef(false);
+    const highlightedRef = react.useRef(window.location.hash.substring(1));
+    const lastHeightRef = react.useRef(containerHeight);
+    const autoScrolledRef = react.useRef(false);
     const matchTargetedPost = (posts) => {
       return posts.some((item) => {
         var _a2;
@@ -2331,7 +2331,7 @@ var __publicField = (obj, key, value) => {
       lastHeightRef.current = containerHeight;
       return false;
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       let interval;
       if (containerHeight && !autoScrolledRef.current) {
         interval = window.setInterval(() => {
@@ -2352,8 +2352,8 @@ var __publicField = (obj, key, value) => {
       };
     }, [containerHeight]);
   };
-  const CommentsContext = require$$0.createContext({});
-  const useCommentsContext = () => require$$0.useContext(CommentsContext);
+  const CommentsContext = react.createContext({});
+  const useCommentsContext = () => react.useContext(CommentsContext);
   function CommentsProvider({
     target,
     api,
@@ -2370,7 +2370,7 @@ var __publicField = (obj, key, value) => {
     var _a2;
     const [state, setState] = ahooks.useSetState(getInitialState(order ? { order } : {}));
     const containerHeight = (_a2 = ahooks.useSize(containerRef)) == null ? void 0 : _a2.height;
-    const commentsKeyById = require$$0.useMemo(() => {
+    const commentsKeyById = react.useMemo(() => {
       return state.comments.reduce((acc, cur) => {
         var _a3;
         acc[cur.id] = cur;
@@ -2382,10 +2382,10 @@ var __publicField = (obj, key, value) => {
         return acc;
       }, {});
     }, [state]);
-    const highlightedRef = require$$0.useRef(window.location.hash.substring(1));
+    const highlightedRef = react.useRef(window.location.hash.substring(1));
     const limit = 15;
     const initialRepliesLimit = -1;
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       const init = async () => {
         if (!autoLoadComments) {
           setState({ initialized: true });
@@ -2544,7 +2544,7 @@ var __publicField = (obj, key, value) => {
       setTimeout(() => add(result), 800);
     };
     const findById = (id2) => commentsKeyById[id2];
-    const value = require$$0.useMemo(
+    const value = react.useMemo(
       () => ({
         target,
         state,
@@ -2598,7 +2598,7 @@ var __publicField = (obj, key, value) => {
     const hiddenComments = highlighted.position - comments.findIndex((item) => item.id === highlighted.id) + headIndex;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...rest, className: "comment-list", children: [
       comments.map((comment) => {
-        return /* @__PURE__ */ jsxRuntime.jsxs(require$$0.Fragment, { children: [
+        return /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
           comment.id === (highlighted == null ? void 0 : highlighted.id) && hiddenComments > 0 && nextCursor && /* @__PURE__ */ jsxRuntime.jsx(LoadMoreButtonWrapper, { sx: { my: 4, textAlign: "center" }, children: /* @__PURE__ */ jsxRuntime.jsxs(
             Box,
             {
@@ -2720,10 +2720,10 @@ var __publicField = (obj, key, value) => {
     }
     return result;
   };
-  const UploaderComponent = require$$0.lazy(() => import("@blocklet/uploader/react").then((res) => ({ default: res.Uploader })));
-  const UploaderContext = require$$0.createContext(null);
+  const UploaderComponent = react.lazy(() => import("@blocklet/uploader/react").then((res) => ({ default: res.Uploader })));
+  const UploaderContext = react.createContext(null);
   function useUploader() {
-    const uploaderRef = require$$0.useContext(UploaderContext);
+    const uploaderRef = react.useContext(UploaderContext);
     if (!uploaderRef) {
       throw new Error("useUploader must be used within an UploaderProvider");
     }
@@ -2756,7 +2756,7 @@ var __publicField = (obj, key, value) => {
     return /* @__PURE__ */ jsxRuntime.jsx(material.Box, { onClick: handleOpen, children });
   }
   function UploaderProvider({ children }) {
-    const uploaderRef = require$$0.useRef(null);
+    const uploaderRef = react.useRef(null);
     window.uploaderRef = uploaderRef;
     return /* @__PURE__ */ jsxRuntime.jsxs(UploaderContext.Provider, { value: uploaderRef, children: [
       children,
@@ -2789,11 +2789,11 @@ var __publicField = (obj, key, value) => {
     fetchpriority = "auto",
     loading = "eager",
     shadow = true,
-    fallback,
+    fallback: fallback2,
     ...rest
   }) {
-    const [loaded, setLoaded] = require$$0.useState(false);
-    const [errored, setErrored] = require$$0.useState(false);
+    const [loaded, setLoaded] = react.useState(false);
+    const [errored, setErrored] = react.useState(false);
     return /* @__PURE__ */ jsxRuntime.jsxs(
       material.Box,
       {
@@ -2858,7 +2858,7 @@ var __publicField = (obj, key, value) => {
                 width: "100%",
                 height: "100%"
               },
-              children: fallback
+              children: fallback2
             }
           )
         ]
@@ -3138,7 +3138,7 @@ var __publicField = (obj, key, value) => {
     }
     return /* @__PURE__ */ jsxRuntime.jsx(Box, { ...rest, children: content });
   }
-  const BlogCard = require$$0.forwardRef(
+  const BlogCard = react.forwardRef(
     ({ post, hideAuthor, linkTarget, compactLayout, loading = false }, ref) => {
       if (loading) {
         return /* @__PURE__ */ jsxRuntime.jsx(Box, { sx: { display: "flex", justifyContent: "center", color: "inherit", textDecoration: "none" }, children: /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3428,22 +3428,22 @@ var __publicField = (obj, key, value) => {
       }
     ) });
   }
-  const AuthzContext = require$$0.createContext({
+  const AuthzContext = react.createContext({
     permissions: [],
     hasPermission: () => false,
     isAdmin: false,
     hasAnyPassport: () => false
   });
-  const useAuthzContext = () => require$$0.useContext(AuthzContext);
+  const useAuthzContext = () => react.useContext(AuthzContext);
   const AuthzProvider = ({ ...rest }) => {
     var _a2;
     const { session, isAdmin, hasAnyPassport } = useSessionContext();
-    const permissions = require$$0.useMemo(() => {
+    const permissions = react.useMemo(() => {
       var _a3;
       return ((_a3 = session == null ? void 0 : session.user) == null ? void 0 : _a3.permissions) || [];
     }, [(_a2 = session == null ? void 0 : session.user) == null ? void 0 : _a2.permissions]);
-    const permissionSet = require$$0.useMemo(() => new Set(permissions), [permissions]);
-    const hasPermission = require$$0.useCallback(
+    const permissionSet = react.useMemo(() => new Set(permissions), [permissions]);
+    const hasPermission = react.useCallback(
       (perms) => {
         if (!perms || perms.length === 0) {
           return true;
@@ -3453,7 +3453,7 @@ var __publicField = (obj, key, value) => {
       },
       [permissionSet]
     );
-    const value = require$$0.useMemo(
+    const value = react.useMemo(
       () => ({ permissions, hasPermission, isAdmin, hasAnyPassport }),
       [hasPermission, permissions, isAdmin, hasAnyPassport]
     );
@@ -3512,35 +3512,42 @@ var __publicField = (obj, key, value) => {
     }
   }
   const iconoirChatBubbleEmpty = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", width: "1.2em", height: "1.2em", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12c0 1.821.487 3.53 1.338 5L2.5 21.5l4.5-.838A9.955 9.955 0 0 0 12 22Z" }) });
-  const UnreadNotificationContext = require$$0.createContext(
+  const UnreadNotificationContext = react.createContext(
     {}
   );
-  const useUnreadNotification = () => require$$0.useContext(UnreadNotificationContext);
+  const useUnreadNotification = () => react.useContext(UnreadNotificationContext);
   function UnreadNotificationProvider({ fetchUnreadState, children }) {
     const { session } = useSessionContext();
-    const [unread, setUnread] = require$$0.useState(false);
-    const markAsUnread = require$$0.useCallback((value2 = true) => setUnread(value2), []);
+    const [unread, setUnread] = react.useState(false);
+    const [initialUnread, setInitialState] = react.useState(void 0);
+    const markAsUnread = react.useCallback((value2 = true) => setUnread(value2), []);
     const update = async () => {
       const unreadState = await fetchUnreadState();
       setUnread(unreadState);
+      return unreadState;
     };
-    require$$0.useEffect(() => {
-      if (session.user && !preferences.disableNotificationBadge) {
-        update();
-      }
+    react.useEffect(() => {
+      const init = async () => {
+        if (session.user && !preferences.disableNotificationBadge) {
+          const unreadState = await update();
+          setInitialState(unreadState);
+        }
+      };
+      init();
     }, [session.user]);
-    const value = require$$0.useMemo(
+    const value = react.useMemo(
       () => ({
         unread,
+        initialUnread,
         markAsUnread
       }),
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [unread]
+      [unread, initialUnread]
     );
     return /* @__PURE__ */ jsxRuntime.jsx(UnreadNotificationContext.Provider, { value, children });
   }
-  const ChatContext = require$$0.createContext({});
-  const useChatContext = () => require$$0.useContext(ChatContext);
+  const ChatContext = react.createContext({});
+  const useChatContext = () => react.useContext(ChatContext);
   const uniqAndSort = (list, order = "asc") => {
     const unique = uniqBy(list, "id");
     const sorted = orderBy(unique, ["createdAt", "id"], [order, order]);
@@ -3557,7 +3564,7 @@ var __publicField = (obj, key, value) => {
     const navigate = reactRouterDom.useNavigate();
     const { session } = useSessionContext();
     const currentUser = session == null ? void 0 : session.user;
-    const orderedChats = require$$0.useMemo(() => {
+    const orderedChats = react.useMemo(() => {
       return orderBy(state.chats, (x) => x.lastMessageAt || "", "desc");
     }, [state.chats]);
     const hasUnreadMessages = ({ lastMessageAt, lastAckTime }) => {
@@ -3566,7 +3573,7 @@ var __publicField = (obj, key, value) => {
       }
       return false;
     };
-    const hasAnyUnreadMessages = require$$0.useMemo(
+    const hasAnyUnreadMessages = react.useMemo(
       () => state.chats.filter((chat) => chat.type !== "channel" || chat.hasJoined).some(hasUnreadMessages),
       [state.chats]
     );
@@ -3739,7 +3746,7 @@ var __publicField = (obj, key, value) => {
       addChat(chat);
       return chat;
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (currentUser == null ? void 0 : currentUser.did) {
         init();
       } else {
@@ -3752,7 +3759,7 @@ var __publicField = (obj, key, value) => {
       }
       return () => client2.destroy();
     }, [currentUser == null ? void 0 : currentUser.did]);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (activeChatId) {
         if (activeChatId !== state.activeChatId) {
           const matched = state.chats.find((chat) => chat.id === activeChatId);
@@ -3764,7 +3771,7 @@ var __publicField = (obj, key, value) => {
         setState((prev) => ({ ...prev, activeChatId: void 0 }));
       }
     }, [state, activeChatId]);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       const cancels = [
         client2.onMessage(({ chatId, message }) => {
           addMessage(chatId, message);
@@ -3783,12 +3790,12 @@ var __publicField = (obj, key, value) => {
         cancels.forEach((cancel) => cancel == null ? void 0 : cancel());
       };
     }, [state]);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (state.initialized) {
         markAsUnread(hasAnyUnreadMessages);
       }
     }, [state.initialized, hasAnyUnreadMessages, markAsUnread]);
-    const value = require$$0.useMemo(() => {
+    const value = react.useMemo(() => {
       return {
         ...state,
         client: client2,
@@ -3846,902 +3853,10 @@ var __publicField = (obj, key, value) => {
       ] })
     ] });
   }
-  function getAugmentedNamespace(n) {
-    if (n.__esModule)
-      return n;
-    var f = n.default;
-    if (typeof f == "function") {
-      var a = function a2() {
-        if (this instanceof a2) {
-          return Reflect.construct(f, arguments, this.constructor);
-        }
-        return f.apply(this, arguments);
-      };
-      a.prototype = f.prototype;
-    } else
-      a = {};
-    Object.defineProperty(a, "__esModule", { value: true });
-    Object.keys(n).forEach(function(k) {
-      var d = Object.getOwnPropertyDescriptor(n, k);
-      Object.defineProperty(a, k, d.get ? d : {
-        enumerable: true,
-        get: function() {
-          return n[k];
-        }
-      });
-    });
-    return a;
-  }
-  var lib = {};
-  var useInterval$1 = {};
-  Object.defineProperty(useInterval$1, "__esModule", {
-    value: true
-  });
-  useInterval$1.default = useInterval;
-  var _react$2 = require$$0;
-  function useInterval(callback, delay) {
-    const savedCallback = (0, _react$2.useRef)();
-    (0, _react$2.useEffect)(() => {
-      savedCallback.current = callback;
-    }, [callback]);
-    (0, _react$2.useEffect)(() => {
-      function tick() {
-        savedCallback.current();
-      }
-      if (delay !== null) {
-        const id2 = setInterval(tick, delay);
-        return () => clearInterval(id2);
-      }
-    }, [delay]);
-  }
-  var useStorage$1 = {};
-  const privateData = /* @__PURE__ */ new WeakMap();
-  const wrappers = /* @__PURE__ */ new WeakMap();
-  function pd(event) {
-    const retv = privateData.get(event);
-    console.assert(
-      retv != null,
-      "'this' is expected an Event object, but got",
-      event
-    );
-    return retv;
-  }
-  function setCancelFlag(data) {
-    if (data.passiveListener != null) {
-      if (typeof console !== "undefined" && typeof console.error === "function") {
-        console.error(
-          "Unable to preventDefault inside passive event listener invocation.",
-          data.passiveListener
-        );
-      }
-      return;
-    }
-    if (!data.event.cancelable) {
-      return;
-    }
-    data.canceled = true;
-    if (typeof data.event.preventDefault === "function") {
-      data.event.preventDefault();
-    }
-  }
-  function Event(eventTarget, event) {
-    privateData.set(this, {
-      eventTarget,
-      event,
-      eventPhase: 2,
-      currentTarget: eventTarget,
-      canceled: false,
-      stopped: false,
-      immediateStopped: false,
-      passiveListener: null,
-      timeStamp: event.timeStamp || Date.now()
-    });
-    Object.defineProperty(this, "isTrusted", { value: false, enumerable: true });
-    const keys = Object.keys(event);
-    for (let i = 0; i < keys.length; ++i) {
-      const key = keys[i];
-      if (!(key in this)) {
-        Object.defineProperty(this, key, defineRedirectDescriptor(key));
-      }
-    }
-  }
-  Event.prototype = {
-    /**
-     * The type of this event.
-     * @type {string}
-     */
-    get type() {
-      return pd(this).event.type;
-    },
-    /**
-     * The target of this event.
-     * @type {EventTarget}
-     */
-    get target() {
-      return pd(this).eventTarget;
-    },
-    /**
-     * The target of this event.
-     * @type {EventTarget}
-     */
-    get currentTarget() {
-      return pd(this).currentTarget;
-    },
-    /**
-     * @returns {EventTarget[]} The composed path of this event.
-     */
-    composedPath() {
-      const currentTarget = pd(this).currentTarget;
-      if (currentTarget == null) {
-        return [];
-      }
-      return [currentTarget];
-    },
-    /**
-     * Constant of NONE.
-     * @type {number}
-     */
-    get NONE() {
-      return 0;
-    },
-    /**
-     * Constant of CAPTURING_PHASE.
-     * @type {number}
-     */
-    get CAPTURING_PHASE() {
-      return 1;
-    },
-    /**
-     * Constant of AT_TARGET.
-     * @type {number}
-     */
-    get AT_TARGET() {
-      return 2;
-    },
-    /**
-     * Constant of BUBBLING_PHASE.
-     * @type {number}
-     */
-    get BUBBLING_PHASE() {
-      return 3;
-    },
-    /**
-     * The target of this event.
-     * @type {number}
-     */
-    get eventPhase() {
-      return pd(this).eventPhase;
-    },
-    /**
-     * Stop event bubbling.
-     * @returns {void}
-     */
-    stopPropagation() {
-      const data = pd(this);
-      data.stopped = true;
-      if (typeof data.event.stopPropagation === "function") {
-        data.event.stopPropagation();
-      }
-    },
-    /**
-     * Stop event bubbling.
-     * @returns {void}
-     */
-    stopImmediatePropagation() {
-      const data = pd(this);
-      data.stopped = true;
-      data.immediateStopped = true;
-      if (typeof data.event.stopImmediatePropagation === "function") {
-        data.event.stopImmediatePropagation();
-      }
-    },
-    /**
-     * The flag to be bubbling.
-     * @type {boolean}
-     */
-    get bubbles() {
-      return Boolean(pd(this).event.bubbles);
-    },
-    /**
-     * The flag to be cancelable.
-     * @type {boolean}
-     */
-    get cancelable() {
-      return Boolean(pd(this).event.cancelable);
-    },
-    /**
-     * Cancel this event.
-     * @returns {void}
-     */
-    preventDefault() {
-      setCancelFlag(pd(this));
-    },
-    /**
-     * The flag to indicate cancellation state.
-     * @type {boolean}
-     */
-    get defaultPrevented() {
-      return pd(this).canceled;
-    },
-    /**
-     * The flag to be composed.
-     * @type {boolean}
-     */
-    get composed() {
-      return Boolean(pd(this).event.composed);
-    },
-    /**
-     * The unix time of this event.
-     * @type {number}
-     */
-    get timeStamp() {
-      return pd(this).timeStamp;
-    },
-    /**
-     * The target of this event.
-     * @type {EventTarget}
-     * @deprecated
-     */
-    get srcElement() {
-      return pd(this).eventTarget;
-    },
-    /**
-     * The flag to stop event bubbling.
-     * @type {boolean}
-     * @deprecated
-     */
-    get cancelBubble() {
-      return pd(this).stopped;
-    },
-    set cancelBubble(value) {
-      if (!value) {
-        return;
-      }
-      const data = pd(this);
-      data.stopped = true;
-      if (typeof data.event.cancelBubble === "boolean") {
-        data.event.cancelBubble = true;
-      }
-    },
-    /**
-     * The flag to indicate cancellation state.
-     * @type {boolean}
-     * @deprecated
-     */
-    get returnValue() {
-      return !pd(this).canceled;
-    },
-    set returnValue(value) {
-      if (!value) {
-        setCancelFlag(pd(this));
-      }
-    },
-    /**
-     * Initialize this event object. But do nothing under event dispatching.
-     * @param {string} type The event type.
-     * @param {boolean} [bubbles=false] The flag to be possible to bubble up.
-     * @param {boolean} [cancelable=false] The flag to be possible to cancel.
-     * @deprecated
-     */
-    initEvent() {
-    }
-  };
-  Object.defineProperty(Event.prototype, "constructor", {
-    value: Event,
-    configurable: true,
-    writable: true
-  });
-  if (typeof window !== "undefined" && typeof window.Event !== "undefined") {
-    Object.setPrototypeOf(Event.prototype, window.Event.prototype);
-    wrappers.set(window.Event.prototype, Event);
-  }
-  function defineRedirectDescriptor(key) {
-    return {
-      get() {
-        return pd(this).event[key];
-      },
-      set(value) {
-        pd(this).event[key] = value;
-      },
-      configurable: true,
-      enumerable: true
-    };
-  }
-  function defineCallDescriptor(key) {
-    return {
-      value() {
-        const event = pd(this).event;
-        return event[key].apply(event, arguments);
-      },
-      configurable: true,
-      enumerable: true
-    };
-  }
-  function defineWrapper(BaseEvent, proto) {
-    const keys = Object.keys(proto);
-    if (keys.length === 0) {
-      return BaseEvent;
-    }
-    function CustomEvent2(eventTarget, event) {
-      BaseEvent.call(this, eventTarget, event);
-    }
-    CustomEvent2.prototype = Object.create(BaseEvent.prototype, {
-      constructor: { value: CustomEvent2, configurable: true, writable: true }
-    });
-    for (let i = 0; i < keys.length; ++i) {
-      const key = keys[i];
-      if (!(key in BaseEvent.prototype)) {
-        const descriptor = Object.getOwnPropertyDescriptor(proto, key);
-        const isFunc = typeof descriptor.value === "function";
-        Object.defineProperty(
-          CustomEvent2.prototype,
-          key,
-          isFunc ? defineCallDescriptor(key) : defineRedirectDescriptor(key)
-        );
-      }
-    }
-    return CustomEvent2;
-  }
-  function getWrapper(proto) {
-    if (proto == null || proto === Object.prototype) {
-      return Event;
-    }
-    let wrapper = wrappers.get(proto);
-    if (wrapper == null) {
-      wrapper = defineWrapper(getWrapper(Object.getPrototypeOf(proto)), proto);
-      wrappers.set(proto, wrapper);
-    }
-    return wrapper;
-  }
-  function wrapEvent(eventTarget, event) {
-    const Wrapper = getWrapper(Object.getPrototypeOf(event));
-    return new Wrapper(eventTarget, event);
-  }
-  function isStopped(event) {
-    return pd(event).immediateStopped;
-  }
-  function setEventPhase(event, eventPhase) {
-    pd(event).eventPhase = eventPhase;
-  }
-  function setCurrentTarget(event, currentTarget) {
-    pd(event).currentTarget = currentTarget;
-  }
-  function setPassiveListener(event, passiveListener) {
-    pd(event).passiveListener = passiveListener;
-  }
-  const listenersMap = /* @__PURE__ */ new WeakMap();
-  const CAPTURE = 1;
-  const BUBBLE = 2;
-  const ATTRIBUTE = 3;
-  function isObject(x) {
-    return x !== null && typeof x === "object";
-  }
-  function getListeners(eventTarget) {
-    const listeners = listenersMap.get(eventTarget);
-    if (listeners == null) {
-      throw new TypeError(
-        "'this' is expected an EventTarget object, but got another value."
-      );
-    }
-    return listeners;
-  }
-  function defineEventAttributeDescriptor(eventName) {
-    return {
-      get() {
-        const listeners = getListeners(this);
-        let node = listeners.get(eventName);
-        while (node != null) {
-          if (node.listenerType === ATTRIBUTE) {
-            return node.listener;
-          }
-          node = node.next;
-        }
-        return null;
-      },
-      set(listener) {
-        if (typeof listener !== "function" && !isObject(listener)) {
-          listener = null;
-        }
-        const listeners = getListeners(this);
-        let prev = null;
-        let node = listeners.get(eventName);
-        while (node != null) {
-          if (node.listenerType === ATTRIBUTE) {
-            if (prev !== null) {
-              prev.next = node.next;
-            } else if (node.next !== null) {
-              listeners.set(eventName, node.next);
-            } else {
-              listeners.delete(eventName);
-            }
-          } else {
-            prev = node;
-          }
-          node = node.next;
-        }
-        if (listener !== null) {
-          const newNode = {
-            listener,
-            listenerType: ATTRIBUTE,
-            passive: false,
-            once: false,
-            next: null
-          };
-          if (prev === null) {
-            listeners.set(eventName, newNode);
-          } else {
-            prev.next = newNode;
-          }
-        }
-      },
-      configurable: true,
-      enumerable: true
-    };
-  }
-  function defineEventAttribute(eventTargetPrototype, eventName) {
-    Object.defineProperty(
-      eventTargetPrototype,
-      `on${eventName}`,
-      defineEventAttributeDescriptor(eventName)
-    );
-  }
-  function defineCustomEventTarget(eventNames) {
-    function CustomEventTarget() {
-      EventTarget.call(this);
-    }
-    CustomEventTarget.prototype = Object.create(EventTarget.prototype, {
-      constructor: {
-        value: CustomEventTarget,
-        configurable: true,
-        writable: true
-      }
-    });
-    for (let i = 0; i < eventNames.length; ++i) {
-      defineEventAttribute(CustomEventTarget.prototype, eventNames[i]);
-    }
-    return CustomEventTarget;
-  }
-  function EventTarget() {
-    if (this instanceof EventTarget) {
-      listenersMap.set(this, /* @__PURE__ */ new Map());
-      return;
-    }
-    if (arguments.length === 1 && Array.isArray(arguments[0])) {
-      return defineCustomEventTarget(arguments[0]);
-    }
-    if (arguments.length > 0) {
-      const types = new Array(arguments.length);
-      for (let i = 0; i < arguments.length; ++i) {
-        types[i] = arguments[i];
-      }
-      return defineCustomEventTarget(types);
-    }
-    throw new TypeError("Cannot call a class as a function");
-  }
-  EventTarget.prototype = {
-    /**
-     * Add a given listener to this event target.
-     * @param {string} eventName The event name to add.
-     * @param {Function} listener The listener to add.
-     * @param {boolean|{capture?:boolean,passive?:boolean,once?:boolean}} [options] The options for this listener.
-     * @returns {void}
-     */
-    addEventListener(eventName, listener, options) {
-      if (listener == null) {
-        return;
-      }
-      if (typeof listener !== "function" && !isObject(listener)) {
-        throw new TypeError("'listener' should be a function or an object.");
-      }
-      const listeners = getListeners(this);
-      const optionsIsObj = isObject(options);
-      const capture = optionsIsObj ? Boolean(options.capture) : Boolean(options);
-      const listenerType = capture ? CAPTURE : BUBBLE;
-      const newNode = {
-        listener,
-        listenerType,
-        passive: optionsIsObj && Boolean(options.passive),
-        once: optionsIsObj && Boolean(options.once),
-        next: null
-      };
-      let node = listeners.get(eventName);
-      if (node === void 0) {
-        listeners.set(eventName, newNode);
-        return;
-      }
-      let prev = null;
-      while (node != null) {
-        if (node.listener === listener && node.listenerType === listenerType) {
-          return;
-        }
-        prev = node;
-        node = node.next;
-      }
-      prev.next = newNode;
-    },
-    /**
-     * Remove a given listener from this event target.
-     * @param {string} eventName The event name to remove.
-     * @param {Function} listener The listener to remove.
-     * @param {boolean|{capture?:boolean,passive?:boolean,once?:boolean}} [options] The options for this listener.
-     * @returns {void}
-     */
-    removeEventListener(eventName, listener, options) {
-      if (listener == null) {
-        return;
-      }
-      const listeners = getListeners(this);
-      const capture = isObject(options) ? Boolean(options.capture) : Boolean(options);
-      const listenerType = capture ? CAPTURE : BUBBLE;
-      let prev = null;
-      let node = listeners.get(eventName);
-      while (node != null) {
-        if (node.listener === listener && node.listenerType === listenerType) {
-          if (prev !== null) {
-            prev.next = node.next;
-          } else if (node.next !== null) {
-            listeners.set(eventName, node.next);
-          } else {
-            listeners.delete(eventName);
-          }
-          return;
-        }
-        prev = node;
-        node = node.next;
-      }
-    },
-    /**
-     * Dispatch a given event.
-     * @param {Event|{type:string}} event The event to dispatch.
-     * @returns {boolean} `false` if canceled.
-     */
-    dispatchEvent(event) {
-      if (event == null || typeof event.type !== "string") {
-        throw new TypeError('"event.type" should be a string.');
-      }
-      const listeners = getListeners(this);
-      const eventName = event.type;
-      let node = listeners.get(eventName);
-      if (node == null) {
-        return true;
-      }
-      const wrappedEvent = wrapEvent(this, event);
-      let prev = null;
-      while (node != null) {
-        if (node.once) {
-          if (prev !== null) {
-            prev.next = node.next;
-          } else if (node.next !== null) {
-            listeners.set(eventName, node.next);
-          } else {
-            listeners.delete(eventName);
-          }
-        } else {
-          prev = node;
-        }
-        setPassiveListener(
-          wrappedEvent,
-          node.passive ? node.listener : null
-        );
-        if (typeof node.listener === "function") {
-          try {
-            node.listener.call(this, wrappedEvent);
-          } catch (err) {
-            if (typeof console !== "undefined" && typeof console.error === "function") {
-              console.error(err);
-            }
-          }
-        } else if (node.listenerType !== ATTRIBUTE && typeof node.listener.handleEvent === "function") {
-          node.listener.handleEvent(wrappedEvent);
-        }
-        if (isStopped(wrappedEvent)) {
-          break;
-        }
-        node = node.next;
-      }
-      setPassiveListener(wrappedEvent, null);
-      setEventPhase(wrappedEvent, 0);
-      setCurrentTarget(wrappedEvent, null);
-      return !wrappedEvent.defaultPrevented;
-    }
-  };
-  Object.defineProperty(EventTarget.prototype, "constructor", {
-    value: EventTarget,
-    configurable: true,
-    writable: true
-  });
-  if (typeof window !== "undefined" && typeof window.EventTarget !== "undefined") {
-    Object.setPrototypeOf(EventTarget.prototype, window.EventTarget.prototype);
-  }
-  const eventTargetShim = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-    __proto__: null,
-    EventTarget,
-    default: EventTarget,
-    defineEventAttribute
-  }, Symbol.toStringTag, { value: "Module" }));
-  const require$$1$1 = /* @__PURE__ */ getAugmentedNamespace(eventTargetShim);
-  Object.defineProperty(useStorage$1, "__esModule", {
-    value: true
-  });
-  useStorage$1.default = useStorage;
-  var _react$1 = require$$0;
-  var _eventTargetShim = require$$1$1;
-  const evtTarget = new _eventTargetShim.EventTarget();
-  function useStorage(storage, keyPrefix) {
-    return (key, defaultValue) => {
-      const storeKey = "".concat(keyPrefix, ".").concat(key);
-      const raw = storage.getItem(storeKey);
-      const [value, setValue] = (0, _react$1.useState)(raw ? JSON.parse(raw) : defaultValue);
-      const updater = (updatedValue) => {
-        setValue(updatedValue);
-        storage.setItem(storeKey, JSON.stringify(updatedValue));
-        evtTarget.dispatchEvent(new CustomEvent("storage_change", {
-          detail: {
-            key
-          }
-        }));
-      };
-      if (defaultValue != null && !raw) {
-        updater(defaultValue);
-      }
-      (0, _react$1.useEffect)(() => {
-        const listener = (_ref) => {
-          let {
-            detail
-          } = _ref;
-          if (detail.key === key) {
-            const _raw = storage.getItem(storeKey);
-            if (_raw !== raw) {
-              setValue(JSON.parse(_raw));
-            }
-          }
-        };
-        evtTarget.addEventListener("storage_change", listener);
-        return () => evtTarget.removeEventListener("storage_change", listener);
-      });
-      return [value, updater];
-    };
-  }
-  var useBrowser$1 = {};
-  var appleIphone = /iPhone/i;
-  var appleIpod = /iPod/i;
-  var appleTablet = /iPad/i;
-  var appleUniversal = /\biOS-universal(?:.+)Mac\b/i;
-  var androidPhone = /\bAndroid(?:.+)Mobile\b/i;
-  var androidTablet = /Android/i;
-  var amazonPhone = /(?:SD4930UR|\bSilk(?:.+)Mobile\b)/i;
-  var amazonTablet = /Silk/i;
-  var windowsPhone = /Windows Phone/i;
-  var windowsTablet = /\bWindows(?:.+)ARM\b/i;
-  var otherBlackBerry = /BlackBerry/i;
-  var otherBlackBerry10 = /BB10/i;
-  var otherOpera = /Opera Mini/i;
-  var otherChrome = /\b(CriOS|Chrome)(?:.+)Mobile/i;
-  var otherFirefox = /Mobile(?:.+)Firefox\b/i;
-  var isAppleTabletOnIos13 = function(navigator2) {
-    return typeof navigator2 !== "undefined" && navigator2.platform === "MacIntel" && typeof navigator2.maxTouchPoints === "number" && navigator2.maxTouchPoints > 1 && typeof MSStream === "undefined";
-  };
-  function createMatch(userAgent) {
-    return function(regex) {
-      return regex.test(userAgent);
-    };
-  }
-  function isMobile(param) {
-    var nav = {
-      userAgent: "",
-      platform: "",
-      maxTouchPoints: 0
-    };
-    if (!param && typeof navigator !== "undefined") {
-      nav = {
-        userAgent: navigator.userAgent,
-        platform: navigator.platform,
-        maxTouchPoints: navigator.maxTouchPoints || 0
-      };
-    } else if (typeof param === "string") {
-      nav.userAgent = param;
-    } else if (param && param.userAgent) {
-      nav = {
-        userAgent: param.userAgent,
-        platform: param.platform,
-        maxTouchPoints: param.maxTouchPoints || 0
-      };
-    }
-    var userAgent = nav.userAgent;
-    var tmp = userAgent.split("[FBAN");
-    if (typeof tmp[1] !== "undefined") {
-      userAgent = tmp[0];
-    }
-    tmp = userAgent.split("Twitter");
-    if (typeof tmp[1] !== "undefined") {
-      userAgent = tmp[0];
-    }
-    var match = createMatch(userAgent);
-    var result = {
-      apple: {
-        phone: match(appleIphone) && !match(windowsPhone),
-        ipod: match(appleIpod),
-        tablet: !match(appleIphone) && (match(appleTablet) || isAppleTabletOnIos13(nav)) && !match(windowsPhone),
-        universal: match(appleUniversal),
-        device: (match(appleIphone) || match(appleIpod) || match(appleTablet) || match(appleUniversal) || isAppleTabletOnIos13(nav)) && !match(windowsPhone)
-      },
-      amazon: {
-        phone: match(amazonPhone),
-        tablet: !match(amazonPhone) && match(amazonTablet),
-        device: match(amazonPhone) || match(amazonTablet)
-      },
-      android: {
-        phone: !match(windowsPhone) && match(amazonPhone) || !match(windowsPhone) && match(androidPhone),
-        tablet: !match(windowsPhone) && !match(amazonPhone) && !match(androidPhone) && (match(amazonTablet) || match(androidTablet)),
-        device: !match(windowsPhone) && (match(amazonPhone) || match(amazonTablet) || match(androidPhone) || match(androidTablet)) || match(/\bokhttp\b/i)
-      },
-      windows: {
-        phone: match(windowsPhone),
-        tablet: match(windowsTablet),
-        device: match(windowsPhone) || match(windowsTablet)
-      },
-      other: {
-        blackberry: match(otherBlackBerry),
-        blackberry10: match(otherBlackBerry10),
-        opera: match(otherOpera),
-        firefox: match(otherFirefox),
-        chrome: match(otherChrome),
-        device: match(otherBlackBerry) || match(otherBlackBerry10) || match(otherOpera) || match(otherFirefox) || match(otherChrome)
-      },
-      any: false,
-      phone: false,
-      tablet: false
-    };
-    result.any = result.apple.device || result.android.device || result.windows.device || result.other.device;
-    result.phone = result.apple.phone || result.android.phone || result.windows.phone;
-    result.tablet = result.apple.tablet || result.android.tablet || result.windows.tablet;
-    return result;
-  }
-  const esm = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-    __proto__: null,
-    default: isMobile
-  }, Symbol.toStringTag, { value: "Module" }));
-  const require$$1 = /* @__PURE__ */ getAugmentedNamespace(esm);
-  Object.defineProperty(useBrowser$1, "__esModule", {
-    value: true
-  });
-  useBrowser$1.default = useBrowser;
-  var _react = require$$0;
-  var _ismobilejs = _interopRequireDefault(require$$1);
-  function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : { default: obj };
-  }
-  function ownKeys(e, r) {
-    var t = Object.keys(e);
-    if (Object.getOwnPropertySymbols) {
-      var o = Object.getOwnPropertySymbols(e);
-      r && (o = o.filter(function(r2) {
-        return Object.getOwnPropertyDescriptor(e, r2).enumerable;
-      })), t.push.apply(t, o);
-    }
-    return t;
-  }
-  function _objectSpread(e) {
-    for (var r = 1; r < arguments.length; r++) {
-      var t = null != arguments[r] ? arguments[r] : {};
-      r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
-        _defineProperty(e, r2, t[r2]);
-      }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
-        Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
-      });
-    }
-    return e;
-  }
-  function _defineProperty(obj, key, value) {
-    key = _toPropertyKey(key);
-    if (key in obj) {
-      Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
-    } else {
-      obj[key] = value;
-    }
-    return obj;
-  }
-  function _toPropertyKey(t) {
-    var i = _toPrimitive(t, "string");
-    return "symbol" == typeof i ? i : String(i);
-  }
-  function _toPrimitive(t, r) {
-    if ("object" != typeof t || !t)
-      return t;
-    var e = t[Symbol.toPrimitive];
-    if (void 0 !== e) {
-      var i = e.call(t, r || "default");
-      if ("object" != typeof i)
-        return i;
-      throw new TypeError("@@toPrimitive must return a primitive value.");
-    }
-    return ("string" === r ? String : Number)(t);
-  }
-  const DID_WALLET_TAG = "ABTWallet";
-  function getDIDWalletVersion(userAgent) {
-    var _result$groups;
-    const reg = new RegExp("".concat(DID_WALLET_TAG, "/(?<version>[0-9.]+)"), "g");
-    const result = reg.exec(userAgent);
-    const version = result === null || result === void 0 ? void 0 : (_result$groups = result.groups) === null || _result$groups === void 0 ? void 0 : _result$groups.version;
-    return version;
-  }
-  function useBrowser() {
-    var _window, _window$navigator;
-    const userAgent = (_window = window) === null || _window === void 0 ? void 0 : (_window$navigator = _window.navigator) === null || _window$navigator === void 0 ? void 0 : _window$navigator.userAgent;
-    const [browser] = (0, _react.useState)({
-      wallet: userAgent.indexOf(DID_WALLET_TAG) > -1,
-      walletVersion: getDIDWalletVersion(userAgent),
-      wechat: /MicroMessenger/i.test(userAgent),
-      mobile: _objectSpread({
-        apple: {
-          phone: false,
-          ipod: false,
-          tablet: false,
-          device: false
-        },
-        amazon: {
-          phone: false,
-          tablet: false,
-          device: false
-        },
-        android: {
-          phone: false,
-          tablet: false,
-          device: false
-        },
-        windows: {
-          phone: false,
-          tablet: false,
-          device: false
-        },
-        other: {
-          blackberry: false,
-          blackberry10: false,
-          opera: false,
-          firefox: false,
-          chrome: false,
-          device: false
-        },
-        phone: false,
-        tablet: false,
-        any: false
-      }, (0, _ismobilejs.default)(userAgent))
-    });
-    return browser;
-  }
-  (function(exports3) {
-    Object.defineProperty(exports3, "__esModule", {
-      value: true
-    });
-    Object.defineProperty(exports3, "useBrowser", {
-      enumerable: true,
-      get: function get() {
-        return _useBrowser.default;
-      }
-    });
-    Object.defineProperty(exports3, "useInterval", {
-      enumerable: true,
-      get: function get() {
-        return _useInterval.default;
-      }
-    });
-    Object.defineProperty(exports3, "useStorage", {
-      enumerable: true,
-      get: function get() {
-        return _useStorage.default;
-      }
-    });
-    var _useInterval = _interopRequireDefault2(useInterval$1);
-    var _useStorage = _interopRequireDefault2(useStorage$1);
-    var _useBrowser = _interopRequireDefault2(useBrowser$1);
-    function _interopRequireDefault2(obj) {
-      return obj && obj.__esModule ? obj : { default: obj };
-    }
-  })(lib);
   const useChatInWallet = () => {
     const navigate = reactRouterDom.useNavigate();
-    const { walletVersion, mobile } = lib.useBrowser();
-    const isChatInWalletV2 = require$$0.useMemo(() => {
+    const { walletVersion, mobile } = reactHooks.useBrowser();
+    const isChatInWalletV2 = react.useMemo(() => {
       try {
         const targetVersion = mobile.apple.device ? "5.3.5" : "5.3.1";
         return !!walletVersion && cmp(walletVersion, targetVersion) === 1;
@@ -4760,7 +3875,10 @@ var __publicField = (obj, key, value) => {
     const navigateToChatList = () => {
       navigate("/chat-in-wallet");
     };
-    return { navigateToChat, navigateToChatList, isChatInWalletV2 };
+    const updateUnreadState = react.useCallback((unread) => {
+      bridge.call("updateUnreadState", { unread });
+    }, []);
+    return { navigateToChat, navigateToChatList, isChatInWalletV2, updateUnreadState };
   };
   function ChatList({ inWallet, ...rest }) {
     const { t } = context.useLocaleContext();
@@ -5051,7 +4169,7 @@ var __publicField = (obj, key, value) => {
                   },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "tabler:news", style: { height: 15, width: 15, marginRight: 4 } }),
+                      /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { icon: "tabler:news", style: { height: 15, width: 15, marginRight: 4 } }),
                       /* @__PURE__ */ jsxRuntime.jsx(Box, { component: "span", sx: { mr: 0.5 }, children: message.sourceUser.fullName }),
                       /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("chat.newPost") })
                     ] }),
@@ -5084,7 +4202,7 @@ var __publicField = (obj, key, value) => {
                   },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
+                      /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
                       /* @__PURE__ */ jsxRuntime.jsx(Box, { component: "span", sx: { mr: 0.5 }, children: message.sourceUser.fullName }),
                       /* @__PURE__ */ jsxRuntime.jsx("span", { children: (message == null ? void 0 : message.cc) ? t("chat.commentedPost") : t("chat.commentedYourPost") })
                     ] }),
@@ -5118,7 +4236,7 @@ var __publicField = (obj, key, value) => {
                   },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
+                      /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
                       /* @__PURE__ */ jsxRuntime.jsx(Box, { component: "span", sx: { mr: 0.5 }, children: message.sourceUser.fullName }),
                       /* @__PURE__ */ jsxRuntime.jsx("span", { children: (message == null ? void 0 : message.cc) ? t("chat.replyComment") : t("chat.replyYourComment") })
                     ] }),
@@ -5152,7 +4270,7 @@ var __publicField = (obj, key, value) => {
                   },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
+                      /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
                       /* @__PURE__ */ jsxRuntime.jsx(Box, { component: "span", sx: { mr: 0.5 }, children: message.sourceUser.fullName }),
                       /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
                         " ",
@@ -5189,7 +4307,7 @@ var __publicField = (obj, key, value) => {
                   },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
+                      /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { icon: "tabler:message-circle-2", style: { height: 15, width: 15, marginRight: 4 } }),
                       /* @__PURE__ */ jsxRuntime.jsx(Box, { component: "span", sx: { mr: 0.5 }, children: message.sourceUser.fullName }),
                       /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("chat.mentionInPost") })
                     ] }),
@@ -5239,7 +4357,7 @@ var __publicField = (obj, key, value) => {
                   },
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(react.Icon, { icon: "tabler:arrow-forward-up", style: { height: 15, width: 15, marginRight: 4 } }),
+                      /* @__PURE__ */ jsxRuntime.jsx(react$1.Icon, { icon: "tabler:arrow-forward-up", style: { height: 15, width: 15, marginRight: 4 } }),
                       /* @__PURE__ */ jsxRuntime.jsx(Box, { component: "span", sx: { mr: 0.5 }, children: message.sourceUser.fullName }),
                       /* @__PURE__ */ jsxRuntime.jsx("span", { children: titles[message.subtype] })
                     ] }),
@@ -5264,15 +4382,15 @@ var __publicField = (obj, key, value) => {
     const { isActiveChat, loadMessages } = useChatContext();
     const { t } = context.useLocaleContext();
     const isActive = isActiveChat(chat.id);
-    const containerRef = require$$0.useRef(null);
-    const [isAtBottom, setIsAtBottom] = require$$0.useState(true);
-    const [isLoadingMore, setIsLoadingMore] = require$$0.useState(false);
+    const containerRef = react.useRef(null);
+    const [isAtBottom, setIsAtBottom] = react.useState(true);
+    const [isLoadingMore, setIsLoadingMore] = react.useState(false);
     const scrollToBottom = () => {
       var _a3, _b3;
       (_b3 = containerRef.current) == null ? void 0 : _b3.scrollTo({ top: ((_a3 = containerRef.current) == null ? void 0 : _a3.scrollHeight) || 0, behavior: "smooth" });
       setIsAtBottom(true);
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       const handleScroll = debounce(() => {
         setIsAtBottom(checkIsAtBottom(containerRef.current));
       }, 300);
@@ -5280,14 +4398,14 @@ var __publicField = (obj, key, value) => {
         containerRef.current.addEventListener("scroll", handleScroll);
       }
     }, []);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       setTimeout(() => {
         if (isAtBottom) {
           scrollToBottom();
         }
       }, 100);
     });
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (isActive) {
         setIsAtBottom(checkIsAtBottom(containerRef.current));
       }
@@ -5406,7 +4524,7 @@ var __publicField = (obj, key, value) => {
     }
   }));
   function Participants({ users, sx, ...rest }) {
-    const [open, setOpen] = require$$0.useState(false);
+    const [open, setOpen] = react.useState(false);
     const handleTooltipClose = () => {
       setOpen(false);
     };
@@ -5502,8 +4620,8 @@ var __publicField = (obj, key, value) => {
     const isActive = isActiveChat(chat.id);
     const { session, isAdmin } = useSessionContext();
     const isCreator = chat.creator.did === ((_a2 = session == null ? void 0 : session.user) == null ? void 0 : _a2.did);
-    const [input, setInput] = require$$0.useState("");
-    require$$0.useEffect(() => {
+    const [input, setInput] = react.useState("");
+    react.useEffect(() => {
       if (chat.isActivated) {
         initChatRoom(chat.id);
       }
@@ -5678,7 +4796,7 @@ var __publicField = (obj, key, value) => {
     });
     const { t } = context.useLocaleContext();
     const theme = styles.useTheme();
-    const canSubmit = require$$0.useMemo(() => {
+    const canSubmit = react.useMemo(() => {
       return state.name;
     }, [state]);
     const handleSubmit = () => {
@@ -5765,8 +4883,8 @@ var __publicField = (obj, key, value) => {
     const { session } = useSessionContext();
     const navigate = reactRouterDom.useNavigate();
     const { client: client2, isInWallet, chats, setActiveChat, createDM } = useChatContext();
-    const [inputValue, setInputValue] = require$$0.useState("");
-    const [open, setOpen] = require$$0.useState(false);
+    const [inputValue, setInputValue] = react.useState("");
+    const [open, setOpen] = react.useState(false);
     const { navigateToChat } = useChatInWallet();
     const { data, loading } = ahooks.useRequest(
       async () => {
@@ -5803,7 +4921,7 @@ var __publicField = (obj, key, value) => {
           filterOptions: (x) => x,
           options: data || [],
           getOptionLabel: () => "",
-          renderOption: (props, option) => /* @__PURE__ */ require$$0.createElement(material.Box, { component: "li", ...props, key: option.did, sx: { px: "8px!important" } }, /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { display: "flex", alignItems: "center", width: 1 }, children: [
+          renderOption: (props, option) => /* @__PURE__ */ react.createElement(material.Box, { component: "li", ...props, key: option.did, sx: { px: "8px!important" } }, /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { display: "flex", alignItems: "center", width: 1 }, children: [
             /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { mt: 0.25, lineHeight: 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(Avatar, { did: option.did, src: option.avatar, size: 28, shape: "circle", variant: "circle" }) }),
             /* @__PURE__ */ jsxRuntime.jsxs(
               material.Box,
@@ -5912,7 +5030,7 @@ var __publicField = (obj, key, value) => {
   function Chat({ sx, ...rest }) {
     var _a2;
     const { client: client2, initialized, chats, activeChatId, addChat, setActiveChat, getOppositeUser } = useChatContext();
-    const [newChannelVisible, setNewChannelVisible] = require$$0.useState(false);
+    const [newChannelVisible, setNewChannelVisible] = react.useState(false);
     const downMd = material.useMediaQuery((theme) => theme.breakpoints.down("sm"));
     const { t } = context.useLocaleContext();
     const activeChat = (_a2 = chats == null ? void 0 : chats.filter((chat) => (chat == null ? void 0 : chat.id) === activeChatId)) == null ? void 0 : _a2[0];
@@ -5932,7 +5050,7 @@ var __publicField = (obj, key, value) => {
       const getTitle = webTitleMap[activeChat.type] || webTitleMap.default;
       return getTitle();
     };
-    const show = require$$0.useMemo(() => {
+    const show = react.useMemo(() => {
       if (downMd) {
         return {
           left: !activeChatId,
@@ -6048,7 +5166,7 @@ var __publicField = (obj, key, value) => {
     const { initialized, chats } = useChatContext();
     const downMd = material.useMediaQuery((theme) => theme.breakpoints.down("sm"));
     const activeChat = (_a2 = chats == null ? void 0 : chats.filter((chat) => (chat == null ? void 0 : chat.id) === activeChatId)) == null ? void 0 : _a2[0];
-    const show = require$$0.useMemo(() => {
+    const show = react.useMemo(() => {
       if (downMd) {
         return {
           left: !activeChatId,
@@ -6089,7 +5207,13 @@ var __publicField = (obj, key, value) => {
   }
   function ChatListInWallet({ sx, ...rest }) {
     const { initialized, chats, activeChatId } = useChatContext();
-    const { navigateToChatList } = useChatInWallet();
+    const { initialUnread } = useUnreadNotification();
+    const { navigateToChatList, updateUnreadState } = useChatInWallet();
+    react.useEffect(() => {
+      if (typeof initialUnread === "boolean") {
+        updateUnreadState(initialUnread);
+      }
+    }, [initialUnread, updateUnreadState]);
     if (!initialized) {
       return /* @__PURE__ */ jsxRuntime.jsx(CircularProgress, {});
     }
@@ -6111,6 +5235,7 @@ var __publicField = (obj, key, value) => {
           /* @__PURE__ */ jsxRuntime.jsx(
             material.SwipeableDrawer,
             {
+              disableSwipeToOpen: true,
               PaperProps: { sx: { width: 1 } },
               anchor: "right",
               open: !!activeChatId,
@@ -6180,11 +5305,11 @@ var __publicField = (obj, key, value) => {
     return response;
   };
   const useApiErrorHandler = ({ request, errorHandler }) => {
-    const errorHandlerRef = require$$0.useRef(errorHandler);
-    require$$0.useEffect(() => {
+    const errorHandlerRef = react.useRef(errorHandler);
+    react.useEffect(() => {
       errorHandlerRef.current = errorHandler;
     }, [errorHandler]);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       const interceptor = request.interceptors.response.use(jsonValidationInterceptor, (error) => {
         let handled = false;
         error.markAsHandled = () => {
@@ -6275,7 +5400,7 @@ var __publicField = (obj, key, value) => {
     const { session } = useSessionContext();
     const isAdmin = ["owner", "admin"].includes((_a2 = session == null ? void 0 : session.user) == null ? void 0 : _a2.role);
     const uploaderRef = useUploader();
-    const config$1 = require$$0.useMemo(() => {
+    const config$1 = react.useMemo(() => {
       const userService = {
         search: async (text2) => {
           const { data } = await request.get(`/api/mention?search=${text2}`, { baseURL });
@@ -6416,25 +5541,25 @@ var __publicField = (obj, key, value) => {
       }
     );
   }
-  const Editor$1 = require$$0.lazy(() => Promise.resolve().then(() => editor));
+  const Editor$1 = react.lazy(() => Promise.resolve().then(() => editor));
   function LazyEditor(props) {
-    const fallback = /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { px: 3 }, children: [
+    const fallback2 = /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { px: 3 }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, {}),
       /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "80%" }),
       /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "60%" }),
       /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "40%" })
     ] });
-    return /* @__PURE__ */ jsxRuntime.jsx(require$$0.Suspense, { fallback, children: /* @__PURE__ */ jsxRuntime.jsx(Editor$1, { ...props }) });
-  }
-  const BlockletEditor$1 = require$$0.lazy(() => import("@blocklet/editor"));
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { fallback: fallback2, children: /* @__PURE__ */ jsxRuntime.jsx(Editor$1, { ...props }) });
+  }
+  const BlockletEditor$1 = react.lazy(() => import("@blocklet/editor"));
+  const fallback = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "80%" }),
+    /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "60%" }),
+    /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "40%" })
+  ] });
   function EditorPreview({ content, children, ...rest }) {
-    const fallback = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "80%" }),
-      /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "60%" }),
-      /* @__PURE__ */ jsxRuntime.jsx(material.Skeleton, { width: "40%" })
-    ] });
-    return /* @__PURE__ */ jsxRuntime.jsx(require$$0.Suspense, { fallback, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Suspense, { fallback, children: /* @__PURE__ */ jsxRuntime.jsxs(
       BlockletEditor$1,
       {
         editorState: inferInitialEditorState(content),
@@ -6449,8 +5574,9 @@ var __publicField = (obj, key, value) => {
       }
     ) });
   }
+  EditorPreview.fallback = fallback;
   const useBeforeUnloadPrompt = (dirty) => {
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       const showPrompt = (e) => {
         if (dirty) {
           e.preventDefault();
@@ -6467,24 +5593,24 @@ var __publicField = (obj, key, value) => {
     const { t } = context.useLocaleContext();
     const [dirty, setDirty, getDirty] = ahooks.useGetState(false);
     const { confirm } = useConfirm();
-    const resetCallbackRef = require$$0.useRef(null);
+    const resetCallbackRef = react.useRef(null);
     useBeforeUnloadPrompt(dirty);
-    const reset = require$$0.useCallback(
+    const reset = react.useCallback(
       (callback) => {
         resetCallbackRef.current = callback;
         setDirty(false);
       },
       [setDirty]
     );
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       var _a2;
       if (!dirty) {
         (_a2 = resetCallbackRef.current) == null ? void 0 : _a2.call(resetCallbackRef);
         resetCallbackRef.current = null;
       }
     }, [dirty]);
-    const markDirty = require$$0.useCallback(() => setDirty(true), [setDirty]);
-    const check = require$$0.useCallback(async () => {
+    const markDirty = react.useCallback(() => setDirty(true), [setDirty]);
+    const check = react.useCallback(async () => {
       if (getDirty()) {
         const proceed = await confirm({
           title: t("unsaved.title"),
@@ -6507,7 +5633,7 @@ var __publicField = (obj, key, value) => {
     const { t } = context.useLocaleContext();
     const { dirty, reset } = DirtyPromptContainer.useContainer();
     const blocker = reactRouterDom.useBlocker(dirty);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (blocker.state === "blocked" && !dirty) {
         blocker.reset();
       }
@@ -6698,7 +5824,7 @@ var __publicField = (obj, key, value) => {
     }
   };
   const translations = { zh, en };
-  const Lottie = require$$0.lazy(() => import("lottie-react"));
+  const Lottie = react.lazy(() => import("lottie-react"));
   function LottieComponent({ src, ...restProps }) {
     return /* @__PURE__ */ jsxRuntime.jsx(Lottie, { animationData: src, loop: true, ...restProps });
   }
@@ -12213,7 +11339,7 @@ var __publicField = (obj, key, value) => {
   }
   const useSubscription = (event, cb = () => {
   }, deps = [], prefix2 = ((_d) => (_d = window.blocklet) == null ? void 0 : _d.prefix)() || "/") => {
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (event) {
         if (!client) {
           client = getWsClient(prefix2);
@@ -12228,11 +11354,11 @@ var __publicField = (obj, key, value) => {
     }, [event, ...deps]);
   };
   const id = "point-up-component";
-  const PointUpContext = require$$0.createContext({});
+  const PointUpContext = react.createContext({});
   const WsEvents = Object.freeze({
     POINT_UP: "point.up"
   });
-  const usePointUpContext = () => require$$0.useContext(PointUpContext);
+  const usePointUpContext = () => react.useContext(PointUpContext);
   function PointUp({ points }) {
     const { t } = context.useLocaleContext();
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -12287,7 +11413,7 @@ var __publicField = (obj, key, value) => {
     });
     const { session } = useSessionContext();
     const wsClient = getWsClient();
-    const pointUp = require$$0.useCallback(({ points }) => {
+    const pointUp = react.useCallback(({ points }) => {
       state.pointsList.push(points);
     }, []);
     const pointUpComponent = (_c = (_b2 = (_a2 = window.blocklet) == null ? void 0 : _a2.componentMountPoints) == null ? void 0 : _b2.find) == null ? void 0 : _c.call(
@@ -12299,19 +11425,19 @@ var __publicField = (obj, key, value) => {
         pointUp(payload);
       }
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       wsClient.connect();
       return () => {
         if (wsClient.isConnected())
           ;
       };
     }, []);
-    const value = require$$0.useMemo(() => {
+    const value = react.useMemo(() => {
       return {
         pointUp
       };
     }, []);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (state.pointsList.length > 0) {
         state.visible = true;
         state.currentPoints = +state.pointsList[0];
@@ -12384,8 +11510,8 @@ var __publicField = (obj, key, value) => {
     const selectedString = searchParams.get(urlName);
     const dataWithDefault = defaultButton && (data == null ? void 0 : data.length) > 0 ? [defaultButton, ...data] : data;
     const selectedArray = selectedString !== null && selectedString !== "" ? selectedString.split(",") : dataWithDefault == null ? void 0 : dataWithDefault.map((item) => item.id);
-    const [selectTab, setSelectTab] = require$$0.useState(urlParams ? selectedArray : [boardId]);
-    const [selectAll, setSelectAll] = require$$0.useState(false);
+    const [selectTab, setSelectTab] = react.useState(urlParams ? selectedArray : [boardId]);
+    const [selectAll, setSelectAll] = react.useState(false);
     const updateUrl = (url, newSelectTab) => {
       const formatNewSelectTab = newSelectTab.filter(Boolean);
       if (urlParams) {
@@ -12412,7 +11538,7 @@ var __publicField = (obj, key, value) => {
         return newSelectAll;
       });
     };
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (JSON.stringify(selectedArray) !== JSON.stringify(selectTab)) {
         if (urlParams) {
           setSelectTab(selectedArray || []);
@@ -12427,7 +11553,7 @@ var __publicField = (obj, key, value) => {
         }
       }
     }, [data, boardId]);
-    require$$0.useEffect(() => {
+    react.useEffect(() => {
       if (urlParams) {
         if (selectedString === null || selectedString === "") {
           setSelectAll(true);
@@ -12595,7 +11721,7 @@ var __publicField = (obj, key, value) => {
       }
     ) });
   }
-  const BlockletEditor = require$$0.lazy(() => import("@blocklet/editor"));
+  const BlockletEditor = react.lazy(() => import("@blocklet/editor"));
   const Root = material.styled(material.Box)`
   .be-editable,
   .be-content {