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/pb-ui.js
CHANGED
@@ -480,20 +480,20 @@
|
|
480
480
|
}, [bffDataSource]);
|
481
481
|
// 获取推荐视频数据
|
482
482
|
const getRecommendVideos = React.useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
483
|
-
var _a, _b, _c, _d;
|
483
|
+
var _a, _b, _c, _d, _e;
|
484
484
|
query = {
|
485
|
-
maxSize,
|
486
|
-
defaultSize: (
|
485
|
+
maxSize: (_a = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _a !== void 0 ? _a : maxSize,
|
486
|
+
defaultSize: (_b = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _b !== void 0 ? _b : defaultSize,
|
487
487
|
'itemFilter.itemId': query === null || query === void 0 ? void 0 : query['itemFilter.itemId'],
|
488
488
|
'itemFilter.itemType': query === null || query === void 0 ? void 0 : query['itemFilter.itemType'],
|
489
489
|
hashTag: query === null || query === void 0 ? void 0 : query.hashTag,
|
490
490
|
traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo
|
491
491
|
};
|
492
492
|
if (utmVal) {
|
493
|
-
const val = (
|
493
|
+
const val = (_e = (_d = (_c = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _c === void 0 ? void 0 : _c.filter((val) => {
|
494
494
|
const key = val.split('=')[0];
|
495
495
|
return UTM_KEYS.includes(key);
|
496
|
-
})) === null ||
|
496
|
+
})) === null || _d === void 0 ? void 0 : _d.join('&')) !== null && _e !== void 0 ? _e : '';
|
497
497
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
498
498
|
}
|
499
499
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'GET', query }));
|
@@ -505,7 +505,7 @@
|
|
505
505
|
return result === null || result === void 0 ? void 0 : result.data;
|
506
506
|
}), [bffFetch, utmVal, maxSize, defaultSize]);
|
507
507
|
const loadVideos = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
508
|
-
var
|
508
|
+
var _f, _g;
|
509
509
|
if (rtcList.length <= 0) {
|
510
510
|
return;
|
511
511
|
}
|
@@ -514,8 +514,8 @@
|
|
514
514
|
'itemFilter.itemId': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemId,
|
515
515
|
'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType
|
516
516
|
});
|
517
|
-
setRtcList(rtcList.concat((
|
518
|
-
setCacheRtcList(cacheRtcList.concat((
|
517
|
+
setRtcList(rtcList.concat((_f = data === null || data === void 0 ? void 0 : data.recList) !== null && _f !== void 0 ? _f : []));
|
518
|
+
setCacheRtcList(cacheRtcList.concat((_g = data === null || data === void 0 ? void 0 : data.recList) !== null && _g !== void 0 ? _g : []));
|
519
519
|
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
520
520
|
const bffEventReport = React.useCallback(({ userInfo, eventInfo }) => {
|
521
521
|
// 关闭 BFF 事件上报
|
@@ -559,12 +559,12 @@
|
|
559
559
|
}), [bffFetch]);
|
560
560
|
// 获取 Tag
|
561
561
|
const bffGetTagList = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
562
|
-
var
|
562
|
+
var _h, _j;
|
563
563
|
if (!utmVal)
|
564
564
|
return;
|
565
565
|
try {
|
566
566
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: utmVal } }));
|
567
|
-
setTagList((
|
567
|
+
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 : []);
|
568
568
|
}
|
569
569
|
catch (e) {
|
570
570
|
console.log('e', e);
|
@@ -11721,7 +11721,8 @@ Made in Italy` })));
|
|
11721
11721
|
hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
|
11722
11722
|
'itemFilter.itemId': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemId,
|
11723
11723
|
'itemFilter.itemType': waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.itemType,
|
11724
|
-
defaultSize: hashTagSize
|
11724
|
+
defaultSize: hashTagSize,
|
11725
|
+
maxSize: hashTagSize
|
11725
11726
|
}).then((res) => {
|
11726
11727
|
var _a, _b;
|
11727
11728
|
setData(res);
|
@@ -12132,12 +12133,13 @@ Made in Italy` })));
|
|
12132
12133
|
}, [bffEventReport, data, index, isFirstPlay, videoRef]);
|
12133
12134
|
const handLoadeddata = React.useCallback(() => {
|
12134
12135
|
var _a;
|
12135
|
-
if (!videoRef || isBgColor || firstFrameSrc)
|
12136
|
+
if (!videoRef || isBgColor || firstFrameSrc || !blur)
|
12136
12137
|
return;
|
12137
12138
|
const videoDomRef = document.getElementById('player-container-id_html5_api');
|
12138
12139
|
if (((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.cover) || !canvasRef || !videoDomRef || !canvasRef.current)
|
12139
12140
|
return;
|
12140
12141
|
const setFrameImg = () => {
|
12142
|
+
videoDomRef.style.objectFit = 'contain';
|
12141
12143
|
const video = videoDomRef;
|
12142
12144
|
const canvas = canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current;
|
12143
12145
|
const ctx = canvas.getContext('2d');
|
@@ -12152,7 +12154,7 @@ Made in Italy` })));
|
|
12152
12154
|
setTimeout(() => {
|
12153
12155
|
setFrameImg();
|
12154
12156
|
}, 500);
|
12155
|
-
}, [videoRef, isBgColor, rec, firstFrameSrc]);
|
12157
|
+
}, [videoRef, isBgColor, rec, firstFrameSrc, blur]);
|
12156
12158
|
const handleLoadedmetadata = React.useCallback(() => {
|
12157
12159
|
if (!videoRef)
|
12158
12160
|
return;
|
@@ -12645,47 +12647,11 @@ Made in Italy` })));
|
|
12645
12647
|
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 : '')))));
|
12646
12648
|
};
|
12647
12649
|
|
12648
|
-
const DEFAULT_TAG = 'FOR U';
|
12649
|
-
const Tagbar = ({ tagList = [], setActiveIndex }) => {
|
12650
|
-
const [selectTag, setSelectTag] = React.useState(DEFAULT_TAG);
|
12651
|
-
const { getRecommendVideos, setRtcList, setCacheRtcList, setCacheActiveIndex, setLoading, swiperRef } = useSxpDataSource();
|
12652
|
-
const realTagList = React.useMemo(() => {
|
12653
|
-
return [DEFAULT_TAG, ...tagList];
|
12654
|
-
}, [tagList]);
|
12655
|
-
const handleSelectTag = (tag) => () => {
|
12656
|
-
if (tag === selectTag)
|
12657
|
-
return;
|
12658
|
-
let hashTag;
|
12659
|
-
if (tag !== DEFAULT_TAG) {
|
12660
|
-
hashTag = tag;
|
12661
|
-
}
|
12662
|
-
setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
|
12663
|
-
getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ hashTag }).then((res) => {
|
12664
|
-
var _a, _b, _c, _d;
|
12665
|
-
setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []);
|
12666
|
-
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList((_b = res === null || res === void 0 ? void 0 : res.recList) !== null && _b !== void 0 ? _b : []);
|
12667
|
-
setActiveIndex === null || setActiveIndex === void 0 ? void 0 : setActiveIndex(0);
|
12668
|
-
setCacheActiveIndex === null || setCacheActiveIndex === void 0 ? void 0 : setCacheActiveIndex(0);
|
12669
|
-
(_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);
|
12670
|
-
}).finally(() => {
|
12671
|
-
setLoading === null || setLoading === void 0 ? void 0 : setLoading(false);
|
12672
|
-
});
|
12673
|
-
setSelectTag(tag);
|
12674
|
-
};
|
12675
|
-
if (tagList.length <= 0)
|
12676
|
-
return null;
|
12677
|
-
return (React.createElement("div", { className: 'clc-sxp-tagbar' },
|
12678
|
-
React.createElement("ul", { className: 'clc-sxp-tagbar-list', style: { margin: 'auto', gap: 24 } }, realTagList.map((tag) => {
|
12679
|
-
return (React.createElement("li", { className: `clc-sxp-tagbar-list-item ${tag === selectTag ? 'clc-sxp-tagbar-list-item-active' : ''}`, key: tag, onClick: handleSelectTag(tag) }, tag));
|
12680
|
-
}))));
|
12681
|
-
};
|
12682
|
-
var Tagbar$1 = React.memo(Tagbar);
|
12683
|
-
|
12684
12650
|
/*
|
12685
12651
|
* @Author: binruan@chatlabs.com
|
12686
12652
|
* @Date: 2024-01-15 19:03:09
|
12687
12653
|
* @LastEditors: binruan@chatlabs.com
|
12688
|
-
* @LastEditTime: 2024-04-
|
12654
|
+
* @LastEditTime: 2024-04-30 15:43:40
|
12689
12655
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12690
12656
|
*
|
12691
12657
|
*/
|
@@ -13085,7 +13051,6 @@ Made in Italy` })));
|
|
13085
13051
|
setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
|
13086
13052
|
} })),
|
13087
13053
|
renderLogo,
|
13088
|
-
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
|
13089
13054
|
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
13090
13055
|
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
13091
13056
|
swiperRef.current.swiper.allowTouchMove = false;
|
@@ -13146,6 +13111,42 @@ Made in Italy` })));
|
|
13146
13111
|
React.createElement("div", { id: 'player-container-id-copy' }))));
|
13147
13112
|
};
|
13148
13113
|
|
13114
|
+
const DEFAULT_TAG = 'FOR U';
|
13115
|
+
const Tagbar = ({ tagList = [], setActiveIndex }) => {
|
13116
|
+
const [selectTag, setSelectTag] = React.useState(DEFAULT_TAG);
|
13117
|
+
const { getRecommendVideos, setRtcList, setCacheRtcList, setCacheActiveIndex, setLoading, swiperRef } = useSxpDataSource();
|
13118
|
+
const realTagList = React.useMemo(() => {
|
13119
|
+
return [DEFAULT_TAG, ...tagList];
|
13120
|
+
}, [tagList]);
|
13121
|
+
const handleSelectTag = (tag) => () => {
|
13122
|
+
if (tag === selectTag)
|
13123
|
+
return;
|
13124
|
+
let hashTag;
|
13125
|
+
if (tag !== DEFAULT_TAG) {
|
13126
|
+
hashTag = tag;
|
13127
|
+
}
|
13128
|
+
setLoading === null || setLoading === void 0 ? void 0 : setLoading(true);
|
13129
|
+
getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({ hashTag }).then((res) => {
|
13130
|
+
var _a, _b, _c, _d;
|
13131
|
+
setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []);
|
13132
|
+
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList((_b = res === null || res === void 0 ? void 0 : res.recList) !== null && _b !== void 0 ? _b : []);
|
13133
|
+
setActiveIndex === null || setActiveIndex === void 0 ? void 0 : setActiveIndex(0);
|
13134
|
+
setCacheActiveIndex === null || setCacheActiveIndex === void 0 ? void 0 : setCacheActiveIndex(0);
|
13135
|
+
(_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);
|
13136
|
+
}).finally(() => {
|
13137
|
+
setLoading === null || setLoading === void 0 ? void 0 : setLoading(false);
|
13138
|
+
});
|
13139
|
+
setSelectTag(tag);
|
13140
|
+
};
|
13141
|
+
if (tagList.length <= 0)
|
13142
|
+
return null;
|
13143
|
+
return (React.createElement("div", { className: 'clc-sxp-tagbar' },
|
13144
|
+
React.createElement("ul", { className: 'clc-sxp-tagbar-list', style: { margin: 'auto', gap: 24 } }, realTagList.map((tag) => {
|
13145
|
+
return (React.createElement("li", { className: `clc-sxp-tagbar-list-item ${tag === selectTag ? 'clc-sxp-tagbar-list-item-active' : ''}`, key: tag, onClick: handleSelectTag(tag) }, tag));
|
13146
|
+
}))));
|
13147
|
+
};
|
13148
|
+
var Tagbar$1 = React.memo(Tagbar);
|
13149
|
+
|
13149
13150
|
const PictureGroup = ({ imgUrls, width, height, imgUrlsPostConfig, rec, index }) => {
|
13150
13151
|
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) => {
|
13151
13152
|
return (React.createElement(SwiperSlide, { key: url },
|