pb-sxp-ui 1.6.2 → 1.6.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/dist/index.cjs +20 -17
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +20 -17
  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 +20 -17
  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/Hashtag/index.d.ts +1 -0
  14. package/es/core/components/SxpPageRender/Hashtag/index.js +5 -3
  15. package/es/core/components/SxpPageRender/index.d.ts +1 -0
  16. package/es/core/components/SxpPageRender/index.js +10 -9
  17. package/es/materials/sxp/template/components/Scroll.d.ts +1 -0
  18. package/es/materials/sxp/template/components/Scroll.js +2 -2
  19. package/lib/core/components/SxpPageRender/Hashtag/index.d.ts +1 -0
  20. package/lib/core/components/SxpPageRender/Hashtag/index.js +5 -3
  21. package/lib/core/components/SxpPageRender/index.d.ts +1 -0
  22. package/lib/core/components/SxpPageRender/index.js +10 -9
  23. package/lib/materials/sxp/template/components/Scroll.d.ts +1 -0
  24. package/lib/materials/sxp/template/components/Scroll.js +2 -2
  25. package/package.json +1 -1
package/es/core/components/SxpPageRender/Hashtag/index.d.ts CHANGED
@@ -7,6 +7,7 @@ interface IHashtagProps {
7
7
  index: number;
8
8
  rec: RecItemType;
9
9
  hashTagStyle?: CSSProperties;
10
+ hashTagRightMargin?: number;
10
11
  }
11
12
  declare const _default: React.NamedExoticComponent<IHashtagProps>;
12
13
  export default _default;
package/es/core/components/SxpPageRender/Hashtag/index.js CHANGED
@@ -3,7 +3,7 @@ import { SwiperSlide } from 'swiper/react';
3
3
  import { useSxpDataSource } from '../../../../core/hooks';
4
4
  import Scroll from '../../../../materials/sxp/template/components/Scroll';
5
5
  import { setFontForText } from '../../../../core/utils/tool';
6
- const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
6
+ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle, hashTagRightMargin }) => {
7
7
  var _a;
8
8
  const [isShowMore, setIsShowMore] = useState(false);
9
9
  const { setWaterFallData, setOpenHashtag, setCacheActiveIndex, waterFallData, setIsFromHashtag } = useSxpDataSource();
@@ -36,8 +36,10 @@ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
36
36
  }
37
37
  return (React.createElement("span", { style: { textDecoration: 'underline', cursor: 'pointer', color: '#fff' }, onClick: () => setIsShowMore(!isShowMore) }, isShowMore ? 'show less' : 'show more'));
38
38
  }, [isShowMore, tags]);
39
- return (React.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: { marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px` } },
40
- React.createElement(Scroll, null, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (React.createElement(SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item), tag: 'button', "aria-label": item },
39
+ return (React.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: {
40
+ marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px`
41
+ } },
42
+ React.createElement(Scroll, { width: hashTagRightMargin }, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (React.createElement(SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item), tag: 'button', "aria-label": item },
41
43
  React.createElement("div", { dangerouslySetInnerHTML: { __html: setFontForText(`#${item}`, hashTagStyle) } })))))));
42
44
  };
43
45
  export default memo(Hashtag);
package/es/core/components/SxpPageRender/index.d.ts CHANGED
@@ -100,6 +100,7 @@ export interface ISxpPageRenderProps {
100
100
  _schema?: any;
101
101
  hashTagStyle?: CSSProperties;
102
102
  licenseUrl?: string;
103
+ hashTagRightMargin: number;
103
104
  }
104
105
  declare const SxpPageRender: FC<ISxpPageRenderProps>;
105
106
  export default SxpPageRender;
package/es/core/components/SxpPageRender/index.js CHANGED
@@ -22,8 +22,8 @@ import withBindDataSource from '../../../core/hoc/withBindDataSource';
22
22
  import Tagbar from './Tagbar';
23
23
  import { getFeUserId, getSlideSkipState } from '../../../core/utils/localStore';
24
24
  import { isEqual } from 'lodash';
