react-map-gl-geocoder
Version:
React wrapper for mapbox-gl-geocoder for use with react-map-gl
3 lines (2 loc) • 5.14 kB
JavaScript
import{PureComponent as o}from"react";import e from"prop-types";import n from"@mapbox/mapbox-gl-geocoder";import{FlyToInterpolator as r}from"react-map-gl";import t from"viewport-mercator-project";import l from"mapbox-gl";var c=["top-left","top-right","bottom-left","bottom-right"],i=function(o){var e,i;function a(){for(var e,i=arguments.length,a=new Array(i),u=0;u<i;u++)a[u]=arguments[u];return(e=o.call.apply(o,[this].concat(a))||this).geocoder=null,e.cachedResult=null,e.initializeGeocoder=function(){var o=e.getMapboxMap(),r=e.getContainerNode(),t=e.props,i=t.inputValue,a=t.render,u=t.getItemValue,s=t.onInit,d=t.position,p={accessToken:t.mapboxApiAccessToken,origin:t.origin,zoom:t.zoom,flyTo:!1,placeholder:t.placeholder,proximity:t.proximity,trackProximity:t.trackProximity,collapsed:t.collapsed,clearAndBlurOnEsc:t.clearAndBlurOnEsc,clearOnBlur:t.clearOnBlur,bbox:t.bbox,types:t.types,countries:t.countries,minLength:t.minLength,limit:t.limit,language:t.language,filter:t.filter,localGeocoder:t.localGeocoder,localGeocoderOnly:t.localGeocoderOnly,reverseGeocode:t.reverseGeocode,enableEventLogging:t.enableEventLogging,marker:t.marker,mapboxgl:l};a&&"function"==typeof a&&(p.render=a),u&&"function"==typeof u&&(p.getItemValue=u),e.geocoder=new n(p),e.subscribeEvents(),r?r.appendChild(e.geocoder.onAdd(o)):o.addControl(e.geocoder,c.find(function(o){return d===o})),null!=i?e.geocoder.setInput(i):e.cachedResult&&e.geocoder.setInput(e.cachedResult.place_name),(e.cachedResult||null!=i)&&e.showClearIcon(),s(e.geocoder)},e.showClearIcon=function(){e.geocoder._clearEl.style.display="block"},e.getMapboxMap=function(){var o=e.props.mapRef;return o&&o.current&&o.current.getMap()||null},e.getContainerNode=function(){var o=e.props.containerRef;return o&&o.current||null},e.subscribeEvents=function(){e.geocoder.on("clear",e.handleClear),e.geocoder.on("loading",e.handleLoading),e.geocoder.on("results",e.handleResults),e.geocoder.on("result",e.handleResult),e.geocoder.on("error",e.handleError)},e.unsubscribeEvents=function(){e.geocoder.off("clear",e.handleClear),e.geocoder.off("loading",e.handleLoading),e.geocoder.off("results",e.handleResults),e.geocoder.off("result",e.handleResult),e.geocoder.off("error",e.handleError)},e.removeGeocoder=function(){var o=e.getMapboxMap();e.unsubscribeEvents(),o&&o.removeControl&&e.getMapboxMap().removeControl(e.geocoder),e.geocoder=null},e.handleClear=function(){e.cachedResult=null,e.props.onClear()},e.handleLoading=function(o){e.props.onLoading(o)},e.handleResults=function(o){e.props.onResults(o)},e.handleResult=function(o){var n=o.result,l=e.props,c=l.onViewportChange,i=l.onResult,a=n.bbox,u=n.center,s=n.properties,d=(void 0===s?{}:s).short_code,p=u[0],g=u[1],f={fr:{name:"France",bbox:[[-4.59235,41.380007],[9.560016,51.148506]]},us:{name:"United States",bbox:[[-171.791111,18.91619],[-66.96466,71.357764]]},ru:{name:"Russia",bbox:[[19.66064,41.151416],[190.10042,81.2504]]},ca:{name:"Canada",bbox:[[-140.99778,41.675105],[-52.648099,83.23324]]}},m=e.getMapboxMap().getContainer().getBoundingClientRect(),b=m.width,h=m.height,y=e.geocoder.options.zoom,x=function(o,e){return new t(e).fitBounds(o)};try{!f[d]&&a?y=x([[a[0],a[1]],[a[2],a[3]]],{width:b,height:h}).zoom:f[d]&&(y=x(f[d].bbox,{width:b,height:h}).zoom)}catch(o){console.warn("following result caused an error when trying to zoom to bbox: ",n),y=e.geocoder.options.zoom}c({longitude:p,latitude:g,zoom:y,transitionInterpolator:new r,transitionDuration:3e3}),i(o),e.cachedResult=n,e.geocoder._typeahead.selected=null,e.showClearIcon()},e.handleError=function(o){e.props.onError(o)},e}i=o,(e=a).prototype=Object.create(i.prototype),e.prototype.constructor=e,e.__proto__=i;var u=a.prototype;return u.componentDidMount=function(){this.initializeGeocoder()},u.componentWillUnmount=function(){this.removeGeocoder()},u.componentDidUpdate=function(){this.removeGeocoder(),this.initializeGeocoder()},u.getGeocoder=function(){return this.geocoder},u.render=function(){return null},a}(o);i.propTypes={mapRef:e.object.isRequired,containerRef:e.object,onViewportChange:e.func,mapboxApiAccessToken:e.string.isRequired,inputValue:e.string,origin:e.string,zoom:e.number,placeholder:e.string,proximity:e.object,trackProximity:e.bool,collapsed:e.bool,clearAndBlurOnEsc:e.bool,clearOnBlur:e.bool,bbox:e.array,types:e.string,countries:e.string,minLength:e.number,limit:e.number,language:e.string,filter:e.func,localGeocoder:e.func,localGeocoderOnly:e.bool,reverseGeocode:e.bool,enableEventLogging:e.bool,marker:e.oneOfType([e.bool,e.object]),render:e.func,getItemValue:e.func,position:e.oneOf(c),onInit:e.func,onClear:e.func,onLoading:e.func,onResults:e.func,onResult:e.func,onError:e.func},i.defaultProps={onViewportChange:function(){},origin:"https://api.mapbox.com",zoom:16,placeholder:"Search",trackProximity:!1,collapsed:!1,clearAndBlurOnEsc:!1,clearOnBlur:!1,minLength:2,limit:5,reverseGeocode:!1,enableEventLogging:!0,marker:!0,position:"top-right",onInit:function(){},onClear:function(){},onLoading:function(){},onResults:function(){},onResult:function(){},onError:function(){}};export default i;
//# sourceMappingURL=index.m.js.map