[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-tanstack-devtools-vite-plugin":3,"mdc--a4yk9d-key":38,"related-org-tanstack-devtools-vite-plugin":3458,"related-repo-tanstack-devtools-vite-plugin":3599},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":23,"repoUrl":24,"updatedAt":25,"license":26,"forks":27,"topics":28,"repo":33,"sourceUrl":36,"mdContent":37},"devtools-vite-plugin","configure TanStack Devtools Vite plugin","Configure @tanstack\u002Fdevtools-vite for source inspection (data-tsd-source, inspectHotkey, ignore patterns), console piping (client-to-server, server-to-client, levels), enhanced logging, server event bus (port, host, HTTPS), production stripping (removeDevtoolsOnBuild), editor integration (launch-editor, custom editor.open). Must be FIRST plugin in Vite config. Vite ^6 || ^7 only.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},"tanstack","TanStack","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Ftanstack.png",[12,16,19,20],{"name":13,"slug":14,"type":15},"Observability","observability","tag",{"name":17,"slug":18,"type":15},"Vite","vite",{"name":9,"slug":8,"type":15},{"name":21,"slug":22,"type":15},"Debugging","debugging",476,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Fdevtools","2026-07-16T06:04:09.44643",null,92,[29,30,31,32],"devtool","devtools","react","solidjs",{"repoUrl":24,"stars":23,"forks":27,"topics":34,"description":35},[29,30,31,32],"🤖 Framework-agnostic devtools panel for handling TanStack libraries devtools and your custom devtool plugins","https:\u002F\u002Fgithub.com\u002FTanStack\u002Fdevtools\u002Ftree\u002FHEAD\u002Fpackages\u002Fdevtools-vite\u002Fskills\u002Fdevtools-vite-plugin","---\nname: devtools-vite-plugin\ndescription: >\n  Configure @tanstack\u002Fdevtools-vite for source inspection (data-tsd-source,\n  inspectHotkey, ignore patterns), console piping (client-to-server,\n  server-to-client, levels), enhanced logging, server event bus (port, host,\n  HTTPS), production stripping (removeDevtoolsOnBuild), editor integration\n  (launch-editor, custom editor.open). Must be FIRST plugin in Vite config.\n  Vite ^6 || ^7 only.\ntype: core\nlibrary: tanstack-devtools\nlibrary_version: '0.10.12'\nsources:\n  - 'TanStack\u002Fdevtools:docs\u002Fvite-plugin.md'\n  - 'TanStack\u002Fdevtools:docs\u002Fsource-inspector.md'\n  - 'TanStack\u002Fdevtools:packages\u002Fdevtools-vite\u002Fsrc\u002Fplugin.ts'\n---\n\nConfigure @tanstack\u002Fdevtools-vite -- the Vite plugin that enhances TanStack Devtools with source inspection, console piping, enhanced logging, a server event bus, production stripping, editor integration, and a plugin marketplace. The plugin returns an array of sub-plugins, all using `enforce: 'pre'`, so it must be the FIRST plugin in the Vite config.\n\n## Installation and Basic Setup\n\n```ts\n\u002F\u002F vite.config.ts\nimport { devtools } from '@tanstack\u002Fdevtools-vite'\n\nexport default {\n  plugins: [\n    devtools(),\n    \u002F\u002F ... other plugins AFTER devtools\n  ],\n}\n```\n\nInstall as a dev dependency:\n\n```sh\npnpm add -D @tanstack\u002Fdevtools-vite\n```\n\nThere is also a `defineDevtoolsConfig` helper for type-safe config objects:\n\n```ts\nimport { devtools, defineDevtoolsConfig } from '@tanstack\u002Fdevtools-vite'\n\nconst config = defineDevtoolsConfig({\n  \u002F\u002F fully typed options\n})\n\nexport default {\n  plugins: [devtools(config)],\n}\n```\n\n## Exports\n\nFrom `packages\u002Fdevtools-vite\u002Fsrc\u002Findex.ts`:\n\n- `devtools` -- main plugin factory, returns `Array\u003CPlugin>`\n- `defineDevtoolsConfig` -- identity function for type-safe config\n- `TanStackDevtoolsViteConfig` -- config type (re-exported)\n- `ConsoleLevel` -- `'log' | 'warn' | 'error' | 'info' | 'debug'`\n\n## Architecture: Sub-Plugins\n\n`devtools()` returns an array of Vite plugins. Each has `enforce: 'pre'` and only activates when its conditions are met (dev mode, serve command, etc.).\n\n| Sub-plugin name                               | What it does                                                                                                       | When active                                                |\n| --------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------- |\n| `@tanstack\u002Fdevtools:inject-source`            | AST transform adding `data-tsd-source` attrs to JSX                                                                | dev mode + `injectSource.enabled`                          |\n| `@tanstack\u002Fdevtools:config`                   | Reserved for future config modifications                                                                           | serve command only                                         |\n| `@tanstack\u002Fdevtools:custom-server`            | Starts ServerEventBus, registers middleware for open-source\u002Fconsole-pipe endpoints                                 | dev mode                                                   |\n| `@tanstack\u002Fdevtools:remove-devtools-on-build` | Strips devtools imports\u002FJSX from production bundles                                                                | build command or production mode + `removeDevtoolsOnBuild` |\n| `@tanstack\u002Fdevtools:event-client-setup`       | Marketplace: listens for install\u002Fadd-plugin events via devtoolsEventClient                                         | dev mode + serve + not CI                                  |\n| `@tanstack\u002Fdevtools:console-pipe-transform`   | Injects runtime console-pipe code into entry files                                                                 | dev mode + serve + `consolePiping.enabled`                 |\n| `@tanstack\u002Fdevtools:better-console-logs`      | AST transform prepending source location to `console.log`\u002F`console.error`                                          | dev mode + `enhancedLogs.enabled`                          |\n| `@tanstack\u002Fdevtools:inject-plugin`            | Detects which file imports TanStackDevtools (for marketplace injection)                                            | dev mode + serve                                           |\n| `@tanstack\u002Fdevtools:connection-injection`     | Replaces `__TANSTACK_DEVTOOLS_PORT__`, `__TANSTACK_DEVTOOLS_HOST__`, `__TANSTACK_DEVTOOLS_PROTOCOL__` placeholders | dev mode + serve                                           |\n\n## Subsystem Details\n\n### Source Injection\n\nAdds `data-tsd-source=\"\u003Crelative-path>:\u003Cline>:\u003Ccolumn>\"` attributes to every JSX opening element via oxc-parser + MagicString. This powers the \"Go to Source\" feature -- hold the inspect hotkey (default: Shift+Alt+Ctrl\u002FMeta), hover over elements, click to open in editor.\n\n**Key behaviors:**\n\n- Skips `\u003CFragment>` and `\u003CReact.Fragment>`\n- Skips elements where the component's props parameter is spread (`{...props}`) -- this is because injecting the attribute would be overwritten by the spread\n- Skips files matching `injectSource.ignore.files` patterns\n- Skips components matching `injectSource.ignore.components` patterns\n- Patterns can be strings (matched via picomatch) or RegExp\n- Transform filter excludes `node_modules`, `?raw` imports, `\u002Fdist\u002F`, `\u002Fbuild\u002F`\n\n**Source files:** `packages\u002Fdevtools-vite\u002Fsrc\u002Finject-source.ts`, `packages\u002Fdevtools-vite\u002Fsrc\u002Fmatcher.ts`\n\n```ts\ndevtools({\n  injectSource: {\n    enabled: true,\n    ignore: {\n      files: ['node_modules', \u002F.*\\.test\\.(js|ts|jsx|tsx)$\u002F],\n      components: ['InternalComponent', \u002F.*Provider$\u002F],\n    },\n  },\n})\n```\n\n### Console Piping\n\nBidirectional console piping between client and server. Injects runtime code (IIFE) into entry files that:\n\n**Client side:**\n\n1. Wraps `console[level]` to batch and POST entries to `\u002F__tsd\u002Fconsole-pipe`\n2. Opens an EventSource on `\u002F__tsd\u002Fconsole-pipe\u002Fsse` to receive server logs\n3. Server logs appear in browser console with a purple `[Server]` prefix\n4. Client logs appear in terminal with a cyan `[Client]` prefix\n\n**Server side (SSR\u002FNitro):**\n\n1. Wraps `console[level]` to batch and POST entries to `\u003CviteServerUrl>\u002F__tsd\u002Fconsole-pipe\u002Fserver`\n2. These are then broadcast to all SSE clients\n\n**Entry file detection:** looks for `\u003Chtml` tag, `StartClient`, `hydrateRoot`, `createRoot`, or `solid-js\u002Fweb` + `render(` in code.\n\n**Source files:** `packages\u002Fdevtools-vite\u002Fsrc\u002Fvirtual-console.ts`, `packages\u002Fdevtools-vite\u002Fsrc\u002Futils.ts` (middleware handlers)\n\n```ts\ndevtools({\n  consolePiping: {\n    enabled: true,\n    levels: ['log', 'warn', 'error', 'info', 'debug'],\n  },\n})\n```\n\n### Enhanced Logging\n\nAST transform that prepends source location info to `console.log()` and `console.error()` calls. In the browser, this renders as a clickable \"Go to Source\" link. On the server, it shows `LOG \u003Cpath>:\u003Cline>:\u003Ccolumn>` in chalk colors.\n\nThe transform inserts a spread of a conditional expression: `...(typeof window === 'undefined' ? serverLogMessage : browserLogMessage)` as the first argument of the console call.\n\n**Source file:** `packages\u002Fdevtools-vite\u002Fsrc\u002Fenhance-logs.ts`\n\n```ts\ndevtools({\n  enhancedLogs: {\n    enabled: true, \u002F\u002F default\n  },\n})\n```\n\n### Production Stripping\n\nRemoves all devtools code from production builds. The transform:\n\n1. Finds files importing from these packages: `@tanstack\u002Freact-devtools`, `@tanstack\u002Fpreact-devtools`, `@tanstack\u002Fsolid-devtools`, `@tanstack\u002Fvue-devtools`, `@tanstack\u002Fdevtools`\n2. Removes the import declarations\n3. Removes the JSX elements that use the imported components\n4. Cleans up leftover imports that were only used inside the removed JSX (e.g., plugin panel components)\n\nActive when: `command !== 'serve'` OR `config.mode === 'production'` (handles hosting providers like Cloudflare\u002FNetlify that may not use `build` command but set mode to production).\n\n**Source file:** `packages\u002Fdevtools-vite\u002Fsrc\u002Fremove-devtools.ts`\n\n```ts\ndevtools({\n  removeDevtoolsOnBuild: true, \u002F\u002F default\n})\n```\n\n### Server Event Bus\n\nA WebSocket + SSE server for devtools-to-client communication. Managed by `@tanstack\u002Fdevtools-event-bus\u002Fserver`.\n\n**Key behaviors:**\n\n- Default port: 4206\n- On EADDRINUSE: falls back to OS-assigned port (port 0)\n- When Vite uses HTTPS: piggybacks on Vite's httpServer instead of creating a standalone one (shares TLS certificate)\n- Uses global variables (`__TANSTACK_DEVTOOLS_SERVER__`, etc.) to survive HMR without restarting\n- The actual port is injected into client code via `__TANSTACK_DEVTOOLS_PORT__` placeholder replacement\n\n**Source file:** `packages\u002Fevent-bus\u002Fsrc\u002Fserver\u002Fserver.ts`\n\n```ts\ndevtools({\n  eventBusConfig: {\n    port: 4206, \u002F\u002F default\n    enabled: true, \u002F\u002F default; set false for storybook\u002Fvitest\n    debug: false, \u002F\u002F default; logs internal bus activity\n  },\n})\n```\n\n### Editor Integration\n\nUses `launch-editor` to open source files in the editor. Default editor is VS Code. The `editor.open` callback receives `(path, lineNumber, columnNumber)` as strings.\n\nThe open-source flow: browser requests `\u002F__tsd\u002Fopen-source?source=\u003Cencoded-path:line:col>` --> Vite middleware parses source param --> calls `editor.open`.\n\nSupported editors via launch-editor: VS Code, WebStorm, Sublime Text, Atom, and more. For unsupported editors, provide a custom `editor.open` function.\n\n**Source file:** `packages\u002Fdevtools-vite\u002Fsrc\u002Feditor.ts`\n\n```ts\ndevtools({\n  editor: {\n    name: 'Cursor',\n    open: async (path, lineNumber, columnNumber) => {\n      \u002F\u002F Custom editor open logic\n      \u002F\u002F path is the absolute file path\n      \u002F\u002F lineNumber and columnNumber are strings or undefined\n    },\n  },\n})\n```\n\n### Plugin Marketplace\n\nWhen the dev server is running, listens for events via `devtoolsEventClient`:\n\n- `install-devtools` -- runs package manager install, then auto-injects plugin into devtools setup file\n- `add-plugin-to-devtools` -- injects plugin import and JSX\u002Ffunction call into the file containing `\u003CTanStackDevtools>`\n- `bump-package-version` -- updates a package to a minimum version\n- `mounted` -- sends package.json and outdated deps to the UI\n\nAuto-detection of the devtools setup file: the `inject-plugin` sub-plugin scans transforms for files importing from `@tanstack\u002Freact-devtools`, `@tanstack\u002Fsolid-devtools`, `@tanstack\u002Fvue-devtools`, etc., and stores the file ID.\n\n**Source files:** `packages\u002Fdevtools-vite\u002Fsrc\u002Finject-plugin.ts`, `packages\u002Fdevtools-vite\u002Fsrc\u002Fpackage-manager.ts`\n\n## Common Mistakes\n\n### 1. Not placing devtools() first in Vite plugins (HIGH)\n\nAll sub-plugins use `enforce: 'pre'`. They must transform code before framework plugins (React, Vue, Solid, etc.) process it. If devtools is not first, source injection and enhanced logs may silently fail because framework transforms remove the raw JSX before devtools can annotate it.\n\n```ts\n\u002F\u002F WRONG\nexport default {\n  plugins: [\n    react(),\n    devtools(), \u002F\u002F too late -- react() already transformed JSX\n  ],\n}\n\n\u002F\u002F CORRECT\nexport default {\n  plugins: [devtools(), react()],\n}\n```\n\n### 2. Using devtools-vite with non-Vite bundlers (HIGH)\n\n`@tanstack\u002Fdevtools-vite` has a peer dependency on `vite ^6.0.0 || ^7.0.0`. It uses Vite-specific APIs (`configureServer`, `handleHotUpdate`, `transform` with filter objects, `Plugin` type). It will not work with webpack, rspack, esbuild, or other bundlers. For non-Vite setups, use `@tanstack\u002Fdevtools-event-bus` client directly without the Vite plugin.\n\n### 3. Expecting Vite plugin features in production (MEDIUM)\n\nSource injection, console piping, enhanced logging, the server event bus, and the marketplace only operate during development (`config.mode === 'development'` and `command === 'serve'`). In production builds, the only active sub-plugin is `remove-devtools-on-build` (which strips devtools code). Do not rely on any of these features being available at runtime in production.\n\n### 4. Source injection on spread-props elements (MEDIUM)\n\nThe AST transform in `inject-source.ts` explicitly skips any JSX element that has a `{...props}` spread where `props` is the component's parameter name. This is intentional -- the spread would overwrite the injected `data-tsd-source` attribute. If source inspection doesn't work for a specific component, check if it spreads its props parameter.\n\n```tsx\n\u002F\u002F data-tsd-source will NOT be injected on \u003Cdiv> here\nconst MyComponent = (props) => {\n  return \u003Cdiv {...props}>content\u003C\u002Fdiv>\n}\n```\n\n### 5. Event bus port conflict in multi-project setups (MEDIUM)\n\nThe default event bus port is 4206. When running multiple Vite dev servers concurrently (monorepo), the second server will hit EADDRINUSE. The event bus handles this by falling back to an OS-assigned port (port 0), and the actual port is injected via placeholder replacement. However, if you need predictable ports (e.g., for firewall rules), set different ports explicitly:\n\n```ts\n\u002F\u002F Project A\ndevtools({ eventBusConfig: { port: 4206 } })\n\n\u002F\u002F Project B\ndevtools({ eventBusConfig: { port: 4207 } })\n```\n\n## Internal Middleware Endpoints\n\nThese are registered on the Vite dev server (not the event bus server):\n\n| Endpoint                                    | Method | Purpose                                                   |\n| ------------------------------------------- | ------ | --------------------------------------------------------- |\n| `\u002F__tsd\u002Fopen-source?source=\u003Cpath:line:col>` | GET    | Opens file in editor, returns HTML that closes the window |\n| `\u002F__tsd\u002Fconsole-pipe`                       | POST   | Receives client console entries (batched JSON)            |\n| `\u002F__tsd\u002Fconsole-pipe\u002Fserver`                | POST   | Receives server-side console entries                      |\n| `\u002F__tsd\u002Fconsole-pipe\u002Fsse`                   | GET    | SSE stream for broadcasting server logs to browser        |\n\n## Cross-References\n\n- **devtools-app-setup** -- How to set up `\u003CTanStackDevtools>` in your app (must be done before the Vite plugin provides value)\n- **devtools-production** -- Details on production stripping configuration and keeping devtools in production builds\n\n## Key Source Files\n\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Fplugin.ts` -- Main plugin factory with all sub-plugins and config type\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Finject-source.ts` -- AST transform for data-tsd-source injection\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Fenhance-logs.ts` -- AST transform for enhanced console logs\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Fremove-devtools.ts` -- Production stripping transform\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Fvirtual-console.ts` -- Console pipe runtime code generator\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Feditor.ts` -- Editor config type and launch-editor integration\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Finject-plugin.ts` -- Marketplace plugin injection into devtools setup file\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Futils.ts` -- Middleware request handling and helpers\n- `packages\u002Fdevtools-vite\u002Fsrc\u002Fmatcher.ts` -- Picomatch\u002FRegExp pattern matcher\n- `packages\u002Fevent-bus\u002Fsrc\u002Fserver\u002Fserver.ts` -- ServerEventBus implementation (WebSocket + SSE + EADDRINUSE fallback)\n",{"data":39,"body":47},{"name":4,"description":6,"type":40,"library":41,"library_version":42,"sources":43},"core","tanstack-devtools","0.10.12",[44,45,46],"TanStack\u002Fdevtools:docs\u002Fvite-plugin.md","TanStack\u002Fdevtools:docs\u002Fsource-inspector.md","TanStack\u002Fdevtools:packages\u002Fdevtools-vite\u002Fsrc\u002Fplugin.ts",{"type":48,"children":49},"root",[50,67,74,245,250,283,296,467,473,485,544,550,568,866,872,879,892,901,999,1022,1312,1318,1323,1331,1392,1400,1424,1480,1503,1683,1689,1717,1730,1745,1825,1831,1836,1893,1922,1936,1993,1999,2011,2018,2061,2075,2207,2213,2242,2261,2273,2287,2463,2469,2481,2534,2566,2587,2593,2599,2611,2790,2796,2852,2858,2886,2892,2927,3037,3043,3048,3184,3190,3195,3306,3312,3342,3348,3452],{"type":51,"tag":52,"props":53,"children":54},"element","p",{},[55,58,65],{"type":56,"value":57},"text","Configure @tanstack\u002Fdevtools-vite -- the Vite plugin that enhances TanStack Devtools with source inspection, console piping, enhanced logging, a server event bus, production stripping, editor integration, and a plugin marketplace. The plugin returns an array of sub-plugins, all using ",{"type":51,"tag":59,"props":60,"children":62},"code",{"className":61},[],[63],{"type":56,"value":64},"enforce: 'pre'",{"type":56,"value":66},", so it must be the FIRST plugin in the Vite config.",{"type":51,"tag":68,"props":69,"children":71},"h2",{"id":70},"installation-and-basic-setup",[72],{"type":56,"value":73},"Installation and Basic Setup",{"type":51,"tag":75,"props":76,"children":81},"pre",{"className":77,"code":78,"language":79,"meta":80,"style":80},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F vite.config.ts\nimport { devtools } from '@tanstack\u002Fdevtools-vite'\n\nexport default {\n  plugins: [\n    devtools(),\n    \u002F\u002F ... other plugins AFTER devtools\n  ],\n}\n","ts","",[82],{"type":51,"tag":59,"props":83,"children":84},{"__ignoreMap":80},[85,97,145,155,174,194,214,223,236],{"type":51,"tag":86,"props":87,"children":90},"span",{"class":88,"line":89},"line",1,[91],{"type":51,"tag":86,"props":92,"children":94},{"style":93},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[95],{"type":56,"value":96},"\u002F\u002F vite.config.ts\n",{"type":51,"tag":86,"props":98,"children":100},{"class":88,"line":99},2,[101,107,113,119,124,129,134,140],{"type":51,"tag":86,"props":102,"children":104},{"style":103},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[105],{"type":56,"value":106},"import",{"type":51,"tag":86,"props":108,"children":110},{"style":109},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[111],{"type":56,"value":112}," {",{"type":51,"tag":86,"props":114,"children":116},{"style":115},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[117],{"type":56,"value":118}," devtools",{"type":51,"tag":86,"props":120,"children":121},{"style":109},[122],{"type":56,"value":123}," }",{"type":51,"tag":86,"props":125,"children":126},{"style":103},[127],{"type":56,"value":128}," from",{"type":51,"tag":86,"props":130,"children":131},{"style":109},[132],{"type":56,"value":133}," '",{"type":51,"tag":86,"props":135,"children":137},{"style":136},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[138],{"type":56,"value":139},"@tanstack\u002Fdevtools-vite",{"type":51,"tag":86,"props":141,"children":142},{"style":109},[143],{"type":56,"value":144},"'\n",{"type":51,"tag":86,"props":146,"children":148},{"class":88,"line":147},3,[149],{"type":51,"tag":86,"props":150,"children":152},{"emptyLinePlaceholder":151},true,[153],{"type":56,"value":154},"\n",{"type":51,"tag":86,"props":156,"children":158},{"class":88,"line":157},4,[159,164,169],{"type":51,"tag":86,"props":160,"children":161},{"style":103},[162],{"type":56,"value":163},"export",{"type":51,"tag":86,"props":165,"children":166},{"style":103},[167],{"type":56,"value":168}," default",{"type":51,"tag":86,"props":170,"children":171},{"style":109},[172],{"type":56,"value":173}," {\n",{"type":51,"tag":86,"props":175,"children":177},{"class":88,"line":176},5,[178,184,189],{"type":51,"tag":86,"props":179,"children":181},{"style":180},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[182],{"type":56,"value":183},"  plugins",{"type":51,"tag":86,"props":185,"children":186},{"style":109},[187],{"type":56,"value":188},":",{"type":51,"tag":86,"props":190,"children":191},{"style":115},[192],{"type":56,"value":193}," [\n",{"type":51,"tag":86,"props":195,"children":197},{"class":88,"line":196},6,[198,204,209],{"type":51,"tag":86,"props":199,"children":201},{"style":200},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[202],{"type":56,"value":203},"    devtools",{"type":51,"tag":86,"props":205,"children":206},{"style":115},[207],{"type":56,"value":208},"()",{"type":51,"tag":86,"props":210,"children":211},{"style":109},[212],{"type":56,"value":213},",\n",{"type":51,"tag":86,"props":215,"children":217},{"class":88,"line":216},7,[218],{"type":51,"tag":86,"props":219,"children":220},{"style":93},[221],{"type":56,"value":222},"    \u002F\u002F ... other plugins AFTER devtools\n",{"type":51,"tag":86,"props":224,"children":226},{"class":88,"line":225},8,[227,232],{"type":51,"tag":86,"props":228,"children":229},{"style":115},[230],{"type":56,"value":231},"  ]",{"type":51,"tag":86,"props":233,"children":234},{"style":109},[235],{"type":56,"value":213},{"type":51,"tag":86,"props":237,"children":239},{"class":88,"line":238},9,[240],{"type":51,"tag":86,"props":241,"children":242},{"style":109},[243],{"type":56,"value":244},"}\n",{"type":51,"tag":52,"props":246,"children":247},{},[248],{"type":56,"value":249},"Install as a dev dependency:",{"type":51,"tag":75,"props":251,"children":255},{"className":252,"code":253,"language":254,"meta":80,"style":80},"language-sh shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm add -D @tanstack\u002Fdevtools-vite\n","sh",[256],{"type":51,"tag":59,"props":257,"children":258},{"__ignoreMap":80},[259],{"type":51,"tag":86,"props":260,"children":261},{"class":88,"line":89},[262,268,273,278],{"type":51,"tag":86,"props":263,"children":265},{"style":264},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[266],{"type":56,"value":267},"pnpm",{"type":51,"tag":86,"props":269,"children":270},{"style":136},[271],{"type":56,"value":272}," add",{"type":51,"tag":86,"props":274,"children":275},{"style":136},[276],{"type":56,"value":277}," -D",{"type":51,"tag":86,"props":279,"children":280},{"style":136},[281],{"type":56,"value":282}," @tanstack\u002Fdevtools-vite\n",{"type":51,"tag":52,"props":284,"children":285},{},[286,288,294],{"type":56,"value":287},"There is also a ",{"type":51,"tag":59,"props":289,"children":291},{"className":290},[],[292],{"type":56,"value":293},"defineDevtoolsConfig",{"type":56,"value":295}," helper for type-safe config objects:",{"type":51,"tag":75,"props":297,"children":299},{"className":77,"code":298,"language":79,"meta":80,"style":80},"import { devtools, defineDevtoolsConfig } from '@tanstack\u002Fdevtools-vite'\n\nconst config = defineDevtoolsConfig({\n  \u002F\u002F fully typed options\n})\n\nexport default {\n  plugins: [devtools(config)],\n}\n",[300],{"type":51,"tag":59,"props":301,"children":302},{"__ignoreMap":80},[303,348,355,388,396,409,416,431,460],{"type":51,"tag":86,"props":304,"children":305},{"class":88,"line":89},[306,310,314,318,323,328,332,336,340,344],{"type":51,"tag":86,"props":307,"children":308},{"style":103},[309],{"type":56,"value":106},{"type":51,"tag":86,"props":311,"children":312},{"style":109},[313],{"type":56,"value":112},{"type":51,"tag":86,"props":315,"children":316},{"style":115},[317],{"type":56,"value":118},{"type":51,"tag":86,"props":319,"children":320},{"style":109},[321],{"type":56,"value":322},",",{"type":51,"tag":86,"props":324,"children":325},{"style":115},[326],{"type":56,"value":327}," defineDevtoolsConfig",{"type":51,"tag":86,"props":329,"children":330},{"style":109},[331],{"type":56,"value":123},{"type":51,"tag":86,"props":333,"children":334},{"style":103},[335],{"type":56,"value":128},{"type":51,"tag":86,"props":337,"children":338},{"style":109},[339],{"type":56,"value":133},{"type":51,"tag":86,"props":341,"children":342},{"style":136},[343],{"type":56,"value":139},{"type":51,"tag":86,"props":345,"children":346},{"style":109},[347],{"type":56,"value":144},{"type":51,"tag":86,"props":349,"children":350},{"class":88,"line":99},[351],{"type":51,"tag":86,"props":352,"children":353},{"emptyLinePlaceholder":151},[354],{"type":56,"value":154},{"type":51,"tag":86,"props":356,"children":357},{"class":88,"line":147},[358,364,369,374,378,383],{"type":51,"tag":86,"props":359,"children":361},{"style":360},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[362],{"type":56,"value":363},"const",{"type":51,"tag":86,"props":365,"children":366},{"style":115},[367],{"type":56,"value":368}," config ",{"type":51,"tag":86,"props":370,"children":371},{"style":109},[372],{"type":56,"value":373},"=",{"type":51,"tag":86,"props":375,"children":376},{"style":200},[377],{"type":56,"value":327},{"type":51,"tag":86,"props":379,"children":380},{"style":115},[381],{"type":56,"value":382},"(",{"type":51,"tag":86,"props":384,"children":385},{"style":109},[386],{"type":56,"value":387},"{\n",{"type":51,"tag":86,"props":389,"children":390},{"class":88,"line":157},[391],{"type":51,"tag":86,"props":392,"children":393},{"style":93},[394],{"type":56,"value":395},"  \u002F\u002F fully typed options\n",{"type":51,"tag":86,"props":397,"children":398},{"class":88,"line":176},[399,404],{"type":51,"tag":86,"props":400,"children":401},{"style":109},[402],{"type":56,"value":403},"}",{"type":51,"tag":86,"props":405,"children":406},{"style":115},[407],{"type":56,"value":408},")\n",{"type":51,"tag":86,"props":410,"children":411},{"class":88,"line":196},[412],{"type":51,"tag":86,"props":413,"children":414},{"emptyLinePlaceholder":151},[415],{"type":56,"value":154},{"type":51,"tag":86,"props":417,"children":418},{"class":88,"line":216},[419,423,427],{"type":51,"tag":86,"props":420,"children":421},{"style":103},[422],{"type":56,"value":163},{"type":51,"tag":86,"props":424,"children":425},{"style":103},[426],{"type":56,"value":168},{"type":51,"tag":86,"props":428,"children":429},{"style":109},[430],{"type":56,"value":173},{"type":51,"tag":86,"props":432,"children":433},{"class":88,"line":225},[434,438,442,447,451,456],{"type":51,"tag":86,"props":435,"children":436},{"style":180},[437],{"type":56,"value":183},{"type":51,"tag":86,"props":439,"children":440},{"style":109},[441],{"type":56,"value":188},{"type":51,"tag":86,"props":443,"children":444},{"style":115},[445],{"type":56,"value":446}," [",{"type":51,"tag":86,"props":448,"children":449},{"style":200},[450],{"type":56,"value":30},{"type":51,"tag":86,"props":452,"children":453},{"style":115},[454],{"type":56,"value":455},"(config)]",{"type":51,"tag":86,"props":457,"children":458},{"style":109},[459],{"type":56,"value":213},{"type":51,"tag":86,"props":461,"children":462},{"class":88,"line":238},[463],{"type":51,"tag":86,"props":464,"children":465},{"style":109},[466],{"type":56,"value":244},{"type":51,"tag":68,"props":468,"children":470},{"id":469},"exports",[471],{"type":56,"value":472},"Exports",{"type":51,"tag":52,"props":474,"children":475},{},[476,478,484],{"type":56,"value":477},"From ",{"type":51,"tag":59,"props":479,"children":481},{"className":480},[],[482],{"type":56,"value":483},"packages\u002Fdevtools-vite\u002Fsrc\u002Findex.ts",{"type":56,"value":188},{"type":51,"tag":486,"props":487,"children":488},"ul",{},[489,506,516,527],{"type":51,"tag":490,"props":491,"children":492},"li",{},[493,498,500],{"type":51,"tag":59,"props":494,"children":496},{"className":495},[],[497],{"type":56,"value":30},{"type":56,"value":499}," -- main plugin factory, returns ",{"type":51,"tag":59,"props":501,"children":503},{"className":502},[],[504],{"type":56,"value":505},"Array\u003CPlugin>",{"type":51,"tag":490,"props":507,"children":508},{},[509,514],{"type":51,"tag":59,"props":510,"children":512},{"className":511},[],[513],{"type":56,"value":293},{"type":56,"value":515}," -- identity function for type-safe config",{"type":51,"tag":490,"props":517,"children":518},{},[519,525],{"type":51,"tag":59,"props":520,"children":522},{"className":521},[],[523],{"type":56,"value":524},"TanStackDevtoolsViteConfig",{"type":56,"value":526}," -- config type (re-exported)",{"type":51,"tag":490,"props":528,"children":529},{},[530,536,538],{"type":51,"tag":59,"props":531,"children":533},{"className":532},[],[534],{"type":56,"value":535},"ConsoleLevel",{"type":56,"value":537}," -- ",{"type":51,"tag":59,"props":539,"children":541},{"className":540},[],[542],{"type":56,"value":543},"'log' | 'warn' | 'error' | 'info' | 'debug'",{"type":51,"tag":68,"props":545,"children":547},{"id":546},"architecture-sub-plugins",[548],{"type":56,"value":549},"Architecture: Sub-Plugins",{"type":51,"tag":52,"props":551,"children":552},{},[553,559,561,566],{"type":51,"tag":59,"props":554,"children":556},{"className":555},[],[557],{"type":56,"value":558},"devtools()",{"type":56,"value":560}," returns an array of Vite plugins. Each has ",{"type":51,"tag":59,"props":562,"children":564},{"className":563},[],[565],{"type":56,"value":64},{"type":56,"value":567}," and only activates when its conditions are met (dev mode, serve command, etc.).",{"type":51,"tag":569,"props":570,"children":571},"table",{},[572,596],{"type":51,"tag":573,"props":574,"children":575},"thead",{},[576],{"type":51,"tag":577,"props":578,"children":579},"tr",{},[580,586,591],{"type":51,"tag":581,"props":582,"children":583},"th",{},[584],{"type":56,"value":585},"Sub-plugin name",{"type":51,"tag":581,"props":587,"children":588},{},[589],{"type":56,"value":590},"What it does",{"type":51,"tag":581,"props":592,"children":593},{},[594],{"type":56,"value":595},"When active",{"type":51,"tag":597,"props":598,"children":599},"tbody",{},[600,637,659,681,709,731,759,800,822],{"type":51,"tag":577,"props":601,"children":602},{},[603,613,626],{"type":51,"tag":604,"props":605,"children":606},"td",{},[607],{"type":51,"tag":59,"props":608,"children":610},{"className":609},[],[611],{"type":56,"value":612},"@tanstack\u002Fdevtools:inject-source",{"type":51,"tag":604,"props":614,"children":615},{},[616,618,624],{"type":56,"value":617},"AST transform adding ",{"type":51,"tag":59,"props":619,"children":621},{"className":620},[],[622],{"type":56,"value":623},"data-tsd-source",{"type":56,"value":625}," attrs to JSX",{"type":51,"tag":604,"props":627,"children":628},{},[629,631],{"type":56,"value":630},"dev mode + ",{"type":51,"tag":59,"props":632,"children":634},{"className":633},[],[635],{"type":56,"value":636},"injectSource.enabled",{"type":51,"tag":577,"props":638,"children":639},{},[640,649,654],{"type":51,"tag":604,"props":641,"children":642},{},[643],{"type":51,"tag":59,"props":644,"children":646},{"className":645},[],[647],{"type":56,"value":648},"@tanstack\u002Fdevtools:config",{"type":51,"tag":604,"props":650,"children":651},{},[652],{"type":56,"value":653},"Reserved for future config modifications",{"type":51,"tag":604,"props":655,"children":656},{},[657],{"type":56,"value":658},"serve command only",{"type":51,"tag":577,"props":660,"children":661},{},[662,671,676],{"type":51,"tag":604,"props":663,"children":664},{},[665],{"type":51,"tag":59,"props":666,"children":668},{"className":667},[],[669],{"type":56,"value":670},"@tanstack\u002Fdevtools:custom-server",{"type":51,"tag":604,"props":672,"children":673},{},[674],{"type":56,"value":675},"Starts ServerEventBus, registers middleware for open-source\u002Fconsole-pipe endpoints",{"type":51,"tag":604,"props":677,"children":678},{},[679],{"type":56,"value":680},"dev mode",{"type":51,"tag":577,"props":682,"children":683},{},[684,693,698],{"type":51,"tag":604,"props":685,"children":686},{},[687],{"type":51,"tag":59,"props":688,"children":690},{"className":689},[],[691],{"type":56,"value":692},"@tanstack\u002Fdevtools:remove-devtools-on-build",{"type":51,"tag":604,"props":694,"children":695},{},[696],{"type":56,"value":697},"Strips devtools imports\u002FJSX from production bundles",{"type":51,"tag":604,"props":699,"children":700},{},[701,703],{"type":56,"value":702},"build command or production mode + ",{"type":51,"tag":59,"props":704,"children":706},{"className":705},[],[707],{"type":56,"value":708},"removeDevtoolsOnBuild",{"type":51,"tag":577,"props":710,"children":711},{},[712,721,726],{"type":51,"tag":604,"props":713,"children":714},{},[715],{"type":51,"tag":59,"props":716,"children":718},{"className":717},[],[719],{"type":56,"value":720},"@tanstack\u002Fdevtools:event-client-setup",{"type":51,"tag":604,"props":722,"children":723},{},[724],{"type":56,"value":725},"Marketplace: listens for install\u002Fadd-plugin events via devtoolsEventClient",{"type":51,"tag":604,"props":727,"children":728},{},[729],{"type":56,"value":730},"dev mode + serve + not CI",{"type":51,"tag":577,"props":732,"children":733},{},[734,743,748],{"type":51,"tag":604,"props":735,"children":736},{},[737],{"type":51,"tag":59,"props":738,"children":740},{"className":739},[],[741],{"type":56,"value":742},"@tanstack\u002Fdevtools:console-pipe-transform",{"type":51,"tag":604,"props":744,"children":745},{},[746],{"type":56,"value":747},"Injects runtime console-pipe code into entry files",{"type":51,"tag":604,"props":749,"children":750},{},[751,753],{"type":56,"value":752},"dev mode + serve + ",{"type":51,"tag":59,"props":754,"children":756},{"className":755},[],[757],{"type":56,"value":758},"consolePiping.enabled",{"type":51,"tag":577,"props":760,"children":761},{},[762,771,790],{"type":51,"tag":604,"props":763,"children":764},{},[765],{"type":51,"tag":59,"props":766,"children":768},{"className":767},[],[769],{"type":56,"value":770},"@tanstack\u002Fdevtools:better-console-logs",{"type":51,"tag":604,"props":772,"children":773},{},[774,776,782,784],{"type":56,"value":775},"AST transform prepending source location to ",{"type":51,"tag":59,"props":777,"children":779},{"className":778},[],[780],{"type":56,"value":781},"console.log",{"type":56,"value":783},"\u002F",{"type":51,"tag":59,"props":785,"children":787},{"className":786},[],[788],{"type":56,"value":789},"console.error",{"type":51,"tag":604,"props":791,"children":792},{},[793,794],{"type":56,"value":630},{"type":51,"tag":59,"props":795,"children":797},{"className":796},[],[798],{"type":56,"value":799},"enhancedLogs.enabled",{"type":51,"tag":577,"props":801,"children":802},{},[803,812,817],{"type":51,"tag":604,"props":804,"children":805},{},[806],{"type":51,"tag":59,"props":807,"children":809},{"className":808},[],[810],{"type":56,"value":811},"@tanstack\u002Fdevtools:inject-plugin",{"type":51,"tag":604,"props":813,"children":814},{},[815],{"type":56,"value":816},"Detects which file imports TanStackDevtools (for marketplace injection)",{"type":51,"tag":604,"props":818,"children":819},{},[820],{"type":56,"value":821},"dev mode + serve",{"type":51,"tag":577,"props":823,"children":824},{},[825,834,862],{"type":51,"tag":604,"props":826,"children":827},{},[828],{"type":51,"tag":59,"props":829,"children":831},{"className":830},[],[832],{"type":56,"value":833},"@tanstack\u002Fdevtools:connection-injection",{"type":51,"tag":604,"props":835,"children":836},{},[837,839,845,847,853,854,860],{"type":56,"value":838},"Replaces ",{"type":51,"tag":59,"props":840,"children":842},{"className":841},[],[843],{"type":56,"value":844},"__TANSTACK_DEVTOOLS_PORT__",{"type":56,"value":846},", ",{"type":51,"tag":59,"props":848,"children":850},{"className":849},[],[851],{"type":56,"value":852},"__TANSTACK_DEVTOOLS_HOST__",{"type":56,"value":846},{"type":51,"tag":59,"props":855,"children":857},{"className":856},[],[858],{"type":56,"value":859},"__TANSTACK_DEVTOOLS_PROTOCOL__",{"type":56,"value":861}," placeholders",{"type":51,"tag":604,"props":863,"children":864},{},[865],{"type":56,"value":821},{"type":51,"tag":68,"props":867,"children":869},{"id":868},"subsystem-details",[870],{"type":56,"value":871},"Subsystem Details",{"type":51,"tag":873,"props":874,"children":876},"h3",{"id":875},"source-injection",[877],{"type":56,"value":878},"Source Injection",{"type":51,"tag":52,"props":880,"children":881},{},[882,884,890],{"type":56,"value":883},"Adds ",{"type":51,"tag":59,"props":885,"children":887},{"className":886},[],[888],{"type":56,"value":889},"data-tsd-source=\"\u003Crelative-path>:\u003Cline>:\u003Ccolumn>\"",{"type":56,"value":891}," attributes to every JSX opening element via oxc-parser + MagicString. This powers the \"Go to Source\" feature -- hold the inspect hotkey (default: Shift+Alt+Ctrl\u002FMeta), hover over elements, click to open in editor.",{"type":51,"tag":52,"props":893,"children":894},{},[895],{"type":51,"tag":896,"props":897,"children":898},"strong",{},[899],{"type":56,"value":900},"Key behaviors:",{"type":51,"tag":486,"props":902,"children":903},{},[904,923,936,949,961,966],{"type":51,"tag":490,"props":905,"children":906},{},[907,909,915,917],{"type":56,"value":908},"Skips ",{"type":51,"tag":59,"props":910,"children":912},{"className":911},[],[913],{"type":56,"value":914},"\u003CFragment>",{"type":56,"value":916}," and ",{"type":51,"tag":59,"props":918,"children":920},{"className":919},[],[921],{"type":56,"value":922},"\u003CReact.Fragment>",{"type":51,"tag":490,"props":924,"children":925},{},[926,928,934],{"type":56,"value":927},"Skips elements where the component's props parameter is spread (",{"type":51,"tag":59,"props":929,"children":931},{"className":930},[],[932],{"type":56,"value":933},"{...props}",{"type":56,"value":935},") -- this is because injecting the attribute would be overwritten by the spread",{"type":51,"tag":490,"props":937,"children":938},{},[939,941,947],{"type":56,"value":940},"Skips files matching ",{"type":51,"tag":59,"props":942,"children":944},{"className":943},[],[945],{"type":56,"value":946},"injectSource.ignore.files",{"type":56,"value":948}," patterns",{"type":51,"tag":490,"props":950,"children":951},{},[952,954,960],{"type":56,"value":953},"Skips components matching ",{"type":51,"tag":59,"props":955,"children":957},{"className":956},[],[958],{"type":56,"value":959},"injectSource.ignore.components",{"type":56,"value":948},{"type":51,"tag":490,"props":962,"children":963},{},[964],{"type":56,"value":965},"Patterns can be strings (matched via picomatch) or RegExp",{"type":51,"tag":490,"props":967,"children":968},{},[969,971,977,978,984,986,992,993],{"type":56,"value":970},"Transform filter excludes ",{"type":51,"tag":59,"props":972,"children":974},{"className":973},[],[975],{"type":56,"value":976},"node_modules",{"type":56,"value":846},{"type":51,"tag":59,"props":979,"children":981},{"className":980},[],[982],{"type":56,"value":983},"?raw",{"type":56,"value":985}," imports, ",{"type":51,"tag":59,"props":987,"children":989},{"className":988},[],[990],{"type":56,"value":991},"\u002Fdist\u002F",{"type":56,"value":846},{"type":51,"tag":59,"props":994,"children":996},{"className":995},[],[997],{"type":56,"value":998},"\u002Fbuild\u002F",{"type":51,"tag":52,"props":1000,"children":1001},{},[1002,1007,1009,1015,1016],{"type":51,"tag":896,"props":1003,"children":1004},{},[1005],{"type":56,"value":1006},"Source files:",{"type":56,"value":1008}," ",{"type":51,"tag":59,"props":1010,"children":1012},{"className":1011},[],[1013],{"type":56,"value":1014},"packages\u002Fdevtools-vite\u002Fsrc\u002Finject-source.ts",{"type":56,"value":846},{"type":51,"tag":59,"props":1017,"children":1019},{"className":1018},[],[1020],{"type":56,"value":1021},"packages\u002Fdevtools-vite\u002Fsrc\u002Fmatcher.ts",{"type":51,"tag":75,"props":1023,"children":1025},{"className":77,"code":1024,"language":79,"meta":80,"style":80},"devtools({\n  injectSource: {\n    enabled: true,\n    ignore: {\n      files: ['node_modules', \u002F.*\\.test\\.(js|ts|jsx|tsx)$\u002F],\n      components: ['InternalComponent', \u002F.*Provider$\u002F],\n    },\n  },\n})\n",[1026],{"type":51,"tag":59,"props":1027,"children":1028},{"__ignoreMap":80},[1029,1044,1060,1082,1098,1219,1285,1293,1301],{"type":51,"tag":86,"props":1030,"children":1031},{"class":88,"line":89},[1032,1036,1040],{"type":51,"tag":86,"props":1033,"children":1034},{"style":200},[1035],{"type":56,"value":30},{"type":51,"tag":86,"props":1037,"children":1038},{"style":115},[1039],{"type":56,"value":382},{"type":51,"tag":86,"props":1041,"children":1042},{"style":109},[1043],{"type":56,"value":387},{"type":51,"tag":86,"props":1045,"children":1046},{"class":88,"line":99},[1047,1052,1056],{"type":51,"tag":86,"props":1048,"children":1049},{"style":180},[1050],{"type":56,"value":1051},"  injectSource",{"type":51,"tag":86,"props":1053,"children":1054},{"style":109},[1055],{"type":56,"value":188},{"type":51,"tag":86,"props":1057,"children":1058},{"style":109},[1059],{"type":56,"value":173},{"type":51,"tag":86,"props":1061,"children":1062},{"class":88,"line":147},[1063,1068,1072,1078],{"type":51,"tag":86,"props":1064,"children":1065},{"style":180},[1066],{"type":56,"value":1067},"    enabled",{"type":51,"tag":86,"props":1069,"children":1070},{"style":109},[1071],{"type":56,"value":188},{"type":51,"tag":86,"props":1073,"children":1075},{"style":1074},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[1076],{"type":56,"value":1077}," true",{"type":51,"tag":86,"props":1079,"children":1080},{"style":109},[1081],{"type":56,"value":213},{"type":51,"tag":86,"props":1083,"children":1084},{"class":88,"line":157},[1085,1090,1094],{"type":51,"tag":86,"props":1086,"children":1087},{"style":180},[1088],{"type":56,"value":1089},"    ignore",{"type":51,"tag":86,"props":1091,"children":1092},{"style":109},[1093],{"type":56,"value":188},{"type":51,"tag":86,"props":1095,"children":1096},{"style":109},[1097],{"type":56,"value":173},{"type":51,"tag":86,"props":1099,"children":1100},{"class":88,"line":176},[1101,1106,1110,1114,1119,1123,1127,1131,1136,1141,1146,1151,1156,1160,1164,1169,1174,1178,1182,1187,1191,1196,1201,1206,1210,1215],{"type":51,"tag":86,"props":1102,"children":1103},{"style":180},[1104],{"type":56,"value":1105},"      files",{"type":51,"tag":86,"props":1107,"children":1108},{"style":109},[1109],{"type":56,"value":188},{"type":51,"tag":86,"props":1111,"children":1112},{"style":115},[1113],{"type":56,"value":446},{"type":51,"tag":86,"props":1115,"children":1116},{"style":109},[1117],{"type":56,"value":1118},"'",{"type":51,"tag":86,"props":1120,"children":1121},{"style":136},[1122],{"type":56,"value":976},{"type":51,"tag":86,"props":1124,"children":1125},{"style":109},[1126],{"type":56,"value":1118},{"type":51,"tag":86,"props":1128,"children":1129},{"style":109},[1130],{"type":56,"value":322},{"type":51,"tag":86,"props":1132,"children":1133},{"style":109},[1134],{"type":56,"value":1135}," \u002F",{"type":51,"tag":86,"props":1137,"children":1138},{"style":136},[1139],{"type":56,"value":1140},".",{"type":51,"tag":86,"props":1142,"children":1143},{"style":109},[1144],{"type":56,"value":1145},"*",{"type":51,"tag":86,"props":1147,"children":1148},{"style":115},[1149],{"type":56,"value":1150},"\\.",{"type":51,"tag":86,"props":1152,"children":1153},{"style":136},[1154],{"type":56,"value":1155},"test",{"type":51,"tag":86,"props":1157,"children":1158},{"style":115},[1159],{"type":56,"value":1150},{"type":51,"tag":86,"props":1161,"children":1162},{"style":109},[1163],{"type":56,"value":382},{"type":51,"tag":86,"props":1165,"children":1166},{"style":136},[1167],{"type":56,"value":1168},"js",{"type":51,"tag":86,"props":1170,"children":1171},{"style":109},[1172],{"type":56,"value":1173},"|",{"type":51,"tag":86,"props":1175,"children":1176},{"style":136},[1177],{"type":56,"value":79},{"type":51,"tag":86,"props":1179,"children":1180},{"style":109},[1181],{"type":56,"value":1173},{"type":51,"tag":86,"props":1183,"children":1184},{"style":136},[1185],{"type":56,"value":1186},"jsx",{"type":51,"tag":86,"props":1188,"children":1189},{"style":109},[1190],{"type":56,"value":1173},{"type":51,"tag":86,"props":1192,"children":1193},{"style":136},[1194],{"type":56,"value":1195},"tsx",{"type":51,"tag":86,"props":1197,"children":1198},{"style":109},[1199],{"type":56,"value":1200},")",{"type":51,"tag":86,"props":1202,"children":1203},{"style":103},[1204],{"type":56,"value":1205},"$",{"type":51,"tag":86,"props":1207,"children":1208},{"style":109},[1209],{"type":56,"value":783},{"type":51,"tag":86,"props":1211,"children":1212},{"style":115},[1213],{"type":56,"value":1214},"]",{"type":51,"tag":86,"props":1216,"children":1217},{"style":109},[1218],{"type":56,"value":213},{"type":51,"tag":86,"props":1220,"children":1221},{"class":88,"line":196},[1222,1227,1231,1235,1239,1244,1248,1252,1256,1260,1264,1269,1273,1277,1281],{"type":51,"tag":86,"props":1223,"children":1224},{"style":180},[1225],{"type":56,"value":1226},"      components",{"type":51,"tag":86,"props":1228,"children":1229},{"style":109},[1230],{"type":56,"value":188},{"type":51,"tag":86,"props":1232,"children":1233},{"style":115},[1234],{"type":56,"value":446},{"type":51,"tag":86,"props":1236,"children":1237},{"style":109},[1238],{"type":56,"value":1118},{"type":51,"tag":86,"props":1240,"children":1241},{"style":136},[1242],{"type":56,"value":1243},"InternalComponent",{"type":51,"tag":86,"props":1245,"children":1246},{"style":109},[1247],{"type":56,"value":1118},{"type":51,"tag":86,"props":1249,"children":1250},{"style":109},[1251],{"type":56,"value":322},{"type":51,"tag":86,"props":1253,"children":1254},{"style":109},[1255],{"type":56,"value":1135},{"type":51,"tag":86,"props":1257,"children":1258},{"style":136},[1259],{"type":56,"value":1140},{"type":51,"tag":86,"props":1261,"children":1262},{"style":109},[1263],{"type":56,"value":1145},{"type":51,"tag":86,"props":1265,"children":1266},{"style":136},[1267],{"type":56,"value":1268},"Provider",{"type":51,"tag":86,"props":1270,"children":1271},{"style":103},[1272],{"type":56,"value":1205},{"type":51,"tag":86,"props":1274,"children":1275},{"style":109},[1276],{"type":56,"value":783},{"type":51,"tag":86,"props":1278,"children":1279},{"style":115},[1280],{"type":56,"value":1214},{"type":51,"tag":86,"props":1282,"children":1283},{"style":109},[1284],{"type":56,"value":213},{"type":51,"tag":86,"props":1286,"children":1287},{"class":88,"line":216},[1288],{"type":51,"tag":86,"props":1289,"children":1290},{"style":109},[1291],{"type":56,"value":1292},"    },\n",{"type":51,"tag":86,"props":1294,"children":1295},{"class":88,"line":225},[1296],{"type":51,"tag":86,"props":1297,"children":1298},{"style":109},[1299],{"type":56,"value":1300},"  },\n",{"type":51,"tag":86,"props":1302,"children":1303},{"class":88,"line":238},[1304,1308],{"type":51,"tag":86,"props":1305,"children":1306},{"style":109},[1307],{"type":56,"value":403},{"type":51,"tag":86,"props":1309,"children":1310},{"style":115},[1311],{"type":56,"value":408},{"type":51,"tag":873,"props":1313,"children":1315},{"id":1314},"console-piping",[1316],{"type":56,"value":1317},"Console Piping",{"type":51,"tag":52,"props":1319,"children":1320},{},[1321],{"type":56,"value":1322},"Bidirectional console piping between client and server. Injects runtime code (IIFE) into entry files that:",{"type":51,"tag":52,"props":1324,"children":1325},{},[1326],{"type":51,"tag":896,"props":1327,"children":1328},{},[1329],{"type":56,"value":1330},"Client side:",{"type":51,"tag":1332,"props":1333,"children":1334},"ol",{},[1335,1354,1367,1380],{"type":51,"tag":490,"props":1336,"children":1337},{},[1338,1340,1346,1348],{"type":56,"value":1339},"Wraps ",{"type":51,"tag":59,"props":1341,"children":1343},{"className":1342},[],[1344],{"type":56,"value":1345},"console[level]",{"type":56,"value":1347}," to batch and POST entries to ",{"type":51,"tag":59,"props":1349,"children":1351},{"className":1350},[],[1352],{"type":56,"value":1353},"\u002F__tsd\u002Fconsole-pipe",{"type":51,"tag":490,"props":1355,"children":1356},{},[1357,1359,1365],{"type":56,"value":1358},"Opens an EventSource on ",{"type":51,"tag":59,"props":1360,"children":1362},{"className":1361},[],[1363],{"type":56,"value":1364},"\u002F__tsd\u002Fconsole-pipe\u002Fsse",{"type":56,"value":1366}," to receive server logs",{"type":51,"tag":490,"props":1368,"children":1369},{},[1370,1372,1378],{"type":56,"value":1371},"Server logs appear in browser console with a purple ",{"type":51,"tag":59,"props":1373,"children":1375},{"className":1374},[],[1376],{"type":56,"value":1377},"[Server]",{"type":56,"value":1379}," prefix",{"type":51,"tag":490,"props":1381,"children":1382},{},[1383,1385,1391],{"type":56,"value":1384},"Client logs appear in terminal with a cyan ",{"type":51,"tag":59,"props":1386,"children":1388},{"className":1387},[],[1389],{"type":56,"value":1390},"[Client]",{"type":56,"value":1379},{"type":51,"tag":52,"props":1393,"children":1394},{},[1395],{"type":51,"tag":896,"props":1396,"children":1397},{},[1398],{"type":56,"value":1399},"Server side (SSR\u002FNitro):",{"type":51,"tag":1332,"props":1401,"children":1402},{},[1403,1419],{"type":51,"tag":490,"props":1404,"children":1405},{},[1406,1407,1412,1413],{"type":56,"value":1339},{"type":51,"tag":59,"props":1408,"children":1410},{"className":1409},[],[1411],{"type":56,"value":1345},{"type":56,"value":1347},{"type":51,"tag":59,"props":1414,"children":1416},{"className":1415},[],[1417],{"type":56,"value":1418},"\u003CviteServerUrl>\u002F__tsd\u002Fconsole-pipe\u002Fserver",{"type":51,"tag":490,"props":1420,"children":1421},{},[1422],{"type":56,"value":1423},"These are then broadcast to all SSE clients",{"type":51,"tag":52,"props":1425,"children":1426},{},[1427,1432,1434,1440,1442,1448,1449,1455,1456,1462,1464,1470,1472,1478],{"type":51,"tag":896,"props":1428,"children":1429},{},[1430],{"type":56,"value":1431},"Entry file detection:",{"type":56,"value":1433}," looks for ",{"type":51,"tag":59,"props":1435,"children":1437},{"className":1436},[],[1438],{"type":56,"value":1439},"\u003Chtml",{"type":56,"value":1441}," tag, ",{"type":51,"tag":59,"props":1443,"children":1445},{"className":1444},[],[1446],{"type":56,"value":1447},"StartClient",{"type":56,"value":846},{"type":51,"tag":59,"props":1450,"children":1452},{"className":1451},[],[1453],{"type":56,"value":1454},"hydrateRoot",{"type":56,"value":846},{"type":51,"tag":59,"props":1457,"children":1459},{"className":1458},[],[1460],{"type":56,"value":1461},"createRoot",{"type":56,"value":1463},", or ",{"type":51,"tag":59,"props":1465,"children":1467},{"className":1466},[],[1468],{"type":56,"value":1469},"solid-js\u002Fweb",{"type":56,"value":1471}," + ",{"type":51,"tag":59,"props":1473,"children":1475},{"className":1474},[],[1476],{"type":56,"value":1477},"render(",{"type":56,"value":1479}," in code.",{"type":51,"tag":52,"props":1481,"children":1482},{},[1483,1487,1488,1494,1495,1501],{"type":51,"tag":896,"props":1484,"children":1485},{},[1486],{"type":56,"value":1006},{"type":56,"value":1008},{"type":51,"tag":59,"props":1489,"children":1491},{"className":1490},[],[1492],{"type":56,"value":1493},"packages\u002Fdevtools-vite\u002Fsrc\u002Fvirtual-console.ts",{"type":56,"value":846},{"type":51,"tag":59,"props":1496,"children":1498},{"className":1497},[],[1499],{"type":56,"value":1500},"packages\u002Fdevtools-vite\u002Fsrc\u002Futils.ts",{"type":56,"value":1502}," (middleware handlers)",{"type":51,"tag":75,"props":1504,"children":1506},{"className":77,"code":1505,"language":79,"meta":80,"style":80},"devtools({\n  consolePiping: {\n    enabled: true,\n    levels: ['log', 'warn', 'error', 'info', 'debug'],\n  },\n})\n",[1507],{"type":51,"tag":59,"props":1508,"children":1509},{"__ignoreMap":80},[1510,1525,1541,1560,1665,1672],{"type":51,"tag":86,"props":1511,"children":1512},{"class":88,"line":89},[1513,1517,1521],{"type":51,"tag":86,"props":1514,"children":1515},{"style":200},[1516],{"type":56,"value":30},{"type":51,"tag":86,"props":1518,"children":1519},{"style":115},[1520],{"type":56,"value":382},{"type":51,"tag":86,"props":1522,"children":1523},{"style":109},[1524],{"type":56,"value":387},{"type":51,"tag":86,"props":1526,"children":1527},{"class":88,"line":99},[1528,1533,1537],{"type":51,"tag":86,"props":1529,"children":1530},{"style":180},[1531],{"type":56,"value":1532},"  consolePiping",{"type":51,"tag":86,"props":1534,"children":1535},{"style":109},[1536],{"type":56,"value":188},{"type":51,"tag":86,"props":1538,"children":1539},{"style":109},[1540],{"type":56,"value":173},{"type":51,"tag":86,"props":1542,"children":1543},{"class":88,"line":147},[1544,1548,1552,1556],{"type":51,"tag":86,"props":1545,"children":1546},{"style":180},[1547],{"type":56,"value":1067},{"type":51,"tag":86,"props":1549,"children":1550},{"style":109},[1551],{"type":56,"value":188},{"type":51,"tag":86,"props":1553,"children":1554},{"style":1074},[1555],{"type":56,"value":1077},{"type":51,"tag":86,"props":1557,"children":1558},{"style":109},[1559],{"type":56,"value":213},{"type":51,"tag":86,"props":1561,"children":1562},{"class":88,"line":157},[1563,1568,1572,1576,1580,1585,1589,1593,1597,1602,1606,1610,1614,1619,1623,1627,1631,1636,1640,1644,1648,1653,1657,1661],{"type":51,"tag":86,"props":1564,"children":1565},{"style":180},[1566],{"type":56,"value":1567},"    levels",{"type":51,"tag":86,"props":1569,"children":1570},{"style":109},[1571],{"type":56,"value":188},{"type":51,"tag":86,"props":1573,"children":1574},{"style":115},[1575],{"type":56,"value":446},{"type":51,"tag":86,"props":1577,"children":1578},{"style":109},[1579],{"type":56,"value":1118},{"type":51,"tag":86,"props":1581,"children":1582},{"style":136},[1583],{"type":56,"value":1584},"log",{"type":51,"tag":86,"props":1586,"children":1587},{"style":109},[1588],{"type":56,"value":1118},{"type":51,"tag":86,"props":1590,"children":1591},{"style":109},[1592],{"type":56,"value":322},{"type":51,"tag":86,"props":1594,"children":1595},{"style":109},[1596],{"type":56,"value":133},{"type":51,"tag":86,"props":1598,"children":1599},{"style":136},[1600],{"type":56,"value":1601},"warn",{"type":51,"tag":86,"props":1603,"children":1604},{"style":109},[1605],{"type":56,"value":1118},{"type":51,"tag":86,"props":1607,"children":1608},{"style":109},[1609],{"type":56,"value":322},{"type":51,"tag":86,"props":1611,"children":1612},{"style":109},[1613],{"type":56,"value":133},{"type":51,"tag":86,"props":1615,"children":1616},{"style":136},[1617],{"type":56,"value":1618},"error",{"type":51,"tag":86,"props":1620,"children":1621},{"style":109},[1622],{"type":56,"value":1118},{"type":51,"tag":86,"props":1624,"children":1625},{"style":109},[1626],{"type":56,"value":322},{"type":51,"tag":86,"props":1628,"children":1629},{"style":109},[1630],{"type":56,"value":133},{"type":51,"tag":86,"props":1632,"children":1633},{"style":136},[1634],{"type":56,"value":1635},"info",{"type":51,"tag":86,"props":1637,"children":1638},{"style":109},[1639],{"type":56,"value":1118},{"type":51,"tag":86,"props":1641,"children":1642},{"style":109},[1643],{"type":56,"value":322},{"type":51,"tag":86,"props":1645,"children":1646},{"style":109},[1647],{"type":56,"value":133},{"type":51,"tag":86,"props":1649,"children":1650},{"style":136},[1651],{"type":56,"value":1652},"debug",{"type":51,"tag":86,"props":1654,"children":1655},{"style":109},[1656],{"type":56,"value":1118},{"type":51,"tag":86,"props":1658,"children":1659},{"style":115},[1660],{"type":56,"value":1214},{"type":51,"tag":86,"props":1662,"children":1663},{"style":109},[1664],{"type":56,"value":213},{"type":51,"tag":86,"props":1666,"children":1667},{"class":88,"line":176},[1668],{"type":51,"tag":86,"props":1669,"children":1670},{"style":109},[1671],{"type":56,"value":1300},{"type":51,"tag":86,"props":1673,"children":1674},{"class":88,"line":196},[1675,1679],{"type":51,"tag":86,"props":1676,"children":1677},{"style":109},[1678],{"type":56,"value":403},{"type":51,"tag":86,"props":1680,"children":1681},{"style":115},[1682],{"type":56,"value":408},{"type":51,"tag":873,"props":1684,"children":1686},{"id":1685},"enhanced-logging",[1687],{"type":56,"value":1688},"Enhanced Logging",{"type":51,"tag":52,"props":1690,"children":1691},{},[1692,1694,1700,1701,1707,1709,1715],{"type":56,"value":1693},"AST transform that prepends source location info to ",{"type":51,"tag":59,"props":1695,"children":1697},{"className":1696},[],[1698],{"type":56,"value":1699},"console.log()",{"type":56,"value":916},{"type":51,"tag":59,"props":1702,"children":1704},{"className":1703},[],[1705],{"type":56,"value":1706},"console.error()",{"type":56,"value":1708}," calls. In the browser, this renders as a clickable \"Go to Source\" link. On the server, it shows ",{"type":51,"tag":59,"props":1710,"children":1712},{"className":1711},[],[1713],{"type":56,"value":1714},"LOG \u003Cpath>:\u003Cline>:\u003Ccolumn>",{"type":56,"value":1716}," in chalk colors.",{"type":51,"tag":52,"props":1718,"children":1719},{},[1720,1722,1728],{"type":56,"value":1721},"The transform inserts a spread of a conditional expression: ",{"type":51,"tag":59,"props":1723,"children":1725},{"className":1724},[],[1726],{"type":56,"value":1727},"...(typeof window === 'undefined' ? serverLogMessage : browserLogMessage)",{"type":56,"value":1729}," as the first argument of the console call.",{"type":51,"tag":52,"props":1731,"children":1732},{},[1733,1738,1739],{"type":51,"tag":896,"props":1734,"children":1735},{},[1736],{"type":56,"value":1737},"Source file:",{"type":56,"value":1008},{"type":51,"tag":59,"props":1740,"children":1742},{"className":1741},[],[1743],{"type":56,"value":1744},"packages\u002Fdevtools-vite\u002Fsrc\u002Fenhance-logs.ts",{"type":51,"tag":75,"props":1746,"children":1748},{"className":77,"code":1747,"language":79,"meta":80,"style":80},"devtools({\n  enhancedLogs: {\n    enabled: true, \u002F\u002F default\n  },\n})\n",[1749],{"type":51,"tag":59,"props":1750,"children":1751},{"__ignoreMap":80},[1752,1767,1783,1807,1814],{"type":51,"tag":86,"props":1753,"children":1754},{"class":88,"line":89},[1755,1759,1763],{"type":51,"tag":86,"props":1756,"children":1757},{"style":200},[1758],{"type":56,"value":30},{"type":51,"tag":86,"props":1760,"children":1761},{"style":115},[1762],{"type":56,"value":382},{"type":51,"tag":86,"props":1764,"children":1765},{"style":109},[1766],{"type":56,"value":387},{"type":51,"tag":86,"props":1768,"children":1769},{"class":88,"line":99},[1770,1775,1779],{"type":51,"tag":86,"props":1771,"children":1772},{"style":180},[1773],{"type":56,"value":1774},"  enhancedLogs",{"type":51,"tag":86,"props":1776,"children":1777},{"style":109},[1778],{"type":56,"value":188},{"type":51,"tag":86,"props":1780,"children":1781},{"style":109},[1782],{"type":56,"value":173},{"type":51,"tag":86,"props":1784,"children":1785},{"class":88,"line":147},[1786,1790,1794,1798,1802],{"type":51,"tag":86,"props":1787,"children":1788},{"style":180},[1789],{"type":56,"value":1067},{"type":51,"tag":86,"props":1791,"children":1792},{"style":109},[1793],{"type":56,"value":188},{"type":51,"tag":86,"props":1795,"children":1796},{"style":1074},[1797],{"type":56,"value":1077},{"type":51,"tag":86,"props":1799,"children":1800},{"style":109},[1801],{"type":56,"value":322},{"type":51,"tag":86,"props":1803,"children":1804},{"style":93},[1805],{"type":56,"value":1806}," \u002F\u002F default\n",{"type":51,"tag":86,"props":1808,"children":1809},{"class":88,"line":157},[1810],{"type":51,"tag":86,"props":1811,"children":1812},{"style":109},[1813],{"type":56,"value":1300},{"type":51,"tag":86,"props":1815,"children":1816},{"class":88,"line":176},[1817,1821],{"type":51,"tag":86,"props":1818,"children":1819},{"style":109},[1820],{"type":56,"value":403},{"type":51,"tag":86,"props":1822,"children":1823},{"style":115},[1824],{"type":56,"value":408},{"type":51,"tag":873,"props":1826,"children":1828},{"id":1827},"production-stripping",[1829],{"type":56,"value":1830},"Production Stripping",{"type":51,"tag":52,"props":1832,"children":1833},{},[1834],{"type":56,"value":1835},"Removes all devtools code from production builds. The transform:",{"type":51,"tag":1332,"props":1837,"children":1838},{},[1839,1878,1883,1888],{"type":51,"tag":490,"props":1840,"children":1841},{},[1842,1844,1850,1851,1857,1858,1864,1865,1871,1872],{"type":56,"value":1843},"Finds files importing from these packages: ",{"type":51,"tag":59,"props":1845,"children":1847},{"className":1846},[],[1848],{"type":56,"value":1849},"@tanstack\u002Freact-devtools",{"type":56,"value":846},{"type":51,"tag":59,"props":1852,"children":1854},{"className":1853},[],[1855],{"type":56,"value":1856},"@tanstack\u002Fpreact-devtools",{"type":56,"value":846},{"type":51,"tag":59,"props":1859,"children":1861},{"className":1860},[],[1862],{"type":56,"value":1863},"@tanstack\u002Fsolid-devtools",{"type":56,"value":846},{"type":51,"tag":59,"props":1866,"children":1868},{"className":1867},[],[1869],{"type":56,"value":1870},"@tanstack\u002Fvue-devtools",{"type":56,"value":846},{"type":51,"tag":59,"props":1873,"children":1875},{"className":1874},[],[1876],{"type":56,"value":1877},"@tanstack\u002Fdevtools",{"type":51,"tag":490,"props":1879,"children":1880},{},[1881],{"type":56,"value":1882},"Removes the import declarations",{"type":51,"tag":490,"props":1884,"children":1885},{},[1886],{"type":56,"value":1887},"Removes the JSX elements that use the imported components",{"type":51,"tag":490,"props":1889,"children":1890},{},[1891],{"type":56,"value":1892},"Cleans up leftover imports that were only used inside the removed JSX (e.g., plugin panel components)",{"type":51,"tag":52,"props":1894,"children":1895},{},[1896,1898,1904,1906,1912,1914,1920],{"type":56,"value":1897},"Active when: ",{"type":51,"tag":59,"props":1899,"children":1901},{"className":1900},[],[1902],{"type":56,"value":1903},"command !== 'serve'",{"type":56,"value":1905}," OR ",{"type":51,"tag":59,"props":1907,"children":1909},{"className":1908},[],[1910],{"type":56,"value":1911},"config.mode === 'production'",{"type":56,"value":1913}," (handles hosting providers like Cloudflare\u002FNetlify that may not use ",{"type":51,"tag":59,"props":1915,"children":1917},{"className":1916},[],[1918],{"type":56,"value":1919},"build",{"type":56,"value":1921}," command but set mode to production).",{"type":51,"tag":52,"props":1923,"children":1924},{},[1925,1929,1930],{"type":51,"tag":896,"props":1926,"children":1927},{},[1928],{"type":56,"value":1737},{"type":56,"value":1008},{"type":51,"tag":59,"props":1931,"children":1933},{"className":1932},[],[1934],{"type":56,"value":1935},"packages\u002Fdevtools-vite\u002Fsrc\u002Fremove-devtools.ts",{"type":51,"tag":75,"props":1937,"children":1939},{"className":77,"code":1938,"language":79,"meta":80,"style":80},"devtools({\n  removeDevtoolsOnBuild: true, \u002F\u002F default\n})\n",[1940],{"type":51,"tag":59,"props":1941,"children":1942},{"__ignoreMap":80},[1943,1958,1982],{"type":51,"tag":86,"props":1944,"children":1945},{"class":88,"line":89},[1946,1950,1954],{"type":51,"tag":86,"props":1947,"children":1948},{"style":200},[1949],{"type":56,"value":30},{"type":51,"tag":86,"props":1951,"children":1952},{"style":115},[1953],{"type":56,"value":382},{"type":51,"tag":86,"props":1955,"children":1956},{"style":109},[1957],{"type":56,"value":387},{"type":51,"tag":86,"props":1959,"children":1960},{"class":88,"line":99},[1961,1966,1970,1974,1978],{"type":51,"tag":86,"props":1962,"children":1963},{"style":180},[1964],{"type":56,"value":1965},"  removeDevtoolsOnBuild",{"type":51,"tag":86,"props":1967,"children":1968},{"style":109},[1969],{"type":56,"value":188},{"type":51,"tag":86,"props":1971,"children":1972},{"style":1074},[1973],{"type":56,"value":1077},{"type":51,"tag":86,"props":1975,"children":1976},{"style":109},[1977],{"type":56,"value":322},{"type":51,"tag":86,"props":1979,"children":1980},{"style":93},[1981],{"type":56,"value":1806},{"type":51,"tag":86,"props":1983,"children":1984},{"class":88,"line":147},[1985,1989],{"type":51,"tag":86,"props":1986,"children":1987},{"style":109},[1988],{"type":56,"value":403},{"type":51,"tag":86,"props":1990,"children":1991},{"style":115},[1992],{"type":56,"value":408},{"type":51,"tag":873,"props":1994,"children":1996},{"id":1995},"server-event-bus",[1997],{"type":56,"value":1998},"Server Event Bus",{"type":51,"tag":52,"props":2000,"children":2001},{},[2002,2004,2010],{"type":56,"value":2003},"A WebSocket + SSE server for devtools-to-client communication. Managed by ",{"type":51,"tag":59,"props":2005,"children":2007},{"className":2006},[],[2008],{"type":56,"value":2009},"@tanstack\u002Fdevtools-event-bus\u002Fserver",{"type":56,"value":1140},{"type":51,"tag":52,"props":2012,"children":2013},{},[2014],{"type":51,"tag":896,"props":2015,"children":2016},{},[2017],{"type":56,"value":900},{"type":51,"tag":486,"props":2019,"children":2020},{},[2021,2026,2031,2036,2049],{"type":51,"tag":490,"props":2022,"children":2023},{},[2024],{"type":56,"value":2025},"Default port: 4206",{"type":51,"tag":490,"props":2027,"children":2028},{},[2029],{"type":56,"value":2030},"On EADDRINUSE: falls back to OS-assigned port (port 0)",{"type":51,"tag":490,"props":2032,"children":2033},{},[2034],{"type":56,"value":2035},"When Vite uses HTTPS: piggybacks on Vite's httpServer instead of creating a standalone one (shares TLS certificate)",{"type":51,"tag":490,"props":2037,"children":2038},{},[2039,2041,2047],{"type":56,"value":2040},"Uses global variables (",{"type":51,"tag":59,"props":2042,"children":2044},{"className":2043},[],[2045],{"type":56,"value":2046},"__TANSTACK_DEVTOOLS_SERVER__",{"type":56,"value":2048},", etc.) to survive HMR without restarting",{"type":51,"tag":490,"props":2050,"children":2051},{},[2052,2054,2059],{"type":56,"value":2053},"The actual port is injected into client code via ",{"type":51,"tag":59,"props":2055,"children":2057},{"className":2056},[],[2058],{"type":56,"value":844},{"type":56,"value":2060}," placeholder replacement",{"type":51,"tag":52,"props":2062,"children":2063},{},[2064,2068,2069],{"type":51,"tag":896,"props":2065,"children":2066},{},[2067],{"type":56,"value":1737},{"type":56,"value":1008},{"type":51,"tag":59,"props":2070,"children":2072},{"className":2071},[],[2073],{"type":56,"value":2074},"packages\u002Fevent-bus\u002Fsrc\u002Fserver\u002Fserver.ts",{"type":51,"tag":75,"props":2076,"children":2078},{"className":77,"code":2077,"language":79,"meta":80,"style":80},"devtools({\n  eventBusConfig: {\n    port: 4206, \u002F\u002F default\n    enabled: true, \u002F\u002F default; set false for storybook\u002Fvitest\n    debug: false, \u002F\u002F default; logs internal bus activity\n  },\n})\n",[2079],{"type":51,"tag":59,"props":2080,"children":2081},{"__ignoreMap":80},[2082,2097,2113,2139,2163,2189,2196],{"type":51,"tag":86,"props":2083,"children":2084},{"class":88,"line":89},[2085,2089,2093],{"type":51,"tag":86,"props":2086,"children":2087},{"style":200},[2088],{"type":56,"value":30},{"type":51,"tag":86,"props":2090,"children":2091},{"style":115},[2092],{"type":56,"value":382},{"type":51,"tag":86,"props":2094,"children":2095},{"style":109},[2096],{"type":56,"value":387},{"type":51,"tag":86,"props":2098,"children":2099},{"class":88,"line":99},[2100,2105,2109],{"type":51,"tag":86,"props":2101,"children":2102},{"style":180},[2103],{"type":56,"value":2104},"  eventBusConfig",{"type":51,"tag":86,"props":2106,"children":2107},{"style":109},[2108],{"type":56,"value":188},{"type":51,"tag":86,"props":2110,"children":2111},{"style":109},[2112],{"type":56,"value":173},{"type":51,"tag":86,"props":2114,"children":2115},{"class":88,"line":147},[2116,2121,2125,2131,2135],{"type":51,"tag":86,"props":2117,"children":2118},{"style":180},[2119],{"type":56,"value":2120},"    port",{"type":51,"tag":86,"props":2122,"children":2123},{"style":109},[2124],{"type":56,"value":188},{"type":51,"tag":86,"props":2126,"children":2128},{"style":2127},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[2129],{"type":56,"value":2130}," 4206",{"type":51,"tag":86,"props":2132,"children":2133},{"style":109},[2134],{"type":56,"value":322},{"type":51,"tag":86,"props":2136,"children":2137},{"style":93},[2138],{"type":56,"value":1806},{"type":51,"tag":86,"props":2140,"children":2141},{"class":88,"line":157},[2142,2146,2150,2154,2158],{"type":51,"tag":86,"props":2143,"children":2144},{"style":180},[2145],{"type":56,"value":1067},{"type":51,"tag":86,"props":2147,"children":2148},{"style":109},[2149],{"type":56,"value":188},{"type":51,"tag":86,"props":2151,"children":2152},{"style":1074},[2153],{"type":56,"value":1077},{"type":51,"tag":86,"props":2155,"children":2156},{"style":109},[2157],{"type":56,"value":322},{"type":51,"tag":86,"props":2159,"children":2160},{"style":93},[2161],{"type":56,"value":2162}," \u002F\u002F default; set false for storybook\u002Fvitest\n",{"type":51,"tag":86,"props":2164,"children":2165},{"class":88,"line":176},[2166,2171,2175,2180,2184],{"type":51,"tag":86,"props":2167,"children":2168},{"style":180},[2169],{"type":56,"value":2170},"    debug",{"type":51,"tag":86,"props":2172,"children":2173},{"style":109},[2174],{"type":56,"value":188},{"type":51,"tag":86,"props":2176,"children":2177},{"style":1074},[2178],{"type":56,"value":2179}," false",{"type":51,"tag":86,"props":2181,"children":2182},{"style":109},[2183],{"type":56,"value":322},{"type":51,"tag":86,"props":2185,"children":2186},{"style":93},[2187],{"type":56,"value":2188}," \u002F\u002F default; logs internal bus activity\n",{"type":51,"tag":86,"props":2190,"children":2191},{"class":88,"line":196},[2192],{"type":51,"tag":86,"props":2193,"children":2194},{"style":109},[2195],{"type":56,"value":1300},{"type":51,"tag":86,"props":2197,"children":2198},{"class":88,"line":216},[2199,2203],{"type":51,"tag":86,"props":2200,"children":2201},{"style":109},[2202],{"type":56,"value":403},{"type":51,"tag":86,"props":2204,"children":2205},{"style":115},[2206],{"type":56,"value":408},{"type":51,"tag":873,"props":2208,"children":2210},{"id":2209},"editor-integration",[2211],{"type":56,"value":2212},"Editor Integration",{"type":51,"tag":52,"props":2214,"children":2215},{},[2216,2218,2224,2226,2232,2234,2240],{"type":56,"value":2217},"Uses ",{"type":51,"tag":59,"props":2219,"children":2221},{"className":2220},[],[2222],{"type":56,"value":2223},"launch-editor",{"type":56,"value":2225}," to open source files in the editor. Default editor is VS Code. The ",{"type":51,"tag":59,"props":2227,"children":2229},{"className":2228},[],[2230],{"type":56,"value":2231},"editor.open",{"type":56,"value":2233}," callback receives ",{"type":51,"tag":59,"props":2235,"children":2237},{"className":2236},[],[2238],{"type":56,"value":2239},"(path, lineNumber, columnNumber)",{"type":56,"value":2241}," as strings.",{"type":51,"tag":52,"props":2243,"children":2244},{},[2245,2247,2253,2255,2260],{"type":56,"value":2246},"The open-source flow: browser requests ",{"type":51,"tag":59,"props":2248,"children":2250},{"className":2249},[],[2251],{"type":56,"value":2252},"\u002F__tsd\u002Fopen-source?source=\u003Cencoded-path:line:col>",{"type":56,"value":2254}," --> Vite middleware parses source param --> calls ",{"type":51,"tag":59,"props":2256,"children":2258},{"className":2257},[],[2259],{"type":56,"value":2231},{"type":56,"value":1140},{"type":51,"tag":52,"props":2262,"children":2263},{},[2264,2266,2271],{"type":56,"value":2265},"Supported editors via launch-editor: VS Code, WebStorm, Sublime Text, Atom, and more. For unsupported editors, provide a custom ",{"type":51,"tag":59,"props":2267,"children":2269},{"className":2268},[],[2270],{"type":56,"value":2231},{"type":56,"value":2272}," function.",{"type":51,"tag":52,"props":2274,"children":2275},{},[2276,2280,2281],{"type":51,"tag":896,"props":2277,"children":2278},{},[2279],{"type":56,"value":1737},{"type":56,"value":1008},{"type":51,"tag":59,"props":2282,"children":2284},{"className":2283},[],[2285],{"type":56,"value":2286},"packages\u002Fdevtools-vite\u002Fsrc\u002Feditor.ts",{"type":51,"tag":75,"props":2288,"children":2290},{"className":77,"code":2289,"language":79,"meta":80,"style":80},"devtools({\n  editor: {\n    name: 'Cursor',\n    open: async (path, lineNumber, columnNumber) => {\n      \u002F\u002F Custom editor open logic\n      \u002F\u002F path is the absolute file path\n      \u002F\u002F lineNumber and columnNumber are strings or undefined\n    },\n  },\n})\n",[2291],{"type":51,"tag":59,"props":2292,"children":2293},{"__ignoreMap":80},[2294,2309,2325,2354,2413,2421,2429,2437,2444,2451],{"type":51,"tag":86,"props":2295,"children":2296},{"class":88,"line":89},[2297,2301,2305],{"type":51,"tag":86,"props":2298,"children":2299},{"style":200},[2300],{"type":56,"value":30},{"type":51,"tag":86,"props":2302,"children":2303},{"style":115},[2304],{"type":56,"value":382},{"type":51,"tag":86,"props":2306,"children":2307},{"style":109},[2308],{"type":56,"value":387},{"type":51,"tag":86,"props":2310,"children":2311},{"class":88,"line":99},[2312,2317,2321],{"type":51,"tag":86,"props":2313,"children":2314},{"style":180},[2315],{"type":56,"value":2316},"  editor",{"type":51,"tag":86,"props":2318,"children":2319},{"style":109},[2320],{"type":56,"value":188},{"type":51,"tag":86,"props":2322,"children":2323},{"style":109},[2324],{"type":56,"value":173},{"type":51,"tag":86,"props":2326,"children":2327},{"class":88,"line":147},[2328,2333,2337,2341,2346,2350],{"type":51,"tag":86,"props":2329,"children":2330},{"style":180},[2331],{"type":56,"value":2332},"    name",{"type":51,"tag":86,"props":2334,"children":2335},{"style":109},[2336],{"type":56,"value":188},{"type":51,"tag":86,"props":2338,"children":2339},{"style":109},[2340],{"type":56,"value":133},{"type":51,"tag":86,"props":2342,"children":2343},{"style":136},[2344],{"type":56,"value":2345},"Cursor",{"type":51,"tag":86,"props":2347,"children":2348},{"style":109},[2349],{"type":56,"value":1118},{"type":51,"tag":86,"props":2351,"children":2352},{"style":109},[2353],{"type":56,"value":213},{"type":51,"tag":86,"props":2355,"children":2356},{"class":88,"line":157},[2357,2362,2366,2371,2376,2382,2386,2391,2395,2400,2404,2409],{"type":51,"tag":86,"props":2358,"children":2359},{"style":200},[2360],{"type":56,"value":2361},"    open",{"type":51,"tag":86,"props":2363,"children":2364},{"style":109},[2365],{"type":56,"value":188},{"type":51,"tag":86,"props":2367,"children":2368},{"style":360},[2369],{"type":56,"value":2370}," async",{"type":51,"tag":86,"props":2372,"children":2373},{"style":109},[2374],{"type":56,"value":2375}," (",{"type":51,"tag":86,"props":2377,"children":2379},{"style":2378},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic",[2380],{"type":56,"value":2381},"path",{"type":51,"tag":86,"props":2383,"children":2384},{"style":109},[2385],{"type":56,"value":322},{"type":51,"tag":86,"props":2387,"children":2388},{"style":2378},[2389],{"type":56,"value":2390}," lineNumber",{"type":51,"tag":86,"props":2392,"children":2393},{"style":109},[2394],{"type":56,"value":322},{"type":51,"tag":86,"props":2396,"children":2397},{"style":2378},[2398],{"type":56,"value":2399}," columnNumber",{"type":51,"tag":86,"props":2401,"children":2402},{"style":109},[2403],{"type":56,"value":1200},{"type":51,"tag":86,"props":2405,"children":2406},{"style":360},[2407],{"type":56,"value":2408}," =>",{"type":51,"tag":86,"props":2410,"children":2411},{"style":109},[2412],{"type":56,"value":173},{"type":51,"tag":86,"props":2414,"children":2415},{"class":88,"line":176},[2416],{"type":51,"tag":86,"props":2417,"children":2418},{"style":93},[2419],{"type":56,"value":2420},"      \u002F\u002F Custom editor open logic\n",{"type":51,"tag":86,"props":2422,"children":2423},{"class":88,"line":196},[2424],{"type":51,"tag":86,"props":2425,"children":2426},{"style":93},[2427],{"type":56,"value":2428},"      \u002F\u002F path is the absolute file path\n",{"type":51,"tag":86,"props":2430,"children":2431},{"class":88,"line":216},[2432],{"type":51,"tag":86,"props":2433,"children":2434},{"style":93},[2435],{"type":56,"value":2436},"      \u002F\u002F lineNumber and columnNumber are strings or undefined\n",{"type":51,"tag":86,"props":2438,"children":2439},{"class":88,"line":225},[2440],{"type":51,"tag":86,"props":2441,"children":2442},{"style":109},[2443],{"type":56,"value":1292},{"type":51,"tag":86,"props":2445,"children":2446},{"class":88,"line":238},[2447],{"type":51,"tag":86,"props":2448,"children":2449},{"style":109},[2450],{"type":56,"value":1300},{"type":51,"tag":86,"props":2452,"children":2454},{"class":88,"line":2453},10,[2455,2459],{"type":51,"tag":86,"props":2456,"children":2457},{"style":109},[2458],{"type":56,"value":403},{"type":51,"tag":86,"props":2460,"children":2461},{"style":115},[2462],{"type":56,"value":408},{"type":51,"tag":873,"props":2464,"children":2466},{"id":2465},"plugin-marketplace",[2467],{"type":56,"value":2468},"Plugin Marketplace",{"type":51,"tag":52,"props":2470,"children":2471},{},[2472,2474,2480],{"type":56,"value":2473},"When the dev server is running, listens for events via ",{"type":51,"tag":59,"props":2475,"children":2477},{"className":2476},[],[2478],{"type":56,"value":2479},"devtoolsEventClient",{"type":56,"value":188},{"type":51,"tag":486,"props":2482,"children":2483},{},[2484,2495,2512,2523],{"type":51,"tag":490,"props":2485,"children":2486},{},[2487,2493],{"type":51,"tag":59,"props":2488,"children":2490},{"className":2489},[],[2491],{"type":56,"value":2492},"install-devtools",{"type":56,"value":2494}," -- runs package manager install, then auto-injects plugin into devtools setup file",{"type":51,"tag":490,"props":2496,"children":2497},{},[2498,2504,2506],{"type":51,"tag":59,"props":2499,"children":2501},{"className":2500},[],[2502],{"type":56,"value":2503},"add-plugin-to-devtools",{"type":56,"value":2505}," -- injects plugin import and JSX\u002Ffunction call into the file containing ",{"type":51,"tag":59,"props":2507,"children":2509},{"className":2508},[],[2510],{"type":56,"value":2511},"\u003CTanStackDevtools>",{"type":51,"tag":490,"props":2513,"children":2514},{},[2515,2521],{"type":51,"tag":59,"props":2516,"children":2518},{"className":2517},[],[2519],{"type":56,"value":2520},"bump-package-version",{"type":56,"value":2522}," -- updates a package to a minimum version",{"type":51,"tag":490,"props":2524,"children":2525},{},[2526,2532],{"type":51,"tag":59,"props":2527,"children":2529},{"className":2528},[],[2530],{"type":56,"value":2531},"mounted",{"type":56,"value":2533}," -- sends package.json and outdated deps to the UI",{"type":51,"tag":52,"props":2535,"children":2536},{},[2537,2539,2545,2547,2552,2553,2558,2559,2564],{"type":56,"value":2538},"Auto-detection of the devtools setup file: the ",{"type":51,"tag":59,"props":2540,"children":2542},{"className":2541},[],[2543],{"type":56,"value":2544},"inject-plugin",{"type":56,"value":2546}," sub-plugin scans transforms for files importing from ",{"type":51,"tag":59,"props":2548,"children":2550},{"className":2549},[],[2551],{"type":56,"value":1849},{"type":56,"value":846},{"type":51,"tag":59,"props":2554,"children":2556},{"className":2555},[],[2557],{"type":56,"value":1863},{"type":56,"value":846},{"type":51,"tag":59,"props":2560,"children":2562},{"className":2561},[],[2563],{"type":56,"value":1870},{"type":56,"value":2565},", etc., and stores the file ID.",{"type":51,"tag":52,"props":2567,"children":2568},{},[2569,2573,2574,2580,2581],{"type":51,"tag":896,"props":2570,"children":2571},{},[2572],{"type":56,"value":1006},{"type":56,"value":1008},{"type":51,"tag":59,"props":2575,"children":2577},{"className":2576},[],[2578],{"type":56,"value":2579},"packages\u002Fdevtools-vite\u002Fsrc\u002Finject-plugin.ts",{"type":56,"value":846},{"type":51,"tag":59,"props":2582,"children":2584},{"className":2583},[],[2585],{"type":56,"value":2586},"packages\u002Fdevtools-vite\u002Fsrc\u002Fpackage-manager.ts",{"type":51,"tag":68,"props":2588,"children":2590},{"id":2589},"common-mistakes",[2591],{"type":56,"value":2592},"Common Mistakes",{"type":51,"tag":873,"props":2594,"children":2596},{"id":2595},"_1-not-placing-devtools-first-in-vite-plugins-high",[2597],{"type":56,"value":2598},"1. Not placing devtools() first in Vite plugins (HIGH)",{"type":51,"tag":52,"props":2600,"children":2601},{},[2602,2604,2609],{"type":56,"value":2603},"All sub-plugins use ",{"type":51,"tag":59,"props":2605,"children":2607},{"className":2606},[],[2608],{"type":56,"value":64},{"type":56,"value":2610},". They must transform code before framework plugins (React, Vue, Solid, etc.) process it. If devtools is not first, source injection and enhanced logs may silently fail because framework transforms remove the raw JSX before devtools can annotate it.",{"type":51,"tag":75,"props":2612,"children":2614},{"className":77,"code":2613,"language":79,"meta":80,"style":80},"\u002F\u002F WRONG\nexport default {\n  plugins: [\n    react(),\n    devtools(), \u002F\u002F too late -- react() already transformed JSX\n  ],\n}\n\n\u002F\u002F CORRECT\nexport default {\n  plugins: [devtools(), react()],\n}\n",[2615],{"type":51,"tag":59,"props":2616,"children":2617},{"__ignoreMap":80},[2618,2626,2641,2656,2672,2692,2703,2710,2717,2725,2740,2782],{"type":51,"tag":86,"props":2619,"children":2620},{"class":88,"line":89},[2621],{"type":51,"tag":86,"props":2622,"children":2623},{"style":93},[2624],{"type":56,"value":2625},"\u002F\u002F WRONG\n",{"type":51,"tag":86,"props":2627,"children":2628},{"class":88,"line":99},[2629,2633,2637],{"type":51,"tag":86,"props":2630,"children":2631},{"style":103},[2632],{"type":56,"value":163},{"type":51,"tag":86,"props":2634,"children":2635},{"style":103},[2636],{"type":56,"value":168},{"type":51,"tag":86,"props":2638,"children":2639},{"style":109},[2640],{"type":56,"value":173},{"type":51,"tag":86,"props":2642,"children":2643},{"class":88,"line":147},[2644,2648,2652],{"type":51,"tag":86,"props":2645,"children":2646},{"style":180},[2647],{"type":56,"value":183},{"type":51,"tag":86,"props":2649,"children":2650},{"style":109},[2651],{"type":56,"value":188},{"type":51,"tag":86,"props":2653,"children":2654},{"style":115},[2655],{"type":56,"value":193},{"type":51,"tag":86,"props":2657,"children":2658},{"class":88,"line":157},[2659,2664,2668],{"type":51,"tag":86,"props":2660,"children":2661},{"style":200},[2662],{"type":56,"value":2663},"    react",{"type":51,"tag":86,"props":2665,"children":2666},{"style":115},[2667],{"type":56,"value":208},{"type":51,"tag":86,"props":2669,"children":2670},{"style":109},[2671],{"type":56,"value":213},{"type":51,"tag":86,"props":2673,"children":2674},{"class":88,"line":176},[2675,2679,2683,2687],{"type":51,"tag":86,"props":2676,"children":2677},{"style":200},[2678],{"type":56,"value":203},{"type":51,"tag":86,"props":2680,"children":2681},{"style":115},[2682],{"type":56,"value":208},{"type":51,"tag":86,"props":2684,"children":2685},{"style":109},[2686],{"type":56,"value":322},{"type":51,"tag":86,"props":2688,"children":2689},{"style":93},[2690],{"type":56,"value":2691}," \u002F\u002F too late -- react() already transformed JSX\n",{"type":51,"tag":86,"props":2693,"children":2694},{"class":88,"line":196},[2695,2699],{"type":51,"tag":86,"props":2696,"children":2697},{"style":115},[2698],{"type":56,"value":231},{"type":51,"tag":86,"props":2700,"children":2701},{"style":109},[2702],{"type":56,"value":213},{"type":51,"tag":86,"props":2704,"children":2705},{"class":88,"line":216},[2706],{"type":51,"tag":86,"props":2707,"children":2708},{"style":109},[2709],{"type":56,"value":244},{"type":51,"tag":86,"props":2711,"children":2712},{"class":88,"line":225},[2713],{"type":51,"tag":86,"props":2714,"children":2715},{"emptyLinePlaceholder":151},[2716],{"type":56,"value":154},{"type":51,"tag":86,"props":2718,"children":2719},{"class":88,"line":238},[2720],{"type":51,"tag":86,"props":2721,"children":2722},{"style":93},[2723],{"type":56,"value":2724},"\u002F\u002F CORRECT\n",{"type":51,"tag":86,"props":2726,"children":2727},{"class":88,"line":2453},[2728,2732,2736],{"type":51,"tag":86,"props":2729,"children":2730},{"style":103},[2731],{"type":56,"value":163},{"type":51,"tag":86,"props":2733,"children":2734},{"style":103},[2735],{"type":56,"value":168},{"type":51,"tag":86,"props":2737,"children":2738},{"style":109},[2739],{"type":56,"value":173},{"type":51,"tag":86,"props":2741,"children":2743},{"class":88,"line":2742},11,[2744,2748,2752,2756,2760,2764,2768,2773,2778],{"type":51,"tag":86,"props":2745,"children":2746},{"style":180},[2747],{"type":56,"value":183},{"type":51,"tag":86,"props":2749,"children":2750},{"style":109},[2751],{"type":56,"value":188},{"type":51,"tag":86,"props":2753,"children":2754},{"style":115},[2755],{"type":56,"value":446},{"type":51,"tag":86,"props":2757,"children":2758},{"style":200},[2759],{"type":56,"value":30},{"type":51,"tag":86,"props":2761,"children":2762},{"style":115},[2763],{"type":56,"value":208},{"type":51,"tag":86,"props":2765,"children":2766},{"style":109},[2767],{"type":56,"value":322},{"type":51,"tag":86,"props":2769,"children":2770},{"style":200},[2771],{"type":56,"value":2772}," react",{"type":51,"tag":86,"props":2774,"children":2775},{"style":115},[2776],{"type":56,"value":2777},"()]",{"type":51,"tag":86,"props":2779,"children":2780},{"style":109},[2781],{"type":56,"value":213},{"type":51,"tag":86,"props":2783,"children":2785},{"class":88,"line":2784},12,[2786],{"type":51,"tag":86,"props":2787,"children":2788},{"style":109},[2789],{"type":56,"value":244},{"type":51,"tag":873,"props":2791,"children":2793},{"id":2792},"_2-using-devtools-vite-with-non-vite-bundlers-high",[2794],{"type":56,"value":2795},"2. Using devtools-vite with non-Vite bundlers (HIGH)",{"type":51,"tag":52,"props":2797,"children":2798},{},[2799,2804,2806,2812,2814,2820,2821,2827,2828,2834,2836,2842,2844,2850],{"type":51,"tag":59,"props":2800,"children":2802},{"className":2801},[],[2803],{"type":56,"value":139},{"type":56,"value":2805}," has a peer dependency on ",{"type":51,"tag":59,"props":2807,"children":2809},{"className":2808},[],[2810],{"type":56,"value":2811},"vite ^6.0.0 || ^7.0.0",{"type":56,"value":2813},". It uses Vite-specific APIs (",{"type":51,"tag":59,"props":2815,"children":2817},{"className":2816},[],[2818],{"type":56,"value":2819},"configureServer",{"type":56,"value":846},{"type":51,"tag":59,"props":2822,"children":2824},{"className":2823},[],[2825],{"type":56,"value":2826},"handleHotUpdate",{"type":56,"value":846},{"type":51,"tag":59,"props":2829,"children":2831},{"className":2830},[],[2832],{"type":56,"value":2833},"transform",{"type":56,"value":2835}," with filter objects, ",{"type":51,"tag":59,"props":2837,"children":2839},{"className":2838},[],[2840],{"type":56,"value":2841},"Plugin",{"type":56,"value":2843}," type). It will not work with webpack, rspack, esbuild, or other bundlers. For non-Vite setups, use ",{"type":51,"tag":59,"props":2845,"children":2847},{"className":2846},[],[2848],{"type":56,"value":2849},"@tanstack\u002Fdevtools-event-bus",{"type":56,"value":2851}," client directly without the Vite plugin.",{"type":51,"tag":873,"props":2853,"children":2855},{"id":2854},"_3-expecting-vite-plugin-features-in-production-medium",[2856],{"type":56,"value":2857},"3. Expecting Vite plugin features in production (MEDIUM)",{"type":51,"tag":52,"props":2859,"children":2860},{},[2861,2863,2869,2870,2876,2878,2884],{"type":56,"value":2862},"Source injection, console piping, enhanced logging, the server event bus, and the marketplace only operate during development (",{"type":51,"tag":59,"props":2864,"children":2866},{"className":2865},[],[2867],{"type":56,"value":2868},"config.mode === 'development'",{"type":56,"value":916},{"type":51,"tag":59,"props":2871,"children":2873},{"className":2872},[],[2874],{"type":56,"value":2875},"command === 'serve'",{"type":56,"value":2877},"). In production builds, the only active sub-plugin is ",{"type":51,"tag":59,"props":2879,"children":2881},{"className":2880},[],[2882],{"type":56,"value":2883},"remove-devtools-on-build",{"type":56,"value":2885}," (which strips devtools code). Do not rely on any of these features being available at runtime in production.",{"type":51,"tag":873,"props":2887,"children":2889},{"id":2888},"_4-source-injection-on-spread-props-elements-medium",[2890],{"type":56,"value":2891},"4. Source injection on spread-props elements (MEDIUM)",{"type":51,"tag":52,"props":2893,"children":2894},{},[2895,2897,2903,2905,2910,2912,2918,2920,2925],{"type":56,"value":2896},"The AST transform in ",{"type":51,"tag":59,"props":2898,"children":2900},{"className":2899},[],[2901],{"type":56,"value":2902},"inject-source.ts",{"type":56,"value":2904}," explicitly skips any JSX element that has a ",{"type":51,"tag":59,"props":2906,"children":2908},{"className":2907},[],[2909],{"type":56,"value":933},{"type":56,"value":2911}," spread where ",{"type":51,"tag":59,"props":2913,"children":2915},{"className":2914},[],[2916],{"type":56,"value":2917},"props",{"type":56,"value":2919}," is the component's parameter name. This is intentional -- the spread would overwrite the injected ",{"type":51,"tag":59,"props":2921,"children":2923},{"className":2922},[],[2924],{"type":56,"value":623},{"type":56,"value":2926}," attribute. If source inspection doesn't work for a specific component, check if it spreads its props parameter.",{"type":51,"tag":75,"props":2928,"children":2931},{"className":2929,"code":2930,"language":1195,"meta":80,"style":80},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F data-tsd-source will NOT be injected on \u003Cdiv> here\nconst MyComponent = (props) => {\n  return \u003Cdiv {...props}>content\u003C\u002Fdiv>\n}\n",[2932],{"type":51,"tag":59,"props":2933,"children":2934},{"__ignoreMap":80},[2935,2943,2979,3030],{"type":51,"tag":86,"props":2936,"children":2937},{"class":88,"line":89},[2938],{"type":51,"tag":86,"props":2939,"children":2940},{"style":93},[2941],{"type":56,"value":2942},"\u002F\u002F data-tsd-source will NOT be injected on \u003Cdiv> here\n",{"type":51,"tag":86,"props":2944,"children":2945},{"class":88,"line":99},[2946,2950,2955,2959,2963,2967,2971,2975],{"type":51,"tag":86,"props":2947,"children":2948},{"style":360},[2949],{"type":56,"value":363},{"type":51,"tag":86,"props":2951,"children":2952},{"style":115},[2953],{"type":56,"value":2954}," MyComponent ",{"type":51,"tag":86,"props":2956,"children":2957},{"style":109},[2958],{"type":56,"value":373},{"type":51,"tag":86,"props":2960,"children":2961},{"style":109},[2962],{"type":56,"value":2375},{"type":51,"tag":86,"props":2964,"children":2965},{"style":2378},[2966],{"type":56,"value":2917},{"type":51,"tag":86,"props":2968,"children":2969},{"style":109},[2970],{"type":56,"value":1200},{"type":51,"tag":86,"props":2972,"children":2973},{"style":360},[2974],{"type":56,"value":2408},{"type":51,"tag":86,"props":2976,"children":2977},{"style":109},[2978],{"type":56,"value":173},{"type":51,"tag":86,"props":2980,"children":2981},{"class":88,"line":147},[2982,2987,2992,2997,3002,3006,3011,3016,3021,3025],{"type":51,"tag":86,"props":2983,"children":2984},{"style":103},[2985],{"type":56,"value":2986},"  return",{"type":51,"tag":86,"props":2988,"children":2989},{"style":109},[2990],{"type":56,"value":2991}," \u003C",{"type":51,"tag":86,"props":2993,"children":2994},{"style":180},[2995],{"type":56,"value":2996},"div",{"type":51,"tag":86,"props":2998,"children":2999},{"style":109},[3000],{"type":56,"value":3001}," {...",{"type":51,"tag":86,"props":3003,"children":3004},{"style":115},[3005],{"type":56,"value":2917},{"type":51,"tag":86,"props":3007,"children":3008},{"style":109},[3009],{"type":56,"value":3010},"}>",{"type":51,"tag":86,"props":3012,"children":3013},{"style":115},[3014],{"type":56,"value":3015},"content",{"type":51,"tag":86,"props":3017,"children":3018},{"style":109},[3019],{"type":56,"value":3020},"\u003C\u002F",{"type":51,"tag":86,"props":3022,"children":3023},{"style":180},[3024],{"type":56,"value":2996},{"type":51,"tag":86,"props":3026,"children":3027},{"style":109},[3028],{"type":56,"value":3029},">\n",{"type":51,"tag":86,"props":3031,"children":3032},{"class":88,"line":157},[3033],{"type":51,"tag":86,"props":3034,"children":3035},{"style":109},[3036],{"type":56,"value":244},{"type":51,"tag":873,"props":3038,"children":3040},{"id":3039},"_5-event-bus-port-conflict-in-multi-project-setups-medium",[3041],{"type":56,"value":3042},"5. Event bus port conflict in multi-project setups (MEDIUM)",{"type":51,"tag":52,"props":3044,"children":3045},{},[3046],{"type":56,"value":3047},"The default event bus port is 4206. When running multiple Vite dev servers concurrently (monorepo), the second server will hit EADDRINUSE. The event bus handles this by falling back to an OS-assigned port (port 0), and the actual port is injected via placeholder replacement. However, if you need predictable ports (e.g., for firewall rules), set different ports explicitly:",{"type":51,"tag":75,"props":3049,"children":3051},{"className":77,"code":3050,"language":79,"meta":80,"style":80},"\u002F\u002F Project A\ndevtools({ eventBusConfig: { port: 4206 } })\n\n\u002F\u002F Project B\ndevtools({ eventBusConfig: { port: 4207 } })\n",[3052],{"type":51,"tag":59,"props":3053,"children":3054},{"__ignoreMap":80},[3055,3063,3117,3124,3132],{"type":51,"tag":86,"props":3056,"children":3057},{"class":88,"line":89},[3058],{"type":51,"tag":86,"props":3059,"children":3060},{"style":93},[3061],{"type":56,"value":3062},"\u002F\u002F Project A\n",{"type":51,"tag":86,"props":3064,"children":3065},{"class":88,"line":99},[3066,3070,3074,3079,3084,3088,3092,3097,3101,3105,3109,3113],{"type":51,"tag":86,"props":3067,"children":3068},{"style":200},[3069],{"type":56,"value":30},{"type":51,"tag":86,"props":3071,"children":3072},{"style":115},[3073],{"type":56,"value":382},{"type":51,"tag":86,"props":3075,"children":3076},{"style":109},[3077],{"type":56,"value":3078},"{",{"type":51,"tag":86,"props":3080,"children":3081},{"style":180},[3082],{"type":56,"value":3083}," eventBusConfig",{"type":51,"tag":86,"props":3085,"children":3086},{"style":109},[3087],{"type":56,"value":188},{"type":51,"tag":86,"props":3089,"children":3090},{"style":109},[3091],{"type":56,"value":112},{"type":51,"tag":86,"props":3093,"children":3094},{"style":180},[3095],{"type":56,"value":3096}," port",{"type":51,"tag":86,"props":3098,"children":3099},{"style":109},[3100],{"type":56,"value":188},{"type":51,"tag":86,"props":3102,"children":3103},{"style":2127},[3104],{"type":56,"value":2130},{"type":51,"tag":86,"props":3106,"children":3107},{"style":109},[3108],{"type":56,"value":123},{"type":51,"tag":86,"props":3110,"children":3111},{"style":109},[3112],{"type":56,"value":123},{"type":51,"tag":86,"props":3114,"children":3115},{"style":115},[3116],{"type":56,"value":408},{"type":51,"tag":86,"props":3118,"children":3119},{"class":88,"line":147},[3120],{"type":51,"tag":86,"props":3121,"children":3122},{"emptyLinePlaceholder":151},[3123],{"type":56,"value":154},{"type":51,"tag":86,"props":3125,"children":3126},{"class":88,"line":157},[3127],{"type":51,"tag":86,"props":3128,"children":3129},{"style":93},[3130],{"type":56,"value":3131},"\u002F\u002F Project B\n",{"type":51,"tag":86,"props":3133,"children":3134},{"class":88,"line":176},[3135,3139,3143,3147,3151,3155,3159,3163,3167,3172,3176,3180],{"type":51,"tag":86,"props":3136,"children":3137},{"style":200},[3138],{"type":56,"value":30},{"type":51,"tag":86,"props":3140,"children":3141},{"style":115},[3142],{"type":56,"value":382},{"type":51,"tag":86,"props":3144,"children":3145},{"style":109},[3146],{"type":56,"value":3078},{"type":51,"tag":86,"props":3148,"children":3149},{"style":180},[3150],{"type":56,"value":3083},{"type":51,"tag":86,"props":3152,"children":3153},{"style":109},[3154],{"type":56,"value":188},{"type":51,"tag":86,"props":3156,"children":3157},{"style":109},[3158],{"type":56,"value":112},{"type":51,"tag":86,"props":3160,"children":3161},{"style":180},[3162],{"type":56,"value":3096},{"type":51,"tag":86,"props":3164,"children":3165},{"style":109},[3166],{"type":56,"value":188},{"type":51,"tag":86,"props":3168,"children":3169},{"style":2127},[3170],{"type":56,"value":3171}," 4207",{"type":51,"tag":86,"props":3173,"children":3174},{"style":109},[3175],{"type":56,"value":123},{"type":51,"tag":86,"props":3177,"children":3178},{"style":109},[3179],{"type":56,"value":123},{"type":51,"tag":86,"props":3181,"children":3182},{"style":115},[3183],{"type":56,"value":408},{"type":51,"tag":68,"props":3185,"children":3187},{"id":3186},"internal-middleware-endpoints",[3188],{"type":56,"value":3189},"Internal Middleware Endpoints",{"type":51,"tag":52,"props":3191,"children":3192},{},[3193],{"type":56,"value":3194},"These are registered on the Vite dev server (not the event bus server):",{"type":51,"tag":569,"props":3196,"children":3197},{},[3198,3219],{"type":51,"tag":573,"props":3199,"children":3200},{},[3201],{"type":51,"tag":577,"props":3202,"children":3203},{},[3204,3209,3214],{"type":51,"tag":581,"props":3205,"children":3206},{},[3207],{"type":56,"value":3208},"Endpoint",{"type":51,"tag":581,"props":3210,"children":3211},{},[3212],{"type":56,"value":3213},"Method",{"type":51,"tag":581,"props":3215,"children":3216},{},[3217],{"type":56,"value":3218},"Purpose",{"type":51,"tag":597,"props":3220,"children":3221},{},[3222,3244,3265,3286],{"type":51,"tag":577,"props":3223,"children":3224},{},[3225,3234,3239],{"type":51,"tag":604,"props":3226,"children":3227},{},[3228],{"type":51,"tag":59,"props":3229,"children":3231},{"className":3230},[],[3232],{"type":56,"value":3233},"\u002F__tsd\u002Fopen-source?source=\u003Cpath:line:col>",{"type":51,"tag":604,"props":3235,"children":3236},{},[3237],{"type":56,"value":3238},"GET",{"type":51,"tag":604,"props":3240,"children":3241},{},[3242],{"type":56,"value":3243},"Opens file in editor, returns HTML that closes the window",{"type":51,"tag":577,"props":3245,"children":3246},{},[3247,3255,3260],{"type":51,"tag":604,"props":3248,"children":3249},{},[3250],{"type":51,"tag":59,"props":3251,"children":3253},{"className":3252},[],[3254],{"type":56,"value":1353},{"type":51,"tag":604,"props":3256,"children":3257},{},[3258],{"type":56,"value":3259},"POST",{"type":51,"tag":604,"props":3261,"children":3262},{},[3263],{"type":56,"value":3264},"Receives client console entries (batched JSON)",{"type":51,"tag":577,"props":3266,"children":3267},{},[3268,3277,3281],{"type":51,"tag":604,"props":3269,"children":3270},{},[3271],{"type":51,"tag":59,"props":3272,"children":3274},{"className":3273},[],[3275],{"type":56,"value":3276},"\u002F__tsd\u002Fconsole-pipe\u002Fserver",{"type":51,"tag":604,"props":3278,"children":3279},{},[3280],{"type":56,"value":3259},{"type":51,"tag":604,"props":3282,"children":3283},{},[3284],{"type":56,"value":3285},"Receives server-side console entries",{"type":51,"tag":577,"props":3287,"children":3288},{},[3289,3297,3301],{"type":51,"tag":604,"props":3290,"children":3291},{},[3292],{"type":51,"tag":59,"props":3293,"children":3295},{"className":3294},[],[3296],{"type":56,"value":1364},{"type":51,"tag":604,"props":3298,"children":3299},{},[3300],{"type":56,"value":3238},{"type":51,"tag":604,"props":3302,"children":3303},{},[3304],{"type":56,"value":3305},"SSE stream for broadcasting server logs to browser",{"type":51,"tag":68,"props":3307,"children":3309},{"id":3308},"cross-references",[3310],{"type":56,"value":3311},"Cross-References",{"type":51,"tag":486,"props":3313,"children":3314},{},[3315,3332],{"type":51,"tag":490,"props":3316,"children":3317},{},[3318,3323,3325,3330],{"type":51,"tag":896,"props":3319,"children":3320},{},[3321],{"type":56,"value":3322},"devtools-app-setup",{"type":56,"value":3324}," -- How to set up ",{"type":51,"tag":59,"props":3326,"children":3328},{"className":3327},[],[3329],{"type":56,"value":2511},{"type":56,"value":3331}," in your app (must be done before the Vite plugin provides value)",{"type":51,"tag":490,"props":3333,"children":3334},{},[3335,3340],{"type":51,"tag":896,"props":3336,"children":3337},{},[3338],{"type":56,"value":3339},"devtools-production",{"type":56,"value":3341}," -- Details on production stripping configuration and keeping devtools in production builds",{"type":51,"tag":68,"props":3343,"children":3345},{"id":3344},"key-source-files",[3346],{"type":56,"value":3347},"Key Source Files",{"type":51,"tag":486,"props":3349,"children":3350},{},[3351,3362,3372,3382,3392,3402,3412,3422,3432,3442],{"type":51,"tag":490,"props":3352,"children":3353},{},[3354,3360],{"type":51,"tag":59,"props":3355,"children":3357},{"className":3356},[],[3358],{"type":56,"value":3359},"packages\u002Fdevtools-vite\u002Fsrc\u002Fplugin.ts",{"type":56,"value":3361}," -- Main plugin factory with all sub-plugins and config type",{"type":51,"tag":490,"props":3363,"children":3364},{},[3365,3370],{"type":51,"tag":59,"props":3366,"children":3368},{"className":3367},[],[3369],{"type":56,"value":1014},{"type":56,"value":3371}," -- AST transform for data-tsd-source injection",{"type":51,"tag":490,"props":3373,"children":3374},{},[3375,3380],{"type":51,"tag":59,"props":3376,"children":3378},{"className":3377},[],[3379],{"type":56,"value":1744},{"type":56,"value":3381}," -- AST transform for enhanced console logs",{"type":51,"tag":490,"props":3383,"children":3384},{},[3385,3390],{"type":51,"tag":59,"props":3386,"children":3388},{"className":3387},[],[3389],{"type":56,"value":1935},{"type":56,"value":3391}," -- Production stripping transform",{"type":51,"tag":490,"props":3393,"children":3394},{},[3395,3400],{"type":51,"tag":59,"props":3396,"children":3398},{"className":3397},[],[3399],{"type":56,"value":1493},{"type":56,"value":3401}," -- Console pipe runtime code generator",{"type":51,"tag":490,"props":3403,"children":3404},{},[3405,3410],{"type":51,"tag":59,"props":3406,"children":3408},{"className":3407},[],[3409],{"type":56,"value":2286},{"type":56,"value":3411}," -- Editor config type and launch-editor integration",{"type":51,"tag":490,"props":3413,"children":3414},{},[3415,3420],{"type":51,"tag":59,"props":3416,"children":3418},{"className":3417},[],[3419],{"type":56,"value":2579},{"type":56,"value":3421}," -- Marketplace plugin injection into devtools setup file",{"type":51,"tag":490,"props":3423,"children":3424},{},[3425,3430],{"type":51,"tag":59,"props":3426,"children":3428},{"className":3427},[],[3429],{"type":56,"value":1500},{"type":56,"value":3431}," -- Middleware request handling and helpers",{"type":51,"tag":490,"props":3433,"children":3434},{},[3435,3440],{"type":51,"tag":59,"props":3436,"children":3438},{"className":3437},[],[3439],{"type":56,"value":1021},{"type":56,"value":3441}," -- Picomatch\u002FRegExp pattern matcher",{"type":51,"tag":490,"props":3443,"children":3444},{},[3445,3450],{"type":51,"tag":59,"props":3446,"children":3448},{"className":3447},[],[3449],{"type":56,"value":2074},{"type":56,"value":3451}," -- ServerEventBus implementation (WebSocket + SSE + EADDRINUSE fallback)",{"type":51,"tag":3453,"props":3454,"children":3455},"style",{},[3456],{"type":56,"value":3457},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":3459,"total":3598},[3460,3476,3486,3498,3513,3525,3535,3545,3558,3568,3579,3589],{"slug":3461,"name":3461,"fn":3462,"description":3463,"org":3464,"tags":3465,"stars":3473,"repoUrl":3474,"updatedAt":3475},"aggregation","perform data aggregation in TanStack Table","Aggregate TanStack Table columns independently of grouping, including grand totals, caller-selected row totals, multiple keyed aggregations, custom context-based definitions, grouped merges, manual values, and worker constraints.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3466,3469,3472],{"name":3467,"slug":3468,"type":15},"Data Analysis","data-analysis",{"name":3470,"slug":3471,"type":15},"Frontend","frontend",{"name":9,"slug":8,"type":15},28175,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Ftable","2026-07-30T05:25:59.429787",{"slug":3477,"name":3477,"fn":3478,"description":3479,"org":3480,"tags":3481,"stars":3473,"repoUrl":3474,"updatedAt":3485},"api-not-found","diagnose TanStack Table API errors","Diagnose missing TanStack Table v9 exports, options, state slices, and instance methods. Load before inventing an API when code sees a type error, undefined feature method, absent object key, adapter mismatch, or v8-shaped example.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3482,3483,3484],{"name":21,"slug":22,"type":15},{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:26:05.418735",{"slug":3487,"name":3487,"fn":3488,"description":3489,"org":3490,"tags":3491,"stars":3473,"repoUrl":3474,"updatedAt":3497},"cell-selection","select rectangular cell ranges in tables","Select rectangular cell ranges with cellSelectionFeature: two-corner range state keyed by row and column id, mousedown\u002Fmouseenter handlers, selection edges, render-order resolution under pinning, and autoResetCellSelection. Load when ranges widen unexpectedly after sorting or column reordering, when a drag re-renders the whole table, or when building copy-to-clipboard from a selection.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3492,3493,3494],{"name":3467,"slug":3468,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"UI Components","ui-components","2026-07-30T05:25:38.403427",{"slug":3499,"name":3499,"fn":3500,"description":3501,"org":3502,"tags":3503,"stars":3473,"repoUrl":3474,"updatedAt":3512},"client-vs-server","manage TanStack Table data pipelines","Choose client or server ownership for filtering, grouping, sorting, expanding, and pagination in TanStack Table v9. Load for manual* flags, mixed pipelines, server counts, or deciding which dataset each row-model stage receives.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3504,3507,3508,3511],{"name":3505,"slug":3506,"type":15},"Data Pipeline","data-pipeline",{"name":3470,"slug":3471,"type":15},{"name":3509,"slug":3510,"type":15},"Performance","performance",{"name":9,"slug":8,"type":15},"2026-07-30T05:25:45.400104",{"slug":3514,"name":3514,"fn":3515,"description":3516,"org":3517,"tags":3518,"stars":3473,"repoUrl":3474,"updatedAt":3524},"column-faceting","build faceted filter UIs","Build faceted filter UIs with columnFacetingFeature, facetedRowModel, facetedUniqueValues, and facetedMinMaxValues. Load for facet counts, numeric ranges, own-filter exclusion, or server-page facet completeness.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3519,3522,3523],{"name":3520,"slug":3521,"type":15},"Data Visualization","data-visualization",{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:41.397257",{"slug":3526,"name":3526,"fn":3527,"description":3528,"org":3529,"tags":3530,"stars":3473,"repoUrl":3474,"updatedAt":3534},"column-filtering","implement column filtering in TanStack Table","Filter columns with columnFilteringFeature, filteredRowModel, filterFns, filterMeta, nested-row direction, and manualFiltering. Load for accessor compatibility, controlled filter updaters, fuzzy metadata, or client\u002Fserver ownership.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3531,3532,3533],{"name":3467,"slug":3468,"type":15},{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:53.391632",{"slug":3536,"name":3536,"fn":3537,"description":3538,"org":3539,"tags":3540,"stars":3473,"repoUrl":3474,"updatedAt":3544},"column-ordering","manage TanStack Table column ordering","Control TanStack Table v9 leaf columnOrder with stable IDs while accounting for pinning regions, visibility, and groupedColumnMode precedence. Load for drag-and-drop columns or rendered order that differs from state.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3541,3542,3543],{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-30T05:26:03.37801",{"slug":3546,"name":3546,"fn":3547,"description":3548,"org":3549,"tags":3550,"stars":3473,"repoUrl":3474,"updatedAt":3557},"column-pinning","configure column pinning in TanStack Table","Pin columns into logical start, center, and end regions with columnPinningFeature and renderer-owned sticky CSS. Load for RTL offsets, z-index, backgrounds, overflow, widths, gaps, or overlaps.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3551,3554,3555,3556],{"name":3552,"slug":3553,"type":15},"CSS","css",{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-30T05:25:55.377366",{"slug":3559,"name":3559,"fn":3560,"description":3561,"org":3562,"tags":3563,"stars":3473,"repoUrl":3474,"updatedAt":3567},"column-resizing","implement column resizing in TanStack Table","Wire columnResizingFeature, header.getResizeHandler, resize mode and direction, pointer or touch events, and performant CSS-variable updates. Load when resize state changes but widths do not, or large tables resize slowly.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3564,3565,3566],{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-30T05:25:51.400011",{"slug":3569,"name":3569,"fn":3570,"description":3571,"org":3572,"tags":3573,"stars":3473,"repoUrl":3474,"updatedAt":3578},"column-sizing","configure column sizing in TanStack Table","Use columnSizingFeature numeric size, minSize, maxSize, getSize, getStart, getAfter, and total-size APIs in table, grid, or flex CSS. Load for auto or percentage misconceptions and sizing\u002Fpinning layout mismatch.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3574,3575,3576,3577],{"name":3552,"slug":3553,"type":15},{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-30T05:25:48.703799",{"slug":3580,"name":3580,"fn":3581,"description":3582,"org":3583,"tags":3584,"stars":3473,"repoUrl":3474,"updatedAt":3588},"column-visibility","manage column visibility in TanStack Table","Hide columns with columnVisibilityFeature while rendering visibility-aware header, column, and cell collections. Load when hidden columns remain in the DOM, false-versus-absent state is confused, or enableHiding is misunderstood.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3585,3586,3587],{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-30T05:25:47.367943",{"slug":40,"name":40,"fn":3590,"description":3591,"org":3592,"tags":3593,"stars":3473,"repoUrl":3474,"updatedAt":3597},"build data grids with TanStack Table","Use TanStack Table v9 as a headless data-grid state and row-processing engine. Load for first-table architecture, stable data and columns, row numbering with getDisplayIndex, semantic rendering, framework adapter choice, or deciding what Table owns versus the renderer.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3594,3595,3596],{"name":3467,"slug":3468,"type":15},{"name":3470,"slug":3471,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-30T05:25:52.366295",125,{"items":3600,"total":238},[3601,3610,3620,3634,3653,3664,3674],{"slug":3322,"name":3322,"fn":3602,"description":3603,"org":3604,"tags":3605,"stars":23,"repoUrl":24,"updatedAt":3609},"configure TanStack Devtools for applications","Install TanStack Devtools, pick framework adapter (React\u002FVue\u002FSolid\u002FPreact), register plugins via plugins prop, configure shell (position, hotkeys, theme, hideUntilHover, requireUrlFlag, eventBusConfig). TanStackDevtools component, defaultOpen, localStorage persistence.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3606,3607,3608],{"name":21,"slug":22,"type":15},{"name":3470,"slug":3471,"type":15},{"name":9,"slug":8,"type":15},"2026-07-16T06:04:05.544655",{"slug":3611,"name":3611,"fn":3612,"description":3613,"org":3614,"tags":3615,"stars":23,"repoUrl":24,"updatedAt":3619},"devtools-bidirectional","implement bidirectional devtools communication","Two-way event patterns between devtools panel and application. App-to-devtools observation, devtools-to-app commands, time-travel debugging with snapshots and revert. structuredClone for snapshot safety, distinct event suffixes for observation vs commands, serializable payloads only.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3616,3617,3618],{"name":21,"slug":22,"type":15},{"name":13,"slug":14,"type":15},{"name":9,"slug":8,"type":15},"2026-07-16T06:04:40.486044",{"slug":3621,"name":3621,"fn":3622,"description":3623,"org":3624,"tags":3625,"stars":23,"repoUrl":24,"updatedAt":3633},"devtools-event-client","implement typed event clients for libraries","Create typed EventClient for a library. Define event maps with typed payloads, pluginId auto-prepend namespacing, emit()\u002Fon()\u002FonAll()\u002FonAllPluginEvents() API. Connection lifecycle (5 retries, 300ms), event queuing, enabled\u002Fdisabled state, SSR fallbacks, singleton pattern. Unique pluginId requirement to avoid event collisions.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3626,3629,3632],{"name":3627,"slug":3628,"type":15},"API Development","api-development",{"name":3630,"slug":3631,"type":15},"Engineering","engineering",{"name":9,"slug":8,"type":15},"2026-07-16T06:04:34.254605",{"slug":3635,"name":3635,"fn":3636,"description":3637,"org":3638,"tags":3639,"stars":23,"repoUrl":24,"updatedAt":3652},"devtools-framework-adapters","create framework adapters for devtools","Use devtools-utils factory functions to create per-framework plugin adapters. createReactPlugin\u002FcreateSolidPlugin\u002FcreateVuePlugin\u002FcreatePreactPlugin, createReactPanel\u002FcreateSolidPanel\u002FcreateVuePanel\u002FcreatePreactPanel. [Plugin, NoOpPlugin] tuple for tree-shaking. DevtoolsPanelProps (theme). Vue uses (name, component) not options object. Solid render must be function.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3640,3641,3644,3646,3648,3649],{"name":3630,"slug":3631,"type":15},{"name":3642,"slug":3643,"type":15},"Preact","preact",{"name":3645,"slug":31,"type":15},"React",{"name":3647,"slug":32,"type":15},"SolidJS",{"name":9,"slug":8,"type":15},{"name":3650,"slug":3651,"type":15},"Vue","vue","2026-07-16T06:04:33.553047",{"slug":3654,"name":3654,"fn":3655,"description":3656,"org":3657,"tags":3658,"stars":23,"repoUrl":24,"updatedAt":3663},"devtools-instrumentation","instrument library code for devtools","Analyze library codebase for critical architecture and debugging points, add strategic event emissions. Identify middleware boundaries, state transitions, lifecycle hooks. Consolidate events (1 not 15), debounce high-frequency updates, DRY shared payload fields, guard emit() for production. Transparent server\u002Fclient event bridging.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3659,3660,3661,3662],{"name":21,"slug":22,"type":15},{"name":3630,"slug":3631,"type":15},{"name":13,"slug":14,"type":15},{"name":9,"slug":8,"type":15},"2026-07-16T06:04:33.21467",{"slug":3665,"name":3665,"fn":3666,"description":3667,"org":3668,"tags":3669,"stars":23,"repoUrl":24,"updatedAt":3673},"devtools-marketplace","publish plugins to TanStack Devtools Marketplace","Publish plugin to npm and submit to TanStack Devtools Marketplace. PluginMetadata registry format, plugin-registry.ts, pluginImport (importName, type), requires (packageName, minVersion), framework tagging, multi-framework submissions, featured plugins.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3670,3672],{"name":3671,"slug":3671,"type":15},"npm",{"name":9,"slug":8,"type":15},"2026-07-16T06:04:09.110642",{"slug":3675,"name":3675,"fn":3676,"description":3677,"org":3678,"tags":3679,"stars":23,"repoUrl":24,"updatedAt":3684},"devtools-plugin-panel","build TanStack devtools panels","Build devtools panel components that display emitted event data. Listen via EventClient.on(), handle theme (light\u002Fdark), use @tanstack\u002Fdevtools-ui components. Plugin registration (name, render, id, defaultOpen), lifecycle (mount, activate, destroy), max 3 active plugins. Two paths: Solid.js core with devtools-ui for multi-framework support, or framework-specific panels.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[3680,3681,3682,3683],{"name":3470,"slug":3471,"type":15},{"name":13,"slug":14,"type":15},{"name":9,"slug":8,"type":15},{"name":3495,"slug":3496,"type":15},"2026-07-16T06:03:59.434886"]