pb-sxp-ui 1.19.9 → 1.19.11

package/dist/index.cjs

@@ -19000,6 +19000,70 @@ const NavBack = ({ data, minusHeight, tagHeight, onClick }) => {
 };
 var NavBack$1 = React.memo(NavBack);
 
+const useVisibleHeight = () => {
+    const [visibleHeight, setVisibleHeight] = React.useState(0);
+    const getVisibleContentHeight = () => {
+        // 方法优先级：
+        // 1. visualViewport.height (最准确)
+        // 2. window.innerHeight (次之)
+        // 3. document.documentElement.clientHeight (fallback)
+        if (typeof window === 'undefined')
+            return 0;
+        let height = window.innerHeight;
+        // 优先使用 visualViewport
+        if (window.visualViewport) {
+            height = window.visualViewport.height;
+        }
+        // 验证高度合理性
+        if (height <= 0 || height > window.screen.height) {
+            height = window.innerHeight;
+        }
+        // 最终 fallback
+        if (height <= 0) {
+            height = document.documentElement.clientHeight;
+        }
+        return height;
+    };
+    const updateHeight = React.useCallback(() => {
+        const height = getVisibleContentHeight();
+        setVisibleHeight(height);
+    }, []);
+    React.useEffect(() => {
+        // 初始计算
+        updateHeight();
+        // 事件监听
+        const events = ['resize', 'orientationchange', 'load', 'DOMContentLoaded'];
+        events.forEach((event) => {
+            window.addEventListener(event, updateHeight);
+        });
+        // visualViewport 监听（最重要）
+        if (window.visualViewport) {
+            window.visualViewport.addEventListener('resize', updateHeight);
+            window.visualViewport.addEventListener('scroll', updateHeight);
+        }
+        // 键盘弹出/收起监听（移动端重要）
+        if ('virtualKeyboard' in navigator) {
+            navigator.virtualKeyboard.addEventListener('geometrychange', updateHeight);
+        }
+        // 定期检查（应对某些特殊情况）
+        const interval = setInterval(updateHeight, 1000);
+        return () => {
+            events.forEach((event) => {
+                window.removeEventListener(event, updateHeight);
+            });
+            if (window.visualViewport) {
+                window.visualViewport.removeEventListener('resize', updateHeight);
+                window.visualViewport.removeEventListener('scroll', updateHeight);
+            }
+            if ('virtualKeyboard' in navigator) {
+                navigator.virtualKeyboard.removeEventListener('geometrychange', updateHeight);
+            }
+            clearInterval(interval);
+        };
+    }, [updateHeight]);
+    return visibleHeight;
+};
+
 /*
  * @Author: binruan@chatlabs.com
  * @Date: 2024-03-20 10:27:31
@@ -19028,6 +19092,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
     const fbcRef = React.useRef('');
     const { loadVideos, bffEventReport, loading, setPopupDetailData, ctaEvent, swiperRef, waterFallData, setOpenHashtag, appDomain, openHashtag, loadingImage, isFromHashtag, popupDetailData, bffFbReport, curTime, h5EnterLink, isShowConsent, selectTag, isPreview, isEditor, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, isNoMoreData, channel, refreshFeSession, isDiyH5, pixelPvStatusRef } = useSxpDataSource();
     const { backMainFeed, productView, jumpToWeb } = useEventReport();
+    useVisibleHeight();
     const isShowFingerTip = React.useMemo(() => {
         return data.length > 0 && !loading && (getFeUserState() || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableSwiperTip));
     }, [data, loading, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableSwiperTip]);
@@ -19197,6 +19262,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
         return minusHeight;
     }, [globalConfig]);
     const getHeightWithSafeArea = () => {
+        const root = document.documentElement;
+        const value = getComputedStyle(root).getPropertyValue('--safe-area-inset-bottom');
+        // 处理可能的值（可能是 '0px', '34px' 等）
+        const numericValue = parseInt(value) || 0;
+        return numericValue;
+    };
+    const getHeightWithSafeArea2 = () => {
         // 获取窗口高度
         // 动态检测安全区域
         const detector = document.createElement('div');
@@ -19212,8 +19284,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
         return safeAreaBottom;
     };
     const height = React.useMemo(() => {
-        return containerHeight - minusHeight - tagHeight - getHeightWithSafeArea();
-    }, [minusHeight, containerHeight, tagHeight]);
+        return containerHeight - minusHeight - tagHeight - getHeightWithSafeArea2();
+    }, [minusHeight, containerHeight, tagHeight, getHeightWithSafeArea2]);
     const visList = React.useMemo(() => {
         var _a;
         const list = activeIndex === 0 && !waterFallData && !isEditor && !isDiyH5