@funhub/platform 0.1.53 → 0.1.54

package/dist/components/biz/business/profile/profile-main/utils.mjs

@@ -1,2 +1,249 @@
 
-import{gInteractionGetBrowseList as e,gInteractionGetLikeList as t}from"../../../../../service/generated/client.mjs";import n from"dayjs";const r=10,i={video:1,post:2};function a(e){if(e.cover_image)return e.cover_image;let t=``;return e.medias?.find(e=>e?(!e.is_video&&!t&&e.media_url&&(t=e.media_url),!!e.cover_image):!1)?.cover_image||t}function o(e,t){let r=e.name,i=n(t?t?.[e.content_id||``]?.create_time:e.create_time).toDate().getTime(),o=a(e);return{id:e.content_id||``,content_play_progress:{percent:0,series_num:0},detail:{user_info:{name:e.author?.nickname,avatar:e.author?.avatar},info:{name:r,content_id:e.content_id,user_id:e.user_id,content:e.content,tags:e.tags,cover_image:o,like_count:e.like_count,dislike_count:e.dislike_count,comment_count:e.comment_count,share_count:e.share_count,view_count:e.view_count,create_time:e.create_time,update_time:e.update_time,author:e.author?{user_id:e.author.user_id,username:e.author.username,nickname:e.author.nickname,avatar_url:e.author.avatar}:void 0},statics_cnt:{browse_cnt:e.view_count||0},publish_time:i,parent_content_info:{type:0}}}}function s(e,t){let r=e.is_more_link,i=n(t?t?.[e.id||``]?.create_time:e.show_at).toDate().getTime(),a=Number(e.duration??0),o=Number.isFinite(a)?Math.max(0,Math.floor(a)):0;return{id:e.id||``,content_play_progress:{percent:0,series_num:0},detail:{user_info:{name:e.source_username||e.up_user||e.director||e.actor,avatar:void 0},info:{is_more_link:r,name:e.name,content_id:e.id,content:e.description,tags:e.tags?.map(e=>e.name).filter(e=>!!e),cover_image:e.img_y||e.img_x,create_time:e.show_at,video_duration:o},statics_cnt:{browse_cnt:e.play_count||0},publish_time:i,parent_content_info:{type:0}}}}function c(e,t){let r=e.name,i=e.is_more_link,o=t[e.content_id||``].browse_time,s=n(o).toDate().getTime(),c=a(e);return{id:e.content_id||``,content_play_progress:{percent:0,series_num:0},detail:{user_info:{name:e.author?.nickname,avatar:e.author?.avatar},info:{is_more_link:i,name:r||e.content,title:r||e.content,content_id:e.content_id,user_id:e.user_id,content:e.content,tags:e.tags,cover_image:c,like_count:e.like_count,dislike_count:e.dislike_count,comment_count:e.comment_count,share_count:e.share_count,view_count:e.view_count,create_time:e.create_time,update_time:e.update_time,author:e.author?{user_id:e.author.user_id,username:e.author.username,nickname:e.author.nickname,avatar_url:e.author.avatar}:void 0},statics_cnt:{browse_cnt:e.view_count||0},publish_time:s,parent_content_info:{type:0}}}}function l(e,t){let r=e.is_more_link,i=t[e.id||``].browse_time,a=n(i).toDate().getTime(),o=Number(e.duration??0),s=Number.isFinite(o)?Math.max(0,Math.floor(o)):0,c=t[e.id||``]?.browse_duration||0,l=Number(t[e.id||``]?.browse_episode),u=0,d=0;return Number.isNaN(l)||(u=l),s&&c&&(d=Math.min(100,Math.floor(c/s*100))),{id:e.id||``,content_play_progress:{percent:d,series_num:u},detail:{user_info:{name:e.source_username||e.up_user||e.director||e.actor,avatar:void 0},info:{is_more_link:r,name:e.name,content_id:e.id,content:e.description,tags:e.tags?.map(e=>e.name).filter(e=>!!e),cover_image:e.img_y||e.img_x,create_time:e.show_at,video_duration:s},statics_cnt:{browse_cnt:e.play_count||0},publish_time:a,parent_content_info:{type:0}}}}async function u({targetUserId:e,page:n,contentType:r,pageSize:a=10}){if(!e)return{data:{list:[],total:0}};let c=await t({user_id:e,page:n,content_type:r,page_size:a}),l=c.data.like_infos?.reduce((e,t)=>(t.content_id&&(e[t.content_id]=t),e),{})||{},u=r===i.post?(c.data?.post_infos??[]).map(e=>o(e,l)):(c.data?.video_infos??[]).map(e=>s(e,l)),d=c.data?.has_more,f=typeof d==`boolean`?d:void 0;return{data:{list:u,total:c.data?.total??u.length,has_more:f}}}async function d({targetUserId:t,page:n,contentType:r,pageSize:a=10,authConfig:o}){if(!t)return{data:{list:[],total:0}};let s=await e({user_id:t,page:n,page_size:a,content_type:r},o),u=s.data.records?.reduce((e,t)=>(t.content_id&&(e[t.content_id]=t),e),{})||{},d=r===i.post?(s.data?.post_infos??[]).map(e=>c(e,u)):(s.data?.video_infos??[]).map(e=>l(e,u)),f=s.data?.has_more?!0:void 0;return{data:{list:d,total:s.data?.total??d.length,has_more:f}}}export{r as defaultPageSize,d as getHistoryData,u as getLikeData,i as likeContentType};
+import { gInteractionGetBrowseList, gInteractionGetLikeList } from "../../../../../service/generated/client.mjs";
+import dayjs from "dayjs";
+
+//#region components/biz/business/profile/profile-main/utils.ts
+const defaultPageSize = 10;
+const likeContentType = {
+	video: 1,
+	post: 2
+};
+/**
+* 获取帖子封面图，优先 cover_image，其次媒体中的 cover_image，兜底首张图片媒体。
+*/
+function resolvePostCoverImage(info) {
+	if (info.cover_image) return info.cover_image;
+	let fallbackImageUrl = "";
+	return (info.medias?.find((item) => {
+		if (!item) return false;
+		if (!item.is_video && !fallbackImageUrl && item.media_url) fallbackImageUrl = item.media_url;
+		return Boolean(item.cover_image);
+	}))?.cover_image || fallbackImageUrl;
+}
+/**
+* 构建列表需要的帖子内容结构。
+*/
+function buildDetailItemFromPostInfo(info, likeInfoMap) {
+	const resolvedName = info.name;
+	const publishTime = dayjs(likeInfoMap ? likeInfoMap?.[info.content_id || ""]?.create_time : info.create_time).toDate().getTime();
+	const resolvedCoverImage = resolvePostCoverImage(info);
+	return {
+		id: info.content_id || "",
+		content_play_progress: {
+			percent: 0,
+			series_num: 0
+		},
+		detail: {
+			user_info: {
+				name: info.author?.nickname,
+				avatar: info.author?.avatar
+			},
+			info: {
+				name: resolvedName,
+				content_id: info.content_id,
+				user_id: info.user_id,
+				content: info.content,
+				tags: info.tags,
+				cover_image: resolvedCoverImage,
+				like_count: info.like_count,
+				dislike_count: info.dislike_count,
+				comment_count: info.comment_count,
+				share_count: info.share_count,
+				view_count: info.view_count,
+				create_time: info.create_time,
+				update_time: info.update_time,
+				author: info.author ? {
+					user_id: info.author.user_id,
+					username: info.author.username,
+					nickname: info.author.nickname,
+					avatar_url: info.author.avatar
+				} : void 0
+			},
+			statics_cnt: { browse_cnt: info.view_count || 0 },
+			publish_time: publishTime,
+			parent_content_info: { type: 0 }
+		}
+	};
+}
+/**
+* 构建列表需要的视频内容结构。
+*/
+function buildDetailItemFromVideoInfo(info, likeInfoMap) {
+	const resolvedIsMoreLink = info.is_more_link;
+	const publishTime = dayjs(likeInfoMap ? likeInfoMap?.[info.id || ""]?.create_time : info.show_at).toDate().getTime();
+	const rawDuration = Number(info.duration ?? 0);
+	const resolvedVideoDuration = Number.isFinite(rawDuration) ? Math.max(0, Math.floor(rawDuration)) : 0;
+	return {
+		id: info.id || "",
+		content_play_progress: {
+			percent: 0,
+			series_num: 0
+		},
+		detail: {
+			user_info: {
+				name: info.source_username || info.up_user || info.director || info.actor,
+				avatar: void 0
+			},
+			info: {
+				is_more_link: resolvedIsMoreLink,
+				name: info.name,
+				content_id: info.id,
+				content: info.description,
+				tags: info.tags?.map((tag) => tag.name).filter((tag) => Boolean(tag)),
+				cover_image: info.img_y || info.img_x,
+				create_time: info.show_at,
+				video_duration: resolvedVideoDuration
+			},
+			statics_cnt: { browse_cnt: info.play_count || 0 },
+			publish_time: publishTime,
+			parent_content_info: { type: 0 }
+		}
+	};
+}
+/**
+* 构建列表需要的帖子内容结构。
+*/
+function buildHistoryDetailItemFromPostInfo(info, infoMap) {
+	const resolvedName = info.name;
+	const resolvedIsMoreLink = info.is_more_link;
+	const date = infoMap[info.content_id || ""].browse_time;
+	const publishTime = dayjs(date).toDate().getTime();
+	const resolvedCoverImage = resolvePostCoverImage(info);
+	return {
+		id: info.content_id || "",
+		content_play_progress: {
+			percent: 0,
+			series_num: 0
+		},
+		detail: {
+			user_info: {
+				name: info.author?.nickname,
+				avatar: info.author?.avatar
+			},
+			info: {
+				is_more_link: resolvedIsMoreLink,
+				name: resolvedName || info.content,
+				title: resolvedName || info.content,
+				content_id: info.content_id,
+				user_id: info.user_id,
+				content: info.content,
+				tags: info.tags,
+				cover_image: resolvedCoverImage,
+				like_count: info.like_count,
+				dislike_count: info.dislike_count,
+				comment_count: info.comment_count,
+				share_count: info.share_count,
+				view_count: info.view_count,
+				create_time: info.create_time,
+				update_time: info.update_time,
+				author: info.author ? {
+					user_id: info.author.user_id,
+					username: info.author.username,
+					nickname: info.author.nickname,
+					avatar_url: info.author.avatar
+				} : void 0
+			},
+			statics_cnt: { browse_cnt: info.view_count || 0 },
+			publish_time: publishTime,
+			parent_content_info: { type: 0 }
+		}
+	};
+}
+/**
+* 构建列表需要的视频内容结构。
+*/
+function buildHistoryDetailItemFromVideoInfo(info, infoMap) {
+	const resolvedIsMoreLink = info.is_more_link;
+	const date = infoMap[info.id || ""].browse_time;
+	const publishTime = dayjs(date).toDate().getTime();
+	const rawDuration = Number(info.duration ?? 0);
+	const duration = Number.isFinite(rawDuration) ? Math.max(0, Math.floor(rawDuration)) : 0;
+	const browser_duration = infoMap[info.id || ""]?.browse_duration || 0;
+	const browse_episode = Number(infoMap[info.id || ""]?.browse_episode);
+	let series_num = 0;
+	let percent = 0;
+	if (!Number.isNaN(browse_episode)) series_num = browse_episode;
+	if (duration && browser_duration) percent = Math.min(100, Math.floor(browser_duration / duration * 100));
+	return {
+		id: info.id || "",
+		content_play_progress: {
+			percent,
+			series_num
+		},
+		detail: {
+			user_info: {
+				name: info.source_username || info.up_user || info.director || info.actor,
+				avatar: void 0
+			},
+			info: {
+				is_more_link: resolvedIsMoreLink,
+				name: info.name,
+				content_id: info.id,
+				content: info.description,
+				tags: info.tags?.map((tag) => tag.name).filter((tag) => Boolean(tag)),
+				cover_image: info.img_y || info.img_x,
+				create_time: info.show_at,
+				video_duration: duration
+			},
+			statics_cnt: { browse_cnt: info.play_count || 0 },
+			publish_time: publishTime,
+			parent_content_info: { type: 0 }
+		}
+	};
+}
+/**
+* 获取点赞数据。
+*/
+async function getLikeData({ targetUserId, page, contentType, pageSize = defaultPageSize }) {
+	if (!targetUserId) return { data: {
+		list: [],
+		total: 0
+	} };
+	const response = await gInteractionGetLikeList({
+		user_id: targetUserId,
+		page,
+		content_type: contentType,
+		page_size: pageSize
+	});
+	const likeInfoMap = response.data.like_infos?.reduce((acc, cur) => {
+		if (cur.content_id) acc[cur.content_id] = cur;
+		return acc;
+	}, {}) || {};
+	const list = contentType === likeContentType.post ? (response.data?.post_infos ?? []).map((info) => buildDetailItemFromPostInfo(info, likeInfoMap)) : (response.data?.video_infos ?? []).map((info) => buildDetailItemFromVideoInfo(info, likeInfoMap));
+	const hasMore = response.data?.has_more;
+	const resolvedHasMore = typeof hasMore === "boolean" ? hasMore : void 0;
+	return { data: {
+		list,
+		total: response.data?.total ?? list.length,
+		has_more: resolvedHasMore
+	} };
+}
+/**
+* 获取历史数据（暂不区分帖子/视频）。
+*/
+async function getHistoryData({ targetUserId, page, contentType, pageSize = defaultPageSize, authConfig }) {
+	if (!targetUserId) return { data: {
+		list: [],
+		total: 0
+	} };
+	const response = await gInteractionGetBrowseList({
+		user_id: targetUserId,
+		page,
+		page_size: pageSize,
+		content_type: contentType
+	}, authConfig);
+	const browserInfoMap = response.data.records?.reduce((acc, cur) => {
+		if (cur.content_id) acc[cur.content_id] = cur;
+		return acc;
+	}, {}) || {};
+	const list = contentType === likeContentType.post ? (response.data?.post_infos ?? []).map((info) => buildHistoryDetailItemFromPostInfo(info, browserInfoMap)) : (response.data?.video_infos ?? []).map((info) => buildHistoryDetailItemFromVideoInfo(info, browserInfoMap));
+	const resolvedHasMore = response.data?.has_more ? true : void 0;
+	return { data: {
+		list,
+		total: response.data?.total ?? list.length,
+		has_more: resolvedHasMore
+	} };
+}
+
+//#endregion
+export { defaultPageSize, getHistoryData, getLikeData, likeContentType };

