one 2.10.0 → 2.11.0

package/src/dom/peer.ts

@@ -0,0 +1,150 @@
+import {
+  DOM_PROTOCOL_VERSION,
+  parseMessage,
+  type DOMMessage,
+  type DOMResult,
+} from './protocol'
+import {
+  deserializeError,
+  DOMBridgeError,
+  serializeData,
+  serializeError,
+} from './serialize'
+import type { DOMValue } from './types'
+
+type Handler = (...args: DOMValue[]) => unknown
+type Pending = {
+  resolve: (value: DOMValue | void) => void
+  reject: (reason: Error) => void
+}
+
+/** one peer and one pending map belong to exactly one host document. */
+export class DOMPeer {
+  private pending = new Map<string, Pending>()
+  private lastReceived = 0
+  private sequence = 0
+  private live = true
+
+  constructor(
+    readonly epoch: string,
+    private side: 'native' | 'browser',
+    private send: (raw: string) => void,
+    private lookup: (name: string) => Handler | undefined,
+    private onMessage: (message: DOMMessage) => void,
+    private onFailure: (error: unknown) => void,
+    private development = false
+  ) {}
+
+  post(message: DOMMessage) {
+    if (!this.live) throw new DOMBridgeError('DOM document is disposed', 'DOM_DISPOSED')
+    if (message.epoch !== this.epoch) throw new DOMBridgeError('DOM epoch mismatch')
+    const raw = JSON.stringify(message)
+    parseMessage(raw)
+    this.send(raw)
+  }
+
+  call(name: string, args: unknown[]): Promise<DOMValue | void> {
+    return new Promise((resolve, reject) => {
+      if (!this.live) throw new DOMBridgeError('DOM document is disposed', 'DOM_DISPOSED')
+      const requestId = `${this.side}:${++this.sequence}`
+      const data = serializeData(args, 'arguments') as DOMValue[]
+      this.pending.set(requestId, { resolve, reject })
+      try {
+        this.post({
+          version: DOM_PROTOCOL_VERSION,
+          epoch: this.epoch,
+          type: 'call',
+          requestId,
+          name,
+          args: data,
+        })
+      } catch (error) {
+        this.pending.delete(requestId)
+        reject(error)
+      }
+    })
+  }
+
+  receive(raw: string) {
+    if (!this.live) return
+    try {
+      this.receiveMessage(raw)
+    } catch (error) {
+      this.dispose(
+        error instanceof Error ? error : new DOMBridgeError('DOM protocol failed')
+      )
+      throw error
+    }
+  }
+
+  private receiveMessage(raw: string) {
+    const message = parseMessage(raw)
+    if (message.epoch !== this.epoch) return
+    if (message.type === 'result') {
+      const pending = this.pending.get(message.requestId)
+      if (!pending) return
+      this.pending.delete(message.requestId)
+      const result = message.result
+      if (result.status === 'error') pending.reject(deserializeError(result.error))
+      else pending.resolve(result.status === 'value' ? result.value : undefined)
+    } else if (message.type === 'call') {
+      const otherSide = this.side === 'native' ? 'browser' : 'native'
+      const sequence = Number(message.requestId.slice(otherSide.length + 1))
+      if (
+        message.requestId !== `${otherSide}:${sequence}` ||
+        !Number.isSafeInteger(sequence) ||
+        sequence <= this.lastReceived
+      ) {
+        throw new DOMBridgeError('Invalid or duplicate DOM request')
+      }
+      this.lastReceived = sequence
+      void this.dispatch(message)
+    } else if (message.type === 'dispose') {
+      this.dispose()
+      this.onMessage(message)
+    } else {
+      this.onMessage(message)
+    }
+  }
+
+  private async dispatch(message: Extract<DOMMessage, { type: 'call' }>) {
+    let result: DOMResult
+    try {
+      const handler = this.lookup(message.name)
+      if (!handler)
+        throw new DOMBridgeError(
+          `DOM method ${message.name} is unavailable`,
+          'DOM_METHOD_UNAVAILABLE'
+        )
+      const value = await handler(...message.args)
+      result =
+        value === undefined
+          ? { status: 'void' }
+          : { status: 'value', value: serializeData(value, 'result') }
+    } catch (error) {
+      result = { status: 'error', error: serializeError(error, this.development) }
+    }
+    if (!this.live) return
+    try {
+      this.post({
+        version: DOM_PROTOCOL_VERSION,
+        epoch: this.epoch,
+        type: 'result',
+        requestId: message.requestId,
+        result,
+      })
+    } catch (error) {
+      this.dispose()
+      this.onFailure(error)
+    }
+  }
+
+  dispose(
+    reason: Error = new DOMBridgeError('DOM document was disposed', 'DOM_DISPOSED')
+  ) {
+    if (!this.live) return
+    this.live = false
+    for (const pending of this.pending.values()) pending.reject(reason)
+    this.pending.clear()
+  }
+}

