pb-sxp-ui 1.7.4 → 1.7.6

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 (33) hide show
  1. package/dist/index.cjs +47 -68
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +47 -68
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +3 -3
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +3 -3
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +47 -68
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +3 -3
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/SxpPageRender/Modal/index.d.ts +1 -0
  14. package/es/core/components/SxpPageRender/Modal/index.js +2 -2
  15. package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -1
  16. package/es/core/components/SxpPageRender/PictureGroup/index.js +0 -3
  17. package/es/core/components/SxpPageRender/RenderCard.d.ts +1 -0
  18. package/es/core/components/SxpPageRender/RenderCard.js +16 -39
  19. package/es/core/components/SxpPageRender/VideoWidget/index.js +8 -9
  20. package/es/core/components/SxpPageRender/index.js +19 -9
  21. package/es/core/utils/tool.d.ts +1 -2
  22. package/es/core/utils/tool.js +1 -11
  23. package/lib/core/components/SxpPageRender/Modal/index.d.ts +1 -0
  24. package/lib/core/components/SxpPageRender/Modal/index.js +2 -2
  25. package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -1
  26. package/lib/core/components/SxpPageRender/PictureGroup/index.js +0 -3
  27. package/lib/core/components/SxpPageRender/RenderCard.d.ts +1 -0
  28. package/lib/core/components/SxpPageRender/RenderCard.js +16 -39
  29. package/lib/core/components/SxpPageRender/VideoWidget/index.js +8 -9
  30. package/lib/core/components/SxpPageRender/index.js +19 -9
  31. package/lib/core/utils/tool.d.ts +1 -2
  32. package/lib/core/utils/tool.js +1 -12
  33. package/package.json +1 -1
@@ -9,6 +9,7 @@ interface IModalProps {
9
9
  schema?: any;
10
10
  fullHeight?: number;
11
11
  isFullScreen?: boolean;
12
+ openState?: IPopupType;
12
13
  }
13
14
  declare const _default: React.NamedExoticComponent<React.PropsWithChildren<IModalProps>>;
14
15
  export default _default;
@@ -3,7 +3,7 @@ import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from '
3
3
  import * as ReactDOM from 'react-dom';
4
4
  import { useEditor, useSxpDataSource } from '../../../../core/hooks';
5
5
  const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
6
- const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
6
+ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false, openState }) => {
7
7
  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;
8
8
  const touchRef = useRef(null);
9
9
  const fTouchRef = useRef(null);
@@ -55,7 +55,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
55
55
  }, [isOpen, popup]);
56
56
  const child = useCallback(() => {
57
57
  return children;
58
- }, [_popup]);
58
+ }, [_popup, openState]);
59
59
  if (!modalEleRef.current)
60
60
  return null;
61
61
  const handleClose = debounce(() => {
@@ -9,7 +9,6 @@ interface IPictureGroupProps {
9
9
  index: number;
10
10
  onViewImageEndEvent: (rec: RecItemType) => void;
11
11
  onViewImageStartEvent: (index: number, imgInfo?: {
12
- contentSize: string;
13
12
  loadTime: string;
14
13
  }, enableCapi?: boolean) => void;
15
14
  imgUrlsPostConfig?: postConfigType;
@@ -6,7 +6,6 @@ import Picture from './Picture';
6
6
  import { useSxpDataSource } from '../../../../core/hooks';
7
7
  import { css } from '@emotion/css';
8
8
  import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../../../../core/utils/event';
9
- import { getResFileSizeFromSrc } from '../../../../core/utils/tool';
10
9
  const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
11
10
  var _a, _b;
12
11
  const ref = useRef();
@@ -31,9 +30,7 @@ const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent,
31
30
  }, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
32
31
  const showFirstImageFn = useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
33
32
  if (!isLoad) {
34
- const contentSize = yield getResFileSizeFromSrc(e.src);
35
33
  setImgInfo({
36
- contentSize,
37
34
  loadTime: (new Date() - initTime).toFixed(2) + ''
38
35
  });
39
36
  setIsLoad(true);
@@ -8,6 +8,7 @@ interface IRenderCardProps {
8
8
  resolver: any;
9
9
  includesCtaType?: string[];
10
10
  isActive?: boolean;
11
+ value?: any;
11
12
  }
12
13
  declare const _default: React.NamedExoticComponent<IRenderCardProps>;
13
14
  export default _default;
@@ -2,59 +2,36 @@ import React, { memo, useMemo } from 'react';
2
2
  import './index.less';
3
3
  import withBindDataSource from '../../../core/hoc/withBindDataSource';
4
4
  import { useEditor } from '../../../core/hooks';
5
- const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive }) => {
6
- var _a, _b, _c, _d, _e;
5
+ import { cloneDeep } from 'lodash';
6
+ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive, value }) => {
7
7
  const { schema } = useEditor();
8
8
  if (!(rec === null || rec === void 0 ? void 0 : rec.video))
9
9
  return null;
10
- let cta = null;
11
- 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) {
12
- cta = '多商品CTA';
13
- }
14
- else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
15
- cta = '商品CTA';
16
- }
17
- else {
18
- 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;
19
- }
20
- const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
21
10
  const renderComp = useMemo(() => {
22
- 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, _4, _5, _6, _7, _8;
23
- if (!(rec === null || rec === void 0 ? void 0 : rec.video))
24
- return null;
25
- let cta = null;
26
- 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) {
27
- cta = '多商品CTA';
28
- }
29
- else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
30
- cta = '商品CTA';
31
- }
32
- else {
33
- 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;
34
- }
35
- if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type)))
11
+ 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;
12
+ 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)))
36
13
  return;
