pds-dev-kit-web-test 2.7.253 → 2.7.254

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

@@ -225,7 +225,7 @@ var Composition = (0, react_1.forwardRef)(function CustomSection(props, ref) {
                                 // fontSize: `${baseFontSize}px`
                             } }, { children: (_e = props.componentBlocks) === null || _e === void 0 ? void 0 : _e.map(function (cb, index) {
                                 var _a;
-                                return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(FlexGridItemForCCB_1.default, { cb: cb, index: index, device: device, rowHeight: rowHeight, zIndex: (_a = zOrders === null || zOrders === void 0 ? void 0 : zOrders[device === 'DESKTOP' ? 'desktop' : 'mobile'][cb.id]) !== null && _a !== void 0 ? _a : 0 }) }, cb.id));
+                                return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { children: (0, jsx_runtime_1.jsx)(FlexGridItemForCCB_1.default, { cb: cb, index: index, device: device, rowHeight: rowHeight, zIndex: (_a = zOrders === null || zOrders === void 0 ? void 0 : zOrders[device === 'DESKTOP' ? 'desktop' : 'mobile'][cb.id]) !== null && _a !== void 0 ? _a : 0, maxCols: cols }) }, cb.id));
                             }) })) })) })) })) })) }));
 });
 var MOCK_BORDER = {
@@ -285,7 +285,7 @@ var MOCK_SHADOW = {
     '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-auto-rows: minmax(", ", auto); */\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-auto-rows: minmax(", ", auto); */\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 "".concat(props.rowHeight, "px"); }, function (props) { return props.cols; }, function (props) { return props.sectionRow; }, function (props) { return "".concat(props.rowHeight, "px"); });
+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);
 function getDefensiveFontSize(device, width) {

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

@@ -7,8 +7,8 @@ type Props = {
     device: Device;
     rowHeight: number;
     zIndex: number;
-    showPinned?: boolean;
+    maxCols: number;
     style?: React.CSSProperties;
 };
-declare function FlexGridItem({ cb, index, device, rowHeight, zIndex, showPinned, style }: Props): JSX.Element;
+declare function FlexGridItem({ cb, index, device, rowHeight, zIndex, style, maxCols }: Props): JSX.Element;
 export default FlexGridItem;

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

@@ -19,20 +19,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
+require("react");
 var styled_components_1 = __importDefault(require("styled-components"));
 var ComponentBlockMatcher_1 = __importDefault(require("./ComponentBlockMatcher"));
 var gap = 10;
 function FlexGridItem(_a) {
-    var cb = _a.cb, index = _a.index, device = _a.device, rowHeight = _a.rowHeight, zIndex = _a.zIndex, showPinned = _a.showPinned, style = _a.style;
+    var cb = _a.cb, index = _a.index, device = _a.device, rowHeight = _a.rowHeight, zIndex = _a.zIndex, style = _a.style, maxCols = _a.maxCols;
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     var defaultHeight = getMaxHeight(cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, device, rowHeight);
-    var gridArea = getGridAreaFromCB(cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, device);
-    var _b = (0, react_1.useState)(false), isPinned = _b[0], setIsPinned = _b[1];
-    return ((0, jsx_runtime_1.jsxs)(GridItem, __assign({ style: __assign({ zIndex: zIndex, gridArea: gridArea, position: 'relative', maxHeight: isPinned ? defaultHeight : 'none' }, style) }, { children: [showPinned && ((0, jsx_runtime_1.jsx)(S_Pinned, { children: isPinned ? ((0, jsx_runtime_1.jsx)("button", __assign({ type: "button", onClick: function () { return setIsPinned(false); } }, { children: "H\uACE0\uC815\uB428 \uD83D\uDCCC" }))) : ((0, jsx_runtime_1.jsx)("button", __assign({ type: "button", onClick: function () { return setIsPinned(true); } }, { children: "H\uB298\uC5B4\uB0A8 \uD83E\uDEB1" }))) })), (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { rowHeight: rowHeight, cbProps: cb, device: device, index: index })] })));
+    var gridArea = getGridAreaFromCB(cb.jsonProperties.data.CB_PLACEMENT_PROP_PLACEMENT, device, maxCols);
+    return ((0, jsx_runtime_1.jsx)(GridItem, __assign({ style: __assign({ zIndex: zIndex, gridArea: gridArea, position: 'relative', maxHeight: 'none' }, style) }, { children: (0, jsx_runtime_1.jsx)(ComponentBlockMatcher_1.default, { rowHeight: rowHeight, cbProps: cb, device: device, index: index }) })));
 }
-var S_Pinned = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  pointer-events: auto;\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: 9999999;\n"], ["\n  pointer-events: auto;\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: 9999999;\n"])));
-var GridItem = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: auto;\n  word-break: break-word;\n"], ["\n  height: auto;\n  word-break: break-word;\n"])));
+var GridItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: auto;\n  word-break: break-word;\n"], ["\n  height: auto;\n  word-break: break-word;\n"])));
 function getMaxHeight(props, device, rowHeight) {
     if (device === 'DESKTOP') {
         var CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS = props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS;
@@ -44,7 +42,7 @@ function getMaxHeight(props, device, rowHeight) {
     var height = rowsMobile * rowHeight + (rowsMobile - 1) * gap;
     return height;
 }
-function getGridAreaFromCB(props, device) {
+function getGridAreaFromCB(props, device, maxCols) {
     var CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX = props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX, CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY = props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY, cols = props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS, rows = props.CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS;
     if (device === 'DESKTOP') {
         var colStart_1 = CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX + 1;
@@ -52,7 +50,7 @@ function getGridAreaFromCB(props, device) {
         var rowEnd_1 = rows + rowStart_1;
         var colEnd_1 = cols + colStart_1;
         // <grid-row-start> / <grid-column-start> / <grid-row-end> / <grid-column-end>;
-        return "".concat(rowStart_1, " / ").concat(colStart_1, " / ").concat(rowEnd_1, " / ").concat(colEnd_1);
+        return "".concat(rowStart_1, " / ").concat(colStart_1, " / ").concat(rowEnd_1, " / ").concat(Math.min(colEnd_1, maxCols));
     }
     var startXMobile = props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX:MOBILE'];
     var startYMobile = props['CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY:MOBILE'];
@@ -62,7 +60,7 @@ function getGridAreaFromCB(props, device) {
     var rowStart = startYMobile + 1;
     var rowEnd = rowsMobile + rowStart;
     var colEnd = colsMobile + colStart;
-    return "".concat(rowStart, " / ").concat(colStart, " / ").concat(rowEnd, " / ").concat(colEnd);
+    return "".concat(rowStart, " / ").concat(colStart, " / ").concat(rowEnd, " / ").concat(Math.min(colEnd, maxCols));
 }
 exports.default = FlexGridItem;
-var templateObject_1, templateObject_2;
+var templateObject_1;

package/dist/src/sub/DynamicLayout/mock_contentsList.js

@@ -3261,7 +3261,7 @@ exports.SAMPLE_LIST_CB = {
                             },
                             CB_PLACEMENT_PROP_PLACEMENT: {
                                 CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS: 2,
-                                'CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE': 8,
+                                'CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE': 12,
                                 CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS: 2,
                                 'CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS:MOBILE': 5,
                                 CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX: 0,

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

@@ -79,9 +79,6 @@ function ContentsList(props) {
     var totalPage = Math.ceil((CB_CONTENT_PROP_CONTENTSLIST_SPEC_VALUETYPE === 'DATA' && queryDataValue
         ? queryDataValue === null || queryDataValue === void 0 ? void 0 : queryDataValue.length
         : CB_CONTENT_PROP_CONTENTSLIST_SPEC_MANUALITEMS.length) / displayCounts);
-    console.log('columns', numberOfColumns);
-    console.log('displayCounts', displayCounts);
-    console.log('totalPage', totalPage);
     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 contentPropCss = (0, contentsListUtils_1.parseGridContentProp)({

package/package.json

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