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

A lightweight React component for Google Places autocomplete.

import{useRef as e,useState as t,useEffect as n}from"react";import o from"prop-types";import{jsxs as r,jsx as a}from"react/jsx-runtime";function l(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=Array(t);n<t;n++)o[n]=e[n];return o}function i(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 o,r,a,l,i=[],s=!0,c=!1;try{if(a=(n=n.call(e)).next,0===t);else for(;!(s=(o=a.call(n)).done)&&(i.push(o.value),i.length!==t);s=!0);}catch(e){c=!0,r=e}finally{try{if(!s&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(c)throw r}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return l(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)?l(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 s=function(o){var l=o.apiKey,s=o.onPlaceSelect,c=o.placeholder,u=void 0===c?"Search for a location":c,p=o.inputClassName,d=void 0===p?"":p,g=o.suggestionsClassName,m=void 0===g?"":g,f=o.suggestionItemClassName,y=void 0===f?"":f,v=o.inputStyle,h=void 0===v?{}:v,w=o.suggestionsStyle,S=void 0===w?{}:w,b=o.suggestionItemStyle,N=void 0===b?{}:b,C=e(null),I=i(t([]),2),j=I[0],A=I[1],P=i(t(!1),2),x=P[0],E=P[1],K=i(t(""),2),O=K[0],k=K[1];n(function(){if(!document.getElementById("google-maps")){var e=document.createElement("script");e.src="https://maps.googleapis.com/maps/api/js?key=".concat(l,"&libraries=places"),e.id="google-maps",e.async=!0,e.defer=!0,document.body.appendChild(e)}},[l]);return r("div",{className:"relative",children:[a("input",{type:"text",ref:C,value:O,onChange:function(e){var t,n;k(e.target.value),(t=e.target.value).trim()&&null!==(n=window.google)&&void 0!==n&&n.maps?(E(!0),(new window.google.maps.places.AutocompleteService).getPlacePredictions({input:t},function(e,t){t===window.google.maps.places.PlacesServiceStatus.OK?A(e||[]):A([]),E(!1)})):A([])},onKeyDown:function(e){"Enter"===e.key&&e.preventDefault()},placeholder:u,className:"w-full outline-none ".concat(d),style:h}),x&&a("p",{className:"text-gray-500",children:"Loading..."}),j.length>0&&a("ul",{className:"absolute z-10 w-full border rounded shadow ".concat(m),style:S,children:j.map(function(e){return a("li",{className:"p-2 cursor-pointer ".concat(y),style:N,onClick:function(){return t=e.place_id,n=e.description,void(null!==(o=window.google)&&void 0!==o&&o.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&&(s({description:n,lat:e.geometry.location.lat(),lng:e.geometry.location.lng()}),k(n),A([]))}));var t,n,o},children:e.description},e.place_id)})})]})};s.propTypes={apiKey:o.string.isRequired,onPlaceSelect:o.func.isRequired,placeholder:o.string,inputClassName:o.string,suggestionsClassName:o.string,suggestionItemClassName:o.string,inputStyle:o.object,suggestionsStyle:o.object,suggestionItemStyle:o.object};export{s as default};