37
- if (!includesCtaType && ((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.category) === 'cta')
14
+ if (!includesCtaType && ((_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.category) === 'cta')
38
15
  return;
39
- if ((((_h = value === null || value === void 0 ? void 0 : value.item) === null || _h === void 0 ? void 0 : _h.type) === 'CommodityDiro' && !((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.bindProduct)) ||
40
- (((_k = value === null || value === void 0 ? void 0 : value.item) === null || _k === void 0 ? void 0 : _k.type) === 'Commodity' && !((_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.bindProduct)) ||
41
- (((_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.type) === 'CommodityDiroNew' && !((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.bindProduct)) ||
42
- (((_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.type) === 'MultiCommodity' && !((_r = (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.bindProducts) === null || _r === void 0 ? void 0 : _r.length)) ||
43
- (((_s = value === null || value === void 0 ? void 0 : value.item) === null || _s === void 0 ? void 0 : _s.type) === 'MultiCommodityDiro' && !((_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u.length)) ||
44
- (((_v = value === null || value === void 0 ? void 0 : value.item) === null || _v === void 0 ? void 0 : _v.type) === 'MultiCommodityDiroNew' && !((_x = (_w = rec === null || rec === void 0 ? void 0 : rec.video) === null || _w === void 0 ? void 0 : _w.bindProducts) === null || _x === void 0 ? void 0 : _x.length))) {
16
+ 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)) ||
17
+ (((_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)) ||
18
+ (((_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)) ||
19
+ (((_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)) ||
20
+ (((_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)) ||
21
+ (((_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))) {
45
22
  return null;
46
23
  }
47
24
  if (value && resolver) {
48
- const t = resolver[(_y = value === null || value === void 0 ? void 0 : value.item) === null || _y === void 0 ? void 0 : _y.type];
25
+ const t = resolver[(_t = value === null || value === void 0 ? void 0 : value.item) === null || _t === void 0 ? void 0 : _t.type];
49
26
  const Component = withBindDataSource(t);
50
- const defaulSetting = (_z = t === null || t === void 0 ? void 0 : t.extend) === null || _z === void 0 ? void 0 : _z.defaulSetting;
51
- const isExternalLink = ((_2 = (_1 = (_0 = value === null || value === void 0 ? void 0 : value.item) === null || _0 === void 0 ? void 0 : _0.event) === null || _1 === void 0 ? void 0 : _1.onClick) === null || _2 === void 0 ? void 0 : _2.linkType) === 'externalLink';
52
- let style = (_3 = value === null || value === void 0 ? void 0 : value.item) === null || _3 === void 0 ? void 0 : _3.style;
27
+ const defaulSetting = (_u = t === null || t === void 0 ? void 0 : t.extend) === null || _u === void 0 ? void 0 : _u.defaulSetting;
28
+ 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';
29
+ let style = cloneDeep((_y = value === null || value === void 0 ? void 0 : value.item) === null || _y === void 0 ? void 0 : _y.style);
53
30
  if (style.hasOwnProperty('backdropFilter')) {
54
31
  let sbf = style['backdropFilter'];
55
32
  style['backdropFilter'] = `blur(${sbf !== null && sbf !== void 0 ? sbf : 0}px)`;
56
33
  }
57
- 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), (_4 = value === null || value === void 0 ? void 0 : value.item) === null || _4 === void 0 ? void 0 : _4.textStyle), bindDatas: (_6 = (_5 = value === null || value === void 0 ? void 0 : value.item) === null || _5 === void 0 ? void 0 : _5.bindDatas) !== null && _6 !== void 0 ? _6 : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_7 = value === null || value === void 0 ? void 0 : value.item) === null || _7 === void 0 ? void 0 : _7.props, { event: ((_8 = value === null || value === void 0 ? void 0 : value.item) === null || _8 === void 0 ? void 0 : _8.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 })));
34
+ 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 })));
58
35
  }
59
36
  else {
60
37
  return null;
@@ -7,7 +7,6 @@ import { useSxpDataSource } from '../../../../core/hooks';
7
7
  import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../../../../core/utils/event';
8
8
  import loading_gif from './loading.gif';
9
9
  import { mountVideoPlayerAtNode } from './VideoPlayer';
10
- import { getResFileSizeFromSrc } from '../../../../core/utils/tool';
11
10
  const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon }) => {
12
11
  const [isPauseVideo, setIsPauseVideo] = useState(false);
13
12
  const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport } = useSxpDataSource();
@@ -23,6 +22,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
23
22
  const videoEleRef = useRef(null);
24
23
  const hlsRef = useRef(null);
25
24
  const initTimeRef = useRef();
25
+ const loadedTimeRef = useRef();
26
26
  const blur = useMemo(() => {
27
27
  return (videoPostConfig === null || videoPostConfig === void 0 ? void 0 : videoPostConfig.mode) === '2';
28
28
  }, [videoPostConfig]);
@@ -69,7 +69,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
69
69
  setIsLoadFinish(true);
70
70
  }, []);
