pds-dev-kit-web-test 2.7.103 → 2.7.105
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -265,7 +265,7 @@ var GridAutoRowEditor = (0, react_1.forwardRef)(function CustomSection(props, re
|
|
265
265
|
backgroundColor: '#e8e1e189',
|
266
266
|
border: '1px solid #6b666688'
|
267
267
|
}, "data-row": rIdx + 1, "data-col": cIdx + 1 }, "bg-grid-item-".concat(rIdx + 1, "-").concat(cIdx + 1))); }) }), "bg-grid-row-".concat(rIdx + 1)));
|
268
|
-
}), pedigree.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(groupUtils_1.default, { block: child, rowHeight: rowHeight, layoutItems: layouts[device === 'DESKTOP' ? 'lg' : 'sm'], cbs: props.componentBlocks, device: device }, child.blockId)); })] })) })) })) }) })) }));
|
268
|
+
}), pedigree.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(groupUtils_1.default, { block: child, rowHeight: rowHeight, layoutItems: layouts[device === 'DESKTOP' ? 'lg' : 'sm'], cbs: props.componentBlocks, device: device, selectedRows: selectedRows }, child.blockId)); })] })) })) })) }) })) }));
|
269
269
|
});
|
270
270
|
function GroupBlockRender(_a) {
|
271
271
|
var block = _a.block, layouts = _a.layouts, pedigree = _a.pedigree, isEditing = _a.isEditing, isPinned = _a.isPinned, componentBlocks = _a.componentBlocks, onTogglePinned = _a.onTogglePinned, onDoubleClick = _a.onDoubleClick, onDoubleClickOutside = _a.onDoubleClickOutside;
|
@@ -4,12 +4,13 @@ import type { Device } from '../sections/CustomSection/util/types';
|
|
4
4
|
import type { LayoutItem } from 'publ-echo/dist/lib';
|
5
5
|
import type { Block } from 'publ-echo/dist/lib/GridLayoutEditor/group';
|
6
6
|
export declare function findAllChildrenCbIds(block: Block, targetGroupId: string): number[];
|
7
|
-
export default function RenderPedigreeRecursively({ block, layoutItems, cbs, parentGroupArea, rowHeight, device }: {
|
7
|
+
export default function RenderPedigreeRecursively({ block, layoutItems, cbs, parentGroupArea, rowHeight, device, selectedRows }: {
|
8
8
|
block: Block;
|
9
9
|
layoutItems: LayoutItem[];
|
10
10
|
cbs: ComponentBlock[];
|
11
11
|
rowHeight: number;
|
12
12
|
device: Device;
|
13
|
+
selectedRows: number[];
|
13
14
|
parentGroupArea?: {
|
14
15
|
rowStart: number;
|
15
16
|
colStart: number;
|
@@ -78,41 +78,34 @@ function findAllChildrenCbIds(block, targetGroupId) {
|
|
78
78
|
}
|
79
79
|
exports.findAllChildrenCbIds = findAllChildrenCbIds;
|
80
80
|
function RenderPedigreeRecursively(_a) {
|
81
|
-
var block = _a.block, layoutItems = _a.layoutItems, cbs = _a.cbs, parentGroupArea = _a.parentGroupArea, rowHeight = _a.rowHeight, device = _a.device;
|
81
|
+
var block = _a.block, layoutItems = _a.layoutItems, cbs = _a.cbs, parentGroupArea = _a.parentGroupArea, rowHeight = _a.rowHeight, device = _a.device, selectedRows = _a.selectedRows;
|
82
82
|
var type = block.type;
|
83
83
|
if (type === 'GROUP_BLOCK') {
|
84
84
|
var childrenIds = findAllChildrenCbIds(block, block.blockId).map(function (i) { return i.toString(); });
|
85
|
-
var
|
86
|
-
if (!
|
85
|
+
var bounding_1 = (0, renderHelpers_1.getBoundingArea)(layoutItems, childrenIds);
|
86
|
+
if (!bounding_1) {
|
87
87
|
return (0, jsx_runtime_1.jsx)("div", { children: "GROUP: NO BOUNDING AREA" });
|
88
88
|
}
|
89
89
|
var gridArea_1 = getGridAreaFromGroup({
|
90
|
-
x:
|
91
|
-
y:
|
92
|
-
cols:
|
93
|
-
rows:
|
90
|
+
x: bounding_1.x,
|
91
|
+
y: bounding_1.y,
|
92
|
+
cols: bounding_1.w,
|
93
|
+
rows: bounding_1.h
|
94
94
|
});
|
95
95
|
var relativeGridArea_1 = parentGroupArea
|
96
96
|
? calculateRelativeGridArea(gridArea_1, parentGroupArea)
|
97
97
|
: gridArea_1;
|
98
|
-
|
98
|
+
// 그룹의 시작 행을 기준으로 상대적인 selectedRows 계산
|
99
|
+
var relativeSelectedRows_1 = selectedRows
|
100
|
+
.map(function (row) { return row - gridArea_1.rowStart + 1; })
|
101
|
+
.filter(function (row) { return row >= 0 && row <= bounding_1.h; });
|
102
|
+
return ((0, jsx_runtime_1.jsx)(S_GroupItem, __assign({ cols: bounding_1.w, sectionRow: bounding_1.h, rowHeight: rowHeight, selectedRows: relativeSelectedRows_1, style: {
|
99
103
|
gridArea: gridAreaObjToString(relativeGridArea_1),
|
100
104
|
display: 'grid',
|
101
105
|
zIndex: device === 'DESKTOP'
|
102
106
|
? block.zOrderDesktopInternal
|
103
107
|
: block.zOrderMobileInternal
|
104
|
-
} }, { children:
|
105
|
-
position: 'absolute',
|
106
|
-
top: 4,
|
107
|
-
left: 4,
|
108
|
-
background: 'rgba(0,0,0,0.6)',
|
109
|
-
color: '#fff',
|
110
|
-
padding: '2px 6px',
|
111
|
-
borderRadius: '4px',
|
112
|
-
fontSize: '12px',
|
113
|
-
zIndex: 1,
|
114
|
-
pointerEvents: 'none'
|
115
|
-
} }, { children: block.blockId })), block.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(RenderPedigreeRecursively, { rowHeight: rowHeight, block: child, layoutItems: layoutItems, cbs: cbs, parentGroupArea: gridArea_1, device: device }, child.blockId)); })] })));
|
108
|
+
} }, { children: block.children.map(function (child) { return ((0, jsx_runtime_1.jsx)(RenderPedigreeRecursively, { rowHeight: rowHeight, block: child, layoutItems: layoutItems, cbs: cbs, parentGroupArea: gridArea_1, device: device, selectedRows: relativeSelectedRows_1 }, child.blockId)); }) })));
|
116
109
|
}
|
117
110
|
// default: TYPE === 'COMPONENT_BLOCK'
|
118
111
|
var cbIndex = cbs.findIndex(function (c) { return c.blockId === block.blockId; });
|
@@ -201,8 +194,7 @@ function calculateRelativeGridArea(componentArea, parentArea) {
|
|
201
194
|
colEnd: componentArea.colEnd - parentArea.colStart + 1
|
202
195
|
};
|
203
196
|
}
|
204
|
-
var
|
205
|
-
var S_GroupItem = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"], ["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"])), function (props) { return props.cols; }, function (props) {
|
197
|
+
var S_GroupItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"], ["\n box-shadow: 0 0 0 3px blue;\n gap: 10px;\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: ", ";\n position: relative; /* \uBC30\uC5F4\uC744 \uACF5\uBC31\uC73C\uB85C \uAD6C\uBD84\uB41C \uBB38\uC790\uC5F4\uB85C \uD569\uCE69\uB2C8\uB2E4. */\n"])), function (props) { return props.cols; }, function (props) {
|
206
198
|
// // 전체 행 개수만큼 배열을 생성하여 각 행의 CSS 값을 정의합니다.
|
207
199
|
return Array.from({ length: props.sectionRow })
|
208
200
|
.map(function (_, index) {
|
@@ -214,4 +206,4 @@ var S_GroupItem = styled_components_1.default.div(templateObject_2 || (templateO
|
|
214
206
|
)
|
215
207
|
.join(' ');
|
216
208
|
});
|
217
|
-
var templateObject_1
|
209
|
+
var templateObject_1;
|