25
- const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
26
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
25
+ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], licenseUrl }) => {
26
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
27
27
  const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
28
28
  const unmutedIcon = useIconLink('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png');
29
29
  const { schema } = useEditor();
@@ -176,10 +176,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
176
176
  minusHeight += 56;
177
177
  }
178
178
  return minusHeight;
179
- }, []);
179
+ }, [globalConfig]);
180
180
  const height = useMemo(() => {
181
181
  return containerHeight - minusHeight - tagHeight;
182
- }, [globalConfig, containerHeight, tagHeight]);
182
+ }, [minusHeight, containerHeight, tagHeight]);
183
183
  const visList = useMemo(() => {
184
184
  var _a;
185
185
  const list = activeIndex === 0 && !waterFallData && !isEditor
@@ -273,7 +273,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
273
273
  React.createElement("div", null,
274
274
  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 }),
275
275
  React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
276
- 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 }))),
276
+ 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) }))),
277
277
  React.createElement(RenderCard, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
278
278
  }
279
279
  return null;
@@ -513,14 +513,15 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
513
513
  ((_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _f === void 0 ? void 0 : _f.enable) && (React.createElement("button", { style: {
514
514
  position: 'absolute',
515
515
  [(_h = (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _g === void 0 ? void 0 : _g.xPosit) !== null && _h !== void 0 ? _h : 'left']: (_k = (_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _j === void 0 ? void 0 : _j.x) !== null && _k !== void 0 ? _k : 0,
516
- [(_m = (_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _l === void 0 ? void 0 : _l.yPosit) !== null && _m !== void 0 ? _m : 'top']: (_p = (_o = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _o === void 0 ? void 0 : _o.y) !== null && _p !== void 0 ? _p : 0,
516
+ [(_m = (_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _l === void 0 ? void 0 : _l.yPosit) !== null && _m !== void 0 ? _m : 'top']: (((_o = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _o === void 0 ? void 0 : _o.yPosit) == 'top' ? minusHeight + tagHeight : 0) +
517
+ ((_q = (_p = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _p === void 0 ? void 0 : _p.y) !== null && _q !== void 0 ? _q : 0),
517
518
  zIndex: 8,
518
519
  border: 'none',
519
520
  padding: 0,
520
521
  background: 'transparent'
521
522
  }, role: 'button', "aria-label": 'back button', onClick: () => history === null || history === void 0 ? void 0 : history.back() },
522
- React.createElement("img", { src: (_r = (_q = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _q === void 0 ? void 0 : _q.icon) !== null && _r !== void 0 ? _r : left, alt: 'back button', width: 50, style: { objectFit: 'cover' } }))),
523
- isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _s !== void 0 ? _s : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
523
+ React.createElement("img", { src: (_s = (_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _r === void 0 ? void 0 : _r.icon) !== null && _s !== void 0 ? _s : left, alt: 'back button', width: 100, style: { objectFit: 'cover' } }))),
524
+ isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _t !== void 0 ? _t : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
524
525
  React.createElement(Swiper, { style: {
525
526
  marginTop: tagHeight
526
527
  }, ref: swiperRef, onSlideChange: () => {
@@ -551,6 +552,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
551
552
  renderLikeButton(visList[activeIndex], activeIndex, !!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
552
553
  renderToggleButton(!!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed)),
553
554
  renderView),
554
- React.createElement(WaterFall, Object.assign({}, (_v = (_u = (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _t === void 0 ? void 0 : _t[0]) === null || _u === void 0 ? void 0 : _u.item) === null || _v === void 0 ? void 0 : _v.props))));
555
+ React.createElement(WaterFall, Object.assign({}, (_w = (_v = (_u = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _u === void 0 ? void 0 : _u[0]) === null || _v === void 0 ? void 0 : _v.item) === null || _w === void 0 ? void 0 : _w.props))));
555
556
  };
556
557
  export default SxpPageRender;
package/es/materials/sxp/template/components/Scroll.d.ts CHANGED
@@ -7,6 +7,7 @@ interface IScrollProps {
7
7
  isPadding?: boolean;
8
8
  style?: CSSProperties;
9
9
  enableSlideActive?: boolean;
10
+ width?: number;
10
11
  }
11
12
  declare const _default: React.NamedExoticComponent<IScrollProps>;
12
13
  export default _default;
package/es/materials/sxp/template/components/Scroll.js CHANGED
@@ -5,7 +5,7 @@ import 'swiper/css/free-mode';
5
5
  import 'swiper/css/scrollbar';
6
6
  import { FreeMode, Scrollbar, Mousewheel } from 'swiper/modules';
7
7
  import { useSxpDataSource } from '../../../../core/hooks';
8
- const Scroll = ({ children, isPadding = true, style, enableSlideActive = false }) => {
8
+ const Scroll = ({ children, isPadding = true, style, enableSlideActive = false, width }) => {
9
9
  const ref = useRef();
10
10
  const { popupDetailData } = useSxpDataSource();
11
11
  useEffect(() => {
@@ -13,6 +13,6 @@ const Scroll = ({ children, isPadding = true, style, enableSlideActive = false }
13
13
  if (enableSlideActive)
14
14
  (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo((_b = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.multiCheckIndex) !== null && _b !== void 0 ? _b : 0);
15
15
  }, [popupDetailData, enableSlideActive]);
16
- return (React.createElement(Swiper, { ref: ref, direction: 'horizontal', slidesPerView: 'auto', freeMode: true, mousewheel: true, modules: [FreeMode, Scrollbar, Mousewheel], style: Object.assign({ padding: isPadding ? '0 12px 0 20px' : 0 }, style) }, children));
16
+ return (React.createElement(Swiper, { ref: ref, direction: 'horizontal', slidesPerView: 'auto', freeMode: true, mousewheel: true, modules: [FreeMode, Scrollbar, Mousewheel], style: Object.assign(Object.assign({ padding: isPadding ? '0 12px 0 20px' : 0 }, style), (width && { width })) }, children));
17
17
  };
18
18
  export default memo(Scroll);
package/lib/core/components/SxpPageRender/Hashtag/index.d.ts CHANGED
@@ -7,6 +7,7 @@ interface IHashtagProps {
7
7
  index: number;
8
8
  rec: RecItemType;
9
9
  hashTagStyle?: CSSProperties;
10
+ hashTagRightMargin?: number;
10
11
  }
11
12
  declare const _default: React.NamedExoticComponent<IHashtagProps>;
12
13
  export default _default;
package/lib/core/components/SxpPageRender/Hashtag/index.js CHANGED
@@ -6,7 +6,7 @@ const react_2 = require("swiper/react");
6
6
  const hooks_1 = require("../../../../core/hooks");
7
7
  const Scroll_1 = tslib_1.__importDefault(require("../../../../materials/sxp/template/components/Scroll"));
8
8
  const tool_1 = require("../../../../core/utils/tool");
9
- const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
9
+ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle, hashTagRightMargin }) => {
10
10
  var _a;
11
11
  const [isShowMore, setIsShowMore] = (0, react_1.useState)(false);
12
12
  const { setWaterFallData, setOpenHashtag, setCacheActiveIndex, waterFallData, setIsFromHashtag } = (0, hooks_1.useSxpDataSource)();
@@ -39,8 +39,10 @@ const Hashtag = ({ tags, itemId, itemType, index, rec, hashTagStyle }) => {
39
39
  }
40
40
  return (react_1.default.createElement("span", { style: { textDecoration: 'underline', cursor: 'pointer', color: '#fff' }, onClick: () => setIsShowMore(!isShowMore) }, isShowMore ? 'show less' : 'show more'));
41
41
  }, [isShowMore, tags]);
42
- return (react_1.default.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: { marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px` } },
43
- react_1.default.createElement(Scroll_1.default, null, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (react_1.default.createElement(react_2.SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item), tag: 'button', "aria-label": item },
42
+ return (react_1.default.createElement("div", { className: 'clc-sxp-bottom-hashtag', style: {
43
+ marginTop: `${(_a = hashTagStyle === null || hashTagStyle === void 0 ? void 0 : hashTagStyle.marginTop) !== null && _a !== void 0 ? _a : 16}px`
44
+ } },
45
+ react_1.default.createElement(Scroll_1.default, { width: hashTagRightMargin }, tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (react_1.default.createElement(react_2.SwiperSlide, { key: index, hidden: !isShowMore ? index >= 6 : false, className: 'clc-sxp-bottom-hashtag-item', style: hashTagStyle, onClick: () => handleClickTag(item), tag: 'button', "aria-label": item },
44
46
  react_1.default.createElement("div", { dangerouslySetInnerHTML: { __html: (0, tool_1.setFontForText)(`#${item}`, hashTagStyle) } })))))));
45
47
  };
46
48
  exports.default = (0, react_1.memo)(Hashtag);
package/lib/core/components/SxpPageRender/index.d.ts CHANGED
@@ -100,6 +100,7 @@ export interface ISxpPageRenderProps {
100
100
  _schema?: any;
101
101
  hashTagStyle?: CSSProperties;
102
102
  licenseUrl?: string;
103
+ hashTagRightMargin: number;
103
104
  }
104
105
  declare const SxpPageRender: FC<ISxpPageRenderProps>;
105
106
  export default SxpPageRender;
package/lib/core/components/SxpPageRender/index.js CHANGED
@@ -25,8 +25,8 @@ const withBindDataSource_1 = tslib_1.__importDefault(require("../../../core/hoc/
25
25
  const Tagbar_1 = tslib_1.__importDefault(require("./Tagbar"));
26
26
  const localStore_1 = require("../../../core/utils/localStore");
27
27
  const lodash_1 = require("lodash");
28
- const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
29
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
28
+ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], licenseUrl }) => {
29
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
30
30
  const mutedIcon = (0, useIconLink_1.useIconLink)('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
31
31
  const unmutedIcon = (0, useIconLink_1.useIconLink)('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png');
32
32
  const { schema } = (0, hooks_1.useEditor)();
@@ -179,10 +179,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
179
179
  minusHeight += 56;
180
180
  }
181
181
  return minusHeight;
182
- }, []);
182
+ }, [globalConfig]);
183
183
  const height = (0, react_1.useMemo)(() => {
184
184
  return containerHeight - minusHeight - tagHeight;
185
- }, [globalConfig, containerHeight, tagHeight]);
185
+ }, [minusHeight, containerHeight, tagHeight]);
186
186
  const visList = (0, react_1.useMemo)(() => {
187
187
  var _a;
188
188
  const list = activeIndex === 0 && !waterFallData && !isEditor
@@ -276,7 +276,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
276
276
  react_1.default.createElement("div", null,
277
277
  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 }),
278
278
  react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
279
- 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 }))),
279
+ 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) }))),
280
280
  react_1.default.createElement(RenderCard_1.default, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
281
281
  }
