pds-dev-kit-web-test 2.7.496 → 2.7.498

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

@@ -69,7 +69,7 @@ var createComponent = function (type, getDesignType, getLocation, designType) {
 function ContentsCarousel(props) {
     var _a, _b;
     var _c = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _c.device, mode = _c.mode, queryData = _c.queryData;
-    var compositions = props.compositions, index = props.index, _d = props.CB_CONTENT_PROP_CONTENTSCAROUSEL, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DISPLAYCOUNTS = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MDISPLAYCOUNTS = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MDISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS, CB_STYLE_PROP_CONTENTSCAROUSELDESIGN = props.CB_STYLE_PROP_CONTENTSCAROUSELDESIGN, CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD = props.CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD, CB_STYLE_PROP_CONTENTSCAROUSELBUTTON = props.CB_STYLE_PROP_CONTENTSCAROUSELBUTTON, CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR = props.CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, CB_STYLE_PROP_BGMEDIA = props.CB_STYLE_PROP_BGMEDIA, CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE = props.CB_EFFECT_PROP_CONTENTSCAROUSEL.CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE;
+    var compositions = props.compositions, index = props.index, _d = props.CB_CONTENT_PROP_CONTENTSCAROUSEL, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DISPLAYCOUNTS = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MDISPLAYCOUNTS = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MDISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATASORTING = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATASORTING, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATAOFFSET = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATAOFFSET, CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS = _d.CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS, CB_STYLE_PROP_CONTENTSCAROUSELDESIGN = props.CB_STYLE_PROP_CONTENTSCAROUSELDESIGN, CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD = props.CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD, CB_STYLE_PROP_CONTENTSCAROUSELBUTTON = props.CB_STYLE_PROP_CONTENTSCAROUSELBUTTON, CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR = props.CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, CB_STYLE_PROP_BGMEDIA = props.CB_STYLE_PROP_BGMEDIA, CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE = props.CB_EFFECT_PROP_CONTENTSCAROUSEL.CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE;
     var CB_STYLE_PROP_CONTENTSCAROUSEL = __assign(__assign(__assign(__assign({}, CB_STYLE_PROP_CONTENTSCAROUSELDESIGN), CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD), CB_STYLE_PROP_CONTENTSCAROUSELBUTTON), CB_STYLE_PROP_CONTENTSCAROUSELPROGRESSBAR);
     var autoPlayEnabled = device === 'DESKTOP'
         ? CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD.CB_STYLE_PROP_CONTENTSCAROUSELPLAYBACKMETHOD_SPEC_AUTOPLAYUSE
@@ -93,11 +93,14 @@ function ContentsCarousel(props) {
     }), customProgressbarNormalStyle = _h.normalStyle, customProgressbarHoverStyle = _h.hoverStyle;
     var _j = (0, useSwiper_1.useSwiper)(), swiperRef = _j.swiperRef, progressRef = _j.progressRef, leftTimeMsRef = _j.leftTimeMsRef, isBeginning = _j.isBeginning, isEnd = _j.isEnd, onSwiper = _j.onSwiper, onSlideChangeTransitionEnd = _j.onSlideChangeTransitionEnd, onAutoplayTimeLeft = _j.onAutoplayTimeLeft, onClickPrevBtn = _j.onClickPrevBtn, onClickNextBtn = _j.onClickNextBtn;
     var _k = (0, react_1.useState)(false), isHovered = _k[0], setIsHovered = _k[1];
-    var orderedCompositions = __spreadArray([], CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS, true).filter(function (item) { return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; }); })
-        .sort(function (a, b) { return a.order - b.order; })
-        .map(function (item) {
-        return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; });
-    });
+    var queryPath = "".concat(CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA, "/").concat(CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATASORTING, "/").concat(CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATAOFFSET);
+    var orderedCompositions = CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE === 'VALUE'
+        ? __spreadArray([], CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS, true).filter(function (item) { return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; }); })
+            .sort(function (a, b) { return a.order - b.order; })
+            .map(function (item) {
+            return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; });
+        })
+        : compositions.filter(function (comp) { return !comp.ccbManualItemUuid; });
     var loop = contentsCarouselNormalStyle.loop && orderedCompositions.length >= displayCounts;
     // NOTE: edit모드에서는 그리드의 이벤트만 작동하도록 CB의 포인터 이벤트는 막습니다.
     var editModeStyle = mode === 'EDIT' ? { pointerEvents: 'none' } : {};
