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.js CHANGED
@@ -8809,13 +8809,13 @@ SwiperSlide.displayName = 'SwiperSlide';
8809
8809
  * @Author: binruan@chatlabs.com
8810
8810
  * @Date: 2023-11-02 18:34:34
8811
8811
  * @LastEditors: binruan@chatlabs.com
8812
- * @LastEditTime: 2024-08-20 18:29:11
8812
+ * @LastEditTime: 2024-08-22 18:48:44
8813
8813
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Modal\index.tsx
8814
8814
  *
8815
8815
  */
8816
8816
  const closeIcon$1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
8817
8817
  const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
8818
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
8818
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
8819
8819
  const touchRef = useRef(null);
8820
8820
  const fTouchRef = useRef(null);
8821
8821
  const touchMoveRef = useRef(null);
@@ -8940,8 +8940,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
8940
8940
  React.createElement("div", { onClick: onClose, className: 'modal-icon-wrapper' },
8941
8941
  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' })),
8942
8942
  React.createElement("div", { ref: ref, style: {
8943
- height: (_x = (isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H) -
8944
- ((_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,
8943
+ height: isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H,
8945
8944
  overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
8946
8945
  } }, children)))))), modalEleRef.current);
8947
8946
  };
@@ -9109,7 +9108,7 @@ const CommodityGroup = ({ products, data, defImg, style, onCLick, popupDetailDat
9109
9108
  var CommodityGroup$1 = memo(CommodityGroup);
9110
9109
 
9111
9110
  const CommodityDetail$1 = (_a) => {
9112
- 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;
9111
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
9113
9112
  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"]);
9114
9113
  const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = useSxpDataSource();
9115
9114
  const { jumpToWeb, productView } = useEventReport();
@@ -9230,18 +9229,18 @@ const CommodityDetail$1 = (_a) => {
9230
9229
  };
9231
9230
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
9232
9231
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
9233
- 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;
9232
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
9234
9233
  return (React.createElement(React.Fragment, null,
9235
9234
  React.createElement("div", Object.assign({ className: css(Object.assign({}, style)) }, props),
9236
9235
  React.createElement("div", { style: { position: 'relative' } },
9237
- 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: {
9236
+ 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: {
9238
9237
  clickable: true,
9239
9238
  bulletActiveClass: 'swipe-item-active-bullet',
9240
9239
  clickableClass: getDotsAlign
9241
9240
  }, loop: true, autoplay: {
9242
9241
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
9243
9242
  }, ref: ref },
9244
- React.createElement(React.Fragment, null, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
9243
+ React.createElement(React.Fragment, null, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
9245
9244
  var _a;
9246
9245
  return (React.createElement(SwiperSlide, { key: src },
9247
9246
  React.createElement("div", { style: {
@@ -9257,7 +9256,7 @@ const CommodityDetail$1 = (_a) => {
9257
9256
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
9258
9257
  }, 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 }))));
9259
9258
  })))),
9260
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (React.createElement("div", { className: css({
9259
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css({
9261
9260
  height,
9262
9261
  width
9263
9262
  }) },
@@ -9265,9 +9264,8 @@ const CommodityDetail$1 = (_a) => {
9265
9264
  objectFit: 'cover',
9266
9265
  width: '100%',
9267
9266
  height: '100%'
9268
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
9267
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
9269
9268
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
9270
- padding: '5px 10px',
9271
9269
  display: 'flex',
9272
9270
  alignItems: 'center',
9273
9271
  position: 'absolute',
@@ -9277,7 +9275,7 @@ const CommodityDetail$1 = (_a) => {
9277
9275
  background: '#fff',
9278
9276
  borderRadius: '3px'
9279
9277
  }, onClick: () => setShow3DModal(true) },
9280
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
9278
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '60px' })))),
9281
9279
  renderCommodityGroup(),
9282
9280
  React.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
9283
9281
  renderBtn(),
@@ -9285,11 +9283,11 @@ const CommodityDetail$1 = (_a) => {
9285
9283
  React.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
9286
9284
  renderBtn()),
9287
9285
  React.createElement(Modal$1, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
9288
- React.createElement("div", { style: { height: '100vh' } },
9286
+ React.createElement("div", { style: { height: window.innerHeight } },
9289
9287
  React.createElement("iframe", { src: iframeUrl, style: {
9290
9288
  width: '100%',
9291
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
9292
- marginTop: '40px',
9289
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
9290
+ marginTop: '50px',
9293
9291
  border: 'none'
9294
9292
  } })))));
9295
9293
  };
@@ -9944,7 +9942,7 @@ var settingRender$7 = [
9944
9942
  ];
9945
9943
 
9946
9944
  const CommodityDetailDiroNew$1 = (_a) => {
9947
- 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;
9945
+ 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;
9948
9946
  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"]);
9949
9947
  useState(true);
9950
9948
  const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = useSxpDataSource();
@@ -10096,17 +10094,17 @@ Made in Italy` })));
10096
10094
  };
10097
10095
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
10098
10096
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
10099
- 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;
10097
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
10100
10098
  return (React.createElement("div", { className: 'pb-commondityDiroNew' },
10101
10099
  React.createElement("div", Object.assign({ className: css(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
10102
10100
  React.createElement("div", { style: { position: 'relative' } },
10103
- 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: {
10101
+ 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: {
10104
10102
  clickable: true,
10105
10103
  bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
10106
10104
  clickableClass: getDotsAlign
10107
10105
  }, loop: true, autoplay: {
10108
10106
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
10109
- }, ref: ref }, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
10107
+ }, ref: ref }, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
10110
10108
  var _a;
10111
10109
  return (React.createElement(SwiperSlide, { key: src },
10112
10110
  React.createElement("div", { style: {
@@ -10122,7 +10120,7 @@ Made in Italy` })));
10122
10120
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
10123
10121
  }, 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 }))));
