tuikit-atomicx-vue3 4.4.0-beta.1 → 4.5.0

package/.eslintrc.cjs

@@ -7,9 +7,10 @@ module.exports = {
     ecmaVersion: 2020,
     sourceType: 'module',
     project: [
-      './tsconfig.json',
+      './tsconfig.eslint.json',
     ],
     tsconfigRootDir: __dirname,
+    extraFileExtensions: ['.vue'],
   },
   rules: {
     'vue/multi-word-component-names': 'off',
@@ -29,6 +30,9 @@ module.exports = {
     'no-unused-vars': 'off',
     '@typescript-eslint/no-unused-vars': 'error',
     '@typescript-eslint/no-duplicate-enum-values': 0,
+    'class-methods-use-this': 0,
+    '@typescript-eslint/no-useless-constructor': 'off',
+    'no-await-in-loop': 0,
   },
-  ignorePatterns: ['node_modules', 'public', 'dist', '*.d.ts', '!.*.cjs', '!.storybook', '*.cjs'],
+  ignorePatterns: ['node_modules', 'public', 'dist', '*.d.ts', '!.*.cjs', '!.storybook', '*.cjs', 'test-app'],
 };

package/dist/DurationSelector.vue_vue_type_script_setup_true_lang-RndH6NtJ.js

@@ -0,0 +1,54 @@
+import { defineComponent as T, computed as r, createBlock as s, openBlock as u, unref as c, withCtx as M, createElementBlock as N, Fragment as V, renderList as D } from "vue";
+import { useUIKit as b, TUISelect as g, TUIOption as A, TUIToast as i } from "@tencentcloud/uikit-base-component-vue3";
+const a = 15 * 60, m = 24 * 3600, d = 3600, R = 15 * 60, x = /* @__PURE__ */ T({
+  __name: "DurationSelector",
+  props: {
+    modelValue: {},
+    options: { default: void 0 }
+  },
+  emits: ["update:modelValue"],
+  setup(l, { emit: p }) {
+    const f = l, h = p, { t: o } = b(), _ = (e) => {
+      const t = Math.floor(e / 3600), n = Math.floor(e % 3600 / 60);
+      return t === 0 ? `${n} ${o("minutes")}` : t === 1 ? `1 ${o("hour")}` : `${t} ${o("hours")}`;
+    }, v = r(() => {
+      const e = [];
+      for (let t = a; t < d; t += R)
+        e.push(t);
+      for (let t = 1; t <= 24; t += 1)
+        e.push(t * d);
+      return e;
+    }), I = r(
+      () => v.value.map((e) => ({
+        label: _(e),
+        value: e
+      }))
+    ), U = r(() => (f.options || I.value).filter((t) => t.value >= a && t.value <= m)), O = (e) => {
+      if (e < a) {
+        i.error({ message: o("Meeting duration must be at least 15 minutes") });
+        return;
+      }
+      if (e > m) {
+        i.error({ message: o("Meeting duration cannot exceed 24 hours") });
+        return;
+      }
+      h("update:modelValue", e);
+    };
+    return (e, t) => (u(), s(c(g), {
+      "model-value": l.modelValue,
+      "onUpdate:modelValue": O
+    }, {
+      default: M(() => [
+        (u(!0), N(V, null, D(U.value, (n) => (u(), s(c(A), {
+          key: n.value,
+          value: n.value,
+          label: n.label
+        }, null, 8, ["value", "label"]))), 128))
+      ]),
+      _: 1
+    }, 8, ["model-value"]));
+  }
+});
+export {
+  x as _
+};

package/dist/{MessageInput.vue_vue_type_script_setup_true_lang-D1G-LitO.js → MessageInput.vue_vue_type_script_setup_true_lang-jPzZ5INK.js}

