fix: enable verbatimModuleSyntax in tsconfig.json

example/src/examples/Animations/AnimatedLineOffsets.tsx

@@ -1,5 +1,5 @@
 import { memo, useRef, useState, useMemo, useCallback } from 'react';
-import { Button, StyleProp, View, ViewStyle } from 'react-native';
+import { Button, type StyleProp, View, type ViewStyle } from 'react-native';
 import {
   Camera,
   Logger,
@@ -8,7 +8,7 @@ import {
   __experimental,
   LineLayer,
 } from '@rnmapbox/maps';
-import { Position } from 'geojson';
+import { type Position } from 'geojson';
 import { Divider, Slider, Text } from '@rneui/base';
 import { SafeAreaView } from 'react-native-safe-area-context';
 // @ts-ignore - @turf packages have type resolution issues with package.json exports

example/src/examples/Animations/AnimatedPoint.tsx

@@ -7,10 +7,10 @@ import {
   CircleLayer,
   __experimental,
 } from '@rnmapbox/maps';
-import { Position } from 'geojson';
+import { type Position } from 'geojson';
 import { Divider, Slider, Text } from '@rneui/base';
 import { SafeAreaView } from 'react-native-safe-area-context';
-import { View, Button, StyleProp, ViewStyle } from 'react-native';
+import { View, Button, type StyleProp, type ViewStyle } from 'react-native';
 
 import type { ExampleWithMetadata } from '../common/ExampleMetadata';
 

example/src/examples/Annotations/CustomCallout.tsx

@@ -2,11 +2,17 @@ import { useState } from 'react';
 import Mapbox, { type SymbolLayerStyle } from '@rnmapbox/maps';
 // @ts-ignore - @turf packages have type resolution issues with package.json exports
 import { Feature } from '@turf/helpers';
-import { StyleProp, Text, TextStyle, View, ViewStyle } from 'react-native';
+import {
+  type StyleProp,
+  Text,
+  type TextStyle,
+  View,
+  type ViewStyle,
+} from 'react-native';
 
 import exampleIcon from '../../assets/pin.png';
 import sheet from '../../styles/sheet';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const defaultCamera = {
   centerCoordinate: [12.338, 45.4385],

example/src/examples/Annotations/ShowPointAnnotation.tsx

@@ -9,11 +9,11 @@ import {
   ShapeSource,
   getAnnotationsLayerID,
 } from '@rnmapbox/maps';
-import { Point, Position } from 'geojson';
+import { type Point, type Position } from 'geojson';
 import { Button } from '@rneui/base';
 
 import Bubble from '../common/Bubble';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const ANNOTATION_SIZE = 40;
 

example/src/examples/BugReportExampleTS.tsx

@@ -7,7 +7,7 @@ import {
   ShapeSource,
   SymbolLayer,
 } from '@rnmapbox/maps';
-import { FeatureCollection } from 'geojson';
+import { type FeatureCollection } from 'geojson';
 import { Button } from 'react-native';
 
 const styles = {

example/src/examples/CacheOffline/CacheManagement.tsx

@@ -12,9 +12,9 @@ import {
 import sheet from '../../styles/sheet';
 import { DEFAULT_CENTER_COORDINATE } from '../../utils';
 import BaseExamplePropTypes, {
-  BaseExampleProps,
+  type BaseExampleProps,
 } from '../common/BaseExamplePropTypes';
-import { ExampleWithMetadata } from '../common/ExampleMetadata';
+import { type ExampleWithMetadata } from '../common/ExampleMetadata';
 
 const styles = StyleSheet.create({
   button: {

example/src/examples/CacheOffline/OfflineExample.tsx

@@ -8,7 +8,7 @@ import Mapbox, {
 } from '@rnmapbox/maps';
 import { Button, Dimensions, TextInput } from 'react-native';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const CENTER_COORD: [number, number] = [-73.970895, 40.723279];
 const MAPBOX_VECTOR_TILE_SIZE = 512;

example/src/examples/CacheOffline/OfflineTilesets.tsx

@@ -10,7 +10,7 @@ import {
   VectorSource,
 } from '@rnmapbox/maps';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata';
+import { type ExampleWithMetadata } from '../common/ExampleMetadata';
 
 const packName = 'map-with-3d-terrain-pack';
 const STYLE_URL = 'mapbox://styles/mapbox/satellite-streets-v11';

example/src/examples/Camera/Fit.tsx

@@ -4,7 +4,7 @@ import isEqual from 'lodash.isequal';
 import { MapView, Camera, StyleURL, type CameraBounds } from '@rnmapbox/maps';
 
 import sheet from '../../styles/sheet';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 // Assertion function to ensure camera is not null
 function assertCameraNotNull(camera: Camera | null): asserts camera is Camera {

example/src/examples/LineLayer/DrawPolyline.tsx

@@ -3,7 +3,7 @@ import { Button, View } from 'react-native';
 import {
   useState,
   useRef,
-  ComponentProps,
+  type ComponentProps,
   useMemo,
   forwardRef,
   type ElementRef,

example/src/examples/Map/CameraGestureObserver.tsx

@@ -2,7 +2,7 @@ import { useCallback, useState } from 'react';
 import { View, StyleSheet, Text } from 'react-native';
 import { MapView, Camera, CameraGestureObserver, type OnMapSteadyEvent } from '@rnmapbox/maps';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const styles = StyleSheet.create({
   container: {

example/src/examples/Map/DynamicUrl.tsx

@@ -9,7 +9,7 @@ import {
 } from '@rnmapbox/maps';
 
 import Bubble from '../common/Bubble';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const randomCountries = [
   {

example/src/examples/Map/LocalizeLabels.tsx

@@ -2,7 +2,7 @@ import { Camera, MapView } from '@rnmapbox/maps';
 
 const CENTER_COORD = [-74.00597, 40.71427];
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const LocalizeLabels = () => {
   return (

example/src/examples/Map/MapFps.tsx

@@ -3,7 +3,7 @@ import Mapbox from '@rnmapbox/maps';
 import { Button } from '@rneui/base';
 
 import sheet from '../../styles/sheet';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const MapFps = () => {
   const [frameRate, setFrameRate] = useState(60);

example/src/examples/Map/MapInModal.tsx

@@ -2,8 +2,8 @@ import React from 'react';
 import { Button, Text } from 'react-native';
 import { MapView } from '@rnmapbox/maps';
 import { SafeAreaView } from 'react-native-safe-area-context';
-import { NativeStackNavigationProp } from '@react-navigation/native-stack';
-import { ParamListBase } from '@react-navigation/native';
+import { type NativeStackNavigationProp } from '@react-navigation/native-stack';
+import { type ParamListBase } from '@react-navigation/native';
 
 type MapInModalProps = {
   navigation?: NativeStackNavigationProp<ParamListBase, string, undefined>;

example/src/examples/Map/MapUnMount.tsx

@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
 import { Button } from 'react-native';
 
 import sheet from '../../styles/sheet';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const MapUnMount = () => {
   const [isMounted, setIsMounted] = useState(true);

example/src/examples/Map/Ornaments.tsx

@@ -1,10 +1,15 @@
 import { MapView, Camera, Images } from '@rnmapbox/maps';
 import { useState } from 'react';
-import { Button, ImageSourcePropType, StyleSheet, Text } from 'react-native';
+import {
+  Button,
+  type ImageSourcePropType,
+  StyleSheet,
+  Text,
+} from 'react-native';
 import { Divider } from '@rneui/base';
 
 import Bubble from '../common/Bubble';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 type CompassImage = 'compass1' | 'compass2';
 const images: Record<CompassImage, ImageSourcePropType> = {

example/src/examples/Map/ShowMap.tsx

@@ -5,7 +5,7 @@ import { ButtonGroup } from '@rneui/base';
 
 import sheet from '../../styles/sheet';
 import { onSortOptions } from '../../utils';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const ShowMap = () => {
   const _mapOptions = Object.keys(Mapbox.StyleURL)

example/src/examples/Map/ShowMapLocalStyle.tsx

@@ -3,7 +3,7 @@ import { Alert } from 'react-native';
 import Mapbox from '@rnmapbox/maps';
 
 import sheet from '../../styles/sheet';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const style = JSON.stringify(require('../../assets/map-styleURL-style.json'));
 

example/src/examples/SymbolCircleLayer/Earthquakes.tsx

@@ -1,14 +1,14 @@
 import {
   Camera,
   CircleLayer,
-  CircleLayerStyle,
+  type CircleLayerStyle,
   MapView,
   ShapeSource,
   SymbolLayer,
-  SymbolLayerStyle,
+  type SymbolLayerStyle,
   StyleURL,
 } from '@rnmapbox/maps';
-import { FeatureCollection } from 'geojson';
+import { type FeatureCollection } from 'geojson';
 import React, { useRef, useState } from 'react';
 import { FAB, Icon, ListItem } from '@rneui/base';
 import moment from 'moment';
@@ -17,8 +17,8 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 
 import earthQuakesJSON from '../../assets/earthquakes.json';
 import { SF_OFFICE_COORDINATE } from '../../utils';
-import { ExampleWithMetadata } from '../common/ExampleMetadata';
-import { BaseExampleProps } from '../common/BaseExamplePropTypes';
+import { type ExampleWithMetadata } from '../common/ExampleMetadata';
+import { type BaseExampleProps } from '../common/BaseExamplePropTypes';
 
 const layerStyles: {
   singlePoint: CircleLayerStyle;

example/src/examples/SymbolCircleLayer/ImageScaleTests.tsx

@@ -6,8 +6,8 @@ import {
   Camera,
   CircleLayer,
 } from '@rnmapbox/maps';
-import { ComponentProps } from 'react';
-import { View, Image, Text, ImageSourcePropType } from 'react-native';
+import { type ComponentProps } from 'react';
+import { View, Image, Text, type ImageSourcePropType } from 'react-native';
 
 const styles = {
   mapView: { flex: 1 },

example/src/examples/SymbolCircleLayer/ShapeSourceIcon.tsx

@@ -7,13 +7,13 @@ import {
   SymbolLayer,
   ShapeSource,
 } from '@rnmapbox/maps';
-import { StyleProp, Text, ViewStyle } from 'react-native';
-import { FeatureCollection } from 'geojson';
+import { type StyleProp, Text, type ViewStyle } from 'react-native';
+import { type FeatureCollection } from 'geojson';
 
 import exampleIcon from '../../assets/example.png';
 import pinIcon from '../../assets/pin.png';
-import { SymbolLayerStyleProps } from '../../../../src/utils/MapboxStyles';
-import { ExampleWithMetadata } from '../common/ExampleMetadata';
+import { type SymbolLayerStyleProps } from '../../../../src/utils/MapboxStyles';
+import { type ExampleWithMetadata } from '../common/ExampleMetadata';
 
 const styles: {
   icon: SymbolLayerStyleProps;

example/src/examples/UserLocation/CustomNativeUserLocation.tsx

@@ -9,7 +9,7 @@ import {
   Image,
 } from '@rnmapbox/maps';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata';
+import { type ExampleWithMetadata } from '../common/ExampleMetadata';
 
 const styles = { matchParent: { flex: 1 } };
 

example/src/examples/UserLocation/UserLocationPadding.tsx

@@ -8,7 +8,7 @@ import {
 import { ButtonGroup } from '@rneui/base';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-example-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-example-doc
 
 enum Alignment {
   Top = 'TOP',

example/src/examples/UserLocation/UserLocationRenderMode.tsx

@@ -1,4 +1,4 @@
-import { ReactNode, useState } from 'react';
+import { type ReactNode, useState } from 'react';
 import {
   MapView,
   CircleLayer,
@@ -12,7 +12,7 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 import { ButtonGroup, Text } from '@rneui/base';
 
 import { DEFAULT_CENTER_COORDINATE } from '../../utils';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 const SettingsGroup = ({
   children,

example/src/examples/UserLocation/UserLocationUpdates.tsx

@@ -1,9 +1,9 @@
 import { useState } from 'react';
 import { Text } from 'react-native';
-import { MapView, Camera, UserLocation, Location } from '@rnmapbox/maps';
+import { MapView, Camera, UserLocation, type Location } from '@rnmapbox/maps';
 
 import Bubble from '../common/Bubble';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-example-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-example-doc
 
 const UserLocationUpdates = () => {
   const [location, setLocation] = useState<Location>();

example/src/examples/V10/CameraAnimation.tsx

@@ -1,21 +1,21 @@
 import { CheckBox, Divider, Slider, Button } from '@rneui/base';
 import {
   Camera,
-  CameraAnimationMode,
-  CameraBounds,
+  type CameraAnimationMode,
+  type CameraBounds,
   CircleLayer,
   Logger,
   MapView,
   ShapeSource,
 } from '@rnmapbox/maps';
 import bbox from '@turf/bbox';
-import { Feature, Point, Position } from 'geojson';
+import { type Feature, type Point, type Position } from 'geojson';
 import { useCallback, useMemo, useState } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
 import colors from '../../styles/colors';
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 Logger.setLogLevel('verbose');
 

example/src/examples/V10/FeatureState.tsx

@@ -1,7 +1,7 @@
-import { ComponentProps, useCallback, useRef } from 'react';
+import { type ComponentProps, useCallback, useRef } from 'react';
 import { Camera, FillLayer, MapView, ShapeSource } from '@rnmapbox/maps';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata';
+import { type ExampleWithMetadata } from '../common/ExampleMetadata';
 
 type CustomProperties = {
   normalColor: string;

example/src/examples/V10/GlobeProjection.tsx

@@ -10,7 +10,7 @@ import {
   Camera,
 } from '@rnmapbox/maps';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 Logger.setLogLevel('verbose');
 

example/src/examples/V10/Markers.tsx

@@ -2,9 +2,9 @@ import { useCallback, useEffect, useState } from 'react';
 import { StyleSheet, Pressable, Text, View } from 'react-native';
 import { Button, Divider } from '@rneui/base';
 import { Camera, Logger, MapView, MarkerView } from '@rnmapbox/maps';
-import { Position } from 'geojson';
+import { type Position } from 'geojson';
 
-import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
+import { type ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc
 
 Logger.setLogLevel('verbose');
 

example/src/examples/common/Page.tsx

@@ -3,9 +3,9 @@ import { View } from 'react-native';
 import sheet from '../../styles/sheet';
 import colors from '../../styles/colors';
 
-import { BaseExampleProps } from './BaseExamplePropTypes';
+import { type BaseExampleProps } from './BaseExamplePropTypes';
 import MapHeader from './MapHeader';
-import { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 
 export type PageProps = BaseExampleProps & { children: ReactNode };
 

example/src/scenes/GroupAndItem.tsx

@@ -12,7 +12,7 @@ import AsyncStorage from '@react-native-async-storage/async-storage';
 import type { BaseExampleProps } from '../examples/common/BaseExamplePropTypes';
 
 import MapHeader from '../examples/common/MapHeader';
-import Page, { PageProps } from '../examples/common/Page';
+import Page, { type PageProps } from '../examples/common/Page';
 import sheet from '../styles/sheet';
 // ANIMATIONS
 import * as Animations from '../examples/Animations';