pb-sxp-ui 1.0.69 → 1.0.70

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 (104) hide show
  1. package/dist/index.cjs +250 -130
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +1 -2
  4. package/dist/index.js +250 -130
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +3 -3
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +3 -3
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +253 -133
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +3 -3
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/DiyPortalPreview/VideoWidget.js +3 -2
  15. package/es/core/components/SxpPageCore/index.js +2 -2
  16. package/es/core/components/SxpPageRender/FingerSwipeTip/index.d.ts +2 -1
  17. package/es/core/components/SxpPageRender/FingerSwipeTip/index.js +2 -2
  18. package/es/core/components/SxpPageRender/FormatImage.js +1 -2
  19. package/es/core/components/SxpPageRender/VideoWidget/index.js +1 -1
  20. package/es/core/components/SxpPageRender/index.d.ts +5 -0
  21. package/es/core/components/SxpPageRender/index.js +14 -20
  22. package/es/core/context/SxpDataSourceProvider.d.ts +0 -1
  23. package/es/core/context/SxpDataSourceProvider.js +3 -3
  24. package/es/materials/sxp/defaultSetting.d.ts +1 -4
  25. package/es/materials/sxp/defaultSetting.js +4 -5
  26. package/es/materials/sxp/popup/AppointForm/index.d.ts +2 -1
  27. package/es/materials/sxp/popup/AppointForm/index.js +3 -8
  28. package/es/materials/sxp/popup/AppointForm/settingRender.d.ts +29 -8
  29. package/es/materials/sxp/popup/AppointForm/settingRender.js +33 -2
  30. package/es/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
  31. package/es/materials/sxp/popup/CommodityDetail/index.js +7 -1
  32. package/es/materials/sxp/popup/CommodityDetail/material.js +5 -2
  33. package/es/materials/sxp/popup/CommodityDetail/settingRender.d.ts +28 -0
  34. package/es/materials/sxp/popup/CommodityDetail/settingRender.js +30 -0
  35. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.d.ts +1 -0
  36. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
  37. package/es/materials/sxp/popup/CommodityDetailDiroNew/settingRender.d.ts +16 -0
  38. package/es/materials/sxp/popup/CommodityDetailDiroNew/settingRender.js +13 -0
  39. package/es/materials/sxp/popup/Prompt/index.d.ts +2 -1
  40. package/es/materials/sxp/popup/Prompt/index.js +2 -2
  41. package/es/materials/sxp/popup/Prompt/settingRender.d.ts +46 -11
  42. package/es/materials/sxp/popup/Prompt/settingRender.js +57 -14
  43. package/es/materials/sxp/template/Commodity/index.d.ts +1 -0
  44. package/es/materials/sxp/template/Commodity/index.js +8 -2
  45. package/es/materials/sxp/template/CommodityDiro/index.d.ts +1 -0
  46. package/es/materials/sxp/template/CommodityDiro/index.js +8 -2
  47. package/es/materials/sxp/template/CommodityDiroNew/index.d.ts +1 -0
  48. package/es/materials/sxp/template/CommodityDiroNew/index.js +8 -2
  49. package/es/materials/sxp/template/MultiCommodity/index.d.ts +1 -0
  50. package/es/materials/sxp/template/MultiCommodity/index.js +4 -2
  51. package/es/materials/sxp/template/MultiCommodityDiro/index.d.ts +1 -0
  52. package/es/materials/sxp/template/MultiCommodityDiro/index.js +4 -2
  53. package/es/materials/sxp/template/MultiCommodityDiroNew/index.d.ts +1 -0
  54. package/es/materials/sxp/template/MultiCommodityDiroNew/index.js +4 -2
  55. package/es/materials/sxp/template/components/Img.d.ts +2 -1
  56. package/es/materials/sxp/template/components/Img.js +2 -2
  57. package/es/materials/sxp/template/components/settingRender.d.ts +50 -0
  58. package/es/materials/sxp/template/components/settingRender.js +8 -0
  59. package/lib/core/components/DiyPortalPreview/VideoWidget.js +3 -2
  60. package/lib/core/components/SxpPageCore/index.js +2 -2
  61. package/lib/core/components/SxpPageRender/FingerSwipeTip/index.d.ts +2 -1
  62. package/lib/core/components/SxpPageRender/FingerSwipeTip/index.js +2 -2
  63. package/lib/core/components/SxpPageRender/FormatImage.js +0 -1
  64. package/lib/core/components/SxpPageRender/VideoWidget/index.js +1 -1
  65. package/lib/core/components/SxpPageRender/index.d.ts +5 -0
  66. package/lib/core/components/SxpPageRender/index.js +14 -20
  67. package/lib/core/context/SxpDataSourceProvider.d.ts +0 -1
  68. package/lib/core/context/SxpDataSourceProvider.js +3 -3
  69. package/lib/materials/sxp/defaultSetting.d.ts +1 -4
  70. package/lib/materials/sxp/defaultSetting.js +4 -5
  71. package/lib/materials/sxp/popup/AppointForm/index.d.ts +2 -1
  72. package/lib/materials/sxp/popup/AppointForm/index.js +3 -8
  73. package/lib/materials/sxp/popup/AppointForm/settingRender.d.ts +29 -8
  74. package/lib/materials/sxp/popup/AppointForm/settingRender.js +34 -2
  75. package/lib/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
  76. package/lib/materials/sxp/popup/CommodityDetail/index.js +7 -1
  77. package/lib/materials/sxp/popup/CommodityDetail/material.js +5 -2
  78. package/lib/materials/sxp/popup/CommodityDetail/settingRender.d.ts +28 -0
  79. package/lib/materials/sxp/popup/CommodityDetail/settingRender.js +30 -0
  80. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.d.ts +1 -0
  81. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
  82. package/lib/materials/sxp/popup/CommodityDetailDiroNew/settingRender.d.ts +16 -0
  83. package/lib/materials/sxp/popup/CommodityDetailDiroNew/settingRender.js +13 -0
  84. package/lib/materials/sxp/popup/Prompt/index.d.ts +2 -1
  85. package/lib/materials/sxp/popup/Prompt/index.js +2 -2
  86. package/lib/materials/sxp/popup/Prompt/settingRender.d.ts +46 -11
  87. package/lib/materials/sxp/popup/Prompt/settingRender.js +58 -14
  88. package/lib/materials/sxp/template/Commodity/index.d.ts +1 -0
  89. package/lib/materials/sxp/template/Commodity/index.js +8 -2
  90. package/lib/materials/sxp/template/CommodityDiro/index.d.ts +1 -0
  91. package/lib/materials/sxp/template/CommodityDiro/index.js +8 -2
  92. package/lib/materials/sxp/template/CommodityDiroNew/index.d.ts +1 -0
  93. package/lib/materials/sxp/template/CommodityDiroNew/index.js +8 -2
  94. package/lib/materials/sxp/template/MultiCommodity/index.d.ts +1 -0
  95. package/lib/materials/sxp/template/MultiCommodity/index.js +4 -2
  96. package/lib/materials/sxp/template/MultiCommodityDiro/index.d.ts +1 -0
  97. package/lib/materials/sxp/template/MultiCommodityDiro/index.js +4 -2
  98. package/lib/materials/sxp/template/MultiCommodityDiroNew/index.d.ts +1 -0
  99. package/lib/materials/sxp/template/MultiCommodityDiroNew/index.js +4 -2
  100. package/lib/materials/sxp/template/components/Img.d.ts +2 -1
  101. package/lib/materials/sxp/template/components/Img.js +2 -2
  102. package/lib/materials/sxp/template/components/settingRender.d.ts +50 -0
  103. package/lib/materials/sxp/template/components/settingRender.js +8 -0
  104. package/package.json +2 -3
