tuikit-atomicx-vue3 3.3.4 → 3.4.1

package/dist/components/LiveList/LiveList.js

@@ -1,193 +1,137 @@
-import { defineComponent, useCssVars, ref, computed, watch, createElementBlock, createCommentVNode, unref, openBlock, createElementVNode, Fragment, renderList, createVNode, toDisplayString } from "vue";
-import { useUIKit, IconLiveCoverHeader, IconNoLiveRoom } from "@tencentcloud/uikit-base-component-vue3";
-import { useLiveState } from "../../states/LiveState/index.js";
-import { useLoginState } from "../../states/LoginState.js";
-import Avatar from "../Avatar/Avatar.js";
-import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
-const _hoisted_1 = {
+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 { 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 { _ as J } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const Q = {
   key: 0,
   class: "live-list-panel"
-};
-const _hoisted_2 = ["onClick"];
-const _hoisted_3 = { class: "live-room-cover" };
-const _hoisted_4 = { class: "header" };
-const _hoisted_5 = { class: "left" };
-const _hoisted_6 = { class: "right" };
-const _hoisted_7 = ["src"];
-const _hoisted_8 = { class: "live-name" };
-const _hoisted_9 = { class: "owner-info" };
-const _hoisted_10 = { class: "owner-name" };
-const _hoisted_11 = {
-  key: 0,
-  class: "bottom-text-no-more"
-};
-const _hoisted_12 = {
+}, X = ["onClick"], Z = { class: "live-room-cover" }, ee = { class: "header" }, te = { class: "left" }, oe = { class: "right" }, se = ["src"], le = { class: "live-name" }, ie = { class: "owner-info" }, ne = { class: "owner-name" }, ae = {
   key: 1,
   class: "no-live"
-};
-const _hoisted_13 = {
+}, re = {
   key: 2,
   class: "bottom-text"
-};
-const _hoisted_14 = {
+}, ce = {
   key: 0,
   class: "load-more-lives"
-};
-const _hoisted_15 = {
+}, ve = {
   key: 1,
   class: "loading"
-};
-const DEFAULT_COVER = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png";
-const columnCount = 5;
-const _sfc_main = /* @__PURE__ */ defineComponent({
+}, M = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png", ue = /* @__PURE__ */ A({
   __name: "LiveList",
+  props: {
+    columnCount: {
+      type: Number,
+      default: 5
+    }
+  },
   emits: ["live-room-click"],
-  setup(__props, { emit: __emit }) {
-    useCssVars((_ctx) => ({
-      "ffe37efa": liveItemWidth.value,
-      "67ead60a": liveItemHeight.value,
-      "8528cf9a": coverWidth.value,
-      "538f174c": coverHeight.value
+  setup($, { emit: b }) {
+    F((e) => ({
+      v00e247a4: w.value,
+      v735e0d4a: N.value,
+      v4f04a082: I.value,
+      v56719468: R.value,
+      v5df1fec5: _.value
     }));
-    const { liveList, currentCursor, fetchLiveList } = useLiveState();
-    const { loginUserInfo } = useLoginState();
-    const { t } = useUIKit();
-    const scrollContainerRef = ref(null);
-    const liveListItemsRef = ref(null);
-    const isLoadingMore = ref(false);
-    const hasMoreLive = computed(() => currentCursor.value !== "");
-    const liveItemWidth = ref("356px");
-    const liveItemHeight = ref("270px");
-    const coverWidth = ref("356px");
-    const coverHeight = ref("210px");
-    const shouldFetchMoreLiveList = computed(() => hasMoreLive.value && !isLoadingMore.value);
-    const isShowMoreVisible = computed(() => shouldFetchMoreLiveList.value && !scrollContainerRef.value);
-    watch(
-      loginUserInfo,
-      async (user) => {
-        if (user && user.userId) {
-          isLoadingMore.value = true;
-          currentCursor.value = "";
-          liveList.value.length = 0;
-          await fetchLiveList({});
-          isLoadingMore.value = false;
-        }
+    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(
+      k,
+      async (e) => {
+        e && e.userId && (i.value = !0, h.value = "", m.value.length = 0, await C({}), i.value = !1);
       },
-      { immediate: true }
-    );
-    watch(liveListItemsRef, () => {
-      if (liveListItemsRef.value && screen.width > screen.height) {
-        const { width } = liveListItemsRef.value.getBoundingClientRect();
-        const gapWidth = 20 * (columnCount - 1);
-        const newItemWidth = (width - gapWidth) / columnCount;
-        const newItemHeight = newItemWidth * 0.75;
-        liveItemWidth.value = `${newItemWidth}px`;
-        liveItemHeight.value = `${newItemHeight}px`;
-        coverWidth.value = `${newItemWidth}px`;
-        coverHeight.value = `${newItemHeight - 52}px`;
+      { immediate: !0 }
+    ), W(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`;
+        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 emit = __emit;
-    function liveRoomClick(liveInfo) {
-      console.log("liveRoomClick,liveInfo:", liveInfo);
-      emit("live-room-click", liveInfo);
+    const H = b;
+    function S(e) {
+      console.log("liveRoomClick,liveInfo:", e), H("live-room-click", e);
     }
-    function isScrollAtBottom(threshold = 50) {
-      if (!scrollContainerRef.value) {
-        return false;
-      }
-      return scrollContainerRef.value.scrollTop + scrollContainerRef.value.clientHeight >= scrollContainerRef.value.scrollHeight - threshold;
+    function U(e = 50) {
+      return v.value ? v.value.scrollTop + v.value.clientHeight >= v.value.scrollHeight - e : !1;
     }
-    function handleWheel(event) {
-      if (!scrollContainerRef.value) {
-        return;
-      }
-      if (event.deltaY > 0 && isScrollAtBottom() && shouldFetchMoreLiveList.value) {
-        fetchMoreLives();
-      }
+    function z(e) {
+      v.value && e.deltaY > 0 && U() && V.value && B();
     }
-    async function fetchMoreLives() {
-      if (!hasMoreLive.value || isLoadingMore.value) {
-        return;
-      }
-      try {
-        isLoadingMore.value = true;
-        await fetchLiveList({ cursor: currentCursor.value });
-      } finally {
-        isLoadingMore.value = false;
-      }
+    async function B() {
+      if (!(!x.value || i.value))
+        try {
+          i.value = !0, await C({ cursor: h.value });
+        } finally {
+          i.value = !1;
+        }
     }
-    function handleCoverImageError(event) {
-      const image = event.target;
-      if (image) {
-        image.src = DEFAULT_COVER;
-      }
+    function O(e) {
+      const s = e.target;
+      s && (s.src = M);
     }
-    return (_ctx, _cache) => {
-      return unref(loginUserInfo) ? (openBlock(), createElementBlock("div", _hoisted_1, [
-        unref(liveList).length > 0 ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          ref_key: "scrollContainerRef",
-          ref: scrollContainerRef,
-          class: "live-list",
-          onWheel: handleWheel
+    return (e, s) => o(k) ? (r(), a("div", Q, [
+      o(m).length > 0 ? (r(), a("div", {
+        key: 0,
+        ref_key: "scrollContainerRef",
+        ref: v,
+        class: "live-list",
+        onWheel: z
+      }, [
+        t("div", {
+          ref_key: "liveListItemsRef",
+          ref: p,
+          class: "live-list-items"
         }, [
-          createElementVNode("div", {
-            ref_key: "liveListItemsRef",
-            ref: liveListItemsRef,
-            class: "live-list-items"
+          (r(!0), a(D, null, G(o(m), (l) => (r(), a("div", {
+            key: l.liveId,
+            class: "live-item",
+            onClick: (f) => S(l)
           }, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(liveList), (item) => {
-              return openBlock(), createElementBlock("div", {
-                key: item.liveId,
-                class: "live-item",
-                onClick: ($event) => liveRoomClick(item)
-              }, [
-                createElementVNode("div", _hoisted_3, [
-                  createElementVNode("div", _hoisted_4, [
-                    createElementVNode("div", _hoisted_5, [
-                      createVNode(unref(IconLiveCoverHeader), { size: 10 }),
-                      createElementVNode("span", null, toDisplayString(unref(t)("LIVE")), 1)
-                    ]),
-                    createElementVNode("div", _hoisted_6, [
-                      createElementVNode("span", null, toDisplayString(item.currentViewerCount || 0), 1),
-                      createElementVNode("span", null, toDisplayString(unref(t)("people have watched the live")), 1)
-                    ])
-                  ]),
-                  createElementVNode("img", {
-                    src: item.coverUrl || DEFAULT_COVER,
-                    alt: "",
-                    onError: handleCoverImageError
-                  }, null, 40, _hoisted_7)
+            t("div", Z, [
+              t("div", ee, [
+                t("div", te, [
+                  L(o(q), { size: 10 }),
+                  t("span", null, c(o(u)("LIVE")), 1)
                 ]),
-                createElementVNode("span", _hoisted_8, toDisplayString(item.liveName), 1),
-                createElementVNode("div", _hoisted_9, [
-                  createVNode(unref(Avatar), {
-                    src: item.liveOwner.avatarUrl,
-                    size: 24,
-                    style: { border: "1px solid var(--uikit-color-white-7)" }
-                  }, null, 8, ["src"]),
-                  createElementVNode("span", _hoisted_10, toDisplayString(item.liveOwner.userName || item.liveOwner.userId), 1)
+                t("div", oe, [
+                  t("span", null, c(l.currentViewerCount || 0), 1),
+                  t("span", null, c(o(u)("people watched")), 1)
                 ])
-              ], 8, _hoisted_2);
-            }), 128))
-          ], 512),
-          !hasMoreLive.value ? (openBlock(), createElementBlock("div", _hoisted_11, [
-            createElementVNode("span", null, toDisplayString(unref(t)("No More")), 1)
-          ])) : createCommentVNode("", true)
-        ], 544)) : !isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
-          createVNode(unref(IconNoLiveRoom), { size: 60 }),
-          createElementVNode("span", null, toDisplayString(unref(t)("No Live")), 1)
-        ])) : createCommentVNode("", true),
-        unref(liveList).length > 0 && (isShowMoreVisible.value || isLoadingMore.value) ? (openBlock(), createElementBlock("div", _hoisted_13, [
-          isShowMoreVisible.value ? (openBlock(), createElementBlock("span", _hoisted_14, toDisplayString(unref(t)("Load More")), 1)) : createCommentVNode("", true),
-          isLoadingMore.value ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
-        ])) : createCommentVNode("", true)
-      ])) : createCommentVNode("", true);
-    };
+              ]),
+              s[0] || (s[0] = t("div", { class: "gradient" }, null, -1)),
+              t("img", {
+                src: l.coverUrl || M,
+                alt: "",
+                onError: O
+              }, null, 40, se)
+            ]),
+            t("span", le, c(l.liveName), 1),
+            t("div", ie, [
+              L(o(j), {
+                src: l.liveOwner.avatarUrl,
+                size: 20,
+                style: { border: "1px solid var(--uikit-color-white-7)" }
+              }, null, 8, ["src"]),
+              t("span", ne, c(l.liveOwner.userName || l.liveOwner.userId), 1)
+            ])
+          ], 8, X))), 128))
+        ], 512)
+      ], 544)) : i.value ? d("", !0) : (r(), a("div", ae, [
+        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),
+        i.value ? (r(), a("span", ve, c(o(u)("Loading...")), 1)) : d("", !0)
+      ])) : d("", !0)
+    ])) : d("", !0);
   }
-});
-const LiveListPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7d3dee6f"]]);
+}), ge = /* @__PURE__ */ J(ue, [["__scopeId", "data-v-1ee7a26b"]]);
 export {
-  LiveListPC as default
+  ge as default
 };

package/dist/components/LiveList/LiveList.vue.d.ts

@@ -1,8 +1,20 @@
 import { LiveInfo } from '../../types';
 
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    columnCount: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "live-room-click": (liveInfo: LiveInfo) => void;
-}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    columnCount: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{
     "onLive-room-click"?: ((liveInfo: LiveInfo) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+}>, {
+    columnCount: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/components/LiveList/LiveListH5.js

@@ -1,193 +1,133 @@
-import { defineComponent, useCssVars, ref, computed, watch, onMounted, onUnmounted, createElementBlock, createCommentVNode, unref, openBlock, createVNode, withCtx, createElementVNode, Fragment, renderList, toDisplayString } from "vue";
-import { useUIKit, IconLiveCoverHeader, IconNoLiveRoom } from "@tencentcloud/uikit-base-component-vue3";
-import { useLiveState } from "../../states/LiveState/index.js";
-import { useLoginState } from "../../states/LoginState.js";
-import Avatar from "../Avatar/Avatar.js";
-import PullToRefresh from "./pullToRefresh.js";
-import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
-const _hoisted_1 = {
+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 { 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 { _ as K } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const j = {
   key: 0,
   class: "live-list-panel-h5"
-};
-const _hoisted_2 = { class: "live-list-items" };
-const _hoisted_3 = ["onClick"];
-const _hoisted_4 = { class: "live-room-cover" };
-const _hoisted_5 = { class: "header" };
-const _hoisted_6 = { class: "viewer-count" };
-const _hoisted_7 = ["src"];
-const _hoisted_8 = { class: "live-name" };
-const _hoisted_9 = { class: "owner-info" };
-const _hoisted_10 = { class: "owner-name" };
-const _hoisted_11 = {
+}, G = { class: "live-list-items" }, J = ["onClick"], Q = { class: "live-room-cover" }, X = { class: "header" }, Y = { class: "viewer-count" }, Z = ["src"], ee = { class: "live-name" }, te = { class: "owner-info" }, oe = { class: "owner-name" }, se = {
   key: 0,
   class: "bottom-text-no-more"
-};
-const _hoisted_12 = {
+}, le = {
   key: 1,
   class: "no-live"
-};
-const _hoisted_13 = {
+}, ne = {
   key: 2,
   class: "bottom-text"
-};
-const _hoisted_14 = { key: 0 };
-const DEFAULT_COVER = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png";
-const _sfc_main = /* @__PURE__ */ defineComponent({
+}, ie = { 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(__props, { emit: __emit }) {
-    useCssVars((_ctx) => ({
-      "0a6e1f16": liveItemWidth.value,
-      "44862458": liveItemHeight.value
+  setup(ae, { emit: I }) {
+    H((e) => ({
+      v20d56f10: w.value,
+      v2d766696: k.value
     }));
-    const { liveList, currentCursor, fetchLiveList } = useLiveState();
-    const { loginUserInfo } = useLoginState();
-    const { t } = useUIKit();
-    const showLiveList = ref([]);
-    const scrollContainerRef = ref(null);
-    const isLoadingMore = ref(false);
-    const hasMoreLive = computed(() => currentCursor.value !== "");
-    const liveItemWidth = ref("168px");
-    const liveItemHeight = ref("262px");
-    const emit = __emit;
-    watch(
-      loginUserInfo,
-      async (user) => {
-        if (user && user.userId) {
-          isLoadingMore.value = true;
-          currentCursor.value = "";
-          liveList.value.length = 0;
-          await fetchLiveList({});
-          showLiveList.value = liveList.value.slice();
-          isLoadingMore.value = false;
-        }
+    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;
+    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);
       },
-      { immediate: true }
-    );
-    watch(scrollContainerRef, () => {
-      if (scrollContainerRef.value && screen.width < screen.height) {
-        const { width } = scrollContainerRef.value.getBoundingClientRect();
-        const marginWidth = 10 * 2 + 5;
-        const newItemWidth = (width - marginWidth) / 2;
-        const newItemHeight = newItemWidth * 1.6;
-        liveItemWidth.value = `${newItemWidth}px`;
-        liveItemHeight.value = `${newItemHeight}px`;
+      { 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;
+        w.value = `${o}px`, k.value = `${y}px`;
       }
     });
-    async function handleRefresh(completeRefresh) {
+    async function E(e) {
       try {
-        isLoadingMore.value = true;
-        currentCursor.value = "";
-        liveList.value.length = 0;
-        await fetchLiveList({});
-        showLiveList.value = liveList.value.slice();
-        isLoadingMore.value = false;
-        completeRefresh(true);
-      } catch (error) {
-        completeRefresh(false);
+        l.value = !0, f.value = "", v.value.length = 0, await p({}), d.value = v.value.slice(), l.value = !1, e(!0);
+      } catch {
+        e(!1);
       }
     }
-    function liveRoomClick(liveInfo) {
-      console.log("liveRoomClick,liveInfo:", liveInfo);
-      emit("live-room-click", liveInfo);
+    function N(e) {
+      console.log("liveRoomClick,liveInfo:", e), R("live-room-click", e);
     }
-    async function fetchMoreLives() {
-      if (!hasMoreLive.value || isLoadingMore.value) {
-        return;
-      }
-      try {
-        isLoadingMore.value = true;
-        await fetchLiveList({ cursor: currentCursor.value });
-        showLiveList.value = liveList.value.slice();
-      } finally {
-        isLoadingMore.value = false;
-      }
+    async function M() {
+      if (!(!L.value || l.value))
+        try {
+          l.value = !0, await p({ cursor: f.value }), d.value = v.value.slice();
+        } finally {
+          l.value = !1;
+        }
     }
-    function handleCoverImageError(event) {
-      const image = event.target;
-      if (image) {
-        image.src = DEFAULT_COVER;
-      }
+    function U(e) {
+      const u = e.target;
+      u && (u.src = x);
     }
-    onMounted(() => {
-      if (scrollContainerRef.value) {
-        scrollContainerRef.value.addEventListener("scroll", handleScroll);
-      }
-    });
-    onUnmounted(() => {
-      if (scrollContainerRef.value) {
-        scrollContainerRef.value.removeEventListener("scroll", handleScroll);
-      }
-    });
-    return (_ctx, _cache) => {
-      return unref(loginUserInfo) ? (openBlock(), createElementBlock("div", _hoisted_1, [
-        showLiveList.value.length > 0 ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          ref_key: "scrollContainerRef",
-          ref: scrollContainerRef,
-          class: "live-list"
-        }, [
-          createVNode(PullToRefresh, {
-            text: {
-              pull: unref(t)("Pull to refresh"),
-              release: unref(t)("Release to refresh"),
-              loading: unref(t)("Loading"),
-              success: unref(t)("Refresh success"),
-              error: unref(t)("Refresh failed")
-            },
-            onRefresh: handleRefresh,
-            onLoadMore: fetchMoreLives
-          }, {
-            default: withCtx(() => [
-              createElementVNode("div", _hoisted_2, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(showLiveList.value, (item) => {
-                  return openBlock(), createElementBlock("div", {
-                    key: item.liveId,
-                    class: "live-item",
-                    onClick: ($event) => liveRoomClick(item)
-                  }, [
-                    createElementVNode("div", _hoisted_4, [
-                      createElementVNode("div", _hoisted_5, [
-                        createVNode(unref(IconLiveCoverHeader), { size: 10 }),
-                        createElementVNode("span", _hoisted_6, toDisplayString(item.currentViewerCount || 0), 1),
-                        createElementVNode("span", null, toDisplayString(unref(t)("people have watched the live")), 1)
-                      ]),
-                      createElementVNode("img", {
-                        src: item.coverUrl || DEFAULT_COVER,
-                        alt: "",
-                        onError: handleCoverImageError
-                      }, null, 40, _hoisted_7)
-                    ]),
-                    createElementVNode("span", _hoisted_8, toDisplayString(item.liveName), 1),
-                    createElementVNode("div", _hoisted_9, [
-                      createVNode(unref(Avatar), {
-                        src: item.liveOwner.avatarUrl,
-                        size: 16,
-                        style: { border: "1px solid var(--uikit-color-white-7)" }
-                      }, null, 8, ["src"]),
-                      createElementVNode("span", _hoisted_10, toDisplayString(item.liveOwner.userName || item.liveOwner.userId), 1)
-                    ])
-                  ], 8, _hoisted_3);
-                }), 128))
-              ]),
-              !hasMoreLive.value ? (openBlock(), createElementBlock("div", _hoisted_11, [
-                createElementVNode("span", null, toDisplayString(unref(t)("No More")), 1)
-              ])) : createCommentVNode("", true)
+    return b(() => {
+      i.value && i.value.addEventListener("scroll", handleScroll);
+    }), z(() => {
+      i.value && i.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,
+        class: "live-list"
+      }, [
+        _(q, {
+          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")
+          },
+          onRefresh: E,
+          onLoadMore: M
+        }, {
+          default: O(() => [
+            s("div", G, [
+              (a(!0), r(B, null, W(d.value, (o) => (a(), r("div", {
+                key: o.liveId,
+                class: "live-item",
+                onClick: (y) => N(o)
+              }, [
+                s("div", Q, [
+                  s("div", X, [
+                    _(t(A), { size: 10 }),
+                    s("span", Y, c(o.currentViewerCount || 0), 1),
+                    s("span", null, c(t(n)("people watched")), 1)
+                  ]),
+                  s("img", {
+                    src: o.coverUrl || x,
+                    alt: "",
+                    onError: U
+                  }, null, 40, Z)
+                ]),
+                s("span", ee, c(o.liveName), 1),
+                s("div", te, [
+                  _(t(T), {
+                    src: o.liveOwner.avatarUrl,
+                    size: 16,
+                    style: { border: "1px solid var(--uikit-color-white-7)" }
+                  }, null, 8, ["src"]),
+                  s("span", oe, c(o.liveOwner.userName || o.liveOwner.userId), 1)
+                ])
+              ], 8, J))), 128))
             ]),
-            _: 1
-          }, 8, ["text"])
-        ], 512)) : !isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
-          createVNode(unref(IconNoLiveRoom), { size: 60 }),
-          createElementVNode("span", null, toDisplayString(unref(t)("No Live")), 1)
-        ])) : createCommentVNode("", true),
-        unref(liveList).length > 0 && isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
-          isLoadingMore.value ? (openBlock(), createElementBlock("span", _hoisted_14, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
-        ])) : createCommentVNode("", true)
-      ])) : createCommentVNode("", true);
-    };
+            L.value ? m("", !0) : (a(), r("div", se, [
+              s("span", null, c(t(n)("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)
+      ])),
+      t(v).length > 0 && l.value ? (a(), r("div", ne, [
+        l.value ? (a(), r("span", ie, c(t(n)("Loading...")), 1)) : m("", !0)
+      ])) : m("", !0)
+    ])) : m("", !0);
   }
-});
-const LiveListH5 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-96626ee9"]]);
+}), _e = /* @__PURE__ */ K(re, [["__scopeId", "data-v-95ecffcb"]]);
 export {
-  LiveListH5 as default
+  _e as default
 };

package/dist/components/LiveList/i18n/en-US/index.d.ts

@@ -1,6 +1,6 @@
 export declare const resource: {
     LIVE: string;
-    'people have watched the live': string;
+    'people watched': string;
     'Load More': string;
     'Loading...': string;
     Loading: string;