@@ -161,10 +164,9 @@ function ContentsCarousel(props) {
     if (mode === 'EDIT') {
         style.visibility = 'visible';
     }
-    var isHidden = style.visibility === 'hidden';
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), Object.entries(componentGroups).map(function (_a) {
                 var position = _a[0], groupComponents = _a[1];
-                return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentscarousel-button-group ccb-elements ".concat(position, " ").concat(isHidden ? ' hidden' : ''), ref: function (el) {
+                return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentscarousel-button-group ccb-elements ".concat(position), ref: function (el) {
                         if (el) {
                             positionRefs.current[position] = el;
                         }
@@ -174,7 +176,7 @@ function ContentsCarousel(props) {
                     }, style: __assign(__assign({}, getPositionStyle(position, ccbInset, 'GROUP', 'GROUP', 'GROUP')), { zIndex: 3, position: 'absolute' }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentscarousel-button-layout-box", style: getComponentGroupLayout(groupComponents, position) }, { children: groupComponents.map(function (component) {
                             return renderElements(component, getPositionStyle(position, ccbInset, component.designType, component.size, component.type));
                         }) })) }), position));
-            }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box ".concat(isHidden ? ' hidden' : ''), normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () {
+            }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () {
                         setIsHovered(true);
                     }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-columns": displayCounts, "data-number-of-items": displayCounts, "data-column-gap": columnGap, "data-cols": displayCounts, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-contentscarousel-layout-box", ref: layoutRef, style: __assign({}, pointerEventsObj) }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-contentscarousel-wrapper", ccbInset: ccbInset, customStyle: isHovered
                                     ? contentsCarouselHoverStyle === null || contentsCarouselHoverStyle === void 0 ? void 0 : contentsCarouselHoverStyle.customStyle
