pds-dev-kit-web-test 2.7.330 → 2.7.333

package/dist/src/sub/DynamicLayout/CompositionRenderer/Composition.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { CB_ALL_CODES } from '../sections/CustomSection/types';
+import { CB_ALL_CODES } from '../sections/CustomSection/types';
 import type { IComposition } from '../types';
 import type { Layout } from 'publ-echo-test/dist/lib/GridLayoutEditor/types';
 export type LayoutsType = {

package/dist/src/sub/DynamicLayout/CompositionRenderer/Composition.js

@@ -51,6 +51,7 @@ require("../components");
 require("../components/Section/components/CustomSectionBackground");
 var gleStyles_1 = require("../gleStyles");
 var useResizableObserver_1 = require("../sections/CustomSection/hooks/useResizableObserver");
+var types_1 = require("../sections/CustomSection/types");
 var util_1 = require("../sections/CustomSection/util");
 var parseSectionPadding_1 = __importDefault(require("../sections/CustomSection/util/layoutPropParsers/parseSectionPadding"));
 var parseCompositionPlacement_1 = __importDefault(require("../sections/CustomSection/util/parseCompositionPlacement"));
@@ -220,8 +221,8 @@ var Composition = (0, react_1.forwardRef)(function CustomSection(props, ref) {
                             paddingBottom: padding.bottom,
                             paddingRight: padding.right,
                             paddingLeft: padding.left,
-                            width: '100%'
-                            // height: '100%'
+                            width: '100%',
+                            height: ccbCode === types_1.CB_ALL_CODES.CB_CONTENTSCAROUSEL ? 'auto' : '100%'
                         } }, { children: (0, jsx_runtime_1.jsx)(GridContainer, __assign({ className: "composition-container", "data-cols": cols, "data-rows": rows, "data-row-height": rowHeight, "data-col-width": "10px", ref: containerRef, cols: cols, rowHeight: rowHeight, sectionRow: rows, "data-wrapper-paddingT": padding.top, "data-wrapper-paddingB": padding.bottom, "data-wrapper-paddingL": padding.left, "data-wrapper-paddingR": padding.right, style: {
                                 width: customSectionStyles.width,
                                 maxWidth: customSectionStyles.maxWidth
@@ -232,63 +233,6 @@ var Composition = (0, react_1.forwardRef)(function CustomSection(props, ref) {
                                 // onToggleGBPinned={onToggleGBPinned}
                                 isEditMode: false }, child.blockId)); }) })) })) })) })) })) }));
 });
