publ-echo-test 0.0.141 → 0.0.142

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.
@@ -1,5 +1,5 @@
1
- import React from "react";
2
- import { GridItemProps } from "./types";
3
- import { PropsWithChildren } from "../types";
1
+ import React from 'react';
2
+ import { GridItemProps } from './types';
3
+ import { PropsWithChildren } from '../types';
4
4
  declare const GridItem: ({ children, ...props }: PropsWithChildren<GridItemProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
5
5
  export default GridItem;
@@ -21,16 +21,16 @@ var __rest = (this && this.__rest) || function (s, e) {
21
21
  return t;
22
22
  };
23
23
  import { jsx as _jsx } from "react/jsx-runtime";
24
- import React, { useEffect, useRef, useState } from "react";
25
- import { DraggableCore } from "../Draggable";
26
- import classNames from "../../external-lib/classnames";
27
- import { calcGridColWidth, calcGridItemPosition, calcGridItemWHPx, calcWH, calcXY, clamp, resolveRowHeight, } from "./utils/calculateUtils";
28
- import { perc, setTopLeft, setTransform, } from "../GridLayoutEditor/utils/renderHelpers";
29
- import { Resizable } from "../Resizable";
24
+ import React, { useEffect, useRef, useState } from 'react';
25
+ import { DraggableCore } from '../Draggable';
26
+ import classNames from '../../external-lib/classnames';
27
+ import { calcGridColWidth, calcGridItemPosition, calcGridItemWHPx, calcWH, calcXY, clamp, resolveRowHeight, } from './utils/calculateUtils';
28
+ import { perc, setTopLeft, setTransform, } from '../GridLayoutEditor/utils/renderHelpers';
29
+ import { Resizable } from '../Resizable';
30
30
  var GridItem = 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];
@@ -59,7 +59,9 @@ var GridItem = function (_a) {
59
59
  var isCharacterChanged = mutation.type === 'characterData';
60
60
  var keepWidth = true;
61
61
  var hasPaddingChanged = false;
62
- var height = isCharacterChanged ? mutation.target.parentNode.clientHeight : mutation.target.clientHeight;
62
+ var height = isCharacterChanged
63
+ ? mutation.target.parentNode.clientHeight
64
+ : mutation.target.clientHeight;
63
65
  var width = targetNode.clientWidth;
64
66
  if (!isCharacterChanged && mutation.target instanceof Element) {
65
67
  var styles = getComputedStyle(mutation.target);
@@ -72,7 +74,10 @@ var GridItem = function (_a) {
72
74
  var paddingR = parseFloat(styles.paddingRight);
73
75
  var paddingT = parseFloat(styles.paddingTop);
74
76
  var paddingB = parseFloat(styles.paddingBottom);
75
- if (prevPaddingL !== paddingL || prevPaddingR !== paddingR || prevPaddingT !== paddingT || prevPaddingB !== paddingB) {
77
+ if (prevPaddingL !== paddingL ||
78
+ prevPaddingR !== paddingR ||
79
+ prevPaddingT !== paddingT ||
80
+ prevPaddingB !== paddingB) {
76
81
  hasPaddingChanged = true;
77
82
  keepWidth = false;
78
83
  }
@@ -93,7 +98,8 @@ var GridItem = function (_a) {
93
98
  if (prevH === h_1 && prevW === w_1 && newX === x && newY === y) {
94
99
  return;
95
100
  }
96
- props.onFitToContent && props.onFitToContent(i, w_1, h_1, newX, newY, { hasPaddingChanged: hasPaddingChanged });
101
+ props.onFitToContent &&
102
+ props.onFitToContent(i, w_1, h_1, newX, newY, { hasPaddingChanged: hasPaddingChanged });
97
103
  }
98
104
  };
99
105
  // MutationObserver 인스턴스 생성
@@ -158,7 +164,7 @@ var GridItem = function (_a) {
158
164
  style = setTopLeft(pos);
159
165
  if (usePercentages) {
160
166
  if (containerWidth == null) {
161
- throw new Error("Container width is missing!");
167
+ throw new Error('Container width is missing!');
162
168
  }
163
169
  style.left = perc(pos.left / containerWidth);
164
170
  style.width = perc(pos.width / containerWidth);
@@ -172,7 +178,7 @@ var GridItem = function (_a) {
172
178
  * @return {Element} Child wrapped in Draggable.
173
179
  */
174
180
  var mixinDraggable = function (child, isDraggable) {
175
- 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 }));
181
+ 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 }));
176
182
  };
