@iternio/react-native-auto-play 0.3.9 → 0.3.11

package/src/templates/MapTemplate.ts

@@ -3,11 +3,12 @@ import { AppRegistry, Platform } from 'react-native';
 import { NitroModules } from 'react-native-nitro-modules';
 import type { AutoText } from '..';
 import { MapTemplateProvider } from '../components/MapTemplateContext';
+import OnAppearedChildRenderer from '../components/OnAppearedChildRenderer';
 import { SafeAreaInsetsProvider } from '../components/SafeAreaInsetsContext';
 import { HybridAutoPlay } from '../hybrid/HybridAutoPlay';
 import type { MapTemplate as NitroMapTemplate } from '../specs/MapTemplate.nitro';
 import type { ActionButtonAndroid, MapButton, MapPanButton } from '../types/Button';
-import type { AutoManeuver } from '../types/Maneuver';
+import type { AutoManeuver, ManeuverState } from '../types/Maneuver';
 import type { ColorScheme, RootComponentInitialProps } from '../types/RootComponent';
 import type {
   TripConfig,
@@ -17,6 +18,7 @@ import type {
 } from '../types/Trip';
 import { type NitroAction, NitroActionUtil } from '../utils/NitroAction';
 import { type NavigationAlert, NitroAlertUtil } from '../utils/NitroAlert';
+import { type NitroColor, NitroColorUtil, type ThemedColor } from '../utils/NitroColor';
 import { NitroManeuverUtil, type NitroRoutingManeuver } from '../utils/NitroManeuver';
 import { NitroMapButton } from '../utils/NitroMapButton';
 import {
@@ -79,6 +81,8 @@ export interface NitroMapTemplateConfig extends TemplateConfig, NitroBaseMapTemp
   mapButtons?: Array<NitroMapButton>;
   headerActions?: Array<NitroAction>;
 
+  defaultGuidanceBackgroundColor?: NitroColor;
+
   /**
    * specify the percentage of screen height/width the pan button should scroll
    * @namespace iOS
@@ -130,7 +134,11 @@ export type BaseMapTemplateConfig<T> = {
 
 export type MapTemplateConfig = Omit<
   NitroMapTemplateConfig,
-  'mapButtons' | 'headerActions' | 'onStopNavigation' | 'onAutoDriveEnabled'
+  | 'mapButtons'
+  | 'headerActions'
+  | 'onStopNavigation'
+  | 'onAutoDriveEnabled'
+  | 'defaultGuidanceBackgroundColor'
 > &
   BaseMapTemplateConfig<MapTemplate> & {
     /**
@@ -149,6 +157,11 @@ export type MapTemplateConfig = Omit<
      * @namespace Android
      */
     onAutoDriveEnabled?: (template: MapTemplate) => void;
+
+    /**
+     * Initial navigation maneuver background color. Mainly useful, when in CarPlay the default loading maneuver does not have the right color.
+     */
+    defaultGuidanceBackgroundColor?: ThemedColor | string;
   };
 
 export interface TripSelectorCallback {
@@ -168,6 +181,7 @@ export class MapTemplate extends Template<MapTemplateConfig, MapTemplateConfig['
       headerActions,
       onStopNavigation,
       onAutoDriveEnabled,
+      defaultGuidanceBackgroundColor,
       ...baseConfig
     } = config;
 
@@ -180,7 +194,11 @@ export class MapTemplate extends Template<MapTemplateConfig, MapTemplateConfig['
           children: React.createElement(SafeAreaInsetsProvider, {
             moduleName: this.id,
             // biome-ignore lint/correctness/noChildrenProp: there is no other way in a ts file
-            children: React.createElement(component, props),
+            children: React.createElement(OnAppearedChildRenderer, {
+              // biome-ignore lint/correctness/noChildrenProp: there is no other way in a ts file
+              children: React.createElement(component, props),
+              moduleName: this.id,
+            }),
           }),
         })
     );
