@funhub/platform 0.1.126 → 0.1.130

package/dist/components/biz/business/detail/shared/use-video-detail-webview-bridge.mjs

@@ -1,2 +1,90 @@
 
-"use client";import e from"../../../../../utils/get-res-url.mjs";import{decryptImageToUint8Array as t}from"../../../../../utils/decrypt-image-client.mjs";import{pInteractionBrowse as n}from"../../../../../service/generated/client.mjs";import{uint8ArrayToBase64 as r}from"../../../../../utils/uint8.mjs";import{batchQueryContentInteractions as i}from"../../../../../hooks/use-content-operate.mjs";import{useCallback as a,useEffect as o,useMemo as s}from"react";function c(c){let{enabled:l=!0,detailId:u=``,information:d,episodeIndex:f=0,currentSeriesNum:p=1}=c,m=s(()=>String(u||d?.id||``).trim(),[u,d?.id]),h=a(async()=>{let n=d?.links?.[f]?.m3u8_url||``,i=n?`${process.env.NEXT_PUBLIC_API_BASE}/api/content/processM3u8?url=${encodeURIComponent(`${e()}/m3f/${n}`)}`:``,a=d?.img_y||d?.img_x||d?.preview_images?.[0]||``,o=``,s=await t(a);return s&&(o=r(s.bytes)),{poster:o,src:i,title:d?.name||``}},[f,d]),g=a(async()=>{if(!m)return null;let e=await i([m],1);return e?.interaction_list?.[0]?e.interaction_list[0].browse_record:null},[m]),_=a(async e=>{if(!m)return;let t=e.browse_episode||p,r=Date.now(),i=String(e.browse_key||r);try{await n({app_id:0,content_type:1,content_id:m,browse_duration:Number(e.browse_duration||0),browse_episode:String(t),browse_key:i,browse_page_ts:r})}catch(e){console.error(`上报播放进度失败:`,e)}},[p,m]);o(()=>{if(!l||typeof window>`u`)return;let e=window;return e.video=m?{[m]:d}:{},e.getVideoInfoAsync=h,e.getVideoBrowseRecordAsync=g,e.reportVideoBrowse=_,()=>{e.getVideoInfoAsync===h&&delete e.getVideoInfoAsync,e.getVideoBrowseRecordAsync===g&&delete e.getVideoBrowseRecordAsync,e.reportVideoBrowse===_&&delete e.reportVideoBrowse}},[g,h,l,d,_,m])}export{c as useVideoDetailWebViewBridge};
+'use client';
+
+import getResUrl from "../../../../../utils/get-res-url.mjs";
+import { decryptImageToUint8Array } from "../../../../../utils/decrypt-image-client.mjs";
+import { pInteractionBrowse } from "../../../../../service/generated/client.mjs";
+import { uint8ArrayToBase64 } from "../../../../../utils/uint8.mjs";
+import { batchQueryContentInteractions } from "../../../../../hooks/use-content-operate.mjs";
+import { useCallback, useEffect, useMemo } from "react";
+
+//#region components/biz/business/detail/shared/use-video-detail-webview-bridge.ts
+/**
+* 同步 WebView 所需的全局方法与数据。
+*/
+function useVideoDetailWebViewBridge(options) {
+	const { enabled = true, detailId = "", information, episodeIndex = 0, currentSeriesNum = 1 } = options;
+	const resolvedDetailId = useMemo(() => {
+		return String(detailId || information?.id || "").trim();
+	}, [detailId, information?.id]);
+	/**
+	* WebView 拉取当前播放信息。
+	*/
+	const getVideoInfoAsync = useCallback(async () => {
+		const m3u8Url = information?.links?.[episodeIndex]?.m3u8_url || "";
+		const src = m3u8Url ? `${process.env.NEXT_PUBLIC_API_BASE}/api/content/processM3u8?url=${encodeURIComponent(`${getResUrl()}/m3f/${m3u8Url}`)}` : "";
+		const posterUrl = information?.img_y || information?.img_x || information?.preview_images?.[0] || "";
+		let posterBase64 = "";
+		const res = await decryptImageToUint8Array(posterUrl);
+		if (res) posterBase64 = uint8ArrayToBase64(res.bytes);
+		return {
+			poster: posterBase64,
+			src,
+			title: information?.name || ""
+		};
+	}, [episodeIndex, information]);
+	/**
+	* WebView 拉取播放历史。
+	*/
+	const getVideoBrowseRecordAsync = useCallback(async () => {
+		if (!resolvedDetailId) return null;
+		const res = await batchQueryContentInteractions([resolvedDetailId], 1);
+		if (res?.interaction_list?.[0]) return res.interaction_list[0].browse_record;
+		return null;
+	}, [resolvedDetailId]);
+	/**
+	* WebView 上报播放进度。
+	*/
+	const reportVideoBrowse = useCallback(async (payload) => {
+		if (!resolvedDetailId) return;
+		const resolvedBrowseEpisode = payload.browse_episode || currentSeriesNum;
+		const browsePageTs = Date.now();
+		const browseKey = String(payload.browse_key || browsePageTs);
+		try {
+			await pInteractionBrowse({
+				app_id: 0,
+				content_type: 1,
+				content_id: resolvedDetailId,
+				browse_duration: Number(payload.browse_duration || 0),
+				browse_episode: String(resolvedBrowseEpisode),
+				browse_key: browseKey,
+				browse_page_ts: browsePageTs
+			});
+		} catch (error) {
+			console.error("上报播放进度失败:", error);
+		}
+	}, [currentSeriesNum, resolvedDetailId]);
+	useEffect(() => {
+		if (!enabled || typeof window === "undefined") return;
+		const runtimeWindow = window;
+		runtimeWindow.video = resolvedDetailId ? { [resolvedDetailId]: information } : {};
+		runtimeWindow.getVideoInfoAsync = getVideoInfoAsync;
+		runtimeWindow.getVideoBrowseRecordAsync = getVideoBrowseRecordAsync;
+		runtimeWindow.reportVideoBrowse = reportVideoBrowse;
+		return () => {
+			if (runtimeWindow.getVideoInfoAsync === getVideoInfoAsync) delete runtimeWindow.getVideoInfoAsync;
+			if (runtimeWindow.getVideoBrowseRecordAsync === getVideoBrowseRecordAsync) delete runtimeWindow.getVideoBrowseRecordAsync;
+			if (runtimeWindow.reportVideoBrowse === reportVideoBrowse) delete runtimeWindow.reportVideoBrowse;
+		};
+	}, [
+		getVideoBrowseRecordAsync,
+		getVideoInfoAsync,
+		enabled,
+		information,
+		reportVideoBrowse,
+		resolvedDetailId
+	]);
+}
+
+//#endregion
+export { useVideoDetailWebViewBridge };

