publ-echo-test 0.0.210 → 0.0.212
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/GridItem/GridItem.js +0 -1
- package/dist/lib/GridLayoutEditor/ReactGridLayout.js +22 -24
- package/dist/lib/GridLayoutEditor/ResponsiveGridLayout.d.ts +2 -2
- package/dist/lib/GridLayoutEditor/ResponsiveGridLayout.js +8 -8
- package/dist/lib/GridLayoutEditor/group.d.ts +2 -1
- package/dist/lib/GridLayoutEditor/group.js +3 -2
- package/dist/lib/Resizable/Resizable.d.ts +3 -3
- package/dist/lib/Resizable/Resizable.js +52 -29
- package/package.json +1 -1
@@ -36,7 +36,6 @@ var GridItem = function (_a) {
|
|
36
36
|
var _o = useState(), dragStart = _o[0], setDragStart = _o[1];
|
37
37
|
var _p = useState(false), isDragging = _p[0], setIsDragging = _p[1];
|
38
38
|
var _q = useState(false), isResizing = _q[0], setIsResizing = _q[1];
|
39
|
-
var _r = useState(false), pointerEventsNone = _r[0], setPointerEventsNone = _r[1];
|
40
39
|
var elementRef = useRef(null);
|
41
40
|
var isSelected = (_b = elementRef.current) === null || _b === void 0 ? void 0 : _b.classList.contains('react-grid-item-selected');
|
42
41
|
useEffect(function () {
|
@@ -565,12 +565,13 @@ var ReactGridLayout = function (_a) {
|
|
565
565
|
return _jsx(_Fragment, { children: "NO-BLOCK-FOUND" });
|
566
566
|
}
|
567
567
|
var zOrder = (_a = block[device === 'DESKTOP' ? 'zOrderDesktopInternal' : 'zOrderMobileInternal']) !== null && _a !== void 0 ? _a : 0;
|
568
|
+
var isInsideOfEditingGroup = editingGroupAllChildren.includes(l.i);
|
568
569
|
var editorZIndex = (function () {
|
569
|
-
if (isInBulk) {
|
570
|
-
return
|
570
|
+
if (isRoot && isInBulk) {
|
571
|
+
return z;
|
571
572
|
}
|
572
|
-
if (!isRoot &&
|
573
|
-
return zIndexMap.
|
573
|
+
if (!isRoot && isInsideOfEditingGroup) {
|
574
|
+
return zIndexMap.CB_IN_EDITING_GROUP + z;
|
574
575
|
}
|
575
576
|
if (isRoot && editable) {
|
576
577
|
return zIndexMap.ROOT + z;
|
@@ -583,13 +584,12 @@ var ReactGridLayout = function (_a) {
|
|
583
584
|
}
|
584
585
|
return z;
|
585
586
|
})();
|
586
|
-
var outsideOfEditingGroup = !editingGroupAllChildren.includes(l.i);
|
587
587
|
var zIndex = editorMode === 'EDIT' ? editorZIndex : z;
|
588
588
|
return (_jsx(GridItem, { className: classNames({
|
589
589
|
'editable-grid-item': !isRoot && editable,
|
590
590
|
'not-editable-grid-item': !isRoot && !editable,
|
591
591
|
'bulk-child-item': isInBulk,
|
592
|
-
'outside-of-editing-group':
|
592
|
+
'outside-of-editing-group': !isInsideOfEditingGroup,
|
593
593
|
}), z: zIndex, zOrder: l.z, zOrderInternal: parent
|
594
594
|
? "".concat(parent[device === 'DESKTOP'
|
595
595
|
? 'zOrderDesktopInternal'
|
@@ -672,37 +672,35 @@ var ReactGridLayout = function (_a) {
|
|
672
672
|
if (!groupItem) {
|
673
673
|
return _jsx(_Fragment, {});
|
674
674
|
}
|
675
|
-
var
|
675
|
+
var internalZOrder = (_a = block[device === 'DESKTOP' ? 'zOrderDesktopInternal' : 'zOrderMobileInternal']) !== null && _a !== void 0 ? _a : 0;
|
676
676
|
var isEditingGroup = block.blockId === editingGroupBlock;
|
677
677
|
var type = getBlockSpecificType(block);
|
678
678
|
var isRoot = editingGroupBlock === 'ROOT';
|
679
679
|
var isInBulk = bulkIds === null || bulkIds === void 0 ? void 0 : bulkIds.includes(block.blockId);
|
680
680
|
var isBulk = block.blockId === 'BULK';
|
681
681
|
var baseZ = (function () {
|
682
|
-
if (isEditingGroup) {
|
683
|
-
return zIndexMap.EDITING_GROUP;
|
684
|
-
}
|
685
682
|
if (isBulk) {
|
686
|
-
|
683
|
+
// groupItem.z : 그룹 내 CB중 가장 큰 zorder
|
684
|
+
return zIndexMap.BULK + groupItem.z;
|
687
685
|
}
|
688
686
|
if (isInBulk) {
|
689
|
-
|
690
|
-
|
691
|
-
|
692
|
-
return zIndexMap.
|
687
|
+
if (!isRoot) {
|
688
|
+
return zIndexMap.EDITABLE_GROUP + internalZOrder;
|
689
|
+
}
|
690
|
+
return zIndexMap.CB_IN_EDITING_GROUP + internalZOrder;
|
691
|
+
}
|
692
|
+
if (isEditingGroup) {
|
693
|
+
return zIndexMap.EDITING_GROUP;
|
693
694
|
}
|
694
695
|
if (!isRoot && type === 'GROUP_BLOCK') {
|
695
|
-
return zIndexMap.
|
696
|
+
return zIndexMap.EDITABLE_GROUP + internalZOrder;
|
696
697
|
}
|
697
698
|
if (type === 'GROUP_BLOCK') {
|
698
699
|
return zIndexMap.GROUP;
|
699
700
|
}
|
700
|
-
|
701
|
-
return zIndexMap.BULK;
|
702
|
-
}
|
703
|
-
return zIndexMap.CB;
|
701
|
+
return -1; // NOTE: ERROR
|
704
702
|
})();
|
705
|
-
var zIndex = editorMode === 'EDIT' ? baseZ :
|
703
|
+
var zIndex = editorMode === 'EDIT' ? baseZ : internalZOrder;
|
706
704
|
var handleClick = function (e) {
|
707
705
|
onClickGroup && onClickGroup(e, block.blockId, type);
|
708
706
|
};
|
@@ -721,11 +719,11 @@ var ReactGridLayout = function (_a) {
|
|
721
719
|
'grid-bulk-block': block.blockId === 'BULK',
|
722
720
|
editing: editingGroupBlock === block.blockId,
|
723
721
|
selected: selectedGroupBlock === block.blockId,
|
724
|
-
}), z: zIndex, minZ: groupItem.minZ, zOrder:
|
722
|
+
}), z: zIndex, minZ: groupItem.minZ, zOrder: internalZOrder, zOrderInternal: parent
|
725
723
|
? "".concat(parent[device === 'DESKTOP'
|
726
724
|
? 'zOrderDesktopInternal'
|
727
|
-
: 'zOrderMobileInternal'], " > ").concat(
|
728
|
-
:
|
725
|
+
: 'zOrderMobileInternal'], " > ").concat(internalZOrder)
|
726
|
+
: internalZOrder.toString(), 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,
|
729
727
|
// minH={l.minH}
|
730
728
|
// minW={l.minW}
|
731
729
|
// maxH={l.maxH}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { ResponsiveGridLayoutProps } from
|
2
|
-
import { PropsWithChildren } from
|
1
|
+
import { ResponsiveGridLayoutProps } from './types';
|
2
|
+
import { PropsWithChildren } from '../types';
|
3
3
|
export declare const ResponsiveGridLayout: ({ children, ...props }: PropsWithChildren<ResponsiveGridLayoutProps>) => React.ReactElement;
|
4
4
|
export default ResponsiveGridLayout;
|
@@ -21,11 +21,11 @@ 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 { useLayoutEffect, useRef, useState } from
|
25
|
-
import { cloneLayout, noop, synchronizeLayoutWithChildren, } from
|
26
|
-
import { findOrGenerateResponsiveLayout, getBreakpointFromWidth, getColsFromBreakpoint, } from
|
27
|
-
import isEqual from
|
28
|
-
import ReactGridLayout from
|
24
|
+
import { useLayoutEffect, useRef, useState } from 'react';
|
25
|
+
import { cloneLayout, noop, synchronizeLayoutWithChildren, } from './utils/renderHelpers';
|
26
|
+
import { findOrGenerateResponsiveLayout, getBreakpointFromWidth, getColsFromBreakpoint, } from './utils/responsiveUtils';
|
27
|
+
import isEqual from '../../external-lib/lodash.isEqual';
|
28
|
+
import ReactGridLayout from './ReactGridLayout';
|
29
29
|
/**
|
30
30
|
* Get a value of margin or containerPadding.
|
31
31
|
*
|
@@ -44,7 +44,7 @@ export var ResponsiveGridLayout = function (_a) {
|
|
44
44
|
var breakpoint = getBreakpointFromWidth(breakpoints, width);
|
45
45
|
var colNo = getColsFromBreakpoint(breakpoint, cols);
|
46
46
|
var compactType = props.compactType;
|
47
|
-
var initialLayout = findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, breakpoint, colNo, compactType ||
|
47
|
+
var initialLayout = findOrGenerateResponsiveLayout(layouts, breakpoints, breakpoint, breakpoint, colNo, compactType || 'vertical', false);
|
48
48
|
return {
|
49
49
|
layout: initialLayout,
|
50
50
|
layouts: layouts,
|
@@ -95,8 +95,8 @@ export var ResponsiveGridLayout = function (_a) {
|
|
95
95
|
breakpoints[newBreakpoint] > breakpoints[lastBreakpoint];
|
96
96
|
var isNewLayout = layouts[newBreakpoint] == null;
|
97
97
|
var overlap = !!props.allowOverlap && (!isNewLayout || newBreakpointIsBiggerOrEqual); // allow resize overlap only if we are going into a larger screen
|
98
|
-
var layout = findOrGenerateResponsiveLayout(newLayouts, breakpoints, newBreakpoint, lastBreakpoint, newCols, compactType ||
|
99
|
-
layout = synchronizeLayoutWithChildren(layout, children, newCols, compactType ||
|
98
|
+
var layout = findOrGenerateResponsiveLayout(newLayouts, breakpoints, newBreakpoint, lastBreakpoint, newCols, compactType || 'vertical', overlap);
|
99
|
+
layout = synchronizeLayoutWithChildren(layout, children, newCols, compactType || 'vertical', overlap);
|
100
100
|
newLayouts[newBreakpoint] = layout;
|
101
101
|
setState({
|
102
102
|
breakpoint: newBreakpoint,
|
@@ -9,8 +9,9 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
9
9
|
};
|
10
10
|
export var zIndexMap = {
|
11
11
|
ISDRAGGING: 999999,
|
12
|
-
BULK:
|
13
|
-
|
12
|
+
BULK: 30000,
|
13
|
+
EDITABLE_GROUP: 20000,
|
14
|
+
CB_IN_EDITING_GROUP: 10000,
|
14
15
|
EDITING_GROUP: 9000,
|
15
16
|
GROUP: 5000,
|
16
17
|
CB: 0,
|
@@ -1,6 +1,6 @@
|
|
1
|
-
import React from
|
2
|
-
import { PropsWithChildren } from
|
3
|
-
import { ResizableProps } from
|
1
|
+
import React from 'react';
|
2
|
+
import { PropsWithChildren } from '../Draggable/types';
|
3
|
+
import { ResizableProps } from './types';
|
4
4
|
type Props = ResizableProps;
|
5
5
|
declare const Resizable: ({ children, axis, handleSize, lockAspectRatio, minConstraints, maxConstraints, resizeHandles, transformScale, isResizing, autoResize, colWidth, margin, ...props }: PropsWithChildren<Props>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
6
6
|
export default Resizable;
|
@@ -31,12 +31,12 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
31
31
|
};
|
32
32
|
import { createElement as _createElement } from "react";
|
33
33
|
import { jsx as _jsx } from "react/jsx-runtime";
|
34
|
-
import React, { useEffect, useRef } from
|
35
|
-
import { cloneElement } from
|
36
|
-
import { DraggableCore } from
|
37
|
-
import classNames from
|
34
|
+
import React, { useEffect, useRef, } from 'react';
|
35
|
+
import { cloneElement } from './utils/cloneElement';
|
36
|
+
import { DraggableCore } from '../Draggable';
|
37
|
+
import classNames from '../../external-lib/classnames';
|
38
38
|
var Resizable = function (_a) {
|
39
|
-
var children = _a.children, _b = _a.axis, axis = _b === void 0 ?
|
39
|
+
var children = _a.children, _b = _a.axis, axis = _b === void 0 ? 'both' : _b, _c = _a.handleSize, handleSize = _c === void 0 ? [20, 20] : _c, _d = _a.lockAspectRatio, lockAspectRatio = _d === void 0 ? false : _d, _e = _a.minConstraints, minConstraints = _e === void 0 ? [20, 20] : _e, _f = _a.maxConstraints, maxConstraints = _f === void 0 ? [Infinity, Infinity] : _f, _g = _a.resizeHandles, resizeHandles = _g === void 0 ? ['se'] : _g, _h = _a.transformScale, transformScale = _h === void 0 ? 1 : _h, isResizing = _a.isResizing, autoResize = _a.autoResize, colWidth = _a.colWidth, margin = _a.margin, props = __rest(_a, ["children", "axis", "handleSize", "lockAspectRatio", "minConstraints", "maxConstraints", "resizeHandles", "transformScale", "isResizing", "autoResize", "colWidth", "margin"]);
|
40
40
|
var handleRefs = useRef({
|
41
41
|
s: useRef(null),
|
42
42
|
n: useRef(null),
|
@@ -79,6 +79,29 @@ var Resizable = function (_a) {
|
|
79
79
|
if (target.clientHeight) {
|
80
80
|
minHeight.current = target.clientHeight;
|
81
81
|
}
|
82
|
+
var oneComposition = target.querySelector('.composition-container');
|
83
|
+
var isContentsList = target.id === 'contentslist-box';
|
84
|
+
if (oneComposition && isContentsList) {
|
85
|
+
// NOTE: 이건 좀 확인 필요. 근데 지금스팩엔 이게 맞아보임 (gap때문)
|
86
|
+
var minCellWidth = 10;
|
87
|
+
var minCollHeight = 11;
|
88
|
+
var numberOfItems = Number(target.getAttribute('data-number-of-items'));
|
89
|
+
var numberOfColumns = Number(target.getAttribute('data-number-of-columns'));
|
90
|
+
var rowGap = Number(target.getAttribute('data-row-gap'));
|
91
|
+
var columnGap = Number(target.getAttribute('data-column-gap'));
|
92
|
+
var compositionCols = Number(oneComposition.getAttribute('data-cols'));
|
93
|
+
var compositionRows = Number(oneComposition.getAttribute('data-rows'));
|
94
|
+
// const compositionRowHeight = Number(oneComposition.getAttribute('data-row-height')!);
|
95
|
+
// const compositionColWidth = Number(oneComposition.getAttribute('data-col-width')!);
|
96
|
+
var oneCompositionMinWidth = minCellWidth * compositionCols;
|
97
|
+
var oneCompositionMinHeight = minCollHeight * compositionRows;
|
98
|
+
var listMinWidth = Math.max(oneCompositionMinWidth * numberOfColumns + (numberOfColumns - 1) * columnGap, 0);
|
99
|
+
minWidth.current = Math.round(listMinWidth);
|
100
|
+
var numberOfRows = Math.ceil(numberOfItems / numberOfColumns);
|
101
|
+
var listMinHeight = Math.max(oneCompositionMinHeight * numberOfRows + (numberOfRows - 1) * rowGap, 0);
|
102
|
+
minHeight.current = Math.round(listMinHeight);
|
103
|
+
return;
|
104
|
+
}
|
82
105
|
// target.clientHeight -> 실제 "노드"의 height. (gridItem아닌)
|
83
106
|
if (target.clientHeight > elementRef.current.clientHeight) {
|
84
107
|
extendedHeightRef.current = target.clientHeight;
|
@@ -87,7 +110,8 @@ var Resizable = function (_a) {
|
|
87
110
|
else {
|
88
111
|
extendedHeightRef.current = null;
|
89
112
|
}
|
90
|
-
if (shouldShrinkRef.current &&
|
113
|
+
if (shouldShrinkRef.current &&
|
114
|
+
target.clientHeight < elementRef.current.clientHeight) {
|
91
115
|
minHeight.current = target.clientHeight;
|
92
116
|
}
|
93
117
|
var minWidthStyle = target.computedStyleMap().get('min-width');
|
@@ -95,7 +119,7 @@ var Resizable = function (_a) {
|
|
95
119
|
var minWidthBase = minWidthStyle.value;
|
96
120
|
var minColWidth = (minWidthBase + margin[0]) / (colWidth + margin[0]);
|
97
121
|
var minW = Math.ceil(minColWidth);
|
98
|
-
var minWidthPx =
|
122
|
+
var minWidthPx = minW * colWidth + (minW - 1) * margin[0];
|
99
123
|
minWidth.current = Math.round(minWidthPx);
|
100
124
|
}
|
101
125
|
}, [isResizing, autoResize, children, elementRef]);
|
@@ -156,28 +180,28 @@ var Resizable = function (_a) {
|
|
156
180
|
var resizableLeft = startPosition.current.left + (startSize.current.width - width);
|
157
181
|
var resizableTop = startPosition.current.top + (startSize.current.height - height);
|
158
182
|
if (deltaX < 0) {
|
159
|
-
if (handleAxis ===
|
183
|
+
if (handleAxis === 'nw' || handleAxis === 'w' || handleAxis === 'sw') {
|
160
184
|
if (currentSumOfLeftAndWidth > startSumOfLeftAndWidth) {
|
161
185
|
newLeft = Math.min(left, resizableLeft);
|
162
186
|
}
|
163
187
|
}
|
164
188
|
}
|
165
189
|
if (deltaY < 0) {
|
166
|
-
if (handleAxis ===
|
190
|
+
if (handleAxis === 'nw' || handleAxis === 'n' || handleAxis === 'ne') {
|
167
191
|
if (currentSumOfTopAndHeight > startSumOfTopAndHeight) {
|
168
192
|
newTop = Math.min(top, resizableTop);
|
169
193
|
}
|
170
194
|
}
|
171
195
|
}
|
172
196
|
if (deltaX > 0) {
|
173
|
-
if (handleAxis ===
|
197
|
+
if (handleAxis === 'nw' || handleAxis === 'w' || handleAxis === 'sw') {
|
174
198
|
if (width >= minConstraints[0]) {
|
175
199
|
newLeft = Math.max(left, resizableLeft);
|
176
200
|
}
|
177
201
|
}
|
178
202
|
}
|
179
203
|
if (deltaY > 0) {
|
180
|
-
if (handleAxis ===
|
204
|
+
if (handleAxis === 'nw' || handleAxis === 'n' || handleAxis === 'ne') {
|
181
205
|
if (height >= minConstraints[1]) {
|
182
206
|
newTop = Math.max(top, resizableTop);
|
183
207
|
}
|
@@ -190,7 +214,7 @@ var Resizable = function (_a) {
|
|
190
214
|
var _b, _c;
|
191
215
|
var _d, _e, _f, _g, _h, _j;
|
192
216
|
var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
|
193
|
-
if (handlerName ===
|
217
|
+
if (handlerName === 'onResizeStart') {
|
194
218
|
var position = { top: (_d = props.top) !== null && _d !== void 0 ? _d : 0, left: (_e = props.left) !== null && _e !== void 0 ? _e : 0 };
|
195
219
|
startPosition.current = position;
|
196
220
|
startSize.current = {
|
@@ -199,12 +223,12 @@ var Resizable = function (_a) {
|
|
199
223
|
};
|
200
224
|
resetData();
|
201
225
|
}
|
202
|
-
var canDragX = (axis ===
|
203
|
-
handleAxis !==
|
204
|
-
handleAxis !==
|
205
|
-
var canDragY = (axis ===
|
206
|
-
handleAxis !==
|
207
|
-
handleAxis !==
|
226
|
+
var canDragX = (axis === 'both' || axis === 'x') &&
|
227
|
+
handleAxis !== 'n' &&
|
228
|
+
handleAxis !== 's';
|
229
|
+
var canDragY = (axis === 'both' || axis === 'y') &&
|
230
|
+
handleAxis !== 'e' &&
|
231
|
+
handleAxis !== 'w';
|
208
232
|
if (!canDragX && !canDragY)
|
209
233
|
return;
|
210
234
|
var axisV = handleAxis[0];
|
@@ -222,21 +246,20 @@ var Resizable = function (_a) {
|
|
222
246
|
// }
|
223
247
|
// }
|
224
248
|
lastHandleRectRef.current = handleRect;
|
225
|
-
if (axisH ===
|
249
|
+
if (axisH === 'w') {
|
226
250
|
deltaX = -deltaX;
|
227
251
|
}
|
228
|
-
if (axisV ===
|
252
|
+
if (axisV === 'n') {
|
229
253
|
deltaY = -deltaY;
|
230
254
|
}
|
231
|
-
console.log(deltaX);
|
232
255
|
var width = props.width + (canDragX ? deltaX / transformScale : 0);
|
233
256
|
var height = props.height + (canDragY ? deltaY / transformScale : 0);
|
234
257
|
var left = (_h = props === null || props === void 0 ? void 0 : props.left) !== null && _h !== void 0 ? _h : 0;
|
235
258
|
var top = (_j = props === null || props === void 0 ? void 0 : props.top) !== null && _j !== void 0 ? _j : 0;
|
236
|
-
if (axisV ===
|
259
|
+
if (axisV === 'n') {
|
237
260
|
top = top - deltaY;
|
238
261
|
}
|
239
|
-
if (axisH ===
|
262
|
+
if (axisH === 'w') {
|
240
263
|
left = left - deltaX;
|
241
264
|
}
|
242
265
|
_b = checkConstraints(width, height), width = _b[0], height = _b[1];
|
@@ -245,12 +268,12 @@ var Resizable = function (_a) {
|
|
245
268
|
}
|
246
269
|
_c = checkTopLeft(deltaX, deltaY, top, left, width, height, handleAxis), top = _c[0], left = _c[1];
|
247
270
|
var isDimensionsChanged = width !== props.width || height !== props.height;
|
248
|
-
var cb = typeof props[handlerName] ===
|
249
|
-
var isCbSkipped = handlerName ===
|
271
|
+
var cb = typeof props[handlerName] === 'function' ? props[handlerName] : null;
|
272
|
+
var isCbSkipped = handlerName === 'onResize' && !isDimensionsChanged;
|
250
273
|
if (cb && !isCbSkipped) {
|
251
274
|
cb(e, { node: node, size: { width: width, height: height, top: top, left: left }, handle: handleAxis });
|
252
275
|
}
|
253
|
-
if (handlerName ===
|
276
|
+
if (handlerName === 'onResizeStop') {
|
254
277
|
startPosition.current = null;
|
255
278
|
startSize.current = null;
|
256
279
|
resetData();
|
@@ -261,10 +284,10 @@ var Resizable = function (_a) {
|
|
261
284
|
if (!handle) {
|
262
285
|
return (_jsx("span", { className: "react-resizable-handle react-resizable-handle-".concat(handleAxis), ref: ref }));
|
263
286
|
}
|
264
|
-
if (typeof handle ===
|
287
|
+
if (typeof handle === 'function') {
|
265
288
|
return handle(handleAxis, ref);
|
266
289
|
}
|
267
|
-
var isDOMElement = typeof handle.type ===
|
290
|
+
var isDOMElement = typeof handle.type === 'string';
|
268
291
|
var props = __assign({ ref: ref }, (isDOMElement ? {} : { handleAxis: handleAxis }));
|
269
292
|
return React.cloneElement(handle, props);
|
270
293
|
};
|
@@ -273,7 +296,7 @@ var Resizable = function (_a) {
|
|
273
296
|
React.Children.map(children.props.children, function (child) { return child; })
|
274
297
|
], resizeHandles.map(function (handleAxis) {
|
275
298
|
var ref = (handleRefs === null || handleRefs === void 0 ? void 0 : handleRefs.current) && handleRefs.current[handleAxis];
|
276
|
-
return (_createElement(DraggableCore, __assign({}, draggableOpts, { nodeRef: ref, key: "resizableHandle-".concat(handleAxis), onStop: resizeHandler(
|
299
|
+
return (_createElement(DraggableCore, __assign({}, draggableOpts, { nodeRef: ref, key: "resizableHandle-".concat(handleAxis), onStop: resizeHandler('onResizeStop', handleAxis), onStart: resizeHandler('onResizeStart', handleAxis), onDrag: resizeHandler('onResize', handleAxis) }), renderResizeHandle(handleAxis, ref)));
|
277
300
|
}), true) }));
|
278
301
|
};
|
279
302
|
function removeNorthHandle(axis) {
|