package/dist/pb-ui.js CHANGED
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('lodash'), require('uuid'), require('pako'), require('react'), require('qs'), require('eventemitter3'), require('@emotion/css'), require('@ant-design/pro-components'), require('react-dom')) :
3
- typeof define === 'function' && define.amd ? define(['exports', 'lodash', 'uuid', 'pako', 'react', 'qs', 'eventemitter3', '@emotion/css', '@ant-design/pro-components', 'react-dom'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PUI = {}, global.lodash, global.uuid$1, global.pako, global.React, global.qs, global.EventEmitter, global.css, global.proComponents, global.ReactDOM));
5
- })(this, (function (exports, lodash, uuid$1, pako, React, qs, EventEmitter, css, proComponents, ReactDOM) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('lodash'), require('uuid'), require('pako'), require('react'), require('qs'), require('eventemitter3'), require('@emotion/css'), require('react-dom'), require('hls.js')) :
3
+ typeof define === 'function' && define.amd ? define(['exports', 'lodash', 'uuid', 'pako', 'react', 'qs', 'eventemitter3', '@emotion/css', 'react-dom', 'hls.js'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PUI = {}, global.lodash, global.uuid$1, global.pako, global.React, global.qs, global.EventEmitter, global.css, global.ReactDOM, global.Hls));
5
+ })(this, (function (exports, lodash, uuid$1, pako, React, qs, EventEmitter, css, ReactDOM, Hls) { 'use strict';
6
6
 
7
7
  function _interopNamespaceDefault(e) {
8
8
  var n = Object.create(null);
@@ -438,7 +438,7 @@
438
438
  DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
439
439
  })(DataSourceType || (DataSourceType = {}));
440
440
  const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
441
- const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, isShowTag = true }) => {
441
+ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false }) => {
442
442
  const [rtcList, setRtcList] = React.useState([]);
443
443
  const [tagList, setTagList] = React.useState([]);
444
444
  const [loading, setLoading] = React.useState(false);
@@ -592,7 +592,7 @@
592
592
  // 获取 Tag
593
593
  const bffGetTagList = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
594
594
  var _h, _j, _k, _l, _m;
595
- if (!utmVal || !isShowTag)
595
+ if (!utmVal)
596
596
  return;
597
597
  try {
598
598
  const val = (_k = (_j = (_h = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _h === void 0 ? void 0 : _h.filter((val) => {
@@ -605,7 +605,7 @@
605
605
  catch (e) {
606
606
  console.log('e', e);
607
607
  }
608
- }), [bffFetch, utmVal, isShowTag]);
608
+ }), [bffFetch, utmVal]);
609
609
  const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
610
610
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
611
611
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
@@ -938,23 +938,30 @@
938
938
  }
939
939
  ];
940
940
 
941
- const fontOptions = [
942
- { label: '应用字体', value: 'appFont' },
943
- { label: '黑体', value: '黑体' }
944
- ];
941
+ /*
942
+ * @Author: binruan@chatlabs.com
943
+ * @Date: 2024-04-28 14:42:22
944
+ * @LastEditors: binruan@chatlabs.com
945
+ * @LastEditTime: 2024-05-17 14:07:01
946
+ * @FilePath: \pb-sxp-ui\src\materials\sxp\defaultSetting.ts
947
+ *
948
+ */
949
+ const fontOptions = [{ label: '默认字体', value: 'appFont' }];
950
+ const sxpFonts = typeof window !== 'undefined' && (window === null || window === void 0 ? void 0 : window.localStorage.getItem('sxp_font_links'));
951
+ const data = sxpFonts && sxpFonts !== '' ? JSON.parse(sxpFonts) : [];
945
952
  var defaultSetting = {
946
- fontOptions
953
+ fontOptions: [...fontOptions, ...data]
947
954
  };
948
955
 
949
956
  /*
950
957
  * @Author: binruan@chatlabs.com
951
958
  * @Date: 2023-07-28 18:29:57
952
959
  * @LastEditors: binruan@chatlabs.com
953
- * @LastEditTime: 2023-12-14 10:51:16
960
+ * @LastEditTime: 2024-05-17 10:11:41
954
961
  * @FilePath: \pb-sxp-ui\src\materials\sxp\popup\AppointForm\settingRender.tsx
955
962
  *
956
963
  */
