pds-dev-kit-web-test 2.2.70 → 2.2.72

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

@@ -1,3 +1,5 @@
 /// <reference types="react" />
 import type { DynamicLayoutProps } from './types';
-export declare const dynamicLayoutContext: import("react").Context<Omit<DynamicLayoutProps, "sections">>;
+type DL_CONTEXT_TYPE = Omit<DynamicLayoutProps, 'sections'>;
+export declare const dynamicLayoutContext: import("react").Context<DL_CONTEXT_TYPE>;
+export {};

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

@@ -76,6 +76,7 @@ var CustomSection = (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 componentBlocks = props.componentBlocks, jsonProperties = props.jsonProperties;
     var _b = jsonProperties.data, CB_PLACEMENT_PROP_SECTION = _b.CB_PLACEMENT_PROP_SECTION, CB_LAYOUT_PROP_PADDING = _b.CB_LAYOUT_PROP_PADDING, CB_CONTENT_PROP_SECTION = _b.CB_CONTENT_PROP_SECTION;
+    var isSectionFontResponsive = !!(CB_CONTENT_PROP_SECTION === null || CB_CONTENT_PROP_SECTION === void 0 ? void 0 : CB_CONTENT_PROP_SECTION.CB_CONTENT_PROP_SECTION_SPEC_VARIABLEROOTFONTSIZE);
     var _c = (0, react_1.useState)(null), selectedCB = _c[0], setSelectedCB = _c[1];
     var gleRef = (0, react_1.useRef)(null);
     var _d = (0, react_1.useState)(50), rowHeight = _d[0], setRowHeight = _d[1];
@@ -354,9 +355,6 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
             });
     };
     var onWidthChange = function (width) {
-        var responsiveFontMode = 
-        // NOTE: local환경에서 CB_CONTENT_PROP_SECTION이 없는 경우가 있음.
-        !!(CB_CONTENT_PROP_SECTION === null || CB_CONTENT_PROP_SECTION === void 0 ? void 0 : CB_CONTENT_PROP_SECTION.CB_CONTENT_PROP_SECTION_SPEC_VARIABLEROOTFONTSIZE);
         if (device === 'MOBILE') {
             var cellWidth_1 = width / MOBILE_GRID_COLS;
             setRowHeight(cellWidth_1 * 0.56);
@@ -364,10 +362,10 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
             setBaseFontSize(cellWidth_1 / 2.35);
             return;
         }
-        var theValue = width * -0.00175 + 4.45; // 2.35
+        var theValue = 2.35;
         var cellWidth = width / DESKTOP_GRID_COLS;
         setRowHeight(cellWidth * 0.56);
-        responsiveFontMode ? setBaseFontSize(cellWidth / theValue) : setBaseFontSize(16);
+        setBaseFontSize(cellWidth / theValue);
         // setBaseFontSize(cellWidth / 2.35);
     };
     var padding = (0, parseSectionPadding_1.default)(CB_LAYOUT_PROP_PADDING, device);
@@ -445,7 +443,7 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
                                             return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-box-in-group", onClick: function (e) {
                                                     e.stopPropagation();
                                                     clickOneCBInBulk(matchedCB.id, array);
