react-native-map-link 3.0.2 → 3.1.0

package/README.md

@@ -10,7 +10,7 @@ An easy way to open a location in a map app of the user's choice, based on the a
 on their device. The app supports Apple Maps, Google Maps, Citymapper, Uber, and a dozen other apps.
 
 <details>
-<summary>Full list of supported apps</summary>
+<summary><strong>Full list of supported apps</strong></summary>
 
 - Apple Maps – `apple-maps`
 - Google Maps – `google-maps`
@@ -34,15 +34,21 @@ on their device. The app supports Apple Maps, Google Maps, Citymapper, Uber, and
 - 2GIS - `dgis`
 - Liftago - `liftago`
 - Petal Maps - `petalmaps` (Android only)
+- Sygic - `sygic`
 
 </details>
 
+<br /><p align="center">
+<img src="./docs/example.png" alt="Example screenshot" width="320" />
+
+</p>
+
 ## Installation
 
 ### 1. Install the package
 
 ```shell
-npm i -S react-native-map-link         # or yarn add react-native-map-link
+npm i -S react-native-map-link      # or yarn add react-native-map-link
 ```
 
 ### 2. Post-install steps
@@ -79,6 +85,7 @@ Just add this in your `Info.plist` depending on which apps you'd like to support
     <string>nmap</string>
     <string>dgis</string>
     <string>lftgpas</string>
+    <string>sygic</string>
 </array>
 ```
 
@@ -195,6 +202,10 @@ You can do so by coping the `<queries>` statement below, and pasting it in the t
     <action android:name="android.intent.action.VIEW" />
     <data android:scheme="petalmaps" />
   </intent>
+  <intent>
+    <action android:name="android.intent.action.VIEW" />
+    <data android:scheme="com.sygic.aura" />
+  </intent>
 </queries>
 ```
 