957
- var _a$4;
964
+ var _a$5, _b$5, _c;
958
965
  var settingRender$5 = [
959
966
  {
960
967
  type: 'Text',
@@ -981,7 +988,7 @@
981
988
  type: 'Select',
982
989
  name: ['textStyle', 'fontFamily'],
983
990
  options: fontOptions,
984
- initialValue: (_a$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$4 === void 0 ? void 0 : _a$4.value
991
+ initialValue: (_a$5 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$5 === void 0 ? void 0 : _a$5.value
985
992
  },
986
993
  {
987
994
  type: 'Number',
@@ -1024,6 +1031,37 @@
1024
1031
  type: 'Text',
1025
1032
  name: ['props', 'submitText']
1026
1033
  },
1034
+ {
1035
+ type: 'Group',
1036
+ label: '提交按钮字体',
1037
+ child: [
1038
+ {
1039
+ type: 'Color',
1040
+ name: ['props', 'submitButtonStyle', 'color'],
1041
+ initialValue: '#fff'
1042
+ },
1043
+ {
1044
+ type: 'Select',
1045
+ name: ['props', 'submitButtonStyle', 'fontFamily'],
1046
+ options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
1047
+ initialValue: (_c = (_b$5 = defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions) === null || _b$5 === void 0 ? void 0 : _b$5[0]) === null || _c === void 0 ? void 0 : _c.value
1048
+ },
1049
+ {
1050
+ type: 'Number',
1051
+ name: ['props', 'submitButtonStyle', 'fontSize'],
1052
+ addonAfter: 'px',
1053
+ initialValue: 12
1054
+ }
1055
+ ]
1056
+ },
1057
+ {
1058
+ type: 'TextStyle',
1059
+ name: ['props', 'submitButtonStyle']
1060
+ },
1061
+ {
1062
+ type: 'TextAlign',
1063
+ name: ['props', 'submitButtonStyle']
1064
+ },
1027
1065
  {
1028
1066
  label: '提交文本颜色',
1029
1067
  type: 'Color',
@@ -1144,7 +1182,7 @@
1144
1182
  }
1145
1183
 
1146
1184
  const AppointForm$1 = (_a) => {
1147
- var { columns, style, title, textStyle, submitBgColor, submitColor, submitText, layoutType, isExternalLink, isPopup, onClick, onClose } = _a, props = __rest(_a, ["columns", "style", "title", "textStyle", "submitBgColor", "submitColor", "submitText", "layoutType", "isExternalLink", "isPopup", "onClick", "onClose"]);
1185
+ var { columns, style, title, textStyle, submitBgColor, submitColor, submitText, layoutType, isExternalLink, isPopup, onClick, onClose, submitButtonStyle } = _a, props = __rest(_a, ["columns", "style", "title", "textStyle", "submitBgColor", "submitColor", "submitText", "layoutType", "isExternalLink", "isPopup", "onClick", "onClose", "submitButtonStyle"]);
1148
1186
  const { submitForm, popupDetailData } = useSxpDataSource();
1149
1187
  const { jumpToWeb } = useEventReport();
1150
1188
  const formRef = React.useRef();
@@ -1175,7 +1213,7 @@
1175
1213
  key: '4'
1176
1214
  }
1177
1215
  ], []);
1178
- const columnsData = React.useMemo(() => {
1216
+ React.useMemo(() => {
1179
1217
  if (layoutType === undefined) {
1180
1218
  const list = lodash.cloneDeep(columns) || defaultColumns;
1181
1219
  return list === null || list === void 0 ? void 0 : list.map((obj) => (Object.assign(Object.assign({}, obj), { title: undefined, fieldProps: { placeholder: obj === null || obj === void 0 ? void 0 : obj.title } })));
@@ -1218,13 +1256,9 @@
1218
1256
  return (React.createElement("div", { className: 'pb-appoint-form' },
1219
1257
  React.createElement("div", { className: `pb-appoint-form-title ${css.css(Object.assign({}, textStyle))}` }, title),
1220
1258
  React.createElement("div", Object.assign({ className: css.css(Object.assign({}, style)) }, props),
1221
- React.createElement("div", { className: 'pb-appoint-form-container' },
1222
- React.createElement(proComponents.BetaSchemaForm, { columns: columnsData, submitter: false, layout: layoutType, autoFocusFirstInput: false, size: 'large', formRef: formRef, className: 'panel-reset' }))),
1259
+ React.createElement("div", { className: 'pb-appoint-form-container' })),
1223
1260
  React.createElement("div", { className: 'pb-appoint-form-btn-wrapper' },
1224
- React.createElement("button", { onClick: handleSubmit, className: 'pb-appoint-form-btn', style: {
1225
- color: submitColor,
1226
- background: submitBgColor
1227
- } }, loading ? React.createElement(React.Fragment, null, "loading...") : submitText))));
1261
+ React.createElement("button", { onClick: handleSubmit, className: 'pb-appoint-form-btn', style: Object.assign({ color: submitColor, background: submitBgColor }, submitButtonStyle) }, loading ? React.createElement(React.Fragment, null, "loading...") : submitText))));
1228
1262
  };
1229
1263
  var AppointFormComponent = React.memo(AppointForm$1);
1230
1264
 
@@ -1272,23 +1306,7 @@
1272
1306
  sort: 2
1273
1307
  });
1274
1308
 