package/dist/components/biz/business/detail/shared/video-detail-server-data.mjs

@@ -1,2 +1,47 @@
 
-import{gContentGetVideoDetail as e}from"../../../../../service/generated/client.mjs";import{cache as t}from"react";function n(e){if(!e||typeof e!=`object`)return null;let t=e,n=Array.isArray(t.links)?t.links:[];return{...t,mid:String(t.mid||t.id||``),content_type:1,episode_cnt:n.length}}const r=t(async t=>{let r=String(t||``).trim();if(!r)return null;try{return n((await e({id:r},{revalidate:86400,tags:[`video-detail:ssr:${r}`]})).data?.video)}catch(e){return console.error(`详情物料服务端获取视频详情失败`,e),null}});async function i(e){let t=String(e||``).trim();return t?await r(t):null}export{i as getVideoDetailServerInformation};
+import { gContentGetVideoDetail } from "../../../../../service/generated/client.mjs";
+import { cache } from "react";
+
+//#region components/biz/business/detail/shared/video-detail-server-data.ts
+const VIDEO_DETAIL_SERVER_REVALIDATE_SECONDS = 1440 * 60;
+/**
+* 将视频详情接口数据映射为详情物料可消费的运行时信息。
+*/
+function normalizeVideoDetailToInformation(detail) {
+	if (!detail || typeof detail !== "object") return null;
+	const raw = detail;
+	const links = Array.isArray(raw.links) ? raw.links : [];
+	return {
+		...raw,
+		mid: String(raw.mid || raw.id || ""),
+		content_type: 1,
+		episode_cnt: links.length
+	};
+}
+/**
+* 服务端获取视频详情（24 小时缓存 + 同请求去重）。
+*/
+const fetchVideoDetailInformationCached = cache(async (detailId) => {
+	const resolvedDetailId = String(detailId || "").trim();
+	if (!resolvedDetailId) return null;
+	try {
+		return normalizeVideoDetailToInformation((await gContentGetVideoDetail({ id: resolvedDetailId }, {
+			revalidate: VIDEO_DETAIL_SERVER_REVALIDATE_SECONDS,
+			tags: [`video-detail:ssr:${resolvedDetailId}`]
+		})).data?.video);
+	} catch (error) {
+		console.error("详情物料服务端获取视频详情失败", error);
+		return null;
+	}
+});
+/**
+* 获取详情物料服务端渲染所需的视频信息。
+*/
+async function getVideoDetailServerInformation(detailId) {
+	const resolvedDetailId = String(detailId || "").trim();
+	if (!resolvedDetailId) return null;
+	return await fetchVideoDetailInformationCached(resolvedDetailId);
+}
+
+//#endregion
+export { getVideoDetailServerInformation };

package/dist/components/biz/business/detail/shared/video-hero.mjs

@@ -1,2 +1,396 @@
 
