Skip to content

Commit

Permalink
Define callback refs inline to work with latest versions of Next.js /…
Browse files Browse the repository at this point in the history
… React (#819)

Callback refs defined as class functions don't get invoked in
Next.js 14.2+ – and therefore don't work – perhaps because of changes
to the underlying React which is at or near version 19.
  • Loading branch information
jmurty authored May 26, 2024
1 parent e452a06 commit 57d116f
Showing 1 changed file with 12 additions and 7 deletions.
19 changes: 12 additions & 7 deletions src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -926,12 +926,6 @@ export class Resizable extends React.PureComponent<ResizableProps, State> {
);
}

ref = (c: HTMLElement | null) => {
if (c) {
this.resizable = c;
}
};

render() {
const extendsProps = Object.keys(this.props).reduce((acc, key) => {
if (definedProps.indexOf(key) !== -1) {
Expand Down Expand Up @@ -961,7 +955,18 @@ export class Resizable extends React.PureComponent<ResizableProps, State> {
const Wrapper = this.props.as || 'div';

return (
<Wrapper ref={this.ref} style={style} className={this.props.className} {...extendsProps}>
<Wrapper
style={style}
className={this.props.className}
{...extendsProps}
// `ref` is after `extendsProps` to ensure this one wins over a version
// passed in
ref={(c: HTMLElement | null) => {
if (c) {
this.resizable = c;
}
}}
>
{this.state.isResizing && <div style={this.state.backgroundStyle} />}
{this.props.children}
{this.renderResizer()}
Expand Down

0 comments on commit 57d116f

Please sign in to comment.