package/src/dom/protocol.ts

@@ -0,0 +1,171 @@
+import { DOMBridgeError, serializeData, type DOMState } from './serialize'
+import type { DOMError, DOMValue } from './types'
+
+export const DOM_PROTOCOL_VERSION = 1 as const
+
+export type DOMBootstrap = DOMState & {
+  version: typeof DOM_PROTOCOL_VERSION
+  entryId: string
+  os: 'ios' | 'android'
+  epoch: string
+}
+
+type Envelope = { version: 1; epoch: string }
+export type DOMMessage = Envelope &
+  (
+    | { type: 'ready'; revision: number }
+    | ({ type: 'state' } & DOMState)
+    | { type: 'call'; requestId: string; name: string; args: DOMValue[] }
+    | { type: 'result'; requestId: string; result: DOMResult }
+    | { type: 'handle'; methods: string[] }
+    | { type: 'size'; width: number; height: number }
+    | { type: 'error'; error: DOMError }
+    | { type: 'dispose' }
+  )
+
+export type DOMResult =
+  | { status: 'value'; value: DOMValue }
+  | { status: 'void' }
+  | { status: 'error'; error: DOMError }
+
+function fail(message: string): never {
+  throw new DOMBridgeError(message)
+}
+
+function object(value: unknown): asserts value is Record<string, any> {
+  if (!value || typeof value !== 'object' || Array.isArray(value))
+    fail('Expected a protocol object')
+}
+
+function keys(value: Record<string, unknown>, allowed: string[]) {
+  for (const key of Object.keys(value)) {
+    if (!allowed.includes(key)) fail(`Unexpected protocol field ${key}`)
+  }
+}
+
+function string(value: unknown): asserts value is string {
+  if (typeof value !== 'string' || !value) fail('Expected a nonempty protocol string')
+}
+
+function revision(value: unknown): asserts value is number {
+  if (!Number.isSafeInteger(value) || (value as number) < 0)
+    fail('Invalid state revision')
+}
+
+function names(value: unknown): asserts value is string[] {
+  if (!Array.isArray(value)) fail('Expected a list of names')
+  value.forEach(string)
+  if (new Set(value).size !== value.length) fail('Duplicate protocol names')
+}
+
+function state(value: Record<string, any>) {
+  revision(value.revision)
+  object(value.props)
+  names(value.actions)
+  if (value.actions.some((name: string) => Object.hasOwn(value.props, name))) {
+    fail('A prop cannot also be an action')
+  }
+}
+
+function remoteError(value: unknown) {
+  object(value)
+  keys(value, ['name', 'message', 'code', 'stack'])
+  if (typeof value.name !== 'string' || typeof value.message !== 'string')
+    fail('Invalid remote error')
+  for (const key of ['code', 'stack']) {
+    if (Object.hasOwn(value, key) && typeof value[key] !== 'string')
+      fail('Invalid remote error')
+  }
+}
+
+export function parseBootstrap(value: unknown, entryId: string): DOMBootstrap {
+  const data: unknown = serializeData(value)
+  object(data)
+  keys(data, ['version', 'entryId', 'os', 'epoch', 'revision', 'props', 'actions'])
+  if (data.version !== DOM_PROTOCOL_VERSION) fail('Unsupported DOM protocol version')
+  if (data.entryId !== entryId) fail('DOM entry identity mismatch')
+  if (data.os !== 'ios' && data.os !== 'android') fail('Invalid DOM host platform')
+  string(data.epoch)
+  state(data)
+  return data as DOMBootstrap
+}
+
+/** the same parser guards both directions before any handler is dispatched. */
+export function parseMessage(raw: string): DOMMessage {
+  if (typeof raw !== 'string') fail('Expected a JSON protocol string')
+  let data: any
+  try {
+    data = JSON.parse(raw)
+  } catch {
+    fail('Malformed DOM protocol JSON')
+  }
+  object(data)
+  if (data.version !== DOM_PROTOCOL_VERSION) fail('Unsupported DOM protocol version')
+  string(data.epoch)
+  const common = ['version', 'epoch', 'type']
+  switch (data.type) {
+    case 'ready':
+      keys(data, [...common, 'revision'])
+      revision(data.revision)
+      break
+    case 'state':
+      keys(data, [...common, 'revision', 'props', 'actions'])
+      state(data)
+      serializeData(data.props)
+      break
+    case 'call':
+      keys(data, [...common, 'requestId', 'name', 'args'])
+      string(data.requestId)
+      string(data.name)
+      if (!Array.isArray(data.args)) fail('Expected call arguments')
+      serializeData(data.args, 'arguments')
+      break
+    case 'result': {
+      keys(data, [...common, 'requestId', 'result'])
+      string(data.requestId)
+      object(data.result)
+      const result = data.result
+      switch (result.status) {
+        case 'value':
+          keys(result, ['status', 'value'])
+          if (!Object.hasOwn(result, 'value')) fail('Missing result value')
+          serializeData(result.value, 'result')
+          break
+        case 'void':
+          keys(result, ['status'])
+          break
+        case 'error':
+          keys(result, ['status', 'error'])
+          remoteError(result.error)
+          break
+        default:
+          fail('Invalid result status')
+      }
+      break
+    }
+    case 'handle':
+      keys(data, [...common, 'methods'])
+      names(data.methods)
+      break
+    case 'size':
+      keys(data, [...common, 'width', 'height'])
+      if (
+        ![data.width, data.height].every(
+          (n) => typeof n === 'number' && Number.isFinite(n) && n >= 0
+        )
+      ) {
+        fail('Invalid DOM size')
+      }
+      break
+    case 'dispose':
+      keys(data, common)
+      break
+    case 'error':
+      keys(data, [...common, 'error'])
+      remoteError(data.error)
+      break
+    default:
+      fail('Unknown DOM message type')
+  }
+  return data as DOMMessage
+}

