pb-sxp-ui 1.2.2 → 1.2.4

package/dist/index.css

@@ -1,5 +1,6 @@
 .pb-appoint-form {
   position: relative;
+  height: 100%;
 }
 .pb-appoint-form-loading {
   font-size: 24px;
@@ -660,6 +661,20 @@
 .commondityDiroNew-swiper-clickable-center {
   bottom: 14px !important;
 }
+.one-line-ellipsis {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-break: break-all;
+  white-space: nowrap;
+}
+.two-line-ellipsis {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-wrap: break-word;
+}
 
 .index-module_tow-line-ellipsis__3bKKx {
   display: -webkit-box;
@@ -1088,6 +1103,20 @@
   -webkit-animation-fill-mode: forwards;
           animation-fill-mode: forwards;
 }
+.index-module_one-line-ellipsis__HutE0 {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-break: break-all;
+  white-space: nowrap;
+}
+.index-module_two-line-ellipsis__c8gRJ {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-wrap: break-word;
+}
 
 @-webkit-keyframes index-module_fadeIn__2E-dk {
   0% {
@@ -1158,7 +1187,13 @@
           transform: translateY(0);
   z-index: 1000;
 }
-.index-module_tow-line-ellipsis__GKFXr {
+.index-module_one-line-ellipsis__NRiVV {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-break: break-all;
+  white-space: nowrap;
+}
+.index-module_two-line-ellipsis__k-YGB {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;

package/dist/index.js

@@ -532,7 +532,7 @@ var DataSourceType;
     DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
 })(DataSourceType || (DataSourceType = {}));
 const DEFAULT_TAG = 'FOR U';
-const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false }) => {
+const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isShowTag = true, isOpenConsent = false, globalConfig, isEditor = false, utmParameter }) => {
     var _a, _b, _c;
     const [rtcList, setRtcList] = useState([]);
     const [tagList, setTagList] = useState([]);
@@ -614,7 +614,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
                 var _a, _b;
                 const key = val.split('=')[0];
-                return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
+                return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
             })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
             query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
         }
