radar-sdk-js 4.5.0-beta.0 → 4.5.0

package/src/types.ts

@@ -45,7 +45,8 @@ export type RadarTravelMode =
 export type RadarAvoidOption =
   | 'tolls'
   | 'highways'
-  | 'ferries';
+  | 'ferries'
+  | 'borderCrossings';
 
 export interface RadarTripOptions {
   userId?: string;
@@ -76,8 +77,16 @@ export interface RadarTrackParams {
   fraud?: boolean;
 }
 
+export interface RadarTrackVerifiedParams {
+  userId?: string;
+  description?: string;
+  metadata?: RadarMetadata;
+  skipVerifyApp?: boolean;
+}
+
 export interface RadarStartTrackingVerifiedParams {
   interval: number;
+  skipVerifyApp?: boolean;
 }
 
 export enum RadarEventConfidence {
@@ -270,6 +279,7 @@ export type RadarGeocodeLayer =
   | 'address'
   | 'postalCode'
   | 'locality'
+  | 'neighborhood'
   | 'county'
   | 'state'
   | 'country'
@@ -302,10 +312,24 @@ export interface RadarAddress {
   street?: string;
 }
 
+export interface RadarTimeZone {
+  id: string;
+  name: string;
+  code: string;
+  currentTime: string;
+  utcOffset: number;
+  dstOffset: number;
+}
+
 export interface RadarAutocompleteAddress extends RadarAddress {
   unit?: string;
 }
 
+export interface RadarGeocodeAddress extends RadarAddress {
+  unit?: string;
+  timeZone?: RadarTimeZone;
+}
+
 export type RadarValidationRecordType = 'S' | 'R' | 'P' | 'M' | 'H' | 'G' | 'F' | undefined;
 
 export type RadarValidationPropertyType = 'commercial' | 'residential' | undefined;
@@ -325,6 +349,7 @@ export interface RadarForwardGeocodeParams {
   query: string;
   layers?: RadarGeocodeLayer[];
   country?: string;
+  lang?: string;
 }
 
 export interface RadarReverseGeocodeParams {
@@ -333,13 +358,13 @@ export interface RadarReverseGeocodeParams {
   layers?: RadarGeocodeLayer[];
 }
 
-export interface RadarGeocodeResponse  extends RadarResponse {
-  addresses: RadarAddress[];
+export interface RadarGeocodeResponse extends RadarResponse {
+  addresses: RadarGeocodeAddress[];
 }
 
 export interface RadarIPGeocodeResponse extends RadarResponse {
   ip: string;
-  address?: RadarAddress;
+  address?: RadarGeocodeAddress;
   proxy?: boolean;
 }
 
@@ -352,6 +377,8 @@ export interface RadarAutocompleteParams {
   /** @deprecated this is always true, regardless of the value passed here */
   expandUnits?: boolean;
   mailable?: boolean;
+  lang?: string;
+  postalCode?: string;
 }
 
 export interface RadarAutocompleteResponse extends RadarResponse {
@@ -375,13 +402,15 @@ export interface RadarSearchPlacesResponse extends RadarResponse {
   places: RadarSearchPlace[];
 }
 
+export type RadarDistanceGeometryType = 'polyline' | 'polyline5' | 'polyline6' | 'linestring';
+
 export interface RadarDistanceParams {
   origin?: Location | string;
   destination: Location | string;
   modes: RadarTravelMode[] | string;
   units?: 'metric' | 'imperial';
-  geometry?: boolean;
-  geometryPoints?: boolean;
+  geometry?: RadarDistanceGeometryType;
+  geometryPoints?: number;
   avoid?: RadarAvoidOption[] | string;
 }
 
@@ -531,17 +560,12 @@ export interface RadarPolygonOptions {
     'border-opacity'?: number;
   },
 }
-export interface RadarAutocompleteUIOptions {
+export interface RadarAutocompleteUIOptions extends Omit<RadarAutocompleteParams, 'query'> {
   container: string | HTMLElement;
-  near?: string | Location; // bias for location results
   debounceMS?: number, // Debounce time in milliseconds
-  threshold?: number, // DEPRECATED(use minCharacters instead)
+  /** @deprecated use minCharacters instead */
+  threshold?: number,
   minCharacters?: number, // Minimum number of characters to trigger autocomplete
-  limit?: number, // Maximum number of autocomplete results
-  layers?: RadarGeocodeLayer[];
-  countryCode?: string;
-  expandUnits?: boolean;
-  mailable?: boolean;
   placeholder?: string, // Placeholder text for the input field
   onSelection?: (selection: any) => void,
   onRequest?: (params: RadarAutocompleteParams) => void,
@@ -557,7 +581,6 @@ export interface RadarAutocompleteUIOptions {
 }
 
 export interface RadarAutocompleteConfig extends RadarAutocompleteUIOptions {
-  container: string | HTMLElement;
   debounceMS: number, // Debounce time in milliseconds
   threshold: number, // DEPRECATED(use minCharacters instead)
   minCharacters: number, // Minimum number of characters to trigger autocomplete

package/src/ui/RadarLogoControl.ts

@@ -12,6 +12,7 @@ class RadarLogoControl {
     this.link.id = 'radar-map-logo';
     this.link.href = 'https://radar.com?ref=powered_by_radar';
     this.link.target = '_blank';
+    this.link.style.pointerEvents = "auto";
     this.link.appendChild(img);
 
     return this.link;

package/src/ui/RadarMap.ts

@@ -80,7 +80,6 @@ const getStyle = (options: RadarOptions, mapOptions: RadarMapOptions) => {
 class RadarMap extends maplibregl.Map {
   _markers: RadarMarker[] = [];
   _features: RadarMapFeature[] = [];
-  _defaultMarker?: string;
 
   constructor(radarMapOptions: RadarMapOptions) {
     const config = Config.get();
@@ -97,7 +96,7 @@ class RadarMap extends maplibregl.Map {
       radarMapOptions,
       { style },
     );
-    Logger.debug(`initialize map with options: ${JSON.stringify(mapOptions)}`);
+    Logger.debug('map initialized with options', mapOptions);
 
     (mapOptions as maplibregl.MapOptions).transformRequest = (url, resourceType) => {
       // this handles when a style is switched
@@ -153,16 +152,6 @@ class RadarMap extends maplibregl.Map {
     };
     this.on('resize', onResize);
     this.on('load', onResize);
-
-    // parse radar metadata from style
-    this.on('style.load', () => {
-      const style = this.getStyle();
-      const metadata: any = style.metadata || {};
-
-      if (metadata['radar:marker']) { // default marker associated with custom style
-        this._defaultMarker = metadata['radar:marker'];
-      }
-    });
   }
 
   addMarker(marker: RadarMarker) {

package/src/ui/RadarMarker.ts

@@ -30,9 +30,9 @@ interface ImageOptions {
 }
 
 // cache URL loaded markers
-const IMAGE_CACHE = new Map<string, 'pending' | 'failed' | Blob>();
+const IMAGE_CACHE = new Map<string, string>();
 
-const useCachedImage = (url: string, timeoutMS: number = 5000): Promise<Blob> => new Promise((resolve, reject) => {
+const useCachedImage = (url: string, timeoutMS: number = 5000): Promise<string> => new Promise((resolve, reject) => {
   if (!IMAGE_CACHE.has(url)) { // nothing in cache
     IMAGE_CACHE.set(url, 'pending'); // request in flight
     return reject('miss');
@@ -50,9 +50,9 @@ const useCachedImage = (url: string, timeoutMS: number = 5000): Promise<Blob> =>
       clearInterval(interval);
       reject('failed');
 
-    } else { // return data
+    } else if (cachedData !== undefined) { // return data
       clearInterval(interval);
-      resolve(cachedData as Blob);
+      resolve(cachedData);
     }
   }, 100);
 });
@@ -89,7 +89,6 @@ const defaultMarkerOptions: RadarMarkerOptions = {
 };
 
 class RadarMarker extends maplibregl.Marker {
-  _options: RadarMarkerOptions;
   _map!: RadarMap;
 
   constructor(markerOptions: RadarMarkerOptions) {
@@ -108,11 +107,84 @@ class RadarMarker extends maplibregl.Marker {
 
     super(maplibreOptions);
 
-    this._options = markerOptions;
-
     // handle marker images (Radar marker, or custom URL)
     if (markerOptions.marker || markerOptions.url) {
-      this.getCustomImage(markerOptions);
+      const originalElement = this._element.cloneNode(true);
+      this._element.childNodes.forEach((child) => {
+        child.remove();
+      });
+
+      const onSuccess = (url: string) => {
+        this._element.replaceChildren(createImageElement({
+          width: markerOptions.width,
+          height: markerOptions.height,
+          url,
+        }));
+      };
+
+      const onError = (err: any) => {
+        Logger.error(`Could not load marker: ${err.message} - falling back to default marker`);
+        IMAGE_CACHE.set(markerOptions.url as string, 'failed'); // mark as failed
+        this._element.replaceChildren(...Array.from(originalElement.childNodes));
+      }
+
+      // custom URL image
+      if (markerOptions.url) {
+        const loadImage = () => { // fetch marker data from URL
+          fetch(markerOptions.url as string)
+            .then(res => {
+              if (res.status === 200) {
+                res.blob()
+                  .then((data) => {
+                    const url = URL.createObjectURL(data);
+                    IMAGE_CACHE.set(markerOptions.url as string, url); // cache data
+                    onSuccess(url);
+                  })
+                  .catch(onError);
+              } else {
+                onError(new Error(res.statusText));
+              }
+            })
+            .catch(onError)
+        };
+
+        // attempt to use cached data, otherwise fetch marker image data from URL
+        useCachedImage(markerOptions.url)
+          .then(onSuccess)
+          .catch((reason: 'miss' | 'timedout' | 'failed' | Error) => {
+            if (reason !== 'miss') {
+              Logger.debug(`RadarMarker: cache lookup for ${markerOptions.url}: ${reason}`);
+            }
+            loadImage();
+          });
+      }
+
+      // Radar hosted image
+      if (markerOptions.marker) {
+        const loadMarker = () => {
+          Http.request({
+            method: 'GET',
+            version: 'maps',
+            path: `markers/${markerOptions.marker}`,
+            responseType: 'blob',
+          })
+            .then(({ data }) => {
+              const url = URL.createObjectURL(data);
+              IMAGE_CACHE.set(markerOptions.marker as string, url); // cache data
+              onSuccess(url)
+            })
+            .catch(onError);
+        };
+
+        useCachedImage(markerOptions.marker as string)
+          .then(onSuccess)
+          .catch((reason: 'miss' | 'timedout' | 'failed' | Error) => {
+            if (reason !== 'miss') {
+              Logger.debug(`RadarMarker: cache lookup for ${markerOptions.marker} ${reason}`);
+            }
+            loadMarker();
+          });
+      }
     }
 
     // handle deprecated popup options
@@ -155,7 +227,7 @@ class RadarMarker extends maplibregl.Marker {
         if (this.getPopup()) {
           // close any other open popups
           (this._map.getMarkers() || []).forEach((otherMarker) => {
-            if (otherMarker.getPopup().isOpen()) {
+            if (otherMarker.getPopup()?.isOpen()) {
               otherMarker.togglePopup();
             }
           });
@@ -167,98 +239,7 @@ class RadarMarker extends maplibregl.Marker {
     }
   }
 
-  // load marker image from a URL or as a Radar asset (custom styles)
-  getCustomImage(markerOptions: RadarMarkerOptions) {
-    const originalElement = this._element.cloneNode(true);
-    this._element.childNodes.forEach((child) => {
-      child.remove();
-    });
-
-    const onSuccess = (blob: Blob) => {
-      const markerObject = URL.createObjectURL(blob);
-      this._element.replaceChildren(createImageElement({
-        width: markerOptions.width,
-        height: markerOptions.height,
-        url: markerObject,
-      }));
-    };
-
-    const onError = (err: any) => {
-      Logger.error(`Could not load marker: ${err.message} - falling back to default marker`);
-      IMAGE_CACHE.set(markerOptions.url as string, 'failed'); // mark as failed
-      this._element.replaceChildren(...Array.from(originalElement.childNodes));
-    }
-
-    // custom URL image
-    if (markerOptions.url) {
-      const loadImage = () => { // fetch marker data from URL
-        fetch(markerOptions.url as string)
-          .then(res => {
-            if (res.status === 200) {
-              res.blob()
-                .then((data) => {
-                  IMAGE_CACHE.set(markerOptions.url as string, data); // cache data
-                  onSuccess(data);
-                })
-                .catch(onError);
-            } else {
-              onError(new Error(res.statusText));
-            }
-          })
-          .catch(onError)
-      };
-
-      // attempt to use cached data, otherwise fetch marker image data from URL
-      useCachedImage(markerOptions.url)
-        .then(onSuccess)
-        .catch((reason: 'miss' | 'timedout' | 'failed' | Error) => {
-          if (reason !== 'miss') {
-            Logger.debug(`RadarMarker: cache lookup for ${markerOptions.url}: ${reason}`);
-          }
-          loadImage();
-        });
-    }
-
-    // Radar hosted image
-    if (markerOptions.marker) {
-      const loadMarker = () => {
-        Http.request({
-          method: 'GET',
-          version: 'maps',
-          path: `markers/${markerOptions.marker}`,
-          responseType: 'blob',
-        })
-          .then(({ data }) => {
-            IMAGE_CACHE.set(markerOptions.url as string, data); // cache data
-            onSuccess(data)
-          })
-          .catch(onError);
-      };
-
-      useCachedImage(markerOptions.marker as string)
-        .then(onSuccess)
-        .catch((reason: 'miss' | 'timedout' | 'failed' | Error) => {
-          if (reason !== 'miss') {
-            Logger.debug(`RadarMarker: cache lookup for ${markerOptions.marker} ${reason}`);
-          }
-          loadMarker();
-        });
-    }
-  }
-
   addTo(map: RadarMap) {
-    // use default marker associated with map style, if none is provided in options
-    // (and custom style has an associated marker)
-    const markerOptions = this._options;
-    if (!markerOptions.url && !markerOptions.marker && !markerOptions.color) {
-      if (map._defaultMarker) {
-        this.getCustomImage({
-          ...markerOptions,
-          marker: map._defaultMarker,
-        });
-      }
-    }
-
     map.addMarker(this);
     return super.addTo(map);
   }

package/src/ui/autocomplete.ts

@@ -186,7 +186,7 @@ class AutocompleteUI {
       this.inputField.addEventListener('blur', this.close.bind(this), true);
     }
 
-    Logger.debug(`AutocompleteUI iniailized with options: ${JSON.stringify(this.config)}`);
+    Logger.debug('AutocompleteUI initialized with options', this.config);
   }
 
   public handleInput() {
@@ -247,7 +247,7 @@ class AutocompleteUI {
   }
 
   public async fetchResults(query: string) {
-    const { limit, layers, countryCode, expandUnits, mailable, onRequest } = this.config;
+    const { limit, layers, countryCode, expandUnits, mailable, lang, postalCode, onRequest } = this.config;
 
     const params: RadarAutocompleteParams = {
       query,
@@ -256,6 +256,8 @@ class AutocompleteUI {
       countryCode,
       expandUnits,
       mailable,
+      lang,
+      postalCode,
     }
 
     if (this.near) {
@@ -507,14 +509,22 @@ class AutocompleteUI {
     return this;
   }
 
-  public setWidth(width: number | string) {
-    this.config.width = width;
+  public setWidth(width: number | string | null) {
+    if (width === null) {
+      this.config.width = undefined;
+    } else if (typeof width === 'string' || typeof width === 'number') {
+      this.config.width = width;
+    }
     setWidth(this.wrapper, this.config);
     return this;
   }
 
-  public setMaxHeight(height: number | string) {
-    this.config.maxHeight = height;
+  public setMaxHeight(height: number | string | null) {
+    if (height === null) {
+      this.config.maxHeight = undefined;
+    } else if (typeof height === 'string' || typeof height === 'number') {
+      this.config.maxHeight = height;
+    }
     setHeight(this.resultsList, this.config);
     return this;
   }
@@ -530,6 +540,24 @@ class AutocompleteUI {
     return this;
   }
 
+  public setLang(lang: string | null) {
+    if (lang === null) {
+      this.config.lang = undefined;
+    } else if (typeof lang === 'string') {
+      this.config.lang = lang;
+    }
+    return this;
+  }
+
+  public setPostalCode(postalCode: string | null) {
+    if (postalCode === null) {
+      this.config.postalCode = undefined;
+    } else if (typeof postalCode === 'string') {
+      this.config.postalCode = postalCode;
+    }
+    return this;
+  }
+
   public setShowMarkers(showMarkers: boolean) {
     this.config.showMarkers = showMarkers;
     if (showMarkers) {

package/src/version.ts

@@ -1 +1 @@
-export default '4.5.0-beta.0';
+export default '4.5.0';