@controleonline/ui-default 1.0.263 → 1.0.265

package/src/react/components/map/DefaultMap.native.js

@@ -1,71 +1,73 @@
-import React, {useMemo} from 'react';
-import {View} from 'react-native';
-import {WebView} from 'react-native-webview';
-
-import DefaultNativeMap from './DefaultNativeMap.native';
-
-import styles from './DefaultMap.styles';
-import {
-  buildOpenStreetMapHtml,
-  resolveDefaultMapPayload,
-} from './DefaultMap.shared';
-
-export default function DefaultMap({
-  config = null,
-  addresses = null,
-  markerPayloads = [],
-  paths = [],
-  userCoordinates = null,
-  apiKey = '',
-}) {
-  const resolvedPayload = useMemo(
-    () =>
-      resolveDefaultMapPayload({
-        config,
-        addresses,
-        markerPayloads,
-        paths,
-        userCoordinates,
-        apiKey,
-      }),
-    [apiKey, addresses, config, markerPayloads, paths, userCoordinates],
-  );
-
-  if (
-    resolvedPayload.markerPayloads.length === 0 &&
-    !resolvedPayload.userCoordinates &&
-    resolvedPayload.paths.length === 0
-  ) {
-    return null;
-  }
-
-  if (resolvedPayload.apiKey) {
-    return (
-      <DefaultNativeMap
-        apiKey={resolvedPayload.apiKey}
-        markerPayloads={resolvedPayload.markerPayloads}
-        userCoordinates={resolvedPayload.userCoordinates}
-        paths={resolvedPayload.paths}
-      />
-    );
-  }
-
-  return (
-    <View style={styles.mapContainer}>
-      <WebView
-        source={{
-          html: buildOpenStreetMapHtml({
-            markerPayloads: resolvedPayload.markerPayloads,
-            paths: resolvedPayload.paths,
-            userCoordinates: resolvedPayload.userCoordinates,
-            routeColor: '#0EA5E9',
-          }),
-        }}
-        style={styles.mapViewport}
-        originWhitelist={['*']}
-        javaScriptEnabled
-        domStorageEnabled
-      />
-    </View>
-  );
-}
+import React, {useMemo} from 'react';
+import {View} from 'react-native';
+import {WebView} from 'react-native-webview';
+
+import DefaultNativeMap from './DefaultNativeMap.native';
+
+import styles from './DefaultMap.styles';
+import {
+  buildOpenStreetMapHtml,
+  resolveDefaultMapPayload,
+} from './DefaultMap.shared';
+
+export default function DefaultMap({
+  config = null,
+  addresses = null,
+  markerPayloads = [],
+  paths = [],
+  userCoordinates = null,
+  apiKey = '',
+  popupTheme = null,
+}) {
+  const resolvedPayload = useMemo(
+    () =>
+      resolveDefaultMapPayload({
+        config,
+        addresses,
+        markerPayloads,
+        paths,
+        userCoordinates,
+        apiKey,
+      }),
+    [apiKey, addresses, config, markerPayloads, paths, userCoordinates],
+  );
+
+  if (
+    resolvedPayload.markerPayloads.length === 0 &&
+    !resolvedPayload.userCoordinates &&
+    resolvedPayload.paths.length === 0
+  ) {
+    return null;
+  }
+
+  if (resolvedPayload.apiKey) {
+    return (
+      <DefaultNativeMap
+        apiKey={resolvedPayload.apiKey}
+        markerPayloads={resolvedPayload.markerPayloads}
+        userCoordinates={resolvedPayload.userCoordinates}
+        paths={resolvedPayload.paths}
+        popupTheme={popupTheme}
+      />
+    );
+  }
+
+  return (
+    <View style={styles.mapContainer}>
+      <WebView
+        source={{
+          html: buildOpenStreetMapHtml({
+            markerPayloads: resolvedPayload.markerPayloads,
+            paths: resolvedPayload.paths,
+            userCoordinates: resolvedPayload.userCoordinates,
+            routeColor: '#0EA5E9',
+          }),
+        }}
+        style={styles.mapViewport}
+        originWhitelist={['*']}
+        javaScriptEnabled
+        domStorageEnabled
+      />
+    </View>
+  );
+}

package/src/react/components/map/DefaultMap.styles.js