@@ -709,7 +709,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
             const val = (_o = (_m = (_l = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _l === void 0 ? void 0 : _l.filter((val) => {
                 var _a, _b;
                 const key = val.split('=')[0];
-                return (_b = ((_a = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
+                return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
             })) === null || _m === void 0 ? void 0 : _m.join('&')) !== null && _o !== void 0 ? _o : '';
             const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
             setTagList((_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []);
@@ -8583,7 +8583,7 @@ SwiperSlide.displayName = 'SwiperSlide';
  * @Author: binruan@chatlabs.com
  * @Date: 2023-11-02 18:34:34
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-07-19 18:39:54
+ * @LastEditTime: 2024-07-25 17:05:20
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Modal\index.tsx
  *
  */
@@ -8639,19 +8639,25 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
         onClose === null || onClose === void 0 ? void 0 : onClose();
     }, 300);
     const handleTouchStart = (event) => {
-        event.stopPropagation();
-        touchRef.current = event.touches[0].clientY;
-        fTouchRef.current = event.touches[0].clientY;
+        // event.stopPropagation();
+        touchRef.current = event.touches[0];
+        fTouchRef.current = event.touches[0];
         touchMoveRef.current = true;
     };
     const handleTouchMove = (event) => {
-        event.stopPropagation();
+        // event.stopPropagation();
         requestAnimationFrame(() => {
             var _a;
             if (touchMoveRef.current && ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.scrollTop) === 0) {
                 const currentY = event.touches[0].clientY;
-                const diff = touchRef.current - currentY;
-                touchRef.current = currentY;
+                const currentX = event.touches[0].clientX;
+                const diff = touchRef.current.clientY - currentY;
+                touchRef.current = event.touches[0];
+                const diffY = currentY - fTouchRef.current.clientY;
+                const diffX = currentX - fTouchRef.current.clientX;
+                if (Math.abs(diffX) > Math.abs(diffY)) {
+                    return;
+                }
                 const ts = modalTrans - diff;
                 if (ts > 0) {
                     setModalTrans(ts);
@@ -8661,9 +8667,14 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
     };
     const handleTouchEnd = (event) => {
         var _a;
-        event.stopPropagation();
+        // event.stopPropagation();
         if (touchMoveRef.current && ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.scrollTop) === 0) {
-            const diff = fTouchRef.current - touchRef.current;
+            const diffY = event.changedTouches[0].clientY - fTouchRef.current.clientY;
+            const diffX = event.changedTouches[0].clientX - fTouchRef.current.clientX;
+            if (Math.abs(diffX) > Math.abs(diffY)) {
+                return;
+            }
+            const diff = fTouchRef.current.clientY - touchRef.current.clientY;
             if (diff > 0) {
                 setModalTrans(0);
             }
@@ -10154,18 +10165,24 @@ const CommodityList$1 = (_a) => {
         }
     }, []);
     return (React.createElement("div", { className: css(Object.assign(Object.assign({}, style), { display: 'flex', flexDirection: 'column', gap: '10px', padding: '0 20px', marginTop: '50px' })) }, product === null || product === void 0 ? void 0 : product.map((item, index) => {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         return (React.createElement(EventProvider$1, Object.assign({ key: index, isExternalLink: isExternalLink, rec: recData, index: index }, props, { className: css({
                 display: 'flex'
             }) }),
             React.createElement(Img$1, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: commodityPicture }),
-            React.createElement("div", { style: { flex: 1, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' } },
+            React.createElement("div", { style: {
+                    flex: 1,
+                    width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginRight) !== null && _f !== void 0 ? _f : 0}px - ${(_g = style === null || style === void 0 ? void 0 : style.padding) !== null && _g !== void 0 ? _g : 0}px)`,
+                    display: 'flex',
+                    flexDirection: 'column',
+                    justifyContent: 'space-between'
+                } },
                 React.createElement("div", null,
-                    React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
-                            __html: setFontForText((_e = item === null || item === void 0 ? void 0 : item.title) !== null && _e !== void 0 ? _e : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
+                    React.createElement("div", { className: 'one-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
+                            __html: setFontForText((_h = item === null || item === void 0 ? void 0 : item.title) !== null && _h !== void 0 ? _h : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
                         } }),
-                    React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
-                            __html: setFontForText((_f = item === null || item === void 0 ? void 0 : item.collection) !== null && _f !== void 0 ? _f : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
+                    React.createElement("div", { className: 'two-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
+                            __html: setFontForText((_j = item === null || item === void 0 ? void 0 : item.collection) !== null && _j !== void 0 ? _j : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
                         } })),
                 React.createElement("div", { className: css({
                         display: 'flex',
@@ -10178,7 +10195,7 @@ const CommodityList$1 = (_a) => {
                             __html: setFontForText(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
                         } }),
                     React.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px', maxWidth: '100px' }), dangerouslySetInnerHTML: {
-                            __html: setFontForText((_h = (_g = item === null || item === void 0 ? void 0 : item.bindCta) === null || _g === void 0 ? void 0 : _g.enTitle) !== null && _h !== void 0 ? _h : 'Shop Now', buttonStyle)
+                            __html: setFontForText((_l = (_k = item === null || item === void 0 ? void 0 : item.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop Now', buttonStyle)
                         } })))));
     })));
 };
@@ -13911,7 +13928,7 @@ var settingRender$1 = [
     }
 ];
 
-var styles$1 = {"animated-button":"index-module_animated-button__lqTbg","gradientCover":"index-module_gradientCover__5iUag"};
+var styles$1 = {"animated-button":"index-module_animated-button__lqTbg","gradientCover":"index-module_gradientCover__5iUag","one-line-ellipsis":"index-module_one-line-ellipsis__HutE0","two-line-ellipsis":"index-module_two-line-ellipsis__c8gRJ"};
 
 const AniLink$1 = (_a) => {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
@@ -13969,13 +13986,16 @@ const AniLink$1 = (_a) => {
         if (isOnScreen) {
             setVisible(true);
         }
+        else {
+            setVisible(false);
+        }
     }, [isOnScreen]);
     const aniNamStyle = useMemo(() => {
         if (!visible)
             return null;
         return styles$1['animated-button'];
     }, [visible]);
-    return (React.createElement("div", Object.assign({ ref: ref, style: Object.assign(Object.assign(Object.assign({}, style), ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: `${(_l = style === null || style === void 0 ? void 0 : style.height) !== null && _l !== void 0 ? _l : 0}px` }) }, props, { className: `${aniNamStyle} ${css(aniTimStyle)} one-line-ellipsis`, onClick: handleTo, dangerouslySetInnerHTML: {
+    return (React.createElement("div", Object.assign({ ref: ref, style: Object.assign(Object.assign(Object.assign({}, style), ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: `${(_l = style === null || style === void 0 ? void 0 : style.height) !== null && _l !== void 0 ? _l : 0}px` }) }, props, { className: `${aniNamStyle} ${css(aniTimStyle)} ${styles$1['one-line-ellipsis']}`, onClick: handleTo, dangerouslySetInnerHTML: {
             __html: setFontForText(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
         } })));
 };
@@ -14086,7 +14106,7 @@ const AniLink = createMaterial(AniLinkComponent, {
  * @Author: binruan@chatlabs.com
  * @Date: 2024-03-26 16:50:25
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-07-08 11:01:24
+ * @LastEditTime: 2024-07-25 15:02:45
  * @FilePath: \pb-sxp-ui\src\materials\sxp\cta\AniLinkPopup\settingRender.tsx
  *
  */
@@ -14288,7 +14308,7 @@ var settingRender = [
             },
             {
                 type: 'TextSpace',
-                name: ['props', 'ctaTempStyles', 'title']
+                name: ['props', 'ctaTempStyles', 'ctaTitle']
             },
             {
                 type: 'Color',
@@ -14340,7 +14360,7 @@ var settingRender = [
     }
 ];
 
-var styles = {"aniLinkPopup":"index-module_aniLinkPopup__YT7kj","animated-fadeIn":"index-module_animated-fadeIn__8ZCbq","fadeIn":"index-module_fadeIn__2E-dk","animated-fadeOut":"index-module_animated-fadeOut__iK4oc","fadeOut":"index-module_fadeOut__MgevT","tow-line-ellipsis":"index-module_tow-line-ellipsis__GKFXr","modal-icon-wrapper":"index-module_modal-icon-wrapper__tu3BY","modal-icon-wrapper-img":"index-module_modal-icon-wrapper-img__4b7qZ"};
+var styles = {"aniLinkPopup":"index-module_aniLinkPopup__YT7kj","animated-fadeIn":"index-module_animated-fadeIn__8ZCbq","fadeIn":"index-module_fadeIn__2E-dk","animated-fadeOut":"index-module_animated-fadeOut__iK4oc","fadeOut":"index-module_fadeOut__MgevT","one-line-ellipsis":"index-module_one-line-ellipsis__NRiVV","two-line-ellipsis":"index-module_two-line-ellipsis__k-YGB","modal-icon-wrapper":"index-module_modal-icon-wrapper__tu3BY","modal-icon-wrapper-img":"index-module_modal-icon-wrapper-img__4b7qZ"};
 
 const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
 const AniLinkPopup$1 = (_a) => {
@@ -14394,26 +14414,29 @@ const AniLinkPopup$1 = (_a) => {
         if (isOnScreen) {
             setVisible(true);
         }
+        else {
+            setVisible(false);
+        }
     }, [isOnScreen]);
     const aniNamStyle = useMemo(() => {
         if (!visible)
             return null;
-        return startAni ? styles['animated-fadeIn'] : styles['animated-fadeOut'];
+        return startAni ? styles['animated-fadeIn'] : null;
     }, [visible, startAni]);
     return (React.createElement(React.Fragment, null, isTel ? (React.createElement("div", { style: {
             height: '40px',
             lineHeight: '40px',
             paddingLeft: '6px'
-        } }, "Cta Title")) : (React.createElement("div", Object.assign({ ref: ref }, props, { className: `${css(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${styles['aniLinkPopup']} ${aniNamStyle}  ${css(aniTimStyle)}`, onClick: handleTo }),
+        } }, "Cta Title")) : (React.createElement(React.Fragment, null, aniNamStyle ? (React.createElement("div", Object.assign({ ref: ref }, props, { className: `${css(Object.assign(Object.assign({}, style), { '--transY': `translateY(calc(100% + ${(_r = style === null || style === void 0 ? void 0 : style.margin) !== null && _r !== void 0 ? _r : 0}px))` }))} ${styles['aniLinkPopup']} ${aniNamStyle}  ${css(aniTimStyle)}`, onClick: handleTo }),
         React.createElement("div", { onClick: onClose, className: styles['modal-icon-wrapper'], style: { padding: (_s = style === null || style === void 0 ? void 0 : style['padding']) !== null && _s !== void 0 ? _s : 0 } },
             React.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: styles['modal-icon-wrapper-img'] })),
         React.createElement(Img$1, { src: src, rec: recData, item: (_y = (_w = (_v = (_u = recData === null || recData === void 0 ? void 0 : recData.video) === null || _u === void 0 ? void 0 : _u.bindProducts) === null || _v === void 0 ? void 0 : _v[0]) !== null && _w !== void 0 ? _w : (_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.bindProduct) !== null && _y !== void 0 ? _y : recData === null || recData === void 0 ? void 0 : recData.video, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img }),
-        React.createElement("div", { hidden: !!recData && !(product === null || product === void 0 ? void 0 : product.title), className: styles['tow-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
+        (!recData || (product === null || product === void 0 ? void 0 : product.title)) && (React.createElement("div", { className: styles['two-line-ellipsis'], style: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title, dangerouslySetInnerHTML: {
                 __html: setFontForText((_z = product === null || product === void 0 ? void 0 : product.title) !== null && _z !== void 0 ? _z : 'Product Name', ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.title)
-            } }),
-        React.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: ((_0 = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _0 === void 0 ? void 0 : _0.height) + 'px' }), dangerouslySetInnerHTML: {
+            } })),
+        React.createElement("div", { className: styles['one-line-ellipsis'], style: Object.assign(Object.assign({}, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle), { lineHeight: ((_0 = ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle) === null || _0 === void 0 ? void 0 : _0.height) + 'px' }), dangerouslySetInnerHTML: {
                 __html: setFontForText(title, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.ctaTitle)
-            } })))));
+            } }))) : (React.createElement("div", { ref: ref, style: { position: 'absolute', height: '50px', width: '50px', bottom: 0, right: 0, zIndex: 1000 } }))))));
 };
 var AniLinkPopupComponent = memo(AniLinkPopup$1);
 
@@ -15139,7 +15162,7 @@ var PictureGroup$3 = memo(PictureGroup$2);
  * @Author: binruan@chatlabs.com
  * @Date: 2024-01-15 19:03:09
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-07-09 18:47:05
+ * @LastEditTime: 2024-07-25 18:14:29
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Hashtag\index.tsx
  *
  */
@@ -15176,7 +15199,6 @@ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
         }
         return (React.createElement("span", { style: { textDecoration: 'underline', cursor: 'pointer', color: '#fff' }, onClick: () => setIsShowMore(!isShowMore) }, isShowMore ? 'show less' : 'show more'));
     }, [isShowMore, tags]);
-    console.log(hashTagStyle, '111');
     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) },
             React.createElement("div", { dangerouslySetInnerHTML: { __html: setFontForText(`#${item}`, hashTagStyle) } })))))));
@@ -15247,27 +15269,35 @@ function withBindDataSource(Component) {
  * @Author: binruan@chatlabs.com
  * @Date: 2023-12-26 16:11:34
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-07-17 18:54:33
+ * @LastEditTime: 2024-07-25 18:47:37
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\RenderCard.tsx
  *
  */
 const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
+    var _a, _b, _c, _d, _e;
     const { schema } = useEditor();
+    if (!(rec === null || rec === void 0 ? void 0 : rec.video))
+        return null;
+    let cta = null;
+    if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
+        cta = '多商品CTA';
+    }
+    else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
+        cta = '商品CTA';
+    }
+    else {
+        cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
+    }
+    const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
     const renderComp = useMemo(() => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8;
         if (!(rec === null || rec === void 0 ? void 0 : rec.video))
             return null;
-        let cta = null;
-        if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
-            cta = '多商品CTA';
-        }
-        else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
-            cta = '商品CTA';
-        }
+        if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) ;
+        else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) ;
         else {
-            cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
+            (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
         }
-        const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
         //如果includesCtaType有值，则只渲染includesCtaType包含的cta类型组件，用于在页面某处只显示某一组件
         if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type)))
             return;
@@ -15293,7 +15323,7 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType }) => {
         else {
             return null;
         }
-    }, [rec, resolver, tempMap, schema]);
+    }, [rec, resolver, tempMap, schema, value === null || value === void 0 ? void 0 : value.id]);
     return React.createElement(React.Fragment, null, renderComp);
 };
 var RenderCard$1 = memo(RenderCard);
@@ -15381,7 +15411,7 @@ var Tagbar$1 = memo(Tagbar);
  * @Author: binruan@chatlabs.com
  * @Date: 2024-01-15 19:03:09
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-07-24 14:59:23
+ * @LastEditTime: 2024-07-25 17:10:01
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
  *
  */
@@ -15658,7 +15688,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
             return;
         const t = new Date() - curTime.current;
         if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.openSlideSkip) && t >= ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.slideSkipStartTime) !== null && _a !== void 0 ? _a : 0) && getSlideSkipState() && item) {
-            const link = ((_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProduct) === null || _c === void 0 ? void 0 : _c.link) || ((_f = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.bindProducts) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.link) || ((_g = item === null || item === void 0 ? void 0 : item.product) === null || _g === void 0 ? void 0 : _g.link);
+            const link = ((_d = (_c = (_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.link) || ((_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.link) || ((_g = item === null || item === void 0 ? void 0 : item.product) === null || _g === void 0 ? void 0 : _g.link);
             const product = (item === null || item === void 0 ? void 0 : item.product) || ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct) || ((_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]);
             if (link) {
                 bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
@@ -16203,7 +16233,7 @@ var index$1 = memo(DiyPortalPreview);
  * @Author: binruan@chatlabs.com
  * @Date: 2023-10-31 10:56:01
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-07-19 18:06:14
+ * @LastEditTime: 2024-07-25 17:15:36
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Popup\index.tsx
  *
  */
@@ -16256,7 +16286,7 @@ const Popup = () => {
                 const isExternalLink = ((_d = (_c = (_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.event) === null || _c === void 0 ? void 0 : _c.onClick) === null || _d === void 0 ? void 0 : _d.linkType) === 'externalLink';
                 const isPopup = ((_g = (_f = (_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.event) === null || _f === void 0 ? void 0 : _f.onClick) === null || _g === void 0 ? void 0 : _g.linkType) === 'popup';
                 const defaulSetting = (_h = t === null || t === void 0 ? void 0 : t.extend) === null || _h === void 0 ? void 0 : _h.defaulSetting;
-                return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
+                return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
             }
             else {
                 return React.createElement(React.Fragment, null);
@@ -16270,7 +16300,7 @@ const Popup = () => {
  * @Author: binruan@chatlabs.com
  * @Date: 2024-01-15 19:03:09
  * @LastEditors: binruan@chatlabs.com
- * @LastEditTime: 2024-06-13 14:54:12
+ * @LastEditTime: 2024-07-24 16:35:44
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
  *
  */
@@ -16294,7 +16324,7 @@ const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, l
         return searchParams;
     }, []);
     return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
-        React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, globalConfig: (_l = (_k = data === null || data === void 0 ? void 0 : data.data) === null || _k === void 0 ? void 0 : _k.sxpPageConf) === null || _l === void 0 ? void 0 : _l.globalConfig, render: ({ rtcList, tagList }) => {
+        React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, globalConfig: (_l = (_k = data === null || data === void 0 ? void 0 : data.data) === null || _k === void 0 ? void 0 : _k.sxpPageConf) === null || _l === void 0 ? void 0 : _l.globalConfig, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, render: ({ rtcList, tagList }) => {
                 var _a;
                 return (React.createElement(React.Fragment, null,
                     React.createElement(SxpPageRender, Object.assign({}, (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER, licenseUrl: licenseUrl })),