publ-echo-test 0.0.50 → 0.0.52
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/Resizable/Resizable.js +32 -25
- package/package.json +1 -1
@@ -48,8 +48,8 @@ var Resizable = function (_a) {
|
|
48
48
|
});
|
49
49
|
var startPosition = useRef(null);
|
50
50
|
var startSize = useRef(null);
|
51
|
-
var
|
52
|
-
var slack = null;
|
51
|
+
var lastHandleRectRef = useRef(null);
|
52
|
+
var slack = useRef(null);
|
53
53
|
var className = props.className, draggableOpts = props.draggableOpts, width = props.width, height = props.height, handle = props.handle, onResize = props.onResize, onResizeStop = props.onResizeStop, onResizeStart = props.onResizeStart, restProps = __rest(props, ["className", "draggableOpts", "width", "height", "handle", "onResize", "onResizeStop", "onResizeStart"]);
|
54
54
|
var elementRef = children.ref;
|
55
55
|
var extendedHeightRef = useRef(null);
|
@@ -95,11 +95,13 @@ var Resizable = function (_a) {
|
|
95
95
|
}
|
96
96
|
}, [isResizing, autoResize, children, elementRef]);
|
97
97
|
var resetData = function () {
|
98
|
-
|
98
|
+
lastHandleRectRef.current = null;
|
99
|
+
slack.current = null;
|
99
100
|
};
|
100
101
|
// NOTE - 최소 또는 최대 제약 조건 width와 height 계산, 비율 고정 계산
|
101
102
|
var checkConstraints = function (width, height) {
|
102
|
-
|
103
|
+
var _a;
|
104
|
+
if (!maxConstraints && !lockAspectRatio) {
|
103
105
|
return [width, height];
|
104
106
|
}
|
105
107
|
if (lockAspectRatio) {
|
@@ -113,19 +115,26 @@ var Resizable = function (_a) {
|
|
113
115
|
width = height * ratio;
|
114
116
|
}
|
115
117
|
}
|
116
|
-
var
|
117
|
-
var
|
118
|
+
var _b = [width, height], oldW = _b[0], oldH = _b[1];
|
119
|
+
var _c = (_a = slack.current) !== null && _a !== void 0 ? _a : [0, 0], slackW = _c[0], slackH = _c[1];
|
118
120
|
width += slackW;
|
119
121
|
height += slackH;
|
120
|
-
if (
|
121
|
-
width = Math.max(
|
122
|
-
height = Math.max(
|
122
|
+
if (autoResize) {
|
123
|
+
width = Math.max(minWidth.current, width);
|
124
|
+
height = Math.max(minHeight.current, height);
|
125
|
+
}
|
126
|
+
else {
|
127
|
+
if (minConstraints) {
|
128
|
+
width = Math.max(minConstraints[0], width);
|
129
|
+
height = Math.max(minConstraints[1], height);
|
130
|
+
}
|
123
131
|
}
|
124
132
|
if (maxConstraints) {
|
125
133
|
width = Math.min(maxConstraints[0], width);
|
126
134
|
height = Math.min(maxConstraints[1], height);
|
127
135
|
}
|
128
|
-
slack = [slackW + (oldW - width), slackH + (oldH - height)];
|
136
|
+
slack.current = [slackW + (oldW - width), slackH + (oldH - height)];
|
137
|
+
// console.log([slackW, slackH]);
|
129
138
|
return [width, height];
|
130
139
|
};
|
131
140
|
var checkTopLeft = function (deltaX, deltaY, top, left, width, height, handleAxis) {
|
@@ -172,7 +181,7 @@ var Resizable = function (_a) {
|
|
172
181
|
var resizeHandler = function (handlerName, handleAxis) {
|
173
182
|
return function (e, _a) {
|
174
183
|
var _b, _c;
|
175
|
-
var _d, _e, _f, _g, _h, _j
|
184
|
+
var _d, _e, _f, _g, _h, _j;
|
176
185
|
var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
|
177
186
|
if (handlerName === "onResizeStart") {
|
178
187
|
var position = { top: (_d = props.top) !== null && _d !== void 0 ? _d : 0, left: (_e = props.left) !== null && _e !== void 0 ? _e : 0 };
|
@@ -194,26 +203,24 @@ var Resizable = function (_a) {
|
|
194
203
|
var axisV = handleAxis[0];
|
195
204
|
var axisH = handleAxis[handleAxis.length - 1];
|
196
205
|
var handleRect = node.getBoundingClientRect();
|
197
|
-
// if (
|
206
|
+
// if (lastHandleRectRef.current !== null) {
|
198
207
|
// if (axisH === "w") {
|
199
|
-
// const deltaLeftSinceLast = handleRect.left -
|
208
|
+
// const deltaLeftSinceLast = handleRect.left - lastHandleRectRef.current.left;
|
209
|
+
// console.log('delta, :', deltaLeftSinceLast);
|
200
210
|
// deltaX += deltaLeftSinceLast;
|
201
211
|
// }
|
202
212
|
// if (axisV === "n") {
|
203
|
-
// const deltaTopSinceLast = handleRect.top -
|
213
|
+
// const deltaTopSinceLast = handleRect.top - lastHandleRectRef.current.top;
|
204
214
|
// deltaY += deltaTopSinceLast;
|
205
215
|
// }
|
206
216
|
// }
|
207
|
-
|
217
|
+
lastHandleRectRef.current = handleRect;
|
208
218
|
if (axisH === "w") {
|
209
219
|
deltaX = -deltaX;
|
210
220
|
}
|
211
221
|
if (axisV === "n") {
|
212
222
|
deltaY = -deltaY;
|
213
223
|
}
|
214
|
-
if (shouldShrinkRef.current) {
|
215
|
-
deltaY = 0;
|
216
|
-
}
|
217
224
|
var width = props.width + (canDragX ? deltaX / transformScale : 0);
|
218
225
|
var height = props.height + (canDragY ? deltaY / transformScale : 0);
|
219
226
|
var left = (_h = props === null || props === void 0 ? void 0 : props.left) !== null && _h !== void 0 ? _h : 0;
|
@@ -226,20 +233,20 @@ var Resizable = function (_a) {
|
|
226
233
|
}
|
227
234
|
// width = Math.max(width, minWidth.current);
|
228
235
|
// const isOverMin = calcWH()
|
229
|
-
if (minHeight.current) {
|
230
|
-
|
231
|
-
}
|
232
|
-
|
233
|
-
|
236
|
+
// if (minHeight.current) {
|
237
|
+
// height = Math.max(minHeight.current, height);
|
238
|
+
// }
|
239
|
+
_b = checkConstraints(width, height), width = _b[0], height = _b[1];
|
240
|
+
if (extendedHeightRef.current === height) {
|
234
241
|
handleAxis = removeNorthHandle(handleAxis);
|
235
242
|
}
|
236
|
-
_b = checkConstraints(width, height), width = _b[0], height = _b[1];
|
237
243
|
_c = checkTopLeft(deltaX, deltaY, top, left, width, height, handleAxis), top = _c[0], left = _c[1];
|
238
244
|
var isDimensionsChanged = width !== props.width || height !== props.height;
|
239
245
|
var cb = typeof props[handlerName] === "function" ? props[handlerName] : null;
|
240
246
|
var isCbSkipped = handlerName === "onResize" && !isDimensionsChanged;
|
241
247
|
if (cb && !isCbSkipped) {
|
242
|
-
cb(e, { node
|
248
|
+
// cb(e, { node, size: { width, height, top, left }, handle: handleAxis, minWidth: minWidth.current, minHeight: minHeight.current ?? 0 });
|
249
|
+
cb(e, { node: node, size: { width: width, height: height, top: top, left: left }, handle: handleAxis });
|
243
250
|
}
|
244
251
|
if (handlerName === "onResizeStop") {
|
245
252
|
startPosition.current = null;
|