pb-sxp-ui 1.0.48 → 1.0.49
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 +52 -51
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +52 -51
- 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 +52 -51
- 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 +3 -2
- package/es/core/components/SxpPageRender/WaterFall/List.js +2 -1
- package/es/core/components/SxpPageRender/index.js +0 -2
- package/es/core/context/SxpDataSourceProvider.js +10 -10
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +3 -2
- package/lib/core/components/SxpPageRender/WaterFall/List.js +2 -1
- package/lib/core/components/SxpPageRender/index.js +0 -2
- 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,12 +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 || isBgColor || firstFrameSrc)
|
12122
|
+
if (!videoRef || isBgColor || firstFrameSrc || !blur)
|
12122
12123
|
return;
|
12123
12124
|
const videoDomRef = document.getElementById('player-container-id_html5_api');
|
12124
12125
|
if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !videoDomRef || !canvasRef.current)
|
12125
12126
|
return;
|
12126
12127
|
const setFrameImg = () => {
|
12128
|
+
videoDomRef.style.objectFit = 'contain';
|
12127
12129
|
const video = videoDomRef;
|
12128
12130
|
const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
|
12129
12131
|
const ctx = canvas.getContext('2d');
|
@@ -12138,7 +12140,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12138
12140
|
setTimeout(() => {
|
12139
12141
|
setFrameImg();
|
12140
12142
|
}, 500);
|
12141
|
-
}, [videoRef, isBgColor, rec, firstFrameSrc]);
|
12143
|
+
}, [videoRef, isBgColor, rec, firstFrameSrc, blur]);
|
12142
12144
|
const handleLoadedmetadata = useCallback(() => {
|
12143
12145
|
if (!videoRef)
|
12144
12146
|
return;
|
@@ -12631,47 +12633,11 @@ const Nudge = ({ nudge }) => {
|
|
12631
12633
|
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
12634
|
};
|
12633
12635
|
|
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
12636
|
/*
|
12671
12637
|
* @Author: binruan@chatlabs.com
|
12672
12638
|
* @Date: 2024-01-15 19:03:09
|
12673
12639
|
* @LastEditors: binruan@chatlabs.com
|
12674
|
-
* @LastEditTime: 2024-04-
|
12640
|
+
* @LastEditTime: 2024-04-30 15:43:40
|
12675
12641
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12676
12642
|
*
|
12677
12643
|
*/
|
@@ -13071,7 +13037,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13071
13037
|
setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
|
13072
13038
|
} })),
|
13073
13039
|
renderLogo,
|
13074
|
-
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
|
13075
13040
|
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
13076
13041
|
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
13077
13042
|
swiperRef.current.swiper.allowTouchMove = false;
|
@@ -13132,6 +13097,42 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13132
13097
|
React.createElement("div", { id: 'player-container-id-copy' }))));
|
13133
13098
|
};
|
13134
13099
|
|
13100
|
+
const DEFAULT_TAG = 'FOR U';
|
13101
|
+
const Tagbar = ({ tagList = [], setActiveIndex }) => {
|
13102
|
+
const [selectTag, setSelectTag] = useState(DEFAULT_TAG);
|
13103
|
+
const { getRecommendVideos, setRtcList, setCacheRtcList, setCacheActiveIndex, setLoading, swiperRef } = useSxpDataSource();
|
13104
|
+
const realTagList = useMemo(() => {
|
13105
|
+
return [DEFAULT_TAG, ...tagList];
|
13106
|
+
}, [tagList]);
|
13107
|
+
const handleSelectTag = (tag) => () => {
|
13108
|
+
if (tag === selectTag)
|
13109
|
+
return;
|
13110
|
+
let hashTag;
|
13111
|
+
if (tag !== DEFAULT_TAG) {
|
13112
|
+
hashTag = tag;
|
13113
|
+
}
|
13114
|
+
setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
|
13115
|
+
getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ hashTag }).then((res) => {
|
13116
|
+
var _a, _b, _c, _d;
|
13117
|
+
setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []);
|
13118
|
+
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList((_b = res === null || res === void 0 ? void 0 : res.recList) !== null && _b !== void 0 ? _b : []);
|
13119
|
+
setActiveIndex === null || setActiveIndex === void 0 ? void 0 : setActiveIndex(0);
|
13120
|
+
setCacheActiveIndex === null || setCacheActiveIndex === void 0 ? void 0 : setCacheActiveIndex(0);
|
13121
|
+
(_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);
|
13122
|
+
}).finally(() => {
|
13123
|
+
setLoading === null || setLoading === void 0 ? void 0 : setLoading(false);
|
13124
|
+
});
|
13125
|
+
setSelectTag(tag);
|
13126
|
+
};
|
13127
|
+
if (tagList.length <= 0)
|
13128
|
+
return null;
|
13129
|
+
return (React.createElement("div", { className: 'clc-sxp-tagbar' },
|
13130
|
+
React.createElement("ul", { className: 'clc-sxp-tagbar-list', style: { margin: 'auto', gap: 24 } }, realTagList.map((tag) => {
|
13131
|
+
return (React.createElement("li", { className: `clc-sxp-tagbar-list-item ${tag === selectTag ? 'clc-sxp-tagbar-list-item-active' : ''}`, key: tag, onClick: handleSelectTag(tag) }, tag));
|
13132
|
+
}))));
|
13133
|
+
};
|
13134
|
+
var Tagbar$1 = memo(Tagbar);
|
13135
|
+
|
13135
13136
|
const PictureGroup = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index }) => {
|
13136
13137
|
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
13138
|
return (React.createElement(SwiperSlide, { key: url },
|