71
71
  const handleStartPlay = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
72
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
72
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
73
73
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
74
74
  return;
75
75
  setIsPauseVideo(false);
@@ -79,22 +79,20 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
79
79
  const videoDuration = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration) !== null && _d !== void 0 ? _d : 0).toFixed(2);
80
80
  const videoCurrentTime = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.currentTime) !== null && _f !== void 0 ? _f : 0).toFixed(2);
81
81
  const playType = isFirstPlay ? '0' : '1';
82
- const contentSize = yield getResFileSizeFromSrc((_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.url);
83
82
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
84
83
  eventInfo: {
85
84
  eventSubject: 'playVideo',
86
85
  eventDescription: 'User played the video',
87
- contentId: (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.itemId) !== null && _j !== void 0 ? _j : '',
88
- contentName: (_l = (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '',
86
+ contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '',
87
+ contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
89
88
  playType,
90
89
  startTime: videoCurrentTime,
91
90
  videoDuration,
92
- contentTags: JSON.stringify((_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.tags) !== null && _o !== void 0 ? _o : []),
91
+ contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
93
92
  position: index + '',
94
93
  contentFormat: 'video',
95
- traceInfo: (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.traceInfo,
96
- contentSize,
97
- loadTime: (new Date() - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current)).toFixed(2) + ''
94
+ traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo,
95
+ loadTime: ((loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current)).toFixed(2) + ''
98
96
  }
99
97
  });
100
98
  setIsFirstPlay(false);
@@ -125,6 +123,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
125
123
  const handleLoadedmetadata = useCallback(() => {
126
124
  if (!videoRef.current)
127
125
  return;
126
+ loadedTimeRef.current = new Date();
128
127
  handleStartPlay();
129
128
  handLoadeddata();
130
129
  }, [videoRef.current, handLoadeddata, handleStartPlay]);
@@ -254,19 +254,30 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
254
254
  };
255
255
  }, [isShowMore]);