@@ -192,6 +210,10 @@ export class MapTemplate extends Template<MapTemplateConfig, MapTemplateConfig['
       mapButtons: NitroMapButton.convert(this.template, mapButtons),
       onStopNavigation: () => onStopNavigation(this.template),
       onAutoDriveEnabled: onAutoDriveEnabled ? () => onAutoDriveEnabled(this.template) : undefined,
+      defaultGuidanceBackgroundColor:
+        defaultGuidanceBackgroundColor != null
+          ? NitroColorUtil.convert(defaultGuidanceBackgroundColor)
+          : undefined,
     };
 
     HybridMapTemplate.createMapTemplate(nitroConfig);
@@ -322,7 +344,11 @@ export class MapTemplate extends Template<MapTemplateConfig, MapTemplateConfig['
     }
 
     if (maneuvers.type === 'loading') {
-      HybridMapTemplate.updateManeuvers(this.id, { isLoading: true });
+      HybridMapTemplate.updateManeuvers(this.id, {
+        isLoading: true,
+        cardBackgroundColor: NitroColorUtil.convert(maneuvers.cardBackgroundColor),
+        text: maneuvers.text != null ? maneuvers.text : undefined,
+      });
       return;
     }
 
@@ -341,4 +367,14 @@ export class MapTemplate extends Template<MapTemplateConfig, MapTemplateConfig['
   public stopNavigation() {
     HybridMapTemplate.stopNavigation(this.id);
   }
+
+  /**
+   * Sets the current maneuver state indicating progress within a maneuver.
+   * Transition through: continue → initial → prepare → execute → continue
+   * @namespace iOS sets CPManeuverState on the CPNavigationSession, used by instrument cluster and HUD
+   * @namespace Android no-op, Android Auto does not have an equivalent API
+   */
+  public setManeuverState(state: ManeuverState) {
+    HybridMapTemplate.setManeuverState(this.id, state);
+  }
 }

package/src/types/Maneuver.ts

@@ -64,6 +64,19 @@ export enum KeepType {
   FollowRoad = 2,
 }
 
+/**
+ * Describes the progress within a maneuver.
+ * Transition through: Continue → Initial → Prepare → Execute → Continue
+ * @namespace iOS sets CPManeuverState on the CPNavigationSession
+ * @namespace Android no-op, Android Auto does not have an equivalent API
+ */
+export enum ManeuverState {
+  Continue = 0, // iOS .continue
+  Initial = 1, // iOS .initial
+  Prepare = 2, // iOS .prepare
+  Execute = 3, // iOS .execute
+}
+
 export interface BaseManeuver {
   /**
    * @namespace iOS specify a unique identifier, sending over a Maneuver with a known id will only update the travelEstimates on the previously sent Maneuver
@@ -239,6 +252,12 @@ export type MessageManeuver = {
 
 export type LoadingManeuver = {
   type: 'loading';
+  cardBackgroundColor: ThemedColor | string;
+  /**
+   * @namespace iOS CarPlay — shows text on the loading maneuver card
+   * @namespace Android Auto — not supported
+   */
+  text?: string;
 };
 
 export type AutoManeuver =

package/src/utils/NitroManeuver.ts

@@ -54,6 +54,8 @@ export interface NitroMessageManeuver {
 
 interface NitroLoadingManeuver {
   isLoading: true;
+  cardBackgroundColor: NitroColor;
+  text?: string;
 }
 
 export type NitroManeuver =

package/src/utils/NitroMapButton.ts

@@ -27,7 +27,7 @@ const convert = <T>(template: T, mapButtons?: MapButtons<T>): Array<NitroMapButt
             ? button.image.backgroundColor
             : 'transparent';
 
-      const fontScale = (button.image.fontScale ?? Platform.OS === 'android') ? 1.0 : 0.65;
+      const fontScale = button.image.fontScale ?? (Platform.OS === 'android' ? 1.0 : 0.65);
 
       return {
         type,