@@ -1,9 +1,9 @@
-import { defineComponent as B, computed as E, createElementBlock as f, openBlock as r, normalizeClass as s, unref as o, renderSlot as i, createElementVNode as m, Fragment as F, renderList as V, createBlock as d, resolveDynamicComponent as A, mergeProps as M, createVNode as T, withCtx as g, createCommentVNode as j } from "vue";
+import { defineComponent as E, computed as F, createElementBlock as f, openBlock as l, normalizeClass as s, unref as o, renderSlot as i, createElementVNode as m, Fragment as V, renderList as A, createBlock as d, resolveDynamicComponent as M, mergeProps as T, createVNode as L, withCtx as g, createCommentVNode as w } from "vue";
 import { AttachmentPicker as k } from "./components/MessageInput/AttachmentPicker/index.js";
-import N from "./components/MessageInput/AttachmentPicker/FilePicker.js";
-import L from "./components/MessageInput/AttachmentPicker/ImagePicker.js";
-import O from "./components/MessageInput/AttachmentPicker/VideoPicker.js";
-import x from "./components/MessageInput/AudioCallPicker/AudioCallPicker.js";
+import x from "./components/MessageInput/AttachmentPicker/FilePicker.js";
+import j from "./components/MessageInput/AttachmentPicker/ImagePicker.js";
+import N from "./components/MessageInput/AttachmentPicker/VideoPicker.js";
+import O from "./components/MessageInput/AudioCallPicker/AudioCallPicker.js";
 import z from "./components/MessageInput/EmojiPicker/EmojiPicker.js";
 import { QuotedMessagePreview as D } from "./components/MessageInput/QuotedMessagePreview/index.js";
 import { SendButton as K } from "./components/MessageInput/SendButton/index.js";
