feat(solid-router): Add a SolidJS driver for TanStack Router

packages/solid-router/README.md

@@ -0,0 +1,29 @@
+<img src="https://static.scarf.sh/a.png?x-pxid=d988eb79-b0fc-4a2b-8514-6a1ab932d188" />
+
+# TanStack Solid Router
+
+![TanStack Router Header](https://github.com/tanstack/router/raw/main/media/header.png)
+
+🤖 Type-safe router w/ built-in caching & URL state management for Solid!
+
+<a href="https://twitter.com/intent/tweet?button_hashtag=TanStack" target="\_parent">
+  <img alt="#TanStack" src="https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack">
+</a><a href="https://discord.com/invite/WrRKjPJ" target="\_parent">
+  <img alt="" src="https://img.shields.io/badge/Discord-TanStack-%235865F2" />
+</a><a href="https://npmjs.com/package/@tanstack/solid-router" target="\_parent">
+  <img alt="" src="https://img.shields.io/npm/dm/@tanstack/router.svg" />
+</a><a href="https://bundlephobia.com/result?p=@tanstack/solid-router" target="\_parent">
+  <img alt="" src="https://badgen.net/bundlephobia/minzip/@tanstack/solid-router" />
+</a><a href="#badge">
+    <img alt="semantic-release" src="https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg">
+  </a><a href="https://github.com/tanstack/router/discussions">
+  <img alt="Join the discussion on Github" src="https://img.shields.io/badge/Github%20Discussions%20%26%20Support-Chat%20now!-blue" />
+</a><a href="https://bestofjs.org/projects/router"><img alt="Best of JS" src="https://img.shields.io/endpoint?url=https://bestofjs-serverless.now.sh/api/project-badge?fullName=tanstack%2Frouter%26since=daily" /></a><a href="https://github.com/tanstack/router" target="\_parent">
+  <img alt="" src="https://img.shields.io/github/stars/tanstack/router.svg?style=social&label=Star" />
+</a><a href="https://twitter.com/tan_stack" target="\_parent">
+  <img alt="" src="https://img.shields.io/twitter/follow/tan_stack.svg?style=social&label=Follow @TanStack" />
+</a><a href="https://twitter.com/tannerlinsley" target="\_parent">
+  <img alt="" src="https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow @TannerLinsley" />
+</a>
+
+## Visit [tanstack.com/router](https://tanstack.com/router) for docs, guides, API and more!

packages/solid-router/eslint.config.ts

@@ -0,0 +1,8 @@
+import rootConfig from '../../eslint.config.js'
+
+export default [
+  ...rootConfig,
+  {
+    files: ['src/**/*.{ts,tsx}', 'tests/**/*.{ts,tsx}'],
+  },
+]

packages/solid-router/package.json

@@ -0,0 +1,93 @@
+{
+  "name": "@tanstack/solid-router",
+  "version": "1.97.21",
+  "description": "Modern and scalable routing for Solid applications",
+  "author": "Tanner Linsley",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/TanStack/router.git",
+    "directory": "packages/solid-router"
+  },
+  "homepage": "https://tanstack.com/router",
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/tannerlinsley"
+  },
+  "keywords": [
+    "solidjs",
+    "location",
+    "router",
+    "routing",
+    "async",
+    "async router",
+    "typescript"
+  ],
+  "scripts": {
+    "clean": "rimraf ./dist && rimraf ./coverage",
+    "test:eslint": "eslint",
+    "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
+    "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js -p tsconfig.legacy.json",
+    "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js -p tsconfig.legacy.json",
+    "test:types:ts54": "node ../../node_modules/typescript54/lib/tsc.js -p tsconfig.legacy.json",
+    "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js -p tsconfig.legacy.json",
+    "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js -p tsconfig.legacy.json",
+    "test:types:ts57": "tsc -p tsconfig.legacy.json",
+    "test:unit": "vitest",
+    "test:unit:dev": "pnpm run test:unit --watch --hideSkippedTests",
+    "test:perf": "vitest bench",
+    "test:perf:dev": "pnpm run test:perf --watch --hideSkippedTests",
+    "test:build": "publint --strict && attw --ignore-rules no-resolution --pack .",
+    "build": "vite build"
+  },
+  "type": "module",
+  "types": "dist/esm/index.d.ts",
+  "main": "dist/cjs/index.cjs",
+  "module": "dist/esm/index.js",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/esm/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "require": {
+        "types": "./dist/cjs/index.d.cts",
+        "default": "./dist/cjs/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "src"
+  ],
+  "engines": {
+    "node": ">=12"
+  },
+  "dependencies": {
+    "@solid-devtools/logger": "^0.9.4",
+    "@solid-primitives/refs": "^1.0.8",
+    "@tanstack/history": "workspace:*",
+    "@tanstack/router-core": "workspace:*",
+    "@tanstack/solid-store": "^0.7.0",
+    "@tanstack/store": "^0.7.0",
+    "jsesc": "^3.0.2",
+    "tiny-invariant": "^1.3.3",
+    "tiny-warning": "^1.0.3"
+  },
+  "devDependencies": {
+    "@solidjs/testing-library": "^0.8.10",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@types/jsesc": "^3.0.3",
+    "@vitest/browser": "^3.0.0",
+    "@vitest/ui": "^3.0.0",
+    "combinate": "^1.1.11",
+    "solid-js": "^1",
+    "vite-plugin-solid": "2.10.2",
+    "zod": "^3.23.8"
+  },
+  "peerDependencies": {
+    "solid-js": "^1"
+  }
+}

