docs(devtools): add 'relative' to Vue/Solid 'buttonPosition' and fix Vue 'style' type by grzdev · Pull Request #10608 · TanStack/query

grzdev · 2026-04-28T20:02:26Z

🎯 Changes

Align the Vue and Solid devtools docs with the exported devtools option types.

Updates:

adds "relative" to documented buttonPosition options
replaces the React-specific React.CSSProperties style type in Vue docs with Partial<CSSStyleDeclaration>

Docs-only change.

✅ Checklist

I have followed the steps in the Contributing guide.
I have tested this code locally with pnpm run test:pr.

🚀 Release Impact

This change affects published code, and I have generated a changeset.
This change is docs/CI/dev-only (no release).

Summary by CodeRabbit

Documentation
- SolidQueryDevtools and Vue Query Devtools floating-mode button positioning now supports "relative" as an additional position option.
- Vue Query Devtools embedded-mode style option type was updated to provide better type coverage for CSS styling configurations.

coderabbitai · 2026-04-28T20:02:39Z

📝 Walkthrough

Walkthrough

Updated documentation for SolidQueryDevtools and Vue Query Devtools configuration options. Added "relative" as a supported value for the buttonPosition option in both frameworks. Updated Vue Devtools' style option type from React.CSSProperties to Partial<CSSStyleDeclaration>.

Changes

Cohort / File(s)	Summary
Devtools Documentation Updates `docs/framework/solid/devtools.md`, `docs/framework/vue/devtools.md`	Added `"relative"` to the `buttonPosition` type union for floating-mode UI positioning. Updated Vue Devtools' `style` option type annotation from `React.CSSProperties` to `Partial<CSSStyleDeclaration>`.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Poem

🐰 Hop, hop, along the docs we go,
Adding "relative" to help options flow,
Type definitions polished bright,
Devtools positioned just right!
Small tweaks, big clarity—that's our delight! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description check	✅ Passed	The description follows the template structure with completed sections, though the local testing checklist item remains unchecked as expected for a docs-only change.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title clearly and specifically describes the main changes: adding 'relative' to buttonPosition and fixing the Vue style type.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

nx-cloud · 2026-04-28T20:03:06Z

View your CI Pipeline Execution ↗ for commit 0ac98a1

Command	Status	Duration	Result
`nx run-many --target=build --exclude=examples/*...`	✅ Succeeded	<1s	View ↗
`nx affected --targets=test:sherif,test:knip,tes...`	✅ Succeeded	8s	View ↗

☁️ Nx Cloud last updated this comment at 2026-04-28 20:04:05 UTC

pkg-pr-new · 2026-04-28T20:03:57Z

More templates

@tanstack/angular-query-experimental

npm i https://pkg.pr.new/@tanstack/angular-query-experimental@10608

@tanstack/eslint-plugin-query

npm i https://pkg.pr.new/@tanstack/eslint-plugin-query@10608

@tanstack/preact-query

npm i https://pkg.pr.new/@tanstack/preact-query@10608

@tanstack/preact-query-devtools

npm i https://pkg.pr.new/@tanstack/preact-query-devtools@10608

@tanstack/preact-query-persist-client

npm i https://pkg.pr.new/@tanstack/preact-query-persist-client@10608

@tanstack/query-async-storage-persister

npm i https://pkg.pr.new/@tanstack/query-async-storage-persister@10608

@tanstack/query-broadcast-client-experimental

npm i https://pkg.pr.new/@tanstack/query-broadcast-client-experimental@10608

@tanstack/query-core

npm i https://pkg.pr.new/@tanstack/query-core@10608

@tanstack/query-devtools

npm i https://pkg.pr.new/@tanstack/query-devtools@10608

@tanstack/query-persist-client-core

npm i https://pkg.pr.new/@tanstack/query-persist-client-core@10608

@tanstack/query-sync-storage-persister

npm i https://pkg.pr.new/@tanstack/query-sync-storage-persister@10608

@tanstack/react-query

npm i https://pkg.pr.new/@tanstack/react-query@10608

@tanstack/react-query-devtools

npm i https://pkg.pr.new/@tanstack/react-query-devtools@10608

@tanstack/react-query-next-experimental

npm i https://pkg.pr.new/@tanstack/react-query-next-experimental@10608

@tanstack/react-query-persist-client

npm i https://pkg.pr.new/@tanstack/react-query-persist-client@10608

