pds-dev-kit-web-test 0.2.2 → 0.2.4

package/dist/src/sub/DynamicLayout/sections/CustomSection/util/layoutPropParsers/parseLayoutPropArrange.js

@@ -0,0 +1,80 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS = exports.CB_LAYOUT_PROP_ARRANGE_BASE_KEYS = void 0;
+var CB_LAYOUT_PROP_ARRANGE_BASE_KEYS;
+(function (CB_LAYOUT_PROP_ARRANGE_BASE_KEYS) {
+    CB_LAYOUT_PROP_ARRANGE_BASE_KEYS["CB_LAYOUT_PROP_ARRANGE_SPEC_VERTICAL"] = "CB_LAYOUT_PROP_ARRANGE_SPEC_VERTICAL";
+    CB_LAYOUT_PROP_ARRANGE_BASE_KEYS["CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL"] = "CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL";
+})(CB_LAYOUT_PROP_ARRANGE_BASE_KEYS = exports.CB_LAYOUT_PROP_ARRANGE_BASE_KEYS || (exports.CB_LAYOUT_PROP_ARRANGE_BASE_KEYS = {}));
+var CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS;
+(function (CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS) {
+    CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS["CB_LAYOUT_PROP_ARRANGE_SPEC_VERTICAL_MOBILE"] = "CB_LAYOUT_PROP_ARRANGE_SPEC_VERTICAL:MOBILE";
+    CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS["CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL_MOBILE"] = "CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE";
+})(CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS = exports.CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS || (exports.CB_LAYOUT_PROP_ARRANGE_EXTRA_KEYS = {}));
+function parseLayoutPropArrange(namedProps, device) {
+    var specs = namedProps.specs;
+    var AVAILABLE_SPECS = Object.values(CB_LAYOUT_PROP_ARRANGE_BASE_KEYS);
+    return AVAILABLE_SPECS.reduce(function (acc, cur) {
+        var _a;
+        var currentKey = device === 'DESKTOP' ? cur : cur + ":MOBILE";
+        var value = (_a = specs[currentKey]) !== null && _a !== void 0 ? _a : specs[cur];
+        var CSSProperties = getCssProperties(value);
+        return {
+            style: __assign(__assign({}, acc.style), CSSProperties)
+        };
+    }, {
+        style: {}
+    });
+}
+exports.default = parseLayoutPropArrange;
+function getCssProperties(value) {
+    switch (value) {
+        case 'TOP':
+            return {
+                display: 'flex',
+                flexDirection: 'column',
+                justifyContent: 'flex-start'
+            };
+        case 'MIDDLE':
+            return {
+                display: 'flex',
+                flexDirection: 'column',
+                justifyContent: 'center'
+            };
+        case 'BOTTOM':
+            return {
+                display: 'flex',
+                flexDirection: 'column',
+                justifyContent: 'flex-end'
+            };
+        case 'LEFT':
+            return {
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'flex-start'
+            };
+        case 'CENTER':
+            return {
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center'
+            };
+        case 'RIGHT':
+            return {
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'flex-end'
+            };
+    }
+}

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

@@ -0,0 +1,23 @@
+import type { Device, StyleType } from '../types';
+import type { CB_LAYOUT_PROP_KEYS } from './types';
+export declare type NAMED_CB_LAYOUT_PADDING_PROPS = {
+    name: CB_LAYOUT_PROP_KEYS.CB_LAYOUT_PROP_PADDING;
+    specs: CB_LAYOUT_PROP_PADDING_SPECS;
+};
+export default function parseLayoutPropPadding(namedProps: NAMED_CB_LAYOUT_PADDING_PROPS, device: Device): StyleType;
+declare type CB_LAYOUT_PROP_PADDING_SPEC_PADDING_OBJ = {
+    top: number;
+    left: number;
+    right: number;
+    bottom: number;
+};
+export declare type CB_STYLE_PROP_PADDING_BASE = {
+    CB_LAYOUT_PROP_PADDING_SPEC_PADDING: CB_LAYOUT_PROP_PADDING_SPEC_PADDING_OBJ;
+};
+export declare 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_FIX: boolean;
+    'CB_LAYOUT_PROP_PADDING_SPEC_FIX:MOBILE': boolean | undefined;
+};
+export {};

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