package/dist/components/biz/business/profile/profile-main/variants.mjs

@@ -1,2 +1,41 @@
 
-const e=[`collect`,`like`,`history`],t=[`collect`,`like`],n=e,r=[`video`,`post`],i=[`video`,`post`],a=[`video`,`post`,`collection`],o=[`created`,`subscribed`];export{o as profileMainCollectCollectionTabOptions,a as profileMainCollectTabOptions,i as profileMainHistoryTabOptions,r as profileMainLikeTabOptions,e as profileMainMineTabOptions,t as profileMainProfileTabOptions,n as profileMainTabOptions};
+//#region components/biz/business/profile/profile-main/variants.ts
+/**
+* 个人主页主 Tab（本人视角）。
+*/
+const profileMainMineTabOptions = [
+	"collect",
+	"like",
+	"history"
+];
+/**
+* 个人主页主 Tab（他人视角）。
+*/
+const profileMainProfileTabOptions = ["collect", "like"];
+/**
+* 物料主 Tab 可选项。
+*/
+const profileMainTabOptions = profileMainMineTabOptions;
+/**
+* 点赞子 Tab 可选项。
+*/
+const profileMainLikeTabOptions = ["video", "post"];
+/**
+* 历史子 Tab 可选项。
+*/
+const profileMainHistoryTabOptions = ["video", "post"];
+/**
+* 收藏子 Tab 可选项。
+*/
+const profileMainCollectTabOptions = [
+	"video",
+	"post",
+	"collection"
+];
+/**
+* 收藏合集子 Tab 可选项。
+*/
+const profileMainCollectCollectionTabOptions = ["created", "subscribed"];
+
+//#endregion
+export { profileMainCollectCollectionTabOptions, profileMainCollectTabOptions, profileMainHistoryTabOptions, profileMainLikeTabOptions, profileMainMineTabOptions, profileMainProfileTabOptions, profileMainTabOptions };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/defaults/default-props.mjs

