yx-web-sdk 0.0.21 → 0.0.23

package/dist/{index.vue_vue_type_style_index_0_lang-iBkYSdDj.mjs → index.vue_vue_type_style_index_0_lang-BN-dkKAR.mjs}

@@ -1,10 +1,10 @@
 import { createVNode, ref, computed, watch, nextTick, defineComponent, openBlock, createElementBlock, createElementVNode, normalizeStyle, unref, normalizeClass, createBlock, createCommentVNode, Fragment, renderList, toDisplayString, withCtx } from "vue";
 import { useRouter } from "vue-router";
 import { Input, Image, Popover, Button, Upload, message } from "ant-design-vue";
-import { A as AitPersonPopover } from "./index-Dwglj7_M.mjs";
-import { L as LoadingOutlined, _ as _sfc_main$2, a as _sfc_main$3 } from "./index.vue_vue_type_style_index_0_lang-CsNgkPt9.mjs";
+import { A as AitPersonPopover } from "./index-CwFsDdl5.mjs";
+import { L as LoadingOutlined, _ as _sfc_main$2, a as _sfc_main$3 } from "./index.vue_vue_type_style_index_0_lang-DOnNj1Mm.mjs";
 import { _ as _sfc_main$1 } from "./index.vue_vue_type_style_index_0_lang-BxXBf_VA.mjs";
-import { a as useServerStore, g as getServerMembersByAccids, u as useChannelStore, e as getImageMsgDisplaySize, f as filterStr, i as isLt } from "./index.vue_vue_type_style_index_0_lang-BaKNB-4q.mjs";
+import { a as useServerStore, g as getServerMembersByAccids, u as useChannelStore, e as getImageMsgDisplaySize, f as filterStr, i as isLt } from "./index.vue_vue_type_style_index_0_lang-Dx16RQv1.mjs";
 import { useEventListener, useDebounceFn } from "@vueuse/core";
 import { C as CloseOutlined } from "./CloseOutlined-BEcmJaCc.mjs";
 import { I as Icon } from "./AntdIcon-DdvEPKFJ.mjs";
@@ -499,6 +499,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const router = useRouter();
     const channelStore = useChannelStore();
+    const IMG_EXT = ["png", "jpg", "jpeg"];
     const Textarea = Input.TextArea;
     const props = __props;
     const emit = __emit;
@@ -706,21 +707,36 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     };
     const handleSendText = () => {
+      var _a;
       const text = filterStr(curText.value.trim());
       if (text) {
-        emit("sendText", text, {
-          ext: {
-            quoteMsg: quoteMsg.value
-          },
+        if (attachment.value) {
+          delete attachment.value.__file;
+        }
+        const sendOption = {
           mentionAccids: mentionAccids.value,
           attach: attachment.value
           // 传递附件
-        });
+        };
+        if (quoteMsg.value) {
+          sendOption.ext = { quoteMsg: quoteMsg.value };
+        }
+        emit("sendText", text, sendOption);
         curText.value = "";
         quoteMsg.value = void 0;
         attachment.value = void 0;
         scrollToBottomAfterSend();
       }
+      if (attachment.value && IMG_EXT.includes(attachment.value.ext) && ((_a = attachment.value) == null ? void 0 : _a.__file)) {
+        let sendOption;
+        if (quoteMsg.value) {
+          sendOption = { ext: { quoteMsg: quoteMsg.value } };
+        }
+        emit("sendImg", attachment.value.__file, sendOption);
+        quoteMsg.value = void 0;
+        attachment.value = void 0;
+        scrollToBottomAfterSend();
+      }
     };
     const scrollHandler = async (e) => {
       var _a;
@@ -779,7 +795,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     const uploadImgHandler = async (file) => {
       if (!isLt(file.size, MAX_IMG_SIZE)) {
-        message.error(`图片大小最大支持${MAX_IMG_SIZE}M`);
+        message.error(`图片大小最大支持${MAX_IMG_SIZE}MB`);
         return false;
       }
       attachmentUploading.value = true;
@@ -793,6 +809,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             attachmentUploading.value = false;
           }
         });