1275
- /*
1276
- * @Author: binruan@chatlabs.com
1277
- * @Date: 2024-04-02 18:01:34
1278
- * @LastEditors: binruan@chatlabs.com
1279
- * @LastEditTime: 2024-04-12 16:46:04
1280
- * @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\settingRender.tsx
1281
- *
1282
- */
1283
- var _a$3, _b$3;
1284
- /*
1285
- * @Author: binruan@chatlabs.com
1286
- * @Date: 2024-03-26 16:50:25
1287
- * @LastEditors: binruan@chatlabs.com
1288
- * @LastEditTime: 2024-03-28 18:42:26
1289
- * @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetailDiroNew\settingRender.tsx
1290
- *
1291
- */
1309
+ var _a$4, _b$4;
1292
1310
  var settingRender$4 = [
1293
1311
  {
1294
1312
  title: '商品图片',
@@ -1312,6 +1330,19 @@
1312
1330
  type: 'Number',
1313
1331
  name: ['props', 'swiper', 'delay'],
1314
1332
  addonAfter: 's'
1333
+ },
1334
+ {
1335
+ type: 'Group',
1336
+ child: [
1337
+ {
1338
+ label: '居中垂直偏移',
1339
+ type: 'Number',
1340
+ name: ['props', 'swiper', 'translateY'],
1341
+ min: -100,
1342
+ addonAfter: '%',
1343
+ initialValue: 0
1344
+ }
1345
+ ]
1315
1346
  }
1316
1347
  ]
1317
1348
  },
@@ -1346,6 +1377,23 @@
1346
1377
  name: ['props', 'commodityStyles', 'field'],
1347
1378
  initialValue: 'title'
1348
1379
  },