-var MOCK_BORDER = {
-    CB_STYLE_PROP_BORDER_SPEC_COLOR: '#000000FF',
-    'CB_STYLE_PROP_BORDER_SPEC_COLOR:HOVER': null,
-    'CB_STYLE_PROP_BORDER_SPEC_COLOR:MOBILE': null,
-    'CB_STYLE_PROP_BORDER_SPEC_COLOR:MOBILE:HOVER': null,
-    CB_STYLE_PROP_BORDER_SPEC_RADIUS: {
-        bl: 18,
-        br: 18,
-        tl: 18,
-        tr: 18
-    },
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:HOVER': null,
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE': null,
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUS:MOBILE:HOVER': null,
-    CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX: true,
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:HOVER': true,
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:MOBILE': null,
-    'CB_STYLE_PROP_BORDER_SPEC_RADIUSFIX:MOBILE:HOVER': null,
-    CB_STYLE_PROP_BORDER_SPEC_STYLE: 'SOLID',
-    'CB_STYLE_PROP_BORDER_SPEC_STYLE:HOVER': null,
-    'CB_STYLE_PROP_BORDER_SPEC_STYLE:MOBILE': null,
-    'CB_STYLE_PROP_BORDER_SPEC_STYLE:MOBILE:HOVER': null,
-    CB_STYLE_PROP_BORDER_SPEC_WIDTH: 3,
-    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:HOVER': null,
-    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:MOBILE': null,
-    'CB_STYLE_PROP_BORDER_SPEC_WIDTH:MOBILE:HOVER': null
-};
-var MOCK_SHADOW = {
-    CB_STYLE_PROP_SHADOW_SPEC_BLUR: 24,
-    'CB_STYLE_PROP_SHADOW_SPEC_BLUR:HOVER': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_BLUR:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_BLUR:MOBILE:HOVER': null,
-    CB_STYLE_PROP_SHADOW_SPEC_COLOR: '#000000FF',
-    'CB_STYLE_PROP_SHADOW_SPEC_COLOR:HOVER': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_COLOR:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_COLOR:MOBILE:HOVER': null,
-    CB_STYLE_PROP_SHADOW_SPEC_OPACITY: 30,
-    'CB_STYLE_PROP_SHADOW_SPEC_OPACITY:HOVER': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_OPACITY:MOBILE:HOVER': null,
-    CB_STYLE_PROP_SHADOW_SPEC_SPREAD: 2,
-    'CB_STYLE_PROP_SHADOW_SPEC_SPREAD:HOVER': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_SPREAD:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_SPREAD:MOBILE:HOVER': null,
-    CB_STYLE_PROP_SHADOW_SPEC_TYPE: 'OUTSET',
-    'CB_STYLE_PROP_SHADOW_SPEC_TYPE:HOVER': 'OUTSET',
-    'CB_STYLE_PROP_SHADOW_SPEC_TYPE:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_TYPE:MOBILE:HOVER': null,
-    CB_STYLE_PROP_SHADOW_SPEC_X: 0,
-    'CB_STYLE_PROP_SHADOW_SPEC_X:HOVER': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_X:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_X:MOBILE:HOVER': null,
-    CB_STYLE_PROP_SHADOW_SPEC_Y: 12,
-    'CB_STYLE_PROP_SHADOW_SPEC_Y:HOVER': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_Y:MOBILE': null,
-    'CB_STYLE_PROP_SHADOW_SPEC_Y:MOBILE:HOVER': null
-};
 var GridContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid; /* Space between grid items */\n  gap: 10px;\n  grid-template-columns: repeat(", ", 1fr);\n  grid-template-rows: repeat(\n    ", ",\n    minmax(", ", auto)\n  );\n  /* height: 100%; */\n  padding: 10px 10px;\n  width: 100%;\n\n  * {\n    box-sizing: border-box;\n  }\n"], ["\n  display: grid; /* Space between grid items */\n  gap: 10px;\n  grid-template-columns: repeat(", ", 1fr);\n  grid-template-rows: repeat(\n    ", ",\n    minmax(", ", auto)\n  );\n  /* height: 100%; */\n  padding: 10px 10px;\n  width: 100%;\n\n  * {\n    box-sizing: border-box;\n  }\n"])), function (props) { return props.cols; }, function (props) { return props.sectionRow; }, function (props) { return "".concat(props.rowHeight, "px"); });
 var S_COMPOSITIONWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
 exports.default = react_1.default.memo(Composition);

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