256
256
  const renderBottom = useCallback((rec, index) => {
257
- var _a, _b, _c, _d, _e, _f, _g, _h;
257
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
258
258
  if (rec === null || rec === void 0 ? void 0 : rec.video) {
259
+ let cta = null;
260
+ 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) {
261
+ cta = '多商品CTA';
262
+ }
263
+ else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
264
+ cta = '商品CTA';
265
+ }
266
+ else {
267
+ 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;
268
+ }
269
+ const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
259
270
  return (React.createElement(React.Fragment, null,
260
- ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
261
- React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _b !== void 0 ? _b : 40}px` } },
271
+ ((_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' }),
272
+ 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` } },
262
273
  React.createElement(Nudge, { nudge: nudge }),
263
274
  (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' },
264
- React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex }))) : null,
275
+ React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
265
276
  React.createElement("div", null,
266
- React.createElement(ExpandableText, { 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: (_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : '', 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 }),
267
- React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
268
- React.createElement(Hashtag, { index: activeIndex, tags: (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.hashTags) !== null && _f !== void 0 ? _f : [], itemId: (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.itemId, itemType: ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
269
- React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
277
+ React.createElement(ExpandableText, { 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 }),
278
+ React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
279
+ React.createElement(Hashtag, { 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) }))),
280
+ React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
270
281
  }
271
282
  return null;
272
283
  }, [
@@ -435,7 +446,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
435
446
  position: activeIndex + '',
436
447
  contentFormat: 'image',
437
448
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
438
- contentSize: imgInfo === null || imgInfo === void 0 ? void 0 : imgInfo.contentSize,
439
449
  loadTime: imgInfo === null || imgInfo === void 0 ? void 0 : imgInfo.loadTime
440
450
  }
441
451
  });
@@ -11,5 +11,4 @@ declare function getBrowserInfo(): string | null;
11
11
  declare function getSystem(): string | null;
12
12
  declare function getDevice(): string | null;
13
13
  declare function getCookie(val: string): string;
14
- declare const getResFileSizeFromSrc: (imageSrc?: string) => "" | Promise<string>;
15
- export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getResFileSizeFromSrc };
14
+ export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie };
@@ -156,14 +156,4 @@ function getCookie(val) {
156
156
  });
157
157
  return value !== null && value !== void 0 ? value : '';
158
158
  }
159
- const getResFileSizeFromSrc = (imageSrc) => {
160
- if (!imageSrc)
161
- return '';
162
- return fetch(imageSrc)
163
- .then((response) => response.blob())
164
- .then((blob) => {
165
- const fileSizeInMB = blob.size / (1024 * 1024);
166
- return fileSizeInMB.toFixed(2) + '';
167
- });
168
- };
169
- export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getResFileSizeFromSrc };
159
+ export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie };
@@ -9,6 +9,7 @@ interface IModalProps {
9
9
  schema?: any;
10
10
  fullHeight?: number;
11
11
  isFullScreen?: boolean;
12
+ openState?: IPopupType;
12
13
  }
13
14
  declare const _default: React.NamedExoticComponent<React.PropsWithChildren<IModalProps>>;
14
15
  export default _default;
@@ -6,7 +6,7 @@ const react_1 = tslib_1.__importStar(require("react"));
6
6
  const ReactDOM = tslib_1.__importStar(require("react-dom"));
7
7
  const hooks_1 = require("../../../../core/hooks");
8
8
  const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
9
- const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
9
+ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false, openState }) => {
10
10
  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;
11
11
  const touchRef = (0, react_1.useRef)(null);
12
12
  const fTouchRef = (0, react_1.useRef)(null);
@@ -58,7 +58,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
58
58
  }, [isOpen, popup]);
59
59
  const child = (0, react_1.useCallback)(() => {
60
60
  return children;
61
- }, [_popup]);
61
+ }, [_popup, openState]);
62
62
  if (!modalEleRef.current)
63
63
  return null;