@@ -11,21 +11,22 @@ import { TextEditor as Q } from "./components/MessageInput/TextEditor/index.js";
 import R from "./components/MessageInput/VideoCallPicker/VideoCallPicker.js";
 import { useMessageInputState as U } from "./states/MessageInputState/MessageInputState.js";
 const a = {
-  "message-input": "_message-input_clemw_1",
-  "message-input__toolbar": "_message-input__toolbar_clemw_11",
-  "message-input__wrapper": "_message-input__wrapper_clemw_18",
-  "message-input__leftInline": "_message-input__leftInline_clemw_23",
-  "message-input__rightInline": "_message-input__rightInline_clemw_23",
-  "message-input__actions": "_message-input__actions_clemw_27",
-  "message-input__footerToolbar": "_message-input__footerToolbar_clemw_33"
-}, se = /* @__PURE__ */ B({
+  "message-input": "_message-input_m79i1_1",
+  "message-input__toolbar": "_message-input__toolbar_m79i1_11",
+  "message-input__wrapper": "_message-input__wrapper_m79i1_19",
+  "message-input__leftInline": "_message-input__leftInline_m79i1_24",
+  "message-input__rightInline": "_message-input__rightInline_m79i1_24",
+  "message-input__actions": "_message-input__actions_m79i1_28",
+  "message-input__footerToolbar": "_message-input__footerToolbar_m79i1_34"
+}, se = /* @__PURE__ */ E({
   __name: "MessageInput",
   props: {
     autoFocus: { type: Boolean, default: !0 },
     disabled: { type: Boolean, default: !1 },
     hideSendButton: { type: Boolean, default: !1 },
-    placeholder: { default: "" },
+    placeholder: { default: void 0 },
     attachmentPickerMode: { default: "collapsed" },
+    maxLength: { default: void 0 },
     actions: { default: () => ["EmojiPicker", "ImagePicker", "FilePicker", "VideoPicker"] },
     slots: {}
   },
@@ -33,53 +34,54 @@ const a = {
     const u = [
       { key: "EmojiPicker", component: z },
       { key: "AttachmentPicker", component: k },
-      { key: "FilePicker", component: N },
-      { key: "ImagePicker", component: L },
-      { key: "VideoPicker", component: O },
-      { key: "AudioCallPicker", component: x },
+      { key: "FilePicker", component: x },
+      { key: "ImagePicker", component: j },
+      { key: "VideoPicker", component: N },
+      { key: "AudioCallPicker", component: O },
       { key: "VideoCallPicker", component: R }
-    ], c = n, { inputRawValue: P, setContent: b, sendMessage: C } = U(), h = (e, l) => Object.fromEntries(
-      l.map((t) => [t, e[t]]).filter(([, t]) => t !== void 0)
+    ], c = n, { inputRawValue: P, setContent: b, sendMessage: C } = U(), h = (e, r) => Object.fromEntries(
+      r.map((t) => [t, e[t]]).filter(([, t]) => t !== void 0)
     ), y = (e) => {
-      const { component: l = () => null } = u.find(({ key: t }) => t === e) ?? {};
-      return { Component: l, props: { disabled: c.disabled } };
-    }, I = (e) => {
+      const { component: r = () => null } = u.find(({ key: t }) => t === e) ?? {};
+      return { Component: r, props: { disabled: c.disabled } };
+    }, v = (e) => {
       var _;
-      const { key: l, component: t, ...p } = e, $ = ((_ = u.find(({ key: S }) => S === l)) == null ? void 0 : _.component) ?? (() => null);
+      const { key: r, component: t, ...p } = e, S = ((_ = u.find(({ key: B }) => B === r)) == null ? void 0 : _.component) ?? (() => null);
       return {
-        Component: t ?? $,
+        Component: t ?? S,
         props: h(p, ["label", "className", "style", "iconSize"])
       };
-    }, v = E(
-      () => c.actions.map((e) => typeof e == "string" ? y(e) : I(e)).filter(({ Component: e }) => e !== null)
-    ), w = () => {
+    }, I = F(
+      () => c.actions.map((e) => typeof e == "string" ? y(e) : v(e)).filter(({ Component: e }) => e !== null)
+    ), $ = () => {
       P.value && (C(), b(""));
     };
-    return (e, l) => (r(), f("div", {
+    return (e, r) => (l(), f("div", {
       class: s([o(a)["message-input"]])
     }, [
       i(e.$slots, "headerToolbar", {}, () => [
         m("div", {
           class: s(o(a)["message-input__toolbar"])
         }, [
-          (r(!0), f(F, null, V(v.value, (t, p) => (r(), d(A(t.Component), M({ key: p }, { ref_for: !0 }, { ...t.props, ...t.Component === o(k) ? { attachmentPickerMode: n.attachmentPickerMode } : {} }), null, 16))), 128))
+          (l(!0), f(V, null, A(I.value, (t, p) => (l(), d(M(t.Component), T({ key: p }, { ref_for: !0 }, { ...t.props, ...t.Component === o(k) ? { attachmentPickerMode: n.attachmentPickerMode } : {} }), null, 16))), 128))
         ], 2)
       ]),
       m("div", {
         class: s(o(a)["message-input__wrapper"])
       }, [
-        T(o(D)),
+        L(o(D)),
         m("div", {
           class: s(o(a)["message-input__leftInline"])
         }, [
           i(e.$slots, "leftInline")
         ], 2),
         i(e.$slots, "textEditor", {}, () => [
-          (r(), d(o(Q), {
+          (l(), d(o(Q), {
             key: n.disabled ? "disabled-editor" : "enabled-editor",
             autoFocus: n.autoFocus,
             disabled: n.disabled,
-            placeholder: n.placeholder
+            placeholder: n.placeholder,
+            maxLength: n.maxLength
           }, {
             inputPrefix: g(() => [
               i(e.$slots, "inputPrefix")
@@ -88,7 +90,7 @@ const a = {
               i(e.$slots, "inputSuffix")
             ]),
             _: 3
-          }, 8, ["autoFocus", "disabled", "placeholder"]))
+          }, 8, ["autoFocus", "disabled", "placeholder", "maxLength"]))
         ]),
         m("div", {
           class: s(o(a)["message-input__rightInline"])
@@ -100,11 +102,11 @@ const a = {
         m("div", {
           class: s(o(a)["message-input__footerToolbar"])
         }, [
-          n.hideSendButton ? j("", !0) : (r(), d(o(K), {
+          n.hideSendButton ? w("", !0) : (l(), d(o(K), {
             key: 0,
             class: s(o(a)["message-input__send-button"]),
             disabled: c.disabled,
-            onClick: w
+            onClick: $
           }, null, 8, ["class", "disabled"]))
         ], 2)
       ])

package/dist/TimezoneSelector.vue_vue_type_script_setup_true_lang-C-lovW-l.js

@@ -0,0 +1,62 @@
+import { defineComponent as r, computed as m, createBlock as t, openBlock as i, unref as o, withCtx as v, createElementBlock as A, Fragment as C, renderList as T } from "vue";
+import { useUIKit as d, TUISelect as E, TUIOption as K } from "@tencentcloud/uikit-base-component-vue3";
+const B = /* @__PURE__ */ r({
+  __name: "TimezoneSelector",
+  props: {
+    modelValue: {}
+  },
+  emits: ["update:modelValue"],
+  setup(c, { emit: l }) {
+    const n = l, { t: y } = d(), s = [
+      { offset: "UTC-12:00", cityKey: "Baker Island", cityEn: "Baker Island", value: "Etc/GMT+12" },
+      { offset: "UTC-11:00", cityKey: "Samoa", cityEn: "Samoa", value: "Pacific/Samoa" },
+      { offset: "UTC-10:00", cityKey: "Hawaii", cityEn: "Hawaii", value: "Pacific/Honolulu" },
+      { offset: "UTC-09:00", cityKey: "Alaska", cityEn: "Alaska", value: "America/Anchorage" },
+      { offset: "UTC-08:00", cityKey: "Los Angeles", cityEn: "Los Angeles", value: "America/Los_Angeles" },
+      { offset: "UTC-07:00", cityKey: "Denver", cityEn: "Denver", value: "America/Denver" },
+      { offset: "UTC-06:00", cityKey: "Chicago", cityEn: "Chicago", value: "America/Chicago" },
+      { offset: "UTC-05:00", cityKey: "New York", cityEn: "New York", value: "America/New_York" },
+      { offset: "UTC-04:00", cityKey: "Halifax", cityEn: "Halifax", value: "America/Halifax" },
+      { offset: "UTC-03:00", cityKey: "Buenos Aires", cityEn: "Buenos Aires", value: "America/Argentina/Buenos_Aires" },
+      { offset: "UTC-02:00", cityKey: "Mid-Atlantic", cityEn: "Mid-Atlantic", value: "Etc/GMT+2" },
+      { offset: "UTC-01:00", cityKey: "Azores", cityEn: "Azores", value: "Atlantic/Azores" },
+      { offset: "UTC+00:00", cityKey: "London", cityEn: "London", value: "Europe/London" },
+      { offset: "UTC+01:00", cityKey: "Berlin", cityEn: "Berlin", value: "Europe/Berlin" },
+      { offset: "UTC+02:00", cityKey: "Cairo", cityEn: "Cairo", value: "Africa/Cairo" },
+      { offset: "UTC+03:00", cityKey: "Moscow", cityEn: "Moscow", value: "Europe/Moscow" },
+      { offset: "UTC+04:00", cityKey: "Dubai", cityEn: "Dubai", value: "Asia/Dubai" },
+      { offset: "UTC+05:00", cityKey: "Karachi", cityEn: "Karachi", value: "Asia/Karachi" },
+      { offset: "UTC+05:30", cityKey: "Mumbai", cityEn: "Mumbai", value: "Asia/Kolkata" },
+      { offset: "UTC+06:00", cityKey: "Dhaka", cityEn: "Dhaka", value: "Asia/Dhaka" },
+      { offset: "UTC+07:00", cityKey: "Bangkok", cityEn: "Bangkok", value: "Asia/Bangkok" },
+      { offset: "UTC+08:00", cityKey: "Beijing", cityEn: "Beijing", value: "Asia/Shanghai" },
+      { offset: "UTC+09:00", cityKey: "Tokyo", cityEn: "Tokyo", value: "Asia/Tokyo" },
+      { offset: "UTC+10:00", cityKey: "Sydney", cityEn: "Sydney", value: "Australia/Sydney" },
+      { offset: "UTC+11:00", cityKey: "Solomon Islands", cityEn: "Solomon Islands", value: "Pacific/Guadalcanal" },
+      { offset: "UTC+12:00", cityKey: "Auckland", cityEn: "Auckland", value: "Pacific/Auckland" }
+    ], u = m(
+      () => s.map((e) => ({
+        label: `${e.offset} (${y(e.cityKey)})`,
+        value: e.value
+      }))
+    ), f = (e) => {
+      n("update:modelValue", e);
+    };
+    return (e, U) => (i(), t(o(E), {
+      "model-value": c.modelValue,
+      "onUpdate:modelValue": f
+    }, {
+      default: v(() => [
+        (i(!0), A(C, null, T(u.value, (a) => (i(), t(o(K), {
+          key: a.value,
+          value: a.value,
+          label: a.label
+        }, null, 8, ["value", "label"]))), 128))
+      ]),
+      _: 1
+    }, 8, ["model-value"]));
+  }
+});
+export {
+  B as _
+};

package/dist/baseComp/AudioIcon.js

@@ -1,7 +1,7 @@
-import { defineComponent as n, computed as c, createElementBlock as u, openBlock as o, normalizeClass as d, createElementVNode as s, createBlock as t, normalizeStyle as r, unref as a } from "vue";
+import { defineComponent as l, computed as n, createElementBlock as u, openBlock as o, normalizeClass as d, createElementVNode as s, createBlock as t, normalizeStyle as r, unref as a } from "vue";
 import { IconMicOff as m, IconMicOn as p } from "@tencentcloud/uikit-base-component-vue3";
 import { _ as f } from "../_plugin-vue_export-helper-CHgC5LLL.js";
-const _ = { class: "audio-level-container" }, v = /* @__PURE__ */ n({
+const _ = { class: "audio-level-container" }, v = /* @__PURE__ */ l({
   __name: "AudioIcon",
   props: {
     userId: {},
@@ -11,28 +11,28 @@ const _ = { class: "audio-level-container" }, v = /* @__PURE__ */ n({
     isDisabled: { type: Boolean }
   },
   setup(i) {
-    const e = i, l = c(() => e.isMuted || !e.audioVolume ? "" : `height: ${e.audioVolume * 4}%`);
+    const e = i, c = n(() => e.isMuted || !e.audioVolume ? "" : `height: ${e.audioVolume * 4}%`);
     return (y, z) => (o(), u("div", {
       class: d(["audio-icon-container", `${i.size == "small" && "small"}`])
     }, [
       s("div", _, [
         s("div", {
           class: "audio-level",
-          style: r(l.value)
+          style: r(c.value)
         }, null, 4)
       ]),
       e.isMuted ? (o(), t(a(m), {
         key: 0,
         class: "audio-icon",
-        size: "24"
+        size: 24
       })) : (o(), t(a(p), {
         key: 1,
         class: "audio-icon",
-        size: "24"
+        size: 24
       }))
     ], 2));
   }
-}), M = /* @__PURE__ */ f(v, [["__scopeId", "data-v-1854d402"]]);
+}), M = /* @__PURE__ */ f(v, [["__scopeId", "data-v-c24e5d05"]]);
 export {
   M as default
 };

package/dist/baseComp/Input/InputH5.vue.d.ts

@@ -49,9 +49,9 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
     type: string;
-    placeholder: string;
     disabled: boolean;
     modelValue: string;
+    placeholder: string;
     enterkeyhint: string;
     maxlength: string;
     border: boolean;

package/dist/baseComp/Input/InputPC.vue.d.ts

@@ -49,9 +49,9 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
     type: string;
-    placeholder: string;
     disabled: boolean;
     modelValue: string;
+    placeholder: string;
     enterkeyhint: string;
     maxlength: string;
     border: boolean;

package/dist/baseComp/Input/InputWX.vue.d.ts

@@ -49,9 +49,9 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
     type: string;
-    placeholder: string;
     disabled: boolean;
     modelValue: string;
+    placeholder: string;
     enterkeyhint: string;
     maxlength: string;
     border: boolean;

package/dist/baseComp/Input/index.d.ts

@@ -7,10 +7,6 @@ declare const Input: {
             type: import('vue').PropType<string>;
             default: string;
         };
-        placeholder: {
-            type: import('vue').PropType<string>;
-            default: string;
-        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -23,6 +19,10 @@ declare const Input: {
             required: true;
             default: string;
         };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: string;
+        };
         readonly: {
             type: import('vue').PropType<boolean>;
         };
@@ -56,9 +56,9 @@ declare const Input: {
         "update:modelValue": (...args: any[]) => void;
     }, import('vue').PublicProps, {
         type: string;
-        placeholder: string;
         disabled: boolean;
         modelValue: string;
+        placeholder: string;
         enterkeyhint: string;
         maxlength: string;
         border: boolean;
@@ -78,10 +78,6 @@ declare const Input: {
             type: import('vue').PropType<string>;
             default: string;
         };
-        placeholder: {
-            type: import('vue').PropType<string>;
-            default: string;
-        };
         disabled: {
             type: import('vue').PropType<boolean>;
             default: boolean;
@@ -94,6 +90,10 @@ declare const Input: {
             required: true;
             default: string;
         };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: string;
+        };
         readonly: {
             type: import('vue').PropType<boolean>;
         };
@@ -121,9 +121,9 @@ declare const Input: {
         "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     }>, {}, {}, {}, {}, {
         type: string;
-        placeholder: string;
         disabled: boolean;
         modelValue: string;
+        placeholder: string;
         enterkeyhint: string;
         maxlength: string;
         border: boolean;
@@ -140,10 +140,6 @@ declare const Input: {
         type: import('vue').PropType<string>;
         default: string;
     };
-    placeholder: {
-        type: import('vue').PropType<string>;
-        default: string;
-    };
     disabled: {
         type: import('vue').PropType<boolean>;
         default: boolean;
@@ -156,6 +152,10 @@ declare const Input: {
         required: true;
         default: string;
     };
+    placeholder: {
+        type: import('vue').PropType<string>;
+        default: string;
+    };
     readonly: {
         type: import('vue').PropType<boolean>;
     };
@@ -189,9 +189,9 @@ declare const Input: {
     "update:modelValue": (...args: any[]) => void;
 }, string, {
     type: string;
-    placeholder: string;
     disabled: boolean;
     modelValue: string;
+    placeholder: string;
     enterkeyhint: string;
     maxlength: string;
     border: boolean;

package/dist/changeNameCardDialog.vue_vue_type_script_setup_true_lang-a4FmKskP.js

@@ -0,0 +1,41 @@
+import { defineComponent as f, ref as l, computed as p, createBlock as d, openBlock as C, unref as e, withCtx as v, createVNode as I } from "vue";
+import { useUIKit as h, TUIDialog as x, TUIInput as N } from "@tencentcloud/uikit-base-component-vue3";
+const b = /* @__PURE__ */ f({
+  __name: "changeNameCardDialog",
+  props: {
+    userInfo: {},
+    confirmFunction: { type: Function }
+  },
+  setup(c) {
+    const n = c, { t: a } = h(), t = l(n.userInfo.nameCard || n.userInfo.userName || ""), o = l(!0), s = p(() => !t.value.trim());
+    async function u() {
+      await n.confirmFunction(t.value), o.value = !1;
+    }
+    function i() {
+      t.value = n.userInfo.nameCard || n.userInfo.userName || "", o.value = !1;
+    }
+    return (g, r) => (C(), d(e(x), {
+      visible: o.value,
+      title: e(a)("ParticipantList.ChangeName"),
+      confirmDisabled: s.value,
+      "cancel-text": e(a)("ParticipantList.Cancel"),
+      "confirm-text": e(a)("ParticipantList.Confirm"),
+      onConfirm: u,
+      onCancel: i,
+      onClose: i
+    }, {
+      default: v(() => [
+        I(e(N), {
+          "model-value": t.value,
+          class: "dialog-input",
+          placeholder: e(a)("ParticipantList.InputUserName"),
+          onInput: r[0] || (r[0] = (m) => t.value = m)
+        }, null, 8, ["model-value", "placeholder"])
+      ]),
+      _: 1
+    }, 8, ["visible", "title", "confirmDisabled", "cancel-text", "confirm-text"]));
+  }
+});
+export {
+  b as _
+};