pb-sxp-ui 1.0.74 → 1.0.75

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.
Files changed (16) hide show
  1. package/dist/index.cjs +30 -30
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +7 -3
  4. package/dist/index.js +30 -30
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +3 -3
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +3 -3
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +30 -30
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +3 -3
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/SxpPageRender/index.js +29 -29
  15. package/lib/core/components/SxpPageRender/index.js +29 -29
  16. package/package.json +1 -1
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -171,19 +171,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
171
171
  document.removeEventListener('visibilitychange', visibleChange);
172
172
  };
173
173
  }, [activeIndex, bffEventReport, curTime, data, handleH5EnterLink, popupDetailData, isFromHashtag, tempMap]);
174
+ const tagHeight = useMemo(() => {
175
+ let h = 0;
176
+ if (tagList.length > 0) {
177
+ h += 45;
178
+ if (waterFallData) {
179
+ h -= 45;
180
+ }
181
+ }
182
+ return h;
183
+ }, [tagList, waterFallData]);
174
184
  const height = useMemo(() => {
175
185
  let minusHeight = 0;
176
186
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
177
187
  minusHeight += 45;
178
188
  }
179
- if (tagList.length > 0) {
180
- minusHeight += 45;
181
- if (waterFallData) {
182
- minusHeight -= 45;
183
- }
184
- }
185
- return containerHeight - minusHeight;
186
- }, [globalConfig, containerHeight, tagList, waterFallData]);
189
+ return containerHeight - minusHeight - tagHeight;
190
+ }, [globalConfig, containerHeight, tagHeight]);
187
191
  const renderLogo = useMemo(() => {
188
192
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
189
193
  return (React.createElement("div", { className: 'clc-sxp-logo-banner', style: { backgroundColor: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.color } },
@@ -243,10 +247,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
243
247
  ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
244
248
  React.createElement("div", { className: 'clc-sxp-bottom' },
245
249
  React.createElement(Nudge, { nudge: nudge }),
246
- (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)
247
- ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
248
- React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver })))
249
- : null,
250
+ (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
251
+ React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver }))) : null,
250
252
  React.createElement("div", null,
251
253
  React.createElement(ExpandableText, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_c = (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.title) !== null && _c !== void 0 ? _c : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
252
254
  React.createElement(Hashtag, { index: activeIndex, tags: (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.hashTags) !== null && _e !== void 0 ? _e : [], itemId: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.itemId, itemType: ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle })))));
@@ -392,19 +394,17 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
392
394
  React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })));
393
395
  }
394
396
  return visList === null || visList === void 0 ? void 0 : visList.map((rec, index) => {
395
- return (React.createElement(SwiperSlide, { key: index, virtualIndex: index }, rec && (React.createElement(React.Fragment, null, (rec === null || rec === void 0 ? void 0 : rec.loading)
396
- ? (React.createElement("div", { style: {
397
- height,
398
- width: containerWidth,
399
- display: 'flex',
400
- justifyContent: 'center',
401
- alignItems: 'center'
402
- } },
403
- React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })))
404
- : (React.createElement(React.Fragment, null,
405
- renderContent(rec, index),
406
- renderBottom(rec, index),
407
- renderLikeButton(rec, index)))))));
397
+ return (React.createElement(SwiperSlide, { key: index, virtualIndex: index }, rec && (React.createElement(React.Fragment, null, (rec === null || rec === void 0 ? void 0 : rec.loading) ? (React.createElement("div", { style: {
398
+ height,
399
+ width: containerWidth,
400
+ display: 'flex',
401
+ justifyContent: 'center',
402
+ alignItems: 'center'
403
+ } },
404
+ React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (React.createElement(React.Fragment, null,
405
+ renderContent(rec, index),
406
+ renderBottom(rec, index),
407
+ renderLikeButton(rec, index)))))));
408
408
  });
409
409
  }, [containerWidth, data, height, loading, renderBottom, renderContent, visList, loadingImage]);
410
410
  const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
@@ -415,10 +415,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
415
415
  } })),
416
416
  renderLogo,
417
417
  React.createElement(Tagbar, { tagList: tagList, setActiveIndex: setActiveIndex }),
