one 1.21.13 → 1.23.0

package/src/router/renderingRegistry.ts

@@ -1,109 +0,0 @@
-import type { ComponentType } from 'react'
-
-import type { StackRender, StackRenderProps } from './web/ScreenRenderContext'
-
-/**
- * Tab bar render component receives bottom-tabs' standard tabBar props plus
- * the children prop is omitted (tab bar replaces only the bar UI, not the
- * screens). The actual prop type from `@react-navigation/bottom-tabs` is
- * `BottomTabBarProps`; we re-export a structural-compatible type so the
- * registry can be typed without a hard dep on bottom-tabs.
- */
-export type TabsRenderProps = {
-  state: any
-  navigation: any
-  descriptors: any
-  insets: { top: number; right: number; bottom: number; left: number }
-}
-
-export type TabsRenderComponent = ComponentType<TabsRenderProps>
-
-export type TabsRender = {
-  web?: TabsRenderComponent
-  ios?: TabsRenderComponent
-  android?: TabsRenderComponent
-}
-
-/**
- * Drawer sidebar render component. Receives the standard
- * `DrawerContentComponentProps` from `@react-navigation/drawer`. Replaces
- * the drawer's sidebar content (the list of items / nav UI) but not the
- * drawer chrome itself (overlay, gestures, animation).
- */
-export type DrawerRenderProps = {
-  state: any
-  navigation: any
-  descriptors: any
-}
-
-export type DrawerRenderComponent = ComponentType<DrawerRenderProps>
-
-export type DrawerRender = {
-  web?: DrawerRenderComponent
-  ios?: DrawerRenderComponent
-  android?: DrawerRenderComponent
-}
-
-/**
- * Global render configuration. Populated by `setupRendering()`, typically
- * called from One's setup file. Each navigator (Stack, Tabs) reads from
- * this registry as a fallback when no per-instance `render` prop is set.
- *
- * Per-instance render prop > per-route options.render > setupRendering global.
- */
-export type RenderingConfig = {
-  Stack?: StackRender
-  Tabs?: TabsRender
-  Drawer?: DrawerRender
-}
-
-let renderingConfig: RenderingConfig = {}
-
-/**
- * Register default render components for One's navigators. Call from your
- * setup file before the app renders. Settings are global - every `<Stack>`
- * and `<Tabs>` instance picks them up unless overridden via prop or
- * per-route options.
- *
- * @example
- * ```ts
- * // app/setup.ts
- * import { setupRendering } from 'one'
- * import { Sheet } from 'tamagui'
- *
- * setupRendering({
- *   Stack: {
- *     web: ({ children, open, dismiss, sheetAllowedDetents }) => (
- *       <Sheet modal open={open} onOpenChange={(o) => !o && dismiss()}
- *              snapPoints={sheetAllowedDetents}>
- *         <Sheet.Overlay />
- *         <Sheet.Frame>{children}</Sheet.Frame>
- *       </Sheet>
- *     ),
- *   },
- *   Tabs: { web: MyCustomTabBar },
- * })
- * ```
- */
-export function setupRendering(config: RenderingConfig): void {
-  renderingConfig = {
-    ...renderingConfig,
-    Stack: { ...renderingConfig.Stack, ...config.Stack },
-    Tabs: { ...renderingConfig.Tabs, ...config.Tabs },
-    Drawer: { ...renderingConfig.Drawer, ...config.Drawer },
-  }
-}
-
-export function getRenderingConfig(): RenderingConfig {
-  return renderingConfig
-}
-
-/**
- * For tests - clears the global registry.
- * @internal
- */
-export function resetRenderingConfig(): void {
-  renderingConfig = {}
-}
-
-export type { StackRender, StackRenderProps }

package/src/router/web/ScreenRenderContext.tsx

