react-map-gl-geocoder
Version:
React wrapper for mapbox-gl-geocoder for use with react-map-gl
3 lines (2 loc) • 5.2 kB
JavaScript
function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var o=require("react"),n=e(require("prop-types")),r=e(require("@mapbox/mapbox-gl-geocoder")),t=require("react-map-gl"),l=e(require("viewport-mercator-project")),c=e(require("mapbox-gl")),i=["top-left","top-right","bottom-left","bottom-right"],a=function(e){var o,n;function a(){for(var o,n=arguments.length,a=new Array(n),u=0;u<n;u++)a[u]=arguments[u];return(o=e.call.apply(e,[this].concat(a))||this).geocoder=null,o.cachedResult=null,o.initializeGeocoder=function(){var e=o.getMapboxMap(),n=o.getContainerNode(),t=o.props,l=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:c};a&&"function"==typeof a&&(p.render=a),u&&"function"==typeof u&&(p.getItemValue=u),o.geocoder=new r(p),o.subscribeEvents(),n?n.appendChild(o.geocoder.onAdd(e)):e.addControl(o.geocoder,i.find(function(e){return d===e})),null!=l?o.geocoder.setInput(l):o.cachedResult&&o.geocoder.setInput(o.cachedResult.place_name),(o.cachedResult||null!=l)&&o.showClearIcon(),s(o.geocoder)},o.showClearIcon=function(){o.geocoder._clearEl.style.display="block"},o.getMapboxMap=function(){var e=o.props.mapRef;return e&&e.current&&e.current.getMap()||null},o.getContainerNode=function(){var e=o.props.containerRef;return e&&e.current||null},o.subscribeEvents=function(){o.geocoder.on("clear",o.handleClear),o.geocoder.on("loading",o.handleLoading),o.geocoder.on("results",o.handleResults),o.geocoder.on("result",o.handleResult),o.geocoder.on("error",o.handleError)},o.unsubscribeEvents=function(){o.geocoder.off("clear",o.handleClear),o.geocoder.off("loading",o.handleLoading),o.geocoder.off("results",o.handleResults),o.geocoder.off("result",o.handleResult),o.geocoder.off("error",o.handleError)},o.removeGeocoder=function(){var e=o.getMapboxMap();o.unsubscribeEvents(),e&&e.removeControl&&o.getMapboxMap().removeControl(o.geocoder),o.geocoder=null},o.handleClear=function(){o.cachedResult=null,o.props.onClear()},o.handleLoading=function(e){o.props.onLoading(e)},o.handleResults=function(e){o.props.onResults(e)},o.handleResult=function(e){var n=e.result,r=o.props,c=r.onViewportChange,i=r.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=o.getMapboxMap().getContainer().getBoundingClientRect(),b=m.width,h=m.height,y=o.geocoder.options.zoom,x=function(e,o){return new l(o).fitBounds(e)};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(e){console.warn("following result caused an error when trying to zoom to bbox: ",n),y=o.geocoder.options.zoom}c({longitude:p,latitude:g,zoom:y,transitionInterpolator:new t.FlyToInterpolator,transitionDuration:3e3}),i(e),o.cachedResult=n,o.geocoder._typeahead.selected=null,o.showClearIcon()},o.handleError=function(e){o.props.onError(e)},o}n=e,(o=a).prototype=Object.create(n.prototype),o.prototype.constructor=o,o.__proto__=n;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.PureComponent);a.propTypes={mapRef:n.object.isRequired,containerRef:n.object,onViewportChange:n.func,mapboxApiAccessToken:n.string.isRequired,inputValue:n.string,origin:n.string,zoom:n.number,placeholder:n.string,proximity:n.object,trackProximity:n.bool,collapsed:n.bool,clearAndBlurOnEsc:n.bool,clearOnBlur:n.bool,bbox:n.array,types:n.string,countries:n.string,minLength:n.number,limit:n.number,language:n.string,filter:n.func,localGeocoder:n.func,localGeocoderOnly:n.bool,reverseGeocode:n.bool,enableEventLogging:n.bool,marker:n.oneOfType([n.bool,n.object]),render:n.func,getItemValue:n.func,position:n.oneOf(i),onInit:n.func,onClear:n.func,onLoading:n.func,onResults:n.func,onResult:n.func,onError:n.func},a.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(){}},module.exports=a;
//# sourceMappingURL=index.js.map