@@ -0,0 +1,32 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+function parseLayoutPropPadding(namedProps, device) {
+    var specs = namedProps.specs;
+    return AVAILABLE_SPECS.reduce(function (acc, cur) {
+        var _a;
+        var baseKey = device === 'DESKTOP' ? cur : cur + ":MOBILE";
+        var value = (_a = specs[baseKey]) !== null && _a !== void 0 ? _a : specs[cur];
+        var top = value.top, left = value.left, right = value.right, bottom = value.bottom;
+        return {
+            style: __assign(__assign({}, acc.style), { paddingTop: top + "px", paddingLeft: left + "px", paddingRight: right + "px", paddingBottom: bottom + "px" })
+        };
+    }, {
+        style: {}
+    });
+}
+exports.default = parseLayoutPropPadding;
+var AVAILABLE_SPECS = [
+    'CB_LAYOUT_PROP_PADDING_SPEC_PADDING'
+    // 'CB_LAYOUT_PROP_PADDING_SPEC_FIX'
+];

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

@@ -0,0 +1,7 @@
+import type { NAMED_CB_LAYOUT_ARRANGE_PROPS } from './parseLayoutPropArrange';
+import type { NAMED_CB_LAYOUT_PADDING_PROPS } from './parseLayoutPropPadding';
+export declare enum CB_LAYOUT_PROP_KEYS {
+    CB_LAYOUT_PROP_PADDING = "CB_LAYOUT_PROP_PADDING",
+    CB_LAYOUT_PROP_ARRANGE = "CB_LAYOUT_PROP_ARRANGE"
+}
+export declare type NamedLayoutPropType = NAMED_CB_LAYOUT_ARRANGE_PROPS | NAMED_CB_LAYOUT_PADDING_PROPS;

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

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CB_LAYOUT_PROP_KEYS = void 0;
+var CB_LAYOUT_PROP_KEYS;
+(function (CB_LAYOUT_PROP_KEYS) {
+    CB_LAYOUT_PROP_KEYS["CB_LAYOUT_PROP_PADDING"] = "CB_LAYOUT_PROP_PADDING";
+    CB_LAYOUT_PROP_KEYS["CB_LAYOUT_PROP_ARRANGE"] = "CB_LAYOUT_PROP_ARRANGE";
+})(CB_LAYOUT_PROP_KEYS = exports.CB_LAYOUT_PROP_KEYS || (exports.CB_LAYOUT_PROP_KEYS = {}));

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

@@ -0,0 +1,3 @@
+import type { Device, OverlayStyleAndOverlayHoverStyle, ParserResult } from './types';
+import type { ISectionJsonProperties } from '@sub/DynamicLayout/types';
+export default function parseJsonProperties(properties: ISectionJsonProperties, device: Device): ParserResult & Partial<OverlayStyleAndOverlayHoverStyle>;

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

