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