Removed the render prop from the ContainerQuery component

Author: ZeeCoder

CHANGELOG.md

@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+### Removed
+
+- `react-container-query`
+  - Removed the "render" prop in favour of using children. (The former was not
+    even documented.)
+
 ## [3.0.0-alpha.1]
 
 ### Fixed

packages/react-container-query/.babelrc

@@ -17,5 +17,8 @@
       }
     ]
   ],
-  "plugins": ["@babel/plugin-proposal-object-rest-spread"]
+  "plugins": [
+    "@babel/plugin-proposal-object-rest-spread",
+    "@babel/plugin-proposal-class-properties"
+  ]
 }

packages/react-container-query/package.json

@@ -24,6 +24,7 @@
   },
   "devDependencies": {
     "@babel/core": "^7.1.6",
+    "@babel/plugin-proposal-class-properties": "^7.2.1",
     "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
     "@babel/preset-env": "^7.1.6",
     "@babel/preset-react": "^7.0.0",

packages/react-container-query/src/ContainerQuery.js

@@ -9,26 +9,21 @@ export default class ContainerQuery extends Component {
 
     this.state = { size: null };
 
-    this.handleResize = this.handleResize.bind(this);
-
     this.containerOptions = { ...this.props.options };
 
     // Listen to size changes only if needed
-    if (
-      typeof this.props.render === "function" ||
-      typeof this.props.children === "function"
-    ) {
+    if (typeof this.props.children === "function") {
       this.containerOptions.handleResize = this.handleResize;
     }
   }
 
-  handleResize(size) {
-    if (this.unMounting) {
+  handleResize = size => {
+    if (this.__willUnmount) {
       return;
     }
 
     this.setState({ size });
-  }
+  };
 
   componentDidMount() {
     if (!this.props.meta && !this.props.stats) {
@@ -55,7 +50,7 @@ export default class ContainerQuery extends Component {
   }
 
   componentWillUnmount() {
-    this.unMounting = true;
+    this.__willUnmount = true;
   }
 
   render() {
@@ -65,7 +60,7 @@ export default class ContainerQuery extends Component {
       return this.props.children;
     }
 
-    return this.props.render(this.state.size);
+    return null;
   }
 }
 
@@ -76,7 +71,6 @@ ContainerQuery.defaultProps = {
 };
 
 ContainerQuery.propTypes = {
-  render: PropTypes.func,
   stats: PropTypes.object,
   meta: PropTypes.object,
   options: PropTypes.object,