Wrong size when resizing diagonally with lockAspectRatio
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 55/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- react, typescript
- Domain
- frontend
Research direction
Start with the ResizableBox and Resizable behavior using lockAspectRatio, then run the linked CodeSandbox reproduction and compare diagonal resizing with version 2.0.0 versus 3.0.0 or later. The fix is done when diagonal resizing tracks the cursor without cumulative size errors, including resizing large components smaller and vice versa.
Written by the indexing model from the issue text.
Description
Thanks for opening an issue!
Please select the type of issue you're reporting. For questions.
- Bug
- Feature Request
- Question
Problem Report
If lockAspectRatio option is set to true and you resize ResizableBox/Resizable diagonally, the size is wrong, the content is resized way faster than the mouse cursor moves. The issue is cumulative and is more noticeable while resizing a large ResizableBox/Resizable to a smaller one or vice versa.
It can be reproduced on version 3.0.0 and higher (see attached video resizable-3.0.4), but on version 2.0.0 and lower everything is ok (see attached video resizable-2.0.0) .
System Info
Node Version: v16.16.0
Browser: Google Chrome 113.0.5672.127
OS: Windows 10
Reproduction
https://codesandbox.io/s/long-https-uoun8f?file=/src/ResizableBox.js
- Dominant language
- TypeScript
- Stars
- 2.6k
- Forks
- 372
- PR merge metrics
- No merged PRs in 30d
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from react-grid-layout/react-resizable
-
Difficulty 4/5 3-5 days Newbie friendliness 38/100
react-grid-layout/react-resizable#237 · 8 comments · 1 reaction ·
All issues in react-grid-layout/react-resizable
Similar issues
-
bug(cli): hapi doctor inline-media prints a fabricated B:\ helper-script path in packaged installs Open
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
-
Crush Open
Difficulty 1/5 Under an hour Newbie friendliness 85/100
catppuccin/catppuccin#3125 ·
-
Add a SECURITY.md Open
Difficulty 1/5 Under an hour Newbie friendliness 90/100
ElementsProject/cln-application#167 · 1 comment · 1 reaction ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
Quantco/pnpm-licenses#17 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100