How to use the react-leaflet.Rectangle function in react-leaflet

return _react2['default'].createElement(
        _reactLeaflet.Map,
        { bounds: this.state.bounds },
        _react2['default'].createElement(_reactLeaflet.TileLayer, {
          attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
          url: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png'
        }),
        _react2['default'].createElement(_reactLeaflet.Rectangle, {
          bounds: outer,
          color: this.state.bounds === outer ? 'red' : 'white',
          onClick: function () {
            return _this.setState({ bounds: outer });
          }
        }),
        _react2['default'].createElement(_reactLeaflet.Rectangle, {
          bounds: inner,
          color: this.state.bounds === inner ? 'red' : 'white',
          onClick: function () {
            return _this.setState({ bounds: inner });
          }
        })
      );
    }
  }]);

value: function render() {
      var _this = this;

      return _react2['default'].createElement(
        _reactLeaflet.Map,
        { bounds: this.state.bounds },
        _react2['default'].createElement(_reactLeaflet.TileLayer, {
          attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
          url: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png'
        }),
        _react2['default'].createElement(_reactLeaflet.Rectangle, {
          bounds: outer,
          color: this.state.bounds === outer ? 'red' : 'white',
          onClick: function () {
            return _this.setState({ bounds: outer });
          }
        }),
        _react2['default'].createElement(_reactLeaflet.Rectangle, {
          bounds: inner,
          color: this.state.bounds === inner ? 'red' : 'white',
          onClick: function () {
            return _this.setState({ bounds: inner });
          }
        })
      );
    }
  }]);