react-native-radar 3.15.0 → 3.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -0
- package/android/build.gradle +2 -2
- package/android/src/main/java/io/radar/react/RNRadarModule.java +20 -8
- package/app.plugin.js +1 -0
- package/dist/{src/ui → ui}/autocomplete.d.ts +2 -1
- package/dist/{src/ui → ui}/autocomplete.js +1 -1
- package/dist/{src/ui → ui}/map.d.ts +2 -1
- package/ios/Cartfile.resolved +1 -1
- package/ios/RNRadar.m +13 -5
- package/package.json +18 -11
- package/plugin/build/index.d.ts +3 -0
- package/plugin/build/index.js +6 -0
- package/plugin/build/types.d.ts +11 -0
- package/plugin/build/types.js +2 -0
- package/plugin/build/withRadar.d.ts +4 -0
- package/plugin/build/withRadar.js +26 -0
- package/plugin/build/withRadarAndroid.d.ts +3 -0
- package/plugin/build/withRadarAndroid.js +110 -0
- package/plugin/build/withRadarIOS.d.ts +3 -0
- package/plugin/build/withRadarIOS.js +75 -0
- package/react-native-radar.podspec +1 -1
- package/dist/package.json +0 -84
- package/src/@types/RadarNativeInterface.ts +0 -106
- package/src/@types/types.ts +0 -784
- package/src/helpers.js +0 -15
- package/src/index.native.ts +0 -298
- package/src/index.ts +0 -22
- package/src/index.web.js +0 -410
- package/src/ui/autocomplete.jsx +0 -323
- package/src/ui/back.png +0 -0
- package/src/ui/close.png +0 -0
- package/src/ui/images.js +0 -5
- package/src/ui/map-logo.png +0 -0
- package/src/ui/map.jsx +0 -122
- package/src/ui/marker.png +0 -0
- package/src/ui/radar-logo.png +0 -0
- package/src/ui/search.png +0 -0
- package/src/ui/styles.js +0 -125
- /package/dist/{src/@types → @types}/RadarNativeInterface.d.ts +0 -0
- /package/dist/{src/@types → @types}/RadarNativeInterface.js +0 -0
- /package/dist/{src/@types → @types}/types.d.ts +0 -0
- /package/dist/{src/@types → @types}/types.js +0 -0
- /package/dist/{src/helpers.d.ts → helpers.d.ts} +0 -0
- /package/dist/{src/helpers.js → helpers.js} +0 -0
- /package/dist/{src/index.d.ts → index.d.ts} +0 -0
- /package/dist/{src/index.js → index.js} +0 -0
- /package/dist/{src/index.native.d.ts → index.native.d.ts} +0 -0
- /package/dist/{src/index.native.js → index.native.js} +0 -0
- /package/dist/{src/index.web.d.ts → index.web.d.ts} +0 -0
- /package/dist/{src/index.web.js → index.web.js} +0 -0
- /package/dist/{src/ui → ui}/back.png +0 -0
- /package/dist/{src/ui → ui}/close.png +0 -0
- /package/dist/{src/ui → ui}/images.d.ts +0 -0
- /package/dist/{src/ui → ui}/images.js +0 -0
- /package/dist/{src/ui → ui}/map-logo.png +0 -0
- /package/dist/{src/ui → ui}/map.js +0 -0
- /package/dist/{src/ui → ui}/marker.png +0 -0
- /package/dist/{src/ui → ui}/radar-logo.png +0 -0
- /package/dist/{src/ui → ui}/search.png +0 -0
- /package/dist/{src/ui → ui}/styles.d.ts +0 -0
- /package/dist/{src/ui → ui}/styles.js +0 -0
package/src/index.web.js
DELETED
|
@@ -1,410 +0,0 @@
|
|
|
1
|
-
import RadarJS from 'radar-sdk-js';
|
|
2
|
-
|
|
3
|
-
const initialize = (publishableKey) => {
|
|
4
|
-
RadarJS.initialize(publishableKey);
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
const setLogLevel = (level) => {
|
|
8
|
-
// not implemented
|
|
9
|
-
};
|
|
10
|
-
|
|
11
|
-
const setUserId = (userId) => {
|
|
12
|
-
RadarJS.setUserId(userId);
|
|
13
|
-
};
|
|
14
|
-
|
|
15
|
-
const setDeviceId = (deviceId, installId) => {
|
|
16
|
-
RadarJS.setDeviceId(deviceId, installId);
|
|
17
|
-
}
|
|
18
|
-
const setDeviceType = (deviceType) => {
|
|
19
|
-
RadarJS.setDeviceType(deviceType);
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
const setRequestHeaders = (headers) => {
|
|
23
|
-
RadarJS.setRequestHeaders(headers);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
const setDescription = (description) => {
|
|
27
|
-
RadarJS.setDescription(description);
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
const setMetadata = (metadata) => {
|
|
31
|
-
RadarJS.setMetadata(metadata);
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
const getPermissionsStatus = () => {
|
|
35
|
-
return new Promise(resolve => {
|
|
36
|
-
const navigator = window.navigator;
|
|
37
|
-
|
|
38
|
-
if (!navigator.permissions) {
|
|
39
|
-
resolve({
|
|
40
|
-
status: 'UNKNOWN'
|
|
41
|
-
});
|
|
42
|
-
} else {
|
|
43
|
-
navigator.permissions.query({ name: 'geolocation' }).then((result) => {
|
|
44
|
-
resolve({
|
|
45
|
-
status: result.state === 'granted' ? 'GRANTED_FOREGROUND' : 'DENIED',
|
|
46
|
-
});
|
|
47
|
-
});
|
|
48
|
-
}
|
|
49
|
-
});
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
const requestPermissions = background => {
|
|
53
|
-
// not implemented
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
const getLocation = () => {
|
|
57
|
-
return new Promise((resolve, reject) => {
|
|
58
|
-
RadarJS.getLocation((err, result) => {
|
|
59
|
-
if (err)
|
|
60
|
-
reject(err);
|
|
61
|
-
else
|
|
62
|
-
resolve(result);
|
|
63
|
-
})
|
|
64
|
-
});
|
|
65
|
-
};
|
|
66
|
-
|
|
67
|
-
const trackOnce = options => {
|
|
68
|
-
return new Promise((resolve, reject) => {
|
|
69
|
-
const callback = (err, { status, location, user, events }) => {
|
|
70
|
-
if (err) {
|
|
71
|
-
reject(err);
|
|
72
|
-
} else {
|
|
73
|
-
resolve({
|
|
74
|
-
status,
|
|
75
|
-
location,
|
|
76
|
-
user,
|
|
77
|
-
events,
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
};
|
|
81
|
-
|
|
82
|
-
if (options) {
|
|
83
|
-
RadarJS.trackOnce(options.location ? options.location : options, callback);
|
|
84
|
-
} else {
|
|
85
|
-
RadarJS.trackOnce(callback);
|
|
86
|
-
}
|
|
87
|
-
});
|
|
88
|
-
};
|
|
89
|
-
|
|
90
|
-
const trackVerified = () => {
|
|
91
|
-
// not implemented
|
|
92
|
-
};
|
|
93
|
-
|
|
94
|
-
const trackVerifiedToken = () => {
|
|
95
|
-
// not implemented
|
|
96
|
-
};
|
|
97
|
-
|
|
98
|
-
const startTrackingEfficient = () => {
|
|
99
|
-
// not implemented
|
|
100
|
-
};
|
|
101
|
-
|
|
102
|
-
const startTrackingResponsive = () => {
|
|
103
|
-
// not implemented
|
|
104
|
-
};
|
|
105
|
-
|
|
106
|
-
const startTrackingContinuous = () => {
|
|
107
|
-
// not implemented
|
|
108
|
-
};
|
|
109
|
-
|
|
110
|
-
const startTrackingCustom = options => {
|
|
111
|
-
// not implemented
|
|
112
|
-
};
|
|
113
|
-
|
|
114
|
-
const mockTracking = options => {
|
|
115
|
-
// not implemented
|
|
116
|
-
};
|
|
117
|
-
|
|
118
|
-
const stopTracking = () => {
|
|
119
|
-
// not implemented
|
|
120
|
-
};
|
|
121
|
-
|
|
122
|
-
const setForegroundServiceOptions = options => {
|
|
123
|
-
// not implemented
|
|
124
|
-
};
|
|
125
|
-
|
|
126
|
-
const startTrip = options => {
|
|
127
|
-
return new Promise((resolve, reject) => {
|
|
128
|
-
const callback = (err, { trip, events, status }) => {
|
|
129
|
-
if (err) {
|
|
130
|
-
reject(err);
|
|
131
|
-
} else {
|
|
132
|
-
resolve({
|
|
133
|
-
trip,
|
|
134
|
-
events,
|
|
135
|
-
status
|
|
136
|
-
});
|
|
137
|
-
}
|
|
138
|
-
};
|
|
139
|
-
|
|
140
|
-
RadarJS.startTrip(options, callback);
|
|
141
|
-
});
|
|
142
|
-
};
|
|
143
|
-
|
|
144
|
-
const completeTrip = () => {
|
|
145
|
-
return new Promise((resolve, reject) => {
|
|
146
|
-
const callback = (err, { trip, events, status }) => {
|
|
147
|
-
if (err) {
|
|
148
|
-
reject(err);
|
|
149
|
-
} else {
|
|
150
|
-
resolve({
|
|
151
|
-
trip,
|
|
152
|
-
events,
|
|
153
|
-
status
|
|
154
|
-
});
|
|
155
|
-
}
|
|
156
|
-
};
|
|
157
|
-
|
|
158
|
-
RadarJS.completeTrip(callback);
|
|
159
|
-
});
|
|
160
|
-
};
|
|
161
|
-
|
|
162
|
-
const cancelTrip = () => {
|
|
163
|
-
return new Promise((resolve, reject) => {
|
|
164
|
-
const callback = (err, { trip, events, status }) => {
|
|
165
|
-
if (err) {
|
|
166
|
-
reject(err);
|
|
167
|
-
} else {
|
|
168
|
-
resolve({
|
|
169
|
-
trip,
|
|
170
|
-
events,
|
|
171
|
-
status
|
|
172
|
-
});
|
|
173
|
-
}
|
|
174
|
-
};
|
|
175
|
-
|
|
176
|
-
RadarJS.cancelTrip(callback);
|
|
177
|
-
});
|
|
178
|
-
};
|
|
179
|
-
|
|
180
|
-
const updateTrip = (tripOptions) => {
|
|
181
|
-
return new Promise((resolve, reject) => {
|
|
182
|
-
const callback = (err, { trip, events, status }) => {
|
|
183
|
-
if (err) {
|
|
184
|
-
reject(err);
|
|
185
|
-
} else {
|
|
186
|
-
resolve({
|
|
187
|
-
trip,
|
|
188
|
-
events,
|
|
189
|
-
status
|
|
190
|
-
});
|
|
191
|
-
}
|
|
192
|
-
};
|
|
193
|
-
|
|
194
|
-
RadarJS.updateTrip(tripOptions.options, tripOptions.status, callback);
|
|
195
|
-
});
|
|
196
|
-
};
|
|
197
|
-
|
|
198
|
-
const acceptEvent = (eventId, verifiedPlaceId) => {
|
|
199
|
-
// not implemented
|
|
200
|
-
};
|
|
201
|
-
|
|
202
|
-
const rejectEvent = eventId => {
|
|
203
|
-
// not implemented
|
|
204
|
-
};
|
|
205
|
-
|
|
206
|
-
const getContext = options => {
|
|
207
|
-
return new Promise((resolve, reject) => {
|
|
208
|
-
const callback = (err, { status, location, context }) => {
|
|
209
|
-
if (err) {
|
|
210
|
-
reject(err);
|
|
211
|
-
} else {
|
|
212
|
-
resolve({
|
|
213
|
-
status,
|
|
214
|
-
location,
|
|
215
|
-
context,
|
|
216
|
-
});
|
|
217
|
-
}
|
|
218
|
-
};
|
|
219
|
-
|
|
220
|
-
if (options) {
|
|
221
|
-
RadarJS.getContext(options, callback);
|
|
222
|
-
} else {
|
|
223
|
-
RadarJS.getContext(callback);
|
|
224
|
-
}
|
|
225
|
-
});
|
|
226
|
-
};
|
|
227
|
-
|
|
228
|
-
const searchPlaces = options => {
|
|
229
|
-
return new Promise((resolve, reject) => {
|
|
230
|
-
RadarJS.searchPlaces(options, (err, { status, location, places }) => {
|
|
231
|
-
if (err) {
|
|
232
|
-
reject(err);
|
|
233
|
-
} else {
|
|
234
|
-
resolve({
|
|
235
|
-
status,
|
|
236
|
-
location,
|
|
237
|
-
places,
|
|
238
|
-
});
|
|
239
|
-
}
|
|
240
|
-
});
|
|
241
|
-
});
|
|
242
|
-
};
|
|
243
|
-
|
|
244
|
-
const searchGeofences = options => {
|
|
245
|
-
return new Promise((resolve, reject) => {
|
|
246
|
-
RadarJS.searchGeofences(options, (err, { status, location, geofences }) => {
|
|
247
|
-
if (err) {
|
|
248
|
-
reject(err);
|
|
249
|
-
} else {
|
|
250
|
-
resolve({
|
|
251
|
-
status,
|
|
252
|
-
location,
|
|
253
|
-
geofences,
|
|
254
|
-
});
|
|
255
|
-
}
|
|
256
|
-
});
|
|
257
|
-
});
|
|
258
|
-
};
|
|
259
|
-
|
|
260
|
-
const autocomplete = options => {
|
|
261
|
-
return new Promise((resolve, reject) => {
|
|
262
|
-
RadarJS.autocomplete(options, (err, { status, addresses }) => {
|
|
263
|
-
if (err) {
|
|
264
|
-
reject(err);
|
|
265
|
-
} else {
|
|
266
|
-
resolve({
|
|
267
|
-
status,
|
|
268
|
-
addresses,
|
|
269
|
-
});
|
|
270
|
-
}
|
|
271
|
-
});
|
|
272
|
-
});
|
|
273
|
-
};
|
|
274
|
-
|
|
275
|
-
const geocode = options => {
|
|
276
|
-
return new Promise((resolve, reject) => {
|
|
277
|
-
let newOptions = options;
|
|
278
|
-
if (typeof options === 'string')
|
|
279
|
-
newOptions = {
|
|
280
|
-
query: options
|
|
281
|
-
};
|
|
282
|
-
|
|
283
|
-
RadarJS.geocode(newOptions, (err, { status, addresses }) => {
|
|
284
|
-
if (err) {
|
|
285
|
-
reject(err);
|
|
286
|
-
} else {
|
|
287
|
-
resolve({
|
|
288
|
-
status,
|
|
289
|
-
addresses,
|
|
290
|
-
});
|
|
291
|
-
}
|
|
292
|
-
});
|
|
293
|
-
});
|
|
294
|
-
};
|
|
295
|
-
|
|
296
|
-
const reverseGeocode = options => {
|
|
297
|
-
return new Promise((resolve, reject) => {
|
|
298
|
-
const callback = (err, { status, addresses }) => {
|
|
299
|
-
if (err) {
|
|
300
|
-
reject(err);
|
|
301
|
-
} else {
|
|
302
|
-
resolve({
|
|
303
|
-
status,
|
|
304
|
-
addresses,
|
|
305
|
-
});
|
|
306
|
-
}
|
|
307
|
-
};
|
|
308
|
-
|
|
309
|
-
if (options) {
|
|
310
|
-
RadarJS.reverseGeocode(options, callback);
|
|
311
|
-
} else {
|
|
312
|
-
RadarJS.reverseGeocode(callback);
|
|
313
|
-
}
|
|
314
|
-
});
|
|
315
|
-
};
|
|
316
|
-
|
|
317
|
-
const ipGeocode = () => {
|
|
318
|
-
return new Promise((resolve, reject) => {
|
|
319
|
-
RadarJS.ipGeocode((err, { status, address }) => {
|
|
320
|
-
if (err) {
|
|
321
|
-
reject(err);
|
|
322
|
-
} else {
|
|
323
|
-
resolve({
|
|
324
|
-
status,
|
|
325
|
-
address,
|
|
326
|
-
});
|
|
327
|
-
}
|
|
328
|
-
});
|
|
329
|
-
});
|
|
330
|
-
};
|
|
331
|
-
|
|
332
|
-
const getDistance = options => {
|
|
333
|
-
return new Promise((resolve, reject) => {
|
|
334
|
-
RadarJS.getDistance(options, (err, { status, routes }) => {
|
|
335
|
-
if (err) {
|
|
336
|
-
reject(err);
|
|
337
|
-
} else {
|
|
338
|
-
resolve({
|
|
339
|
-
status,
|
|
340
|
-
routes,
|
|
341
|
-
});
|
|
342
|
-
}
|
|
343
|
-
});
|
|
344
|
-
});
|
|
345
|
-
};
|
|
346
|
-
|
|
347
|
-
const getMatrix = options => {
|
|
348
|
-
return new Promise((resolve, reject) => {
|
|
349
|
-
RadarJS.getMatrix(options, (err, { origins, destinations, matrix, status }) => {
|
|
350
|
-
if (err) {
|
|
351
|
-
reject(err);
|
|
352
|
-
} else {
|
|
353
|
-
resolve({
|
|
354
|
-
origins,
|
|
355
|
-
destinations,
|
|
356
|
-
matrix,
|
|
357
|
-
status,
|
|
358
|
-
});
|
|
359
|
-
}
|
|
360
|
-
});
|
|
361
|
-
});
|
|
362
|
-
};
|
|
363
|
-
|
|
364
|
-
const on = (event, callback) => {
|
|
365
|
-
// not implemented
|
|
366
|
-
};
|
|
367
|
-
|
|
368
|
-
const off = (event, callback) => {
|
|
369
|
-
// not implemented
|
|
370
|
-
};
|
|
371
|
-
|
|
372
|
-
const Radar = {
|
|
373
|
-
initialize,
|
|
374
|
-
setLogLevel,
|
|
375
|
-
setUserId,
|
|
376
|
-
setDescription,
|
|
377
|
-
setMetadata,
|
|
378
|
-
getPermissionsStatus,
|
|
379
|
-
requestPermissions,
|
|
380
|
-
getLocation,
|
|
381
|
-
trackOnce,
|
|
382
|
-
trackVerified,
|
|
383
|
-
trackVerifiedToken,
|
|
384
|
-
startTrackingEfficient,
|
|
385
|
-
startTrackingResponsive,
|
|
386
|
-
startTrackingContinuous,
|
|
387
|
-
startTrackingCustom,
|
|
388
|
-
mockTracking,
|
|
389
|
-
stopTracking,
|
|
390
|
-
setForegroundServiceOptions,
|
|
391
|
-
acceptEvent,
|
|
392
|
-
rejectEvent,
|
|
393
|
-
startTrip,
|
|
394
|
-
updateTrip,
|
|
395
|
-
completeTrip,
|
|
396
|
-
cancelTrip,
|
|
397
|
-
getContext,
|
|
398
|
-
searchPlaces,
|
|
399
|
-
searchGeofences,
|
|
400
|
-
autocomplete,
|
|
401
|
-
geocode,
|
|
402
|
-
reverseGeocode,
|
|
403
|
-
ipGeocode,
|
|
404
|
-
getDistance,
|
|
405
|
-
getMatrix,
|
|
406
|
-
on,
|
|
407
|
-
off,
|
|
408
|
-
};
|
|
409
|
-
|
|
410
|
-
export default Radar;
|
package/src/ui/autocomplete.jsx
DELETED
|
@@ -1,323 +0,0 @@
|
|
|
1
|
-
// Autocomplete.js
|
|
2
|
-
import React, { useState, useCallback, useRef, useEffect } from 'react';
|
|
3
|
-
import {
|
|
4
|
-
View,
|
|
5
|
-
TextInput,
|
|
6
|
-
FlatList,
|
|
7
|
-
TouchableOpacity,
|
|
8
|
-
Text,
|
|
9
|
-
StyleSheet,
|
|
10
|
-
Image,
|
|
11
|
-
Modal,
|
|
12
|
-
KeyboardAvoidingView,
|
|
13
|
-
Animated,
|
|
14
|
-
Dimensions,
|
|
15
|
-
Easing,
|
|
16
|
-
Keyboard,
|
|
17
|
-
SafeAreaView,
|
|
18
|
-
Pressable,
|
|
19
|
-
} from 'react-native';
|
|
20
|
-
import Radar from '../index.native';
|
|
21
|
-
import {
|
|
22
|
-
BACK_ICON,
|
|
23
|
-
SEARCH_ICON,
|
|
24
|
-
RADAR_LOGO,
|
|
25
|
-
MARKER_ICON,
|
|
26
|
-
CLOSE_ICON,
|
|
27
|
-
} from "./images";
|
|
28
|
-
import { default as defaultStyles } from './styles';
|
|
29
|
-
|
|
30
|
-
const defaultAutocompleteOptions = {
|
|
31
|
-
debounceMS: 200, // Debounce time in milliseconds
|
|
32
|
-
minCharacters: 3, // Minimum number of characters to trigger autocomplete
|
|
33
|
-
limit: 8, // Maximum number of results to return
|
|
34
|
-
placeholder: "Search address", // Placeholder text for the input field
|
|
35
|
-
showMarkers: true,
|
|
36
|
-
disabled: false,
|
|
37
|
-
};
|
|
38
|
-
|
|
39
|
-
const autocompleteUI = ({ options = {} }) => {
|
|
40
|
-
const [query, setQuery] = useState("");
|
|
41
|
-
const [results, setResults] = useState([]);
|
|
42
|
-
const [isOpen, setIsOpen] = useState(false);
|
|
43
|
-
const animationValue = useRef(new Animated.Value(0)).current; // animation value
|
|
44
|
-
const timerRef = useRef(null);
|
|
45
|
-
const textInputRef = useRef(null);
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
const config = { ...defaultAutocompleteOptions, ...options };
|
|
49
|
-
const style = config.style || {};
|
|
50
|
-
|
|
51
|
-
const fetchResults = useCallback(
|
|
52
|
-
async (searchQuery) => {
|
|
53
|
-
if (searchQuery.length < config.minCharacters) return;
|
|
54
|
-
|
|
55
|
-
const { limit, layers, countryCode } = config;
|
|
56
|
-
const params = { query: searchQuery, limit, layers, countryCode };
|
|
57
|
-
|
|
58
|
-
if (config.near && config.near.latitude && config.near.longitude) {
|
|
59
|
-
params.near = config.near;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
try {
|
|
63
|
-
const result = await Radar.autocomplete(params);
|
|
64
|
-
|
|
65
|
-
if (config.onResults && typeof config.onResults === "function") {
|
|
66
|
-
config.onResults(result.addresses);
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
setResults(result.addresses);
|
|
70
|
-
setIsOpen(true);
|
|
71
|
-
} catch (error) {
|
|
72
|
-
if (config.onError && typeof config.onError === "function") {
|
|
73
|
-
config.onError(error);
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
},
|
|
77
|
-
[config]
|
|
78
|
-
);
|
|
79
|
-
|
|
80
|
-
const handleInput = useCallback(
|
|
81
|
-
(text) => {
|
|
82
|
-
setQuery(text);
|
|
83
|
-
|
|
84
|
-
// Clear the existing timer
|
|
85
|
-
if (timerRef.current) {
|
|
86
|
-
clearTimeout(timerRef.current);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
if (text.length < config.minCharacters) {
|
|
90
|
-
return;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
// Set the new timer
|
|
94
|
-
timerRef.current = setTimeout(() => {
|
|
95
|
-
fetchResults(text);
|
|
96
|
-
}, config.debounceMS);
|
|
97
|
-
},
|
|
98
|
-
[config, fetchResults]
|
|
99
|
-
);
|
|
100
|
-
|
|
101
|
-
const handleSelect = (item) => {
|
|
102
|
-
setQuery(item.formattedAddress);
|
|
103
|
-
setIsOpen(false);
|
|
104
|
-
|
|
105
|
-
if (typeof config.onSelection === "function") {
|
|
106
|
-
config.onSelection(item);
|
|
107
|
-
}
|
|
108
|
-
};
|
|
109
|
-
|
|
110
|
-
const renderFooter = () => {
|
|
111
|
-
if (results.length === 0) return null;
|
|
112
|
-
|
|
113
|
-
return (
|
|
114
|
-
<View style={styles.footerContainer}>
|
|
115
|
-
<View style={{ flexDirection: "row", alignItems: "center" }}>
|
|
116
|
-
<Text style={styles.footerText}>Powered by</Text>
|
|
117
|
-
<Image
|
|
118
|
-
source={RADAR_LOGO}
|
|
119
|
-
resizeMode="contain"
|
|
120
|
-
style={defaultStyles.logo}
|
|
121
|
-
/>
|
|
122
|
-
</View>
|
|
123
|
-
</View>
|
|
124
|
-
);
|
|
125
|
-
};
|
|
126
|
-
|
|
127
|
-
const renderItem = ({ item }) => (
|
|
128
|
-
<Pressable
|
|
129
|
-
style={({ pressed }) => [
|
|
130
|
-
{
|
|
131
|
-
...styles.resultItem,
|
|
132
|
-
backgroundColor: pressed
|
|
133
|
-
? styles.resultItem.pressedBackgroundColor
|
|
134
|
-
: styles.resultItem.backgroundColor,
|
|
135
|
-
},
|
|
136
|
-
]}
|
|
137
|
-
onPress={() => handleSelect(item)}
|
|
138
|
-
>
|
|
139
|
-
<View style={styles.addressContainer}>
|
|
140
|
-
<View style={styles.pinIconContainer}>
|
|
141
|
-
{config.showMarkers ? (
|
|
142
|
-
<Image source={MARKER_ICON} style={styles.pinIcon} />
|
|
143
|
-
) : null}
|
|
144
|
-
</View>
|
|
145
|
-
<View style={styles.addressTextContainer}>
|
|
146
|
-
<Text numberOfLines={1} style={styles.addressText}>
|
|
147
|
-
{item.addressLabel || item?.placeLabel}
|
|
148
|
-
</Text>
|
|
149
|
-
{item?.formattedAddress.length > 0 && (
|
|
150
|
-
<Text numberOfLines={1} style={styles.addressSubtext}>
|
|
151
|
-
{item?.formattedAddress?.replace(
|
|
152
|
-
`${item?.addressLabel || item?.placeLabel}, `,
|
|
153
|
-
""
|
|
154
|
-
)}
|
|
155
|
-
</Text>
|
|
156
|
-
)}
|
|
157
|
-
</View>
|
|
158
|
-
</View>
|
|
159
|
-
</Pressable>
|
|
160
|
-
);
|
|
161
|
-
|
|
162
|
-
const styles = {
|
|
163
|
-
...defaultStyles,
|
|
164
|
-
container: StyleSheet.compose(defaultStyles.container, style.container),
|
|
165
|
-
input: StyleSheet.compose(defaultStyles.input, style.input),
|
|
166
|
-
inputContainer: StyleSheet.compose(
|
|
167
|
-
defaultStyles.inputContainer,
|
|
168
|
-
style.inputContainer
|
|
169
|
-
),
|
|
170
|
-
modalInputContainer: StyleSheet.compose(
|
|
171
|
-
defaultStyles.modalInputContainer,
|
|
172
|
-
style.modalInputContainer
|
|
173
|
-
),
|
|
174
|
-
resultList: StyleSheet.compose(defaultStyles.resultList, style.resultList),
|
|
175
|
-
resultItem: StyleSheet.compose({...defaultStyles.resultItem, pressedBackgroundColor: '#F6FAFC'}, style.resultItem),
|
|
176
|
-
addressContainer: StyleSheet.compose(
|
|
177
|
-
defaultStyles.addressContainer,
|
|
178
|
-
style.addressContainer
|
|
179
|
-
),
|
|
180
|
-
pinIconContainer: StyleSheet.compose(
|
|
181
|
-
defaultStyles.pinIconContainer,
|
|
182
|
-
style.pinIconContainer
|
|
183
|
-
),
|
|
184
|
-
pinIcon: StyleSheet.compose(defaultStyles.pinIcon, style.pinIcon),
|
|
185
|
-
addressTextContainer: StyleSheet.compose(
|
|
186
|
-
defaultStyles.addressTextContainer,
|
|
187
|
-
style.addressTextContainer
|
|
188
|
-
),
|
|
189
|
-
addressText: StyleSheet.compose(
|
|
190
|
-
defaultStyles.addressText,
|
|
191
|
-
style.addressText
|
|
192
|
-
),
|
|
193
|
-
addressSubtext: StyleSheet.compose(
|
|
194
|
-
defaultStyles.addressSubtext,
|
|
195
|
-
style.addressSubtext
|
|
196
|
-
),
|
|
197
|
-
footerContainer: StyleSheet.compose(
|
|
198
|
-
defaultStyles.footerContainer,
|
|
199
|
-
style.footerContainer
|
|
200
|
-
),
|
|
201
|
-
footerText: StyleSheet.compose(defaultStyles.footerText, style.footerText),
|
|
202
|
-
};
|
|
203
|
-
|
|
204
|
-
useEffect(() => {
|
|
205
|
-
Animated.timing(animationValue, {
|
|
206
|
-
toValue: isOpen ? 1 : 0,
|
|
207
|
-
duration: 300,
|
|
208
|
-
easing: Easing.inOut(Easing.ease),
|
|
209
|
-
useNativeDriver: false,
|
|
210
|
-
}).start();
|
|
211
|
-
}, [isOpen]);
|
|
212
|
-
|
|
213
|
-
const screenHeight = Dimensions.get("window").height;
|
|
214
|
-
|
|
215
|
-
const inputHeight = animationValue.interpolate({
|
|
216
|
-
inputRange: [0, 1],
|
|
217
|
-
outputRange: [40, screenHeight],
|
|
218
|
-
});
|
|
219
|
-
|
|
220
|
-
const modalOpacity = animationValue.interpolate({
|
|
221
|
-
inputRange: [0, 0.5, 1],
|
|
222
|
-
outputRange: [0, 0, 1],
|
|
223
|
-
});
|
|
224
|
-
|
|
225
|
-
return (
|
|
226
|
-
<View style={styles.container}>
|
|
227
|
-
<Animated.View style={{ height: inputHeight }}>
|
|
228
|
-
<TouchableOpacity
|
|
229
|
-
style={styles.inputContainer}
|
|
230
|
-
onPress={() => {
|
|
231
|
-
if (config.disabled) return;
|
|
232
|
-
|
|
233
|
-
setIsOpen(true);
|
|
234
|
-
// Set the focus on the other textinput after it opens
|
|
235
|
-
setTimeout(() => {
|
|
236
|
-
textInputRef.current.focus();
|
|
237
|
-
}, 100);
|
|
238
|
-
}}
|
|
239
|
-
>
|
|
240
|
-
<Image source={SEARCH_ICON} style={styles.inputIcon} />
|
|
241
|
-
<TextInput
|
|
242
|
-
style={styles.input}
|
|
243
|
-
onFocus={() => {
|
|
244
|
-
setIsOpen(true);
|
|
245
|
-
setTimeout(() => {
|
|
246
|
-
textInputRef.current.focus();
|
|
247
|
-
}, 100);
|
|
248
|
-
}}
|
|
249
|
-
value={query}
|
|
250
|
-
returnKeyType="done"
|
|
251
|
-
placeholder={config.placeholder}
|
|
252
|
-
placeholderTextColor="#acbdc8"
|
|
253
|
-
/>
|
|
254
|
-
</TouchableOpacity>
|
|
255
|
-
</Animated.View>
|
|
256
|
-
<Modal
|
|
257
|
-
animationType="slide"
|
|
258
|
-
transparent={false}
|
|
259
|
-
visible={isOpen}
|
|
260
|
-
onRequestClose={() => setIsOpen(false)}
|
|
261
|
-
>
|
|
262
|
-
<Animated.View style={{ flex: 1, opacity: modalOpacity }}>
|
|
263
|
-
<SafeAreaView>
|
|
264
|
-
<KeyboardAvoidingView
|
|
265
|
-
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
|
266
|
-
keyboardVerticalOffset={50}
|
|
267
|
-
style={styles.container}
|
|
268
|
-
>
|
|
269
|
-
<View style={styles.modalInputContainer}>
|
|
270
|
-
<TouchableOpacity
|
|
271
|
-
onPress={() => {
|
|
272
|
-
setIsOpen(false);
|
|
273
|
-
}}
|
|
274
|
-
>
|
|
275
|
-
<Image source={BACK_ICON} style={styles.inputIcon} />
|
|
276
|
-
</TouchableOpacity>
|
|
277
|
-
<TextInput
|
|
278
|
-
ref={textInputRef}
|
|
279
|
-
style={styles.input}
|
|
280
|
-
onChangeText={handleInput}
|
|
281
|
-
value={query}
|
|
282
|
-
placeholder={config.placeholder}
|
|
283
|
-
returnKeyType="done"
|
|
284
|
-
onSubmitEditing={() => {
|
|
285
|
-
setIsOpen(false);
|
|
286
|
-
}}
|
|
287
|
-
placeholderTextColor="#acbdc8"
|
|
288
|
-
/>
|
|
289
|
-
<TouchableOpacity
|
|
290
|
-
onPress={() => {
|
|
291
|
-
setQuery("");
|
|
292
|
-
}}
|
|
293
|
-
>
|
|
294
|
-
<Image source={CLOSE_ICON} style={styles.closeIcon} />
|
|
295
|
-
</TouchableOpacity>
|
|
296
|
-
</View>
|
|
297
|
-
{results.length > 0 && (
|
|
298
|
-
<View style={styles.resultListWrapper}>
|
|
299
|
-
<FlatList
|
|
300
|
-
style={styles.resultList}
|
|
301
|
-
data={results}
|
|
302
|
-
onScroll={() => {
|
|
303
|
-
textInputRef.current.blur();
|
|
304
|
-
Keyboard.dismiss();
|
|
305
|
-
}}
|
|
306
|
-
keyboardShouldPersistTaps="handled"
|
|
307
|
-
renderItem={renderItem}
|
|
308
|
-
keyExtractor={(item) =>
|
|
309
|
-
item.formattedAddress + item.postalCode
|
|
310
|
-
}
|
|
311
|
-
/>
|
|
312
|
-
{renderFooter()}
|
|
313
|
-
</View>
|
|
314
|
-
)}
|
|
315
|
-
</KeyboardAvoidingView>
|
|
316
|
-
</SafeAreaView>
|
|
317
|
-
</Animated.View>
|
|
318
|
-
</Modal>
|
|
319
|
-
</View>
|
|
320
|
-
);
|
|
321
|
-
};
|
|
322
|
-
|
|
323
|
-
export default autocompleteUI;
|
package/src/ui/back.png
DELETED
|
Binary file
|