pb-sxp-ui 1.3.3 → 1.3.4

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.
Files changed (21) hide show
  1. package/dist/index.cjs +29 -30
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +29 -30
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +3 -3
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +3 -3
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +29 -30
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +3 -3
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/SxpPageRender/Modal/index.js +2 -3
  14. package/es/core/components/SxpPageRender/index.js +1 -1
  15. package/es/materials/sxp/popup/CommodityDetail/index.js +10 -10
  16. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +14 -14
  17. package/lib/core/components/SxpPageRender/Modal/index.js +2 -3
  18. package/lib/core/components/SxpPageRender/index.js +1 -1
  19. package/lib/materials/sxp/popup/CommodityDetail/index.js +10 -10
  20. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +14 -14
  21. package/package.json +1 -1
package/es/core/components/SxpPageRender/Modal/index.js CHANGED
@@ -4,7 +4,7 @@ import * as ReactDOM from 'react-dom';
4
4
  import { useEditor, useSxpDataSource } from '../../../../core/hooks';
5
5
  const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
6
6
  const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
7
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
7
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
8
8
  const touchRef = useRef(null);
9
9
  const fTouchRef = useRef(null);
10
10
  const touchMoveRef = useRef(null);
@@ -126,8 +126,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
126
126
  React.createElement("div", { onClick: onClose, className: 'modal-icon-wrapper' },
127
127
  React.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: 'modal-icon' })),
128
128
  React.createElement("div", { ref: ref, style: {
129
- height: (_x = (isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H) -
130
- ((_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,
129
+ height: isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H,
131
130
  overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
132
131
  } }, children)))))), modalEleRef.current);
133
132
  };
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -190,7 +190,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
190
190
  return null;
191
191
  }
192
192
  });
193
- return !waterFallData && !isEditor ? list.concat([{ loading: true }]) : list;
193
+ return !waterFallData ? list.concat([{ loading: true }]) : list;
194
194
  }, [data, activeIndex, waterFallData, isEditor]);
195
195
  const renderLogo = useMemo(() => {
196
196
  var _a, _b, _c, _d;
package/es/materials/sxp/popup/CommodityDetail/index.js CHANGED
@@ -12,7 +12,7 @@ import FormatImage from '../../../../core/components/SxpPageRender/FormatImage';
12
12
  import { setFontForText } from '../../../../core/utils/tool';
13
13
  import CommodityGroup from '../../template/components/CommodityGroup';
14
14
  const CommodityDetail = (_a) => {
15
- 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;
15
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
16
16
  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"]);
17
17
  const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = useSxpDataSource();
18
18
  const { jumpToWeb, productView } = useEventReport();
@@ -133,18 +133,18 @@ const CommodityDetail = (_a) => {
133
133
  };
134
134
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
135
135
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
136
- 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;
136
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
137
137
  return (React.createElement(React.Fragment, null,
138
138
  React.createElement("div", Object.assign({ className: css(Object.assign({}, style)) }, props),
139
139
  React.createElement("div", { style: { position: 'relative' } },
140
- 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: {
140
+ 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: {
141
141
  clickable: true,
142
142
  bulletActiveClass: 'swipe-item-active-bullet',
143
143
  clickableClass: getDotsAlign
144
144
  }, loop: true, autoplay: {
145
145
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
146
146
  }, ref: ref },
147
- React.createElement(React.Fragment, null, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
147
+ React.createElement(React.Fragment, null, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
148
148
  var _a;
149
149
  return (React.createElement(SwiperSlide, { key: src },
150
150
  React.createElement("div", { style: {
@@ -160,7 +160,7 @@ const CommodityDetail = (_a) => {
160
160
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
161
161
  }, 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 }))));
162
162
  })))),
163
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (React.createElement("div", { className: css({
163
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css({
164
164
  height,
165
165
  width
166
166
  }) },
@@ -168,7 +168,7 @@ const CommodityDetail = (_a) => {
168
168
  objectFit: 'cover',
169
169
  width: '100%',
170
170
  height: '100%'
171
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
171
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
172
172
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
173
173
  padding: '5px 10px',
174
174
  display: 'flex',
@@ -180,7 +180,7 @@ const CommodityDetail = (_a) => {
180
180
  background: '#fff',
181
181
  borderRadius: '3px'
182
182
  }, onClick: () => setShow3DModal(true) },
183
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
183
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
184
184
  renderCommodityGroup(),
185
185
  React.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
186
186
  renderBtn(),
@@ -188,11 +188,11 @@ const CommodityDetail = (_a) => {
188
188
  React.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
189
189
  renderBtn()),
190
190
  React.createElement(Modal, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
191
- React.createElement("div", { style: { height: '100vh' } },
191
+ React.createElement("div", { style: { height: window.innerHeight } },
192
192
  React.createElement("iframe", { src: iframeUrl, style: {
193
193
  width: '100%',
194
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
195
- marginTop: '40px',
194
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
195
+ marginTop: '50px',
196
196
  border: 'none'
197
197
  } })))));
198
198
  };
package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js CHANGED
@@ -12,7 +12,7 @@ import FormatImage from '../../../../core/components/SxpPageRender/FormatImage';
12
12
  import { setFontForText } from '../../../../core/utils/tool';
13
13
  import CommodityGroup from '../../template/components/CommodityGroup';
14
14
  const CommodityDetailDiroNew = (_a) => {
15
- 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;
15
+ 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;
16
16
  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"]);
17
17
  const [spread, setSpread] = useState(true);
18
18
  const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = useSxpDataSource();
@@ -117,17 +117,17 @@ Made in Italy` })));
117
117
  };
118
118
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
119
119
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
120
- 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;
120
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
121
121
  return (React.createElement("div", { className: 'pb-commondityDiroNew' },
122
122
  React.createElement("div", Object.assign({ className: css(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
123
123
  React.createElement("div", { style: { position: 'relative' } },
124
- 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: {
124
+ 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: {
125
125
  clickable: true,
126
126
  bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
127
127
  clickableClass: getDotsAlign
128
128
  }, loop: true, autoplay: {
129
129
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
130
- }, ref: ref }, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
130
+ }, ref: ref }, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
131
131
  var _a;
132
132
  return (React.createElement(SwiperSlide, { key: src },
133
133
  React.createElement("div", { style: {
@@ -143,7 +143,7 @@ Made in Italy` })));
143
143
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
144
144
  }, 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 }))));