@@ -1,61 +0,0 @@
-'use client'
-
-import { createContext, useContext, type ComponentType, type ReactNode } from 'react'
-import type { NativeStackNavigationOptions } from '@react-navigation/native-stack'
-
-/**
- * Props passed to a user-supplied screen-render component. Mirrors the
- * native-stack option shape so the same render works for any overlay
- * presentation (modal, formSheet, pageSheet, ...).
- *
- * `open` is driven by the router. The render component decides how to
- * animate based on transitions of `open`, and calls `dismiss()` after its
- * close animation completes (this triggers the actual `StackActions.pop`).
- */
-export type StackRenderProps = {
-  routeKey: string
-  routeName: string
-  presentation: NonNullable<NativeStackNavigationOptions['presentation']>
-
-  /**
-   * Whether this overlay should currently be visible. For non-keepMounted
-   * routes, this is always `true` while the render is invoked. For
-   * keepMounted routes, this toggles as the user navigates away from /
-   * back to this route - the React subtree stays mounted in both states.
-   */
-  open: boolean
-
-  dismiss: () => void
-  dismissible: boolean
-
-  // sheet detent IR (pass-through from native-stack options)
-  sheetAllowedDetents?: number[] | 'fitToContents'
-  sheetGrabberVisible?: boolean
-  sheetCornerRadius?: number
-  sheetInitialDetentIndex?: number | 'last'
-  sheetLargestUndimmedDetentIndex?: number | 'none' | 'last'
-  sheetExpandsWhenScrolledToEdge?: boolean
-
-  children: ReactNode
-}
-
-export type StackRenderComponent = ComponentType<StackRenderProps>
-
-/**
- * Platform-keyed render map. v1 consumes `web` only; `ios`/`android` are
- * reserved for future use (a route overrides react-native-screens' native
- * sheet with a custom impl).
- */
-export type StackRender = {
-  web?: StackRenderComponent
-  ios?: StackRenderComponent
-  android?: StackRenderComponent
-}
-
-const StackRenderContext = createContext<StackRender | undefined>(undefined)
-
-export const StackRenderProvider = StackRenderContext.Provider
-
-export function useStackRender(): StackRender | undefined {
-  return useContext(StackRenderContext)
-}

package/src/router/web/__tests__/WebStackView.runtime.test.tsx