418
- isShowFingerTip
419
- ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 + ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } }))
420
- : null,
421
- React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
418
+ isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 + ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } })) : null,
419
+ React.createElement(Swiper, { style: {
420
+ marginTop: tagHeight
421
+ }, ref: swiperRef, onSlideChange: () => {
422
422
  swiperRef.current.swiper.allowTouchMove = false;
423
423
  setTimeout(() => {
424
424
  swiperRef.current.swiper.allowTouchMove = true;
package/lib/core/components/SxpPageRender/index.js CHANGED
@@ -174,19 +174,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
174
174
  document.removeEventListener('visibilitychange', visibleChange);
175
175
  };
176
176
  }, [activeIndex, bffEventReport, curTime, data, handleH5EnterLink, popupDetailData, isFromHashtag, tempMap]);
177
+ const tagHeight = (0, react_1.useMemo)(() => {
178
+ let h = 0;
179
+ if (tagList.length > 0) {
180
+ h += 45;
181
+ if (waterFallData) {
182
+ h -= 45;
183
+ }
184
+ }
185
+ return h;
186
+ }, [tagList, waterFallData]);
177
187
  const height = (0, react_1.useMemo)(() => {
178
188
  let minusHeight = 0;
179
189
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
180
190
  minusHeight += 45;
181
191
  }
182
- if (tagList.length > 0) {
183
- minusHeight += 45;
184
- if (waterFallData) {
185
- minusHeight -= 45;
186
- }
187
- }
188
- return containerHeight - minusHeight;
189
- }, [globalConfig, containerHeight, tagList, waterFallData]);
192
+ return containerHeight - minusHeight - tagHeight;
193
+ }, [globalConfig, containerHeight, tagHeight]);
190
194
  const renderLogo = (0, react_1.useMemo)(() => {
191
195
  if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
192
196
  return (react_1.default.createElement("div", { className: 'clc-sxp-logo-banner', style: { backgroundColor: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.color } },
@@ -246,10 +250,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
246
250
  ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.title) && !isShowMore && react_1.default.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
247
251
  react_1.default.createElement("div", { className: 'clc-sxp-bottom' },
248
252
  react_1.default.createElement(Nudge_1.default, { nudge: nudge }),
249
- (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)
250
- ? (react_1.default.createElement("div", { className: 'clc-sxp-bottom-card' },
251
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver })))
252
- : null,
253
+ (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) ? (react_1.default.createElement("div", { className: 'clc-sxp-bottom-card' },
254
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver }))) : null,
253
255
  react_1.default.createElement("div", null,
254
256
  react_1.default.createElement(ExpandableText_1.default, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_c = (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.title) !== null && _c !== void 0 ? _c : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
255
257
  react_1.default.createElement(Hashtag_1.default, { index: activeIndex, tags: (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.hashTags) !== null && _e !== void 0 ? _e : [], itemId: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.itemId, itemType: ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle })))));
@@ -395,19 +397,17 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
395
397
  react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })));
396
398
  }
397
399
  return visList === null || visList === void 0 ? void 0 : visList.map((rec, index) => {
398
- return (react_1.default.createElement(react_2.SwiperSlide, { key: index, virtualIndex: index }, rec && (react_1.default.createElement(react_1.default.Fragment, null, (rec === null || rec === void 0 ? void 0 : rec.loading)
399
- ? (react_1.default.createElement("div", { style: {
400
- height,
401
- width: containerWidth,
402
- display: 'flex',
403
- justifyContent: 'center',
404
- alignItems: 'center'
405
- } },
406
- react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })))
407
- : (react_1.default.createElement(react_1.default.Fragment, null,
408
- renderContent(rec, index),
409
- renderBottom(rec, index),
410
- renderLikeButton(rec, index)))))));
400
+ return (react_1.default.createElement(react_2.SwiperSlide, { key: index, virtualIndex: index }, rec && (react_1.default.createElement(react_1.default.Fragment, null, (rec === null || rec === void 0 ? void 0 : rec.loading) ? (react_1.default.createElement("div", { style: {
401
+ height,
402
+ width: containerWidth,
403
+ display: 'flex',
404
+ justifyContent: 'center',
405
+ alignItems: 'center'
406
+ } },
407
+ react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (react_1.default.createElement(react_1.default.Fragment, null,
408
+ renderContent(rec, index),
409
+ renderBottom(rec, index),
410
+ renderLikeButton(rec, index)))))));
411
411
  });
412
412
  }, [containerWidth, data, height, loading, renderBottom, renderContent, visList, loadingImage]);
413
413
  const mutedIcon = (0, useIconLink_1.useIconLink)('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
@@ -418,10 +418,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
418
418
  } })),
419
419
  renderLogo,
420
420
  react_1.default.createElement(Tagbar_1.default, { tagList: tagList, setActiveIndex: setActiveIndex }),
421
- isShowFingerTip
422
- ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 + ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } }))
423
- : null,
424
- react_1.default.createElement(react_2.Swiper, { ref: swiperRef, onSlideChange: () => {
421
+ isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 + ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } })) : null,
422
+ react_1.default.createElement(react_2.Swiper, { style: {
423
+ marginTop: tagHeight
424
+ }, ref: swiperRef, onSlideChange: () => {
425
425
  swiperRef.current.swiper.allowTouchMove = false;
426
426
  setTimeout(() => {
427
427
  swiperRef.current.swiper.allowTouchMove = true;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.0.74",
3
+ "version": "1.0.75",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",