-                                                } }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { cbProps: cbCopy, device: device, index: index }) }) }), matchedCB.id));
+                                                } }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { cbProps: cbCopy, device: device, index: index, isSectionFontResponsive: isSectionFontResponsive }) }) }), matchedCB.id));
                                         }) })) }), each.i));
                             }
                             if (!matchedCB) {
@@ -461,7 +459,7 @@ var CustomSection = (0, react_1.forwardRef)(function CustomSection(props, ref) {
                                         e.stopPropagation();
                                         e.preventDefault();
                                         onContextMenuCB(matchedCB.id, e);
-                                    } }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { cbProps: matchedCB, device: device, index: index }) }) })) }), each.i));
+                                    } }, { children: (0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { index: index, cbProps: matchedCB, device: device, isSectionFontResponsive: isSectionFontResponsive }) }) })) }), each.i));
                         }) })) })) })) }) }));
 });
 function keepSimilarOrderToPreventRerender(arr) {

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

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

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

@@ -27,14 +27,14 @@ var Text_1 = __importDefault(require("./componentBlocks/Text/Text"));
 var Twitter_1 = __importDefault(require("./componentBlocks/Twitter/Twitter"));
 var Youtube_1 = require("./componentBlocks/Youtube");
 function ComponentBlockMatcher(_a) {
-    var cbProps = _a.cbProps, device = _a.device, index = _a.index;
+    var cbProps = _a.cbProps, device = _a.device, index = _a.index, isSectionFontResponsive = _a.isSectionFontResponsive;
     var componentBlockCode = cbProps.componentBlockCode, data = cbProps.jsonProperties.data;
     var propsWithValue = device === 'MOBILE' ? (0, newUtils_1.replaceUndefinedValues)(data) : data;
     switch (componentBlockCode) {
         case types_1.CB_ALL_CODES.CB_BTN:
-            return (0, jsx_runtime_1.jsx)(Button_1.default, __assign({}, propsWithValue, { index: index }));
+            return ((0, jsx_runtime_1.jsx)(Button_1.default, __assign({}, propsWithValue, { index: index, isSectionResponsiveFont: isSectionFontResponsive })));
         case types_1.CB_ALL_CODES.CB_TEXT:
-            return (0, jsx_runtime_1.jsx)(Text_1.default, __assign({}, propsWithValue, { index: index }));
+            return ((0, jsx_runtime_1.jsx)(Text_1.default, __assign({}, propsWithValue, { index: index, isSectionResponsiveFont: isSectionFontResponsive })));
         case types_1.CB_ALL_CODES.CB_RICHTEXT:
             return (0, jsx_runtime_1.jsx)(RichText_1.RichText, __assign({}, propsWithValue, { index: index }));
         case types_1.CB_ALL_CODES.CB_DIVIDER:

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

@@ -1,5 +1,7 @@
 /// <reference types="react" />
 import type { CB_BTN_PROPERTIES_TYPE, IndexForIntersection } from '../../../../../../../DynamicLayout/sections/CustomSection/util/types';
-type Props = CB_BTN_PROPERTIES_TYPE & IndexForIntersection;
+type Props = CB_BTN_PROPERTIES_TYPE & IndexForIntersection & {
+    isSectionResponsiveFont: boolean;
+};
 declare function Button(props: Props): JSX.Element;
 export default Button;

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

@@ -40,14 +40,14 @@ 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_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, isSectionResponsiveFont = props.isSectionResponsiveFont;
     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 _d = getBTNStyles(props.CB_STYLE_PROP_BTNTEXT, device, isSectionResponsiveFont), btnTextStyle = _d.style, btnTextHoverStyle = _d.hoverStyle;
     var _e = getBTNColorStyles(CB_STYLE_PROP_BTNCOLOR, 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';
@@ -74,7 +74,7 @@ function Button(props) {
                     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 })) }))] }));
 }
-function getBTNStyles(props, device) {
+function getBTNStyles(props, device, isResponsive) {
     var availableSpecCodes = [
         'CB_STYLE_PROP_BTNTEXT_SPEC_TYPEFACE',
         'CB_STYLE_PROP_BTNTEXT_SPEC_WEIGHT',
@@ -85,7 +85,13 @@ function getBTNStyles(props, device) {
         'CB_STYLE_PROP_BTNTEXT_SPEC_HORIZONTAL',
         'CB_STYLE_PROP_BTNTEXT_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: 'BTNTEXT',
+        isResponsive: isResponsive
+    });
 }
 function getBTNColorStyles(props, device) {
     var availableSpecCodes = [

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

@@ -1,5 +1,7 @@
 /// <reference types="react" />
 import type { CB_TEXT_PROPERTIES_TYPE, IndexForIntersection } from '../../../../util/types';
-type Props = CB_TEXT_PROPERTIES_TYPE & IndexForIntersection;
+type Props = CB_TEXT_PROPERTIES_TYPE & IndexForIntersection & {
+    isSectionResponsiveFont: boolean;
+};
 declare function Text(props: Props): JSX.Element;
 export default Text;

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

@@ -30,15 +30,19 @@ var S_HiddenCover_1 = require("../components/S_HiddenCover");
 var useCLINK_1 = __importDefault(require("../hooks/useCLINK"));
 function Text(props) {
     var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
-    var index = props.index, _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_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
-    var _c = (0, useCLINK_1.default)({
+    var index = props.index, _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_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, _c = props.CB_CONTENT_PROP_TEXTOPTION, CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_DESKTOP = _c.CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_DESKTOP, CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_MOBILE = _c.CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_MOBILE, isSectionResponsiveFont = props.isSectionResponsiveFont;
+    var _d = (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)
-    }), CLINKCursor = _c.CLINKCursor, onClickCLINK = _c.onClickCLINK;
-    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;
+    }), CLINKCursor = _d.CLINKCursor, onClickCLINK = _d.onClickCLINK;
+    var isCBFontResponsive = device === 'DESKTOP'
+        ? CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_DESKTOP
+        : CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_MOBILE;
+    var isFontResponsive = isSectionResponsiveFont || isCBFontResponsive;
+    var _e = getTextStyles(props.CB_STYLE_PROP_TEXT, device, isFontResponsive), textStyle = _e.style, textHoverStyle = _e.hoverStyle;
+    var _f = (0, util_1.parseProperties)(props, device), propsStyle = _f.style, propsHoverStyle = _f.hoverStyle, layoutStyle = _f.layout, effect = _f.effect;
     var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
     var googleFonts = (0, getGoogleFonts_1.getGoogleFontsFromTextCB)(props.CB_STYLE_PROP_TEXT, device === 'MOBILE');
     (0, useGoogleFonts_1.default)({ fonts: googleFonts });
@@ -56,13 +60,13 @@ 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 } : {};
-    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({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle, style: {
-                    display: 'flex',
-                    justifyContent: 'center',
-                    alignItems: 'center'
-                } }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box cb-text-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor, height: 'fit-content' }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', height: 'fit-content' }), onClick: onClickCLINK }, { children: 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({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle, style: __assign({ display: 'flex' }, layoutStyle), hoverStyle: __assign(__assign({}, textHoverStyle), propsHoverStyle) }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box cb-text-box", normalStyle: __assign(__assign(__assign(__assign({}, textStyle), propsStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor, height: 'fit-content' }), hoverStyle: {
+                        whiteSpace: 'pre-wrap',
+                        wordBreak: 'break-word',
+                        height: 'fit-content'
+                    }, onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
 }