1380
+ {
1381
+ type: 'Group',
1382
+ child: [
1383
+ {
1384
+ label: '上边距',
1385
+ type: 'Number',
1386
+ addonAfter: 'px',
1387
+ name: ['marginTop']
1388
+ },
1389
+ {
1390
+ label: '下边距',
1391
+ type: 'Number',
1392
+ addonAfter: 'px',
1393
+ name: ['marginBottom']
1394
+ }
1395
+ ]
1396
+ },
1349
1397
  {
1350
1398
  type: 'Group',
1351
1399
  label: '标题字体',
@@ -1358,7 +1406,7 @@
1358
1406
  type: 'Select',
1359
1407
  options: fontOptions,
1360
1408
  name: ['fontFamily'],
1361
- initialValue: (_a$3 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$3 === void 0 ? void 0 : _a$3.value
1409
+ initialValue: (_a$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$4 === void 0 ? void 0 : _a$4.value
1362
1410
  },
1363
1411
  {
1364
1412
  type: 'Number',
@@ -1438,7 +1486,7 @@
1438
1486
  type: 'Select',
1439
1487
  name: ['props', 'buttonStyle', 'fontFamily'],
1440
1488
  options: fontOptions,
1441
- initialValue: (_b$3 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _b$3 === void 0 ? void 0 : _b$3.value
1489
+ initialValue: (_b$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _b$4 === void 0 ? void 0 : _b$4.value
1442
1490
  },
1443
1491
  {
1444
1492
  type: 'Number',
@@ -8383,7 +8431,7 @@
8383
8431
  * @Author: binruan@chatlabs.com
8384
8432
  * @Date: 2024-03-20 10:27:31
8385
8433
  * @LastEditors: binruan@chatlabs.com
8386
- * @LastEditTime: 2024-05-20 15:53:04
8434
+ * @LastEditTime: 2024-04-19 14:12:55
8387
8435
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FormatImage.tsx
8388
8436
  *
8389
8437
  */
@@ -8398,30 +8446,6 @@
8398
8446
  React.useEffect(() => {
8399
8447
  setImgSrc(src);
8400
8448
  }, [src]);
8401
- React.useRef(null);
8402
- // useEffect(() => {
8403
- // let observer: any = null;
8404
- // const { current } = imgRef;
8405
- // if (current) {
8406
- // observer = new IntersectionObserver(
8407
- // (entries) => {
8408
- // entries.forEach((entry) => {
8409
- // if (entry.isIntersecting) {
8410
- // setImgSrc(src);
8411
- // observer.unobserve(current);
8412
- // }
8413
- // });
8414
- // },
8415
- // { threshold: 0.1 } // 触发阈值,可根据需要调整
8416
- // );
8417
- // observer.observe(current);
8418
- // }
8419
- // return () => {
8420
- // if (observer && current) {
8421
- // observer.unobserve(current);
8422
- // }
8423
- // };
8424
- // }, [src]);
8425
8449
  return (React.createElement(React.Fragment, null, (imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.includes('.avif')) ? (React.createElement("picture", null,
8426
8450
  React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
8427
8451
  React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}?imageMogr2/format/webp` }),
@@ -8518,7 +8542,13 @@
8518
8542
  width,
8519
8543
  height: width
8520
8544
  } },
8521
- React.createElement(FormatImage$1, { style: { height: '100%', width: '100%', objectFit: 'cover', display: 'block' }, src: src }))));
8545
+ React.createElement(FormatImage$1, { style: {
8546
+ height: '100%',
8547
+ width: '100%',
8548
+ objectFit: 'cover',
8549
+ display: 'block',
8550
+ transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
8551
+ }, src: src }))));
8522
8552
  }))),
8523
8553
  !((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css.css({
8524
8554
  position: 'relative',
@@ -8567,7 +8597,9 @@
8567
8597
  commodityStyles: {
8568
8598
  price: {
8569
8599
  color: '#000',
8570
- fontSize: 18
8600
+ fontSize: 18,
8601
+ marginTop: 24,
8602
+ marginBottom: 10
8571
8603
  },
8572
8604
  title: {
8573
8605
  color: '#000',
@@ -8575,7 +8607,8 @@
8575
8607
  },
8576
8608
  collection: {
8577
8609
  fontSize: 12,
8578
- color: '#000'
8610
+ color: '#000',
8611
+ marginBottom: 14
8579
8612
  },
8580
8613
  info: {
8581
8614
  color: 'gray',
@@ -8614,26 +8647,68 @@
8614
8647
  * @Author: binruan@chatlabs.com
8615
8648
  * @Date: 2023-10-27 14:06:35
8616
8649
  * @LastEditors: binruan@chatlabs.com
8617
- * @LastEditTime: 2023-11-08 09:55:32
8650
+ * @LastEditTime: 2024-05-17 10:29:41
8618
8651
  * @FilePath: \pb-sxp-ui\src\materials\sxp\popup\Prompt\settingRender.tsx
8619
8652
  *
8620
8653
  */
8654
+ var _a$3, _b$3;
8621
8655
  var settingRender$3 = [
8622
8656
  {
8623
- type: 'Media',
8624
- label: '图标',
8625
- name: ['props', 'icon'],
8626
- mediaType: 'Image'
8627
- },
8628
- {
8629
- type: 'TextArea',
8630
- label: '内容',
8631
- name: ['props', 'content']
8632
- },
8633
- {
8634
- type: 'Text',
8635
- label: '按钮文案',
8636
- name: ['props', 'btnText']
8657
+ title: '',
8658
+ child: [
8659
+ {
8660
+ type: 'Media',
8661
+ label: '图标',
8662
+ name: ['props', 'icon'],
8663
+ mediaType: 'Image'
8664
+ },
8665
+ {
8666
+ type: 'TextArea',
8667
+ label: '内容',
8668
+ name: ['props', 'content']
8669
+ },
8670
+ {
8671
+ type: 'Text',
8672
+ label: '按钮文案',
8673
+ name: ['props', 'btnText']
8674
+ },
8675
+ {
8676
+ type: 'Group',
8677
+ label: '提交按钮字体',
8678
+ child: [
8679
+ {
8680
+ type: 'Color',
8681
+ name: ['props', 'submitButtonStyle', 'color'],
8682
+ initialValue: '#fff'
8683
+ },
8684
+ {
8685
+ type: 'Select',
8686
+ name: ['props', 'submitButtonStyle', 'fontFamily'],
8687
+ options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
8688
+ initialValue: (_b$3 = (_a$3 = defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions) === null || _a$3 === void 0 ? void 0 : _a$3[0]) === null || _b$3 === void 0 ? void 0 : _b$3.value
8689
+ },
8690
+ {
8691
+ type: 'Number',
8692
+ name: ['props', 'submitButtonStyle', 'fontSize'],
8693
+ addonAfter: 'px',
8694
+ initialValue: 12
8695
+ }
8696
+ ]
8697
+ },
8698
+ {
8699
+ type: 'TextStyle',
8700
+ name: ['props', 'submitButtonStyle']
8701
+ },
8702
+ {
8703
+ type: 'TextAlign',
8704
+ name: ['props', 'submitButtonStyle']
8705
+ },
8706
+ {
8707
+ label: '提交按钮颜色',
8708
+ type: 'Color',
8709
+ name: ['props', 'submitButtonStyle', 'backgroundColor']
8710
+ }
8711
+ ]
8637
8712
  }
8638
8713
  ];
8639
8714
 
@@ -8672,7 +8747,7 @@
8672
8747
  };
8673
8748
 
8674
8749
  const Prompt$1 = (_a) => {
8675
- var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick"]);
8750
+ var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle"]);
8676
8751
  const { popupDetailData } = useSxpDataSource();
8677
8752
  const { jumpToWeb } = useEventReport();
8678
8753
  const iconSrc = typeof icon === 'string' ? icon : getMediaValueByMode(icon);
@@ -8694,7 +8769,7 @@
8694
8769
  React.createElement("div", { className: 'pb-prompt-icon' },
8695
8770
  React.createElement("img", { width: '100%', src: iconSrc !== null && iconSrc !== void 0 ? iconSrc : img$2 })),
8696
8771
  React.createElement("div", { className: 'pb-prompt-content' }, content),
8697
- React.createElement("button", { className: 'pb-prompt-btn', onClick: handleOk }, btnText)));
8772
+ React.createElement("button", { className: 'pb-prompt-btn', style: submitButtonStyle, onClick: handleOk }, btnText)));
8698
8773
  };
8699
8774
  var PromptComponent = React.memo(Prompt$1);
8700
8775
 
@@ -8753,6 +8828,19 @@
8753
8828
  type: 'Number',
8754
8829
  name: ['props', 'swiper', 'delay'],
8755
8830
  addonAfter: 's'
8831
+ },
8832
+ {
8833
+ type: 'Group',
8834
+ child: [
8835
+ {
8836
+ label: '居中垂直偏移',
8837
+ type: 'Number',
8838
+ name: ['props', 'swiper', 'translateY'],
8839
+ min: -100,
8840
+ addonAfter: '%',
8841
+ initialValue: 0
8842
+ }
8843
+ ]
8756
8844
  }
8757
8845
  ]
8758
8846
  },
@@ -8984,7 +9072,13 @@ Made in Italy` })));
8984
9072
  width,
8985
9073
  height: width
8986
9074
  } },
8987
- React.createElement(FormatImage$1, { style: { height: '100%', width: '100%', objectFit: 'cover', display: 'block' }, src: src }))));
9075
+ React.createElement(FormatImage$1, { style: {
9076
+ height: '100%',
9077
+ width: '100%',
9078
+ objectFit: 'cover',
9079
+ display: 'block',
9080
+ transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
9081
+ }, src: src }))));
8988
9082
  }))),
8989
9083
  !((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css.css({
8990
9084
  position: 'relative',
@@ -9085,7 +9179,7 @@ Made in Italy` })));
9085
9179
  * @Author: binruan@chatlabs.com
9086
9180
  * @Date: 2024-03-26 16:50:25
9087
9181
  * @LastEditors: binruan@chatlabs.com
9088
- * @LastEditTime: 2024-04-12 17:38:12
9182
+ * @LastEditTime: 2024-05-21 16:39:34
9089
9183
  * @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\settingRender.tsx
9090
9184
  *
9091
9185
  */
@@ -9186,6 +9280,14 @@ Made in Italy` })));
9186
9280
  label: '与右侧边距',
9187
9281
  addonAfter: 'px',
9188
9282
  name: ['props', 'ctaTempStyles', 'img', 'marginRight']
9283
+ },
9284
+ {
9285
+ label: '居中垂直偏移',
9286
+ type: 'Number',
9287
+ name: ['props', 'translateY'],
9288
+ min: -100,
9289
+ addonAfter: '%',
9290
+ initialValue: 0
9189
9291
  }
