@funhub/platform 0.1.127 → 0.1.130

package/dist/components/pages/search/search-result/search-video-info.mjs

@@ -1,2 +1,325 @@
 
-"use client";import{gContentGetRecommendVideoList as e}from"../../../../service/generated/client.mjs";import{Image as t}from"../../../ui/image.mjs";import{Box as n}from"../../../ui/box.mjs";import{EmptyState as r}from"../../../ui/empty.mjs";import{Text as i}from"../../../ui/text.mjs";import{usePaginated as a,useRefetchQuery as o,useUpdateRequest as s}from"../../../../hooks/query/use-query.mjs";import{formatVideoDuration as c,getPostDetailPagePath as l}from"../../../../utils/tools.mjs";import{apiCollectCustom as u}from"../../../../utils/api-collect.mjs";import{UserActivityList as d}from"../../../common/list/user-activity-list/user-activity-list.mjs";import f from"../../../../assets/icons/view.mjs";import{SearchVideoCardSkeleton as p}from"../../../common/skeleton/search-video-card-skeleton.mjs";import{mapRecommendContentToUserActivityItem as m}from"../search-utils.mjs";import{memo as h,useCallback as g,useMemo as _}from"react";import{jsx as v,jsxs as y}from"react/jsx-runtime";import{useTranslations as b}from"next-intl";import x from"next/link";const S=h(()=>v(p,{count:3,uniqueKeyPrefix:`search-video-info-skeleton`}));S.displayName=`SearchVideoListSkeleton`;function C(e){let t=Number(e||0);return Number.isNaN(t)||t<=0?`0`:t>=1e4?`${(t/1e4).toFixed(1)}w`:t>=1e3?`${(t/1e3).toFixed(1)}k`:String(t)}function w(e){let t=Number(e.episode_count||0),n=Number.isFinite(t)&&t>0,r=String(e.update_status??``).trim();return!n||t<=1?c(Number(e.duration||0)):r===`1`?`${t}集全`:`更新至${t}集`}const T=h(({item:e})=>{let r=e.name||``,a=e.img_x||e.img_y||``,o=w(e);return y(x,{className:`mb-[12px] block border-b border-line1 px-[12px] pb-[12px]`,href:l({id:e.video_id,contentType:0}),onClick:()=>{e.video_id},children:[y(n,{className:`relative w-full overflow-hidden rounded-[12px] bg-neutral-800`,style:{aspectRatio:`16/9`},children:[a&&v(t,{src:a,alt:r||`封面`,fill:!0,objectFit:`cover`}),v(n,{className:`absolute inset-x-0 bottom-0 h-[40px] bg-gradient-to-t from-black/80 to-transparent z-0 pointer-events-none`}),y(n,{className:`absolute bottom-0 left-[8px] mb-[6px] z-10 flex items-center gap-[4px]`,children:[v(f,{className:`h-[14px] w-[14px] text-white`}),v(i,{as:`span`,className:`text-[12px] font-medium text-white drop-shadow-md`,children:C(e.play_count)})]}),o&&v(n,{className:`absolute bottom-0 right-[8px] mb-[6px] z-10 flex items-center`,children:v(i,{as:`span`,className:`text-[12px] font-medium text-white drop-shadow-md`,children:o})})]}),y(n,{className:`flex items-center justify-between gap-[12px] pt-[10px] px-2`,children:[y(n,{className:`flex-1 min-w-0`,children:[v(i,{as:`h3`,className:`text-[16px] font-semibold leading-[24px] text-text1 line-clamp-1`,children:r}),e.description&&v(i,{as:`p`,className:`mt-[4px] text-[13px] leading-[20px] text-text2 line-clamp-1`,children:e.description})]}),v(i,{className:`shrink-0 rounded-[20px] border border-[#FD4C5E] px-[24px] py-[8px] text-[14px] font-normal text-[#FD4C5E]`,children:`观看`})]})]})});T.displayName=`VideoItem`;const E=h(({list:e})=>v(n,{className:`w-full px-[12px] pt-[12px]`,children:e.map((e,t)=>v(T,{item:e},String(e.video_id??t)))}));E.displayName=`VideoList`;const D=h(({list:e,onUpdate:t,onActionSuccess:n})=>{let r=g(n=>{let r=e.findIndex(e=>e.content_id===n.content_id);if(r!==-1){let i=[...e];i[r]=n,t(i)}},[e,t]);return v(d,{list:_(()=>e.map(e=>({...m(e),onLikeSuccess(t){r({...e,like_count:String(t.count),dislike_count:t.dislikeCount===void 0?e.dislike_count:String(t.dislikeCount),interaction:{...e.interaction,is_liked:t.isLiked,is_dislike:t.isDisliked??e.interaction?.is_dislike}})},onDislikeSuccess(t){r({...e,like_count:t.likeCount===void 0?e.like_count:String(t.likeCount),dislike_count:String(t.count),interaction:{...e.interaction,is_dislike:t.isDisliked,is_liked:t.isLiked??e.interaction?.is_liked}})}})),[r,e]),showGroupHeaders:!1,onActionSuccess:n})});D.displayName=`InfoList`;const O=h(({searchType:t,inputVal:i})=>{let c=b(`components.pages.search.searchResult`),l=g(async n=>await e({data_type:2,extra_params:JSON.stringify({type:t===`video`?3:2,keywords:i}),page:n||1,page_size:20}),[i,20,t]),u=_(()=>[`searchByKeyForVideoInfo`,i,t===`video`?3:2],[i,t]),f=a({key:u,initialPageParam:1,async queryFn(e){let n=await l(e);return(t===`video`?n?.data?.videos:n?.data?.contents)??{has_more:!1,total:0,list:[]}},getNextPageParam(e,t){if(e.has_more)return t.length+1}}),p=_(()=>{let e=f.data?.pages??[],t=[];for(let n of e){let e=n.list??[];t.push(...e)}return t},[f.data?.pages]),h=_(()=>p,[p,t]),y=s(),x=o(),C=g(e=>{y(u,t=>{if(!t)return t;let n=t.pages.map(t=>({...t,list:(t.list??[]).map(t=>t.content_id===e.content_id?e:t)}));return{...t,pages:n}})},[u,y]),w=g(()=>{x(u)},[u,x]),T=g(e=>({...m(e),onLikeSuccess(t){C({...e,like_count:String(t.count),dislike_count:t.dislikeCount===void 0?e.dislike_count:String(t.dislikeCount),interaction:{...e.interaction,is_liked:t.isLiked,is_dislike:t.isDisliked??e.interaction?.is_dislike}})},onDislikeSuccess(t){C({...e,like_count:t.likeCount===void 0?e.like_count:String(t.likeCount),dislike_count:String(t.count),interaction:{...e.interaction,is_dislike:t.isDisliked,is_liked:t.isLiked??e.interaction?.is_liked}})}}),[C]),D=_(()=>h.map(T),[T,h]),O=f.isPending||f.isFetching,k=t===`video`&&O&&h.length===0;return v(n,{className:`w-full`,children:t===`video`?k?v(S,{}):h.length>0?v(E,{list:h}):v(r,{type:`no-content`,text:c(`searchVideoInfo.noRelevantContent`),className:`mt-[12px]`}):v(d,{list:D,loading:O,hasMore:f.hasNextPage??!1,loadMore:async e=>{if(e!==!1)try{f&&await f.fetchNextPage()}catch(e){console.error(`获取内容列表失败`,e)}},showGroupHeaders:!1,emptyText:c(`searchVideoInfo.noRelevantContent`),onActionSuccess:w})})});O.displayName=`SearchInfoOrVideoList`;export{E as VideoList,O as default};
+'use client';
+
+import { gContentGetRecommendVideoList } from "../../../../service/generated/client.mjs";
+import { Image } from "../../../ui/image.mjs";
+import { Box } from "../../../ui/box.mjs";
+import { EmptyState } from "../../../ui/empty.mjs";
+import { Text } from "../../../ui/text.mjs";
+import { usePaginated, useRefetchQuery, useUpdateRequest } from "../../../../hooks/query/use-query.mjs";
+import { formatVideoDuration, getPostDetailPagePath } from "../../../../utils/tools.mjs";
+import { apiCollectCustom } from "../../../../utils/api-collect.mjs";
+import { UserActivityList } from "../../../common/list/user-activity-list/user-activity-list.mjs";
+import { VideoListItemSkeleton } from "../../../common/skeleton/video-list-item-skeleton.mjs";
+import SvgView from "../../../../assets/icons/view.mjs";
+import { mapRecommendContentToUserActivityItem } from "../search-utils.mjs";
+import { memo, useCallback, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+import Link from "next/link";
+
+//#region components/pages/search/search-result/search-video-info.tsx
+const DEFAULT_VIDEO_SKELETON_COUNT = 3;
+/**
+* 视频列表首屏骨架。
+*/
+const SearchVideoListSkeleton = memo(() => {
+	return /* @__PURE__ */ jsx(Box, {
+		className: "w-full px-[12px] pt-[12px]",
+		children: Array.from({ length: DEFAULT_VIDEO_SKELETON_COUNT }).map((_, index) => /* @__PURE__ */ jsx(VideoListItemSkeleton, {}, `search-video-skeleton-${index}`))
+	});
+});
+SearchVideoListSkeleton.displayName = "SearchVideoListSkeleton";
+function formatPlayCount(input) {
+	const num = Number(input || 0);
+	if (Number.isNaN(num) || num <= 0) return "0";
+	if (num >= 1e4) return `${(num / 1e4).toFixed(1)}w`;
+	if (num >= 1e3) return `${(num / 1e3).toFixed(1)}k`;
+	return String(num);
+}
+function getEpisodeText(item) {
+	const episodeCount = Number(item.episode_count || 0);
+	const hasEpisodeCount = Number.isFinite(episodeCount) && episodeCount > 0;
+	const updateStatus = String(item.update_status ?? "").trim();
+	if (!hasEpisodeCount || episodeCount <= 1) return formatVideoDuration(Number(item.duration || 0));
+	if (updateStatus === "1") return `${episodeCount}集全`;
+	if (updateStatus === "0") return `更新至${episodeCount}集`;
+	return `更新至${episodeCount}集`;
+}
+/**
+* 视频项组件。
+*/
+const VideoItem = memo(({ item }) => {
+	const safeTitle = item.name || "";
+	const cover = item.img_x || item.img_y || "";
+	const episodeText = getEpisodeText(item);
+	return /* @__PURE__ */ jsxs(Link, {
+		className: "mb-[12px] block border-b border-line1 px-[12px] pb-[12px]",
+		href: getPostDetailPagePath({
+			id: item.video_id,
+			contentType: 0
+		}),
+		onClick: () => {
+			/* @__PURE__ */ apiCollectCustom({
+				contentId: item.video_id,
+				custom: "hot_search"
+			});
+		},
+		children: [/* @__PURE__ */ jsxs(Box, {
+			className: "relative w-full overflow-hidden rounded-[12px] bg-neutral-800",
+			style: { aspectRatio: "16/9" },
+			children: [
+				cover && /* @__PURE__ */ jsx(Image, {
+					src: cover,
+					alt: safeTitle || "封面",
+					fill: true,
+					objectFit: "cover"
+				}),
+				/* @__PURE__ */ jsx(Box, { className: "absolute inset-x-0 bottom-0 h-[40px] bg-gradient-to-t from-black/80 to-transparent z-0 pointer-events-none" }),
+				/* @__PURE__ */ jsxs(Box, {
+					className: "absolute bottom-0 left-[8px] mb-[6px] z-10 flex items-center gap-[4px]",
+					children: [/* @__PURE__ */ jsx(SvgView, { className: "h-[14px] w-[14px] text-white" }), /* @__PURE__ */ jsx(Text, {
+						as: "span",
+						className: "text-[12px] font-medium text-white drop-shadow-md",
+						children: formatPlayCount(item.play_count)
+					})]
+				}),
+				episodeText && /* @__PURE__ */ jsx(Box, {
+					className: "absolute bottom-0 right-[8px] mb-[6px] z-10 flex items-center",
+					children: /* @__PURE__ */ jsx(Text, {
+						as: "span",
+						className: "text-[12px] font-medium text-white drop-shadow-md",
+						children: episodeText
+					})
+				})
+			]
+		}), /* @__PURE__ */ jsxs(Box, {
+			className: "flex items-center justify-between gap-[12px] pt-[10px] px-2",
+			children: [/* @__PURE__ */ jsxs(Box, {
+				className: "flex-1 min-w-0",
+				children: [/* @__PURE__ */ jsx(Text, {
+					as: "h3",
+					className: "text-[16px] font-semibold leading-[24px] text-text1 line-clamp-1",
+					children: safeTitle
+				}), item.description && /* @__PURE__ */ jsx(Text, {
+					as: "p",
+					className: "mt-[4px] text-[13px] leading-[20px] text-text2 line-clamp-1",
+					children: item.description
+				})]
+			}), /* @__PURE__ */ jsx(Text, {
+				className: "shrink-0 rounded-[20px] border border-[#FD4C5E] px-[24px] py-[8px] text-[14px] font-normal text-[#FD4C5E]",
+				children: "观看"
+			})]
+		})]
+	});
+});
+VideoItem.displayName = "VideoItem";
+/**
+* 视频列表（保留用于其他地方使用）。
+*/
+const VideoList = memo(({ list }) => {
+	return /* @__PURE__ */ jsx(Box, {
+		className: "w-full px-[12px] pt-[12px]",
+		children: list.map((item, index) => /* @__PURE__ */ jsx(VideoItem, { item }, String(item.video_id ?? index)))
+	});
+});
+VideoList.displayName = "VideoList";
+/**
+* 帖子列表（保留用于其他地方使用）。
+*/
+const InfoList = memo(({ list, onUpdate, onActionSuccess }) => {
+	/**
+	* 同步更新列表内的指定项。
+	*/
+	const handleItemUpdate = useCallback((updateItem) => {
+		const index = list.findIndex((item) => item.content_id === updateItem.content_id);
+		if (index !== -1) {
+			const newList = [...list];
+			newList[index] = updateItem;
+			onUpdate(newList);
+		}
+	}, [list, onUpdate]);
+	return /* @__PURE__ */ jsx(UserActivityList, {
+		list: useMemo(() => {
+			return list.map((item) => {
+				return {
+					...mapRecommendContentToUserActivityItem(item),
+					onLikeSuccess(newState) {
+						handleItemUpdate({
+							...item,
+							like_count: String(newState.count),
+							dislike_count: newState.dislikeCount !== void 0 ? String(newState.dislikeCount) : item.dislike_count,
+							interaction: {
+								...item.interaction,
+								is_liked: newState.isLiked,
+								is_dislike: newState.isDisliked ?? item.interaction?.is_dislike
+							}
+						});
+					},
+					onDislikeSuccess(newState) {
+						handleItemUpdate({
+							...item,
+							like_count: newState.likeCount !== void 0 ? String(newState.likeCount) : item.like_count,
+							dislike_count: String(newState.count),
+							interaction: {
+								...item.interaction,
+								is_dislike: newState.isDisliked,
+								is_liked: newState.isLiked ?? item.interaction?.is_liked
+							}
+						});
+					}
+				};
+			});
+		}, [handleItemUpdate, list]),
+		showGroupHeaders: false,
+		onActionSuccess
+	});
+});
+InfoList.displayName = "InfoList";
+/**
+* 搜索帖子和视频列表。
+*/
+const SearchInfoOrVideoList = memo(({ searchType, inputVal }) => {
+	const t = useTranslations("components.pages.search.searchResult");
+	const pageSize = 20;
+	const fetchSearchData = useCallback(async (page) => {
+		return await gContentGetRecommendVideoList({
+			data_type: 2,
+			extra_params: JSON.stringify({
+				type: searchType === "video" ? 3 : 2,
+				keywords: inputVal
+			}),
+			page: page || 1,
+			page_size: pageSize
+		});
+	}, [
+		inputVal,
+		pageSize,
+		searchType
+	]);
+	const queryKey = useMemo(() => {
+		return [
+			"searchByKeyForVideoInfo",
+			inputVal,
+			searchType === "video" ? 3 : 2
+		];
+	}, [inputVal, searchType]);
+	const pageData = usePaginated({
+		key: queryKey,
+		initialPageParam: 1,
+		async queryFn(pageParam) {
+			const result = await fetchSearchData(pageParam);
+			return (searchType === "video" ? result?.data?.videos : result?.data?.contents) ?? {
+				has_more: false,
+				total: 0,
+				list: []
+			};
+		},
+		getNextPageParam(lastPage, allPages) {
+			if (!lastPage.has_more) return;
+			return allPages.length + 1;
+		}
+	});
+	const rawList = useMemo(() => {
+		const pages = pageData.data?.pages ?? [];
+		const results = [];
+		for (const page of pages) {
+			const list = page.list ?? [];
+			results.push(...list);
+		}
+		return results;
+	}, [pageData.data?.pages]);
+	const contentList = useMemo(() => {
+		if (searchType === "video") return rawList;
+		return rawList;
+	}, [rawList, searchType]);
+	const updateSearchCache = useUpdateRequest();
+	const refetchSearchData = useRefetchQuery();
+	/**
+	* 同步搜索列表内的帖子更新。
+	*/
+	const handleItemUpdate = useCallback((updateItem) => {
+		updateSearchCache(queryKey, (prev) => {
+			if (!prev) return prev;
+			const pages = prev.pages.map((page) => ({
+				...page,
+				list: (page.list ?? []).map((item) => item.content_id === updateItem.content_id ? updateItem : item)
+			}));
+			return {
+				...prev,
+				pages
+			};
+		});
+	}, [queryKey, updateSearchCache]);
+	/**
+	* 点赞/点踩成功后，重新拉取当前搜索结果列表，保证状态与服务端一致。
+	*/
+	const handleActionSuccess = useCallback(() => {
+		refetchSearchData(queryKey);
+	}, [queryKey, refetchSearchData]);
+	/**
+	* 构建用户动态列表项并注入交互回调。
+	*/
+	const buildActivityItem = useCallback((item) => {
+		return {
+			...mapRecommendContentToUserActivityItem(item),
+			onLikeSuccess(newState) {
+				handleItemUpdate({
+					...item,
+					like_count: String(newState.count),
+					dislike_count: newState.dislikeCount !== void 0 ? String(newState.dislikeCount) : item.dislike_count,
+					interaction: {
+						...item.interaction,
+						is_liked: newState.isLiked,
+						is_dislike: newState.isDisliked ?? item.interaction?.is_dislike
+					}
+				});
+			},
+			onDislikeSuccess(newState) {
+				handleItemUpdate({
+					...item,
+					like_count: newState.likeCount !== void 0 ? String(newState.likeCount) : item.like_count,
+					dislike_count: String(newState.count),
+					interaction: {
+						...item.interaction,
+						is_dislike: newState.isDisliked,
+						is_liked: newState.isLiked ?? item.interaction?.is_liked
+					}
+				});
+			}
+		};
+	}, [handleItemUpdate]);
+	const activityList = useMemo(() => {
+		return contentList.map(buildActivityItem);
+	}, [buildActivityItem, contentList]);
+	const isSearching = pageData.isPending || pageData.isFetching;
+	const shouldShowVideoSkeleton = searchType === "video" && isSearching && contentList.length === 0;
+	const loadMore = async (isRetry) => {
+		if (isRetry === false) return;
+		try {
+			if (pageData) await pageData.fetchNextPage();
+		} catch (error) {
+			console.error("获取内容列表失败", error);
+		}
+	};
+	return /* @__PURE__ */ jsx(Box, {
+		className: "w-full",
+		children: searchType === "video" ? shouldShowVideoSkeleton ? /* @__PURE__ */ jsx(SearchVideoListSkeleton, {}) : contentList.length > 0 ? /* @__PURE__ */ jsx(VideoList, { list: contentList }) : /* @__PURE__ */ jsx(EmptyState, {
+			type: "no-content",
+			text: t("searchVideoInfo.noRelevantContent"),
+			className: "mt-[12px]"
+		}) : /* @__PURE__ */ jsx(UserActivityList, {
+			list: activityList,
+			loading: isSearching,
+			hasMore: pageData.hasNextPage ?? false,
+			loadMore,
+			showGroupHeaders: false,
+			emptyText: t("searchVideoInfo.noRelevantContent"),
+			onActionSuccess: handleActionSuccess
+		})
+	});
+});
+SearchInfoOrVideoList.displayName = "SearchInfoOrVideoList";
+
+//#endregion
+export { VideoList, SearchInfoOrVideoList as default };

package/dist/components/pages/search/search-utils.mjs

@@ -1,2 +1,49 @@
 
-function e(e){let t=e.author,n=(Array.isArray(e.medias)?e.medias:[]).map(t=>{let n=t?.media_url??``,r=!!t?.is_video,i=t?.cover_image||e.cover_image||(r?``:n);return{...t,media_url:n,is_video:r,cover_image:i}}).filter(e=>!!(e?.media_url||e?.cover_image)),r=(Array.isArray(e.images)?e.images:[]).map(e=>typeof e==`string`?e:e&&typeof e==`object`&&(e.url||e.image_url||e.media_url)||``).filter(e=>!!e).map(e=>({media_url:e,is_video:!1,cover_image:``})),i=n.length?n:r;return{type:Number(e.type??1),content_id:e.content_id??``,author:{avatar:t?.avatar_url??t?.avatar??``,nick_name:t?.nickname??t?.username??``,user_id:t?.user_id??e.user_id??``},create_time:Number(e.create_time??0),content:e.content??``,medias:i,like_count:Number(e.like_count??0),dislike_count:Number(e.dislike_count??0),comment_count:Number(e.comment_count??0),is_liked:e.interaction?.is_liked??!1,is_dislike:e.interaction?.is_dislike??!1}}export{e as mapRecommendContentToUserActivityItem};
+//#region components/pages/search/search-utils.ts
+/**
+* 将推荐帖子数据转换为 UserActivityListItemProps。
+*/
+function mapRecommendContentToUserActivityItem(item) {
+	const author = item.author;
+	const normalizedMedias = (Array.isArray(item.medias) ? item.medias : []).map((media) => {
+		const mediaUrl = media?.media_url ?? "";
+		const isVideo = Boolean(media?.is_video);
+		const coverImage = media?.cover_image || item.cover_image || (isVideo ? "" : mediaUrl);
+		return {
+			...media,
+			media_url: mediaUrl,
+			is_video: isVideo,
+			cover_image: coverImage
+		};
+	}).filter((media) => Boolean(media?.media_url || media?.cover_image));
+	const fallbackMedias = (Array.isArray(item.images) ? item.images : []).map((img) => {
+		if (typeof img === "string") return img;
+		if (img && typeof img === "object") return img.url || img.image_url || img.media_url || "";
+		return "";
+	}).filter((url) => Boolean(url)).map((url) => ({
+		media_url: url,
+		is_video: false,
+		cover_image: ""
+	}));
+	const resolvedMedias = normalizedMedias.length ? normalizedMedias : fallbackMedias;
+	return {
+		type: Number(item.type ?? 1),
+		content_id: item.content_id ?? "",
+		author: {
+			avatar: author?.avatar_url ?? author?.avatar ?? "",
+			nick_name: author?.nickname ?? author?.username ?? "",
+			user_id: author?.user_id ?? item.user_id ?? ""
+		},
+		create_time: Number(item.create_time ?? 0),
+		content: item.content ?? "",
+		medias: resolvedMedias,
+		like_count: Number(item.like_count ?? 0),
+		dislike_count: Number(item.dislike_count ?? 0),
+		comment_count: Number(item.comment_count ?? 0),
+		is_liked: item.interaction?.is_liked ?? false,
+		is_dislike: item.interaction?.is_dislike ?? false
+	};
+}
+
+//#endregion
+export { mapRecommendContentToUserActivityItem };

package/dist/components/pages/search/style.module.mjs

@@ -1,115 +1,15 @@
 
-import e from"../../../node_modules/.pnpm/style-inject@0.3.0/node_modules/style-inject/dist/style-inject.es.mjs";var t=`.style-module_searchInput__5zpUG {
-	position: relative;
-	z-index: 1;
-	height: 100%;
-	display: flex;
-	align-items: center;
-	font-size: 3.255814vw;
-	color: var(--color-text1) !important;
-	font-weight: 400;
-	padding-left: 8.372093vw;
-	line-height: 4.651163vw;
-	padding-top: 1.395349vw;
-	padding-bottom: 1.395349vw;
-}
-.style-module_searchInput__5zpUG .adm-input-element {
-	font-size: 14px;
-	color: var(--color-text1) !important;
-	font-weight: normal;
-	padding-left: 36px;
-	line-height: 20px;
-	padding-top: 6px;
-	padding-bottom: 6px;
-}
-.style-module_searchInput__5zpUG .adm-input-element::placeholder {
-	color: var(--color-text3) !important;
-}
-.style-module_searchInput__5zpUG .adm-input-clear {
-	margin-right: 6px;
-}
-.style-module_customSearchHistory__sDuK0 {
-	display: flex;
-	flex-direction: column-reverse;
-	align-items: flex-end;
-	margin-bottom: 24px;
-	position: relative;
-}
-.style-module_customSearchHistory__sDuK0::before {
-	content: '搜索历史';
-	position: absolute;
-	line-height: 24px;
-	top: 8px;
-	left: 12px;
-	font-size: 16px;
-	font-weight: bold;
-	color: var(--color-text1);
-}
-.style-module_customSearchHistory__sDuK0 > div {
-	padding: 0 12px;
-	height: 24px;
-	display: flex;
-	align-items: center;
-	margin: 0 !important;
-}
-.style-module_customSearchHistory__sDuK0 > div > span {
-	display: none;
-}
-.style-module_customSearchHistory__sDuK0 > div > svg {
-	display: block;
-	width: 16px;
-	height: 16px;
-	color: var(--color-text3);
-}
-.style-module_customSearchHistory__sDuK0 > ul {
-	margin-top: 12px;
-	display: flex;
-	gap: 12px;
-	flex-wrap: wrap;
-	padding: 0 12px;
-}
+import styleInject from "../../../node_modules/.pnpm/style-inject@0.3.0/node_modules/style-inject/dist/style-inject.es.mjs";
 
-.style-module_customSearchHistory__sDuK0 > ul > li {
-	width: auto;
-	padding: 0 12px;
-	height: 30px;
-	border-radius: 4px;
-	background-color: var(--color-bg2);
-	min-width: 40px;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-.style-module_customSearchHistory__sDuK0 > ul > li > svg {
-	display: none;
-}
-.style-module_customSearchHistory__sDuK0 > ul > li > div:nth-of-type(1) {
-	width: 100%;
-	line-height: 30px;
-	font-size: 14px;
-	max-width: 124px;
-	text-align: center;
-}
-.style-module_customSearchHistory__sDuK0 > ul > li > div:nth-of-type(2) {
-	display: none;
-}
-.style-module_hotInfoTitle__fVniI * {
-	color: var(--color-text1) !important;
-	font-size: 16px !important;
-	font-family: inherit !important;
-	font-weight: normal !important;
-}
-.style-module_hotInfoTitle__fVniI .mention {
-	color: #1fa7ff !important;
-}
-.style-module_gScrollBoxX__CRiTV {
-	overflow: hidden;
-	overflow-x: auto;
-	scroll-behavior: smooth;
-	will-change: scroll-position;
-	scrollbar-width: none;
-	-ms-overflow-style: none;
-}
-.style-module_gScrollBoxX__CRiTV::-webkit-scrollbar {
-	display: none; /* Chrome, Safari and Opera */
-}`,n={searchInput:`style-module_searchInput__5zpUG`,customSearchHistory:`style-module_customSearchHistory__sDuK0`,hotInfoTitle:`style-module_hotInfoTitle__fVniI`,gScrollBoxX:`style-module_gScrollBoxX__CRiTV`};e(t);export{n as default};
+//#region components/pages/search/style.module.css
+var css_248z = ".style-module_searchInput__5zpUG {\n	position: relative;\n	z-index: 1;\n	height: 100%;\n	display: flex;\n	align-items: center;\n	font-size: 3.255814vw;\n	color: var(--color-text1) !important;\n	font-weight: 400;\n	padding-left: 8.372093vw;\n	line-height: 4.651163vw;\n	padding-top: 1.395349vw;\n	padding-bottom: 1.395349vw;\n}\n.style-module_searchInput__5zpUG .adm-input-element {\n	font-size: 14px;\n	color: var(--color-text1) !important;\n	font-weight: normal;\n	padding-left: 36px;\n	line-height: 20px;\n	padding-top: 6px;\n	padding-bottom: 6px;\n}\n.style-module_searchInput__5zpUG .adm-input-element::placeholder {\n	color: var(--color-text3) !important;\n}\n.style-module_searchInput__5zpUG .adm-input-clear {\n	margin-right: 6px;\n}\n.style-module_customSearchHistory__sDuK0 {\n	display: flex;\n	flex-direction: column-reverse;\n	align-items: flex-end;\n	margin-bottom: 24px;\n	position: relative;\n}\n.style-module_customSearchHistory__sDuK0::before {\n	content: '搜索历史';\n	position: absolute;\n	line-height: 24px;\n	top: 8px;\n	left: 12px;\n	font-size: 16px;\n	font-weight: bold;\n	color: var(--color-text1);\n}\n.style-module_customSearchHistory__sDuK0 > div {\n	padding: 0 12px;\n	height: 24px;\n	display: flex;\n	align-items: center;\n	margin: 0 !important;\n}\n.style-module_customSearchHistory__sDuK0 > div > span {\n	display: none;\n}\n.style-module_customSearchHistory__sDuK0 > div > svg {\n	display: block;\n	width: 16px;\n	height: 16px;\n	color: var(--color-text3);\n}\n.style-module_customSearchHistory__sDuK0 > ul {\n	margin-top: 12px;\n	display: flex;\n	gap: 12px;\n	flex-wrap: wrap;\n	padding: 0 12px;\n}\n\n.style-module_customSearchHistory__sDuK0 > ul > li {\n	width: auto;\n	padding: 0 12px;\n	height: 30px;\n	border-radius: 4px;\n	background-color: var(--color-bg2);\n	min-width: 40px;\n	display: flex;\n	align-items: center;\n	justify-content: center;\n}\n.style-module_customSearchHistory__sDuK0 > ul > li > svg {\n	display: none;\n}\n.style-module_customSearchHistory__sDuK0 > ul > li > div:nth-of-type(1) {\n	width: 100%;\n	line-height: 30px;\n	font-size: 14px;\n	max-width: 124px;\n	text-align: center;\n}\n.style-module_customSearchHistory__sDuK0 > ul > li > div:nth-of-type(2) {\n	display: none;\n}\n.style-module_hotInfoTitle__fVniI * {\n	color: var(--color-text1) !important;\n	font-size: 16px !important;\n	font-family: inherit !important;\n	font-weight: normal !important;\n}\n.style-module_hotInfoTitle__fVniI .mention {\n	color: #1fa7ff !important;\n}\n.style-module_gScrollBoxX__CRiTV {\n	overflow: hidden;\n	overflow-x: auto;\n	scroll-behavior: smooth;\n	will-change: scroll-position;\n	scrollbar-width: none;\n	-ms-overflow-style: none;\n}\n.style-module_gScrollBoxX__CRiTV::-webkit-scrollbar {\n	display: none; /* Chrome, Safari and Opera */\n}";
+var style_module_default = {
+	"searchInput": "style-module_searchInput__5zpUG",
+	"customSearchHistory": "style-module_customSearchHistory__sDuK0",
+	"hotInfoTitle": "style-module_hotInfoTitle__fVniI",
+	"gScrollBoxX": "style-module_gScrollBoxX__CRiTV"
+};
+styleInject(css_248z);
+
+//#endregion
+export { style_module_default as default };

package/dist/components/pages/search/top-header.mjs

@@ -1,2 +1,92 @@
 
-"use client";import{Input as e}from"../../ui/input.mjs";import{useKeepAliveEffect as t,useKeepAliveState as n}from"../../common/keep-scroll-position/index.mjs";import{isPCEnv as r}from"../../../utils/tools.mjs";import{HeaderNav as i}from"../../common/header-nav/client.mjs";import a from"../../../assets/icons/search.mjs";import o from"../../../assets/icons/clear.mjs";import s from"./style.module.mjs";import{memo as c,useCallback as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";import{useTranslations as f}from"next-intl";import{useSearchParams as p}from"next/navigation";function m(){}const h=c(({setSearchInputVal:c,initInputVal:h,initInputVersion:g,addSearchHistory:_,clearCallback:v=m})=>{let y=f(`components.pages.search`),[b,x]=n(`search-input-val`,``),S=p().get(`q`),C=e=>{let t=e.target.value;x(t)},w=l(e=>{c(e),_(e)},[_,c]);return t(()=>{h&&(x(h),w(h))},[h,g],`search-init-input-effect`),t(()=>{S&&(x(S),w(S))},[S],`search-url-params-effect`),u(i,{className:`h-[55px]`,rightChild:u(`div`,{className:`cursor-pointer w-[52px] flex items-center justify-center`,onClick:()=>{b&&w(b)},children:u(`span`,{className:`text-[16px] text-text1`,children:y(`topHeader.search`)})}),centerChild:d(`header`,{className:`w-[calc(100%-52px-48px)] ml-[-15px] h-[35px] rounded-[20px] flex items-center justify-center relative overflow-hidden border-line1 border-[1px]`,children:[u(`div`,{className:`absolute left-0 top-0 w-full h-full bg-bg2 opacity-50`}),u(a,{className:`w-[16px] h-[16px] text-text3 absolute left-[12px] top-[9px] z-[1]`}),u(e,{placeholder:y(`topHeader.placeholder`),maxLength:20,value:b,className:s.searchInput,onChange:C,onKeyDown:e=>{if(e.key===`Enter`){if(e.preventDefault(),!b)return;w(b)}}}),b&&u(o,{className:`w-[15px] h-[15px] text-text3 z-10 absolute right-[12px]`,onClick:()=>{r()||(x(``),c(``),v())}})]})})});export{h as default};
+'use client';
+
+import { Input } from "../../ui/input.mjs";
+import { useKeepAliveEffect, useKeepAliveState } from "../../common/keep-scroll-position/index.mjs";
+import { isPCEnv } from "../../../utils/tools.mjs";
+import { HeaderNav } from "../../common/header-nav/client.mjs";
+import SvgSearch from "../../../assets/icons/search.mjs";
+import SvgClear from "../../../assets/icons/clear.mjs";
+import style_module_default from "./style.module.mjs";
+import { memo, useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+import { useSearchParams } from "next/navigation";
+
+//#region components/pages/search/top-header.tsx
+function noop() {}
+/**
+* 搜索页顶部输入栏。
+*/
+const SearchTopHeader = memo(({ setSearchInputVal, initInputVal, initInputVersion, addSearchHistory, clearCallback = noop }) => {
+	const t = useTranslations("components.pages.search");
+	const [inputVal, setInputVal] = useKeepAliveState("search-input-val", "");
+	const urlKeyword = useSearchParams().get("q");
+	const handleInputChange = (e) => {
+		const value = e.target.value;
+		setInputVal(value);
+	};
+	const handleSearchValue = useCallback((value) => {
+		setSearchInputVal(value);
+		addSearchHistory(value);
+	}, [addSearchHistory, setSearchInputVal]);
+	useKeepAliveEffect(() => {
+		if (initInputVal) {
+			setInputVal(initInputVal);
+			handleSearchValue(initInputVal);
+		}
+	}, [initInputVal, initInputVersion], "search-init-input-effect");
+	useKeepAliveEffect(() => {
+		if (urlKeyword) {
+			setInputVal(urlKeyword);
+			handleSearchValue(urlKeyword);
+		}
+	}, [urlKeyword], "search-url-params-effect");
+	return /* @__PURE__ */ jsx(HeaderNav, {
+		className: "h-[55px]",
+		rightChild: /* @__PURE__ */ jsx("div", {
+			className: "cursor-pointer w-[52px] flex items-center justify-center",
+			onClick: () => {
+				if (!inputVal) return;
+				handleSearchValue(inputVal);
+			},
+			children: /* @__PURE__ */ jsx("span", {
+				className: "text-[16px] text-text1",
+				children: t("topHeader.search")
+			})
+		}),
+		centerChild: /* @__PURE__ */ jsxs("header", {
+			className: "w-[calc(100%-52px-48px)] ml-[-15px] h-[35px] rounded-[20px] flex items-center justify-center relative overflow-hidden border-line1 border-[1px]",
+			children: [
+				/* @__PURE__ */ jsx("div", { className: "absolute left-0 top-0 w-full h-full bg-bg2 opacity-50" }),
+				/* @__PURE__ */ jsx(SvgSearch, { className: "w-[16px] h-[16px] text-text3 absolute left-[12px] top-[9px] z-[1]" }),
+				/* @__PURE__ */ jsx(Input, {
+					placeholder: t("topHeader.placeholder"),
+					maxLength: 20,
+					value: inputVal,
+					className: style_module_default.searchInput,
+					onChange: handleInputChange,
+					onKeyDown: (e) => {
+						if (e.key === "Enter") {
+							e.preventDefault();
+							if (!inputVal) return;
+							handleSearchValue(inputVal);
+						}
+					}
+				}),
+				inputVal && /* @__PURE__ */ jsx(SvgClear, {
+					className: "w-[15px] h-[15px] text-text3 z-10 absolute right-[12px]",
+					onClick: () => {
+						if (isPCEnv()) return;
+						setInputVal("");
+						setSearchInputVal("");
+						clearCallback();
+					}
+				})
+			]
+		})
+	});
+});
+
+//#endregion
+export { SearchTopHeader as default };