package/src/dom/serialize.ts

@@ -0,0 +1,126 @@
+import type { DOMError, DOMValue } from './types'
+
+export class DOMBridgeError extends Error {
+  constructor(
+    message: string,
+    public code = 'DOM_PROTOCOL_ERROR'
+  ) {
+    super(message)
+    this.name = 'DOMBridgeError'
+  }
+}
+
+function invalid(path: string, reason: string): never {
+  throw new DOMBridgeError(`${path}: ${reason}`, 'DOM_SERIALIZATION_ERROR')
+}
+
+/** validate before JSON.stringify can silently drop or coerce unsupported data. */
+export function serializeData(value: unknown, path = '$'): DOMValue {
+  const ancestors = new Set<object>()
+  function visit(item: unknown, at: string): DOMValue {
+    if (item === null || typeof item === 'string' || typeof item === 'boolean') {
+      return item
+    }
+    if (typeof item === 'number' && Number.isFinite(item)) return item
+    if (typeof item !== 'object' || item === null) {
+      return invalid(at, `unsupported ${typeof item} value`)
+    }
+    if (ancestors.has(item)) return invalid(at, 'cyclic value')
+    if (!Array.isArray(item)) {
+      const proto = Object.getPrototypeOf(item)
+      if (proto !== Object.prototype && proto !== null) {
+        return invalid(at, 'expected a plain object')
+      }
+    }
+    if (Object.getOwnPropertySymbols(item).length) {
+      return invalid(at, 'symbol properties are unsupported')
+    }
+    ancestors.add(item)
+    try {
+      if (Array.isArray(item)) {
+        return Array.from({ length: item.length }, (_, index) => {
+          const descriptor = Object.getOwnPropertyDescriptor(item, String(index))
+          if (!descriptor || !('value' in descriptor)) {
+            return invalid(`${at}[${index}]`, 'array holes and accessors are unsupported')
+          }
+          return visit(descriptor.value, `${at}[${index}]`)
+        })
+      }
+      const result: Record<string, DOMValue> = Object.create(null)
+      for (const key of Object.keys(item).sort()) {
+        const descriptor = Object.getOwnPropertyDescriptor(item, key)!
+        const nextPath = `${at}[${JSON.stringify(key)}]`
+        if (!('value' in descriptor)) return invalid(nextPath, 'accessor is unsupported')
+        if (descriptor.value !== undefined)
+          result[key] = visit(descriptor.value, nextPath)
+      }
+      return result
+    } finally {
+      ancestors.delete(item)
+    }
+  }
+  return visit(value, path)
+}
+
+export type DOMActions = Map<string, (...args: any[]) => unknown>
+export type DOMState = {
+  revision: number
+  props: Record<string, DOMValue>
+  actions: string[]
+}
+
+export function serializeProps(props: Record<string, unknown>): {
+  props: Record<string, DOMValue>
+  actions: DOMActions
+  key: string
+} {
+  const prototype = Object.getPrototypeOf(props)
+  if (
+    (prototype !== Object.prototype && prototype !== null) ||
+    Object.getOwnPropertySymbols(props).length
+  ) {
+    invalid('props', 'expected plain props with string property names')
+  }
+  const data: Record<string, DOMValue> = Object.create(null)
+  const actions: DOMActions = new Map()
+  for (const name of Object.keys(props).sort()) {
+    const descriptor = Object.getOwnPropertyDescriptor(props, name)!
+    if (!('value' in descriptor))
+      invalid(`props[${JSON.stringify(name)}]`, 'accessor is unsupported')
+    const value = descriptor.value
+    if (name === 'children' && value !== undefined) {
+      invalid('props.children', 'children cannot cross the DOM boundary')
+    }
+    if (typeof value === 'function') actions.set(name, value)
+    else if (value !== undefined)
+      data[name] = serializeData(value, `props[${JSON.stringify(name)}]`)
+  }
+  return { props: data, actions, key: JSON.stringify([data, [...actions.keys()]]) }
+}
+
+export function serializeError(error: unknown, development = false): DOMError {
+  let result: DOMError = { name: 'Error', message: 'An unsupported error was thrown' }
+  try {
+    if (error instanceof Error) {
+      result = { name: String(error.name || 'Error'), message: String(error.message) }
+      const code = (error as Error & { code?: unknown }).code
+      if (typeof code === 'string') result.code = code
+      if (development && typeof error.stack === 'string') result.stack = error.stack
+    } else if (
+      error === null ||
+      ['string', 'number', 'boolean', 'undefined', 'bigint'].includes(typeof error)
+    ) {
+      result.message = String(error)
+    }
+  } catch {
+    // hostile error getters must not prevent a request from settling.
+  }
+  return result
+}
+
+export function deserializeError(error: DOMError): Error {
+  const result = new DOMBridgeError(error.message, error.code || 'DOM_REMOTE_ERROR')
+  result.name = error.name
+  if (error.stack) result.stack = error.stack
+  return result
+}