9190
9292
  ]
9191
9293
  },
@@ -9391,13 +9493,19 @@ Made in Italy` })));
9391
9493
 
9392
9494
  const Commodity$1 = (_a) => {
9393
9495
  var _b, _c, _d, _e, _f, _g, _h;
9394
- var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
9496
+ var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
9395
9497
  const { sxpParameter } = useSxpDataSource();
9396
9498
  const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
9397
9499
  const src = (_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.homePage) === null || _c === void 0 ? void 0 : _c[0]) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
9398
9500
  return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
9399
9501
  React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
9400
- React.createElement(FormatImage$1, { className: css.css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })),
9502
+ React.createElement(FormatImage$1, { className: css.css({
9503
+ width: '100%',
9504
+ objectFit: 'cover',
9505
+ height: '100%',
9506
+ display: 'block',
9507
+ transform: `translateY(${translateY}%)`
9508
+ }), src: src })),
9401
9509
  React.createElement("div", { className: css.css({
9402
9510
  color: '#fff',
9403
9511
  display: 'flex',
@@ -9634,13 +9742,19 @@ Made in Italy` })));
9634
9742
 
9635
9743
  const CommodityDiro$1 = (_a) => {
9636
9744
  var _b, _c, _d, _e, _f, _g, _h;
9637
- var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
9745
+ var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
9638
9746
  const { sxpParameter } = useSxpDataSource();
9639
9747
  const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
9640
9748
  const src = (_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.homePage) === null || _c === void 0 ? void 0 : _c[0]) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
9641
9749
  return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
9642
9750
  React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
9643
- React.createElement(FormatImage$1, { className: css.css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })),
9751
+ React.createElement(FormatImage$1, { className: css.css({
9752
+ width: '100%',
9753
+ objectFit: 'cover',
9754
+ height: '100%',
9755
+ display: 'block',
9756
+ transform: `translateY(${translateY}%)`
9757
+ }), src: src })),
9644
9758
  React.createElement("div", { className: css.css({
9645
9759
  color: '#fff',
9646
9760
  display: 'flex',
@@ -9726,13 +9840,19 @@ Made in Italy` })));
9726
9840
 
9727
9841
  const CommodityDiroNew$1 = (_a) => {
9728
9842
  var _b, _c, _d, _e, _f, _g, _h;
9729
- var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
9843
+ var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
9730
9844
  const { sxpParameter } = useSxpDataSource();
9731
9845
  const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
9732
9846
  const src = (_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.homePage) === null || _c === void 0 ? void 0 : _c[0]) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
9733
9847
  return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
9734
9848
  React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
9735
- React.createElement(FormatImage$1, { className: css.css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })),
9849
+ React.createElement(FormatImage$1, { className: css.css({
9850
+ width: '100%',
9851
+ objectFit: 'cover',
9852
+ height: '100%',
9853
+ display: 'block',
9854
+ transform: `translateY(${translateY}%)`
9855
+ }), src: src })),
9736
9856
  React.createElement("div", { className: css.css({
9737
9857
  color: '#fff',
9738
9858
  display: 'flex',
@@ -9824,11 +9944,11 @@ Made in Italy` })));
9824
9944
  * @Author: binruan@chatlabs.com
9825
9945
  * @Date: 2024-01-16 14:50:13
9826
9946
  * @LastEditors: binruan@chatlabs.com
9827
- * @LastEditTime: 2024-04-18 12:32:49
9947
+ * @LastEditTime: 2024-05-21 16:34:13
9828
9948
  * @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\Img.tsx
9829
9949
  *
9830
9950
  */
9831
- const Img = ({ src, rec, item, index }) => {
9951
+ const Img = ({ src, rec, item, index, style }) => {
9832
9952
  const ref = React.useRef(null);
9833
9953
  const isOnScreen = useOnScreen(ref);
9834
9954
  const { ctaEvent } = useSxpDataSource();
@@ -9841,7 +9961,7 @@ Made in Italy` })));
9841
9961
  }
9842
9962
  }, [isOnScreen, src, ref, rec, ctaEvent, item, index]);
9843
9963
  return (React.createElement("div", { ref: ref, hidden: !src, className: css.css({ width: '100%', height: '100%' }) },
9844
- React.createElement(FormatImage$1, { className: css.css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })));
9964
+ React.createElement(FormatImage$1, { className: css.css(Object.assign({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }, style)), src: src })));
9845
9965
  };
9846
9966
  var Img$1 = React.memo(Img);
9847
9967
 
@@ -9849,7 +9969,7 @@ Made in Italy` })));
9849
9969
 
9850
9970
  const MultiCommodityDiro$1 = (_a) => {
9851
9971
  var _b, _c;
9852
- var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
9972
+ var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
9853
9973
  const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
9854
9974
  const { popup } = useEditor();
9855
9975
  const { jumpToWeb } = useEventReport();
@@ -9874,7 +9994,9 @@ Made in Italy` })));
9874
9994
  var _a, _b, _c, _d, _e, _f;
9875
9995
  return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item === null || item === void 0 ? void 0 : item.itemId, className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
9876
9996
  React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
9877
- React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index })),
9997
+ React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index, style: {
9998
+ transform: `translateY(${translateY}%)`
9999
+ } })),
9878
10000
  React.createElement("div", { className: css.css({
9879
10001
  color: '#000',
9880
10002
  display: 'flex',
@@ -9961,7 +10083,7 @@ Made in Italy` })));
9961
10083
 
9962
10084
  const MultiCommodity$1 = (_a) => {
9963
10085
  var _b, _c;
9964
- var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
10086
+ var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
9965
10087
  const { sxpParameter } = useSxpDataSource();
9966
10088
  const { ctaEvent, setPopupDetailData } = useSxpDataSource();
9967
10089
  const { popup } = useEditor();
@@ -9987,7 +10109,9 @@ Made in Italy` })));
9987
10109
  var _a, _b, _c, _d, _e, _f;
9988
10110
  return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item.itemId, className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
9989
10111
  React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
9990
- React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index })),
10112
+ React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index, style: {
10113
+ transform: `translateY(${translateY}%)`
10114
+ } })),
9991
10115
  React.createElement("div", { className: css.css({
9992
10116
  color: '#fff',
9993
10117
  display: 'flex',
@@ -10074,7 +10198,7 @@ Made in Italy` })));
10074
10198
 
