pb-sxp-ui 1.18.2 → 1.19.0-alpha.2

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 (74) hide show
  1. package/dist/index.cjs +364 -252
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +7 -15
  4. package/dist/index.js +364 -252
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +6 -6
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +6 -6
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +364 -252
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +6 -6
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/DiyPortalPreview/index.js +3 -5
  15. package/es/core/components/DiyStoryPreview/index.js +18 -7
  16. package/es/core/components/SxpPageRender/RenderCard.d.ts +1 -0
  17. package/es/core/components/SxpPageRender/RenderCard.js +2 -14
  18. package/es/core/components/SxpPageRender/index.d.ts +1 -0
  19. package/es/core/components/SxpPageRender/index.js +98 -64
  20. package/es/core/context/SxpDataSourceProvider.d.ts +2 -0
  21. package/es/core/context/SxpDataSourceProvider.js +71 -27
  22. package/es/core/utils/tool.d.ts +3 -1
  23. package/es/core/utils/tool.js +29 -1
  24. package/es/materials/sxp/consentPopup/Display/index.js +1 -1
  25. package/es/materials/sxp/cta/AniLinkPopup/material.js +3 -2
  26. package/es/materials/sxp/popup/CommodityDetail/material.js +2 -1
  27. package/es/materials/sxp/popup/CommodityList/index.js +5 -4
  28. package/es/materials/sxp/popup/CommodityList/material.js +1 -1
  29. package/es/materials/sxp/popup/CommodityList/settingRender.js +1 -1
  30. package/es/materials/sxp/template/Appoint/material.js +2 -1
  31. package/es/materials/sxp/template/Commodity/material.js +3 -2
  32. package/es/materials/sxp/template/CommodityDiro/material.js +3 -2
  33. package/es/materials/sxp/template/CommodityDiroNew/material.js +4 -2
  34. package/es/materials/sxp/template/Link/material.js +4 -2
  35. package/es/materials/sxp/template/MultiCommodity/index.js +2 -2
  36. package/es/materials/sxp/template/MultiCommodity/material.js +2 -1
  37. package/es/materials/sxp/template/MultiCommodityDiro/index.js +2 -2
  38. package/es/materials/sxp/template/MultiCommodityDiro/material.js +3 -2
  39. package/es/materials/sxp/template/MultiCommodityDiroNew/index.js +2 -2
  40. package/es/materials/sxp/template/MultiCommodityDiroNew/material.js +4 -2
  41. package/es/materials/sxp/template/NineCommodity/material.js +3 -2
  42. package/es/materials/sxp/template/components/CommodityGroup.js +1 -1
  43. package/es/materials/sxp/template/components/settingRender.js +1 -1
  44. package/lib/core/components/DiyPortalPreview/index.js +3 -5
  45. package/lib/core/components/DiyStoryPreview/index.js +18 -7
  46. package/lib/core/components/SxpPageRender/RenderCard.d.ts +1 -0
  47. package/lib/core/components/SxpPageRender/RenderCard.js +2 -14
  48. package/lib/core/components/SxpPageRender/index.d.ts +1 -0
  49. package/lib/core/components/SxpPageRender/index.js +98 -64
  50. package/lib/core/context/SxpDataSourceProvider.d.ts +2 -0
  51. package/lib/core/context/SxpDataSourceProvider.js +71 -27
  52. package/lib/core/utils/tool.d.ts +3 -1
  53. package/lib/core/utils/tool.js +31 -1
  54. package/lib/materials/sxp/consentPopup/Display/index.js +1 -1
  55. package/lib/materials/sxp/cta/AniLinkPopup/material.js +2 -1
  56. package/lib/materials/sxp/popup/CommodityDetail/material.js +2 -1
  57. package/lib/materials/sxp/popup/CommodityList/index.js +5 -4
  58. package/lib/materials/sxp/popup/CommodityList/material.js +1 -1
  59. package/lib/materials/sxp/popup/CommodityList/settingRender.js +1 -1
  60. package/lib/materials/sxp/template/Appoint/material.js +2 -1
  61. package/lib/materials/sxp/template/Commodity/material.js +3 -2
  62. package/lib/materials/sxp/template/CommodityDiro/material.js +3 -2
  63. package/lib/materials/sxp/template/CommodityDiroNew/material.js +4 -2
  64. package/lib/materials/sxp/template/Link/material.js +4 -2
  65. package/lib/materials/sxp/template/MultiCommodity/index.js +2 -2
  66. package/lib/materials/sxp/template/MultiCommodity/material.js +2 -1
  67. package/lib/materials/sxp/template/MultiCommodityDiro/index.js +2 -2
  68. package/lib/materials/sxp/template/MultiCommodityDiro/material.js +3 -2
  69. package/lib/materials/sxp/template/MultiCommodityDiroNew/index.js +2 -2
  70. package/lib/materials/sxp/template/MultiCommodityDiroNew/material.js +4 -2
  71. package/lib/materials/sxp/template/NineCommodity/material.js +3 -2
  72. package/lib/materials/sxp/template/components/CommodityGroup.js +1 -1
  73. package/lib/materials/sxp/template/components/settingRender.js +1 -1
  74. package/package.json +1 -1