package/src/dom/types.ts

@@ -0,0 +1,38 @@
+import type { StyleProp, ViewStyle } from 'react-native'
+
+export type DOMValue =
+  | null
+  | boolean
+  | number
+  | string
+  | DOMValue[]
+  | { [key: string]: DOMValue }
+
+export type DOMError = {
+  name: string
+  message: string
+  code?: string
+  stack?: string
+}
+
+export type DOMLoadEvent = { entryId: string; epoch: string }
+export type DOMErrorEvent = DOMError & { entryId: string; epoch?: string }
+
+/** container options consumed by the native host, never sent as component data. */
+export type DOMProps = {
+  style?: StyleProp<ViewStyle>
+  scrollEnabled?: boolean
+  matchContents?: boolean
+  onLoad?: (event: DOMLoadEvent) => void
+  onError?: (event: DOMErrorEvent) => void
+}
+
+/** methods exposed through useDOMImperativeHandle always return promises. */
+export type DOMImperativeHandle = {
+  [method: string]: (...args: any[]) => Promise<DOMValue | void>
+}
+
+export type DOMAction<
+  Args extends DOMValue[] = DOMValue[],
+  Result extends DOMValue | void = DOMValue | void,
+> = (...args: Args) => Promise<Result>

package/src/fork/getPathFromState.test.ts

@@ -144,3 +144,17 @@ it(`handles uninitialized state on nested navigation with route params`, () => {
 
   expect(getPathFromState(state, config)).toBe('/foo/bar/baz/page')
 })
