title: Reactjs Leaflet custom control button
body: <p>I'm trying to add custom button for zoom to leaflet map in reactjs this is my code</p>
  
  <pre><code>import React, {Component} from 'react';
  import { Map, TileLayer, Marker, Popup, ZoomControl } from 'react-leaflet';
  import Control from 'react-leaflet-control';
  import Button from '@material-ui/core/Button';
  
  class LeafletMapComponent extends Component {
      constructor(props) {
          super(props);
          this.state = {
              lat: 51.505,
              lng: -0.09,
              zoom: 13
          }
      }
  
      render() {
          const position = [this.state.lat, this.state.lng];
          return (
              &lt;Map ref={m =&gt; { this.leafletMap = m; }} zoomControl={false} center={position} zoom={this.state.zoom}&gt;
                  &lt;TileLayer
                      attribution='&amp;copy; &lt;a href="http://osm.org/copyright"&gt;OpenStreetMap&lt;/a&gt; contributors'
                      url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'
                  /&gt;
  
                  &lt;Control position="topleft" &gt;
  
                  &lt;/Control&gt;  
  
              &lt;/Map&gt;
          );
      }
  }
  </code></pre>
  
  <p>I'm using <code>react-leaflet-control</code> to create the custom control but it's giving me an error <code>'Error: createLeafletElement() must be implemented'</code></p>