@@ -0,0 +1,61 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var contentPropParsers_1 = require("./contentPropParsers");
+var types_1 = require("./contentPropParsers/types");
+var effectPropParsers_1 = require("./effectPropParsers");
+var types_2 = require("./effectPropParsers/types");
+var layoutPropParsers_1 = require("./layoutPropParsers");
+var types_3 = require("./layoutPropParsers/types");
+var stylePropParsers_1 = require("./stylePropParsers");
+var types_4 = require("./stylePropParsers/types");
+// export type specTypes = CB_LAYOUT_PROP_KEYS | CB_STYLE_PROP_KEYS;
+function parseJsonProperties(properties, device) {
+    return Object.entries(properties).reduce(function (acc, cur) {
+        var specKey = cur[0], specs = cur[1];
+        var normalizedProperty = {
+            name: specKey,
+            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, overlayStyle = _a.overlayStyle, overlayHoverStyle = _a.overlayHoverStyle;
+            // console.log(normalizedProperty.name, ' >>>', overlayStyle, overlayHoverStyle);
+            return __assign(__assign({}, acc), { style: __assign(__assign({}, acc.style), style), hoverStyle: __assign(__assign({}, acc.hoverStyle), hoverStyle), overlayStyle: __assign(__assign({}, acc.overlayStyle), overlayStyle), overlayHoverStyle: __assign(__assign({}, acc.overlayHoverStyle), overlayHoverStyle) });
+        }
+        if (normalizedProperty.name in types_3.CB_LAYOUT_PROP_KEYS) {
+            var style = (0, layoutPropParsers_1.parseLayoutProperties)(normalizedProperty, device).style;
+            // console.log(normalizedProperty.name, ' >>>', style);
+            return __assign(__assign({}, acc), { layout: __assign(__assign({}, acc.layout), style) });
+        }
+        if (normalizedProperty.name in types_1.CB_CONTENT_PROP_KEYS) {
+            var style = (0, contentPropParsers_1.parseContentProperties)(normalizedProperty, device).style;
+            // console.log(normalizedProperty.name, ' >>>', style);
+            return __assign(__assign({}, acc), { style: __assign(__assign({}, acc.style), style) });
+        }
+        if (normalizedProperty.name in types_2.CB_EFFECT_PROP_KEYS) {
+            var style = (0, effectPropParsers_1.parseEffectProperties)(normalizedProperty, device).style;
+            // console.log(normalizedProperty.name, ' >>>', style);
+            return __assign(__assign({}, acc), { effect: __assign(__assign({}, acc.effect), style) });
+        }
+        return acc;
+    }, {
+        style: {},
+        overlayStyle: {},
+        overlayHoverStyle: {},
+        hoverStyle: {},
+        layout: {},
+        effect: {},
+        content: {}
+    });
+}
+exports.default = parseJsonProperties;

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

@@ -0,0 +1,20 @@
+import type { ComponentBlock } from '../types';
+export declare function parsePlacement(components: ComponentBlock[]): {
+    sm: {
+        i: string;
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+        z: number;
+    }[];
+    lg: {
+        i: string;
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+        z: number;
+    }[];
+};
+export default parsePlacement;

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

@@ -0,0 +1,46 @@
+"use strict";
+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));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parsePlacement = void 0;
+function parsePlacement(components) {
+    return components.reduce(function (acc, cur) {
+        var id = cur.id, properties = cur.properties;
+        var _a = parsePropPlacement(properties.CB_PLACEMENT_PROP_PLACEMENT, id), mobileLayout = _a.mobileLayout, desktopLayout = _a.desktopLayout;
+        return {
+            sm: __spreadArray(__spreadArray([], acc.sm, true), [mobileLayout], false),
+            lg: __spreadArray(__spreadArray([], acc.lg, true), [desktopLayout], false)
+        };
+    }, { sm: [], lg: [] });
+}
+exports.parsePlacement = parsePlacement;
+function parsePropPlacement(props, id) {
+    var desktopLayout = {
+        i: id.toString(),
+        x: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX,
+        y: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY,
+        w: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS,
+        h: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS,
+        z: props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX
+    };
+    var mobileLayout = {
+        i: id.toString(),
+        x: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE'],
+        y: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS:MOBILE'],
+        w: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX:MOBILE'],
+        h: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY:MOBILE'],
+        z: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE']
+    };
+    return {
+        mobileLayout: mobileLayout,
+        desktopLayout: desktopLayout
+    };
+}
+exports.default = parsePlacement;

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

@@ -0,0 +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 } from './types';
+export declare 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, device: Device): ParserResult;

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

@@ -0,0 +1,54 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var contentPropParsers_1 = require("./contentPropParsers");
+var types_1 = require("./contentPropParsers/types");
+var effectPropParsers_1 = require("./effectPropParsers");
+var types_2 = require("./effectPropParsers/types");
+var layoutPropParsers_1 = require("./layoutPropParsers");
+var types_3 = require("./layoutPropParsers/types");
+var stylePropParsers_1 = require("./stylePropParsers");
+var types_4 = require("./stylePropParsers/types");
+function parseProperties(properties, device) {
+    return Object.entries(properties).reduce(function (acc, cur) {
+        var specKey = cur[0], specs = cur[1];
+        var normalizedProperty = {
+            name: specKey,
+            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) });
+        }
+        if (normalizedProperty.name in types_3.CB_LAYOUT_PROP_KEYS) {
+            var style = (0, layoutPropParsers_1.parseLayoutProperties)(normalizedProperty, device).style;
+            return __assign(__assign({}, acc), { layout: __assign(__assign({}, acc.layout), style) });
+        }
+        if (normalizedProperty.name in types_1.CB_CONTENT_PROP_KEYS) {
+            var style = (0, contentPropParsers_1.parseContentProperties)(normalizedProperty, device).style;
+            return __assign(__assign({}, acc), { style: __assign(__assign({}, acc.style), style) });
+        }
+        if (normalizedProperty.name in types_2.CB_EFFECT_PROP_KEYS) {
+            var style = (0, effectPropParsers_1.parseEffectProperties)(normalizedProperty, device).style;
+            return __assign(__assign({}, acc), { effect: __assign(__assign({}, acc.effect), style) });
+        }
+        return acc;
+    }, {
+        style: {},
+        hoverStyle: {},
+        layout: {},
+        effect: {},
+        content: {}
+    });
+}
+exports.default = parseProperties;

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