@@ -1,2 +1,16 @@
 
-const e={title:`猜你喜欢`,avatarSize:36,followButtonSize:16,itemGap:12,listPadding:16,nameFontSize:12};export{e as defaultProps};
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/defaults/default-props.ts
+/**
+* BasicRecommendedUsers 组件默认 Props 配置
+*/
+const defaultProps = {
+	title: "猜你喜欢",
+	avatarSize: 36,
+	followButtonSize: 16,
+	itemGap: 12,
+	listPadding: 16,
+	nameFontSize: 12
+};
+
+//#endregion
+export { defaultProps };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/index.mjs

@@ -1,2 +1,10 @@
 
-import{defaultProps as e}from"./defaults/default-props.mjs";import t from"./runtime/client.mjs";import{schema as n}from"./schema/index.mjs";var r=t;export{r as default};
+import { defaultProps } from "./defaults/default-props.mjs";
+import BasicRecommendedUsersClient from "./runtime/client.mjs";
+import { schema } from "./schema/index.mjs";
+
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/index.ts
+var basic_recommended_users_default = BasicRecommendedUsersClient;
+
+//#endregion
+export { basic_recommended_users_default as default };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/runtime/client.mjs

@@ -1,2 +1,169 @@
 
-"use client";import{mergeStyles as e}from"../../../../../utils/styles/helpers.mjs";import{useUserStore as t}from"../../../../../../../store/modules/user-store.mjs";import{pInteractionCheckFollow as n}from"../../../../../../../service/generated/client.mjs";import{pxToVw as r}from"../../../../../../../utils/helper.mjs";import{Avatar as i,AvatarFallback as a,AvatarImage as o}from"../../../../../../ui/avatar.mjs";import{Box as s}from"../../../../../../ui/box.mjs";import{Text as c}from"../../../../../../ui/text.mjs";import l from"../../../../../../ui/link.mjs";import{useRequest as u}from"../../../../../../../hooks/query/use-query.mjs";import d from"../../../../../../../assets/icons/follow_nor.mjs";import f from"../../../../../../../assets/icons/follow_sel.mjs";import{defaultProps as p}from"../defaults/default-props.mjs";import{RecommendedUsersSkeleton as m}from"./recommended-users-skeleton.mjs";import{useEffect as h,useMemo as g,useRef as _,useState as v}from"react";import{jsx as y,jsxs as b}from"react/jsx-runtime";const x={},S={list:[]};function C({props:C=x,styles:w,data:T=S}){function E(e){let t=new Set;return e.filter(e=>e.user_id?t.has(e.user_id)?!1:(t.add(e.user_id),!0):!0)}let D={...p,...C},{userId:O,isLogin:k}=t(),{title:A,avatarSize:j,followButtonSize:M,itemGap:N,listPadding:P,nameFontSize:F}=D,[I,L]=v(()=>E(T.list||[])),R=_(T.list),z=g(()=>I.map(e=>e.user_id).filter(Boolean),[I]),B=g(()=>z.join(`,`),[z]),{data:V}=u(g(()=>[`recommended-users`,`follow-status`,O,B],[B,O]),()=>n({follower_id:O,followee_ids:z}),{staleTime:0,enabled:!!k&&!!O&&z.length>0}),H=!!V?.data?.is_following_map;h(()=>{R.current!==T.list&&(R.current=T.list,L(E(T.list||[])))},[T.list]),h(()=>{let e=V?.data?.is_following_map;!e||Object.keys(e).length===0||L(t=>t.filter(e=>e.user_id?!(k&&O&&e.user_id===O):!0).map(t=>!t.user_id||e[t.user_id]===void 0?t:{...t,isFollow:!!e[t.user_id]}))},[V?.data?.is_following_map,k,O]);let U=w?e(w,{}):void 0,W=M+12;return b(s,{style:U,className:`mb-[16px]`,children:[y(c,{as:`h2`,className:`text-[18px] font-bold text-text1 mb-[8px] px-[12px] pt-[16px]`,children:A}),I&&I.length>0?y(s,{className:`overflow-x-auto overflow-y-hidden [&::-webkit-scrollbar]:hidden`,style:{scrollbarWidth:`none`,msOverflowStyle:`none`,WebkitOverflowScrolling:`touch`},children:y(s,{className:`flex h-[62px]`,style:{paddingLeft:r(P),gap:r(N)},children:I.map((e,t)=>b(l,{href:`/profile/${e.user_id}`,className:`flex flex-col items-center shrink-0`,style:{paddingRight:t===I.length-1?r(P):0},children:[b(s,{className:`relative flex flex-col items-center`,children:[b(i,{size:`lg`,children:[e.avatar?y(o,{src:e.avatar,alt:e.nick_name}):null,y(a,{})]}),y(s,{className:`absolute`,style:{width:r(W),height:r(W),bottom:`-${r(W/2)}`,border:`${r(6)} solid rgba(255,255,255,0)`,boxSizing:`border-box`,borderRadius:`9999px`,display:`flex`,alignItems:`center`,justifyContent:`center`,opacity:k?H?1:.6:1},children:k&&H&&e.isFollow?y(f,{width:M,height:M}):y(d,{width:M,height:M})})]}),y(c,{className:`text-center mt-[8px] text-text1 whitespace-nowrap overflow-hidden text-ellipsis`,style:{fontSize:r(F),maxWidth:r(j+20)},title:e.nick_name,children:e.nick_name})]},e.user_id||`user-${t}`))})}):y(m,{avatarSize:j,followButtonSize:M,itemGap:N,listPadding:P,nameFontSize:F,itemCount:7})]})}export{C as default};
+'use client';
+
+import { mergeStyles } from "../../../../../utils/styles/helpers.mjs";
+import { useUserStore } from "../../../../../../../store/modules/user-store.mjs";
+import { pInteractionCheckFollow } from "../../../../../../../service/generated/client.mjs";
+import { pxToVw } from "../../../../../../../utils/helper.mjs";
+import { Avatar, AvatarFallback, AvatarImage } from "../../../../../../ui/avatar.mjs";
+import { Box } from "../../../../../../ui/box.mjs";
+import { Text } from "../../../../../../ui/text.mjs";
+import Link from "../../../../../../ui/link.mjs";
+import { useRequest } from "../../../../../../../hooks/query/use-query.mjs";
+import SvgFollowNor from "../../../../../../../assets/icons/follow_nor.mjs";
+import SvgFollowSel from "../../../../../../../assets/icons/follow_sel.mjs";
+import { defaultProps } from "../defaults/default-props.mjs";
+import { RecommendedUsersSkeleton } from "./recommended-users-skeleton.mjs";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/runtime/client.tsx
+/**
+* BasicRecommendedUsers 客户端渲染组件
+*/
+const emptyPropsConfig = {};
+const emptyRecommendedUsersData = { list: [] };
+function BasicRecommendedUsersClient({ props: propsConfig = emptyPropsConfig, styles, data = emptyRecommendedUsersData }) {
+	/**
+	* 根据 user_id 去重推荐用户列表
+	*/
+	function dedupeUsersById(inputList) {
+		const seen = /* @__PURE__ */ new Set();
+		return inputList.filter((item) => {
+			if (!item.user_id) return true;
+			if (seen.has(item.user_id)) return false;
+			seen.add(item.user_id);
+			return true;
+		});
+	}
+	const props = {
+		...defaultProps,
+		...propsConfig
+	};
+	const { userId, isLogin } = useUserStore();
+	const { title, avatarSize, followButtonSize, itemGap, listPadding, nameFontSize } = props;
+	const [list, setList] = useState(() => dedupeUsersById(data.list || []));
+	const prevDataListRef = useRef(data.list);
+	const followeeIds = useMemo(() => list.map((item) => item.user_id).filter(Boolean), [list]);
+	const followeeIdsKey = useMemo(() => followeeIds.join(","), [followeeIds]);
+	const { data: followStatusResponse } = useRequest(useMemo(() => [
+		"recommended-users",
+		"follow-status",
+		userId,
+		followeeIdsKey
+	], [followeeIdsKey, userId]), () => pInteractionCheckFollow({
+		follower_id: userId,
+		followee_ids: followeeIds
+	}), {
+		staleTime: 0,
+		enabled: Boolean(isLogin) && Boolean(userId) && followeeIds.length > 0
+	});
+	const hasFollowStatus = Boolean(followStatusResponse?.data?.is_following_map);
+	useEffect(() => {
+		if (prevDataListRef.current !== data.list) {
+			prevDataListRef.current = data.list;
+			setList(dedupeUsersById(data.list || []));
+		}
+	}, [data.list]);
+	useEffect(() => {
+		const followMap = followStatusResponse?.data?.is_following_map;
+		if (!followMap || Object.keys(followMap).length === 0) return;
+		setList((prevList) => {
+			return prevList.filter((item) => {
+				if (!item.user_id) return true;
+				if (isLogin && userId && item.user_id === userId) return false;
+				return true;
+			}).map((item) => {
+				if (!item.user_id || followMap[item.user_id] === void 0) return item;
+				return {
+					...item,
+					isFollow: Boolean(followMap[item.user_id])
+				};
+			});
+		});
+	}, [
+		followStatusResponse?.data?.is_following_map,
+		isLogin,
+		userId
+	]);
+	const wrapperStyle = styles ? mergeStyles(styles, {}) : void 0;
+	const followButtonTouchBorder = 6;
+	const followButtonTouchSize = followButtonSize + followButtonTouchBorder * 2;
+	return /* @__PURE__ */ jsxs(Box, {
+		style: wrapperStyle,
+		className: "mb-[16px]",
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "h2",
+			className: "text-[18px] font-bold text-text1 mb-[8px] px-[12px] pt-[16px]",
+			children: title
+		}), list && list.length > 0 ? /* @__PURE__ */ jsx(Box, {
+			className: "overflow-x-auto overflow-y-hidden [&::-webkit-scrollbar]:hidden",
+			style: {
+				scrollbarWidth: "none",
+				msOverflowStyle: "none",
+				WebkitOverflowScrolling: "touch"
+			},
+			children: /* @__PURE__ */ jsx(Box, {
+				className: "flex h-[62px]",
+				style: {
+					paddingLeft: pxToVw(listPadding),
+					gap: pxToVw(itemGap)
+				},
+				children: list.map((user, index) => /* @__PURE__ */ jsxs(Link, {
+					href: `/profile/${user.user_id}`,
+					className: "flex flex-col items-center shrink-0",
+					style: { paddingRight: index === list.length - 1 ? pxToVw(listPadding) : 0 },
+					children: [/* @__PURE__ */ jsxs(Box, {
+						className: "relative flex flex-col items-center",
+						children: [/* @__PURE__ */ jsxs(Avatar, {
+							size: "lg",
+							children: [user.avatar ? /* @__PURE__ */ jsx(AvatarImage, {
+								src: user.avatar,
+								alt: user.nick_name
+							}) : null, /* @__PURE__ */ jsx(AvatarFallback, {})]
+						}), /* @__PURE__ */ jsx(Box, {
+							className: "absolute",
+							style: {
+								width: pxToVw(followButtonTouchSize),
+								height: pxToVw(followButtonTouchSize),
+								bottom: `-${pxToVw(followButtonTouchSize / 2)}`,
+								border: `${pxToVw(followButtonTouchBorder)} solid rgba(255,255,255,0)`,
+								boxSizing: "border-box",
+								borderRadius: "9999px",
+								display: "flex",
+								alignItems: "center",
+								justifyContent: "center",
+								opacity: isLogin ? hasFollowStatus ? 1 : .6 : 1
+							},
+							children: isLogin && hasFollowStatus && user.isFollow ? /* @__PURE__ */ jsx(SvgFollowSel, {
+								width: followButtonSize,
+								height: followButtonSize
+							}) : /* @__PURE__ */ jsx(SvgFollowNor, {
+								width: followButtonSize,
+								height: followButtonSize
+							})
+						})]
+					}), /* @__PURE__ */ jsx(Text, {
+						className: "text-center mt-[8px] text-text1 whitespace-nowrap overflow-hidden text-ellipsis",
+						style: {
+							fontSize: pxToVw(nameFontSize),
+							maxWidth: pxToVw(avatarSize + 20)
+						},
+						title: user.nick_name,
+						children: user.nick_name
+					})]
+				}, user.user_id || `user-${index}`))
+			})
+		}) : /* @__PURE__ */ jsx(RecommendedUsersSkeleton, {
+			avatarSize,
+			followButtonSize,
+			itemGap,
+			listPadding,
+			nameFontSize,
+			itemCount: 7
+		})]
+	});
+}
+
+//#endregion
+export { BasicRecommendedUsersClient as default };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/runtime/recommended-users-skeleton.mjs

