@tanstack/router-core 0.0.1-beta.13 → 0.0.1-beta.145

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/router-core",
   "author": "Tanner Linsley",
-  "version": "0.0.1-beta.13",
+  "version": "0.0.1-beta.145",
   "license": "MIT",
   "repository": "tanstack/router",
   "homepage": "https://tanstack.com/router",
@@ -23,7 +23,7 @@
     "url": "https://github.com/sponsors/tannerlinsley"
   },
   "module": "build/esm/index.js",
-  "main": "build/cjs/packages/router-core/src/index.js",
+  "main": "build/cjs/index.js",
   "browser": "build/umd/index.production.js",
   "types": "build/types/index.d.ts",
   "engines": {
@@ -40,10 +40,14 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.16.7",
-    "history": "^5.2.0",
-    "tiny-invariant": "^1.3.1"
+    "tiny-invariant": "^1.3.1",
+    "tiny-warning": "^1.0.3",
+    "@gisatcz/cross-package-react-context": "^0.2.0",
+    "@tanstack/react-store": "0.0.1-beta.134"
   },
-  "devDependencies": {
-    "babel-plugin-transform-async-to-promises": "^0.8.18"
+  "scripts": {
+    "build": "rollup --config rollup.config.js",
+    "test": "vitest",
+    "test:dev": "vitest --watch"
   }
-}
+}

package/src/history.ts