@@ -0,0 +1,3 @@
+import { NamedStylePropType } from './types';
+import type { Device, OverlayStyleAndOverlayHoverStyle, StyleAndHoverStyle } from '../types';
+export declare function parseStyleProperties(normalizedProperty: NamedStylePropType, device: Device): StyleAndHoverStyle & Partial<OverlayStyleAndOverlayHoverStyle>;

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

@@ -0,0 +1,41 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseStyleProperties = void 0;
+var parseStylePropBgColor_1 = __importDefault(require("./parseStylePropBgColor"));
+var parseStylePropBgImage_1 = __importDefault(require("./parseStylePropBgImage"));
+var parseStylePropBgOverlay_1 = __importDefault(require("./parseStylePropBgOverlay"));
+var parseStylePropBorder_1 = __importDefault(require("./parseStylePropBorder"));
+var parseStylePropDivider_1 = __importDefault(require("./parseStylePropDivider"));
+var parseStylePropImage_1 = __importDefault(require("./parseStylePropImage"));
+var parseStylePropOpacity_1 = __importDefault(require("./parseStylePropOpacity"));
+var parseStylePropShadow_1 = __importDefault(require("./parseStylePropShadow"));
+var types_1 = require("./types");
+function parseStyleProperties(normalizedProperty, device) {
+    var name = normalizedProperty.name;
+    switch (name) {
+        // case CB_STYLE_PROP_KEYS.CB_STYLE_PROP_TEXT:
+        //   return parseStylePropTextSpec(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_OPACITY:
+            return (0, parseStylePropOpacity_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_SHADOW:
+            return (0, parseStylePropShadow_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_BORDER:
+            return (0, parseStylePropBorder_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_IMAGE:
+            return (0, parseStylePropImage_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_DIVIDER:
+            return (0, parseStylePropDivider_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_BGCOLOR:
+            return (0, parseStylePropBgColor_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_BGMEDIA:
+            return (0, parseStylePropBgImage_1.default)(normalizedProperty, device);
+        case types_1.CB_STYLE_PROP_KEYS.CB_STYLE_PROP_BGOVERLAY:
+            return (0, parseStylePropBgOverlay_1.default)(normalizedProperty, device);
+        default:
+            return { style: {}, hoverStyle: {}, overlayStyle: {}, overlayHoverStyle: {} };
+    }
+}
+exports.parseStyleProperties = parseStyleProperties;

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

@@ -0,0 +1,43 @@
+import type { Device, ENUM_STRING, NUMBER_INTEGER, STRING_8DIGIT_HEX, StyleAndHoverStyle } from '../types';
+import type { CB_STYLE_PROP_KEYS } from './types';
+export declare type NAMED_CB_STYLE_BGCOLOR_PROPS = {
+    name: CB_STYLE_PROP_KEYS.CB_STYLE_PROP_BGCOLOR;
+    specs: CB_STYLE_PROP_BGCOLOR_SPECS;
+};
+export default function parseStylePropBgColor(namedProps: NAMED_CB_STYLE_BGCOLOR_PROPS, device: Device): StyleAndHoverStyle;
+export declare type CB_STYLE_PROP_BGCOLOR_SPECS_BASE = {
+    CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE: NUMBER_INTEGER;
+    CB_STYLE_PROP_BGCOLOR_SPEC_COLOR: STRING_8DIGIT_HEX;
+    CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR: STRING_8DIGIT_HEX;
+    CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC: NUMBER_INTEGER;
+    CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT: ENUM_STRING;
+    CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR: STRING_8DIGIT_HEX;
+    CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC: NUMBER_INTEGER;
+    CB_STYLE_PROP_BGCOLOR_SPEC_TYPE: ENUM_STRING;
+};
+export declare type CB_STYLE_PROP_BGCOLOR_SPECS = CB_STYLE_PROP_BGCOLOR_SPECS_BASE & {
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE:HOVER': NUMBER_INTEGER;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE:MOBILE': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE:MOBILE:HOVER': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_COLOR:HOVER': STRING_8DIGIT_HEX;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_COLOR:MOBILE': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_COLOR:MOBILE:HOVER': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR:HOVER': STRING_8DIGIT_HEX;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR:MOBILE': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR:MOBILE:HOVER': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC:HOVER': NUMBER_INTEGER;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC:MOBILE': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC:MOBILE:HOVER': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT:HOVER': ENUM_STRING;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT:MOBILE': ENUM_STRING | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT:MOBILE:HOVER': ENUM_STRING | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR:HOVER': STRING_8DIGIT_HEX;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR:MOBILE': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR:MOBILE:HOVER': STRING_8DIGIT_HEX | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC:HOVER': NUMBER_INTEGER;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC:MOBILE': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC:MOBILE:HOVER': NUMBER_INTEGER | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_TYPE:HOVER': ENUM_STRING;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_TYPE:MOBILE': ENUM_STRING | undefined;
+    'CB_STYLE_PROP_BGCOLOR_SPEC_TYPE:MOBILE:HOVER': ENUM_STRING | undefined;
+};

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

@@ -0,0 +1,58 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var AVAILABLE_SPECS = [
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_COLOR',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC',
+    'CB_STYLE_PROP_BGCOLOR_SPEC_TYPE'
+];
+function parseStylePropBgColor(namedProps, device) {
+    var specs = namedProps.specs;
+    var bgColorCssProperties = AVAILABLE_SPECS.reduce(function (acc, cur) {
+        var _a, _b;
+        var baseKey = device === 'DESKTOP' ? cur : cur + ":MOBILE";
+        var value = specs[baseKey];
+        var hoverValue = specs[baseKey + ":HOVER"];
+        return {
+            style: __assign(__assign({}, acc.style), (_a = {}, _a[baseKey] = value, _a)),
+            hoverStyle: __assign(__assign({}, acc.hoverStyle), (_b = {}, _b[baseKey] = hoverValue, _b))
+        };
+    }, {
+        style: {},
+        hoverStyle: {}
+    });
+    return {
+        style: { background: valueGenerator(bgColorCssProperties.style) },
+        hoverStyle: { background: valueGenerator(bgColorCssProperties.hoverStyle) }
+    };
+}
+exports.default = parseStylePropBgColor;
+function valueGenerator(valueSet) {
+    var CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE, CB_STYLE_PROP_BGCOLOR_SPEC_COLOR = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_COLOR, CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR, CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC, CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT, CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR, CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC, CB_STYLE_PROP_BGCOLOR_SPEC_TYPE = valueSet.CB_STYLE_PROP_BGCOLOR_SPEC_TYPE;
+    if (CB_STYLE_PROP_BGCOLOR_SPEC_TYPE === 'GRADIENT') {
+        var isLinear = CB_STYLE_PROP_BGCOLOR_SPEC_GRADIENT === 'LINEAR';
+        var gradientType = isLinear ? 'linear-gradient' : 'radial-gradient';
+        var gradientDegree = isLinear ? CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE + "deg," : '';
+        var gradientStartColor = CB_STYLE_PROP_BGCOLOR_SPEC_STARTCOLOR;
+        var gradientStartPosition = CB_STYLE_PROP_BGCOLOR_SPEC_STARTLOC;
+        var gradientEndColor = CB_STYLE_PROP_BGCOLOR_SPEC_ENDCOLOR;
+        var gradientEndPosition = CB_STYLE_PROP_BGCOLOR_SPEC_ENDLOC;
+        return gradientType + "(" + gradientDegree + " " + gradientStartColor + " " + gradientStartPosition + "%, " + gradientEndColor + " " + gradientEndPosition + "%)";
+    }
+    return "" + CB_STYLE_PROP_BGCOLOR_SPEC_COLOR;
+}

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

@@ -0,0 +1,19 @@
+import type { Device, ENUM_STRING, STRING_PLAIN, StyleAndHoverStyle } from '../types';
+import type { CB_STYLE_PROP_KEYS } from './types';
+export declare type NAMED_CB_STYLE_BGIMAGE_PROPS = {
+    name: CB_STYLE_PROP_KEYS.CB_STYLE_PROP_BGMEDIA;
+    specs: CB_STYLE_PROP_BGIMAGE_SPECS;
+};
+export default function parseStylePropBGImage(namedProps: NAMED_CB_STYLE_BGIMAGE_PROPS, device: Device): StyleAndHoverStyle;
+export declare type CB_STYLE_PROP_BGIMAGE_SPECS_BASE = {
+    CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT: STRING_PLAIN;
+    CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION: ENUM_STRING;
+};
+export declare type CB_STYLE_PROP_BGIMAGE_SPECS = CB_STYLE_PROP_BGIMAGE_SPECS_BASE & {
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:HOVER': STRING_PLAIN;
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:MOBILE': STRING_PLAIN | undefined;
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:MOBILE:HOVER': STRING_PLAIN | undefined;
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:HOVER': ENUM_STRING;
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE': ENUM_STRING | undefined;
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE:HOVER': ENUM_STRING | undefined;
+};

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

@@ -0,0 +1,118 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var AVAILABLE_SPECS = [
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT',
+    'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION'
+];
+function parseStylePropBGImage(namedProps, device) {
+    var specs = namedProps.specs;
+    return AVAILABLE_SPECS.reduce(function (acc, cur) {
+        var _a, _b;
+        var baseKey = device === 'DESKTOP' ? cur : cur + ":MOBILE";
+        var cssPropertyKey = getParsedKey(baseKey);
+        var value = specs[baseKey];
+        var hoverValue = specs[baseKey + ":HOVER"];
+        var isPosition = cssPropertyKey === 'position';
+        if (isPosition) {
+            var positionCss = getCssProperties(value);
+            var hoverPositionCss = getCssProperties(hoverValue);
+            return {
+                style: __assign(__assign({}, acc.style), positionCss),
+                hoverStyle: __assign(__assign({}, acc.hoverStyle), hoverPositionCss)
+            };
+        }
+        return {
+            style: __assign(__assign({}, acc.style), (_a = {}, _a[cssPropertyKey] = value === null || value === void 0 ? void 0 : value.toLowerCase(), _a)),
+            hoverStyle: __assign(__assign({}, acc.hoverStyle), (_b = {}, _b[cssPropertyKey] = hoverValue === null || hoverValue === void 0 ? void 0 : hoverValue.toLowerCase(), _b))
+        };
+    }, {
+        style: {},
+        hoverStyle: {}
+    });
+}
+exports.default = parseStylePropBGImage;
+function getParsedKey(key) {
+    switch (key) {
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT':
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:HOVER':
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:MOBILE':
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT:MOBILE:HOVER':
+            return 'objectFit';
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION':
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:HOVER':
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE':
+        case 'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION:MOBILE:HOVER':
+            return 'position';
+    }
+}
+function getCssProperties(value) {
+    switch (value) {
+        case 'LT':
+            return {
+                display: 'flex',
+                alignItems: 'flex-start',
+                justifyContent: 'flex-start'
+            };
+        case 'CT':
+            return {
+                display: 'flex',
+                alignItems: 'flex-start',
+                justifyContent: 'center'
+            };
+        case 'RT':
+            return {
+                display: 'flex',
+                alignItems: 'flex-start',
+                justifyContent: 'flex-end'
+            };
+        case 'LC':
+            return {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-start'
+            };
+        case 'CC':
+            return {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            };
+        case 'RC':
+            return {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-end'
+            };
+        case 'LB':
+            return {
+                display: 'flex',
+                alignItems: 'flex-end',
+                justifyContent: 'flex-start'
+            };
+        case 'CB':
+            return {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-end'
+            };
+        case 'RB':
+            return {
+                display: 'flex',
+                alignItems: 'flex-end',
+                justifyContent: 'flex-end'
+            };
+        default:
+            return {};
+    }
+}