JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://maps.google.com/maps/api/js?libraries=places&region=us&language=en&sensor=false"></script>
<input id="pac-input" type="text" size="50">             
<div id="output"></div>

CSS

body {         
    font:14px sans-serif;           
} 
input {
    margin: 0.6em 0.6em 0; 
    width:398px;
}
#map_canvas {         
    height: 400px;         
    width: 400px;         
    margin: 0.6em;       
}

JavaScript

$(function(){      
 var input = document.getElementById('pac-input');
    var options = {
      keyword: 'establishment'
    }
    var searchBox = new google.maps.places.SearchBox(input, options);

    searchBox.addListener('places_changed', 	function(evt) {
      
      var places = searchBox.getPlaces();

      if ($('.pac-item').length > 0) {
				return;
      }

      places.forEach(function(place) {
        $('#output').append(place['name']);
      });
    });
});