pb-sxp-ui 1.6.3 → 1.6.4

package/dist/pb-ui.js

@@ -9183,11 +9183,11 @@
      * @Author: binruan@chatlabs.com
      * @Date: 2024-03-20 10:27:32
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2024-07-30 11:46:32
+     * @LastEditTime: 2024-10-17 17:05:11
      * @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\Scroll.tsx
      *
      */
-    const Scroll = ({ children, isPadding = true, style, enableSlideActive = false }) => {
+    const Scroll = ({ children, isPadding = true, style, enableSlideActive = false, width }) => {
         const ref = React.useRef();
         const { popupDetailData } = useSxpDataSource();
         React.useEffect(() => {
@@ -9195,7 +9195,7 @@
             if (enableSlideActive)
                 (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo((_b = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.multiCheckIndex) !== null && _b !== void 0 ? _b : 0);
         }, [popupDetailData, enableSlideActive]);
-        return (React.createElement(Swiper, { ref: ref, direction: 'horizontal', slidesPerView: 'auto', freeMode: true, mousewheel: true, modules: [freeMode, Scrollbar, Mousewheel], style: Object.assign({ padding: isPadding ? '0 12px 0 20px' : 0 }, style) }, children));
+        return (React.createElement(Swiper, { ref: ref, direction: 'horizontal', slidesPerView: 'auto', freeMode: true, mousewheel: true, modules: [freeMode, Scrollbar, Mousewheel], style: Object.assign(Object.assign({ padding: isPadding ? '0 12px 0 20px' : 0 }, style), (width && { width })) }, children));
     };
     var Scroll$1 = React.memo(Scroll);
 
@@ -16061,11 +16061,11 @@ Made in Italy` })));
      * @Author: binruan@chatlabs.com
      * @Date: 2024-01-15 19:03:09
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2024-10-11 18:37:55
+     * @LastEditTime: 2024-10-17 17:00:33
      * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Hashtag\index.tsx
      *
      */
-    const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
+    const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle, hashTagRightMargin }) => {
         var _a;
         const [isShowMore, setIsShowMore] = React.useState(false);
         const { setWaterFallData, setOpenHashtag, setCacheActiveIndex, waterFallData, setIsFromHashtag } = useSxpDataSource();
@@ -16098,8 +16098,10 @@ Made in Italy` })));
             }
             return (React.createElement("span", { style: { textDecoration: 'underline', cursor: 'pointer', color: '#fff' }, onClick: () => setIsShowMore(!isShowMore) }, isShowMore ? 'show less' : 'show more'));
         }, [isShowMore, tags]);
-        return (React.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: { marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px` } },
-            React.createElement(Scroll$1, null, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (React.createElement(SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item), tag: 'button', "aria-label": item },
+        return (React.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: {
+                marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px`
+            } },
+            React.createElement(Scroll$1, { width: hashTagRightMargin }, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (React.createElement(SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item), tag: 'button', "aria-label": item },
                 React.createElement("div", { dangerouslySetInnerHTML: { __html: setFontForText(`#${item}`, hashTagStyle) } })))))));
     };
     var Hashtag$1 = React.memo(Hashtag);
@@ -16310,11 +16312,11 @@ Made in Italy` })));
      * @Author: binruan@chatlabs.com
      * @Date: 2024-01-15 19:03:09
      * @LastEditors: binruan@chatlabs.com
-     * @LastEditTime: 2024-10-15 14:37:11
+     * @LastEditTime: 2024-10-17 17:16:42
      * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
      *
      */
-    const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
+    const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], licenseUrl }) => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
         const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
         const unmutedIcon = useIconLink('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png');
@@ -16568,7 +16570,7 @@ Made in Italy` })));
                         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: (_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : '', 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(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
-                            React.createElement(Hashtag$1, { index: activeIndex, tags: (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.hashTags) !== null && _f !== void 0 ? _f : [], itemId: (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.itemId, itemType: ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle }))),
+                            React.createElement(Hashtag$1, { index: activeIndex, tags: (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.hashTags) !== null && _f !== void 0 ? _f : [], itemId: (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.itemId, itemType: ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
                     React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
             }
             return null;
@@ -16818,7 +16820,7 @@ Made in Italy` })));
                     padding: 0,
                     background: 'transparent'
                 }, role: 'button', "aria-label": 'back button', onClick: () => history === null || history === void 0 ? void 0 : history.back() },
-                React.createElement("img", { src: (_s = (_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _r === void 0 ? void 0 : _r.icon) !== null && _s !== void 0 ? _s : img, alt: 'back button', width: 50, style: { objectFit: 'cover' } }))),
+                React.createElement("img", { src: (_s = (_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _r === void 0 ? void 0 : _r.icon) !== null && _s !== void 0 ? _s : img, alt: 'back button', width: 100, style: { objectFit: 'cover' } }))),
             isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _t !== void 0 ? _t : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
             React.createElement(Swiper, { style: {
                     marginTop: tagHeight