@funhub/platform 0.1.130 → 0.1.131

package/dist/components/common/media-preview/video-play.mjs

@@ -1,238 +1,2 @@
 
-import getResUrl from "../../../utils/get-res-url.mjs";
-import { Image } from "../../ui/image.mjs";
-import { Box } from "../../ui/box.mjs";
-import { useCallback, useEffect, useRef } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import Player from "xgplayer";
-import Hls from "xgplayer-hls";
-
-//#region components/common/media-preview/video-play.tsx
-/**
-* 预览弹窗播放按钮图标。
-*/
-function VideoPlayIcon({ onClick }) {
-	return /* @__PURE__ */ jsx(Box, {
-		className: "absolute top-0 left-0 w-full h-full flex items-center justify-center z-10",
-		onClick,
-		children: /* @__PURE__ */ jsx(Box, {
-			className: "w-[40px] h-[40px] bg-[rgba(0,0,0,.6)] rounded-full flex items-center justify-center",
-			children: /* @__PURE__ */ jsx("svg", {
-				xmlns: "http://www.w3.org/2000/svg",
-				className: "play xg-icon-play",
-				width: "28",
-				height: "40",
-				viewBox: "3 -4 28 40",
-				children: /* @__PURE__ */ jsx("path", {
-					fill: "#fff",
-					transform: "scale(0.0320625 0.0320625)",
-					d: "M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z"
-				})
-			})
-		})
-	});
-}
-/**
-* 异步加载播放器样式，避免提前触发 preload 警告。
-*/
-async function ensurePlayerStyles() {
-	await import("xgplayer/dist/index.min.css");
-}
-/**
-* 设置播放器静音状态并降低音量。
-*/
-function applyMutedSettings(target) {
-	if (!target) return;
-	try {
-		target.muted = true;
-	} catch {}
-	try {
-		target.volume = 0;
-	} catch {}
-	try {
-		const video = target.video;
-		if (video) video.muted = true;
-	} catch {}
-}
-/**
-* 重置覆盖层样式，用于切换媒体/关闭弹窗后的复位。
-*/
-function resetOverlayStyle(target) {
-	if (!target) return;
-	target.style.opacity = "";
-	target.style.pointerEvents = "";
-}
-/**
-* 预览弹窗视频播放组件。
-*/
-function VideoPlay({ url, cover, isActive, autoPlayMuted, previewAutoPlay, previewAutoPlaySeed }) {
-	const isMountedRef = useRef(true);
-	const playerRef = useRef(null);
-	const playerBoxRef = useRef(null);
-	const coverBoxRef = useRef(null);
-	const iconBoxRef = useRef(null);
-	const startingRef = useRef(false);
-	const lastPreviewAutoPlaySeedRef = useRef(null);
-	/**
-	* 记录组件挂载状态，便于控制异步初始化。
-	*/
-	useEffect(() => {
-		isMountedRef.current = true;
-		return () => {
-			isMountedRef.current = false;
-		};
-	}, []);
-	const cleanupPlayer = useCallback(() => {
-		resetOverlayStyle(coverBoxRef.current);
-		resetOverlayStyle(iconBoxRef.current);
-		if (playerRef.current) {
-			playerRef.current.destroy();
-			playerRef.current = null;
-		}
-		startingRef.current = false;
-	}, []);
-	useEffect(() => {
-		return () => {
-			cleanupPlayer();
-		};
-	}, [cleanupPlayer]);
-	/**
-	* 非激活态时确保播放器释放，避免轮播切换后后台继续占用资源。
-	*/
-	useEffect(() => {
-		if (isActive) return;
-		cleanupPlayer();
-	}, [cleanupPlayer, isActive]);
-	/**
-	* 处理视频地址。
-	*/
-	const handleUrl = useCallback((url) => {
-		if (url.endsWith("m3u8")) return `${process.env.NEXT_PUBLIC_API_BASE}/api/content/processM3u8?url=${encodeURIComponent(`${getResUrl()}/m3f/${url}`)}`;
-		else return `${getResUrl()}${url.startsWith("/") ? url : `/${url}`}`;
-	}, []);
-	/**
-	* 隐藏封面与播放按钮（避免即使 state 未提交也能看到播放器）。
-	*/
-	const hideOverlay = useCallback(() => {
-		if (coverBoxRef.current) {
-			coverBoxRef.current.style.opacity = "0";
-			coverBoxRef.current.style.pointerEvents = "none";
-		}
-		if (iconBoxRef.current) {
-			iconBoxRef.current.style.opacity = "0";
-			iconBoxRef.current.style.pointerEvents = "none";
-		}
-	}, []);
-	/**
-	* 直接初始化播放器（不依赖 isPlaying 重新渲染来“挂载容器”）。
-	*/
-	const startPlayer = useCallback(async (options) => {
-		if (playerRef.current || startingRef.current) return;
-		const container = playerBoxRef.current;
-		if (!container) return;
-		startingRef.current = true;
-		hideOverlay();
-		try {
-			await ensurePlayerStyles();
-			if (!isMountedRef.current) return;
-			const src = handleUrl(url);
-			const shouldUseHls = url.endsWith("m3u8");
-			playerRef.current = new Player({
-				el: container,
-				url: src,
-				autoplay: true,
-				width: "100%",
-				height: "100%",
-				volume: options.preferMuted ? 0 : 1,
-				controls: true,
-				preload: "auto",
-				playbackRate: [],
-				autoplayMuted: options.preferMuted,
-				playsinline: true,
-				webkitPlaysInline: true,
-				closeVideoPreventDefault: true,
-				enableVideoDbltouch: false,
-				lang: "zh-cn",
-				...shouldUseHls ? { plugins: [Hls] } : {},
-				mobile: {
-					disablePress: true,
-					pressRate: 2,
-					gestureX: false,
-					gestureY: false
-				}
-			});
-			try {
-				const playResult = playerRef.current?.play?.();
-				if (playResult && typeof playResult.catch === "function") playResult.catch(() => {
-					if (!options.allowMutedFallback) return;
-					applyMutedSettings(playerRef.current);
-					playerRef.current?.play?.().catch(() => {});
-				});
-			} catch {
-				if (!options.allowMutedFallback) return;
-				applyMutedSettings(playerRef.current);
-				try {
-					playerRef.current?.play?.();
-				} catch {}
-			}
-		} finally {
-			startingRef.current = false;
-		}
-	}, [
-		handleUrl,
-		hideOverlay,
-		url
-	]);
-	const handleVideoPlay = useCallback((options) => {
-		startPlayer({
-			preferMuted: Boolean(options?.preferMuted),
-			allowMutedFallback: Boolean(options?.allowMutedFallback)
-		});
-	}, [startPlayer]);
-	/**
-	* 预览弹窗打开时，仅对初始索引视频自动播放一次。
-	*/
-	useEffect(() => {
-		if (!(Boolean(previewAutoPlay) && Boolean(isActive) && previewAutoPlaySeed != null && lastPreviewAutoPlaySeedRef.current !== previewAutoPlaySeed)) return;
-		lastPreviewAutoPlaySeedRef.current = previewAutoPlaySeed;
-		startPlayer({
-			preferMuted: Boolean(autoPlayMuted),
-			allowMutedFallback: !autoPlayMuted
-		});
-	}, [
-		autoPlayMuted,
-		isActive,
-		previewAutoPlay,
-		previewAutoPlaySeed,
-		startPlayer
-	]);
-	return /* @__PURE__ */ jsxs(Box, {
-		className: "relative w-full h-full",
-		children: [
-			/* @__PURE__ */ jsx(Box, {
-				className: "absolute bottom-0 left-0 w-full h-full bg-[rgba(0,0,0)] flex items-center justify-center z-10",
-				children: /* @__PURE__ */ jsx("div", {
-					className: "w-full h-full",
-					ref: playerBoxRef
-				})
-			}),
-			/* @__PURE__ */ jsx("div", {
-				ref: coverBoxRef,
-				className: "absolute bottom-0 left-0 w-full h-full z-20",
-				children: /* @__PURE__ */ jsx(Image, {
-					src: cover || "",
-					alt: "cover",
-					fill: true
-				})
-			}),
-			/* @__PURE__ */ jsx("div", {
-				ref: iconBoxRef,
-				className: "absolute bottom-0 left-0 w-full h-full z-30",
-				children: /* @__PURE__ */ jsx(VideoPlayIcon, { onClick: handleVideoPlay })
-			})
-		]
-	});
-}
-
-//#endregion
-export { VideoPlay };
+import e from"../../../utils/get-res-url.mjs";import{Image as t}from"../../ui/image.mjs";import{Box as n}from"../../ui/box.mjs";import{useCallback as r,useEffect as i,useRef as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import c from"xgplayer";import l from"xgplayer-hls";function u({onClick:e}){return o(n,{className:`absolute top-0 left-0 w-full h-full flex items-center justify-center z-10`,onClick:e,children:o(n,{className:`w-[40px] h-[40px] bg-[rgba(0,0,0,.6)] rounded-full flex items-center justify-center`,children:o(`svg`,{xmlns:`http://www.w3.org/2000/svg`,className:`play xg-icon-play`,width:`28`,height:`40`,viewBox:`3 -4 28 40`,children:o(`path`,{fill:`#fff`,transform:`scale(0.0320625 0.0320625)`,d:`M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z`})})})})}async function d(){await import(`xgplayer/dist/index.min.css`)}function f(e){if(e){try{e.muted=!0}catch{}try{e.volume=0}catch{}try{let t=e.video;t&&(t.muted=!0)}catch{}}}function p(e){e&&(e.style.opacity=``,e.style.pointerEvents=``)}function m({url:m,cover:h,isActive:g,autoPlayMuted:_,previewAutoPlay:v,previewAutoPlaySeed:y}){let b=a(!0),x=a(null),S=a(null),C=a(null),w=a(null),T=a(!1),E=a(null);i(()=>(b.current=!0,()=>{b.current=!1}),[]);let D=r(()=>{p(C.current),p(w.current),x.current&&=(x.current.destroy(),null),T.current=!1},[]);i(()=>()=>{D()},[D]),i(()=>{g||D()},[D,g]);let O=r(t=>t.endsWith(`m3u8`)?`${process.env.NEXT_PUBLIC_API_BASE}/api/content/processM3u8?url=${encodeURIComponent(`${e()}/m3f/${t}`)}`:`${e()}${t.startsWith(`/`)?t:`/${t}`}`,[]),k=r(()=>{C.current&&(C.current.style.opacity=`0`,C.current.style.pointerEvents=`none`),w.current&&(w.current.style.opacity=`0`,w.current.style.pointerEvents=`none`)},[]),A=r(async e=>{if(x.current||T.current)return;let t=S.current;if(t){T.current=!0,k();try{if(await d(),!b.current)return;let n=O(m),r=m.endsWith(`m3u8`);x.current=new c({el:t,url:n,autoplay:!0,width:`100%`,height:`100%`,volume:e.preferMuted?0:1,controls:!0,preload:`auto`,playbackRate:[],autoplayMuted:e.preferMuted,playsinline:!0,webkitPlaysInline:!0,closeVideoPreventDefault:!0,enableVideoDbltouch:!1,lang:`zh-cn`,...r?{plugins:[l]}:{},mobile:{disablePress:!0,pressRate:2,gestureX:!1,gestureY:!1}});try{let t=x.current?.play?.();t&&typeof t.catch==`function`&&t.catch(()=>{e.allowMutedFallback&&(f(x.current),x.current?.play?.().catch(()=>{}))})}catch{if(!e.allowMutedFallback)return;f(x.current);try{x.current?.play?.()}catch{}}}finally{T.current=!1}}},[O,k,m]),j=r(e=>{A({preferMuted:!!e?.preferMuted,allowMutedFallback:!!e?.allowMutedFallback})},[A]);return i(()=>{v&&g&&y!=null&&E.current!==y&&(E.current=y,A({preferMuted:!!_,allowMutedFallback:!_}))},[_,g,v,y,A]),s(n,{className:`relative w-full h-full`,children:[o(n,{className:`absolute bottom-0 left-0 w-full h-full bg-[rgba(0,0,0)] flex items-center justify-center z-10`,children:o(`div`,{className:`w-full h-full`,ref:S})}),o(`div`,{ref:C,className:`absolute bottom-0 left-0 w-full h-full z-20`,children:o(t,{src:h||``,alt:`cover`,fill:!0})}),o(`div`,{ref:w,className:`absolute bottom-0 left-0 w-full h-full z-30`,children:o(u,{onClick:j})})]})}export{m as VideoPlay};

package/dist/components/common/page-loading/index.mjs

@@ -1,21 +1,2 @@
 
-import { Image } from "../../ui/image.mjs";
-import { Box } from "../../ui/box.mjs";
-import { jsx } from "react/jsx-runtime";
-
-//#region components/common/page-loading/index.tsx
-function PageLoading({ className }) {
-	return /* @__PURE__ */ jsx(Box, {
-		className: `page-loading-box w-full h-full flex items-center justify-center ${className}`,
-		children: /* @__PURE__ */ jsx(Box, {
-			className: "w-[40px] h-[40px] relative",
-			children: /* @__PURE__ */ jsx(Image, {
-				src: "/images/common/page_loading.gif",
-				fill: true
-			})
-		})
-	});
-}
-
-//#endregion
-export { PageLoading as default };
+import{Image as e}from"../../ui/image.mjs";import{Box as t}from"../../ui/box.mjs";import{jsx as n}from"react/jsx-runtime";function r({className:r}){return n(t,{className:`page-loading-box w-full h-full flex items-center justify-center ${r}`,children:n(t,{className:`w-[40px] h-[40px] relative`,children:n(e,{src:`/images/common/page_loading.gif`,fill:!0})})})}export{r as default};

package/dist/components/common/page-skeleton/page-skeleton.mjs

@@ -1,8 +1,2 @@
 
-//#region components/common/page-skeleton/page-skeleton.tsx
-function PageSkeleton() {
-	return null;
-}
-
-//#endregion
-export { PageSkeleton };
+function e(){return null}export{e as PageSkeleton};

package/dist/components/common/photo-grid/common-photo-grid.d.mts

@@ -1,5 +1,6 @@
 
 import * as react_jsx_runtime0 from "react/jsx-runtime";
+import "photoswipe/style.css";
 
 //#region components/common/photo-grid/common-photo-grid.d.ts
 interface PhotoGridItemVideoParams {

package/dist/components/common/photo-grid/common-photo-grid.mjs

@@ -1,321 +1,2 @@
 
-'use client';
-
-import { Image } from "../../ui/image.mjs";
-import { photoPreview } from "../photo-preview/common-photo-preview.mjs";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region components/common/photo-grid/common-photo-grid.tsx
-const emptyStyleCss = {};
-const emptyImageList = [];
-function PhotoPreviewItem({ image, index, className = "", isVideo = false, isLongImage = false, isGifImage = false, styleCss = emptyStyleCss, onClick }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: `bg-bg2 photo-preview-item relative ${className}`,
-		style: { ...styleCss },
-		onClick: () => {
-			onClick({
-				image,
-				defaultIndex: index
-			});
-		},
-		children: [
-			isLongImage ? /* @__PURE__ */ jsx(Image, {
-				src: image,
-				fill: true,
-				objectFit: "cover"
-			}) : /* @__PURE__ */ jsx(Image, {
-				src: image,
-				fill: true,
-				objectFit: "cover"
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "absolute top-0 left-0 w-full h-full z-[1]",
-				style: { backgroundColor: "rgba(0, 0, 0, 0.02)" }
-			}),
-			isVideo && /* @__PURE__ */ jsx("div", {
-				className: "w-[36px] h-[36px] absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex justify-center items-center rounded-full bg-[rgba(0,0,0,0.5)] video-flag z-[2]",
-				children: /* @__PURE__ */ jsx("svg", {
-					xmlns: "http://www.w3.org/2000/svg",
-					className: "w-full h-full scale-[0.8]",
-					width: "28",
-					height: "40",
-					viewBox: "3 -4 28 40",
-					children: /* @__PURE__ */ jsx("path", {
-						fill: "#fff",
-						transform: "scale(0.0320625 0.0320625)",
-						d: "M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z"
-					})
-				})
-			}),
-			(isLongImage || isGifImage) && /* @__PURE__ */ jsx("div", {
-				className: "absolute bottom-0 right-0 z-[1] h-[22px] px-[6px] leading-[22px] text-[14px] text-[#fff] bg-theme1 rounded-tl-[4px]",
-				children: isGifImage ? "动图" : "长图"
-			})
-		]
-	});
-}
-function CommonPhotoGrid({ className = "", imageList = emptyImageList, isHorizontal = false, onOpenVideoPreview }) {
-	const videoIndexArr = [];
-	const images = imageList.map((item, index) => {
-		if (item.isVideo) videoIndexArr.push(index);
-		return {
-			src: item.src,
-			srcThumbnail: item.srcThumbnail || item.src,
-			isVideo: item.isVideo,
-			width: item.width,
-			height: item.height,
-			videoParams: item.videoParams
-		};
-	});
-	if (!images || images.length === 0) return /* @__PURE__ */ jsx(Fragment, { children: " " });
-	const isVideoView = (index) => {
-		return videoIndexArr.includes(index);
-	};
-	const isLongImage = (index) => {
-		if (images[index].width === 0 || images[index].height === 0) return false;
-		return images[index].height / images[index].width >= 3;
-	};
-	const isGifImage = (index) => {
-		return images[index].src?.endsWith(".gif") || images[index].src?.endsWith(".GIF") || images[index].src?.endsWith(".gifxxx");
-	};
-	const openPhotoPreview = (props) => {
-		if (isVideoView(props.defaultIndex)) {
-			openVideoPreview(props.defaultIndex);
-			return;
-		}
-		photoPreview({
-			images: images.map((image) => ({
-				src: image.src,
-				width: image.width,
-				height: image.height
-			})),
-			defaultIndex: props.defaultIndex,
-			videoIndexArr,
-			openVideo: openVideoPreview
-		});
-	};
-	const openVideoPreview = (index) => {
-		if (!images[index].videoParams) return;
-		onOpenVideoPreview?.({
-			info: images[index].videoParams,
-			show: true
-		});
-	};
-	if (isHorizontal) return /* @__PURE__ */ jsx("div", {
-		className: `w-full flex g-scroll-box-x gap-[8px] ${className}`,
-		onClick: (e) => {
-			e.stopPropagation();
-		},
-		children: images.map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-			image: item.srcThumbnail,
-			index,
-			isVideo: isVideoView(index),
-			isLongImage: isLongImage(index),
-			isGifImage: isGifImage(index),
-			onClick: openPhotoPreview
-		}, `${index}horizontal${item}`))
-	});
-	return /* @__PURE__ */ jsxs("div", {
-		className: `w-full ${className}`,
-		onClick: (e) => {
-			e.stopPropagation();
-		},
-		children: [
-			images.length === 1 && (images[0].width < images[0].height ? /* @__PURE__ */ jsx(PhotoPreviewItem, {
-				image: images[0].srcThumbnail,
-				className: "w-[230px] h-[306px] rounded-[12px] overflow-hidden",
-				index: 0,
-				isVideo: isVideoView(0),
-				isLongImage: isLongImage(0),
-				isGifImage: isGifImage(0),
-				onClick: openPhotoPreview
-			}) : /* @__PURE__ */ jsx(PhotoPreviewItem, {
-				image: images[0].srcThumbnail,
-				className: "w-full rounded-[12px] overflow-hidden",
-				index: 0,
-				isVideo: isVideoView(0),
-				isLongImage: isLongImage(0),
-				isGifImage: isGifImage(0),
-				onClick: openPhotoPreview,
-				styleCss: { paddingBottom: `${images[0].height / images[0].width * 100}%` }
-			})),
-			images.length === 2 && /* @__PURE__ */ jsx("div", {
-				className: "w-full flex gap-[2px] rounded-[12px] overflow-hidden",
-				children: images.map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-					className: "flex-1 pb-[50%]",
-					image: item.srcThumbnail,
-					index,
-					isVideo: isVideoView(index),
-					isLongImage: isLongImage(index),
-					isGifImage: isGifImage(index),
-					onClick: openPhotoPreview
-				}, `${index}two${item}`))
-			}),
-			images.length === 3 && /* @__PURE__ */ jsxs("div", {
-				className: "w-full h-[357px] flex gap-[2px] rounded-[12px] overflow-hidden",
-				children: [/* @__PURE__ */ jsx(PhotoPreviewItem, {
-					image: images[0].srcThumbnail,
-					className: "w-[56.65%] h-[100%]",
-					index: 0,
-					isVideo: isVideoView(0),
-					isLongImage: isLongImage(0),
-					isGifImage: isGifImage(0),
-					onClick: openPhotoPreview
-				}), /* @__PURE__ */ jsx("div", {
-					className: "flex-1 flex flex-col gap-[2px]",
-					children: images.slice(1).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "w-[100%] flex-1",
-						image: item.srcThumbnail,
-						index: index + 1,
-						isVideo: isVideoView(index + 1),
-						isLongImage: isLongImage(index + 1),
-						isGifImage: isGifImage(index + 1),
-						onClick: openPhotoPreview
-					}, `${index}three${item}`))
-				})]
-			}),
-			images.length === 4 && /* @__PURE__ */ jsx("div", {
-				className: "w-full h-[357px] rounded-[12px] overflow-hidden grid grid-cols-2 grid-rows-2 gap-[2px]",
-				children: images.map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-					className: "w-[100%] h-[100%]",
-					image: item.srcThumbnail,
-					index,
-					isVideo: isVideoView(index),
-					isLongImage: isLongImage(index),
-					isGifImage: isGifImage(index),
-					onClick: openPhotoPreview
-				}, `${index}four${item}`))
-			}),
-			images.length === 5 && /* @__PURE__ */ jsxs("div", {
-				className: "w-full rounded-[12px] overflow-hidden flex flex-col gap-[2px]",
-				children: [/* @__PURE__ */ jsx("div", {
-					className: "w-full h-[198px] flex gap-[2px]",
-					children: images.slice(0, 2).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "flex-1 h-full",
-						image: item.srcThumbnail,
-						index,
-						isVideo: isVideoView(index),
-						isLongImage: isLongImage(index),
-						isGifImage: isGifImage(index),
-						onClick: openPhotoPreview
-					}, `${index}five${item}`))
-				}), /* @__PURE__ */ jsx("div", {
-					className: "w-full h-[134px] flex gap-[2px]",
-					children: images.slice(2).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "flex-1 h-full",
-						image: item.srcThumbnail,
-						index: index + 2,
-						isVideo: isVideoView(index + 2),
-						isLongImage: isLongImage(index + 2),
-						isGifImage: isGifImage(index + 2),
-						onClick: openPhotoPreview
-					}, `${index}five-two${item}`))
-				})]
-			}),
-			images.length === 6 && /* @__PURE__ */ jsxs("div", {
-				className: "w-full rounded-[12px] overflow-hidden flex flex-col gap-[2px]",
-				children: [/* @__PURE__ */ jsxs("div", {
-					className: "w-full h-[270px] flex gap-[2px]",
-					children: [/* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "w-[270px] h-full",
-						image: images[0].srcThumbnail,
-						index: 0,
-						isVideo: isVideoView(0),
-						isLongImage: isLongImage(0),
-						isGifImage: isGifImage(0),
-						onClick: openPhotoPreview
-					}), /* @__PURE__ */ jsx("div", {
-						className: "flex-1 grid grid-cols-1 grid-rows-2 gap-[2px]",
-						children: images.slice(1, 3).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-							className: "w-full h-full",
-							image: item.srcThumbnail,
-							index: index + 1,
-							isVideo: isVideoView(index + 1),
-							isLongImage: isLongImage(index + 1),
-							isGifImage: isGifImage(index + 1),
-							onClick: openPhotoPreview
-						}, `${index}six-one${item}`))
-					})]
-				}), /* @__PURE__ */ jsx("div", {
-					className: "w-full h-[134px] grid grid-cols-3 grid-rows-1 gap-[2px]",
-					children: images.slice(3).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "w-full h-full",
-						image: item.srcThumbnail,
-						index: index + 3,
-						isVideo: isVideoView(index + 3),
-						isLongImage: isLongImage(index + 3),
-						isGifImage: isGifImage(index + 3),
-						onClick: openPhotoPreview
-					}, `${index}six-two${item}`))
-				})]
-			}),
-			images.length === 7 && /* @__PURE__ */ jsxs("div", {
-				className: "w-full rounded-[12px] overflow-hidden flex gap-[2px]",
-				children: [/* @__PURE__ */ jsx("div", {
-					className: "w-[304px] h-[270px] grid grid-cols-2 grid-rows-2 gap-[2px]",
-					children: images.slice(0, 4).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "w-[100%] h-[100%]",
-						image: item.srcThumbnail,
-						index,
-						isVideo: isVideoView(index),
-						isLongImage: isLongImage(index),
-						isGifImage: isGifImage(index),
-						onClick: openPhotoPreview
-					}, `${index}seven-one${item}`))
-				}), /* @__PURE__ */ jsx("div", {
-					className: "flex-1 flex flex-col grid grid-cols-1 grid-rows-3 gap-[2px]",
-					children: images.slice(4).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "w-[100%] h-[100%]",
-						image: item.srcThumbnail,
-						index: index + 4,
-						isVideo: isVideoView(index + 4),
-						isLongImage: isLongImage(index + 4),
-						isGifImage: isGifImage(index + 4),
-						onClick: openPhotoPreview
-					}, `${index}seven-two${item}`))
-				})]
-			}),
-			images.length === 8 && /* @__PURE__ */ jsxs("div", {
-				className: "w-full rounded-[12px] overflow-hidden flex flex-col gap-[2px]",
-				children: [/* @__PURE__ */ jsx("div", {
-					className: "w-full h-[134px] flex gap-[2px] items-center",
-					children: images.slice(0, 2).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "flex-1 h-full",
-						image: item.srcThumbnail,
-						index,
-						isVideo: isVideoView(index),
-						isLongImage: isLongImage(index),
-						isGifImage: isGifImage(index),
-						onClick: openPhotoPreview
-					}, `${index}eight${item}`))
-				}), /* @__PURE__ */ jsx("div", {
-					className: "w-full h-[270px] grid grid-cols-3 grid-rows-2 gap-[2px]",
-					children: images.slice(2).map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-						className: "w-full h-full",
-						image: item.srcThumbnail,
-						index: index + 2,
-						isVideo: isVideoView(index + 2),
-						isLongImage: isLongImage(index + 2),
-						isGifImage: isGifImage(index + 2),
-						onClick: openPhotoPreview
-					}, `${index}eight-two${item}`))
-				})]
-			}),
-			images.length === 9 && /* @__PURE__ */ jsx("div", {
-				className: "w-full h-[406px] rounded-[12px] overflow-hidden grid grid-cols-3 grid-rows-3 gap-[2px]",
-				children: images.map((item, index) => /* @__PURE__ */ jsx(PhotoPreviewItem, {
-					className: "w-full w-full",
-					image: item.srcThumbnail,
-					index,
-					isVideo: isVideoView(index),
-					isLongImage: isLongImage(index),
-					isGifImage: isGifImage(index),
-					onClick: openPhotoPreview
-				}, `${index}nine${item}`))
-			})
-		]
-	});
-}
-
-//#endregion
-export { CommonPhotoGrid as default };
+"use client";import{Image as e}from"../../ui/image.mjs";import{photoPreview as t}from"../photo-preview/common-photo-preview.mjs";import{Fragment as n,jsx as r,jsxs as i}from"react/jsx-runtime";import"photoswipe/style.css";const a={},o=[];function s({image:t,index:n,className:o=``,isVideo:s=!1,isLongImage:c=!1,isGifImage:l=!1,styleCss:u=a,onClick:d}){return i(`div`,{className:`bg-bg2 photo-preview-item relative ${o}`,style:{...u},onClick:()=>{d({image:t,defaultIndex:n})},children:[r(e,{src:t,fill:!0,objectFit:`cover`}),r(`div`,{className:`absolute top-0 left-0 w-full h-full z-[1]`,style:{backgroundColor:`rgba(0, 0, 0, 0.02)`}}),s&&r(`div`,{className:`w-[36px] h-[36px] absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex justify-center items-center rounded-full bg-[rgba(0,0,0,0.5)] video-flag z-[2]`,children:r(`svg`,{xmlns:`http://www.w3.org/2000/svg`,className:`w-full h-full scale-[0.8]`,width:`28`,height:`40`,viewBox:`3 -4 28 40`,children:r(`path`,{fill:`#fff`,transform:`scale(0.0320625 0.0320625)`,d:`M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z`})})}),(c||l)&&r(`div`,{className:`absolute bottom-0 right-0 z-[1] h-[22px] px-[6px] leading-[22px] text-[14px] text-[#fff] bg-theme1 rounded-tl-[4px]`,children:l?`动图`:`长图`})]})}function c({className:e=``,imageList:a=o,isHorizontal:c=!1,onOpenVideoPreview:l}){let u=[],d=a.map((e,t)=>(e.isVideo&&u.push(t),{src:e.src,srcThumbnail:e.srcThumbnail||e.src,isVideo:e.isVideo,width:e.width,height:e.height,videoParams:e.videoParams}));if(!d||d.length===0)return r(n,{children:` `});let f=e=>u.includes(e),p=e=>d[e].width===0||d[e].height===0?!1:d[e].height/d[e].width>=3,m=e=>d[e].src?.endsWith(`.gif`)||d[e].src?.endsWith(`.GIF`)||d[e].src?.endsWith(`.gifxxx`),h=e=>{if(f(e.defaultIndex)){g(e.defaultIndex);return}t({images:d.map(e=>({src:e.src,width:e.width,height:e.height})),defaultIndex:e.defaultIndex,videoIndexArr:u,openVideo:g})},g=e=>{d[e].videoParams&&l?.({info:d[e].videoParams,show:!0})};return c?r(`div`,{className:`w-full flex g-scroll-box-x gap-[8px] ${e}`,onClick:e=>{e.stopPropagation()},children:d.map((e,t)=>r(s,{image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}horizontal${e}`))}):i(`div`,{className:`w-full ${e}`,onClick:e=>{e.stopPropagation()},children:[d.length===1&&(d[0].width<d[0].height?r(s,{image:d[0].srcThumbnail,className:`w-[230px] h-[306px] rounded-[12px] overflow-hidden`,index:0,isVideo:f(0),isLongImage:p(0),isGifImage:m(0),onClick:h}):r(s,{image:d[0].srcThumbnail,className:`w-full rounded-[12px] overflow-hidden`,index:0,isVideo:f(0),isLongImage:p(0),isGifImage:m(0),onClick:h,styleCss:{paddingBottom:`${d[0].height/d[0].width*100}%`}})),d.length===2&&r(`div`,{className:`w-full flex gap-[2px] rounded-[12px] overflow-hidden`,children:d.map((e,t)=>r(s,{className:`flex-1 pb-[50%]`,image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}two${e}`))}),d.length===3&&i(`div`,{className:`w-full h-[357px] flex gap-[2px] rounded-[12px] overflow-hidden`,children:[r(s,{image:d[0].srcThumbnail,className:`w-[56.65%] h-[100%]`,index:0,isVideo:f(0),isLongImage:p(0),isGifImage:m(0),onClick:h}),r(`div`,{className:`flex-1 flex flex-col gap-[2px]`,children:d.slice(1).map((e,t)=>r(s,{className:`w-[100%] flex-1`,image:e.srcThumbnail,index:t+1,isVideo:f(t+1),isLongImage:p(t+1),isGifImage:m(t+1),onClick:h},`${t}three${e}`))})]}),d.length===4&&r(`div`,{className:`w-full h-[357px] rounded-[12px] overflow-hidden grid grid-cols-2 grid-rows-2 gap-[2px]`,children:d.map((e,t)=>r(s,{className:`w-[100%] h-[100%]`,image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}four${e}`))}),d.length===5&&i(`div`,{className:`w-full rounded-[12px] overflow-hidden flex flex-col gap-[2px]`,children:[r(`div`,{className:`w-full h-[198px] flex gap-[2px]`,children:d.slice(0,2).map((e,t)=>r(s,{className:`flex-1 h-full`,image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}five${e}`))}),r(`div`,{className:`w-full h-[134px] flex gap-[2px]`,children:d.slice(2).map((e,t)=>r(s,{className:`flex-1 h-full`,image:e.srcThumbnail,index:t+2,isVideo:f(t+2),isLongImage:p(t+2),isGifImage:m(t+2),onClick:h},`${t}five-two${e}`))})]}),d.length===6&&i(`div`,{className:`w-full rounded-[12px] overflow-hidden flex flex-col gap-[2px]`,children:[i(`div`,{className:`w-full h-[270px] flex gap-[2px]`,children:[r(s,{className:`w-[270px] h-full`,image:d[0].srcThumbnail,index:0,isVideo:f(0),isLongImage:p(0),isGifImage:m(0),onClick:h}),r(`div`,{className:`flex-1 grid grid-cols-1 grid-rows-2 gap-[2px]`,children:d.slice(1,3).map((e,t)=>r(s,{className:`w-full h-full`,image:e.srcThumbnail,index:t+1,isVideo:f(t+1),isLongImage:p(t+1),isGifImage:m(t+1),onClick:h},`${t}six-one${e}`))})]}),r(`div`,{className:`w-full h-[134px] grid grid-cols-3 grid-rows-1 gap-[2px]`,children:d.slice(3).map((e,t)=>r(s,{className:`w-full h-full`,image:e.srcThumbnail,index:t+3,isVideo:f(t+3),isLongImage:p(t+3),isGifImage:m(t+3),onClick:h},`${t}six-two${e}`))})]}),d.length===7&&i(`div`,{className:`w-full rounded-[12px] overflow-hidden flex gap-[2px]`,children:[r(`div`,{className:`w-[304px] h-[270px] grid grid-cols-2 grid-rows-2 gap-[2px]`,children:d.slice(0,4).map((e,t)=>r(s,{className:`w-[100%] h-[100%]`,image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}seven-one${e}`))}),r(`div`,{className:`flex-1 flex flex-col grid grid-cols-1 grid-rows-3 gap-[2px]`,children:d.slice(4).map((e,t)=>r(s,{className:`w-[100%] h-[100%]`,image:e.srcThumbnail,index:t+4,isVideo:f(t+4),isLongImage:p(t+4),isGifImage:m(t+4),onClick:h},`${t}seven-two${e}`))})]}),d.length===8&&i(`div`,{className:`w-full rounded-[12px] overflow-hidden flex flex-col gap-[2px]`,children:[r(`div`,{className:`w-full h-[134px] flex gap-[2px] items-center`,children:d.slice(0,2).map((e,t)=>r(s,{className:`flex-1 h-full`,image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}eight${e}`))}),r(`div`,{className:`w-full h-[270px] grid grid-cols-3 grid-rows-2 gap-[2px]`,children:d.slice(2).map((e,t)=>r(s,{className:`w-full h-full`,image:e.srcThumbnail,index:t+2,isVideo:f(t+2),isLongImage:p(t+2),isGifImage:m(t+2),onClick:h},`${t}eight-two${e}`))})]}),d.length===9&&r(`div`,{className:`w-full h-[406px] rounded-[12px] overflow-hidden grid grid-cols-3 grid-rows-3 gap-[2px]`,children:d.map((e,t)=>r(s,{className:`w-full w-full`,image:e.srcThumbnail,index:t,isVideo:f(t),isLongImage:p(t),isGifImage:m(t),onClick:h},`${t}nine${e}`))})]})}export{c as default};