@maplibre/maplibre-react-native 10.0.0-alpha.5 → 10.0.0-alpha.7

package/docs/MapView.md

@@ -16,40 +16,16 @@
 | pitchEnabled | `boolean` | `true` | `false` | Enable/Disable pitch on map |
 | rotateEnabled | `boolean` | `true` | `false` | Enable/Disable rotation on map |
 | attributionEnabled | `boolean` | `true` | `false` | Enable/Disable attribution on map.<br/><br/>This must be enabled for Mapbox-hosted tiles and styles. Please refer to the Mapbox Terms of Service.<br/>Other providers do not require this. |
-| attributionPosition | `\| {
-    top?: number;
-    left?: number;
-  }
-\| {
-    top?: number;
-    right?: number;
-  }
-\| {
-    bottom?: number;
-    left?: number;
-  }
-\| {
-    bottom?: number;
-    right?: number;
-  }` | `none` | `false` | Adds attribution offset, e.g. `{top: 8, left: 8}` will put attribution button in top-left corner of the map |
+| attributionPosition | `\| {top?: number; left?: number}
+\| {top?: number; right?: number}
+\| {bottom?: number; left?: number}
+\| {bottom?: number; right?: number}` | `none` | `false` | Adds attribution offset, e.g. `{top: 8, left: 8}` will put attribution button in top-left corner of the map |
 | tintColor | `string \| unknown[]` | `none` | `false` | MapView's tintColor |
 | logoEnabled | `boolean` | `false` | `false` | Enable/Disable the logo on the map. |
-| logoPosition | `\| {
-    top?: number;
-    left?: number;
-  }
-\| {
-    top?: number;
-    right?: number;
-  }
-\| {
-    bottom?: number;
-    left?: number;
-  }
-\| {
-    bottom?: number;
-    right?: number;
-  }` | `none` | `false` | Adds logo offset, e.g. `{top: 8, left: 8}` will put the logo in top-left corner of the map |
+| logoPosition | `\| {top?: number; left?: number}
+\| {top?: number; right?: number}
+\| {bottom?: number; left?: number}
+\| {bottom?: number; right?: number}` | `none` | `false` | Adds logo offset, e.g. `{top: 8, left: 8}` will put the logo in top-left corner of the map |
 | compassEnabled | `boolean` | `none` | `false` | Enable/Disable the compass from appearing on the map |
 | compassViewPosition | `number` | `none` | `false` | Change corner of map the compass starts at. 0: TopLeft, 1: TopRight, 2: BottomLeft, 3: BottomRight |
 | compassViewMargins | `object` | `none` | `false` | Add margins to the compass with x and y values |
@@ -115,7 +91,7 @@ Returns an array of rendered map features that intersect with a given point.
 ##### arguments
 | Name | Type | Required | Description  |
 | ---- | :--: | :------: | :----------: |
-| `point` | `tuple` | `Yes` | A point expressed in the map view’s coordinate system. |
+| `point` | `tuple` | `Yes` | undefined |
 | `filter` | `FilterExpression` | `No` | A set of strings that correspond to the names of layers defined in the current style. Only the features contained in these layers are included in the returned array. |
 | `layerIDs` | `Array` | `No` | A array of layer id's to filter the features by |
 

package/docs/UserLocation.md

@@ -14,14 +14,22 @@
 | children | `ReactElement \| ReactElement[]` | `none` | `false` | Custom location icon of type mapbox-gl-native components<br/><br/>NOTE: Forking maintainer does not understand the above comment. |
 
 ### methods
-#### setLocationManager({running}: {running: boolean})
+#### setLocationManager({
+  running,
+}: {
+  running: boolean;
+})
 
 Whether to start or stop listening to the locationManager<br/><br/>Notice, that listening will start automatically when<br/>either `onUpdate` or `visible` are set
 
 ##### arguments
 | Name | Type | Required | Description  |
 | ---- | :--: | :------: | :----------: |