@@ -1,16 +1,16 @@
-import {StyleSheet} from 'react-native';
-
-export default StyleSheet.create({
-  mapContainer: {
-    width: '100%',
-    height: '100%',
-    position: 'relative',
-    backgroundColor: '#E5EEF5',
-  },
-  mapViewport: {
-    width: '100%',
-    height: '100%',
-    borderWidth: 0,
-    backgroundColor: '#E5EEF5',
-  },
-});
+import {StyleSheet} from 'react-native';
+
+export default StyleSheet.create({
+  mapContainer: {
+    width: '100%',
+    height: '100%',
+    position: 'relative',
+    backgroundColor: '#E5EEF5',
+  },
+  mapViewport: {
+    width: '100%',
+    height: '100%',
+    borderWidth: 0,
+    backgroundColor: '#E5EEF5',
+  },
+});

package/src/react/components/map/DefaultMap.web.js

@@ -1,66 +1,68 @@
-import React, {useMemo} from 'react';
-import {View} from 'react-native';
-
-import DefaultGoogleMap from './DefaultGoogleMap.web';
-
-import styles from './DefaultMap.styles';
-import {
-  buildOpenStreetMapHtml,
-  resolveDefaultMapPayload,
-} from './DefaultMap.shared';
-
-export default function DefaultMap({
-  config = null,
-  addresses = null,
-  markerPayloads = [],
-  paths = [],
-  userCoordinates = null,
-  apiKey = '',
-}) {
-  const resolvedPayload = useMemo(
-    () =>
-      resolveDefaultMapPayload({
-        config,
-        addresses,
-        markerPayloads,
-        paths,
-        userCoordinates,
-        apiKey,
-      }),
-    [apiKey, addresses, config, markerPayloads, paths, userCoordinates],
-  );
-
-  if (
-    resolvedPayload.markerPayloads.length === 0 &&
-    !resolvedPayload.userCoordinates &&
-    resolvedPayload.paths.length === 0
-  ) {
-    return null;
-  }
-
-  if (resolvedPayload.apiKey) {
-    return (
-      <DefaultGoogleMap
-        apiKey={resolvedPayload.apiKey}
-        markerPayloads={resolvedPayload.markerPayloads}
-        userCoordinates={resolvedPayload.userCoordinates}
-        paths={resolvedPayload.paths}
-      />
-    );
-  }
-
-  return (
-    <View style={styles.mapContainer}>
-      <iframe
-        title="Mapa"
-        srcDoc={buildOpenStreetMapHtml({
-          markerPayloads: resolvedPayload.markerPayloads,
-          paths: resolvedPayload.paths,
-          userCoordinates: resolvedPayload.userCoordinates,
-          routeColor: '#0EA5E9',
-        })}
-        style={{width: '100%', height: '100%', border: 0}}
-      />
-    </View>
-  );
-}
+import React, {useMemo} from 'react';
+import {View} from 'react-native';
+
+import DefaultGoogleMap from './DefaultGoogleMap.web';
+
+import styles from './DefaultMap.styles';
+import {
+  buildOpenStreetMapHtml,
+  resolveDefaultMapPayload,
+} from './DefaultMap.shared';
+
+export default function DefaultMap({
+  config = null,
+  addresses = null,
+  markerPayloads = [],
+  paths = [],
+  userCoordinates = null,
+  apiKey = '',
+  popupTheme = null,
+}) {
+  const resolvedPayload = useMemo(
+    () =>
+      resolveDefaultMapPayload({
+        config,
+        addresses,
+        markerPayloads,
+        paths,
+        userCoordinates,
+        apiKey,
+      }),
+    [apiKey, addresses, config, markerPayloads, paths, userCoordinates],
+  );
+
+  if (
+    resolvedPayload.markerPayloads.length === 0 &&
+    !resolvedPayload.userCoordinates &&
+    resolvedPayload.paths.length === 0
+  ) {
+    return null;
+  }
+
+  if (resolvedPayload.apiKey) {
+    return (
+      <DefaultGoogleMap
+        apiKey={resolvedPayload.apiKey}
+        markerPayloads={resolvedPayload.markerPayloads}
+        userCoordinates={resolvedPayload.userCoordinates}
+        paths={resolvedPayload.paths}
+        popupTheme={popupTheme}
+      />
+    );
+  }
+
+  return (
+    <View style={styles.mapContainer}>
+      <iframe
+        title="Mapa"
+        srcDoc={buildOpenStreetMapHtml({
+          markerPayloads: resolvedPayload.markerPayloads,
+          paths: resolvedPayload.paths,
+          userCoordinates: resolvedPayload.userCoordinates,
+          routeColor: '#0EA5E9',
+        })}
+        style={{width: '100%', height: '100%', border: 0}}
+      />
+    </View>
+  );
+}