pds-dev-kit-web-test 2.7.166 → 2.7.168

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

@@ -1,31 +1,22 @@
-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_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_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_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: {
@@ -43,6 +34,8 @@ 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;
@@ -129,53 +122,6 @@ 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' | 'FADEOUTANDIN' | '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;
@@ -198,7 +144,6 @@ 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-test/dist/lib/GridLayoutEditor/types';
+import type { Layout } from 'publ-echo/dist/lib/GridLayoutEditor/types';
 export type LayoutsType = {
     sm: Layout;
     lg: Layout;

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

@@ -37,15 +37,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -58,8 +49,7 @@ var dynamicLayoutContext_1 = require("../../DynamicLayout/dynamicLayoutContext")
 var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../components");
 var gleStyles_1 = require("../gleStyles");
-var groupUtils_1 = __importDefault(require("../utils/groupUtils"));
-require("./CustomSection/FlexGridItem");
+var FlexGridItem_1 = __importDefault(require("./CustomSection/FlexGridItem"));
 var useResizableObserver_1 = require("./CustomSection/hooks/useResizableObserver");
 var util_1 = require("./CustomSection/util");
 var parseSectionPadding_1 = __importDefault(require("./CustomSection/util/layoutPropParsers/parseSectionPadding"));
@@ -69,12 +59,13 @@ var MOBILE_GRID_COLS = 8;
 var GLE_MIN_WIDTH_DESKTOP_PX = "".concat(GRID_CELL_MIN * DESKTOP_GRID_COLS, "px");
 var GLE_MIN_WIDTH_MOBILE_PX = "".concat(GRID_CELL_MIN * MOBILE_GRID_COLS, "px");
 var FlexGridCustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
-    var _a = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _a.device, editingSectionId = _a.editingSectionId, mode = _a.mode, shortcutKeyMode = _a.shortcutKeyMode, sectionActionHandler = _a.sectionActionHandler;
+    var _a;
+    var _b = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _b.device, editingSectionId = _b.editingSectionId, mode = _b.mode, shortcutKeyMode = _b.shortcutKeyMode, sectionActionHandler = _b.sectionActionHandler;
     var componentBlocks = props.componentBlocks, jsonProperties = props.jsonProperties;
-    var _b = jsonProperties, _c = _b.data, CB_PLACEMENT_PROP_SECTION = _c.CB_PLACEMENT_PROP_SECTION, CB_LAYOUT_PROP_PADDING = _c.CB_LAYOUT_PROP_PADDING, zOrders = _b.zOrders;
+    var _c = jsonProperties, _d = _c.data, CB_PLACEMENT_PROP_SECTION = _d.CB_PLACEMENT_PROP_SECTION, CB_LAYOUT_PROP_PADDING = _d.CB_LAYOUT_PROP_PADDING, zOrders = _c.zOrders;
     var containerRef = (0, react_1.useRef)(null);
     var size = (0, useResizableObserver_1.useResizeObserver)({ ref: containerRef, box: 'border-box' });
-    var _d = (0, react_1.useState)(null), selectedCB = _d[0], setSelectedCB = _d[1];
+    var _e = (0, react_1.useState)(null), selectedCB = _e[0], setSelectedCB = _e[1];
     var gleRef = (0, react_1.useRef)(null);
     var isMobile = device === 'MOBILE';
     var isEditMode = mode === 'EDIT';
@@ -133,10 +124,10 @@ var FlexGridCustomSection = (0, react_1.forwardRef)(function CustomSection(props
             setSelectedCB('BULK');
         }
     }, [selectedCB, shortcutKeyMode, sectionActionHandler, setSelectedCB]);
-    var _e = (0, util_1.parseCustomSectionPlacement)({
+    var _f = (0, util_1.parseCustomSectionPlacement)({
         isMobile: isMobile,
         customSectionProps: CB_PLACEMENT_PROP_SECTION
-    }), width = _e.width, minHeight = _e.minHeight, isFullWidth = _e.isFullWidth;
+    }), width = _f.width, minHeight = _f.minHeight, isFullWidth = _f.isFullWidth;
     var customSectionStyles = {
         minHeight: "".concat(minHeight, "vh"),
         width: '100%',
@@ -185,7 +176,6 @@ var FlexGridCustomSection = (0, react_1.forwardRef)(function CustomSection(props
             }
             return 16;
         }
-        // NOTE: Desktop
         if (responsiveFontMode) {
             return size.width * 0.0133;
         }
@@ -194,18 +184,6 @@ var FlexGridCustomSection = (0, react_1.forwardRef)(function CustomSection(props
         }
         return 16;
     })();
-    var pedigree = jsonProperties === null || jsonProperties === void 0 ? void 0 : jsonProperties.pedigree;
-    var layouts = (0, util_1.parsePlacement)(componentBlocks !== null && componentBlocks !== void 0 ? componentBlocks : [], zOrders);
-    var _f = (0, react_1.useState)([]), selectedRows = _f[0], setSelectedRows = _f[1];
-    var _g = (0, react_1.useState)([]), pinnedGBs = _g[0], setPinnedGBs = _g[1];
-    var onToggleGBPinned = function (gbId) {
-        setPinnedGBs(function (prev) {
-            if (prev.includes(gbId)) {
-                return prev.filter(function (id) { return id !== gbId; });
-            }
-            return __spreadArray(__spreadArray([], prev, true), [gbId], false);
-        });
-    };
     return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(gleStyles_1.S_gleStyles, { children: (0, jsx_runtime_1.jsx)(S_SectionWrapper, __assign({ ref: gleRef, "x-dlayout-section-type": "NO_NAME", onClick: onClickSection }, { children: (0, jsx_runtime_1.jsx)(components_1.CustomSection, __assign({}, props, { isMobile: isMobile, overrideStyles: {
                         minHeight: customSectionStyles.minHeight,
                         paddingTop: padding.top,
@@ -217,7 +195,10 @@ var FlexGridCustomSection = (0, react_1.forwardRef)(function CustomSection(props
                             maxWidth: customSectionStyles.maxWidth,
                             minWidth: isMobile ? GLE_MIN_WIDTH_MOBILE_PX : GLE_MIN_WIDTH_DESKTOP_PX,
                             fontSize: "".concat(baseFontSize, "px")
-                        } }, { children: pedigree.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(groupUtils_1.default, { block: child, rowHeight: rowHeight, layoutItems: layouts[device === 'DESKTOP' ? 'lg' : 'sm'], cbs: props.componentBlocks, device: device, selectedRows: selectedRows, pinnedGBs: pinnedGBs, onToggleGBPinned: onToggleGBPinned, isEditMode: false }, child.blockId)); }) })) })) })) }) }));
+                        } }, { children: (_a = props.componentBlocks) === null || _a === void 0 ? void 0 : _a.map(function (cb, index) {
+                            var _a;
+                            return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(FlexGridItem_1.default, { cb: cb, index: index, device: device, rowHeight: rowHeight, zIndex: (_a = zOrders === null || zOrders === void 0 ? void 0 : zOrders[device === 'DESKTOP' ? 'desktop' : 'mobile'][cb.id]) !== null && _a !== void 0 ? _a : 0 }) }, cb.id));
+                        }) })) })) })) }) }));
 });
 var GridContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid; /* Space between grid items */\n  gap: 10px;\n  grid-auto-rows: minmax(", ", auto);\n  grid-template-columns: repeat(", ", 1fr);\n  grid-template-rows: repeat(\n    ", ",\n    minmax(", ", auto)\n  );\n  padding: 10px 10px;\n\n  * {\n    box-sizing: border-box;\n  }\n"], ["\n  display: grid; /* Space between grid items */\n  gap: 10px;\n  grid-auto-rows: minmax(", ", auto);\n  grid-template-columns: repeat(", ", 1fr);\n  grid-template-rows: repeat(\n    ", ",\n    minmax(", ", auto)\n  );\n  padding: 10px 10px;\n\n  * {\n    box-sizing: border-box;\n  }\n"])), function (props) { return "".concat(props.rowHeight, "px"); }, function (props) { return props.cols; }, function (props) { return props.sectionRow; }, function (props) { return "".concat(props.rowHeight, "px"); });
 var S_SectionWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));

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