@@ -215,7 +226,19 @@ More info [here](https://stackoverflow.com/a/67383641/1129689).
 
 </details>
 
-## Usage
+## Simple example
+
+```js
+import {showLocation} from 'react-native-map-link';
+
+showLocation({
+  latitude: 38.8976763,
+  longitude: -77.0387185,
+  title: 'Your destination',
+});
+```
+
+## Full usage
 
 Using the `showLocation` function will shown an action sheet on iOS and an alert on Android, without any custom styling:
 
@@ -236,8 +259,8 @@ showLocation({
   cancelText: 'This is the cancel button text', // optional (default: 'Cancel')
   appsWhiteList: ['google-maps'], // optionally you can set which apps to show (default: will show all supported apps installed on device)
   naverCallerName: 'com.example.myapp', // to link into Naver Map You should provide your appname which is the bundle ID in iOS and applicationId in android.
-  appTitles: { 'google-maps': 'My custom Google Maps title' }, // optionally you can override default app titles
-  app: 'uber',  // optionally specify specific app to use
+  appTitles: {'google-maps': 'My custom Google Maps title'}, // optionally you can override default app titles
+  app: 'uber', // optionally specify specific app to use
   directionsMode: 'walk', // optional, accepted values are 'car', 'walk', 'public-transport' or 'bike'
 });
 ```
@@ -245,8 +268,9 @@ showLocation({
 Notes:
 
 - The `sourceLatitude` / `sourceLongitude` options only work if you specify both. Currently supports all apps except Waze.
-- `directionsMode` works on google-maps and apple-maps (on the latter, `bike` mode will not work). Without setting it, the app will decide based on his own settings.
+- `directionsMode` works on google-maps, apple-maps and sygic (on apple-maps, `bike` mode will not work, while on sygic, only `walk` and `car` will work). Without setting it, the app will decide based on its own settings.
 - If you set `directionsMode` but do not set `sourceLatitude` and `sourceLongitude`, google-maps and apple-maps will still enter directions mode, and use the current location as starting point.
+-
 
 ### Or
 

package/lib/components/popup/Popup.d.ts

@@ -35,5 +35,5 @@ interface PopupProps {
     appsWhiteList?: string[];
     setIsVisible: (isVisible: boolean) => void;
 }
-declare const Popup: React.FC<PopupProps>;
-export default Popup;
+export declare const Popup: React.FC<PopupProps>;
+export {};

package/lib/components/popup/Popup.js

@@ -26,6 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Popup = void 0;
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const utils_1 = require("../../utils");
@@ -82,6 +83,7 @@ const Popup = ({ isVisible, showHeader = true, customHeader, customFooter, onApp
       </react_native_1.View>
     </react_native_1.Modal>);
 };
+exports.Popup = Popup;
 const styles = react_native_1.StyleSheet.create({
     container: {
         backgroundColor: 'white',
@@ -107,4 +109,3 @@ const styles = react_native_1.StyleSheet.create({
         elevation: 5,
     },
 });
-exports.default = Popup;

package/lib/constants.js

@@ -27,6 +27,7 @@ const generatePrefixes = ({ alwaysIncludeGoogle, naverCallerName, }) => {
         dgis: 'dgis://2gis.ru/',
         liftago: 'lftgpas://',
         petalmaps: 'petalmaps://',
+        sygic: 'com.sygic.aura://',
     };
 };
 exports.generatePrefixes = generatePrefixes;
@@ -60,6 +61,7 @@ const generateTitles = (titles) => {
         dgis: '2GIS',
         liftago: 'Liftago',
         petalmaps: 'Petal Maps',
+        sygic: 'Sygic',
         ...(titles || {}),
     };
 };
@@ -87,6 +89,7 @@ exports.icons = {
     dgis: require('./images/dgis.png'),
     liftago: require('./images/liftago.png'),
     petalmaps: require('./images/petalmaps.png'),
+    sygic: require('./images/sygic.png'),
 };
 exports.appKeys = Object.keys(exports.icons);
 exports.colorsPopup = {

package/lib/index.d.ts

@@ -1,4 +1,5 @@
 import { GetAppsProps, GetAppsResponse, ShowLocationProps } from './type';
 export type { DirectionMode, GetAppsProps, GetAppsResponse, MapId, MapLinkOptions, PopupProps, PopupStyleProp, SharedOptions, ShowLocationProps, } from './type';
+export { Popup } from './components/popup/Popup';
 export declare const showLocation: ({ latitude, longitude, sourceLatitude, sourceLongitude, appleIgnoreLatLon, alwaysIncludeGoogle, googleForceLatLon, googlePlaceId, title: customTitle, app: customApp, dialogTitle: customDialogTitle, dialogMessage: customDialogMessage, cancelText: customCancelText, appsWhiteList: customAppsWhiteList, appTitles, naverCallerName, directionsMode, }: ShowLocationProps) => Promise<string | null | undefined>;
 export declare function getApps({ alwaysIncludeGoogle, appsWhiteList, appTitles, naverCallerName, ...rest }: GetAppsProps): Promise<GetAppsResponse[]>;

package/lib/index.js

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getApps = exports.showLocation = void 0;
+exports.getApps = exports.showLocation = exports.Popup = void 0;
 const react_native_1 = require("react-native");
 const constants_1 = require("./constants");
 const utils_1 = require("./utils");
+var Popup_1 = require("./components/popup/Popup");
+Object.defineProperty(exports, "Popup", { enumerable: true, get: function () { return Popup_1.Popup; } });
 const showLocation = async ({ latitude, longitude, sourceLatitude, sourceLongitude, appleIgnoreLatLon, alwaysIncludeGoogle, googleForceLatLon, googlePlaceId, title: customTitle, app: customApp, dialogTitle: customDialogTitle, dialogMessage: customDialogMessage, cancelText: customCancelText, appsWhiteList: customAppsWhiteList, appTitles, naverCallerName, directionsMode, }) => {
     const prefixes = (0, constants_1.generatePrefixes)({
         alwaysIncludeGoogle,

package/lib/utils.d.ts

@@ -13,6 +13,7 @@ export declare const askAppChoice: ({ dialogTitle, dialogMessage, cancelText, ap
 }) => Promise<string | null>;
 export declare const getDirectionsModeAppleMaps: (directionsMode: 'car' | 'walk' | 'public-transport' | 'bike' | undefined) => string | undefined;
 export declare const getDirectionsModeGoogleMaps: (directionsMode: 'car' | 'walk' | 'public-transport' | 'bike' | undefined) => string | undefined;
+export declare const getDirectionsModeSygic: (directionsMode: 'car' | 'walk' | 'public-transport' | 'bike' | undefined) => string | undefined;
 export declare const checkOptions: ({ latitude, longitude, googleForceLatLon, googlePlaceId, title, app, prefixes, appTitles, appsWhiteList, }: {
     latitude: number | string;
     longitude: number | string;

package/lib/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateMapUrl = exports.checkOptions = exports.getDirectionsModeGoogleMaps = exports.getDirectionsModeAppleMaps = exports.askAppChoice = exports.checkNotSupportedApps = exports.getNotSupportedApps = exports.isSupportedApp = exports.isAppInstalled = exports.getAvailableApps = void 0;
+exports.generateMapUrl = exports.checkOptions = exports.getDirectionsModeSygic = exports.getDirectionsModeGoogleMaps = exports.getDirectionsModeAppleMaps = exports.askAppChoice = exports.checkNotSupportedApps = exports.getNotSupportedApps = exports.isSupportedApp = exports.isAppInstalled = exports.getAvailableApps = void 0;
 const react_native_1 = require("react-native");
 const constants_1 = require("./constants");
 const getAvailableApps = async (prefixes) => {
@@ -107,6 +107,16 @@ const getDirectionsModeGoogleMaps = (directionsMode) => {
     return modeMap[directionsMode || ''] || undefined;
 };
 exports.getDirectionsModeGoogleMaps = getDirectionsModeGoogleMaps;
+const getDirectionsModeSygic = (directionsMode) => {
+    const modeMap = {
+        car: 'drive',
+        walk: 'walk',
+        'public-transport': 'show',
+        bike: 'show',
+    };
+    return modeMap[directionsMode || ''] || undefined;
+};
+exports.getDirectionsModeSygic = getDirectionsModeSygic;
 const checkOptions = ({ latitude, longitude, googleForceLatLon, googlePlaceId, title, app, prefixes, appTitles, appsWhiteList, }) => {
     if (!latitude || !longitude) {
         throw new MapsException('`showLocation` should contain keys `latitude` and `longitude`.');
@@ -295,6 +305,11 @@ const generateMapUrl = ({ app, directionsMode, appleIgnoreLatLon, googleForceLat
                 url += `&saddr=${sourceLat},${sourceLng}`;
             }
             break;
+        case 'sygic':
+            const sygicDirectionsMode = (0, exports.getDirectionsModeSygic)(directionsMode);
+            url = `${prefixes.sygic}coordinate|${lng}|${lat}|`;
+            url += sygicDirectionsMode ? `${sygicDirectionsMode}` : '';
+            break;
     }
     return url;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-map-link",
-  "version": "3.0.2",
+  "version": "3.1.0",
   "description": "Open the map app of the user's choice with a specific location.",
   "source": "src/index",
   "main": "lib/index.js",
@@ -60,6 +60,7 @@
     "jest": "^29.7.0",
     "metro-react-native-babel-preset": "^0.77.0",
     "prettier": "^3.2.5",
+    "react": "^18.2.0",
     "react-native": "^0.73.4",
     "react-native-typescript-transformer": "^1.2.13",
     "semantic-release": "^23.0.2",
@@ -74,8 +75,7 @@
       "js"
     ],
     "transform": {
-      "^.+\\.(js)$": "<rootDir>/node_modules/babel-jest",
-      "\\.(ts|tsx)$": "ts-jest"
+      "^.+\\.(js|ts|tsx)$": "<rootDir>/node_modules/babel-jest"
     },
     "setupFiles": [
       "./tests/setup.ts"