@@ -184,7 +186,7 @@ function ContentsCarousel(props) {
                                     justifyContent: layout.justifyContent
                                 } }, { children: (0, jsx_runtime_1.jsx)(ContentsCarouselCore_1.default, __assign({ ref: swiperRef, className: "cb-contentscarousel", allowTouchMove: mode !== 'EDIT' ? true : false, onSwiper: onSwiper, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onAutoplayTimeLeft: onAutoplayTimeLeft, slidesPerView: displayCounts, styles: isHovered ? contentsCarouselHoverStyle : contentsCarouselNormalStyle, effect: CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE === null || CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE === void 0 ? void 0 : CB_EFFECT_PROP_CONTENTSCAROUSEL_SPEC_TRANSITIONTYPE.toLowerCase(), loop: loop, displayCounts: displayCounts }, { children: (0, createCompositions_1.createCompositions)({
                                         valueType: CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE,
-                                        queryPath: CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA,
+                                        queryPath: queryPath,
                                         limit: displayCounts,
                                         queryData: queryData,
                                         compositions: orderedCompositions,

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

@@ -65,16 +65,16 @@ var createComponent = function (type, getDesignType, getLocation, designType, si
     };
 };
 function ContentsList(props) {
-    var _a, _b, _c, _d, _e, _f;
-    var _g = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _g.device, mode = _g.mode, queryData = _g.queryData;
+    var _a, _b, _c, _d;
+    var _e = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _e.device, mode = _e.mode, queryData = _e.queryData;
     var index = props.index, compositions = props.compositions, CB_CONTENT_PROP_CONTENTSLIST = props.CB_CONTENT_PROP_CONTENTSLIST, CB_STYLE_PROP_CONTENTSLISTDESIGN = props.CB_STYLE_PROP_CONTENTSLISTDESIGN, CB_STYLE_PROP_CONTENTSLISTPAGINATION = props.CB_STYLE_PROP_CONTENTSLISTPAGINATION, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, CB_LAYOUT_PROP_PADDING = props.CB_LAYOUT_PROP_PADDING, CB_STYLE_PROP_BGMEDIA = props.CB_STYLE_PROP_BGMEDIA, CB_LAYOUT_PROP_HEIGHTADJUSTMENT = props.CB_LAYOUT_PROP_HEIGHTADJUSTMENT;
     var 
     // CB_CONTENT_PROP_CONTENTSLIST_SPEC_ITEMCOUNTS,
-    CB_CONTENT_PROP_CONTENTSLIST_SPEC_DISPLAYCOUNTS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_DISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MDISPLAYCOUNTS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_MDISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE, CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA, CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MCOLUMNS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_MCOLUMNS;
-    var _h = (0, react_1.useState)(false), isHovered = _h[0], setIsHovered = _h[1];
-    var _j = (0, react_1.useState)(1), currentPage = _j[0], setCurrentPage = _j[1];
-    var parsedQueryPath = removeFirstSegment(CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA);
-    var queryDataValue = queryData === null || queryData === void 0 ? void 0 : queryData[parsedQueryPath];
+    CB_CONTENT_PROP_CONTENTSLIST_SPEC_DISPLAYCOUNTS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_DISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MDISPLAYCOUNTS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_MDISPLAYCOUNTS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE, CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA, CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATASORTING = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATASORTING, CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATAOFFSET = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATAOFFSET, CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MCOLUMNS = CB_CONTENT_PROP_CONTENTSLIST.CB_CONTENT_PROP_CONTENTSLIST_SPEC_MCOLUMNS;
+    var _f = (0, react_1.useState)(false), isHovered = _f[0], setIsHovered = _f[1];
+    var _g = (0, react_1.useState)(1), currentPage = _g[0], setCurrentPage = _g[1];
+    var queryPath = "".concat(CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA, "/").concat(CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATASORTING, "/").concat(CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATAOFFSET);
+    var queryDataValue = queryData === null || queryData === void 0 ? void 0 : queryData[queryPath];
     // list의 minheight / minwidth를 계산
     var numberOfColumns = device === 'DESKTOP'
         ? CB_CONTENT_PROP_CONTENTSLIST_SPEC_COLUMNS
@@ -86,19 +86,19 @@ function ContentsList(props) {
         ? queryDataValue === null || queryDataValue === void 0 ? void 0 : queryDataValue.length
         : CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length) / displayCounts);
     var CB_STYLE_PROP_CONTENTSLIST = __assign(__assign({}, CB_STYLE_PROP_CONTENTSLISTDESIGN), CB_STYLE_PROP_CONTENTSLISTPAGINATION);
-    var _k = (0, util_1.parseProperties)(props, device), style = _k.style, hoverStyle = _k.hoverStyle, layout = _k.layout, effect = _k.effect, overlayStyle = _k.overlayStyle;
+    var _h = (0, util_1.parseProperties)(props, device), style = _h.style, hoverStyle = _h.hoverStyle, layout = _h.layout, effect = _h.effect, overlayStyle = _h.overlayStyle;
     var contentPropCss = (0, contentsListUtils_1.parseGridContentProp)({
         props: CB_CONTENT_PROP_CONTENTSLIST,
         device: device
     }).contentPropCss;
-    var _l = (0, contentsListUtils_1.parseGridStyleProp)({
+    var _j = (0, contentsListUtils_1.parseGridStyleProp)({
         props: CB_STYLE_PROP_CONTENTSLIST,
         device: device
-    }), stylePropCss = _l.stylePropCss, hoverStylePropCss = _l.hoverStylePropCss;
-    var _m = (0, contentsListUtils_1.parsePaginationStyleProp)({
+    }), stylePropCss = _j.stylePropCss, hoverStylePropCss = _j.hoverStylePropCss;
+    var _k = (0, contentsListUtils_1.parsePaginationStyleProp)({
         props: CB_STYLE_PROP_CONTENTSLIST,
         device: device
-    }), paginationNormalStyle = _m.normalStyle, paginationHoverStyle = _m.hoverStyle;
+    }), paginationNormalStyle = _k.normalStyle, paginationHoverStyle = _k.hoverStyle;
     // NOTE: edit모드에서는 그리드의 이벤트만 작동하도록 CB의 포인터 이벤트는 막습니다.
     var editModeStyle = mode === 'EDIT' ? { pointerEvents: 'none' } : {};
     var cbRef = (0, react_1.useRef)(null);
@@ -135,9 +135,6 @@ function ContentsList(props) {
         CB_LAYOUT_PROP_PADDING.CB_LAYOUT_PROP_PADDING_SPEC_PADDING.right;
     var paddingTB = CB_LAYOUT_PROP_PADDING.CB_LAYOUT_PROP_PADDING_SPEC_PADDING.top +
         CB_LAYOUT_PROP_PADDING.CB_LAYOUT_PROP_PADDING_SPEC_PADDING.bottom;
-    var queryPath = removeFirstSegment(CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA);
-    var queryLength = (_f = (_e = queryData === null || queryData === void 0 ? void 0 : queryData[queryPath]) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0;
-    // const displayedItemLength = Math.max(0, Math.min(endIndex, queryLength) - startIndex);
     var numberOfRows = Math.ceil(displayCounts / numberOfColumns);
     var listMinWidth = oneCompositionMinWidth * numberOfColumns + (numberOfColumns - 1) * columnGap + paddingLR;
     var listMinHeight = oneCompositionMinHeight * numberOfRows +
@@ -147,9 +144,9 @@ function ContentsList(props) {
     var components = [
         createPagination(paginationNormalStyle, paginationHoverStyle, isHovered)
     ].filter(function (component) { return component !== undefined; });
-    var _o = (0, useFlexGridLayout_1.useFlexGridLayout)({ components: components }), layoutRef = _o.layoutRef, positionRefs = _o.positionRefs, 
+    var _l = (0, useFlexGridLayout_1.useFlexGridLayout)({ components: components }), layoutRef = _l.layoutRef, positionRefs = _l.positionRefs, 
     // ccbInset,
-    componentGroups = _o.componentGroups, getPositionStyle = _o.getPositionStyle, getComponentGroupLayout = _o.getComponentGroupLayout;
+    componentGroups = _l.componentGroups, getPositionStyle = _l.getPositionStyle, getComponentGroupLayout = _l.getComponentGroupLayout;
     var ccbInset = {
         top: '0px',
         right: '0px',
@@ -169,11 +166,13 @@ function ContentsList(props) {
     var isMobile = device === 'MOBILE';
     var isBgMedia = getIsBgMedia(isMobile, CB_STYLE_PROP_BGMEDIA);
     var mediaType = getMediaType(isMobile, CB_STYLE_PROP_BGMEDIA);
-    var orderedCompositions = __spreadArray([], CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS, true).filter(function (item) { return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; }); })
-        .sort(function (a, b) { return a.order - b.order; })
-        .map(function (item) {
-        return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; });
-    });
+    var orderedCompositions = CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE === 'VALUE'
+        ? __spreadArray([], CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS, true).filter(function (item) { return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; }); })
+            .sort(function (a, b) { return a.order - b.order; })
+            .map(function (item) {
+            return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; });
+        })
+        : compositions.filter(function (comp) { return !comp.ccbManualItemUuid; });
     var heightFitContentByDevice = device === 'DESKTOP'
         ? CB_LAYOUT_PROP_HEIGHTADJUSTMENT === null || CB_LAYOUT_PROP_HEIGHTADJUSTMENT === void 0 ? void 0 : CB_LAYOUT_PROP_HEIGHTADJUSTMENT.CB_LAYOUT_PROP_HEIGHTADJUSTMENT_SPEC_HEIGHTFITCONTENT
         : CB_LAYOUT_PROP_HEIGHTADJUSTMENT === null || CB_LAYOUT_PROP_HEIGHTADJUSTMENT === void 0 ? void 0 : CB_LAYOUT_PROP_HEIGHTADJUSTMENT['CB_LAYOUT_PROP_HEIGHTADJUSTMENT_SPEC_HEIGHTFITCONTENT:MOBILE'];
@@ -182,29 +181,27 @@ function ContentsList(props) {
     if (mode === 'EDIT') {
         style.visibility = 'visible';
     }
-    var isHidden = style.visibility === 'hidden';
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), isEditModeAndHeightFitContent && ((0, jsx_runtime_1.jsx)(S_HeightFitContentCover_1.S_HeightFitContentCover, { className: "height-fit-content-cover", bottomText: t('str_10106') })), Object.entries(componentGroups).map(function (_a) {
                 var position = _a[0], groupComponents = _a[1];
-                return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-group ccb-elements ".concat(isHidden ? 'hidden' : ''), ref: function (el) {
+                return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-group ccb-elements", ref: function (el) {
                         if (el) {
                             positionRefs.current[position] = el;
                         }
                         else {
                             delete positionRefs.current[position];
                         }
-                    }, style: __assign(__assign({}, getPositionStyle(position, ccbInset, 'GROUP', 'GROUP', 'GROUP')), { zIndex: 3, position: 'absolute', visibility: isHidden ? 'hidden' : 'visible' }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-layout-box", style: (getComponentGroupLayout(groupComponents, position),
-                            { visibility: isHidden ? 'hidden' : 'visible' }) }, { children: groupComponents.map(function (component) {
+                    }, style: __assign(__assign({}, getPositionStyle(position, ccbInset, 'GROUP', 'GROUP', 'GROUP')), { zIndex: 3, position: 'absolute' }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-contentslist-button-layout-box", style: getComponentGroupLayout(groupComponents, position) }, { children: groupComponents.map(function (component) {
                             return renderElements(component, getPositionStyle(position, ccbInset, component.designType, component.size, component.type));
                         }) })) }), position));
