From f9ed72920d792e604fe46335e595a9a1f9456882 Mon Sep 17 00:00:00 2001 From: WhiteMind Date: Sat, 28 Feb 2026 00:49:58 +0800 Subject: [PATCH] fix: prevent resize drift caused by stale props between renders When React can't re-render between consecutive mousemove events, this.props.width is stale and intermediate deltas are lost, causing progressive drift where the element resizes slower than the mouse. Use this.lastSize (already tracked for onResizeStop) as the base for delta calculation during onResize, falling back to props for the first event. --- lib/Resizable.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/lib/Resizable.js b/lib/Resizable.js index 44f6b8f7..e12a29d3 100644 --- a/lib/Resizable.js +++ b/lib/Resizable.js @@ -127,8 +127,12 @@ export default class Resizable extends React.Component { if (axisV === 'n') deltaY = -deltaY; // Update w/h by the deltas. Also factor in transformScale. - let width = this.props.width + (canDragX ? deltaX / this.props.transformScale : 0); - let height = this.props.height + (canDragY ? deltaY / this.props.transformScale : 0); + // Use lastSize (if available) instead of props to avoid losing deltas + // when React can't re-render between consecutive mouse events. + const baseWidth = this.lastSize?.width ?? this.props.width; + const baseHeight = this.lastSize?.height ?? this.props.height; + let width = baseWidth + (canDragX ? deltaX / this.props.transformScale : 0); + let height = baseHeight + (canDragY ? deltaY / this.props.transformScale : 0); // Run user-provided constraints. [width, height] = this.runConstraints(width, height);