tuikit-atomicx-vue3 3.4.1 → 3.5.0-beta.7

package/dist/components/LiveList/LiveList.js

@@ -1,8 +1,8 @@
-import { defineComponent as A, useCssVars as F, ref as n, computed as g, watch as W, createElementBlock as a, createCommentVNode as d, unref as o, openBlock as r, createElementVNode as t, Fragment as D, renderList as G, createVNode as L, toDisplayString as c } from "vue";
+import { defineComponent as A, useCssVars as F, ref as n, computed as g, watch as E, createElementBlock as a, createCommentVNode as d, unref as o, openBlock as r, createElementVNode as t, Fragment as D, renderList as G, createVNode as L, toDisplayString as c } from "vue";
 import { useUIKit as T, IconLiveCoverHeader as q, IconNoLiveRoom as K } from "@tencentcloud/uikit-base-component-vue3";
-import { useLiveState as P } from "../../states/LiveState/index.js";
-import { useLoginState as Y } from "../../states/LoginState.js";
-import j from "../Avatar/Avatar.js";
+import { useLoginState as P } from "../../states/LoginState.js";
+import Y from "../Avatar/Avatar.js";
+import { useLiveListState as j } from "../../states/LiveListState/LiveListState.js";
 import { _ as J } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
 const Q = {
   key: 0,
@@ -19,7 +19,7 @@ const Q = {
 }, ve = {
   key: 1,
   class: "loading"
-}, M = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png", ue = /* @__PURE__ */ A({
+}, W = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png", ue = /* @__PURE__ */ A({
   __name: "LiveList",
   props: {
     columnCount: {
@@ -28,31 +28,31 @@ const Q = {
     }
   },
   emits: ["live-room-click"],
-  setup($, { emit: b }) {
+  setup(M, { emit: $ }) {
     F((e) => ({
-      v00e247a4: w.value,
-      v735e0d4a: N.value,
-      v4f04a082: I.value,
-      v56719468: R.value,
-      v5df1fec5: _.value
+      v54b2dea1: w.value,
+      v2af4bc06: b.value,
+      v27d9fbac: I.value,
+      v7d82ded5: R.value,
+      v190a01f8: _.value
     }));
-    const { liveList: m, currentCursor: h, fetchLiveList: C } = P(), { loginUserInfo: k } = Y(), { t: u } = T(), y = $, v = n(null), p = n(null), i = n(!1), x = g(() => h.value !== ""), w = n("356px"), I = n("270px"), R = n("356px"), _ = n("210px"), N = n("20px"), V = g(() => x.value && !i.value), E = g(() => V.value && !v.value);
-    W(
+    const { liveList: m, liveListCursor: h, fetchLiveList: C } = j(), { loginUserInfo: k } = P(), { t: u } = T(), y = M, v = n(null), p = n(null), i = n(!1), x = g(() => h.value !== ""), w = n("356px"), I = n("270px"), R = n("356px"), _ = n("210px"), b = n("20px"), N = g(() => x.value && !i.value), V = g(() => N.value && !v.value);
+    E(
       k,
       async (e) => {
         e && e.userId && (i.value = !0, h.value = "", m.value.length = 0, await C({}), i.value = !1);
       },
       { immediate: !0 }
-    ), W(p, () => {
+    ), E(p, () => {
       if (p.value && screen.width > screen.height) {
         const { width: e } = p.value.getBoundingClientRect();
         let s = 20;
-        e <= 1e3 ? s = 12 : s = 20, N.value = `${s}px`;
+        e <= 1e3 ? s = 12 : s = 20, b.value = `${s}px`;
         const l = s * (y.columnCount - 1), f = (e - l) / y.columnCount;
         R.value = `${f}px`, _.value = `${f * 0.6}px`, w.value = `${f}px`, I.value = `${_.value + 52}px`;
       }
     });
-    const H = b;
+    const H = $;
     function S(e) {
       console.log("liveRoomClick,liveInfo:", e), H("live-room-click", e);
     }
@@ -60,7 +60,7 @@ const Q = {
       return v.value ? v.value.scrollTop + v.value.clientHeight >= v.value.scrollHeight - e : !1;
     }
     function z(e) {
-      v.value && e.deltaY > 0 && U() && V.value && B();
+      v.value && e.deltaY > 0 && U() && N.value && B();
     }
     async function B() {
       if (!(!x.value || i.value))
@@ -72,7 +72,7 @@ const Q = {
     }
     function O(e) {
       const s = e.target;
-      s && (s.src = M);
+      s && (s.src = W);
     }
     return (e, s) => o(k) ? (r(), a("div", Q, [
       o(m).length > 0 ? (r(), a("div", {
@@ -105,14 +105,14 @@ const Q = {
               ]),
               s[0] || (s[0] = t("div", { class: "gradient" }, null, -1)),
               t("img", {
-                src: l.coverUrl || M,
+                src: l.coverUrl || W,
                 alt: "",
                 onError: O
               }, null, 40, se)
             ]),
             t("span", le, c(l.liveName), 1),
             t("div", ie, [
-              L(o(j), {
+              L(o(Y), {
                 src: l.liveOwner.avatarUrl,
                 size: 20,
                 style: { border: "1px solid var(--uikit-color-white-7)" }
@@ -125,13 +125,13 @@ const Q = {
         L(o(K), { size: 60 }),
         t("span", null, c(o(u)("No Live")), 1)
       ])),
-      o(m).length > 0 && (E.value || i.value) ? (r(), a("div", re, [
-        E.value ? (r(), a("span", ce, c(o(u)("Load More")), 1)) : d("", !0),
+      o(m).length > 0 && (V.value || i.value) ? (r(), a("div", re, [
+        V.value ? (r(), a("span", ce, c(o(u)("Load More")), 1)) : d("", !0),
         i.value ? (r(), a("span", ve, c(o(u)("Loading...")), 1)) : d("", !0)
       ])) : d("", !0)
     ])) : d("", !0);
   }
-}), ge = /* @__PURE__ */ J(ue, [["__scopeId", "data-v-1ee7a26b"]]);
+}), ge = /* @__PURE__ */ J(ue, [["__scopeId", "data-v-9ca7b189"]]);
 export {
   ge as default
 };

package/dist/components/LiveList/LiveListH5.js

@@ -1,9 +1,9 @@
-import { defineComponent as V, useCssVars as H, ref as h, computed as S, watch as C, onMounted as b, onUnmounted as z, createElementBlock as r, createCommentVNode as m, unref as t, openBlock as a, createVNode as _, withCtx as O, createElementVNode as s, Fragment as B, renderList as W, toDisplayString as c } from "vue";
+import { defineComponent as V, useCssVars as H, ref as h, computed as S, watch as C, onMounted as z, onUnmounted as O, createElementBlock as r, createCommentVNode as m, unref as t, openBlock as a, createVNode as f, withCtx as b, createElementVNode as s, Fragment as B, renderList as W, toDisplayString as c } from "vue";
 import { useUIKit as $, IconLiveCoverHeader as A, IconNoLiveRoom as D } from "@tencentcloud/uikit-base-component-vue3";
-import { useLiveState as F } from "../../states/LiveState/index.js";
-import { useLoginState as P } from "../../states/LoginState.js";
-import T from "../Avatar/Avatar.js";
-import q from "./pullToRefresh.js";
+import { useLoginState as F } from "../../states/LoginState.js";
+import P from "../Avatar/Avatar.js";
+import T from "./pullToRefresh.js";
+import { useLiveListState as q } from "../../states/LiveListState/LiveListState.js";
 import { _ as K } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
 const j = {
   key: 0,
@@ -14,33 +14,33 @@ const j = {
 }, le = {
   key: 1,
   class: "no-live"
-}, ne = {
+}, ie = {
   key: 2,
   class: "bottom-text"
-}, ie = { key: 0 }, x = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png", re = /* @__PURE__ */ V({
+}, ne = { key: 0 }, x = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png", re = /* @__PURE__ */ V({
   __name: "LiveListH5",
   emits: ["live-room-click"],
   setup(ae, { emit: I }) {
     H((e) => ({
-      v20d56f10: w.value,
-      v2d766696: k.value
+      v33228d44: w.value,
+      v17602169: k.value
     }));
-    const { liveList: v, currentCursor: f, fetchLiveList: p } = F(), { loginUserInfo: g } = P(), { t: n } = $(), d = h([]), i = h(null), l = h(!1), L = S(() => f.value !== ""), w = h("168px"), k = h("262px"), R = I;
+    const { liveList: v, liveListCursor: _, fetchLiveList: p } = q(), { loginUserInfo: g } = F(), { t: i } = $(), d = h([]), n = h(null), l = h(!1), L = S(() => _.value !== ""), w = h("168px"), k = h("262px"), R = I;
     C(
       g,
       async (e) => {
-        e && e.userId && (l.value = !0, f.value = "", v.value.length = 0, await p({}), d.value = v.value.slice(), l.value = !1);
+        e && e.userId && (l.value = !0, _.value = "", v.value.length = 0, await p({}), d.value = v.value.slice(), l.value = !1);
       },
       { immediate: !0 }
-    ), C(i, () => {
-      if (i.value && screen.width < screen.height) {
-        const { width: e } = i.value.getBoundingClientRect(), u = 10 * 2 + 5, o = (e - u) / 2, y = o * 1.6;
+    ), C(n, () => {
+      if (n.value && screen.width < screen.height) {
+        const { width: e } = n.value.getBoundingClientRect(), u = 10 * 2 + 5, o = (e - u) / 2, y = o * 1.6;
         w.value = `${o}px`, k.value = `${y}px`;
       }
     });
     async function E(e) {
       try {
-        l.value = !0, f.value = "", v.value.length = 0, await p({}), d.value = v.value.slice(), l.value = !1, e(!0);
+        l.value = !0, _.value = "", v.value.length = 0, await p({}), d.value = v.value.slice(), l.value = !1, e(!0);
       } catch {
         e(!1);
       }
@@ -51,7 +51,7 @@ const j = {
     async function M() {
       if (!(!L.value || l.value))
         try {
-          l.value = !0, await p({ cursor: f.value }), d.value = v.value.slice();
+          l.value = !0, await p({ cursor: _.value }), d.value = v.value.slice();
         } finally {
           l.value = !1;
         }
@@ -60,29 +60,29 @@ const j = {
       const u = e.target;
       u && (u.src = x);
     }
-    return b(() => {
-      i.value && i.value.addEventListener("scroll", handleScroll);
-    }), z(() => {
-      i.value && i.value.removeEventListener("scroll", handleScroll);
+    return z(() => {
+      n.value && n.value.addEventListener("scroll", handleScroll);
+    }), O(() => {
+      n.value && n.value.removeEventListener("scroll", handleScroll);
     }), (e, u) => t(g) ? (a(), r("div", j, [
       d.value.length > 0 ? (a(), r("div", {
         key: 0,
         ref_key: "scrollContainerRef",
-        ref: i,
+        ref: n,
         class: "live-list"
       }, [
-        _(q, {
+        f(T, {
           text: {
-            pull: t(n)("Pull to refresh"),
-            release: t(n)("Release to refresh"),
-            loading: t(n)("Loading"),
-            success: t(n)("Refresh success"),
-            error: t(n)("Refresh failed")
+            pull: t(i)("Pull to refresh"),
+            release: t(i)("Release to refresh"),
+            loading: t(i)("Loading"),
+            success: t(i)("Refresh success"),
+            error: t(i)("Refresh failed")
           },
           onRefresh: E,
           onLoadMore: M
         }, {
-          default: O(() => [
+          default: b(() => [
             s("div", G, [
               (a(!0), r(B, null, W(d.value, (o) => (a(), r("div", {
                 key: o.liveId,
@@ -91,9 +91,9 @@ const j = {
               }, [
                 s("div", Q, [
                   s("div", X, [
-                    _(t(A), { size: 10 }),
+                    f(t(A), { size: 10 }),
                     s("span", Y, c(o.currentViewerCount || 0), 1),
-                    s("span", null, c(t(n)("people watched")), 1)
+                    s("span", null, c(t(i)("people watched")), 1)
                   ]),
                   s("img", {
                     src: o.coverUrl || x,
@@ -103,7 +103,7 @@ const j = {
                 ]),
                 s("span", ee, c(o.liveName), 1),
                 s("div", te, [
-                  _(t(T), {
+                  f(t(P), {
                     src: o.liveOwner.avatarUrl,
                     size: 16,
                     style: { border: "1px solid var(--uikit-color-white-7)" }
@@ -113,21 +113,21 @@ const j = {
               ], 8, J))), 128))
             ]),
             L.value ? m("", !0) : (a(), r("div", se, [
-              s("span", null, c(t(n)("No More")), 1)
+              s("span", null, c(t(i)("No More")), 1)
             ]))
           ]),
           _: 1
         }, 8, ["text"])
       ], 512)) : l.value ? m("", !0) : (a(), r("div", le, [
-        _(t(D), { size: 60 }),
-        s("span", null, c(t(n)("No Live")), 1)
+        f(t(D), { size: 60 }),
+        s("span", null, c(t(i)("No Live")), 1)
       ])),
-      t(v).length > 0 && l.value ? (a(), r("div", ne, [
-        l.value ? (a(), r("span", ie, c(t(n)("Loading...")), 1)) : m("", !0)
+      t(v).length > 0 && l.value ? (a(), r("div", ie, [
+        l.value ? (a(), r("span", ne, c(t(i)("Loading...")), 1)) : m("", !0)
       ])) : m("", !0)
     ])) : m("", !0);
   }
-}), _e = /* @__PURE__ */ K(re, [["__scopeId", "data-v-95ecffcb"]]);
+}), fe = /* @__PURE__ */ K(re, [["__scopeId", "data-v-7cf5c962"]]);
 export {
-  _e as default
+  fe as default
 };

package/dist/components/LiveScenePanel/CameraSettingDialog.js

@@ -1,10 +1,10 @@
 import { defineComponent as Q, computed as R, ref as C, watch as U, onMounted as W, onBeforeUnmount as X, createBlock as V, openBlock as v, unref as d, withCtx as I, createElementVNode as u, createVNode as b, toDisplayString as E, createElementBlock as F, Fragment as N, renderList as k } from "vue";
-import { useDeviceState as Y } from "../../states/DeviceState.js";
-import { TRTCCloud as Z, TRTCVideoResolution as T, TRTCVideoMirrorType as n, TRTCVideoFillMode as L, TRTCVideoRotation as B } from "@tencentcloud/tuiroom-engine-js";
-import { useUIKit as $, TUIDialog as ee, TUISelect as A, TUIOption as O } from "@tencentcloud/uikit-base-component-vue3";
-import ae from "../../baseComp/SvgIcon.js";
-import oe from "./icons/CameraMirror.js";
-import re from "./icons/CameraUnmirror.js";
+import { TRTCCloud as Y, TRTCVideoResolution as T, TRTCVideoMirrorType as n, TRTCVideoFillMode as L, TRTCVideoRotation as B } from "@tencentcloud/tuiroom-engine-js";
+import { useUIKit as Z, TUIDialog as $, TUISelect as A, TUIOption as O } from "@tencentcloud/uikit-base-component-vue3";
+import ee from "../../baseComp/SvgIcon.js";
+import ae from "./icons/CameraMirror.js";
+import oe from "./icons/CameraUnmirror.js";
+import { useDeviceState as re } from "../../states/DeviceState/DeviceState.js";
 import { _ as ie } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
 const le = { class: "basic-setting" }, te = { class: "item-setting" }, ne = { class: "title" }, de = { class: "item-setting" }, se = { class: "title" }, ue = /* @__PURE__ */ Q({
   __name: "CameraSettingDialog",
@@ -14,7 +14,7 @@ const le = { class: "basic-setting" }, te = { class: "item-setting" }, ne = { cl
   emits: ["addCameraMaterial", "updateCameraMaterial", "close"],
   setup(P, { emit: j }) {
     var g, D, S, w, x;
-    const t = new Z(), { t: c } = $(), { cameraList: l } = Y(), i = P, p = j, K = R(() => i.mediaSource ? c("Update Camera") : c("Add Camera")), q = R(() => i.mediaSource ? c("Update Camera") : c("Add Camera")), r = C(((g = i.mediaSource) == null ? void 0 : g.camera.cameraId) || ((D = l.value[0]) == null ? void 0 : D.deviceId)), m = C(((S = i.mediaSource) == null ? void 0 : S.camera.resolution) || T.TRTCVideoResolution_1280_720), y = C((w = i.mediaSource) == null ? void 0 : w.camera.fps), s = C(
+    const t = new Y(), { t: c } = Z(), { cameraList: l } = re(), i = P, p = j, K = R(() => i.mediaSource ? c("Update Camera") : c("Add Camera")), q = R(() => i.mediaSource ? c("Update Camera") : c("Add Camera")), r = C(((g = i.mediaSource) == null ? void 0 : g.camera.cameraId) || ((D = l.value[0]) == null ? void 0 : D.deviceId)), m = C(((S = i.mediaSource) == null ? void 0 : S.camera.resolution) || T.TRTCVideoResolution_1280_720), y = C((w = i.mediaSource) == null ? void 0 : w.camera.fps), s = C(
       ((x = i.mediaSource) == null ? void 0 : x.camera.mirror) === n.TRTCVideoMirrorType_Enable || !0
     ), z = R(() => [
       { label: "640x360", value: T.TRTCVideoResolution_640_360 },
@@ -82,7 +82,7 @@ const le = { class: "basic-setting" }, te = { class: "item-setting" }, ne = { cl
     }, M = () => {
       p("close");
     };
-    return (a, e) => (v(), V(d(ee), {
+    return (a, e) => (v(), V(d($), {
       visible: !0,
       width: "600px",
       confirmText: q.value,
@@ -138,8 +138,8 @@ const le = { class: "basic-setting" }, te = { class: "item-setting" }, ne = { cl
             class: "mirror-container",
             onClick: H
           }, [
-            b(ae, {
-              icon: s.value ? oe : re
+            b(ee, {
+              icon: s.value ? ae : oe
             }, null, 8, ["icon"])
           ])
         ])

package/dist/components/LiveScenePanel/MaterialItem.js

@@ -1,14 +1,14 @@
 import { defineComponent as N, ref as L, createElementBlock as d, openBlock as l, normalizeClass as U, unref as u, createBlock as z, createElementVNode as n, resolveDynamicComponent as F, toDisplayString as v, withModifiers as T, createVNode as g, createCommentVNode as K, Fragment as $, renderList as j } from "vue";
 import { TRTCVideoMirrorType as M, TRTCMediaSourceType as c } from "@tencentcloud/tuiroom-engine-js";
 import { useUIKit as q, IconEdit as A, IconDelIcon as G, IconSetting as H } from "@tencentcloud/uikit-base-component-vue3";
-import { useVideoMixerState as J } from "../../states/VideoMixerState.js";
-import O from "../../baseComp/SvgIcon.js";
-import P from "./icons/CameraMirror.js";
-import Q from "./icons/CameraUnmirror.js";
-import W from "./icons/ImageIcon.js";
-import X from "./icons/ScreenIcon.js";
-import Y from "./icons/MoreIcon.js";
-import Z from "./icons/CameraIcon.js";
+import J from "../../baseComp/SvgIcon.js";
+import O from "./icons/CameraMirror.js";
+import P from "./icons/CameraUnmirror.js";
+import Q from "./icons/ImageIcon.js";
+import W from "./icons/ScreenIcon.js";
+import X from "./icons/MoreIcon.js";
+import Y from "./icons/CameraIcon.js";
+import { useVideoMixerState as Z } from "../../states/VideoMixerState/VideoMixerState.js";
 import { _ as ee } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
 const oe = { class: "material-info" }, te = { class: "material-name" }, re = { class: "material-controls" }, ae = ["title"], ne = ["title"], ie = ["onClick"], le = { class: "dropdown-label" }, ce = /* @__PURE__ */ N({
   __name: "MaterialItem",
@@ -17,7 +17,7 @@ const oe = { class: "material-info" }, te = { class: "material-name" }, re = { c
   },
   emits: ["cameraSetting", "rename"],
   setup(r, { emit: y }) {
-    const { t: i } = q(), s = r, p = y, { updateMediaSource: C, removeMediaSource: h, activeMediaSource: S } = J(), a = L(!1);
+    const { t: i } = q(), s = r, p = y, { updateMediaSource: C, removeMediaSource: h, activeMediaSource: S } = Z(), a = L(!1);
     let m = null;
     function I() {
       var t;
@@ -39,9 +39,9 @@ const oe = { class: "material-info" }, te = { class: "material-name" }, re = { c
     }, b = () => {
       console.log("切换镜像:", s.material);
     }, w = (e) => ({
-      [c.kCamera]: Z,
-      [c.kImage]: W,
-      [c.kScreen]: X
+      [c.kCamera]: Y,
+      [c.kImage]: Q,
+      [c.kScreen]: W
     })[e], V = (e) => {
       p("rename", e);
     }, D = (e) => {
@@ -93,9 +93,9 @@ const oe = { class: "material-info" }, te = { class: "material-name" }, re = { c
           onClick: T(b, ["stop"]),
           title: u(i)("Mirror")
         }, [
-          g(O, {
+          g(J, {
             onClick: I,
-            icon: r.material.layout.mirror === u(M).TRTCVideoMirrorType_Enable ? P : Q
+            icon: r.material.layout.mirror === u(M).TRTCVideoMirrorType_Enable ? O : P
           }, null, 8, ["icon"])
         ], 8, ae),
         n("div", {
@@ -104,7 +104,7 @@ const oe = { class: "material-info" }, te = { class: "material-name" }, re = { c
           onMouseleave: f,
           title: u(i)("More")
         }, [
-          g(Y),
+          g(X),
           a.value ? (l(), d("div", {
             key: 0,
             class: "dropdown-menu",

package/dist/components/LiveScenePanel/index.js

@@ -5,10 +5,10 @@ import { useUIKit as se, TUIToast as $, TOAST_TYPE as x } from "@tencentcloud/ui
 import ce from "./CameraSettingDialog.js";
 import { _ as de } from "../../MaterialRenameDialog.vue_vue_type_script_setup_true_lang-C8oUv-KF.js";
 import me from "./MaterialItem.js";
-import { useVideoMixerState as ue } from "../../states/VideoMixerState.js";
-import { useDeviceState as pe } from "../../states/DeviceState.js";
-import { useLiveState as ge } from "../../states/LiveState/index.js";
 import { getNanoId as d } from "../../utils/utils.js";
+import { useVideoMixerState as ue } from "../../states/VideoMixerState/VideoMixerState.js";
+import { useDeviceState as pe } from "../../states/DeviceState/DeviceState.js";
+import { useLiveListState as ge } from "../../states/LiveListState/LiveListState.js";
 import { LiveOrientation as C } from "../../types/live.js";
 import { _ as fe } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
 import { addI18n as N } from "../../i18n/index.js";
@@ -183,7 +183,7 @@ const ye = { class: "materials-list" }, ke = /* @__PURE__ */ J({
       }, null, 8, ["material"])) : b("", !0)
     ], 2));
   }
-}), ze = /* @__PURE__ */ fe(ke, [["__scopeId", "data-v-e1c7a80b"]]);
+}), ze = /* @__PURE__ */ fe(ke, [["__scopeId", "data-v-571e9fbf"]]);
 N("en-US", { translation: he });
 N("zh-CN", { translation: ve });
 export {