fix: prevent resize drift caused by stale props between renders

[WhiteMinds]

Problem

When dragging a resize handle quickly, the element resizes progressively slower than the mouse cursor. The further you drag, the bigger the offset becomes.

Root Cause

In resizeHandler, the new size is computed as:

let width = this.props.width + deltaX / this.props.transformScale;

this.props.width depends on the parent re-rendering with updated props. When React can't re-render between consecutive mousemove events (common during fast dragging), multiple events share the same stale props.width:

Render #1: props.width = 200
  mousemove A: delta=3 → width = 200+3 = 203 → callback(203)
  mousemove B: delta=2 → width = 200+2 = 202 → callback(202)  ← overwrites 203
Render #2: props.width = 202 (3px delta from event A is lost)

This issue was already recognized for onResizeStop in #250 / a09f782, which introduced this.lastSize to avoid stale props. However the same stale-props problem also affects onResize during the drag.

Fix

Use this.lastSize (already tracked) as the base for delta calculation during onResize, falling back to this.props for the first event when lastSize is not yet set:

const baseWidth = this.lastSize?.width ?? this.props.width;
let width = baseWidth + (canDragX ? deltaX / this.props.transformScale : 0);

This is a 2-line change that extends the existing lastSize mechanism to cover the full resize lifecycle, not just the stop event.

Summary by CodeRabbit

• Bug Fixes
  • Enhanced resize accuracy and responsiveness during continuous dragging operations. The resizable component now more effectively tracks size changes across consecutive drag events, eliminating movement data loss and stuttering. Users will experience noticeably smoother and more consistent resizing behavior, particularly during rapid or sustained resize interactions.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between edc7cbd and f9ed729.

📒 Files selected for processing (1)

• lib/Resizable.js

---

📝 Walkthrough

Walkthrough

The change updates resize calculation logic in Resizable.js to use lastSize as a fallback source for base dimensions during drag events, improving handling of batched React re-renders while maintaining constraint application and stop event behavior.

Changes

Cohort / File(s)	Summary
Resize calculation optimization lib/Resizable.js	Updated width/height resize calculations to use lastSize as fallback for base dimensions, reducing delta loss during consecutive drag events in batched React re-renders. Documentation comment and onResizeStop logic updated accordingly.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 When drags cascade and batches blend,
We grasp the lastSize, a faithful friend,
No delta lost to React's swift flow,
Just smooth resizing, to and fro! ✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title 'fix: prevent resize drift caused by stale props between renders' directly summarizes the main change—using lastSize instead of stale props to prevent resize drift during consecutive drag events.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[STRML]

Thanks much.

[manbearwiz]

@STRML do you have an idea of when this might be released? We are also running into this issue.

[STRML]

@manbearwiz @3.2.0