google-places-autocomplete-react/dist/index.js

A lightweight React component for Google Places autocomplete.

"use strict";var e=require("react"),t=require("prop-types"),n=require("react/jsx-runtime");function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}function o(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a,l,i=[],s=!0,c=!1;try{if(a=(n=n.call(e)).next,0===t);else for(;!(s=(r=a.call(n)).done)&&(i.push(r.value),i.length!==t);s=!0);}catch(e){c=!0,o=e}finally{try{if(!s&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(c)throw o}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n={}.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var a=function(t){var r=t.apiKey,a=t.onPlaceSelect,l=t.placeholder,i=void 0===l?"Search for a location":l,s=t.inputClassName,c=void 0===s?"":s,u=t.suggestionsClassName,d=void 0===u?"":u,g=t.suggestionItemClassName,p=void 0===g?"":g,m=t.inputStyle,f=void 0===m?{}:m,y=t.suggestionsStyle,v=void 0===y?{}:y,S=t.suggestionItemStyle,h=void 0===S?{}:S,w=e.useRef(null),b=o(e.useState([]),2),j=b[0],N=b[1],x=o(e.useState(!1),2),C=x[0],I=x[1],A=o(e.useState(""),2),P=A[0],E=A[1];e.useEffect(function(){if(!document.getElementById("google-maps")){var e=document.createElement("script");e.src="https://maps.googleapis.com/maps/api/js?key=".concat(r,"&libraries=places"),e.id="google-maps",e.async=!0,e.defer=!0,document.body.appendChild(e)}},[r]);return n.jsxs("div",{className:"relative",children:[n.jsx("input",{type:"text",ref:w,value:P,onChange:function(e){var t,n;E(e.target.value),(t=e.target.value).trim()&&null!==(n=window.google)&&void 0!==n&&n.maps?(I(!0),(new window.google.maps.places.AutocompleteService).getPlacePredictions({input:t},function(e,t){t===window.google.maps.places.PlacesServiceStatus.OK?N(e||[]):N([]),I(!1)})):N([])},onKeyDown:function(e){"Enter"===e.key&&e.preventDefault()},placeholder:i,className:"w-full outline-none ".concat(c),style:f}),C&&n.jsx("p",{className:"text-gray-500",children:"Loading..."}),j.length>0&&n.jsx("ul",{className:"absolute z-10 w-full border rounded shadow ".concat(d),style:v,children:j.map(function(e){return n.jsx("li",{className:"p-2 cursor-pointer ".concat(p),style:h,onClick:function(){return t=e.place_id,n=e.description,void(null!==(r=window.google)&&void 0!==r&&r.maps&&new window.google.maps.places.PlacesService(document.createElement("div")).getDetails({placeId:t},function(e,t){t===window.google.maps.places.PlacesServiceStatus.OK&&e.geometry&&(a({description:n,lat:e.geometry.location.lat(),lng:e.geometry.location.lng()}),E(n),N([]))}));var t,n,r},children:e.description},e.place_id)})})]})};a.propTypes={apiKey:t.string.isRequired,onPlaceSelect:t.func.isRequired,placeholder:t.string,inputClassName:t.string,suggestionsClassName:t.string,suggestionItemClassName:t.string,inputStyle:t.object,suggestionsStyle:t.object,suggestionItemStyle:t.object},module.exports=a;