diff --git a/docs/framework/react/adapter.md b/docs/framework/react/guides/adapter.md similarity index 100% rename from docs/framework/react/adapter.md rename to docs/framework/react/guides/adapter.md diff --git a/docs/framework/react/guides/custom-plugins.md b/docs/framework/react/guides/custom-plugins.md new file mode 100644 index 00000000..702a543e --- /dev/null +++ b/docs/framework/react/guides/custom-plugins.md @@ -0,0 +1,198 @@ +--- +title: Custom plugins +id: custom-plugins +--- + +Tanstack devtools allows you to create your own custom plugins by emitting and listening to our event bus. + +## Prerequisite + +This guide will walk you through a simple example where our library is a counter with a count history. A working example can be found in our [custom-plugin example](https://tanstack.com/devtools/latest/docs/framework/react/examples/custom-plugin). + +This is our library code: + +counter.ts +```tsx +export function createCounter() { + let count = 0; + const history = []; + + return { + getCount: () => count, + increment: () => { + history.push(count); + count++; + }, + decrement: () => { + history.push(count); + count--; + }, + }; +} +``` + +## Event Client Setup + +Install the [TanStack Devtools Event Client](https://tanstack.com/devtools/) utils. + +```bash +npm i @tanstack/devtools-event-client +``` + +First you will need to setup the `EventClient`. + +eventClient.ts +```tsx +import { EventClient } from '@tanstack/devtools-event-client' + + +type EventMap = { + // The key of the event map is a combination of {pluginId}:{eventSuffix} + // The value is the expected type of the event payload + 'custom-devtools:counter-state': { count: number, history: number[], } +} + +class CustomEventClient extends EventClient { +constructor() { + super({ + // The pluginId must match that of the event map key + pluginId: 'custom-devtools', + }) + } +} + +// This is where the magic happens, it'll be used throughout your application. +export const DevtoolsEventClient = new FormEventClient() +``` + +## Event Client Integration + +Now we need to hook our `EventClient` into out application code. This can be done in many way's, a UseEffect that emits the current state, or a subscription to an observer, all that matters is that when you want to emit the current state you do the following. + +Our new library code will looks as follows: + +counter.ts +```tsx +import { DevtoolsEventClient } from './eventClient.ts' + +export function createCounter() { + let count = 0 + const history: Array = [] + + return { + getCount: () => count, + increment: () => { + history.push(count) + + // The emit eventSuffix must match that of the EventMap defined in eventClient.ts + DevtoolsEventClient.emit('counter-state', { + count: count++, + history: history, + }) + }, + decrement: () => { + history.push(count) + + DevtoolsEventClient.emit('counter-state', { + count: count--, + history: history, + }) + }, + } +} +``` + +> **Important** `EventClient` is framework agnostic so this process will be the same regardless of framework or even in vanilla JavaScript. + +## Consuming The Event Client + +Now we need to create our devtools panel, for a simple approach write the devtools in the framework that the adapter is, be aware that this will make the plugin framework specific. + +> Because TanStack is framework agnostic we have taken a more complicated approach that will be explained in coming docs (if framework agnosticism is not a concern to you you can ignore this). + +DevtoolsPanel.ts +```tsx +import { DevtoolsEventClient } from './eventClient.ts' + +export function DevtoolPanel() { + const [state,setState] = useState(); + + useEffect(() => { + // subscribe to the emitted event + const cleanup = client.on("counter-state", e => setState(e.payload) + return cleanup + }, []); + + return ( +
+
{state.count}
+
{JSON.stringify(state.history)}
+
+ ) +} +``` + +## Application Integration + +This step follows what's shown in [../basic-setup] for a more documented guide go check it out. As well as the complete [custom-plugin example](https://tanstack.com/devtools/latest/docs/framework/react/examples/custom-plugin) in our examples section. + +Main.tsx +```tsx +import { DevtoolPanel } from './DevtoolPanel' + +createRoot(document.getElementById('root')!).render( + + + + , + }, + ]} + /> + , +) + +``` + +## Debugging + +Both the TansTack `TanstackDevtools` component and the TanStack `EventClient` come with built in debug mode which will log to the console the emitted event as well as the EventClient status. + +TanstackDevtool's debugging mode can be activated like so: +```tsx +, + }, + ]} +/> +``` + +Where as the EventClient's debug mode can be activated by: +```tsx +class CustomEventClient extends EventClient { + constructor() { + super({ + pluginId: 'custom-devtools', + debug: true, + }) + } +} +``` + +Activating the debug mode will log to the console the current events that emitter has emitted or listened to. The EventClient will have appended `[tanstack-devtools:${pluginId}]` and the client will have appended `[tanstack-devtools:client-bus]`. + +Heres an example of both: +``` +🌴 [tanstack-devtools:client-bus] Initializing client event bus + +🌴 [tanstack-devtools:custom-devtools-plugin] Registered event to bus custom-devtools:counter-state +``` diff --git a/docs/framework/solid/adapter.md b/docs/framework/solid/guides/adapter.md similarity index 100% rename from docs/framework/solid/adapter.md rename to docs/framework/solid/guides/adapter.md diff --git a/examples/react/basic/index.html b/examples/react/basic/index.html index 13cbc033..f24fe41d 100644 --- a/examples/react/basic/index.html +++ b/examples/react/basic/index.html @@ -6,7 +6,7 @@ - TanStack Devtools Example + Basic Example - TanStack Devtools diff --git a/examples/react/basic/package.json b/examples/react/basic/package.json index a40e989d..e511d082 100644 --- a/examples/react/basic/package.json +++ b/examples/react/basic/package.json @@ -20,7 +20,7 @@ "devDependencies": { "@types/react": "^19.1.2", "@types/react-dom": "^19.1.2", - "@vitejs/plugin-react": "^4.4.1", + "@vitejs/plugin-react": "^4.5.2", "vite": "^7.0.6" }, "browserslist": { diff --git a/examples/react/custom-devtools/.eslintrc.cjs b/examples/react/custom-devtools/.eslintrc.cjs new file mode 100644 index 00000000..35853b61 --- /dev/null +++ b/examples/react/custom-devtools/.eslintrc.cjs @@ -0,0 +1,11 @@ +// @ts-check + +/** @type {import('eslint').Linter.Config} */ +const config = { + extends: ['plugin:react/recommended', 'plugin:react-hooks/recommended'], + rules: { + 'react/no-children-prop': 'off', + }, +} + +module.exports = config diff --git a/examples/react/custom-devtools/.gitignore b/examples/react/custom-devtools/.gitignore new file mode 100644 index 00000000..4673b022 --- /dev/null +++ b/examples/react/custom-devtools/.gitignore @@ -0,0 +1,27 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# production +/build + +pnpm-lock.yaml +yarn.lock +package-lock.json + +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local + +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/examples/react/custom-devtools/README.md b/examples/react/custom-devtools/README.md new file mode 100644 index 00000000..1cf88926 --- /dev/null +++ b/examples/react/custom-devtools/README.md @@ -0,0 +1,6 @@ +# Example + +To run this example: + +- `npm install` +- `npm run dev` diff --git a/examples/react/custom-devtools/index.html b/examples/react/custom-devtools/index.html new file mode 100644 index 00000000..b688bebf --- /dev/null +++ b/examples/react/custom-devtools/index.html @@ -0,0 +1,16 @@ + + + + + + + + + Custom Devtools - TanStack Devtools + + + +
+ + + diff --git a/examples/react/custom-devtools/package.json b/examples/react/custom-devtools/package.json new file mode 100644 index 00000000..835292ee --- /dev/null +++ b/examples/react/custom-devtools/package.json @@ -0,0 +1,35 @@ +{ + "name": "@tanstack/devtools-custom-devtools", + "private": true, + "type": "module", + "scripts": { + "dev": "vite --port=3001", + "build": "vite build", + "preview": "vite preview", + "test:types": "tsc" + }, + "dependencies": { + "@tanstack/devtools-event-client": "https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-client@11", + "@tanstack/react-devtools": "https://pkg.pr.new/TanStack/devtools/@tanstack/react-devtools@0a0219b", + "react": "^19.1.0", + "react-dom": "^19.1.0" + }, + "devDependencies": { + "@types/react": "^19.1.2", + "@types/react-dom": "^19.1.2", + "@vitejs/plugin-react": "^4.5.2", + "vite": "^7.0.6" + }, + "browserslist": { + "production": [ + ">0.2%", + "not dead", + "not op_mini all" + ], + "development": [ + "last 1 chrome version", + "last 1 firefox version", + "last 1 safari version" + ] + } +} diff --git a/examples/react/custom-devtools/public/emblem-light.svg b/examples/react/custom-devtools/public/emblem-light.svg new file mode 100644 index 00000000..a58e69ad --- /dev/null +++ b/examples/react/custom-devtools/public/emblem-light.svg @@ -0,0 +1,13 @@ + + + + emblem-light + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/examples/react/custom-devtools/src/App.tsx b/examples/react/custom-devtools/src/App.tsx new file mode 100644 index 00000000..2c212995 --- /dev/null +++ b/examples/react/custom-devtools/src/App.tsx @@ -0,0 +1,30 @@ +import { useState } from 'react' + +import { createCounter } from './counter' + +const counterInstance = createCounter() + +export default function App() { + const [count, setCount] = useState(counterInstance.getCount()) + + const increment = () => { + counterInstance.increment() + setCount(counterInstance.getCount()) + } + + const decrement = () => { + counterInstance.decrement() + setCount(counterInstance.getCount()) + } + + return ( +
+

Custom plugins

+

Count: {count}

+
+ + +
+
+ ) +} diff --git a/examples/react/custom-devtools/src/CustomDevtoolsPanel.tsx b/examples/react/custom-devtools/src/CustomDevtoolsPanel.tsx new file mode 100644 index 00000000..eef8730f --- /dev/null +++ b/examples/react/custom-devtools/src/CustomDevtoolsPanel.tsx @@ -0,0 +1,23 @@ +import { useEffect, useState } from 'react' +import { DevtoolsEventClient } from './eventClient.ts' + +export default function CustomDevtoolPanel() { + const [state, setState] = useState< + { count: number; history: Array } | undefined + >() + + useEffect(() => { + // subscribe to the emitted event + const cleanup = DevtoolsEventClient.on('counter-state', (e) => + setState(e.payload), + ) + return cleanup + }, []) + + return ( +
+
counter state: {state?.count}
+
counter history: {JSON.stringify(state?.history)}
+
+ ) +} diff --git a/examples/react/custom-devtools/src/counter.ts b/examples/react/custom-devtools/src/counter.ts new file mode 100644 index 00000000..2ac0fc1b --- /dev/null +++ b/examples/react/custom-devtools/src/counter.ts @@ -0,0 +1,27 @@ +import { DevtoolsEventClient } from './eventClient.ts' + +export function createCounter() { + let count = 0 + const history: Array = [] + + return { + getCount: () => count, + increment: () => { + history.push(count) + + // The emit eventSuffix must match that of the EventMap defined in eventClient.ts + DevtoolsEventClient.emit('counter-state', { + count: count++, + history: history, + }) + }, + decrement: () => { + history.push(count) + + DevtoolsEventClient.emit('counter-state', { + count: count--, + history: history, + }) + }, + } +} diff --git a/examples/react/custom-devtools/src/eventClient.ts b/examples/react/custom-devtools/src/eventClient.ts new file mode 100644 index 00000000..d884641d --- /dev/null +++ b/examples/react/custom-devtools/src/eventClient.ts @@ -0,0 +1,20 @@ +import { EventClient } from '@tanstack/devtools-event-client' + +type EventMap = { + // The key of the event map is a combination of {pluginId}:{eventSuffix} + // The value is the expected type of the event payload + 'custom-devtools:counter-state': { count: number; history: Array } +} + +class CustomEventClient extends EventClient { + constructor() { + super({ + // The pluginId must match that of the event map key + pluginId: 'custom-devtools', + debug: true, + }) + } +} + +// This is where the magic happens, it'll be used throughout your application. +export const DevtoolsEventClient = new CustomEventClient() diff --git a/examples/react/custom-devtools/src/index.tsx b/examples/react/custom-devtools/src/index.tsx new file mode 100644 index 00000000..3be7f3c4 --- /dev/null +++ b/examples/react/custom-devtools/src/index.tsx @@ -0,0 +1,22 @@ +import { StrictMode } from 'react' +import { createRoot } from 'react-dom/client' +import { TanstackDevtools } from '@tanstack/react-devtools' + +import App from './App' +import CustomDevtoolPanel from './CustomDevtoolsPanel' + +createRoot(document.getElementById('root')!).render( + + + + , + }, + ]} + /> + , +) diff --git a/examples/react/custom-devtools/tsconfig.json b/examples/react/custom-devtools/tsconfig.json new file mode 100644 index 00000000..22b43163 --- /dev/null +++ b/examples/react/custom-devtools/tsconfig.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "target": "ESNext", + "lib": ["DOM", "DOM.Iterable", "ESNext"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "Bundler", + "allowImportingTsExtensions": true, + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx", + + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true + }, + "include": ["src"] +} diff --git a/examples/react/start/package.json b/examples/react/start/package.json index 70ee6104..65931747 100644 --- a/examples/react/start/package.json +++ b/examples/react/start/package.json @@ -36,7 +36,7 @@ "@testing-library/react": "^16.2.0", "@types/react": "^19.1.2", "@types/react-dom": "^19.1.2", - "@vitejs/plugin-react": "^4.4.1", + "@vitejs/plugin-react": "^4.5.2", "jsdom": "^26.1.0", "typescript": "5.8.3", "vite": "^7.0.6", diff --git a/packages/react-devtools/package.json b/packages/react-devtools/package.json index 6669502b..42232bc7 100644 --- a/packages/react-devtools/package.json +++ b/packages/react-devtools/package.json @@ -58,7 +58,7 @@ "devDependencies": { "@eslint-react/eslint-plugin": "^1.48.5", "@types/react": "^19.1.2", - "@vitejs/plugin-react": "^4.4.1", + "@vitejs/plugin-react": "^4.5.2", "eslint-plugin-react-compiler": "19.1.0-rc.1", "eslint-plugin-react-hooks": "^5.2.0", "react": "^19.1.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c1fbcbac..82b0050d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -103,8 +103,36 @@ importers: specifier: ^19.1.2 version: 19.1.2(@types/react@19.1.2) '@vitejs/plugin-react': - specifier: ^4.4.1 - version: 4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + specifier: ^4.5.2 + version: 4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + vite: + specifier: ^7.0.6 + version: 7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0) + + examples/react/custom-devtools: + dependencies: + '@tanstack/devtools-event-client': + specifier: https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-client@11 + version: https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-client@11 + '@tanstack/react-devtools': + specifier: https://pkg.pr.new/TanStack/devtools/@tanstack/react-devtools@0a0219b + version: https://pkg.pr.new/TanStack/devtools/@tanstack/react-devtools@0a0219b(@types/react-dom@19.1.2(@types/react@19.1.2))(@types/react@19.1.2)(csstype@3.1.3)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(solid-js@1.9.7) + react: + specifier: ^19.1.0 + version: 19.1.0 + react-dom: + specifier: ^19.1.0 + version: 19.1.0(react@19.1.0) + devDependencies: + '@types/react': + specifier: ^19.1.2 + version: 19.1.2 + '@types/react-dom': + specifier: ^19.1.2 + version: 19.1.2(@types/react@19.1.2) + '@vitejs/plugin-react': + specifier: ^4.5.2 + version: 4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) vite: specifier: ^7.0.6 version: 7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0) @@ -143,7 +171,7 @@ importers: version: 1.130.9(@tanstack/react-query@5.83.0(react@19.1.0))(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@tanstack/router-core@1.130.9)(react-dom@19.1.0(react@19.1.0))(react@19.1.0) '@tanstack/react-start': specifier: ^1.130.2 - version: 1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + version: 1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) '@tanstack/router-plugin': specifier: ^1.121.2 version: 1.130.9(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) @@ -176,8 +204,8 @@ importers: specifier: ^19.1.2 version: 19.1.2(@types/react@19.1.2) '@vitejs/plugin-react': - specifier: ^4.4.1 - version: 4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + specifier: ^4.5.2 + version: 4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) jsdom: specifier: ^26.1.0 version: 26.1.0 @@ -260,8 +288,8 @@ importers: specifier: ^19.1.2 version: 19.1.2 '@vitejs/plugin-react': - specifier: ^4.4.1 - version: 4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + specifier: ^4.5.2 + version: 4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) eslint-plugin-react-compiler: specifier: 19.1.0-rc.1 version: 19.1.0-rc.1(eslint@9.25.1(jiti@2.5.1)) @@ -502,14 +530,14 @@ packages: peerDependencies: '@babel/core': ^7.0.0-0 - '@babel/plugin-transform-react-jsx-self@7.25.9': - resolution: {integrity: sha512-y8quW6p0WHkEhmErnfe58r7x0A70uKphQm8Sp8cV7tjNQwK56sNVK0M73LK3WuYmsuyrftut4xAkjjgU0twaMg==} + '@babel/plugin-transform-react-jsx-self@7.27.1': + resolution: {integrity: sha512-6UzkCs+ejGdZ5mFFC/OCUrv028ab2fp1znZmCZjAOBKiBK2jXD1O+BPSfX8X2qjJ75fZBMSnQn3Rq2mrBJK2mw==} engines: {node: '>=6.9.0'} peerDependencies: '@babel/core': ^7.0.0-0 - '@babel/plugin-transform-react-jsx-source@7.25.9': - resolution: {integrity: sha512-+iqjT8xmXhhYv4/uiYd8FNQsraMFZIfxVSqxxVSZP0WbbSAWvBXAul0m/zu+7Vv4O/3WtApy9pmaTMiumEZgfg==} + '@babel/plugin-transform-react-jsx-source@7.27.1': + resolution: {integrity: sha512-zbwoTsBruTeKB9hSq73ha66iFeJHuaFkUbwvqElnygoNbj/jHRsSeokowZFN3CZ64IvEqcmmkVe89OPXc7ldAw==} engines: {node: '>=6.9.0'} peerDependencies: '@babel/core': ^7.0.0-0 @@ -1598,6 +1626,9 @@ packages: resolution: {integrity: sha512-S+9ANAvUmjutrshV4jZjaiG8XQyuJIZ8a4utWmN/vW1sgQ9IfBnPndwkmQYw53QmouOIytT874u65HEmu6H5jw==} engines: {node: '>=18'} + '@rolldown/pluginutils@1.0.0-beta.27': + resolution: {integrity: sha512-+d0F4MKMCbeVUJwG96uQ4SgAznZNSq93I3V+9NHA4OpvqG8mRCpGdKmK8l/dl02h2CCDHwW2FqilnTyDcAnqjA==} + '@rollup/plugin-alias@5.1.1': resolution: {integrity: sha512-PR9zDb+rOzkRb2VD+EuKB7UC41vU5DIwZ5qqCpk0KJudcWAyi8rvYOhS7+L5aZCspw1stTViLgN5v6FF1p5cgQ==} engines: {node: '>=14.0.0'} @@ -2124,6 +2155,23 @@ packages: resolution: {integrity: sha512-q6P0aYj7X65biWDKkKFQ4feQoxF8Bcxd3U3CU5zjBt9sgUrc/w8kEfHoGy0cHtgsTSMLfPrzaAtvp6hTbofZmw==} engines: {node: '>=18'} + '@tanstack/devtools-event-bus@https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-bus@0a0219bfd4a30d5c85939340277f9efc0d934d3b': + resolution: {tarball: https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-bus@0a0219bfd4a30d5c85939340277f9efc0d934d3b} + version: 0.1.1 + engines: {node: '>=18'} + + '@tanstack/devtools-event-client@https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-client@11': + resolution: {tarball: https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-client@11} + version: 0.1.1 + engines: {node: '>=18'} + + '@tanstack/devtools@https://pkg.pr.new/TanStack/devtools/@tanstack/devtools@0a0219bfd4a30d5c85939340277f9efc0d934d3b': + resolution: {tarball: https://pkg.pr.new/TanStack/devtools/@tanstack/devtools@0a0219bfd4a30d5c85939340277f9efc0d934d3b} + version: 0.1.1 + engines: {node: '>=18'} + peerDependencies: + solid-js: '>=1.9.7' + '@tanstack/directive-functions-plugin@1.129.7': resolution: {integrity: sha512-2VvlVmDvwHOnDAXQQa+gnhDnWPW59JcqePFf1ujOG0QGv+pw1G+JzHpiLZs4Dwr4myMxMGzFp5AWtvF96rpE7Q==} engines: {node: '>=12'} @@ -2148,6 +2196,16 @@ packages: '@tanstack/query-devtools@5.81.2': resolution: {integrity: sha512-jCeJcDCwKfoyyBXjXe9+Lo8aTkavygHHsUHAlxQKKaDeyT0qyQNLKl7+UyqYH2dDF6UN/14873IPBHchcsU+Zg==} + '@tanstack/react-devtools@https://pkg.pr.new/TanStack/devtools/@tanstack/react-devtools@0a0219b': + resolution: {tarball: https://pkg.pr.new/TanStack/devtools/@tanstack/react-devtools@0a0219b} + version: 0.1.1 + engines: {node: '>=18'} + peerDependencies: + '@types/react': '>=16.8' + '@types/react-dom': '>=16.8' + react: '>=16.8' + react-dom: '>=16.8' + '@tanstack/react-query-devtools@5.83.0': resolution: {integrity: sha512-yfp8Uqd3I1jgx8gl0lxbSSESu5y4MO2ThOPBnGNTYs0P+ZFu+E9g5IdOngyUGuo6Uz6Qa7p9TLdZEX3ntik2fQ==} peerDependencies: @@ -2642,11 +2700,11 @@ packages: engines: {node: '>=18'} hasBin: true - '@vitejs/plugin-react@4.4.1': - resolution: {integrity: sha512-IpEm5ZmeXAP/osiBXVVP5KjFMzbWOonMs0NaQQl+xYnUAcq4oHUBsF2+p4MgKWG4YMmFYJU8A6sxRPuowllm6w==} + '@vitejs/plugin-react@4.7.0': + resolution: {integrity: sha512-gUu9hwfWvvEDBBmgtAowQCojwZmJ5mcLn3aufeCsitijs3+f2NsrPtlAWIR6OPiqljl96GVCUbLe0HyqIpVaoA==} engines: {node: ^14.18.0 || >=16.0.0} peerDependencies: - vite: ^4.2.0 || ^5.0.0 || ^6.0.0 + vite: ^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 '@vitest/expect@3.1.2': resolution: {integrity: sha512-O8hJgr+zREopCAqWl3uCVaOdqJwZ9qaDwUP7vy3Xigad0phZe9APxKhPcDNqYYi0rX5oMvwJMSCAXY2afqeTSA==} @@ -6347,6 +6405,18 @@ packages: utf-8-validate: optional: true + ws@8.18.3: + resolution: {integrity: sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==} + engines: {node: '>=10.0.0'} + peerDependencies: + bufferutil: ^4.0.1 + utf-8-validate: '>=5.0.2' + peerDependenciesMeta: + bufferutil: + optional: true + utf-8-validate: + optional: true + xml-name-validator@5.0.0: resolution: {integrity: sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==} engines: {node: '>=18'} @@ -6724,15 +6794,15 @@ snapshots: transitivePeerDependencies: - supports-color - '@babel/plugin-transform-react-jsx-self@7.25.9(@babel/core@7.26.10)': + '@babel/plugin-transform-react-jsx-self@7.27.1(@babel/core@7.28.0)': dependencies: - '@babel/core': 7.26.10 - '@babel/helper-plugin-utils': 7.26.5 + '@babel/core': 7.28.0 + '@babel/helper-plugin-utils': 7.27.1 - '@babel/plugin-transform-react-jsx-source@7.25.9(@babel/core@7.26.10)': + '@babel/plugin-transform-react-jsx-source@7.27.1(@babel/core@7.28.0)': dependencies: - '@babel/core': 7.26.10 - '@babel/helper-plugin-utils': 7.26.5 + '@babel/core': 7.28.0 + '@babel/helper-plugin-utils': 7.27.1 '@babel/plugin-transform-typescript@7.28.0(@babel/core@7.28.0)': dependencies: @@ -7828,6 +7898,8 @@ snapshots: '@publint/pack@0.1.2': {} + '@rolldown/pluginutils@1.0.0-beta.27': {} + '@rollup/plugin-alias@5.1.1(rollup@4.46.2)': optionalDependencies: rollup: 4.46.2 @@ -8301,6 +8373,27 @@ snapshots: - typescript - vite + '@tanstack/devtools-event-bus@https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-bus@0a0219bfd4a30d5c85939340277f9efc0d934d3b': + dependencies: + ws: 8.18.3 + transitivePeerDependencies: + - bufferutil + - utf-8-validate + + '@tanstack/devtools-event-client@https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-client@11': {} + + '@tanstack/devtools@https://pkg.pr.new/TanStack/devtools/@tanstack/devtools@0a0219bfd4a30d5c85939340277f9efc0d934d3b(csstype@3.1.3)(solid-js@1.9.7)': + dependencies: + '@solid-primitives/keyboard': 1.3.3(solid-js@1.9.7) + '@tanstack/devtools-event-bus': https://pkg.pr.new/TanStack/devtools/@tanstack/devtools-event-bus@0a0219bfd4a30d5c85939340277f9efc0d934d3b + clsx: 2.1.1 + goober: 2.1.16(csstype@3.1.3) + solid-js: 1.9.7 + transitivePeerDependencies: + - bufferutil + - csstype + - utf-8-validate + '@tanstack/directive-functions-plugin@1.129.7(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': dependencies: '@babel/code-frame': 7.27.1 @@ -8348,6 +8441,19 @@ snapshots: '@tanstack/query-devtools@5.81.2': {} + '@tanstack/react-devtools@https://pkg.pr.new/TanStack/devtools/@tanstack/react-devtools@0a0219b(@types/react-dom@19.1.2(@types/react@19.1.2))(@types/react@19.1.2)(csstype@3.1.3)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(solid-js@1.9.7)': + dependencies: + '@tanstack/devtools': https://pkg.pr.new/TanStack/devtools/@tanstack/devtools@0a0219bfd4a30d5c85939340277f9efc0d934d3b(csstype@3.1.3)(solid-js@1.9.7) + '@types/react': 19.1.2 + '@types/react-dom': 19.1.2(@types/react@19.1.2) + react: 19.1.0 + react-dom: 19.1.0(react@19.1.0) + transitivePeerDependencies: + - bufferutil + - csstype + - solid-js + - utf-8-validate + '@tanstack/react-query-devtools@5.83.0(@tanstack/react-query@5.83.0(react@19.1.0))(react@19.1.0)': dependencies: '@tanstack/query-devtools': 5.81.2 @@ -8424,10 +8530,10 @@ snapshots: tiny-invariant: 1.3.3 tiny-warning: 1.0.3 - '@tanstack/react-start-plugin@1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': + '@tanstack/react-start-plugin@1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': dependencies: '@tanstack/start-plugin-core': 1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) - '@vitejs/plugin-react': 4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + '@vitejs/plugin-react': 4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) pathe: 2.0.3 vite: 7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0) zod: 3.24.3 @@ -8475,14 +8581,14 @@ snapshots: react: 19.1.0 react-dom: 19.1.0(react@19.1.0) - '@tanstack/react-start@1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': + '@tanstack/react-start@1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': dependencies: '@tanstack/react-start-client': 1.130.9(react-dom@19.1.0(react@19.1.0))(react@19.1.0) - '@tanstack/react-start-plugin': 1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + '@tanstack/react-start-plugin': 1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(@vitejs/plugin-react@4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) '@tanstack/react-start-server': 1.130.9(react-dom@19.1.0(react@19.1.0))(react@19.1.0) '@tanstack/start-server-functions-client': 1.130.9(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) '@tanstack/start-server-functions-server': 1.129.7(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) - '@vitejs/plugin-react': 4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) + '@vitejs/plugin-react': 4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)) react: 19.1.0 react-dom: 19.1.0(react@19.1.0) vite: 7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0) @@ -8668,7 +8774,7 @@ snapshots: '@tanstack/start-plugin-core@1.130.9(@netlify/blobs@9.1.2)(@tanstack/react-router@1.130.2(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(vite-plugin-solid@2.11.6(@testing-library/jest-dom@6.6.3)(solid-js@1.9.7)(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0)))(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': dependencies: '@babel/code-frame': 7.26.2 - '@babel/core': 7.26.10 + '@babel/core': 7.28.0 '@babel/types': 7.27.0 '@tanstack/router-core': 1.130.9 '@tanstack/router-generator': 1.130.9 @@ -9111,11 +9217,12 @@ snapshots: - rollup - supports-color - '@vitejs/plugin-react@4.4.1(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': + '@vitejs/plugin-react@4.7.0(vite@7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0))': dependencies: - '@babel/core': 7.26.10 - '@babel/plugin-transform-react-jsx-self': 7.25.9(@babel/core@7.26.10) - '@babel/plugin-transform-react-jsx-source': 7.25.9(@babel/core@7.26.10) + '@babel/core': 7.28.0 + '@babel/plugin-transform-react-jsx-self': 7.27.1(@babel/core@7.28.0) + '@babel/plugin-transform-react-jsx-source': 7.27.1(@babel/core@7.28.0) + '@rolldown/pluginutils': 1.0.0-beta.27 '@types/babel__core': 7.20.5 react-refresh: 0.17.0 vite: 7.0.6(@types/node@22.15.2)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(tsx@4.20.3)(yaml@2.8.0) @@ -13077,6 +13184,8 @@ snapshots: ws@8.18.1: {} + ws@8.18.3: {} + xml-name-validator@5.0.0: {} xmlbuilder2@3.1.1: