pb-sxp-ui 1.3.3 → 1.3.5

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.cjs CHANGED
@@ -8831,13 +8831,13 @@ SwiperSlide.displayName = 'SwiperSlide';
8831
8831
  * @Author: binruan@chatlabs.com
8832
8832
  * @Date: 2023-11-02 18:34:34
8833
8833
  * @LastEditors: binruan@chatlabs.com
8834
- * @LastEditTime: 2024-08-20 18:29:11
8834
+ * @LastEditTime: 2024-08-22 18:48:44
8835
8835
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Modal\index.tsx
8836
8836
  *
8837
8837
  */
8838
8838
  const closeIcon$1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
8839
8839
  const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
8840
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
8840
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
8841
8841
  const touchRef = React.useRef(null);
8842
8842
  const fTouchRef = React.useRef(null);
8843
8843
  const touchMoveRef = React.useRef(null);
@@ -8962,8 +8962,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
8962
8962
  React.createElement("div", { onClick: onClose, className: 'modal-icon-wrapper' },
8963
8963
  React.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon$1, alt: 'close', className: 'modal-icon' })),
8964
8964
  React.createElement("div", { ref: ref, style: {
8965
- height: (_x = (isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H) -
8966
- ((_w = (_v = (_u = getPopupById === null || getPopupById === void 0 ? void 0 : getPopupById.item) === null || _u === void 0 ? void 0 : _u.props) === null || _v === void 0 ? void 0 : _v.popupBg) === null || _w === void 0 ? void 0 : _w.bottomMargin)) !== null && _x !== void 0 ? _x : 0,
8965
+ height: isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H,
8967
8966
  overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
8968
8967
  } }, children)))))), modalEleRef.current);
8969
8968
  };
