pds-dev-kit-web-test 0.2.19 → 0.2.20

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 (7) hide show
  1. package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackground.js +1 -1
  2. package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackgroundMedia.js +2 -4
  3. package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/textUtil.js +5 -3
  4. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropBgImage.d.ts +4 -0
  5. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropBgImage.js +17 -3
  6. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropImage.js +1 -1
  7. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackground.js CHANGED
@@ -35,7 +35,7 @@ function CustomSectionBackground(_a) {
35
35
  var isOverlay = getIsOverlay(isMobile, CB_STYLE_PROP_BGOVERLAY);
36
36
  var isBgMedia = getIsBgMedia(isMobile, CB_STYLE_PROP_BGMEDIA);
37
37
  var mediaType = getMediaType(isMobile, CB_STYLE_PROP_BGMEDIA);
38
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isOverlay && CB_STYLE_PROP_BGOVERLAY && ((0, jsx_runtime_1.jsx)(S_CustomBackgroundOverlay, { className: "Overlay", style: __assign({}, overlayStyle) }, void 0)), (0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ className: "CustomSection", ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background, overflow: mediaType === 'IMAGE' ? 'scroll' : 'hidden' }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: id, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef }, void 0)) }), void 0)] }, void 0));
38
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isOverlay && CB_STYLE_PROP_BGOVERLAY && ((0, jsx_runtime_1.jsx)(S_CustomBackgroundOverlay, { className: "Overlay", style: __assign({}, overlayStyle) }, void 0)), (0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ className: "CustomSection", ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: id, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef }, void 0)) }), void 0)] }, void 0));
39
39
  }
40
40
  function getIsOverlay(isMobile, specs) {
41
41
  if (!specs) {
package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackgroundMedia.js CHANGED
@@ -42,7 +42,7 @@ var YouTubeIframe_1 = require("../../YouTubeIframe");
42
42
  var util_1 = require("../util");
43
43
  function CustomSectionBackgroundMedia(_a) {
44
44
  var specs = _a.specs, playerId = _a.playerId, mediaType = _a.mediaType, componentStyle = _a.componentStyle, device = _a.device, backgroundRef = _a.backgroundRef;
45
- var _b = (0, util_1.parseSectionBackgroundMediaData)(specs, device), CB_STYLE_PROP_BGMEDIA_SPEC_YSRC = _b.CB_STYLE_PROP_BGMEDIA_SPEC_YSRC, CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY = _b.CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY, CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME, CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME, CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL = _b.CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR = _b.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR;
45
+ var _b = (0, util_1.parseSectionBackgroundMediaData)(specs, device), CB_STYLE_PROP_BGMEDIA_SPEC_YSRC = _b.CB_STYLE_PROP_BGMEDIA_SPEC_YSRC, CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY = _b.CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY, CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME, CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR = _b.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR;
46
46
  var _c = (0, react_1.useState)({ width: 0, height: 0 }), youtubeSize = _c[0], setYoutubeSize = _c[1];
47
47
  var getResponsiveYoutubeSize = (0, react_1.useCallback)(function () {
48
48
  var backgroundWrapper = backgroundRef.current;
@@ -88,9 +88,7 @@ function CustomSectionBackgroundMedia(_a) {
88
88
  }
89
89
  switch (mediaType) {
90
90
  case 'IMAGE':
91
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR && ((0, jsx_runtime_1.jsx)(S_Image, __assign({ src: String(CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR), style: {
92
- overflow: CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL ? 'auto' : 'hidden'
93
- }, normalStyle: componentStyle }, { children: (0, jsx_runtime_1.jsx)("img", { src: String(CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR), style: { visibility: 'hidden', width: '100%', height: '100%' } }, void 0) }), void 0)) }, void 0));
91
+ return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR && ((0, jsx_runtime_1.jsx)(S_Image, __assign({ src: String(CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR), normalStyle: componentStyle }, { children: (0, jsx_runtime_1.jsx)("img", { src: String(CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR), style: { visibility: 'hidden', width: '100%', height: '100%' } }, void 0) }), void 0)) }, void 0));
94
92
  case 'YOUTUBE':
95
93
  return ((0, jsx_runtime_1.jsx)(S_YoutubeContainer, __assign({}, youtubeSize, { children: (0, jsx_runtime_1.jsx)(YouTubeIframe_1.YouTubeIframe, { id: playerId, src: String(CB_STYLE_PROP_BGMEDIA_SPEC_YSRC), loopMode: CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY ? 'use' : 'none', startSeconds: Number(CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME), endSeconds: Number(CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME) }, void 0) }), void 0));
96
94
  case 'NONE':
package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/textUtil.js CHANGED
@@ -49,8 +49,10 @@ function parseStyleTextToCSSProp(_a) {
49
49
  };
50
50
  }