+        uploadResult.__file = file;
         attachment.value = uploadResult;
       } catch (error) {
         console.error("上传图片失败:", error);
@@ -1038,7 +1055,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ])) : createCommentVNode("", true)
             ])) : createCommentVNode("", true),
             attachment.value ? (openBlock(), createElementBlock("div", _hoisted_14, [
-              ["jpg", "jpeg", "png", "gif"].includes(attachment.value.ext || "") && attachment.value.url ? (openBlock(), createElementBlock("div", _hoisted_15, [
+              IMG_EXT.includes(attachment.value.ext || "") && attachment.value.url ? (openBlock(), createElementBlock("div", _hoisted_15, [
                 createElementVNode("div", _hoisted_16, [
                   createVNode(unref(DeleteOutlined), {
                     class: "chatroomInputAttachmentDeleteBtn",
@@ -1113,7 +1130,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 createVNode(unref(Upload), {
                   "before-upload": uploadImgHandler,
                   "show-upload-list": false,
-                  accept: ".jpg,.png,.jpeg",
+                  accept: IMG_EXT.map((ext) => `.${ext}`).join(","),
                   disabled: __props.sendDisabled || attachmentUploading.value,
                   class: "chatroomInputUpload"
                 }, {
@@ -1148,7 +1165,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     }, 8, ["loading", "disabled"])
                   ]),
                   _: 1
-                }, 8, ["disabled"]),
+                }, 8, ["accept", "disabled"]),
                 _cache[6] || (_cache[6] = createElementVNode("span", { class: "lineSeparator" }, null, -1)),
                 createVNode(unref(Button), {
                   class: "chatroomButtonArrowUp",

package/dist/{index.vue_vue_type_style_index_0_lang-BJGCxPce.mjs → index.vue_vue_type_style_index_0_lang-CtXuRziq.mjs}

@@ -1,10 +1,10 @@
 import { defineComponent, ref, h, watch, computed, openBlock, createElementBlock, createElementVNode, toDisplayString, createCommentVNode, createVNode } from "vue";
 import { List, Typography } from "ant-design-vue";
-import { _ as _sfc_main$1 } from "./index.vue_vue_type_script_setup_true_lang-CD6o8jT4.mjs";
-import { a as useServerStore, u as useChannelStore } from "./index.vue_vue_type_style_index_0_lang-BaKNB-4q.mjs";
+import { _ as _sfc_main$1 } from "./index.vue_vue_type_script_setup_true_lang-B4HvNhJp.mjs";
+import { a as useServerStore, u as useChannelStore } from "./index.vue_vue_type_style_index_0_lang-Dx16RQv1.mjs";
 import "./index-L_drmZir.mjs";
 import { useLocalStorage } from "@vueuse/core";
-import { L as LoadingOutlined } from "./index.vue_vue_type_style_index_0_lang-CsNgkPt9.mjs";
+import { L as LoadingOutlined } from "./index.vue_vue_type_style_index_0_lang-DOnNj1Mm.mjs";
 const _hoisted_1 = { class: "yx-chat-page-container" };
 const _hoisted_2 = { class: "header-wrap" };
 const _hoisted_3 = { class: "left" };

package/dist/{index.vue_vue_type_style_index_0_lang-CsNgkPt9.mjs → index.vue_vue_type_style_index_0_lang-DOnNj1Mm.mjs}

@@ -1,7 +1,7 @@
 import { createVNode, defineComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, unref, ref, onBeforeUnmount, computed, watch, nextTick, normalizeClass, Fragment, withModifiers, createBlock, withCtx, createCommentVNode, withDirectives, normalizeStyle, vShow } from "vue";
 import { useClipboard, useEventListener } from "@vueuse/core";
 import { Image, Button, message } from "ant-design-vue";
-import { h as getMByteSize, a as useServerStore, p as parseFileSize, m as matchExt, e as getImageMsgDisplaySize, _ as _sfc_main$2 } from "./index.vue_vue_type_style_index_0_lang-BaKNB-4q.mjs";
+import { h as getMByteSize, a as useServerStore, p as parseFileSize, m as matchExt, e as getImageMsgDisplaySize, _ as _sfc_main$2 } from "./index.vue_vue_type_style_index_0_lang-Dx16RQv1.mjs";
 import { F as FileIconFont } from "./index-L_drmZir.mjs";
 import dayjs from "dayjs";
 import { I as Icon } from "./AntdIcon-DdvEPKFJ.mjs";
@@ -197,6 +197,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["resendText", "resendImg", "resendFile", "quote", "contextMenuSwitch", "quoteMsgClick", "revokeMessage"],
   setup(__props, { emit: __emit }) {
     const serverStore = useServerStore();
+    const IMG_EXT = ["png", "jpg", "jpeg"];
     const props = __props;
     const nowTime = ref(Date.now());
     let timer = null;
@@ -490,7 +491,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               }, [..._cache[1] || (_cache[1] = [
                 createElementVNode("div", { class: "textMsg" }, toDisplayString("暂不支持该消息"), -1)
               ])], 2)),
-              __props.msg.type === "text" && ["jpg", "jpeg", "png", "gif"].includes(((_j = (_i = __props.msg) == null ? void 0 : _i.attach) == null ? void 0 : _j.ext) || "") ? (openBlock(), createElementBlock("div", _hoisted_14, [
+              __props.msg.type === "text" && IMG_EXT.includes(((_j = (_i = __props.msg) == null ? void 0 : _i.attach) == null ? void 0 : _j.ext) || "") ? (openBlock(), createElementBlock("div", _hoisted_14, [
                 ((_l = (_k = __props.msg) == null ? void 0 : _k.attach) == null ? void 0 : _l.size) && ((_n = (_m = __props.msg) == null ? void 0 : _m.attach) == null ? void 0 : _n.size) < MAX_IMG_PREVIEW_SIZE ? (openBlock(), createBlock(unref(Image), {
                   key: 0,
                   class: "imgMsg",

package/dist/{index.vue_vue_type_style_index_0_lang-BaKNB-4q.mjs → index.vue_vue_type_style_index_0_lang-Dx16RQv1.mjs}

@@ -36829,6 +36829,7 @@ const useChannelStore = defineStore("channel", {
           channelId: this.currentChannel.channelId,
           type: "image",
           file: options.file,
+          ext: (options == null ? void 0 : options.ext) ? JSON.stringify(options == null ? void 0 : options.ext) : void 0,
           onUploadStart: options.onUploadStart,
           onUploadDone: options.onUploadDone,
           onSendBefore: (msg2) => {

package/dist/members-sidebar/index.js

@@ -1,4 +1,4 @@
-import { M as MembersSidebar } from "../index-BPnLB3av.mjs";
+import { M as MembersSidebar } from "../index-DDCNub37.mjs";
 export {
   MembersSidebar,
   MembersSidebar as default

package/dist/server-channel-sidebar/index.js

@@ -1,4 +1,4 @@
-import { S as ServerChannelSidebar } from "../index-DME8_VYv.mjs";
+import { S as ServerChannelSidebar } from "../index-C4E0XZdw.mjs";
 export {
   ServerChannelSidebar,
   ServerChannelSidebar as default

package/dist/stores/channel.d.ts

@@ -134,6 +134,7 @@ export declare const useChannelStore: import("pinia").StoreDefinition<"channel",
     }): Promise<void>;
     sendImageMsg(options: {
         file: IUploadFileOptions["file"];
+        ext?: SendMsgOption["ext"];
         onUploadStart: IUploadFileOptions["onUploadStart"];
         onUploadDone: IUploadFileOptions["onUploadDone"];
     }): Promise<void>;

package/dist/style.css

@@ -121,7 +121,7 @@
   font-size: 12px;
   color: var(--theme-text, #252b3a);
   text-align: left;
-  margin-bottom: 3px;
+  margin-bottom: 8px;
   display: flex;
   align-items: baseline;
   gap: 8px;
@@ -129,7 +129,7 @@
 .yx-chatCardWrapper .chatCardInfo .chatCardInfoName {
   color: var(--theme-text, #252b3a);
   font-weight: 500;
-  font-size: 16px;
+  font-size: 14px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -426,16 +426,15 @@
      -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
+  color: var(--theme-aide-text, #3b3e55);
 }
 .yx-chatroomWrapper .chatroomInputQuoteWrapper .chatroomInputQuoteText .chatroomInputQuoteTextName {
-  color: var(--theme-text, #252b3a);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 100%;
 }
 .yx-chatroomWrapper .chatroomInputQuoteWrapper .chatroomInputQuoteText .chatroomInputQuoteTextBody {
-  color: var(--theme-text, #252b3a);
   word-break: break-all;
   white-space: pre-wrap;
   text-align: left;
@@ -471,6 +470,7 @@
   background-color: rgba(0, 0, 0, 0.5);
   z-index: 1;
   display: none;
+  border-radius: 8px;
 }
 .yx-chatroomWrapper .chatroomInputAttachmentWrapperImg .chatroomInputAttachmentDeleteBtn {
   position: absolute;
@@ -509,6 +509,9 @@
   width: 28px;
   height: 28px;
   padding: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 .yx-chatroomWrapper .chatroomControllerWrapper .chatroomButton {
   display: flex;
@@ -771,36 +774,36 @@
   margin-bottom: 6px;
   border-radius: 8px;
   background-color: #282a2f;
-}.sidebar-container[data-v-961f30d7] {
+}.sidebar-container[data-v-83471ee8] {
   display: flex;
   height: 100%;
   position: relative;
 }
-.sidebar-container.is-switching .server-item[data-v-961f30d7],
-.sidebar-container.is-switching .channel-item[data-v-961f30d7] {
+.sidebar-container.is-switching .server-item[data-v-83471ee8],
+.sidebar-container.is-switching .channel-item[data-v-83471ee8] {
   cursor: not-allowed;
   opacity: 0.6;
   pointer-events: none;
 }
-.user-panel-float[data-v-961f30d7] {
+.user-panel-float[data-v-83471ee8] {
   position: absolute;
   bottom: 12px;
   left: 12px;
   display: flex;
   align-items: center;
   padding: 10px 12px;
-  background-color: var(--theme-global-bg);
+  background-color: var(--theme-default-bg, #fff);
   border: 1px solid var(--theme-line-border);
   z-index: 10;
   gap: 10px;
   border-radius: 8px;
   box-shadow: 0px 1px 3px 0px rgba(29, 31, 58, 0.0196078431);
 }
-.user-panel-float .user-avatar[data-v-961f30d7] {
+.user-panel-float .user-avatar[data-v-83471ee8] {
   position: relative;
   flex-shrink: 0;
 }
-.user-panel-float .user-avatar .online-indicator[data-v-961f30d7] {
+.user-panel-float .user-avatar .online-indicator[data-v-83471ee8] {
   position: absolute;
   bottom: 0;
   right: 0;
@@ -810,12 +813,12 @@
   border: 3px solid #1a1b1e;
   border-radius: 50%;
 }
-.user-panel-float .user-info[data-v-961f30d7] {
+.user-panel-float .user-info[data-v-83471ee8] {
   flex: 1;
   overflow: hidden;
   min-width: 0;
 }
-.user-panel-float .user-info .user-name[data-v-961f30d7] {
+.user-panel-float .user-info .user-name[data-v-83471ee8] {
   font-size: 14px;
   font-weight: 600;
   color: var(--theme-text);
@@ -823,25 +826,25 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.user-panel-float .user-info .user-status[data-v-961f30d7] {
+.user-panel-float .user-info .user-status[data-v-83471ee8] {
   display: flex;
   align-items: center;
   gap: 4px;
   font-size: 12px;
   color: var(--theme-success-text);
 }
-.user-panel-float .user-info .user-status .status-dot[data-v-961f30d7] {
+.user-panel-float .user-info .user-status .status-dot[data-v-83471ee8] {
   width: 8px;
   height: 8px;
   background-color: var(--theme-success-text);
   border-radius: 50%;
 }
-.user-panel-float .user-actions[data-v-961f30d7] {
+.user-panel-float .user-actions[data-v-83471ee8] {
   display: flex;
   align-items: center;
   gap: 8px;
 }
-.user-panel-float .user-actions .action-btn[data-v-961f30d7] {
+.user-panel-float .user-actions .action-btn[data-v-83471ee8] {
   width: 20px;
   height: 20px;
   display: flex;
@@ -854,14 +857,14 @@
   font-size: 16px;
   outline: none;
 }
-.user-panel-float .user-actions .action-btn[data-v-961f30d7]:hover {
+.user-panel-float .user-actions .action-btn[data-v-83471ee8]:hover {
   background-color: var(--theme-icon-hover);
   color: var(--theme-text);
 }
-.user-panel-float .user-actions .action-btn[data-v-961f30d7]:focus {
+.user-panel-float .user-actions .action-btn[data-v-83471ee8]:focus {
   outline: none;
 }
-.server-sidebar[data-v-961f30d7] {
+.server-sidebar[data-v-83471ee8] {
   display: flex;
   flex-direction: column;
   width: 72px;
@@ -869,23 +872,23 @@
   padding: 0 0 16px;
   padding-bottom: 73px;
 }
-.server-sidebar .server-list[data-v-961f30d7] {
+.server-sidebar .server-list[data-v-83471ee8] {
   flex: 1;
   overflow-y: auto;
   overflow-x: hidden;
   border-right: 1px solid var(--theme-line);
   padding-top: 16px;
 }
-.server-sidebar .server-list[data-v-961f30d7]::-webkit-scrollbar {
+.server-sidebar .server-list[data-v-83471ee8]::-webkit-scrollbar {
   width: 0;
 }
-.server-sidebar .logo-wrap[data-v-961f30d7] {
+.server-sidebar .logo-wrap[data-v-83471ee8] {
   margin: 0 16px;
   border-bottom: 1px solid var(--theme-line-split);
   padding-bottom: 12px;
   margin-bottom: 12px;
 }
-.server-sidebar .logo-wrap .logo[data-v-961f30d7] {
+.server-sidebar .logo-wrap .logo[data-v-83471ee8] {
   width: 40px;
   height: 40px;
   border-radius: 8px;
@@ -896,7 +899,7 @@
   overflow: hidden;
   transition: border-radius 0.15s ease-out, background-color 0.15s ease-out;
 }
-.server-sidebar .server-item[data-v-961f30d7] {
+.server-sidebar .server-item[data-v-83471ee8] {
   position: relative;
   display: flex;
   align-items: center;
@@ -904,7 +907,7 @@
   margin: 0 16px 16px;
   cursor: pointer;
 }
-.server-sidebar .server-item .server-icon[data-v-961f30d7] {
+.server-sidebar .server-item .server-icon[data-v-83471ee8] {
   width: 40px;
   height: 40px;
   border-radius: 8px;
@@ -915,36 +918,36 @@
   overflow: hidden;
   transition: border-radius 0.15s ease-out, background-color 0.15s ease-out;
 }
-.server-sidebar .server-item .server-icon img[data-v-961f30d7] {
+.server-sidebar .server-item .server-icon img[data-v-83471ee8] {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
      object-fit: cover;
 }
-.server-sidebar .server-item .server-icon .server-initial[data-v-961f30d7] {
+.server-sidebar .server-item .server-icon .server-initial[data-v-83471ee8] {
   font-size: 18px;
   font-weight: 500;
   color: var(--theme-text);
 }
-.server-sidebar .server-item:hover .server-icon[data-v-961f30d7], .server-sidebar .server-item.active .server-icon[data-v-961f30d7] {
+.server-sidebar .server-item:hover .server-icon[data-v-83471ee8], .server-sidebar .server-item.active .server-icon[data-v-83471ee8] {
   border-radius: 16px;
   background-color: var(--theme-form-control-line-active);
   border: 1px solid var(--theme-table-header-bg);
 }
-.server-sidebar .server-item:hover .server-icon .server-initial[data-v-961f30d7], .server-sidebar .server-item.active .server-icon .server-initial[data-v-961f30d7] {
+.server-sidebar .server-item:hover .server-icon .server-initial[data-v-83471ee8], .server-sidebar .server-item.active .server-icon .server-initial[data-v-83471ee8] {
   color: var(--theme-light-text);
 }
-.server-sidebar .server-item .unread-badge[data-v-961f30d7] {
+.server-sidebar .server-item .unread-badge[data-v-83471ee8] {
   position: absolute;
   bottom: -4px;
   right: 4px;
 }
-.server-sidebar .server-item.add-server[data-v-961f30d7] {
+.server-sidebar .server-item.add-server[data-v-83471ee8] {
   margin-top: 8px;
   padding-top: 8px;
   border-top: 2px solid var(--theme-global-bg);
 }
-.server-sidebar .server-item.add-server .add-server-btn[data-v-961f30d7] {
+.server-sidebar .server-item.add-server .add-server-btn[data-v-83471ee8] {
   width: 48px;
   height: 48px;
   border-radius: 50%;
@@ -957,12 +960,12 @@
   color: var(--theme-success-text);
   font-size: 20px;
 }
-.server-sidebar .server-item.add-server .add-server-btn[data-v-961f30d7]:hover {
+.server-sidebar .server-item.add-server .add-server-btn[data-v-83471ee8]:hover {
   border-radius: 16px;
   background-color: var(--theme-success-text);
   color: var(--theme-text);
 }
-.channel-sidebar[data-v-961f30d7] {
+.channel-sidebar[data-v-83471ee8] {
   display: flex;
   flex-direction: column;
   width: 294px;
@@ -974,7 +977,7 @@
   padding-bottom: 73px;
   position: relative;
 }
-.channel-sidebar .resize-handle[data-v-961f30d7] {
+.channel-sidebar .resize-handle[data-v-83471ee8] {
   position: absolute;
   top: 0;
   right: -3px;
@@ -984,17 +987,17 @@
   z-index: 20;
   transition: background-color 0.15s ease;
 }
-.channel-sidebar .resize-handle[data-v-961f30d7]:hover, .channel-sidebar .resize-handle[data-v-961f30d7]:active {
+.channel-sidebar .resize-handle[data-v-83471ee8]:hover, .channel-sidebar .resize-handle[data-v-83471ee8]:active {
   background-color: var(--theme-form-control-line-active);
 }
-.channel-sidebar .server-header[data-v-961f30d7] {
+.channel-sidebar .server-header[data-v-83471ee8] {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 22px 20px;
   border-bottom: 1px solid var(--theme-line);
 }
-.channel-sidebar .server-header .server-name[data-v-961f30d7] {
+.channel-sidebar .server-header .server-name[data-v-83471ee8] {
   font-size: 15px;
   font-weight: 600;
   color: var(--theme-stress-text);
@@ -1002,26 +1005,26 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.channel-sidebar .server-header .server-setting[data-v-961f30d7] {
+.channel-sidebar .server-header .server-setting[data-v-83471ee8] {
   color: #b9bbbe;
   cursor: pointer;
   font-size: 16px;
 }
-.channel-sidebar .server-header .server-setting[data-v-961f30d7]:hover {
+.channel-sidebar .server-header .server-setting[data-v-83471ee8]:hover {
   color: #dcddde;
 }
-.channel-sidebar .channel-list[data-v-961f30d7] {
+.channel-sidebar .channel-list[data-v-83471ee8] {
   flex: 1;
   overflow-y: auto;
 }
-.channel-sidebar .channel-list[data-v-961f30d7]::-webkit-scrollbar {
+.channel-sidebar .channel-list[data-v-83471ee8]::-webkit-scrollbar {
   width: 4px;
 }
-.channel-sidebar .channel-list[data-v-961f30d7]::-webkit-scrollbar-thumb {
+.channel-sidebar .channel-list[data-v-83471ee8]::-webkit-scrollbar-thumb {
   background-color: var(--theme-line);
   border-radius: 2px;
 }
-.channel-sidebar .channel-item[data-v-961f30d7] {
+.channel-sidebar .channel-item[data-v-83471ee8] {
   display: flex;
   align-items: center;
   padding: 0 20px;
@@ -1031,39 +1034,39 @@
   cursor: pointer;
   color: var(--theme-icon-fill-weak);
 }
-.channel-sidebar .channel-item[data-v-961f30d7]:not(:last-child) {
+.channel-sidebar .channel-item[data-v-83471ee8]:not(:last-child) {
   margin-bottom: 2px;
 }
-.channel-sidebar .channel-item[data-v-961f30d7]:hover {
+.channel-sidebar .channel-item[data-v-83471ee8]:hover {
   background-color: var(--theme-select-bg);
   color: var(--theme-text);
 }
-.channel-sidebar .channel-item:hover .channel-setting[data-v-961f30d7] {
+.channel-sidebar .channel-item:hover .channel-setting[data-v-83471ee8] {
   opacity: 1;
 }
-.channel-sidebar .channel-item.active[data-v-961f30d7] {
+.channel-sidebar .channel-item.active[data-v-83471ee8] {
   background-color: var(--theme-select-bg);
   color: var(--theme-text);
   font-weight: 500;
   font-size: 16px;
 }
-.channel-sidebar .channel-item .channel-icon[data-v-961f30d7] {
+.channel-sidebar .channel-item .channel-icon[data-v-83471ee8] {
   margin-right: 6px;
   font-size: 20px;
   font-weight: 400;
   color: #8e9297;
 }
-.channel-sidebar .channel-item .channel-name[data-v-961f30d7] {
+.channel-sidebar .channel-item .channel-name[data-v-83471ee8] {
   flex: 1;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   font-size: 14px;
 }
-.channel-sidebar .channel-item .channel-unread[data-v-961f30d7] {
+.channel-sidebar .channel-item .channel-unread[data-v-83471ee8] {
   margin-left: 4px;
 }
-.channel-sidebar .channel-item .channel-setting[data-v-961f30d7] {
+.channel-sidebar .channel-item .channel-setting[data-v-83471ee8] {
   opacity: 0;
   margin-left: 8px;
   font-size: 14px;
@@ -1072,10 +1075,10 @@
   transition: opacity 0.15s ease, color 0.15s ease;
   flex-shrink: 0;
 }
-.channel-sidebar .channel-item .channel-setting[data-v-961f30d7]:hover {
+.channel-sidebar .channel-item .channel-setting[data-v-83471ee8]:hover {
   color: var(--theme-text);
 }
-.channel-sidebar .add-channel-item[data-v-961f30d7] {
+.channel-sidebar .add-channel-item[data-v-83471ee8] {
   display: flex;
   align-items: center;
   padding: 12px 22px;
@@ -1084,7 +1087,7 @@
   margin-top: 4px;
   color: var(--theme-link);
 }
-.channel-sidebar .add-channel-item .channel-icon[data-v-961f30d7] {
+.channel-sidebar .add-channel-item .channel-icon[data-v-83471ee8] {
   margin-right: 6px;
   font-size: 16px;
   color: var(--theme-link);
@@ -1093,64 +1096,64 @@
   align-items: center;
   justify-content: center;
 }
-.channel-sidebar .add-channel-item .channel-name[data-v-961f30d7] {
+.channel-sidebar .add-channel-item .channel-name[data-v-83471ee8] {
   font-size: 14px;
 }
-[data-v-961f30d7] .ant-modal .ant-modal-content {
+[data-v-83471ee8] .ant-modal .ant-modal-content {
   background-color: var(--theme-global-bg);
   border-radius: 8px;
 }
-[data-v-961f30d7] .ant-modal .ant-modal-header {
+[data-v-83471ee8] .ant-modal .ant-modal-header {
   background-color: var(--theme-global-bg);
   border-bottom: none;
 }
-[data-v-961f30d7] .ant-modal .ant-modal-title {
+[data-v-83471ee8] .ant-modal .ant-modal-title {
   color: var(--theme-text);
 }
-[data-v-961f30d7] .ant-modal .ant-modal-close-x {
+[data-v-83471ee8] .ant-modal .ant-modal-close-x {
   color: #b9bbbe;
 }
-[data-v-961f30d7] .ant-modal .ant-form-item-label > label {
+[data-v-83471ee8] .ant-modal .ant-form-item-label > label {
   color: #b9bbbe;
 }
-[data-v-961f30d7] .ant-modal .ant-input {
+[data-v-83471ee8] .ant-modal .ant-input {
   background-color: var(--theme-line);
   border-color: #040405;
   color: #dcddde;
 }
-[data-v-961f30d7] .ant-modal .ant-input::-moz-placeholder {
+[data-v-83471ee8] .ant-modal .ant-input::-moz-placeholder {
   color: #72767d;
 }
-[data-v-961f30d7] .ant-modal .ant-input:-ms-input-placeholder {
+[data-v-83471ee8] .ant-modal .ant-input:-ms-input-placeholder {
   color: #72767d;
 }
-[data-v-961f30d7] .ant-modal .ant-input::placeholder {
+[data-v-83471ee8] .ant-modal .ant-input::placeholder {
   color: #72767d;
 }
-[data-v-961f30d7] .ant-modal .ant-input:hover,[data-v-961f30d7] .ant-modal .ant-input:focus {
+[data-v-83471ee8] .ant-modal .ant-input:hover,[data-v-83471ee8] .ant-modal .ant-input:focus {
   border-color: #5865f2;
 }
-[data-v-961f30d7] .ant-modal .ant-tabs-tab {
+[data-v-83471ee8] .ant-modal .ant-tabs-tab {
   color: #b9bbbe;
 }
-[data-v-961f30d7] .ant-modal .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
+[data-v-83471ee8] .ant-modal .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
   color: var(--theme-text);
 }
-[data-v-961f30d7] .ant-modal .ant-tabs-ink-bar {
+[data-v-83471ee8] .ant-modal .ant-tabs-ink-bar {
   background-color: #5865f2;
 }
-.footer-container[data-v-961f30d7] {
+.footer-container[data-v-83471ee8] {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 10px;
 }
-.invite-btn[data-v-961f30d7] {
+.invite-btn[data-v-83471ee8] {
   cursor: pointer;
   color: var(--theme-icon-fill-weak);
   transition: color 0.15s ease;
 }
-.invite-btn[data-v-961f30d7]:hover {
+.invite-btn[data-v-83471ee8]:hover {
   color: var(--theme-text);
 }.channel-modal .ant-modal-header {
   background-color: var(--theme-table-header-bg);