@@ -0,0 +1,292 @@
+// While the public API was clearly inspired by the "history" npm package,
+// This implementation attempts to be more lightweight by
+// making assumptions about the way TanStack Router works
+
+export interface RouterHistory {
+  location: RouterLocation
+  listen: (cb: () => void) => () => void
+  push: (path: string, state?: any) => void
+  replace: (path: string, state?: any) => void
+  go: (index: number) => void
+  back: () => void
+  forward: () => void
+  createHref: (href: string) => string
+  block: (blockerFn: BlockerFn) => () => void
+}
+
+export interface ParsedPath {
+  href: string
+  pathname: string
+  search: string
+  hash: string
+}
+
+export interface RouterLocation extends ParsedPath {
+  state: any
+}
+
+type BlockerFn = (retry: () => void, cancel: () => void) => void
+
+const pushStateEvent = 'pushstate'
+const popStateEvent = 'popstate'
+const beforeUnloadEvent = 'beforeunload'
+
+const beforeUnloadListener = (event: Event) => {
+  event.preventDefault()
+  // @ts-ignore
+  return (event.returnValue = '')
+}
+
+const stopBlocking = () => {
+  removeEventListener(beforeUnloadEvent, beforeUnloadListener, {
+    capture: true,
+  })
+}
+
+function createHistory(opts: {
+  getLocation: () => RouterLocation
+  listener: false | ((onUpdate: () => void) => () => void)
+  pushState: (path: string, state: any) => void
+  replaceState: (path: string, state: any) => void
+  go: (n: number) => void
+  back: () => void
+  forward: () => void
+  createHref: (path: string) => string
+}): RouterHistory {
+  let location = opts.getLocation()
+  let unsub = () => {}
+  let listeners = new Set<() => void>()
+  let blockers: BlockerFn[] = []
+  let queue: (() => void)[] = []
+
+  const tryFlush = () => {
+    if (blockers.length) {
+      blockers[0]?.(tryFlush, () => {
+        blockers = []
+        stopBlocking()
+      })
+      return
+    }
+
+    while (queue.length) {
+      queue.shift()?.()
+    }
+
+    if (!opts.listener) {
+      onUpdate()
+    }
+  }
+
+  const queueTask = (task: () => void) => {
+    queue.push(task)
+    tryFlush()
+  }
+
+  const onUpdate = () => {
+    location = opts.getLocation()
+    listeners.forEach((listener) => listener())
+  }
+
+  return {
+    get location() {
+      return location
+    },
+    listen: (cb: () => void) => {
+      if (listeners.size === 0) {
+        unsub =
+          typeof opts.listener === 'function'
+            ? opts.listener(onUpdate)
+            : () => {}
+      }
+      listeners.add(cb)
+
+      return () => {
+        listeners.delete(cb)
+        if (listeners.size === 0) {
+          unsub()
+        }
+      }
+    },
+    push: (path: string, state: any) => {
+      queueTask(() => {
+        opts.pushState(path, state)
+      })
+    },
+    replace: (path: string, state: any) => {
+      queueTask(() => {
+        opts.replaceState(path, state)
+      })
+    },
+    go: (index) => {
+      queueTask(() => {
+        opts.go(index)
+      })
+    },
+    back: () => {
+      queueTask(() => {
+        opts.back()
+      })
+    },
+    forward: () => {
+      queueTask(() => {
+        opts.forward()
+      })
+    },
+    createHref: (str) => opts.createHref(str),
+    block: (cb) => {
+      blockers.push(cb)
+
+      if (blockers.length === 1) {
+        addEventListener(beforeUnloadEvent, beforeUnloadListener, {
+          capture: true,
+        })
+      }
+
+      return () => {
+        blockers = blockers.filter((b) => b !== cb)
+
+        if (!blockers.length) {
+          stopBlocking()
+        }
+      }
+    },
+  }
+}
+
+export function createBrowserHistory(opts?: {
+  getHref?: () => string
+  createHref?: (path: string) => string
+}): RouterHistory {
+  const getHref =
+    opts?.getHref ??
+    (() =>
+      `${window.location.pathname}${window.location.search}${window.location.hash}`)
+  const createHref = opts?.createHref ?? ((path) => path)
+  const getLocation = () => parseLocation(getHref(), history.state)
+
+  return createHistory({
+    getLocation,
+    listener: (onUpdate) => {
+      window.addEventListener(pushStateEvent, onUpdate)
+      window.addEventListener(popStateEvent, onUpdate)
+
+      var pushState = window.history.pushState
+      window.history.pushState = function () {
+        let res = pushState.apply(history, arguments as any)
+        onUpdate()
+        return res
+      }
+      var replaceState = window.history.replaceState
+      window.history.replaceState = function () {
+        let res = replaceState.apply(history, arguments as any)
+        onUpdate()
+        return res
+      }
+
+      return () => {
+        window.history.pushState = pushState
+        window.history.replaceState = replaceState
+        window.removeEventListener(pushStateEvent, onUpdate)
+        window.removeEventListener(popStateEvent, onUpdate)
+      }
+    },
+    pushState: (path, state) => {
+      window.history.pushState(
+        { ...state, key: createRandomKey() },
+        '',
+        createHref(path),
+      )
+    },
+    replaceState: (path, state) => {
+      window.history.replaceState(
+        { ...state, key: createRandomKey() },
+        '',
+        createHref(path),
+      )
+    },
+    back: () => window.history.back(),
+    forward: () => window.history.forward(),
+    go: (n) => window.history.go(n),
+    createHref: (path) => createHref(path),
+  })
+}
+
+export function createHashHistory(): RouterHistory {
+  return createBrowserHistory({
+    getHref: () => window.location.hash.substring(1),
+    createHref: (path) => `#${path}`,
+  })
+}
+
+export function createMemoryHistory(
+  opts: {
+    initialEntries: string[]
+    initialIndex?: number
+  } = {
+    initialEntries: ['/'],
+  },
+): RouterHistory {
+  const entries = opts.initialEntries
+  let index = opts.initialIndex ?? entries.length - 1
+  let currentState = {}
+
+  const getLocation = () => parseLocation(entries[index]!, currentState)
+
+  return createHistory({
+    getLocation,
+    listener: false,
+    pushState: (path, state) => {
+      currentState = {
+        ...state,
+        key: createRandomKey(),
+      }
+      entries.push(path)
+      index++
+    },
+    replaceState: (path, state) => {
+      currentState = {
+        ...state,
+        key: createRandomKey(),
+      }
+      entries[index] = path
+    },
+    back: () => {
+      index--
+    },
+    forward: () => {
+      index = Math.min(index + 1, entries.length - 1)
+    },
+    go: (n) => window.history.go(n),
+    createHref: (path) => path,
+  })
+}
+
+function parseLocation(href: string, state: any): RouterLocation {
+  let hashIndex = href.indexOf('#')
+  let searchIndex = href.indexOf('?')
+
+  return {
+    href,
+    pathname: href.substring(
+      0,
+      hashIndex > 0
+        ? searchIndex > 0
+          ? Math.min(hashIndex, searchIndex)
+          : hashIndex
+        : searchIndex > 0
+        ? searchIndex
+        : href.length,
+    ),
+    hash: hashIndex > -1 ? href.substring(hashIndex) : '',
+    search:
+      searchIndex > -1
+        ? href.slice(searchIndex, hashIndex === -1 ? undefined : hashIndex)
+        : '',
+    state,
+  }
+}
+
+// Thanks co-pilot!
+function createRandomKey() {
+  return (Math.random() + 1).toString(36).substring(7)
+}

package/src/index.ts

@@ -1,19 +1,11 @@
-export {
-  createHashHistory,
-  createBrowserHistory,
-  createMemoryHistory,
-} from 'history'
-
 export { default as invariant } from 'tiny-invariant'
-
-export * from './frameworks'
+export { default as warning } from 'tiny-warning'
+export * from './history'
 export * from './link'
 export * from './path'
 export * from './qss'
 export * from './route'
-export * from './routeConfig'
 export * from './routeInfo'
-export * from './routeMatch'
 export * from './router'
 export * from './searchParams'
 export * from './utils'