pb-sxp-ui 1.0.74 → 1.0.76

package/dist/index.css

@@ -1306,16 +1306,19 @@ button.swiper-pagination-bullet {
 .clc-sxp-tagbar {
   z-index: 8;
   background-color: #fff;
-  overflow-x: auto;
   text-align: center;
   height: 45px;
+  overflow-x: auto;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  scrollbar-width: none;
 }
 .clc-sxp-tagbar-list {
-  scrollbar-width: none;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
-  overflow-y: auto;
   padding: 0 12px;
   margin: 0;
   display: -webkit-box;
@@ -1336,6 +1339,7 @@ button.swiper-pagination-bullet {
   cursor: pointer;
   font-size: 14px;
   text-wrap: nowrap;
+  white-space: nowrap;
 }
 .clc-sxp-tagbar-list-item-active {
   position: relative;

package/dist/index.js

@@ -12944,7 +12944,7 @@ var Tagbar$1 = memo(Tagbar);
  * @Author: binruan@chatlabs.com
  * @Date: 2024-01-15 19:03:09
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-05-29 17:41:35
+ * @LastEditTime: 2024-05-30 11:35:35
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
  *
  */
@@ -13122,19 +13122,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
             document.removeEventListener('visibilitychange', visibleChange);
         };
     }, [activeIndex, bffEventReport, curTime, data, handleH5EnterLink, popupDetailData, isFromHashtag, tempMap]);
+    const tagHeight = useMemo(() => {
+        let h = 0;
+        if (tagList.length > 0) {
+            h += 45;
+            if (waterFallData) {
+                h -= 45;
+            }
+        }
+        return h;
+    }, [tagList, waterFallData]);
     const height = useMemo(() => {
         let minusHeight = 0;
         if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
             minusHeight += 45;
         }
-        if (tagList.length > 0) {
-            minusHeight += 45;
-            if (waterFallData) {
-                minusHeight -= 45;
-            }
-        }
-        return containerHeight - minusHeight;
-    }, [globalConfig, containerHeight, tagList, waterFallData]);
+        return containerHeight - minusHeight - tagHeight;
+    }, [globalConfig, containerHeight, tagHeight]);
     const renderLogo = useMemo(() => {
         if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoUrl) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLogo)) {
             return (React.createElement("div", { className: 'clc-sxp-logo-banner', style: { backgroundColor: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.color } },
@@ -13194,10 +13198,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
                 ((_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' }),
                 React.createElement("div", { className: 'clc-sxp-bottom' },
                     React.createElement(Nudge, { nudge: nudge }),
-                    (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' },
-                            React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver })))
-                        : null,
+                    (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' },
+                        React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver }))) : null,
                     React.createElement("div", null,
                         React.createElement(ExpandableText$1, { 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 }),
                         React.createElement(Hashtag$1, { 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 })))));
@@ -13347,19 +13349,17 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
                 React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })));
         }
         return visList === null || visList === void 0 ? void 0 : visList.map((rec, index) => {
-            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: {
-                        height,
-                        width: containerWidth,
-                        display: 'flex',
-                        justifyContent: 'center',
-                        alignItems: 'center'
-                    } },
-                    React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } })))
-                : (React.createElement(React.Fragment, null,
-                    renderContent(rec, index),
-                    renderBottom(rec, index),
-                    renderLikeButton(rec, index)))))));
+            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: {
+                    height,
+                    width: containerWidth,
+                    display: 'flex',
+                    justifyContent: 'center',
+                    alignItems: 'center'
+                } },
+                React.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (React.createElement(React.Fragment, null,
+                renderContent(rec, index),
+                renderBottom(rec, index),
+                renderLikeButton(rec, index)))))));
         });
     }, [containerWidth, data, height, loading, renderBottom, renderContent, visList, loadingImage]);
     const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
@@ -13370,10 +13370,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
             } })),
         renderLogo,
         React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
-        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,
-        React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
+        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,
+        React.createElement(Swiper, { style: {
+                marginTop: tagHeight
+            }, ref: swiperRef, onSlideChange: () => {
                 swiperRef.current.swiper.allowTouchMove = false;
                 setTimeout(() => {
                     swiperRef.current.swiper.allowTouchMove = true;