@@ -1,14 +1,11 @@
 import type { TypeOfSectionAction } from './sectionActionTypes';
-import type { CB_ALL_CODES, ComponentBlock } from './sections/CustomSection/types';
+import type { ComponentBlock } from './sections/CustomSection/types';
 import type { CB_CONTENT_PROP_VISIBILITY_SPECS } from './sections/CustomSection/util/contentPropParsers/parseContentVisibility';
 import type { CB_EFFECT_PROP_ENTANIM_SPECS } from './sections/CustomSection/util/effectPropParsers/parseEffectPropEntAnim';
 import type { CB_LAYOUT_PROP_PADDING_SPECS } from './sections/CustomSection/util/layoutPropParsers/parseLayoutPropPadding';
 import type { CB_STYLE_PROP_BGCOLOR_SPECS } from './sections/CustomSection/util/stylePropParsers/parseStylePropBgColor';
 import type { CB_STYLE_PROP_BGOVERLAY_SPECS } from './sections/CustomSection/util/stylePropParsers/parseStylePropBgOverlay';
-import type { CB_STYLE_PROP_BORDER_SPECS } from './sections/CustomSection/util/stylePropParsers/parseStylePropBorder';
-import type { CB_STYLE_PROP_SHADOW_SPECS } from './sections/CustomSection/util/stylePropParsers/parseStylePropShadow';
-import type { CCB_VALUE_TYPE, COMPOSITION_VALUE_TYPE } from './sections/CustomSection/util/types';
-import type { Block, ZOrder } from 'publ-echo-test/dist/lib/GridLayoutEditor/group';
+import type { Block, ZOrder } from 'publ-echo/dist/lib/GridLayoutEditor/group';
 import type { Ref } from 'react';
 export { TypeOfSectionAction };
 export type TypeOfSectionManifestSchema = 'BASE_INTRO' | 'BASE_CONTENTS' | 'BASE_CONTENTS_CAROUSEL' | 'BASE_FOOTER' | 'BASE_INFO_BOX' | 'EXP_IFRAME' | 'PRG_MEMBERSHIP_DISPLAY' | 'CUSTOM';