@@ -29,6 +29,7 @@ const ConsentPopup_1 = tslib_1.__importDefault(require("./ConsentPopup"));
29
29
  const MultiPosts_1 = tslib_1.__importDefault(require("../../../materials/sxp/MultiPosts"));
30
30
  const EditorDataProvider_1 = require("../../../core/context/EditorDataProvider");
31
31
  const NavBack_1 = tslib_1.__importDefault(require("./NavBack"));
32
+ const tool_1 = require("../../../core/utils/tool");
32
33
  const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], defaultData }) => {
33
34
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
34
35
  const mutedIcon = (0, useIconLink_1.useIconLink)('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
@@ -45,6 +46,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
45
46
  const skipLinkRef = (0, react_1.useRef)(false);
46
47
  const [pageNum, setPageNum] = (0, react_1.useState)(2);
47
48
  const videoWidgetRef = (0, react_1.useRef)(null);
49
+ const fbcRef = (0, react_1.useRef)('');
48
50
  const { loadVideos, bffEventReport, loading, setPopupDetailData, ctaEvent, swiperRef, waterFallData, setOpenHashtag, appDomain, openHashtag, loadingImage, isFromHashtag, popupDetailData, bffFbReport, curTime, h5EnterLink, isShowConsent, selectTag, isPreview, isEditor, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, isNoMoreData, channel, refreshFeSession, isDiyH5 } = (0, hooks_1.useSxpDataSource)();
49
51
  const { backMainFeed, productView, jumpToWeb } = (0, useEventReport_1.useEventReport)();
50
52
  const isShowFingerTip = (0, react_1.useMemo)(() => {
@@ -317,17 +319,17 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
317
319
  index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
318
320
  ((_f = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _f === void 0 ? void 0 : _f.includes((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type));
319
321
  return (react_1.default.createElement(react_1.default.Fragment, null,
320
- isNineProduct && (react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, isNineProduct: isNineProduct })),
322
+ isNineProduct && (react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
321
323
  ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) && !isShowMore && react_1.default.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
322
324
  react_1.default.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _j !== void 0 ? _j : 40}px` } },
323
325
  react_1.default.createElement(Nudge_1.default, { nudge: nudge }),
324
326
  ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)) && !isNineProduct ? (react_1.default.createElement("div", { className: 'clc-sxp-bottom-card' },
325
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex }))) : null,
326
- react_1.default.createElement("div", null,
327
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
328
+ react_1.default.createElement("div", { style: { display: 'flex', flexDirection: 'column' } },
327
329
  react_1.default.createElement(ExpandableText_1.default, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
328
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
330
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
329
331
  react_1.default.createElement(Hashtag_1.default, { index: activeIndex, tags: (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.hashTags) !== null && _o !== void 0 ? _o : [], itemId: (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.itemId, itemType: ((_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
330
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
332
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
331
333
  }
332
334
  return null;
333
335
  }, [
@@ -482,6 +484,35 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
482
484
  viewTime.current = new Date();
483
485
  }
484
486
  }, [openHashtag, data, activeIndex]);
487
+ (0, react_1.useEffect)(() => {
488
+ if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting))
489
+ return;
490
+ window.OptanonWrapper = function () {
491
+ var _a, _b;
492
+ const activeGroups = window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups;
493
+ if (!activeGroups)
494
+ return;
495
+ if (activeGroups === null || activeGroups === void 0 ? void 0 : activeGroups.includes('4')) {
496
+ if (fbcRef.current) {
497
+ (0, tool_1.setCookie)('_fbc', fbcRef.current, 90);
498
+ }
499
+ }
500
+ else {
501
+ fbcRef.current = (0, tool_1.getCookie)('_fbc');
502
+ (0, tool_1.deleteCookie)('_fbc');
503
+ const item = data[activeIndex];
504
+ const traceInfo = ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.traceInfo) || ((_b = item === null || item === void 0 ? void 0 : item.product) === null || _b === void 0 ? void 0 : _b.traceInfo) || '';
505
+ bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
506
+ eventInfo: {
507
+ eventSubject: 'refuseCookie',
508
+ eventDescription: 'refuseCookie',
509
+ traceInfo
510
+ },
511
+ isActiveTargetingCookie: false
512
+ });
513
+ }
514
+ };
515
+ }, [globalConfig, bffEventReport, data, activeIndex]);
485
516
  const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
486
517
  var _a, _b, _c, _d, _e, _f, _g, _h;
487
518
  const item = data[activeIndex];
@@ -565,66 +596,69 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
565
596
  isReload,
566
597
  renderToggleButton
567
598
  ]);
568
- return (react_1.default.createElement("div", { id: 'sxp-render', className: 'clc-sxp-container' }, (data === null || data === void 0 ? void 0 : data.length) < 1 && loading ? (react_1.default.createElement("div", { style: { height, width: containerWidth, display: 'flex', justifyContent: 'center', alignItems: 'center' } },
569
- react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (react_1.default.createElement("div", { style: Object.assign({}, ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.textUnderlineOffset) && { textUnderlineOffset: `${globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.textUnderlineOffset}px` })) },
570
- waterFallData && (react_1.default.createElement(Navbar_1.default, { icon: left_png_1.default, styles: { background: 'rgba(0,0,0,.3)', color: '#fff', top: `${minusHeight}px` }, textStyle: Object.assign(Object.assign({}, (_e = (_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.textStyles) === null || _e === void 0 ? void 0 : _e.hashTagTitle), { color: '#fff' }), onClose: () => {
571
- const isEq = (0, lodash_1.isEqual)(rtcList, cacheRtcList);
572
- if (!isEq && cacheRtcList && (cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.length)) {
573
- setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList(cacheRtcList);
574
- }
575
- setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
576
- } })),
577
- renderLogo,
578
- react_1.default.createElement(Tagbar_1.default, { tagList: tagList, setActiveIndex: setActiveIndex, style: {
579
- top: minusHeight
580
- } }),
581
- ((_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _f === void 0 ? void 0 : _f.enable) && !channel && !openMultiPosts && !waterFallData && (react_1.default.createElement(NavBack_1.default, { data: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => history === null || history === void 0 ? void 0 : history.back() })),
582
- ((((_l = (_k = (_j = (_h = (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _g === void 0 ? void 0 : _g[0]) === null || _h === void 0 ? void 0 : _h.item) === null || _j === void 0 ? void 0 : _j.props) === null || _k === void 0 ? void 0 : _k.backButton) === null || _l === void 0 ? void 0 : _l.enable) && channel) || openMultiPosts) &&
583
- !waterFallData && (react_1.default.createElement(NavBack_1.default, { data: (_q = (_p = (_o = (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _m === void 0 ? void 0 : _m[0]) === null || _o === void 0 ? void 0 : _o.item) === null || _p === void 0 ? void 0 : _p.props) === null || _q === void 0 ? void 0 : _q.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => {
584
- var _a, _b;
585
- const item = visList === null || visList === void 0 ? void 0 : visList[activeIndex];
586
- bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
587
- eventInfo: {
588
- eventSubject: 'backMultiPostClick',
589
- eventDescription: 'backMultiPostClick',
590
- traceInfo: ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.traceInfo) || ((_b = item === null || item === void 0 ? void 0 : item.product) === null || _b === void 0 ? void 0 : _b.traceInfo) || ''
599
+ return (react_1.default.createElement("div", { id: 'sxp-render', className: 'clc-sxp-container' },
600
+ (data === null || data === void 0 ? void 0 : data.length) < 1 && loading ? (react_1.default.createElement("div", { style: { height, width: containerWidth, display: 'flex', justifyContent: 'center', alignItems: 'center' } },
601
+ react_1.default.createElement("img", { width: 64, height: 64, src: loadingImage, alt: 'loading...', style: { objectFit: 'contain' } }))) : (react_1.default.createElement("div", { style: Object.assign({}, ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.textUnderlineOffset) && { textUnderlineOffset: `${globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.textUnderlineOffset}px` })) },
602
+ waterFallData && (react_1.default.createElement(Navbar_1.default, { icon: left_png_1.default, styles: { background: 'rgba(0,0,0,.3)', color: '#fff', top: `${minusHeight}px` }, textStyle: Object.assign(Object.assign({}, (_e = (_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.textStyles) === null || _e === void 0 ? void 0 : _e.hashTagTitle), { color: '#fff' }), onClose: () => {
603
+ const isEq = (0, lodash_1.isEqual)(rtcList, cacheRtcList);
604
+ if (!isEq && cacheRtcList && (cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.length)) {
605
+ setRtcList === null || setRtcList === void 0 ? void 0 : setRtcList(cacheRtcList);
591
606
  }
592
- });
593
- location === null || location === void 0 ? void 0 : location.reload();
594
- } })),
595
- isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _r !== void 0 ? _r : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
596
- react_1.default.createElement(react_2.Swiper, { style: {
597
- marginTop: tagHeight
598
- }, ref: swiperRef, onSlideChange: () => {
599
- swiperRef.current.swiper.allowTouchMove = false;
600
- setTimeout(() => {
601
- swiperRef.current.swiper.allowTouchMove = true;
602
- }, 500);
603
- }, onActiveIndexChange: (swiper) => {
604
- setActiveIndex(swiper.activeIndex);
605
- if (openHashtag)
606
- return;
607
- handleScrollEvent(swiper);
608
- if (waterFallData || isEditor || isDiyH5)
609
- return;
610
- if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
611
- if (!isLoadMore) {
612
- setIsLoadMore(true);
613
- loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
614
- var _a;
615
- setIsLoadMore(false);
616
- if (res && ((_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
617
- setPageNum(pageNum + 1);
618
- }
619
- });
607
+ setOpenHashtag === null || setOpenHashtag === void 0 ? void 0 : setOpenHashtag(true);
608
+ } })),
609
+ renderLogo,
610
+ react_1.default.createElement(Tagbar_1.default, { tagList: tagList, setActiveIndex: setActiveIndex, style: {
611
+ top: minusHeight
612
+ } }),
613
+ ((_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _f === void 0 ? void 0 : _f.enable) && !channel && !openMultiPosts && !waterFallData && (react_1.default.createElement(NavBack_1.default, { data: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => history === null || history === void 0 ? void 0 : history.back() })),
614
+ ((((_l = (_k = (_j = (_h = (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _g === void 0 ? void 0 : _g[0]) === null || _h === void 0 ? void 0 : _h.item) === null || _j === void 0 ? void 0 : _j.props) === null || _k === void 0 ? void 0 : _k.backButton) === null || _l === void 0 ? void 0 : _l.enable) && channel) || openMultiPosts) &&
615
+ !waterFallData && (react_1.default.createElement(NavBack_1.default, { data: (_q = (_p = (_o = (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _m === void 0 ? void 0 : _m[0]) === null || _o === void 0 ? void 0 : _o.item) === null || _p === void 0 ? void 0 : _p.props) === null || _q === void 0 ? void 0 : _q.backButton, minusHeight: minusHeight, tagHeight: tagHeight, onClick: () => {
616
+ var _a, _b;
617
+ const item = visList === null || visList === void 0 ? void 0 : visList[activeIndex];
618
+ bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
619
+ eventInfo: {
620
+ eventSubject: 'backMultiPostClick',
621
+ eventDescription: 'backMultiPostClick',
622
+ traceInfo: ((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.traceInfo) || ((_b = item === null || item === void 0 ? void 0 : item.product) === null || _b === void 0 ? void 0 : _b.traceInfo) || ''
623
+ }
624
+ });
625
+ location === null || location === void 0 ? void 0 : location.reload();
626
+ } })),
627
+ isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _r !== void 0 ? _r : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
628
+ react_1.default.createElement(react_2.Swiper, { style: {
629
+ marginTop: tagHeight
630
+ }, ref: swiperRef, onSlideChange: () => {
631
+ swiperRef.current.swiper.allowTouchMove = false;
632
+ setTimeout(() => {
633
+ swiperRef.current.swiper.allowTouchMove = true;
634
+ }, 500);
635
+ }, onActiveIndexChange: (swiper) => {
636
+ setActiveIndex(swiper.activeIndex);
637
+ if (openHashtag)
638
+ return;
639
+ handleScrollEvent(swiper);
640
+ if (waterFallData || isEditor || isDiyH5)
641
+ return;
642
+ if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
643
+ if (!isLoadMore) {
644
+ setIsLoadMore(true);
645
+ loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
646
+ var _a;
647
+ setIsLoadMore(false);
648
+ if (res && ((_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
649
+ setPageNum(pageNum + 1);
650
+ }
651
+ });
652
+ }
620
653
  }
621
- }
622
- }, direction: 'vertical', height: height },
623
- renderView,
624
- renderLikeButton(visList[activeIndex], activeIndex, !!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
625
- renderToggleButton(!!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed))),
626
- react_1.default.createElement(WaterFall_1.default, Object.assign({}, (_u = (_t = (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _s === void 0 ? void 0 : _s[0]) === null || _t === void 0 ? void 0 : _t.item) === null || _u === void 0 ? void 0 : _u.props)),
627
- react_1.default.createElement(ConsentPopup_1.default, { resolver: resolver, globalConfig: globalConfig }),
628
- openMultiPosts && (react_1.default.createElement(MultiPosts_1.default, Object.assign({}, (_x = (_w = (_v = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.item) === null || _x === void 0 ? void 0 : _x.props, (_0 = (_z = (_y = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _y === void 0 ? void 0 : _y[0]) === null || _z === void 0 ? void 0 : _z.item) === null || _0 === void 0 ? void 0 : _0.event, { style: { position: 'fixed', top: 0, left: 0, right: 0 } })))))));
654
+ }, direction: 'vertical', height: height },
655
+ renderView,
656
+ renderLikeButton(visList[activeIndex], activeIndex, !!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
657
+ renderToggleButton(!!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed))),
658
+ react_1.default.createElement(WaterFall_1.default, Object.assign({}, (_u = (_t = (_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _s === void 0 ? void 0 : _s[0]) === null || _t === void 0 ? void 0 : _t.item) === null || _u === void 0 ? void 0 : _u.props)),
659
+ react_1.default.createElement(ConsentPopup_1.default, { resolver: resolver, globalConfig: globalConfig }),
660
+ openMultiPosts && (react_1.default.createElement(MultiPosts_1.default, Object.assign({}, (_x = (_w = (_v = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.item) === null || _x === void 0 ? void 0 : _x.props, (_0 = (_z = (_y = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _y === void 0 ? void 0 : _y[0]) === null || _z === void 0 ? void 0 : _z.item) === null || _0 === void 0 ? void 0 : _0.event, { style: { position: 'fixed', top: 0, left: 0, right: 0 } }))))),
661
+ (window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) && (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableCookieSetting) && (react_1.default.createElement("div", { style: { position: 'fixed', bottom: 0, left: 0, right: 0, width: '100%', zIndex: 10, backgroundColor: '#000', fontSize: 0 } },
662
+ react_1.default.createElement("button", { id: 'ot-sdk-btn', className: 'ot-sdk-show-settings', style: { textDecoration: 'underline', width: 'fit-content', border: 'none', lineHeight: '24px', fontSize: '10px', color: '#fff', padding: '0 20px' } }, "Cookie settings")))));
629
663
  };
630
664
  exports.default = (0, react_1.memo)(SxpPageRender);
@@ -43,6 +43,8 @@ export interface ISxpDataSourceContext {
43
43
  bffEventReport?: (body: {
44
44
  userInfo?: object;
45
45
  eventInfo: object;
46
+ reportLayId?: boolean;
47
+ isActiveTargetingCookie?: boolean;
46
48
  }) => Promise<any> | undefined | boolean;
47
49
  isPreview?: boolean;
48
50
  loading?: boolean;
@@ -108,6 +108,38 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
108
108
  var _a;
109
109
  return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + (0, localStore_1.storeAndLoadFeUserId)();
110
110
  }, [bffDataSource]);
111
+ const getTargetingCookie = () => {
112
+ var _a;
113
+ function isTargetingRejected(cookieValue) {
114
+ const groupsMatch = cookieValue.match(/groups=([^&]+)/);
115
+ if (!groupsMatch || !groupsMatch[1]) {
116
+ return false;
117
+ }
118
+ const groupsString = groupsMatch[1];
119
+ const groupsPairs = groupsString.split(',');
120
+ for (const pair of groupsPairs) {
121
+ const [category, status] = pair.split(':');
122
+ if (category === '4') {
123
+ return status === '0';
124
+ }
125
+ }
126
+ return false;
127
+ }
128
+ function getCookie(name) {
129
+ var _a;
130
+ const value = `; ${document.cookie}`;
131
+ const parts = value.split(`; ${name}=`);
132
+ if (parts.length === 2)
133
+ return (_a = parts.pop()) === null || _a === void 0 ? void 0 : _a.split(';').shift();
134
+ return '';
135
+ }
136
+ const OptanonConsent = decodeURIComponent((_a = getCookie('OptanonConsent')) !== null && _a !== void 0 ? _a : '');
137
+ console.log('OptanonConsent:', window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups);
138
+ if (((window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) && !(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups.includes('4')))) {
139
+ return true;
140
+ }
141
+ return false;
142
+ };
111
143
  const bffFetch = (0, react_1.useCallback)((path, options, isBota = true) => {
112
144
  var _a;
113
145
  if (!bffDataSource)
@@ -135,6 +167,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
135
167
  }, [bffDataSource, fakeUserId]);
136
168
  const bffCollectEvent = (0, react_1.useCallback)((params) => {
137
169
  var _a;
170
+ if (getTargetingCookie())
171
+ return Promise.resolve();
138
172
  const body = {
139
173
  eventName: params === null || params === void 0 ? void 0 : params.eventName,
140
174
  eventSource: params === null || params === void 0 ? void 0 : params.eventSource
@@ -146,31 +180,32 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
146
180
  }, false);
147
181
  }, [bffFetch, bffDataSource]);
148
182
  (0, react_1.useEffect)(() => {
149
- if (typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
150
- const OriginalImage = window.Image;
151
- window.Image = function () {
152
- const img = new OriginalImage();
153
- const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
154
- Object.defineProperty(img, 'src', {
155
- set(value) {
156
- originalSrcDescriptor.set.call(this, value);
157
- if (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/')) {
158
- const url = new URL(value);
159
- const params = Object.fromEntries(url.searchParams.entries());
160
- bffCollectEvent({
161
- eventName: params === null || params === void 0 ? void 0 : params.ev,
162
- eventSource: 'Meta Pixel'
163
- });
164
- }
165
- ;
166
- },
167
- get() {
168
- return originalSrcDescriptor.get.call(this);
183
+ const OriginalImage = window.Image;
184
+ window.Image = function () {
185
+ const img = new OriginalImage();
186
+ const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
187
+ Object.defineProperty(img, 'src', {
188
+ set(value) {
189
+ if (getTargetingCookie() && (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/') || value.includes('https://www.facebook.com/tr'))) {
190
+ return;
169
191
  }
170
- });
171
- return img;
172
- };
173
- }
192
+ originalSrcDescriptor.set.call(this, value);
193
+ if (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/')) {
194
+ const url = new URL(value);
195
+ const params = Object.fromEntries(url.searchParams.entries());
196
+ bffCollectEvent({
197
+ eventName: params === null || params === void 0 ? void 0 : params.ev,
198
+ eventSource: 'Meta Pixel'
199
+ });
200
+ }
201
+ ;
202
+ },
203
+ get() {
204
+ return originalSrcDescriptor.get.call(this);
205
+ }
206
+ });
207
+ return img;
208
+ };
174
209
  }, [bffCollectEvent]);
175
210
  (0, react_1.useEffect)(() => {
176
211
  const navigatorWithBeacon = navigator;
@@ -181,6 +216,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
181
216
  const originalSendBeacon = navigatorWithBeacon.sendBeacon.bind(navigatorWithBeacon);
182
217
  navigatorWithBeacon.sendBeacon = function (url, data) {
183
218
  const urlString = url instanceof URL ? url.href : url.toString();
219
+ if (getTargetingCookie() && (urlString.includes('https://tr.snapchat.com/p') || urlString.includes('https://analytics.tiktok.com/api/v2/pixel'))) {
220
+ return true;
221
+ }
184
222
  const success = originalSendBeacon(url, data);
185
223
  function parseBeaconData(data) {
186
224
  return tslib_1.__awaiter(this, void 0, void 0, function* () {
@@ -246,6 +284,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
246
284
  return _originalFetch.apply(this, arguments_1);
247
285
  }
248
286
  try {
287
+ if (getTargetingCookie() && (url.includes('https://www.google-analytics.com/g/collect') || url.includes('https://arms-retcode.aliyuncs.com/r.png'))) {
288
+ return Promise.resolve(new Response(''));
289
+ }
249
290
  const response = _originalFetch.apply(this, arguments_1);
250
291
  if (url.includes('https://www.google-analytics.com/g/collect')) {
251
292
  const urlObj = new URL(url);
@@ -297,6 +338,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
297
338
  };
298
339
  XMLHttpRequest.prototype.send = function (body) {
299
340
  var _a;
341
+ if (getTargetingCookie() && this._url && typeof this._url === 'string' && (this._url.includes('https://rumcollector.uptime.com') || this._url.includes('https://arms-retcode.aliyuncs.com/r.png') || this._url.includes('https://i.giesswein.com/nb-collector'))) {
342
+ return;
343
+ }
300
344
  if (this._url && typeof this._url === 'string' && this._url.includes('https://i.giesswein.com/nb-collector')) {
301
345
  if (body && typeof body === 'string') {
302
346
  try {
@@ -447,9 +491,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
447
491
  }
448
492
  return expire;
449
493
  }, [data]);
450
- const bffEventReport = (0, react_1.useCallback)(({ userInfo, eventInfo, reportLayId = true }) => {
494
+ const bffEventReport = (0, react_1.useCallback)(({ userInfo, eventInfo, reportLayId = true, isActiveTargetingCookie = true }) => {
451
495
  var _a, _b;
452
- if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
496
+ if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || (isActiveTargetingCookie && getTargetingCookie())) {
453
497
  return;
454
498
  }
455
499
  if (!userInfo) {
@@ -551,7 +595,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
551
595
  }, [fakeUserId]);
552
596
  const bffFbReport = (0, react_1.useCallback)(({ eventName, product }) => {
553
597
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
554
- if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
598
+ if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || getTargetingCookie()) {
555
599
  return;
556
600
  }
557
601
  let isPushState = false;
@@ -13,4 +13,6 @@ declare function getDevice(): string | null;
13
13
  declare function getCookie(val: string): string;
14
14
  declare function getScreenReader(): boolean;
15
15
  declare function splitUrlParams(urlParams: string): string[] | undefined;
16
- export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams };
16
+ declare function deleteCookie(name: string, path?: string, domain?: string): void;
17
+ declare function setCookie(name: string, value: string, days?: number, path?: string, domain?: string, secure?: boolean, sameSite?: string): void;
18
+ export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams, deleteCookie, setCookie };
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.splitUrlParams = exports.getScreenReader = exports.getCookie = exports.getSystem = exports.getDevice = exports.getBrowserInfo = exports.getIndexByblockType = exports.uuid = exports.setFontForText = exports.getUid = exports.generateRandomString = void 0;
3
+ exports.setCookie = exports.deleteCookie = exports.splitUrlParams = exports.getScreenReader = exports.getCookie = exports.getSystem = exports.getDevice = exports.getBrowserInfo = exports.getIndexByblockType = exports.uuid = exports.setFontForText = exports.getUid = exports.generateRandomString = void 0;
4
4
  const uuid_1 = require("uuid");
5
5
  function uuid(len, radix) {
6
6
  const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
@@ -205,3 +205,33 @@ function splitUrlParams(urlParams) {
205
205
  return splitList !== null && splitList !== void 0 ? splitList : [];
206
206
  }
207
207
  exports.splitUrlParams = splitUrlParams;
208
+ function deleteCookie(name, path = '/', domain = '') {
209
+ const expiration = 'expires=Thu, 01 Jan 1970 00:00:00 GMT';
210
+ const pathPart = path ? `; path=${path}` : '';
211
+ const domainPart = domain ? `; domain=${domain}` : '';
212
+ document.cookie = `${name}=; ${expiration}${pathPart}${domainPart}`;
213
+ console.log(`已尝试删除Cookie: ${name}`);
214
+ }
215
+ exports.deleteCookie = deleteCookie;
216
+ function setCookie(name, value, days = 0, path = '/', domain = '', secure = false, sameSite = 'Lax') {
217
+ let cookieString = `${encodeURIComponent(name)}=${encodeURIComponent(value)}`;
218
+ if (days) {
219
+ const date = new Date();
220
+ date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
221
+ cookieString += `; expires=${date.toUTCString()}`;
222
+ }
223
+ if (path) {
224
+ cookieString += `; path=${path}`;
225
+ }
226
+ if (domain) {
227
+ cookieString += `; domain=${domain}`;
228
+ }
229
+ if (secure) {
230
+ cookieString += '; secure';
231
+ }
232
+ if (sameSite) {
233
+ cookieString += `; samesite=${sameSite}`;
234
+ }
235
+ document.cookie = cookieString;
236
+ }
237
+ exports.setCookie = setCookie;
@@ -28,7 +28,7 @@ const Display = (_a) => {
28
28
  react_1.default.createElement("span", { style: content === null || content === void 0 ? void 0 : content.style, dangerouslySetInnerHTML: {
29
29
  __html: (0, tool_1.setFontForText)((_b = content === null || content === void 0 ? void 0 : content.text) === null || _b === void 0 ? void 0 : _b.replace(/\n/g, '</br>'), content === null || content === void 0 ? void 0 : content.style)
30
30
  } }),
31
- react_1.default.createElement("span", { style: Object.assign(Object.assign({}, interaction === null || interaction === void 0 ? void 0 : interaction.style), { marginInlineStart: '5px' }), dangerouslySetInnerHTML: {
31
+ react_1.default.createElement("span", { style: Object.assign(Object.assign({}, interaction === null || interaction === void 0 ? void 0 : interaction.style), { marginLeft: '5px' }), dangerouslySetInnerHTML: {
32
32
  __html: (0, tool_1.setFontForText)((_c = interaction === null || interaction === void 0 ? void 0 : interaction.text) === null || _c === void 0 ? void 0 : _c.replace(/\n/g, '</br>'), interaction === null || interaction === void 0 ? void 0 : interaction.style)
33
33
  }, onClick: handleClick })),
34
34
  isShowClose && (react_1.default.createElement("button", { "aria-label": 'close', className: 'consentPopupDisplay-close', onClick: handleClickClose },
@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.AniLinkPopup = void 0;
4
4
  const tslib_1 = require("tslib");
5
5
  const settingRender_1 = tslib_1.__importDefault(require("./settingRender"));
6
- const interactionRender_1 = tslib_1.__importDefault(require("./interactionRender"));
7
6
  const _1 = tslib_1.__importDefault(require("."));
8
7
  const create_1 = require("../../../../core/create");
8
+ const interactionRender_1 = tslib_1.__importDefault(require("./interactionRender"));
9
9
  const AniLinkPopup = (0, create_1.createMaterial)(_1.default, {
10
10
  displayName: '竖版弹窗CTA',
11
11
  icon: '',
@@ -28,6 +28,7 @@ const AniLinkPopup = (0, create_1.createMaterial)(_1.default, {
28
28
  title: {
29
29
  fontSize: 14,
30
30
  color: '#000',
31
+ textAlign: 'left',
31
32
  lineHeight: 2.6
32
33
  },
33
34
  ctaTitle: {
@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.CommodityDetail = void 0;
4
4
  const tslib_1 = require("tslib");
5
5
  const settingRender_1 = tslib_1.__importDefault(require("./settingRender"));
6
- const interactionRender_1 = tslib_1.__importDefault(require("./interactionRender"));
7
6
  const _1 = tslib_1.__importDefault(require("."));
8
7
  const create_1 = require("../../../../core/create");
8
+ const interactionRender_1 = tslib_1.__importDefault(require("./interactionRender"));
9
9
  const CommodityDetail = (0, create_1.createMaterial)(_1.default, {
10
10
  displayName: '商品详情',
11
11
  icon: '',
@@ -44,6 +44,7 @@ const CommodityDetail = (0, create_1.createMaterial)(_1.default, {
44
44
  taxInfo: {
45
45
  color: '#000',
46
46
  fontSize: 13,
47
+ textAlign: 'left',
47
48
  marginBottom: '10px'
48
49
  }
49
50
  },
@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const css_1 = require("@emotion/css");
5
5
  const react_1 = tslib_1.__importStar(require("react"));
6
- const lodash_1 = require("lodash");
7
- const Img_1 = tslib_1.__importDefault(require("../../template/components/Img"));
8
6
  const hooks_1 = require("../../../../core/hooks");
9
7
  require("./index.less");
10
8
  const useEventReport_1 = require("../../../../core/hooks/useEventReport");
11
9
  const tool_1 = require("../../../../core/utils/tool");
10
+ const Img_1 = tslib_1.__importDefault(require("../../template/components/Img"));
11
+ const lodash_1 = require("lodash");
12
12
  const materials_1 = require("../../../../core/utils/materials");
13
13
  const CommodityList = (_a) => {
14
14
  var _b, _c, _d;
@@ -55,11 +55,12 @@ const CommodityList = (_a) => {
55
55
  react_1.default.createElement("button", Object.assign({ role: 'button', "aria-label": item === null || item === void 0 ? void 0 : item.title, tabIndex: 0, className: (0, css_1.css)({
56
56
  display: 'flex',
57
57
  alignItems: 'normal',
58
- width: '100%'
58
+ width: '100%',
59
+ textAlign: 'left'
59
60
  }) }, props),
60
61
  react_1.default.createElement(Img_1.default, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: commodityPicture, enableEventReport: false }),
61
62
  react_1.default.createElement("div", { style: {
62
- width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginInlineEnd) !== null && _f !== void 0 ? _f : 0}px)`,
63
+ width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginRight) !== null && _f !== void 0 ? _f : 0}px)`,
63
64
  display: 'flex',
64
65
  flexDirection: 'column',
65
66
  justifyContent: 'space-between'
@@ -20,7 +20,7 @@ const CommodityList = (0, create_1.createMaterial)(_1.default, {
20
20
  commodityPicture: {
21
21
  width: 100,
22
22
  height: 100,
23
- marginInlineEnd: 10
23
+ marginRight: 10
24
24
  },
25
25
  commodityStyles: {
26
26
  price: {
@@ -73,7 +73,7 @@ exports.default = [
73
73
  type: 'Number',
74
74
  label: '与右侧边距',
75
75
  addonAfter: 'px',
76
- name: ['props', 'commodityPicture', 'marginInlineEnd']
76
+ name: ['props', 'commodityPicture', 'marginRight']
77
77
  },
78
78
  {
79
79
  label: '居中垂直偏移',
@@ -23,11 +23,12 @@ const Appoint = (0, create_1.createMaterial)(_1.default, {
23
23
  borderRadius: 3,
24
24
  width: 30,
25
25
  height: 30,
26
- marginInlineEnd: 8
26
+ marginRight: 8
27
27
  },
28
28
  ctaTitle: {
29
29
  fontSize: 12,
30
30
  color: '#fff',
31
+ textAlign: 'left',
31
32
  width: 130,
32
33
  height: 20
33
34
  }
@@ -23,11 +23,12 @@ const Commodity = (0, create_1.createMaterial)(_1.default, {
23
23
  borderRadius: 3,
24
24
  width: 60,
25
25
  height: 60,
26
- marginInlineEnd: 8
26
+ marginRight: 8
27
27
  },
28
28
  title: {
29
29
  fontSize: 12,
30
- color: '#fff'
30
+ color: '#fff',
31
+ textAlign: 'left'
31
32
  },
32
33
  ctaTitle: {
33
34
  fontSize: 10,
@@ -23,11 +23,12 @@ const CommodityDiro = (0, create_1.createMaterial)(_1.default, {
23
23
  borderRadius: 3,
24
24
  width: 60,
25
25
  height: 60,
26
- marginInlineEnd: 8
26
+ marginRight: 8
27
27
  },
28
28
  title: {
29
29
  fontSize: 12,
30
- color: '#000'
30
+ color: '#000',
31
+ textAlign: 'left'
31
32
  },
32
33
  ctaTitle: {
33
34
  fontSize: 10,
@@ -23,17 +23,19 @@ const CommodityDiroNew = (0, create_1.createMaterial)(_1.default, {
23
23
  borderRadius: 8,
24
24
  width: 78,
25
25
  height: 78,
26
- marginInlineEnd: 16
26
+ marginRight: 16
27
27
  },
28
28
  title: {
29
29
  fontSize: 13,
30
- color: '#000'
30
+ color: '#000',
31
+ textAlign: 'left'
31
32
  },
32
33
  ctaTitle: {
33
34
  textDecoration: 'underline',
34
35
  fontSize: 14,
35
36
  fontWeight: 'bold',
36
37
  color: '#000',
38
+ textAlign: 'left',
37
39
  width: 150,
38
40
  height: 20
39
41
  }