177
183
  /**
178
184
  * Mix a Resizable instance into a child.
@@ -199,7 +205,7 @@ var GridItem = function (_a) {
199
205
  ];
200
206
  return (_jsx(Resizable, { draggableOpts: {
201
207
  disabled: !isResizable,
202
- }, className: isResizable ? undefined : "react-resizable-hide", width: position.width, height: position.height, top: position.top, left: position.left, resizeHandles: props.resizeHandles, onResizeStop: onResizeStop, onResizeStart: onResizeStart, onResize: onResize, minConstraints: minConstraints, maxConstraints: maxConstraints, transformScale: transformScale, handle: resizeHandle, isResizing: isResizing, autoResize: autoResize, colWidth: colWidth, margin: props.margin, children: child }));
208
+ }, className: isResizable ? undefined : 'react-resizable-hide', width: position.width, height: position.height, top: position.top, left: position.left, resizeHandles: props.resizeHandles, onResizeStop: onResizeStop, onResizeStart: onResizeStart, onResize: onResize, minConstraints: minConstraints, maxConstraints: maxConstraints, transformScale: transformScale, handle: resizeHandle, isResizing: isResizing, autoResize: autoResize, colWidth: colWidth, margin: props.margin, children: child }));
203
209
  };
204
210
  /**
205
211
  * onDragStart event handler
@@ -234,7 +240,7 @@ var GridItem = function (_a) {
234
240
  var onDrag = function (e, _a) {
235
241
  var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
236
242
  if (!dragging) {
237
- throw new Error("onDrag called before onDragStart.");
243
+ throw new Error('onDrag called before onDragStart.');
238
244
  }
239
245
  setIsDragging(true);
240
246
  var top = dragging.top + deltaY;
@@ -267,7 +273,7 @@ var GridItem = function (_a) {
267
273
  var onDragStop = function (e, _a) {
268
274
  var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
269
275
  if (!dragging) {
270
- throw new Error("onDragEnd called before onDragStart.");
276
+ throw new Error('onDragEnd called before onDragStart.');
271
277
  }
272
278
  var w = props.w, h = props.h, i = props.i;
273
279
  var left = dragging.left, top = dragging.top;
@@ -283,7 +289,7 @@ var GridItem = function (_a) {
283
289
  var getResizableXYPosition = function (handle, width, height, prevW, prevH) {
284
290
  var newX = x;
285
291
  var newY = y;
286
- if (handle === "nw") {
292
+ if (handle === 'nw') {
287
293
  // NOTE - nw left(X)와 top(Y) 둘다 변경
288
294
  if (width > prevW) {
289
295
  newX = x - (width - prevW);
@@ -298,7 +304,7 @@ var GridItem = function (_a) {
298
304
  newY = y + (prevH - height);
299
305
  }
300
306
  }
301
- if (handle === "n" || handle === "ne") {
307
+ if (handle === 'n' || handle === 'ne') {
302
308
  // NOTE - n, ne left(X) 고정 & top(Y) 변경
303
309
  if (height > prevH) {
304
310
  newY = y - (height - prevH);
@@ -307,7 +313,7 @@ var GridItem = function (_a) {
307
313
  newY = y + (prevH - height);
308
314
  }
309
315
  }
310
- if (handle === "w" || handle === "sw") {
316
+ if (handle === 'w' || handle === 'sw') {
311
317
  // NOTE - s, sw left(X) 변경 top(Y) 고정
312
318
  if (width > prevW) {
313
319
  newX = x - (width - prevW);
@@ -324,7 +330,7 @@ var GridItem = function (_a) {
324
330
  * @param {Object} callbackData an object with node and size information
325
331
  */
326
332
  var onResizeStart = function (e, callbackData) {
327
- onResizeHandler(e, callbackData, "onResizeStart");
333
+ onResizeHandler(e, callbackData, 'onResizeStart');
328
334
  };
329
335
  /**
330
336
  * onResize event handler
@@ -333,7 +339,7 @@ var GridItem = function (_a) {
333
339
  */
334
340
  var onResize = function (e, callbackData) {
335
341
  setIsResizing(true);
336
- onResizeHandler(e, callbackData, "onResize");
342
+ onResizeHandler(e, callbackData, 'onResize');
337
343
  };
