@symbiote-native/navigation 2.1.0 → 3.0.0

package/README.md

@@ -3,7 +3,7 @@
 A native stack/tab/drawer navigator for [SymbioteNative](../../README.md), built directly on
 [`react-native-screens`](https://github.com/software-mansion/react-native-screens)' native view
 primitives (`RNSScreen`/`RNSScreenStack`/`RNSScreenStackHeaderConfig`/`RNSSearchBar`) — reachable
-from **every** adapter: React, Vue, and Angular. Unlike the third-party-view wrappers
+from **every** adapter: React, Vue, Svelte, Solid, and Angular. Unlike the third-party-view wrappers
 ([`@symbiote-native/slider`](../slider), [`@symbiote-native/splash-screen`](../splash-screen)),
 there is no upstream React component to route around here at all — `react-navigation`'s own
 navigator UI is itself React-only (it calls hooks off the React dispatcher), so wrapping it was
@@ -38,14 +38,16 @@ src/
 │                 react-native-screens' own React components)
 ├── react/        @symbiote-native/navigation/react   — Stack/Tab/Drawer + hooks
 ├── vue/          @symbiote-native/navigation/vue     — Stack/Tab/Drawer + composables
+├── svelte/       @symbiote-native/navigation/svelte  — Stack/Tab/Drawer + runes
+├── solid/        @symbiote-native/navigation/solid   — Stack/Tab/Drawer + primitives
 └── angular/      @symbiote-native/navigation/angular — Stack/Tab/Drawer + directives + inject*
 ```
 
 Each adapter entry imports `../register` first (so every native view's `ViewConfig` is registered
 before a screen ever mounts), then exposes `Stack`, `Tab`, and `Drawer`. The router/reducer logic
 and every `react-native-screens` prop fold are written once in `core/` and shared verbatim; each
-adapter supplies only its own lifecycle (hooks / composables / `inject*` functions) and the
-descriptor bridge.
+adapter supplies only its own lifecycle (hooks / composables / runes / primitives / `inject*`
+functions) and the descriptor bridge.
 
 ## Use it
 
@@ -65,8 +67,16 @@ function App() {
 
   return (
     <Stack ref={setStackHandle} initialRouteName="Menu">
-      <Stack.Screen name="Menu" component={MenuScreen} options={{ title: 'Navigation Demos' }} />
-      <Stack.Screen name="Details" component={DetailsScreen} options={{ title: 'Details' }} />
+      <Stack.Screen
+        name="Menu"
+        component={MenuScreen}
+        options={{ title: 'Navigation Demos' }}
+      />
+      <Stack.Screen
+        name="Details"
+        component={DetailsScreen}
+        options={{ title: 'Details' }}
+      />
     </Stack>
   );
 }
@@ -84,8 +94,16 @@ const stackHandle = ref<INavigatorHandle | null>(null);
 
 <template>
   <Stack ref="stackHandle" initial-route-name="Menu">
-    <Screen name="Menu" :component="MenuScreen" :options="{ title: 'Navigation Demos' }" />
-    <Screen name="Details" :component="DetailsScreen" :options="{ title: 'Details' }" />
+    <Screen
+      name="Menu"
+      :component="MenuScreen"
+      :options="{ title: 'Navigation Demos' }"
+    />
+    <Screen
+      name="Details"
+      :component="DetailsScreen"
+      :options="{ title: 'Details' }"
+    />
   </Stack>
 </template>
 ```
@@ -100,8 +118,18 @@ import { Stack, ScreenDirective } from '@symbiote-native/navigation/angular';
   imports: [Stack, ScreenDirective],
   template: `
     <Stack #nav initialRouteName="Menu">
-      <ng-template symbioteScreen name="Menu" [component]="menuScreen" [options]="menuOptions"></ng-template>
-      <ng-template symbioteScreen name="Details" [component]="detailsScreen" [options]="detailsOptions"></ng-template>
+      <ng-template
+        symbioteScreen
+        name="Menu"
+        [component]="menuScreen"
+        [options]="menuOptions"
+      ></ng-template>
+      <ng-template
+        symbioteScreen
+        name="Details"
+        [component]="detailsScreen"
+        [options]="detailsOptions"
+      ></ng-template>
     </Stack>
   `,
 })
