@funhub/platform 0.2.14 → 0.2.16

package/dist/components/biz/business/home-recommend/shared/home-recommend-base.mjs

@@ -1,2 +1,898 @@
 
-"use client";import{pContentGetNewstVideoList as e,pContentGetPopularVideoList as t}from"../../../../../service/generated/client.mjs";import{trackAdClick as n,trackAdImpression as r,trackAppPageView as i,trackPageClick as a,trackRecommendListClick as o}from"../../../../../utils/tracking.mjs";import{Image as s}from"../../../../ui/image.mjs";import{Box as c}from"../../../../ui/box.mjs";import{Text as l}from"../../../../ui/text.mjs";import u from"../../../../ui/loading.mjs";import ee from"../../../../ui/link.mjs";import{useGridFirstRowHeight as d,useWaterfallFirstRowHeight as te}from"../../../../../hooks/use-first-row-height.mjs";import{useMinDurationLoading as ne}from"../../../../../hooks/use-min-duration-loading.mjs";import re from"../../../../../assets/icons/common/right_arrow.mjs";import f from"../../../../../assets/icons/common/right_arrow_thin.mjs";import ie from"../../../../../assets/icons/detail/video_flag.mjs";import{isFeedAdItem as p}from"../../advertisement/feed-ad/index.mjs";import{RECOMMEND_BADGE_IMAGE_CLASS_NAME as m,RECOMMEND_TOP_LEFT_BADGE_WRAPPER_CLASS_NAME as ae,normalizeRecommendBadgeUrl as h}from"../../../../common/list/waterfall-recommend/recommend-badge-style.mjs";import{WATERFALL_SHORT_CARD_ASPECT_RATIO as g,WATERFALL_TALL_CARD_ASPECT_RATIO as oe,buildWaterfallRecommendLegacyDisplay as _}from"../../../../common/list/waterfall-recommend/waterfall-recommend-display.mjs";import{WaterfallRecommend as v}from"../../../../common/list/waterfall-recommend/waterfall-recommend.mjs";import{HOME_RECOMMEND_DEFAULT_GRID_COLUMNS as se,HOME_RECOMMEND_DEFAULT_GRID_ROWS as y,HOME_RECOMMEND_DEFAULT_PLAY_COUNT_DELTA as ce,HOME_RECOMMEND_DEFAULT_SHOW_EPISODE as le,HOME_RECOMMEND_DEFAULT_SHOW_PLAY_COUNT as ue,HOME_RECOMMEND_DEFAULT_TITLE as de,HOME_RECOMMEND_MAX_GRID_COLUMNS as fe,HOME_RECOMMEND_MAX_GRID_ROWS as pe}from"./home-recommend-default-config.mjs";import{buildHomeRecommendHeatText as b,resolveHomeRecommendBrowseCount as x}from"./home-recommend-play-count.mjs";import{HOME_RECOMMEND_CARD_CONFIG_FIELD as me}from"./home-recommend-preview.mjs";import{isHomeRecommendLatestSortRule as he}from"./home-recommend-smart-layout.mjs";import{limitPopularVideoPageItems as ge}from"./home-recommend-smart-tag.mjs";import{enrichHomeRecommendItemsWithVideoDetails as _e}from"./home-recommend-video-detail.mjs";import{useCallback as S,useEffect as C,useLayoutEffect as ve,useMemo as w,useRef as T,useState as E}from"react";import{Fragment as ye,jsx as D,jsxs as O}from"react/jsx-runtime";const be={backgroundImage:`var(--gradient-card-mask-medium)`},xe={},Se={list:[]},k=new Map,A=[];function Ce(e){if(e)return k.get(e)}function we(e,t){if(!e||(k.has(e)||A.push(e),k.set(e,{items:[...t.items],cursor:t.cursor}),A.length<=120))return;let n=A.shift();n&&k.delete(n)}function Te({variant:s,props:ie=xe,data:m=Se,mode:ae=`renderer`}){let h=ae===`editor`,{list:g,title:oe,cursor:_}=m,b=w(()=>Array.isArray(g)?g:[],[g]),x=w(()=>Array.isArray(m.icons)?m.icons:[],[m.icons]),{rows:me,columns:be,moreLink:k,title:A,showPlayCount:Te,playCountDelta:De,showEpisode:Oe,enableInfinite:Me,items:j,smartLayout:M}=ie,N=M?.enabled===!0,P=N&&he(M?.sortRule),F=Me===!0&&N,I=!h&&F&&b.length>=16,L=w(()=>N||!Array.isArray(j)?``:j.map(e=>String(e?.contentId||``).trim()).filter(Boolean).join(`,`),[N,j]),[R,Ne]=E(0),[Pe,z]=E(b),[Le,ze]=E(x),[Be,B]=E(()=>typeof _==`string`?_:void 0),[Ve,He]=E(!1),Ue=T(null),We=T(null),Ge=T(null),Ke=T([]),V=T({left:null,right:null}),qe=T(null),Je=T(!1),Ye=T(new Set),H=T(new Map),Xe=T(!1),U=T(``),{isLoading:Ze,show:Qe,hide:$e}=ne(600),et=Ae(me,y,pe),W=Ae(be,se,fe),G=F?16:s===`grid`?et*W:16,K=w(()=>[s,(()=>{if(!N||!M)return`manual:${L}`;if(P)return`smart:newest:${M.tagIds.join(`,`)}:${M.catIds.join(`,`)}`;let e=String(M.sortRule??``);return`smart:popular:${M.tagIds.join(`,`)}:${M.catIds.join(`,`)}:sr:${e}`})(),String(G)].join(`|`),[N,L,G,M,P,s]);C(()=>{z(b),ze(x),B(typeof _==`string`?_:void 0)},[_,x,b]);let tt=et*W,nt=h&&s===`grid`,q=nt?Pe.slice(0,tt):Pe,J=nt?Le.slice(0,tt):Le,rt=s===`waterfall`?6:4,it=q.length>0?Math.max(0,q.length-rt):-1,at=!!Be;C(()=>{if(h)return;let e=q.filter(e=>p(e)).map(e=>e.ad?.ad_code||``).filter(Boolean).join(`,`);e&&r({page_key:`home`,page_name:`首页`,ad_slot_key:`home_feed`,ad_slot_name:`信息流广告`,ad_id:e,ad_type:`feed`})},[q.length,h]);let ot=S(e=>{let t=e.ad?.ad_code||``;t&&n({page_key:`home`,page_name:`首页`,ad_slot_key:`home_feed`,ad_slot_name:`信息流广告`,ad_id:t,ad_type:`feed`})},[]),Y=A&&A.trim()||oe||de;C(()=>{if(h)return;let e=qe.current;if(!e)return;let t=new IntersectionObserver(e=>{e[0]?.isIntersecting&&!Je.current&&(Je.current=!0,i({page_key:`home`,page_name:`首页`,current_page_key:Y,current_page_name:Y}),t.disconnect())},{threshold:.5});return t.observe(e),()=>{t.disconnect()}},[h,Y,q.length]),C(()=>{let e=H.current;return()=>{e.forEach(e=>e.disconnect()),e.clear()}},[]);let st=S(e=>{let t=e.id||``;!t||Ye.current.has(t)||(Ye.current.add(t),i({page_key:`home`,page_name:`首页`,current_page_key:t,current_page_name:e.name||``}))},[]),ct=S((e,t)=>{if(p(e)){ot(e);return}o({page_key:`home`,page_name:`首页`,recommend_id:Y}),a(`home`,`首页`,t,e.name||e.id||``)},[ot,Y]);function lt(){o({page_key:`home`,page_name:`首页`,recommend_id:Y,recommend_trace_info:`更多`})}let X=Te??ue,Z=Number(De??ce),Q=Oe??le,ut=`flex-1 min-w-0 text-[18px] leading-[24px] font-medium line-clamp-1 text-text2`,dt=s===`grid`?f:h?re:f,ft=ke(k),pt=(s===`waterfall`||!F)&&!!ft,mt=pt?ft:``,ht=s===`grid`?`flex size-[24px] shrink-0 items-center justify-center ${h?`opacity-100`:`opacity-50`}`:`ml-[8px] flex size-[24px] shrink-0 items-center justify-center ${h?`opacity-100`:`opacity-50`}`,gt=`size-[16px] text-text1`,_t=d({enabled:!h&&s===`grid`,containerRef:We,firstRowItemRef:Ke,columns:W,itemsCount:q.length,deps:[s]}),vt=te({enabled:!h&&s===`waterfall`,containerRef:Ue,firstRowRef:V,deps:[s,q.length]}),yt=s===`grid`?_t:vt,bt=S(async()=>{if(h||U.current===K)return;let e=Ce(K);if(e){z(e.items),N&&B(e.cursor);return}if(N||L){U.current=K;try{if(Qe(),!N){if(!L)return;let e=await _e(b);z(e),we(K,{items:e});return}if(!M)return;let e=await t({page_size:G,tags:M.tagIds.length>0?M.tagIds:void 0,cat_ids:M.catIds.length>0?M.catIds:void 0},{cache:`no-store`}),n=ge(e.data?.videos,G),r=e.data?.cursor;z(n),B(r),we(K,{items:n,cursor:r})}catch(e){console.error(`推荐位刷新首屏失败（client）`,e)}finally{U.current===K&&(U.current=``),$e()}}},[$e,b,h,N,L,K,G,Qe,M]);C(()=>{bt()},[bt]);let xt=S(async()=>{let n=Be;if(!(!I||!n||Xe.current)){Xe.current=!0,He(!0);try{if(!M)return;let r={cursor:n,page_size:G,tags:M.tagIds.length>0?M.tagIds:void 0,cat_ids:M.catIds.length>0?M.catIds:void 0},i=P?await e(r):await t(r),a=Array.isArray(i.data?.videos)?i.data.videos:[],o=i.data?.cursor;a.length>0&&z(e=>e.concat(a)),B(e=>{if(!(!a.length||!o))return o===e?void 0:o})}catch(e){console.error(`推荐位加载下一页失败（client）`,e),B(void 0)}finally{Xe.current=!1,He(!1)}}},[Be,G,I,M,P]);C(()=>{let e=Ge.current;if(!e||!I||!at)return;let t=new IntersectionObserver(e=>{!e[0]?.isIntersecting||Ve||xt()},{root:null,threshold:0});return t.observe(e),()=>{t.disconnect()}},[xt,at,Ve,q.length,G,I,it]),ve(()=>{let e=Ue.current;if(!e||s!==`waterfall`)return;let t=()=>{let t=e.clientWidth||0;Ne(t>0?(t-15)/2:0)};t();let n=new ResizeObserver(t);return n.observe(e),()=>{n.disconnect()}},[s]);let $=w(()=>s===`waterfall`?Ie(q,J,R):{left:[],right:[]},[R,J,q,s]),St=w(()=>s===`waterfall`?{left:$.left.map(e=>Fe(e,X,Z,Q)),right:$.right.map(e=>Fe(e,X,Z,Q))}:{left:[],right:[]},[Z,Q,X,s,$.left,$.right]);if(C(()=>{s===`waterfall`&&($.left.length||(V.current.left=null),$.right.length||(V.current.right=null))},[s,$.left.length,$.right.length]),!q.length)return null;let Ct=!h&&Ze,wt=!h&&Ve,Tt=yt>0?yt/2:160;return O(c,{ref:qe,className:`w-full mt-[16px]`,children:[s===`grid`&&O(c,{className:`flex items-center justify-between pl-[16px] pr-0 mb-[16px]`,children:[D(l,{className:ut,children:Y}),pt&&D(ee,{href:mt,"aria-label":`更多`,className:ht,onClick:lt,children:D(dt,{className:gt})})]}),s===`grid`&&O(c,{ref:We,className:`relative flex w-full flex-wrap items-start gap-[16px] px-[16px]`,children:[q.map((e,t)=>{let n=J[t],r=je(e);return D(`div`,{ref:e=>{t===it&&(Ge.current=e),t<W&&(Ke.current[t]=e)},className:`w-[calc((100%-16px)/2)]`,children:D(Ee,{item:e,icon:n,index:t,showPlayCount:X&&(r?.showPlayCount??!0),playCountDelta:r?.playCountDelta??Z,showEpisode:r?.showEpisode??Q,widthStyle:{width:`100%`},onContentClick:ct,onContentView:st})},Re(e,t))}),Ct&&D(c,{className:`absolute inset-0 z-10 bg-black/15 backdrop-blur-[1px] dark:bg-white/10`,"aria-hidden":!0}),Ct&&D(c,{className:`absolute left-1/2 -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-none`,style:{top:Tt},"aria-hidden":!0,children:D(u,{size:`large`,showLabel:!1,className:`text-theme5`})})]}),s===`waterfall`&&D(v,{title:Y,moreHref:mt||void 0,onMoreClick:lt,moreIcon:pt?D(dt,{className:gt}):void 0,titleClassName:ut,moreLinkClassName:ht,columns:St,containerClassName:`relative flex w-full gap-[15px] px-[16px]`,getItemRef:({item:e,column:t,columnIndex:n})=>r=>{let{sourceIndex:i}=e;i===it&&(Ge.current=r),n===0&&(V.current[t]=r);let a=H.current.get(i);if(a&&(a.disconnect(),H.current.delete(i)),r&&!h){let e=q[i];if(e&&!p(e)){let t=new IntersectionObserver(n=>{n[0]?.isIntersecting&&(st(e),t.disconnect(),H.current.delete(i))},{threshold:.5});t.observe(r),H.current.set(i,t)}}},overlay:Ct?O(ye,{children:[D(c,{className:`absolute inset-0 z-10 bg-black/15 backdrop-blur-[1px] dark:bg-white/10`,"aria-hidden":!0}),D(c,{className:`absolute left-1/2 -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-none`,style:{top:Tt},"aria-hidden":!0,children:D(u,{size:`large`,showLabel:!1,className:`text-theme5`})})]}):void 0,onItemClick:e=>{let t=q[e.sourceIndex];t&&(p(t)?ot(t):(o({page_key:`home`,page_name:`首页`,recommend_id:Y}),a(`home`,`首页`,null,t.name||t.id||``)))}}),wt&&D(c,{className:`w-full flex justify-center py-[12px]`,children:D(u,{size:`medium`,showLabel:!1,className:`text-theme5`})})]})}function Ee({item:e,icon:t,index:n,showPlayCount:r,playCountDelta:i,showEpisode:a,widthStyle:o,onContentClick:s,onContentView:c}){return D(De,{item:e,icon:t,index:n,showPlayCount:r,playCountDelta:i,showEpisode:a,widthStyle:o,onContentClick:s,onContentView:c})}function De({item:e,icon:t,index:n,showPlayCount:r,playCountDelta:i,showEpisode:a,widthStyle:o,onContentClick:u,onContentView:d}){let te=T(null),ne=M(e),re=ne===`short`?g:oe,f=N(e,ne),v=e.name||e?.title||``,se=e.id?Oe(e):`#`,y=_({title:v,badgeImageUrl:z(e,t,n),episodeText:L(e,a),heatText:r?b(x(e),i):``,score:F(e.score)}),ce=h(y.topLeftBadgeImageUrl);return C(()=>{let t=te.current;if(!t||!d||p(e))return;let n=new IntersectionObserver(t=>{t[0]?.isIntersecting&&(d(e),n.disconnect())},{threshold:.5});return n.observe(t),()=>{n.disconnect()}},[e,d]),D(ee,{href:se,className:`block w-full`,onClick:t=>u?.(e,t),style:o,children:O(ye,{children:[O(c,{className:`relative w-full overflow-hidden rounded-[8px] bg-bg3`,style:{aspectRatio:re},children:[f&&D(s,{src:f,alt:v||`推荐封面`,fill:!0,objectFit:`cover`,className:`object-cover object-top`}),D(c,{className:`pointer-events-none absolute inset-0 rounded-[8px]`,style:be,"aria-hidden":!0}),ce&&D(c,{className:ae,children:D(s,{src:ce,alt:`角标`,width:96,height:18,className:m})}),y.topRightScoreText&&D(l,{as:`span`,className:`absolute right-[8px] top-[8px] z-10 shrink-0 text-[14px] leading-[22px] font-semibold text-[#FFC24B]`,children:y.topRightScoreText}),O(c,{className:`absolute left-[8px] right-[8px] bottom-[8px] z-10 flex items-end justify-between gap-[8px]`,children:[D(c,{className:`flex min-w-0 items-center gap-[4px]`,children:y.bottomLeftHeatText&&O(ye,{children:[D(ie,{className:`h-[16px] w-[16px] shrink-0 text-white`}),D(l,{as:`span`,className:`min-w-0 truncate text-[14px] leading-[20px] text-white`,children:y.bottomLeftHeatText})]})}),y.bottomRightEpisodeText&&D(l,{as:`span`,className:`shrink-0 text-[14px] leading-[20px] text-white`,children:y.bottomRightEpisodeText})]})]}),D(c,{className:`mt-[8px] overflow-hidden`,children:D(l,{as:`h3`,className:`line-clamp-2 text-[16px] leading-[22px] text-[--color-text-white80]`,children:y.title})})]})})}function Oe(e){let t=encodeURIComponent(e.name||``);return`/video/${e.id||``}/${t}/episode/1`}function ke(e){return e?e.trim():``}function Ae(e,t,n){let r=Number(e);return!Number.isFinite(r)||r<=0?t:Math.min(n,Math.floor(r))}function je(e){return e[me]}function Me(e){return typeof e==`string`?e:``}function j(e){return typeof e==`string`?e.trim():``}function M(e){return j(e.img_type).toLowerCase()===`long`?`short`:`tall`}function N(e,t){return t===`short`?e.img_x||e.img_y||e?.coverUrl:e.img_y||e.img_x||e?.coverUrl}function P(e,t){return(e.tags?.map(e=>e.name).filter(Boolean).join(` · `)??``)||(t?I(e,!0):``)}function F(e){let t=Number(e);if(!(!Number.isFinite(t)||t<=0))return t>10&&t<=100?t/10:Math.min(t,10)}function I(e,t){return t?R(e)||Pe(Number(e.duration||0)):``}function L(e,t){return t?R(e):``}function R(e){if(!Ne(e))return``;let t=e.update_status===`0`,n=Number(e.episode_cnt||e.links?.length||0);return n>0?`${t?`更新至`:`全`}${n}集`:``}function Ne(e){if(Number(e.type??0)===2)return!0;let t=Number(e.episode_cnt||e.links?.length||0);return Number.isFinite(t)&&t>1}function Pe(e){if(!Number.isFinite(e)||e<=0)return``;let t=Math.floor(e),n=Math.floor(t/3600),r=Math.floor(t%3600/60),i=t%60,a=e=>String(e).padStart(2,`0`);return n>0?`${a(n)}:${a(r)}:${a(i)}`:`${a(r)}:${a(i)}`}function z(e,t,n){return Me(e.badge_url)||Me(t?.material_url)||``}function Fe(e,t,n,r){let i=M(e.item),a=N(e.item,i),o=e.item.name||e.item?.title||``,s=e.item.id?Oe(e.item):`#`,c=z(e.item,e.icon,e.index),l=I(e.item,r),u=P(e.item,r),ee=t?b(x(e.item),n):``,d=F(e.item.score);return{key:Re(e.item,e.index),sourceIndex:e.index,href:s,cardKind:i,coverUrl:a,title:o,badgeImageUrl:c,episodeText:l,metaPrimaryText:u,heatText:ee,score:d}}function Ie(e,t,n){let r=[],i=[],a=n<=0,o=0,s=0;return e.forEach((e,c)=>{let l=t[c];if(a){c%2==0?r.push({item:e,icon:l,index:c}):i.push({item:e,icon:l,index:c});return}let u=Le(n,e);o<=s?(r.push({item:e,icon:l,index:c}),o+=u):(i.push({item:e,icon:l,index:c}),s+=u)}),{left:r,right:i}}function Le(e,t){return e?(M(t)===`tall`?216:142)+16:0}function Re(e,t){return e.id?`home-recommend-${e.id}-${t}`:`home-recommend-${t}`}export{Te as default};
+'use client';
+
+import { pContentGetNewstVideoList, pContentGetPopularVideoList } from "../../../../../service/generated/client.mjs";
+import { trackAdClick, trackAdImpression, trackAppPageView, trackPageClick, trackRecommendListClick } from "../../../../../utils/tracking.mjs";
+import { Image } from "../../../../ui/image.mjs";
+import { Box } from "../../../../ui/box.mjs";
+import { Text } from "../../../../ui/text.mjs";
+import Loading from "../../../../ui/loading.mjs";
+import Link from "../../../../ui/link.mjs";
+import { useGridFirstRowHeight, useWaterfallFirstRowHeight } from "../../../../../hooks/use-first-row-height.mjs";
+import { useMinDurationLoading } from "../../../../../hooks/use-min-duration-loading.mjs";
+import SvgRightArrow from "../../../../../assets/icons/common/right_arrow.mjs";
+import SvgRightArrowThin from "../../../../../assets/icons/common/right_arrow_thin.mjs";
+import SvgVideoFlag from "../../../../../assets/icons/detail/video_flag.mjs";
+import { isFeedAdItem } from "../../advertisement/feed-ad/index.mjs";
+import { RECOMMEND_BADGE_IMAGE_CLASS_NAME, RECOMMEND_TOP_LEFT_BADGE_WRAPPER_CLASS_NAME, normalizeRecommendBadgeUrl } from "../../../../common/list/waterfall-recommend/recommend-badge-style.mjs";
+import { WATERFALL_SHORT_CARD_ASPECT_RATIO, WATERFALL_TALL_CARD_ASPECT_RATIO, buildWaterfallRecommendLegacyDisplay } from "../../../../common/list/waterfall-recommend/waterfall-recommend-display.mjs";
+import { WaterfallRecommend } from "../../../../common/list/waterfall-recommend/waterfall-recommend.mjs";
+import { HOME_RECOMMEND_DEFAULT_GRID_COLUMNS, HOME_RECOMMEND_DEFAULT_GRID_ROWS, HOME_RECOMMEND_DEFAULT_PLAY_COUNT_DELTA, HOME_RECOMMEND_DEFAULT_SHOW_EPISODE, HOME_RECOMMEND_DEFAULT_SHOW_PLAY_COUNT, HOME_RECOMMEND_DEFAULT_TITLE, HOME_RECOMMEND_MAX_GRID_COLUMNS, HOME_RECOMMEND_MAX_GRID_ROWS } from "./home-recommend-default-config.mjs";
+import { buildHomeRecommendHeatText, resolveHomeRecommendBrowseCount } from "./home-recommend-play-count.mjs";
+import { HOME_RECOMMEND_CARD_CONFIG_FIELD } from "./home-recommend-preview.mjs";
+import { isHomeRecommendLatestSortRule } from "./home-recommend-smart-layout.mjs";
+import { limitPopularVideoPageItems } from "./home-recommend-smart-tag.mjs";
+import { enrichHomeRecommendItemsWithVideoDetails } from "./home-recommend-video-detail.mjs";
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+
+//#region components/biz/business/home-recommend/shared/home-recommend-base.tsx
+/**
+* 首页推荐组件公共渲染逻辑。
+*/
+const DEFAULT_PAGE_SIZE = 16;
+const GRID_PREFETCH_OFFSET = 4;
+const WATERFALL_PREFETCH_OFFSET = 6;
+const WATERFALL_COLUMN_GAP = 15;
+const WATERFALL_CARD_GAP = 16;
+const WATERFALL_TALL_CARD_HEIGHT = 216;
+const WATERFALL_SHORT_CARD_HEIGHT = 142;
+const GRID_CARD_MASK_STYLE = { backgroundImage: "var(--gradient-card-mask-medium)" };
+const FIRST_PAGE_REFRESH_CACHE_LIMIT = 120;
+const emptyPropsConfig = {};
+const emptyData = { list: [] };
+const firstPageRefreshCache = /* @__PURE__ */ new Map();
+const firstPageRefreshCacheQueue = [];
+/**
+* 读取首屏刷新会话缓存。
+*/
+function readFirstPageRefreshCache(refreshKey) {
+	if (!refreshKey) return;
+	return firstPageRefreshCache.get(refreshKey);
+}
+/**
+* 写入首屏刷新会话缓存，并限制缓存上限。
+*/
+function writeFirstPageRefreshCache(refreshKey, entry) {
+	if (!refreshKey) return;
+	if (!firstPageRefreshCache.has(refreshKey)) firstPageRefreshCacheQueue.push(refreshKey);
+	firstPageRefreshCache.set(refreshKey, {
+		items: [...entry.items],
+		cursor: entry.cursor
+	});
+	if (firstPageRefreshCacheQueue.length <= FIRST_PAGE_REFRESH_CACHE_LIMIT) return;
+	const oldestKey = firstPageRefreshCacheQueue.shift();
+	if (oldestKey) firstPageRefreshCache.delete(oldestKey);
+}
+/**
+* 首页推荐组件基础实现。
+*/
+function HomeRecommendBase({ variant, props: propsConfig = emptyPropsConfig, data = emptyData, mode = "renderer" }) {
+	const isEditor = mode === "editor";
+	const { list, title, cursor } = data;
+	const initialItems = useMemo(() => Array.isArray(list) ? list : [], [list]);
+	const initialIcons = useMemo(() => Array.isArray(data.icons) ? data.icons : [], [data.icons]);
+	const { rows, columns, moreLink, title: overrideTitle, showPlayCount, playCountDelta, showEpisode, enableInfinite, items, smartLayout } = propsConfig;
+	const isDynamicRecommendMode = smartLayout?.enabled === true;
+	const useNewestSmartFeed = isDynamicRecommendMode && isHomeRecommendLatestSortRule(smartLayout?.sortRule);
+	const shouldEnableInfinite = enableInfinite === true && isDynamicRecommendMode;
+	const shouldRequestNextPage = !isEditor && shouldEnableInfinite && initialItems.length >= DEFAULT_PAGE_SIZE;
+	const manualContentIdsKey = useMemo(() => {
+		if (isDynamicRecommendMode) return "";
+		if (!Array.isArray(items)) return "";
+		return items.map((item) => String(item?.contentId || "").trim()).filter(Boolean).join(",");
+	}, [isDynamicRecommendMode, items]);
+	const [columnWidth, setColumnWidth] = useState(0);
+	const [runtimeItems, setRuntimeItems] = useState(initialItems);
+	const [runtimeIcons, setRuntimeIcons] = useState(initialIcons);
+	const [nextCursor, setNextCursor] = useState(() => {
+		return typeof cursor === "string" ? cursor : void 0;
+	});
+	const [isFetchingNextPage, setIsFetchingNextPage] = useState(false);
+	const containerRef = useRef(null);
+	const gridContainerRef = useRef(null);
+	const triggerRef = useRef(null);
+	const gridFirstRowRef = useRef([]);
+	const waterfallFirstRowRef = useRef({
+		left: null,
+		right: null
+	});
+	const sectionRef = useRef(null);
+	const sectionExposureReportedRef = useRef(false);
+	const contentExposureReportedRef = useRef(/* @__PURE__ */ new Set());
+	const waterfallItemObserversRef = useRef(/* @__PURE__ */ new Map());
+	const inFlightRef = useRef(false);
+	const refreshingKeyRef = useRef("");
+	const { isLoading: isRefreshing, show: showRefreshLoading, hide: hideRefreshLoading } = useMinDurationLoading(600);
+	const resolvedGridRows = clampPositiveInt(rows, HOME_RECOMMEND_DEFAULT_GRID_ROWS, HOME_RECOMMEND_MAX_GRID_ROWS);
+	const resolvedGridColumns = clampPositiveInt(columns, HOME_RECOMMEND_DEFAULT_GRID_COLUMNS, HOME_RECOMMEND_MAX_GRID_COLUMNS);
+	const resolvedPageSize = shouldEnableInfinite ? DEFAULT_PAGE_SIZE : variant === "grid" ? resolvedGridRows * resolvedGridColumns : DEFAULT_PAGE_SIZE;
+	const refreshKey = useMemo(() => {
+		return [
+			variant,
+			(() => {
+				if (!isDynamicRecommendMode || !smartLayout) return `manual:${manualContentIdsKey}`;
+				if (useNewestSmartFeed) return `smart:newest:${smartLayout.tagIds.join(",")}:${smartLayout.catIds.join(",")}`;
+				const sortKey = String(smartLayout.sortRule ?? "");
+				return `smart:popular:${smartLayout.tagIds.join(",")}:${smartLayout.catIds.join(",")}:sr:${sortKey}`;
+			})(),
+			String(resolvedPageSize)
+		].join("|");
+	}, [
+		isDynamicRecommendMode,
+		manualContentIdsKey,
+		resolvedPageSize,
+		smartLayout,
+		useNewestSmartFeed,
+		variant
+	]);
+	useEffect(() => {
+		setRuntimeItems(initialItems);
+		setRuntimeIcons(initialIcons);
+		setNextCursor(typeof cursor === "string" ? cursor : void 0);
+	}, [
+		cursor,
+		initialIcons,
+		initialItems
+	]);
+	const editorGridLimitCount = resolvedGridRows * resolvedGridColumns;
+	const shouldLimitEditorGrid = isEditor && variant === "grid";
+	const resolvedItems = shouldLimitEditorGrid ? runtimeItems.slice(0, editorGridLimitCount) : runtimeItems;
+	const resolvedIcons = shouldLimitEditorGrid ? runtimeIcons.slice(0, editorGridLimitCount) : runtimeIcons;
+	const prefetchOffset = variant === "waterfall" ? WATERFALL_PREFETCH_OFFSET : GRID_PREFETCH_OFFSET;
+	const triggerIndex = resolvedItems.length > 0 ? Math.max(0, resolvedItems.length - prefetchOffset) : -1;
+	const hasNextPage = Boolean(nextCursor);
+	/** 信息流广告曝光上报：列表更新时批量上报所有广告条目。 */
+	useEffect(() => {
+		if (isEditor) return;
+		const adIds = resolvedItems.filter((item) => isFeedAdItem(item)).map((item) => item.ad?.ad_code || "").filter(Boolean).join(",");
+		if (!adIds) return;
+		trackAdImpression({
+			page_key: "home",
+			page_name: "首页",
+			ad_slot_key: "home_feed",
+			ad_slot_name: "信息流广告",
+			ad_id: adIds,
+			ad_type: "feed"
+		});
+	}, [resolvedItems.length, isEditor]);
+	/** 信息流广告点击上报。 */
+	const handleFeedAdClick = useCallback((item) => {
+		const adId = item.ad?.ad_code || "";
+		if (!adId) return;
+		trackAdClick({
+			page_key: "home",
+			page_name: "首页",
+			ad_slot_key: "home_feed",
+			ad_slot_name: "信息流广告",
+			ad_id: adId,
+			ad_type: "feed"
+		});
+	}, []);
+	const resolvedTitle = overrideTitle && overrideTitle.trim() || title || HOME_RECOMMEND_DEFAULT_TITLE;
+	/** 推荐位区块曝光上报（≥50% 可见时触发一次）。 */
+	useEffect(() => {
+		if (isEditor) return;
+		const target = sectionRef.current;
+		if (!target) return;
+		const observer = new IntersectionObserver((entries) => {
+			if (entries[0]?.isIntersecting && !sectionExposureReportedRef.current) {
+				sectionExposureReportedRef.current = true;
+				trackAppPageView({
+					page_key: "home",
+					page_name: "首页",
+					current_page_key: resolvedTitle,
+					current_page_name: resolvedTitle
+				});
+				observer.disconnect();
+			}
+		}, { threshold: .5 });
+		observer.observe(target);
+		return () => {
+			observer.disconnect();
+		};
+	}, [
+		isEditor,
+		resolvedTitle,
+		resolvedItems.length
+	]);
+	/** 瀑布流每项曝光观察器，组件卸载时统一清理。 */
+	useEffect(() => {
+		const observers = waterfallItemObserversRef.current;
+		return () => {
+			observers.forEach((obs) => obs.disconnect());
+			observers.clear();
+		};
+	}, []);
+	/** 内容曝光上报（≥50% 可见时触发一次）。 */
+	const handleContentView = useCallback((item) => {
+		const contentId = item.id || "";
+		if (!contentId || contentExposureReportedRef.current.has(contentId)) return;
+		contentExposureReportedRef.current.add(contentId);
+		trackAppPageView({
+			page_key: "home",
+			page_name: "首页",
+			current_page_key: contentId,
+			current_page_name: item.name || ""
+		});
+	}, []);
+	/** 内容点击上报（推荐位点击 + 内容点击）。 */
+	const handleContentClick = useCallback((item, event) => {
+		if (isFeedAdItem(item)) {
+			handleFeedAdClick(item);
+			return;
+		}
+		trackRecommendListClick({
+			page_key: "home",
+			page_name: "首页",
+			recommend_id: resolvedTitle
+		});
+		trackPageClick("home", "首页", event, item.name || item.id || "");
+	}, [handleFeedAdClick, resolvedTitle]);
+	/** 推荐位更多点击上报。 */
+	function handleMoreClick() {
+		trackRecommendListClick({
+			page_key: "home",
+			page_name: "首页",
+			recommend_id: resolvedTitle,
+			recommend_trace_info: "更多"
+		});
+	}
+	const resolvedShowPlayCount = showPlayCount ?? HOME_RECOMMEND_DEFAULT_SHOW_PLAY_COUNT;
+	const resolvedPlayCountDelta = Number(playCountDelta ?? HOME_RECOMMEND_DEFAULT_PLAY_COUNT_DELTA);
+	const resolvedShowEpisode = showEpisode ?? HOME_RECOMMEND_DEFAULT_SHOW_EPISODE;
+	const sectionTitleClassName = "flex-1 min-w-0 text-[18px] leading-[24px] font-medium line-clamp-1 text-text2";
+	const MoreIcon = variant === "grid" ? SvgRightArrowThin : isEditor ? SvgRightArrow : SvgRightArrowThin;
+	const normalizedMoreLink = resolveMoreLink(moreLink);
+	const shouldRenderMore = variant === "waterfall" ? Boolean(normalizedMoreLink) : !shouldEnableInfinite && Boolean(normalizedMoreLink);
+	const resolvedMoreLink = shouldRenderMore ? normalizedMoreLink : "";
+	const moreLinkClassName = variant === "grid" ? `flex size-[24px] shrink-0 items-center justify-center ${isEditor ? "opacity-100" : "opacity-50"}` : `ml-[8px] flex size-[24px] shrink-0 items-center justify-center ${isEditor ? "opacity-100" : "opacity-50"}`;
+	const moreIconClassName = "size-[16px] text-text1";
+	const gridFirstRowHeight = useGridFirstRowHeight({
+		enabled: !isEditor && variant === "grid",
+		containerRef: gridContainerRef,
+		firstRowItemRef: gridFirstRowRef,
+		columns: resolvedGridColumns,
+		itemsCount: resolvedItems.length,
+		deps: [variant]
+	});
+	const waterfallFirstRowHeight = useWaterfallFirstRowHeight({
+		enabled: !isEditor && variant === "waterfall",
+		containerRef,
+		firstRowRef: waterfallFirstRowRef,
+		deps: [variant, resolvedItems.length]
+	});
+	const firstRowHeight = variant === "grid" ? gridFirstRowHeight : waterfallFirstRowHeight;
+	/**
+	* CSR 挂载后刷新首屏（仅 renderer + 智能铺设）。
+	* 用于覆盖 ISR/SSR 注入的缓存首屏数据，确保首屏可实时更新。
+	*/
+	const refreshFirstPage = useCallback(async () => {
+		if (isEditor) return;
+		if (refreshingKeyRef.current === refreshKey) return;
+		const cachedFirstPage = readFirstPageRefreshCache(refreshKey);
+		if (cachedFirstPage) {
+			setRuntimeItems(cachedFirstPage.items);
+			if (isDynamicRecommendMode) setNextCursor(cachedFirstPage.cursor);
+			return;
+		}
+		if (!(isDynamicRecommendMode || Boolean(manualContentIdsKey))) return;
+		refreshingKeyRef.current = refreshKey;
+		try {
+			showRefreshLoading();
+			if (!isDynamicRecommendMode) {
+				if (!manualContentIdsKey) return;
+				const enriched = await enrichHomeRecommendItemsWithVideoDetails(initialItems);
+				setRuntimeItems(enriched);
+				writeFirstPageRefreshCache(refreshKey, { items: enriched });
+				return;
+			}
+			if (!smartLayout) return;
+			const response = await pContentGetPopularVideoList({
+				page_size: resolvedPageSize,
+				tags: smartLayout.tagIds.length > 0 ? smartLayout.tagIds : void 0,
+				cat_ids: smartLayout.catIds.length > 0 ? smartLayout.catIds : void 0
+			}, { cache: "no-store" });
+			const nextVideos = limitPopularVideoPageItems(response.data?.videos, resolvedPageSize);
+			const followingCursor = response.data?.cursor;
+			setRuntimeItems(nextVideos);
+			setNextCursor(followingCursor);
+			writeFirstPageRefreshCache(refreshKey, {
+				items: nextVideos,
+				cursor: followingCursor
+			});
+		} catch (error) {
+			console.error("推荐位刷新首屏失败（client）", error);
+		} finally {
+			if (refreshingKeyRef.current === refreshKey) refreshingKeyRef.current = "";
+			hideRefreshLoading();
+		}
+	}, [
+		hideRefreshLoading,
+		initialItems,
+		isEditor,
+		isDynamicRecommendMode,
+		manualContentIdsKey,
+		refreshKey,
+		resolvedPageSize,
+		showRefreshLoading,
+		smartLayout
+	]);
+	useEffect(() => {
+		refreshFirstPage();
+	}, [refreshFirstPage]);
+	/**
+	* 拉取下一页推荐数据（仅客户端无限下拉）。
+	*/
+	const fetchNextPage = useCallback(async () => {
+		const requestCursor = nextCursor;
+		if (!shouldRequestNextPage || !requestCursor || inFlightRef.current) return;
+		inFlightRef.current = true;
+		setIsFetchingNextPage(true);
+		try {
+			if (!smartLayout) return;
+			const requestPayload = {
+				cursor: requestCursor,
+				page_size: resolvedPageSize,
+				tags: smartLayout.tagIds.length > 0 ? smartLayout.tagIds : void 0,
+				cat_ids: smartLayout.catIds.length > 0 ? smartLayout.catIds : void 0
+			};
+			const response = useNewestSmartFeed ? await pContentGetNewstVideoList(requestPayload) : await pContentGetPopularVideoList(requestPayload);
+			const nextVideos = Array.isArray(response.data?.videos) ? response.data.videos : [];
+			const followingCursor = response.data?.cursor;
+			if (nextVideos.length > 0) setRuntimeItems((prev) => prev.concat(nextVideos));
+			setNextCursor((prev) => {
+				if (!nextVideos.length || !followingCursor) return;
+				return followingCursor === prev ? void 0 : followingCursor;
+			});
+		} catch (error) {
+			console.error("推荐位加载下一页失败（client）", error);
+			setNextCursor(void 0);
+		} finally {
+			inFlightRef.current = false;
+			setIsFetchingNextPage(false);
+		}
+	}, [
+		nextCursor,
+		resolvedPageSize,
+		shouldRequestNextPage,
+		smartLayout,
+		useNewestSmartFeed
+	]);
+	useEffect(() => {
+		const target = triggerRef.current;
+		if (!target || !shouldRequestNextPage || !hasNextPage) return;
+		const observer = new IntersectionObserver((entries) => {
+			if (!entries[0]?.isIntersecting || isFetchingNextPage) return;
+			fetchNextPage();
+		}, {
+			root: null,
+			threshold: 0
+		});
+		observer.observe(target);
+		return () => {
+			observer.disconnect();
+		};
+	}, [
+		fetchNextPage,
+		hasNextPage,
+		isFetchingNextPage,
+		resolvedItems.length,
+		resolvedPageSize,
+		shouldRequestNextPage,
+		triggerIndex
+	]);
+	useLayoutEffect(() => {
+		const container = containerRef.current;
+		if (!container || variant !== "waterfall") return;
+		/**
+		* 更新瀑布流列宽。
+		*/
+		const updateWidth = () => {
+			const width = container.clientWidth || 0;
+			setColumnWidth(width > 0 ? (width - WATERFALL_COLUMN_GAP) / 2 : 0);
+		};
+		updateWidth();
+		const observer = new ResizeObserver(updateWidth);
+		observer.observe(container);
+		return () => {
+			observer.disconnect();
+		};
+	}, [variant]);
+	const waterfallColumns = useMemo(() => {
+		if (variant !== "waterfall") return {
+			left: [],
+			right: []
+		};
+		return buildWaterfallColumns(resolvedItems, resolvedIcons, columnWidth);
+	}, [
+		columnWidth,
+		resolvedIcons,
+		resolvedItems,
+		variant
+	]);
+	const waterfallUiColumns = useMemo(() => {
+		if (variant !== "waterfall") return {
+			left: [],
+			right: []
+		};
+		return {
+			left: waterfallColumns.left.map((entry) => buildWaterfallUiItem(entry, resolvedShowPlayCount, resolvedPlayCountDelta, resolvedShowEpisode)),
+			right: waterfallColumns.right.map((entry) => buildWaterfallUiItem(entry, resolvedShowPlayCount, resolvedPlayCountDelta, resolvedShowEpisode))
+		};
+	}, [
+		resolvedPlayCountDelta,
+		resolvedShowEpisode,
+		resolvedShowPlayCount,
+		variant,
+		waterfallColumns.left,
+		waterfallColumns.right
+	]);
+	useEffect(() => {
+		if (variant !== "waterfall") return;
+		if (!waterfallColumns.left.length) waterfallFirstRowRef.current.left = null;
+		if (!waterfallColumns.right.length) waterfallFirstRowRef.current.right = null;
+	}, [
+		variant,
+		waterfallColumns.left.length,
+		waterfallColumns.right.length
+	]);
+	if (!resolvedItems.length) return null;
+	const shouldShowRefreshLoading = !isEditor && isRefreshing;
+	const shouldShowNextPageLoading = !isEditor && isFetchingNextPage;
+	const overlayTop = firstRowHeight > 0 ? firstRowHeight / 2 : 160;
+	return /* @__PURE__ */ jsxs(Box, {
+		ref: sectionRef,
+		className: "w-full mt-[16px]",
+		children: [
+			variant === "grid" && /* @__PURE__ */ jsxs(Box, {
+				className: "flex items-center justify-between pl-[16px] pr-0 mb-[16px]",
+				children: [/* @__PURE__ */ jsx(Text, {
+					className: sectionTitleClassName,
+					children: resolvedTitle
+				}), shouldRenderMore && /* @__PURE__ */ jsx(Link, {
+					href: resolvedMoreLink,
+					"aria-label": "更多",
+					className: moreLinkClassName,
+					onClick: handleMoreClick,
+					children: /* @__PURE__ */ jsx(MoreIcon, { className: moreIconClassName })
+				})]
+			}),
+			variant === "grid" && /* @__PURE__ */ jsxs(Box, {
+				ref: gridContainerRef,
+				className: "relative flex w-full flex-wrap items-start gap-[16px] px-[16px]",
+				children: [
+					resolvedItems.map((item, index) => {
+						const icon = resolvedIcons[index];
+						const itemCardConfig = resolveCardDisplayConfig(item);
+						return /* @__PURE__ */ jsx("div", {
+							ref: (node) => {
+								if (index === triggerIndex) triggerRef.current = node;
+								if (index < resolvedGridColumns) gridFirstRowRef.current[index] = node;
+							},
+							className: "w-[calc((100%-16px)/2)]",
+							children: /* @__PURE__ */ jsx(HomeRecommendCard, {
+								item,
+								icon,
+								index,
+								showPlayCount: resolvedShowPlayCount && (itemCardConfig?.showPlayCount ?? true),
+								playCountDelta: itemCardConfig?.playCountDelta ?? resolvedPlayCountDelta,
+								showEpisode: itemCardConfig?.showEpisode ?? resolvedShowEpisode,
+								widthStyle: { width: "100%" },
+								onContentClick: handleContentClick,
+								onContentView: handleContentView
+							})
+						}, buildItemKey(item, index));
+					}),
+					shouldShowRefreshLoading && /* @__PURE__ */ jsx(Box, {
+						className: "absolute inset-0 z-10 bg-black/15 backdrop-blur-[1px] dark:bg-white/10",
+						"aria-hidden": true
+					}),
+					shouldShowRefreshLoading && /* @__PURE__ */ jsx(Box, {
+						className: "absolute left-1/2 -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-none",
+						style: { top: overlayTop },
+						"aria-hidden": true,
+						children: /* @__PURE__ */ jsx(Loading, {
+							size: "large",
+							showLabel: false,
+							className: "text-theme5"
+						})
+					})
+				]
+			}),
+			variant === "waterfall" && /* @__PURE__ */ jsx(WaterfallRecommend, {
+				title: resolvedTitle,
+				moreHref: resolvedMoreLink || void 0,
+				onMoreClick: handleMoreClick,
+				moreIcon: shouldRenderMore ? /* @__PURE__ */ jsx(MoreIcon, { className: moreIconClassName }) : void 0,
+				titleClassName: sectionTitleClassName,
+				moreLinkClassName,
+				columns: waterfallUiColumns,
+				containerClassName: "relative flex w-full gap-[15px] px-[16px]",
+				getItemRef: ({ item: waterfallItem, column, columnIndex }) => (node) => {
+					const { sourceIndex } = waterfallItem;
+					if (sourceIndex === triggerIndex) triggerRef.current = node;
+					if (columnIndex === 0) waterfallFirstRowRef.current[column] = node;
+					const prevObs = waterfallItemObserversRef.current.get(sourceIndex);
+					if (prevObs) {
+						prevObs.disconnect();
+						waterfallItemObserversRef.current.delete(sourceIndex);
+					}
+					if (node && !isEditor) {
+						const sourceItem = resolvedItems[sourceIndex];
+						if (sourceItem && !isFeedAdItem(sourceItem)) {
+							const obs = new IntersectionObserver((entries) => {
+								if (entries[0]?.isIntersecting) {
+									handleContentView(sourceItem);
+									obs.disconnect();
+									waterfallItemObserversRef.current.delete(sourceIndex);
+								}
+							}, { threshold: .5 });
+							obs.observe(node);
+							waterfallItemObserversRef.current.set(sourceIndex, obs);
+						}
+					}
+				},
+				overlay: shouldShowRefreshLoading ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Box, {
+					className: "absolute inset-0 z-10 bg-black/15 backdrop-blur-[1px] dark:bg-white/10",
+					"aria-hidden": true
+				}), /* @__PURE__ */ jsx(Box, {
+					className: "absolute left-1/2 -translate-x-1/2 -translate-y-1/2 z-20 pointer-events-none",
+					style: { top: overlayTop },
+					"aria-hidden": true,
+					children: /* @__PURE__ */ jsx(Loading, {
+						size: "large",
+						showLabel: false,
+						className: "text-theme5"
+					})
+				})] }) : void 0,
+				onItemClick: (waterfallItem) => {
+					const sourceItem = resolvedItems[waterfallItem.sourceIndex];
+					if (!sourceItem) return;
+					if (isFeedAdItem(sourceItem)) handleFeedAdClick(sourceItem);
+					else {
+						trackRecommendListClick({
+							page_key: "home",
+							page_name: "首页",
+							recommend_id: resolvedTitle
+						});
+						trackPageClick("home", "首页", null, sourceItem.name || sourceItem.id || "");
+					}
+				}
+			}),
+			shouldShowNextPageLoading && /* @__PURE__ */ jsx(Box, {
+				className: "w-full flex justify-center py-[12px]",
+				children: /* @__PURE__ */ jsx(Loading, {
+					size: "medium",
+					showLabel: false,
+					className: "text-theme5"
+				})
+			})
+		]
+	});
+}
+/**
+* 首页推荐卡片渲染组件。
+*/
+function HomeRecommendCard({ item, icon, index, showPlayCount, playCountDelta, showEpisode, widthStyle, onContentClick, onContentView }) {
+	return /* @__PURE__ */ jsx(GridHomeRecommendCard, {
+		item,
+		icon,
+		index,
+		showPlayCount,
+		playCountDelta,
+		showEpisode,
+		widthStyle,
+		onContentClick,
+		onContentView
+	});
+}
+/**
+* 首页推荐宫格卡片渲染组件。
+*/
+function GridHomeRecommendCard({ item, icon, index, showPlayCount, playCountDelta, showEpisode, widthStyle, onContentClick, onContentView }) {
+	const wrapperRef = useRef(null);
+	const cardKind = resolveWaterfallCardKind(item);
+	const cardAspectRatio = cardKind === "short" ? WATERFALL_SHORT_CARD_ASPECT_RATIO : WATERFALL_TALL_CARD_ASPECT_RATIO;
+	const coverUrl = resolveWaterfallCoverUrl(item, cardKind);
+	const titleText = item.name || item?.title || "";
+	const detailPath = item.id ? buildDetailPath(item) : "#";
+	const legacyDisplay = buildWaterfallRecommendLegacyDisplay({
+		title: titleText,
+		badgeImageUrl: resolveCornerIconUrl(item, icon, index),
+		episodeText: buildGridEpisodeText(item, showEpisode),
+		heatText: showPlayCount ? buildHomeRecommendHeatText(resolveHomeRecommendBrowseCount(item), playCountDelta) : "",
+		score: normalizeWaterfallScore(item.score)
+	});
+	const normalizedBadgeImageUrl = normalizeRecommendBadgeUrl(legacyDisplay.topLeftBadgeImageUrl);
+	/** 内容曝光观察：非广告内容 ≥50% 可见时触发一次。 */
+	useEffect(() => {
+		const target = wrapperRef.current;
+		if (!target || !onContentView || isFeedAdItem(item)) return;
+		const observer = new IntersectionObserver((entries) => {
+			if (entries[0]?.isIntersecting) {
+				onContentView(item);
+				observer.disconnect();
+			}
+		}, { threshold: .5 });
+		observer.observe(target);
+		return () => {
+			observer.disconnect();
+		};
+	}, [item, onContentView]);
+	return /* @__PURE__ */ jsx(Link, {
+		href: detailPath,
+		className: "block w-full",
+		onClick: (e) => onContentClick?.(item, e),
+		style: widthStyle,
+		children: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Box, {
+			className: "relative w-full overflow-hidden rounded-[8px] bg-bg3",
+			style: { aspectRatio: cardAspectRatio },
+			children: [
+				coverUrl && /* @__PURE__ */ jsx(Image, {
+					src: coverUrl,
+					alt: titleText || "推荐封面",
+					fill: true,
+					objectFit: "cover",
+					className: "object-cover object-top"
+				}),
+				/* @__PURE__ */ jsx(Box, {
+					className: "pointer-events-none absolute inset-0 rounded-[8px]",
+					style: GRID_CARD_MASK_STYLE,
+					"aria-hidden": true
+				}),
+				normalizedBadgeImageUrl && /* @__PURE__ */ jsx(Box, {
+					className: RECOMMEND_TOP_LEFT_BADGE_WRAPPER_CLASS_NAME,
+					children: /* @__PURE__ */ jsx(Image, {
+						src: normalizedBadgeImageUrl,
+						alt: "角标",
+						width: 96,
+						height: 18,
+						className: RECOMMEND_BADGE_IMAGE_CLASS_NAME
+					})
+				}),
+				legacyDisplay.topRightScoreText && /* @__PURE__ */ jsx(Text, {
+					as: "span",
+					className: "absolute right-[8px] top-[8px] z-10 shrink-0 text-[14px] leading-[22px] font-semibold text-[#FFC24B]",
+					children: legacyDisplay.topRightScoreText
+				}),
+				/* @__PURE__ */ jsxs(Box, {
+					className: "absolute left-[8px] right-[8px] bottom-[8px] z-10 flex items-end justify-between gap-[8px]",
+					children: [/* @__PURE__ */ jsx(Box, {
+						className: "flex min-w-0 items-center gap-[4px]",
+						children: legacyDisplay.bottomLeftHeatText && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(SvgVideoFlag, { className: "h-[16px] w-[16px] shrink-0 text-white" }), /* @__PURE__ */ jsx(Text, {
+							as: "span",
+							className: "min-w-0 truncate text-[14px] leading-[20px] text-white",
+							children: legacyDisplay.bottomLeftHeatText
+						})] })
+					}), legacyDisplay.bottomRightEpisodeText && /* @__PURE__ */ jsx(Text, {
+						as: "span",
+						className: "shrink-0 text-[14px] leading-[20px] text-white",
+						children: legacyDisplay.bottomRightEpisodeText
+					})]
+				})
+			]
+		}), /* @__PURE__ */ jsx(Box, {
+			className: "mt-[8px] overflow-hidden",
+			children: /* @__PURE__ */ jsx(Text, {
+				as: "h3",
+				className: "line-clamp-2 text-[16px] leading-[22px] text-[--color-text-white80]",
+				children: legacyDisplay.title
+			})
+		})] })
+	});
+}
+/**
+* 根据内容数据生成详情页链接。
+*/
+function buildDetailPath(info) {
+	const encodedName = encodeURIComponent(info.name || "");
+	return `/video/${info.id || ""}/${encodedName}/episode/1`;
+}
+/**
+* 解析推荐位“更多”跳转链接。
+*/
+function resolveMoreLink(moreLink) {
+	if (!moreLink) return "";
+	return moreLink.trim();
+}
+/**
+* 将配置值归一化为正整数并限制上限。
+*/
+function clampPositiveInt(value, fallback, max) {
+	const normalized = Number(value);
+	if (!Number.isFinite(normalized) || normalized <= 0) return fallback;
+	return Math.min(max, Math.floor(normalized));
+}
+/**
+* 解析单卡显示配置。
+*/
+function resolveCardDisplayConfig(item) {
+	return item[HOME_RECOMMEND_CARD_CONFIG_FIELD];
+}
+/**
+* 将不同结构的角标字段解析成图片 URL。
+*/
+function resolveIconUrl(source) {
+	return typeof source === "string" ? source : "";
+}
+/**
+* 归一化文本。
+*/
+function normalizeText(value) {
+	return typeof value === "string" ? value.trim() : "";
+}
+/**
+* 解析瀑布流卡片高矮类型。
+*/
+function resolveWaterfallCardKind(item) {
+	const imageType = normalizeText(item.img_type).toLowerCase();
+	if (imageType === "long") return "short";
+	if (imageType === "short") return "tall";
+	return "tall";
+}
+/**
+* 解析瀑布流卡片高度。
+*/
+function resolveWaterfallCoverUrl(item, cardKind) {
+	if (cardKind === "short") return item.img_x || item.img_y || item?.coverUrl;
+	return item.img_y || item.img_x || item?.coverUrl;
+}
+/**
+* 解析瀑布流首行辅助文案。
+*/
+function resolveWaterfallMetaPrimaryText(item, showEpisode) {
+	const tagsText = item.tags?.map((t) => t.name).filter(Boolean).join(" · ") ?? "";
+	if (tagsText) return tagsText;
+	return showEpisode ? buildVideoInfoText(item, true) : "";
+}
+/**
+* 归一化瀑布流评分。
+*/
+function normalizeWaterfallScore(value) {
+	const numericValue = Number(value);
+	if (!Number.isFinite(numericValue) || numericValue <= 0) return;
+	if (numericValue > 10 && numericValue <= 100) return numericValue / 10;
+	return Math.min(numericValue, 10);
+}
+/**
+* 根据内容类型生成视频信息文案。
+*/
+function buildVideoInfoText(item, showEpisode) {
+	if (!showEpisode) return "";
+	const episodeText = buildSeriesEpisodeText(item);
+	if (episodeText) return episodeText;
+	return formatDuration(Number(item.duration || 0));
+}
+/**
+* 构建宫格卡片右上角集数文案。
+*/
+function buildGridEpisodeText(item, showEpisode) {
+	if (!showEpisode) return "";
+	return buildSeriesEpisodeText(item);
+}
+/**
+* 构建剧集集数文案。
+*/
+function buildSeriesEpisodeText(item) {
+	if (!isSeriesContent(item)) return "";
+	const isUpdating = item.update_status === "0";
+	const totalEpisodes = Number(item.episode_cnt || item.links?.length || 0);
+	return totalEpisodes > 0 ? `${isUpdating ? "更新至" : "全"}${totalEpisodes}集` : "";
+}
+/**
+* 根据多字段兜底判断当前内容是否为剧集。
+*/
+function isSeriesContent(item) {
+	if (Number(item.type ?? 0) === 2) return true;
+	const totalEpisodes = Number(item.episode_cnt || item.links?.length || 0);
+	return Number.isFinite(totalEpisodes) && totalEpisodes > 1;
+}
+/**
+* 格式化视频时长为 HH:mm:ss 或 mm:ss。
+*/
+function formatDuration(duration) {
+	if (!Number.isFinite(duration) || duration <= 0) return "";
+	const totalSeconds = Math.floor(duration);
+	const hours = Math.floor(totalSeconds / 3600);
+	const minutes = Math.floor(totalSeconds % 3600 / 60);
+	const seconds = totalSeconds % 60;
+	const formatNumber = (value) => String(value).padStart(2, "0");
+	if (hours > 0) return `${formatNumber(hours)}:${formatNumber(minutes)}:${formatNumber(seconds)}`;
+	return `${formatNumber(minutes)}:${formatNumber(seconds)}`;
+}
+/**
+* 解析角标图片 URL。
+*/
+function resolveCornerIconUrl(item, icon, _index) {
+	return resolveIconUrl(item.badge_url) || resolveIconUrl(icon?.material_url) || "";
+}
+/**
+* 将业务数据映射为公共瀑布流 UI 数据。
+*/
+function buildWaterfallUiItem(entry, showPlayCount, playCountDelta, showEpisode) {
+	const cardKind = resolveWaterfallCardKind(entry.item);
+	const coverUrl = resolveWaterfallCoverUrl(entry.item, cardKind);
+	const titleText = entry.item.name || entry.item?.title || "";
+	const detailPath = entry.item.id ? buildDetailPath(entry.item) : "#";
+	const badgeImageUrl = resolveCornerIconUrl(entry.item, entry.icon, entry.index);
+	const episodeText = buildVideoInfoText(entry.item, showEpisode);
+	const metaPrimaryText = resolveWaterfallMetaPrimaryText(entry.item, showEpisode);
+	const heatText = showPlayCount ? buildHomeRecommendHeatText(resolveHomeRecommendBrowseCount(entry.item), playCountDelta) : "";
+	const score = normalizeWaterfallScore(entry.item.score);
+	return {
+		key: buildItemKey(entry.item, entry.index),
+		sourceIndex: entry.index,
+		href: detailPath,
+		cardKind,
+		coverUrl,
+		title: titleText,
+		badgeImageUrl,
+		episodeText,
+		metaPrimaryText,
+		heatText,
+		score
+	};
+}
+/**
+* 生成瀑布流布局列数据。
+*/
+function buildWaterfallColumns(items, icons, columnWidth) {
+	const left = [];
+	const right = [];
+	const shouldUseEvenSplit = columnWidth <= 0;
+	let leftHeight = 0;
+	let rightHeight = 0;
+	items.forEach((item, index) => {
+		const icon = icons[index];
+		if (shouldUseEvenSplit) {
+			if (index % 2 === 0) left.push({
+				item,
+				icon,
+				index
+			});
+			else right.push({
+				item,
+				icon,
+				index
+			});
+			return;
+		}
+		const estimatedHeight = estimateCardHeight(columnWidth, item);
+		if (leftHeight <= rightHeight) {
+			left.push({
+				item,
+				icon,
+				index
+			});
+			leftHeight += estimatedHeight;
+		} else {
+			right.push({
+				item,
+				icon,
+				index
+			});
+			rightHeight += estimatedHeight;
+		}
+	});
+	return {
+		left,
+		right
+	};
+}
+/**
+* 预估瀑布流卡片高度，用于分配列。
+*/
+function estimateCardHeight(columnWidth, item) {
+	if (!columnWidth) return 0;
+	return (resolveWaterfallCardKind(item) === "tall" ? WATERFALL_TALL_CARD_HEIGHT : WATERFALL_SHORT_CARD_HEIGHT) + WATERFALL_CARD_GAP;
+}
+/**
+* 生成列表项唯一 key。
+*/
+function buildItemKey(item, index) {
+	return item.id ? `home-recommend-${item.id}-${index}` : `home-recommend-${index}`;
+}
+
+//#endregion
+export { HomeRecommendBase as default };