publ-echo-test 0.0.59 → 0.0.61
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.
- package/dist/lib/Draggable/DraggableCore.js +0 -1
- package/dist/lib/Draggable/types.d.ts +0 -1
- package/dist/lib/GridItem/GridItem.js +1 -0
- package/dist/lib/GridItem/GroupItem.js +5 -11
- package/dist/lib/GridItem/types.d.ts +0 -1
- package/dist/lib/GridLayoutEditor/ReactGridLayout.js +49 -21
- package/dist/lib/GridLayoutEditor/group.d.ts +1 -0
- package/dist/lib/GridLayoutEditor/group.js +39 -24
- package/dist/lib/GridLayoutEditor/types.d.ts +6 -3
- package/package.json +1 -1
@@ -260,7 +260,6 @@ var DraggableCore = function (_a) {
|
|
260
260
|
onMouseDown: handleMouseDown,
|
261
261
|
onMouseUp: handleMouseUp,
|
262
262
|
onTouchEnd: handleTouchEnd,
|
263
|
-
onDoubleClick: props.onDoubleClick,
|
264
263
|
ref: (_b = props.nodeRef) !== null && _b !== void 0 ? _b : draggableCoreRef,
|
265
264
|
});
|
266
265
|
};
|
@@ -23,7 +23,6 @@ export type DraggableCoreDefaultProps = {
|
|
23
23
|
onDrag?: DraggableEventHandler | Function;
|
24
24
|
onStop?: DraggableEventHandler | Function;
|
25
25
|
onMouseDown?: (e: MouseEvent) => void;
|
26
|
-
onDoubleClick?: any;
|
27
26
|
scale?: number;
|
28
27
|
cancel?: string;
|
29
28
|
children: ReactElement<any>;
|
@@ -248,6 +248,7 @@ var GridItem = function (_a) {
|
|
248
248
|
var rowHeightNumber = resolveRowHeight(rowHeight, colWidth);
|
249
249
|
var bottomBoundary = offsetParent.clientHeight -
|
250
250
|
calcGridItemWHPx(h, rowHeightNumber, margin[1]);
|
251
|
+
console.log('bb', bottomBoundary);
|
251
252
|
top = clamp(top, 0, bottomBoundary);
|
252
253
|
var rightBoundary = containerWidth - calcGridItemWHPx(w, colWidth, margin[0]);
|
253
254
|
left = clamp(left, 0, rightBoundary);
|
@@ -30,7 +30,7 @@ import { Resizable } from "../Resizable";
|
|
30
30
|
var GroupItem = function (_a) {
|
31
31
|
var _b;
|
32
32
|
var children = _a.children, props = __rest(_a, ["children"]);
|
33
|
-
var resizeHandle = props.resizeHandle, cols = props.cols, isDraggable = props.isDraggable, _c = props.transformScale, transformScale = _c === void 0 ? 1 : _c, isResizable = props.isResizable, useCSSTransforms = props.useCSSTransforms, className = props.className, _d = props.cancel, cancel = _d === void 0 ? "" : _d, _e = props.handle, handle = _e === void 0 ? "" : _e, x = props.x, y = props.y, z = props.z, w = props.w, h = props.h, _f = props.minH, minH = _f === void 0 ? 1 : _f, _g = props.minW, minW = _g === void 0 ? 1 : _g, _h = props.maxH, maxH = _h === void 0 ? Infinity : _h, _j = props.maxW, maxW = _j === void 0 ? Infinity : _j, i = props.i, _k = props.isHiddenVisibility, isHiddenVisibility = _k === void 0 ? false : _k, containerWidth = props.containerWidth, customColWidth = props.customColWidth, autoResize = props.autoResize
|
33
|
+
var resizeHandle = props.resizeHandle, cols = props.cols, isDraggable = props.isDraggable, _c = props.transformScale, transformScale = _c === void 0 ? 1 : _c, isResizable = props.isResizable, useCSSTransforms = props.useCSSTransforms, className = props.className, _d = props.cancel, cancel = _d === void 0 ? "" : _d, _e = props.handle, handle = _e === void 0 ? "" : _e, x = props.x, y = props.y, z = props.z, w = props.w, h = props.h, _f = props.minH, minH = _f === void 0 ? 1 : _f, _g = props.minW, minW = _g === void 0 ? 1 : _g, _h = props.maxH, maxH = _h === void 0 ? Infinity : _h, _j = props.maxW, maxW = _j === void 0 ? Infinity : _j, i = props.i, _k = props.isHiddenVisibility, isHiddenVisibility = _k === void 0 ? false : _k, containerWidth = props.containerWidth, customColWidth = props.customColWidth, autoResize = props.autoResize;
|
34
34
|
var _l = useState(), resizing = _l[0], setResizing = _l[1];
|
35
35
|
var _m = useState(), dragging = _m[0], setDragging = _m[1];
|
36
36
|
var _o = useState(), dragStart = _o[0], setDragStart = _o[1];
|
@@ -135,9 +135,6 @@ var GroupItem = function (_a) {
|
|
135
135
|
// });
|
136
136
|
// }
|
137
137
|
// };
|
138
|
-
var handleDoubleClick = function () {
|
139
|
-
(props === null || props === void 0 ? void 0 : props.onDoubleClick) && props.onDoubleClick(props.i);
|
140
|
-
};
|
141
138
|
var getPositionParams = function (prop) {
|
142
139
|
if (prop === void 0) { prop = props; }
|
143
140
|
return {
|
@@ -174,7 +171,7 @@ var GroupItem = function (_a) {
|
|
174
171
|
* @return {Element} Child wrapped in Draggable.
|
175
172
|
*/
|
176
173
|
var mixinDraggable = function (child, isDraggable) {
|
177
|
-
return (_jsx(DraggableCore, {
|
174
|
+
return (_jsx(DraggableCore, { disabled: !isDraggable, onStart: onDragStart, onDrag: onDrag, onStop: onDragStop, handle: handle, cancel: ".react-resizable-handle" + (cancel ? "," + cancel : ""), scale: transformScale, nodeRef: elementRef, children: child }));
|
178
175
|
};
|
179
176
|
/**
|
180
177
|
* Mix a Resizable instance into a child.
|
@@ -251,6 +248,7 @@ var GroupItem = function (_a) {
|
|
251
248
|
var rowHeightNumber = resolveRowHeight(rowHeight, colWidth);
|
252
249
|
var bottomBoundary = offsetParent.clientHeight -
|
253
250
|
calcGridItemWHPx(h, rowHeightNumber, margin[1]);
|
251
|
+
console.log('bb', bottomBoundary);
|
254
252
|
top = clamp(top, 0, bottomBoundary);
|
255
253
|
var rightBoundary = containerWidth - calcGridItemWHPx(w, colWidth, margin[0]);
|
256
254
|
left = clamp(left, 0, rightBoundary);
|
@@ -382,17 +380,13 @@ var GroupItem = function (_a) {
|
|
382
380
|
var _d = getResizableXYPosition(handle, w, h, prevW, prevH), newX = _d.newX, newY = _d.newY;
|
383
381
|
handler(i, w, h, { e: e, node: node, size: size }, newX, newY);
|
384
382
|
};
|
385
|
-
var pos = calcGridItemPosition(getPositionParams(), x, y, z, w, h, {
|
386
|
-
dragging: dragging,
|
387
|
-
resizing: resizing,
|
388
|
-
}, colWidth);
|
383
|
+
var pos = calcGridItemPosition(getPositionParams(), x, y, z, w, h, {}, colWidth);
|
389
384
|
var child = React.Children.only(children);
|
390
|
-
// console.log(child, className)
|
391
385
|
var newChild = React.cloneElement(child, {
|
392
386
|
key: i,
|
393
387
|
ref: elementRef,
|
394
388
|
'data-grid-id': i,
|
395
|
-
className: classNames("react-
|
389
|
+
className: classNames("react-group-item", child.props.className, className, {
|
396
390
|
static: props.static,
|
397
391
|
isResizing: Boolean(resizing) && Boolean(isResizing) && Boolean(isHiddenVisibility),
|
398
392
|
resizing: Boolean(resizing),
|
@@ -78,7 +78,6 @@ export type GridItemProps = {
|
|
78
78
|
onFitToContent?: (i: string, w: number, h: number, x: number, y: number, { hasPaddingChanged }: {
|
79
79
|
hasPaddingChanged: boolean;
|
80
80
|
}) => void;
|
81
|
-
onDoubleClick?: (id: string) => void;
|
82
81
|
isHiddenVisibility?: boolean;
|
83
82
|
customColWidth?: number;
|
84
83
|
autoResize: boolean;
|
@@ -37,8 +37,9 @@ import { bottom, cloneLayoutItem, compact, getAllCollisions, getBoundingArea, ge
|
|
37
37
|
import { calcGridColWidth, calcXY, resolveRowHeight, } from "../GridItem/utils/calculateUtils";
|
38
38
|
import GridItem from "../GridItem/GridItem";
|
39
39
|
import isEqual from "../../external-lib/lodash.isEqual";
|
40
|
-
import { findAllChildrenButGroup, findAllChildrenIds, findChildrenIds, findGroupBlocks } from "./group";
|
40
|
+
import { findAllChildrenButGroup, findAllChildrenIds, findChildrenIds, findGroupBlocks, getBlockType } from "./group";
|
41
41
|
import GroupItem from "../GridItem/GroupItem";
|
42
|
+
import OutsideClickHandler from "../GridItem/OutsideClickHandler";
|
42
43
|
var layoutClassName = "react-grid-layout";
|
43
44
|
var ReactGridLayout = function (_a) {
|
44
45
|
var children = _a.children, props = __rest(_a, ["children"]);
|
@@ -48,7 +49,7 @@ var ReactGridLayout = function (_a) {
|
|
48
49
|
w: 1,
|
49
50
|
} : _w, // TODO fix
|
50
51
|
_x = props.resizeHandles, // TODO fix
|
51
|
-
resizeHandles = _x === void 0 ? ["se"] : _x, _y = props.width, width = _y === void 0 ? 0 : _y, resizeHandle = props.resizeHandle, _z = props.isHiddenVisibility, isHiddenVisibility = _z === void 0 ? true : _z, innerRef = props.innerRef, minNbRow = props.minNbRow, customColWidth = props.customColWidth, blockStructure = props.blockStructure, onDoubleClickGroup = props.onDoubleClickGroup, _0 = props.
|
52
|
+
resizeHandles = _x === void 0 ? ["se"] : _x, _y = props.width, width = _y === void 0 ? 0 : _y, resizeHandle = props.resizeHandle, _z = props.isHiddenVisibility, isHiddenVisibility = _z === void 0 ? true : _z, innerRef = props.innerRef, minNbRow = props.minNbRow, customColWidth = props.customColWidth, blockStructure = props.blockStructure, onDoubleClickGroup = props.onDoubleClickGroup, _0 = props.editingGroupBlock, editingGroupBlock = _0 === void 0 ? '1' : _0, onClickGroup = props.onClickGroup, bulkIds = props.bulkIds, onDoubleClickOutsideGroup = props.onDoubleClickOutsideGroup, selectedGroupBlock = props.selectedGroupBlock;
|
52
53
|
var _1 = useState(), activeDrag = _1[0], setActiveDrag = _1[1];
|
53
54
|
var _2 = useState(), oldDragItem = _2[0], setOldDragItem = _2[1];
|
54
55
|
var _3 = useState(), oldLayout = _3[0], setOldLayout = _3[1];
|
@@ -57,7 +58,7 @@ var ReactGridLayout = function (_a) {
|
|
57
58
|
var _6 = useState(), droppingPosition = _6[0], setDroppingPosition = _6[1];
|
58
59
|
var _7 = useState(false), isMounted = _7[0], setIsMounted = _7[1];
|
59
60
|
// const [selectedGroup, setSelectedGroup] = useState<string>('1');
|
60
|
-
var editableItems = blockStructure ? findChildrenIds(blockStructure,
|
61
|
+
var editableItems = blockStructure ? findChildrenIds(blockStructure, editingGroupBlock) : [];
|
61
62
|
var _8 = useState([]), oldGroupChildren = _8[0], setOldGroupChildren = _8[1];
|
62
63
|
var _9 = useState(function () {
|
63
64
|
return synchronizeLayoutWithChildren(props.layout || [], children, cols, compactType, allowOverlap);
|
@@ -201,6 +202,7 @@ var ReactGridLayout = function (_a) {
|
|
201
202
|
var _b;
|
202
203
|
var e = _a.e, node = _a.node;
|
203
204
|
var l = (_b = getLayoutItem(layout, i)) !== null && _b !== void 0 ? _b : { i: i, x: x, y: y, w: 10, h: 10 };
|
205
|
+
console.log(y);
|
204
206
|
if (!l)
|
205
207
|
return;
|
206
208
|
if (!oldDragItem) {
|
@@ -490,7 +492,8 @@ var ReactGridLayout = function (_a) {
|
|
490
492
|
var bounded = draggable && isBounded && l.isBounded !== false;
|
491
493
|
var editable = editableItems.includes(l.i);
|
492
494
|
var z = l.z || 0;
|
493
|
-
|
495
|
+
var isInBulk = bulkIds === null || bulkIds === void 0 ? void 0 : bulkIds.includes(l.i);
|
496
|
+
return (_jsx(GridItem, { className: editable ? 'editable-grid-item' : isInBulk ? 'bulk-grid-item' : 'not-editable-grid-item', isDraggable: editable, isResizable: editable, containerWidth: width, cols: cols, margin: margin, containerPadding: containerPadding || margin, maxRows: maxRows, rowHeight: rowHeight, cancel: draggableCancel, handle: draggableHandle, onDragStop: onDragStopHandler, onDragStart: onDragStartHandler, onDrag: onDragHandler, onResizeStart: onResizeStartHandler, onResize: onResizeHandler, onResizeStop: onResizeStopHandler, onFitToContent: onFitToContentHandler, isBounded: bounded, useCSSTransforms: useCSSTransforms && isMounted, usePercentages: !isMounted, transformScale: transformScale, w: l.w, h: l.h, x: l.x, y: l.y, z: editable ? 1000 + z : z, i: l.i, minH: l.minH, minW: l.minW, maxH: l.maxH, maxW: l.maxW, static: l.static, droppingPosition: isDroppingItem ? droppingPosition : undefined, resizeHandles: resizeHandlesOptions, resizeHandle: resizeHandle, isHiddenVisibility: isHiddenVisibility, customColWidth: colWidth, autoResize: !!l.autoResize, children: child }, l.i));
|
494
497
|
};
|
495
498
|
var onDragOverHandler = function (e) {
|
496
499
|
var _a;
|
@@ -577,9 +580,27 @@ var ReactGridLayout = function (_a) {
|
|
577
580
|
if (!groupItem) {
|
578
581
|
return _jsx(_Fragment, {});
|
579
582
|
}
|
580
|
-
var isEditingGroup = block.id ===
|
581
|
-
|
582
|
-
|
583
|
+
var isEditingGroup = block.id === editingGroupBlock;
|
584
|
+
var type = getBlockType(block.id);
|
585
|
+
var z = (function () {
|
586
|
+
if (isEditingGroup && type === 'GROUP') {
|
587
|
+
return 1000;
|
588
|
+
}
|
589
|
+
if (type === 'GROUP') {
|
590
|
+
return 1000;
|
591
|
+
}
|
592
|
+
if (type === 'BULK') {
|
593
|
+
return 9999;
|
594
|
+
}
|
595
|
+
return 1000;
|
596
|
+
})();
|
597
|
+
var handleClick = function (e) {
|
598
|
+
onClickGroup && onClickGroup(e, block.id, type);
|
599
|
+
};
|
600
|
+
var handleDoubleClick = function (e) {
|
601
|
+
onDoubleClickGroup && onDoubleClickGroup(e, block.id, type);
|
602
|
+
};
|
603
|
+
// () => {
|
583
604
|
// if (isEditingGroup) {
|
584
605
|
// const parent = findParentGroupByGroupId(blockStructure, block.id)
|
585
606
|
// parent && setSelectedGroup(parent)
|
@@ -587,21 +608,28 @@ var ReactGridLayout = function (_a) {
|
|
587
608
|
// setSelectedGroup('1')
|
588
609
|
// }
|
589
610
|
// }
|
590
|
-
// }
|
591
|
-
|
592
|
-
|
593
|
-
|
594
|
-
|
595
|
-
|
596
|
-
|
597
|
-
|
598
|
-
|
599
|
-
|
600
|
-
|
601
|
-
|
602
|
-
|
611
|
+
// }
|
612
|
+
var classname = (function () {
|
613
|
+
if (editingGroupBlock === block.id) {
|
614
|
+
return 'group editing';
|
615
|
+
}
|
616
|
+
if (selectedGroupBlock === block.id) {
|
617
|
+
return 'group selected';
|
618
|
+
}
|
619
|
+
return type.toLowerCase();
|
620
|
+
})();
|
621
|
+
return (_jsx(OutsideClickHandler, { onOutsideClick: onDoubleClickOutsideGroup, children: _jsx(GroupItem, { className: classname, containerWidth: width, cols: cols, margin: margin, containerPadding: containerPadding || margin, maxRows: maxRows, rowHeight: rowHeight, cancel: draggableCancel, handle: draggableHandle, onDragStop: onDragStopHandler, onDragStart: onDragStartHandler, onDrag: onDragHandler, onResizeStart: onResizeStartHandler, onResize: onResizeHandler, onResizeStop: onResizeStopHandler, onFitToContent: onFitToContentHandler, isDraggable: !viewOnly && !isEditingGroup, isResizable: !viewOnly && !isEditingGroup, isBounded: false, useCSSTransforms: useCSSTransforms && isMounted, usePercentages: !isMounted, transformScale: transformScale, w: groupItem.w, h: groupItem.h, x: groupItem.x, y: groupItem.y, z: z, i: block.id.toString(),
|
622
|
+
// minH={l.minH}
|
623
|
+
// minW={l.minW}
|
624
|
+
// maxH={l.maxH}
|
625
|
+
// maxW={l.maxW}
|
626
|
+
// static={l.static}
|
627
|
+
// droppingPosition={isDroppingItem ? droppingPosition : undefined}
|
628
|
+
// resizeHandles={resizeHandlesOptions}
|
629
|
+
// resizeHandle={resizeHandle}
|
630
|
+
isHiddenVisibility: isHiddenVisibility, customColWidth: colWidth, autoResize: false, children: _jsx("div", { onClick: handleClick, onDoubleClick: handleDoubleClick }) }, block.id) }));
|
603
631
|
};
|
604
|
-
var currentGroupBlocks = blockStructure ? findGroupBlocks(blockStructure,
|
632
|
+
var currentGroupBlocks = blockStructure ? findGroupBlocks(blockStructure, editingGroupBlock) : [];
|
605
633
|
// const groupsParentsGroups = findAllParentGroups(blockStructure, selectedGroup);
|
606
634
|
return (_jsxs("div", { ref: innerRef, className: mergedClassName, style: mergedStyle, onDrop: isDroppable ? onDropHandler : noop, onDragLeave: isDroppable ? onDragLeaveHandler : noop, onDragEnter: isDroppable ? onDragEnterHandler : noop, onDragOver: isDroppable ? onDragOverHandler : noop, children: [currentGroupBlocks.map(function (each) { return processGroup(each); }), React.Children.map(children, function (child) { return processGridItem(child); }), placeholder(), activeDrag && _jsx("div", { className: "grid-guide-line-center" }), activeDrag && (_jsx("div", { className: "grid-placeholder", style: {
|
607
635
|
marginTop: margin[1] + "px",
|
@@ -13,4 +13,5 @@ export declare const findAllComponentBlockIds: (blockStructure: Block[]) => stri
|
|
13
13
|
export declare const findParentGroupByGroupId: (blockStructure: Block[], targetId: string) => string | null;
|
14
14
|
export declare const addBlockToRoot: (blockStructure: Block[], newBlock: Block) => Block[];
|
15
15
|
export declare const addBulkToTarget: (blockStructure: Block[], targetId: string, bulkIds: string[]) => Block[];
|
16
|
+
export declare const getBlockType: (id: string) => 'GROUP' | 'BULK' | 'COMPONENT_BLOCK' | 'UNKNOWN';
|
16
17
|
export declare const blockStructure: Block[];
|
@@ -92,11 +92,11 @@ export var findGroupBlocks = function (blockStructure, targetId) {
|
|
92
92
|
var targetBlock = findBlockById(blockStructure, targetId);
|
93
93
|
var groupBlocks = [];
|
94
94
|
if (targetBlock) {
|
95
|
-
if (targetBlock.name === 'GroupBlock') {
|
95
|
+
if (targetBlock.name === 'GroupBlock' || targetBlock.name === 'BulkBlock') {
|
96
96
|
groupBlocks.push(targetBlock);
|
97
97
|
}
|
98
98
|
if (targetBlock.children) {
|
99
|
-
groupBlocks.push.apply(groupBlocks, targetBlock.children.filter(function (child) { return child.name === 'GroupBlock'; }));
|
99
|
+
groupBlocks.push.apply(groupBlocks, targetBlock.children.filter(function (child) { return child.name === 'GroupBlock' || child.name === 'BulkBlock'; }));
|
100
100
|
}
|
101
101
|
}
|
102
102
|
return groupBlocks;
|
@@ -149,24 +149,39 @@ export var addBulkToTarget = function (blockStructure, targetId, bulkIds) {
|
|
149
149
|
var structure = deepClone(blockStructure);
|
150
150
|
var targetBlock = findBlockById(structure, targetId);
|
151
151
|
if (!targetBlock || !targetBlock.children) {
|
152
|
-
|
152
|
+
return blockStructure;
|
153
153
|
}
|
154
154
|
var bulkBlocks = targetBlock.children.filter(function (child) { return bulkIds.includes(child.id); });
|
155
155
|
if (bulkBlocks.length !== bulkIds.length) {
|
156
156
|
throw new Error("Some bulkIds do not exist as children of the target block.");
|
157
157
|
}
|
158
|
+
if (bulkBlocks.length === 0) {
|
159
|
+
return blockStructure;
|
160
|
+
}
|
158
161
|
// Remove bulk blocks from target's children
|
159
162
|
targetBlock.children = targetBlock.children.filter(function (child) { return !bulkIds.includes(child.id); });
|
160
163
|
// Create the new bulkBlock
|
161
164
|
var bulkBlock = {
|
162
|
-
id: "
|
163
|
-
name: '
|
165
|
+
id: "BULK",
|
166
|
+
name: 'BulkBlock',
|
164
167
|
children: bulkBlocks,
|
165
168
|
};
|
166
169
|
// Add the bulkBlock to the target's children
|
167
170
|
targetBlock.children.push(bulkBlock);
|
168
171
|
return structure;
|
169
172
|
};
|
173
|
+
export var getBlockType = function (id) {
|
174
|
+
if (id.startsWith('GB_')) {
|
175
|
+
return 'GROUP';
|
176
|
+
}
|
177
|
+
else if (id.startsWith('CB_')) {
|
178
|
+
return 'COMPONENT_BLOCK';
|
179
|
+
}
|
180
|
+
else if (id === 'BULK') {
|
181
|
+
return 'BULK';
|
182
|
+
}
|
183
|
+
return 'UNKNOWN'; // 잘못된 ID 형식의 경우
|
184
|
+
};
|
170
185
|
// 사용 예시:
|
171
186
|
export var blockStructure = [
|
172
187
|
{
|
@@ -174,43 +189,43 @@ export var blockStructure = [
|
|
174
189
|
name: 'RootBlock',
|
175
190
|
children: [
|
176
191
|
{
|
177
|
-
id: '
|
192
|
+
id: 'GB_2',
|
178
193
|
name: 'GroupBlock',
|
179
194
|
children: [
|
180
195
|
{
|
181
|
-
id: '
|
196
|
+
id: 'GB_3',
|
182
197
|
name: 'GroupBlock',
|
183
198
|
children: [
|
184
199
|
{
|
185
|
-
id: '
|
200
|
+
id: 'CB_4',
|
186
201
|
name: 'ComponentBlock'
|
187
202
|
},
|
188
203
|
{
|
189
|
-
id: '
|
204
|
+
id: 'CB_5',
|
190
205
|
name: 'ComponentBlock'
|
191
206
|
},
|
192
207
|
{
|
193
|
-
id: '
|
208
|
+
id: 'GB_6',
|
194
209
|
name: 'GroupBlock',
|
195
210
|
children: [
|
196
211
|
{
|
197
|
-
id: '
|
212
|
+
id: 'CB_7',
|
198
213
|
name: 'ComponentBlock'
|
199
214
|
},
|
200
215
|
{
|
201
|
-
id: '
|
216
|
+
id: 'CB_8',
|
202
217
|
name: 'ComponentBlock'
|
203
218
|
},
|
204
219
|
{
|
205
|
-
id: '
|
220
|
+
id: 'GB_9',
|
206
221
|
name: 'GroupBlock',
|
207
222
|
children: [
|
208
223
|
{
|
209
|
-
id: '
|
224
|
+
id: 'CB_10',
|
210
225
|
name: 'ComponentBlock'
|
211
226
|
},
|
212
227
|
{
|
213
|
-
id: '
|
228
|
+
id: 'CB_11',
|
214
229
|
name: 'ComponentBlock'
|
215
230
|
}
|
216
231
|
]
|
@@ -220,31 +235,31 @@ export var blockStructure = [
|
|
220
235
|
]
|
221
236
|
},
|
222
237
|
{
|
223
|
-
id: '
|
238
|
+
id: 'GB_12',
|
224
239
|
name: 'GroupBlock',
|
225
240
|
children: [
|
226
241
|
{
|
227
|
-
id: '
|
242
|
+
id: 'CB_13',
|
228
243
|
name: 'ComponentBlock'
|
229
244
|
},
|
230
245
|
{
|
231
|
-
id: '
|
246
|
+
id: 'CB_14',
|
232
247
|
name: 'ComponentBlock'
|
233
248
|
}
|
234
249
|
]
|
235
250
|
},
|
236
251
|
{
|
237
|
-
id: '
|
252
|
+
id: 'CB_15',
|
238
253
|
name: 'ComponentBlock'
|
239
254
|
},
|
240
255
|
{
|
241
|
-
id: '
|
256
|
+
id: 'CB_16',
|
242
257
|
name: 'ComponentBlock'
|
243
258
|
}
|
244
259
|
]
|
245
260
|
},
|
246
261
|
{
|
247
|
-
id: '
|
262
|
+
id: 'GB_17',
|
248
263
|
name: 'GroupBlock',
|
249
264
|
children: [
|
250
265
|
// {
|
@@ -262,17 +277,17 @@ export var blockStructure = [
|
|
262
277
|
// ]
|
263
278
|
// },
|
264
279
|
{
|
265
|
-
id: '
|
280
|
+
id: 'CB_18',
|
266
281
|
name: 'ComponentBlock'
|
267
282
|
}
|
268
283
|
]
|
269
284
|
},
|
270
285
|
{
|
271
|
-
id: '
|
286
|
+
id: 'CB_19',
|
272
287
|
name: 'ComponentBlock'
|
273
288
|
},
|
274
289
|
{
|
275
|
-
id: '
|
290
|
+
id: 'CB_20',
|
276
291
|
name: 'ComponentBlock'
|
277
292
|
}
|
278
293
|
]
|
@@ -74,9 +74,12 @@ export type ReactGridLayoutProps = {
|
|
74
74
|
customColWidth?: number;
|
75
75
|
onFitToContent?: OnFitContentCallBack;
|
76
76
|
blockStructure?: Block[];
|
77
|
-
onDoubleClickGroup?: (id: string) => void;
|
78
|
-
selectedGroupBlock?: string;
|
79
|
-
|
77
|
+
onDoubleClickGroup?: (e: React.MouseEvent, id: string, type: string) => void;
|
78
|
+
selectedGroupBlock?: string | null;
|
79
|
+
editingGroupBlock?: string;
|
80
|
+
onClickGroup?: (e: React.MouseEvent, id: string, type: string) => void;
|
81
|
+
bulkIds?: string[];
|
82
|
+
onDoubleClickOutsideGroup: () => void;
|
80
83
|
};
|
81
84
|
export type DragOverEvent = MouseEvent & {
|
82
85
|
nativeEvent: {
|