@@ -9131,7 +9130,7 @@ const CommodityGroup = ({ products, data, defImg, style, onCLick, popupDetailDat
9131
9130
  var CommodityGroup$1 = React.memo(CommodityGroup);
9132
9131
 
9133
9132
  const CommodityDetail$1 = (_a) => {
9134
- var _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;
9133
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
9135
9134
  var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = __rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
9136
9135
  const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = useSxpDataSource();
9137
9136
  const { jumpToWeb, productView } = useEventReport();
@@ -9252,18 +9251,18 @@ const CommodityDetail$1 = (_a) => {
9252
9251
  };
9253
9252
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
9254
9253
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
9255
- const iframeUrl = isPost ? (_w = data === null || data === void 0 ? void 0 : data.product) === null || _w === void 0 ? void 0 : _w.remark : (_y = (_x = data === null || data === void 0 ? void 0 : data.video) === null || _x === void 0 ? void 0 : _x.bindProduct) === null || _y === void 0 ? void 0 : _y.remark;
9254
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
9256
9255
  return (React.createElement(React.Fragment, null,
9257
9256
  React.createElement("div", Object.assign({ className: css.css(Object.assign({}, style)) }, props),
9258
9257
  React.createElement("div", { style: { position: 'relative' } },
9259
- product && ((_z = product === null || product === void 0 ? void 0 : product.homePage) === null || _z === void 0 ? void 0 : _z.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
9258
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
9260
9259
  clickable: true,
9261
9260
  bulletActiveClass: 'swipe-item-active-bullet',
9262
9261
  clickableClass: getDotsAlign
9263
9262
  }, loop: true, autoplay: {
9264
9263
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
9265
9264
  }, ref: ref },
9266
- React.createElement(React.Fragment, null, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
9265
+ React.createElement(React.Fragment, null, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
9267
9266
  var _a;
9268
9267
  return (React.createElement(SwiperSlide, { key: src },
9269
9268
  React.createElement("div", { style: {
@@ -9279,7 +9278,7 @@ const CommodityDetail$1 = (_a) => {
9279
9278
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
9280
9279
  }, src: (_a = src !== null && src !== void 0 ? src : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _a !== void 0 ? _a : bottom_image }))));
9281
9280
  })))),
9282
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (React.createElement("div", { className: css.css({
9281
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css.css({
9283
9282
  height,
9284
9283
  width
9285
9284
  }) },
@@ -9287,9 +9286,8 @@ const CommodityDetail$1 = (_a) => {
9287
9286
  objectFit: 'cover',
9288
9287
  width: '100%',
9289
9288
  height: '100%'
9290
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
9289
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
9291
9290
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
9292
- padding: '5px 10px',
9293
9291
  display: 'flex',
9294
9292
  alignItems: 'center',
9295
9293
  position: 'absolute',
@@ -9299,7 +9297,7 @@ const CommodityDetail$1 = (_a) => {
9299
9297
  background: '#fff',
9300
9298
  borderRadius: '3px'
9301
9299
  }, onClick: () => setShow3DModal(true) },
9302
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
9300
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '60px' })))),
9303
9301
  renderCommodityGroup(),
9304
9302
  React.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
9305
9303
  renderBtn(),
@@ -9307,11 +9305,11 @@ const CommodityDetail$1 = (_a) => {
9307
9305
  React.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
9308
9306
  renderBtn()),
9309
9307
  React.createElement(Modal$1, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
9310
- React.createElement("div", { style: { height: '100vh' } },
9308
+ React.createElement("div", { style: { height: window.innerHeight } },
9311
9309
  React.createElement("iframe", { src: iframeUrl, style: {
9312
9310
  width: '100%',
9313
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
9314
- marginTop: '40px',
9311
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
9312
+ marginTop: '50px',
9315
9313
  border: 'none'
9316
9314
  } })))));
9317
9315
  };
@@ -9966,7 +9964,7 @@ var settingRender$7 = [
9966
9964
  ];
9967
9965
 
9968
9966
  const CommodityDetailDiroNew$1 = (_a) => {
9969
- var _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;
9967
+ var _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;
9970
9968
  var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
9971
9969
  React.useState(true);
9972
9970
  const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = useSxpDataSource();
@@ -10118,17 +10116,17 @@ Made in Italy` })));
10118
10116
  };
10119
10117
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
10120
10118
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
10121
- const iframeUrl = isPost ? (_w = data === null || data === void 0 ? void 0 : data.product) === null || _w === void 0 ? void 0 : _w.remark : (_y = (_x = data === null || data === void 0 ? void 0 : data.video) === null || _x === void 0 ? void 0 : _x.bindProduct) === null || _y === void 0 ? void 0 : _y.remark;
10119
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
10122
10120
  return (React.createElement("div", { className: 'pb-commondityDiroNew' },
10123
10121
  React.createElement("div", Object.assign({ className: css.css(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
10124
10122
  React.createElement("div", { style: { position: 'relative' } },
10125
- product && ((_z = product === null || product === void 0 ? void 0 : product.homePage) === null || _z === void 0 ? void 0 : _z.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
10123
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
10126
10124
  clickable: true,
10127
10125
  bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
10128
10126
  clickableClass: getDotsAlign
10129
10127
  }, loop: true, autoplay: {
10130
10128
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
10131
- }, ref: ref }, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
10129
+ }, ref: ref }, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
10132
10130
  var _a;
10133
10131
  return (React.createElement(SwiperSlide, { key: src },
10134
10132
  React.createElement("div", { style: {
@@ -10144,7 +10142,7 @@ Made in Italy` })));
10144
10142
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
10145
10143
  }, src: (_a = src !== null && src !== void 0 ? src : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _a !== void 0 ? _a : bottom_image }))));
10146
10144
  }))),
10147
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (React.createElement("div", { className: css.css({
10145
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css.css({
10148
10146
  height,
10149
10147
  width
10150
10148
  }) },
@@ -10152,9 +10150,8 @@ Made in Italy` })));
10152
10150
  objectFit: 'cover',
10153
10151
  width: '100%',
10154
10152
  height: '100%'
10155
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
10153
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
10156
10154
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
10157
- padding: '5px 10px',
10158
10155
  display: 'flex',
10159
10156
  alignItems: 'center',
10160
10157
  position: 'absolute',
@@ -10164,13 +10161,13 @@ Made in Italy` })));
10164
10161
  background: '#fff',