282
282
  return null;
@@ -516,14 +516,15 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
516
516
  ((_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _f === void 0 ? void 0 : _f.enable) && (react_1.default.createElement("button", { style: {
517
517
  position: 'absolute',
518
518
  [(_h = (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _g === void 0 ? void 0 : _g.xPosit) !== null && _h !== void 0 ? _h : 'left']: (_k = (_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _j === void 0 ? void 0 : _j.x) !== null && _k !== void 0 ? _k : 0,
519
- [(_m = (_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _l === void 0 ? void 0 : _l.yPosit) !== null && _m !== void 0 ? _m : 'top']: (_p = (_o = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _o === void 0 ? void 0 : _o.y) !== null && _p !== void 0 ? _p : 0,
519
+ [(_m = (_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _l === void 0 ? void 0 : _l.yPosit) !== null && _m !== void 0 ? _m : 'top']: (((_o = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _o === void 0 ? void 0 : _o.yPosit) == 'top' ? minusHeight + tagHeight : 0) +
520
+ ((_q = (_p = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _p === void 0 ? void 0 : _p.y) !== null && _q !== void 0 ? _q : 0),
520
521
  zIndex: 8,
521
522
  border: 'none',
522
523
  padding: 0,
523
524
  background: 'transparent'
524
525
  }, role: 'button', "aria-label": 'back button', onClick: () => history === null || history === void 0 ? void 0 : history.back() },
525
- react_1.default.createElement("img", { src: (_r = (_q = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _q === void 0 ? void 0 : _q.icon) !== null && _r !== void 0 ? _r : left_png_1.default, alt: 'back button', width: 50, style: { objectFit: 'cover' } }))),
526
- isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_s = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _s !== void 0 ? _s : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
526
+ react_1.default.createElement("img", { src: (_s = (_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.backButton) === null || _r === void 0 ? void 0 : _r.icon) !== null && _s !== void 0 ? _s : left_png_1.default, alt: 'back button', width: 100, style: { objectFit: 'cover' } }))),
527
+ isShowFingerTip ? (react_1.default.createElement(FingerSwipeTip_1.default, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 - ((_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _t !== void 0 ? _t : 0)}%` }, duration: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swiperTipAniDur })) : null,
527
528
  react_1.default.createElement(react_2.Swiper, { style: {
528
529
  marginTop: tagHeight
529
530
  }, ref: swiperRef, onSlideChange: () => {
@@ -554,6 +555,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
554
555
  renderLikeButton(visList[activeIndex], activeIndex, !!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconFixed)),
555
556
  renderToggleButton(!!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconFixed)),
556
557
  renderView),
557
- react_1.default.createElement(WaterFall_1.default, Object.assign({}, (_v = (_u = (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _t === void 0 ? void 0 : _t[0]) === null || _u === void 0 ? void 0 : _u.item) === null || _v === void 0 ? void 0 : _v.props))));
558
+ react_1.default.createElement(WaterFall_1.default, Object.assign({}, (_w = (_v = (_u = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _u === void 0 ? void 0 : _u[0]) === null || _v === void 0 ? void 0 : _v.item) === null || _w === void 0 ? void 0 : _w.props))));
558
559
  };
559
560
  exports.default = SxpPageRender;
package/lib/materials/sxp/template/components/Scroll.d.ts CHANGED
@@ -7,6 +7,7 @@ interface IScrollProps {
7
7
  isPadding?: boolean;
8
8
  style?: CSSProperties;
9
9
  enableSlideActive?: boolean;
10
+ width?: number;
10
11
  }
11
12
  declare const _default: React.NamedExoticComponent<IScrollProps>;
12
13
  export default _default;
package/lib/materials/sxp/template/components/Scroll.js CHANGED
@@ -8,7 +8,7 @@ require("swiper/css/free-mode");
8
8
  require("swiper/css/scrollbar");
9
9
  const modules_1 = require("swiper/modules");
10
10
  const hooks_1 = require("../../../../core/hooks");
11
- const Scroll = ({ children, isPadding = true, style, enableSlideActive = false }) => {
11
+ const Scroll = ({ children, isPadding = true, style, enableSlideActive = false, width }) => {
12
12
  const ref = (0, react_1.useRef)();
13
13
  const { popupDetailData } = (0, hooks_1.useSxpDataSource)();
14
14
  (0, react_1.useEffect)(() => {
@@ -16,6 +16,6 @@ const Scroll = ({ children, isPadding = true, style, enableSlideActive = false }
16
16
  if (enableSlideActive)
17
17
  (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo((_b = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.multiCheckIndex) !== null && _b !== void 0 ? _b : 0);
18
18
  }, [popupDetailData, enableSlideActive]);
19
- return (react_1.default.createElement(react_2.Swiper, { ref: ref, direction: 'horizontal', slidesPerView: 'auto', freeMode: true, mousewheel: true, modules: [modules_1.FreeMode, modules_1.Scrollbar, modules_1.Mousewheel], style: Object.assign({ padding: isPadding ? '0 12px 0 20px' : 0 }, style) }, children));
19
+ return (react_1.default.createElement(react_2.Swiper, { ref: ref, direction: 'horizontal', slidesPerView: 'auto', freeMode: true, mousewheel: true, modules: [modules_1.FreeMode, modules_1.Scrollbar, modules_1.Mousewheel], style: Object.assign(Object.assign({ padding: isPadding ? '0 12px 0 20px' : 0 }, style), (width && { width })) }, children));
20
20
  };
21
21
  exports.default = (0, react_1.memo)(Scroll);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pb-sxp-ui",
3
- "version": "1.6.2",
3
+ "version": "1.6.4",
4
4
  "description": "React enterprise-class UI components",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.js",