@funhub/platform 0.2.31 → 0.2.32

package/dist/components/common/series-episodes/index.mjs

@@ -1,827 +1,2 @@
 
-'use client';
-
-import { trackPageClick } from "../../../utils/tracking.mjs";
-import { Box } from "../../ui/box.mjs";
-import { Text } from "../../ui/text.mjs";
-import { Sheet, SheetContent, SheetHeader, SheetTitle } from "../../ui/sheet.mjs";
-import { Switch } from "../../ui/switch.mjs";
-import { useKeepAliveState } from "../keep-scroll-position/index.mjs";
-import SvgRightArrow from "../../../assets/icons/common/right_arrow.mjs";
-import Popup from "../../ui/popup.mjs";
-import { toast } from "sonner";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { useTranslations } from "next-intl";
-
-//#region components/common/series-episodes/index.tsx
-const SHEET_EPISODES_PER_GROUP = 50;
-const POPUP_EPISODES_PER_GROUP = 50;
-const EPISODE_SWITCH_SUCCESS_TOAST_DELAY_MS = 1e3;
-const INLINE_EPISODE_MID_RIGHT_TRIGGER_RATIO = .5;
-const DETAIL_SERIES_POPUP_QUERY_EVENT = "funhub:detail-series-popup-query";
-const DETAIL_SERIES_POPUP_CLOSE_EVENT = "funhub:detail-series-popup-close";
-const DETAIL_STYLE_ONE_ACTIVE_EPISODE_BACKGROUND_FILL = "linear-gradient(90deg, rgba(246,206,255,0.1) 0%, rgba(246,206,255,0.1) 100%), linear-gradient(90deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.1) 100%)";
-const DETAIL_STYLE_ONE_ACTIVE_EPISODE_BORDER_GRADIENT = "linear-gradient(90deg, rgba(255,30,172,0.7) 0%, rgba(108,67,238,0) 100%), linear-gradient(180deg, #9756E3 0%, #6C43EE 100%)";
-const DETAIL_STYLE_ONE_ACTIVE_EPISODE_INNER_RADIUS = "7.5px";
-/**
-* 判断是否为「详情选集弹窗状态查询」事件。
-*/
-function isDetailSeriesPopupQueryEvent(event) {
-	return event.type === DETAIL_SERIES_POPUP_QUERY_EVENT && event instanceof CustomEvent;
-}
-function EpisodeTitleToggleIcon({ active }) {
-	if (active) return /* @__PURE__ */ jsxs("svg", {
-		width: "24",
-		height: "24",
-		viewBox: "0 0 24 24",
-		fill: "none",
-		xmlns: "http://www.w3.org/2000/svg",
-		className: "shrink-0",
-		"aria-hidden": true,
-		children: [/* @__PURE__ */ jsx("circle", {
-			cx: "16",
-			cy: "12",
-			r: "3",
-			fill: "white"
-		}), /* @__PURE__ */ jsx("path", {
-			d: "M8 5H16C19.866 5 23 8.13401 23 12C23 15.866 19.866 19 16 19H8C4.13401 19 1 15.866 1 12C1 8.13401 4.13401 5 8 5ZM16 15C17.6569 15 19 13.6569 19 12C19 10.3431 17.6569 9 16 9C14.3431 9 13 10.3431 13 12C13 13.6569 14.3431 15 16 15Z",
-			fill: "#9054E5"
-		})]
-	});
-	return /* @__PURE__ */ jsxs("svg", {
-		width: "24",
-		height: "24",
-		viewBox: "0 0 24 24",
-		fill: "none",
-		xmlns: "http://www.w3.org/2000/svg",
-		className: "shrink-0",
-		"aria-hidden": true,
-		children: [/* @__PURE__ */ jsx("path", {
-			d: "M1.5 12C1.5 8.68629 4.18629 6 7.5 6H16.5C19.8137 6 22.5 8.68629 22.5 12C22.5 15.3137 19.8137 18 16.5 18H7.5C4.18629 18 1.5 15.3137 1.5 12Z",
-			stroke: "currentColor",
-			strokeWidth: "1.5",
-			strokeOpacity: "0.6"
-		}), /* @__PURE__ */ jsx("circle", {
-			cx: "9",
-			cy: "12",
-			r: "3",
-			fill: "rgba(255,255,255,0.6)"
-		})]
-	});
-}
-function DetailPopupCloseIcon() {
-	return /* @__PURE__ */ jsx("svg", {
-		width: "20",
-		height: "20",
-		viewBox: "0 0 20 20",
-		fill: "none",
-		xmlns: "http://www.w3.org/2000/svg",
-		className: "block h-[20px] w-[20px]",
-		"aria-hidden": true,
-		children: /* @__PURE__ */ jsx("path", {
-			d: "M10 8.61116L14.8611 3.75L16.25 5.13889L11.3889 10L16.25 14.8611L14.8611 16.25L10 11.3889L5.13889 16.25L3.75 14.8611L8.61111 10L3.75 5.13889L5.13889 3.75L10 8.61116Z",
-			fill: "currentColor"
-		})
-	});
-}
-/**
-* 构建分集标题展示文案：
-* - 始终包含「第 N 集」前缀
-* - 有视频标题时拼接在后面
-* - 若标题本身已等于分集文案，避免重复
-*/
-function buildEpisodeDisplayTitle(episodeLabel, rawTitle) {
-	const normalizedTitle = String(rawTitle || "").trim();
-	if (!normalizedTitle) return episodeLabel;
-	const compactEpisodeLabel = episodeLabel.replace(/\s+/g, "");
-	if (normalizedTitle.replace(/\s+/g, "") === compactEpisodeLabel) return episodeLabel;
-	return `${episodeLabel} ${normalizedTitle}`;
-}
-/**
-* 把后端/业务侧的「剧集列表」规范化为统一结构：
-* - `series_num`: 优先从 name 解析数字，否则按 index+1
-* - `title`: 数字则显示 `第{n}集`，非数字则尽量透传 name
-*/
-function normalizeEpisodes(list, fallbackIdPrefix, formatEpisodeLabel) {
-	return (list || []).map((item, index) => {
-		const parsed = Number.parseInt(item?.id || "", 10);
-		const seriesNum = Number.isNaN(parsed) ? index + 1 : parsed;
-		const rawName = item?.name || "";
-		const displayName = buildEpisodeDisplayTitle(formatEpisodeLabel(seriesNum), rawName);
-		return {
-			id: item?.id || `${fallbackIdPrefix}-${seriesNum}`,
-			series_num: seriesNum,
-			title: displayName
-		};
-	});
-}
-/**
-* 详情页：保持兼容既有文案（`第{name}集`），并用 name 参与编号解析。
-*/
-function normalizeEpisodesForDetail(list, fallbackIdPrefix, formatEpisodeLabel) {
-	return (list || []).map((item, index) => {
-		const parsedSeriesNum = Number(item?.id);
-		const seriesNum = Number.isNaN(parsedSeriesNum) ? index + 1 : parsedSeriesNum;
-		const displayName = formatEpisodeLabel(seriesNum);
-		return {
-			id: item?.id || `${fallbackIdPrefix}-${seriesNum}`,
-			series_num: seriesNum,
-			title: displayName
-		};
-	});
-}
-/**
-* 构建「选集」弹层的摘要文案。
-*/
-function buildSeriesSummaryText(total, updateStatus, t) {
-	if (total <= 0) return t("singleContent");
-	if (updateStatus === "1") return t("completedSeriesTotal", { total });
-	return t("ongoingSeriesTotal", { total });
-}
-function DetailStyleOneActiveBorderLayer() {
-	return /* @__PURE__ */ jsx("span", {
-		"aria-hidden": true,
-		className: "pointer-events-none absolute inset-0 overflow-hidden rounded-[8px] p-[0.5px]",
-		style: { backgroundImage: DETAIL_STYLE_ONE_ACTIVE_EPISODE_BORDER_GRADIENT },
-		children: /* @__PURE__ */ jsx("span", {
-			className: "block h-full w-full",
-			style: {
-				borderRadius: DETAIL_STYLE_ONE_ACTIVE_EPISODE_INNER_RADIUS,
-				backgroundColor: "#000000",
-				backgroundImage: DETAIL_STYLE_ONE_ACTIVE_EPISODE_BACKGROUND_FILL
-			}
-		})
-	});
-}
-function SeriesEpisodes(props) {
-	if (props.mode === "detail") return /* @__PURE__ */ jsx(DetailSeriesEpisodes, {
-		information: props.information,
-		series_num: props.series_num,
-		onEpisodeChange: props.onEpisodeChange
-	});
-	return /* @__PURE__ */ jsx(SelectorSeriesEpisodes, {
-		open: props.open,
-		variant: props.variant,
-		title: props.title,
-		videoTitle: props.videoTitle,
-		updateStatus: props.updateStatus,
-		summaryText: props.summaryText,
-		seriesList: props.seriesList,
-		activeEpisodeId: props.activeEpisodeId,
-		showEpisodeTitle: props.showEpisodeTitle,
-		onToggleTitle: props.onToggleTitle,
-		onClose: props.onClose,
-		onSelectEpisode: props.onSelectEpisode,
-		popupBodyStyle: props.popupBodyStyle,
-		popupStylePreset: props.popupStylePreset
-	});
-}
-/**
-* SelectorSeriesEpisodes
-*
-* 用于「只需要弹层」的场景（例如全屏流/剧集页）。
-*/
-function SelectorSeriesEpisodes({ open, variant, title, videoTitle, updateStatus, summaryText, seriesList, activeEpisodeId, showEpisodeTitle = false, onToggleTitle, onClose, onSelectEpisode, popupBodyStyle, popupStylePreset = "default" }) {
-	const t = useTranslations("components.common.seriesEpisodes");
-	const canToggleTitle = Boolean(onToggleTitle);
-	const useTitleLayout = canToggleTitle && showEpisodeTitle;
-	const useDetailStyleOnePopup = variant === "popup" && popupStylePreset === "detail-style-one";
-	const episodesPerGroup = variant === "popup" ? POPUP_EPISODES_PER_GROUP : SHEET_EPISODES_PER_GROUP;
-	const listRef = useRef(null);
-	const scrollToTopRafRef = useRef(null);
-	const episodes = useMemo(() => {
-		return normalizeEpisodes(seriesList, "episode", (episode) => t("episodeLabel", { episode }));
-	}, [seriesList, t]);
-	const episodeGroups = useMemo(() => {
-		if (episodes.length === 0) return [];
-		const groups = [];
-		episodes.forEach((item, index) => {
-			const groupIndex = Math.floor(index / episodesPerGroup);
-			if (!groups[groupIndex]) groups[groupIndex] = [];
-			groups[groupIndex].push(item);
-		});
-		return groups;
-	}, [episodes, episodesPerGroup]);
-	const activeGroupIndex = useMemo(() => {
-		if (!activeEpisodeId) return 0;
-		const activeIndex = episodes.findIndex((item) => item.id === activeEpisodeId);
-		if (activeIndex < 0) return 0;
-		return Math.floor(activeIndex / episodesPerGroup);
-	}, [
-		activeEpisodeId,
-		episodes,
-		episodesPerGroup
-	]);
-	const [groupIndex, setGroupIndex] = useState(activeGroupIndex);
-	useEffect(() => {
-		setGroupIndex(activeGroupIndex);
-	}, [activeGroupIndex]);
-	const resolvedSummaryText = useMemo(() => {
-		if (typeof summaryText === "string" && summaryText.trim()) return summaryText;
-		return buildSeriesSummaryText(episodes.length, updateStatus, t);
-	}, [
-		episodes.length,
-		summaryText,
-		t,
-		updateStatus
-	]);
-	const resolvedTitle = title || t("selectorTitle");
-	const resolvedVideoTitle = String(videoTitle || "").trim();
-	const resolveEpisodeButtonTitle = useCallback((item) => {
-		return buildEpisodeDisplayTitle(t("episodeLabel", { episode: item.series_num }), resolvedVideoTitle);
-	}, [resolvedVideoTitle, t]);
-	function scrollToTop() {
-		const el = listRef.current;
-		if (!el) return;
-		if (scrollToTopRafRef.current) {
-			window.cancelAnimationFrame(scrollToTopRafRef.current);
-			scrollToTopRafRef.current = null;
-		}
-		el.scrollTop = 0;
-		try {
-			el.scrollTo({
-				top: 0,
-				left: 0,
-				behavior: "auto"
-			});
-		} catch {}
-		scrollToTopRafRef.current = window.requestAnimationFrame(() => {
-			scrollToTopRafRef.current = null;
-			const latest = listRef.current;
-			if (latest) latest.scrollTop = 0;
-		});
-	}
-	useEffect(() => {
-		if (open) scrollToTop();
-	}, [
-		open,
-		showEpisodeTitle,
-		groupIndex
-	]);
-	function handleToggleTitle(nextValue) {
-		if (!onToggleTitle) return;
-		onToggleTitle(nextValue);
-		scrollToTop();
-	}
-	function handleSelectEpisode(item) {
-		onSelectEpisode?.(item.id, item.series_num);
-		onClose();
-	}
-	const columns = useTitleLayout ? 2 : 5;
-	const groupTabs = episodeGroups.length > 1 ? /* @__PURE__ */ jsx("div", {
-		className: "shrink-0 w-full flex gap-[8px] overflow-x-auto",
-		children: episodeGroups.map((group, index) => {
-			if (group.length === 0) return null;
-			const isActive = index === groupIndex;
-			const start = index * episodesPerGroup + 1;
-			const end = Math.min((index + 1) * episodesPerGroup, episodes.length);
-			return /* @__PURE__ */ jsxs("div", {
-				className: `shrink-0 px-[16px] py-[6px] rounded-[16px] text-[14px] transition-colors cursor-pointer relative overflow-hidden ${isActive ? "text-theme5 bg-bg2" : "text-text2 bg-bg2"}`,
-				onClick: () => {
-					setGroupIndex(index);
-					scrollToTop();
-				},
-				children: [
-					start,
-					"-",
-					end,
-					isActive && /* @__PURE__ */ jsx("div", { className: "absolute w-full h-full top-0 left-0 opacity-20 bg-theme5" })
-				]
-			}, `series-group-${index}`);
-		})
-	}) : null;
-	const summaryRow = /* @__PURE__ */ jsxs("div", {
-		className: "pb-[8px] flex justify-between",
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "text-[16px] text-text1",
-			children: resolvedSummaryText
-		}), canToggleTitle && /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-[4px]",
-			children: [/* @__PURE__ */ jsx(Switch, {
-				size: "sm",
-				className: "data-checked:bg-theme5 h-[20px] w-[33px]",
-				checked: showEpisodeTitle,
-				onCheckedChange: (value) => {
-					handleToggleTitle(Boolean(value));
-				}
-			}), /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "text-[16px] text-text1",
-				onClick: () => {
-					handleToggleTitle(!showEpisodeTitle);
-				},
-				children: t("episodeTitle")
-			})]
-		})]
-	});
-	const grid = /* @__PURE__ */ jsx("div", {
-		className: `grid w-full gap-2 ${columns === 2 ? "grid-cols-2" : "grid-cols-5"}`,
-		children: (episodeGroups[groupIndex] || []).map((item, index) => {
-			const isActive = Boolean(activeEpisodeId && item.id === activeEpisodeId);
-			return /* @__PURE__ */ jsx("button", {
-				type: "button",
-				"data-episode-id": item.id,
-				onClick: () => {
-					handleSelectEpisode(item);
-				},
-				className: `flex items-center justify-center w-full h-[56px] rounded-[8px] transition-colors ${isActive ? "" : "bg-white/10"} cursor-pointer select-none transition-colors relative overflow-hidden ${useTitleLayout ? "h-[72px] px-[10px] text-[14px]" : ""} ${index % columns === 0 ? "" : "border-l-0"}`,
-				children: useTitleLayout ? /* @__PURE__ */ jsx("span", {
-					className: "block w-full truncate leading-[22px]",
-					children: resolveEpisodeButtonTitle(item)
-				}) : item.series_num
-			}, item.id);
-		})
-	});
-	const popupGroupTabs = episodeGroups.length > 1 ? /* @__PURE__ */ jsx("div", {
-		className: "flex gap-[8px] overflow-x-auto [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden",
-		children: episodeGroups.map((group, index) => {
-			if (group.length === 0) return null;
-			const isActive = index === groupIndex;
-			const start = index * episodesPerGroup + 1;
-			const end = Math.min((index + 1) * episodesPerGroup, episodes.length);
-			return /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: `flex h-[28px] w-[72px] shrink-0 items-center justify-center rounded-[100px] px-[4px] transition-colors ${isActive ? "bg-[linear-gradient(90deg,#9756E3_0%,#6C43EE_100%)] text-white" : "bg-white/20 text-white"}`,
-				onClick: () => {
-					setGroupIndex(index);
-					scrollToTop();
-				},
-				children: /* @__PURE__ */ jsxs("span", {
-					className: "font-['PingFang_SC'] text-[14px] font-normal not-italic leading-[20px]",
-					children: [
-						start,
-						"-",
-						end
-					]
-				})
-			}, `series-popup-group-${index}`);
-		})
-	}) : null;
-	const popupSummaryRow = /* @__PURE__ */ jsxs("div", {
-		className: "flex items-center justify-between",
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "font-['PingFang_SC'] text-[14px] font-normal not-italic leading-[24px] text-white/60",
-			children: resolvedSummaryText
-		}), canToggleTitle && /* @__PURE__ */ jsxs("button", {
-			type: "button",
-			className: "flex items-center gap-[3px] text-white/60",
-			onClick: () => {
-				handleToggleTitle(!showEpisodeTitle);
-			},
-			children: [/* @__PURE__ */ jsx(EpisodeTitleToggleIcon, { active: showEpisodeTitle }), /* @__PURE__ */ jsx("span", {
-				className: "font-['PingFang_SC'] text-[14px] font-normal not-italic leading-[24px] text-white/60",
-				children: t("episodeTitle")
-			})]
-		})]
-	});
-	const popupGrid = useTitleLayout ? /* @__PURE__ */ jsx("div", {
-		className: "flex w-full flex-col gap-[12px]",
-		children: (episodeGroups[groupIndex] || []).map((item) => {
-			const isActive = Boolean(activeEpisodeId && item.id === activeEpisodeId);
-			return /* @__PURE__ */ jsxs("button", {
-				type: "button",
-				"data-episode-id": item.id,
-				onClick: () => {
-					handleSelectEpisode(item);
-				},
-				className: `relative flex w-full items-start overflow-hidden rounded-[8px] px-[16px] py-[18px] text-left transition-colors ${isActive ? useDetailStyleOnePopup ? "" : "border border-[#FF1EFF] bg-[linear-gradient(90deg,rgba(246,206,255,0.1)_0%,rgba(246,206,255,0.1)_100%),linear-gradient(90deg,rgba(255,255,255,0.1)_0%,rgba(255,255,255,0.1)_100%)]" : "bg-white/10"}`,
-				children: [isActive && useDetailStyleOnePopup && /* @__PURE__ */ jsx(DetailStyleOneActiveBorderLayer, {}), /* @__PURE__ */ jsx("span", {
-					className: `relative z-[1] block w-full truncate font-['PingFang_SC'] text-[14px] ${isActive ? "font-medium leading-[16px] text-[#CA3FE9]" : "font-normal leading-[16px] text-white/80"}`,
-					children: resolveEpisodeButtonTitle(item)
-				})]
-			}, `popup-${item.id}`);
-		})
-	}) : /* @__PURE__ */ jsx("div", {
-		className: "grid w-full grid-cols-[repeat(6,52px)] justify-between gap-y-[8px]",
-		children: (episodeGroups[groupIndex] || []).map((item) => {
-			const isActive = Boolean(activeEpisodeId && item.id === activeEpisodeId);
-			return /* @__PURE__ */ jsxs("button", {
-				type: "button",
-				"data-episode-id": item.id,
-				onClick: () => {
-					handleSelectEpisode(item);
-				},
-				className: `relative flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-[8px] transition-colors ${isActive ? useDetailStyleOnePopup ? "text-[#9756E3]" : "border border-[#E62AFF]/90 bg-[linear-gradient(90deg,rgba(246,206,255,0.1)_0%,rgba(246,206,255,0.1)_100%),linear-gradient(90deg,rgba(255,255,255,0.1)_0%,rgba(255,255,255,0.1)_100%)] text-[#9756E3]" : "bg-white/10 text-white/80"}`,
-				children: [isActive && useDetailStyleOnePopup && /* @__PURE__ */ jsx(DetailStyleOneActiveBorderLayer, {}), /* @__PURE__ */ jsx("span", {
-					className: "relative z-[1] font-['PingFang_SC'] text-[16px] font-medium not-italic leading-[16px]",
-					children: item.series_num
-				})]
-			}, `popup-${item.id}`);
-		})
-	});
-	if (variant === "sheet") return /* @__PURE__ */ jsx(Sheet, {
-		open,
-		onOpenChange: (next) => !next && onClose(),
-		children: /* @__PURE__ */ jsxs(SheetContent, {
-			side: "bottom",
-			showCloseButton: true,
-			className: "min-h-[50vh] bg-bg1 text-text1 rounded-t-2xl border-t border-white/10",
-			children: [
-				/* @__PURE__ */ jsx(SheetHeader, {
-					className: "pt-3 pb-0",
-					children: /* @__PURE__ */ jsx(SheetTitle, {
-						className: "flex items-center justify-between text-lg text-text1",
-						children: resolvedTitle
-					})
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "px-4 pb-2 flex flex-col gap-3",
-					children: [groupTabs, summaryRow]
-				}),
-				/* @__PURE__ */ jsx("div", {
-					ref: listRef,
-					className: "flex-1 h-0 pt-[4px] pb-[12px] overflow-y-auto px-4",
-					children: grid
-				})
-			]
-		})
-	});
-	return /* @__PURE__ */ jsx(Popup, {
-		open,
-		onOpenChange: (next) => {
-			if (!next) onClose();
-		},
-		showCloseButton: false,
-		className: "!gap-0 !border-0 !bg-transparent !p-0 !shadow-none",
-		overlayClassName: "bg-black/50 backdrop-blur-0",
-		children: /* @__PURE__ */ jsxs(Box, {
-			className: "flex h-full w-full flex-col overflow-hidden rounded-t-[16px] bg-black text-text1",
-			style: {
-				height: "70vh",
-				...popupBodyStyle
-			},
-			children: [/* @__PURE__ */ jsxs(Box, {
-				className: "shrink-0 flex items-center justify-between px-[16px] pt-[32px]",
-				children: [/* @__PURE__ */ jsx(Text, {
-					className: "font-['PingFang_SC'] text-[18px] font-medium not-italic leading-[24px] text-white",
-					children: resolvedTitle
-				}), /* @__PURE__ */ jsx("button", {
-					type: "button",
-					"aria-label": "关闭",
-					className: "flex h-[24px] w-[24px] items-center justify-center text-white opacity-60",
-					onClick: onClose,
-					children: /* @__PURE__ */ jsx("span", {
-						className: "flex h-[24px] w-[24px] items-center overflow-hidden p-[2px]",
-						children: /* @__PURE__ */ jsx(DetailPopupCloseIcon, {})
-					})
-				})]
-			}), /* @__PURE__ */ jsx(Box, {
-				className: "flex-1 h-0 w-full px-[16px] pb-[24px]",
-				children: /* @__PURE__ */ jsxs(Box, {
-					className: "flex h-full flex-col",
-					children: [
-						popupGroupTabs && /* @__PURE__ */ jsx(Box, {
-							className: "mt-[16px] shrink-0",
-							children: popupGroupTabs
-						}),
-						/* @__PURE__ */ jsx(Box, {
-							className: "mt-[16px] shrink-0",
-							children: popupSummaryRow
-						}),
-						/* @__PURE__ */ jsx(Box, {
-							ref: listRef,
-							className: `flex-1 overflow-y-auto pb-[17px] [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden ${useTitleLayout ? "mt-[12px]" : "mt-[8px]"}`,
-							children: popupGrid
-						})
-					]
-				})
-			})]
-		})
-	});
-}
-/**
-* DetailSeriesEpisodes
-*
-* 用于视频详情页：包含“选集入口 + 横向集数条 + 弹层”。
-*/
-function DetailSeriesEpisodes({ information, series_num, onEpisodeChange }) {
-	const t = useTranslations("components.common");
-	const [selectSeriesVisible, setSelectSeriesVisible] = useKeepAliveState(`detail-series-popup-${information.id}`, false);
-	const [showEpisodeTitle, setShowEpisodeTitle] = useKeepAliveState(`detail-series-title-toggle-${information.id}`, false);
-	const [savedEpisodeScrollLeft, setSavedEpisodeScrollLeft] = useKeepAliveState(`detail-series-scroll-left-${information.id}`, null);
-	const [optimisticSeriesNum, setOptimisticSeriesNum] = useState(series_num);
-	useEffect(() => {
-		setOptimisticSeriesNum(series_num);
-	}, [information.id, series_num]);
-	/**
-	* 对外暴露「关闭选集弹窗」事件，供 WebView 导航守卫主动收口。
-	*/
-	useEffect(() => {
-		if (typeof window === "undefined") return;
-		const handleCloseSeriesPopup = () => {
-			setSelectSeriesVisible(false);
-		};
-		window.addEventListener(DETAIL_SERIES_POPUP_CLOSE_EVENT, handleCloseSeriesPopup);
-		return () => {
-			window.removeEventListener(DETAIL_SERIES_POPUP_CLOSE_EVENT, handleCloseSeriesPopup);
-		};
-	}, [setSelectSeriesVisible]);
-	/**
-	* 对外暴露「选集弹窗是否打开」查询事件，支持多实例合并状态。
-	*/
-	useEffect(() => {
-		if (typeof window === "undefined") return;
-		const handleQuerySeriesPopupState = (event) => {
-			if (!isDetailSeriesPopupQueryEvent(event)) return;
-			const detail = event.detail || {};
-			detail.open = Boolean(detail.open) || Boolean(selectSeriesVisible);
-		};
-		window.addEventListener(DETAIL_SERIES_POPUP_QUERY_EVENT, handleQuerySeriesPopupState);
-		return () => {
-			window.removeEventListener(DETAIL_SERIES_POPUP_QUERY_EVENT, handleQuerySeriesPopupState);
-		};
-	}, [selectSeriesVisible]);
-	useEffect(() => {
-		if (selectSeriesVisible) trackPageClick("page_video_detail", "详情页", null, "detail_select_episode_popup");
-	}, [selectSeriesVisible]);
-	const seriesItems = useMemo(() => {
-		return normalizeEpisodesForDetail((information.links || []).map((link) => ({
-			id: link.id,
-			name: link.name
-		})), information.id || "episode", (episode) => t("seriesEpisodes.episodeLabel", { episode }));
-	}, [
-		information.id,
-		information.links,
-		t
-	]);
-	const seriesTotalText = information.update_status === "1" ? t("seriesEpisodes.completedSeriesTotal", { total: information.links.length }) : t("seriesEpisodes.ongoingSeriesUpdatedTo", { total: information.links.length });
-	const currentPlayingSeriesId = useMemo(() => {
-		return information.links[optimisticSeriesNum - 1]?.id || information.links[0]?.id || "";
-	}, [information.links, optimisticSeriesNum]);
-	const scrollRef = useRef(null);
-	const switchingTargetSeriesNumRef = useRef(null);
-	const switchingSourceRef = useRef(null);
-	const hasInitialAlignedRef = useRef(false);
-	const switchLoadingToastIdRef = useRef(null);
-	const switchTimeoutRef = useRef(null);
-	const switchSuccessDelayTimeoutRef = useRef(null);
-	const [isEpisodeSwitching, setIsEpisodeSwitching] = useState(false);
-	const scrollToCurrentEpisode = useCallback((targetId, behavior = "smooth") => {
-		const target = scrollRef.current?.querySelector(`[data-content-id="${targetId}"]`);
-		if (target && scrollRef.current) {
-			const parent = scrollRef.current;
-			const targetLeft = Math.max(0, target.offsetLeft - 10);
-			parent.scrollTo({
-				left: targetLeft,
-				behavior
-			});
-		}
-	}, []);
-	const clearSwitchTimeout = useCallback(() => {
-		if (switchTimeoutRef.current === null) return;
-		window.clearTimeout(switchTimeoutRef.current);
-		switchTimeoutRef.current = null;
-	}, []);
-	const clearSwitchSuccessDelayTimeout = useCallback(() => {
-		if (switchSuccessDelayTimeoutRef.current === null) return;
-		window.clearTimeout(switchSuccessDelayTimeoutRef.current);
-		switchSuccessDelayTimeoutRef.current = null;
-	}, []);
-	const hideSwitchLoading = useCallback(() => {
-		if (switchLoadingToastIdRef.current !== null) {
-			toast.dismiss(switchLoadingToastIdRef.current);
-			switchLoadingToastIdRef.current = null;
-		}
-		clearSwitchTimeout();
-		clearSwitchSuccessDelayTimeout();
-	}, [clearSwitchSuccessDelayTimeout, clearSwitchTimeout]);
-	const clearSwitchingState = useCallback(() => {
-		switchingTargetSeriesNumRef.current = null;
-		switchingSourceRef.current = null;
-		hideSwitchLoading();
-		setIsEpisodeSwitching(false);
-	}, [hideSwitchLoading]);
-	const scheduleClearSwitchingState = useCallback((expectedSeriesNum, delay) => {
-		clearSwitchSuccessDelayTimeout();
-		switchSuccessDelayTimeoutRef.current = window.setTimeout(() => {
-			switchSuccessDelayTimeoutRef.current = null;
-			if (switchingTargetSeriesNumRef.current !== expectedSeriesNum) return;
-			clearSwitchingState();
-		}, Math.max(0, delay));
-	}, [clearSwitchSuccessDelayTimeout, clearSwitchingState]);
-	useEffect(() => {
-		hasInitialAlignedRef.current = false;
-	}, [information.id]);
-	useEffect(() => {
-		if (hasInitialAlignedRef.current || !currentPlayingSeriesId) return;
-		const frame = window.requestAnimationFrame(() => {
-			const container = scrollRef.current;
-			if (!container) return;
-			if (typeof savedEpisodeScrollLeft === "number") container.scrollTo({
-				left: Math.max(0, savedEpisodeScrollLeft),
-				behavior: "auto"
-			});
-			else {
-				scrollToCurrentEpisode(currentPlayingSeriesId, "auto");
-				setSavedEpisodeScrollLeft(Math.max(0, Math.round(container.scrollLeft)));
-			}
-			hasInitialAlignedRef.current = true;
-		});
-		return () => {
-			window.cancelAnimationFrame(frame);
-		};
-	}, [
-		currentPlayingSeriesId,
-		savedEpisodeScrollLeft,
-		scrollToCurrentEpisode,
-		setSavedEpisodeScrollLeft
-	]);
-	useEffect(() => {
-		const pendingSeriesNum = switchingTargetSeriesNumRef.current;
-		if (!pendingSeriesNum || pendingSeriesNum !== series_num) return;
-		scheduleClearSwitchingState(pendingSeriesNum, EPISODE_SWITCH_SUCCESS_TOAST_DELAY_MS);
-	}, [scheduleClearSwitchingState, series_num]);
-	useEffect(() => {
-		return () => {
-			clearSwitchingState();
-		};
-	}, [clearSwitchingState]);
-	/**
-	* 点击横向剧集时，若点击点落在容器中线到右侧，则把目标项尽量移动到容器中线位置。
-	*/
-	const maybeCenterInlineEpisodeFromMidRightClick = useCallback((targetId, fallbackScrollLeft, clickClientX) => {
-		const container = scrollRef.current;
-		if (!container || !targetId) return fallbackScrollLeft;
-		const targetElement = container.querySelector(`[data-content-id="${targetId}"]`);
-		if (!targetElement) return fallbackScrollLeft;
-		const containerRect = container.getBoundingClientRect();
-		if (containerRect.width <= 0) return fallbackScrollLeft;
-		if (typeof clickClientX !== "number") return fallbackScrollLeft;
-		if ((clickClientX - containerRect.left) / containerRect.width < INLINE_EPISODE_MID_RIGHT_TRIGGER_RATIO) return fallbackScrollLeft;
-		const targetCenterOffset = targetElement.offsetLeft + targetElement.offsetWidth / 2;
-		const desiredCenterOffset = container.clientWidth / 2;
-		const maxScrollLeft = Math.max(0, container.scrollWidth - container.clientWidth);
-		const nextScrollLeft = Math.min(maxScrollLeft, Math.max(0, targetCenterOffset - desiredCenterOffset));
-		container.scrollTo({
-			left: nextScrollLeft,
-			behavior: "smooth"
-		});
-		return Math.round(nextScrollLeft);
-	}, []);
-	const handleSwitchEpisode = useCallback((episode, source = "inline", targetEpisodeId, clickClientX) => {
-		if (episode === optimisticSeriesNum) return;
-		if (!information.links[episode - 1]) {
-			toast.error(t("seriesEpisodes.episodeNotFound"));
-			return;
-		}
-		if (typeof window !== "undefined" && window.isWebView === true) {
-			try {
-				setOptimisticSeriesNum(episode);
-				const targetId = targetEpisodeId || information.links[episode - 1]?.id || "";
-				const currentScrollLeft = Math.max(0, Math.round(scrollRef.current?.scrollLeft || 0));
-				if (source === "popup") {
-					if (targetId) scrollToCurrentEpisode(targetId, "auto");
-					setSavedEpisodeScrollLeft(Math.max(0, Math.round(scrollRef.current?.scrollLeft || 0)));
-				} else setSavedEpisodeScrollLeft(maybeCenterInlineEpisodeFromMidRightClick(targetId, currentScrollLeft, clickClientX));
-				setIsEpisodeSwitching(true);
-				hideSwitchLoading();
-				switchLoadingToastIdRef.current = toast.loading(t("seriesEpisodes.episodeSwitching"));
-				switchingTargetSeriesNumRef.current = episode;
-				switchingSourceRef.current = source;
-				switchTimeoutRef.current = window.setTimeout(() => {
-					if (switchingTargetSeriesNumRef.current !== episode) return;
-					setOptimisticSeriesNum(series_num);
-					clearSwitchingState();
-					toast.error(t("seriesEpisodes.episodeSwitchFailed"));
-				}, 3e3);
-				onEpisodeChange(episode);
-			} catch (error) {
-				setOptimisticSeriesNum(series_num);
-				clearSwitchingState();
-				console.error("切换剧集失败", error);
-				toast.error(t("seriesEpisodes.episodeSwitchFailed"));
-			}
-			return;
-		}
-		try {
-			setOptimisticSeriesNum(episode);
-			const targetId = targetEpisodeId || information.links[episode - 1]?.id || "";
-			const currentScrollLeft = Math.max(0, Math.round(scrollRef.current?.scrollLeft || 0));
-			if (source === "popup") {
-				if (targetId) scrollToCurrentEpisode(targetId, "auto");
-				setSavedEpisodeScrollLeft(Math.max(0, Math.round(scrollRef.current?.scrollLeft || 0)));
-			} else setSavedEpisodeScrollLeft(maybeCenterInlineEpisodeFromMidRightClick(targetId, currentScrollLeft, clickClientX));
-			setIsEpisodeSwitching(true);
-			hideSwitchLoading();
-			switchLoadingToastIdRef.current = toast.loading(t("seriesEpisodes.episodeSwitching"));
-			switchingTargetSeriesNumRef.current = episode;
-			switchingSourceRef.current = source;
-			switchTimeoutRef.current = window.setTimeout(() => {
-				if (switchingTargetSeriesNumRef.current !== episode) return;
-				setOptimisticSeriesNum(series_num);
-				clearSwitchingState();
-				toast.error(t("seriesEpisodes.episodeSwitchFailed"));
-			}, 8e3);
-			onEpisodeChange(episode);
-		} catch (error) {
-			setOptimisticSeriesNum(series_num);
-			clearSwitchingState();
-			console.error("切换剧集失败", error);
-			toast.error(t("seriesEpisodes.episodeSwitchFailed"));
-		}
-	}, [
-		clearSwitchingState,
-		hideSwitchLoading,
-		information.links,
-		onEpisodeChange,
-		optimisticSeriesNum,
-		series_num,
-		maybeCenterInlineEpisodeFromMidRightClick,
-		scrollToCurrentEpisode,
-		setSavedEpisodeScrollLeft,
-		t
-	]);
-	const [popupHeight, setPopupHeight] = useState("70vh");
-	const calculatePopupHeight = useCallback(() => {
-		if (typeof window === "undefined") return;
-		if (window.isWebView === true) {
-			setPopupHeight("100vh");
-			return;
-		}
-		const anchor = document.getElementById("selectPopupPosition");
-		const viewportHeight = window.visualViewport?.height || window.innerHeight;
-		if (!anchor) {
-			setPopupHeight("70vh");
-			return;
-		}
-		const height = Math.max(0, viewportHeight - anchor.offsetTop);
-		if (height <= 0) {
-			setPopupHeight("70vh");
-			return;
-		}
-		setPopupHeight(`${height}px`);
-	}, []);
-	useEffect(() => {
-		if (!selectSeriesVisible) return;
-		calculatePopupHeight();
-		const handleResize = () => {
-			calculatePopupHeight();
-		};
-		window.addEventListener("resize", handleResize);
-		window.addEventListener("scroll", handleResize, true);
-		return () => {
-			window.removeEventListener("resize", handleResize);
-			window.removeEventListener("scroll", handleResize, true);
-		};
-	}, [calculatePopupHeight, selectSeriesVisible]);
-	if (seriesItems.length <= 1) return null;
-	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Box, {
-		className: "w-full mt-[16px] flex flex-col items-end mb-[4px]",
-		children: [/* @__PURE__ */ jsxs(Box, {
-			className: "w-fit flex items-center px-[12px] h-[28px]",
-			onClick: () => {
-				trackPageClick("page_video_detail", "详情页", null, "detail_select_episode_btn");
-				setSelectSeriesVisible(true);
-			},
-			children: [/* @__PURE__ */ jsx(Text, {
-				className: "text-[14px] text-text2 leading-[20px]",
-				children: seriesTotalText
-			}), /* @__PURE__ */ jsx(SvgRightArrow, { className: "w-[11px] h-[18px] ml-[4px] text-text2" })]
-		}), /* @__PURE__ */ jsx("div", {
-			ref: scrollRef,
-			className: `w-full mt-[12px] overflow-x-auto px-[12px] flex gap-x-[8px] h-[56px] ${isEpisodeSwitching ? "touch-none" : ""}`,
-			children: seriesItems.map((item, index) => /* @__PURE__ */ jsxs("div", {
-				"data-content-id": item.id,
-				className: `relative shrink-0 h-[full] overflow-hidden px-[18px] rounded-[8px] flex items-center justify-center ${showEpisodeTitle ? "min-w-[88px] h-[40px]" : "w-[56px] !px-[0] justify-center"} ${item.id === currentPlayingSeriesId ? "bg-transparent" : "bg-white/10"}`,
-				onClick: (event) => {
-					trackPageClick("page_video_detail", "详情页", event, "detail_episode_click", {
-						episode_num: index + 1,
-						episode_id: item.id
-					});
-					handleSwitchEpisode(index + 1, "inline", item.id, event.clientX);
-				},
-				children: [item.id === currentPlayingSeriesId && /* @__PURE__ */ jsx(DetailStyleOneActiveBorderLayer, {}), /* @__PURE__ */ jsx(Text, {
-					className: `relative z-[1] text-[14px] text-text1 leading-[22px] line-clamp-2 ${item.id === currentPlayingSeriesId ? "!text-[#CA3FE9]" : ""}`,
-					children: showEpisodeTitle ? item.title : item.series_num
-				})]
-			}, item.id))
-		})]
-	}), /* @__PURE__ */ jsx(SelectorSeriesEpisodes, {
-		title: t("seriesEpisodes.selectorTitle"),
-		videoTitle: information.name,
-		variant: "popup",
-		open: selectSeriesVisible,
-		updateStatus: information.update_status,
-		summaryText: seriesTotalText,
-		seriesList: (information.links || []).map((link) => ({
-			id: link.id,
-			name: link.name
-		})),
-		activeEpisodeId: currentPlayingSeriesId,
-		showEpisodeTitle,
-		onToggleTitle: (value) => {
-			setShowEpisodeTitle(value);
-		},
-		onClose: () => setSelectSeriesVisible(false),
-		onSelectEpisode: (episodeId, episodeNum) => {
-			setSelectSeriesVisible(false);
-			handleSwitchEpisode(episodeNum, "popup", episodeId);
-		},
-		popupBodyStyle: { height: popupHeight },
-		popupStylePreset: "default"
-	})] });
-}
-
-//#endregion
-export { DetailStyleOneActiveBorderLayer, SeriesEpisodes };
+"use client";import{trackPageClick as e}from"../../../utils/tracking.mjs";import{Box as t}from"../../ui/box.mjs";import{Text as n}from"../../ui/text.mjs";import{Sheet as r,SheetContent as i,SheetHeader as a,SheetTitle as o}from"../../ui/sheet.mjs";import{Switch as s}from"../../ui/switch.mjs";import{useKeepAliveState as c}from"../keep-scroll-position/index.mjs";import l from"../../../assets/icons/common/right_arrow.mjs";import u from"../../ui/popup.mjs";import{toast as d}from"sonner";import{useCallback as f,useEffect as p,useMemo as m,useRef as h,useState as g}from"react";import{Fragment as _,jsx as v,jsxs as y}from"react/jsx-runtime";import{useTranslations as ee}from"next-intl";const b=`funhub:detail-series-popup-query`,x=`funhub:detail-series-popup-close`;function S(e){return e.type===b&&e instanceof CustomEvent}function C({active:e}){return e?y(`svg`,{width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,className:`shrink-0`,"aria-hidden":!0,children:[v(`circle`,{cx:`16`,cy:`12`,r:`3`,fill:`white`}),v(`path`,{d:`M8 5H16C19.866 5 23 8.13401 23 12C23 15.866 19.866 19 16 19H8C4.13401 19 1 15.866 1 12C1 8.13401 4.13401 5 8 5ZM16 15C17.6569 15 19 13.6569 19 12C19 10.3431 17.6569 9 16 9C14.3431 9 13 10.3431 13 12C13 13.6569 14.3431 15 16 15Z`,fill:`#9054E5`})]}):y(`svg`,{width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,className:`shrink-0`,"aria-hidden":!0,children:[v(`path`,{d:`M1.5 12C1.5 8.68629 4.18629 6 7.5 6H16.5C19.8137 6 22.5 8.68629 22.5 12C22.5 15.3137 19.8137 18 16.5 18H7.5C4.18629 18 1.5 15.3137 1.5 12Z`,stroke:`currentColor`,strokeWidth:`1.5`,strokeOpacity:`0.6`}),v(`circle`,{cx:`9`,cy:`12`,r:`3`,fill:`rgba(255,255,255,0.6)`})]})}function te(){return v(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,className:`block h-[20px] w-[20px]`,"aria-hidden":!0,children:v(`path`,{d:`M10 8.61116L14.8611 3.75L16.25 5.13889L11.3889 10L16.25 14.8611L14.8611 16.25L10 11.3889L5.13889 16.25L3.75 14.8611L8.61111 10L3.75 5.13889L5.13889 3.75L10 8.61116Z`,fill:`currentColor`})})}function w(e,t){let n=String(t||``).trim();if(!n)return e;let r=e.replace(/\s+/g,``);return n.replace(/\s+/g,``)===r?e:`${e} ${n}`}function T(e,t,n){return(e||[]).map((e,r)=>{let i=Number.parseInt(e?.id||``,10),a=Number.isNaN(i)?r+1:i,o=e?.name||``,s=w(n(a),o);return{id:e?.id||`${t}-${a}`,series_num:a,title:s}})}function E(e,t,n){return(e||[]).map((e,r)=>{let i=Number(e?.id),a=Number.isNaN(i)?r+1:i,o=n(a);return{id:e?.id||`${t}-${a}`,series_num:a,title:o}})}function D(e,t,n){return e<=0?n(`singleContent`):n(t===`1`?`completedSeriesTotal`:`ongoingSeriesTotal`,{total:e})}function O(){return v(`span`,{"aria-hidden":!0,className:`pointer-events-none absolute inset-0 overflow-hidden rounded-[8px] p-[0.5px]`,style:{backgroundImage:`linear-gradient(90deg, rgba(255,30,172,0.7) 0%, rgba(108,67,238,0) 100%), linear-gradient(180deg, #9756E3 0%, #6C43EE 100%)`},children:v(`span`,{className:`block h-full w-full`,style:{borderRadius:`7.5px`,backgroundColor:`#000000`,backgroundImage:`linear-gradient(90deg, rgba(246,206,255,0.1) 0%, rgba(246,206,255,0.1) 100%), linear-gradient(90deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.1) 100%)`}})})}function k(e){return e.mode===`detail`?v(j,{information:e.information,series_num:e.series_num,onEpisodeChange:e.onEpisodeChange}):v(A,{open:e.open,variant:e.variant,title:e.title,videoTitle:e.videoTitle,updateStatus:e.updateStatus,summaryText:e.summaryText,seriesList:e.seriesList,activeEpisodeId:e.activeEpisodeId,showEpisodeTitle:e.showEpisodeTitle,onToggleTitle:e.onToggleTitle,onClose:e.onClose,onSelectEpisode:e.onSelectEpisode,popupBodyStyle:e.popupBodyStyle,popupStylePreset:e.popupStylePreset})}function A({open:e,variant:c,title:l,videoTitle:d,updateStatus:_,summaryText:b,seriesList:x,activeEpisodeId:S,showEpisodeTitle:E=!1,onToggleTitle:k,onClose:A,onSelectEpisode:j,popupBodyStyle:M,popupStylePreset:N=`default`}){let P=ee(`components.common.seriesEpisodes`),F=!!k,I=F&&E,L=c===`popup`&&N===`detail-style-one`,R=h(null),z=h(null),B=m(()=>T(x,`episode`,e=>P(`episodeLabel`,{episode:e})),[x,P]),V=m(()=>{if(B.length===0)return[];let e=[];return B.forEach((t,n)=>{let r=Math.floor(n/50);e[r]||(e[r]=[]),e[r].push(t)}),e},[B,50]),H=m(()=>{if(!S)return 0;let e=B.findIndex(e=>e.id===S);return e<0?0:Math.floor(e/50)},[S,B,50]),[U,W]=g(H);p(()=>{W(H)},[H]);let G=m(()=>typeof b==`string`&&b.trim()?b:D(B.length,_,P),[B.length,b,P,_]),K=l||P(`selectorTitle`),q=String(d||``).trim(),J=f(e=>w(P(`episodeLabel`,{episode:e.series_num}),q),[q,P]);function Y(){let e=R.current;if(e){z.current&&=(window.cancelAnimationFrame(z.current),null),e.scrollTop=0;try{e.scrollTo({top:0,left:0,behavior:`auto`})}catch{}z.current=window.requestAnimationFrame(()=>{z.current=null;let e=R.current;e&&(e.scrollTop=0)})}}p(()=>{e&&Y()},[e,E,U]);function X(e){k&&(k(e),Y())}function Z(e){j?.(e.id,e.series_num),A()}let Q=I?2:5,$=V.length>1?v(`div`,{className:`shrink-0 w-full flex gap-[8px] overflow-x-auto`,children:V.map((e,t)=>{if(e.length===0)return null;let n=t===U,r=t*50+1,i=Math.min((t+1)*50,B.length);return y(`div`,{className:`shrink-0 px-[16px] py-[6px] rounded-[16px] text-[14px] transition-colors cursor-pointer relative overflow-hidden ${n?`text-theme5 bg-bg2`:`text-text2 bg-bg2`}`,onClick:()=>{W(t),Y()},children:[r,`-`,i,n&&v(`div`,{className:`absolute w-full h-full top-0 left-0 opacity-20 bg-theme5`})]},`series-group-${t}`)})}):null,ne=y(`div`,{className:`pb-[8px] flex justify-between`,children:[v(`span`,{className:`text-[16px] text-text1`,children:G}),F&&y(`div`,{className:`flex items-center gap-[4px]`,children:[v(s,{size:`sm`,className:`data-checked:bg-theme5 h-[20px] w-[33px]`,checked:E,onCheckedChange:e=>{X(!!e)}}),v(`button`,{type:`button`,className:`text-[16px] text-text1`,onClick:()=>{X(!E)},children:P(`episodeTitle`)})]})]}),re=v(`div`,{className:`grid w-full gap-2 ${Q===2?`grid-cols-2`:`grid-cols-5`}`,children:(V[U]||[]).map((e,t)=>{let n=!!(S&&e.id===S);return v(`button`,{type:`button`,"data-episode-id":e.id,onClick:()=>{Z(e)},className:`flex items-center justify-center w-full h-[56px] rounded-[8px] transition-colors ${n?``:`bg-white/10`} cursor-pointer select-none transition-colors relative overflow-hidden ${I?`h-[72px] px-[10px] text-[14px]`:``} ${t%Q===0?``:`border-l-0`}`,children:I?v(`span`,{className:`block w-full truncate leading-[22px]`,children:J(e)}):e.series_num},e.id)})}),ie=V.length>1?v(`div`,{className:`flex gap-[8px] overflow-x-auto [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden`,children:V.map((e,t)=>{if(e.length===0)return null;let n=t===U,r=t*50+1,i=Math.min((t+1)*50,B.length);return v(`button`,{type:`button`,className:`flex h-[28px] w-[72px] shrink-0 items-center justify-center rounded-[100px] px-[4px] transition-colors ${n?`bg-[linear-gradient(90deg,#9756E3_0%,#6C43EE_100%)] text-white`:`bg-white/20 text-white`}`,onClick:()=>{W(t),Y()},children:y(`span`,{className:`font-['PingFang_SC'] text-[14px] font-normal not-italic leading-[20px]`,children:[r,`-`,i]})},`series-popup-group-${t}`)})}):null,ae=y(`div`,{className:`flex items-center justify-between`,children:[v(`span`,{className:`font-['PingFang_SC'] text-[14px] font-normal not-italic leading-[24px] text-white/60`,children:G}),F&&y(`button`,{type:`button`,className:`flex items-center gap-[3px] text-white/60`,onClick:()=>{X(!E)},children:[v(C,{active:E}),v(`span`,{className:`font-['PingFang_SC'] text-[14px] font-normal not-italic leading-[24px] text-white/60`,children:P(`episodeTitle`)})]})]}),oe=I?v(`div`,{className:`flex w-full flex-col gap-[12px]`,children:(V[U]||[]).map(e=>{let t=!!(S&&e.id===S);return y(`button`,{type:`button`,"data-episode-id":e.id,onClick:()=>{Z(e)},className:`relative flex w-full items-start overflow-hidden rounded-[8px] px-[16px] py-[18px] text-left transition-colors ${t?L?``:`border border-[#FF1EFF] bg-[linear-gradient(90deg,rgba(246,206,255,0.1)_0%,rgba(246,206,255,0.1)_100%),linear-gradient(90deg,rgba(255,255,255,0.1)_0%,rgba(255,255,255,0.1)_100%)]`:`bg-white/10`}`,children:[t&&L&&v(O,{}),v(`span`,{className:`relative z-[1] block w-full truncate font-['PingFang_SC'] text-[14px] ${t?`font-medium leading-[16px] text-[#CA3FE9]`:`font-normal leading-[16px] text-white/80`}`,children:J(e)})]},`popup-${e.id}`)})}):v(`div`,{className:`grid w-full grid-cols-[repeat(6,52px)] justify-between gap-y-[8px]`,children:(V[U]||[]).map(e=>{let t=!!(S&&e.id===S);return y(`button`,{type:`button`,"data-episode-id":e.id,onClick:()=>{Z(e)},className:`relative flex h-[52px] w-[52px] items-center justify-center overflow-hidden rounded-[8px] transition-colors ${t?L?`text-[#9756E3]`:`border border-[#E62AFF]/90 bg-[linear-gradient(90deg,rgba(246,206,255,0.1)_0%,rgba(246,206,255,0.1)_100%),linear-gradient(90deg,rgba(255,255,255,0.1)_0%,rgba(255,255,255,0.1)_100%)] text-[#9756E3]`:`bg-white/10 text-white/80`}`,children:[t&&L&&v(O,{}),v(`span`,{className:`relative z-[1] font-['PingFang_SC'] text-[16px] font-medium not-italic leading-[16px]`,children:e.series_num})]},`popup-${e.id}`)})});return c===`sheet`?v(r,{open:e,onOpenChange:e=>!e&&A(),children:y(i,{side:`bottom`,showCloseButton:!0,className:`min-h-[50vh] bg-bg1 text-text1 rounded-t-2xl border-t border-white/10`,children:[v(a,{className:`pt-3 pb-0`,children:v(o,{className:`flex items-center justify-between text-lg text-text1`,children:K})}),y(`div`,{className:`px-4 pb-2 flex flex-col gap-3`,children:[$,ne]}),v(`div`,{ref:R,className:`flex-1 h-0 pt-[4px] pb-[12px] overflow-y-auto px-4`,children:re})]})}):v(u,{open:e,onOpenChange:e=>{e||A()},showCloseButton:!1,className:`!gap-0 !border-0 !bg-transparent !p-0 !shadow-none`,overlayClassName:`bg-black/50 backdrop-blur-0`,children:y(t,{className:`flex h-full w-full flex-col overflow-hidden rounded-t-[16px] bg-black text-text1`,style:{height:`70vh`,...M},children:[y(t,{className:`shrink-0 flex items-center justify-between px-[16px] pt-[32px]`,children:[v(n,{className:`font-['PingFang_SC'] text-[18px] font-medium not-italic leading-[24px] text-white`,children:K}),v(`button`,{type:`button`,"aria-label":`关闭`,className:`flex h-[24px] w-[24px] items-center justify-center text-white opacity-60`,onClick:A,children:v(`span`,{className:`flex h-[24px] w-[24px] items-center overflow-hidden p-[2px]`,children:v(te,{})})})]}),v(t,{className:`flex-1 h-0 w-full px-[16px] pb-[24px]`,children:y(t,{className:`flex h-full flex-col`,children:[ie&&v(t,{className:`mt-[16px] shrink-0`,children:ie}),v(t,{className:`mt-[16px] shrink-0`,children:ae}),v(t,{ref:R,className:`flex-1 overflow-y-auto pb-[17px] [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden ${I?`mt-[12px]`:`mt-[8px]`}`,children:oe})]})})]})})}function j({information:r,series_num:i,onEpisodeChange:a}){let o=ee(`components.common`),[s,u]=c(`detail-series-popup-${r.id}`,!1),[C,te]=c(`detail-series-title-toggle-${r.id}`,!1),[w,T]=c(`detail-series-scroll-left-${r.id}`,null),[D,k]=g(i);p(()=>{k(i)},[r.id,i]),p(()=>{if(typeof window>`u`)return;let e=()=>{u(!1)};return window.addEventListener(x,e),()=>{window.removeEventListener(x,e)}},[u]),p(()=>{if(typeof window>`u`)return;let e=e=>{if(!S(e))return;let t=e.detail||{};t.open=!!t.open||!!s};return window.addEventListener(b,e),()=>{window.removeEventListener(b,e)}},[s]),p(()=>{s&&e(`page_video_detail`,`详情页`,null,`detail_select_episode_popup`)},[s]);let j=m(()=>E((r.links||[]).map(e=>({id:e.id,name:e.name})),r.id||`episode`,e=>o(`seriesEpisodes.episodeLabel`,{episode:e})),[r.id,r.links,o]),M=r.update_status===`1`?o(`seriesEpisodes.completedSeriesTotal`,{total:r.links.length}):o(`seriesEpisodes.ongoingSeriesUpdatedTo`,{total:r.links.length}),N=m(()=>r.links[D-1]?.id||r.links[0]?.id||``,[r.links,D]),P=h(null),F=h(null),I=h(null),L=h(!1),R=h(null),z=h(null),B=h(null),[V,H]=g(!1),U=f((e,t=`smooth`)=>{let n=P.current?.querySelector(`[data-content-id="${e}"]`);if(n&&P.current){let e=P.current,r=Math.max(0,n.offsetLeft-10);e.scrollTo({left:r,behavior:t})}},[]),W=f(()=>{z.current!==null&&(window.clearTimeout(z.current),z.current=null)},[]),G=f(()=>{B.current!==null&&(window.clearTimeout(B.current),B.current=null)},[]),K=f(()=>{R.current!==null&&(d.dismiss(R.current),R.current=null),W(),G()},[G,W]),q=f(()=>{F.current=null,I.current=null,K(),H(!1)},[K]),J=f((e,t)=>{G(),B.current=window.setTimeout(()=>{B.current=null,F.current===e&&q()},Math.max(0,t))},[G,q]);p(()=>{L.current=!1},[r.id]),p(()=>{if(L.current||!N)return;let e=window.requestAnimationFrame(()=>{let e=P.current;e&&(typeof w==`number`?e.scrollTo({left:Math.max(0,w),behavior:`auto`}):(U(N,`auto`),T(Math.max(0,Math.round(e.scrollLeft)))),L.current=!0)});return()=>{window.cancelAnimationFrame(e)}},[N,w,U,T]),p(()=>{let e=F.current;!e||e!==i||J(e,1e3)},[J,i]),p(()=>()=>{q()},[q]);let Y=f((e,t,n)=>{let r=P.current;if(!r||!e)return t;let i=r.querySelector(`[data-content-id="${e}"]`);if(!i)return t;let a=r.getBoundingClientRect();if(a.width<=0||typeof n!=`number`||(n-a.left)/a.width<.5)return t;let o=i.offsetLeft+i.offsetWidth/2,s=r.clientWidth/2,c=Math.max(0,r.scrollWidth-r.clientWidth),l=Math.min(c,Math.max(0,o-s));return r.scrollTo({left:l,behavior:`smooth`}),Math.round(l)},[]),X=f((e,t=`inline`,n,s)=>{if(e!==D){if(!r.links[e-1]){d.error(o(`seriesEpisodes.episodeNotFound`));return}if(typeof window<`u`&&window.isWebView===!0){try{k(e);let c=n||r.links[e-1]?.id||``,l=Math.max(0,Math.round(P.current?.scrollLeft||0));t===`popup`?(c&&U(c,`auto`),T(Math.max(0,Math.round(P.current?.scrollLeft||0)))):T(Y(c,l,s)),H(!0),K(),R.current=d.loading(o(`seriesEpisodes.episodeSwitching`)),F.current=e,I.current=t,z.current=window.setTimeout(()=>{F.current===e&&(k(i),q(),d.error(o(`seriesEpisodes.episodeSwitchFailed`)))},3e3),a(e)}catch(e){k(i),q(),console.error(`切换剧集失败`,e),d.error(o(`seriesEpisodes.episodeSwitchFailed`))}return}try{k(e);let c=n||r.links[e-1]?.id||``,l=Math.max(0,Math.round(P.current?.scrollLeft||0));t===`popup`?(c&&U(c,`auto`),T(Math.max(0,Math.round(P.current?.scrollLeft||0)))):T(Y(c,l,s)),H(!0),K(),R.current=d.loading(o(`seriesEpisodes.episodeSwitching`)),F.current=e,I.current=t,z.current=window.setTimeout(()=>{F.current===e&&(k(i),q(),d.error(o(`seriesEpisodes.episodeSwitchFailed`)))},8e3),a(e)}catch(e){k(i),q(),console.error(`切换剧集失败`,e),d.error(o(`seriesEpisodes.episodeSwitchFailed`))}}},[q,K,r.links,a,D,i,Y,U,T,o]),[Z,Q]=g(`70vh`),$=f(()=>{if(typeof window>`u`)return;if(window.isWebView===!0){Q(`100vh`);return}let e=document.getElementById(`selectPopupPosition`),t=window.visualViewport?.height||window.innerHeight;if(!e){Q(`70vh`);return}let n=Math.max(0,t-e.offsetTop);if(n<=0){Q(`70vh`);return}Q(`${n}px`)},[]);return p(()=>{if(!s)return;$();let e=()=>{$()};return window.addEventListener(`resize`,e),window.addEventListener(`scroll`,e,!0),()=>{window.removeEventListener(`resize`,e),window.removeEventListener(`scroll`,e,!0)}},[$,s]),j.length<=1?null:y(_,{children:[y(t,{className:`w-full mt-[8px] flex flex-col items-end mb-[4px]`,children:[y(t,{className:`w-fit flex items-center px-[12px] h-[28px]`,onClick:()=>{e(`page_video_detail`,`详情页`,null,`detail_select_episode_btn`),u(!0)},children:[v(n,{className:`text-[14px] text-text2 leading-[20px]`,children:M}),v(l,{className:`w-[11px] h-[18px] ml-[4px] text-text2`})]}),v(`div`,{ref:P,className:`w-full mt-[12px] overflow-x-auto px-[12px] flex gap-x-[8px] h-[56px] ${V?`touch-none`:``}`,children:j.map((t,n)=>y(`div`,{"data-content-id":t.id,className:`relative shrink-0 h-[full] overflow-hidden px-[18px] rounded-[8px] flex items-center justify-center ${C?`min-w-[88px] h-[40px]`:`w-[56px] !px-[0] justify-center`} ${t.id===N?`bg-transparent`:`bg-white/10`}`,onClick:r=>{e(`page_video_detail`,`详情页`,r,`detail_episode_click`,{episode_num:n+1,episode_id:t.id}),X(n+1,`inline`,t.id,r.clientX)},children:[t.id===N&&v(O,{}),v(`div`,{className:`relative z-[1] text-[14px] text-text1 leading-[22px] line-clamp-1 max-w-[120px] overflow-hidden overflow-ellipsis ${t.id===N?`!text-[#CA3FE9]`:``}`,children:C?`${t.title} ${r.name}`:t.series_num})]},t.id))})]}),v(A,{title:o(`seriesEpisodes.selectorTitle`),videoTitle:r.name,variant:`popup`,open:s,updateStatus:r.update_status,summaryText:M,seriesList:(r.links||[]).map(e=>({id:e.id,name:e.name})),activeEpisodeId:N,showEpisodeTitle:C,onToggleTitle:e=>{te(e)},onClose:()=>u(!1),onSelectEpisode:(e,t)=>{u(!1),X(t,`popup`,e)},popupBodyStyle:{height:Z},popupStylePreset:`default`})]})}export{O as DetailStyleOneActiveBorderLayer,k as SeriesEpisodes};