chore: cleanup some internals and enable StrictMode

canary1.1.434-1738836794800

apps/devtools/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devtools",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "scripts": {

apps/onestack.dev/data/docs/helpers-utility-functions.mdx

@@ -44,9 +44,9 @@ const postPageLink = href(`/post/hello-world`) // will type error if invalid Hre
 
 <Status is="developing" />
 
-For improving performance of client hydration on the web, you can pass data from the server to the client with `requestCache`, on native values will always be `undefined`. Data must be JSON-stringifyable and  on native.
+For improving performance of client hydration on the web, you can pass data from the server to the client. Data must be serializable to JSON.
 
-Here's an example of a simple `useFetch` to show how it's useful:
+Here's an example of a simple `useFetch`:
 
 ```tsx fileName=app/index.tsx
 import { setServerData, getServerData } from 'one'

apps/onestack.dev/package.json

@@ -1,6 +1,6 @@
 {
   "name": "site",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "sideEffects": false,
   "type": "module",

examples/bare/package.json

@@ -1,6 +1,6 @@
 {
   "name": "example-bare",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "main": "index.js",

examples/expo-blank/package.json

@@ -1,6 +1,6 @@
 {
   "name": "expo-blank-app",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "main": "expo/AppEntry.js",
   "scripts": {

examples/one-basic/package.json

@@ -1,6 +1,6 @@
 {
   "name": "example-basic",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "scripts": {

examples/one-recommended/package.json

@@ -1,6 +1,6 @@
 {
   "name": "example-recommended",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "scripts": {

examples/one-tailwind/package.json

@@ -1,6 +1,6 @@
 {
   "name": "example-tailwind",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "scripts": {

examples/one-tamagui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "example-tamagui",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "scripts": {

examples/one-zero/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one-zero",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "sideEffects": false,
   "files": [],

examples/testflight/package.json

@@ -1,6 +1,6 @@
 {
   "name": "example-testflight",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "private": true,
   "type": "module",
   "scripts": {

packages/better-auth/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vxrn/better-auth",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "sideEffects": false,
   "types": "./src/index.ts",
   "main": "dist/cjs",

packages/color-scheme/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vxrn/color-scheme",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "sideEffects": false,
   "exports": {
     "./package.json": "./package.json",

packages/compiler/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vxrn/compiler",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "type": "module",
   "exports": {
     "./package.json": "./package.json",

packages/create-vxrn/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-vxrn",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "bin": "run.js",
   "main": "dist/cjs",
   "module": "dist/esm",

packages/debug/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vxrn/debug",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "sideEffects": false,
   "source": "src/index.ts",
   "type": "module",

packages/emitter/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vxrn/emitter",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "sideEffects": false,
   "source": "src/index.ts",
   "types": "./src/index.ts",

packages/lllink/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lllink",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "type": "module",
   "module": "dist",
   "exports": {

packages/mdx/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vxrn/mdx",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "type": "commonjs",
   "exports": {
     "./package.json": "./package.json",

packages/one/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one",
-  "version": "1.1.434",
+  "version": "1.1.434-1738836794800",
   "license": "BSD-3-Clause",
   "sideEffects": [
     "setup.mjs",

packages/one/src/Root.tsx

@@ -7,7 +7,7 @@ import {
 import { useColorScheme } from '@vxrn/universal-color-scheme'
 import {
   createContext,
-  Suspense,
+  StrictMode,
   useContext,
   useEffect,
   useId,
@@ -63,7 +63,6 @@ globalThis['__vxrnGetContextFromReactContext'] = () => useContext(ServerAsyncLoc
 export function Root(props: RootProps) {
   const { path, routes, routeOptions, isClient, navigationContainerProps, onRenderId } = props
 
-  // ⚠️ <StrictMode> breaks routing!
   const context = useViteRoutes(routes, routeOptions, globalThis['__vxrnVersion'])
   const location =
     typeof window !== 'undefined' && window.location
@@ -87,49 +86,47 @@ export function Root(props: RootProps) {
 
   const value = globalThis['__vxrnrequestAsyncLocalStore']?.getStore() || null
 
-  console.log('wtf', value)
-
   const contents = (
-    // <StrictMode>
-    <ServerAsyncLocalIDContext.Provider value={value}>
-      <ServerRenderID.Provider value={id}>
-        <RootErrorBoundary>
-          {/* for some reason warning if no key here */}
-          <UpstreamNavigationContainer
-            ref={store.navigationRef}
-            initialState={store.initialState}
-            linking={store.linking}
-            onUnhandledAction={onUnhandledAction}
-            theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}
-            documentTitle={{
-              enabled: false,
-            }}
-            {...navigationContainerProps}
-          >
-            <ServerLocationContext.Provider value={location}>
-              {/* <GestureHandlerRootView> */}
-              {/*
-               * Due to static rendering we need to wrap these top level views in second wrapper
-               * View's like <GestureHandlerRootView /> generate a <div> so if the parent wrapper
-               * is a HTML document, we need to ensure its inside the <body>
-               */}
-              <>
-                {/* default scroll restoration to on, but users can configure it by importing and using themselves */}
-                <ScrollBehavior />
-
-                <Component />
-
-                {/* Users can override this by adding another StatusBar element anywhere higher in the component tree. */}
-              </>
-              {/* {!hasViewControllerBasedStatusBarAppearance && <StatusBar style="auto" />} */}
-              {/* </GestureHandlerRootView> */}
-            </ServerLocationContext.Provider>
-          </UpstreamNavigationContainer>
-          <PreloadLinks key="preload-links" />
-        </RootErrorBoundary>
-      </ServerRenderID.Provider>
-    </ServerAsyncLocalIDContext.Provider>
-    // </StrictMode>
+    <StrictMode>
+      <ServerAsyncLocalIDContext.Provider value={value}>
+        <ServerRenderID.Provider value={id}>
+          <RootErrorBoundary>
+            {/* for some reason warning if no key here */}
+            <UpstreamNavigationContainer
+              ref={store.navigationRef}
+              initialState={store.initialState}
+              linking={store.linking}
+              onUnhandledAction={onUnhandledAction}
+              theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}
+              documentTitle={{
+                enabled: false,
+              }}
+              {...navigationContainerProps}
+            >
+              <ServerLocationContext.Provider value={location}>
+                {/* <GestureHandlerRootView> */}
+                {/*
+                 * Due to static rendering we need to wrap these top level views in second wrapper
+                 * View's like <GestureHandlerRootView /> generate a <div> so if the parent wrapper
+                 * is a HTML document, we need to ensure its inside the <body>
+                 */}
+                <>
+                  {/* default scroll restoration to on, but users can configure it by importing and using themselves */}
+                  <ScrollBehavior />
+
+                  <Component />
+
+                  {/* Users can override this by adding another StatusBar element anywhere higher in the component tree. */}
+                </>
+                {/* {!hasViewControllerBasedStatusBarAppearance && <StatusBar style="auto" />} */}
+                {/* </GestureHandlerRootView> */}
+              </ServerLocationContext.Provider>
+            </UpstreamNavigationContainer>
+            <PreloadLinks key="preload-links" />
+          </RootErrorBoundary>
+        </ServerRenderID.Provider>
+      </ServerAsyncLocalIDContext.Provider>
+    </StrictMode>
   )
 
   if (isClient) {

packages/one/src/createApp.tsx

@@ -10,9 +10,8 @@ import type { RenderAppProps } from './types'
 import ReactDOMServer from 'react-dom/server.browser'
 import { getServerHeadInsertions } from './useServerHeadInsertion'
 import { ensureExists } from './utils/ensureExists'
-import { getServerContext, setServerContext } from './vite/one-server-only'
 import { SERVER_CONTEXT_POST_RENDER_STRING } from './vite/constants'
-import { useId } from 'react'
+import { getServerContext, setServerContext } from './vite/one-server-only'
 
 export type CreateAppProps = { routes: Record<string, () => Promise<unknown>> }
 
@@ -34,7 +33,6 @@ export function createApp(options: CreateAppProps) {
         let renderId: string | undefined
 
         const App = () => {
-          console.warn('rendering App()', useId())
           return (
             <Root
               onRenderId={(id) => {

packages/one/src/layouts/withLayoutContext.tsx

@@ -88,8 +88,6 @@ export function withLayoutContext<
         onlyMatching: true,
       })
 
-      console.warn('RENDERING WITH LAYOUT')
-
       // Prevent throwing an error when there are no screens.
       if (!sorted.length) {
         return null

packages/one/src/router/router.ts

@@ -6,28 +6,27 @@ import {
 } from '@react-navigation/native'
 import * as Linking from 'expo-linking'
 import { nanoid } from 'nanoid/non-secure'
-import { act, Fragment, startTransition, useSyncExternalStore, type ComponentType } from 'react'
+import { Fragment, startTransition, type ComponentType, useSyncExternalStore } from 'react'
 import { Platform } from 'react-native'
-import type { RouteNode } from './Route'
-import { getLoaderPath, getPreloadPath } from '../utils/cleanUrl'
 import type { State } from '../fork/getPathFromState'
 import { getPathDataFromState } from '../fork/getPathFromState'
 import { stripBaseUrl } from '../fork/getStateFromPath-mods'
-import { getLinkingConfig, type OneLinkingOptions } from './getLinkingConfig'
-import { getRoutes } from './getRoutes'
 import type { OneRouter } from '../interfaces/router'
 import { resolveHref } from '../link/href'
 import { resolve } from '../link/path'
-import { matchDynamicName } from './matchers'
-import { sortRoutes } from './sortRoutes'
-import { getQualifiedRouteComponent } from './useScreens'
 import { assertIsReady } from '../utils/assertIsReady'
+import { getLoaderPath, getPreloadPath } from '../utils/cleanUrl'
 import { dynamicImport } from '../utils/dynamicImport'
-import { removeSearch } from '../utils/removeSearch'
 import { shouldLinkExternally } from '../utils/url'
 import type { One } from '../vite/types'
+import { getLinkingConfig, type OneLinkingOptions } from './getLinkingConfig'
 import { getNormalizedStatePath, type UrlObject } from './getNormalizedStatePath'
+import { getRoutes } from './getRoutes'
 import { setLastAction } from './lastAction'
+import { matchDynamicName } from './matchers'
+import type { RouteNode } from './Route'
+import { sortRoutes } from './sortRoutes'
+import { getQualifiedRouteComponent } from './useScreens'
 
 // Module-scoped variables
 export let routeNode: RouteNode | null = null
@@ -144,16 +143,20 @@ function subscribeToNavigationChanges() {
     }
 
     if (shouldUpdateSubscribers) {
-      for (const subscriber of rootStateSubscribers) {
-        subscriber(state)
-      }
+      startTransition(() => {
+        for (const subscriber of rootStateSubscribers) {
+          subscriber(state)
+        }
+      })
     }
   })
 
-  updateSnapshot()
-  for (const subscriber of storeSubscribers) {
-    subscriber()
-  }
+  startTransition(() => {
+    updateSnapshot()
+    for (const subscriber of storeSubscribers) {
+      subscriber()
+    }
+  })
 }
 
 // Navigation functions
@@ -285,9 +288,11 @@ export function subscribeToLoadingState(subscriber: OneRouter.LoadingStateListen
 }
 
 export function setLoadingState(state: OneRouter.LoadingState) {
-  for (const listener of loadingStateSubscribers) {
-    listener(state)
-  }
+  startTransition(() => {
+    for (const listener of loadingStateSubscribers) {
+      listener(state)
+    }
+  })
 }
 
 // Snapshot function
@@ -505,7 +510,6 @@ export async function linkTo(href: string, event?: string, options?: OneRouter.L
   preloadRoute(href)
 
   const rootState = navigationRef.getRootState()
-  const action = getNavigateAction(state, rootState, event)
 
   const hash = href.indexOf('#')
   if (rootState.key && hash > 0) {
@@ -516,9 +520,10 @@ export async function linkTo(href: string, event?: string, options?: OneRouter.L
   nextOptions = options ?? null
 
   startTransition(() => {
+    const action = getNavigateAction(state, rootState, event)
     const current = navigationRef.getCurrentRoute()
-
     navigationRef.dispatch(action)
+
     let warningTm
     const interval = setInterval(() => {
       const next = navigationRef.getCurrentRoute()