@maplibre/maplibre-react-native 10.0.0-alpha.27 → 10.0.0-alpha.28

package/lib/typescript/module/src/utils/styleMap.d.ts

@@ -0,0 +1,231 @@
+export declare const StyleTypes: {
+    Constant: string;
+    Color: string;
+    Transition: string;
+    Translation: string;
+    Function: string;
+    Image: string;
+    Enum: string;
+};
+export declare function getStyleType(styleProp: keyof typeof styleExtras): string;
+declare const styleMap: {
+    fillSortKey: string;
+    fillAntialias: string;
+    fillOpacity: string;
+    fillOpacityTransition: string;
+    fillColor: string;
+    fillColorTransition: string;
+    fillOutlineColor: string;
+    fillOutlineColorTransition: string;
+    fillTranslate: string;
+    fillTranslateTransition: string;
+    fillTranslateAnchor: string;
+    fillPattern: string;
+    fillPatternTransition: string;
+    lineCap: string;
+    lineJoin: string;
+    lineMiterLimit: string;
+    lineRoundLimit: string;
+    lineSortKey: string;
+    lineOpacity: string;
+    lineOpacityTransition: string;
+    lineColor: string;
+    lineColorTransition: string;
+    lineTranslate: string;
+    lineTranslateTransition: string;
+    lineTranslateAnchor: string;
+    lineWidth: string;
+    lineWidthTransition: string;
+    lineGapWidth: string;
+    lineGapWidthTransition: string;
+    lineOffset: string;
+    lineOffsetTransition: string;
+    lineBlur: string;
+    lineBlurTransition: string;
+    lineDasharray: string;
+    lineDasharrayTransition: string;
+    linePattern: string;
+    linePatternTransition: string;
+    lineGradient: string;
+    symbolPlacement: string;
+    symbolSpacing: string;
+    symbolAvoidEdges: string;
+    symbolSortKey: string;
+    symbolZOrder: string;
+    iconAllowOverlap: string;
+    iconIgnorePlacement: string;
+    iconOptional: string;
+    iconRotationAlignment: string;
+    iconSize: string;
+    iconTextFit: string;
+    iconTextFitPadding: string;
+    iconImage: string;
+    iconRotate: string;
+    iconPadding: string;
+    iconKeepUpright: string;
+    iconOffset: string;
+    iconAnchor: string;
+    iconPitchAlignment: string;
+    textPitchAlignment: string;
+    textRotationAlignment: string;
+    textField: string;
+    textFont: string;
+    textSize: string;
+    textMaxWidth: string;
+    textLineHeight: string;
+    textLetterSpacing: string;
+    textJustify: string;
+    textRadialOffset: string;
+    textVariableAnchor: string;
+    textAnchor: string;
+    textMaxAngle: string;
+    textWritingMode: string;
+    textRotate: string;
+    textPadding: string;
+    textKeepUpright: string;
+    textTransform: string;
+    textOffset: string;
+    textAllowOverlap: string;
+    textIgnorePlacement: string;
+    textOptional: string;
+    iconOpacity: string;
+    iconOpacityTransition: string;
+    iconColor: string;
+    iconColorTransition: string;
+    iconHaloColor: string;
+    iconHaloColorTransition: string;
+    iconHaloWidth: string;
+    iconHaloWidthTransition: string;
+    iconHaloBlur: string;
+    iconHaloBlurTransition: string;
+    iconTranslate: string;
+    iconTranslateTransition: string;
+    iconTranslateAnchor: string;
+    textOpacity: string;
+    textOpacityTransition: string;
+    textColor: string;
+    textColorTransition: string;
+    textHaloColor: string;
+    textHaloColorTransition: string;
+    textHaloWidth: string;
+    textHaloWidthTransition: string;
+    textHaloBlur: string;
+    textHaloBlurTransition: string;
+    textTranslate: string;
+    textTranslateTransition: string;
+    textTranslateAnchor: string;
+    circleSortKey: string;
+    circleRadius: string;
+    circleRadiusTransition: string;
+    circleColor: string;
+    circleColorTransition: string;
+    circleBlur: string;
+    circleBlurTransition: string;
+    circleOpacity: string;
+    circleOpacityTransition: string;
+    circleTranslate: string;
+    circleTranslateTransition: string;
+    circleTranslateAnchor: string;
+    circlePitchScale: string;
+    circlePitchAlignment: string;
+    circleStrokeWidth: string;
+    circleStrokeWidthTransition: string;
+    circleStrokeColor: string;
+    circleStrokeColorTransition: string;
+    circleStrokeOpacity: string;
+    circleStrokeOpacityTransition: string;
+    heatmapRadius: string;
+    heatmapRadiusTransition: string;
+    heatmapWeight: string;
+    heatmapIntensity: string;
+    heatmapIntensityTransition: string;
+    heatmapColor: string;
+    heatmapOpacity: string;
+    heatmapOpacityTransition: string;
+    fillExtrusionOpacity: string;
+    fillExtrusionOpacityTransition: string;
+    fillExtrusionColor: string;
+    fillExtrusionColorTransition: string;
+    fillExtrusionTranslate: string;
+    fillExtrusionTranslateTransition: string;
+    fillExtrusionTranslateAnchor: string;
+    fillExtrusionPattern: string;
+    fillExtrusionPatternTransition: string;
+    fillExtrusionHeight: string;
+    fillExtrusionHeightTransition: string;
+    fillExtrusionBase: string;
+    fillExtrusionBaseTransition: string;
+    fillExtrusionVerticalGradient: string;
+    rasterOpacity: string;
+    rasterOpacityTransition: string;
+    rasterHueRotate: string;
+    rasterHueRotateTransition: string;
+    rasterBrightnessMin: string;
+    rasterBrightnessMinTransition: string;
+    rasterBrightnessMax: string;
+    rasterBrightnessMaxTransition: string;
+    rasterSaturation: string;
+    rasterSaturationTransition: string;
+    rasterContrast: string;
+    rasterContrastTransition: string;
+    rasterResampling: string;
+    rasterFadeDuration: string;
+    hillshadeIlluminationDirection: string;
+    hillshadeIlluminationAnchor: string;
+    hillshadeExaggeration: string;
+    hillshadeExaggerationTransition: string;
+    hillshadeShadowColor: string;
+    hillshadeShadowColorTransition: string;
+    hillshadeHighlightColor: string;
+    hillshadeHighlightColorTransition: string;
+    hillshadeAccentColor: string;
+    hillshadeAccentColorTransition: string;
+    backgroundColor: string;
+    backgroundColorTransition: string;
+    backgroundPattern: string;
+    backgroundPatternTransition: string;
+    backgroundOpacity: string;
+    backgroundOpacityTransition: string;
+    anchor: string;
+    position: string;
+    positionTransition: string;
+    color: string;
+    colorTransition: string;
+    intensity: string;
+    intensityTransition: string;
+    visibility: string;
+};
+export declare const styleExtras: {
+    iconTextFitPadding: {
+        iosType: string;
+    };
+    iconOffset: {
+        iosType: string;
+    };
+    textOffset: {
+        iosType: string;
+    };
+    lineOffset: {
+        iosType: string;
+    };
+    fillTranslate: {
+        iosType: string;
+    };
+    lineTranslate: {
+        iosType: string;
+    };
+    iconTranslate: {
+        iosType: string;
+    };
+    textTranslate: {
+        iosType: string;
+    };
+    circleTranslate: {
+        iosType: string;
+    };
+    fillExtrusionTranslate: {
+        iosType: string;
+    };
+};
+export default styleMap;
+//# sourceMappingURL=styleMap.d.ts.map