-function getTextStyles(props, device) {
+function getTextStyles(props, device, isResponsive) {
     var availableSpecCodes = [
         'CB_STYLE_PROP_TEXT_SPEC_TYPEFACE',
         'CB_STYLE_PROP_TEXT_SPEC_WEIGHT',
@@ -73,6 +77,12 @@ function getTextStyles(props, device) {
         'CB_STYLE_PROP_TEXT_SPEC_HORIZONTAL',
         'CB_STYLE_PROP_TEXT_SPEC_VERTICAL'
     ];
-    return (0, textUtil_1.parseStyleTextToCSSProp)({ availableSpecCodes: availableSpecCodes, props: props, device: device, propKey: 'TEXT' });
+    return (0, textUtil_1.parseStyleTextToCSSProp)({
+        availableSpecCodes: availableSpecCodes,
+        props: props,
+        device: device,
+        propKey: 'TEXT',
+        isResponsive: isResponsive
+    });
 }
 exports.default = Text;

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

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 type Props = {
     effectVisibleStyle: React.CSSProperties;
+    hoverStyle?: React.CSSProperties;
 };
 export declare const S_CB_AnimationObserverBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Props, never>;
 export {};

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

@@ -14,14 +14,37 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.S_CB_AnimationObserverBox = void 0;
-var styled_components_1 = __importDefault(require("styled-components"));
-exports.S_CB_AnimationObserverBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 100%;\n  width: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n  width: 100%;\n\n  ", ";\n"])), function (_a) {
+var styled_components_1 = __importStar(require("styled-components"));
+exports.S_CB_AnimationObserverBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:hover {\n    ", ";\n  }\n"], ["\n  height: 100%;\n  width: 100%;\n\n  ", ";\n\n  &:hover {\n    ", ";\n  }\n"])), function (_a) {
     var effectVisibleStyle = _a.effectVisibleStyle;
     return effectVisibleStyle && __assign({}, effectVisibleStyle);
+}, function (_a) {
+    var hoverStyle = _a.hoverStyle;
+    return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        ", "\n      "], ["\n        ", "\n      "])), __assign(__assign({}, hoverStyle), { boxShadow: '' }));
 });
-var templateObject_1;
+var templateObject_1, templateObject_2;

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