packages/solid-router/src/CatchBoundary.tsx

@@ -0,0 +1,82 @@
+import * as Solid from 'solid-js'
+import { Dynamic } from 'solid-js/web'
+import type { ErrorRouteComponent } from './route'
+
+export function CatchBoundary(
+  props: {
+    getResetKey: () => number | string
+    children: Solid.JSXElement
+    errorComponent?: ErrorRouteComponent
+    onCatch?: (error: Error) => void
+  } & Solid.ParentProps,
+) {
+  return (
+    <Solid.ErrorBoundary
+      fallback={(error, reset) => {
+        props.onCatch?.(error)
+
+        Solid.createEffect(
+          Solid.on(
+            () => props.getResetKey,
+            () => reset(),
+            { defer: true },
+          ),
+        )
+
+        return (
+          <Dynamic
+            component={props.errorComponent ?? ErrorComponent}
+            error={error}
+            reset={reset}
+          />
+        )
+      }}
+    >
+      {props.children}
+    </Solid.ErrorBoundary>
+  )
+}
+
+export function ErrorComponent({ error }: { error: any }) {
+  const [show, setShow] = Solid.createSignal(
+    process.env.NODE_ENV !== 'production',
+  )
+
+  return (
+    <div style={{ padding: '.5rem', 'max-width': '100%' }}>
+      <div style={{ display: 'flex', 'align-items': 'center', gap: '.5rem' }}>
+        <strong style={{ 'font-size': '1rem' }}>Something went wrong!</strong>
+        <button
+          style={{
+            appearance: 'none',
+            'font-size': '.6em',
+            border: '1px solid currentColor',
+            padding: '.1rem .2rem',
+            'font-weight': 'bold',
+            'border-radius': '.25rem',
+          }}
+          onClick={() => setShow((d) => !d)}
+        >
+          {show() ? 'Hide Error' : 'Show Error'}
+        </button>
+      </div>
+      <div style={{ height: '.25rem' }} />
+      {show() ? (
+        <div>
+          <pre
+            style={{
+              'font-size': '.7em',
+              border: '1px solid red',
+              'border-radius': '.25rem',
+              padding: '.3rem',
+              color: 'red',
+              overflow: 'auto',
+            }}
+          >
+            {error.message ? <code>{error.message}</code> : null}
+          </pre>
+        </div>
+      ) : null}
+    </div>
+  )
+}