@@ -1,309 +0,0 @@
-import { describe, expect, it, vi } from 'vitest'
-import React, { createElement, useId, useState, type ReactNode } from 'react'
-import TestRenderer, { act } from 'react-test-renderer'
-
-import { WebStackView } from '../WebStackView'
-import { StackRenderProvider, type StackRender } from '../ScreenRenderContext'
-
-function makeRoute(name: string) {
-  return { key: `${name}-key`, name, params: undefined }
-}
-
-function makeState(names: string[], index: number) {
-  return {
-    key: 'stack-1',
-    index,
-    routeNames: names,
-    routes: names.map(makeRoute),
-    type: 'stack',
-    stale: false,
-    preloadedRoutes: [],
-  } as any
-}
-
-type DescOpts = {
-  options: any
-  content: ReactNode
-}
-
-function makeDescriptors(perRoute: Record<string, DescOpts>) {
-  const out: Record<string, any> = {}
-  for (const name of Object.keys(perRoute)) {
-    out[`${name}-key`] = {
-      options: perRoute[name]!.options,
-      render: () => perRoute[name]!.content,
-      navigation: {},
-    }
-  }
-  return out
-}
-
-// Default render used in regular (non-keepMounted) tests: unmounts content
-// when closed.
-const PassThroughRender = ({ children, open }: any) =>
-  open ? createElement('div', { 'data-open': 'true' }, children) : null
-
-// Render that keeps children mounted when closed - required for keepMounted
-// to actually preserve component state. Mirrors how Tamagui Sheet / Vaul
-// behave when `modal` is true and `open` toggles.
-const KeepMountedRender = ({ children, open }: any) =>
-  createElement(
-    'div',
-    {
-      'data-open': String(open),
-      style: { display: open ? 'block' : 'none' },
-    },
-    children
-  )
-
-// A probe component that exposes its id via a callback so we can assert
-// identity stability across re-renders.
-function IdProbe({ onId }: { onId: (id: string) => void }) {
-  const id = useId()
-  React.useEffect(() => {
-    onId(id)
-  }, [id, onId])
-  return createElement('span', { 'data-id': id })
-}
-
-// A probe that tracks how often it mounts (effect runs with []).
-function MountProbe({ onMount }: { onMount: () => void }) {
-  React.useEffect(() => {
-    onMount()
-  }, [onMount])
-  return null
-}
-
-// A probe with internal state we can manipulate via a captured setter.
-function StatefulProbe({
-  initial,
-  onMount,
-}: {
-  initial: number
-  onMount: (setter: (v: number) => void) => void
-}) {
-  const [value, setValue] = useState(initial)
-  React.useEffect(() => {
-    onMount(setValue)
-  }, [onMount])
-  return createElement('span', { 'data-value': String(value) })
-}
-
-describe('useId stability', () => {
-  it('returns the same id across parent re-renders for the same mount', () => {
-    const captured: string[] = []
-    const onId = (id: string) => captured.push(id)
-
-    const state = makeState(['home', 'sheet'], 1)
-    const descriptors = makeDescriptors({
-      home: { options: { presentation: 'card' }, content: null },
-      sheet: {
-        options: { presentation: 'formSheet' },
-        content: createElement(IdProbe, { onId }),
-      },
-    })
-    const navigation = { dispatch: vi.fn() } as any
-
-    let testRoot: TestRenderer.ReactTestRenderer
-    act(() => {
-      testRoot = TestRenderer.create(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-
-    const firstId = captured.at(-1)!
-    expect(firstId).toBeTruthy()
-
-    // Force the parent to re-render with the same state. The route's
-    // useId must return the same value.
-    act(() => {
-      testRoot!.update(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-
-    const secondId = captured.at(-1)!
-    expect(secondId).toBe(firstId)
-  })
-})
-
-describe('regular overlay (no keepMounted) lifecycle', () => {
-  it('mounts once on open, unmounts on pop', () => {
-    const mounts: number[] = []
-    const onMount = () => mounts.push(Date.now())
-
-    const stateOpen = makeState(['home', 'sheet'], 1)
-    const stateClosed = makeState(['home'], 0)
-    const descriptors = makeDescriptors({
-      home: { options: { presentation: 'card' }, content: null },
-      sheet: {
-        options: { presentation: 'formSheet' },
-        content: createElement(MountProbe, { onMount }),
-      },
-    })
-    const navigation = { dispatch: vi.fn() } as any
-
-    let testRoot: TestRenderer.ReactTestRenderer
-    act(() => {
-      testRoot = TestRenderer.create(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state: stateOpen,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-    expect(mounts).toHaveLength(1)
-
-    // Re-render with sheet popped. Mount probe should NOT mount again on
-    // re-renders, but it WILL unmount because the route is gone.
-    act(() => {
-      testRoot!.update(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state: stateClosed,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-    expect(mounts).toHaveLength(1)
-
-    // Re-open the sheet (new route key would normally be assigned but for
-    // this test we reuse). Mount probe re-mounts because the previous
-    // mount unmounted.
-    act(() => {
-      testRoot!.update(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state: stateOpen,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-    expect(mounts).toHaveLength(2)
-  })
-})
-
-describe('keepMounted overlay lifecycle', () => {
-  it('survives dismissal: state persists when route is popped and re-opened', () => {
-    const mounts: number[] = []
-    let setValue: ((v: number) => void) | undefined
-
-    const stateOpen = makeState(['home', 'settings'], 1)
-    const stateClosed = makeState(['home'], 0)
-
-    // Stable content reference - re-creating it would break the persistent
-    // slot's element identity. In real navigation, descriptor.render() is
-    // called only once when the route is first captured; here we mimic
-    // that by computing it once.
-    const stableContent = createElement(StatefulProbe, {
-      initial: 7,
-      onMount: (setter) => {
-        mounts.push(Date.now())
-        setValue = setter
-      },
-    })
-
-    const descriptors = makeDescriptors({
-      home: { options: { presentation: 'card' }, content: null },
-      settings: {
-        options: { presentation: 'formSheet', keepMounted: true },
-        content: stableContent,
-      },
-    })
-    const navigation = { dispatch: vi.fn() } as any
-
-    let testRoot: TestRenderer.ReactTestRenderer
-    act(() => {
-      testRoot = TestRenderer.create(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state: stateOpen,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-    expect(mounts).toHaveLength(1)
-    expect(typeof setValue).toBe('function')
-
-    // Mutate the state of the mounted component.
-    act(() => {
-      setValue!(42)
-    })
-
-    // Re-render with the route popped from navigation state. Persistent
-    // slot keeps rendering the captured element with open=false.
-    act(() => {
-      testRoot!.update(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state: stateClosed,
-            navigation,
-            // descriptor for 'settings' no longer present in state.routes -
-            // we keep the same map so the captured slot still works.
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-    // Mount probe should NOT remount; only one mount across the lifecycle.
-    expect(mounts).toHaveLength(1)
-
-    // Re-open: persistent slot's open transitions to true. Component
-    // instance must be the same - value should still be 42 not 7.
-    act(() => {
-      testRoot!.update(
-        createElement(
-          StackRenderProvider,
-          { value: { web: KeepMountedRender } as StackRender },
-          createElement(WebStackView, {
-            state: stateOpen,
-            navigation,
-            descriptors: descriptors as any,
-          })
-        )
-      )
-    })
-    expect(mounts).toHaveLength(1)
-
-    // Inspect the rendered output for the persisted value.
-    const tree = testRoot!.toJSON() as any
-    const json = JSON.stringify(tree)
-    expect(json).toContain('"data-value":"42"')
-    expect(json).not.toContain('"data-value":"7"')
-  })
-})