@@ -238,20 +235,6 @@ export type DynamicLayoutProps = {
     shortcutKeyMode?: CustomSectionShortcutKeysType;
     dynamicLayoutRef?: Ref<CustomSectionImperativeHandleRef>;
     zoomScale?: number;
-    queryData?: QueryData;
-    placementRestriction?: PlaceRestrictionType;
-};
-export type PlaceRestrictionValue = {
-    columnWInit: number;
-    columnWMin: number;
-    mobileColumnWMax: number;
-    mobileColumnWMin: number;
-    rowHInit: number;
-    rowHMin: number;
-};
-export type PlaceRestrictionType = Record<CB_ALL_CODES, PlaceRestrictionValue>;
-export type QueryData = {
-    [key: string]: Array<Record<string, unknown>>;
 };
 export type NavHandlerAction = {
     openNewTab: boolean;
@@ -361,8 +344,6 @@ export type CB_STYLE_PROP_BGMEDIA_SPECS_BASE = {
     CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT: string;
     CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME: number;
     CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR: string;
-    CB_STYLE_PROP_BGMEDIA_SPEC_VALUETYPE: CCB_VALUE_TYPE | COMPOSITION_VALUE_TYPE;
-    CB_STYLE_PROP_BGMEDIA_SPEC_CONNECTDATA: string;
 };
 export type CB_STYLE_PROP_BGMEDIA_SPECS = CB_STYLE_PROP_BGMEDIA_SPECS_BASE & {
     'CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME:HOVER': number | null | undefined;
@@ -396,19 +377,25 @@ export type CB_STYLE_PROP_BGMEDIA_SPECS = CB_STYLE_PROP_BGMEDIA_SPECS_BASE & {
     'CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR:HOVER'?: string | null;
     'CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR:MOBILE'?: string | null;
     'CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR:MOBILE:HOVER'?: string | null;
-    'CB_STYLE_PROP_BGMEDIA_SPEC_VALUETYPE:HOVER'?: CCB_VALUE_TYPE | null;
-    'CB_STYLE_PROP_BGMEDIA_SPEC_VALUETYPE:MOBILE'?: CCB_VALUE_TYPE | null;
-    'CB_STYLE_PROP_BGMEDIA_SPEC_VALUETYPE:MOBILE:HOVER'?: CCB_VALUE_TYPE | null;
-    'CB_STYLE_PROP_BGMEDIA_SPEC_CONNECTDATA:HOVER'?: string | null;
-    'CB_STYLE_PROP_BGMEDIA_SPEC_CONNECTDATA:MOBILE'?: string | null;
-    'CB_STYLE_PROP_BGMEDIA_SPEC_CONNECTDATA:MOBILE:HOVER'?: string | null;
 };
 export interface IComposition {
     id: number;
     administrativeTitle?: string;
-    isDefault: boolean;
+    display: boolean;
+    order: number;
+    manifest: {
+        schema: TypeOfSectionManifestSchema;
+        availableProperties: Array<KeyOfSectionProperties>;
+        availableStyles: Array<KeyOfSectionStyles>;
+        availableTemplates: Array<TypeofSectionTemplate>;
+    } | Record<string, never>;
+    template: TypeofSectionTemplate;
+    properties: ISectionProperties;
+    styles: ISectionStyles;
+    dynamicLayoutSectionItems: Array<IItem> | null;
     insertedAt: string;
     updatedAt: string;
+    type: TypeOfSectionType;
     program?: 'MEMBERSHIP_DISPLAY';
     programData?: {
         mdid: string;
@@ -422,45 +409,6 @@ export interface IComposition {
             };
         };
     };
-    componentBlocks: ComponentBlock[];
-    jsonProperties: ICompositionJsonProperties;
-    compositionCode: string;
-    compositionTemplateCode: string;
-    dynamicLayoutComponentBlockId: number;
-    ccbManualItemUuid: string;
+    componentBlocks?: ComponentBlock[];
+    jsonProperties?: ISectionJsonProperties;
 }
-export type ICompositionJsonProperties = {
-    data: {
-        CB_CONTENT_PROP_COMPOSITIONSMARTARRANGE: {
-            CB_CONTENT_PROP_COMPOSITIONSMARTARRANGE_SPEC_MANUAL: null;
-        };
-        CB_CONTENT_PROP_HOVER: {
-            CB_CONTENT_PROP_HOVER_SPEC_MUSE: boolean;
-        };
-        CB_LAYOUT_PROP_PADDING: CB_LAYOUT_PROP_PADDING_SPECS;
-        CB_PLACEMENT_PROP_COMPOSITION: {
-            CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS: number;
-            'CB_PLACEMENT_PROP_COMPOSITION_SPEC_COLUMNS:MOBILE': number | null;
-            CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT: number | null;
-            'CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXHEIGHT:MOBILE': number | null;
-            CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH: number | null;
-            'CB_PLACEMENT_PROP_COMPOSITION_SPEC_MAXWIDTH:MOBILE': number | null;
-            CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT: number | null;
-            'CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINHEIGHT:MOBILE': number | null;
-            CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH: number | null;
-            'CB_PLACEMENT_PROP_COMPOSITION_SPEC_MINWIDTH:MOBILE': number | null;
-            CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS: number;
-            'CB_PLACEMENT_PROP_COMPOSITION_SPEC_ROWS:MOBILE': number | null;
-        };
-        CB_STYLE_PROP_BGCOLOR: CB_STYLE_PROP_BGCOLOR_SPECS;
-        CB_STYLE_PROP_BGMEDIA: CB_STYLE_PROP_BGMEDIA_SPECS;
-        CB_STYLE_PROP_BGOVERLAY: CB_STYLE_PROP_BGOVERLAY_SPECS;
-        CB_STYLE_PROP_BORDER: CB_STYLE_PROP_BORDER_SPECS;
-        CB_STYLE_PROP_SHADOW: CB_STYLE_PROP_SHADOW_SPECS;
-    };
-    zOrders: ZOrder;
-    pedigree: SectionPedigree;
-    currentVersion: string;
-    minVersion: string;
-    version: string;
-};