pds-dev-kit-web-test 2.6.21 → 2.6.23

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

@@ -1,10 +1,11 @@
-import type { CB_BTN_PROPERTIES_TYPE, CB_DIVIDER_PROPERTIES_TYPE, CB_EMBED_PROPERTIES_TYPE, CB_IMG_PROPERTIES_TYPE, CB_RICHTEXT_PROPERTIES_TYPE, CB_TEXT_PROPERTIES_TYPE, CB_TWITTER_PROPERTIES_TYPE, CB_VIDEOPLAYER_PROPERTIES_TYPE, CB_YOUTUBE_PROPERTIES_TYPE } from './util/types';
+import type { CB_BTN_PROPERTIES_TYPE, CB_DIVIDER_PROPERTIES_TYPE, CB_EMBED_PROPERTIES_TYPE, CB_IMG_PROPERTIES_TYPE, CB_RICHTEXT_PROPERTIES_TYPE, CB_TEXT_PROPERTIES_TYPE, CB_TWITTER_PROPERTIES_TYPE, CB_LIST_PROPERTIES_TYPE, CB_CONTENTSCAROUSEL_PROPERTIES_TYPE, CB_SLIDEBANNER_PROPERTIES_TYPE, CB_VIDEOPLAYER_PROPERTIES_TYPE, CB_YOUTUBE_PROPERTIES_TYPE } from './util/types';
 import type { IComposition } from '../../../DynamicLayout/types';
 export type CB_TYPES = 'GENERAL';
