react-grid-layout 1.2.3 → 1.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// @flow
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import PropTypes from "prop-types";
|
|
4
|
+
import classNames from "classnames";
|
|
4
5
|
import type { ReactRef } from "../ReactGridLayoutPropTypes";
|
|
5
6
|
|
|
6
7
|
type WPDefaultProps = {|
|
|
@@ -26,6 +27,8 @@ type ComposedProps<Config> = {|
|
|
|
26
27
|
width?: number
|
|
27
28
|
|};
|
|
28
29
|
|
|
30
|
+
const layoutClassName = "react-grid-layout";
|
|
31
|
+
|
|
29
32
|
/*
|
|
30
33
|
* A simple HOC that provides facility for listening to container resizes.
|
|
31
34
|
*
|
|
@@ -54,8 +57,10 @@ export default function WidthProvideRGL<Config>(
|
|
|
54
57
|
};
|
|
55
58
|
|
|
56
59
|
elementRef: ReactRef<HTMLDivElement> = React.createRef();
|
|
60
|
+
mounted: boolean = false;
|
|
57
61
|
|
|
58
62
|
componentDidMount() {
|
|
63
|
+
this.mounted = true;
|
|
59
64
|
window.addEventListener("resize", this.onWindowResize);
|
|
60
65
|
// Call to properly set the breakpoint and resize the elements.
|
|
61
66
|
// Note that if you're doing a full-width element, this can get a little wonky if a scrollbar
|
|
@@ -64,21 +69,30 @@ export default function WidthProvideRGL<Config>(
|
|
|
64
69
|
}
|
|
65
70
|
|
|
66
71
|
componentWillUnmount() {
|
|
72
|
+
this.mounted = false;
|
|
67
73
|
window.removeEventListener("resize", this.onWindowResize);
|
|
68
74
|
}
|
|
69
75
|
|
|
70
76
|
onWindowResize = () => {
|
|
77
|
+
if (!this.mounted) return;
|
|
71
78
|
const node = this.elementRef.current; // Flow casts this to Text | Element
|
|
72
|
-
|
|
79
|
+
// fix: grid position error when node or parentNode display is none by window resize
|
|
80
|
+
// #924 #1084
|
|
81
|
+
if (node instanceof HTMLElement && node.offsetWidth) {
|
|
73
82
|
this.setState({ width: node.offsetWidth });
|
|
74
83
|
}
|
|
75
84
|
};
|
|
76
85
|
|
|
77
86
|
render() {
|
|
78
87
|
const { measureBeforeMount, ...rest } = this.props;
|
|
79
|
-
if (measureBeforeMount && !this.
|
|
88
|
+
if (measureBeforeMount && !this.mounted) {
|
|
80
89
|
return (
|
|
81
|
-
<div
|
|
90
|
+
<div
|
|
91
|
+
className={classNames(this.props.className, layoutClassName)}
|
|
92
|
+
style={this.props.style}
|
|
93
|
+
// $FlowIgnore ref types
|
|
94
|
+
ref={this.elementRef}
|
|
95
|
+
/>
|
|
82
96
|
);
|
|
83
97
|
}
|
|
84
98
|
|