From 993dfdcdcafc72861e4ffd2aaf7bb97a0674e8b5 Mon Sep 17 00:00:00 2001 From: bokuweb Date: Sun, 21 Apr 2024 12:50:35 +0900 Subject: [PATCH 1/5] fix: 713 --- src/index.tsx | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index 59e0ef25..e22e12d0 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -803,10 +803,13 @@ export class Resizable extends React.PureComponent { const newGridWidth = snap(newWidth, this.props.grid[0]); const newGridHeight = snap(newHeight, this.props.grid[1]); const gap = this.props.snapGap || 0; - widthChangedWithGrid = gap === 0 || Math.abs(newGridWidth - newWidth) <= gap; - heightChangedWithGrid = gap === 0 || Math.abs(newGridHeight - newHeight) <= gap; - newWidth = widthChangedWithGrid ? newGridWidth : newWidth; - newHeight = heightChangedWithGrid ? newGridHeight : newHeight; + const w = gap === 0 || Math.abs(newGridWidth - newWidth) <= gap ? newGridWidth : newWidth; + const h = gap === 0 || Math.abs(newGridHeight - newHeight) <= gap ? newGridHeight : newHeight; + widthChangedWithGrid = w !== newWidth; + heightChangedWithGrid = h !== newHeight; + newWidth = w; + newHeight = h; + } const delta = { From bc722dc11bbf238c1bcb911b6caf66de98d20e43 Mon Sep 17 00:00:00 2001 From: bokuweb Date: Sun, 21 Apr 2024 12:51:59 +0900 Subject: [PATCH 2/5] 6.9.13 --- CHANGELOG.md | 2 +- package.json | 2 +- src/index.tsx | 1 - 3 files changed, 2 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a2aa740d..5f67092a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -21,7 +21,7 @@ ### :house: Internal --> -## [6.9.12 (2024-04-21)](https://github.com/bokuweb/re-resizable/compare/v6.9.12...v6.9.11) +## [6.9.13 (2024-04-21)](https://github.com/bokuweb/re-resizable/compare/v6.9.13...v6.9.11) ### :bug: Bug Fix diff --git a/package.json b/package.json index e019c0fb..a7fa6427 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "re-resizable", - "version": "6.9.12", + "version": "6.9.13", "description": "Resizable component for React.", "title": "re-resizable", "main": "./lib/index.es5.js", diff --git a/src/index.tsx b/src/index.tsx index e22e12d0..975128c4 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -809,7 +809,6 @@ export class Resizable extends React.PureComponent { heightChangedWithGrid = h !== newHeight; newWidth = w; newHeight = h; - } const delta = { From be5dcd6cf93ca57ce9887a3c9f2ffd20fc0dee6c Mon Sep 17 00:00:00 2001 From: bokuweb Date: Sun, 21 Apr 2024 13:07:48 +0900 Subject: [PATCH 3/5] fix: onResize --- src/index.tsx | 11 +++-------- stories/auto.stories.tsx | 6 +++++- stories/snap.stories.tsx | 15 +++++++++++++-- 3 files changed, 21 insertions(+), 11 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index 975128c4..ecc8c63c 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -797,16 +797,12 @@ export class Resizable extends React.PureComponent { newWidth = newSize.newWidth; newHeight = newSize.newHeight; - let widthChangedWithGrid = false; - let heightChangedWithGrid = false; if (this.props.grid) { const newGridWidth = snap(newWidth, this.props.grid[0]); const newGridHeight = snap(newHeight, this.props.grid[1]); const gap = this.props.snapGap || 0; const w = gap === 0 || Math.abs(newGridWidth - newWidth) <= gap ? newGridWidth : newWidth; const h = gap === 0 || Math.abs(newGridHeight - newHeight) <= gap ? newGridHeight : newHeight; - widthChangedWithGrid = w !== newWidth; - heightChangedWithGrid = h !== newHeight; newWidth = w; newHeight = h; } @@ -853,16 +849,15 @@ export class Resizable extends React.PureComponent { newState.flexBasis = newState.height; } + const widthChanged = this.state.width !== newState.width; + const heightChanged = this.state.height !== newState.height; // For v18, update state sync flushSync(() => { this.setState(newState); }); if (this.props.onResize) { - if (!this.props.grid) { - this.props.onResize(event, direction, this.resizable, delta); - // fix #783 - } else if (widthChangedWithGrid || heightChangedWithGrid) { + if (widthChanged || heightChanged) { this.props.onResize(event, direction, this.resizable, delta); } } diff --git a/stories/auto.stories.tsx b/stories/auto.stories.tsx index 9bd450d7..08471b49 100644 --- a/stories/auto.stories.tsx +++ b/stories/auto.stories.tsx @@ -4,7 +4,11 @@ import { storiesOf } from '@storybook/react'; import { style } from './style'; storiesOf('auto', module) - .add('default', () => 001) + .add('default', () => ( + console.log(e)}> + 001 + + )) .add('height', () => ( { + console.log(a); + }} > 001 )) .add('grid', () => ( - + { + console.log(a); + }} + > 001 )); From 9a2ac35d8250ad0c32f81f0a16ebfe6730e9d885 Mon Sep 17 00:00:00 2001 From: bokuweb Date: Sun, 21 Apr 2024 13:10:37 +0900 Subject: [PATCH 4/5] fix: onResize --- src/index.tsx | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index ecc8c63c..352f19d9 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -851,13 +851,18 @@ export class Resizable extends React.PureComponent { const widthChanged = this.state.width !== newState.width; const heightChanged = this.state.height !== newState.height; - // For v18, update state sync - flushSync(() => { - this.setState(newState); - }); + const flexBaseChanged = this.state.flexBasis !== newState.flexBasis; + const changed = widthChanged || heightChanged || flexBaseChanged; + + if (changed) { + // For v18, update state sync + flushSync(() => { + this.setState(newState); + }); + } if (this.props.onResize) { - if (widthChanged || heightChanged) { + if (changed) { this.props.onResize(event, direction, this.resizable, delta); } } From 6bb166f5f174cfa1e5a1fe20fc1c4272d2eecbda Mon Sep 17 00:00:00 2001 From: bokuweb Date: Sun, 21 Apr 2024 13:11:13 +0900 Subject: [PATCH 5/5] 6.9.14 --- CHANGELOG.md | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 5f67092a..84c5455c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -21,7 +21,7 @@ ### :house: Internal --> -## [6.9.13 (2024-04-21)](https://github.com/bokuweb/re-resizable/compare/v6.9.13...v6.9.11) +## [6.9.14 (2024-04-21)](https://github.com/bokuweb/re-resizable/compare/v6.9.14...v6.9.11) ### :bug: Bug Fix diff --git a/package.json b/package.json index a7fa6427..0ab3ef9f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "re-resizable", - "version": "6.9.13", + "version": "6.9.14", "description": "Resizable component for React.", "title": "re-resizable", "main": "./lib/index.es5.js",