@tanstack/solid-query

npm i https://pkg.pr.new/@tanstack/solid-query@10608

@tanstack/solid-query-devtools

npm i https://pkg.pr.new/@tanstack/solid-query-devtools@10608

@tanstack/solid-query-persist-client

npm i https://pkg.pr.new/@tanstack/solid-query-persist-client@10608

@tanstack/svelte-query

npm i https://pkg.pr.new/@tanstack/svelte-query@10608

@tanstack/svelte-query-devtools

npm i https://pkg.pr.new/@tanstack/svelte-query-devtools@10608

@tanstack/svelte-query-persist-client

npm i https://pkg.pr.new/@tanstack/svelte-query-persist-client@10608

@tanstack/vue-query

npm i https://pkg.pr.new/@tanstack/vue-query@10608

@tanstack/vue-query-devtools

npm i https://pkg.pr.new/@tanstack/vue-query-devtools@10608

commit: 0ac98a1

coderabbitai

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

docs/framework/vue/devtools.md (1)

88-88: ⚠️ Potential issue | 🟡 Minor

Fix framework reference in comment.

The comment references "React app" but this is Vue documentation. It should say "Vue app" instead.

📝 Proposed fix

-Place the following code as high in your React app as you can. The closer it is to the root of the page, the better it will work!
+Place the following code as high in your Vue app as you can. The closer it is to the root of the page, the better it will work!

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@docs/framework/vue/devtools.md` at line 88, The inline guidance currently
reads "Place the following code as high in your React app as you can."; update
that phrase in docs/framework/vue/devtools.md to reference Vue instead of React
by changing "React app" to "Vue app" so the comment matches the Vue
documentation context and reads "Place the following code as high in your Vue
app as you can."

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Outside diff comments:
In `@docs/framework/vue/devtools.md`:
- Line 88: The inline guidance currently reads "Place the following code as high
in your React app as you can."; update that phrase in
docs/framework/vue/devtools.md to reference Vue instead of React by changing
"React app" to "Vue app" so the comment matches the Vue documentation context
and reads "Place the following code as high in your Vue app as you can."

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 4c2d364c-73e0-4282-a881-1fc6e12c5ed7

📥 Commits

Reviewing files that changed from the base of the PR and between c5ab5a1 and 0ac98a1.

📒 Files selected for processing (2)

docs/framework/solid/devtools.md
docs/framework/vue/devtools.md

docs(devtools): align Vue and Solid option types

0ac98a1

github-actions Bot added the documentation Improvements or additions to documentation label Apr 28, 2026

coderabbitai Bot reviewed Apr 28, 2026

View reviewed changes

sukvvon changed the title ~~docs(devtools): align Vue and Solid option types~~ docs(devtools): add missing 'relative' to 'buttonPosition' and fix 'style' type for Vue/Solid Apr 29, 2026

sukvvon approved these changes Apr 29, 2026

View reviewed changes

sukvvon changed the title ~~docs(devtools): add missing 'relative' to 'buttonPosition' and fix 'style' type for Vue/Solid~~ docs(devtools): add 'relative' to Vue/Solid 'buttonPosition' and fix Vue 'style' type Apr 29, 2026

sukvvon merged commit 4ef364a into TanStack:main Apr 29, 2026
10 checks passed

sukvvon mentioned this pull request Apr 29, 2026

docs(preact-query/devtools): add missing 'relative' to 'buttonPosition' #10611

Merged

4 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

docs(devtools): add 'relative' to Vue/Solid 'buttonPosition' and fix Vue 'style' type#10608

docs(devtools): add 'relative' to Vue/Solid 'buttonPosition' and fix Vue 'style' type#10608
sukvvon merged 1 commit intoTanStack:mainfrom
grzdev:docs/devtools-button-position-options

grzdev commented Apr 28, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Apr 28, 2026 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

nx-cloud Bot commented Apr 28, 2026 •

edited

Loading

Uh oh!

pkg-pr-new Bot commented Apr 28, 2026

Uh oh!

coderabbitai Bot left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

grzdev commented Apr 28, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🎯 Changes

✅ Checklist

🚀 Release Impact

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Apr 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

nx-cloud Bot commented Apr 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pkg-pr-new Bot commented Apr 28, 2026

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

grzdev commented Apr 28, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Apr 28, 2026 •

edited

Loading

nx-cloud Bot commented Apr 28, 2026 •

edited

Loading