pds-dev-kit-web-test 2.5.261 → 2.5.263

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

@@ -6,6 +6,7 @@ type Props = {
     index: number;
     device: Device;
     rowHeight: number;
+    zIndex: number;
 };
-declare function FlexGridItem({ cb, index, device, rowHeight }: Props): JSX.Element;
+declare function FlexGridItem({ cb, index, device, rowHeight, zIndex }: Props): JSX.Element;
 export default FlexGridItem;

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

@@ -23,18 +23,21 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var ComponentBlockMatcher_1 = __importDefault(require("./components/ComponentBlock/ComponentBlockMatcher"));
 var gap = 10;
 function FlexGridItem(_a) {
-    var cb = _a.cb, index = _a.index, device = _a.device, rowHeight = _a.rowHeight;
+    var cb = _a.cb, index = _a.index, device = _a.device, rowHeight = _a.rowHeight, zIndex = _a.zIndex;
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     var defaultHeight = getMaxHeight(cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, device, rowHeight);
     var gridArea = getGridAreaFromCB(cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, device);
-    var zIndex = device === 'DESKTOP'
-        ? cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX
-        : cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE'];
+    // const zIndex =
+    //   device === 'DESKTOP'
+    //     ? cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX
+    //     : cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT[
+    //         'CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE'
+    //       ];
     return ((0, jsx_runtime_1.jsx)(GridItem, __assign({ style: {
             zIndex: zIndex,
             gridArea: gridArea
             // maxHeight: cb.componentBlockCode !== CB_ALL_CODES.CB_TEXT ? defaultHeight : undefined
-        } }, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { cbProps: cb, device: device, index: index }) })));
+        } }, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { rowHeight: rowHeight, cbProps: cb, device: device, index: index }) })));
 }
 var GridItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: auto;\n  word-break: break-word;\n"], ["\n  height: auto;\n  word-break: break-word;\n"])));
 function getMaxHeight(props, device, rowHeight) {

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

@@ -5,6 +5,7 @@ type Props = {
     cbProps: ComponentBlock;
     device: Device;
     index: number;
+    rowHeight: number;
 };
 export default function ComponentBlockMatcher({ cbProps, device, index }: Props): JSX.Element;
 export {};

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

@@ -19,6 +19,7 @@ require("react");
 var newUtils_1 = require("../../newUtils");
 var types_1 = require("../../types");
 var Button_1 = __importDefault(require("./componentBlocks/Button/Button"));
+var ContentsCarousel_1 = __importDefault(require("./componentBlocks/ContentsCarousel/ContentsCarousel"));
 var Divider_1 = __importDefault(require("./componentBlocks/Divider/Divider"));
 var Embed_1 = __importDefault(require("./componentBlocks/Embed/Embed"));
 var Image_1 = __importDefault(require("./componentBlocks/Image/Image"));
@@ -47,6 +48,10 @@ function ComponentBlockMatcher(_a) {
             return (0, jsx_runtime_1.jsx)(Youtube_1.Youtube, __assign({}, propsWithValue, { index: index }));
         case types_1.CB_ALL_CODES.CB_EMBED:
             return (0, jsx_runtime_1.jsx)(Embed_1.default, __assign({}, propsWithValue, { index: index }));
+        case types_1.CB_ALL_CODES.CB_CONTENTS_CAROUSEL: {
+            var compositions = cbProps.compositions;
+            return ((0, jsx_runtime_1.jsx)(ContentsCarousel_1.default, __assign({}, propsWithValue, { compositions: compositions, index: index })));
+        }
         default:
             return (0, jsx_runtime_1.jsx)("div", { children: "Error: not supported CB" });
     }

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

@@ -40,18 +40,18 @@ var S_HiddenCover_1 = require("../components/S_HiddenCover");
 var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
 function Button(props) {
     var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
-    var index = props.index, CB_STYLE_PROP_BTNCOLOR = props.CB_STYLE_PROP_BTNCOLOR, _b = props.CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CLINK_SPEC_SRC = _b.CB_CONTENT_PROP_CLINK_SPEC_SRC, CB_CONTENT_PROP_CLINK_SPEC_TYPE = _b.CB_CONTENT_PROP_CLINK_SPEC_TYPE, CB_CONTENT_PROP_CLINK_SPEC_NEWTAB = _b.CB_CONTENT_PROP_CLINK_SPEC_NEWTAB, CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC = _b.CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
+    var index = props.index, CB_STYLE_PROP_COLOR = props.CB_STYLE_PROP_COLOR, _b = props.CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CLINK_SPEC_SRC = _b.CB_CONTENT_PROP_CLINK_SPEC_SRC, CB_CONTENT_PROP_CLINK_SPEC_TYPE = _b.CB_CONTENT_PROP_CLINK_SPEC_TYPE, CB_CONTENT_PROP_CLINK_SPEC_NEWTAB = _b.CB_CONTENT_PROP_CLINK_SPEC_NEWTAB, CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC = _b.CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
     var _c = (0, useCLINK_1.default)({
         src: CB_CONTENT_PROP_CLINK_SPEC_SRC,
         type: CB_CONTENT_PROP_CLINK_SPEC_TYPE,
         openNewTab: CB_CONTENT_PROP_CLINK_SPEC_NEWTAB,
         internalSrc: String(CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC)
     }), onClickCLINK = _c.onClickCLINK, CLINKCursor = _c.CLINKCursor;
-    var _d = getBTNStyles(props.CB_STYLE_PROP_BTNTEXT, device), btnTextStyle = _d.style, btnTextHoverStyle = _d.hoverStyle;
-    var _e = getBTNColorStyles(CB_STYLE_PROP_BTNCOLOR, device), btnColorStyle = _e.style, btnColorHoverStyle = _e.hoverStyle;
+    var _d = getBTNStyles(props.CB_STYLE_PROP_TEXT, device), btnTextStyle = _d.style, btnTextHoverStyle = _d.hoverStyle;
+    var _e = getBTNColorStyles(CB_STYLE_PROP_COLOR, device), btnColorStyle = _e.style, btnColorHoverStyle = _e.hoverStyle;
     var _f = (0, util_1.parseProperties)(props, device), propsStyle = _f.style, propsHoverStyle = _f.hoverStyle, _g = _f.layout, paddingLeft = _g.paddingLeft, paddingRight = _g.paddingRight, paddingTop = _g.paddingTop, paddingBottom = _g.paddingBottom, layoutStyle = __rest(_g, ["paddingLeft", "paddingRight", "paddingTop", "paddingBottom"]), effect = _f.effect;
     var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
-    var googleFonts = (0, useGoogleFonts_1.getGoogleFontsFromBtnCB)(props.CB_STYLE_PROP_BTNTEXT, device === 'MOBILE');
+    var googleFonts = (0, useGoogleFonts_1.getGoogleFontsFromTextSpecCode)(props.CB_STYLE_PROP_TEXT, device === 'MOBILE');
     (0, useGoogleFonts_1.useGoogleFonts)({ fonts: googleFonts });
     if (mode === 'EDIT') {
         propsStyle.visibility = 'visible';
@@ -72,32 +72,34 @@ function Button(props) {
                     paddingRight: paddingRight,
                     paddingBottom: paddingBottom,
                     paddingTop: paddingTop
-                } }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, btnTextStyle), propsStyle), layoutStyle), effectCssProperties), btnColorStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign(__assign({}, btnTextHoverStyle), propsHoverStyle), btnColorHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
+                } }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ onMouseLeave: function (e) {
+                        e.currentTarget.classList.remove('hovered');
+                    }, className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, btnTextStyle), propsStyle), layoutStyle), effectCssProperties), btnColorStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign(__assign({}, btnTextHoverStyle), propsHoverStyle), btnColorHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
 }
 function getBTNStyles(props, device) {
     var availableSpecCodes = [
-        'CB_STYLE_PROP_BTNTEXT_SPEC_TYPEFACE',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_WEIGHT',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_SIZE',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_LINEHEIGHT',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_LETTERSPACING',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_COLOR',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_HORIZONTAL',
-        'CB_STYLE_PROP_BTNTEXT_SPEC_VERTICAL'
+        'CB_STYLE_PROP_TEXT_SPEC_TYPEFACE',
+        'CB_STYLE_PROP_TEXT_SPEC_WEIGHT',
+        'CB_STYLE_PROP_TEXT_SPEC_SIZE',
+        'CB_STYLE_PROP_TEXT_SPEC_LINEHEIGHT',
+        'CB_STYLE_PROP_TEXT_SPEC_LETTERSPACING',
+        'CB_STYLE_PROP_TEXT_SPEC_COLOR',
+        'CB_STYLE_PROP_TEXT_SPEC_HORIZONTAL',
+        'CB_STYLE_PROP_TEXT_SPEC_VERTICAL'
     ];
-    return (0, newUtils_1.parseStyleTextToCSSProp)({ availableSpecCodes: availableSpecCodes, props: props, device: device, propKey: 'BTNTEXT' });
+    return (0, newUtils_1.parseStyleTextToCSSProp)({ availableSpecCodes: availableSpecCodes, props: props, device: device, propKey: 'TEXT' });
 }
 function getBTNColorStyles(props, device) {
     var availableSpecCodes = [
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_ANGLE',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_COLOR',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_ENDCOLOR',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_ENDLOC',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_GRADIENT',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_STARTCOLOR',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_STARTLOC',
-        'CB_STYLE_PROP_BTNCOLOR_SPEC_TYPE'
+        'CB_STYLE_PROP_COLOR_SPEC_ANGLE',
+        'CB_STYLE_PROP_COLOR_SPEC_COLOR',
+        'CB_STYLE_PROP_COLOR_SPEC_ENDCOLOR',
+        'CB_STYLE_PROP_COLOR_SPEC_ENDLOC',
+        'CB_STYLE_PROP_COLOR_SPEC_GRADIENT',
+        'CB_STYLE_PROP_COLOR_SPEC_STARTCOLOR',
+        'CB_STYLE_PROP_COLOR_SPEC_STARTLOC',
+        'CB_STYLE_PROP_COLOR_SPEC_TYPE'
     ];
-    return (0, colorUtil_1.parseStyleColorToCSSProp)({ availableSpecCodes: availableSpecCodes, props: props, propKey: 'BTNCOLOR', device: device });
+    return (0, colorUtil_1.parseStyleColorToCSSProp)({ availableSpecCodes: availableSpecCodes, props: props, propKey: 'COLOR', device: device });
 }
 exports.default = Button;

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { CB_CONTENTS_CAROUSEL } from '../../../../../../../DynamicLayout/sections/CustomSection/types';
+import type { CB_BTN_PROPERTIES_TYPE, IndexForIntersection } from '../../../../../../../DynamicLayout/sections/CustomSection/util/types';
+type Props = CB_BTN_PROPERTIES_TYPE & IndexForIntersection & {
+    compositions: CB_CONTENTS_CAROUSEL['compositions'];
+};
+declare function ContentsCarousel(props: Props): JSX.Element;
+export default ContentsCarousel;

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

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var CompositionRenderer_1 = __importDefault(require("../../../../../../../DynamicLayout/CompositionRenderer/CompositionRenderer"));
+function ContentsCarousel(props) {
+    var compositions = props.compositions;
+    return (0, jsx_runtime_1.jsx)(CompositionRenderer_1.default, { compositions: compositions });
+}
+exports.default = ContentsCarousel;

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

