pb-sxp-ui 1.0.48 → 1.0.50
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 +58 -55
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +58 -55
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +58 -55
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/VideoWidget/index.js +6 -3
- package/es/core/components/SxpPageRender/WaterFall/List.js +2 -1
- package/es/core/components/SxpPageRender/index.js +0 -5
- package/es/core/context/SxpDataSourceProvider.js +10 -10
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +6 -3
- package/lib/core/components/SxpPageRender/WaterFall/List.js +2 -1
- package/lib/core/components/SxpPageRender/index.js +0 -5
- package/lib/core/context/SxpDataSourceProvider.js +10 -10
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -466,20 +466,20 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
466
466
|
}, [bffDataSource]);
|
467
467
|
// 获取推荐视频数据
|
468
468
|
const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
469
|
-
var _a, _b, _c, _d;
|
469
|
+
var _a, _b, _c, _d, _e;
|
470
470
|
query = {
|
471
|
-
maxSize,
|
472
|
-
defaultSize: (
|
471
|
+
maxSize: (_a = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _a !== void 0 ? _a : maxSize,
|
472
|
+
defaultSize: (_b = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _b !== void 0 ? _b : defaultSize,
|
473
473
|
'itemFilter.itemId': query === null || query === void 0 ? void 0 : query['itemFilter.itemId'],
|
474
474
|
'itemFilter.itemType': query === null || query === void 0 ? void 0 : query['itemFilter.itemType'],
|
475
475
|
hashTag: query === null || query === void 0 ? void 0 : query.hashTag,
|
476
476
|
traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo
|
477
477
|
};
|
478
478
|
if (utmVal) {
|
479
|
-
const val = (
|
479
|
+
const val = (_e = (_d = (_c = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _c === void 0 ? void 0 : _c.filter((val) => {
|
480
480
|
const key = val.split('=')[0];
|
481
481
|
return UTM_KEYS.includes(key);
|
482
|
-
})) === null ||
|
482
|
+
})) === null || _d === void 0 ? void 0 : _d.join('&')) !== null && _e !== void 0 ? _e : '';
|
483
483
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
484
484
|
}
|
485
485
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'GET', query }));
|
@@ -491,7 +491,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
491
491
|
return result === null || result === void 0 ? void 0 : result.data;
|
492
492
|
}), [bffFetch, utmVal, maxSize, defaultSize]);
|
493
493
|
const loadVideos = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
494
|
-
var
|
494
|
+
var _f, _g;
|
495
495
|
if (rtcList.length <= 0) {
|
496
496
|
return;
|
497
497
|
}
|
@@ -500,8 +500,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
500
500
|
'itemFilter.itemId': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemId,
|
501
501
|
'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType
|
502
502
|
});
|
503
|
-
setRtcList(rtcList.concat((
|
504
|
-
setCacheRtcList(cacheRtcList.concat((
|
503
|
+
setRtcList(rtcList.concat((_f = data === null || data === void 0 ? void 0 : data.recList) !== null && _f !== void 0 ? _f : []));
|
504
|
+
setCacheRtcList(cacheRtcList.concat((_g = data === null || data === void 0 ? void 0 : data.recList) !== null && _g !== void 0 ? _g : []));
|
505
505
|
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
506
506
|
const bffEventReport = useCallback(({ userInfo, eventInfo }) => {
|
507
507
|
// 关闭 BFF 事件上报
|
@@ -545,12 +545,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
545
545
|
}), [bffFetch]);
|
546
546
|
// 获取 Tag
|
547
547
|
const bffGetTagList = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
548
|
-
var
|
548
|
+
var _h, _j;
|
549
549
|
if (!utmVal)
|
550
550
|
return;
|
551
551
|
try {
|
552
552
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: utmVal } }));
|
553
|
-
setTagList((
|
553
|
+
setTagList((_j = (_h = result === null || result === void 0 ? void 0 : result.data) === null || _h === void 0 ? void 0 : _h.tags) !== null && _j !== void 0 ? _j : []);
|
554
554
|
}
|
555
555
|
catch (e) {
|
556
556
|
console.log('e', e);
|
@@ -11707,7 +11707,8 @@ function WaterfallList(_a) {
|
|
11707
11707
|
hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
|
11708
11708
|
'itemFilter.itemId': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemId,
|
11709
11709
|
'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType,
|
11710
|
-
defaultSize: hashTagSize
|
11710
|
+
defaultSize: hashTagSize,
|
11711
|
+
maxSize: hashTagSize
|
11711
11712
|
}).then((res) => {
|
11712
11713
|
var _a, _b;
|
11713
11714
|
setData(res);
|
@@ -12118,10 +12119,13 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12118
12119
|
}, [bffEventReport, data, index, isFirstPlay, videoRef]);
|
12119
12120
|
const handLoadeddata = useCallback(() => {
|
12120
12121
|
var _a;
|
12121
|
-
if (!videoRef ||
|
12122
|
+
if (!videoRef || firstFrameSrc || !blur)
|
12122
12123
|
return;
|
12123
12124
|
const videoDomRef = document.getElementById('player-container-id_html5_api');
|
12124
|
-
if (
|
12125
|
+
if (!videoDomRef)
|
12126
|
+
return;
|
12127
|
+
videoDomRef.style.objectFit = 'contain';
|
12128
|
+
if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !canvasRef.current || isBgColor)
|
12125
12129
|
return;
|
12126
12130
|
const setFrameImg = () => {
|
12127
12131
|
const video = videoDomRef;
|
@@ -12138,7 +12142,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12138
12142
|
setTimeout(() => {
|
12139
12143
|
setFrameImg();
|
12140
12144
|
}, 500);
|
12141
|
-
}, [videoRef, isBgColor, rec, firstFrameSrc]);
|
12145
|
+
}, [videoRef, isBgColor, rec, firstFrameSrc, blur]);
|
12142
12146
|
const handleLoadedmetadata = useCallback(() => {
|
12143
12147
|
if (!videoRef)
|
12144
12148
|
return;
|
@@ -12631,47 +12635,11 @@ const Nudge = ({ nudge }) => {
|
|
12631
12635
|
React.createElement("p", { style: Object.assign({}, nudge === null || nudge === void 0 ? void 0 : nudge.textStyle) }, (_g = nudge === null || nudge === void 0 ? void 0 : nudge.content) !== null && _g !== void 0 ? _g : '')))));
|
12632
12636
|
};
|
12633
12637
|
|
12634
|
-
const DEFAULT_TAG = 'FOR U';
|
12635
|
-
const Tagbar = ({ tagList = [], setActiveIndex }) => {
|
12636
|
-
const [selectTag, setSelectTag] = useState(DEFAULT_TAG);
|
12637
|
-
const { getRecommendVideos, setRtcList, setCacheRtcList, setCacheActiveIndex, setLoading, swiperRef } = useSxpDataSource();
|
12638
|
-
const realTagList = useMemo(() => {
|
12639
|
-
return [DEFAULT_TAG, ...tagList];
|
12640
|
-
}, [tagList]);
|
12641
|
-
const handleSelectTag = (tag) => () => {
|
12642
|
-
if (tag === selectTag)
|
12643
|
-
return;
|
12644
|
-
let hashTag;
|
12645
|
-
if (tag !== DEFAULT_TAG) {
|
12646
|
-
hashTag = tag;
|
12647
|
-
}
|
12648
|
-
setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
|
12649
|
-
getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ hashTag }).then((res) => {
|
12650
|
-
var _a, _b, _c, _d;
|
12651
|
-
setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []);
|
12652
|
-
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList((_b = res === null || res === void 0 ? void 0 : res.recList) !== null && _b !== void 0 ? _b : []);
|
12653
|
-
setActiveIndex === null || setActiveIndex === void 0 ? void 0 : setActiveIndex(0);
|
12654
|
-
setCacheActiveIndex === null || setCacheActiveIndex === void 0 ? void 0 : setCacheActiveIndex(0);
|
12655
|
-
(_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.slideTo(0);
|
12656
|
-
}).finally(() => {
|
12657
|
-
setLoading === null || setLoading === void 0 ? void 0 : setLoading(false);
|
12658
|
-
});
|
12659
|
-
setSelectTag(tag);
|
12660
|
-
};
|
12661
|
-
if (tagList.length <= 0)
|
12662
|
-
return null;
|
12663
|
-
return (React.createElement("div", { className: 'clc-sxp-tagbar' },
|
12664
|
-
React.createElement("ul", { className: 'clc-sxp-tagbar-list', style: { margin: 'auto', gap: 24 } }, realTagList.map((tag) => {
|
12665
|
-
return (React.createElement("li", { className: `clc-sxp-tagbar-list-item ${tag === selectTag ? 'clc-sxp-tagbar-list-item-active' : ''}`, key: tag, onClick: handleSelectTag(tag) }, tag));
|
12666
|
-
}))));
|
12667
|
-
};
|
12668
|
-
var Tagbar$1 = memo(Tagbar);
|
12669
|
-
|
12670
12638
|
/*
|
12671
12639
|
* @Author: binruan@chatlabs.com
|
12672
12640
|
* @Date: 2024-01-15 19:03:09
|
12673
12641
|
* @LastEditors: binruan@chatlabs.com
|
12674
|
-
* @LastEditTime: 2024-04-
|
12642
|
+
* @LastEditTime: 2024-04-30 16:16:05
|
12675
12643
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12676
12644
|
*
|
12677
12645
|
*/
|
@@ -12845,9 +12813,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
12845
12813
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
|
12846
12814
|
minusHeight += 45;
|
12847
12815
|
}
|
12848
|
-
if (tagList.length > 0) {
|
12849
|
-
|
12850
|
-
}
|
12816
|
+
// if (tagList.length > 0) {
|
12817
|
+
// minusHeight += 45;
|
12818
|
+
// }
|
12851
12819
|
return containerHeight - minusHeight;
|
12852
12820
|
}, [globalConfig, containerHeight, tagList]);
|
12853
12821
|
const renderLogo = useMemo(() => {
|
@@ -13071,7 +13039,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13071
13039
|
setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
|
13072
13040
|
} })),
|
13073
13041
|
renderLogo,
|
13074
|
-
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
|
13075
13042
|
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
13076
13043
|
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
13077
13044
|
swiperRef.current.swiper.allowTouchMove = false;
|
@@ -13132,6 +13099,42 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13132
13099
|
React.createElement("div", { id: 'player-container-id-copy' }))));
|
13133
13100
|
};
|
13134
13101
|
|
13102
|
+
const DEFAULT_TAG = 'FOR U';
|
13103
|
+
const Tagbar = ({ tagList = [], setActiveIndex }) => {
|
13104
|
+
const [selectTag, setSelectTag] = useState(DEFAULT_TAG);
|
13105
|
+
const { getRecommendVideos, setRtcList, setCacheRtcList, setCacheActiveIndex, setLoading, swiperRef } = useSxpDataSource();
|
13106
|
+
const realTagList = useMemo(() => {
|
13107
|
+
return [DEFAULT_TAG, ...tagList];
|
13108
|
+
}, [tagList]);
|
13109
|
+
const handleSelectTag = (tag) => () => {
|
13110
|
+
if (tag === selectTag)
|
13111
|
+
return;
|
13112
|
+
let hashTag;
|
13113
|
+
if (tag !== DEFAULT_TAG) {
|
13114
|
+
hashTag = tag;
|
13115
|
+
}
|
13116
|
+
setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
|
13117
|
+
getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ hashTag }).then((res) => {
|
13118
|
+
var _a, _b, _c, _d;
|
13119
|
+
setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []);
|
13120
|
+
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList((_b = res === null || res === void 0 ? void 0 : res.recList) !== null && _b !== void 0 ? _b : []);
|
13121
|
+
setActiveIndex === null || setActiveIndex === void 0 ? void 0 : setActiveIndex(0);
|
13122
|
+
setCacheActiveIndex === null || setCacheActiveIndex === void 0 ? void 0 : setCacheActiveIndex(0);
|
13123
|
+
(_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.slideTo(0);
|
13124
|
+
}).finally(() => {
|
13125
|
+
setLoading === null || setLoading === void 0 ? void 0 : setLoading(false);
|
13126
|
+
});
|
13127
|
+
setSelectTag(tag);
|
13128
|
+
};
|
13129
|
+
if (tagList.length <= 0)
|
13130
|
+
return null;
|
13131
|
+
return (React.createElement("div", { className: 'clc-sxp-tagbar' },
|
13132
|
+
React.createElement("ul", { className: 'clc-sxp-tagbar-list', style: { margin: 'auto', gap: 24 } }, realTagList.map((tag) => {
|
13133
|
+
return (React.createElement("li", { className: `clc-sxp-tagbar-list-item ${tag === selectTag ? 'clc-sxp-tagbar-list-item-active' : ''}`, key: tag, onClick: handleSelectTag(tag) }, tag));
|
13134
|
+
}))));
|
13135
|
+
};
|
13136
|
+
var Tagbar$1 = memo(Tagbar);
|
13137
|
+
|
13135
13138
|
const PictureGroup = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index }) => {
|
13136
13139
|
return (React.createElement(Swiper, { defaultValue: 0, direction: 'horizontal', modules: [Pagination, Autoplay], pagination: { clickable: true, bulletActiveClass: 'swipe-item-active-bullet' }, height: height, style: { width }, loop: true, autoplay: false }, imgUrls === null || imgUrls === void 0 ? void 0 : imgUrls.map((url) => {
|
13137
13140
|
return (React.createElement(SwiperSlide, { key: url },
|