publ-echo-test 0.0.50 → 0.0.51
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 +26 -22
- 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,10 +115,12 @@ 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;
|
122
|
+
var minConstraints = [minWidth.current, minHeight.current];
|
123
|
+
// const maxConstraints = [300, 300];
|
120
124
|
if (minConstraints) {
|
121
125
|
width = Math.max(minConstraints[0], width);
|
122
126
|
height = Math.max(minConstraints[1], height);
|
@@ -125,7 +129,9 @@ var Resizable = function (_a) {
|
|
125
129
|
width = Math.min(maxConstraints[0], width);
|
126
130
|
height = Math.min(maxConstraints[1], height);
|
127
131
|
}
|
128
|
-
|
132
|
+
console.log(oldW, width);
|
133
|
+
slack.current = [slackW + (oldW - width), slackH + (oldH - height)];
|
134
|
+
// console.log([slackW, slackH]);
|
129
135
|
return [width, height];
|
130
136
|
};
|
131
137
|
var checkTopLeft = function (deltaX, deltaY, top, left, width, height, handleAxis) {
|
@@ -172,7 +178,7 @@ var Resizable = function (_a) {
|
|
172
178
|
var resizeHandler = function (handlerName, handleAxis) {
|
173
179
|
return function (e, _a) {
|
174
180
|
var _b, _c;
|
175
|
-
var _d, _e, _f, _g, _h, _j
|
181
|
+
var _d, _e, _f, _g, _h, _j;
|
176
182
|
var node = _a.node, deltaX = _a.deltaX, deltaY = _a.deltaY;
|
177
183
|
if (handlerName === "onResizeStart") {
|
178
184
|
var position = { top: (_d = props.top) !== null && _d !== void 0 ? _d : 0, left: (_e = props.left) !== null && _e !== void 0 ? _e : 0 };
|
@@ -194,26 +200,24 @@ var Resizable = function (_a) {
|
|
194
200
|
var axisV = handleAxis[0];
|
195
201
|
var axisH = handleAxis[handleAxis.length - 1];
|
196
202
|
var handleRect = node.getBoundingClientRect();
|
197
|
-
// if (
|
203
|
+
// if (lastHandleRectRef.current !== null) {
|
198
204
|
// if (axisH === "w") {
|
199
|
-
// const deltaLeftSinceLast = handleRect.left -
|
205
|
+
// const deltaLeftSinceLast = handleRect.left - lastHandleRectRef.current.left;
|
206
|
+
// console.log('delta, :', deltaLeftSinceLast);
|
200
207
|
// deltaX += deltaLeftSinceLast;
|
201
208
|
// }
|
202
209
|
// if (axisV === "n") {
|
203
|
-
// const deltaTopSinceLast = handleRect.top -
|
210
|
+
// const deltaTopSinceLast = handleRect.top - lastHandleRectRef.current.top;
|
204
211
|
// deltaY += deltaTopSinceLast;
|
205
212
|
// }
|
206
213
|
// }
|
207
|
-
|
214
|
+
lastHandleRectRef.current = handleRect;
|
208
215
|
if (axisH === "w") {
|
209
216
|
deltaX = -deltaX;
|
210
217
|
}
|
211
218
|
if (axisV === "n") {
|
212
219
|
deltaY = -deltaY;
|
213
220
|
}
|
214
|
-
if (shouldShrinkRef.current) {
|
215
|
-
deltaY = 0;
|
216
|
-
}
|
217
221
|
var width = props.width + (canDragX ? deltaX / transformScale : 0);
|
218
222
|
var height = props.height + (canDragY ? deltaY / transformScale : 0);
|
219
223
|
var left = (_h = props === null || props === void 0 ? void 0 : props.left) !== null && _h !== void 0 ? _h : 0;
|
@@ -226,20 +230,20 @@ var Resizable = function (_a) {
|
|
226
230
|
}
|
227
231
|
// width = Math.max(width, minWidth.current);
|
228
232
|
// const isOverMin = calcWH()
|
229
|
-
if (minHeight.current) {
|
230
|
-
|
231
|
-
}
|
232
|
-
|
233
|
-
|
233
|
+
// if (minHeight.current) {
|
234
|
+
// height = Math.max(minHeight.current, height);
|
235
|
+
// }
|
236
|
+
_b = checkConstraints(width, height), width = _b[0], height = _b[1];
|
237
|
+
if (extendedHeightRef.current === height) {
|
234
238
|
handleAxis = removeNorthHandle(handleAxis);
|
235
239
|
}
|
236
|
-
_b = checkConstraints(width, height), width = _b[0], height = _b[1];
|
237
240
|
_c = checkTopLeft(deltaX, deltaY, top, left, width, height, handleAxis), top = _c[0], left = _c[1];
|
238
241
|
var isDimensionsChanged = width !== props.width || height !== props.height;
|
239
242
|
var cb = typeof props[handlerName] === "function" ? props[handlerName] : null;
|
240
243
|
var isCbSkipped = handlerName === "onResize" && !isDimensionsChanged;
|
241
244
|
if (cb && !isCbSkipped) {
|
242
|
-
cb(e, { node
|
245
|
+
// cb(e, { node, size: { width, height, top, left }, handle: handleAxis, minWidth: minWidth.current, minHeight: minHeight.current ?? 0 });
|
246
|
+
cb(e, { node: node, size: { width: width, height: height, top: top, left: left }, handle: handleAxis });
|
243
247
|
}
|
244
248
|
if (handlerName === "onResizeStop") {
|
245
249
|
startPosition.current = null;
|