@@ -1,2 +1,120 @@
 
-"use client";import{Box as e}from"../../../../../../ui/box.mjs";import*as t from"react";import{useId as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{useTranslations as a}from"next-intl";import o from"react-content-loader";function s(s){let{avatarSize:c=36,followButtonSize:l=16,itemGap:u=12,listPadding:d=16,nameFontSize:f=12,itemCount:p=7,uniqueKey:m,className:h=``,style:g}=s,_=a(`components.common`),v=n(),y=m||v,b=l+12,x=c+20,S=c/2,C=l/2,w=x,T=d,E=[];for(let e=0;e<p;e++){let t=e===p-1,n=x+(t?d:0),r=T,i=r+(c-b)/2,a=c-b/2,o=r+(c-w)/2,s=c+8;E.push({avatarX:r,avatarY:0,followButtonX:i,followButtonY:a,nameX:o,nameY:s}),T+=n+(t?0:u)}let D=Math.max(375,T);return r(e,{style:g,className:`${h}`.trim(),children:r(e,{className:`overflow-x-auto overflow-y-hidden [&::-webkit-scrollbar]:hidden`,style:{scrollbarWidth:`none`,msOverflowStyle:`none`,WebkitOverflowScrolling:`touch`},children:r(e,{style:{paddingLeft:d,height:62,width:D,minWidth:D},children:r(o,{uniqueKey:y,viewBox:`0 0 ${D} 62`,className:`h-full w-full text-text1`,backgroundColor:`currentColor`,foregroundColor:`currentColor`,backgroundOpacity:.08,foregroundOpacity:.18,preserveAspectRatio:`none`,title:_(`skeleton.loading`),children:E.map((e,n)=>{let a=e.avatarX+S,o=e.avatarY+S,s=e.followButtonX+b/2,c=e.followButtonY+b/2;return i(t.Fragment,{children:[r(`circle`,{cx:a,cy:o,r:S}),r(`circle`,{cx:s,cy:c,r:C}),r(`rect`,{x:e.nameX,y:e.nameY,rx:4,ry:4,width:w,height:f})]},`user-item-${n}`)})})})})})}export{s as RecommendedUsersSkeleton};
+'use client';
+
+import { Box } from "../../../../../../ui/box.mjs";
+import * as React from "react";
+import { useId } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+import ContentLoader from "react-content-loader";
+
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/runtime/recommended-users-skeleton.tsx
+/**
+* 推荐用户列表骨架屏组件
+*/
+const DEFAULT_AVATAR_SIZE = 36;
+const DEFAULT_FOLLOW_BUTTON_SIZE = 16;
+const DEFAULT_ITEM_GAP = 12;
+const DEFAULT_LIST_PADDING = 16;
+const DEFAULT_NAME_FONT_SIZE = 12;
+const DEFAULT_ITEM_COUNT = 7;
+const FOLLOW_BUTTON_TOUCH_BORDER = 6;
+const NAME_MARGIN_TOP = 8;
+const BASE_WIDTH = 375;
+const BASE_HEIGHT = 62;
+/**
+* 推荐用户列表骨架屏，基于 BasicRecommendedUsers 布局。
+*/
+function RecommendedUsersSkeleton(props) {
+	const { avatarSize = DEFAULT_AVATAR_SIZE, followButtonSize = DEFAULT_FOLLOW_BUTTON_SIZE, itemGap = DEFAULT_ITEM_GAP, listPadding = DEFAULT_LIST_PADDING, nameFontSize = DEFAULT_NAME_FONT_SIZE, itemCount = DEFAULT_ITEM_COUNT, uniqueKey, className = "", style } = props;
+	const t = useTranslations("components.common");
+	const reactId = useId();
+	const contentKey = uniqueKey || reactId;
+	const followButtonTouchSize = followButtonSize + FOLLOW_BUTTON_TOUCH_BORDER * 2;
+	const itemWidth = avatarSize + 20;
+	const avatarRadius = avatarSize / 2;
+	const followButtonRadius = followButtonSize / 2;
+	const nameLineWidth = itemWidth;
+	let currentX = listPadding;
+	const items = [];
+	for (let i = 0; i < itemCount; i++) {
+		const isLast = i === itemCount - 1;
+		const itemWidthWithPadding = itemWidth + (isLast ? listPadding : 0);
+		const avatarX = currentX;
+		const avatarY = 0;
+		const followButtonX = avatarX + (avatarSize - followButtonTouchSize) / 2;
+		const followButtonY = avatarSize - followButtonTouchSize / 2;
+		const nameX = avatarX + (avatarSize - nameLineWidth) / 2;
+		const nameY = avatarSize + NAME_MARGIN_TOP;
+		items.push({
+			avatarX,
+			avatarY,
+			followButtonX,
+			followButtonY,
+			nameX,
+			nameY
+		});
+		currentX += itemWidthWithPadding + (isLast ? 0 : itemGap);
+	}
+	const totalWidth = Math.max(BASE_WIDTH, currentX);
+	return /* @__PURE__ */ jsx(Box, {
+		style,
+		className: `${className}`.trim(),
+		children: /* @__PURE__ */ jsx(Box, {
+			className: "overflow-x-auto overflow-y-hidden [&::-webkit-scrollbar]:hidden",
+			style: {
+				scrollbarWidth: "none",
+				msOverflowStyle: "none",
+				WebkitOverflowScrolling: "touch"
+			},
+			children: /* @__PURE__ */ jsx(Box, {
+				style: {
+					paddingLeft: listPadding,
+					height: BASE_HEIGHT,
+					width: totalWidth,
+					minWidth: totalWidth
+				},
+				children: /* @__PURE__ */ jsx(ContentLoader, {
+					uniqueKey: contentKey,
+					viewBox: `0 0 ${totalWidth} ${BASE_HEIGHT}`,
+					className: "h-full w-full text-text1",
+					backgroundColor: "currentColor",
+					foregroundColor: "currentColor",
+					backgroundOpacity: .08,
+					foregroundOpacity: .18,
+					preserveAspectRatio: "none",
+					title: t("skeleton.loading"),
+					children: items.map((item, index) => {
+						const avatarCenterX = item.avatarX + avatarRadius;
+						const avatarCenterY = item.avatarY + avatarRadius;
+						const followButtonCenterX = item.followButtonX + followButtonTouchSize / 2;
+						const followButtonCenterY = item.followButtonY + followButtonTouchSize / 2;
+						return /* @__PURE__ */ jsxs(React.Fragment, { children: [
+							/* @__PURE__ */ jsx("circle", {
+								cx: avatarCenterX,
+								cy: avatarCenterY,
+								r: avatarRadius
+							}),
+							/* @__PURE__ */ jsx("circle", {
+								cx: followButtonCenterX,
+								cy: followButtonCenterY,
+								r: followButtonRadius
+							}),
+							/* @__PURE__ */ jsx("rect", {
+								x: item.nameX,
+								y: item.nameY,
+								rx: 4,
+								ry: 4,
+								width: nameLineWidth,
+								height: nameFontSize
+							})
+						] }, `user-item-${index}`);
+					})
+				})
+			})
+		})
+	});
+}
+
+//#endregion
+export { RecommendedUsersSkeleton };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/schema/component.mjs

@@ -1,2 +1,15 @@
 
-const e={componentName:`BasicRecommendedUsers`,displayName:`推荐用户列表`,category:`RecommendedUsers`,categoryName:`推荐用户`,enabled:!0};export{e as componentMeta};
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/schema/component.ts
+/**
+* BasicRecommendedUsers 组件元信息配置
+*/
+const componentMeta = {
+	componentName: "BasicRecommendedUsers",
+	displayName: "推荐用户列表",
+	category: "RecommendedUsers",
+	categoryName: "推荐用户",
+	enabled: true
+};
+
+//#endregion
+export { componentMeta };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/schema/data.schema.mjs

@@ -1,2 +1,10 @@
 
-const e={dataBinding:{field:`users`,sourceType:`dynamic`}};export{e as dataSchema};
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/schema/data.schema.ts
+/** 数据 Schema 结构 */
+const dataSchema = { dataBinding: {
+	field: "users",
+	sourceType: "dynamic"
+} };
+
+//#endregion
+export { dataSchema };

package/dist/components/biz/business/recommended-users/variants/basic-recommended-users/schema/event.schema.mjs

@@ -1,2 +1,18 @@
 
-const e={onFollowClick:{title:`关注点击事件`,description:`点击关注按钮时的回调函数`,params:[{type:`object`,title:`用户信息`,description:`被关注的用户信息`},{type:`number`,title:`索引`,description:`用户在列表中的索引`}]}};export{e as eventSchema};
+//#region components/biz/business/recommended-users/variants/basic-recommended-users/schema/event.schema.ts
+const eventSchema = { onFollowClick: {
+	title: "关注点击事件",
+	description: "点击关注按钮时的回调函数",
+	params: [{
+		type: "object",
+		title: "用户信息",
+		description: "被关注的用户信息"
+	}, {
+		type: "number",
+		title: "索引",
+		description: "用户在列表中的索引"
+	}]
+} };
+
+//#endregion
+export { eventSchema };