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

package/CHANGELOG.md

@@ -6,6 +6,10 @@ PR Title ([#123](link to my pr))
 
 ```
 
+## 10.0.0-alpha.27
+
+fix: use UIManager exported from react-native ([#511](https://github.com/maplibre/maplibre-react-native/pull/511))
+
 ## 10.0.0-alpha.26
 
 chore: upgrade Expo SDK 52 ([489](https://github.com/maplibre/maplibre-react-native/pull/489))

package/android/src/main/java/com/maplibre/rctmln/components/styles/RCTMLNStyleFactory.java

@@ -1,5 +1,5 @@
 // DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// This file is auto-generated from scripts/templates/RCTMLNStyleFactory.java.ejs
 
 package com.maplibre.rctmln.components.styles;
 

package/docs/Annotation.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/Annotation.tsx -->
 # `<MapLibreGL.Annotation />`
 

package/docs/BackgroundLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/BackgroundLayer.tsx -->
 # `<MapLibreGL.BackgroundLayer />`
 

package/docs/Callout.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/Callout.tsx -->
 # `<MapLibreGL.Callout />`
 Callout that displays information about a selected annotation near the annotation.

package/docs/Camera.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/Camera.tsx -->
 # `<MapLibreGL.Camera />`
 

package/docs/CircleLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/CircleLayer.tsx -->
 # `<MapLibreGL.CircleLayer />`
 CircleLayer is a style layer that renders one or more filled circles on the map.

package/docs/FillExtrusionLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/FillExtrusionLayer.tsx -->
 # `<MapLibreGL.FillExtrusionLayer />`
 FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map.

package/docs/FillLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/FillLayer.tsx -->
 # `<MapLibreGL.FillLayer />`
 FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map.

package/docs/HeadingIndicator.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/HeadingIndicator.tsx -->
 # `<MapLibreGL.HeadingIndicator />`
 

package/docs/HeatmapLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/HeatmapLayer.tsx -->
 # `<MapLibreGL.HeatmapLayer />`
 HeatmapLayer is a style layer that renders one or more filled circles on the map.

package/docs/ImageSource.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/ImageSource.tsx -->
 # `<MapLibreGL.ImageSource />`
 ImageSource is a content source that is used for a georeferenced raster image to be shown on the map.<br/>The georeferenced image scales and rotates as the user zooms and rotates the map

package/docs/Images.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/Images.tsx -->
 # `<MapLibreGL.Images />`
 Images defines the images used in Symbol etc layers

package/docs/Light.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/Light.tsx -->
 # `<MapLibreGL.Light />`
 Light represents the light source for extruded geometries

package/docs/LineLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/LineLayer.tsx -->
 # `<MapLibreGL.LineLayer />`
 LineLayer is a style layer that renders one or more stroked polylines on the map.

package/docs/MapView.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/MapView.tsx -->
 # `<MapLibreGL.MapView />`
 MapView backed by MapLibre Native

package/docs/MarkerView.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/MarkerView.tsx -->
 # `<MapLibreGL.MarkerView />`
 MarkerView allows you to place a interactive react native marker to the map.<br/><br/>If you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance<br/>.<br/>This is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android<br/>and PointAnnotation on iOS.

package/docs/NativeUserLocation.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/NativeUserLocation.tsx -->
 # `<MapLibreGL.NativeUserLocation />`
 

package/docs/PointAnnotation.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/PointAnnotation.tsx -->
 # `<MapLibreGL.PointAnnotation />`
 PointAnnotation represents a one-dimensional shape located at a single geographical coordinate.<br/><br/>Consider using ShapeSource and SymbolLayer instead, if you have many points and you have static images,<br/>they'll offer much better performance<br/><br/>.<br/>If you need interctive views please use MarkerView,<br/>as with PointAnnotation on Android child views are rendered onto a bitmap for better performance.

package/docs/RasterLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/RasterLayer.tsx -->
 # `<MapLibreGL.RasterLayer />`
 

package/docs/RasterSource.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/RasterSource.tsx -->
 # `<MapLibreGL.RasterSource />`
 RasterSource is a map content source that supplies raster image tiles to be shown on the map.<br/>The location of and metadata about the tiles are defined either by an option dictionary<br/>or by an external file that conforms to the TileJSON specification.

package/docs/ShapeSource.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/ShapeSource.tsx -->
 # `<MapLibreGL.ShapeSource />`
 ShapeSource is a map content source that supplies vector shapes to be shown on the map.<br/>The shape may be a url or a GeoJSON object

package/docs/Style.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/Style.tsx -->
 # `<MapLibreGL.Style />`
 Style is a component that automatically adds sources / layers to the map using MapLibre Style Spec.<br/>Only [`sources`](https://maplibre.org/maplibre-gl-js-docs/style-spec/sources/) & [`layers`](https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/) are supported.<br/>Other fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will be mentioned under https://github.com/maplibre/maplibre-react-native/tree/main/docs.<br/><br/>TODO: Maintainer forking this project does not understand the above comment regarding what is supported.

package/docs/SymbolLayer.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/SymbolLayer.tsx -->
 # `<MapLibreGL.SymbolLayer />`
 SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map.

package/docs/UserLocation.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/UserLocation.tsx -->
 # `<MapLibreGL.UserLocation />`
 

package/docs/VectorSource.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/components/VectorSource.tsx -->
 # `<MapLibreGL.VectorSource />`
 VectorSource is a map content source that supplies tiled vector data in Mapbox Vector Tile format to be shown on the map.<br/>The location of and metadata about the tiles are defined either by an option dictionary or by an external file that conforms to the TileJSON specification.

package/docs/coordinates.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/modules/location/locationManager.ts -->
 # `<MapLibreGL.coordinates />`
 Coorinates sent by locationManager

package/docs/location.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/modules/location/locationManager.ts -->
 # `<MapLibreGL.location />`
 Location sent by locationManager

package/docs/offlineManager.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/modules/offline/offlineManager.ts -->
 # `<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.

package/docs/snapshotManager.md

@@ -1,4 +1,4 @@
-<!-- DO NOT MODIFY! -->
+<!-- DO NOT MODIFY -->
 <!-- This file is auto-generated from javascript/modules/snapshot/snapshotManager.ts -->
 # `<MapLibreGL.snapshotManager />`
 The snapshotManager generates static raster images of the map.<br/>Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.<br/>The snapshotter generates the snapshot asynchronous.

package/ios/RCTMLN/RCTMLNStyle.h

@@ -1,5 +1,5 @@
 // DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// This file is auto-generated from scripts/templates/RCTMLNStyle.h.ejs
 
 #import "RCTMLNStyle.h"
 #import "RCTMLNStyleValue.h"

package/ios/RCTMLN/RCTMLNStyle.m

@@ -1,5 +1,5 @@
 // DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// This file is auto-generated from scripts/templates/RCTMLNStyle.m.ejs
 
 #import "RCTMLNStyle.h"
 #import "RCTMLNUtils.h"

package/javascript/utils/MaplibreStyles.d.ts

@@ -1,4 +1,6 @@
-/* This file was generated from MapboxStyle.ts.ejs do not modify */
+// DO NOT MODIFY
+// This file is auto-generated from scripts/templates/MaplibreStyles.ts.ejs
+
 import { type ImageSourcePropType } from "react-native";
 
 export type Translation = { x: number; y: number } | [number, number];

package/javascript/utils/index.ts

@@ -5,14 +5,11 @@ import {
   findNodeHandle,
   Platform,
   ImageSourcePropType,
+  UIManager,
 } from "react-native";
 
-function getAndroidManagerInstance(module: string): any {
-  const haveViewManagerConfig =
-    NativeModules.UIManager && NativeModules.UIManager.getViewManagerConfig;
-  return haveViewManagerConfig
-    ? NativeModules.UIManager.getViewManagerConfig(module)
-    : NativeModules.UIManager[module];
+function getAndroidManagerInstance(module: string) {
+  return UIManager.getViewManagerConfig(module);
 }
 
 function getIosManagerInstance(module: string): any {
@@ -84,11 +81,14 @@ export function runNativeCommand<ReturnType = NativeArg>(
   }
 
   if (isAndroid()) {
-    return NativeModules.UIManager.dispatchViewManagerCommand(
+    UIManager.dispatchViewManagerCommand(
       handle,
       managerInstance.Commands[name],
       args,
     );
+
+    // Android uses callback instead of return
+    return null as ReturnType;
   }
 
   return managerInstance[name](handle, ...args);
@@ -125,6 +125,7 @@ export function getIOSModuleName(moduleName: string): string {
   if (moduleName.startsWith("RCT")) {
     return moduleName.substring(3);
   }
+
   return moduleName;
 }
 

package/javascript/utils/styleMap.ts

@@ -1,6 +1,6 @@
 /* eslint-disable */
 // DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// This file is auto-generated from scripts/templates/styleMap.ts.ejs
 
 import { isAndroid } from "./index";
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maplibre/maplibre-react-native",
   "description": "React Native library for creating maps with MapLibre Native for Android & iOS",
-  "version": "10.0.0-alpha.26",
+  "version": "10.0.0-alpha.27",
   "publishConfig": {
     "access": "public"
   },

package/scripts/codegen.ts

@@ -15,7 +15,7 @@ import {
   isVersionGTE,
 } from "./utils/getNativeVersion";
 
-const TMPL_PATH = path.join(__dirname, "templates");
+const TEMPLATES_PATH = path.join(__dirname, "templates");
 
 const IOS_OUTPUT_PATH = path.join(__dirname, "..", "ios", "RCTMLN");
 const ANDROID_OUTPUT_PATH = path.join(
@@ -36,23 +36,23 @@ const JS_OUTPUT_PATH = path.join(__dirname, "..", "javascript", "utils");
 
 const TEMPLATE_MAPPINGS = [
   {
-    input: path.join(TMPL_PATH, "RCTMLNStyle.h.ejs"),
+    input: path.join(TEMPLATES_PATH, "RCTMLNStyle.h.ejs"),
     output: path.join(IOS_OUTPUT_PATH, "RCTMLNStyle.h"),
   },
   {
-    input: path.join(TMPL_PATH, "MaplibreStyles.ts.ejs"),
+    input: path.join(TEMPLATES_PATH, "MaplibreStyles.ts.ejs"),
     output: path.join(JS_OUTPUT_PATH, "MaplibreStyles.d.ts"),
   },
   {
-    input: path.join(TMPL_PATH, "RCTMLNStyle.m.ejs"),
+    input: path.join(TEMPLATES_PATH, "RCTMLNStyle.m.ejs"),
     output: path.join(IOS_OUTPUT_PATH, "RCTMLNStyle.m"),
   },
   {
-    input: path.join(TMPL_PATH, "RCTMLNStyleFactory.java.ejs"),
+    input: path.join(TEMPLATES_PATH, "RCTMLNStyleFactory.java.ejs"),
     output: path.join(ANDROID_OUTPUT_PATH, "RCTMLNStyleFactory.java"),
   },
   {
-    input: path.join(TMPL_PATH, "styleMap.ts.ejs"),
+    input: path.join(TEMPLATES_PATH, "styleMap.ts.ejs"),
     output: path.join(JS_OUTPUT_PATH, "styleMap.ts"),
   },
 ];
@@ -295,11 +295,15 @@ async function generate() {
       const filename = path.parse(output).base;
 
       console.log(`Generating ${filename}`);
-      const tmpl = ejs.compile(await fs.readFile(input, "utf8"), {
+      const template = ejs.compile(await fs.readFile(input, "utf8"), {
         strict: true,
         async: true,
       });
-      let results = await tmpl({ layers, helpers: TemplateHelpers });
+      let results = await template({
+        layers,
+        filePath: path.relative(path.join(__dirname, ".."), input),
+        helpers: TemplateHelpers,
+      });
       if (filename.endsWith("ts")) {
         results = await prettier.format(results, {
           filepath: filename,

package/scripts/templates/MaplibreStyles.ts.ejs

@@ -2,7 +2,9 @@
   const layers = locals.layers;
   const helpers = locals.helpers;
 -%>
-/* This file was generated from MapboxStyle.ts.ejs do not modify */
+// <%= helpers.autoGeneratedHeader.doNotModify %>
+// <%= helpers.autoGeneratedHeader.generatedFrom(locals.filePath) %>
+
 import { type ImageSourcePropType } from 'react-native';
 
 export type Translation = { x: number; y: number } | [number, number];

package/scripts/templates/RCTMLNStyle.h.ejs

@@ -2,8 +2,8 @@
   const layers = locals.layers;
   const helpers = locals.helpers;
 -%>
-// DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// <%= helpers.autoGeneratedHeader.doNotModify %>
+// <%= helpers.autoGeneratedHeader.generatedFrom(locals.filePath) %>
 
 #import "RCTMLNStyle.h"
 #import "RCTMLNStyleValue.h"

package/scripts/templates/RCTMLNStyle.m.ejs

@@ -2,8 +2,8 @@
   const layers = locals.layers;
   const helpers = locals.helpers;
 -%>
-// DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// <%= helpers.autoGeneratedHeader.doNotModify %>
+// <%= helpers.autoGeneratedHeader.generatedFrom(locals.filePath) %>
 
 #import "RCTMLNStyle.h"
 #import "RCTMLNUtils.h"

package/scripts/templates/RCTMLNStyleFactory.java.ejs

@@ -2,8 +2,8 @@
   const layers = locals.layers;
   const helpers = locals.helpers;
 -%>
-// DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// <%= helpers.autoGeneratedHeader.doNotModify %>
+// <%= helpers.autoGeneratedHeader.generatedFrom(locals.filePath) %>
 
 package com.maplibre.rctmln.components.styles;
 

package/scripts/templates/component.md.ejs

@@ -2,8 +2,8 @@
   const component = locals.component;
   const helpers = locals.helpers;
 -%>
-<!-- DO NOT MODIFY! -->
-<!-- This file is auto-generated from <%- component.filePath %> -->
+<!-- <%= helpers.autoGeneratedHeader.doNotModify %> -->
+<!-- <%= helpers.autoGeneratedHeader.generatedFrom(component.filePath) %> -->
 # `<MapLibreGL.<%- component.name %> />`
 <%- helpers.replaceNewLine(component.description) %>
 

package/scripts/templates/styleMap.ts.ejs

@@ -3,8 +3,8 @@
   const helpers = locals.helpers;
 -%>
 /* eslint-disable */
-// DO NOT MODIFY
-// THIS FILE IS AUTOGENERATED
+// <%= helpers.autoGeneratedHeader.doNotModify %>
+// <%= helpers.autoGeneratedHeader.generatedFrom(locals.filePath) %>
 
 import { isAndroid } from './index';
 

package/scripts/utils/MarkdownBuilder.ts

@@ -4,18 +4,18 @@ import path from "node:path";
 
 import * as TemplateHelpers from "./TemplateHelpers";
 
-const TMPL_PATH = path.join(__dirname, "..", "templates");
+const TEMPLATE_PATH = path.join(__dirname, "..", "templates");
 
 export class MarkdownBuilder {
   async generateComponentFile(docJSON: any, componentName: string) {
-    const tmpl = ejs.compile(
-      await fs.readFile(path.join(TMPL_PATH, "component.md.ejs"), "utf8"),
+    const template = ejs.compile(
+      await fs.readFile(path.join(TEMPLATE_PATH, "component.md.ejs"), "utf8"),
       {
         async: true,
         strict: true,
       },
     );
-    const fileContents = await tmpl({
+    const fileContents = await template({
       component: docJSON[componentName],
       helpers: TemplateHelpers,
     });

package/scripts/utils/TemplateHelpers.ts

@@ -40,6 +40,12 @@ const iosSpecOverrides: Record<string, string> = {
   "text-writing-mode": "text-writing-modes",
 };
 
+export const autoGeneratedHeader = {
+  doNotModify: "DO NOT MODIFY",
+  generatedFrom: (filePath: string) =>
+    `This file is auto-generated from ${filePath}`,
+};
+
 export function exists<T>(value: T): value is NonNullable<T> {
   return typeof value !== "undefined" && value !== null;
 }