@funhub/platform 0.2.31 → 0.2.32

package/dist/components/biz/business/advertisement/popup-ad/client.mjs

@@ -1,200 +1,5 @@
 
-'use client';
-
-import { trackAdClick, trackAdImpression, trackAdvertising } from "../../../../../utils/tracking.mjs";
-import { Button } from "../../../../ui/button.mjs";
-import { Image } from "../../../../ui/image.mjs";
-import { Box } from "../../../../ui/box.mjs";
-import { Dialog, DialogContent } from "../../../../ui/dialog.mjs";
-import Link from "../../../../ui/link.mjs";
-import CommonPlayer from "../../../../common/video-player/index.mjs";
-import { adaptPopupAdMaterials, hasMatchedAds } from "../ad-match.mjs";
-import { useAdProvider } from "../ad-provider.mjs";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region components/biz/business/advertisement/popup-ad/client.tsx
-const POPUP_AD_CLOSE_DURATION = 260;
-const POPUP_AD_DEFAULT_RESOLUTION = "1080x1920";
-const POPUP_AD_DEFAULT_ITEMS = [{
-	id: "popup-ad-1",
-	title: "弹窗广告标题",
-	jumpUrl: "/search",
-	materialUrl: "/static/components-resource/banner.png",
-	desc: "这里是弹窗广告描述"
-}];
-function fallbackEditorItems(items, fallback) {
-	return Array.isArray(items) && items.length > 0 ? items : fallback ?? [];
-}
-/**
-* 判断当前素材是否为视频广告。
-*/
-function isVideoPopupAd(item) {
-	return Number(item?.advertiseType) === 2 && Boolean(item?.videoUrl);
-}
-/**
-* 获取弹窗广告的视频分辨率。
-*/
-function resolvePopupAdResolution(item) {
-	return item?.resolution || POPUP_AD_DEFAULT_RESOLUTION;
-}
-/**
-* 弹窗广告组件。
-*/
-function PopupAd({ items, mode: _mode = "renderer", pageKey = "home", pageName = "首页" }) {
-	const adContext = useAdProvider();
-	const resolvedItems = useMemo(() => {
-		if (hasMatchedAds(adContext?.matchData)) return adaptPopupAdMaterials(adContext?.matchData);
-		if (_mode === "editor") return fallbackEditorItems(items, POPUP_AD_DEFAULT_ITEMS);
-		return items ?? [];
-	}, [
-		adContext?.matchData,
-		_mode,
-		items
-	]);
-	const [currentIndex, setCurrentIndex] = useState(0);
-	const [isClosing, setIsClosing] = useState(false);
-	const closeTimerRef = useRef(null);
-	const adSlotKey = adContext?.matchData?.advertiseLocationCode || "home_popup";
-	useEffect(() => {
-		setCurrentIndex(0);
-	}, [resolvedItems]);
-	useEffect(() => {
-		setIsClosing(false);
-	}, [currentIndex, resolvedItems]);
-	useEffect(() => {
-		return () => {
-			if (closeTimerRef.current) window.clearTimeout(closeTimerRef.current);
-		};
-	}, []);
-	const currentItem = resolvedItems[currentIndex];
-	const isVideoAd = isVideoPopupAd(currentItem);
-	/** 弹窗广告曝光，每个新素材展示时上报 ad_impression。 */
-	useEffect(() => {
-		if (!currentItem?.id) return;
-		trackAdImpression({
-			page_key: pageKey,
-			page_name: pageName,
-			ad_slot_key: adSlotKey,
-			ad_slot_name: "弹窗广告",
-			ad_id: currentItem.id,
-			ad_type: "pop-ups-600800"
-		});
-	}, [
-		currentItem?.id,
-		adSlotKey,
-		pageKey,
-		pageName
-	]);
-	function showNextAd() {
-		setCurrentIndex((prev) => prev + 1);
-	}
-	function playCloseAnimation() {
-		if (isClosing) return;
-		setIsClosing(true);
-		if (closeTimerRef.current) window.clearTimeout(closeTimerRef.current);
-		closeTimerRef.current = window.setTimeout(() => {
-			closeTimerRef.current = null;
-			showNextAd();
-		}, POPUP_AD_CLOSE_DURATION);
-	}
-	function handleOpenChange(nextOpen) {
-		if (!nextOpen) playCloseAnimation();
-	}
-	/** 点击广告图片上报 ad_click。 */
-	function handleAdClick() {
-		if (!currentItem?.id) return;
-		trackAdClick({
-			page_key: pageKey,
-			page_name: pageName,
-			ad_slot_key: adSlotKey,
-			ad_slot_name: "弹窗广告",
-			ad_id: currentItem.id,
-			ad_type: "pop-ups-600800"
-		});
-	}
-	/** 点击跳过按钮上报 advertising，然后关闭当前广告。 */
-	function handleSkip() {
-		if (!currentItem?.id) return;
-		trackAdvertising({
-			event_type: "close",
-			advertising_key: adSlotKey,
-			advertising_name: "弹窗广告",
-			advertising_id: currentItem.id
-		});
-		playCloseAnimation();
-	}
-	if (!currentItem) return null;
-	return /* @__PURE__ */ jsx(Dialog, {
-		open: true,
-		onOpenChange: handleOpenChange,
-		disablePointerDismissal: true,
-		children: /* @__PURE__ */ jsxs(DialogContent, {
-			showCloseButton: false,
-			className: "w-[320px] max-w-[calc(100vw-32px)] border-none bg-transparent p-0 shadow-none",
-			children: [/* @__PURE__ */ jsxs(Box, {
-				className: "flex flex-col items-center gap-[24px]",
-				style: {
-					animation: isClosing ? `funhub-popup-ad-exit ${POPUP_AD_CLOSE_DURATION}ms cubic-bezier(0.4, 0, 0.2, 1) both` : "funhub-popup-ad-enter 420ms cubic-bezier(0.2, 0.9, 0.2, 1) both, funhub-popup-ad-float 3.2s ease-in-out 420ms infinite",
-					transformOrigin: "center bottom"
-				},
-				children: [/* @__PURE__ */ jsx(Box, {
-					className: "w-full overflow-hidden rounded-[20px] bg-[#434343]",
-					style: { boxShadow: "0 18px 48px rgba(0, 0, 0, 0.26)" },
-					onClick: handleAdClick,
-					children: isVideoAd ? /* @__PURE__ */ jsx(Box, {
-						className: "w-full bg-black",
-						children: /* @__PURE__ */ jsxs(Box, {
-							className: "relative aspect-[9/16] w-full cursor-pointer overflow-hidden bg-black",
-							children: [/* @__PURE__ */ jsx(CommonPlayer, {
-								plyerId: `popup-ad-${currentItem.id}`,
-								resolution: resolvePopupAdResolution(currentItem),
-								poster: currentItem.materialUrl || "",
-								videoUrl: currentItem.videoUrl || "",
-								mergeConfig: {
-									fitVideoSize: "fixWidth",
-									autoplayMuted: true,
-									controls: false
-								}
-							}), /* @__PURE__ */ jsx(Link, {
-								href: currentItem.jumpUrl,
-								"aria-label": currentItem.title || "跳转广告详情",
-								className: "absolute inset-0 z-10 block",
-								children: /* @__PURE__ */ jsx("span", {
-									className: "sr-only",
-									children: currentItem.title || "跳转广告详情"
-								})
-							})]
-						})
-					}) : /* @__PURE__ */ jsx(Link, {
-						href: currentItem.jumpUrl,
-						className: "block w-full overflow-hidden bg-[#434343]",
-						children: /* @__PURE__ */ jsx(Box, {
-							className: "w-full overflow-hidden bg-[#434343]",
-							children: /* @__PURE__ */ jsx(Image, {
-								src: currentItem.materialUrl,
-								alt: currentItem.title || "弹窗广告",
-								width: 1200,
-								height: 1600,
-								className: "block w-full h-auto",
-								unoptimized: true
-							})
-						})
-					})
-				}), /* @__PURE__ */ jsx(Button, {
-					type: "button",
-					"aria-label": "关闭弹窗广告",
-					variant: "ghost",
-					size: "icon-lg",
-					className: "relative h-[54px] w-[54px] rounded-full border-[3px] border-white bg-transparent p-0 text-white hover:bg-white/8",
-					onClick: handleSkip,
-					style: { animation: isClosing ? `funhub-popup-ad-close-exit ${POPUP_AD_CLOSE_DURATION}ms ease-out both` : "funhub-popup-ad-close-breathe 2.4s ease-in-out 480ms infinite" },
-					children: /* @__PURE__ */ jsxs(Box, {
-						className: "relative h-[24px] w-[24px]",
-						children: [/* @__PURE__ */ jsx(Box, { className: "absolute left-1/2 top-1/2 h-[4px] w-full -translate-x-1/2 -translate-y-1/2 rotate-45 rounded-full bg-current" }), /* @__PURE__ */ jsx(Box, { className: "absolute left-1/2 top-1/2 h-[4px] w-full -translate-x-1/2 -translate-y-1/2 -rotate-45 rounded-full bg-current" })]
-					})
-				})]
-			}, currentItem.id), /* @__PURE__ */ jsx("style", { children: `
+"use client";import{trackAdClick as e,trackAdImpression as t,trackAdvertising as n}from"../../../../../utils/tracking.mjs";import{Button as r}from"../../../../ui/button.mjs";import{Image as i}from"../../../../ui/image.mjs";import{Box as a}from"../../../../ui/box.mjs";import{Dialog as o,DialogContent as s}from"../../../../ui/dialog.mjs";import c from"../../../../ui/link.mjs";import l from"../../../../common/video-player/index.mjs";import{adaptPopupAdMaterials as u,hasMatchedAds as d}from"../ad-match.mjs";import{useAdProvider as f}from"../ad-provider.mjs";import{useEffect as p,useMemo as m,useRef as h,useState as g}from"react";import{jsx as _,jsxs as v}from"react/jsx-runtime";const y=[{id:`popup-ad-1`,title:`弹窗广告标题`,jumpUrl:`/search`,materialUrl:`/static/components-resource/banner.png`,desc:`这里是弹窗广告描述`}];function b(e,t){return Array.isArray(e)&&e.length>0?e:t??[]}function x(e){return Number(e?.advertiseType)===2&&!!e?.videoUrl}function S(e){return e?.resolution||`1080x1920`}function C({items:C,mode:w=`renderer`,pageKey:T=`home`,pageName:E=`首页`}){let D=f(),O=m(()=>d(D?.matchData)?u(D?.matchData):w===`editor`?b(C,y):C??[],[D?.matchData,w,C]),[k,A]=g(0),[j,M]=g(!1),N=h(null),P=D?.matchData?.advertiseLocationCode||`home_popup`;p(()=>{A(0)},[O]),p(()=>{M(!1)},[k,O]),p(()=>()=>{N.current&&window.clearTimeout(N.current)},[]);let F=O[k],I=x(F);p(()=>{F?.id&&t({page_key:T,page_name:E,ad_slot_key:P,ad_slot_name:`弹窗广告`,ad_id:F.id,ad_type:`pop-ups-600800`})},[F?.id,P,T,E]);function L(){A(e=>e+1)}function R(){j||(M(!0),N.current&&window.clearTimeout(N.current),N.current=window.setTimeout(()=>{N.current=null,L()},260))}function z(e){e||R()}function B(){F?.id&&e({page_key:T,page_name:E,ad_slot_key:P,ad_slot_name:`弹窗广告`,ad_id:F.id,ad_type:`pop-ups-600800`})}function V(){F?.id&&(n({event_type:`close`,advertising_key:P,advertising_name:`弹窗广告`,advertising_id:F.id}),R())}return F?_(o,{open:!0,onOpenChange:z,disablePointerDismissal:!0,children:v(s,{showCloseButton:!1,className:`w-[320px] max-w-[calc(100vw-32px)] border-none bg-transparent p-0 shadow-none`,children:[v(a,{className:`flex flex-col items-center gap-[24px]`,style:{animation:j?`funhub-popup-ad-exit 260ms cubic-bezier(0.4, 0, 0.2, 1) both`:`funhub-popup-ad-enter 420ms cubic-bezier(0.2, 0.9, 0.2, 1) both, funhub-popup-ad-float 3.2s ease-in-out 420ms infinite`,transformOrigin:`center bottom`},children:[_(a,{className:`w-full overflow-hidden rounded-[20px] bg-[#434343]`,style:{boxShadow:`0 18px 48px rgba(0, 0, 0, 0.26)`},onClick:B,children:I?_(a,{className:`w-full bg-black`,children:v(a,{className:`relative aspect-[9/16] w-full cursor-pointer overflow-hidden bg-black`,children:[_(l,{plyerId:`popup-ad-${F.id}`,resolution:S(F),poster:F.materialUrl||``,videoUrl:F.videoUrl||``,mergeConfig:{fitVideoSize:`fixWidth`,autoplayMuted:!0,controls:!1}}),_(c,{href:F.jumpUrl,"aria-label":F.title||`跳转广告详情`,className:`absolute inset-0 z-10 block`,children:_(`span`,{className:`sr-only`,children:F.title||`跳转广告详情`})})]})}):_(c,{href:F.jumpUrl,className:`block w-full overflow-hidden bg-[#434343]`,children:_(a,{className:`w-full overflow-hidden bg-[#434343]`,children:_(i,{src:F.materialUrl,alt:F.title||`弹窗广告`,width:1200,height:1600,className:`block w-full h-auto`,unoptimized:!0})})})}),_(r,{type:`button`,"aria-label":`关闭弹窗广告`,variant:`ghost`,size:`icon-lg`,className:`relative h-[54px] w-[54px] rounded-full border-[3px] border-white bg-transparent p-0 text-white hover:bg-white/8`,onClick:V,style:{animation:j?`funhub-popup-ad-close-exit 260ms ease-out both`:`funhub-popup-ad-close-breathe 2.4s ease-in-out 480ms infinite`},children:v(a,{className:`relative h-[24px] w-[24px]`,children:[_(a,{className:`absolute left-1/2 top-1/2 h-[4px] w-full -translate-x-1/2 -translate-y-1/2 rotate-45 rounded-full bg-current`}),_(a,{className:`absolute left-1/2 top-1/2 h-[4px] w-full -translate-x-1/2 -translate-y-1/2 -rotate-45 rounded-full bg-current`})]})})]},F.id),_(`style`,{children:`
           @keyframes funhub-popup-ad-enter {
             0% {
               opacity: 0;
@@ -256,10 +61,4 @@ function PopupAd({ items, mode: _mode = "renderer", pageKey = "home", pageName =
               animation-iteration-count: 1 !important;
             }
           }
-        ` })]
-		})
-	});
-}
-
-//#endregion
-export { PopupAd };
+        `})]})}):null}export{C as PopupAd};

package/dist/components/biz/business/advertisement/popup-ad/material.mjs

@@ -1,22 +1,2 @@
 
-import { defineMaterial } from "../../../../../utils/schema/material.mjs";
-import { PopupAd } from "./client.mjs";
-import { popupAdInspectorPropsSchema } from "./schema.mjs";
-import { PopupAdServer } from "./server.mjs";
-
-//#region components/biz/business/advertisement/popup-ad/material.ts
-/**
-* 弹窗广告物料定义。
-*/
-const popupAdMaterial = defineMaterial({
-	type: "popup-ad",
-	name: "弹窗广告",
-	icon: "/static/components-thumb/carousel_banner.png",
-	category: "广告组件",
-	serverComponent: PopupAdServer,
-	clientComponent: PopupAd,
-	propsSchema: popupAdInspectorPropsSchema
-});
-
-//#endregion
-export { popupAdMaterial };
+import{defineMaterial as e}from"../../../../../utils/schema/material.mjs";import{PopupAd as t}from"./client.mjs";import{popupAdInspectorPropsSchema as n}from"./schema.mjs";import{PopupAdServer as r}from"./server.mjs";const i=e({type:`popup-ad`,name:`弹窗广告`,icon:`/static/components-thumb/carousel_banner.png`,category:`广告组件`,serverComponent:r,clientComponent:t,propsSchema:n});export{i as popupAdMaterial};

package/dist/components/biz/business/advertisement/popup-ad/schema.mjs

@@ -1,49 +1,2 @@
 
-import { defineComponentPropsSchema, getSchemaDefaultProps } from "../../../../../utils/schema/schema.mjs";
-import z$1 from "zod";
-
-//#region components/biz/business/advertisement/popup-ad/schema.ts
-/**
-* 弹窗广告物料属性。
-*/
-const popupAdInspectorPropsSchema = defineComponentPropsSchema((t) => ({ items: t.array(z$1.object({
-	id: t.string("popup-ad-1", {
-		label: "广告 ID",
-		required: true
-	}),
-	title: t.string("弹窗广告标题", {
-		label: "标题",
-		required: false
-	}),
-	jumpUrl: t.string("/search", {
-		label: "跳转链接",
-		required: true
-	}),
-	materialUrl: t.string("/static/components-resource/banner.png", {
-		label: "素材地址",
-		required: true
-	}),
-	advertiseType: t.number(1, {
-		label: "广告类型",
-		required: false
-	}),
-	videoUrl: t.string("", {
-		label: "视频地址",
-		required: false
-	}),
-	resolution: t.string("1080x1920", {
-		label: "视频分辨率",
-		required: false
-	}),
-	desc: t.string("这里是弹窗广告描述", {
-		label: "描述",
-		required: false
-	})
-}), {
-	label: "广告列表",
-	required: false
-}) }));
-const popupAdInspectorDefaultProps = getSchemaDefaultProps(popupAdInspectorPropsSchema);
-
-//#endregion
-export { popupAdInspectorDefaultProps, popupAdInspectorPropsSchema };
+import{defineComponentPropsSchema as e,getSchemaDefaultProps as t}from"../../../../../utils/schema/schema.mjs";import n from"zod";const r=e(e=>({items:e.array(n.object({id:e.string(`popup-ad-1`,{label:`广告 ID`,required:!0}),title:e.string(`弹窗广告标题`,{label:`标题`,required:!1}),jumpUrl:e.string(`/search`,{label:`跳转链接`,required:!0}),materialUrl:e.string(`/static/components-resource/banner.png`,{label:`素材地址`,required:!0}),advertiseType:e.number(1,{label:`广告类型`,required:!1}),videoUrl:e.string(``,{label:`视频地址`,required:!1}),resolution:e.string(`1080x1920`,{label:`视频分辨率`,required:!1}),desc:e.string(`这里是弹窗广告描述`,{label:`描述`,required:!1})}),{label:`广告列表`,required:!1})})),i=t(r);export{i as popupAdInspectorDefaultProps,r as popupAdInspectorPropsSchema};

package/dist/components/biz/business/advertisement/popup-ad/server.mjs

@@ -1,25 +1,2 @@
 
-import { AdRuntimeProvider } from "../ad-runtime-provider.mjs";
-import { PopupAd } from "./client.mjs";
-import { jsx } from "react/jsx-runtime";
-
-//#region components/biz/business/advertisement/popup-ad/server.tsx
-/**
-* 弹窗广告服务端组件。
-*/
-async function PopupAdServer(props) {
-	const { mode = "renderer", componentId, sceneContext, ...rest } = props;
-	return /* @__PURE__ */ jsx(AdRuntimeProvider, {
-		adType: "popup",
-		componentId,
-		sceneContext,
-		mode,
-		children: /* @__PURE__ */ jsx(PopupAd, {
-			...rest,
-			mode
-		})
-	});
-}
-
-//#endregion
-export { PopupAdServer };
+import{AdRuntimeProvider as e}from"../ad-runtime-provider.mjs";import{PopupAd as t}from"./client.mjs";import{jsx as n}from"react/jsx-runtime";async function r(r){let{mode:i=`renderer`,componentId:a,sceneContext:o,...s}=r;return n(e,{adType:`popup`,componentId:a,sceneContext:o,mode:i,children:n(t,{...s,mode:i})})}export{r as PopupAdServer};