@@ -39,7 +39,7 @@ function Text(props) {
     var _d = getTextStyles(props.CB_STYLE_PROP_TEXT, device), textStyle = _d.style, textHoverStyle = _d.hoverStyle;
     var _e = (0, util_1.parseProperties)(props, device), propsStyle = _e.style, propsHoverStyle = _e.hoverStyle, layoutStyle = _e.layout, effect = _e.effect;
     var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
-    var googleFonts = (0, getGoogleFonts_1.getGoogleFontsFromTextCB)(props.CB_STYLE_PROP_TEXT, device === 'MOBILE');
+    var googleFonts = (0, getGoogleFonts_1.getGoogleFontsFromTextSpecCode)(props.CB_STYLE_PROP_TEXT, device === 'MOBILE');
     (0, useGoogleFonts_1.default)({ fonts: googleFonts });
     if (mode === 'EDIT') {
         propsStyle.visibility = 'visible';
@@ -55,11 +55,25 @@ function Text(props) {
         : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
     var hasEffect = !isNoneEffectType;
     var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
+    var textValue = function () {
+        if (device === 'MOBILE') {
+            var value = props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXTMOBILEALTERNATIVE;
+            if (value === null || value === undefined) {
+                return props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT;
+            }
+            return value;
+        }
+        return props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT;
+    };
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ style: {
                     height: '100%',
                     display: 'flex',
                     alignItems: textStyle.alignItems
-                }, ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor, height: 'fit-content', minWidth: "calc(2ch + ".concat(layoutStyle.paddingLeft, " + ").concat(layoutStyle.paddingRight, ")") }), textStyle), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
+                }, ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ onMouseEnter: function (e) {
+                        e.currentTarget.classList.add('hovered');
+                    }, onMouseLeave: function (e) {
+                        e.currentTarget.classList.remove('hovered');
+                    }, className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor, height: 'fit-content', minWidth: "calc(2ch + ".concat(layoutStyle.paddingLeft, " + ").concat(layoutStyle.paddingRight, ")") }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: textValue() })) }))] }));
 }
 function getTextStyles(props, device) {
     var availableSpecCodes = [

package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/components/S_Backdrop.d.ts

@@ -0,0 +1 @@
+export declare const S_Backdrop: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

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

@@ -0,0 +1,13 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.S_Backdrop = void 0;
+var styled_components_1 = __importDefault(require("styled-components"));
+exports.S_Backdrop = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  /* background: #bababaa3; */\n  background-color: red;\n  height: 100vh;\n  pointer-events: none;\n  position: absolute;\n  width: 100vw;\n  z-index: 100002;\n"], ["\n  /* background: #bababaa3; */\n  background-color: red;\n  height: 100vh;\n  pointer-events: none;\n  position: absolute;\n  width: 100vw;\n  z-index: 100002;\n"])));
+var templateObject_1;

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

@@ -40,7 +40,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.S_CB_Box = void 0;
 var styled_components_1 = __importStar(require("styled-components"));
-exports.S_CB_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:hover {\n    ", ";\n  }\n"], ["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:hover {\n    ", ";\n  }\n"])), function (_a) {
+exports.S_CB_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:hover,\n  &.hovered {\n    ", ";\n  }\n"], ["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:hover,\n  &.hovered {\n    ", ";\n  }\n"])), function (_a) {
     var normalStyle = _a.normalStyle;
     return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), __assign(__assign({}, normalStyle), { boxShadow: '' }));
 }, function (_a) {

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

@@ -44,7 +44,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.S_CB_BoxWithShadow = void 0;
 var isNullOrUndefined_1 = __importDefault(require("../../../../../../../DynamicLayout/sections/CustomSection/util/isNullOrUndefined"));
 var styled_components_1 = __importStar(require("styled-components"));
-exports.S_CB_BoxWithShadow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:before {\n    border-bottom-left-radius: ", "px;\n    border-bottom-right-radius: ", "px;\n    border-top-left-radius: ", "px;\n    border-top-right-radius: ", "px;\n    box-shadow: ", ";\n    content: '';\n    height: 100%;\n    left: 0;\n    opacity: ", ";\n    pointer-events: none;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:hover {\n    ", ";\n\n    &:before {\n      border-bottom-left-radius: ", "px;\n      border-bottom-right-radius: ", "px;\n      border-top-left-radius: ", "px;\n      border-top-right-radius: ", "px;\n      box-shadow: ", ";\n      content: '';\n      height: 100%;\n      left: 0;\n      opacity: ", ";\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      width: 100%;\n    }\n  }\n"], ["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:before {\n    border-bottom-left-radius: ", "px;\n    border-bottom-right-radius: ", "px;\n    border-top-left-radius: ", "px;\n    border-top-right-radius: ", "px;\n    box-shadow: ", ";\n    content: '';\n    height: 100%;\n    left: 0;\n    opacity: ", ";\n    pointer-events: none;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:hover {\n    ", ";\n\n    &:before {\n      border-bottom-left-radius: ", "px;\n      border-bottom-right-radius: ", "px;\n      border-top-left-radius: ", "px;\n      border-top-right-radius: ", "px;\n      box-shadow: ", ";\n      content: '';\n      height: 100%;\n      left: 0;\n      opacity: ", ";\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      width: 100%;\n    }\n  }\n"])), function (_a) {
+exports.S_CB_BoxWithShadow = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:before {\n    border-bottom-left-radius: ", "px;\n    border-bottom-right-radius: ", "px;\n    border-top-left-radius: ", "px;\n    border-top-right-radius: ", "px;\n    box-shadow: ", ";\n    content: '';\n    height: 100%;\n    left: 0;\n    opacity: ", ";\n    pointer-events: none;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:hover,\n  &.hovered {\n    ", ";\n\n    &:before {\n      border-bottom-left-radius: ", "px;\n      border-bottom-right-radius: ", "px;\n      border-top-left-radius: ", "px;\n      border-top-right-radius: ", "px;\n      box-shadow: ", ";\n      content: '';\n      height: 100%;\n      left: 0;\n      opacity: ", ";\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      width: 100%;\n    }\n  }\n"], ["\n  /*\n     Introduced in IE 10.\n     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/\n   */\n\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:before {\n    border-bottom-left-radius: ", "px;\n    border-bottom-right-radius: ", "px;\n    border-top-left-radius: ", "px;\n    border-top-right-radius: ", "px;\n    box-shadow: ", ";\n    content: '';\n    height: 100%;\n    left: 0;\n    opacity: ", ";\n    pointer-events: none;\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:hover,\n  &.hovered {\n    ", ";\n\n    &:before {\n      border-bottom-left-radius: ", "px;\n      border-bottom-right-radius: ", "px;\n      border-top-left-radius: ", "px;\n      border-top-right-radius: ", "px;\n      box-shadow: ", ";\n      content: '';\n      height: 100%;\n      left: 0;\n      opacity: ", ";\n      pointer-events: none;\n      position: absolute;\n      top: 0;\n      width: 100%;\n    }\n  }\n"])), function (_a) {
     var normalStyle = _a.normalStyle;
     return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), __assign(__assign({}, normalStyle), { boxShadow: '' }));
 }, function (_a) {

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

@@ -1,11 +1,12 @@
 /// <reference types="react" />
-import type { STRING_PLAIN } from '../../../util/types';
+import type { ENUM_STRING, NUMBER_INTEGER, STRING_8DIGIT_HEX, STRING_PLAIN } from '../../../util/types';
 export type StylesProps = {
     normalStyle: React.CSSProperties;
     hoverStyle: React.CSSProperties;
 };
 export type CB_CONTENT_PROP_TEXT = {
     CB_CONTENT_PROP_TEXT_SPEC_TEXT: STRING_PLAIN;
+    CB_CONTENT_PROP_TEXT_SPEC_TEXTMOBILEALTERNATIVE: STRING_PLAIN;
 };
 export type CB_CONTENT_PROP_CLINK = {
     CB_CONTENT_PROP_CLINK_SPEC_TYPE: 'INTERNAL' | 'EXTERNAL' | 'DISABLED';
@@ -22,3 +23,80 @@ export type CB_CONTENT_PROP_TWITTER = {
 export type CB_CONTENT_PROP_CODEBLOCK = {
     CB_CONTENT_PROP_CODEBLOCK_SPEC_CODE: STRING_PLAIN;
 };
+export type CBTextPropsKeys = keyof CB_STYLE_PROP_TEXT_SPECS;
+export type CB_STYLE_PROP_TEXT_SPECS_BASE = {
+    CB_STYLE_PROP_TEXT_SPEC_TYPEFACE: ENUM_STRING;
+    CB_STYLE_PROP_TEXT_SPEC_WEIGHT: NUMBER_INTEGER;
+    CB_STYLE_PROP_TEXT_SPEC_SIZE: NUMBER_INTEGER;
+    CB_STYLE_PROP_TEXT_SPEC_LINEHEIGHT: NUMBER_INTEGER;
+    CB_STYLE_PROP_TEXT_SPEC_LETTERSPACING: NUMBER_INTEGER;
+    CB_STYLE_PROP_TEXT_SPEC_COLOR: STRING_8DIGIT_HEX;
+    CB_STYLE_PROP_TEXT_SPEC_HORIZONTAL: ENUM_STRING;
+    CB_STYLE_PROP_TEXT_SPEC_VERTICAL: ENUM_STRING;
+};
+export type CB_STYLE_PROP_TEXT_SPECS = CB_STYLE_PROP_TEXT_SPECS_BASE & {
+    'CB_STYLE_PROP_TEXT_SPEC_TYPEFACE:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_TYPEFACE:MOBILE': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_TYPEFACE:MOBILE:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_WEIGHT:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_WEIGHT:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_WEIGHT:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_SIZE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_SIZE:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_SIZE:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_LINEHEIGHT:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_LINEHEIGHT:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_LINEHEIGHT:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_LETTERSPACING:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_LETTERSPACING:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_LETTERSPACING:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_COLOR:HOVER': STRING_8DIGIT_HEX | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_COLOR:MOBILE': STRING_8DIGIT_HEX | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_COLOR:MOBILE:HOVER': STRING_8DIGIT_HEX | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_HORIZONTAL:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_HORIZONTAL:MOBILE': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_HORIZONTAL:MOBILE:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_VERTICAL:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_VERTICAL:MOBILE': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_TEXT_SPEC_VERTICAL:MOBILE:HOVER': ENUM_STRING | null | undefined;
+};
+export type CBColorPropsKeys = keyof CB_STYLE_PROP_COLOR_SPECS;
+export type CBColorValueSetType = Partial<Record<keyof CB_STYLE_PROP_COLOR_SPECS, CB_STYLE_PROP_COLOR_ENUM_GRADIENT | NUMBER_INTEGER | ENUM_STRING | undefined>>;
+export type CB_STYLE_PROP_COLOR_ENUM_GRADIENT = 'LINEAR' | 'RADIAL';
+export type CB_STYLE_PROP_COLOR_ENUM_TYPE = 'NONE' | 'SOLID' | 'GRADIENT';
+export type CB_STYLE_PROP_COLOR_SPECS_BASE = {
+    CB_STYLE_PROP_COLOR_SPEC_ANGLE: NUMBER_INTEGER;
+    CB_STYLE_PROP_COLOR_SPEC_COLOR: ENUM_STRING;
+    CB_STYLE_PROP_COLOR_SPEC_ENDCOLOR: ENUM_STRING;
+    CB_STYLE_PROP_COLOR_SPEC_ENDLOC: NUMBER_INTEGER;
+    CB_STYLE_PROP_COLOR_SPEC_GRADIENT: CB_STYLE_PROP_COLOR_ENUM_GRADIENT;
+    CB_STYLE_PROP_COLOR_SPEC_STARTCOLOR: ENUM_STRING;
+    CB_STYLE_PROP_COLOR_SPEC_STARTLOC: NUMBER_INTEGER;
+    CB_STYLE_PROP_COLOR_SPEC_TYPE: CB_STYLE_PROP_COLOR_ENUM_TYPE;
+};
+export type CB_STYLE_PROP_COLOR_SPECS = CB_STYLE_PROP_COLOR_SPECS_BASE & {
+    'CB_STYLE_PROP_COLOR_SPEC_ANGLE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ANGLE:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ANGLE:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_COLOR:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_COLOR:MOBILE': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_COLOR:MOBILE:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ENDCOLOR:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ENDCOLOR:MOBILE': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ENDCOLOR:MOBILE:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ENDLOC:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ENDLOC:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_ENDLOC:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_GRADIENT:HOVER': CB_STYLE_PROP_COLOR_ENUM_GRADIENT | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_GRADIENT:MOBILE': CB_STYLE_PROP_COLOR_ENUM_GRADIENT | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_GRADIENT:MOBILE:HOVER': CB_STYLE_PROP_COLOR_ENUM_GRADIENT | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_STARTCOLOR:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_STARTCOLOR:MOBILE': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_STARTCOLOR:MOBILE:HOVER': ENUM_STRING | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_STARTLOC:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_STARTLOC:MOBILE': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_STARTLOC:MOBILE:HOVER': NUMBER_INTEGER | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_TYPE:HOVER': CB_STYLE_PROP_COLOR_ENUM_TYPE | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_TYPE:MOBILE': CB_STYLE_PROP_COLOR_ENUM_TYPE | null | undefined;
+    'CB_STYLE_PROP_COLOR_SPEC_TYPE:MOBILE:HOVER': CB_STYLE_PROP_COLOR_ENUM_TYPE | null | undefined;
+};

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useGoogleFonts/getGoogleFonts.d.ts

@@ -1,4 +1,2 @@
-import type { CB_BTNTEXT_STYLE_PROPS } from '../../components/ComponentBlock/componentBlocks/Button/btnTypes';
-import type { CB_STYLE_PROP_TEXT_SPECS } from '../../components/ComponentBlock/componentBlocks/Text/types';
-export declare function getGoogleFontsFromTextCB(props: CB_STYLE_PROP_TEXT_SPECS, isMobile: boolean): string[];
-export declare function getGoogleFontsFromBtnCB(props: CB_BTNTEXT_STYLE_PROPS, isMobile: boolean): string[];
+import type { CB_STYLE_PROP_TEXT_SPECS } from '../../components/ComponentBlock/componentBlocks/types';
+export declare function getGoogleFontsFromTextSpecCode(props: CB_STYLE_PROP_TEXT_SPECS, isMobile: boolean): string[];

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useGoogleFonts/getGoogleFonts.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getGoogleFontsFromBtnCB = exports.getGoogleFontsFromTextCB = void 0;
-function getGoogleFontsFromTextCB(props, isMobile) {
+exports.getGoogleFontsFromTextSpecCode = void 0;
+function getGoogleFontsFromTextSpecCode(props, isMobile) {
     var typeface = props.CB_STYLE_PROP_TEXT_SPEC_TYPEFACE;
     var typefaceHover = props['CB_STYLE_PROP_TEXT_SPEC_TYPEFACE:HOVER'];
     var typefaceMobile = props['CB_STYLE_PROP_TEXT_SPEC_TYPEFACE:MOBILE'];
@@ -11,15 +11,4 @@ function getGoogleFontsFromTextCB(props, isMobile) {
     }
     return [typeface, typefaceHover].filter(function (each) { return each && each.startsWith('GOOGLE:'); });
 }
-exports.getGoogleFontsFromTextCB = getGoogleFontsFromTextCB;
-function getGoogleFontsFromBtnCB(props, isMobile) {
-    var typeface = props.CB_STYLE_PROP_BTNTEXT_SPEC_TYPEFACE;
-    var typefaceHover = props['CB_STYLE_PROP_BTNTEXT_SPEC_TYPEFACE:HOVER'];
-    var typefaceMobile = props['CB_STYLE_PROP_BTNTEXT_SPEC_TYPEFACE:MOBILE'];
-    var typefaceMobileHover = props['CB_STYLE_PROP_BTNTEXT_SPEC_TYPEFACE:MOBILE:HOVER'];
-    if (isMobile) {
-        return [typefaceMobile, typefaceMobileHover].filter(function (each) { return each && each.startsWith('GOOGLE:'); });
-    }
-    return [typeface, typefaceHover].filter(function (each) { return each && each.startsWith('GOOGLE:'); });
-}
-exports.getGoogleFontsFromBtnCB = getGoogleFontsFromBtnCB;
+exports.getGoogleFontsFromTextSpecCode = getGoogleFontsFromTextSpecCode;

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useGoogleFonts/index.d.ts

@@ -1,2 +1,2 @@
-export { getGoogleFontsFromBtnCB, getGoogleFontsFromTextCB } from './getGoogleFonts';
+export { getGoogleFontsFromTextSpecCode } from './getGoogleFonts';
 export { default as useGoogleFonts } from './useGoogleFonts';

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useGoogleFonts/index.js

@@ -3,9 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useGoogleFonts = exports.getGoogleFontsFromTextCB = exports.getGoogleFontsFromBtnCB = void 0;
+exports.useGoogleFonts = exports.getGoogleFontsFromTextSpecCode = void 0;
 var getGoogleFonts_1 = require("./getGoogleFonts");
-Object.defineProperty(exports, "getGoogleFontsFromBtnCB", { enumerable: true, get: function () { return getGoogleFonts_1.getGoogleFontsFromBtnCB; } });
-Object.defineProperty(exports, "getGoogleFontsFromTextCB", { enumerable: true, get: function () { return getGoogleFonts_1.getGoogleFontsFromTextCB; } });
+Object.defineProperty(exports, "getGoogleFontsFromTextSpecCode", { enumerable: true, get: function () { return getGoogleFonts_1.getGoogleFontsFromTextSpecCode; } });
 var useGoogleFonts_1 = require("./useGoogleFonts");
 Object.defineProperty(exports, "useGoogleFonts", { enumerable: true, get: function () { return __importDefault(useGoogleFonts_1).default; } });

package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/clsx.d.ts

@@ -0,0 +1,7 @@
+type ClassValue = string | number | boolean | null | undefined | ClassDictionary | ClassArray;
+type ClassDictionary = {
+    [key: string]: boolean | undefined | null;
+};
+type ClassArray = ClassValue[];
+export declare const clsx: (...args: ClassValue[]) => string;
+export {};

package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/clsx.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.clsx = void 0;
+var clsx = function () {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+    }
+    return args
+        .flatMap(function (arg) {
+        if (!arg)
+            return [];
+        if (typeof arg === 'string' || typeof arg === 'number')
+            return [arg];
+        if (Array.isArray(arg))
+            return exports.clsx.apply(void 0, arg);
+        if (typeof arg === 'object') {
+            return (Object.entries(arg)
+                // eslint-disable-next-line @typescript-eslint/no-unused-vars
+                .filter(function (_a) {
+                var _ = _a[0], value = _a[1];
+                return Boolean(value);
+            })
+                .map(function (_a) {
+                var key = _a[0];
+                return key;
+            }));
+        }
+        return [];
+    })
+        .join(' ');
+};
+exports.clsx = clsx;

package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/colorUtil.d.ts

@@ -1,15 +1,15 @@
-import type { BTNColorValueSetType } from '../components/ComponentBlock/componentBlocks/Button/btnTypes';
 import type { BGOverlayValueSetType } from '../components/ComponentBlock/componentBlocks/RichText/types';
+import type { CBColorValueSetType } from '../components/ComponentBlock/componentBlocks/types';
 import type { BGColorValueSetType } from '../components/ComponentBlock/componentBlocks/Youtube/types';
 import type { Device } from '../util/types';
 import type { CSSProperties } from 'react';
-type CBName = 'BTNCOLOR' | 'BGCOLOR' | 'BGOVERLAY';
+type CBName = 'COLOR' | 'BGCOLOR' | 'BGOVERLAY';
 type ExtractPropKey<T extends CBName> = Extract<T, CBName>;
-type ValueSetType = BTNColorValueSetType & BGColorValueSetType & BGOverlayValueSetType;
+type ValueSetType = CBColorValueSetType & BGColorValueSetType & BGOverlayValueSetType;
 export type ParseStyleColorProps<T> = {
     availableSpecCodes: Array<keyof T>;
     props: T;
-    propKey: ExtractPropKey<'BTNCOLOR'>;
+    propKey: ExtractPropKey<'COLOR'>;
     device: Device;
 } | {
     availableSpecCodes: Array<keyof T>;

package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/fontSizeAdjustment.d.ts

@@ -0,0 +1 @@
+export declare function getMobileFontSize(desktopSize: number): number;