+
+it('writes an array param as a repeated query key', () => {
+  const state = {
+    index: 0,
+    key: 'key',
+    routes: [{ name: 'index', path: '/', params: { tags: ['a', 'b c'], page: '2' } }],
+    stale: true,
+    type: 'stack',
+  }
+
+  expect(getPathFromState(state, { screens: { index: '' } })).toBe(
+    '/?tags=a&tags=b+c&page=2'
+  )
+})

package/src/fork/getPathFromState.ts

@@ -359,7 +359,16 @@ export function getPathDataFromState<ParamList extends {}>(
 
       // @modified - start
       // const query = queryString.stringify(focusedParams, { sort: false })
-      const query = new URLSearchParams(focusedParams).toString()
+      // an array is a repeated key, the inverse of how the query is parsed
+      const queryParams = new URLSearchParams()
+      for (const [key, value] of Object.entries(focusedParams)) {
+        if (Array.isArray(value)) {
+          for (const item of value) queryParams.append(key, String(item))
+        } else {
+          queryParams.append(key, String(value))
+        }
+      }
+      const query = queryParams.toString()
       // @modified - end
 
       if (query) {

package/src/hooks.tsx

@@ -9,7 +9,24 @@ import {
   normalizeRoutePathname,
 } from './router/path'
 import { RouteInfoContext } from './router/RouteInfoContext'
-import { navigationRef, useStoreRootState, useStoreRouteInfo } from './router/router'
+import {
+  navigationRef,
+  routeInfo as activeRouteInfo,
+  useStoreRootState,
+  useStoreRouteInfo,
+} from './router/router'
+import {
+  mergeSearchRecord,
+  parseSearchRecord,
+  searchRecordKey,
+  stringifySearchRecord,
+  toSearchRecord,
+  type SearchParamsOptions,
+  type SearchParamsUpdate,
+  type SearchParamsUpdateOptions,
+  type UseSearchParamsSchemaResult,
+} from './searchParams'
+import { isStandardSchema, type StandardSchemaV1 } from './standardSchema'
 import { getServerContext } from './vite/one-server-only'
 
 type SearchParams = OneRouter.SearchParams
@@ -249,15 +266,68 @@ class ReadOnlyURLSearchParams extends URLSearchParams {
  * searchParams.getAll('tag')    // ['a', 'b'] for ?tag=a&tag=b
  * ```
  */
-export function useSearchParams({ global = false } = {}): URLSearchParams {
+export function useSearchParams(options?: SearchParamsOptions): URLSearchParams
+/**
+ * Reads the query through a Standard Schema (Zod, Valibot, ArkType, any library that
+ * implements https://standardschema.dev) and returns the schema's output with a
+ * function that writes changes back to the URL.
+ *
+ * The schema receives every query key as a string, or an array of strings when the
+ * key repeats. It must validate synchronously. A failed validation throws
+ * `SearchValidationError` during render, which the nearest error boundary catches;
+ * give the schema defaults (`.catch`, `.default`) to read a bad URL as a good one.
+ * Define the schema outside the component so its output stays stable between renders.
+ *
+ * `update` merges into the current URL: path params, other query keys and the hash
+ * are kept, and a key set to `null` or `undefined` is removed. Values are written as
+ * strings, numbers, booleans or arrays of those, with a repeated key per array item.
+ * It adds a history entry unless `{ replace: true }`.
+ *
+ * @example
+ * ```tsx
+ * const tableParams = z.object({ page: z.coerce.number().catch(1) })
+ *
+ * function Table() {
+ *   const [{ page }, update] = useSearchParams(tableParams)
+ *   return <button onClick={() => update({ page: page + 1 })}>Page {page}</button>
+ * }
+ * ```
+ */
+export function useSearchParams<Schema extends StandardSchemaV1<unknown, object>>(
+  schema: Schema,
+  options?: SearchParamsOptions
+): UseSearchParamsSchemaResult<Schema>
+export function useSearchParams(
+  schemaOrOptions?: StandardSchemaV1 | SearchParamsOptions,
+  schemaOptions?: SearchParamsOptions
+): URLSearchParams | UseSearchParamsSchemaResult<StandardSchemaV1<unknown, object>> {
+  const schema = isStandardSchema(schemaOrOptions) ? schemaOrOptions : undefined
+  const { global = false } =
+    (schema ? schemaOptions : (schemaOrOptions as SearchParamsOptions | undefined)) ?? {}
+
+  const schemaRef = React.useRef(schema)
   const globalRef = React.useRef(global)
 
   if (process.env.NODE_ENV !== 'production') {
     if (global !== globalRef.current) {
       console.warn("useSearchParams: the 'global' option cannot change between renders")
     }
+    if (!schema !== !schemaRef.current) {
+      console.warn('useSearchParams: pass a schema on every render or on none')
+    }
   }
 
+  // the schema form is a separate hook, chosen once by whether a schema was passed
+  // biome-ignore lint/correctness/useHookAtTopLevel: schema presence is stable (validated above)
+  return schemaRef.current
+    ? useSearchParamsSchema(
+        (schema ?? schemaRef.current) as StandardSchemaV1<unknown, object>,
+        global
+      )
+    : useSearchParamsRaw(global)
+}
+
+function useSearchParamsRaw(global: boolean): URLSearchParams {
   // biome-ignore lint/correctness/useHookAtTopLevel: global option is stable (validated above)
   const params = global ? useActiveParams() : useParams()
 
@@ -271,3 +341,60 @@ export function useSearchParams({ global = false } = {}): URLSearchParams {
     return new ReadOnlyURLSearchParams(entries)
   }, [params])
 }
+
+function useSearchParamsSchema<Schema extends StandardSchemaV1<unknown, object>>(
+  schema: Schema,
+  global: boolean
+): UseSearchParamsSchemaResult<Schema> {
+  // global reads the active route even from an unfocused page, which has its own route info
+  const localInfo = useRouteInfo()
+  const storeInfo = useStoreRouteInfo()
+  const localParams = useParams()
+  const localPathname = usePathname()
+  const { unstable_globalHref: href, pathname: routePathname } = global
+    ? storeInfo
+    : localInfo
+  const params = global ? (storeInfo.params as Record<string, unknown>) : localParams
+  const pathname = global
+    ? getPathnameWithRecoveredDynamicSegment(storeInfo.pathname)
+    : localPathname
+
+  // path params ride in the same params object as the query: keep only what the href queries
+  const record = React.useMemo(() => toSearchRecord(params, href), [params, href])
+  const recordKey = searchRecordKey(record)
+
+  const output = React.useMemo(
+    () => parseSearchRecord(schema, record),
+    // the record is rebuilt whenever route params change; only its content matters
+    // biome-ignore lint/correctness/useExhaustiveDependencies: keyed by content
+    [schema, recordKey]
+  )
+
+  // two updates in one tick both build on the first: the URL has not caught up yet
+  const latest = React.useRef({ key: recordKey, record })
+  if (latest.current.key !== recordKey) {
+    latest.current = { key: recordKey, record }
+  }
+
+  const update = React.useCallback(
+    (change: SearchParamsUpdate<Schema>, options?: SearchParamsUpdateOptions) => {
+      const next = mergeSearchRecord(
+        latest.current.record,
+        change as Record<string, unknown>
+      )
+      latest.current = { key: latest.current.key, record: next }
+      const query = stringifySearchRecord(next)
+      // the hash belongs to the focused url: an unfocused screen writes its own route without it
+      const hash = isNative || activeRouteInfo?.pathname !== routePathname ? '' : window.location.hash
+      const href = `${pathname}${query ? `?${query}` : ''}${hash}`
+      if (options?.replace) {
+        router.replace(href as OneRouter.Href)
+      } else {
+        router.push(href as OneRouter.Href)
+      }
+    },
+    [pathname, routePathname]
+  )
+
+  return [output, update] as const
+}

package/src/index.ts

@@ -268,6 +268,16 @@ export {
   type ValidateRouteProps,
   type ValidationResult,
 } from './validateParams'
+// search param schema
+export { SearchValidationError } from './validateSearchParams'
+export type {
+  SearchParamsOptions,
+  SearchParamsUpdate,
+  SearchParamsUpdateOptions,
+  SearchValue,
+  UseSearchParamsSchemaResult,
+} from './searchParams'
+export type { StandardSchemaV1 } from './standardSchema'
 // validation state hook
 export { useValidationState, type ValidationState } from './router/router'
 // React Navigation