Skip to content

fix(vue-devtools): fix style prop type #10087

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
lachlancollins wants to merge 2 commits into
base: main
Choose a base branch
from
Open

fix(vue-devtools): fix style prop type #10087

lachlancollins wants to merge 2 commits into from
+8 −2

Conversation

@lachlancollins
Copy link
Member

@lachlancollins lachlancollins commented Feb 2, 2026 •
edited by coderabbitai bot
Loading

🎯 Changes

Setting types field in tsconfig (in preparation for TS 6.0 breaking changes) exposed this issue in vue-query-devtools. The style prop is currently typed as React.CSSProperties, which comes from @types/react. This replaces it with the built-in CSSStyleDeclaration DOM type.

✅ 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

  • Bug Fixes
    • Fixed style property type in Vue Query devtools panel to properly support standard CSS style declarations and improve compatibility.

@changeset-bot
Copy link

changeset-bot bot commented Feb 2, 2026 •
edited
Loading

🦋 Changeset detected

Latest commit: ca2af46

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@tanstack/vue-query-devtools Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Feb 2, 2026 •
edited
Loading

📝 Walkthrough

Walkthrough

This pull request fixes the style prop type in Vue Query DevTools by changing it from React-specific CSSProperties to DOM-standard Partial<CSSStyleDeclaration>. A changeset documents the patch release, and TypeScript configuration is updated to include Node.js type definitions.

Changes

Cohort / File(s) Summary
Type Definitions
packages/vue-query-devtools/src/types.ts		 Changed DevtoolsPanelOptions style property from React.CSSProperties to Partial<CSSStyleDeclaration> to remove React dependency and align with standard DOM CSS declarations.
Configuration
tsconfig.json		 Added "types": ["node"] to compiler options to include Node.js type definitions globally in the project.
Release Documentation
.changeset/funny-lines-visit.md		 Added changeset declaring a patch release for @tanstack/vue-query-devtools documenting the style prop type fix.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related PRs

Suggested reviewers

  • TkDodo

Poem

🐰 From React's embrace to DOM's sweet call,
The style prop sheds its walls,
CSSStyleDeclaration now stands tall,
Vue DevTools dances—no more React at all! ✨

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title 'fix(vue-devtools): fix style prop type' clearly and concisely describes the main change—fixing the style prop type in vue-devtools from React.CSSProperties to CSSStyleDeclaration.
Description check ✅ Passed The PR description includes the required sections (Changes, Checklist, Release Impact), provides clear context about the fix and its motivation, and demonstrates completion of all checklist items including local testing.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

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

✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch fix-vue-devtools-types

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

@nx-cloud
Copy link

nx-cloud bot commented Feb 2, 2026 •
edited
Loading

View your CI Pipeline Execution ↗ for commit ca2af46

Command Status Duration Result
nx affected --targets=test:sherif,test:knip,tes... ✅ Succeeded 54s View ↗

☁️ Nx Cloud last updated this comment at 2026-02-02 04:51:39 UTC

@pkg-pr-new
Copy link

pkg-pr-new bot commented Feb 2, 2026

More templates

@tanstack/angular-query-experimental

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

@tanstack/eslint-plugin-query

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

@tanstack/query-async-storage-persister

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

@tanstack/query-broadcast-client-experimental

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

@tanstack/query-core

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

@tanstack/query-devtools

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

@tanstack/query-persist-client-core

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

@tanstack/query-sync-storage-persister

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

@tanstack/react-query

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

@tanstack/react-query-devtools

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

@tanstack/react-query-next-experimental

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

@tanstack/react-query-persist-client

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

@tanstack/solid-query

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

@tanstack/solid-query-devtools

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

@tanstack/solid-query-persist-client

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

@tanstack/svelte-query

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

@tanstack/svelte-query-devtools

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

@tanstack/svelte-query-persist-client

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

@tanstack/vue-query

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

@tanstack/vue-query-devtools

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

commit: ca2af46

@github-actions
Copy link
Contributor

github-actions bot commented Feb 2, 2026

size-limit report 📦

Path Size
react full 11.93 KB (0%)
react minimal 8.95 KB (0%)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

package: vue-query-devtools

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@lachlancollins