package/lib/typescript/module/src/utils/styleMap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styleMap.d.ts","sourceRoot":"","sources":["../../../../../src/utils/styleMap.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,UAAU;;;;;;;;CAQtB,CAAC;AAEF,wBAAgB,YAAY,CAAC,SAAS,EAAE,MAAM,OAAO,WAAW,GAAG,MAAM,CAUxE;AAED,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoMb,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCvB,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/package.json

@@ -1,12 +1,11 @@
 {
   "name": "@maplibre/maplibre-react-native",
   "description": "React Native library for creating maps with MapLibre Native for Android & iOS",
-  "version": "10.0.0-alpha.27",
+  "version": "10.0.0-alpha.28",
   "publishConfig": {
     "access": "public"
   },
   "author": "MapLibre",
-  "main": "./javascript/index.ts",
   "keywords": [
     "maps",
     "ios",
@@ -16,27 +15,104 @@
     "mapbox"
   ],
   "license": "MIT",
+  "homepage": "https://github.com/maplibre/maplibre-react-native#readme",
   "repository": {
     "type": "git",
-    "url": "https://github.com/maplibre/maplibre-react-native"
+    "url": "git+https://github.com/maplibre/maplibre-react-native.git"
+  },
+  "bugs": {
+    "url": "https://github.com/maplibre/maplibre-react-native/issues"
   },
   "scripts": {
     "codegen": "tsx scripts/codegen.ts",
     "test": "jest",
-    "lint": "yarn lint:eslint && yarn lint:tsc",
+    "lint": "yarn lint:tsc && yarn lint:eslint",
     "lint:eslint": "eslint .",
     "lint:eslint:fix": "eslint . --fix",
-    "lint:tsc": "tsc --project . --noEmit && tsc --project ./packages/examples",
+    "lint:tsc": "tsc --project . && tsc --project ./packages/examples",
     "plugin:build": "tsc --build plugin",
     "plugin:lint": "eslint plugin/src/*",
     "plugin:test": "jest plugin",
-    "prepack": "yarn plugin:build"
+    "prepack": "bob build && yarn plugin:build"
   },
   "workspaces": [
     "apps/*",
     "packages/*"
   ],
   "packageManager": "yarn@4.1.0",
+  "main": "./lib/commonjs/index.js",
+  "source": "./src/index.ts",
+  "module": "./lib/module/index.js",
+  "types": "./lib/typescript/commonjs/src/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./lib/typescript/module/src/index.d.ts",
+        "default": "./lib/module/index.js"
+      },
+      "require": {
+        "types": "./lib/typescript/commonjs/src/index.d.ts",
+        "default": "./lib/commonjs/index.js"
+      }
+    },
+    "./app.plugin.js": {
+      "require": {
+        "default": "./app.plugin.js"
+      }
+    },
+    "./plugin": {
+      "require": {
+        "types": "./plugin/build/witMapLibre.d.ts",
+        "default": "./plugin/build/withMapLibre.js"
+      }
+    }
+  },
+  "files": [
+    "src",
+    "lib",
+    "android",
+    "ios",
+    "cpp",
+    "*.podspec",
+    "react-native.config.json",
+    "app.plugin.js",
+    "plugin/build/**",
+    "!ios/build",
+    "!android/build",
+    "!android/gradle",
+    "!android/gradlew",
+    "!android/gradlew.bat",
+    "!android/local.properties",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__",
+    "!**/.*"
+  ],
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "commonjs",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "esm": true,
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  },
   "peerDependenciesMeta": {
     "@expo/config-plugins": {
       "optional": true
@@ -87,6 +163,7 @@
     "react": "18.2.0",
     "react-docgen": "^7.1.0",
     "react-native": "^0.74.6",
+    "react-native-builder-bob": "^0.32.0",
     "react-test-renderer": "18.2.0",
     "tsx": "^4.19.2",
     "typescript": "^5.3.3"

package/plugin/build/withMapLibre.d.ts

@@ -1,4 +1,4 @@
-import { ConfigPlugin, XcodeProject } from "@expo/config-plugins";
+import { type ConfigPlugin, type XcodeProject } from "@expo/config-plugins";
 type InstallerBlockName = "pre" | "post";
 export declare function applyCocoaPodsModifications(contents: string): string;
 export declare function addInstallerBlock(src: string, blockName: InstallerBlockName): string;

package/{javascript/Maplibre.ts → src/MapLibreRN.ts}

@@ -64,7 +64,7 @@ export type {
   HillshadeLayerStyleProps as HillshadeLayerStyle,
   BackgroundLayerStyleProps as BackgroundLayerStyle,
   LightLayerStyleProps as LightLayerStyle,
-} from "./utils/MaplibreStyles";
+} from "./utils/MapLibreRNStyles";
 
 /** @deprecated UserTrackingModes is deprecated use UserTrackingMode */
 export const UserTrackingModes = UserTrackingMode;

package/src/assets/png.d.ts

@@ -0,0 +1,4 @@
+declare module "*.png" {
+  const content: number;
+  export default content;
+}

package/{javascript → src}/components/Annotation.tsx

@@ -1,14 +1,16 @@
-import React, {
-  ReactElement,
+import {
+  forwardRef,
+  type ReactElement,
   useCallback,
   useEffect,
   useImperativeHandle,
+  useState,
 } from "react";
 import { Animated as RNAnimated, Easing } from "react-native";
 
 import SymbolLayer from "./SymbolLayer";
-import OnPressEvent from "../types/OnPressEvent";
-import { SymbolLayerStyleProps } from "../utils/MaplibreStyles";
+import { type OnPressEvent } from "../types/OnPressEvent";
+import { type SymbolLayerStyleProps } from "../utils/MapLibreRNStyles";
 import { AnimatedShapeSource } from "../utils/animated/Animated";
 import AnimatedMapPoint from "../utils/animated/AnimatedPoint";
 
@@ -47,7 +49,7 @@ interface AnnotationRef {
   symbolStyle: SymbolLayerStyleProps | undefined;
 }
 
-const Annotation = React.forwardRef<AnnotationRef, AnnotationProps>(
+const Annotation = forwardRef<AnnotationRef, AnnotationProps>(
   (
     {
       animated = false,
@@ -72,9 +74,7 @@ const Annotation = React.forwardRef<AnnotationRef, AnnotationProps>(
       }),
     );
 
-    const [shape, setShape] = React.useState<Shape | null>(
-      getShapeFromProps(props),
-    );
+    const [shape, setShape] = useState<Shape | null>(getShapeFromProps(props));
 
     // this will run useEffect only when actual coordinates values change
     const coordinateDeps = props.coordinates?.join(",");

package/{javascript → src}/components/BackgroundLayer.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
 import useAbstractLayer, {
-  BaseLayerProps,
-  NativeBaseProps,
+  type BaseLayerProps,
+  type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { BackgroundLayerStyleProps } from "../utils/MaplibreStyles";
+import { type BaseProps } from "../types/BaseProps";
+import { type BackgroundLayerStyleProps } from "../utils/MapLibreRNStyles";
 
 const MapLibreGL = NativeModules.MLNModule;
 

package/{javascript → src}/components/Callout.tsx

@@ -1,13 +1,13 @@
-import React, { ReactElement } from "react";
+import { Children, type ReactElement } from "react";
 import {
   View,
   Text,
   Animated,
   requireNativeComponent,
   StyleSheet,
-  ViewStyle,
-  ViewProps,
-  StyleProp,
+  type ViewStyle,
+  type ViewProps,
+  type StyleProp,
 } from "react-native";
 
 export const NATIVE_MODULE_NAME = "RCTMLNCallout";
@@ -102,7 +102,7 @@ const Callout = (props: CalloutProps): ReactElement => {
     } as ViewStyle,
   ];
 
-  const _hasChildren = React.Children.count(children) > 0;
+  const _hasChildren = Children.count(children) > 0;
 
   const _renderDefaultCallout = (): ReactElement => {
     return (

package/{javascript → src}/components/Camera.tsx

@@ -1,12 +1,12 @@
 import { point } from "@turf/helpers";
-import React, { forwardRef, memo, useImperativeHandle, useMemo } from "react";
-import { requireNativeComponent, ViewProps } from "react-native";
+import { forwardRef, memo, useImperativeHandle, useMemo } from "react";
+import { requireNativeComponent, type ViewProps } from "react-native";
 
 import { CameraModes } from "../MLNModule";
 import { useNativeRef } from "../hooks/useNativeRef";
-import { MaplibreGLEvent } from "../types";
-import BaseProps from "../types/BaseProps";
+import { type BaseProps } from "../types/BaseProps";
 import { CameraMode } from "../types/CameraMode";
+import type { MapLibreRNEvent } from "../types/MapLibreRNEvent";
 import { makeNativeBounds } from "../utils/makeNativeBounds";
 
 export const NATIVE_MODULE_NAME = "RCTMLNCamera";
@@ -18,7 +18,7 @@ export enum UserTrackingMode {
 }
 
 export type UserTrackingModeChangeCallback = (
-  event: MaplibreGLEvent<
+  event: MapLibreRNEvent<
     "usertrackingmodechange",
     {
       followUserLocation: boolean;

package/{javascript → src}/components/CircleLayer.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
 import useAbstractLayer, {
-  BaseLayerProps,
-  NativeBaseProps,
+  type BaseLayerProps,
+  type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { CircleLayerStyleProps } from "../utils/MaplibreStyles";
+import { type BaseProps } from "../types/BaseProps";
+import { type CircleLayerStyleProps } from "../utils/MapLibreRNStyles";
 
 const MapLibreGL = NativeModules.MLNModule;
 

package/{javascript → src}/components/FillExtrusionLayer.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
 import useAbstractLayer, {
-  BaseLayerProps,
-  NativeBaseProps,
+  type BaseLayerProps,
+  type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { FillExtrusionLayerStyleProps } from "../utils/MaplibreStyles";
+import { type BaseProps } from "../types/BaseProps";
+import { type FillExtrusionLayerStyleProps } from "../utils/MapLibreRNStyles";
 
 const MapLibreGL = NativeModules.MLNModule;
 

package/{javascript → src}/components/FillLayer.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
 import useAbstractLayer, {
-  BaseLayerProps,
-  NativeBaseProps,
+  type BaseLayerProps,
+  type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { FillLayerStyleProps } from "../utils/MaplibreStyles";
+import { type BaseProps } from "../types/BaseProps";
+import { type FillLayerStyleProps } from "../utils/MapLibreRNStyles";
 
 const MapLibreGL = NativeModules.MLNModule;
 

package/{javascript → src}/components/HeadingIndicator.tsx

@@ -1,9 +1,8 @@
-import React, { ReactElement } from "react";
+import { type ReactElement } from "react";
 
 import SymbolLayer from "./SymbolLayer";
-// @ts-ignore
-import headingIcon from "../../assets/heading.png";
-import BaseProps from "../types/BaseProps";
+import headingIcon from "../assets/heading.png";
+import { type BaseProps } from "../types/BaseProps";
 
 const style = {
   iconImage: headingIcon,

package/{javascript → src}/components/HeatmapLayer.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
 import useAbstractLayer, {
-  BaseLayerProps,
-  NativeBaseProps,
+  type BaseLayerProps,
+  type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { HeatmapLayerStyleProps } from "../utils/MaplibreStyles";
+import { type BaseProps } from "../types/BaseProps";
+import { type HeatmapLayerStyleProps } from "../utils/MapLibreRNStyles";
 
 const MapLibreGL = NativeModules.MLNModule;
 

package/{javascript → src}/components/ImageSource.tsx

@@ -1,8 +1,8 @@
-import React, { ReactElement } from "react";
+import { type ReactElement } from "react";
 import { requireNativeComponent } from "react-native";
 
 import useAbstractSource from "../hooks/useAbstractSource";
-import BaseProps from "../types/BaseProps";
+import { type BaseProps } from "../types/BaseProps";
 import {
   cloneReactChildrenWithProps,
   isNumber,

package/{javascript → src}/components/Images.tsx

@@ -1,14 +1,14 @@
-import React, { ReactElement } from "react";
+import { type ReactElement } from "react";
 import {
   requireNativeComponent,
   Image,
-  NativeSyntheticEvent,
-  ImageSourcePropType,
-  ImageURISource,
+  type NativeSyntheticEvent,
+  type ImageSourcePropType,
+  type ImageURISource,
 } from "react-native";
 
 import { SHAPE_SOURCE_NATIVE_ASSETS_KEY } from "./ShapeSource";
-import BaseProps from "../types/BaseProps";
+import { type BaseProps } from "../types/BaseProps";
 
 export const NATIVE_MODULE_NAME = "RCTMLNImages";
 
@@ -90,9 +90,9 @@ const Images = ({
             `Use of ${SHAPE_SOURCE_NATIVE_ASSETS_KEY} in Images#images is deprecated please use Images#nativeAssetImages`,
           );
           nativeImages = value;
-        } else if (_isUrlOrPath(value)) {
+        } else if (value && _isUrlOrPath(value)) {
           imagesResult[imageName] = value;
-        } else if (_isImageSourcePropType(value)) {
+        } else if (value && _isImageSourcePropType(value)) {
           const res = Image.resolveAssetSource(value);
           if (res && res.uri) {
             imagesResult[imageName] = res;

package/{javascript → src}/components/Light.tsx

@@ -1,10 +1,12 @@
 import React from "react";
 import { requireNativeComponent } from "react-native";
 
-import useAbstractLayer, { BaseLayerProps } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { LightLayerStyleProps } from "../utils/MaplibreStyles";
-import { StyleValue } from "../utils/StyleValue";
+import useAbstractLayer, {
+  type BaseLayerProps,
+} from "../hooks/useAbstractLayer";
+import { type BaseProps } from "../types/BaseProps";
+import { type LightLayerStyleProps } from "../utils/MapLibreRNStyles";
+import { type StyleValue } from "../utils/StyleValue";
 
 export const NATIVE_MODULE_NAME = "RCTMLNLight";
 

package/{javascript → src}/components/LineLayer.tsx

@@ -2,11 +2,11 @@ import React from "react";
 import { NativeModules, requireNativeComponent } from "react-native";
 
 import useAbstractLayer, {
-  BaseLayerProps,
-  NativeBaseProps,
+  type BaseLayerProps,
+  type NativeBaseProps,
 } from "../hooks/useAbstractLayer";
-import BaseProps from "../types/BaseProps";
-import { LineLayerStyleProps } from "../utils/MaplibreStyles";
+import { type BaseProps } from "../types/BaseProps";
+import { type LineLayerStyleProps } from "../utils/MapLibreRNStyles";
 
 const MapLibreGL = NativeModules.MLNModule;