@googlemap-react/core
Version:
Easier-to-use Google Map & React integration
3 lines (2 loc) • 21.4 kB
JavaScript
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react/jsx-runtime"),require("react"),require("react-dom/server"),require("uuid"),require("loadjs"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react","react-dom/server","uuid","loadjs","react-dom"],n):n((e||self).core={},e.jsxRuntime,e.react,e.ReactDOMServer,e.uuid,e.loadjs,e.reactDom)}(this,function(e,n,a,t,o,r,s){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=i(a),l=i(t),c=i(r),u=i(s);function m(){return(m=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var a=arguments[n];for(var t in a)Object.prototype.hasOwnProperty.call(a,t)&&(e[t]=a[t])}return e}).apply(this,arguments)}function p(e,n){if(null==e)return{};var a,t,o={},r=Object.keys(e);for(t=0;t<r.length;t++)n.indexOf(a=r[t])>=0||(o[a]=e[a]);return o}const g={lat:40.7128,lng:-74.006},h=[{lat:40.718,lng:-74.006},{lat:40.718,lng:-74.01},{lat:40.7138,lng:-74.001},{lat:40.7128,lng:-74.005}],f={east:-74,west:-74.006,north:40.718,south:40.714},v={center:g,radius:200},y={},b={url:"https://placehold.it/256x256",bounds:f},C={data:[{lat:40.718,lng:-74.006},{lat:40.712,lng:-74.01}],radius:100},j={content:"Hello",position:g},S={url:"http://api.flickr.com/services/feeds/geo/?g=322338@N20&lang=en-us&format=feed-georss"},w={center:g,zoom:14},k={height:"100%",width:"100%"},x={position:g},O={paths:h},_={path:h},M={bounds:f},E={bounds:f},P={bounds:f},N={position:g},D=["drawing","geometry","places","visualization"],L=({apiKey:e,libraryParam:n,languageParam:t,regionParam:o})=>{const r=a.useState(!1),s=r[0],i=r[1];return a.useEffect(()=>{if("undefined"==typeof document)return;const a="https://maps.googleapis.com/maps/api/js?key="+e+n+t+o;c.default.isDefined("gmap")||c.default(a,"gmap"),c.default.ready("gmap",{success:()=>{i(!0)},error:()=>{c.default.reset(),console.error("Unable to fetch Google Map sdk")}})},[]),s},T=(e,n)=>{a.useEffect(()=>{if(void 0===e)return;const a=[];return n.forEach(n=>{n.handler&&a.push(google.maps.event.addListener(e,n.name,n.handler))}),()=>{a.forEach(e=>e.remove())}},[e,n])},R=(e,n,t,o)=>{a.useEffect(()=>{void 0!==e&&void 0!==n&&JSON.stringify(n)!==t&&(e.setOptions(n),o(JSON.stringify(n)))},[e,n])},B=()=>({map:void 0,objects:new Map,places:void 0}),I=d.default.createContext({state:void 0,dispatch:void 0}),A=(e,n)=>{switch(n.type){case"reset":return B();case"init_map":if(void 0===n.map)throw new Error("You should specify a map instance");if(void 0!==e.map)throw new Error("There can only be one map instance in a context");return m({},e,{map:n.map,places:n.places});case"add_object":if(void 0===n.object)throw new Error("You should specify an object instance");if(void 0===n.id)throw new Error("You should specify an id");if(e.objects.has(n.id))throw new Error("The id has already been taken");return e.objects.set(n.id,n.object),e;case"remove_object":if(void 0===n.id)throw new Error("You should specify an id");const a=e.objects.get(n.id);if(void 0===a)throw new Error("There is no object with the given id");return a.setMap&&a.setMap(null),e.objects.delete(n.id),e;default:return e}},J=I.Consumer,V=e=>{let t=e.id,r=e.opts,s=void 0===r?P:r,i=e.onPlaceChanged,d=e.bindingPosition,c=p(e,["id","opts","onPlaceChanged","bindingPosition"]);const u=a.useContext(I),m=u.state,g=u.dispatch,h=a.useState(""),f=h[0],v=h[1],y=a.useState(void 0),b=y[0],C=y[1],j=a.useState(t||"autocomplete-"+o.v1())[0],S=a.useState(document.createRange().createContextualFragment(l.default.renderToString(n.jsx("input",Object.assign({id:j},c),void 0))).firstElementChild)[0],w=a.useState(d),k=w[0],x=w[1];return a.useEffect(()=>{if(void 0===m.map||void 0===m.places)return;const e=d?S:document.getElementById(j),n=new google.maps.places.Autocomplete(e,s);if(C(n),(e=>{g({type:"add_object",object:e,id:j})})(n),v(JSON.stringify(s)),d){if(d!==k){const e=m.map.controls[google.maps.ControlPosition[k]],n=e.getArray();e.removeAt(n.findIndex(e=>e===S)),x(d)}m.map.controls[google.maps.ControlPosition[d]].push(e)}return()=>g({type:"remove_object",id:j})},[m.places,d]),T(b,[{name:"place_changed",handler:i}]),R(b,s,f,v),d?null:n.jsx("input",Object.assign({id:j},c),void 0)};V.displayName="Autocomplete";const G=e=>n.jsx(V,Object.assign({},e),void 0);G.displayName="Autocomplete";const z=e=>n.jsx(V,Object.assign({},e),void 0);z.displayName="StandaloneAutocomplete";const H=({type:e,opts:n})=>{const t=e+"-layer",o=a.useContext(I),r=o.state,s=o.dispatch,i=a.useState(void 0),d=i[0],l=i[1];return a.useEffect(()=>{if(void 0===r.map)return;const a={bicycling:google.maps.BicyclingLayer,traffic:google.maps.TrafficLayer,transit:google.maps.TransitLayer},o="traffic"===e?new a[e](n):new a[e];return o.setMap(r.map),l(o),(e=>{s({type:"add_object",object:e,id:t})})(o),()=>s({type:"remove_object",id:t})},[r.map]),a.useEffect(()=>{"traffic"===e&&void 0!==n&&void 0!==d&&d.setOptions(n)},[n]),null};H.displayName="layer";const F=({})=>n.jsx(H,{type:"bicycling"},void 0);F.displayName="BicyclingLayer";const U=({id:e,opts:n=v,onCenterChanged:t,onClick:r,onDoubleClick:s,onDrag:i,onDragEnd:d,onDragStart:l,onMouseDown:c,onMouseOut:u,onMouseOver:p,onMouseUp:g,onRadiusChanged:h,onRightClick:f})=>{const y=a.useContext(I),b=y.state,C=y.dispatch,j=a.useState(""),S=j[0],w=j[1],k=a.useState(void 0),x=k[0],O=k[1],_=a.useState(e||"circle-"+o.v1())[0];return a.useEffect(()=>{if(void 0===b.map)return;const e=new google.maps.Circle(m({},n,{map:b.map}));return O(e),w(JSON.stringify(n)),(e=>{C({type:"add_object",object:e,id:_})})(e),()=>C({type:"remove_object",id:_})},[b.map]),T(x,[{name:"center_changed",handler:t},{name:"click",handler:r},{name:"dblclick",handler:s},{name:"drag",handler:i},{name:"dragend",handler:d},{name:"dragstart",handler:l},{name:"mousedown",handler:c},{name:"mouseout",handler:u},{name:"mouseover",handler:p},{name:"mouseup",handler:g},{name:"radius_changed",handler:h},{name:"rightclick",handler:f}]),R(x,n,S,w),null};U.displayName="Circle";const q=({bindingPosition:e="RIGHT_TOP",children:n})=>{const t=a.useContext(I).state,o=a.useRef(),r=a.useState(!1),s=r[0],i=r[1],d=a.useState(e),l=d[0],c=d[1];return a.useEffect(()=>{if(void 0!==t.map){if(o.current=document.createElement("div"),e!==l){const n=t.map.controls[google.maps.ControlPosition[l]],a=n.getArray();n.removeAt(a.findIndex(e=>e===o.current)),c(e)}t.map.controls[google.maps.ControlPosition[e]].push(o.current),i(!0)}},[t.map,e]),s?u.default.createPortal(n,o.current):null};q.displayName="CustomControl";const K=({opts:e=y,onCircleComplete:n,onMarkerComplete:t,onOverlayComplete:o,onPolygonComplete:r,onPolylineComplete:s,onRectangleComplete:i})=>{const d="drawing-manager",l=a.useContext(I),c=l.state,u=l.dispatch,p=a.useState(""),g=p[0],h=p[1],f=a.useState(void 0),v=f[0],b=f[1],C=a.useState(0),j=C[0],S=C[1],w=a.useRef(0);return w.current=j,a.useEffect(()=>{if(void 0===c.map)return;const n=new google.maps.drawing.DrawingManager(m({},e,{map:c.map}));return b(n),h(JSON.stringify(e)),(e=>{u({type:"add_object",object:e,id:d})})(n),()=>((()=>{for(let e=0;e<w.current;e++)u({type:"remove_object",id:"drawing-manager-"+e})})(),void u({type:"remove_object",id:d}))},[c.map]),T(v,[{name:"circlecomplete",handler:n},{name:"markercomplete",handler:t},{name:"overlaycomplete",handler:o},{name:"overlaycomplete",handler:e=>{return n=e.overlay,S(e=>(u({type:"add_object",object:n,id:"drawing-manager-"+e}),e+1));var n}},{name:"polygoncomplete",handler:r},{name:"polylinecomplete",handler:s},{name:"rectanglecomplete",handler:i}]),R(v,e,g,h),null};K.displayName="DrawingManager";const Y=({id:e,opts:n=b,onClick:t,onDoubleClick:r})=>{const s=a.useContext(I),i=s.state,d=s.dispatch,l=a.useState(void 0),c=l[0],u=l[1],m=a.useState(e||"ground-overlay-"+o.v1())[0],p=a.useState(void 0),g=p[0],h=p[1],f=a.useState(!0),v=f[0],y=f[1],C=()=>d({type:"remove_object",id:m}),j=()=>{const e=new google.maps.GroundOverlay(n.url,n.bounds,{clickable:n.clickable,opacity:n.opacity,map:i.map});u(e),h(n.bounds),y(void 0===n.clickable||n.clickable),(e=>{d({type:"add_object",object:e,id:m})})(e)};return a.useEffect(()=>{if(void 0!==i.map)return j(),()=>C()},[i.map]),T(c,[{name:"click",handler:t},{name:"dblclick",handler:r}]),a.useEffect(()=>{void 0!==c&&n.opacity&&n.opacity!==c.getOpacity()&&c.setOpacity(n.opacity)},[n.opacity]),a.useEffect(()=>{if(void 0===i.map||void 0===c)return;const e=void 0===n.clickable||n.clickable;n.url===c.getUrl()&&Object.is(JSON.stringify(n.bounds),JSON.stringify(g))&&e===v||(C(),j())},[n.url,n.bounds,n.clickable]),null};Y.displayName="GroundOverlay";const Z=()=>window.hasOwnProperty("google")&&google.maps&&google.maps.visualization,W=e=>t=>{const o=a.useState(!1),r=o[0],s=o[1];return a.useEffect(()=>{if(Z())return void s(!0);const e=setInterval(()=>{Z()&&(s(!0),clearInterval(e))},500)},[]),n.jsx(n.Fragment,{children:r?n.jsx(e,Object.assign({},t),void 0):null},void 0)},Q=e=>({location:new google.maps.LatLng(e.lat,e.lng),weight:e.weight||1}),X=W(({id:e,opts:n=C})=>{const t=a.useContext(I),r=t.state,s=t.dispatch,i=a.useState(void 0),d=i[0],l=i[1],c=a.useState(e||"heat-map-"+o.v1())[0];return a.useEffect(()=>{if(void 0===r.map)return;const e=new google.maps.visualization.HeatmapLayer(m({},n,{data:n.data.map(e=>Q(e)),map:r.map}));return l(e),s({type:"add_object",object:e,id:c}),()=>s({type:"remove_object",id:c})},[r.map]),a.useEffect(()=>{void 0!==d&&void 0!==n.data&&d.setData(n.data.map(e=>Q(e)))},[n.data]),null}),$=({anchorId:e,opts:n=j,visible:t,children:o,onCloseClick:r,onContentChanged:s,onDOMReady:i,onPositionChanged:d,onZIndexChanged:l})=>{if("undefined"==typeof document)return null;const c=a.useContext(I).state,p=a.useState(void 0),g=p[0],h=p[1],f=a.useState(document.createElement("div"))[0];return a.useEffect(()=>{if(void 0===c.map)return;const a=new google.maps.InfoWindow(m({},n,{content:o?f:n.content}));h(a);const r=e?c.objects.get(e):void 0;return t?a.open(c.map,r):a.close(),()=>a.close()},[c.map,t,e&&c.objects.get(e)]),T(g,[{name:"closeclick",handler:r},{name:"content_changed",handler:s},{name:"domready",handler:i},{name:"position_changed",handler:d},{name:"zindex_changed",handler:l}]),a.useEffect(()=>{void 0!==g&&g.setOptions(m({},n,{content:o?f:n.content}))},[n]),u.default.createPortal(o,f)};$.displayName="InfoWindow";const ee=({id:e,opts:n=S,onClick:t,onDefaultViewportChanged:r,onStatusChanged:s})=>{const i=a.useContext(I),d=i.state,l=i.dispatch,c=a.useState(""),u=c[0],p=c[1],g=a.useState(void 0),h=g[0],f=g[1],v=a.useState(e||"kml-layer-"+o.v1())[0];return a.useEffect(()=>{if(void 0===d.map)return;const e=new google.maps.KmlLayer(m({},n,{map:d.map}));return f(e),p(JSON.stringify(n)),(e=>{l({type:"add_object",object:e,id:v})})(e),()=>l({type:"remove_object",id:v})},[d.map]),T(h,[{name:"click",handler:t},{name:"defaultviewport_changed",handler:r},{name:"status_changed",handler:s}]),R(h,n,u,p),null};ee.displayName="KmlLayer";const ne=({apiKey:e="",language:t,region:o,className:r,style:s=k,opts:i=w,useDrawing:d=!1,useGeometry:l=!1,usePlaces:c=!1,useVisualization:u=!1,LoadedComponent:m=null,LoadingComponent:p=n.jsx("p",{children:"Loading..."},void 0),onBoundsChanged:g,onCenterChanged:h,onClick:f,onDoubleClick:v,onDrag:y,onDragEnd:b,onDragStart:C,onHeadingChanged:j,onIdle:S,onMapTypeIdChanged:x,onMouseMove:O,onMouseOut:_,onMouseOver:M,onProjectionChanged:E,onRightClick:P,onTilesLoaded:N,onTiltChanged:B,onZoomChanged:A})=>{const J=a.useContext(I).dispatch,V=a.useState(""),G=V[0],z=V[1],H=a.useState(void 0),F=H[0],U=H[1],q=a.useRef(null),K=(e,n)=>J({type:"init_map",map:e,places:n}),Y={drawing:d,geometry:l,places:c,visualization:u},Z=D.filter(e=>Y[e]).join(","),W=L({apiKey:e,libraryParam:""===Z?"":"&libraries="+Z,languageParam:void 0===t?"":"&language="+t,regionParam:void 0===o?"":"®ion="+o});return a.useEffect(()=>{if(!W)return;const e=JSON.stringify(i),n=new google.maps.Map(q.current,JSON.parse(e));if(U(n),z(e),c){const e=new google.maps.places.PlacesService(n);K(n,e)}else K(n);return()=>J({type:"reset"})},[W]),T(F,[{name:"bounds_changed",handler:g},{name:"center_changed",handler:h},{name:"click",handler:f},{name:"dblclick",handler:v},{name:"drag",handler:y},{name:"dragend",handler:b},{name:"dragstart",handler:C},{name:"heading_changed",handler:j},{name:"idle",handler:S},{name:"maptypeid_changed",handler:x},{name:"mousemove",handler:O},{name:"mouseout",handler:_},{name:"mouseover",handler:M},{name:"projection_changed",handler:E},{name:"rightclick",handler:P},{name:"tilesloaded",handler:N},{name:"tilt_changed",handler:B},{name:"zoom_changed",handler:A}]),R(F,i,G,z),n.jsxs(n.Fragment,{children:[W?m:p,n.jsx("div",{ref:q,style:s,className:r},void 0)]},void 0)};ne.displayName="MapBox";const ae=({id:e,opts:n=x,onAnimationChanged:t,onClick:r,onClickableChanged:s,onCursorChanged:i,onDoubleClick:d,onDrag:l,onDragEnd:c,onDragStart:u,onDraggableChanged:p,onFlatChanged:g,onIconChanged:h,onMouseDown:f,onMouseOut:v,onMouseOver:y,onMouseUp:b,onPositionChanged:C,onRightClick:j,onShapeChanged:S,onTitleChanged:w,onVisibleChanged:k,onZIndexChanged:O})=>{const _=a.useContext(I),M=_.state,E=_.dispatch,P=a.useState(""),N=P[0],D=P[1],L=a.useState(void 0),B=L[0],A=L[1],J=a.useState(e||"marker-"+o.v1())[0];return a.useEffect(()=>{if(void 0===M.map)return;const e=new google.maps.Marker(m({},n,{map:M.map}));return A(e),D(JSON.stringify(n)),(e=>{E({type:"add_object",object:e,id:J})})(e),()=>E({type:"remove_object",id:J})},[M.map]),T(B,[{name:"animation_changed",handler:t},{name:"click",handler:r},{name:"clickable_changed",handler:s},{name:"cursor_changed",handler:i},{name:"dblclick",handler:d},{name:"drag",handler:l},{name:"dragend",handler:c},{name:"draggable_changed",handler:p},{name:"dragstart",handler:u},{name:"flat_changed",handler:g},{name:"icon_changed",handler:h},{name:"mousedown",handler:f},{name:"mouseout",handler:v},{name:"mouseover",handler:y},{name:"mouseup",handler:b},{name:"position_changed",handler:C},{name:"rightclick",handler:j},{name:"shape_changed",handler:S},{name:"title_changed",handler:w},{name:"visible_changed",handler:k},{name:"zindex_changed",handler:O}]),R(B,n,N,D),null};ae.displayName="Marker";const te=({pane:e="overlayMouseTarget",position:n=g,children:t,onClick:o,onDoubleClick:r,onMouseDown:s,onMouseOut:i,onMouseOver:d,onMouseUp:l,onTouchEnd:c,onTouchStart:m,disableMapHits:p=!1,disableMapHitsAndGestures:h=!1})=>{if("undefined"==typeof document)return null;const f=a.useContext(I).state,v=a.useState(document.createElement("div"))[0],y=a.useState(void 0),b=y[0],C=y[1];return a.useEffect(()=>{if(void 0===f.map)return;const n=new google.maps.OverlayView;return n.onAdd=()=>{v.style.position="absolute",v.onclick=o||null,v.ondblclick=r||null,v.onmousedown=s||null,v.onmouseover=d||null,v.onmouseout=i||null,v.onmouseup=l||null,v.ontouchend=c||null,v.ontouchstart=m||null,h?google.maps.OverlayView.preventMapHitsAndGesturesFrom(v):p&&google.maps.OverlayView.preventMapHitsFrom(v),n.getPanes()[e].appendChild(v)},n.onRemove=()=>{v.parentNode&&v.parentNode.removeChild(v)},n.setMap(f.map),C(n),()=>n.setMap(null)},[f.map]),a.useEffect(()=>{void 0!==b&&(b.setMap(null),b.draw=()=>{const e=b.getProjection().fromLatLngToDivPixel(new google.maps.LatLng(n.lat,n.lng));v.style.left=JSON.stringify(e.x)+"px",v.style.top=JSON.stringify(e.y)+"px"},b.setMap(f.map))},[b,n]),u.default.createPortal(t,v)};te.displayName="OverlayView";const oe=({id:e,opts:n=O,onClick:t,onDoubleClick:r,onDrag:s,onDragEnd:i,onDragStart:d,onMouseDown:l,onMouseOut:c,onMouseOver:u,onMouseUp:p,onRightClick:g})=>{const h=a.useContext(I),f=h.state,v=h.dispatch,y=a.useState(""),b=y[0],C=y[1],j=a.useState(void 0),S=j[0],w=j[1],k=a.useState(e||"polygon-"+o.v1())[0];return a.useEffect(()=>{if(void 0===f.map)return;const e=new google.maps.Polygon(m({},n,{map:f.map}));return w(e),C(JSON.stringify(n)),(e=>{v({type:"add_object",object:e,id:k})})(e),()=>v({type:"remove_object",id:k})},[f.map]),T(S,[{name:"click",handler:t},{name:"dblclick",handler:r},{name:"drag",handler:s},{name:"dragend",handler:i},{name:"dragstart",handler:d},{name:"mousedown",handler:l},{name:"mouseout",handler:c},{name:"mouseover",handler:u},{name:"mouseup",handler:p},{name:"rightclick",handler:g}]),R(S,n,b,C),null};oe.displayName="Polygon";const re=({id:e,opts:n=_,onClick:t,onDoubleClick:r,onDrag:s,onDragEnd:i,onDragStart:d,onMouseDown:l,onMouseOut:c,onMouseOver:u,onMouseUp:p,onRightClick:g})=>{const h=a.useContext(I),f=h.state,v=h.dispatch,y=a.useState(""),b=y[0],C=y[1],j=a.useState(void 0),S=j[0],w=j[1],k=a.useState(e||"polyline-"+o.v1())[0];return a.useEffect(()=>{if(void 0===f.map)return;const e=new google.maps.Polyline(m({},n,{map:f.map}));return w(e),C(JSON.stringify(n)),(e=>{v({type:"add_object",object:e,id:k})})(e),()=>v({type:"remove_object",id:k})},[f.map]),T(S,[{name:"click",handler:t},{name:"dblclick",handler:r},{name:"drag",handler:s},{name:"dragend",handler:i},{name:"dragstart",handler:d},{name:"mousedown",handler:l},{name:"mouseout",handler:c},{name:"mouseover",handler:u},{name:"mouseup",handler:p},{name:"rightclick",handler:g}]),R(S,n,b,C),null};re.displayName="Polyline";const se=({id:e,opts:n=M,onBoundsChanged:t,onClick:r,onDoubleClick:s,onDrag:i,onDragEnd:d,onDragStart:l,onMouseDown:c,onMouseOut:u,onMouseOver:p,onMouseUp:g,onRightClick:h})=>{const f=a.useContext(I),v=f.state,y=f.dispatch,b=a.useState(""),C=b[0],j=b[1],S=a.useState(void 0),w=S[0],k=S[1],x=a.useState(e||"rectangle-"+o.v1())[0];return a.useEffect(()=>{if(void 0===v.map)return;const e=new google.maps.Rectangle(m({},n,{map:v.map}));return k(e),j(JSON.stringify(n)),(e=>{y({type:"add_object",object:e,id:x})})(e),()=>y({type:"remove_object",id:x})},[v.map]),T(w,[{name:"bounds_changed",handler:t},{name:"click",handler:r},{name:"dblclick",handler:s},{name:"drag",handler:i},{name:"dragend",handler:d},{name:"dragstart",handler:l},{name:"mousedown",handler:c},{name:"mouseout",handler:u},{name:"mouseover",handler:p},{name:"mouseup",handler:g},{name:"rightclick",handler:h}]),R(w,n,C,j),null};se.displayName="Rectangle";const ie=e=>{let t=e.id,r=e.opts,s=void 0===r?E:r,i=e.onPlacesChanged,d=e.bindingPosition,c=p(e,["id","opts","onPlacesChanged","bindingPosition"]);const u=a.useContext(I),m=u.state,g=u.dispatch,h=a.useState(void 0),f=h[0],v=h[1],y=a.useState(t||"search-box-"+o.v1())[0],b=a.useState(document.createRange().createContextualFragment(l.default.renderToString(n.jsx("input",Object.assign({id:y},c),void 0))).firstElementChild)[0],C=a.useState(d),j=C[0],S=C[1];return a.useEffect(()=>{if(void 0===m.map||void 0===m.places)return;const e=d?b:document.getElementById(y),n=new google.maps.places.SearchBox(e,s);if(v(n),g({type:"add_object",object:n,id:y}),d){if(d!==j){const e=m.map.controls[google.maps.ControlPosition[j]],n=e.getArray();e.removeAt(n.findIndex(e=>e===b)),S(d)}m.map.controls[google.maps.ControlPosition[d]].push(e)}return()=>g({type:"remove_object",id:y})},[m.places,d]),T(f,[{name:"places_changed",handler:i}]),a.useEffect(()=>{void 0!==f&&void 0!==s.bounds&&f.setBounds(s.bounds)},[s.bounds]),d?null:n.jsx("input",Object.assign({id:y},c),void 0)};ie.displayName="SearchBox";const de=e=>n.jsx(ie,Object.assign({},e),void 0);de.displayName="SearchBox";const le=e=>n.jsx(ie,Object.assign({},e),void 0);le.displayName="StandaloneSearchBox";const ce=({id:e,className:t,style:r=k,opts:s=N,bindToMap:i,onCloseClick:d,onPanoChanged:l,onPositionChanged:c,onPovChanged:u,onResize:m,onStatusChanged:p,onVisibleChanged:g,onZoomChanged:h})=>{const f=a.useContext(I),v=f.state,y=f.dispatch,b=a.useState(""),C=b[0],j=b[1],S=a.useState(void 0),w=S[0],x=S[1],O=a.useState(e||(i?"street-view":"street-view-"+o.v1()))[0];return a.useEffect(()=>{if(void 0===v.map)return;const e=new google.maps.StreetViewPanorama(document.getElementById(O),s);return x(e),j(JSON.stringify(s)),(e=>{y({type:"add_object",object:e,id:O})})(e),i&&v.map.setOptions({streetView:e}),()=>{i&&v.map&&v.map.setOptions({streetView:void 0}),y({type:"remove_object",id:O})}},[v.map]),T(w,[{name:"closeclick",handler:d},{name:"pano_changed",handler:l},{name:"position_changed",handler:c},{name:"pov_changed",handler:u},{name:"resize",handler:m},{name:"status_changed",handler:p},{name:"visible_changed",handler:g},{name:"zoom_changed",handler:h}]),R(w,s,C,j),n.jsx("div",{className:t,id:O,style:r},void 0)};ce.displayName="BasicStreetView";const ue=e=>n.jsx(ce,Object.assign({bindToMap:!1},e),void 0);ue.displayName="StandaloneStreetView";const me=e=>n.jsx(ce,Object.assign({bindToMap:!0},e),void 0);me.displayName="StreetView";const pe=({opts:e})=>n.jsx(H,{type:"traffic",opts:e},void 0);pe.displayName="TrafficLayer";const ge=({})=>n.jsx(H,{type:"transit"},void 0);ge.displayName="TransitLayer",e.Autocomplete=G,e.BicyclingLayer=F,e.Circle=U,e.CustomControl=q,e.DrawingManager=K,e.GoogleMapConsumer=J,e.GoogleMapContext=I,e.GoogleMapProvider=({children:e})=>{const t=a.useReducer(A,B());return n.jsx(n.Fragment,{children:n.jsx(I.Provider,Object.assign({value:{state:t[0],dispatch:t[1]}},{children:e}),void 0)},void 0)},e.GroundOverlay=Y,e.HeatMap=X,e.InfoWindow=$,e.KmlLayer=ee,e.Layer=H,e.MapBox=ne,e.Marker=ae,e.OverlayView=te,e.Polygon=oe,e.Polyline=re,e.Rectangle=se,e.SearchBox=de,e.StandaloneAutocomplete=z,e.StandaloneSearchBox=le,e.StandaloneStreetView=ue,e.StreetView=me,e.TrafficLayer=pe,e.TransitLayer=ge,e.useGoogleAPI=L,e.useGoogleListener=T,e.withSecurityBounder=W});
//# sourceMappingURL=index.umd.js.map