-"use client";import{cn as e}from"../../../../../utils/cn.mjs";import{pxToVw as t}from"../../../../../utils/helper.mjs";import{Image as n}from"../../../../ui/image.mjs";import{Box as r}from"../../../../ui/box.mjs";import{Text as i}from"../../../../ui/text.mjs";import{useBrowseReport as a}from"../../../../../hooks/use-browse-report.mjs";import{MediaPreview as o,useMediaPreview as s}from"../../../../common/media-preview/index.mjs";import c from"../../../../common/video-player/index.mjs";import{UserActivityMediaGrid as l}from"../../../../common/list/user-activity-list/user-activity-list-item.mjs";import{memo as u,useCallback as d,useEffect as f,useMemo as p,useRef as m}from"react";import{Fragment as h,jsx as g,jsxs as _}from"react/jsx-runtime";import{useTranslations as v}from"next-intl";const y=u(({mode:t=`renderer`,information:n,isVideo:a,episodeIndex:c=0,resumeProgressSeconds:u=0,className:f=``})=>{let m=t===`editor`,h=p(()=>({id:n.id,name:n.name,preview_images:n.preview_images,img_y:n.img_y,img_x:n.img_x}),[n.id,n.name,n.preview_images,n.img_y,n.img_x]),v=p(()=>{let e=n?.medias,t=Array.isArray(e)?e.filter(Boolean):[];return t.length>0?t:(h.preview_images?.length?h.preview_images:[h.img_y||h.img_x||``].filter(Boolean)).filter(Boolean).map(e=>({media_url:e,is_video:!1,cover_image:``}))},[h.img_x,h.img_y,h.preview_images,n]),y=s(),x=p(()=>v.filter(Boolean).map(e=>{let t=e?.is_video?`video`:`image`,r=String(e?.media_url||``),i=e?.cover_image||n.img_y||n.img_x;return{src:r,type:t,...i?{cover:String(i)}:{}}}).filter(e=>!!e.src),[n.img_x,n.img_y,v]),S=d(e=>{m||!x.length||y.open(x,e)},[m,y,x]);return m?g(`img`,{src:`/static/components-thumb/video_player.png`,alt:`video-preview`,className:`w-full block`}):a?g(b,{information:n,episodeIndex:c,resumeProgressSeconds:u,isEditor:m}):_(`div`,{className:e(`w-full`,f),children:[_(r,{className:`mt-3 px-[12px] space-y-1`,children:[g(i,{as:`p`,className:`break-all`,dangerouslySetInnerHTML:{__html:n.description}}),g(l,{medias:v,onItemClick:S})]}),g(o,{})]})});y.displayName=`DetailHero`;const b=u(({information:e,episodeIndex:t,resumeProgressSeconds:n,isEditor:r})=>{let i=p(()=>({id:e.id,mid:e.mid,img_width:e.img_width,img_height:e.img_height,img_y:e.img_y,img_x:e.img_x,preview_images:e.preview_images}),[e.id,e.mid,e.img_width,e.img_height,e.img_y,e.img_x,e.preview_images]);return g(x,{information:{...e,...i},episodeIndex:t,resumeProgressSeconds:n,isEditor:r})},(e,t)=>{let n=e.information,r=t.information;return n.id===r.id&&n.mid===r.mid&&n.img_width===r.img_width&&n.img_height===r.img_height&&n.img_y===r.img_y&&n.img_x===r.img_x&&e.resumeProgressSeconds===t.resumeProgressSeconds&&e.episodeIndex===t.episodeIndex&&e.isEditor===t.isEditor});b.displayName=`StableDetailPlayerBox`;function x({information:e,episodeIndex:i,resumeProgressSeconds:o,isEditor:s}){let l=v(`components.biz.business.detail`),u=m(0),y=m(0),b=Math.max(0,Number(i)||0),x=b+1,T=p(()=>e?.id,[e?.id]),E=p(()=>({id:e.id,mid:e.mid,img_width:e.img_width,img_height:e.img_height,img_y:e.img_y,img_x:e.img_x,preview_images:e.preview_images,links:e.links}),[e.id,e.mid,e.img_width,e.img_height,e.img_y,e.img_x,e.preview_images,e.links]),D=p(()=>E.mid||E.id,[E.id,E.mid]),O=p(()=>{let e=E.links?.[b]?.id;return e?String(e):`ep-${b+1}`},[b,E.links]),k=p(()=>`__reportData_detail_page__${E.id}:${O}`,[O,E.id]),A=p(()=>{if(s||typeof window>`u`)return 0;try{let e=sessionStorage.getItem(k);if(!e)return 0;let t=JSON.parse(e),n=Number(t.currentTime||0),r=Number(t.duration||0);if(!Number.isFinite(n)||!Number.isFinite(r))return 0;if(n>0&&r>0)return n}catch(e){console.error(`读取 sessionStorage 数据失败:`,e)}return 0},[s,k]),j=p(()=>{let e=Number(o||0);return Number.isFinite(e)&&e>0?e:0},[o]),M=p(()=>j>0?j:A,[j,A]),N=p(()=>{let t=w(e),n=t[t.length?Math.max(0,Math.min(b,t.length-1)):0]?.url||``,r=!!t.length;if(!r)return{hasVideo:!1,hlsList:[],videoUrl:``,width:1,height:1,resolution:`0x0`,aspectRatio:1,poster:``};let i=Number(E.img_width||0)||1,a=Number(E.img_height||0)||1;return{hasVideo:r,hlsList:t,videoUrl:n,width:i,height:a,resolution:S(i,a),aspectRatio:(i||1)/(a||1),poster:E.img_y||E.img_x||E.preview_images?.[0]||``}},[e.id,e.links,b,E.img_width,E.img_height,E.img_y,E.img_x,E.preview_images]),P=d((e,t)=>{u.current=e,y.current=t},[]),F=p(()=>N.videoUrl.endsWith(`m3u8`)?{startTimeSeconds:M,preload:`none`}:{startTimeSeconds:M},[M,N.videoUrl]);f(()=>{u.current=0,y.current=0},[T,b]);let I=a({contentId:T,browseEpisode:x,contentType:1,enabled:!s&&!!T,intervalMs:60*1e3,getCurrentTimeSeconds:()=>u.current,getDurationSeconds:()=>y.current});if(f(()=>{if(s)return;let e=()=>{if(!(typeof window>`u`)&&!(u.current<=0||y.current<=0))try{sessionStorage.setItem(k,JSON.stringify({episodeId:O,currentTime:u.current,duration:y.current}))}catch(e){console.error(`写入 sessionStorage 失败:`,e)}},t=()=>{e()},n=()=>{document.visibilityState===`hidden`&&e()},r=()=>{e()};return window.addEventListener(`beforeunload`,t),document.addEventListener(`visibilitychange`,n),window.addEventListener(`popstate`,r),()=>{window.removeEventListener(`beforeunload`,t),document.removeEventListener(`visibilitychange`,n),window.removeEventListener(`popstate`,r),e()}},[O,s,k]),!N.hasVideo)return g(`div`,{className:`mt-3 rounded-xl bg-bg1 px-3 py-10 text-center text-text3`,children:l(`videoHero.noVideos`)});let L=C(430,N.aspectRatio,242),R=L.height>0?t(L.height):`auto`,z=L.height>0?`calc(${R} + 0px)`:`auto`,B=t(242);return _(h,{children:[g(r,{suppressHydrationWarning:!0,className:`w-full`,style:{height:z,maxWidth:`100%`,maxHeight:`calc(${B} + 0px)`}}),_(r,{className:`w-full relative bg-bg2 !fixed !top-[44px] !left-0 z-[10]`,children:[N.poster&&_(`div`,{className:`w-full h-full bg-bg2 absolute top-0 left-0 z-[1] overflow-hidden`,style:{height:R},children:[g(n,{src:N.poster,alt:l(`videoHero.coverAlt`),fill:!0,className:`object-cover`,priority:!0}),g(`div`,{className:`w-full h-full absolute top-0 left-0 z-[1] bg-[rgba(255,255,255,0.2)] backdrop-blur-[4px]`})]}),g(r,{suppressHydrationWarning:!0,"data-aspect-ratio":N.resolution,className:`w-full overflow-hidden flex justify-center relative z-[2]`,style:{height:R,maxWidth:`100%`,maxHeight:B,backdropFilter:`blur(0)`,WebkitBackdropFilter:`blur(0)`},children:g(c,{plyerId:`detail-player-${E.id}-${b}`,parentId:D,resolution:N.resolution||`0x0`,videoUrl:N.videoUrl,poster:N.poster,mergeConfig:F,onProgressUpdate:s?void 0:P,onPlay:s?void 0:I.handlePlay,onPause:s?void 0:I.handlePause,onEnded:s?void 0:I.handleEnded},`stable-player-${E.id}-${b}`)})]})]})}function S(e,t){return!e||!t?``:`${e}x${t}`}function C(e,t,n){let r=e/t;return r<=n?{width:e,height:r}:{width:n*t,height:n}}function w(e){let t=e.links||[];return t.length>0?t.map((e,t)=>({text:e.name||String(t+1),url:e.m3u8_url||e.preview_m3u8_url||``,definition:``,isDefault:t===0})).filter(e=>e.url):[]}export{y as DetailHero};
+'use client';
+
+import { cn } from "../../../../../utils/cn.mjs";
+import { pxToVw } from "../../../../../utils/helper.mjs";
+import { Image } from "../../../../ui/image.mjs";
+import { Box } from "../../../../ui/box.mjs";
+import { Text } from "../../../../ui/text.mjs";
+import { useBrowseReport } from "../../../../../hooks/use-browse-report.mjs";
+import { MediaPreview, useMediaPreview } from "../../../../common/media-preview/index.mjs";
+import CommonPlayer from "../../../../common/video-player/index.mjs";
+import { UserActivityMediaGrid } from "../../../../common/list/user-activity-list/user-activity-list-item.mjs";
+import { memo, useCallback, useEffect, useMemo, useRef } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+
+//#region components/biz/business/detail/shared/video-hero.tsx
+const DETAIL_VIDEO_MAX_HEIGHT = 242;
+const DETAIL_SEARCH_BAR_HEIGHT = 0;
+const VIDEO_PROGRESS_SESSION_KEY = "__reportData_detail_page__";
+const DetailHero = memo(({ mode = "renderer", information, isVideo, episodeIndex = 0, resumeProgressSeconds = 0, className = "" }) => {
+	const isEditor = mode === "editor";
+	const imageData = useMemo(() => ({
+		id: information.id,
+		name: information.name,
+		preview_images: information.preview_images,
+		img_y: information.img_y,
+		img_x: information.img_x
+	}), [
+		information.id,
+		information.name,
+		information.preview_images,
+		information.img_y,
+		information.img_x
+	]);
+	const resolvedMedias = useMemo(() => {
+		const rawMedias = information?.medias;
+		const medias = Array.isArray(rawMedias) ? rawMedias.filter(Boolean) : [];
+		if (medias.length > 0) return medias;
+		return (imageData.preview_images?.length ? imageData.preview_images : [imageData.img_y || imageData.img_x || ""].filter(Boolean)).filter(Boolean).map((url) => ({
+			media_url: url,
+			is_video: false,
+			cover_image: ""
+		}));
+	}, [
+		imageData.img_x,
+		imageData.img_y,
+		imageData.preview_images,
+		information
+	]);
+	const mediaPreview = useMediaPreview();
+	const mediaPreviewItems = useMemo(() => {
+		return resolvedMedias.filter(Boolean).map((media) => {
+			const type = media?.is_video ? "video" : "image";
+			const src = String(media?.media_url || "");
+			const cover = media?.cover_image || information.img_y || information.img_x;
+			return {
+				src,
+				type,
+				...cover ? { cover: String(cover) } : {}
+			};
+		}).filter((item) => Boolean(item.src));
+	}, [
+		information.img_x,
+		information.img_y,
+		resolvedMedias
+	]);
+	const handleMediaPreviewOpen = useCallback((startIndex) => {
+		if (isEditor || !mediaPreviewItems.length) return;
+		mediaPreview.open(mediaPreviewItems, startIndex);
+	}, [
+		isEditor,
+		mediaPreview,
+		mediaPreviewItems
+	]);
+	if (isEditor) return /* @__PURE__ */ jsx("img", {
+		src: "/static/components-thumb/video_player.png",
+		alt: "video-preview",
+		className: "w-full block"
+	});
+	if (isVideo) return /* @__PURE__ */ jsx(StableDetailPlayerBox, {
+		information,
+		episodeIndex,
+		resumeProgressSeconds,
+		isEditor
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("w-full", className),
+		children: [/* @__PURE__ */ jsxs(Box, {
+			className: "mt-3 px-[12px] space-y-1",
+			children: [/* @__PURE__ */ jsx(Text, {
+				as: "p",
+				className: "break-all",
+				dangerouslySetInnerHTML: { __html: information.description }
+			}), /* @__PURE__ */ jsx(UserActivityMediaGrid, {
+				medias: resolvedMedias,
+				onItemClick: handleMediaPreviewOpen
+			})]
+		}), /* @__PURE__ */ jsx(MediaPreview, {})]
+	});
+});
+DetailHero.displayName = "DetailHero";
+/**
+* 稳定的播放器组件包装器，防止因为 information 对象引用变化导致播放器重新创建
+*/
+const StableDetailPlayerBox = memo(({ information, episodeIndex, resumeProgressSeconds, isEditor }) => {
+	const stableProps = useMemo(() => ({
+		id: information.id,
+		mid: information.mid,
+		img_width: information.img_width,
+		img_height: information.img_height,
+		img_y: information.img_y,
+		img_x: information.img_x,
+		preview_images: information.preview_images
+	}), [
+		information.id,
+		information.mid,
+		information.img_width,
+		information.img_height,
+		information.img_y,
+		information.img_x,
+		information.preview_images
+	]);
+	return /* @__PURE__ */ jsx(DetailPlayerBox, {
+		information: {
+			...information,
+			...stableProps
+		},
+		episodeIndex,
+		resumeProgressSeconds,
+		isEditor
+	});
+}, (prevProps, nextProps) => {
+	const prev = prevProps.information;
+	const next = nextProps.information;
+	return prev.id === next.id && prev.mid === next.mid && prev.img_width === next.img_width && prev.img_height === next.img_height && prev.img_y === next.img_y && prev.img_x === next.img_x && prevProps.resumeProgressSeconds === nextProps.resumeProgressSeconds && prevProps.episodeIndex === nextProps.episodeIndex && prevProps.isEditor === nextProps.isEditor;
+});
+StableDetailPlayerBox.displayName = "StableDetailPlayerBox";
+/**
+* 详情页视频播放器容器，固定吸顶展示。
+*/
+function DetailPlayerBox({ information, episodeIndex, resumeProgressSeconds, isEditor }) {
+	const t = useTranslations("components.biz.business.detail");
+	const currentTimeRef = useRef(0);
+	const videoDurationRef = useRef(0);
+	const episodeNumber = Math.max(0, Number(episodeIndex) || 0);
+	const browseEpisode = episodeNumber + 1;
+	const browseContentId = useMemo(() => {
+		return information?.id;
+	}, [information?.id]);
+	const playerData = useMemo(() => ({
+		id: information.id,
+		mid: information.mid,
+		img_width: information.img_width,
+		img_height: information.img_height,
+		img_y: information.img_y,
+		img_x: information.img_x,
+		preview_images: information.preview_images,
+		links: information.links
+	}), [
+		information.id,
+		information.mid,
+		information.img_width,
+		information.img_height,
+		information.img_y,
+		information.img_x,
+		information.preview_images,
+		information.links
+	]);
+	const parentId = useMemo(() => {
+		return playerData.mid || playerData.id;
+	}, [playerData.id, playerData.mid]);
+	const currentEpisodeId = useMemo(() => {
+		const episodeId = playerData.links?.[episodeNumber]?.id;
+		if (episodeId) return String(episodeId);
+		return `ep-${episodeNumber + 1}`;
+	}, [episodeNumber, playerData.links]);
+	const localProgressStorageKey = useMemo(() => {
+		return `${VIDEO_PROGRESS_SESSION_KEY}${playerData.id}:${currentEpisodeId}`;
+	}, [currentEpisodeId, playerData.id]);
+	const sessionResumeSeconds = useMemo(() => {
+		if (isEditor || typeof window === "undefined") return 0;
+		try {
+			const data = sessionStorage.getItem(localProgressStorageKey);
+			if (!data) return 0;
+			const parsed = JSON.parse(data);
+			const currentTime = Number(parsed.currentTime || 0);
+			const duration = Number(parsed.duration || 0);
+			if (!Number.isFinite(currentTime) || !Number.isFinite(duration)) return 0;
+			if (currentTime > 0 && duration > 0) return currentTime;
+		} catch (error) {
+			console.error("读取 sessionStorage 数据失败:", error);
+		}
+		return 0;
+	}, [isEditor, localProgressStorageKey]);
+	const apiResumeSeconds = useMemo(() => {
+		const seconds = Number(resumeProgressSeconds || 0);
+		return Number.isFinite(seconds) && seconds > 0 ? seconds : 0;
+	}, [resumeProgressSeconds]);
+	const startTimeSeconds = useMemo(() => {
+		return apiResumeSeconds > 0 ? apiResumeSeconds : sessionResumeSeconds;
+	}, [apiResumeSeconds, sessionResumeSeconds]);
+	const videoData = useMemo(() => {
+		const hlsList = extractHlsList(information);
+		const videoUrl = hlsList[hlsList.length ? Math.max(0, Math.min(episodeNumber, hlsList.length - 1)) : 0]?.url || "";
+		const hasVideo = Boolean(hlsList.length);
+		if (!hasVideo) return {
+			hasVideo: false,
+			hlsList: [],
+			videoUrl: "",
+			width: 1,
+			height: 1,
+			resolution: "0x0",
+			aspectRatio: 1,
+			poster: ""
+		};
+		const width = Number(playerData.img_width || 0) || 1;
+		const height = Number(playerData.img_height || 0) || 1;
+		return {
+			hasVideo,
+			hlsList,
+			videoUrl,
+			width,
+			height,
+			resolution: buildResolutionText(width, height),
+			aspectRatio: (width || 1) / (height || 1),
+			poster: playerData.img_y || playerData.img_x || playerData.preview_images?.[0] || ""
+		};
+	}, [
+		information.id,
+		information.links,
+		episodeNumber,
+		playerData.img_width,
+		playerData.img_height,
+		playerData.img_y,
+		playerData.img_x,
+		playerData.preview_images
+	]);
+	/**
+	* 记录播放进度，便于下次进入恢复播放。
+	*/
+	const handleProgressUpdate = useCallback((currentTime, duration) => {
+		currentTimeRef.current = currentTime;
+		videoDurationRef.current = duration;
+	}, []);
+	const playerMergeConfig = useMemo(() => {
+		if (videoData.videoUrl.endsWith("m3u8")) return {
+			startTimeSeconds,
+			preload: "none"
+		};
+		return { startTimeSeconds };
+	}, [startTimeSeconds, videoData.videoUrl]);
+	useEffect(() => {
+		currentTimeRef.current = 0;
+		videoDurationRef.current = 0;
+	}, [browseContentId, episodeNumber]);
+	const browseReport = useBrowseReport({
+		contentId: browseContentId,
+		browseEpisode,
+		contentType: 1,
+		enabled: !isEditor && Boolean(browseContentId),
+		intervalMs: 60 * 1e3,
+		getCurrentTimeSeconds: () => currentTimeRef.current,
+		getDurationSeconds: () => videoDurationRef.current
+	});
+	useEffect(() => {
+		if (isEditor) return;
+		const persistProgress = () => {
+			if (typeof window === "undefined") return;
+			if (currentTimeRef.current <= 0 || videoDurationRef.current <= 0) return;
+			try {
+				sessionStorage.setItem(localProgressStorageKey, JSON.stringify({
+					episodeId: currentEpisodeId,
+					currentTime: currentTimeRef.current,
+					duration: videoDurationRef.current
+				}));
+			} catch (error) {
+				console.error("写入 sessionStorage 失败:", error);
+			}
+		};
+		const handleBeforeUnload = () => {
+			persistProgress();
+		};
+		const handleVisibilityChange = () => {
+			if (document.visibilityState === "hidden") persistProgress();
+		};
+		const handlePopState = () => {
+			persistProgress();
+		};
+		window.addEventListener("beforeunload", handleBeforeUnload);
+		document.addEventListener("visibilitychange", handleVisibilityChange);
+		window.addEventListener("popstate", handlePopState);
+		return () => {
+			window.removeEventListener("beforeunload", handleBeforeUnload);
+			document.removeEventListener("visibilitychange", handleVisibilityChange);
+			window.removeEventListener("popstate", handlePopState);
+			persistProgress();
+		};
+	}, [
+		currentEpisodeId,
+		isEditor,
+		localProgressStorageKey
+	]);
+	if (!videoData.hasVideo) return /* @__PURE__ */ jsx("div", {
+		className: "mt-3 rounded-xl bg-bg1 px-3 py-10 text-center text-text3",
+		children: t("videoHero.noVideos")
+	});
+	const dimensions = calculateVideoDimensions(430, videoData.aspectRatio, DETAIL_VIDEO_MAX_HEIGHT);
+	const playerHeight = dimensions.height > 0 ? pxToVw(dimensions.height) : "auto";
+	const playerReservedHeight = dimensions.height > 0 ? `calc(${playerHeight} + ${DETAIL_SEARCH_BAR_HEIGHT}px)` : "auto";
+	const playerMaxHeight = pxToVw(DETAIL_VIDEO_MAX_HEIGHT);
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Box, {
+		suppressHydrationWarning: true,
+		className: "w-full",
+		style: {
+			height: playerReservedHeight,
+			maxWidth: "100%",
+			maxHeight: `calc(${playerMaxHeight} + ${DETAIL_SEARCH_BAR_HEIGHT}px)`
+		}
+	}), /* @__PURE__ */ jsxs(Box, {
+		className: "w-full relative bg-bg2 !fixed !top-[44px] !left-0 z-[10]",
+		children: [videoData.poster && /* @__PURE__ */ jsxs("div", {
+			className: "w-full h-full bg-bg2 absolute top-0 left-0 z-[1] overflow-hidden",
+			style: { height: playerHeight },
+			children: [/* @__PURE__ */ jsx(Image, {
+				src: videoData.poster,
+				alt: t("videoHero.coverAlt"),
+				fill: true,
+				className: "object-cover",
+				priority: true
+			}), /* @__PURE__ */ jsx("div", { className: "w-full h-full absolute top-0 left-0 z-[1] bg-[rgba(255,255,255,0.2)] backdrop-blur-[4px]" })]
+		}), /* @__PURE__ */ jsx(Box, {
+			suppressHydrationWarning: true,
+			"data-aspect-ratio": videoData.resolution,
+			className: "w-full overflow-hidden flex justify-center relative z-[2]",
+			style: {
+				height: playerHeight,
+				maxWidth: "100%",
+				maxHeight: playerMaxHeight,
+				backdropFilter: "blur(0)",
+				WebkitBackdropFilter: "blur(0)"
+			},
+			children: /* @__PURE__ */ jsx(CommonPlayer, {
+				plyerId: `detail-player-${playerData.id}-${episodeNumber}`,
+				parentId,
+				resolution: videoData.resolution || "0x0",
+				videoUrl: videoData.videoUrl,
+				poster: videoData.poster,
+				mergeConfig: playerMergeConfig,
+				onProgressUpdate: isEditor ? void 0 : handleProgressUpdate,
+				onPlay: isEditor ? void 0 : browseReport.handlePlay,
+				onPause: isEditor ? void 0 : browseReport.handlePause,
+				onEnded: isEditor ? void 0 : browseReport.handleEnded
+			}, `stable-player-${playerData.id}-${episodeNumber}`)
+		})]
+	})] });
+}
+/**
+* 构建分辨率文本
+*/
+function buildResolutionText(width, height) {
+	if (!width || !height) return "";
+	return `${width}x${height}`;
+}
+/**
+* 计算视频尺寸
+*/
+function calculateVideoDimensions(parentWidth, aspectRatio, maxHeight) {
+	const heightFromWidth = parentWidth / aspectRatio;
+	if (heightFromWidth <= maxHeight) return {
+		width: parentWidth,
+		height: heightFromWidth
+	};
+	return {
+		width: maxHeight * aspectRatio,
+		height: maxHeight
+	};
+}
+/**
+* 提取 HLS 播放列表
+*/
+function extractHlsList(info) {
+	const linkList = info.links || [];
+	if (linkList.length > 0) return linkList.map((item, index) => {
+		return {
+			text: item.name || String(index + 1),
+			url: item.m3u8_url || item.preview_m3u8_url || "",
+			definition: "",
+			isDefault: index === 0
+		};
+	}).filter((item) => item.url);
+	return [];
+}
+
+//#endregion
+export { DetailHero };