10124
10122
  }))),
10125
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (React.createElement("div", { className: css({
10123
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css({
10126
10124
  height,
10127
10125
  width
10128
10126
  }) },
@@ -10130,9 +10128,8 @@ Made in Italy` })));
10130
10128
  objectFit: 'cover',
10131
10129
  width: '100%',
10132
10130
  height: '100%'
10133
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
10131
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
10134
10132
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
10135
- padding: '5px 10px',
10136
10133
  display: 'flex',
10137
10134
  alignItems: 'center',
10138
10135
  position: 'absolute',
@@ -10142,13 +10139,13 @@ Made in Italy` })));
10142
10139
  background: '#fff',
10143
10140
  borderRadius: '3px'
10144
10141
  }, onClick: () => setShow3DModal(true) },
10145
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
10142
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '60px' })))),
10146
10143
  renderCommodityGroup(),
10147
10144
  React.createElement("div", { className: 'pb-commondityDiroNew-content' },
10148
10145
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
10149
10146
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
10150
10147
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
10151
- __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)
10148
+ __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)
10152
10149
  } }),
10153
10150
  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: {
10154
10151
  __html: setFontForText((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -10158,20 +10155,20 @@ Made in Italy` })));
10158
10155
  __html: setFontForText(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
10159
10156
  } }),
10160
10157
  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: {
10161
- __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)
10158
+ __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)
10162
10159
  } }))),
10163
- (!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 },
10160
+ (!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 },
10164
10161
  React.createElement("span", { dangerouslySetInnerHTML: {
10165
- __html: setFontForText((_6 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _6 !== void 0 ? _6 : 'Shop now', buttonStyle)
10162
+ __html: setFontForText((_3 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _3 !== void 0 ? _3 : 'Shop now', buttonStyle)
10166
10163
  } }))),
10167
10164
  productInfoText({ isPost }))),
10168
10165
  React.createElement(Modal$1, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
10169
10166
  React.createElement(Modal$1, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
10170
- React.createElement("div", { style: { height: '100vh' } },
10167
+ React.createElement("div", { style: { height: window.innerHeight } },
10171
10168
  React.createElement("iframe", { src: iframeUrl, style: {
10172
10169
  width: '100%',
10173
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
10174
- marginTop: '40px',
10170
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
10171
+ marginTop: '50px',
10175
10172
  border: 'none'
10176
10173
  } })))));
10177
10174
  };
@@ -16007,7 +16004,7 @@ var Tagbar$1 = memo(Tagbar);
16007
16004
  * @Author: binruan@chatlabs.com
16008
16005
  * @Date: 2024-01-15 19:03:09
16009
16006
  * @LastEditors: binruan@chatlabs.com
16010
- * @LastEditTime: 2024-08-22 17:50:06
16007
+ * @LastEditTime: 2024-08-22 18:34:01
16011
16008
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
16012
16009
  *
16013
16010
  */
@@ -16183,7 +16180,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
16183
16180
  return null;
16184
16181
  }
16185
16182
  });
16186
- return !waterFallData && !isEditor ? list.concat([{ loading: true }]) : list;
16183
+ return !waterFallData ? list.concat([{ loading: true }]) : list;
16187
16184
  }, [data, activeIndex, waterFallData, isEditor]);
16188
16185
  const renderLogo = useMemo(() => {
16189
16186
  var _a, _b, _c, _d;