pds-dev-kit-web-test 2.5.639 → 2.5.640

package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackground.js

@@ -33,7 +33,6 @@ function CustomSectionBackground(_a) {
     var data = jsonProperties.data;
     var CB_STYLE_PROP_BGOVERLAY = data.CB_STYLE_PROP_BGOVERLAY, CB_STYLE_PROP_BGMEDIA = data.CB_STYLE_PROP_BGMEDIA;
     var _c = (0, util_1.parseJsonProperties)(data, isMobile ? 'MOBILE' : 'DESKTOP'), style = _c.style, overlayStyle = _c.overlayStyle, effect = _c.effect;
-    console.log('DATA FROM CUSTOM SECTION BG:', data);
     var isOverlay = getIsOverlay(isMobile, CB_STYLE_PROP_BGOVERLAY);
     var isBgMedia = getIsBgMedia(isMobile, CB_STYLE_PROP_BGMEDIA);
     var mediaType = getMediaType(isMobile, CB_STYLE_PROP_BGMEDIA);

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/ContentsList.js

@@ -25,6 +25,8 @@ var dynamicLayoutContext_1 = require("../../../../../../../DynamicLayout/dynamic
 var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/hooks");
 var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
 var styled_components_1 = __importDefault(require("styled-components"));
+var CBBackgroundMedia_1 = __importDefault(require("../../propComponent/CBBackgroundMedia"));
+require("../../propComponent/CBBackgroundOverlay");
 var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
 var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
 var CustomPagination_1 = require("./components/CustomPagination");
@@ -56,7 +58,7 @@ function ContentsList(props) {
     var totalPage = Math.ceil((CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE === 'DATA' && queryDataValue
         ? queryDataValue === null || queryDataValue === void 0 ? void 0 : queryDataValue.length
         : compositions.length - 1) / CB_CONTENT_PROP_CONTENTSLIST_SPEC_DISPLAYCOUNTS);
-    var _h = (0, util_1.parseProperties)(props, device), style = _h.style, hoverStyle = _h.hoverStyle, layout = _h.layout, effect = _h.effect;
+    var _h = (0, util_1.parseProperties)(props, device), style = _h.style, hoverStyle = _h.hoverStyle, layout = _h.layout, effect = _h.effect, overlayStyle = _h.overlayStyle;
     var contentPropCss = (0, contentsListUtils_1.parseGridContentProp)({
         props: CB_CONTENT_PROP_CONTENTSLIST
     }).contentPropCss;
@@ -126,6 +128,7 @@ function ContentsList(props) {
                 return null;
         }
     };
+    console.log('overlayStyle', overlayStyle);
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [Object.entries(componentGroups).map(function (_a) {
                 var position = _a[0], groupComponents = _a[1];
                 return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-group", ref: function (el) {
@@ -136,20 +139,20 @@ function ContentsList(props) {
                             delete positionRefs.current[position];
                         }
                     }, style: __assign(__assign({}, getPositionStyle(position, ccbInset)), { zIndex: 3 }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-layout-box", style: getComponentGroupLayout(groupComponents, position) }, { children: groupComponents.map(function (component) { return renderElements(component); }) })) }), position));
-            }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ id: "contentslist-box", className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-items": CB_CONTENT_PROP_CONTENTSLIST_SPEC_ITEMCOUNTS, "data-number-of-columns": CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS, "data-row-gap": rowGap, "data-column-gap": columnGap, "data-cols": CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS, "data-min-width": listMinWidth, "data-min-height": listMinHeight, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: (0, jsx_runtime_1.jsx)(S_ContentsListLayout, __assign({ className: "cb-contentslist-layout-box", ref: layoutRef }, { children: (0, jsx_runtime_1.jsx)(S_ContentsListWrapper, __assign({ className: "cb-contentslist-wrapper", 
+            }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ id: "contentslist-box", className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-items": CB_CONTENT_PROP_CONTENTSLIST_SPEC_ITEMCOUNTS, "data-number-of-columns": CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS, "data-row-gap": rowGap, "data-column-gap": columnGap, "data-cols": CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS, "data-min-width": listMinWidth, "data-min-height": listMinHeight, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: (0, jsx_runtime_1.jsx)(S_ContentsListLayout, __assign({ className: "cb-contentslist-layout-box", ref: layoutRef }, { children: (0, jsx_runtime_1.jsxs)(S_ContentsListWrapper, __assign({ className: "cb-contentslist-wrapper", 
                             // ccbInset={ccbInset}
                             ccbInset: {
                                 top: '0px',
                                 right: '0px',
                                 bottom: '0px',
                                 left: '0px'
-                            }, contentPropCss: contentPropCss, stylePropCss: isHovered ? hoverStylePropCss : stylePropCss }, { children: (0, createCompositions_1.createCompositions)({
-                                valueType: CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE,
-                                queryPath: CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA,
-                                limit: CB_CONTENT_PROP_CONTENTSLIST_SPEC_ITEMCOUNTS,
-                                queryData: queryData,
-                                compositions: compositions
-                            }).slice(startIndex, endIndex) })) })) })) }))] }));
+                            }, contentPropCss: contentPropCss, stylePropCss: isHovered ? hoverStylePropCss : stylePropCss }, { children: [(0, jsx_runtime_1.jsx)(CBBackgroundMedia_1.default, {}), (0, createCompositions_1.createCompositions)({
+                                    valueType: CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE,
+                                    queryPath: CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA,
+                                    limit: CB_CONTENT_PROP_CONTENTSLIST_SPEC_ITEMCOUNTS,
+                                    queryData: queryData,
+                                    compositions: compositions
+                                }).slice(startIndex, endIndex), (0, jsx_runtime_1.jsx)("div", { style: overlayStyle })] })) })) })) }))] }));
 }
 var S_ContentsListLayout = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 100%;\n  margin: 0 auto;\n  position: relative;\n  width: 100%;\n"], ["\n  height: 100%;\n  margin: 0 auto;\n  position: relative;\n  width: 100%;\n"])));
 var S_ContentsListWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  bottom: ", ";\n  display: grid;\n  left: ", ";\n  position: absolute;\n  right: ", ";\n  top: ", ";\n\n  ", ";\n  ", ";\n"], ["\n  bottom: ", ";\n  display: grid;\n  left: ", ";\n  position: absolute;\n  right: ", ";\n  top: ", ";\n\n  ", ";\n  ", ";\n"])), function (_a) {

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/propComponent/CBBackgroundMedia.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function CBBackgroundMedia(): JSX.Element;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/propComponent/CBBackgroundMedia.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+function CBBackgroundMedia() {
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "CB- background-media" });
+}
+exports.default = CBBackgroundMedia;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/propComponent/CBBackgroundOverlay.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function CBBackgroundOverlay(): JSX.Element;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/propComponent/CBBackgroundOverlay.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+require("../../../util");
+function CBBackgroundOverlay() {
+    // console.log('ccb background overlay', jsonProperties);
+    // const { style, overlayStyle, effect } = parseJsonProperties(
+    //   data,
+    //   isMobile ? 'MOBILE' : 'DESKTOP'
+    // );
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: "CB- background-overlay" });
+}
+exports.default = CBBackgroundOverlay;

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parseProperties.js