package/dist/components/biz/business/detail/video-detail-actions/client.mjs

@@ -1,2 +1,107 @@
 
-"use client";import{useRequest as e}from"../../../../../hooks/query/use-query.mjs";import{batchQueryContentInteractions as t}from"../../../../../hooks/use-content-operate.mjs";import{DetailOperate as n}from"../shared/detail-operate.mjs";import{editorPreviewInformation as r}from"../shared/editor-preview.mjs";import{useVideoDetailMaterialRuntimeContext as i}from"../shared/runtime-context-provider.mjs";import{useCallback as a,useEffect as o,useRef as s,useState as c}from"react";import{jsx as l}from"react/jsx-runtime";function u({mode:u=`renderer`}){let d=i(),f=d?.information,p=d?.onUpdateInformation,m=!!d?.isWebView,h=u===`editor`,g=u===`renderer`,_=h,v=_?r:f,[y,b]=c(v),x=s(v),S=s(``);o(()=>{b(v)},[v]);let C=p?v:y;o(()=>{x.current=C},[C]);let w=g&&!m&&!!v?.id,{data:T}=e([`video-detail-actions-interaction`,v?.id],async()=>v?.id?await t([v.id],1):null,{enabled:w,staleTime:0,refetchOnMount:`always`,refetchOnWindowFocus:!1}),E=a(e=>{if(!_){if(p){p(e);return}b(t=>{if(!t)return t;let n=e.static?{...t.static||{},...e.static||{}}:t.static;return{...t,...e,static:n}})}},[p,_]);return o(()=>{let e=T?.interaction_list?.[0],t=x.current;if(!e||!t)return;let n=`${e.is_liked?1:0}-${e.is_disliked?1:0}-${e.is_collected?1:0}`;if(S.current===n)return;S.current=n;let r=e.is_liked||!1,i=e.is_disliked||!1,a=e.is_collected||!1,o=!!t.like,s=!!t.dislike,c=!!t.collect,l=t.static?.like_cnt,u=typeof l==`number`?l:Number(l||0),d=u;!r&&u>0?d=Math.max(0,u-1):o===r?r&&u===0&&(d=1):d=Math.max(0,u+(r?1:-1));let f=d!==u;o===r&&s===i&&c===a&&!f||E({like:r,dislike:i,collect:a,...f?{static:{...t.static||{},like_cnt:d}}:{}})},[E,T]),C?l(`div`,{className:_?`pointer-events-none`:void 0,children:l(n,{mode:u,information:C,onUpdate:E})}):null}export{u as VideoDetailActionsClient};
+'use client';
+
+import { useRequest } from "../../../../../hooks/query/use-query.mjs";
+import { batchQueryContentInteractions } from "../../../../../hooks/use-content-operate.mjs";
+import { DetailOperate } from "../shared/detail-operate.mjs";
+import { editorPreviewInformation } from "../shared/editor-preview.mjs";
+import { useVideoDetailMaterialRuntimeContext } from "../shared/runtime-context-provider.mjs";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region components/biz/business/detail/video-detail-actions/client.tsx
+/**
+* 视频详情行为模块客户端组件。
+*/
+function VideoDetailActionsClient({ mode = "renderer" }) {
+	const runtimeContext = useVideoDetailMaterialRuntimeContext();
+	const information = runtimeContext?.information;
+	const onUpdate = runtimeContext?.onUpdateInformation;
+	const isWebView = Boolean(runtimeContext?.isWebView);
+	const isEditor = mode === "editor";
+	const isRenderer = mode === "renderer";
+	const shouldUsePreview = isEditor;
+	const fallbackInformation = shouldUsePreview ? editorPreviewInformation : information;
+	const [localInformation, setLocalInformation] = useState(fallbackInformation);
+	const latestResolvedInformationRef = useRef(fallbackInformation);
+	const lastHydratedInteractionKeyRef = useRef("");
+	useEffect(() => {
+		setLocalInformation(fallbackInformation);
+	}, [fallbackInformation]);
+	const resolvedInformation = onUpdate ? fallbackInformation : localInformation;
+	useEffect(() => {
+		latestResolvedInformationRef.current = resolvedInformation;
+	}, [resolvedInformation]);
+	const shouldHydrateInteraction = isRenderer && !isWebView && Boolean(fallbackInformation?.id);
+	const { data: interactionData } = useRequest(["video-detail-actions-interaction", fallbackInformation?.id], async () => {
+		if (!fallbackInformation?.id) return null;
+		return await batchQueryContentInteractions([fallbackInformation.id], 1);
+	}, {
+		enabled: shouldHydrateInteraction,
+		staleTime: 0,
+		refetchOnMount: "always",
+		refetchOnWindowFocus: false
+	});
+	const handleUpdate = useCallback((data) => {
+		if (shouldUsePreview) return;
+		if (onUpdate) {
+			onUpdate(data);
+			return;
+		}
+		setLocalInformation((prev) => {
+			if (!prev) return prev;
+			const nextStatic = data.static ? {
+				...prev.static || {},
+				...data.static || {}
+			} : prev.static;
+			return {
+				...prev,
+				...data,
+				static: nextStatic
+			};
+		});
+	}, [onUpdate, shouldUsePreview]);
+	useEffect(() => {
+		const interaction = interactionData?.interaction_list?.[0];
+		const currentInfo = latestResolvedInformationRef.current;
+		if (!interaction || !currentInfo) return;
+		const interactionKey = `${interaction.is_liked ? 1 : 0}-${interaction.is_disliked ? 1 : 0}-${interaction.is_collected ? 1 : 0}`;
+		if (lastHydratedInteractionKeyRef.current === interactionKey) return;
+		lastHydratedInteractionKeyRef.current = interactionKey;
+		const nextLike = interaction.is_liked || false;
+		const nextDislike = interaction.is_disliked || false;
+		const nextCollect = interaction.is_collected || false;
+		const currentLike = Boolean(currentInfo.like);
+		const currentDislike = Boolean(currentInfo.dislike);
+		const currentCollect = Boolean(currentInfo.collect);
+		const rawLikeCnt = currentInfo.static?.like_cnt;
+		const resolvedLikeCnt = typeof rawLikeCnt === "number" ? rawLikeCnt : Number(rawLikeCnt || 0);
+		let nextLikeCnt = resolvedLikeCnt;
+		if (!nextLike && resolvedLikeCnt > 0) nextLikeCnt = Math.max(0, resolvedLikeCnt - 1);
+		else if (currentLike !== nextLike) nextLikeCnt = Math.max(0, resolvedLikeCnt + (nextLike ? 1 : -1));
+		else if (nextLike && resolvedLikeCnt === 0) nextLikeCnt = 1;
+		const shouldSyncLikeCnt = nextLikeCnt !== resolvedLikeCnt;
+		if (currentLike === nextLike && currentDislike === nextDislike && currentCollect === nextCollect && !shouldSyncLikeCnt) return;
+		handleUpdate({
+			like: nextLike,
+			dislike: nextDislike,
+			collect: nextCollect,
+			...shouldSyncLikeCnt ? { static: {
+				...currentInfo.static || {},
+				like_cnt: nextLikeCnt
+			} } : {}
+		});
+	}, [handleUpdate, interactionData]);
+	if (!resolvedInformation) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: shouldUsePreview ? "pointer-events-none" : void 0,
+		children: /* @__PURE__ */ jsx(DetailOperate, {
+			mode,
+			information: resolvedInformation,
+			onUpdate: handleUpdate
+		})
+	});
+}
+
+//#endregion
+export { VideoDetailActionsClient };