-export type ComponentBlock = CB_TEXT_TYPE | CB_BTN_TYPE | CB_RICHTEXT | CB_DIVIDER | CB_IMG | CB_YOUTUBE | CB_TWITTER | CB_IFRAME | CB_GROUP | CB_CONTENTS_CAROUSEL | CB_VIDEOPLAYER;
+export type ComponentBlock = CB_TEXT_TYPE | CB_BTN_TYPE | CB_RICHTEXT | CB_DIVIDER | CB_IMG | CB_YOUTUBE | CB_TWITTER | CB_IFRAME | CB_GROUP | CB_LIST | CB_CONTENTSCAROUSEL | CB_SLIDEBANNER | CB_VIDEOPLAYER;
 type GeneralCustomSectionType = {
     id: number;
     type: 'GENERAL';
+    blockId?: string;
     availablePlugins: Array<string>;
     queryableTapSrc: string;
     queryableDefinitionPreset: string;
@@ -18,7 +19,7 @@ export type GroupCustomSectionType = {
     queryableDefinitionPreset: string;
     dynamicLayoutSectionId: number;
 };
-export type AllCBProperties = CB_TEXT_PROPERTIES_TYPE | CB_BTN_PROPERTIES_TYPE | CB_RICHTEXT_PROPERTIES_TYPE | CB_RICHTEXT_PROPERTIES_TYPE | CB_DIVIDER_PROPERTIES_TYPE | CB_YOUTUBE_PROPERTIES_TYPE | CB_IMG_PROPERTIES_TYPE | CB_TWITTER_PROPERTIES_TYPE | CB_EMBED_PROPERTIES_TYPE | CB_VIDEOPLAYER_PROPERTIES_TYPE;
+export type AllCBProperties = CB_TEXT_PROPERTIES_TYPE | CB_BTN_PROPERTIES_TYPE | CB_RICHTEXT_PROPERTIES_TYPE | CB_RICHTEXT_PROPERTIES_TYPE | CB_DIVIDER_PROPERTIES_TYPE | CB_YOUTUBE_PROPERTIES_TYPE | CB_IMG_PROPERTIES_TYPE | CB_TWITTER_PROPERTIES_TYPE | CB_EMBED_PROPERTIES_TYPE | CB_LIST_PROPERTIES_TYPE | CB_CONTENTSCAROUSEL_PROPERTIES_TYPE | CB_SLIDEBANNER_PROPERTIES_TYPE | CB_VIDEOPLAYER_PROPERTIES_TYPE;
 export type CB_TEXT_TYPE = GeneralCustomSectionType & {
     componentBlockCode: CB_ALL_CODES.CB_TEXT;
     jsonProperties: {
@@ -55,6 +56,12 @@ export type CB_YOUTUBE = GeneralCustomSectionType & {
         data: CB_YOUTUBE_PROPERTIES_TYPE;
     };
 };
+export type CB_VIDEOPLAYER = GeneralCustomSectionType & {
+    componentBlockCode: CB_ALL_CODES.CB_VIDEOPLAYER;
+    jsonProperties: {
+        data: CB_YOUTUBE_PROPERTIES_TYPE;
+    };
+};
 export type CB_TWITTER = GeneralCustomSectionType & {
     componentBlockCode: CB_ALL_CODES.CB_TWITTER;
     jsonProperties: {
@@ -73,18 +80,26 @@ export type CB_GROUP = GeneralCustomSectionType & {
         data: CB_BTN_PROPERTIES_TYPE;
     };
 };
-export type CB_CONTENTS_CAROUSEL = GeneralCustomSectionType & {
-    componentBlockCode: CB_ALL_CODES.CB_CONTENTS_CAROUSEL;
+export type CB_CONTENTSCAROUSEL = GeneralCustomSectionType & {
+    componentBlockCode: CB_ALL_CODES.CB_CONTENTSCAROUSEL;
     jsonProperties: {
-        data: CB_BTN_PROPERTIES_TYPE;
+        data: CB_CONTENTSCAROUSEL_PROPERTIES_TYPE;
     };
     compositions: Array<IComposition>;
 };
-export type CB_VIDEOPLAYER = GeneralCustomSectionType & {
-    componentBlockCode: CB_ALL_CODES.CB_VIDEOPLAYER;
+export type CB_SLIDEBANNER = GeneralCustomSectionType & {
+    componentBlockCode: CB_ALL_CODES.CB_SLIDEBANNER;
     jsonProperties: {
-        data: CB_VIDEOPLAYER_PROPERTIES_TYPE;
+        data: CB_SLIDEBANNER_PROPERTIES_TYPE;
     };
+    compositions: Array<IComposition>;
+};
+export type CB_LIST = GeneralCustomSectionType & {
+    componentBlockCode: CB_ALL_CODES.CB_LIST;
+    jsonProperties: {
+        data: CB_LIST_PROPERTIES_TYPE;
+    };
+    compositions: Array<IComposition>;
 };
 export declare enum CB_ALL_CODES {
     CB_TEXT = "CB_TEXT",
@@ -96,7 +111,9 @@ export declare enum CB_ALL_CODES {
     CB_TWITTER = "CB_TWITTER",
     CB_EMBED = "CB_EMBED",
     CB_GROUP = "CB_GROUP",
-    CB_CONTENTS_CAROUSEL = "CB_CONTENTS_CAROUSEL",
+    CB_LIST = "CB_LIST",
+    CB_CONTENTSCAROUSEL = "CB_CONTENTSCAROUSEL",
+    CB_SLIDEBANNER = "CB_SLIDEBANNER",
     CB_VIDEOPLAYER = "CB_VIDEOPLAYER"
 }
 export {};

package/dist/src/sub/DynamicLayout/sections/CustomSection/types.js

@@ -12,6 +12,8 @@ var CB_ALL_CODES;
     CB_ALL_CODES["CB_TWITTER"] = "CB_TWITTER";
     CB_ALL_CODES["CB_EMBED"] = "CB_EMBED";
     CB_ALL_CODES["CB_GROUP"] = "CB_GROUP";
-    CB_ALL_CODES["CB_CONTENTS_CAROUSEL"] = "CB_CONTENTS_CAROUSEL";
+    CB_ALL_CODES["CB_LIST"] = "CB_LIST";
+    CB_ALL_CODES["CB_CONTENTSCAROUSEL"] = "CB_CONTENTSCAROUSEL";
+    CB_ALL_CODES["CB_SLIDEBANNER"] = "CB_SLIDEBANNER";
     CB_ALL_CODES["CB_VIDEOPLAYER"] = "CB_VIDEOPLAYER";
 })(CB_ALL_CODES = exports.CB_ALL_CODES || (exports.CB_ALL_CODES = {}));

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

@@ -12,8 +12,8 @@ export type CB_EFFECT_PROP_ENTANIM_BASE = {
     CB_EFFECT_PROP_ENTANIM_SPEC_TYPE: string;
 };
 export type CB_EFFECT_PROP_ENTANIM_SPECS = CB_EFFECT_PROP_ENTANIM_BASE & Partial<{
-    'CB_EFFECT_PROP_ENTANIM_SPEC_DURATION:MOBILE': number | undefined;
-    'CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT:MOBILE': number | undefined;
-    'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': string | undefined;
-    'CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE': string | undefined;
+    'CB_EFFECT_PROP_ENTANIM_SPEC_DURATION:MOBILE': number | undefined | null;
+    'CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT:MOBILE': number | undefined | null;
+    'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': string | undefined | null;
+    'CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE': string | undefined | null;
 }>;

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

@@ -16,8 +16,8 @@ export type CB_STYLE_PROP_PADDING_BASE = {
 };
 export type CB_LAYOUT_PROP_PADDING_SPECS = CB_STYLE_PROP_PADDING_BASE & {
     CB_LAYOUT_PROP_PADDING_SPEC_PADDING: CB_LAYOUT_PROP_PADDING_SPEC_PADDING_OBJ;
-    'CB_LAYOUT_PROP_PADDING_SPEC_PADDING:MOBILE': CB_LAYOUT_PROP_PADDING_SPEC_PADDING_OBJ | undefined;
+    'CB_LAYOUT_PROP_PADDING_SPEC_PADDING:MOBILE': CB_LAYOUT_PROP_PADDING_SPEC_PADDING_OBJ | undefined | null;
     CB_LAYOUT_PROP_PADDING_SPEC_FIX: boolean;
-    'CB_LAYOUT_PROP_PADDING_SPEC_FIX:MOBILE': boolean | undefined;
+    'CB_LAYOUT_PROP_PADDING_SPEC_FIX:MOBILE': boolean | undefined | null;
 };
 export {};

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

@@ -0,0 +1,14 @@
+import type { ICompositionJsonProperties } from '../../../../DynamicLayout/types';
+type Props = {
+    isMobile: boolean;
+    compositionProps: ICompositionJsonProperties['data']['CB_PLACEMENT_PROP_COMPOSITION'];
+};
+declare function parseCompositionPlacement({ isMobile, compositionProps }: Props): {
+    minHeight: number | null;
+    maxHeight: number | null;
+    minWidth: number | null;
+    maxWidth: number | null;
+    rows: number;
+    columns: number;
+};
+export default parseCompositionPlacement;

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

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function parseCompositionPlacement(_a) {
+    var _b, _c, _d, _e, _f, _g;
+    var isMobile = _a.isMobile, compositionProps = _a.compositionProps;
+    var CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT = compositionProps.CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT, CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT = compositionProps.CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT, CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH = compositionProps.CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH, CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH = compositionProps.CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH, CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS = compositionProps.CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS, CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS = compositionProps.CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS;
+    if (isMobile) {
+        return {
+            minHeight: (_b = compositionProps['CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT:MOBILE']) !== null && _b !== void 0 ? _b : CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT,
+            maxHeight: (_c = compositionProps['CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT:MOBILE']) !== null && _c !== void 0 ? _c : CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT,
+            minWidth: (_d = compositionProps['CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH:MOBILE']) !== null && _d !== void 0 ? _d : CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH,
+            maxWidth: (_e = compositionProps['CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH:MOBILE']) !== null && _e !== void 0 ? _e : CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH,
+            rows: (_f = compositionProps['CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS:MOBILE']) !== null && _f !== void 0 ? _f : CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS,
+            columns: (_g = compositionProps['CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS:MOBILE']) !== null && _g !== void 0 ? _g : CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS
+        };
+    }
+    return {
+        minHeight: CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT,
+        maxHeight: CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT,
+        minWidth: CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH,
+        maxWidth: CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH,
+        rows: CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS,
+        columns: CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS
+    };
+}
+exports.default = parseCompositionPlacement;

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

@@ -1,3 +1,3 @@
 import type { Device, JsonPropertiesParserResult } from './types';
-import type { ISectionJsonProperties } from '../../../../DynamicLayout/types';
-export default function parseJsonProperties(properties: ISectionJsonProperties['data'] | undefined, device: Device): JsonPropertiesParserResult;
+import type { ICompositionJsonProperties, ISectionJsonProperties } from '../../../../DynamicLayout/types';
+export default function parseJsonProperties(properties: ISectionJsonProperties['data'] | ICompositionJsonProperties['data'] | undefined, device: Device): JsonPropertiesParserResult;

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

@@ -1,6 +1,7 @@
 import { ComponentBlock } from '../types';
-import type { ZOrder } from 'publ-echo/dist/lib/GridLayoutEditor/group';
-export declare function parsePlacement(components: ComponentBlock[], zOrders: ZOrder): {
+import type { PlaceRestrictionType } from '../../../../DynamicLayout/types';
+import type { ZOrder } from 'publ-echo-test/dist/lib/GridLayoutEditor/group';
+export declare function parsePlacement(components: ComponentBlock[], zOrders: ZOrder, placementRestriction?: PlaceRestrictionType): {
     sm: {
         i: string;
         x: number;
@@ -9,6 +10,8 @@ export declare function parsePlacement(components: ComponentBlock[], zOrders: ZO
         h: number;
         z: number;
         autoResize: boolean;
+        minH: number;
+        minW: number;
     }[];
     lg: {
         i: string;
@@ -18,6 +21,8 @@ export declare function parsePlacement(components: ComponentBlock[], zOrders: ZO
         h: number;
         z: number;
         autoResize: boolean;
+        minH: number;
+        minW: number;
     }[];
 };
 export default parsePlacement;

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

@@ -12,13 +12,13 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.parsePlacement = void 0;
 var types_1 = require("../types");
-function parsePlacement(components, zOrders) {
+function parsePlacement(components, zOrders, placementRestriction) {
     if (!zOrders) {
         console.error('Z-ORDER NOT FOUND');
     }
     return components.reduce(function (acc, cur) {
         var id = cur.id, jsonProperties = cur.jsonProperties, componentBlockCode = cur.componentBlockCode;
-        var _a = parsePropPlacement(jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, id, componentBlockCode, zOrders), mobileLayout = _a.mobileLayout, desktopLayout = _a.desktopLayout;
+        var _a = parsePropPlacement(jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, id, componentBlockCode, zOrders, placementRestriction ? placementRestriction[componentBlockCode] : undefined), mobileLayout = _a.mobileLayout, desktopLayout = _a.desktopLayout;
         return {
             sm: __spreadArray(__spreadArray([], acc.sm, true), [mobileLayout], false),
             lg: __spreadArray(__spreadArray([], acc.lg, true), [desktopLayout], false)
@@ -26,7 +26,8 @@ function parsePlacement(components, zOrders) {
     }, { sm: [], lg: [] });
 }
 exports.parsePlacement = parsePlacement;
-function parsePropPlacement(props, id, cbCode, zOrders) {
+function parsePropPlacement(props, id, cbCode, zOrders, cbRestriction) {
+    var _a, _b, _c, _d;
     var desktopLayout = {
         i: id.toString(),
         x: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX,
@@ -34,7 +35,9 @@ function parsePropPlacement(props, id, cbCode, zOrders) {
         w: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS,
         h: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS,
         z: zOrders.desktop[id],
-        autoResize: cbCode === types_1.CB_ALL_CODES.CB_TEXT
+        autoResize: AUTO_RESIZE_CODES.includes(cbCode),
+        minH: (_a = cbRestriction === null || cbRestriction === void 0 ? void 0 : cbRestriction.rowHMin) !== null && _a !== void 0 ? _a : 1,
+        minW: (_b = cbRestriction === null || cbRestriction === void 0 ? void 0 : cbRestriction.columnWMin) !== null && _b !== void 0 ? _b : 1
     };
     var mobileLayout = {
         i: id.toString(),
@@ -43,11 +46,19 @@ function parsePropPlacement(props, id, cbCode, zOrders) {
         w: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE'],
         h: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS:MOBILE'],
         z: zOrders.mobile[id],
-        autoResize: cbCode === types_1.CB_ALL_CODES.CB_TEXT
+        autoResize: AUTO_RESIZE_CODES.includes(cbCode),
+        minH: (_c = cbRestriction === null || cbRestriction === void 0 ? void 0 : cbRestriction.rowHMin) !== null && _c !== void 0 ? _c : 1,
+        minW: (_d = cbRestriction === null || cbRestriction === void 0 ? void 0 : cbRestriction.mobileColumnWMin) !== null && _d !== void 0 ? _d : 1
     };
     return {
         mobileLayout: mobileLayout,
         desktopLayout: desktopLayout
     };
 }
+var AUTO_RESIZE_CODES = [
+    types_1.CB_ALL_CODES.CB_TEXT
+    // CB_ALL_CODES.CB_LIST,
+    // CB_ALL_CODES.CB_CONTENTSCAROUSEL,
+    // CB_ALL_CODES.CB_SLIDEBANNER
+];
 exports.default = parsePlacement;

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

@@ -1,5 +1,5 @@
 import { CB_LAYOUT_PROP_KEYS } from './layoutPropParsers/types';
 import { CB_STYLE_PROP_KEYS } from './stylePropParsers/types';
-import type { Device, ParserResult, CB_TEXT_PROPERTIES_TYPE, CB_BTN_PROPERTIES_TYPE, CB_IMG_PROPERTIES_TYPE, CB_TWITTER_PROPERTIES_TYPE, CB_DIVIDER_PROPERTIES_TYPE, CB_YOUTUBE_PROPERTIES_TYPE, CB_RICHTEXT_PROPERTIES_TYPE, CB_EMBED_PROPERTIES_TYPE, CB_VIDEOPLAYER_PROPERTIES_TYPE } from './types';
+import type { Device, ParserResult, CB_TEXT_PROPERTIES_TYPE, CB_BTN_PROPERTIES_TYPE, CB_IMG_PROPERTIES_TYPE, CB_TWITTER_PROPERTIES_TYPE, CB_DIVIDER_PROPERTIES_TYPE, CB_YOUTUBE_PROPERTIES_TYPE, CB_RICHTEXT_PROPERTIES_TYPE, CB_EMBED_PROPERTIES_TYPE, CB_LIST_PROPERTIES_TYPE, CB_CONTENTSCAROUSEL_PROPERTIES_TYPE, CB_SLIDEBANNER_PROPERTIES_TYPE, CB_VIDEOPLAYER_PROPERTIES_TYPE } from './types';
 export type specTypes = CB_LAYOUT_PROP_KEYS | CB_STYLE_PROP_KEYS;
-export default function parseProperties(properties: CB_TEXT_PROPERTIES_TYPE | CB_BTN_PROPERTIES_TYPE | CB_IMG_PROPERTIES_TYPE | CB_TWITTER_PROPERTIES_TYPE | CB_DIVIDER_PROPERTIES_TYPE | CB_YOUTUBE_PROPERTIES_TYPE | CB_RICHTEXT_PROPERTIES_TYPE | CB_EMBED_PROPERTIES_TYPE | CB_VIDEOPLAYER_PROPERTIES_TYPE, device: Device): ParserResult;
+export default function parseProperties(properties: CB_TEXT_PROPERTIES_TYPE | CB_BTN_PROPERTIES_TYPE | CB_IMG_PROPERTIES_TYPE | CB_TWITTER_PROPERTIES_TYPE | CB_DIVIDER_PROPERTIES_TYPE | CB_YOUTUBE_PROPERTIES_TYPE | CB_RICHTEXT_PROPERTIES_TYPE | CB_EMBED_PROPERTIES_TYPE | CB_LIST_PROPERTIES_TYPE | CB_CONTENTSCAROUSEL_PROPERTIES_TYPE | CB_SLIDEBANNER_PROPERTIES_TYPE | CB_VIDEOPLAYER_PROPERTIES_TYPE, device: Device): ParserResult;

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/stylePropParsers/parseStylePropBorder.js

@@ -27,6 +27,9 @@ function parseStylePropBorder(namedProps, device) {
         var value = specs[baseKey];
         var hoverValue = specs["".concat(baseKey, ":HOVER")];
         var isRadius = cssPropertyKey === 'borderRadius';
+        if (value === null || value === undefined) {
+            return acc;
+        }
         if (isRadius) {
             var _d = value, tl = _d.tl, tr = _d.tr, bl = _d.bl, br = _d.br;
             var hoverValueTypeExpanded = hoverValue;

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/stylePropParsers/parseStylePropTextSpec.js

@@ -87,5 +87,7 @@ function getParsedKey(key) {
         case "CB_STYLE_PROP_TEXT_SPEC_VERTICAL:MOBILE":
         case "CB_STYLE_PROP_TEXT_SPEC_VERTICAL:MOBILE:HOVER":
             return 'VERTICAL';
+        default:
+            return '';
     }
 }

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

@@ -1,22 +1,31 @@
+import type { CB_STYLE_PROP_CONTENTSCAROUSEL_SPECS } from '../components/ComponentBlock/componentBlocks/ContentsCarousel/types';
+import type { CB_STYLE_PROP_CONTENTSLIST_SPECS } from '../components/ComponentBlock/componentBlocks/ContentsList/types';
+import type { CB_STYLE_PROP_SLIDEBANNER_SPECS } from '../components/ComponentBlock/componentBlocks/SlideBanner/types';
 import type { CB_TWITTER_STYLE_PROPS } from '../components/ComponentBlock/componentBlocks/Twitter/types';
-import type { CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CODEBLOCK, CB_CONTENT_PROP_IMAGE, CB_CONTENT_PROP_TEXT, CB_CONTENT_PROP_TWITTER, CB_CONTENT_PROP_VIDEO, CB_STYLE_PROP_COLOR_SPECS, CB_STYLE_PROP_TEXT_SPECS } from '../components/ComponentBlock/componentBlocks/types';
+import type { CB_CONTENT_PROP_CONTENTSCAROUSEL, CB_CONTENT_PROP_SLIDEBANNER, CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CODEBLOCK, CB_CONTENT_PROP_IMAGE, CB_CONTENT_PROP_TEXT, CB_CONTENT_PROP_TWITTER, CB_STYLE_PROP_COLOR_SPECS, CB_STYLE_PROP_TEXT_SPECS, CB_CONTENT_PROP_CONTENTSLIST, CB_CONTENT_PROP_VIDEO } from '../components/ComponentBlock/componentBlocks/types';
 import type { CB_CONTENT_PROP_YOUTUBE_TYPE, CB_STYLE_PROP_BGCOLOR_SPECS } from '../components/ComponentBlock/componentBlocks/Youtube/types';
 import type { CB_CONTENT_PROP_VISIBILITY_SPECS } from './contentPropParsers/parseContentVisibility';
 import type { CB_EFFECT_PROP_ENTANIM_SPECS } from './effectPropParsers/parseEffectPropEntAnim';
 import type { CB_LAYOUT_PROP_ARRANGE_SPECS } from './layoutPropParsers/parseLayoutPropArrange';
 import type { CB_LAYOUT_PROP_PADDING_SPECS } from './layoutPropParsers/parseLayoutPropPadding';
 import type { NamedLayoutPropType } from './layoutPropParsers/types';
+import type { CB_STYLE_PROP_BGOVERLAY_SPECS } from './stylePropParsers/parseStylePropBgOverlay';
 import type { CB_STYLE_PROP_BORDER_SPECS } from './stylePropParsers/parseStylePropBorder';
 import type { CB_STYLE_PROP_DIVIDER_SPECS } from './stylePropParsers/parseStylePropDivider';
 import type { CB_STYLE_PROP_IMAGE_SPECS } from './stylePropParsers/parseStylePropImage';
 import type { CB_STYLE_PROP_TEXT_OPACITY_SPECS } from './stylePropParsers/parseStylePropOpacity';
 import type { CB_STYLE_PROP_SHADOW_SPECS } from './stylePropParsers/parseStylePropShadow';
 import type { NamedStylePropType } from './stylePropParsers/types';
+import type { CB_STYLE_PROP_BGMEDIA_SPECS } from '../../../../DynamicLayout/types';
 import type { CSSProperties } from 'react';
 export type STRING_PLAIN = string;
 export type ENUM_STRING = string;
 export type NUMBER_INTEGER = number;
 export type STRING_8DIGIT_HEX = string;
+export type CCB_VALUE_TYPE = 'VALUE' | 'DATA';
+export type CB_VALUE_TYPE = 'VALUE' | 'DELEGATEDDATA' | 'QUERYDATA';
+export type COMPOSITION_VALUE_TYPE = 'VALUE' | 'DELEGATEDDATA' | 'QUERYDATA';
+export type SECTION_VALUE_TYPE = 'VALUE' | 'QUERYDATA';
 export type CB_GENERAL_PROPERTIES_TYPE = {
     CB_PLACEMENT_PROP_PLACEMENT: CB_PLACEMENT_PROP_SPECS;
     CB_CONTENT_PROP_HOVER: {
@@ -34,8 +43,6 @@ export type CB_PLACEMENT_PROP_SPECS = {
     'CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY:MOBILE': number;
     CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX: number;
     'CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE': number;
-    'CB_PLACEMENT_PROP_PLACEMENT_SPEC_LATEST_LOCKED_STARTY:MOBILE': number;
-    'CB_PLACEMENT_PROP_PLACEMENT_SPEC_LOCKSTATUS:MOBILE': 'LOCKED' | 'FALLBACK_TO_SYNC' | undefined;
 };
 export type CB_TEXT_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
     CB_CONTENT_PROP_TEXT: CB_CONTENT_PROP_TEXT;
@@ -122,6 +129,53 @@ export type CB_YOUTUBE_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
     CB_LAYOUT_PROP_PADDING: CB_LAYOUT_PROP_PADDING_SPECS;
     CB_EFFECT_PROP_ENTANIM: CB_EFFECT_PROP_ENTANIM_SPECS;
 };
+export type CB_CONTENTSCAROUSEL_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
+    CB_CONTENT_PROP_CONTENTSCAROUSEL: CB_CONTENT_PROP_CONTENTSCAROUSEL;
+    CB_STYLE_PROP_CONTENTSCAROUSEL: CB_STYLE_PROP_CONTENTSCAROUSEL_SPECS;
+    CB_STYLE_PROP_BORDER: CB_STYLE_PROP_BORDER_SPECS;
+    CB_STYLE_PROP_SHADOW: CB_STYLE_PROP_SHADOW_SPECS;
+    CB_STYLE_PROP_OPACITY: CB_STYLE_PROP_TEXT_OPACITY_SPECS;
+    CB_STYLE_PROP_BGCOLOR: CB_STYLE_PROP_BGCOLOR_SPECS;
+    CB_STYLE_PROP_BGOVERLAY: CB_STYLE_PROP_BGOVERLAY_SPECS;
+    CB_STYLE_PROP_BGMEDIA: CB_STYLE_PROP_BGMEDIA_SPECS;
+    CB_LAYOUT_PROP_PADDING: CB_LAYOUT_PROP_PADDING_SPECS;
+    CB_LAYOUT_PROP_ARRANGE: CB_LAYOUT_PROP_ARRANGE_SPECS;
+    CB_CONTENT_PROP_VISIBILITY: CB_CONTENT_PROP_VISIBILITY_SPECS;
+    CB_EFFECT_PROP_ENTANIM: CB_EFFECT_PROP_ENTANIM_SPECS;
+    CB_CONTENT_PROP_CLINK: CB_CONTENT_PROP_CLINK;
+    CB_EFFECT_PROP_CONTENTSCAROUSEL: CB_EFFECT_PROP_CONTENTSCAROUSEL;
+};
+export type CB_EFFECT_PROP_CONTENTSCAROUSEL = {
+    CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE: 'SLIDE' | 'CUBE' | 'FADE' | 'CARD' | 'COVERFLOW' | 'FLIP';
+};
+export type CB_SLIDEBANNER_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
+    CB_CONTENT_PROP_SLIDEBANNER: CB_CONTENT_PROP_SLIDEBANNER;
+    CB_STYLE_PROP_SLIDEBANNER: CB_STYLE_PROP_SLIDEBANNER_SPECS;
+    CB_STYLE_PROP_BORDER: CB_STYLE_PROP_BORDER_SPECS;
+    CB_STYLE_PROP_SHADOW: CB_STYLE_PROP_SHADOW_SPECS;
+    CB_STYLE_PROP_OPACITY: CB_STYLE_PROP_TEXT_OPACITY_SPECS;
+    CB_STYLE_PROP_BGCOLOR: CB_STYLE_PROP_BGCOLOR_SPECS;
+    CB_STYLE_PROP_BGOVERLAY: CB_STYLE_PROP_BGOVERLAY_SPECS;
+    CB_STYLE_PROP_BGMEDIA: CB_STYLE_PROP_BGMEDIA_SPECS;
+    CB_LAYOUT_PROP_PADDING: CB_LAYOUT_PROP_PADDING_SPECS;
+    CB_LAYOUT_PROP_ARRANGE: CB_LAYOUT_PROP_ARRANGE_SPECS;
+    CB_CONTENT_PROP_VISIBILITY: CB_CONTENT_PROP_VISIBILITY_SPECS;
+    CB_EFFECT_PROP_ENTANIM: CB_EFFECT_PROP_ENTANIM_SPECS;
+};
+export type CB_LIST_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
+    CB_CONTENT_PROP_CONTENTSLIST: CB_CONTENT_PROP_CONTENTSLIST;
+    CB_STYLE_PROP_CONTENTSLIST: CB_STYLE_PROP_CONTENTSLIST_SPECS;
+    CB_STYLE_PROP_BORDER: CB_STYLE_PROP_BORDER_SPECS;
+    CB_STYLE_PROP_SHADOW: CB_STYLE_PROP_SHADOW_SPECS;
+    CB_STYLE_PROP_OPACITY: CB_STYLE_PROP_TEXT_OPACITY_SPECS;
+    CB_STYLE_PROP_BGCOLOR: CB_STYLE_PROP_BGCOLOR_SPECS;
+    CB_STYLE_PROP_BGOVERLAY: CB_STYLE_PROP_BGOVERLAY_SPECS;
+    CB_STYLE_PROP_BGMEDIA: CB_STYLE_PROP_BGMEDIA_SPECS;
+    CB_LAYOUT_PROP_PADDING: CB_LAYOUT_PROP_PADDING_SPECS;
+    CB_LAYOUT_PROP_ARRANGE: CB_LAYOUT_PROP_ARRANGE_SPECS;
+    CB_CONTENT_PROP_VISIBILITY: CB_CONTENT_PROP_VISIBILITY_SPECS;
+    CB_EFFECT_PROP_ENTANIM: CB_EFFECT_PROP_ENTANIM_SPECS;
+};
 export type CB_VIDEOPLAYER_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
     CB_CONTENT_PROP_VISIBILITY: CB_CONTENT_PROP_VISIBILITY_SPECS;
     CB_CONTENT_PROP_VIDEO: CB_CONTENT_PROP_VIDEO;
@@ -144,6 +198,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/dist/src/sub/DynamicLayout/sections/FlexGridCustomSection.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { ISection } from '../types';
-import type { Layout } from 'publ-echo/dist/lib/GridLayoutEditor/types';
+import type { Layout } from 'publ-echo-test/dist/lib/GridLayoutEditor/types';
 export type LayoutsType = {
     sm: Layout;
     lg: Layout;

package/dist/src/sub/DynamicLayout/sections/FlexGridCustomSection.js

@@ -176,6 +176,7 @@ var FlexGridCustomSection = (0, react_1.forwardRef)(function CustomSection(props
             }
             return 16;
         }
+        // NOTE: Desktop
         if (responsiveFontMode) {
             return size.width * 0.0133;
         }

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateA/desktop/components/EmptyMembershipSheet.js

@@ -19,7 +19,7 @@ var Section_1 = require("../../../../../../../../DynamicLayout/components/Sectio
 var components_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/components");
 var constants_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/constants");
 function EmptyMembershipSheet() {
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateA/desktop/components/MembershipPlanSheet.js

@@ -29,7 +29,7 @@ var formatCurrency_1 = __importDefault(require("../../../../../../../../DynamicL
 var styled_components_1 = __importDefault(require("styled-components"));
 function MembershipPlanSheet(_a) {
     var connectedSubscriptionProducts = _a.connectedSubscriptionProducts, sectionStyles = _a.sectionStyles;
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var subscriptionProduct = connectedSubscriptionProducts.subscriptionProduct;
     var type = subscriptionProduct.type, alias = subscriptionProduct.alias, fee = subscriptionProduct.fee, isDeactivated = subscriptionProduct.isDeactivated;
     var itemToneType = sectionStyles.itemToneType, itemHighlightingColorInHex = sectionStyles.itemHighlightingColorInHex, programmedItemActionButtonTextType = sectionStyles.programmedItemActionButtonTextType;

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateA/desktop/components/UnavailableMembershipPlanSheet.js

@@ -19,7 +19,7 @@ var components_2 = require("../../../../../../../../DynamicLayout/sections/Membe
 var constants_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/constants");
 function UnavailableMembershipPlanSheet(_a) {
     var sectionStyles = _a.sectionStyles;
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var itemToneType = sectionStyles.itemToneType, programmedItemActionButtonTextType = sectionStyles.programmedItemActionButtonTextType;
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_g" }), (0, jsx_runtime_1.jsx)(panels_1.ContentSheet, __assign({ width: "100%", height: "auto", shapeType: "round", overrideCSS: {
                     display: 'flex',

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateA/mobile/components/EmptyMembershipSheet.js

@@ -19,7 +19,7 @@ var Section_1 = require("../../../../../../../../DynamicLayout/components/Sectio
 var components_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/components");
 var constants_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/constants");
 function MembershipSheet() {
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateB/desktop/components/EmptyMembershipSheet.js

@@ -19,7 +19,7 @@ var Section_1 = require("../../../../../../../../DynamicLayout/components/Sectio
 var components_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/components");
 var constants_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/constants");
 function EmptyMembershipSheet() {
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateB/desktop/components/MembershipPlanSheet.js

@@ -29,7 +29,7 @@ var formatCurrency_1 = __importDefault(require("../../../../../../../../DynamicL
 var styled_components_1 = __importDefault(require("styled-components"));
 function MembershipPlanSheet(_a) {
     var connectedSubscriptionProduct = _a.connectedSubscriptionProduct, sectionStyles = _a.sectionStyles;
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var subscriptionProduct = connectedSubscriptionProduct.subscriptionProduct;
     var type = subscriptionProduct.type, alias = subscriptionProduct.alias, fee = subscriptionProduct.fee, isDeactivated = subscriptionProduct.isDeactivated;
     var itemToneType = sectionStyles.itemToneType, itemHighlightingColorInHex = sectionStyles.itemHighlightingColorInHex, programmedItemActionButtonTextType = sectionStyles.programmedItemActionButtonTextType;

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateB/desktop/components/UnavailableMembershipPlanSheet.js

@@ -19,7 +19,7 @@ var components_2 = require("../../../../../../../../DynamicLayout/sections/Membe
 var constants_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/constants");
 function UnavailableMembershipPlanSheet(_a) {
     var sectionStyles = _a.sectionStyles;
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var itemToneType = sectionStyles.itemToneType, programmedItemActionButtonTextType = sectionStyles.programmedItemActionButtonTextType;
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_g" }), (0, jsx_runtime_1.jsx)(panels_1.ContentSheet, __assign({ width: "100%", height: "auto", shapeType: "round", overrideCSS: {
                     display: 'flex',

package/dist/src/sub/DynamicLayout/sections/MembershipSection/EditType/templates/TemplateB/mobile/components/EmptyMembershipSheet.js

@@ -19,7 +19,7 @@ var Section_1 = require("../../../../../../../../DynamicLayout/components/Sectio
 var components_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/components");
 var constants_1 = require("../../../../../../../../DynamicLayout/sections/MembershipSection/constants");
 function MembershipSheet() {
-    var t = (0, react_i18next_1.useTranslation)().t;
+    var t = (0, react_i18next_1.useTranslation)('translation').t;
     var section = (0, react_1.useContext)(Section_1.sectionContext);
     if (!section) {
         return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});