145
145
  }))),
146
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (React.createElement("div", { className: css({
146
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css({
147
147
  height,
148
148
  width
149
149
  }) },
@@ -151,7 +151,7 @@ Made in Italy` })));
151
151
  objectFit: 'cover',
152
152
  width: '100%',
153
153
  height: '100%'
154
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
154
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
155
155
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
156
156
  padding: '5px 10px',
157
157
  display: 'flex',
@@ -163,13 +163,13 @@ Made in Italy` })));
163
163
  background: '#fff',
164
164
  borderRadius: '3px'
165
165
  }, onClick: () => setShow3DModal(true) },
166
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
166
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
167
167
  renderCommodityGroup(),
168
168
  React.createElement("div", { className: 'pb-commondityDiroNew-content' },
169
169
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
170
170
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
171
171
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
172
- __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)
172
+ __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)
173
173
  } }),
174
174
  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: {
175
175
  __html: setFontForText((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -179,20 +179,20 @@ Made in Italy` })));
179
179
  __html: setFontForText(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
180
180
  } }),
181
181
  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: {
182
- __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)
182
+ __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)
183
183
  } }))),
184
- (!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 },
184
+ (!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 },
185
185
  React.createElement("span", { dangerouslySetInnerHTML: {
186
- __html: setFontForText((_6 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _6 !== void 0 ? _6 : 'Shop now', buttonStyle)
186
+ __html: setFontForText((_3 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _3 !== void 0 ? _3 : 'Shop now', buttonStyle)
187
187
  } }))),
188
188
  productInfoText({ isPost }))),
189
189
  React.createElement(Modal, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
190
190
  React.createElement(Modal, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
191
- React.createElement("div", { style: { height: '100vh' } },
191
+ React.createElement("div", { style: { height: window.innerHeight } },
192
192
  React.createElement("iframe", { src: iframeUrl, style: {
193
193
  width: '100%',
194
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
195
- marginTop: '40px',
194
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
195
+ marginTop: '50px',
196
196
  border: 'none'
197
197
  } })))));
198
198
  };
package/lib/core/components/SxpPageRender/Modal/index.js CHANGED
@@ -7,7 +7,7 @@ const ReactDOM = tslib_1.__importStar(require("react-dom"));
7
7
  const hooks_1 = require("../../../../core/hooks");
8
8
  const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
9
9
  const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
10
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
10
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
11
11
  const touchRef = (0, react_1.useRef)(null);
12
12
  const fTouchRef = (0, react_1.useRef)(null);
13
13
  const touchMoveRef = (0, react_1.useRef)(null);
@@ -129,8 +129,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
129
129
  react_1.default.createElement("div", { onClick: onClose, className: 'modal-icon-wrapper' },
130
130
  react_1.default.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: 'modal-icon' })),
131
131
  react_1.default.createElement("div", { ref: ref, style: {
132
- height: (_x = (isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H) -
133
- ((_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,
132
+ height: isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H,
134
133
  overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
135
134
  } }, children)))))), modalEleRef.current);
136
135
  };
package/lib/core/components/SxpPageRender/index.js CHANGED
@@ -193,7 +193,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
193
193
  return null;
194
194
  }
195
195
  });
196
- return !waterFallData && !isEditor ? list.concat([{ loading: true }]) : list;
196
+ return !waterFallData ? list.concat([{ loading: true }]) : list;
197
197
  }, [data, activeIndex, waterFallData, isEditor]);
198
198
  const renderLogo = (0, react_1.useMemo)(() => {
199
199
  var _a, _b, _c, _d;
package/lib/materials/sxp/popup/CommodityDetail/index.js CHANGED
@@ -14,7 +14,7 @@ const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/componen
14
14
  const tool_1 = require("../../../../core/utils/tool");
15
15
  const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
16
16
  const CommodityDetail = (_a) => {
17
- 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;
17
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
18
18
  var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
19
19
  const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = (0, hooks_1.useSxpDataSource)();
20
20
  const { jumpToWeb, productView } = (0, useEventReport_1.useEventReport)();
@@ -135,18 +135,18 @@ const CommodityDetail = (_a) => {
135
135
  };
136
136
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
137
137
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
138
- 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;
138
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
139
139
  return (react_1.default.createElement(react_1.default.Fragment, null,
140
140
  react_1.default.createElement("div", Object.assign({ className: (0, css_1.css)(Object.assign({}, style)) }, props),
141
141
  react_1.default.createElement("div", { style: { position: 'relative' } },
142
- product && ((_z = product === null || product === void 0 ? void 0 : product.homePage) === null || _z === void 0 ? void 0 : _z.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
142
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
143
143
  clickable: true,
144
144
  bulletActiveClass: 'swipe-item-active-bullet',
145
145
  clickableClass: getDotsAlign
146
146
  }, loop: true, autoplay: {
147
147
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
148
148
  }, ref: ref },
149
- react_1.default.createElement(react_1.default.Fragment, null, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
149
+ react_1.default.createElement(react_1.default.Fragment, null, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
150
150
  var _a;
151
151
  return (react_1.default.createElement(react_2.SwiperSlide, { key: src },
152
152
  react_1.default.createElement("div", { style: {
@@ -162,7 +162,7 @@ const CommodityDetail = (_a) => {
162
162
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
163
163
  }, 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 }))));
164
164
  })))),
165
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
165
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
166
166
  height,
167
167
  width
168
168
  }) },
@@ -170,7 +170,7 @@ const CommodityDetail = (_a) => {
170
170
  objectFit: 'cover',
171
171
  width: '100%',
172
172
  height: '100%'
173
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
173
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
174
174
  (iframeUrl || !product) && iframeIcon && (react_1.default.createElement("div", { style: {
175
175
  padding: '5px 10px',
176
176
  display: 'flex',
@@ -182,7 +182,7 @@ const CommodityDetail = (_a) => {
182
182
  background: '#fff',
183
183
  borderRadius: '3px'
184
184
  }, onClick: () => setShow3DModal(true) },
185
- react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
185
+ react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
186
186
  renderCommodityGroup(),
187
187
  react_1.default.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
188
188
  renderBtn(),
@@ -190,11 +190,11 @@ const CommodityDetail = (_a) => {
190
190
  react_1.default.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
191
191
  renderBtn()),
192
192
  react_1.default.createElement(Modal_1.default, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
193
- react_1.default.createElement("div", { style: { height: '100vh' } },
193
+ react_1.default.createElement("div", { style: { height: window.innerHeight } },
194
194
  react_1.default.createElement("iframe", { src: iframeUrl, style: {
195
195
  width: '100%',
196
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
197
- marginTop: '40px',
196
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
197
+ marginTop: '50px',
198
198
  border: 'none'
199
199
  } })))));
200
200
  };
package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js CHANGED
@@ -14,7 +14,7 @@ const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/componen
14
14
  const tool_1 = require("../../../../core/utils/tool");
15
15
  const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
16
16
  const CommodityDetailDiroNew = (_a) => {
17
- 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;
17
+ 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;
18
18
  var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
19
19
  const [spread, setSpread] = (0, react_1.useState)(true);
20
20
  const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = (0, hooks_1.useSxpDataSource)();
@@ -119,17 +119,17 @@ Made in Italy` })));
119
119
  };