64
64
  const handleClose = (0, lodash_1.debounce)(() => {
@@ -9,7 +9,6 @@ interface IPictureGroupProps {
9
9
  index: number;
10
10
  onViewImageEndEvent: (rec: RecItemType) => void;
11
11
  onViewImageStartEvent: (index: number, imgInfo?: {
12
- contentSize: string;
13
12
  loadTime: string;
14
13
  }, enableCapi?: boolean) => void;
15
14
  imgUrlsPostConfig?: postConfigType;
@@ -8,7 +8,6 @@ const Picture_1 = tslib_1.__importDefault(require("./Picture"));
8
8
  const hooks_1 = require("../../../../core/hooks");
9
9
  const css_1 = require("@emotion/css");
10
10
  const event_1 = tslib_1.__importStar(require("../../../../core/utils/event"));
11
- const tool_1 = require("../../../../core/utils/tool");
12
11
  const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
13
12
  var _a, _b;
14
13
  const ref = (0, react_1.useRef)();
@@ -33,9 +32,7 @@ const PictureGroup = ({ imgUrls, width, height, rec, index, onViewImageEndEvent,
33
32
  }, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
34
33
  const showFirstImageFn = (0, react_1.useCallback)((e) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
35
34
  if (!isLoad) {
36
- const contentSize = yield (0, tool_1.getResFileSizeFromSrc)(e.src);
37
35
  setImgInfo({
38
- contentSize,
39
36
  loadTime: (new Date() - initTime).toFixed(2) + ''
40
37
  });
41
38
  setIsLoad(true);
@@ -8,6 +8,7 @@ interface IRenderCardProps {
8
8
  resolver: any;
9
9
  includesCtaType?: string[];
10
10
  isActive?: boolean;
11
+ value?: any;
11
12
  }
12
13
  declare const _default: React.NamedExoticComponent<IRenderCardProps>;
13
14
  export default _default;
@@ -5,59 +5,36 @@ const react_1 = tslib_1.__importStar(require("react"));
5
5
  require("./index.less");
6
6
  const withBindDataSource_1 = tslib_1.__importDefault(require("../../../core/hoc/withBindDataSource"));
7
7
  const hooks_1 = require("../../../core/hooks");
8
- const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive }) => {
9
- var _a, _b, _c, _d, _e;
8
+ const lodash_1 = require("lodash");
9
+ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive, value }) => {
10
10
  const { schema } = (0, hooks_1.useEditor)();
11
11
  if (!(rec === null || rec === void 0 ? void 0 : rec.video))
12
12
  return null;
13
- let cta = null;
14
- 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) {
15
- cta = '多商品CTA';
16
- }
17
- else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
18
- cta = '商品CTA';
19
- }
20
- else {
21
- 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;
22
- }
23
- const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
24
13
  const renderComp = (0, react_1.useMemo)(() => {
25
- 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, _4, _5, _6, _7, _8;
26
- if (!(rec === null || rec === void 0 ? void 0 : rec.video))
27
- return null;
28
- let cta = null;
29
- 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) {
30
- cta = '多商品CTA';
31
- }
32
- else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
33
- cta = '商品CTA';
34
- }
35
- else {
36
- 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;
37
- }
38
- if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type)))
14
+ 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;
15
+ 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)))
39
16
  return;