@@ -114,9 +142,54 @@ export class AppComponent {
 }
 ```
 
+```svelte
+<!-- Svelte — examples/svelte/App.svelte -->
+<script lang="ts">
+  import { Screen, Stack } from '@symbiote-native/navigation/svelte';
+  import type { INavigatorHandle } from '@symbiote-native/navigation/svelte';
+
+  let stackInstance = $state.raw<INavigatorHandle | null>(null);
+</script>
+
+<Stack bind:this={stackInstance} initialRouteName="Menu">
+  <Screen name="Menu" component={MenuScreen} options={{ title: 'Navigation Demos' }} />
+  <Screen name="Details" component={DetailsScreen} options={{ title: 'Details' }} />
+</Stack>
+```
+
+```tsx
+// Solid — examples/solid/App.tsx
+import { createSignal } from 'solid-js';
+import { Stack } from '@symbiote-native/navigation/solid';
+import type { INavigatorHandle } from '@symbiote-native/navigation/solid';
+
+export default function App() {
+  const [stackHandle, setStackHandle] = createSignal<INavigatorHandle | null>(
+    null,
+  );
+
+  return (
+    <Stack ref={handle => setStackHandle(handle)} initialRouteName="Menu">
+      <Stack.Screen
+        name="Menu"
+        component={MenuScreen}
+        options={{ title: 'Navigation Demos' }}
+      />
+      <Stack.Screen
+        name="Details"
+        component={DetailsScreen}
+        options={{ title: 'Details' }}
+      />
+    </Stack>
+  );
+}
+```
+
 `Stack` itself implements `INavigatorHandle` in Angular — `@ViewChild` gives you the handle
-directly, no separate ref callback. In React/Vue, the ref only attaches during commit — code that
-needs the handle (e.g. `useLinkingIntegration` below) must gate on it being non-null first.
+directly, no separate ref callback. In React/Vue/Svelte/Solid, the ref only attaches during
+commit — code that needs the handle (e.g. `useLinkingIntegration` below) must gate on it being
+non-null first (Svelte's `bind:this` binds during mount, so `$effect`-gate on it; Solid's `ref`
+callback fires during creation, strictly before any effect runs).
 
 ### Tabs, Drawer, hooks, deep linking, and state persistence
 
@@ -125,8 +198,10 @@ swipeable drawer navigator (`Drawer`/`Drawer.Screen`, built on `PanResponder`/`A
 codebase doesn't depend on `react-native-gesture-handler`/`react-native-reanimated` — see
 [Known gaps](#known-gaps-drawer-parity) below), the full `useNavigation`/`useRoute`/
 `useIsFocused`/`useFocusEffect`/`useNavigationState` hook family (narrowed per navigator as
-`useStackNavigation`/`useTabNavigation`/`useDrawerNavigation`, with Vue composable and Angular
-`inject*` twins of all of them), header/search-bar screen options (bar buttons, menus,
+`useStackNavigation`/`useTabNavigation`/`useDrawerNavigation`, with Vue composable, Svelte rune,
+Solid primitive and Angular `inject*` twins of all of them — Solid spells the three that own state
+`createIsFocused`/`createFocusEffect`/`createNavigationState`, since it reserves `use*` for reading
+an existing context), header/search-bar screen options (bar buttons, menus,
 `formSheet`/modal presentation, `sheetAllowedDetents`), a `resolveRouteFromUrl`/
 `useLinkingIntegration` deep-linking layer, and `serializeNavigatorState`/
 `deserializeNavigatorState` for state persistence. See the docs-site navigation section
@@ -153,7 +228,7 @@ horizontal `ScrollView` hijacking the swipe), `useDrawerProgress` as a UI-thread
 ## Test it
 
 Headless tests live next to each adapter entry and the shared core