120
120
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
121
121
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
122
- 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;
122
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
123
123
  return (react_1.default.createElement("div", { className: 'pb-commondityDiroNew' },
124
124
  react_1.default.createElement("div", Object.assign({ className: (0, css_1.css)(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
125
125
  react_1.default.createElement("div", { style: { position: 'relative' } },
126
- product && ((_z = product === null || product === void 0 ? void 0 : product.homePage) === null || _z === void 0 ? void 0 : _z.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
126
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
127
127
  clickable: true,
128
128
  bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
129
129
  clickableClass: getDotsAlign
130
130
  }, loop: true, autoplay: {
131
131
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
132
- }, ref: ref }, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
132
+ }, ref: ref }, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
133
133
  var _a;
134
134
  return (react_1.default.createElement(react_2.SwiperSlide, { key: src },
135
135
  react_1.default.createElement("div", { style: {
@@ -145,7 +145,7 @@ Made in Italy` })));
145
145
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
146
146
  }, 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 }))));
147
147
  }))),
148
- !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
148
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
149
149
  height,
150
150
  width
151
151
  }) },
@@ -153,7 +153,7 @@ Made in Italy` })));
153
153
  objectFit: 'cover',
154
154
  width: '100%',
155
155
  height: '100%'
156
- }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
156
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
157
157
  (iframeUrl || !product) && iframeIcon && (react_1.default.createElement("div", { style: {
158
158
  padding: '5px 10px',
159
159
  display: 'flex',
@@ -165,13 +165,13 @@ Made in Italy` })));
165
165
  background: '#fff',
166
166
  borderRadius: '3px'
167
167
  }, onClick: () => setShow3DModal(true) },
168
- react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
168
+ react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
169
169
  renderCommodityGroup(),
170
170
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content' },
171
171
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
172
172
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
173
173
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
174
- __html: (0, tool_1.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)
174
+ __html: (0, tool_1.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)
175
175
  } }),
176
176
  react_1.default.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: {
177
177
  __html: (0, tool_1.setFontForText)((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -181,20 +181,20 @@ Made in Italy` })));
181
181
  __html: (0, tool_1.setFontForText)(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
182
182
  } }),
183
183
  react_1.default.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: {
184
- __html: (0, tool_1.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)
184
+ __html: (0, tool_1.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)
185
185
  } }))),
186
- (!product || (product === null || product === void 0 ? void 0 : product.link)) && (react_1.default.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 },
186
+ (!product || (product === null || product === void 0 ? void 0 : product.link)) && (react_1.default.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 },
187
187
  react_1.default.createElement("span", { dangerouslySetInnerHTML: {
188
- __html: (0, tool_1.setFontForText)((_6 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _6 !== void 0 ? _6 : 'Shop now', buttonStyle)
188
+ __html: (0, tool_1.setFontForText)((_3 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _3 !== void 0 ? _3 : 'Shop now', buttonStyle)
189
189
  } }))),
190
190
  productInfoText({ isPost }))),
191
191
  react_1.default.createElement(Modal_1.default, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
192
192
  react_1.default.createElement(Modal_1.default, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
193
- react_1.default.createElement("div", { style: { height: '100vh' } },
193
+ react_1.default.createElement("div", { style: { height: window.innerHeight } },
194
194
  react_1.default.createElement("iframe", { src: iframeUrl, style: {
195
195
  width: '100%',
196
- height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
197
- marginTop: '40px',
196
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
197
+ marginTop: '50px',
198
198
  border: 'none'
199
199
  } })))));
200
200
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.3.3",
3
+ "version": "1.3.4",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",