pb-sxp-ui 1.7.5 → 1.7.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +45 -47
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +46 -48
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +45 -47
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/PictureGroup/index.js +1 -1
- package/es/core/components/SxpPageRender/RenderCard.d.ts +1 -0
- package/es/core/components/SxpPageRender/RenderCard.js +15 -39
- package/es/core/components/SxpPageRender/VideoWidget/index.js +1 -1
- package/es/core/components/SxpPageRender/index.js +19 -8
- package/es/core/context/SxpDataSourceProvider.js +8 -1
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +1 -1
- package/lib/core/components/SxpPageRender/RenderCard.d.ts +1 -0
- package/lib/core/components/SxpPageRender/RenderCard.js +15 -39
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +1 -1
- package/lib/core/components/SxpPageRender/index.js +19 -8
- package/lib/core/context/SxpDataSourceProvider.js +8 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
import { isEmpty,
|
1
|
+
import { isEmpty, cloneDeep, isEqual, debounce, throttle, get } from 'lodash';
|
2
2
|
import { v4 } from 'uuid';
|
3
3
|
import pako from 'pako';
|
4
4
|
import React, { useContext, useMemo, memo, useEffect, createContext, useState, useRef, useCallback, forwardRef, useImperativeHandle, useLayoutEffect } from 'react';
|
@@ -805,7 +805,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
805
805
|
!((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _a === void 0 ? void 0 : _a[eventName])) {
|
806
806
|
return;
|
807
807
|
}
|
808
|
-
let jsonParams =
|
808
|
+
let jsonParams = cloneDeep((_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName]);
|
809
809
|
const urlParams = new URLSearchParams(window.location.search);
|
810
810
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
811
811
|
const fix_par = {
|
@@ -834,10 +834,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
834
834
|
const matches = value === null || value === void 0 ? void 0 : value.match(regex);
|
835
835
|
if (matches) {
|
836
836
|
matches.forEach((match) => {
|
837
|
+
var _a;
|
837
838
|
const prop = match.substring(2, match.length - 2);
|
838
839
|
try {
|
839
840
|
let replaceValue = new Function('fix_par', 'product', `return ${prop}`)(fix_par, product);
|
840
841
|
if (replaceValue) {
|
842
|
+
if (prop.indexOf('currency') &&
|
843
|
+
(replaceValue === null || replaceValue === void 0 ? void 0 : replaceValue.indexOf('-')) !== -1 &&
|
844
|
+
typeof replaceValue === 'string') {
|
845
|
+
replaceValue = (_a = replaceValue === null || replaceValue === void 0 ? void 0 : replaceValue.split('-')) === null || _a === void 0 ? void 0 : _a[0];
|
846
|
+
}
|
841
847
|
obj[key] = replaceValue;
|
842
848
|
}
|
843
849
|
else {
|
@@ -15724,7 +15730,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
15724
15730
|
position: index + '',
|
15725
15731
|
contentFormat: 'video',
|
15726
15732
|
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo,
|
15727
|
-
loadTime: (
|
15733
|
+
loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + ''
|
15728
15734
|
}
|
15729
15735
|
});
|
15730
15736
|
setIsFirstPlay(false);
|
@@ -16111,7 +16117,7 @@ const PictureGroup$2 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
16111
16117
|
const showFirstImageFn = useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
16112
16118
|
if (!isLoad) {
|
16113
16119
|
setImgInfo({
|
16114
|
-
loadTime:
|
16120
|
+
loadTime: new Date() - initTime + ''
|
16115
16121
|
});
|
16116
16122
|
setIsLoad(true);
|
16117
16123
|
}
|
@@ -16267,61 +16273,42 @@ function withBindDataSource(Component) {
|
|
16267
16273
|
* @Author: binruan@chatlabs.com
|
16268
16274
|
* @Date: 2023-12-26 16:11:34
|
16269
16275
|
* @LastEditors: binruan@chatlabs.com
|
16270
|
-
* @LastEditTime: 2024-10-
|
16276
|
+
* @LastEditTime: 2024-10-31 10:30:55
|
16271
16277
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\RenderCard.tsx
|
16272
16278
|
*
|
16273
16279
|
*/
|
16274
|
-
const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive }) => {
|
16275
|
-
var _a, _b, _c, _d, _e;
|
16280
|
+
const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive, value }) => {
|
16276
16281
|
const { schema } = useEditor();
|
16277
16282
|
if (!(rec === null || rec === void 0 ? void 0 : rec.video))
|
16278
16283
|
return null;
|
16279
|
-
let cta = null;
|
16280
|
-
if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
|
16281
|
-
cta = '多商品CTA';
|
16282
|
-
}
|
16283
|
-
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
16284
|
-
cta = '商品CTA';
|
16285
|
-
}
|
16286
|
-
else {
|
16287
|
-
cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
16288
|
-
}
|
16289
|
-
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
16290
16284
|
const renderComp = useMemo(() => {
|
16291
|
-
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, _1, _2, _3
|
16292
|
-
if (!(rec === null || rec === void 0 ? void 0 : rec.video))
|
16293
|
-
return null;
|
16294
|
-
if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) ;
|
16295
|
-
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) ;
|
16296
|
-
else {
|
16297
|
-
(_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
16298
|
-
}
|
16285
|
+
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, _1, _2, _3;
|
16299
16286
|
//如果includesCtaType有值,则只渲染includesCtaType包含的cta类型组件,用于在页面某处只显示某一组件
|
16300
|
-
if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((
|
16287
|
+
if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type)))
|
16301
16288
|
return;
|
16302
16289
|
//默认不渲染category为cta类型的组件,该类型的组件只用于某一处
|
16303
|
-
if (!includesCtaType && ((
|
16290
|
+
if (!includesCtaType && ((_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.category) === 'cta')
|
16304
16291
|
return;
|
16305
|
-
if ((((
|
16306
|
-
(((
|
16307
|
-
(((
|
16308
|
-
(((
|
16309
|
-
(((
|
16310
|
-
(((
|
16292
|
+
if ((((_c = value === null || value === void 0 ? void 0 : value.item) === null || _c === void 0 ? void 0 : _c.type) === 'CommodityDiro' && !((_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindProduct)) ||
|
16293
|
+
(((_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.type) === 'Commodity' && !((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.bindProduct)) ||
|
16294
|
+
(((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type) === 'CommodityDiroNew' && !((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.bindProduct)) ||
|
16295
|
+
(((_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.type) === 'MultiCommodity' && !((_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.bindProducts) === null || _l === void 0 ? void 0 : _l.length)) ||
|
16296
|
+
(((_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.type) === 'MultiCommodityDiro' && !((_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.bindProducts) === null || _p === void 0 ? void 0 : _p.length)) ||
|
16297
|
+
(((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.type) === 'MultiCommodityDiroNew' && !((_s = (_r = rec === null || rec === void 0 ? void 0 : rec.video) === null || _r === void 0 ? void 0 : _r.bindProducts) === null || _s === void 0 ? void 0 : _s.length))) {
|
16311
16298
|
//
|
16312
16299
|
return null;
|
16313
16300
|
}
|
16314
16301
|
if (value && resolver) {
|
16315
|
-
const t = resolver[(
|
16302
|
+
const t = resolver[(_t = value === null || value === void 0 ? void 0 : value.item) === null || _t === void 0 ? void 0 : _t.type];
|
16316
16303
|
const Component = withBindDataSource(t);
|
16317
|
-
const defaulSetting = (
|
16318
|
-
const isExternalLink = ((
|
16319
|
-
let style = cloneDeep((
|
16304
|
+
const defaulSetting = (_u = t === null || t === void 0 ? void 0 : t.extend) === null || _u === void 0 ? void 0 : _u.defaulSetting;
|
16305
|
+
const isExternalLink = ((_x = (_w = (_v = value === null || value === void 0 ? void 0 : value.item) === null || _v === void 0 ? void 0 : _v.event) === null || _w === void 0 ? void 0 : _w.onClick) === null || _x === void 0 ? void 0 : _x.linkType) === 'externalLink';
|
16306
|
+
let style = cloneDeep((_y = value === null || value === void 0 ? void 0 : value.item) === null || _y === void 0 ? void 0 : _y.style);
|
16320
16307
|
if (style.hasOwnProperty('backdropFilter')) {
|
16321
16308
|
let sbf = style['backdropFilter'];
|
16322
16309
|
style['backdropFilter'] = `blur(${sbf !== null && sbf !== void 0 ? sbf : 0}px)`;
|
16323
16310
|
}
|
16324
|
-
return (React.createElement(Component, Object.assign({ style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), style), { zIndex: 50, marginLeft: '20px', boxSizing: 'border-box', transform: 'translate3d(0px, 0px, 0px)' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (
|
16311
|
+
return (React.createElement(Component, Object.assign({ style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), style), { zIndex: 50, marginLeft: '20px', boxSizing: 'border-box', transform: 'translate3d(0px, 0px, 0px)' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_z = value === null || value === void 0 ? void 0 : value.item) === null || _z === void 0 ? void 0 : _z.textStyle), bindDatas: (_1 = (_0 = value === null || value === void 0 ? void 0 : value.item) === null || _0 === void 0 ? void 0 : _0.bindDatas) !== null && _1 !== void 0 ? _1 : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_2 = value === null || value === void 0 ? void 0 : value.item) === null || _2 === void 0 ? void 0 : _2.props, { event: ((_3 = value === null || value === void 0 ? void 0 : value.item) === null || _3 === void 0 ? void 0 : _3.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, key: value === null || value === void 0 ? void 0 : value.id, recData: rec, isExternalLink: isExternalLink, index: index, isActive: isActive })));
|
16325
16312
|
}
|
16326
16313
|
else {
|
16327
16314
|
return null;
|
@@ -16414,7 +16401,7 @@ var Tagbar$1 = memo(Tagbar);
|
|
16414
16401
|
* @Author: binruan@chatlabs.com
|
16415
16402
|
* @Date: 2024-01-15 19:03:09
|
16416
16403
|
* @LastEditors: binruan@chatlabs.com
|
16417
|
-
* @LastEditTime: 2024-10-
|
16404
|
+
* @LastEditTime: 2024-10-31 10:23:31
|
16418
16405
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
16419
16406
|
*
|
16420
16407
|
*/
|
@@ -16653,19 +16640,30 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
16653
16640
|
};
|
16654
16641
|
}, [isShowMore]);
|
16655
16642
|
const renderBottom = useCallback((rec, index) => {
|
16656
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
16643
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
16657
16644
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
16645
|
+
let cta = null;
|
16646
|
+
if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
|
16647
|
+
cta = '多商品CTA';
|
16648
|
+
}
|
16649
|
+
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
16650
|
+
cta = '商品CTA';
|
16651
|
+
}
|
16652
|
+
else {
|
16653
|
+
cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
16654
|
+
}
|
16655
|
+
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
16658
16656
|
return (React.createElement(React.Fragment, null,
|
16659
|
-
((
|
16660
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
16657
|
+
((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
|
16658
|
+
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _g !== void 0 ? _g : 40}px` } },
|
16661
16659
|
React.createElement(Nudge, { nudge: nudge }),
|
16662
16660
|
(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
|
16663
|
-
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex }))) : null,
|
16661
|
+
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
16664
16662
|
React.createElement("div", null,
|
16665
|
-
React.createElement(ExpandableText$1, { 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: (
|
16666
|
-
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
|
16667
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
16668
|
-
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
|
16663
|
+
React.createElement(ExpandableText$1, { 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: (_j = (_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) !== null && _j !== void 0 ? _j : '', 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 }),
|
16664
|
+
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
16665
|
+
React.createElement(Hashtag$1, { index: activeIndex, tags: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.hashTags) !== null && _l !== void 0 ? _l : [], itemId: (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.itemId, itemType: ((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
|
16666
|
+
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
16669
16667
|
}
|
16670
16668
|
return null;
|
16671
16669
|
}, [
|