51
51
  if (cssPropertyKey === 'letterSpacing') {
52
- var numValue = Math.abs(+value) * (+value > 0 ? 0.01 : -0.01) + "em";
53
- var numHoverValue = Math.abs(+hoverValue) * (+hoverValue > 0 ? 0.01 : -0.01) + "em";
52
+ var numValue = typeof value === 'number' ? Math.abs(+value) * (+value > 0 ? 0.01 : -0.01) + "em" : value;
53
+ var numHoverValue = typeof hoverValue === 'number'
54
+ ? Math.abs(+hoverValue) * (+hoverValue > 0 ? 0.01 : -0.01) + "em"
55
+ : hoverValue;
54
56
  if (numHoverValue === null || numHoverValue === undefined) {
55
57
  return {
56
58
  style: __assign(__assign({}, acc.style), (_g = {}, _g[cssPropertyKey] = numValue, _g)),
@@ -77,7 +79,7 @@ function parseStyleTextToCSSProp(_a) {
77
79
  if (cssPropertyKey === 'HORIZONTAL') {
78
80
  var horizontalObj = getHorizontalPositionValue(String(value));
79
81
  var hoverHorizontalObj = getHorizontalPositionValue(String(hoverValue));
80
- if (hoverHorizontalObj === null || hoverHorizontalObj === undefined) {
82
+ if (hoverValue === null || hoverValue === undefined) {
81
83
  return { style: __assign(__assign({}, acc.style), horizontalObj), hoverStyle: __assign({}, acc.hoverStyle) };
82
84
  }
83
85
  return {
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropBgImage.d.ts CHANGED
@@ -8,6 +8,7 @@ export default function parseStylePropBGImage(namedProps: NAMED_CB_STYLE_BGIMAGE
8
8
  export declare type CB_STYLE_PROP_BGIMAGE_SPECS_BASE = {
9
9
  CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT: STRING_PLAIN;
10
10
  CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION: ENUM_STRING;
11
+ CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL: boolean;
11
12
  };
12
13
  export declare type CB_STYLE_PROP_BGIMAGE_SPECS = CB_STYLE_PROP_BGIMAGE_SPECS_BASE & {
13
14
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:HOVER': STRING_PLAIN | null | undefined;
@@ -16,4 +17,7 @@ export declare type CB_STYLE_PROP_BGIMAGE_SPECS = CB_STYLE_PROP_BGIMAGE_SPECS_BA
16
17
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:HOVER': ENUM_STRING | null | undefined;
17
18
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE': ENUM_STRING | null | undefined;
18
19
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE:HOVER': ENUM_STRING | null | undefined;
20
+ 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL:HOVER': boolean | null | undefined;
21
+ 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL:MOBILE': boolean | null | undefined;
22
+ 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL:MOBILE:HOVER': boolean | null | undefined;
19
23
  };
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropBgImage.js CHANGED
@@ -13,16 +13,18 @@ var __assign = (this && this.__assign) || function () {
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
14
  var AVAILABLE_SPECS = [
15
15
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT',
16
- 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION'
16
+ 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION',
17
+ 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL'
17
18
  ];
18
19
  function parseStylePropBGImage(namedProps, device) {
19
20
  var specs = namedProps.specs;
20
21
  return AVAILABLE_SPECS.reduce(function (acc, cur) {
21
- var _a, _b;
22
+ var _a, _b, _c;
22
23
  var baseKey = device === 'DESKTOP' ? cur : cur + ":MOBILE";
23
24
  var cssPropertyKey = getParsedKey(baseKey);
24
25
  var value = specs[baseKey] || specs[cur];
25
26
  var isPosition = cssPropertyKey === 'backgroundPosition';
27
+ var isAttachment = cssPropertyKey === 'backgroundAttachment';
26
28
  if (isPosition) {
27
29
  var positionCss = getCssProperties(value);
28
30
  return {
@@ -30,8 +32,15 @@ function parseStylePropBGImage(namedProps, device) {
30
32
  hoverStyle: __assign({}, acc.hoverStyle)
31
33
  };
32
34
  }
35
+ if (isAttachment) {
36
+ var positionCss = value ? 'fixed' : 'unset';
37
+ return {
38
+ style: __assign(__assign({}, acc.style), (_b = {}, _b[cssPropertyKey] = positionCss, _b)),
39
+ hoverStyle: __assign({}, acc.hoverStyle)
40
+ };
41
+ }
33
42
  return {
34
- style: __assign(__assign({}, acc.style), (_b = {}, _b[cssPropertyKey] = value === null || value === void 0 ? void 0 : value.toLowerCase(), _b)),
43
+ style: __assign(__assign({}, acc.style), (_c = {}, _c[cssPropertyKey] = value, _c)),
35
44
  hoverStyle: __assign({}, acc.hoverStyle)
36
45
  };
37
46
  }, {
@@ -52,6 +61,11 @@ function getParsedKey(key) {
52
61
  case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE':
53
62
  case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE:HOVER':
54
63
  return 'backgroundPosition';
64
+ case 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL':
65
+ case 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL:HOVER':
66
+ case 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL:MOBILE':
67
+ case 'CB_STYLE_PROP_BGMEDIA_SPEC_SCROLL:MOBILE:HOVER':
68
+ return 'backgroundAttachment';
55
69
  }
56
70
  }
57
71
  function getCssProperties(value) {
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropImage.js CHANGED
@@ -27,7 +27,7 @@ function parseStylePropImage(namedProps, device) {
27
27
  if (isPosition) {
28
28
  var positionCss = getCssProperties(value);
29
29
  var hoverPositionCss = getCssProperties(hoverValue);
30
- if (hoverPositionCss === null || hoverPositionCss === undefined) {
30
+ if (hoverValue === null || hoverValue === undefined) {
31
31
  return {
32
32
  style: __assign(__assign({}, acc.style), (_a = {}, _a[cssPropertyKey] = positionCss, _a)),
33
33
  hoverStyle: __assign({}, acc.hoverStyle)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "0.2.19",
3
+ "version": "0.2.20",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",