@rnmapbox/maps 10.1.0 → 10.1.1

package/src/components/Viewport.tsx

@@ -0,0 +1,330 @@
+import React, {
+  Component,
+  forwardRef,
+  memo,
+  useEffect,
+  useImperativeHandle,
+  useMemo,
+  useRef,
+} from 'react';
+import {
+  NodeHandle,
+  findNodeHandle,
+  type NativeMethods,
+  type NativeSyntheticEvent,
+} from 'react-native';
+
+import NativeViewport, {
+  type NativeViewportReal,
+  type OnStatusChangedEventTypeReal,
+} from '../specs/RNMBXViewportNativeComponent';
+import RNMBXViewportModule from '../specs/NativeRNMBXViewportModule';
+
+type FollowPuckOptions = {
+  /**
+   * The value to use for setting zoom. If 'keep', zoom will not be modified by the FollowPuckViewportState.
+   * @default DEFAULT_FOLLOW_PUCK_VIEWPORT_STATE_ZOOM.
+   */
+  zoom?: number | 'keep';
+
+  /**
+   * The value to use for setting pitch. If 'keep', pitch will not be modified by the FollowPuckViewportState.
+   * @default DEFAULT_FOLLOW_PUCK_VIEWPORT_STATE_PITCH degrees.
+   */
+  pitch?: number | 'keep';
+
+  /**
+   * Indicates how to obtain the value to use for bearing when setting the camera.
+   * If set to 'keep', bearing will not be modified by the FollowPuckViewportState.
+   *  - heading: sets bearing to the heading of the device
+   *  - course: sets bearing based on the direction of travel
+   *  - number: sets the camera bearing to the constant value on every frame
+   *
+   * On Android, 'heading' and 'coruse' sets the camera bearing to the same as the location puck's bearing. See
+   * [syncWithLocationPuck](https://docs.mapbox.com/android/maps/api/11.0.0/mapbox-maps-android/com.mapbox.maps.plugin.viewport.data/-follow-puck-viewport-state-bearing/-sync-with-location-puck/)
+   *
+   * @default 'heading'
+   */
+  bearing?: 'heading' | 'course' | number | 'keep';
+
+  /**
+   * The value to use for setting CameraOptions.padding. If 'keep', padding will not be modified by the FollowPuckViewportState.
+   *
+   * @default 0 padding
+   */
+  padding?:
+    | {
+        top?: number;
+        left?: number;
+        bottom?: number;
+        right?: number;
+      }
+    | 'keep';
+};
+
+type OverviewOptions = {
+  /**
+   * The geometry that the ``OverviewViewportState`` should use when calculating its camera.
+   */
+  geometry: GeoJSON.Geometry;
+
+  /**
+   * The padding that ``OverviewViewportState`` should use when calculating its camera.
+   *
+   * @default 0 padding
+   */
+  padding?: {
+    top?: number;
+    left?: number;
+    bottom?: number;
+    right?: number;
+  };
+
+  /**
+   * The bearing that ``OverviewViewportState`` should use when calcualting its camera.
+   */
+  bearing?: number;
+
+  /**
+   * The pitch that ``OverviewViewportState`` should use when calculating its camera.
+   */
+  pitch?: number;
+
+  /**
+   * The length of the animation performed by in seconds ``OverviewViewportState`` when it starts updating
+   * the camera.
+   */
+  animationDuration?: number;
+};
+
+type ViewportState =
+  | {
+      kind: 'followPuck';
+      options?: FollowPuckOptions;
+    }
+  | {
+      kind: 'overview';
+      options?: OverviewOptions;
+    };
+
+type ViewportStatus =
+  | {
+      kind: 'idle';
+    }
+  | {
+      kind: 'transition';
+      toState: ViewportState;
+      transition: ViewportTransition;
+    };
+
+type ViewportTransition =
+  | {
+      kind: 'immediate';
+    }
+  | {
+      kind: 'default';
+      maxDurationMs?: number;
+    };
+
+type ViewportStatusChangeReason =
+  | 'TransitionStarted'
+  | 'TransitionSucceeded'
+  | 'IdleRequested'
+  | 'UserInteraction';
+
+type ViewportStatusChangedEvent = {
+  from: ViewportStatus;
+  to: ViewportStatus;
+  reason: ViewportStatusChangeReason;
+};
+
+type Props = {
+  /**
+   * Indicates whether the Viewport should idle when the MapView receives touch input.
+   *
+   * Set this property to false to enable building custom ViewportStates that can work simultaneously with certain types of gestures.
+   *
+   * Defaults to true.
+   */
+  transitionsToIdleUponUserInteraction?: boolean;
+
+  /**
+   * Subscribes to status changes, will be called when the status changes.
+   *
+   * Observers are notified of status changes asynchronously on the main queue.
+   * This means that by the time the notification is delivered, the status may have already changed again.
+   * This behavior is necessary to allow observers to trigger further transitions while avoiding out-of-order
+   * delivery of status changed notifications.
+   *
+   */
+  onStatusChanged?: (event: ViewportStatusChangedEvent) => void;
+};
+
+export interface Ref {
+  getState(): Promise<string>;
+  idle(): Promise<void>;
+  transitionTo(
+    state: ViewportState,
+    transition?: ViewportTransition,
+  ): Promise<boolean>;
+}
+
+/**
+ * provides a structured approach to organizing camera management logic into states and transitions between them.
+ *
+ * At any given time, the viewport is either:
+ *  - idle
+ *  - in a state (camera is being managed by a ViewportState)
+ *  - transitioning between states
+ *
+ * See [android](https://docs.mapbox.com/android/maps/api/${ANDROID_SDK_VERSION}/mapbox-maps-android/com.mapbox.maps.plugin.viewport/viewport.html),
+ * [ios](https://docs.mapbox.com/ios/maps/api/${IOS_SDK_VERSION}/Viewport.html#/s:10MapboxMaps8ViewportC)
+ */
+export const Viewport = memo(
+  forwardRef<Ref, Props>((props: Props, ref: React.ForwardedRef<Ref>) => {
+    const commands = useMemo(() => new NativeCommands(RNMBXViewportModule), []);
+    const nativeViewport = useRef<RNMBXViewportRefType>(null);
+    useEffect(() => {
+      if (nativeViewport.current) {
+        commands.setNativeRef(nativeViewport.current);
+      }
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [commands, nativeViewport.current]);
+
+    useImperativeHandle(ref, () => ({
+      getState() {
+        console.log(' => calling getState');
+        return commands.call<string>('getState', []);
+      },
+      async idle() {
+        return commands.call<void>('idle', []);
+      },
+      transitionTo(state, transition) {
+        return commands.call<boolean>('transitionTo', [state, transition]);
+      },
+    }));
+
+    const onStatusChangedNative = useMemo(() => {
+      const propsOnStatusChanged = props.onStatusChanged;
+      if (propsOnStatusChanged != null) {
+        return (event: NativeSyntheticEvent<OnStatusChangedEventTypeReal>) => {
+          propsOnStatusChanged(event.nativeEvent.payload);
+        };
+      } else {
+        return undefined;
+      }
+    }, [props.onStatusChanged]);
+
+    return (
+      <RNMBXViewport
+        {...props}
+        hasStatusChanged={props.onStatusChanged != null}
+        onStatusChanged={onStatusChangedNative}
+        ref={nativeViewport}
+      />
+    );
+  }),
+);
+export type Viewport = Ref;
+
+type NativeProps = Omit<Props, 'onStatusChanged'> & {
+  hasStatusChanged: boolean;
+  onStatusChanged?: (
+    event: NativeSyntheticEvent<{
+      type: string;
+      payload: ViewportStatusChangedEvent;
+    }>,
+  ) => void;
+};
+
+type RNMBXViewportRefType = Component<NativeProps> & Readonly<NativeMethods>;
+
+const RNMBXViewport = NativeViewport as NativeViewportReal;
+
+export type NativeArg =
+  | string
+  | number
+  | boolean
+  | null
+  | { [k: string]: NativeArg }
+  | NativeArg[]
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  | Function
+  | GeoJSON.Geometry
+  | undefined;
+
+type FunctionKeys<T> = keyof {
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  [K in keyof T as T[K] extends Function ? K : never]: T[K];
+};
+
+type RefType = React.Component;
+
+class NativeCommands<Spec extends object> {
+  module: Spec;
+
+  preRefMethodQueue: Array<{
+    method: { name: FunctionKeys<Spec>; args: NativeArg[] };
+    resolver: (value: unknown) => void;
+  }>;
+
+  nativeRef: RefType | undefined;
+
+  constructor(module: Spec) {
+    this.module = module;
+    this.preRefMethodQueue = [];
+  }
+
+  async setNativeRef(nativeRef: RefType) {
+    if (nativeRef) {
+      this.nativeRef = nativeRef;
+      while (this.preRefMethodQueue.length > 0) {
+        const item = this.preRefMethodQueue.pop();
+
+        if (item && item.method && item.resolver) {
+          const res = await this._call(
+            item.method.name,
+            nativeRef,
+            item.method.args,
+          );
+          item.resolver(res);
+        }
+      }
+    }
+  }
+
+  call<T>(name: FunctionKeys<Spec>, args: NativeArg[]): Promise<T> {
+    if (this.nativeRef) {
+      return this._call(name, this.nativeRef, args);
+    } else {
+      return new Promise((resolve) => {
+        this.preRefMethodQueue.push({
+          method: { name, args },
+          resolver: resolve as (args: unknown) => void,
+        });
+      });
+    }
+  }
+
+  _call<T>(
+    name: FunctionKeys<Spec>,
+    nativeRef: RefType,
+    args: NativeArg[],
+  ): Promise<T> {
+    const handle = findNodeHandle(nativeRef);
+    if (handle) {
+      return (
+        this.module[name] as (
+          arg0: NodeHandle,
+          ...args: NativeArg[]
+        ) => Promise<T>
+      )(handle, ...args);
+    } else {
+      throw new Error(
+        `Could not find handle for native ref ${module} when trying to invoke ${String(
+          name,
+        )}`,
+      );
+    }
+  }
+}

package/src/components/codeparts/LayerPropsCommon.codepart-tsx

@@ -0,0 +1,62 @@
+type Slot = 'bottom' | 'middle' | 'top';
+
+type LayerPropsCommon = {
+  /**
+   * A string that uniquely identifies the source in the style to which it is added.
+   */
+  id: string;
+
+  /**
+   * The id refers to en existing layer in the style. Does not create a new layer.
+   */
+  existing?: boolean;
+
+  /**
+   * The source from which to obtain the data to style.
+   * If the source has not yet been added to the current style, the behavior is undefined.
+   * Inferred from parent source only if the layer is a direct child to it.
+   */
+  sourceID?: string;
+
+  /**
+   * Identifier of the layer within the source identified by the sourceID property from which the receiver obtains the data to style.
+   */
+  sourceLayerID?: string;
+
+  /**
+   * Inserts a layer above aboveLayerID.
+   */
+  aboveLayerID?: string;
+
+  /**
+   * Inserts a layer below belowLayerID
+   */
+  belowLayerID?: string;
+
+  /**
+   * Inserts a layer at a specified index
+   */
+  layerIndex?: number;
+
+  /**
+   *  Filter only the features in the source layer that satisfy a condition that you define
+   */
+  filter?: FilterExpression;
+
+  /**
+   * The minimum zoom level at which the layer gets parsed and appears.
+   */
+  minZoomLevel?: number;
+
+  /**
+   * The maximum zoom level at which the layer gets parsed and appears.
+   */
+  maxZoomLevel?: number;
+
+  /**
+   * The slot this layer is assigned to. If specified, and a slot with that name exists, it will be placed at that position in the layer order.
+   *
+   * v11 only
+   */
+  slot?: Slot;
+};

package/src/modules/offline/OfflinePackLegacy.ts

@@ -0,0 +1,55 @@
+import { NativeModules } from 'react-native';
+
+import OfflineCreatePackOptions from './OfflineCreatePackOptions';
+
+const MapboxGLOfflineManager = NativeModules.RNMBXOfflineModuleLegacy;
+
+type OfflinePackStatus = {
+  name: string;
+  state: number;
+  percentage: number;
+  completedResourceCount: number;
+  completedResourceSize: number;
+  completedTileSize: number;
+  completedTileCount: number;
+  requiredResourceCount: number;
+};
+
+class OfflinePackLegacy {
+  private pack: OfflineCreatePackOptions;
+  private _metadata: any;
+  constructor(pack: OfflineCreatePackOptions) {
+    this.pack = pack;
+    this._metadata = null;
+  }
+
+  get name() {
+    const { metadata } = this;
+    return metadata && metadata.name;
+  }
+
+  get bounds() {
+    return this.pack.bounds;
+  }
+
+  get metadata() {
+    if (!this._metadata && this.pack.metadata) {
+      this._metadata = JSON.parse(this.pack.metadata);
+    }
+    return this._metadata;
+  }
+
+  status(): Promise<OfflinePackStatus> {
+    return MapboxGLOfflineManager.getPackStatus(this.name);
+  }
+
+  resume(): Promise<void> {
+    return MapboxGLOfflineManager.resumePackDownload(this.name);
+  }
+
+  pause(): Promise<void> {
+    return MapboxGLOfflineManager.pausePackDownload(this.name);
+  }
+}
+
+export default OfflinePackLegacy;

package/src/modules/offline/offlineManager.ts

@@ -222,7 +222,6 @@ class OfflineManager {
    * @return {void}
    */
   async migrateOfflineCache(): Promise<void> {
-    await this._initialize();
     await MapboxOfflineManager.migrateOfflineCache();
   }
 
@@ -250,8 +249,9 @@ class OfflineManager {
    * @return {void}
    */
   async resetDatabase(): Promise<void> {
-    await this._initialize();
     await MapboxOfflineManager.resetDatabase();
+    this._offlinePacks = {};
+    await this._initialize(true);
   }
 
   /**
@@ -407,8 +407,8 @@ class OfflineManager {
     }
   }
 
-  async _initialize(): Promise<boolean> {
-    if (this._hasInitialized) {
+  async _initialize(forceInit?: boolean): Promise<boolean> {
+    if (this._hasInitialized && !forceInit) {
       return true;
     }
 

package/src/modules/offline/offlineManagerLegacy.ts

@@ -0,0 +1,181 @@
+import { NativeModules } from 'react-native';
+
+export {
+  default as OfflineCreatePackOptions,
+  type OfflineCreatePackOptionsArgs,
+} from './OfflineCreatePackOptions';
+import OfflineCreatePackOptions, {
+  type OfflineCreatePackOptionsArgs,
+} from './OfflineCreatePackOptions';
+import OfflinePack from './OfflinePackLegacy';
+
+const MapboxOfflineManager = NativeModules.RNMBXOfflineModuleLegacy;
+
+/**
+ * OfflineManagerLegacy implements a singleton (shared object) that manages offline packs.
+ * All of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.
+ * The shared object maintains a canonical collection of offline packs.
+ */
+class OfflineManagerLegacy {
+  private _hasInitialized: boolean;
+  private _offlinePacks: Record<string, OfflinePack>;
+
+  constructor() {
+    this._hasInitialized = false;
+    this._offlinePacks = {};
+  }
+
+  /**
+   * Creates and registers an offline pack that downloads the resources needed to use the given region offline.
+   *
+   * @example
+   *
+   * await Mapbox.offlineManager.createPack({
+   *   name: 'offlinePack',
+   *   styleURL: 'mapbox://...',
+   *   minZoom: 14,
+   *   maxZoom: 20,
+   *   bounds: [[neLng, neLat], [swLng, swLat]]
+   * })
+   *
+   * @param  {OfflineCreatePackOptions} options Create options for a offline pack that specifices zoom levels, style url, and the region to download.
+   * @return {void}
+   */
+  async createPack(options: OfflineCreatePackOptionsArgs): Promise<void> {
+    await this._initialize();
+
+    const packOptions = new OfflineCreatePackOptions(options);
+
+    if (this._offlinePacks[packOptions.name]) {
+      throw new Error(
+        `Offline pack with name ${packOptions.name} already exists.`,
+      );
+    }
+
+    const nativeOfflinePack = await MapboxOfflineManager.createPack(
+      packOptions,
+    );
+    this._offlinePacks[packOptions.name] = new OfflinePack(nativeOfflinePack);
+  }
+
+  /**
+   * 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.
+   *
+   * @example
+   * await Mapbox.offlineManagerLegacy.invalidatePack('packName')
+   *
+   * @param  {String}  name  Name of the offline pack.
+   * @return {void}
+   */
+  async invalidatePack(name: string): Promise<void> {
+    if (!name) {
+      return;
+    }
+
+    await this._initialize();
+
+    const offlinePack = this._offlinePacks[name];
+    if (offlinePack) {
+      await MapboxOfflineManager.invalidatePack(name);
+    }
+  }
+
+  /**
+   * Unregisters the given offline pack and allows resources that are no longer required by any remaining packs to be potentially freed.
+   *
+   * @example
+   * await Mapbox.offlineManagerLegacy.deletePack('packName')
+   *
+   * @param  {String}  name  Name of the offline pack.
+   * @return {void}
+   */
+  async deletePack(name: string): Promise<void> {
+    if (!name) {
+      return;
+    }
+
+    await this._initialize();
+
+    const offlinePack = this._offlinePacks[name];
+    if (offlinePack) {
+      await MapboxOfflineManager.deletePack(name);
+      delete this._offlinePacks[name];
+    }
+  }
+
+  /**
+   * Migrates the offline cache from pre-v10 SDKs to the new v10 cache location
+   *
+   * @example
+   * await Mapbox.offlineManager.migrateOfflineCache()
+   *
+   * @return {void}
+   */
+  async migrateOfflineCache(): Promise<void> {
+    await MapboxOfflineManager.migrateOfflineCache();
+  }
+
+  /**
+   * Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it.
+   *
+   * @example
+   * await Mapbox.offlineManager.resetDatabase();
+   *
+   * @return {void}
+   */
+  async resetDatabase(): Promise<void> {
+    await MapboxOfflineManager.resetDatabase();
+    this._offlinePacks = {};
+    await this._initialize(true);
+  }
+
+  /**
+   * Retrieves all the current offline packs that are stored in the database.
+   *
+   * @example
+   * const offlinePacks = await Mapbox.offlineManagerLegacy.getPacks();
+   *
+   * @return {Array<OfflinePack>}
+   */
+  async getPacks(): Promise<OfflinePack[]> {
+    await this._initialize();
+    return Object.keys(this._offlinePacks).map(
+      (name) => this._offlinePacks[name],
+    );
+  }
+
+  /**
+   * Retrieves an offline pack that is stored in the database by name.
+   *
+   * @example
+   * const offlinePack = await Mapbox.offlineManagerLegacy.getPack();
+   *
+   * @param  {String}  name  Name of the offline pack.
+   * @return {OfflinePack}
+   */
+  async getPack(name: string): Promise<OfflinePack | undefined> {
+    await this._initialize();
+    return this._offlinePacks[name];
+  }
+
+  async _initialize(forceInit?: boolean): Promise<boolean> {
+    if (this._hasInitialized && !forceInit) {
+      return true;
+    }
+
+    const nativeOfflinePacks = await MapboxOfflineManager.getPacks();
+
+    for (const nativeOfflinePack of nativeOfflinePacks) {
+      const offlinePack = new OfflinePack(nativeOfflinePack);
+      this._offlinePacks[offlinePack.name] = offlinePack;
+    }
+
+    this._hasInitialized = true;
+    return true;
+  }
+}
+
+const offlineManagerLegacy = new OfflineManagerLegacy();
+export default offlineManagerLegacy;

package/src/shape_animators/MovePointShapeAnimator.ts

@@ -0,0 +1,18 @@
+import { Position } from '../types/Position';
+import NativeRNMBXMovePointShapeAnimatorModule from '../specs/NativeRNMBXMovePointShapeAnimatorModule';
+
+import ShapeAnimatorManager from './ShapeAnimatorManager';
+
+export default class MovePointShapeAnimator {
+  __nativeTag: number;
+
+  constructor(from: Position) {
+    const tag = ShapeAnimatorManager.nextTag();
+    NativeRNMBXMovePointShapeAnimatorModule.create(tag, [from[0], from[1]]);
+    this.__nativeTag = tag;
+  }
+
+  start() {
+    NativeRNMBXMovePointShapeAnimatorModule.start(this.__nativeTag);
+  }
+}

package/src/shape_animators/ShapeAnimatorManager.tsx

@@ -0,0 +1,8 @@
+export default class ShapeAnimatorManager {
+  static tag = 42;
+
+  static nextTag(): number {
+    this.tag += 1;
+    return this.tag;
+  }
+}

package/src/specs/NativeRNMBXMovePointShapeAnimatorModule.ts

@@ -0,0 +1,16 @@
+import type { TurboModule } from 'react-native/Libraries/TurboModule/RCTExport';
+import { Int32, Double } from 'react-native/Libraries/Types/CodegenTypes';
+import { TurboModuleRegistry } from 'react-native';
+
+//import type { UnsafeMixed } from './codegenUtils';
+
+type AnimatorTag = Int32;
+
+export interface Spec extends TurboModule {
+  create(tag: AnimatorTag, from: ReadonlyArray<Double>): Promise<void>;
+  start(tag: AnimatorTag): Promise<void>;
+}
+
+export default TurboModuleRegistry.getEnforcing<Spec>(
+  'RNMBXMovePointShapeAnimatorModule',
+);