pb-sxp-ui 1.19.9 → 1.19.11

package/dist/index.css

@@ -62,6 +62,10 @@ a:active {
 .swiper-button-next,.swiper-button-prev{
   color: #000;
   outline: none;
+}
+
+:root {
+  --safe-area-inset-bottom: env(safe-area-inset-bottom);
 }
 .pb-appoint-form {
   position: relative;

package/dist/index.js

@@ -18978,6 +18978,70 @@ const NavBack = ({ data, minusHeight, tagHeight, onClick }) => {
 };
 var NavBack$1 = memo(NavBack);
 
+const useVisibleHeight = () => {
+    const [visibleHeight, setVisibleHeight] = 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 = useCallback(() => {
+        const height = getVisibleContentHeight();
+        setVisibleHeight(height);
+    }, []);
+    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
@@ -19006,6 +19070,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
     const fbcRef = 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 = 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]);
@@ -19175,6 +19240,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');
@@ -19190,8 +19262,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
         return safeAreaBottom;
     };
     const height = useMemo(() => {
-        return containerHeight - minusHeight - tagHeight - getHeightWithSafeArea();
-    }, [minusHeight, containerHeight, tagHeight]);
+        return containerHeight - minusHeight - tagHeight - getHeightWithSafeArea2();
+    }, [minusHeight, containerHeight, tagHeight, getHeightWithSafeArea2]);
     const visList = useMemo(() => {
         var _a;
         const list = activeIndex === 0 && !waterFallData && !isEditor && !isDiyH5