tuikit-atomicx-vue3 4.4.0 → 4.5.0

package/dist/components/MessageInput/TextEditor/index.js

@@ -1,74 +1,83 @@
-import { defineComponent as I, ref as p, onMounted as F, onUnmounted as g, watch as c, createElementBlock as f, openBlock as m, normalizeClass as d, unref as a, createElementVNode as _, renderSlot as h } from "vue";
-import { useUIKit as B } from "@tencentcloud/uikit-base-component-vue3";
-import { createEditor as S } from "./EditorCore.js";
-import { useMessageInputState as k } from "../../../states/MessageInputState/MessageInputState.js";
-import { useConversationListState as M } from "../../../states/ConversationListState/ConversationListState.js";
-const D = "_disabled_ihh75_11", R = "_editor_ihh75_21", o = {
+import { defineComponent as F, ref as f, computed as S, onMounted as B, onUnmounted as L, watch as r, createElementBlock as m, openBlock as h, normalizeClass as d, unref as s, createElementVNode as _, renderSlot as x } from "vue";
+import { useUIKit as M } from "@tencentcloud/uikit-base-component-vue3";
+import { createEditor as k } from "./EditorCore.js";
+import { useMessageInputState as D } from "../../../states/MessageInputState/MessageInputState.js";
+import { useConversationListState as P } from "../../../states/ConversationListState/ConversationListState.js";
+const R = "_disabled_ihh75_11", U = "_editor_ihh75_21", i = {
   "input-wrapper": "_input-wrapper_ihh75_1",
-  disabled: D,
+  disabled: R,
   "input-prefix": "_input-prefix_ihh75_15",
   "input-suffix": "_input-suffix_ihh75_16",
-  editor: R
-}, $ = /* @__PURE__ */ I({
+  editor: U
+}, A = /* @__PURE__ */ F({
   __name: "TextEditor",
   props: {
     autoFocus: { type: Boolean, default: !0 },
     disabled: { type: Boolean, default: !1 },
-    placeholder: { default: void 0 }
+    placeholder: { default: void 0 },
+    maxLength: { default: void 0 }
   },
   setup(b) {
-    const t = b, { t: x } = B(), { activeConversation: E } = M(), { updateRawValue: v, sendMessage: y, setEditorInstance: n, setContent: r } = k(), l = p(null), u = p(t.autoFocus);
-    let s = null;
-    return F(() => {
-      const e = l.value;
-      e && (e.classList.add("message-input"), e.dataset.editorCreated || (s = S({
+    const t = b, { t: v, language: g } = M(), { activeConversation: E } = P(), { updateRawValue: y, sendMessage: I, setEditorInstance: u, setContent: l } = D(), n = f(null), p = f(t.autoFocus), c = S(() => t.placeholder ?? v("MessageInput.enter_a_message"));
+    let a = null;
+    return B(() => {
+      const e = n.value;
+      e && (e.classList.add("message-input"), e.dataset.editorCreated || (a = k({
         element: e,
-        placeholder: t.placeholder ?? x("MessageInput.enter_a_message"),
+        placeholder: c.value,
         isPlaceholderOnlyShowWhenEditable: t.placeholder === void 0,
         autoFocus: t.autoFocus,
         disabled: t.disabled,
-        onUpdate: (i) => {
-          v(i);
+        maxLength: t.maxLength,
+        onUpdate: (o) => {
+          y(o);
         },
         onEnter: () => {
-          y(), r("");
+          I(), l("");
         },
         onFocus: () => {
-          u.value = !0;
+          p.value = !0;
         },
         onBlur: () => {
-          u.value = !1;
+          p.value = !1;
         }
-      }), e.dataset.editorCreated = "true", n(s)));
-    }), g(() => {
-      const e = l.value;
-      s && e && (s.destroy(), e.removeAttribute("data-editor-created"), n(null));
-    }), c(E, (e, i) => {
-      (e == null ? void 0 : e.conversationID) !== (i == null ? void 0 : i.conversationID) && r("");
-    }), c(() => t.disabled, (e) => {
-      s && (s.setEditable(!e), e && r(""));
-    }), (e, i) => (m(), f("div", {
-      class: d([a(o)["input-wrapper"], t.disabled && a(o).disabled])
+      }), e.dataset.editorCreated = "true", u(a)));
+    }), L(() => {
+      const e = n.value;
+      a && e && (a.destroy(), e.removeAttribute("data-editor-created"), u(null));
+    }), r(E, (e, o) => {
+      (e == null ? void 0 : e.conversationID) !== (o == null ? void 0 : o.conversationID) && l("");
+    }), r(g, () => {
+      if (a && t.placeholder === void 0) {
+        const e = a.extensionManager.extensions.find(
+          (o) => o.name === "placeholder"
+        );
+        e && (e.options.placeholder = c.value, a.view.updateState(a.state));
+      }
+    }), r(() => t.disabled, (e) => {
+      a && (a.setEditable(!e), e && l(""));
+    }), (e, o) => (h(), m("div", {
+      class: d([s(i)["input-wrapper"], t.disabled && s(i).disabled])
     }, [
       _("div", {
-        class: d(a(o)["input-prefix"])
+        class: d(s(i)["input-prefix"])
       }, [
-        h(e.$slots, "inputPrefix")
+        x(e.$slots, "inputPrefix")
       ], 2),
-      (m(), f("div", {
+      (h(), m("div", {
         ref_key: "editorDomRef",
-        ref: l,
+        ref: n,
         key: t.disabled ? "disabled" : "enabled",
-        class: d(a(o).editor)
+        class: d(s(i).editor)
       }, null, 2)),
       _("div", {
-        class: d(a(o)["input-suffix"])
+        class: d(s(i)["input-suffix"])
       }, [
-        h(e.$slots, "inputSuffix")
+        x(e.$slots, "inputSuffix")
       ], 2)
     ], 2));
   }
 });
 export {
-  $ as TextEditor
+  A as TextEditor
 };

package/dist/components/MessageInput/VideoCallPicker/VideoCallPicker.js

@@ -1,14 +1,14 @@
-import { defineComponent as A, useCssModule as B, ref as M, computed as f, createBlock as O, openBlock as z, unref as t, withCtx as g, createElementVNode as N, createVNode as m, normalizeClass as I, renderSlot as $ } from "vue";
-import { useUIKit as F, IconVideoDefault as K, TUIDialog as X } from "@tencentcloud/uikit-base-component-vue3";
-import { c as Y } from "../../../index-DPczIrgX.js";
-import { View as Z } from "../../../baseComp/View/index.js";
+import { defineComponent as B, useCssModule as O, ref as M, computed as f, createBlock as z, openBlock as N, unref as r, withCtx as g, createElementVNode as $, createVNode as m, normalizeClass as I, renderSlot as F } from "vue";
+import { useUIKit as K, IconVideoDefault as X, TUIDialog as Y } from "@tencentcloud/uikit-base-component-vue3";
+import { c as Z } from "../../../index-DPczIrgX.js";
+import { View as j } from "../../../baseComp/View/index.js";
 import { ConversationType as _ } from "../../../types/engine.js";
 import { startCall as k } from "../../../utils/call.js";
-import { UserPicker as j } from "../../UserPicker/index.js";
-import { useGroupSettingState as q } from "../../../states/GroupSettingState/GroupSettingState.js";
-import { useConversationListState as H } from "../../../states/ConversationListState/ConversationListState.js";
-import { _ as J } from "../../../_plugin-vue_export-helper-CHgC5LLL.js";
-const y = 2, Q = 80, W = 9, ee = 1, oe = /* @__PURE__ */ A({
+import { UserPicker as q } from "../../UserPicker/index.js";
+import { useGroupSettingState as H } from "../../../states/GroupSettingState/GroupSettingState.js";
+import { useConversationListState as J } from "../../../states/ConversationListState/ConversationListState.js";
+import { _ as Q } from "../../../_plugin-vue_export-helper-CHgC5LLL.js";
+const y = 2, W = 80, ee = 9, oe = 1, te = /* @__PURE__ */ B({
   __name: "VideoCallPicker",
   props: {
     label: { default: "" },
@@ -16,26 +16,24 @@ const y = 2, Q = 80, W = 9, ee = 1, oe = /* @__PURE__ */ A({
     disabled: { type: Boolean, default: !1 }
   },
   setup(G) {
-    const s = G, n = B(), { t: i } = F(), { activeConversation: r } = H(), { allMembers: v, getGroupMemberList: P, memberCount: h } = q(), c = M(!1), u = M(), D = f(
+    const s = G, n = O(), { t: i } = K(), { activeConversation: l } = J(), { allMembers: v, getGroupMemberList: D, memberCount: P, currentUserID: h } = H(), c = M(!1), u = M(), E = f(
       () => {
         var e;
-        return ((e = r.value) == null ? void 0 : e.type) === _.C2C;
+        return ((e = l.value) == null ? void 0 : e.type) === _.C2C;
       }
-    ), E = f(
-      () => {
-        var e;
-        return ((e = v.value) == null ? void 0 : e.map((o) => ({
-          key: o.userID,
-          label: o.nick || o.userID,
-          avatarUrl: o.avatar
-        }))) ?? [];
-      }
-    ), L = f(() => !(!r.value || s.disabled));
+    ), U = f(() => {
+      var o;
+      return (((o = v.value) == null ? void 0 : o.map((t) => ({
+        key: t.userID,
+        label: t.nick || t.userID,
+        avatarUrl: t.avatar
+      }))) ?? []).filter((t) => t.key !== h.value);
+    }), L = f(() => !(!l.value || s.disabled));
     function S() {
       var e, o;
-      return (o = (e = r.value) == null ? void 0 : e.userProfile) == null ? void 0 : o.userID;
+      return (o = (e = l.value) == null ? void 0 : e.userProfile) == null ? void 0 : o.userID;
     }
-    function U() {
+    function R() {
       const e = S();
       if (!e) {
         console.warn("No peer user ID found for private call");
@@ -52,24 +50,24 @@ const y = 2, Q = 80, W = 9, ee = 1, oe = /* @__PURE__ */ A({
       }
     }
     function C() {
-      var a, l;
-      if (((a = r.value) == null ? void 0 : a.type) !== _.GROUP)
+      var t, a;
+      if (((t = l.value) == null ? void 0 : t.type) !== _.GROUP)
         return;
-      const e = ((l = v.value) == null ? void 0 : l.length) || 0, o = h.value || 0;
-      e < o && P({
-        count: Q,
+      const e = ((a = v.value) == null ? void 0 : a.length) || 0, o = P.value || 0;
+      e < o && D({
+        count: W,
         offset: e
       });
     }
-    function R() {
+    function V() {
       C(), c.value = !0;
     }
-    function p() {
+    function d() {
       c.value = !1;
     }
-    function V() {
-      var l, b;
-      const e = (b = (l = r.value) == null ? void 0 : l.groupProfile) == null ? void 0 : b.groupID;
+    function w() {
+      var a, b;
+      const e = (b = (a = l.value) == null ? void 0 : a.groupProfile) == null ? void 0 : b.groupID;
       if (!u.value || !e) {
         console.warn("Missing group information for group call");
         return;
@@ -79,65 +77,65 @@ const y = 2, Q = 80, W = 9, ee = 1, oe = /* @__PURE__ */ A({
         console.warn("No members selected for group call");
         return;
       }
-      const a = o.map((d) => d.key);
+      const t = o.map((p) => p.key);
       try {
         k({
-          userIDList: a,
+          userIDList: t,
           chatGroupID: e,
           type: y
-        }), p();
-      } catch (d) {
-        console.error("Failed to start group video call:", d);
+        }), d();
+      } catch (p) {
+        console.error("Failed to start group video call:", p);
       }
     }
-    function w() {
+    function x() {
       if (!L.value) {
         console.warn("Cannot start video call");
         return;
       }
-      D.value ? U() : R();
+      E.value ? R() : V();
     }
-    const x = () => {
+    const T = () => {
       var e;
-      ((e = r.value) == null ? void 0 : e.type) === _.GROUP && C();
-    }, T = () => V();
-    return (e, o) => (z(), O(t(Z), null, {
+      ((e = l.value) == null ? void 0 : e.type) === _.GROUP && C();
+    }, A = () => w();
+    return (e, o) => (N(), z(r(j), null, {
       default: g(() => [
-        N("div", {
-          class: I(t(Y)(t(n)["video-call-picker__button"], {
-            [t(n).disabled]: s.disabled
+        $("div", {
+          class: I(r(Z)(r(n)["video-call-picker__button"], {
+            [r(n).disabled]: s.disabled
           })),
-          onClick: w
+          onClick: x
         }, [
-          $(e.$slots, "default", {}, () => [
-            m(t(K), {
+          F(e.$slots, "default", {}, () => [
+            m(r(X), {
               size: s.iconSize,
-              class: I(t(n)["video-call-picker__icon"])
+              class: I(r(n)["video-call-picker__icon"])
             }, null, 8, ["size", "class"])
           ])
         ], 2),
-        m(t(X), {
+        m(r(Y), {
           visible: c.value,
-          title: t(i)("MessageInput.select_call_members"),
-          cancelText: t(i)("MessageInput.cancel"),
-          cancel: p,
-          close: p,
-          confirmText: t(i)("MessageInput.initiate_call"),
-          confirm: T,
+          title: r(i)("MessageInput.select_call_members"),
+          cancelText: r(i)("MessageInput.cancel"),
+          cancel: d,
+          close: d,
+          confirmText: r(i)("MessageInput.initiate_call"),
+          confirm: A,
           customClasses: ["group-call-dialog"],
           appendTo: "body"
         }, {
           default: g(() => [
-            m(t(j), {
+            m(r(q), {
               ref_key: "groupMemberPickerRef",
               ref: u,
               "display-mode": "list",
-              "data-source": E.value,
-              "max-count": W,
-              "min-count": ee,
+              "data-source": U.value,
+              "max-count": ee,
+              "min-count": oe,
               class: "group-member-picker",
               style: { width: "100%" },
-              onReachEnd: x
+              onReachEnd: T
             }, null, 8, ["data-source"])
           ]),
           _: 1
@@ -146,13 +144,13 @@ const y = 2, Q = 80, W = 9, ee = 1, oe = /* @__PURE__ */ A({
       _: 3
     }));
   }
-}), te = "_disabled_18fa2_16", re = {
+}), re = "_disabled_18fa2_16", le = {
   "video-call-picker__button": "_video-call-picker__button_18fa2_1",
-  disabled: te,
+  disabled: re,
   "video-call-picker__icon": "_video-call-picker__icon_18fa2_22"
-}, le = {
-  $style: re
-}, _e = /* @__PURE__ */ J(oe, [["__cssModules", le]]);
+}, ae = {
+  $style: le
+}, ve = /* @__PURE__ */ Q(te, [["__cssModules", ae]]);
 export {
-  _e as default
+  ve as default
 };

package/dist/components/MessageInput/i18n/index.d.ts

@@ -24,5 +24,9 @@ export declare const resources: {
         unknown: string;
         enter_a_message: string;
         send: string;
+        select_call_members: string;
+        cancel: string;
+        confirm: string;
+        initiate_call: string;
     };
 };

package/dist/components/MessageInput/i18n/zh-CN.d.ts

@@ -8,5 +8,9 @@ declare const MessageInput: {
     unknown: string;
     enter_a_message: string;
     send: string;
+    select_call_members: string;
+    cancel: string;
+    confirm: string;
+    initiate_call: string;
 };
 export default MessageInput;

package/dist/components/MessageInput/i18n/zh-CN.js

@@ -7,7 +7,11 @@ const e = {
   custom_message: "自定义消息",
   unknown: "未知",
   enter_a_message: "输入消息",
-  send: "发送"
+  send: "发送",
+  select_call_members: "选择成员",
+  cancel: "取消",
+  confirm: "确认",
+  initiate_call: "发起通话"
 };
 export {
   e as default

package/dist/components/MessageInput/index.d.ts

@@ -3,18 +3,22 @@ declare const MessageInput: {
         slots: {
             type: import('vue').PropType<import('./types').MessageInputSlots>;
         };
-        placeholder: {
-            type: import('vue').PropType<string>;
-            default: undefined;
-        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
         autoFocus: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        maxLength: {
+            type: import('vue').PropType<number>;
+            default: undefined;
+        };
         actions: {
             type: import('vue').PropType<import('./types').MessageInputActions>;
             default: () => string[];
@@ -28,9 +32,10 @@ declare const MessageInput: {
             default: boolean;
         };
     }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
-        placeholder: string;
         disabled: boolean;
+        placeholder: string;
         autoFocus: boolean;
+        maxLength: number;
         actions: import('./types').MessageInputActions;
         attachmentPickerMode: import('./types').MessageInputAttachmentPickerMode;
         hideSendButton: boolean;
@@ -45,18 +50,22 @@ declare const MessageInput: {
         slots: {
             type: import('vue').PropType<import('./types').MessageInputSlots>;
         };
-        placeholder: {
-            type: import('vue').PropType<string>;
-            default: undefined;
-        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
         autoFocus: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        maxLength: {
+            type: import('vue').PropType<number>;
+            default: undefined;
+        };
         actions: {
             type: import('vue').PropType<import('./types').MessageInputActions>;
             default: () => string[];
@@ -70,9 +79,10 @@ declare const MessageInput: {
             default: boolean;
         };
     }>> & Readonly<{}>, {}, {}, {}, {}, {
-        placeholder: string;
         disabled: boolean;
+        placeholder: string;
         autoFocus: boolean;
+        maxLength: number;
         actions: import('./types').MessageInputActions;
         attachmentPickerMode: import('./types').MessageInputAttachmentPickerMode;
         hideSendButton: boolean;
@@ -84,18 +94,22 @@ declare const MessageInput: {
     slots: {
         type: import('vue').PropType<import('./types').MessageInputSlots>;
     };
-    placeholder: {
-        type: import('vue').PropType<string>;
-        default: undefined;
-    };
     disabled: {
         type: import('vue').PropType<boolean>;
         default: boolean;
     };
+    placeholder: {
+        type: import('vue').PropType<string>;
+        default: undefined;
+    };
     autoFocus: {
         type: import('vue').PropType<boolean>;
         default: boolean;
     };
+    maxLength: {
+        type: import('vue').PropType<number>;
+        default: undefined;
+    };
     actions: {
         type: import('vue').PropType<import('./types').MessageInputActions>;
         default: () => string[];
@@ -109,9 +123,10 @@ declare const MessageInput: {
         default: boolean;
     };
 }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
-    placeholder: string;
     disabled: boolean;
+    placeholder: string;
     autoFocus: boolean;
+    maxLength: number;
     actions: import('./types').MessageInputActions;
     attachmentPickerMode: import('./types').MessageInputAttachmentPickerMode;
     hideSendButton: boolean;
@@ -400,22 +415,27 @@ declare const VideoPicker: {
 });
 declare const TextEditor: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
-        placeholder: {
-            type: import('vue').PropType<string>;
-            default: undefined;
-        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
         autoFocus: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        maxLength: {
+            type: import('vue').PropType<number>;
+            default: undefined;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
-        placeholder: string;
         disabled: boolean;
+        placeholder: string;
         autoFocus: boolean;
+        maxLength: number;
     }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
@@ -424,43 +444,53 @@ declare const TextEditor: {
         M: {};
         Defaults: {};
     }, Readonly<import('vue').ExtractPropTypes<{
-        placeholder: {
-            type: import('vue').PropType<string>;
-            default: undefined;
-        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: undefined;
+        };
         autoFocus: {
             type: import('vue').PropType<boolean>;
             default: boolean;
         };
+        maxLength: {
+            type: import('vue').PropType<number>;
+            default: undefined;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, {
-        placeholder: string;
         disabled: boolean;
+        placeholder: string;
         autoFocus: boolean;
+        maxLength: number;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
-    placeholder: {
-        type: import('vue').PropType<string>;
-        default: undefined;
-    };
     disabled: {
         type: import('vue').PropType<boolean>;
         default: boolean;
     };
+    placeholder: {
+        type: import('vue').PropType<string>;
+        default: undefined;
+    };
     autoFocus: {
         type: import('vue').PropType<boolean>;
         default: boolean;
     };
+    maxLength: {
+        type: import('vue').PropType<number>;
+        default: undefined;
+    };
 }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
-    placeholder: string;
     disabled: boolean;
+    placeholder: string;
     autoFocus: boolean;
+    maxLength: number;
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {
         inputPrefix?(_: {}): any;

package/dist/components/MessageInput/index.js

@@ -6,7 +6,7 @@ import n from "./EmojiPicker/EmojiPicker.js";
 import { TextEditor as c } from "./TextEditor/index.js";
 import s from "./AudioCallPicker/AudioCallPicker.js";
 import a from "./VideoCallPicker/VideoCallPicker.js";
-import { _ as p } from "../../MessageInput.vue_vue_type_script_setup_true_lang-D9jiYNFu.js";
+import { _ as p } from "../../MessageInput.vue_vue_type_script_setup_true_lang-jPzZ5INK.js";
 import { addI18n as o } from "../../i18n/index.js";
 import { resources as t } from "./i18n/index.js";
 o("en-US", { translation: { MessageInput: t["en-US"] } });