10075
10199
  const MultiCommodityDiroNew$1 = (_a) => {
10076
10200
  var _b, _c;
10077
- var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
10201
+ var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
10078
10202
  const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
10079
10203
  const { popup } = useEditor();
10080
10204
  const { jumpToWeb } = useEventReport();
@@ -10099,7 +10223,9 @@ Made in Italy` })));
10099
10223
  var _a, _b, _c, _d, _e, _f;
10100
10224
  return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item === null || item === void 0 ? void 0 : item.itemId, className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
10101
10225
  React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
10102
- React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index })),
10226
+ React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index, style: {
10227
+ transform: `translateY(${translateY}%)`
10228
+ } })),
10103
10229
  React.createElement("div", { className: css.css({
10104
10230
  color: '#fff',
10105
10231
  display: 'flex',
@@ -10119,7 +10245,7 @@ Made in Italy` })));
10119
10245
  * @Author: binruan@chatlabs.com
10120
10246
  * @Date: 2023-07-28 18:29:57
10121
10247
  * @LastEditors: binruan@chatlabs.com
10122
- * @LastEditTime: 2024-04-09 21:40:37
10248
+ * @LastEditTime: 2024-05-21 16:44:00
10123
10249
  * @FilePath: \pb-sxp-ui\src\materials\sxp\template\MultiCommodityDiroNew\material.tsx
10124
10250
  *
10125
10251
  */
@@ -12329,7 +12455,6 @@ Made in Italy` })));
12329
12455
  const videoSrc = rec.video.url;
12330
12456
  if (!videoSrc)
12331
12457
  return;
12332
- videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
12333
12458
  setIsPauseVideo(false);
12334
12459
  const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
12335
12460
  const dom = document.querySelector('#player-container-id');
@@ -12337,6 +12462,7 @@ Made in Italy` })));
12337
12462
  if (!dom && !dom2)
12338
12463
  return;
12339
12464
  videoPlayerWrapperNode === null || videoPlayerWrapperNode === void 0 ? void 0 : videoPlayerWrapperNode.appendChild(dom || dom2);
12465
+ videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
12340
12466
  videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadedmetadata', handleLoadedmetadata);
12341
12467
  videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadeddata', handLoadeddata);
12342
12468
  // videoRef?.on('canplay', handleCanplay);
@@ -12476,7 +12602,7 @@ Made in Italy` })));
12476
12602
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FingerSwipeTip\index.tsx
12477
12603
  *
12478
12604
  */
12479
- const FingerSwipeTip = ({ imageUrl }) => {
12605
+ const FingerSwipeTip = ({ imageUrl, style }) => {
12480
12606
  const [show, setShow] = React.useState(true);
12481
12607
  useEditor();
12482
12608
  React.useEffect(() => {
@@ -12488,7 +12614,7 @@ Made in Italy` })));
12488
12614
  const animationCls = React.useMemo(() => {
12489
12615
  return show ? 'pb-fadeIn' : 'pb-fadeOut';
12490
12616
  }, [show]);
12491
- return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}` },
12617
+ return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: style },
12492
12618
  React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON })));
12493
12619
  };
12494
12620
 
@@ -12792,12 +12918,12 @@ Made in Italy` })));
12792
12918
  * @Author: binruan@chatlabs.com
12793
12919
  * @Date: 2024-01-15 19:03:09
12794
12920
  * @LastEditors: binruan@chatlabs.com
12795
- * @LastEditTime: 2024-05-20 19:26:50
12921
+ * @LastEditTime: 2024-05-17 13:58:46
12796
12922
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
12797
12923
  *
12798
12924
  */
12799
12925
  const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
12800
- var _a, _b, _c, _d, _e, _f, _g;
12926
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
12801
12927
  const { schema } = useEditor();
12802
12928
  const [activeIndex, setActiveIndex] = React.useState(0);
12803
12929
  const viewImageStartTime = React.useRef(0);
@@ -12852,29 +12978,23 @@ Made in Italy` })));
12852
12978
  };
12853
12979
  const firstRef = React.useRef();
12854
12980
  React.useEffect(() => {
12855
- var _a, _b, _c;
12856
- if (!firstRef.current && !videoRef && (playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) && (data === null || data === void 0 ? void 0 : data.length) > 0) {
12981
+ if (!firstRef.current && !videoRef) {
12857
12982
  firstRef.current = true;
12858
12983
  const player = TCPlayer('player-container-id', {
12859
12984
  licenseUrl, // license 地址,参考准备工作部分,在视立方控制台申请 license 后可获得 licenseUrl
12860
12985
  controls: false,
12986
+ autoplay: false,
12861
12987
  loop: false,
12862
- autoplay: true,
12863
12988
  muted: true,
12864
12989
  preload: 'auto',
12865
12990
  posterImage: false,
12866
- bigPlayButton: true,
12867
- sources: [
12868
- {
12869
- src: (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data[0]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.url) !== null && _c !== void 0 ? _c : ''
12870
- }
12871
- ]
12991
+ bigPlayButton: true
12872
12992
  });
12873
12993
  player === null || player === void 0 ? void 0 : player.ready(() => {
12874
12994
  setVideoRef(player);
12875
12995
  });
12876
12996
  }
12877
- }, [videoRef, licenseUrl, data]);
12997
+ }, [videoRef, licenseUrl]);
12878
12998
  React.useEffect(() => {
12879
12999
  if (!isInit)
12880
13000
  handleH5EnterLink();
@@ -13063,7 +13183,7 @@ Made in Italy` })));
13063
13183
  lineGradStyle