@@ -7,6 +7,11 @@ export type StylesProps = {
 export type CB_CONTENT_PROP_TEXT = {
     CB_CONTENT_PROP_TEXT_SPEC_TEXT: STRING_PLAIN;
 };
+export type CB_CONTENT_PROP_TEXTOPTION = {
+    CB_CONTENT_PROP_TEXTOPTION_SPEC_FITCONTENT: boolean;
+    CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_MOBILE: boolean;
+    CB_CONTENT_PROP_TEXTOPTION_SPEC_RESPONSIVE_DESKTOP: boolean;
+};
 export type CB_CONTENT_PROP_CLINK = {
     CB_CONTENT_PROP_CLINK_SPEC_TYPE: 'INTERNAL' | 'EXTERNAL' | 'DISABLED';
     CB_CONTENT_PROP_CLINK_SPEC_SRC: STRING_PLAIN;

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

@@ -1,6 +1,6 @@
 import type { Device } from '../util/types';
 import type { CSSProperties } from 'styled-components';
-export declare function parseStyleTextToCSSProp<T>({ availableSpecCodes, props, propKey, device }: ParseStyleTextProps<T>): {
+export declare function parseStyleTextToCSSProp<T>({ availableSpecCodes, props, propKey, device, isResponsive }: ParseStyleTextProps<T>): {
     style: CSSProperties;
     hoverStyle: CSSProperties;
 };
@@ -9,11 +9,13 @@ type ParseStyleTextProps<T> = {
     props: T;
     propKey: 'TEXT';
     device: Device;
+    isResponsive: boolean;
 } | {
     availableSpecCodes: Array<keyof T>;
     props: T;
     propKey: 'BTNTEXT';
     device: Device;
+    isResponsive: boolean;
 };
 export declare function getTextCSSPropKey(key: string, cbName: 'TEXT' | 'BTNTEXT'): "" | "color" | "letterSpacing" | "fontWeight" | "fontFamily" | "lineHeight" | "fontSize" | "HORIZONTAL" | "alignItems";
 export {};

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

@@ -13,7 +13,7 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getTextCSSPropKey = exports.parseStyleTextToCSSProp = void 0;
 function parseStyleTextToCSSProp(_a) {
-    var availableSpecCodes = _a.availableSpecCodes, props = _a.props, propKey = _a.propKey, device = _a.device;
+    var availableSpecCodes = _a.availableSpecCodes, props = _a.props, propKey = _a.propKey, device = _a.device, isResponsive = _a.isResponsive;
     return availableSpecCodes.reduce(function (acc, currentKey) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
         var stringifiedKey = currentKey.toString();
@@ -66,14 +66,14 @@ function parseStyleTextToCSSProp(_a) {
         }
         if (cssPropertyKey === 'fontSize') {
             if (hoverValue === null || hoverValue === undefined) {
-                var emValue_1 = getEmFontSize(device, value);
+                var emValue_1 = getFontSize(device, value, isResponsive);
                 return {
                     style: __assign(__assign({}, acc.style), (_k = {}, _k[cssPropertyKey] = emValue_1, _k)),
                     hoverStyle: __assign({}, acc.hoverStyle)
                 };
             }
-            var emValue = getEmFontSize(device, value);
-            var hoverEmValue = getEmFontSize(device, hoverValue);
+            var emValue = getFontSize(device, value, isResponsive);
+            var hoverEmValue = getFontSize(device, hoverValue, isResponsive);
             return {
                 style: __assign(__assign({}, acc.style), (_l = {}, _l[cssPropertyKey] = emValue, _l)),
                 hoverStyle: __assign(__assign({}, acc.hoverStyle), (_m = {}, _m[cssPropertyKey] = hoverEmValue, _m))
@@ -204,9 +204,9 @@ function getVerticalPositionValue(value) {
             return '';
     }
 }
-function getEmFontSize(device, size) {
-    if (device === 'DESKTOP') {
-        return "".concat((size / 16).toFixed(3), "em");
+function getFontSize(device, size, isResponsive) {
+    if (!isResponsive) {
+        return "".concat(size, "px");
     }
     return "".concat((size / 16).toFixed(3), "em");
 }

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

@@ -1,4 +1,4 @@
-import type { ComponentBlock } from '../types';
+import { type ComponentBlock } from '../types';
 export declare function parsePlacement(components: ComponentBlock[]): {
     sm: {
         i: string;
@@ -7,6 +7,7 @@ export declare function parsePlacement(components: ComponentBlock[]): {
         w: number;
         h: number;
         z: number;
+        activeAutoResize: boolean;
     }[];
     lg: {
         i: string;
@@ -15,6 +16,7 @@ export declare function parsePlacement(components: ComponentBlock[]): {
         w: number;
         h: number;
         z: number;
+        activeAutoResize: boolean;
     }[];
 };
 export default parsePlacement;

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

@@ -10,10 +10,15 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.parsePlacement = void 0;
+var types_1 = require("../types");
 function parsePlacement(components) {
     return components.reduce(function (acc, cur) {
-        var id = cur.id, jsonProperties = cur.jsonProperties;
-        var _a = parsePropPlacement(jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, id), mobileLayout = _a.mobileLayout, desktopLayout = _a.desktopLayout;
+        var id = cur.id, jsonProperties = cur.jsonProperties, componentBlockCode = cur.componentBlockCode;
+        var activeAutoResize = false;
+        if (componentBlockCode === types_1.CB_ALL_CODES.CB_TEXT && jsonProperties.data.CB_CONTENT_PROP_TEXTOPTION.CB_CONTENT_PROP_TEXTOPTION_SPEC_FITCONTENT) {
+            activeAutoResize = true;
+        }
+        var _a = parsePropPlacement(id, jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, activeAutoResize), mobileLayout = _a.mobileLayout, desktopLayout = _a.desktopLayout;
         return {
             sm: __spreadArray(__spreadArray([], acc.sm, true), [mobileLayout], false),
             lg: __spreadArray(__spreadArray([], acc.lg, true), [desktopLayout], false)
@@ -21,22 +26,24 @@ function parsePlacement(components) {
     }, { sm: [], lg: [] });
 }
 exports.parsePlacement = parsePlacement;
-function parsePropPlacement(props, id) {
+function parsePropPlacement(id, placementProps, activeAutoResize) {
     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 + 500
+        x: placementProps.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX,
+        y: placementProps.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY,
+        w: placementProps.CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS,
+        h: placementProps.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS,
+        z: placementProps.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX + 500,
+        activeAutoResize: activeAutoResize
     };
     var mobileLayout = {
         i: id.toString(),
-        x: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX:MOBILE'],
-        y: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY:MOBILE'],
-        w: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE'],
-        h: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS:MOBILE'],
-        z: props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE'] + 500
+        x: placementProps['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX:MOBILE'],
+        y: placementProps['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY:MOBILE'],
+        w: placementProps['CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE'],
+        h: placementProps['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS:MOBILE'],
+        z: placementProps['CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE'] + 500,
+        activeAutoResize: activeAutoResize
     };
     return {
         mobileLayout: mobileLayout,

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

@@ -1,7 +1,7 @@
 import type { CB_BTNTEXT_STYLE_PROPS, CB_STYLE_PROP_BTNCOLOR_SPECS } from '../components/ComponentBlock/componentBlocks/Button/btnTypes';
 import type { CB_STYLE_PROP_TEXT_SPECS } from '../components/ComponentBlock/componentBlocks/Text/types';
 import type { CB_TWITTER_STYLE_PROPS } from '../components/ComponentBlock/componentBlocks/Twitter/types';
-import type { CB_CONTENT_PROP_CLINK, CB_CONTENT_PROP_CODEBLOCK, CB_CONTENT_PROP_IMAGE, CB_CONTENT_PROP_TEXT, CB_CONTENT_PROP_TWITTER } 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_TEXTOPTION, CB_CONTENT_PROP_TWITTER } 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';
@@ -41,6 +41,7 @@ export type CB_TEXT_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
     CB_CONTENT_PROP_TEXT: CB_CONTENT_PROP_TEXT;
     CB_CONTENT_PROP_CLINK: CB_CONTENT_PROP_CLINK;
     CB_CONTENT_PROP_VISIBILITY: CB_CONTENT_PROP_VISIBILITY_SPECS;
+    CB_CONTENT_PROP_TEXTOPTION: CB_CONTENT_PROP_TEXTOPTION;
     CB_STYLE_PROP_TEXT: CB_STYLE_PROP_TEXT_SPECS;
     CB_STYLE_PROP_OPACITY: CB_STYLE_PROP_TEXT_OPACITY_SPECS;
     CB_LAYOUT_PROP_PADDING: CB_LAYOUT_PROP_PADDING_SPECS;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web-test",
-  "version": "2.2.70",
+  "version": "2.2.72",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",
@@ -22,7 +22,7 @@
     "i18next-intervalplural-postprocessor": "^3.0.0",
     "lottie-react": "^2.3.1",
     "nuka-carousel": "^4.8.4",
-    "publ-echo": "^0.0.77",
+    "publ-echo": "^0.0.78",
     "react-hook-form": "^7.28.1",
     "react-i18next": "^11.12.0",
     "react-router-dom": "^5.2.0",