radarlabs · boonboonsiri · Dec 5, 2023 · Dec 6, 2023 · Dec 6, 2023 · Dec 7, 2023
diff --git a/README.md b/README.md
@@ -56,7 +56,7 @@ Radar.initialize('prj_test_pk_...', { /* options */ });
 
 Add the following script in your `html` file
 ```html
-<script src="https://js.radar.com/v4.1.12/radar.min.js"></script>
+<script src="https://js.radar.com/v4.1.12-beta.0/radar.min.js"></script>
 ```
 
 Then initialize the Radar SDK
@@ -73,8 +73,8 @@ To create a map, first initialize the Radar SDK with your publishable key. Then
 ```html
 <html>
   <head>
-    <link href="https://js.radar.com/v4.1.12/radar.css" rel="stylesheet">
-    <script src="https://js.radar.com/v4.1.12/radar.min.js"></script>
+    <link href="https://js.radar.com/v4.1.12-beta.0/radar.css" rel="stylesheet">
+    <script src="https://js.radar.com/v4.1.12-beta.0/radar.min.js"></script>
   </head>
 
   <body>
@@ -98,8 +98,8 @@ To create an autocomplete input, first initialize the Radar SDK with your publis
 ```html
 <html>
   <head>
-    <link href="https://js.radar.com/v4.1.12/radar.css" rel="stylesheet">
-    <script src="https://js.radar.com/v4.1.12/radar.min.js"></script>
+    <link href="https://js.radar.com/v4.1.12-beta.0/radar.css" rel="stylesheet">
+    <script src="https://js.radar.com/v4.1.12-beta.0/radar.min.js"></script>
   </head>
 
   <body>
@@ -130,8 +130,8 @@ To power [geofencing](https://radar.com/documentation/geofencing/overview) exper
 ```html
 <html>
   <head>
-    <link href="https://js.radar.com/v4.1.12/radar.css" rel="stylesheet">
-    <script src="https://js.radar.com/v4.1.12/radar.min.js"></script>
+    <link href="https://js.radar.com/v4.1.12-beta.0/radar.css" rel="stylesheet">
+    <script src="https://js.radar.com/v4.1.12-beta.0/radar.min.js"></script>
   </head>
 
   <body>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "radar-sdk-js",
-  "version": "4.1.12",
+  "version": "4.1.12-beta.0",
   "description": "Web Javascript SDK for Radar, location infrastructure for mobile and web apps.",
   "homepage": "https://radar.com",
   "type": "module",

diff --git a/src/api/search.ts b/src/api/search.ts
@@ -9,6 +9,7 @@ import type {
   RadarSearchPlacesResponse,
   RadarSearchGeofencesParams,
   RadarSearchGeofencesResponse,
+  RadarAutocompleteSessionSelectionParams,
 } from '../types';
 
 class SearchAPI {
@@ -22,6 +23,7 @@ class SearchAPI {
       layers,
       countryCode,
       expandUnits,
+      session,
     } = params;
 
     // near can be provided as a string or Location object
@@ -42,6 +44,7 @@ class SearchAPI {
         layers,
         countryCode,
         expandUnits,
+        session,
       },
     });
 
@@ -56,6 +59,16 @@ class SearchAPI {
     return autocompleteRes;
   }
 
+  static async autocompleteSelect(params: RadarAutocompleteSessionSelectionParams) {
+    await Http.request({
+      method: 'GET',
+      path: 'search/autocomplete/selection',
+      data: {
+        ...params
+      },
+    });
+  }
+
   static async searchGeofences(params: RadarSearchGeofencesParams): Promise<RadarSearchGeofencesResponse> {
     const options = Config.get();
 

diff --git a/src/types.ts b/src/types.ts
@@ -342,6 +342,23 @@ export interface RadarAutocompleteParams {
   layers?: RadarGeocodeLayer[];
   countryCode?: string;
   expandUnits?: boolean;
+  session?: string;
+}
+
+export interface RadarAutocompleteSessionSelectionParams {
+  session: string;
+  selection: number;
+  radarSessionId?: string;
+  userId?: string;
+  deviceId?: string;
+  installId?: string;
+
+  query?: string;
+  near?: Location | string;
+  limit?: number;
+  layers?: RadarGeocodeLayer[];
+  countryCode?: string;
+  expandUnits?: boolean;
 }
 
 export interface RadarAutocompleteResponse extends RadarResponse {

diff --git a/src/ui/autocomplete.ts b/src/ui/autocomplete.ts
@@ -1,8 +1,13 @@
 import Logger from '../logger';
 import SearchAPI from '../api/search';
+import Device from '../device';
+import Session from '../session';
+import Storage from '../storage';
 
 import { RadarAutocompleteContainerNotFound } from '../errors';
-import type { RadarAutocompleteUIOptions, RadarAutocompleteConfig, RadarAutocompleteParams, Location } from '../types';
+import type { RadarAutocompleteUIOptions, RadarAutocompleteConfig, RadarAutocompleteParams, Location, RadarAutocompleteSessionSelectionParams } from '../types';
+
+import crypto from 'crypto';
 
 const CLASSNAMES = {
   WRAPPER: 'radar-autocomplete-wrapper',
@@ -86,6 +91,8 @@
   resultsList: HTMLElement;
   wrapper: HTMLElement;
   poweredByLink?: HTMLElement;
+  session?: string;
+  autocompleteParams?: RadarAutocompleteParams;
 
   // create a new AutocompleteUI instance
   public static createAutocomplete(autocompleteOptions: RadarAutocompleteUIOptions): AutocompleteUI {
@@ -238,12 +245,18 @@
   public async fetchResults(query: string) {
     const { limit, layers, countryCode, expandUnits, onRequest } = this.config;
 
+    if (!this.session) {
+      this.session = this.generateUUID();
+    }
+    const session = this.session;
+
     const params: RadarAutocompleteParams = {
       query,
       limit,
       layers,
       countryCode,
       expandUnits,
+      session,
     }
 
     if (this.near) {
@@ -254,6 +267,8 @@
       onRequest(params);
     }
 
+    this.autocompleteParams = params; // set previous params for autocomplete session selections
+
     const { addresses } = await SearchAPI.autocomplete(params);
     return addresses;
   }
@@ -442,6 +457,28 @@
       onSelection(result);
     }
 
+    // Radar Autocomplete Session
+    if (this.session) {
+      const userId = Storage.getItem(Storage.USER_ID) || undefined;
+      const deviceId = Device.getDeviceId() || undefined;
+      const installId = Device.getInstallId() || undefined;
+      const radarSessionId = Session.getSessionId() || undefined;
+      const params: RadarAutocompleteSessionSelectionParams = {
+        session: this.session,
+        selection: index,
+        userId,
+        deviceId,
+        installId,
+        radarSessionId,
+        ...this.autocompleteParams
+      }
+      SearchAPI.autocompleteSelect(params);
+    }
+
+    // Close out session
+    this.session = undefined;
+    this.autocompleteParams = undefined;
+
     // clear results list
     this.close();
   }
@@ -511,6 +548,16 @@
     return this;
   }
 
+  public generateUUID = (): string => {
+    const uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (char) => {
+      const r = Math.random() * 16 | 0;
+      const v = (char == 'x') ? r : (r & 0x3 | 0x8);
+      return v.toString(16);
+    });
+
+    return uuid;
+  }
+
   public setShowMarkers(showMarkers: boolean) {
     this.config.showMarkers = showMarkers;
     if (showMarkers) {

diff --git a/src/version.ts b/src/version.ts
@@ -1 +1 @@
-export default '4.1.12';
+export default '4.1.12-beta.0';