@@ -9,5 +9,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.S_HeightFitContentCover = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
-exports.S_HeightFitContentCover = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  /* --- 1. \uAE30\uC874 \uC624\uBC84\uB808\uC774 \uC2A4\uD0C0\uC77C --- */\n  /* background: linear-gradient(to top, ", " 0%, transparent 100%); */\n  background: linear-gradient(139deg, #fb8817, #ff4b01, #c12127, #e02aff);\n  bottom: 0;\n  height: 100%;\n  left: 0;\n  opacity: 0.5;\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n\n  /* * [\uC911\uC694] \n   * \uC774 \uC694\uC18C \uC804\uCCB4\uB294 \uD074\uB9AD\uC774 \uD1B5\uACFC\uB429\uB2C8\uB2E4. \n   * (\uC790\uC2DD\uC778 ::after\uB3C4 \uC774 \uC18D\uC131\uC744 \uC0C1\uC18D\uBC1B\uC2B5\uB2C8\uB2E4)\n   */\n  z-index: 2;\n\n  /* --- 2. ::after \uAC00\uC0C1 \uC694\uC18C\uB97C \uC0AC\uC6A9\uD574 \uAE00\uC790 \uCD94\uAC00 --- */\n  &::after {\n    bottom: 0;\n    color: #ffffffff;\n    content: '", "';\n    font-size: 11px;\n    font-weight: bold;\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    text-align: center;\n    width: 100%;\n  }\n"], ["\n  /* --- 1. \uAE30\uC874 \uC624\uBC84\uB808\uC774 \uC2A4\uD0C0\uC77C --- */\n  /* background: linear-gradient(to top, ", " 0%, transparent 100%); */\n  background: linear-gradient(139deg, #fb8817, #ff4b01, #c12127, #e02aff);\n  bottom: 0;\n  height: 100%;\n  left: 0;\n  opacity: 0.5;\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n\n  /* * [\uC911\uC694] \n   * \uC774 \uC694\uC18C \uC804\uCCB4\uB294 \uD074\uB9AD\uC774 \uD1B5\uACFC\uB429\uB2C8\uB2E4. \n   * (\uC790\uC2DD\uC778 ::after\uB3C4 \uC774 \uC18D\uC131\uC744 \uC0C1\uC18D\uBC1B\uC2B5\uB2C8\uB2E4)\n   */\n  z-index: 2;\n\n  /* --- 2. ::after \uAC00\uC0C1 \uC694\uC18C\uB97C \uC0AC\uC6A9\uD574 \uAE00\uC790 \uCD94\uAC00 --- */\n  &::after {\n    bottom: 0;\n    color: #ffffffff;\n    content: '", "';\n    font-size: 11px;\n    font-weight: bold;\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    text-align: center;\n    width: 100%;\n  }\n"])), function (props) { return '#58ab81ff'; }, function (props) { return props.bottomText || ''; });
+exports.S_HeightFitContentCover = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  /* --- 1. \uAE30\uC874 \uC624\uBC84\uB808\uC774 \uC2A4\uD0C0\uC77C --- */\n  /* background: linear-gradient(to top, ", " 0%, transparent 100%); */\n  background: repeating-linear-gradient(\n    -120deg,\n    rgba(30, 235, 180, 0.3),\n    rgba(30, 235, 180, 0.3) 12px,\n    rgba(0, 0, 0, 0.1) 12px,\n    rgba(0, 0, 0, 0.1) 25px\n  );\n  bottom: 0;\n  height: 100%;\n  left: 0;\n  opacity: 0.5;\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n\n  /* * [\uC911\uC694] \n   * \uC774 \uC694\uC18C \uC804\uCCB4\uB294 \uD074\uB9AD\uC774 \uD1B5\uACFC\uB429\uB2C8\uB2E4. \n   * (\uC790\uC2DD\uC778 ::after\uB3C4 \uC774 \uC18D\uC131\uC744 \uC0C1\uC18D\uBC1B\uC2B5\uB2C8\uB2E4)\n   */\n  z-index: 2;\n\n  /* --- 2. ::after \uAC00\uC0C1 \uC694\uC18C\uB97C \uC0AC\uC6A9\uD574 \uAE00\uC790 \uCD94\uAC00 --- */\n  &::after {\n    bottom: 0;\n    color: #ffffffff;\n    content: '", "';\n    font-size: 11px;\n    font-weight: bold;\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    text-align: center;\n    width: 100%;\n  }\n"], ["\n  /* --- 1. \uAE30\uC874 \uC624\uBC84\uB808\uC774 \uC2A4\uD0C0\uC77C --- */\n  /* background: linear-gradient(to top, ", " 0%, transparent 100%); */\n  background: repeating-linear-gradient(\n    -120deg,\n    rgba(30, 235, 180, 0.3),\n    rgba(30, 235, 180, 0.3) 12px,\n    rgba(0, 0, 0, 0.1) 12px,\n    rgba(0, 0, 0, 0.1) 25px\n  );\n  bottom: 0;\n  height: 100%;\n  left: 0;\n  opacity: 0.5;\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n\n  /* * [\uC911\uC694] \n   * \uC774 \uC694\uC18C \uC804\uCCB4\uB294 \uD074\uB9AD\uC774 \uD1B5\uACFC\uB429\uB2C8\uB2E4. \n   * (\uC790\uC2DD\uC778 ::after\uB3C4 \uC774 \uC18D\uC131\uC744 \uC0C1\uC18D\uBC1B\uC2B5\uB2C8\uB2E4)\n   */\n  z-index: 2;\n\n  /* --- 2. ::after \uAC00\uC0C1 \uC694\uC18C\uB97C \uC0AC\uC6A9\uD574 \uAE00\uC790 \uCD94\uAC00 --- */\n  &::after {\n    bottom: 0;\n    color: #ffffffff;\n    content: '", "';\n    font-size: 11px;\n    font-weight: bold;\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    text-align: center;\n    width: 100%;\n  }\n"])), function (props) { return '#58ab81ff'; }, function (props) { return props.bottomText || ''; });
 var templateObject_1;

package/dist/src/sub/DynamicLayout/utils/groupUtils.js

@@ -99,6 +99,8 @@ function RenderPedigreeRecursively(_a) {
         var relativeGridArea_1 = parentGroupArea
             ? calculateRelativeGridArea(gridArea_1, parentGroupArea)
             : gridArea_1;
+        console.log('before:', gridArea_1);
+        console.log('after:', relativeGridArea_1);
         // 그룹의 시작 행을 기준으로 상대적인 selectedRows 계산
         var relativeSelectedRows_1 = selectedRows
             .map(function (row) { return row - gridArea_1.rowStart + 1; })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web-test",
-  "version": "2.7.330",
+  "version": "2.7.333",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",