10165
10162
  borderRadius: '3px'
10166
10163
  }, onClick: () => setShow3DModal(true) },
10167
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
10164
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '60px' })))),
10168
10165
  renderCommodityGroup(),
10169
10166
  React.createElement("div", { className: 'pb-commondityDiroNew-content' },
10170
10167
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
10171
10168
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
10172
10169
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
10173
- __html: setFontForText((_3 = product === null || product === void 0 ? void 0 : product.title) !== null && _3 !== void 0 ? _3 : 'Large Dior Toujours BagLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
10170
+ __html: setFontForText((_0 = product === null || product === void 0 ? void 0 : product.title) !== null && _0 !== void 0 ? _0 : 'Large Dior Toujours BagLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
10174
10171
  } }),
10175
10172
  React.createElement("div", { className: 'pb-commondityDiroNew-content-collection', hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.collection) || (product === null || product === void 0 ? void 0 : product.collection) === ''), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection), dangerouslySetInnerHTML: {
10176
10173
  __html: setFontForText((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -10180,20 +10177,20 @@ Made in Italy` })));
10180
10177
  __html: setFontForText(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
10181
10178
  } }),
10182
10179
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-right-price', hidden: !!product && !(product === null || product === void 0 ? void 0 : product.taxInfo), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo), dangerouslySetInnerHTML: {
10183
- __html: setFontForText((_4 = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _4 !== void 0 ? _4 : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
10180
+ __html: setFontForText((_1 = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _1 !== void 0 ? _1 : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
10184
10181
  } }))),
10185
- (!product || (product === null || product === void 0 ? void 0 : product.link)) && (React.createElement("button", { "aria-label": (_5 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _5 !== void 0 ? _5 : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle },
10182
+ (!product || (product === null || product === void 0 ? void 0 : product.link)) && (React.createElement("button", { "aria-label": (_2 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _2 !== void 0 ? _2 : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle },
10186
10183
  React.createElement("span", { dangerouslySetInnerHTML: {
10187
- __html: setFontForText((_6 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _6 !== void 0 ? _6 : 'Shop now', buttonStyle)
10184
+ __html: setFontForText((_3 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _3 !== void 0 ? _3 : 'Shop now', buttonStyle)
10188
10185
  } }))),
10189
10186
  productInfoText({ isPost }))),
10190
10187
  React.createElement(Modal$1, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
10191
10188
  React.createElement(Modal$1, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
10192
- React.createElement("div", { style: { height: '100vh' } },
10189
+ React.createElement("div", { style: { height: window.innerHeight } },
10193
10190
  React.createElement("iframe", { src: iframeUrl, style: {
10194
10191
  width: '100%',
10195
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
10196
- marginTop: '40px',
10192
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
10193
+ marginTop: '50px',
10197
10194
  border: 'none'
10198
10195
  } })))));
10199
10196
  };
@@ -16029,7 +16026,7 @@ var Tagbar$1 = React.memo(Tagbar);
16029
16026
  * @Author: binruan@chatlabs.com
16030
16027
  * @Date: 2024-01-15 19:03:09
16031
16028
  * @LastEditors: binruan@chatlabs.com
16032
- * @LastEditTime: 2024-08-22 17:50:06
16029
+ * @LastEditTime: 2024-08-22 18:34:01
16033
16030
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
16034
16031
  *
16035
16032
  */
@@ -16205,7 +16202,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
16205
16202
  return null;
16206
16203
  }
16207
16204
  });
16208
- return !waterFallData && !isEditor ? list.concat([{ loading: true }]) : list;
16205
+ return !waterFallData ? list.concat([{ loading: true }]) : list;
16209
16206
  }, [data, activeIndex, waterFallData, isEditor]);
16210
16207
  const renderLogo = React.useMemo(() => {
16211
16208
  var _a, _b, _c, _d;