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

baseLayers && baseLayers.map(function (l, i) {
            return _react2.default.createElement(
              _reactLeaflet.LayersControl.BaseLayer,
              {
                name: l.name,
                checked: i === 0,
                key: i },
              _react2.default.createElement(_reactLeaflet.TileLayer, {
                url: l.url,
                attribution: l.attribution,
                maxZoom: l.maxZoom,
                detectRetina: true })
            );
          }),
          /* user-controlled overlay layers */

if ((0, _lodash2.default)(this.props.draw, prevProps.draw) || this.props.position !== prevProps.position) {
        return false;
      }

      var map = this.context.map;


      this.leafletElement.removeFrom(map);
      this.updateDrawControls();
      this.leafletElement.addTo(map);
    }
  }]);

  return EditControl;
}(_reactLeaflet.LayersControl);

EditControl.propTypes = {
  onCreated: _react.PropTypes.func,
  onEdited: _react.PropTypes.func,
  onEditStart: _react.PropTypes.func,
  onEditStop: _react.PropTypes.func,
  onDeleted: _react.PropTypes.func,
  onDeleteStart: _react.PropTypes.func,
  onDeleteStop: _react.PropTypes.func,
  onMounted: _react.PropTypes.func,
  draw: _react.PropTypes.object,
  position: _react.PropTypes.oneOf(['topright', 'topleft', 'bottomright', 'bottomleft'])
};
exports.default = EditControl;

userControlledOverlays.map(function (child, i) {
            return _react2.default.createElement(
              _reactLeaflet.LayersControl.Overlay,
              { key: i,
                name: child.props.name,
                checked: child.props.visible
              },
              child
            );
          })
        ),

value: function render() {
      var _this$props$config$ma = this.props.config.map,
          baseLayers = _this$props$config$ma.baseLayers,
          overlays = _this$props$config$ma.overlays;
      var BaseLayer = _reactLeaflet.LayersControl.BaseLayer,
          Overlay = _reactLeaflet.LayersControl.Overlay;
      return _react.default.createElement(_reactLeaflet.LayersControl, null, baseLayers && baseLayers.map(function (l, i) {
        return _react.default.createElement(BaseLayer, {
          name: l.name,
          checked: i === 0,
          key: i
        }, _react.default.createElement(_reactLeaflet.TileLayer, _extends({}, l, {
          detectRetina: true
        })));
      }), overlays && overlays.map(function (l, i) {
        return _react.default.createElement(Overlay, {
          name: l.name,
          key: i
        }, _react.default.createElement(_reactLeaflet.TileLayer, _extends({}, l, {
          detectRetina: true
        })));

value: function render() {
      var _this$props$config$ma = this.props.config.map,
          baseLayers = _this$props$config$ma.baseLayers,
          overlays = _this$props$config$ma.overlays;
      var BaseLayer = _reactLeaflet.LayersControl.BaseLayer,
          Overlay = _reactLeaflet.LayersControl.Overlay;
      return _react.default.createElement(_reactLeaflet.LayersControl, null, baseLayers && baseLayers.map(function (l, i) {
        return _react.default.createElement(BaseLayer, {
          name: l.name,
          checked: i === 0,
          key: i
        }, _react.default.createElement(_reactLeaflet.TileLayer, _extends({}, l, {
          detectRetina: true
        })));
      }), overlays && overlays.map(function (l, i) {
        return _react.default.createElement(Overlay, {
          name: l.name,
          key: i
        }, _react.default.createElement(_reactLeaflet.TileLayer, _extends({}, l, {
          detectRetina: true
        })));
      }));