-(`src/{core,react,vue,angular}/**/*.test.{ts,tsx}`) and drive the same reducers/prop folds every
+(`src/{core,react,vue,svelte,solid,angular}/**/*.test.{ts,tsx}`) and drive the same reducers/prop folds every
 adapter shares, plus per-adapter component tests against a fake `nativeFabricUIManager` slot.
 Native rendering (the real `RNSScreenStack` push/pop transitions, header/search-bar chrome,
 `formSheet` detents) is verified on-device (see the parent [README](../../README.md) for the

package/build/angular/drawer/index.js

@@ -92,7 +92,10 @@ let Drawer = (() => {
         @for (slot of slotOrder(); track slot) {
           @switch (slot) {
             @case ('content') {
-              <AnimatedView [style]="contentStyle()" [animatedProps]="slotAnimatedProps('content')">
+              <AnimatedView
+                [style]="contentStyle()"
+                [animatedProps]="slotAnimatedProps('content')"
+              >
                 @if (focusedRoute(); as route) {
                   @if (componentForRoute(route); as component) {
                     <ng-container
@@ -113,7 +116,10 @@ let Drawer = (() => {
               />
             }
             @case ('panel') {
-              <AnimatedView [style]="panelStyle()" [animatedProps]="slotAnimatedProps('panel')">
+              <AnimatedView
+                [style]="panelStyle()"
+                [animatedProps]="slotAnimatedProps('panel')"
+              >
                 @if (drawerContentTemplate) {
                   <ng-container
                     *ngTemplateOutlet="
@@ -214,7 +220,8 @@ let Drawer = (() => {
         swipeEdgeWidth = (__runInitializers(this, _swipeEnabled_extraInitializers), __runInitializers(this, _swipeEdgeWidth_initializers, void 0));
         swipeMinDistance = (__runInitializers(this, _swipeEdgeWidth_extraInitializers), __runInitializers(this, _swipeMinDistance_initializers, void 0));
         swipeMinVelocity = (__runInitializers(this, _swipeMinDistance_extraInitializers), __runInitializers(this, _swipeMinVelocity_initializers, void 0));
-        windowDimensions = (__runInitializers(this, _swipeMinVelocity_extraInitializers), inject(WindowDimensionsService).dimensions);
+        windowDimensions = (__runInitializers(this, _swipeMinVelocity_extraInitializers), inject(WindowDimensionsService)
+            .dimensions);
         routeIdPrefix = `drawer-${(drawerInstanceCounter += 1)}`;
         // Keyed by name -> the LIVE DrawerScreenDirective instance - see stack.ts's matching comment
         // for why a snapshot copy would go stale on an in-place `[options]`/`[component]` change.
@@ -278,9 +285,10 @@ let Drawer = (() => {
         ngAfterContentInit() {
             this.rebuildRegistry();
             this.initializeState();
-            this.drawerScreenChildrenSubscription = this.drawerScreenChildren.changes.subscribe(() => {
-                this.rebuildRegistry();
-            });
+            this.drawerScreenChildrenSubscription =
+                this.drawerScreenChildren.changes.subscribe(() => {
+                    this.rebuildRegistry();
+                });
         }
         ngOnDestroy() {
             this.drawerScreenChildrenSubscription?.unsubscribe();
@@ -365,7 +373,9 @@ let Drawer = (() => {
             overlayColor: this.optionsSnapshot().overlayColor ?? DRAWER_DEFAULT_OVERLAY_COLOR,
             drawerStyle: this.drawerStyleSnapshot(),
             contentPassthrough: {},
-            overlayPassthrough: this.isAnimated() ? this.overlayResponderPassthrough() : {},
+            overlayPassthrough: this.isAnimated()
+                ? this.overlayResponderPassthrough()
+                : {},
             panelPassthrough: {},
         }, this.optionsSnapshot()));
         slotsMap = computed(() => {
@@ -400,7 +410,9 @@ let Drawer = (() => {
         }
         slotStyle(slot, animatedStyle) {
             const base = this.slotsMap().get(slot)?.props.style;
-            return this.isAnimated() ? flattenStyle([base, animatedStyle()]) : flattenStyle(base);
+            return this.isAnimated()
+                ? flattenStyle([base, animatedStyle()])
+                : flattenStyle(base);
         }
         contentStyle() {
             return this.slotStyle('content', () => {
@@ -502,7 +514,9 @@ let Drawer = (() => {
                     navigation: this,
                 };
             }
-            return { $implicit: { state: currentState, descriptors, navigation: this } };
+            return {
+                $implicit: { state: currentState, descriptors, navigation: this },
+            };
         }
     };
     return Drawer = _classThis;

package/build/angular/index.d.ts

@@ -3,7 +3,7 @@ export { Stack } from './stack';
 export type { INavigatorHandle } from './stack';
 export { ScreenDirective } from './screen.directive';
 export type { IAngularScreenOptions, IAngularSearchBarOptions, IScreenOptionsArgs, IScreenOptionsResolver, } from './screen.directive';
-export type { IScreenOptions, IStackAnimation, IStackPresentation } from '../core';
+export type { IScreenOptions, IStackAnimation, IStackPresentation, } from '../core';
 export { injectNavigation, injectStackNavigation, injectTabNavigation, injectDrawerNavigation, injectRoute, injectIsFocused, injectFocusEffect, injectNavigationState, } from './injectors';
 export type { INavigationHandle, IStackNavigationHandle, ITabNavigationHandle, IDrawerNavigationHandle, IFocusEffectCallback, } from './injectors';
 export { NavigationContextService } from './navigation-context.service';
@@ -14,10 +14,10 @@ export type { ILinkingConfig, IScreenLinkingConfig } from '../core';
 export { Tab } from './tabs';
 export type { ITabNavigatorHandle } from './tabs';
 export { TabScreenDirective } from './tab-screen.directive';
-export type { ITabScreenOptionsArgs, ITabScreenOptionsResolver } from './tab-screen.directive';
+export type { ITabScreenOptionsArgs, ITabScreenOptionsResolver, } from './tab-screen.directive';
 export type { ITabOptions, ITabBarIcon } from '../core';
 export { Drawer } from './drawer';
-export type { IDrawerNavigatorHandle, IDrawerDescriptorMap, IDrawerContentContext } from './drawer';
+export type { IDrawerNavigatorHandle, IDrawerDescriptorMap, IDrawerContentContext, } from './drawer';
 export { DrawerScreenDirective } from './drawer-screen.directive';
 export type { IDrawerScreenOptionsArgs, IDrawerScreenOptionsResolver, } from './drawer-screen.directive';
-export type { IDrawerOptions, IDrawerScreenOptions, IDrawerType, IDrawerPosition } from '../core';
+export type { IDrawerOptions, IDrawerScreenOptions, IDrawerType, IDrawerPosition, } from '../core';

package/build/angular/index.js

@@ -3,7 +3,7 @@
 // views' ViewConfigs (../register, a side-effect import of the three codegen specs - never
 // react-native-screens' own React components), then exposes Stack/Tab/Drawer with their Screen
 // directives and navigator handles. Mirrors react/index.ts's barrel shape.
-import '../register';
+import '../register.js';
 export { Stack } from './stack/index.js';
 export { ScreenDirective } from './screen.directive.js';
 export { injectNavigation, injectStackNavigation, injectTabNavigation, injectDrawerNavigation, injectRoute, injectIsFocused, injectFocusEffect, injectNavigationState, } from './injectors/index.js';

package/build/angular/injectors/inject-navigation.js

@@ -5,7 +5,7 @@
 // that route's own emitter - mirrors @react-navigation's `navigation.addListener('focus', cb)`
 // surface. All pub/sub logic lives in ../../core/navigation-events; this function only reads
 // NavigationContextService and binds identity.
-import { requireNavigationContext } from '../navigation-context.service.js';
+import { requireNavigationContext, } from '../navigation-context.service.js';
 export function injectNavigation() {
     const context = requireNavigationContext('injectNavigation');
     return {

package/build/angular/navigation-scope.directive.js

@@ -41,7 +41,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     return useValue ? value : void 0;
 };
 import { Directive, Input, inject } from '@angular/core';
-import { NavigationContextService } from './navigation-context.service.js';
+import { NavigationContextService, } from './navigation-context.service.js';
 let NavigationScopeDirective = (() => {
     let _classDecorators = [Directive({
             selector: '[symbioteNavigationScope]',

package/build/angular/search-bar-ref.directive.js

@@ -40,7 +40,7 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
-import { Directive, Input, inject, ElementRef } from '@angular/core';
+import { Directive, Input, inject, ElementRef, } from '@angular/core';
 import { isSymbioteNode, dlog, debugNodeId } from '@symbiote-native/engine';
 import { buildSearchBarHandle } from '../core/index.js';
 let SearchBarRefDirective = (() => {

package/build/angular/stack/index.js

@@ -87,7 +87,9 @@ import { SearchBarRefDirective } from '../search-bar-ref.directive.js';
 import { ScreenDirective } from '../screen.directive.js';
 // 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 = { defaultHeaderBackTitleVisible: true };
+const NAVIGATOR_PLATFORM = {
+    defaultHeaderBackTitleVisible: true,
+};
 let stackInstanceCounter = 0;
 let Stack = (() => {
     let _classDecorators = [Component({
@@ -151,7 +153,9 @@ let Stack = (() => {
     </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
@@ -161,7 +165,9 @@ let Stack = (() => {
           </RNSScreenStackHeaderSubview>
         }
       </RNSScreenStackHeaderConfig>
-      <RNSScreenContentWrapper [symbioteHostProps]="contentWrapperProps(route, index)">
+      <RNSScreenContentWrapper
+        [symbioteHostProps]="contentWrapperProps(route, index)"
+      >
         <ng-container
           [symbioteNavigationScope]="route"
           [navigation]="this"
@@ -268,14 +274,22 @@ let Stack = (() => {
             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 }));
+                this.stateSignal.set(createInitialNavigatorState({
+                    key: this.routeIdPrefix,
+                    name: '',
+                    params: undefined,
+                }));
                 return;
             }
             this.stateSignal.set(createInitialNavigatorState(this.createRoute(initialRouteName, this.registry.get(initialRouteName)?.initialParams)));
         }
         createRoute(name, params) {
             this.routeSequence += 1;
-            return { key: `${this.routeIdPrefix}-${name}-${this.routeSequence}`, name, params };
+            return {
+                key: `${this.routeIdPrefix}-${name}-${this.routeSequence}`,
+                name,
+                params,
+            };
         }
         dispatch(action) {
             const current = this.stateSignal();
@@ -370,7 +384,7 @@ let Stack = (() => {
             return plan;
         }
         outerScreenIsModal(route, index) {
-            return this.planFor(route, index).screenViewName === RNS_MODAL_SCREEN_VIEW_NAME;
+            return (this.planFor(route, index).screenViewName === RNS_MODAL_SCREEN_VIEW_NAME);
         }
         isInModal(route, index) {
             return this.planFor(route, index).inModal;

package/build/angular/tabs/index.js

@@ -63,7 +63,12 @@ let Tab = (() => {
     let _classDecorators = [Component({
             selector: 'Tab',
             standalone: true,
-            imports: [NgComponentOutlet, NavigationScopeDirective, DescriptorOutlet, View],
+            imports: [
+                NgComponentOutlet,
+                NavigationScopeDirective,
+                DescriptorOutlet,
+                View,
+            ],
             changeDetection: ChangeDetectionStrategy.OnPush,
             template: `
     <View [style]="rootStyle">
@@ -129,9 +134,10 @@ let Tab = (() => {
         setParams = (params, key) => this.dispatch({ type: 'setParams', key, params });
         ngAfterContentInit() {
             this.syncRegistry();
-            this.tabScreenChildrenSubscription = this.tabScreenChildren.changes.subscribe(() => {
-                this.syncRegistry();
-            });
+            this.tabScreenChildrenSubscription =
+                this.tabScreenChildren.changes.subscribe(() => {
+                    this.syncRegistry();
+                });
         }
         ngOnDestroy() {
             this.tabScreenChildrenSubscription?.unsubscribe();
@@ -181,7 +187,9 @@ let Tab = (() => {
         }
         resolveTabOptions(entry, route) {
             const props = { 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 };
         }
         focusedRoute() {
@@ -264,11 +272,17 @@ let Tab = (() => {
                 };
             });
             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: {},
+            });
         }
     };
     return Tab = _classThis;

package/build/core/drawer-options/index.js

@@ -85,25 +85,37 @@ export function resolveDrawerSlotInterpolation(geometry, slot) {
             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,
+                    ],
                 },
             };
     }
@@ -154,7 +166,9 @@ export function clamp01(value) {
     return Math.min(1, Math.max(0, value));
 }
 function toFiniteNumber(value) {
-    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
 // engine's capture phase (core/engine/src/pan-responder/index.ts's

package/build/core/drawer-router-state/index.js

@@ -11,7 +11,11 @@ export function createInitialDrawerRouterState(routes, initialRouteName) {
         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
 // own convention, not the stack's by-key popTo) AND closes the drawer - selecting a destination
@@ -23,7 +27,9 @@ export function drawerRouterReducer(state, action) {
             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':
             return state.isOpen ? state : { ...state, isOpen: true };

package/build/core/guards.js

@@ -18,5 +18,7 @@ export function isRecord(value) {
 // 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, incoming) {
-    return isRecord(current) && isRecord(incoming) ? { ...current, ...incoming } : incoming;
+    return isRecord(current) && isRecord(incoming)
+        ? { ...current, ...incoming }
+        : incoming;
 }

package/build/core/header-bar-buttons.js

@@ -21,7 +21,9 @@ function prepareIcon(icon) {
         case 'imageSource':
             return { imageSource: imageStatics.resolveAssetSource(icon.imageSource) };
         case 'templateSource':
-            return { templateSource: imageStatics.resolveAssetSource(icon.templateSource) };
+            return {
+                templateSource: imageStatics.resolveAssetSource(icon.templateSource),
+            };
     }
 }
 // The one id algorithm both the payload tagger (prepareMenuItems/prepareHeaderBarButtonItems)
@@ -38,7 +40,9 @@ function prepareTitleStyle(titleStyle) {
         return undefined;
     return {
         ...titleStyle,
-        color: titleStyle.color === undefined ? undefined : processColor(titleStyle.color),
+        color: titleStyle.color === undefined
+            ? undefined
+            : processColor(titleStyle.color),
     };
 }
 function prepareBadge(badge) {
@@ -49,7 +53,9 @@ function prepareBadge(badge) {
         style: badge.style
             ? {
                 ...badge.style,
-                color: badge.style.color === undefined ? undefined : processColor(badge.style.color),
+                color: badge.style.color === undefined
+                    ? undefined
+                    : processColor(badge.style.color),
                 backgroundColor: badge.style.backgroundColor === undefined
                     ? undefined
                     : processColor(badge.style.backgroundColor),
@@ -88,7 +94,11 @@ function prepareMenuItems(menuLike, index, side, path = '') {
             const currentPath = path ? `${path}.${menuIndex}` : `${menuIndex}`;
             const icon = prepareIcon(menuItem.icon);
             if (menuItem.type === 'submenu') {
-                return { ...menuItem, ...icon, ...prepareMenuItems(menuItem, index, side, currentPath) };
+                return {
+                    ...menuItem,
+                    ...icon,
+                    ...prepareMenuItems(menuItem, index, side, currentPath),
+                };
             }
             return {
                 ...excludeOnPress(menuItem),

package/build/core/index.d.ts

@@ -1,14 +1,14 @@
 export * from './constants';
 export { createInitialNavigatorState, navigatorReducer, computeActivityState, isTopRoute, } from './navigator-state';
-export type { IRoute, INavigatorState, INavigatorAction } from './navigator-state';
+export type { IRoute, INavigatorState, INavigatorAction, } from './navigator-state';
 export { reconcileStackRoutes } from './stack-router-state';
 export type { IStackAnimation, IStackPresentation, IHeaderBackButtonDisplayMode, IHeaderUserInterfaceStyle, IOptionalBooleanNativeProp, ISheetAllowedDetents, ISheetLargestUndimmedDetent, ISheetInitialDetent, IHeaderBarButtonIcon, IHeaderBarButtonItemBadge, IHeaderBarButtonItemAction, IHeaderBarButtonMenuAction, IHeaderBarButtonSubmenu, IHeaderBarButtonItemMenu, IHeaderBarButtonItemSpacing, IHeaderBarButtonItem, ISearchBarAutoCapitalize, ISearchBarPlacement, ISearchBarOptions, IScreenOrientation, IScreenOptions, INavigatorPlatform, IScreenViewProps, IHeaderConfigViewProps, IStackViewProps, ISearchBarViewProps, } from './navigator-props';
-export { resolveHeaderConfigView, resolveScreenView, resolveSearchBarView } from './screen-options';
+export { resolveHeaderConfigView, resolveScreenView, resolveSearchBarView, } from './screen-options';
 export { buildSearchBarHandle } from './search-bar-commands';
 export type { ISearchBarCommands } from './search-bar-commands';
 export { resolveScreenProps, resolveStackProps, renderHeaderConfig, resolveSearchBarProps, resolveScreenContentWrapperStyle, resolveScreenViewName, isHeaderInModal, resolveHeaderInModalStackStyle, resolveHeaderInModalScreenStyle, buildSearchBarPassthrough, resolveScreenRenderPlan, } from './render-stack';
 export type { IScreenRenderPlanInput, IScreenRenderPlan } from './render-stack';
-export { serializeNavigatorState, deserializeNavigatorState } from './state-persistence';
+export { serializeNavigatorState, deserializeNavigatorState, } from './state-persistence';
 export { createNavigationEmitter, diffFocusedRoute, NAVIGATION_EVENT_FOCUS, NAVIGATION_EVENT_BLUR, NAVIGATION_EVENT_STATE, NAVIGATION_EVENT_BEFORE_REMOVE, } from './navigation-events';
 export type { INavigationEmitter, INavigationEventListener, INavigationEventName, IFocusTransition, } from './navigation-events';
 export { isRecord } from './guards';
@@ -20,7 +20,7 @@ export type { ITabBarItemView, ITabBarViewProps } from './render-tabs';
 export { resolveRouteFromUrl, resolveUrlFromRoute } from './linking-config';
 export type { ILinkingConfig, IScreenLinkingConfig } from './linking-config';
 export { createInitialDrawerRouterState, drawerRouterReducer, focusedDrawerRoute, } from './drawer-router-state';
-export type { IDrawerRouterState, IDrawerRouterAction } from './drawer-router-state';
+export type { IDrawerRouterState, IDrawerRouterAction, } from './drawer-router-state';
 export type { IDrawerType, IDrawerPosition, IDrawerOptions, IDrawerScreenOptions, IDrawerGeometry, ISwipeIntent, } from './drawer-options';
 export { DRAWER_DEFAULT_TYPE, DRAWER_DEFAULT_POSITION, DRAWER_DEFAULT_WIDTH, DRAWER_DEFAULT_OVERLAY_COLOR, DRAWER_DEFAULT_SWIPE_ENABLED, DRAWER_DEFAULT_SWIPE_EDGE_WIDTH, DRAWER_DEFAULT_SWIPE_MIN_DISTANCE, DRAWER_DEFAULT_SWIPE_MIN_VELOCITY, resolveDrawerType, resolveDrawerPosition, resolveDrawerWidth, isDrawerAnimated, isDrawerOverlayVisible, resolveDrawerGeometry, isSwipeStartInEdge, isHorizontalDrag, resolveSwipeIntent, clamp01, startPageXOf, resolveDragProgress, shouldClaimDrawerSwipe, resolveDrawerSlotInterpolation, } from './drawer-options';
 export type { IDrawerInterpolationRange, IDrawerContentSlotInterpolation, IDrawerOverlaySlotInterpolation, IDrawerPanelSlotInterpolation, } from './drawer-options';

package/build/core/index.js

@@ -11,10 +11,10 @@ export { createInitialNavigatorState, navigatorReducer, computeActivityState, is
 // stack-router-state.ts's header for why the Stack's history needs this and the Tab's projection
 // does not.
 export { reconcileStackRoutes } from './stack-router-state/index.js';
-export { resolveHeaderConfigView, resolveScreenView, resolveSearchBarView } from './screen-options.js';
+export { resolveHeaderConfigView, resolveScreenView, resolveSearchBarView, } from './screen-options.js';
 export { buildSearchBarHandle } from './search-bar-commands.js';
 export { resolveScreenProps, resolveStackProps, renderHeaderConfig, resolveSearchBarProps, resolveScreenContentWrapperStyle, resolveScreenViewName, isHeaderInModal, resolveHeaderInModalStackStyle, resolveHeaderInModalScreenStyle, buildSearchBarPassthrough, resolveScreenRenderPlan, } from './render-stack.js';
-export { serializeNavigatorState, deserializeNavigatorState } from './state-persistence/index.js';
+export { serializeNavigatorState, deserializeNavigatorState, } from './state-persistence/index.js';
 export { createNavigationEmitter, diffFocusedRoute, NAVIGATION_EVENT_FOCUS, NAVIGATION_EVENT_BLUR, NAVIGATION_EVENT_STATE, NAVIGATION_EVENT_BEFORE_REMOVE, } from './navigation-events/index.js';
 // Runtime guards shared across core (and re-exported for adapters narrowing their own untyped
 // inputs - vnode props, gesture/event data, persisted JSON) - see guards.ts's header for which