40
- if (!includesCtaType && ((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.category) === 'cta')
17
+ if (!includesCtaType && ((_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.category) === 'cta')
41
18
  return;
42
- if ((((_h = value === null || value === void 0 ? void 0 : value.item) === null || _h === void 0 ? void 0 : _h.type) === 'CommodityDiro' && !((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.bindProduct)) ||
43
- (((_k = value === null || value === void 0 ? void 0 : value.item) === null || _k === void 0 ? void 0 : _k.type) === 'Commodity' && !((_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.bindProduct)) ||
44
- (((_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.type) === 'CommodityDiroNew' && !((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.bindProduct)) ||
45
- (((_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.type) === 'MultiCommodity' && !((_r = (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.bindProducts) === null || _r === void 0 ? void 0 : _r.length)) ||
46
- (((_s = value === null || value === void 0 ? void 0 : value.item) === null || _s === void 0 ? void 0 : _s.type) === 'MultiCommodityDiro' && !((_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.bindProducts) === null || _u === void 0 ? void 0 : _u.length)) ||
47
- (((_v = value === null || value === void 0 ? void 0 : value.item) === null || _v === void 0 ? void 0 : _v.type) === 'MultiCommodityDiroNew' && !((_x = (_w = rec === null || rec === void 0 ? void 0 : rec.video) === null || _w === void 0 ? void 0 : _w.bindProducts) === null || _x === void 0 ? void 0 : _x.length))) {
19
+ 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)) ||
20
+ (((_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)) ||
21
+ (((_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)) ||
22
+ (((_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)) ||
23
+ (((_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)) ||
24
+ (((_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))) {
48
25
  return null;
49
26
  }
50
27
  if (value && resolver) {
51
- const t = resolver[(_y = value === null || value === void 0 ? void 0 : value.item) === null || _y === void 0 ? void 0 : _y.type];
28
+ const t = resolver[(_t = value === null || value === void 0 ? void 0 : value.item) === null || _t === void 0 ? void 0 : _t.type];
52
29
  const Component = (0, withBindDataSource_1.default)(t);
53
- const defaulSetting = (_z = t === null || t === void 0 ? void 0 : t.extend) === null || _z === void 0 ? void 0 : _z.defaulSetting;
54
- const isExternalLink = ((_2 = (_1 = (_0 = value === null || value === void 0 ? void 0 : value.item) === null || _0 === void 0 ? void 0 : _0.event) === null || _1 === void 0 ? void 0 : _1.onClick) === null || _2 === void 0 ? void 0 : _2.linkType) === 'externalLink';
55
- let style = (_3 = value === null || value === void 0 ? void 0 : value.item) === null || _3 === void 0 ? void 0 : _3.style;
30
+ const defaulSetting = (_u = t === null || t === void 0 ? void 0 : t.extend) === null || _u === void 0 ? void 0 : _u.defaulSetting;
31
+ 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';
32
+ let style = (0, lodash_1.cloneDeep)((_y = value === null || value === void 0 ? void 0 : value.item) === null || _y === void 0 ? void 0 : _y.style);
56
33
  if (style.hasOwnProperty('backdropFilter')) {
57
34
  let sbf = style['backdropFilter'];
58
35
  style['backdropFilter'] = `blur(${sbf !== null && sbf !== void 0 ? sbf : 0}px)`;
59
36
  }
60
- return (react_1.default.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), (_4 = value === null || value === void 0 ? void 0 : value.item) === null || _4 === void 0 ? void 0 : _4.textStyle), bindDatas: (_6 = (_5 = value === null || value === void 0 ? void 0 : value.item) === null || _5 === void 0 ? void 0 : _5.bindDatas) !== null && _6 !== void 0 ? _6 : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_7 = value === null || value === void 0 ? void 0 : value.item) === null || _7 === void 0 ? void 0 : _7.props, { event: ((_8 = value === null || value === void 0 ? void 0 : value.item) === null || _8 === void 0 ? void 0 : _8.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 })));
37
+ return (react_1.default.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 })));
61
38
  }
62
39
  else {
63
40
  return null;
@@ -9,7 +9,6 @@ const hooks_1 = require("../../../../core/hooks");
9
9
  const event_1 = tslib_1.__importStar(require("../../../../core/utils/event"));
10
10
  const loading_gif_1 = tslib_1.__importDefault(require("./loading.gif"));
11
11
  const VideoPlayer_1 = require("./VideoPlayer");
12
- const tool_1 = require("../../../../core/utils/tool");
13
12
  const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon }) => {
14
13
  const [isPauseVideo, setIsPauseVideo] = (0, react_1.useState)(false);
15
14
  const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport } = (0, hooks_1.useSxpDataSource)();
@@ -25,6 +24,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
25
24
  const videoEleRef = (0, react_1.useRef)(null);
26
25
  const hlsRef = (0, react_1.useRef)(null);
27
26
  const initTimeRef = (0, react_1.useRef)();
27
+ const loadedTimeRef = (0, react_1.useRef)();
28
28
  const blur = (0, react_1.useMemo)(() => {
29
29
  return (videoPostConfig === null || videoPostConfig === void 0 ? void 0 : videoPostConfig.mode) === '2';
30
30
  }, [videoPostConfig]);
@@ -71,7 +71,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
71
71
  setIsLoadFinish(true);
72
72
  }, []);
73
73
  const handleStartPlay = (0, react_1.useCallback)(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
74
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
74
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
75
75
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
76
76
  return;
77
77
  setIsPauseVideo(false);
@@ -81,22 +81,20 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
81
81
  const videoDuration = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration) !== null && _d !== void 0 ? _d : 0).toFixed(2);
