@maplibre/maplibre-react-native 10.0.0-beta.12 → 10.0.0-beta.14

package/src/components/Camera.tsx

@@ -1,12 +1,19 @@
 import { point } from "@turf/helpers";
-import { forwardRef, memo, useImperativeHandle, useMemo } from "react";
-import { requireNativeComponent, type ViewProps } from "react-native";
+import {
+  forwardRef,
+  memo,
+  useEffect,
+  useImperativeHandle,
+  useMemo,
+  useState,
+} from "react";
+import { Platform, requireNativeComponent, type ViewProps } from "react-native";
 
 import { CameraModes } from "../MLRNModule";
 import { useNativeRef } from "../hooks/useNativeRef";
 import { type BaseProps } from "../types/BaseProps";
 import { CameraMode } from "../types/CameraMode";
-import type { MapLibreRNEvent } from "../types/MapLibreRNEvent";
+import { type MapLibreRNEvent } from "../types/MapLibreRNEvent";
 import { makeNativeBounds } from "../utils/makeNativeBounds";
 
 export const NATIVE_MODULE_NAME = "MLRNCamera";
@@ -47,54 +54,62 @@ function makeNativeCameraStop(stop?: CameraStop): NativeCameraStop | undefined {
     return undefined;
   }
 
-  const nativeStop: NativeCameraStop = {};
+  const newNativeStop: NativeCameraStop = {};
 
   if (stop.animationDuration !== undefined) {
-    nativeStop.duration = stop.animationDuration;
+    newNativeStop.duration = stop.animationDuration;
   }
   if (stop.animationMode !== undefined) {
-    nativeStop.mode = getNativeCameraMode(stop.animationMode);
+    newNativeStop.mode = getNativeCameraMode(stop.animationMode);
   }
   if (stop.centerCoordinate) {
-    nativeStop.centerCoordinate = JSON.stringify(point(stop.centerCoordinate));
+    newNativeStop.centerCoordinate = JSON.stringify(
+      point(stop.centerCoordinate),
+    );
   }
   if (stop.heading !== undefined) {
-    nativeStop.heading = stop.heading;
+    newNativeStop.heading = stop.heading;
   }
   if (stop.pitch !== undefined) {
-    nativeStop.pitch = stop.pitch;
+    newNativeStop.pitch = stop.pitch;
   }
   if (stop.zoomLevel !== undefined) {
-    nativeStop.zoom = stop.zoomLevel;
+    newNativeStop.zoom = stop.zoomLevel;
   }
 
   if (stop.bounds && stop.bounds.ne && stop.bounds.sw) {
     const { ne, sw } = stop.bounds;
-    nativeStop.bounds = makeNativeBounds(ne, sw);
+    newNativeStop.bounds = makeNativeBounds(ne, sw);
   }
 
   const paddingTop = stop.padding?.paddingTop ?? stop.bounds?.paddingTop;
   if (paddingTop !== undefined) {
-    nativeStop.paddingTop = paddingTop;
+    newNativeStop.paddingTop = paddingTop;
   }
 
   const paddingRight = stop.padding?.paddingRight ?? stop.bounds?.paddingRight;
   if (paddingRight !== undefined) {
-    nativeStop.paddingRight = paddingRight;
+    newNativeStop.paddingRight = paddingRight;
   }
 
   const paddingBottom =
     stop.padding?.paddingBottom ?? stop.bounds?.paddingBottom;
   if (paddingBottom !== undefined) {
-    nativeStop.paddingBottom = paddingBottom;
+    newNativeStop.paddingBottom = paddingBottom;
   }
 
   const paddingLeft = stop.padding?.paddingLeft ?? stop.bounds?.paddingLeft;
   if (paddingLeft !== undefined) {
-    nativeStop.paddingLeft = paddingLeft;
+    newNativeStop.paddingLeft = paddingLeft;
   }
 