338
344
  /**
339
345
  * onResizeStop event handler
@@ -342,7 +348,7 @@ var GridItem = function (_a) {
342
348
  */
343
349
  var onResizeStop = function (e, callbackData) {
344
350
  setIsResizing(false);
345
- onResizeHandler(e, callbackData, "onResizeStop");
351
+ onResizeHandler(e, callbackData, 'onResizeStop');
346
352
  };
347
353
  /**
348
354
  * Wrapper around drag events to provide more useful data.
@@ -376,7 +382,7 @@ var GridItem = function (_a) {
376
382
  // maxW = Math.min(maxW, cols - x);
377
383
  w = clamp(w, minW, maxW);
378
384
  h = clamp(h, tempMinH, maxH);
379
- setResizing(handlerName === "onResizeStop" ? undefined : size);
385
+ setResizing(handlerName === 'onResizeStop' ? undefined : size);
380
386
  var _d = getResizableXYPosition(handle, w, h, prevW, prevH), newX = _d.newX, newY = _d.newY;
381
387
  handler(i, w, h, { e: e, node: node, size: size }, newX, newY);
382
388
  };
@@ -389,14 +395,15 @@ var GridItem = function (_a) {
389
395
  key: i,
390
396
  ref: elementRef,
391
397
  'data-grid-id': i,
392
- className: classNames("react-grid-item", child.props.className, className, {
398
+ 'data-z-index': z,
399
+ className: classNames('react-grid-item', child.props.className, className, {
393
400
  static: props.static,
394
401
  isResizing: Boolean(resizing) && Boolean(isResizing) && Boolean(isHiddenVisibility),
395
402
  resizing: Boolean(resizing),
396
- "react-draggable": isDraggable,
397
- "editable-grid-item": isResizable && isDraggable,
403
+ 'react-draggable': isDraggable,
404
+ 'editable-grid-item': isResizable && isDraggable,
398
405
  isDragging: Boolean(isDragging) && Boolean(dragging) && Boolean(isHiddenVisibility),
399
- "react-draggable-dragging": Boolean(dragging),
406
+ 'react-draggable-dragging': Boolean(dragging),
400
407
  // dropping: Boolean(droppingPosition),
401
408
  cssTransforms: useCSSTransforms,
402
409
  }),
@@ -1,6 +1,6 @@
1
- import * as React from "react";
2
- import type { ReactElement } from "react";
3
- import { PropsWithChildren } from "../types";
4
- import { ReactGridLayoutProps } from "./types";
1
+ import * as React from 'react';
2
+ import type { ReactElement } from 'react';
3
+ import { PropsWithChildren } from '../types';
4
+ import { ReactGridLayoutProps } from './types';
5
5
  declare const ReactGridLayout: ({ children, ...props }: PropsWithChildren<ReactGridLayoutProps>) => React.ReactElement;
6
6
  export default ReactGridLayout;
@@ -30,26 +30,26 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
30
30
  return to.concat(ar || Array.prototype.slice.call(from));
31
31
  };
32
32
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
33
- import * as React from "react";
34
- import { useState, useRef, useLayoutEffect } from "react";
35
- import classNames from "../../external-lib/classnames";
36
- import { bottom, cloneLayoutItem, compact, getAllCollisions, getBoundingArea, getLayoutItem, moveElement, noop, synchronizeLayoutWithChildren, withLayoutItem, } from "./utils/renderHelpers";
37
- import { calcGridColWidth, calcXY, resolveRowHeight, } from "../GridItem/utils/calculateUtils";
38
- import GridItem from "../GridItem/GridItem";
39
- import isEqual from "../../external-lib/lodash.isEqual";
40
- import { findAllChildrenCbIds, findBlockByBlockId, findDirectChildrenBlockIds, findDirectChildrenCbIds, findGroupBlocks, formatCbIdToBlockId, getBlockSpecificType, zIndexMap } from "./group";
41
- import GroupItem from "../GridItem/GroupItem";
42
- import OutsideClickHandler from "../GridItem/OutsideClickHandler";
43
- var layoutClassName = "react-grid-layout";
33
+ import * as React from 'react';
34
+ import { useState, useRef, useLayoutEffect } from 'react';
35
+ import classNames from '../../external-lib/classnames';
36
+ import { bottom, cloneLayoutItem, compact, getAllCollisions, getBoundingArea, getLayoutItem, moveElement, noop, synchronizeLayoutWithChildren, withLayoutItem, } from './utils/renderHelpers';
37
+ import { calcGridColWidth, calcXY, resolveRowHeight, } from '../GridItem/utils/calculateUtils';
38
+ import GridItem from '../GridItem/GridItem';
39
+ import isEqual from '../../external-lib/lodash.isEqual';
40
+ import { findAllChildrenCbIds, findBlockByBlockId, findDirectChildrenBlockIds, findDirectChildrenCbIds, findGroupBlocks, formatCbIdToBlockId, getBlockSpecificType, zIndexMap, } from './group';
41
+ import GroupItem from '../GridItem/GroupItem';
42
+ import OutsideClickHandler from '../GridItem/OutsideClickHandler';
43
+ var layoutClassName = 'react-grid-layout';
44
44
  var ReactGridLayout = function (_a) {
45
45
  var children = _a.children, props = __rest(_a, ["children"]);
46
- var _b = props.autoSize, autoSize = _b === void 0 ? true : _b, _c = props.cols, cols = _c === void 0 ? 12 : _c, _d = props.className, className = _d === void 0 ? "" : _d, _e = props.style, style = _e === void 0 ? {} : _e, _f = props.draggableHandle, draggableHandle = _f === void 0 ? "" : _f, _g = props.draggableCancel, draggableCancel = _g === void 0 ? "" : _g, _h = props.containerPadding, containerPadding = _h === void 0 ? undefined : _h, _j = props.rowHeight, rowHeight = _j === void 0 ? 150 : _j, _k = props.maxRows, maxRows = _k === void 0 ? Infinity : _k, _l = props.margin, margin = _l === void 0 ? [10, 10] : _l, _m = props.isBounded, isBounded = _m === void 0 ? false : _m, _o = props.isDraggable, isDraggable = _o === void 0 ? true : _o, _p = props.isResizable, isResizable = _p === void 0 ? true : _p, _q = props.allowOverlap, allowOverlap = _q === void 0 ? false : _q, _r = props.isDroppable, isDroppable = _r === void 0 ? false : _r, _s = props.useCSSTransforms, useCSSTransforms = _s === void 0 ? true : _s, _t = props.transformScale, transformScale = _t === void 0 ? 1 : _t, _u = props.compactType, compactType = _u === void 0 ? "vertical" : _u, _v = props.preventCollision, preventCollision = _v === void 0 ? false : _v, _w = props.droppingItem, droppingItem = _w === void 0 ? {
47
- i: "__dropping-elem__",
46
+ var _b = props.autoSize, autoSize = _b === void 0 ? true : _b, _c = props.cols, cols = _c === void 0 ? 12 : _c, _d = props.className, className = _d === void 0 ? '' : _d, _e = props.style, style = _e === void 0 ? {} : _e, _f = props.draggableHandle, draggableHandle = _f === void 0 ? '' : _f, _g = props.draggableCancel, draggableCancel = _g === void 0 ? '' : _g, _h = props.containerPadding, containerPadding = _h === void 0 ? undefined : _h, _j = props.rowHeight, rowHeight = _j === void 0 ? 150 : _j, _k = props.maxRows, maxRows = _k === void 0 ? Infinity : _k, _l = props.margin, margin = _l === void 0 ? [10, 10] : _l, _m = props.isBounded, isBounded = _m === void 0 ? false : _m, _o = props.isDraggable, isDraggable = _o === void 0 ? true : _o, _p = props.isResizable, isResizable = _p === void 0 ? true : _p, _q = props.allowOverlap, allowOverlap = _q === void 0 ? false : _q, _r = props.isDroppable, isDroppable = _r === void 0 ? false : _r, _s = props.useCSSTransforms, useCSSTransforms = _s === void 0 ? true : _s, _t = props.transformScale, transformScale = _t === void 0 ? 1 : _t, _u = props.compactType, compactType = _u === void 0 ? 'vertical' : _u, _v = props.preventCollision, preventCollision = _v === void 0 ? false : _v, _w = props.droppingItem, droppingItem = _w === void 0 ? {
47
+ i: '__dropping-elem__',
48
48
  h: 1,
49
49
  w: 1,
50
50
  } : _w, // TODO fix
51
51
  _x = props.resizeHandles, // TODO fix
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 ? 'ROOT' : _0, _1 = props.selectedGroupBlock, selectedGroupBlock = _1 === void 0 ? 'ROOT' : _1, onClickGroup = props.onClickGroup, bulkIds = props.bulkIds, onDoubleClickOutsideGroup = props.onDoubleClickOutsideGroup;
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 ? 'ROOT' : _0, _1 = props.selectedGroupBlock, selectedGroupBlock = _1 === void 0 ? 'ROOT' : _1, onClickGroup = props.onClickGroup, bulkIds = props.bulkIds, onDoubleClickOutsideGroup = props.onDoubleClickOutsideGroup;
53
53
  var device = cols === 24 ? 'DESKTOP' : 'MOBILE';
54
54
  var _2 = useState(), activeDrag = _2[0], setActiveDrag = _2[1];
55
55
  var _3 = useState(), oldDragItem = _3[0], setOldDragItem = _3[1];
@@ -59,8 +59,14 @@ var ReactGridLayout = function (_a) {
59
59
  var _7 = useState(), droppingPosition = _7[0], setDroppingPosition = _7[1];
60
60
  var _8 = useState(false), isMounted = _8[0], setIsMounted = _8[1];
61
61
  var editorMode = props.isDraggable && props.isResizable ? 'EDIT' : 'VIEW';
62
- var editableBlockIds = blockStructure ? findDirectChildrenCbIds(blockStructure, editingGroupBlock) : [];
63
- var editingGroupAllChildren = (blockStructure && editingGroupBlock) ? findAllChildrenCbIds(blockStructure, editingGroupBlock).map(function (i) { return i.toString(); }) : [];
62
+ var editableBlockIds = blockStructure
63
+ ? findDirectChildrenCbIds(blockStructure, editingGroupBlock)
64
+ : [];
65
+ var editingGroupAllChildren = blockStructure && editingGroupBlock
66
+ ? findAllChildrenCbIds(blockStructure, editingGroupBlock).map(function (i) {
67
+ return i.toString();
68
+ })
69
+ : [];
64
70
  var _9 = useState([]), oldGroupChildren = _9[0], setOldGroupChildren = _9[1];
65
71
  var _10 = useState(function () {
66
72
  return synchronizeLayoutWithChildren(props.layout || [], children, cols, compactType, allowOverlap);
@@ -72,12 +78,12 @@ var ReactGridLayout = function (_a) {
72
78
  }, []);
73
79
  useLayoutEffect(function () {
74
80
  if (props.layout && !Array.isArray(props.layout)) {
75
- console.error("Expecting layout to be an Array but got: ", props.layout);
81
+ console.error('Expecting layout to be an Array but got: ', props.layout);
76
82
  }
77
83
  setLayout(synchronizeLayoutWithChildren(props.layout || [], children, cols, compactType, allowOverlap));
78
84
  }, [props.layout]);
79
85
  useLayoutEffect(function () {
80
- var newLayout = synchronizeLayoutWithChildren(props.layout || layout, children, props.cols || cols, props.compactType || "vertical", props.allowOverlap);
86
+ var newLayout = synchronizeLayoutWithChildren(props.layout || layout, children, props.cols || cols, props.compactType || 'vertical', props.allowOverlap);
81
87
  setLayout(newLayout);
82
88
  }, [children]);
83
89
  var getPositionParams = function () {
@@ -103,11 +109,10 @@ var ReactGridLayout = function (_a) {
103
109
  var containerPaddingY = containerPadding
104
110
  ? containerPadding[1]
105
111
  : margin[1];
106
- return (biggerNbRow *
107
- resolveRowHeight(rowHeight, colWidth) +
112
+ return (biggerNbRow * resolveRowHeight(rowHeight, colWidth) +
108
113
  (biggerNbRow - 1) * margin[1] +
109
114
  containerPaddingY * 2 +
110
- "px");
115
+ 'px');
111
116
  };
112
117
  var getBackgroundHeight = function () {
113
118
  if (!autoSize)
@@ -117,17 +122,16 @@ var ReactGridLayout = function (_a) {
117
122
  var containerPaddingY = containerPadding
118
123
  ? containerPadding[1]
119
124
  : margin[1];
120
- return (biggerNbRow *
121
- resolveRowHeight(rowHeight, colWidth) +
125
+ return (biggerNbRow * resolveRowHeight(rowHeight, colWidth) +
122
126
  (biggerNbRow - 1) * margin[1] +
123
127
  containerPaddingY * 2 -
124
128
  2 * margin[1] +
125
- "px");
129
+ 'px');
126
130
  };
127
131
  var getBackgroundWidth = function () {
128
132
  if (!autoSize)
129
133
  return;
130
- return width - margin[0] * 2 + "px";
134
+ return width - margin[0] * 2 + 'px';
131
135
  };
132
136
  /**
133
137
  * When dragging starts
@@ -149,7 +153,9 @@ var ReactGridLayout = function (_a) {
149
153
  if (!blockStructure) {
150
154
  return;
151
155
  }
152
- var childrenIds = findAllChildrenCbIds(blockStructure, i).map(function (i) { return i.toString(); });
156
+ var childrenIds = findAllChildrenCbIds(blockStructure, i).map(function (i) {
157
+ return i.toString();
158
+ });
153
159
  var children_1 = childrenIds.map(function (id) {
154
160
  var item = getLayoutItem(layout, id);
155
161
  return cloneLayoutItem(item);
@@ -221,17 +227,19 @@ var ReactGridLayout = function (_a) {
221
227
  i: i,
222
228
  };
223
229
  var isUserAction = true;
224
- var newLayout = isGroup ? layout : moveElement({
225
- layout: layout,
226
- l: l,
227
- x: x,
228
- y: y,
229
- isUserAction: isUserAction,
230
- preventCollision: preventCollision,
231
- compactType: compactType,
232
- cols: cols,
233
- allowOverlap: allowOverlap,
234
- });
230
+ var newLayout = isGroup
231
+ ? layout
232
+ : moveElement({
233
+ layout: layout,
234
+ l: l,
235
+ x: x,
236
+ y: y,
237
+ isUserAction: isUserAction,
238
+ preventCollision: preventCollision,
239
+ compactType: compactType,
240
+ cols: cols,
241
+ allowOverlap: allowOverlap,
242
+ });
235
243
  if (isGroup) {
236
244
  oldGroupChildren.forEach(function (item) {
237
245
  var layoutItem = getLayoutItem(layout, item.i);
@@ -274,7 +282,6 @@ var ReactGridLayout = function (_a) {
274
282
  if (!activeDrag || !oldDragItem) {
275
283
  return;
276
284
  }
277
- ;
278
285
  var l = (_b = getLayoutItem(layout, i)) !== null && _b !== void 0 ? _b : { i: i, x: x, y: y, w: 10, h: 10 };
279
286
  if (!l)
280
287
  return;
@@ -291,7 +298,7 @@ var ReactGridLayout = function (_a) {
291
298
  compactType: compactType,
292
299
  cols: cols,
293
300
  allowOverlap: allowOverlap,
294
- overrideZ: oldDragItem.z
301
+ overrideZ: oldDragItem.z,
295
302
  });
296
303
  props.onDragStop &&
297
304
  props.onDragStop({
@@ -318,7 +325,6 @@ var ReactGridLayout = function (_a) {
318
325
  if (!activeDrag || !oldDragItem) {
319
326
  return;
320
327
  }
321
- ;
322
328
  var l = (_b = getLayoutItem(layout, i)) !== null && _b !== void 0 ? _b : { i: i, x: x, y: y, w: 10, h: 10 };
323
329
  if (!l)
324
330
  return;
@@ -335,7 +341,7 @@ var ReactGridLayout = function (_a) {
335
341
  compactType: compactType,
336
342
  cols: cols,
337
343
  allowOverlap: allowOverlap,
338
- overrideZ: oldDragItem.z
344
+ overrideZ: oldDragItem.z,
339
345
  });
340
346
  var updatedItems = oldGroupChildren.map(function (item) {
341
347
  var layoutItem = getLayoutItem(layout, item.i);
@@ -353,7 +359,7 @@ var ReactGridLayout = function (_a) {
353
359
  placeholder: undefined,
354
360
  e: e,
355
361
  node: node,
356
- updatedItems: updatedItems
362
+ updatedItems: updatedItems,
357
363
  });
358
364
  var newLayout = allowOverlap
359
365
  ? movedLayout
@@ -494,7 +500,7 @@ var ReactGridLayout = function (_a) {
494
500
  layout: newLayout,
495
501
  prev: oldResizeItem,
496
502
  item: l,
497
- hasPaddingChanged: hasPaddingChanged
503
+ hasPaddingChanged: hasPaddingChanged,
498
504
  });
499
505
  setLayout(allowOverlap ? newLayout : compact(newLayout, compactType, cols));
500
506
  };
@@ -514,10 +520,11 @@ var ReactGridLayout = function (_a) {
514
520
  // LINK: https://legacy.reactjs.org/docs/react-api.html
515
521
  var items = React.Children.toArray(children);
516
522
  var item = items.find(function (child) {
517
- var originalKey = String(child.key).split(".$");
523
+ var originalKey = String(child.key).split('.$');
518
524
  return originalKey[1] === l.i;
519
525
  });
520
- var isInBulk = blockStructure && (bulkIds === null || bulkIds === void 0 ? void 0 : bulkIds.includes(formatCbIdToBlockId(Number(activeDrag.i))));
526
+ var isInBulk = blockStructure &&
527
+ (bulkIds === null || bulkIds === void 0 ? void 0 : bulkIds.includes(formatCbIdToBlockId(Number(activeDrag.i))));
521
528
  if (!item) {
522
529
  return null;
523
530
  }
@@ -536,11 +543,10 @@ var ReactGridLayout = function (_a) {
536
543
  if (!l) {
537
544
  return;
538
545
  }
539
- ;
540
- var draggable = typeof l.isDraggable === "boolean"
546
+ var draggable = typeof l.isDraggable === 'boolean'
541
547
  ? l.isDraggable
542
548
  : !l.static && isDraggable;
543
- var resizable = typeof l.isResizable === "boolean"
549
+ var resizable = typeof l.isResizable === 'boolean'
544
550
  ? l.isResizable
545
551
  : !l.static && isResizable;
546
552
  var resizeHandlesOptions = l.resizeHandles || resizeHandles;
@@ -549,7 +555,9 @@ var ReactGridLayout = function (_a) {
549
555
  var z = l.z || 0;
550
556
  var isInBulk = blockStructure && (bulkIds === null || bulkIds === void 0 ? void 0 : bulkIds.includes(formatCbIdToBlockId(Number(l.i))));
551
557
  var isRoot = editingGroupBlock === 'ROOT';
552
- var block = blockStructure ? findBlockByBlockId(blockStructure, formatCbIdToBlockId(Number(l.i))) : undefined;
558
+ var block = blockStructure
559
+ ? findBlockByBlockId(blockStructure, formatCbIdToBlockId(Number(l.i)))
560
+ : undefined;
553
561
  if (!block) {
554
562
  return _jsx(_Fragment, { children: "NO-BLOCK-FOUND" });
555
563
  }
@@ -575,8 +583,8 @@ var ReactGridLayout = function (_a) {
575
583
  var outsideOfEditingGroup = !editingGroupAllChildren.includes(l.i);
576
584
  var zIndex = editorMode === 'EDIT' ? editorZIndex : z;
577
585
  return (_jsx(GridItem, { className: classNames({
578
- 'editable-grid-item': (!isRoot && editable),
579
- 'not-editable-grid-item': (!isRoot && !editable),
586
+ 'editable-grid-item': !isRoot && editable,
587
+ 'not-editable-grid-item': !isRoot && !editable,
580
588
  'bulk-child-item': isInBulk,
581
589
  'outside-of-editing-group': outsideOfEditingGroup,
582
590
  }), z: zIndex, isDraggable: editable && !isInBulk, isResizable: editable && !isInBulk, 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, 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));
@@ -670,7 +678,8 @@ var ReactGridLayout = function (_a) {
670
678
  if (isBulk) {
671
679
  return zIndexMap.EDITING_GROUP_CHILD + zOrder;
672
680
  }
673
- if (isInBulk) { // 위와 같지만 이것은 not-editable이긴 함.
681
+ if (isInBulk) {
682
+ // 위와 같지만 이것은 not-editable이긴 함.
674
683
  // const bulkBlock = findBlockByBlockId(blockStructure, 'BULK');
675
684
  // const bulkZOrder = bulkBlock?.[device === 'DESKTOP' ? 'zOrderDesktopInternal' : 'zOrderMobileInternal'] ?? 0;
676
685
  return zIndexMap.EDITING_GROUP_CHILD + zOrder;
@@ -694,13 +703,14 @@ var ReactGridLayout = function (_a) {
694
703
  onDoubleClickGroup && onDoubleClickGroup(e, block.blockId, type);
695
704
  };
696
705
  var handleClickContextGroup = function (e) {
697
- (props === null || props === void 0 ? void 0 : props.onContextGroup) && props.onContextGroup(e, block.blockId, isEditingGroup);
706
+ (props === null || props === void 0 ? void 0 : props.onContextGroup) &&
707
+ props.onContextGroup(e, block.blockId, isEditingGroup);
698
708
  };
699
709
  return (_jsx(OutsideClickHandler, { onOutsideClick: onDoubleClickOutsideGroup, children: _jsx(GroupItem, { className: classNames({
700
710
  'bulk-child-item': isInBulk,
701
711
  'grid-bulk-block': block.blockId === 'BULK',
702
- 'editing': editingGroupBlock === block.blockId,
703
- 'selected': selectedGroupBlock === block.blockId
712
+ editing: editingGroupBlock === block.blockId,
713
+ selected: selectedGroupBlock === block.blockId,
704
714
  }), z: zIndex, containerWidth: width, cols: cols, margin: margin, containerPadding: containerPadding || margin, maxRows: maxRows, rowHeight: rowHeight, cancel: draggableCancel, handle: draggableHandle, onDragStop: onDragStopGroupHandler, onDragStart: onDragStartHandler, onDrag: onDragHandler, onResizeStart: onResizeStartHandler, onResize: onResizeHandler, onResizeStop: onResizeStopHandler, onFitToContent: onFitToContentHandler, isDraggable: !viewOnly && !isEditingGroup && !isInBulk, isResizable: !viewOnly && !isEditingGroup && !isInBulk, isBounded: false, useCSSTransforms: useCSSTransforms && isMounted, usePercentages: !isMounted, transformScale: transformScale, w: groupItem.w, h: groupItem.h, x: groupItem.x, y: groupItem.y, i: block.blockId,
705
715
  // minH={l.minH}
706
716
  // minW={l.minW}
@@ -712,12 +722,14 @@ var ReactGridLayout = function (_a) {
712
722
  // resizeHandle={resizeHandle}
713
723
  isHiddenVisibility: isHiddenVisibility, customColWidth: colWidth, autoResize: false, onContextGroup: handleClickContextGroup, children: _jsx("div", { onClick: handleClick, onDoubleClick: handleDoubleClick }) }, block.blockId) }));
714
724
  };
715
- var currentGroupBlocks = blockStructure ? findGroupBlocks(blockStructure, editingGroupBlock) : [];
716
- 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: {
717
- marginTop: margin[1] + "px",
718
- marginBottom: margin[1] + "px",
719
- marginLeft: margin[0] + "px",
720
- marginRight: margin[0] + "px",
721
- }, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: getBackgroundWidth(), height: getBackgroundHeight(), children: [_jsx("defs", { children: _jsx("pattern", { id: "grid-pattern", height: rowHeight + margin[1], width: colWidth + margin[0], patternUnits: "userSpaceOnUse", children: _jsx("rect", { x: 0.5, y: 0.5, className: "grid-pattern-rect", height: rowHeight, width: colWidth }) }) }), _jsx("rect", { width: width, height: "100%", fill: "url(#grid-pattern)" })] }) }))] }));
725
+ var currentGroupBlocks = blockStructure
726
+ ? findGroupBlocks(blockStructure, editingGroupBlock)
727
+ : [];
728
+ 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: {
729
+ marginTop: margin[1] + 'px',
730
+ marginBottom: margin[1] + 'px',
731
+ marginLeft: margin[0] + 'px',
732
+ marginRight: margin[0] + 'px',
733
+ }, children: _jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', width: getBackgroundWidth(), height: getBackgroundHeight(), children: [_jsx("defs", { children: _jsx("pattern", { id: 'grid-pattern', height: rowHeight + margin[1], width: colWidth + margin[0], patternUnits: 'userSpaceOnUse', children: _jsx("rect", { x: 0.5, y: 0.5, className: 'grid-pattern-rect', height: rowHeight, width: colWidth }) }) }), _jsx("rect", { width: width, height: '100%', fill: 'url(#grid-pattern)' })] }) }))] }));
722
734
  };
723
735
  export default ReactGridLayout;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "publ-echo-test",
3
- "version": "0.0.141",
3
+ "version": "0.0.142",
4
4
  "private": false,
5
5
  "main": "dist/lib/index.js",
6
6
  "types": "dist/lib/index.d.js",