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.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: (_a = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _a !== void 0 ? _a : 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 = (_d = (_c = (_b = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _b === void 0 ? void 0 : _b.filter((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 || _c === void 0 ? void 0 : _c.join('&')) !== null && _d !== void 0 ? _d : '';
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 _e, _f;
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((_e = data === null || data === void 0 ? void 0 : data.recList) !== null && _e !== void 0 ? _e : []));
504
- setCacheRtcList(cacheRtcList.concat((_f = data === null || data === void 0 ? void 0 : data.recList) !== null && _f !== void 0 ? _f : []));
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 _g, _h;
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((_h = (_g = result === null || result === void 0 ? void 0 : result.data) === null || _g === void 0 ? void 0 : _g.tags) !== null && _h !== void 0 ? _h : []);
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-29 16:55:16
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 },