@@ -27,8 +27,8 @@ function parseProperties(properties, device) {
             specs: specs
         };
         if (normalizedProperty.name in types_4.CB_STYLE_PROP_KEYS) {
-            var _a = (0, stylePropParsers_1.parseStyleProperties)(normalizedProperty, device), style = _a.style, hoverStyle = _a.hoverStyle;
-            return __assign(__assign({}, acc), { style: __assign(__assign({}, acc.style), style), hoverStyle: __assign(__assign({}, acc.hoverStyle), hoverStyle) });
+            var _a = (0, stylePropParsers_1.parseStyleProperties)(normalizedProperty, device), style = _a.style, hoverStyle = _a.hoverStyle, overlayStyle = _a.overlayStyle;
+            return __assign(__assign({}, acc), { style: __assign(__assign({}, acc.style), style), hoverStyle: __assign(__assign({}, acc.hoverStyle), hoverStyle), overlayStyle: __assign(__assign({}, acc.overlayStyle), overlayStyle) });
         }
         if (normalizedProperty.name in types_3.CB_LAYOUT_PROP_KEYS) {
             var style = (0, layoutPropParsers_1.parseLayoutProperties)(normalizedProperty, device).style;
@@ -48,7 +48,8 @@ function parseProperties(properties, device) {
         hoverStyle: {},
         layout: {},
         effect: {},
-        content: {}
+        content: {},
+        overlayStyle: {}
     });
 }
 exports.default = parseProperties;

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/types.d.ts

@@ -194,6 +194,7 @@ export type OverlayStyle = {
 export type Device = 'DESKTOP' | 'MOBILE';
 export type DefaultBrightTheme = 'LIGHT' | 'DARK';
 export type ParserResult = {
+    overlayStyle: any;
     style: CSSProperties;
     hoverStyle: CSSProperties;
     layout: CSSProperties;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web-test",
-  "version": "2.5.639",
+  "version": "2.5.640",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",