13064
13184
  ]);
13065
13185
  const renderLikeButton = React.useCallback((rec, index) => {
13066
- var _a, _b;
13186
+ var _a, _b, _c, _d;
13067
13187
  if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLike))
13068
13188
  return;
13069
13189
  let top = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconY) !== null && _a !== void 0 ? _a : 400;
@@ -13072,8 +13192,8 @@ Made in Italy` })));
13072
13192
  }
13073
13193
  if (rec.video) {
13074
13194
  return (React.createElement(LikeButton$1, { key: rec.position, activeIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIcon, unActicveIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unlikeIcon, active: rec.isCollected, recData: rec, className: 'clc-sxp-like-button', style: {
13075
- top,
13076
- right: (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconX) !== null && _b !== void 0 ? _b : 0
13195
+ [(_b = globalConfig.likeIconXPosit) !== null && _b !== void 0 ? _b : 'right']: (_c = globalConfig.likeIconX) !== null && _c !== void 0 ? _c : 0,
13196
+ [(_d = globalConfig.likeIconYPosit) !== null && _d !== void 0 ? _d : 'bottom']: top
13077
13197
  }, position: index }));
13078
13198
  }
13079
13199
  return null;
@@ -13211,7 +13331,7 @@ Made in Italy` })));
13211
13331
  } })),
13212
13332
  renderLogo,
13213
13333
  React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
13214
- isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
13334
+ isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 + ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } })) : null,
13215
13335
  React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
13216
13336
  swiperRef.current.swiper.allowTouchMove = false;
13217
13337
  setTimeout(() => {
@@ -13253,13 +13373,13 @@ Made in Italy` })));
13253
13373
  direction: 'vertical', height: height },
13254
13374
  React.createElement(ToggleButton$1, { style: {
13255
13375
  position: 'fixed',
13256
- right: (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconX) !== null && _a !== void 0 ? _a : 0,
13257
13376
  visibility: ((_c = (_b = data === null || data === void 0 ? void 0 : data[activeIndex]) === null || _b === void 0 ? void 0 : _b.video) === null || _c === void 0 ? void 0 : _c.url) ? 'visible' : 'hidden',
13258
- bottom: (_d = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconY) !== null && _d !== void 0 ? _d : 23,
13259
- zIndex: 999
13377
+ zIndex: 999,
13378
+ [(_d = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconXPosit) !== null && _d !== void 0 ? _d : 'right']: (_e = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconX) !== null && _e !== void 0 ? _e : 0,
13379
+ [(_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconYPosit) !== null && _f !== void 0 ? _f : 'bottom']: (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconY) !== null && _g !== void 0 ? _g : 23
13260
13380
  }, defaultValue: isMuted, activeIcon: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unMuteIcon) ? globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unMuteIcon : mutedIcon, unactiveIcon: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIcon) ? globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIcon : unmutedIcon, onChange: setIsMuted }),
13261
13381
  renderView),
13262
- React.createElement(WaterFall$1, Object.assign({}, (_g = (_f = (_e = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.item) === null || _g === void 0 ? void 0 : _g.props)),
13382
+ React.createElement(WaterFall$1, Object.assign({}, (_k = (_j = (_h = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.item) === null || _k === void 0 ? void 0 : _k.props)),
13263
13383
  React.createElement("div", { style: { position: 'absolute', zIndex: -100 } },
13264
13384
  React.createElement("video", { ref: playerRef, id: 'player-container-id', playsInline: true, crossOrigin: 'anonymous', style: {
13265
13385
  backgroundColor: 'transparent',
@@ -13415,8 +13535,8 @@ Made in Italy` })));
13415
13535
  if (!videoRef.current.src) {
13416
13536
  const videoSrc = rec.video.url;
13417
13537
  if (videoSrc.includes('.m3u8')) {
13418
- if (typeof window !== 'undefined' && (window === null || window === void 0 ? void 0 : window.Hls.isSupported())) {
13419
- const hls = new window.Hls();
13538
+ if (Hls.isSupported()) {
13539
+ const hls = new Hls();
13420
13540
  hls.loadSource(videoSrc);
13421
13541
  hls.attachMedia(videoRef.current);
13422
13542
  }
@@ -13702,7 +13822,7 @@ Made in Italy` })));
13702
13822
  * @Author: binruan@chatlabs.com
13703
13823
  * @Date: 2024-01-15 19:03:09
13704
13824
  * @LastEditors: binruan@chatlabs.com
13705
- * @LastEditTime: 2024-05-17 18:41:05
13825
+ * @LastEditTime: 2024-05-06 17:26:37
13706
13826
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
13707
13827
  *
13708
13828
  */
@@ -13719,14 +13839,14 @@ Made in Italy` })));
13719
13839
  RESOLVER[v.extend.type] = v;
13720
13840
  });
13721
13841
  const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, licenseUrl, enabledMetaConversionApi }) => {
13722
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
13842
+ var _a, _b, _c, _d, _e, _f;
13723
13843
  const utmVal = React.useMemo(() => {
13724
13844
  var _a;
13725
13845
  const searchParams = (location === null || location === void 0 ? void 0 : location.search) ? (_a = location === null || location === void 0 ? void 0 : location.search) === null || _a === void 0 ? void 0 : _a.replace('?', '') : '';
13726
13846
  return searchParams;
13727
13847
  }, []);
13728
13848
  return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
13729
- React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, isShowTag: (_j = (_h = (_g = data === null || data === void 0 ? void 0 : data.data) === null || _g === void 0 ? void 0 : _g.sxpPageConf) === null || _h === void 0 ? void 0 : _h.globalConfig) === null || _j === void 0 ? void 0 : _j.isShowTag, render: ({ rtcList, tagList }) => {
13849
+ React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, render: ({ rtcList, tagList }) => {
13730
13850
  var _a;
13731
13851
  return (React.createElement(React.Fragment, null,
13732
13852
  React.createElement(SxpPageRender, Object.assign({}, (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER, licenseUrl: licenseUrl })),