-| `{running}: {running: boolean}` | `{running:boolean}` | `Yes` | undefined |
+| `{
+  running,
+}: {
+  running: boolean;
+}` | `{running:boolean;}` | `Yes` | undefined |
 
 
 #### needsLocationManagerRunning()

package/docs/docs.json

@@ -25,24 +25,9 @@
       {
         "name": "symbolStyle",
         "docblock": null,
-        "modifiers": [
-          "get"
-        ],
+        "modifiers": [],
         "params": [],
-        "returns": {
-          "type": {
-            "name": "union",
-            "raw": "SymbolLayerStyleProps | undefined",
-            "elements": [
-              {
-                "name": "SymbolLayerStyleProps"
-              },
-              {
-                "name": "undefined"
-              }
-            ]
-          }
-        }
+        "returns": null
       }
     ],
     "props": [
@@ -268,14 +253,14 @@
     "methods": [
       {
         "name": "fitBounds",
-        "docblock": "Map camera transitions to fit provided bounds\n\n@example\nthis.camera.fitBounds([lng, lat], [lng, lat])\nthis.camera.fitBounds([lng, lat], [lng, lat], 20, 1000) // padding for all sides\nthis.camera.fitBounds([lng, lat], [lng, lat], [verticalPadding, horizontalPadding], 1000)\nthis.camera.fitBounds([lng, lat], [lng, lat], [top, right, bottom, left], 1000)\n\n@param {Array<Number>} northEastCoordinates - North east coordinate of bound\n@param {Array<Number>} southWestCoordinates - South west coordinate of bound\n@param {Number=} padding - Camera padding for bound\n@param {Number=} animationDuration - Duration of camera animation\n@return {void}",
+        "docblock": "Map camera transitions to fit provided bounds\n\n@example\nthis.camera.fitBounds([lng, lat], [lng, lat])\nthis.camera.fitBounds([lng, lat], [lng, lat], 20, 1000) // padding for all sides\nthis.camera.fitBounds([lng, lat], [lng, lat], [verticalPadding, horizontalPadding], 1000)\nthis.camera.fitBounds([lng, lat], [lng, lat], [top, right, bottom, left], 1000)\n\n@param {Array<Number>} northEastCoordinates - North east coordinate of bound\n@param {Array<Number>} southWestCoordinates - South west coordinate of bound\n@param {Number|Array<Number>|undefined} padding - Padding for the bounds\n@param {Number=} animationDuration - Duration of camera animation\n@return {void}",
         "modifiers": [],
         "params": [
           {
             "name": "northEastCoordinates",
             "description": "North east coordinate of bound",
             "type": {
-              "name": "Array"
+              "name": "GeoJSON.Position"
             },
             "optional": false
           },
@@ -283,15 +268,15 @@
             "name": "southWestCoordinates",
             "description": "South west coordinate of bound",
             "type": {
-              "name": "Array"
+              "name": "GeoJSON.Position"
             },
             "optional": false
           },
           {
             "name": "padding",
-            "description": "Camera padding for bound",
+            "description": "Padding for the bounds",
             "type": {
-              "name": "Number"
+              "name": "Number \\| Array"
             },
             "optional": true
           },
@@ -1586,7 +1571,8 @@
       }
     ],
     "composes": [
-      "BaseProps"
+      "BaseProps",
+      "BaseLayerProps"
     ],
     "fileNameWithExt": "Light.tsx",
     "name": "Light",
@@ -2136,7 +2122,7 @@
       },
       {
         "name": "getVisibleBounds",
-        "docblock": "The coordinate bounds(ne, sw) visible in the users’s viewport.\n\n@example\nconst visibleBounds = await this._map.getVisibleBounds();\n\n@return {VisibleBounds}",
+        "docblock": "The coordinate bounds(ne, sw) visible in the users’s viewport.\n\n@example\nconst visibleBounds = await this._map.getVisibleBounds();\n\n@return {Array}",
         "modifiers": [
           "async"
         ],
@@ -2169,18 +2155,17 @@
       },
       {
         "name": "queryRenderedFeaturesAtPoint",
-        "docblock": "Returns an array of rendered map features that intersect with a given point.\n\n@example\nthis._map.queryRenderedFeaturesAtPoint([30, 40], ['==', 'type', 'Point'], ['id1', 'id2'])\n\n@typedef {number} ScreenPointX\n@typedef {number} ScreenPointY\n@param  {[ScreenPointX, ScreenPointY]} point - A point expressed in the map view’s coordinate system.\n@param  {Array=} filter - A set of strings that correspond to the names of layers defined in the current style. Only the features contained in these layers are included in the returned array.\n@param  {Array=} layerIDs - A array of layer id's to filter the features by\n@return {GeoJSON.FeatureCollection}",
+        "docblock": "Returns an array of rendered map features that intersect with a given point.\n\n@example\nthis._map.queryRenderedFeaturesAtPoint([30, 40], ['==', 'type', 'Point'], ['id1', 'id2'])\n\n@param  {Array<Number>} coordinate - A point expressed in the map view’s coordinate system.\n@param  {Array=} filter - A set of strings that correspond to the names of layers defined in the current style. Only the features contained in these layers are included in the returned array.\n@param  {Array=} layerIDs - A array of layer id's to filter the features by\n@return {GeoJSON.FeatureCollection}",
         "modifiers": [
           "async"
         ],
         "params": [
           {
             "name": "point",
-            "description": "A point expressed in the map view’s coordinate system.",
+            "optional": false,
             "type": {
               "name": "tuple"
-            },
-            "optional": false
+            }
           },
           {
             "name": "filter",
@@ -2500,7 +2485,7 @@
       {
         "name": "attributionPosition",
         "required": false,
-        "type": "\\| {\n    top?: number;\n    left?: number;\n  }\n\\| {\n    top?: number;\n    right?: number;\n  }\n\\| {\n    bottom?: number;\n    left?: number;\n  }\n\\| {\n    bottom?: number;\n    right?: number;\n  }",
+        "type": "\\| {top?: number; left?: number}\n\\| {top?: number; right?: number}\n\\| {bottom?: number; left?: number}\n\\| {bottom?: number; right?: number}",
         "default": "none",
         "description": "Adds attribution offset, e.g. `{top: 8, left: 8}` will put attribution button in top-left corner of the map"
       },
@@ -2521,7 +2506,7 @@
       {
         "name": "logoPosition",
         "required": false,
-        "type": "\\| {\n    top?: number;\n    left?: number;\n  }\n\\| {\n    top?: number;\n    right?: number;\n  }\n\\| {\n    bottom?: number;\n    left?: number;\n  }\n\\| {\n    bottom?: number;\n    right?: number;\n  }",
+        "type": "\\| {top?: number; left?: number}\n\\| {top?: number; right?: number}\n\\| {bottom?: number; left?: number}\n\\| {bottom?: number; right?: number}",
         "default": "none",
         "description": "Adds logo offset, e.g. `{top: 8, left: 8}` will put the logo in top-left corner of the map"
       },
@@ -4778,10 +4763,10 @@
         ],
         "params": [
           {
-            "name": "{running}: {running: boolean}",
+            "name": "{\n  running,\n}: {\n  running: boolean;\n}",
             "optional": false,
             "type": {
-              "name": "{running:boolean}"
+              "name": "{running:boolean;}"
             }
           }
         ],

package/docs/offlineManager.md

@@ -0,0 +1,246 @@
+<!-- This file was autogenerated from offlineManager.js do not modify -->
+## <MapLibreGL.offlineManager />
+### OfflineManager implements a singleton (shared object) that manages offline packs.<br/>All of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.<br/>The shared object maintains a canonical collection of offline packs.
+
+
+### methods
+#### createPack(options[, progressListener][, errorListener])
+
+Creates and registers an offline pack that downloads the resources needed to use the given region offline.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `options` | `OfflineCreatePackOptions` | `Yes` | Create options for a offline pack that specifices zoom levels, style url, and the region to download. |
+| `progressListener` | `Callback` | `No` | Callback that listens for status events while downloading the offline resource. |
+| `errorListener` | `Callback` | `No` | Callback that listens for status events while downloading the offline resource. |
+
+
+
+```javascript
+const progressListener = (offlineRegion, status) => console.log(offlineRegion, status);
+const errorListener = (offlineRegion, err) => console.log(offlineRegion, err);
+
+await MapLibreGL.offlineManager.createPack({
+  name: 'offlinePack',
+  styleURL: 'mapbox://...',
+  minZoom: 14,
+  maxZoom: 20,
+  bounds: [[neLng, neLat], [swLng, swLat]]
+}, progressListener, errorListener)
+```
+
+
+#### invalidatePack(name)
+
+Invalidates the specified offline pack. This method checks that the tiles in the specified offline pack match those from the server. Local tiles that do not match the latest version on the server are updated.This is more efficient than deleting the offline pack and downloading it again. If the data stored locally matches that on the server, new data will not be downloaded.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `name` | `String` | `Yes` | Name of the offline pack. |
+
+
+
+```javascript
+await MapLibreGL.offlineManager.invalidatePack('packName')
+```
+
+
+#### deletePack(name)
+
+Unregisters the given offline pack and allows resources that are no longer required by any remaining packs to be potentially freed.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `name` | `String` | `Yes` | Name of the offline pack. |
+
+
+
+```javascript
+await MapLibreGL.offlineManager.deletePack('packName')
+```
+
+
+#### invalidateAmbientCache()
+
+Forces a revalidation of the tiles in the ambient cache and downloads a fresh version of the tiles from the tile server.<br/>This is the recommend method for clearing the cache.<br/>This is the most efficient method because tiles in the ambient cache are re-downloaded to remove outdated data from a device.<br/>It does not erase resources from the ambient cache or delete the database, which can be computationally expensive operations that may carry unintended side effects.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+
+
+
+
+```javascript
+await MapLibreGL.offlineManager.invalidateAmbientCache();
+```
+
+
+#### clearAmbientCache()
+
+Erases resources from the ambient cache.<br/>This method clears the cache and decreases the amount of space that map resources take up on the device.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+
+
+
+
+```javascript
+await MapLibreGL.offlineManager.clearAmbientCache();
+```
+
+
+#### setMaximumAmbientCacheSize(size)
+
+Sets the maximum size of the ambient cache in bytes. Disables the ambient cache if set to 0.<br/>This method may be computationally expensive because it will erase resources from the ambient cache if its size is decreased.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `size` | `Number` | `Yes` | Size of ambient cache. |
+
+
+
+```javascript
+await MapLibreGL.offlineManager.setMaximumAmbientCacheSize(5000000);
+```
+
+
+#### resetDatabase()
+
+Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+
+
+
+
+```javascript
+await MapLibreGL.offlineManager.resetDatabase();
+```
+
+
+#### getPacks()
+
+Retrieves all the current offline packs that are stored in the database.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+
+
+
+
+```javascript
+const offlinePacks = await MapLibreGL.offlineManager.getPacks();
+```
+
+
+#### getPack(name)
+
+Retrieves an offline pack that is stored in the database by name.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `name` | `String` | `Yes` | Name of the offline pack. |
+
+
+
+```javascript
+const offlinePack = await MapLibreGL.offlineManager.getPack();
+```
+
+
+#### mergeOfflineRegions(path)
+
+Sideloads offline db
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `path` | `String` | `Yes` | Path to offline tile db on file system. |
+
+
+
+```javascript
+await MapLibreGL.offlineManager.mergeOfflineRegions(path);
+```
+
+
+#### setTileCountLimit(limit)
+
+Sets the maximum number of tiles that may be downloaded and stored on the current device.<br/>Consult the Terms of Service for your map tile host before changing this value.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `limit` | `Number` | `Yes` | Map tile limit count. |
+
+
+
+```javascript
+MapLibreGL.offlineManager.setTileCountLimit(1000);
+```
+
+
+#### setProgressEventThrottle(throttleValue)
+
+Sets the period at which download status events will be sent over the React Native bridge.<br/>The default is 500ms.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `throttleValue` | `Number` | `Yes` | event throttle value in ms. |
+
+
+
+```javascript
+MapLibreGL.offlineManager.setProgressEventThrottle(500);
+```
+
+
+#### subscribe(packName, progressListener, errorListener)
+
+Subscribe to download status/error events for the requested offline pack.<br/>Note that createPack calls this internally if listeners are provided.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `packName` | `String` | `Yes` | Name of the offline pack. |
+| `progressListener` | `Callback` | `Yes` | Callback that listens for status events while downloading the offline resource. |
+| `errorListener` | `Callback` | `Yes` | Callback that listens for status events while downloading the offline resource. |
+
+
+
+```javascript
+const progressListener = (offlinePack, status) => console.log(offlinePack, status)
+const errorListener = (offlinePack, err) => console.log(offlinePack, err)
+MapLibreGL.offlineManager.subscribe('packName', progressListener, errorListener)
+```
+
+
+#### unsubscribe(packName)
+
+Unsubscribes any listeners associated with the offline pack.<br/>It's a good idea to call this on componentWillUnmount.
+
+##### arguments
+| Name | Type | Required | Description  |
+| ---- | :--: | :------: | :----------: |
+| `packName` | `String` | `Yes` | Name of the offline pack. |
+
+
+
+```javascript
+MapLibreGL.offlineManager.unsubscribe('packName')
+```
+
+
+

package/javascript/Maplibre.ts

@@ -5,10 +5,12 @@ export {
   type CameraPadding,
   type CameraAnimationMode,
   type CameraBounds,
+  type CameraRef,
 } from './components/Camera';
-export {default as MapView, type MapViewState} from './components/MapView';
+export {default as MapView, type MapViewRef} from './components/MapView';
 export {default as Light} from './components/Light';
 export {default as PointAnnotation} from './components/PointAnnotation';
+export type {PointAnnotationRef} from './components/PointAnnotation';
 export {default as Annotation} from './components/annotations/Annotation';
 export {default as Callout} from './components/Callout';
 export {requestAndroidLocationPermissions} from './requestAndroidLocationPermissions';
@@ -16,8 +18,10 @@ export {
   default as UserLocation,
   UserLocationRenderMode,
 } from './components/UserLocation';
+export type {UserLocationRef} from './components/UserLocation';
 export {default as VectorSource} from './components/VectorSource';
 export {default as ShapeSource} from './components/ShapeSource';
+export type {ShapeSourceRef} from './components/ShapeSource';
 export {default as RasterSource} from './components/RasterSource';
 export {default as ImageSource} from './components/ImageSource';
 export {default as Images} from './components/Images';

package/javascript/components/BackgroundLayer.tsx

@@ -1,16 +1,18 @@
 import {BackgroundLayerStyleProps} from '../utils/MaplibreStyles';
 import BaseProps from '../types/BaseProps';
+import useAbstractLayer, {
+  BaseLayerProps,
+  NativeBaseProps,
+} from '../hooks/useAbstractLayer';
 
-import AbstractLayer, {BaseLayerProps, NativeBaseProps} from './AbstractLayer';
-
-import React, {ReactNode} from 'react';
+import React from 'react';
 import {NativeModules, requireNativeComponent} from 'react-native';
 
 const MapLibreGL = NativeModules.MLNModule;
 
 export const NATIVE_MODULE_NAME = 'RCTMLNBackgroundLayer';
 
-interface BackgroundLayerProps extends BaseProps, BaseLayerProps {
+export interface BackgroundLayerProps extends BaseProps, BaseLayerProps {
   /**
    * Customizable style attributes
    */
@@ -21,23 +23,28 @@ interface NativeProps
   extends Omit<BackgroundLayerProps, 'style'>,
     NativeBaseProps {}
 
-class BackgroundLayer extends AbstractLayer<BackgroundLayerProps, NativeProps> {
-  static defaultProps = {
-    sourceID: MapLibreGL.StyleSource.DefaultSourceID,
-  };
-
-  render(): ReactNode {
-    return (
-      <RCTMLNBackgroundLayer
-        testID="rctmlnBackgroundLayer"
-        ref={this.setNativeLayer}
-        {...this.baseProps}
-      />
-    );
-  }
-}
-
 const RCTMLNBackgroundLayer =
   requireNativeComponent<BackgroundLayerProps>(NATIVE_MODULE_NAME);
 
+const BackgroundLayer: React.FC<BackgroundLayerProps> = ({
+  sourceID = MapLibreGL.StyleSource.DefaultSourceID,
+  ...props
+}: BackgroundLayerProps) => {
+  const {baseProps, setNativeLayer} = useAbstractLayer<
+    BackgroundLayerProps,
+    NativeProps
+  >({
+    ...props,
+    sourceID,
+  });
+
+  return (
+    <RCTMLNBackgroundLayer
+      testID="rctmlnBackgroundLayer"
+      ref={setNativeLayer}
+      {...baseProps}
+    />
+  );
+};
+
 export default BackgroundLayer;

package/javascript/components/Callout.tsx

@@ -82,59 +82,59 @@ interface NativeProps extends Omit<CalloutProps, 'style'> {
 /**
  *  Callout that displays information about a selected annotation near the annotation.
  */
-class Callout extends React.PureComponent<CalloutProps> {
-  get _containerStyle(): ViewStyle[] {
-    const style = [
-      {
-        position: 'absolute',
-        zIndex: 999,
-        backgroundColor: 'transparent',
-      } as ViewStyle,
-    ];
+const Callout = (props: CalloutProps): ReactElement => {
+  const {
+    title,
+    style,
+    containerStyle,
+    contentStyle,
+    tipStyle,
+    textStyle,
+    children,
+  } = props;
 
-    if (this.props.containerStyle) {
-      style.push(this.props.containerStyle);
-    }
+  const _containerStyle: ViewStyle[] = [
+    {
+      position: 'absolute',
+      zIndex: 999,
+      backgroundColor: 'transparent',
+      ...containerStyle,
+    } as ViewStyle,
+  ];
 
-    return style;
-  }
+  const _hasChildren = React.Children.count(children) > 0;
 
-  get _hasChildren(): boolean {
-    return React.Children.count(this.props.children) > 0;
-  }
-
-  _renderDefaultCallout(): ReactElement {
+  const _renderDefaultCallout = (): ReactElement => {
     return (
-      <Animated.View style={[styles.container, this.props.style]}>
-        <View style={[styles.content, this.props.contentStyle]}>
-          <Text style={[styles.title, this.props.textStyle]}>
-            {this.props.title}
+      <Animated.View testID="container" style={[styles.container, style]}>
+        <View testID="wrapper" style={[styles.content, contentStyle]}>
+          <Text testID="title" style={[styles.title, textStyle]}>
+            {title}
           </Text>
         </View>
-        <View style={[styles.tip, this.props.tipStyle]} />
+        <View testID="tip" style={[styles.tip, tipStyle]} />
       </Animated.View>
     );
-  }
+  };
 
-  _renderCustomCallout(): ReactElement {
+  const _renderCustomCallout = (): ReactElement => {
     return (
-      <Animated.View {...this.props} style={this.props.style}>
-        {this.props.children}
+      <Animated.View testID="container" {...props} style={style}>
+        {children}
       </Animated.View>
     );
-  }
+  };
 
-  render(): ReactElement {
-    const calloutContent = this._hasChildren
-      ? this._renderCustomCallout()
-      : this._renderDefaultCallout();
-    return (
-      <RCTMLNCallout style={this._containerStyle}>
-        {calloutContent}
-      </RCTMLNCallout>
-    );
-  }
-}
+  const calloutContent = _hasChildren
+    ? _renderCustomCallout()
+    : _renderDefaultCallout();
+
+  return (
+    <RCTMLNCallout testID="callout" style={_containerStyle}>
+      {calloutContent}
+    </RCTMLNCallout>
+  );
+};
 
 const RCTMLNCallout = requireNativeComponent<NativeProps>(NATIVE_MODULE_NAME);