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.
- package/dist/index.cjs +29 -30
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +29 -30
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +29 -30
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/Modal/index.js +2 -3
- package/es/core/components/SxpPageRender/index.js +1 -1
- package/es/materials/sxp/popup/CommodityDetail/index.js +10 -10
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +14 -14
- package/lib/core/components/SxpPageRender/Modal/index.js +2 -3
- package/lib/core/components/SxpPageRender/index.js +1 -1
- package/lib/materials/sxp/popup/CommodityDetail/index.js +10 -10
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +14 -14
- package/package.json +1 -1
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-
|
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
|
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:
|
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
|
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 =
|
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 && ((
|
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, (
|
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
|
-
!((
|
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,7 +9286,7 @@ const CommodityDetail$1 = (_a) => {
|
|
9287
9286
|
objectFit: 'cover',
|
9288
9287
|
width: '100%',
|
9289
9288
|
height: '100%'
|
9290
|
-
}), src: (
|
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
9291
|
padding: '5px 10px',
|
9293
9292
|
display: 'flex',
|
@@ -9299,7 +9298,7 @@ const CommodityDetail$1 = (_a) => {
|
|
9299
9298
|
background: '#fff',
|
9300
9299
|
borderRadius: '3px'
|
9301
9300
|
}, onClick: () => setShow3DModal(true) },
|
9302
|
-
React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px'
|
9301
|
+
React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
|
9303
9302
|
renderCommodityGroup(),
|
9304
9303
|
React.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
|
9305
9304
|
renderBtn(),
|
@@ -9307,11 +9306,11 @@ const CommodityDetail$1 = (_a) => {
|
|
9307
9306
|
React.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
|
9308
9307
|
renderBtn()),
|
9309
9308
|
React.createElement(Modal$1, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
|
9310
|
-
React.createElement("div", { style: { height:
|
9309
|
+
React.createElement("div", { style: { height: window.innerHeight } },
|
9311
9310
|
React.createElement("iframe", { src: iframeUrl, style: {
|
9312
9311
|
width: '100%',
|
9313
|
-
height: isTel ? `${664 -
|
9314
|
-
marginTop: '
|
9312
|
+
height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
|
9313
|
+
marginTop: '50px',
|
9315
9314
|
border: 'none'
|
9316
9315
|
} })))));
|
9317
9316
|
};
|
@@ -9966,7 +9965,7 @@ var settingRender$7 = [
|
|
9966
9965
|
];
|
9967
9966
|
|
9968
9967
|
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
|
9968
|
+
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
9969
|
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
9970
|
React.useState(true);
|
9972
9971
|
const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = useSxpDataSource();
|
@@ -10118,17 +10117,17 @@ Made in Italy` })));
|
|
10118
10117
|
};
|
10119
10118
|
return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
|
10120
10119
|
}, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
|
10121
|
-
const iframeUrl =
|
10120
|
+
const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
|
10122
10121
|
return (React.createElement("div", { className: 'pb-commondityDiroNew' },
|
10123
10122
|
React.createElement("div", Object.assign({ className: css.css(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
|
10124
10123
|
React.createElement("div", { style: { position: 'relative' } },
|
10125
|
-
product && ((
|
10124
|
+
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
10125
|
clickable: true,
|
10127
10126
|
bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
|
10128
10127
|
clickableClass: getDotsAlign
|
10129
10128
|
}, loop: true, autoplay: {
|
10130
10129
|
delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
|
10131
|
-
}, ref: ref }, (
|
10130
|
+
}, ref: ref }, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
|
10132
10131
|
var _a;
|
10133
10132
|
return (React.createElement(SwiperSlide, { key: src },
|
10134
10133
|
React.createElement("div", { style: {
|
@@ -10144,7 +10143,7 @@ Made in Italy` })));
|
|
10144
10143
|
objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
|
10145
10144
|
}, 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
10145
|
}))),
|
10147
|
-
!((
|
10146
|
+
!((_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
10147
|
height,
|
10149
10148
|
width
|
10150
10149
|
}) },
|
@@ -10152,7 +10151,7 @@ Made in Italy` })));
|
|
10152
10151
|
objectFit: 'cover',
|
10153
10152
|
width: '100%',
|
10154
10153
|
height: '100%'
|
10155
|
-
}), src: (
|
10154
|
+
}), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
|
10156
10155
|
(iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
|
10157
10156
|
padding: '5px 10px',
|
10158
10157
|
display: 'flex',
|
@@ -10164,13 +10163,13 @@ Made in Italy` })));
|
|
10164
10163
|
background: '#fff',
|
10165
10164
|
borderRadius: '3px'
|
10166
10165
|
}, onClick: () => setShow3DModal(true) },
|
10167
|
-
React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px'
|
10166
|
+
React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
|
10168
10167
|
renderCommodityGroup(),
|
10169
10168
|
React.createElement("div", { className: 'pb-commondityDiroNew-content' },
|
10170
10169
|
React.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
|
10171
10170
|
React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
|
10172
10171
|
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((
|
10172
|
+
__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
10173
|
} }),
|
10175
10174
|
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
10175
|
__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 +10179,20 @@ Made in Italy` })));
|
|
10180
10179
|
__html: setFontForText(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
|
10181
10180
|
} }),
|
10182
10181
|
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((
|
10182
|
+
__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
10183
|
} }))),
|
10185
|
-
(!product || (product === null || product === void 0 ? void 0 : product.link)) && (React.createElement("button", { "aria-label": (
|
10184
|
+
(!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
10185
|
React.createElement("span", { dangerouslySetInnerHTML: {
|
10187
|
-
__html: setFontForText((
|
10186
|
+
__html: setFontForText((_3 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _3 !== void 0 ? _3 : 'Shop now', buttonStyle)
|
10188
10187
|
} }))),
|
10189
10188
|
productInfoText({ isPost }))),
|
10190
10189
|
React.createElement(Modal$1, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
|
10191
10190
|
React.createElement(Modal$1, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
|
10192
|
-
React.createElement("div", { style: { height:
|
10191
|
+
React.createElement("div", { style: { height: window.innerHeight } },
|
10193
10192
|
React.createElement("iframe", { src: iframeUrl, style: {
|
10194
10193
|
width: '100%',
|
10195
|
-
height: isTel ? `${664 -
|
10196
|
-
marginTop: '
|
10194
|
+
height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
|
10195
|
+
marginTop: '50px',
|
10197
10196
|
border: 'none'
|
10198
10197
|
} })))));
|
10199
10198
|
};
|
@@ -16029,7 +16028,7 @@ var Tagbar$1 = React.memo(Tagbar);
|
|
16029
16028
|
* @Author: binruan@chatlabs.com
|
16030
16029
|
* @Date: 2024-01-15 19:03:09
|
16031
16030
|
* @LastEditors: binruan@chatlabs.com
|
16032
|
-
* @LastEditTime: 2024-08-22
|
16031
|
+
* @LastEditTime: 2024-08-22 18:34:01
|
16033
16032
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
16034
16033
|
*
|
16035
16034
|
*/
|
@@ -16205,7 +16204,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
16205
16204
|
return null;
|
16206
16205
|
}
|
16207
16206
|
});
|
16208
|
-
return !waterFallData
|
16207
|
+
return !waterFallData ? list.concat([{ loading: true }]) : list;
|
16209
16208
|
}, [data, activeIndex, waterFallData, isEditor]);
|
16210
16209
|
const renderLogo = React.useMemo(() => {
|
16211
16210
|
var _a, _b, _c, _d;
|