-            }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ id: "contentslist-box", className: "cb-layout-box ccb-layout-box ".concat(isHidden ? 'hidden' : ''), normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-items": CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length, "data-number-of-columns": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-row-gap": rowGap, "data-column-gap": columnGap, "data-cols": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-min-width": listMinWidth, "data-min-height": listMinHeight, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_ContentsListLayout, __assign({ className: "cb-contentslist-layout-box", ref: layoutRef, style: {
+            }), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ id: "contentslist-box", className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, "data-number-of-items": CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length, "data-number-of-columns": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-row-gap": rowGap, "data-column-gap": columnGap, "data-cols": Math.min(numberOfColumns, CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length), "data-min-width": listMinWidth, "data-min-height": listMinHeight, "data-inset-top": parseFloat(ccbInset.top), "data-inset-bottom": parseFloat(ccbInset.bottom) }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_ContentsListLayout, __assign({ className: "cb-contentslist-layout-box", ref: layoutRef, style: {
                                 display: layout.display,
                                 flexDirection: layout.flexDirection,
                                 justifyContent: layout.justifyContent
                             } }, { children: (0, jsx_runtime_1.jsx)(S_ContentsListWrapper, __assign({ className: "cb-contentslist-wrapper", ccbInset: ccbInset, contentPropCss: contentPropCss, stylePropCss: isHovered ? hoverStylePropCss : stylePropCss, 
                                 // NOTE: 위 CSS 프롭과 정리
-                                style: { gridTemplateRows: "repeat(".concat(numberOfRows, ", min-content)") } }, { children: (0, createCompositions_1.createCompositions)({
+                                style: { gridTemplateRows: "repeat(".concat(numberOfRows, ", 1fr)") } }, { children: (0, createCompositions_1.createCompositions)({
                                     valueType: CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE,
-                                    queryPath: CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA,
+                                    queryPath: queryPath,
                                     limit: displayCounts,
                                     queryData: queryData,
                                     compositions: orderedCompositions,
@@ -253,16 +250,12 @@ var S_ContentsListWrapper = styled_components_1.default.div(templateObject_4 ||
     var ccbInset = _a.ccbInset;
     return ccbInset.top;
 });
-function removeFirstSegment(path) {
-    var segments = path.split('/');
-    return segments.slice(1).join('/');
-}
 function getStandardComposition(compositions, valueType) {
     if (valueType === 'DATA') {
-        return compositions.find(function (composition) { return composition.isDefault; });
+        return compositions.find(function (composition) { return !composition.ccbManualItemUuid; });
     }
     // NOTE: 일단 디폴트가 아닌 첫번째를 반환하지만 경우에따라 가장 cols/width가 큰 것을 반환하도록 변경할 수 있음
-    return compositions.find(function (composition) { return !composition.isDefault; });
+    return compositions.find(function (composition) { return !!composition.ccbManualItemUuid; });
 }
 function getCompositionMinValue(composition, device) {
     var minCellWidth = 10;

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

@@ -35,7 +35,7 @@ function parseStylePropertyStyles(key, value) {
     return undefined;
 }
 function getColumnsPropStyleValues(value, rows) {
-    return (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    grid-template-columns: repeat(", ", 1fr);\n    grid-template-rows: repeat(", ", min-content);\n  "], ["\n    grid-template-columns: repeat(", ", 1fr);\n    grid-template-rows: repeat(", ", min-content);\n  "])), value, rows);
+    return (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    grid-template-columns: repeat(", ", 1fr);\n    grid-template-rows: repeat(", ", 1fr);\n  "], ["\n    grid-template-columns: repeat(", ", 1fr);\n    grid-template-rows: repeat(", ", 1fr);\n  "])), value, rows);
 }
 function parseContentPropertyStyles(key, value, rows, device) {
     if (device === 'DESKTOP') {

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

@@ -72,7 +72,7 @@ size) {
 function SlideBanner(props) {
     var _a;
     var _b = (0, react_1.useContext)(dynamicLayoutContext_1.dynamicLayoutContext), device = _b.device, mode = _b.mode, queryData = _b.queryData;
-    var index = props.index, _c = props.CB_CONTENT_PROP_SLIDEBANNER, CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS, CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE, CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA, CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS, CB_STYLE_PROP_SLIDEBANNERDESIGN = props.CB_STYLE_PROP_SLIDEBANNERDESIGN, CB_STYLE_PROP_SLIDEBANNERPAGINATION = props.CB_STYLE_PROP_SLIDEBANNERPAGINATION, CB_STYLE_PROP_SLIDEBANNERBUTTON = props.CB_STYLE_PROP_SLIDEBANNERBUTTON, CB_STYLE_PROP_SLIDEBANNERPLAYBACKMETHOD = props.CB_STYLE_PROP_SLIDEBANNERPLAYBACKMETHOD, CB_STYLE_PROP_SLIDEBANNERPROGRESSBAR = props.CB_STYLE_PROP_SLIDEBANNERPROGRESSBAR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, CB_STYLE_PROP_BGMEDIA = props.CB_STYLE_PROP_BGMEDIA, CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE = props.CB_EFFECT_PROP_SLIDEBANNER.CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE;
+    var index = props.index, _c = props.CB_CONTENT_PROP_SLIDEBANNER, CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS, CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE, CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA, CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATASORTING = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATASORTING, CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATAOFFSET = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATAOFFSET, CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS = _c.CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS, CB_STYLE_PROP_SLIDEBANNERDESIGN = props.CB_STYLE_PROP_SLIDEBANNERDESIGN, CB_STYLE_PROP_SLIDEBANNERPAGINATION = props.CB_STYLE_PROP_SLIDEBANNERPAGINATION, CB_STYLE_PROP_SLIDEBANNERBUTTON = props.CB_STYLE_PROP_SLIDEBANNERBUTTON, CB_STYLE_PROP_SLIDEBANNERPLAYBACKMETHOD = props.CB_STYLE_PROP_SLIDEBANNERPLAYBACKMETHOD, CB_STYLE_PROP_SLIDEBANNERPROGRESSBAR = props.CB_STYLE_PROP_SLIDEBANNERPROGRESSBAR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM, CB_STYLE_PROP_BGMEDIA = props.CB_STYLE_PROP_BGMEDIA, CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE = props.CB_EFFECT_PROP_SLIDEBANNER.CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE;
     var compositions = props.compositions;
     var CB_STYLE_PROP_SLIDEBANNER = __assign(__assign(__assign(__assign(__assign({}, CB_STYLE_PROP_SLIDEBANNERDESIGN), CB_STYLE_PROP_SLIDEBANNERPAGINATION), CB_STYLE_PROP_SLIDEBANNERBUTTON), CB_STYLE_PROP_SLIDEBANNERPLAYBACKMETHOD), CB_STYLE_PROP_SLIDEBANNERPROGRESSBAR);
     var autoPlayEnabled = device === 'DESKTOP'
@@ -146,19 +146,21 @@ function SlideBanner(props) {
     var isMobile = device === 'MOBILE';
     var isBgMedia = getIsBgMedia(isMobile, CB_STYLE_PROP_BGMEDIA);
     var mediaType = getMediaType(isMobile, CB_STYLE_PROP_BGMEDIA);
-    var orderedCompositions = __spreadArray([], CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS, true).filter(function (item) { return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; }); })
-        .sort(function (a, b) { return a.order - b.order; })
-        .map(function (item) {
-        return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; });
-    });
+    var queryPath = "".concat(CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA, "/").concat(CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATASORTING, "/").concat(CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATAOFFSET);
+    var orderedCompositions = CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE === 'VALUE'
+        ? __spreadArray([], CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS, true).filter(function (item) { return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; }); })
+            .sort(function (a, b) { return a.order - b.order; })
+            .map(function (item) {
+            return compositions.find(function (comp) { return comp.ccbManualItemUuid === item.uuid; });
+        })
+        : compositions.filter(function (comp) { return !comp.ccbManualItemUuid; });
     var isEditModeAndHidden = style.visibility === 'hidden' && mode === 'EDIT';
     if (mode === 'EDIT') {
         style.visibility = 'visible';
     }
-    var isHidden = style.visibility === 'hidden';
     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.jsxs)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: [Object.entries(componentGroups).map(function (_a) {
                         var position = _a[0], groupComponents = _a[1];
-                        return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-slidebanner-button-group ccb-elements ".concat(position, " ").concat(isHidden ? ' hidden' : ''), ref: function (el) {
+                        return ((0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-slidebanner-button-group ccb-elements ".concat(position), ref: function (el) {
                                 if (el) {
                                     positionRefs.current[position] = el;
                                 }
@@ -168,11 +170,11 @@ function SlideBanner(props) {
                             }, style: __assign(__assign({}, getPositionStyle(position, ccbInset, 'GROUP', 'GROUP', 'GROUP')), { zIndex: 3, position: 'absolute' }) }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: "cb-slidebanner-button-layout-box", style: getComponentGroupLayout(groupComponents, position) }, { children: groupComponents.map(function (component) {
                                     return renderElements(component, getPositionStyle(position, ccbInset, component.designType, component.size, component.type));
                                 }) })) }), position));
-                    }), (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box ".concat(isHidden ? 'hidden' : ''), normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-slidebanner-layout-box", ref: layoutRef }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-slidebanner-wrapper", ccbInset: ccbInset, customStyle: isHovered
+                    }), (0, jsx_runtime_1.jsxs)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box ccb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), editModeStyle), { overflow: 'hidden' }), hoverStyle: __assign(__assign({}, hoverStyle), { overflow: 'hidden' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: [(0, jsx_runtime_1.jsx)(S_CustomBackgroundWrapper, __assign({ ref: backgroundRef, style: __assign(__assign({}, effect), { background: style.background }) }, { children: isBgMedia && CB_STYLE_PROP_BGMEDIA && ((0, jsx_runtime_1.jsx)(CustomSectionBackgroundMedia_1.CustomSectionBackgroundMedia, { specs: CB_STYLE_PROP_BGMEDIA, componentStyle: style, playerId: index, mediaType: mediaType || 'NONE', device: isMobile ? 'MOBILE' : 'DESKTOP', backgroundRef: backgroundRef })) })), (0, jsx_runtime_1.jsx)(S_Overlay, { style: overlayStyle }), orderedCompositions.length > 0 ? ((0, jsx_runtime_1.jsx)(S_SwiperLayout, __assign({ className: "cb-slidebanner-layout-box", ref: layoutRef }, { children: (0, jsx_runtime_1.jsx)(S_SwiperWrapper, __assign({ className: "cb-slidebanner-wrapper", ccbInset: ccbInset, customStyle: isHovered
                                         ? slideBannerHoverStyle === null || slideBannerHoverStyle === void 0 ? void 0 : slideBannerHoverStyle.customStyle
                                         : slideBannerNormalStyle === null || slideBannerNormalStyle === void 0 ? void 0 : slideBannerNormalStyle.customStyle }, { children: (0, jsx_runtime_1.jsx)(SlideBannerCore_1.default, __assign({ ref: swiperRef, className: "cb-slidebanner", onSwiper: onSwiper, onSlideChangeTransitionEnd: onSlideChangeTransitionEnd, onAutoplayTimeLeft: onAutoplayTimeLeft, slidesPerView: 1, styles: isHovered ? slideBannerHoverStyle : slideBannerNormalStyle, effect: CB_EFFECT_PROP_SLIDEBANNER_SPEC_TRANSITIONTYPE.toLowerCase() }, { children: (0, createCompositions_1.createCompositions)({
                                             valueType: CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE,
-                                            queryPath: CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA,
+                                            queryPath: queryPath,
                                             limit: CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS,
                                             queryData: queryData,
                                             compositions: orderedCompositions,

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

@@ -46,7 +46,7 @@ export type CB_CONTENT_PROP_CONTENTSCAROUSEL = {
     CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_VALUETYPE: CCB_VALUE_TYPE;
     CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_CONNECTDATA: STRING_PLAIN;
     CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATASORTING: STRING_PLAIN;
-    CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_OFFSET: NUMBER_INTEGER;
+    CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DATAOFFSET: NUMBER_INTEGER;
     CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_MANUALITEMS: ManualItem[];
     CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_ITEMCOUNTS: NUMBER_INTEGER;
     CB_CONTENT_PROP_CONTENTSCAROUSEL_SPEC_DISPLAYCOUNTS: NUMBER_INTEGER;
@@ -56,7 +56,7 @@ export type CB_CONTENT_PROP_SLIDEBANNER = {
     CB_CONTENT_PROP_SLIDEBANNER_SPEC_VALUETYPE: CCB_VALUE_TYPE;
     CB_CONTENT_PROP_SLIDEBANNER_SPEC_CONNECTDATA: STRING_PLAIN;
     CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATASORTING: STRING_PLAIN;
-    CB_CONTENT_PROP_SLIDEBANNER_SPEC_OFFSET: NUMBER_INTEGER;
+    CB_CONTENT_PROP_SLIDEBANNER_SPEC_DATAOFFSET: NUMBER_INTEGER;
     CB_CONTENT_PROP_SLIDEBANNER_SPEC_MANUALITEMS: ManualItem[];
     CB_CONTENT_PROP_SLIDEBANNER_SPEC_ITEMCOUNTS: NUMBER_INTEGER;
 };
@@ -65,7 +65,7 @@ export type CB_CONTENT_PROP_CONTENTSLIST = {
     CB_CONTENT_PROP_CONTENTSLIST_SPEC_CONNECTDATA: STRING_PLAIN;
     CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATASORTING: STRING_PLAIN;
     CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATAFILTER: STRING_PLAIN;
-    CB_CONTENT_PROP_CONTENTSLIST_SPEC_OFFSET: NUMBER_INTEGER;
+    CB_CONTENT_PROP_CONTENTSLIST_SPEC_DATAOFFSET: NUMBER_INTEGER;
     CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS: ManualItem[];
     CB_CONTENT_PROP_CONTENTSLIST_SPEC_ITEMCOUNTS: NUMBER_INTEGER;
     CB_CONTENT_PROP_CONTENTSLIST_SPEC_DISPLAYCOUNTS: NUMBER_INTEGER;

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

@@ -86,7 +86,7 @@ function parsePropPlacement(props, id, cbCode, zOrders, heightFitContent, cbRest
 var AUTO_RESIZE_CODES = ['none'];
 function getResizeHandles(heightFitContent) {
     if (heightFitContent) {
-        return ['nw', 'e', 'n', 'ne', 's', 'se', 'sw', 'w'];
+        return ['e', 'w'];
     }
     return ['nw', 'e', 'n', 'ne', 's', 'se', 'sw', 'w'];
 }

package/package.json

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

package/release-note.md

@@ -1,7 +1,7 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v2.2.285]
+## [v2.2.280]
 ## daily|https://design.storybook.publ.biz/
 
 ### 업데이트 사항
 
-* [PUB-1402] MobileTabBar에 autoScrollMode 추가
+* 컬러키 업데이트

package/dist/src/common/assets/icons/fill/Plugin.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import type IconType from '../IconType';
-declare const Plugin: ({ color, size, ...rest }: IconType) => JSX.Element;
-export default Plugin;

package/dist/src/common/assets/icons/fill/Plugin.js

@@ -1,30 +0,0 @@
-"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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var Plugin = function (_a) {
-    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
-    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsxs)("g", __assign({ fill: "none" }, { children: [(0, jsx_runtime_1.jsx)("path", { fill: color, fillRule: "evenodd", d: "M6.7686,9.5034 C7.0246,9.5034 7.2806,9.6014 7.4756,9.7964 L14.2036,16.5244 C14.5946,16.9144 14.5946,17.5484 14.2036,17.9384 L11.8896,20.2524 C11.1086,21.0334 10.0846,21.4244 9.0616,21.4244 C8.0376,21.4244 7.0136,21.0334 6.2326,20.2524 L3.7476,17.7674 C2.1856,16.2054 2.1856,13.6724 3.7476,12.1104 L6.0616,9.7964 C6.2566,9.6014 6.5126,9.5034 6.7686,9.5034 Z M6.7686,11.9174 L5.1616,13.5244 C4.3816,14.3044 4.3816,15.5734 5.1616,16.3524 L7.6466,18.8384 C8.0246,19.2164 8.5266,19.4244 9.0616,19.4244 C9.5956,19.4244 10.0976,19.2164 10.4756,18.8384 L12.0826,17.2314 L6.7686,11.9174 Z M14.9387,2.576 C15.9627,2.576 16.9857,2.967 17.7667,3.748 L20.2527,6.233 C21.8147,7.795 21.8147,10.328 20.2527,11.89 L17.9387,14.204 C17.7437,14.399 17.4877,14.497 17.2317,14.497 C16.9757,14.497 16.7197,14.399 16.5247,14.204 L9.7967,7.476 C9.4057,7.085 9.4057,6.452 9.7967,6.062 L12.1107,3.748 C12.8917,2.967 13.9147,2.576 14.9387,2.576 Z M14.9387,4.576 C14.4047,4.576 13.9027,4.784 13.5247,5.162 L11.9177,6.769 L17.2317,12.082 L18.8377,10.476 C19.6177,9.696 19.6177,8.427 18.8377,7.647 L16.3527,5.162 C15.9747,4.784 15.4727,4.576 14.9387,4.576 Z" }), (0, jsx_runtime_1.jsx)("path", { stroke: color, strokeLinecap: "round", strokeWidth: "2", d: "M5.2577,18.7423 L2.9147,21.0853 M18.7423,5.2577 L21.0853,2.9147 M10.1817,10.62 L8.7747,12.027 M13.38,13.8183 L11.973,15.2253" })] })) })));
-};
-exports.default = Plugin;

package/dist/src/common/assets/icons/line/Plugin.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import type IconType from '../IconType';
-declare const Plugin: ({ color, size, ...rest }: IconType) => JSX.Element;
-export default Plugin;

package/dist/src/common/assets/icons/line/Plugin.js

@@ -1,30 +0,0 @@
-"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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var Plugin = function (_a) {
-    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
-    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest, { children: (0, jsx_runtime_1.jsxs)("g", __assign({ fill: "none" }, { children: [(0, jsx_runtime_1.jsx)("path", { fill: color, fillRule: "evenodd", d: "M6.7686,9.5034 C7.0246,9.5034 7.2806,9.6014 7.4756,9.7964 L14.2036,16.5244 C14.5946,16.9144 14.5946,17.5484 14.2036,17.9384 L11.8896,20.2524 C11.1086,21.0334 10.0846,21.4244 9.0616,21.4244 C8.0376,21.4244 7.0136,21.0334 6.2326,20.2524 L3.7476,17.7674 C2.1856,16.2054 2.1856,13.6724 3.7476,12.1104 L6.0616,9.7964 C6.2566,9.6014 6.5126,9.5034 6.7686,9.5034 Z M6.7686,11.2104 L4.8086,13.1704 C4.3366,13.6434 4.0756,14.2704 4.0756,14.9384 C4.0756,15.6064 4.3366,16.2344 4.8086,16.7064 L7.2936,19.1914 C7.7656,19.6644 8.3936,19.9244 9.0616,19.9244 C9.7296,19.9244 10.3566,19.6644 10.8296,19.1914 L12.7896,17.2314 L6.7686,11.2104 Z M14.9386,2.576 C15.9626,2.576 16.9856,2.967 17.7666,3.748 L20.2526,6.233 C21.8146,7.795 21.8146,10.328 20.2526,11.89 L17.9386,14.204 C17.7436,14.399 17.4876,14.497 17.2316,14.497 C16.9756,14.497 16.7196,14.399 16.5246,14.204 L9.7966,7.476 C9.4056,7.085 9.4056,6.452 9.7966,6.062 L12.1106,3.748 C12.8916,2.967 13.9146,2.576 14.9386,2.576 Z M14.9386,4.076 C14.2706,4.076 13.6426,4.336 13.1706,4.808 L11.2106,6.769 L17.2316,12.79 L19.1916,10.829 C19.6636,10.357 19.9236,9.729 19.9236,9.061 C19.9236,8.394 19.6636,7.766 19.1916,7.294 L16.7066,4.808 C16.2346,4.336 15.6066,4.076 14.9386,4.076 Z" }), (0, jsx_runtime_1.jsx)("path", { stroke: color, strokeLinecap: "round", strokeWidth: "1.5", d: "M5.2577,18.7423 L2.9147,21.0853 M18.7423,5.2577 L21.0853,2.9147 M10.1817,10.62 L8.7747,12.027 M13.38,13.8183 L11.973,15.2253" })] })) })));
-};
-exports.default = Plugin;