pb-sxp-ui 1.19.9 → 1.19.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +67 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +67 -2
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +4 -4
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +4 -4
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +67 -2
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +4 -4
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/index.js +4 -2
- package/es/core/hooks/useVisibleHeight.d.ts +1 -0
- package/es/core/hooks/useVisibleHeight.js +52 -0
- package/lib/core/components/SxpPageRender/index.js +4 -2
- package/lib/core/hooks/useVisibleHeight.d.ts +1 -0
- package/lib/core/hooks/useVisibleHeight.js +56 -0
- package/package.json +1 -1
package/dist/pb-ui.js
CHANGED
|
@@ -18993,6 +18993,70 @@ Made in Italy` })));
|
|
|
18993
18993
|
};
|
|
18994
18994
|
var NavBack$1 = React.memo(NavBack);
|
|
18995
18995
|
|
|
18996
|
+
const useVisibleHeight = () => {
|
|
18997
|
+
const [visibleHeight, setVisibleHeight] = React.useState(0);
|
|
18998
|
+
const getVisibleContentHeight = () => {
|
|
18999
|
+
// 方法优先级:
|
|
19000
|
+
// 1. visualViewport.height (最准确)
|
|
19001
|
+
// 2. window.innerHeight (次之)
|
|
19002
|
+
// 3. document.documentElement.clientHeight (fallback)
|
|
19003
|
+
if (typeof window === 'undefined')
|
|
19004
|
+
return 0;
|
|
19005
|
+
let height = window.innerHeight;
|
|
19006
|
+
// 优先使用 visualViewport
|
|
19007
|
+
if (window.visualViewport) {
|
|
19008
|
+
height = window.visualViewport.height;
|
|
19009
|
+
}
|
|
19010
|
+
// 验证高度合理性
|
|
19011
|
+
if (height <= 0 || height > window.screen.height) {
|
|
19012
|
+
height = window.innerHeight;
|
|
19013
|
+
}
|
|
19014
|
+
// 最终 fallback
|
|
19015
|
+
if (height <= 0) {
|
|
19016
|
+
height = document.documentElement.clientHeight;
|
|
19017
|
+
}
|
|
19018
|
+
return height;
|
|
19019
|
+
};
|
|
19020
|
+
const updateHeight = React.useCallback(() => {
|
|
19021
|
+
const height = getVisibleContentHeight();
|
|
19022
|
+
setVisibleHeight(height);
|
|
19023
|
+
}, []);
|
|
19024
|
+
React.useEffect(() => {
|
|
19025
|
+
// 初始计算
|
|
19026
|
+
updateHeight();
|
|
19027
|
+
// 事件监听
|
|
19028
|
+
const events = ['resize', 'orientationchange', 'load', 'DOMContentLoaded'];
|
|
19029
|
+
events.forEach((event) => {
|
|
19030
|
+
window.addEventListener(event, updateHeight);
|
|
19031
|
+
});
|
|
19032
|
+
// visualViewport 监听(最重要)
|
|
19033
|
+
if (window.visualViewport) {
|
|
19034
|
+
window.visualViewport.addEventListener('resize', updateHeight);
|
|
19035
|
+
window.visualViewport.addEventListener('scroll', updateHeight);
|
|
19036
|
+
}
|
|
19037
|
+
// 键盘弹出/收起监听(移动端重要)
|
|
19038
|
+
if ('virtualKeyboard' in navigator) {
|
|
19039
|
+
navigator.virtualKeyboard.addEventListener('geometrychange', updateHeight);
|
|
19040
|
+
}
|
|
19041
|
+
// 定期检查(应对某些特殊情况)
|
|
19042
|
+
const interval = setInterval(updateHeight, 1000);
|
|
19043
|
+
return () => {
|
|
19044
|
+
events.forEach((event) => {
|
|
19045
|
+
window.removeEventListener(event, updateHeight);
|
|
19046
|
+
});
|
|
19047
|
+
if (window.visualViewport) {
|
|
19048
|
+
window.visualViewport.removeEventListener('resize', updateHeight);
|
|
19049
|
+
window.visualViewport.removeEventListener('scroll', updateHeight);
|
|
19050
|
+
}
|
|
19051
|
+
if ('virtualKeyboard' in navigator) {
|
|
19052
|
+
navigator.virtualKeyboard.removeEventListener('geometrychange', updateHeight);
|
|
19053
|
+
}
|
|
19054
|
+
clearInterval(interval);
|
|
19055
|
+
};
|
|
19056
|
+
}, [updateHeight]);
|
|
19057
|
+
return visibleHeight;
|
|
19058
|
+
};
|
|
19059
|
+
|
|
18996
19060
|
/*
|
|
18997
19061
|
* @Author: binruan@chatlabs.com
|
|
18998
19062
|
* @Date: 2024-03-20 10:27:31
|
|
@@ -19021,6 +19085,7 @@ Made in Italy` })));
|
|
|
19021
19085
|
const fbcRef = React.useRef('');
|
|
19022
19086
|
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();
|
|
19023
19087
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
19088
|
+
const visibleHeight = useVisibleHeight();
|
|
19024
19089
|
const isShowFingerTip = React.useMemo(() => {
|
|
19025
19090
|
return data.length > 0 && !loading && (getFeUserState() || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableSwiperTip));
|
|
19026
19091
|
}, [data, loading, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableSwiperTip]);
|
|
@@ -19205,8 +19270,8 @@ Made in Italy` })));
|
|
|
19205
19270
|
return safeAreaBottom;
|
|
19206
19271
|
};
|
|
19207
19272
|
const height = React.useMemo(() => {
|
|
19208
|
-
return
|
|
19209
|
-
}, [minusHeight,
|
|
19273
|
+
return visibleHeight - minusHeight - tagHeight;
|
|
19274
|
+
}, [minusHeight, visibleHeight, tagHeight]);
|
|
19210
19275
|
const visList = React.useMemo(() => {
|
|
19211
19276
|
var _a;
|
|
19212
19277
|
const list = activeIndex === 0 && !waterFallData && !isEditor && !isDiyH5
|