@symbiote-native/navigation 2.0.3 → 2.2.0

package/src/angular/stack/index.ts

@@ -35,7 +35,7 @@
 // self-registers instead: `adapters/angular/babel-register-composed.cjs` (a Metro babel preset
 // applied bundle-wide, not scoped to adapters/angular) scans this package's own AOT-compiled
 // (`ngc`) `ɵɵngDeclareComponent({selector: 'Stack', ...})` output and auto-calls
-// `registerComposedComponent('Stack')` at bundle time - same mechanism `.examples/angular`
+// `registerComposedComponent('Stack')` at bundle time - same mechanism `examples/angular`
 // navigation-demo screens and `@symbiote-native/slider`'s `Slider` rely on for their own composed
 // components mounted statically or via `NgComponentOutlet`. Unregistered, `createElement('Stack')`
 // falls through to a real `createNode` call and RN paints its own "Unimplemented component"
@@ -73,6 +73,7 @@ import {
   createInitialNavigatorState,
   createNavigationEmitter,
   navigatorReducer,
+  reconcileStackRoutes,
   resolveHeaderInModalStackStyle,
   resolveScreenRenderPlan,
   resolveStackProps,
@@ -90,13 +91,18 @@ import type {
 import { NavigationScopeDirective } from '../navigation-scope.directive';
 import { SearchBarRefDirective } from '../search-bar-ref.directive';
 import { ScreenDirective } from '../screen.directive';
-import type { IAngularScreenOptions, IScreenOptionsArgs } from '../screen.directive';
+import type {
+  IAngularScreenOptions,
+  IScreenOptionsArgs,
+} from '../screen.directive';
 
 export type { INavigatorHandle } from '../../core';
 
 // backTitleVisible defaults to `true` on both platforms per the codegen spec's own default - no
 // ios/android divergence in v1 scope (mirrors react/stack.ts's own constant exactly).
-const NAVIGATOR_PLATFORM: INavigatorPlatform = { defaultHeaderBackTitleVisible: true };
+const NAVIGATOR_PLATFORM: INavigatorPlatform = {
+  defaultHeaderBackTitleVisible: true,
+};
 
 let stackInstanceCounter = 0;
 
@@ -161,7 +167,9 @@ let stackInstanceCounter = 0;
     </ng-template>
 
     <ng-template #headerAndContentTpl let-route let-index="index">
-      <RNSScreenStackHeaderConfig [symbioteHostProps]="headerConfigProps(route, index)">
+      <RNSScreenStackHeaderConfig
+        [symbioteHostProps]="headerConfigProps(route, index)"
+      >
         @if (hasSearchBar(route)) {
           <RNSScreenStackHeaderSubview [symbioteHostProps]="headerSubviewProps">
             <RNSSearchBar
@@ -171,7 +179,9 @@ let stackInstanceCounter = 0;
           </RNSScreenStackHeaderSubview>
         }
       </RNSScreenStackHeaderConfig>
-      <RNSScreenContentWrapper [symbioteHostProps]="contentWrapperProps(route, index)">
+      <RNSScreenContentWrapper
+        [symbioteHostProps]="contentWrapperProps(route, index)"
+      >
         <ng-container
           [symbioteNavigationScope]="route"
           [navigation]="this"
@@ -184,7 +194,8 @@ let stackInstanceCounter = 0;
   `,
 })
 export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
-  @ContentChildren(ScreenDirective) private readonly screenChildren!: QueryList<ScreenDirective>;
+  @ContentChildren(ScreenDirective)
+  private readonly screenChildren!: QueryList<ScreenDirective>;
 
   @Input() initialRouteName?: string;
   @Input() screenOptions?: IAngularScreenOptions;
@@ -214,7 +225,8 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
 
   readonly push = (name: string, params?: unknown): void =>
     this.dispatch({ type: 'push', route: this.createRoute(name, params) });
-  readonly pop = (count?: number): void => this.dispatch({ type: 'pop', count });
+  readonly pop = (count?: number): void =>
+    this.dispatch({ type: 'pop', count });
   readonly popToTop = (): void => this.dispatch({ type: 'popToTop' });
   readonly popTo = (key: string): void => this.dispatch({ type: 'popTo', key });
   readonly replace = (name: string, params?: unknown): void =>
@@ -223,14 +235,17 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
     this.dispatch({ type: 'setParams', key, params });
   readonly reset = (nextState: INavigatorState): void =>
     this.dispatch({ type: 'reset', state: nextState });
-  readonly canGoBack = (): boolean => (this.stateSignal()?.routes.length ?? 0) > 1;
+  readonly canGoBack = (): boolean =>
+    (this.stateSignal()?.routes.length ?? 0) > 1;
 
   ngAfterContentInit(): void {
     this.rebuildRegistry();
     this.initializeState();
-    this.screenChildrenSubscription = this.screenChildren.changes.subscribe(() => {
-      this.rebuildRegistry();
-    });
+    this.screenChildrenSubscription = this.screenChildren.changes.subscribe(
+      () => {
+        this.rebuildRegistry();
+      },
+    );
   }
 
   ngOnDestroy(): void {
@@ -242,34 +257,66 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
     for (const screen of this.screenChildren) {
       this.registry.set(screen.name, screen);
     }
+    this.reconcileWithRegistry();
+  }
+
+  // A `<ng-template symbioteScreen>` marker can leave the @ContentChildren query (a marker behind
+  // an `@if`, a data-driven screen list) while its route is still in the pushed history, which
+  // would leave that entry with nothing for componentFor() to mount (reconcileStackRoutes' header).
+  // The signal write lives HERE, in the query-change callback, and never in a computed/template
+  // accessor - reconciliation is a reaction to the registry changing, not a derivation of it.
+  private reconcileWithRegistry(): void {
+    const current = this.stateSignal();
+    if (current === undefined) return;
+    const next = reconcileStackRoutes(current, [...this.registry.keys()]);
+    if (next === current) return;
+    this.commitState(next);
   }
 
   private initializeState(): void {
     if (this.stateSignal() !== undefined) return;
-    const initialRouteName = this.initialRouteName ?? this.registry.keys().next().value;
+    const initialRouteName =
+      this.initialRouteName ?? this.registry.keys().next().value;
     if (initialRouteName === undefined) {
       dlog('Stack: no <ng-template symbioteScreen> children registered');
       this.stateSignal.set(
-        createInitialNavigatorState({ key: this.routeIdPrefix, name: '', params: undefined }),
+        createInitialNavigatorState({
+          key: this.routeIdPrefix,
+          name: '',
+          params: undefined,
+        }),
       );
       return;
     }
     this.stateSignal.set(
       createInitialNavigatorState(
-        this.createRoute(initialRouteName, this.registry.get(initialRouteName)?.initialParams),
+        this.createRoute(
+          initialRouteName,
+          this.registry.get(initialRouteName)?.initialParams,
+        ),
       ),
     );
   }
 
   private createRoute(name: string, params: unknown): IRoute<unknown> {
     this.routeSequence += 1;
-    return { key: `${this.routeIdPrefix}-${name}-${this.routeSequence}`, name, params };
+    return {
+      key: `${this.routeIdPrefix}-${name}-${this.routeSequence}`,
+      name,
+      params,
+    };
   }
 
   private dispatch(action: INavigatorAction): void {
     const current = this.stateSignal();
     if (current === undefined) return;
-    const next = navigatorReducer(current, action);
+    this.commitState(navigatorReducer(current, action));
+  }
+
+  // The one write path into stateSignal, shared by a dispatched action and a registry-driven
+  // reconciliation: both invalidate the plan cache, broadcast to every still-live route, and prune
+  // the emitters of routes that are gone.
+  private commitState(next: INavigatorState): void {
     this.planCache.clear();
     this.stateSignal.set(next);
     const liveRouteKeys = new Set(next.routes.map(route => route.key));
@@ -340,7 +387,8 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
       isAndroid: Platform.OS === 'android',
       screenPassthrough: {
         [SCREEN_ON_DISMISSED]: () => this.dispatch({ type: 'pop', count: 1 }),
-        [SCREEN_ON_HEADER_BACK_BUTTON_CLICKED]: () => this.dispatch({ type: 'pop', count: 1 }),
+        [SCREEN_ON_HEADER_BACK_BUTTON_CLICKED]: () =>
+          this.dispatch({ type: 'pop', count: 1 }),
         [SCREEN_ON_APPEAR]: () => {
           dlog(`Stack: route "${route.name}" appeared (focus)`);
           this.emitterFor(route.key).emit(NAVIGATION_EVENT_FOCUS);
@@ -359,14 +407,19 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
   }
 
   outerScreenIsModal(route: IRoute<unknown>, index: number): boolean {
-    return this.planFor(route, index).screenViewName === RNS_MODAL_SCREEN_VIEW_NAME;
+    return (
+      this.planFor(route, index).screenViewName === RNS_MODAL_SCREEN_VIEW_NAME
+    );
   }
 
   isInModal(route: IRoute<unknown>, index: number): boolean {
     return this.planFor(route, index).inModal;
   }
 
-  screenHostProps(route: IRoute<unknown>, index: number): Record<string, unknown> {
+  screenHostProps(
+    route: IRoute<unknown>,
+    index: number,
+  ): Record<string, unknown> {
     return this.planFor(route, index).screenProps;
   }
 
@@ -374,16 +427,25 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
     return { style: resolveHeaderInModalStackStyle() };
   }
 
-  innerScreenProps(route: IRoute<unknown>, index: number): Record<string, unknown> {
+  innerScreenProps(
+    route: IRoute<unknown>,
+    index: number,
+  ): Record<string, unknown> {
     const plan = this.planFor(route, index);
     return { style: plan.innerScreenStyle, activityState: plan.activityState };
   }
 
-  contentWrapperProps(route: IRoute<unknown>, index: number): Record<string, unknown> {
+  contentWrapperProps(
+    route: IRoute<unknown>,
+    index: number,
+  ): Record<string, unknown> {
     return this.planFor(route, index).contentWrapperProps;
   }
 
-  headerConfigProps(route: IRoute<unknown>, index: number): Record<string, unknown> {
+  headerConfigProps(
+    route: IRoute<unknown>,
+    index: number,
+  ): Record<string, unknown> {
     return this.planFor(route, index).headerConfig.props;
   }
 
@@ -391,11 +453,16 @@ export class Stack implements AfterContentInit, OnDestroy, INavigatorHandle {
     return this.mergedOptionsFor(route).headerSearchBarOptions !== undefined;
   }
 
-  searchBarRef(route: IRoute<unknown>): { current: ISearchBarCommands | null } | undefined {
+  searchBarRef(
+    route: IRoute<unknown>,
+  ): { current: ISearchBarCommands | null } | undefined {
     return this.mergedOptionsFor(route).headerSearchBarOptions?.ref;
   }
 
-  searchBarProps(route: IRoute<unknown>, index: number): Record<string, unknown> {
+  searchBarProps(
+    route: IRoute<unknown>,
+    index: number,
+  ): Record<string, unknown> {
     return this.planFor(route, index).searchBarProps ?? {};
   }
 }

package/src/angular/tab-screen.directive.ts

@@ -12,7 +12,9 @@ export type ITabScreenOptionsArgs = {
   navigation: ITabNavigatorHandle;
 };
 
-export type ITabScreenOptionsResolver = (props: ITabScreenOptionsArgs) => ITabOptions;
+export type ITabScreenOptionsResolver = (
+  props: ITabScreenOptionsArgs,
+) => ITabOptions;
 
 @Directive({
   selector: 'ng-template[symbioteTabScreen]',

package/src/angular/tabs/index.ts

@@ -39,6 +39,7 @@ import {
   createNavigationEmitter,
   diffFocusedRoute,
   isFocusedRoute,
+  reconcileTabRoutes,
   renderTabBar,
   tabRouterReducer,
 } from '../../core';
@@ -65,7 +66,12 @@ let tabInstanceCounter = 0;
 @Component({
   selector: 'Tab',
   standalone: true,
-  imports: [NgComponentOutlet, NavigationScopeDirective, DescriptorOutlet, View],
+  imports: [
+    NgComponentOutlet,
+    NavigationScopeDirective,
+    DescriptorOutlet,
+    View,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: `
     <View [style]="rootStyle">
@@ -100,7 +106,8 @@ export class Tab implements AfterContentInit, OnDestroy, ITabNavigatorHandle {
   // Keyed by name -> the LIVE TabScreenDirective instance - see stack.ts's matching comment for
   // why a snapshot copy would go stale on an in-place `[options]`/`[component]` change.
   private readonly registry = new Map<string, TabScreenDirective>();
-  private tabScreenChildrenSubscription: { unsubscribe: () => void } | undefined;
+  private tabScreenChildrenSubscription:
+    { unsubscribe: () => void } | undefined;
 
   private readonly stateSignal = signal<ITabRouterState | undefined>(undefined);
   readonly state = this.stateSignal.asReadonly();
@@ -114,11 +121,11 @@ export class Tab implements AfterContentInit, OnDestroy, ITabNavigatorHandle {
     this.dispatch({ type: 'setParams', key, params });
 
   ngAfterContentInit(): void {
-    this.rebuildRegistry();
-    this.initializeState();
-    this.tabScreenChildrenSubscription = this.tabScreenChildren.changes.subscribe(() => {
-      this.rebuildRegistry();
-    });
+    this.syncRegistry();
+    this.tabScreenChildrenSubscription =
+      this.tabScreenChildren.changes.subscribe(() => {
+        this.syncRegistry();
+      });
   }
 
   ngOnDestroy(): void {
@@ -141,10 +148,25 @@ export class Tab implements AfterContentInit, OnDestroy, ITabNavigatorHandle {
     }));
   }
 
-  private initializeState(): void {
-    if (this.stateSignal() !== undefined) return;
+  // A <ng-template symbioteTabScreen> can appear or disappear after mount (a marker behind an
+  // @if, a data-driven screen list), so the route list follows the LIVE query instead of staying
+  // frozen at whatever ngAfterContentInit first saw: reconcileTabRoutes (core) keeps each
+  // surviving route's key and accumulated params and moves focus only when the focused route is
+  // the one that left. Runs from the query's own `changes` subscription - an ordinary imperative
+  // callback, deliberately not a computed, since this writes the state signal.
+  private syncRegistry(): void {
+    this.rebuildRegistry();
     const routes = this.routesFromRegistry();
-    if (routes.length === 0) dlog('Tab: no <ng-template symbioteTabScreen> children registered');
+    if (routes.length === 0)
+      dlog('Tab: no <ng-template symbioteTabScreen> children registered');
+    const current = this.stateSignal();
+    if (current !== undefined) {
+      this.stateSignal.set(reconcileTabRoutes(current, routes));
+      return;
+    }
+    // Seeding an empty list would resolve initialRouteName against nothing and lose it once the
+    // markers do arrive, so the state stays unseeded until at least one has registered.
+    if (routes.length === 0) return;
     this.stateSignal.set(createInitialTabState(routes, this.initialRouteName));
   }
 
@@ -154,9 +176,15 @@ export class Tab implements AfterContentInit, OnDestroy, ITabNavigatorHandle {
     this.stateSignal.set(tabRouterReducer(current, action));
   }
 
-  private resolveTabOptions(entry: TabScreenDirective, route: IRoute<unknown>): ITabOptions {
+  private resolveTabOptions(
+    entry: TabScreenDirective,
+    route: IRoute<unknown>,
+  ): ITabOptions {
     const props: ITabScreenOptionsArgs = { route, navigation: this };
-    const own = typeof entry.options === 'function' ? entry.options(props) : entry.options;
+    const own =
+      typeof entry.options === 'function'
+        ? entry.options(props)
+        : entry.options;
     return { ...this.screenOptions, ...own };
   }
 
@@ -193,8 +221,12 @@ export class Tab implements AfterContentInit, OnDestroy, ITabNavigatorHandle {
   focusedRouteEmitter(): INavigationEmitter {
     const key = this.focusedRoute()?.key;
     return untracked(() => {
-      if (key === this.currentEmitterKey && this.currentEmitter) return this.currentEmitter;
-      const { blurKey, focusKey } = diffFocusedRoute(this.currentEmitterKey, key);
+      if (key === this.currentEmitterKey && this.currentEmitter)
+        return this.currentEmitter;
+      const { blurKey, focusKey } = diffFocusedRoute(
+        this.currentEmitterKey,
+        key,
+      );
       if (blurKey !== undefined && this.currentEmitter) {
         dlog('Tab: previous route blurred');
         this.currentEmitter.emit(NAVIGATION_EVENT_BLUR);
@@ -243,12 +275,18 @@ export class Tab implements AfterContentInit, OnDestroy, ITabNavigatorHandle {
     });
 
     const focusedRoute = this.focusedRoute();
-    const focusedEntry = focusedRoute ? this.registry.get(focusedRoute.name) : undefined;
+    const focusedEntry = focusedRoute
+      ? this.registry.get(focusedRoute.name)
+      : undefined;
     const focusedOptions =
       focusedEntry && focusedRoute
         ? this.resolveTabOptions(focusedEntry, focusedRoute)
         : this.screenOptions;
 
-    return renderTabBar({ items, style: focusedOptions?.tabBarStyle, passthrough: {} });
+    return renderTabBar({
+      items,
+      style: focusedOptions?.tabBarStyle,
+      passthrough: {},
+    });
   }
 }

package/src/core/constants.ts

@@ -11,12 +11,14 @@ export const RNS_SCREEN_VIEW_NAME = 'RNSScreen';
 // render-stack.ts for why a formSheet/modal screen MUST use this different Fabric name.
 export const RNS_MODAL_SCREEN_VIEW_NAME = 'RNSModalScreen';
 export const RNS_SCREEN_STACK_VIEW_NAME = 'RNSScreenStack';
-export const RNS_SCREEN_STACK_HEADER_CONFIG_VIEW_NAME = 'RNSScreenStackHeaderConfig';
+export const RNS_SCREEN_STACK_HEADER_CONFIG_VIEW_NAME =
+  'RNSScreenStackHeaderConfig';
 // The header-subview leaf react-native-screens itself uses to host arbitrary framework children
 // (left/right/back/title/center/searchBar) inside the header. Registered here for ground-truth
 // parity, but unconsumed by any fold in v1 scope: renderHeaderConfig's Descriptor never takes
 // framework children (see render-stack.ts), so mounting a subview child is left to the adapter.
-export const RNS_SCREEN_STACK_HEADER_SUBVIEW_VIEW_NAME = 'RNSScreenStackHeaderSubview';
+export const RNS_SCREEN_STACK_HEADER_SUBVIEW_VIEW_NAME =
+  'RNSScreenStackHeaderSubview';
 export const RNS_SEARCH_BAR_VIEW_NAME = 'RNSSearchBar';
 // react-native-screens' own JS layer (ScreenStackItem -> DebugContainer -> ScreenContentWrapper)
 // ALWAYS wraps a screen's content in this native view, `collapsable: false` so Fabric can never
@@ -43,7 +45,8 @@ export const STACK_ON_FINISH_TRANSITIONING = 'onFinishTransitioning';
 // plain bar-button-item press, and a press on a (possibly nested) menu action of a 'menu'-type
 // bar-button item.
 export const HEADER_ON_PRESS_BAR_BUTTON_ITEM = 'onPressHeaderBarButtonItem';
-export const HEADER_ON_PRESS_BAR_BUTTON_MENU_ITEM = 'onPressHeaderBarButtonMenuItem';
+export const HEADER_ON_PRESS_BAR_BUTTON_MENU_ITEM =
+  'onPressHeaderBarButtonMenuItem';
 
 // RNSSearchBar event prop keys (all DirectEventHandler in the codegen spec). onClose/onOpen are
 // Android-only per the codegen spec's own comment.

package/src/core/drawer-options/index.ts

@@ -7,7 +7,10 @@
 // PanResponder equivalent (see packages/navigation's README / the drawer feasibility note for the
 // full gap list).
 
-import type { IPanResponderGestureState, ISymbioteEvent } from '@symbiote-native/engine';
+import type {
+  IPanResponderGestureState,
+  ISymbioteEvent,
+} from '@symbiote-native/engine';
 import { isRecord } from '../guards';
 import type { IDrawerSlot } from '../render-drawer';
 
@@ -59,7 +62,9 @@ export function resolveDrawerType(options: IDrawerOptions): IDrawerType {
   return options.drawerType ?? DRAWER_DEFAULT_TYPE;
 }
 
-export function resolveDrawerPosition(options: IDrawerOptions): IDrawerPosition {
+export function resolveDrawerPosition(
+  options: IDrawerOptions,
+): IDrawerPosition {
   return options.drawerPosition ?? DRAWER_DEFAULT_POSITION;
 }
 
@@ -90,7 +95,9 @@ export function isDrawerOverlayVisible(options: IDrawerOptions): boolean {
 // slide: panel AND content move together by the same delta, overlay fades in (content still
 //   covers the panel partially as they slide in tandem, same as front visually at rest).
 // permanent: static, all zero (isDrawerAnimated() gates callers off this path already).
-export function resolveDrawerGeometry(options: IDrawerOptions): IDrawerGeometry {
+export function resolveDrawerGeometry(
+  options: IDrawerOptions,
+): IDrawerGeometry {
   const width = resolveDrawerWidth(options);
   const type = resolveDrawerType(options);
   const sign = resolveDrawerPosition(options) === 'left' ? 1 : -1;
@@ -188,25 +195,37 @@ export function resolveDrawerSlotInterpolation(
       return {
         translateX: {
           inputRange: DRAWER_PROGRESS_INPUT_RANGE,
-          outputRange: [geometry.contentTranslateXClosed, geometry.contentTranslateXOpen],
+          outputRange: [
+            geometry.contentTranslateXClosed,
+            geometry.contentTranslateXOpen,
+          ],
         },
       };
     case 'overlay':
       return {
         opacity: {
           inputRange: DRAWER_PROGRESS_INPUT_RANGE,
-          outputRange: [geometry.overlayOpacityClosed, geometry.overlayOpacityOpen],
+          outputRange: [
+            geometry.overlayOpacityClosed,
+            geometry.overlayOpacityOpen,
+          ],
         },
         translateX: {
           inputRange: DRAWER_PROGRESS_INPUT_RANGE,
-          outputRange: [geometry.contentTranslateXClosed, geometry.contentTranslateXOpen],
+          outputRange: [
+            geometry.contentTranslateXClosed,
+            geometry.contentTranslateXOpen,
+          ],
         },
       };
     case 'panel':
       return {
         translateX: {
           inputRange: DRAWER_PROGRESS_INPUT_RANGE,
-          outputRange: [geometry.panelTranslateXClosed, geometry.panelTranslateXOpen],
+          outputRange: [
+            geometry.panelTranslateXClosed,
+            geometry.panelTranslateXOpen,
+          ],
         },
       };
   }
@@ -235,7 +254,9 @@ export function isSwipeStartInEdge(
 // ScrollView's way).
 const MOVE_CLAIM_THRESHOLD = 5;
 
-export function isHorizontalDrag(gestureState: IPanResponderGestureState): boolean {
+export function isHorizontalDrag(
+  gestureState: IPanResponderGestureState,
+): boolean {
   return (
     Math.abs(gestureState.dx) > MOVE_CLAIM_THRESHOLD &&
     Math.abs(gestureState.dx) > Math.abs(gestureState.dy)
@@ -258,8 +279,10 @@ export function resolveSwipeIntent(
   // symmetrically for a right drawer's leftward drag).
   const signedDx = sign * gestureState.dx;
   const signedVx = sign * gestureState.vx;
-  const minDistance = options.swipeMinDistance ?? DRAWER_DEFAULT_SWIPE_MIN_DISTANCE;
-  const minVelocity = options.swipeMinVelocity ?? DRAWER_DEFAULT_SWIPE_MIN_VELOCITY;
+  const minDistance =
+    options.swipeMinDistance ?? DRAWER_DEFAULT_SWIPE_MIN_DISTANCE;
+  const minVelocity =
+    options.swipeMinVelocity ?? DRAWER_DEFAULT_SWIPE_MIN_VELOCITY;
 
   const pastDistance = Math.abs(signedDx) >= minDistance;
   const pastVelocity = Math.abs(signedVx) >= minVelocity;
@@ -276,7 +299,9 @@ export function clamp01(value: number): number {
 }
 
 function toFiniteNumber(value: unknown): number | undefined {
-  return typeof value === 'number' && Number.isFinite(value) ? value : undefined;
+  return typeof value === 'number' && Number.isFinite(value)
+    ? value
+    : undefined;
 }
 
 // The touch's real starting page-X, read off the raw event rather than gestureState.x0: the
@@ -293,7 +318,8 @@ export function startPageXOf(event: ISymbioteEvent): number | undefined {
   const direct = toFiniteNumber(nativeEvent.pageX);
   if (direct !== undefined) return direct;
   const touches = nativeEvent.touches;
-  if (Array.isArray(touches) && isRecord(touches[0])) return toFiniteNumber(touches[0].pageX);
+  if (Array.isArray(touches) && isRecord(touches[0]))
+    return toFiniteNumber(touches[0].pageX);
   return undefined;
 }
 
@@ -323,7 +349,8 @@ export function shouldClaimDrawerSwipe(
   options: IDrawerOptions,
   phase: 'start' | 'move',
 ): boolean {
-  if ((options.swipeEnabled ?? DRAWER_DEFAULT_SWIPE_ENABLED) === false) return false;
+  if ((options.swipeEnabled ?? DRAWER_DEFAULT_SWIPE_ENABLED) === false)
+    return false;
   if (!isDrawerAnimated(options)) return false;
   const startX = startPageXOf(event) ?? gestureState.x0;
   if (!isSwipeStartInEdge(startX, screenWidth, isOpen, options)) return false;

package/src/core/drawer-router-state/index.ts

@@ -34,7 +34,11 @@ export function createInitialDrawerRouterState(
     return { routes, index: INITIAL_FOCUSED_INDEX, isOpen: false };
   }
   const index = routes.findIndex(route => route.name === initialRouteName);
-  return { routes, index: index === -1 ? INITIAL_FOCUSED_INDEX : index, isOpen: false };
+  return {
+    routes,
+    index: index === -1 ? INITIAL_FOCUSED_INDEX : index,
+    isOpen: false,
+  };
 }
 
 // Mirrors @react-navigation/drawer's DrawerActions: jumpTo focuses a route by NAME (TabRouter's
@@ -49,7 +53,9 @@ export function drawerRouterReducer(
     case 'jumpTo': {
       const index = state.routes.findIndex(route => route.name === action.name);
       if (index === -1) return state;
-      return index === state.index && !state.isOpen ? state : { ...state, index, isOpen: false };
+      return index === state.index && !state.isOpen
+        ? state
+        : { ...state, index, isOpen: false };
     }
 
     case 'openDrawer':
@@ -66,6 +72,8 @@ export function drawerRouterReducer(
   }
 }
 
-export function focusedDrawerRoute(state: IDrawerRouterState): IRouteEntry | undefined {
+export function focusedDrawerRoute(
+  state: IDrawerRouterState,
+): IRouteEntry | undefined {
   return state.routes[state.index];
 }

package/src/core/guards.ts

@@ -19,5 +19,7 @@ export function isRecord(value: unknown): value is Record<string, unknown> {
 // navigator-state.ts (Stack) and tab-router-state.ts (Tabs) so the two reducers can't drift on
 // this rule independently.
 export function mergeParams(current: unknown, incoming: unknown): unknown {
-  return isRecord(current) && isRecord(incoming) ? { ...current, ...incoming } : incoming;
+  return isRecord(current) && isRecord(incoming)
+    ? { ...current, ...incoming }
+    : incoming;
 }