-  return nativeStop;
+  if (newNativeStop.centerCoordinate && newNativeStop.bounds) {
+    throw new Error(
+      "Create a camera stop with bounds and centerCoordinate – this is not possible.",
+    );
+  }
+
+  return newNativeStop;
 }
 
 export interface CameraRef {
@@ -211,7 +226,7 @@ export interface CameraProps extends BaseProps, CameraStop {
   followUserLocation?: boolean;
 
   /**
-   * The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `MapLibreGL.UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js)
+   * The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `UserTrackingMode` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](/packages/examples/src/examples/Camera/SetUserTrackingMode.js)
    */
   followUserMode?: UserTrackingMode;
 
@@ -244,7 +259,7 @@ export interface NativeCameraProps
   defaultStop?: NativeCameraStop;
 }
 
-const Camera = memo(
+export const Camera = memo(
   forwardRef<CameraRef, CameraProps>(
     (
       {
@@ -269,44 +284,11 @@ const Camera = memo(
       }: CameraProps,
       ref,
     ) => {
-      const nativeCamera = useNativeRef<NativeCameraProps>();
-
-      const nativeStop = useMemo(() => {
-        return makeNativeCameraStop({
-          animationDuration,
-          animationMode,
-          bounds,
-          centerCoordinate,
-          heading,
-          padding,
-          pitch,
-          zoomLevel,
-        });
-      }, [
-        animationDuration,
-        animationMode,
-        bounds,
-        centerCoordinate,
-        heading,
-        padding,
-        pitch,
-        zoomLevel,
-      ]);
-
-      const nativeDefaultStop = useMemo(() => {
-        return makeNativeCameraStop(defaultSettings);
-      }, [defaultSettings]);
-
-      const nativeMaxBounds = useMemo(() => {
-        if (!maxBounds?.ne || !maxBounds?.sw) {
-          return undefined;
-        }
-        return makeNativeBounds(maxBounds.ne, maxBounds.sw);
-      }, [maxBounds]);
+      const nativeCameraRef = useNativeRef<NativeCameraProps>();
 
       const setCamera = (config: CameraStop | CameraStops = {}): void => {
         if ("stops" in config) {
-          nativeCamera.current?.setNativeProps({
+          nativeCameraRef.current?.setNativeProps({
             stop: {
               stops: config.stops
                 .map((stopItem) => makeNativeCameraStop(stopItem))
@@ -314,10 +296,10 @@ const Camera = memo(
             },
           });
         } else {
-          const nativeStop = makeNativeCameraStop(config);
+          const stop = makeNativeCameraStop(config);
 
-          if (nativeStop) {
-            nativeCamera.current?.setNativeProps({ stop: nativeStop });
+          if (stop) {
+            nativeCameraRef.current?.setNativeProps({ stop });
           }
         }
       };
@@ -399,10 +381,10 @@ const Camera = memo(
            * cameraRef.current?.fitBounds([lng, lat], [lng, lat], [verticalPadding, horizontalPadding], 1000)
            * cameraRef.current?.fitBounds([lng, lat], [lng, lat], [top, right, bottom, left], 1000)
            *
-           * @param {Array<Number>} ne - North east coordinate of bound
-           * @param {Array<Number>} sw - South west coordinate of bound
-           * @param {Number|Array<Number>|undefined} padding - Padding for the bounds
-           * @param {Number=} animationDuration - Duration of camera animation
+           * @param {Array<number>} ne - North east coordinate of bound
+           * @param {Array<number>} sw - South west coordinate of bound
+           * @param {number|Array<number>|undefined} padding - Padding for the bounds
+           * @param {number=} animationDuration - Duration of camera animation
            * @return {void}
            */
           fitBounds,
@@ -413,8 +395,8 @@ const Camera = memo(
            * cameraRef.current?.flyTo([lng, lat])
            * cameraRef.current?.flyTo([lng, lat], 12000)
            *
-           *  @param {Array<Number>} coordinates - Coordinates that map camera will jump to
-           *  @param {Number=} animationDuration - Duration of camera animation
+           *  @param {Array<number>} coordinates - Coordinates that map camera will jump to
+           *  @param {number=} animationDuration - Duration of camera animation
            *  @return {void}
            */
           flyTo,
@@ -425,8 +407,8 @@ const Camera = memo(
            * cameraRef.current?.moveTo([lng, lat], 200) // eases camera to new location based on duration
            * cameraRef.current?.moveTo([lng, lat]) // snaps camera to new location without any easing
            *
-           *  @param {Array<Number>} coordinates - Coordinates that map camera will move too
-           *  @param {Number=} animationDuration - Duration of camera animation
+           *  @param {Array<number>} coordinates - Coordinates that map camera will move too
+           *  @param {number=} animationDuration - Duration of camera animation
            *  @return {void}
            */
           moveTo,
@@ -437,8 +419,8 @@ const Camera = memo(
            * cameraRef.current?.zoomTo(16)
            * cameraRef.current?.zoomTo(16, 100)
            *
-           * @param {Number} zoomLevel - Zoom level that the map camera will animate too
-           * @param {Number=} animationDuration - Duration of camera animation
+           * @param {number} zoomLevel - Zoom level that the map camera will animate too
+           * @param {number=} animationDuration - Duration of camera animation
            * @return {void}
            */
           zoomTo,
@@ -465,20 +447,116 @@ const Camera = memo(
         }),
       );
 
+      const followProps = useMemo(() => {
+        return {
+          followUserMode,
+          followPitch: followPitch ?? pitch,
+          followHeading: followHeading ?? heading,
+          followZoomLevel: followZoomLevel ?? zoomLevel,
+        };
+      }, [
+        followUserMode,
+        followPitch,
+        pitch,
+        followHeading,
+        heading,
+        followZoomLevel,
+        zoomLevel,
+      ]);
+
+      useEffect(() => {
+        if (followUserLocation) {
+          if (Platform.OS === "android") {
+            nativeCameraRef.current?.setNativeProps({
+              ...followProps,
+              followUserLocation,
+            });
+          } else {
+            nativeCameraRef.current?.setNativeProps({
+              ...followProps,
+            });
+            nativeCameraRef.current?.setNativeProps({
+              followUserLocation,
+            });
+          }
+        } else {
+          nativeCameraRef.current?.setNativeProps({
+            followUserLocation,
+          });
+        }
+      }, [followUserLocation, followProps]);
+
+      const nativeMaxBounds = useMemo(() => {
+        if (!maxBounds?.ne || !maxBounds?.sw) {
+          return undefined;
+        }
+
+        return makeNativeBounds(maxBounds.ne, maxBounds.sw);
+      }, [maxBounds]);
+
+      useEffect(() => {
+        if (!followUserLocation) {
+          nativeCameraRef.current?.setNativeProps({
+            maxBounds: nativeMaxBounds,
+          });
+        }
+      }, [followUserLocation, nativeMaxBounds]);
+
+      useEffect(() => {
+        if (!followUserLocation) {
+          nativeCameraRef.current?.setNativeProps({
+            minZoomLevel,
+          });
+        }
+      }, [followUserLocation, minZoomLevel]);
+
+      useEffect(() => {
+        if (!followUserLocation) {
+          nativeCameraRef.current?.setNativeProps({
+            maxZoomLevel,
+          });
+        }
+      }, [followUserLocation, maxZoomLevel]);
+
+      const nativeStop = useMemo(() => {
+        return makeNativeCameraStop({
+          animationDuration,
+          animationMode,
+          bounds,
+          centerCoordinate,
+          heading,
+          padding,
+          pitch,
+          zoomLevel,
+        });
+      }, [
+        animationDuration,
+        animationMode,
+        bounds,
+        centerCoordinate,
+        heading,
+        padding,
+        pitch,
+        zoomLevel,
+      ]);
+
+      useEffect(() => {
+        if (!followUserLocation) {
+          nativeCameraRef.current?.setNativeProps({
+            stop: nativeStop,
+          });
+        }
+      }, [followUserLocation, nativeStop]);
+
+      const [nativeDefaultStop] = useState(
+        makeNativeCameraStop(defaultSettings),
+      );
+
       return (
         <MLRNCamera
           testID="Camera"
-          ref={nativeCamera}
-          stop={nativeStop}
+          ref={nativeCameraRef}
           defaultStop={nativeDefaultStop}
-          maxBounds={nativeMaxBounds}
-          followUserLocation={followUserLocation}
-          followHeading={followHeading}
-          followPitch={followPitch}
-          followUserMode={followUserMode}
-          followZoomLevel={followZoomLevel}
-          maxZoomLevel={maxZoomLevel}
-          minZoomLevel={minZoomLevel}
           onUserTrackingModeChange={onUserTrackingModeChange}
         />
       );
@@ -488,5 +566,3 @@ const Camera = memo(
 
 const MLRNCamera =
   requireNativeComponent<NativeCameraProps>(NATIVE_MODULE_NAME);
-
-export default Camera;

package/src/components/CircleLayer.tsx

@@ -1,14 +1,14 @@
-import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
-import useAbstractLayer, {
+import {
+  useAbstractLayer,
   type BaseLayerProps,
   type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
 import { type BaseProps } from "../types/BaseProps";
 import { type CircleLayerStyle } from "../types/MapLibreRNStyles";
 
-const MapLibreRN = NativeModules.MLRNModule;
+const MLRNModule = NativeModules.MLRNModule;
 
 export const NATIVE_MODULE_NAME = "MLRNCircleLayer";
 
@@ -28,8 +28,8 @@ const MLRNCircleLayer = requireNativeComponent<NativeProps>(NATIVE_MODULE_NAME);
 /**
  * CircleLayer is a style layer that renders one or more filled circles on the map.
  */
-const CircleLayer: React.FC<CircleLayerProps> = ({
-  sourceID = MapLibreRN.StyleSource.DefaultSourceID,
+export const CircleLayer = ({
+  sourceID = MLRNModule.StyleSource.DefaultSourceID,
   ...props
 }: CircleLayerProps) => {
   const { baseProps, setNativeLayer } = useAbstractLayer<
@@ -48,5 +48,3 @@ const CircleLayer: React.FC<CircleLayerProps> = ({
     />
   );
 };
-
-export default CircleLayer;

package/src/components/FillExtrusionLayer.tsx

@@ -1,14 +1,14 @@
-import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
-import useAbstractLayer, {
+import {
+  useAbstractLayer,
   type BaseLayerProps,
   type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
 import { type BaseProps } from "../types/BaseProps";
 import { type FillExtrusionLayerStyle } from "../types/MapLibreRNStyles";
 
-const MapLibreRN = NativeModules.MLRNModule;
+const MLRNModule = NativeModules.MLRNModule;
 
 export const NATIVE_MODULE_NAME = "MLRNFillExtrusionLayer";
 
@@ -29,8 +29,8 @@ const MLRNFillExtrusionLayer =
 /**
  * FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map.
  */
-const FillExtrusionLayer: React.FC<FillExtrusionLayerProps> = ({
-  sourceID = MapLibreRN.StyleSource.DefaultSourceID,
+export const FillExtrusionLayer = ({
+  sourceID = MLRNModule.StyleSource.DefaultSourceID,
   ...props
 }: FillExtrusionLayerProps) => {
   const { baseProps, setNativeLayer } = useAbstractLayer<
@@ -43,5 +43,3 @@ const FillExtrusionLayer: React.FC<FillExtrusionLayerProps> = ({
 
   return <MLRNFillExtrusionLayer ref={setNativeLayer} {...baseProps} />;
 };
-
-export default FillExtrusionLayer;

package/src/components/FillLayer.tsx

@@ -1,14 +1,14 @@
-import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
-import useAbstractLayer, {
+import {
+  useAbstractLayer,
   type BaseLayerProps,
   type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
 import { type BaseProps } from "../types/BaseProps";
 import { type FillLayerStyle } from "../types/MapLibreRNStyles";
 
-const MapLibreRN = NativeModules.MLRNModule;
+const MLRNModule = NativeModules.MLRNModule;
 
 export const NATIVE_MODULE_NAME = "MLRNFillLayer";
 
@@ -26,8 +26,8 @@ const MLRNFillLayer = requireNativeComponent<NativeProps>(NATIVE_MODULE_NAME);
 /**
  * FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map.
  */
-const FillLayer: React.FC<FillLayerProps> = ({
-  sourceID = MapLibreRN.StyleSource.DefaultSourceID,
+export const FillLayer = ({
+  sourceID = MLRNModule.StyleSource.DefaultSourceID,
   ...props
 }: FillLayerProps) => {
   const { baseProps, setNativeLayer } = useAbstractLayer<
@@ -40,5 +40,3 @@ const FillLayer: React.FC<FillLayerProps> = ({
 
   return <MLRNFillLayer ref={setNativeLayer} {...baseProps} />;
 };
-
-export default FillLayer;

package/src/components/HeadingIndicator.tsx

@@ -1,6 +1,4 @@
-import { type ReactElement } from "react";
-
-import SymbolLayer from "./SymbolLayer";
+import { SymbolLayer } from "./SymbolLayer";
 import headingIcon from "../assets/heading.png";
 import { type BaseProps } from "../types/BaseProps";
 
@@ -15,7 +13,7 @@ interface HeadingIndicatorProps extends BaseProps {
   heading?: number;
 }
 
-const HeadingIndicator = ({ heading }: HeadingIndicatorProps): ReactElement => (
+export const HeadingIndicator = ({ heading }: HeadingIndicatorProps) => (
   <SymbolLayer
     key="mapboxUserLocationHeadingIndicator"
     id="mapboxUserLocationHeadingIndicator"
@@ -26,5 +24,3 @@ const HeadingIndicator = ({ heading }: HeadingIndicatorProps): ReactElement => (
     }}
   />
 );
-
-export default HeadingIndicator;

package/src/components/HeatmapLayer.tsx

@@ -1,14 +1,14 @@
-import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
-import useAbstractLayer, {
+import {
   type BaseLayerProps,
   type NativeBaseProps,
+  useAbstractLayer,
 } from "../hooks/useAbstractLayer";
 import { type BaseProps } from "../types/BaseProps";
 import { type HeatmapLayerStyle } from "../types/MapLibreRNStyles";
 
-const MapLibreRN = NativeModules.MLRNModule;
+const MLRNModule = NativeModules.MLRNModule;
 
 export const NATIVE_MODULE_NAME = "MLRNHeatmapLayer";
 
@@ -28,8 +28,8 @@ const MLRNHeatmapLayer =
 /**
  * HeatmapLayer is a style layer that renders one or more filled circles on the map.
  */
-const HeatmapLayer: React.FC<HeatmapLayerProps> = ({
-  sourceID = MapLibreRN.StyleSource.DefaultSourceID,
+export const HeatmapLayer = ({
+  sourceID = MLRNModule.StyleSource.DefaultSourceID,
   ...props
 }: HeatmapLayerProps) => {
   const { baseProps, setNativeLayer } = useAbstractLayer<
@@ -42,5 +42,3 @@ const HeatmapLayer: React.FC<HeatmapLayerProps> = ({
 
   return <MLRNHeatmapLayer ref={setNativeLayer} {...baseProps} />;
 };
-
-export default HeatmapLayer;

package/src/components/ImageSource.tsx

@@ -1,7 +1,7 @@
-import { type ReactElement } from "react";
+import { type ReactNode } from "react";
 import { requireNativeComponent } from "react-native";
 
-import useAbstractSource from "../hooks/useAbstractSource";
+import { useAbstractSource } from "../hooks/useAbstractSource";
 import { type BaseProps } from "../types/BaseProps";
 import {
   cloneReactChildrenWithProps,
@@ -31,7 +31,7 @@ export interface ImageSourceProps extends BaseProps {
     GeoJSON.Position,
   ];
 
-  children?: ReactElement | ReactElement[];
+  children?: ReactNode;
 }
 
 type NativeProps = ImageSourceProps;
@@ -42,7 +42,7 @@ const MLRNImageSource = requireNativeComponent<NativeProps>(NATIVE_MODULE_NAME);
  * ImageSource is a content source that is used for a georeferenced raster image to be shown on the map.
  * The georeferenced image scales and rotates as the user zooms and rotates the map
  */
-const ImageSource: React.FC<ImageSourceProps> = (props: ImageSourceProps) => {
+export const ImageSource = (props: ImageSourceProps) => {
   const { setNativeRef } = useAbstractSource<NativeProps>();
 
   const _getURL = (): string | undefined => {
@@ -66,5 +66,3 @@ const ImageSource: React.FC<ImageSourceProps> = (props: ImageSourceProps) => {
     </MLRNImageSource>
   );
 };
-
-export default ImageSource;

package/src/components/Images.tsx

@@ -1,10 +1,10 @@
-import { type ReactElement } from "react";
+import { type ReactNode } from "react";
 import {
-  requireNativeComponent,
   Image,
-  type NativeSyntheticEvent,
   type ImageSourcePropType,
   type ImageURISource,
+  type NativeSyntheticEvent,
+  requireNativeComponent,
 } from "react-native";
 
 import { type BaseProps } from "../types/BaseProps";
@@ -55,19 +55,19 @@ interface ImagesProps extends BaseProps {
 
   id?: string;
 
-  children?: ReactElement;
+  children?: ReactNode;
 }
 
 /**
  * Images defines the images used in Symbol etc layers
  */
-const Images = ({
+export const Images = ({
   images,
   nativeAssetImages,
   onImageMissing,
   id,
   children,
-}: ImagesProps): ReactElement => {
+}: ImagesProps) => {
   const _getImages = (): {
     images?: { [key: string]: ImageEntry };
     nativeImages?: ImageEntry[];
@@ -123,5 +123,3 @@ const Images = ({
 };
 
 const MLRNImages = requireNativeComponent(NATIVE_MODULE_NAME);
-
-export default Images;

package/src/components/Light.tsx

@@ -1,7 +1,7 @@
-import React from "react";
 import { requireNativeComponent } from "react-native";
 
-import useAbstractLayer, {
+import {
+  useAbstractLayer,
   type BaseLayerProps,
 } from "../hooks/useAbstractLayer";
 import { type BaseProps } from "../types/BaseProps";
@@ -26,7 +26,7 @@ const MLRNLight = requireNativeComponent<NativeProps>(NATIVE_MODULE_NAME);
 /**
  * Light represents the light source for extruded geometries
  */
-const Light: React.FC<LightProps> = (props: LightProps) => {
+export const Light = (props: LightProps) => {
   const { baseProps, setNativeLayer } = useAbstractLayer<
     LightProps,
     NativeProps
@@ -36,5 +36,3 @@ const Light: React.FC<LightProps> = (props: LightProps) => {
 
   return <MLRNLight ref={setNativeLayer} testID="mlrnLight" {...baseProps} />;
 };
-
-export default Light;

package/src/components/LineLayer.tsx

@@ -1,14 +1,14 @@
-import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
-import useAbstractLayer, {
+import {
+  useAbstractLayer,
   type BaseLayerProps,
   type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
 import { type BaseProps } from "../types/BaseProps";
 import { type LineLayerStyle } from "../types/MapLibreRNStyles";
 
-const MapLibreRN = NativeModules.MLRNModule;
+const MLRNModule = NativeModules.MLRNModule;
 
 export const NATIVE_MODULE_NAME = "MLRNLineLayer";
 
@@ -27,8 +27,8 @@ const MLRNLineLayer =
 /**
  * LineLayer is a style layer that renders one or more stroked polylines on the map.
  */
-const LineLayer: React.FC<LineLayerProps> = ({
-  sourceID = MapLibreRN.StyleSource.DefaultSourceID,
+export const LineLayer = ({
+  sourceID = MLRNModule.StyleSource.DefaultSourceID,
   ...props
 }: LineLayerProps) => {
   const { baseProps, setNativeLayer } = useAbstractLayer<
@@ -41,5 +41,3 @@ const LineLayer: React.FC<LineLayerProps> = ({
 
   return <MLRNLineLayer ref={setNativeLayer} {...baseProps} />;
 };
-
-export default LineLayer;