82
82
  const videoCurrentTime = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.currentTime) !== null && _f !== void 0 ? _f : 0).toFixed(2);
83
83
  const playType = isFirstPlay ? '0' : '1';
84
- const contentSize = yield (0, tool_1.getResFileSizeFromSrc)((_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.url);
85
84
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
86
85
  eventInfo: {
87
86
  eventSubject: 'playVideo',
88
87
  eventDescription: 'User played the video',
89
- contentId: (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.itemId) !== null && _j !== void 0 ? _j : '',
90
- contentName: (_l = (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '',
88
+ contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '',
89
+ contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
91
90
  playType,
92
91
  startTime: videoCurrentTime,
93
92
  videoDuration,
94
- contentTags: JSON.stringify((_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.tags) !== null && _o !== void 0 ? _o : []),
93
+ contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
95
94
  position: index + '',
96
95
  contentFormat: 'video',
97
- traceInfo: (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.traceInfo,
98
- contentSize,
99
- loadTime: (new Date() - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current)).toFixed(2) + ''
96
+ traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo,
97
+ loadTime: ((loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current)).toFixed(2) + ''
100
98
  }
101
99
  });
102
100
  setIsFirstPlay(false);
@@ -127,6 +125,7 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
127
125
  const handleLoadedmetadata = (0, react_1.useCallback)(() => {
128
126
  if (!videoRef.current)
129
127
  return;
128
+ loadedTimeRef.current = new Date();
130
129
  handleStartPlay();
131
130
  handLoadeddata();
132
131
  }, [videoRef.current, handLoadeddata, handleStartPlay]);
@@ -257,19 +257,30 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
257
257
  };
258
258
  }, [isShowMore]);
259
259
  const renderBottom = (0, react_1.useCallback)((rec, index) => {
260
- var _a, _b, _c, _d, _e, _f, _g, _h;
260
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
261
261
  if (rec === null || rec === void 0 ? void 0 : rec.video) {
262
+ let cta = null;
263
+ 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) {
264
+ cta = '多商品CTA';
265
+ }
266
+ else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
267
+ cta = '商品CTA';
268
+ }
269
+ else {
270
+ 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;
271
+ }
272
+ const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
262
273
  return (react_1.default.createElement(react_1.default.Fragment, null,
263
- ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.title) && !isShowMore && react_1.default.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
264
- react_1.default.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _b !== void 0 ? _b : 40}px` } },
274
+ ((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.title) && !isShowMore && react_1.default.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
275
+ react_1.default.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` } },
265
276
  react_1.default.createElement(Nudge_1.default, { nudge: nudge }),
266
277
  (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) ? (react_1.default.createElement("div", { className: 'clc-sxp-bottom-card' },
267
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex }))) : null,
278
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
268
279
  react_1.default.createElement("div", null,
269
- 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: (_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : '', 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 }),
270
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
271
- react_1.default.createElement(Hashtag_1.default, { index: activeIndex, tags: (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.hashTags) !== null && _f !== void 0 ? _f : [], itemId: (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.itemId, itemType: ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
272
- react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
280
+ 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: (_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 }),
281
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
282
+ react_1.default.createElement(Hashtag_1.default, { 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) }))),
283
+ react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
273
284
  }
274
285
  return null;
275
286
  }, [
@@ -438,7 +449,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
438
449
  position: activeIndex + '',
439
450
  contentFormat: 'image',
440
451
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
441
- contentSize: imgInfo === null || imgInfo === void 0 ? void 0 : imgInfo.contentSize,
442
452
  loadTime: imgInfo === null || imgInfo === void 0 ? void 0 : imgInfo.loadTime
443
453
  }
444
454
  });
@@ -11,5 +11,4 @@ declare function getBrowserInfo(): string | null;
11
11
  declare function getSystem(): string | null;
12
12
  declare function getDevice(): string | null;
13
13
  declare function getCookie(val: string): string;
14
- declare const getResFileSizeFromSrc: (imageSrc?: string) => "" | Promise<string>;
15
- export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getResFileSizeFromSrc };
14
+ export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie };