From 299447b060267dcb24d36143c8361d816c7c0c90 Mon Sep 17 00:00:00 2001 From: Dami Oyeniyi Date: Wed, 13 May 2026 22:06:20 +0100 Subject: [PATCH 1/3] fix(vue-query-devtools): use class attribute in templates (#10635) Co-authored-by: Damian Osipiuk --- .changeset/vue-devtools-class-attribute.md | 5 +++++ packages/vue-query-devtools/src/devtools.vue | 2 +- packages/vue-query-devtools/src/devtoolsPanel.vue | 2 +- 3 files changed, 7 insertions(+), 2 deletions(-) create mode 100644 .changeset/vue-devtools-class-attribute.md diff --git a/.changeset/vue-devtools-class-attribute.md b/.changeset/vue-devtools-class-attribute.md new file mode 100644 index 00000000000..1435da6a0df --- /dev/null +++ b/.changeset/vue-devtools-class-attribute.md @@ -0,0 +1,5 @@ +--- +'@tanstack/vue-query-devtools': patch +--- + +Use the Vue `class` attribute for devtools template containers. diff --git a/packages/vue-query-devtools/src/devtools.vue b/packages/vue-query-devtools/src/devtools.vue index 5a160482819..a46b7adbac0 100644 --- a/packages/vue-query-devtools/src/devtools.vue +++ b/packages/vue-query-devtools/src/devtools.vue @@ -40,5 +40,5 @@ onMounted(() => { diff --git a/packages/vue-query-devtools/src/devtoolsPanel.vue b/packages/vue-query-devtools/src/devtoolsPanel.vue index 605a632240c..80884daa6ec 100644 --- a/packages/vue-query-devtools/src/devtoolsPanel.vue +++ b/packages/vue-query-devtools/src/devtoolsPanel.vue @@ -45,5 +45,5 @@ onMounted(() => { From 139e67ccab2c8efba7c4dccdffa6f447350446ae Mon Sep 17 00:00:00 2001 From: palkim Date: Thu, 14 May 2026 06:12:23 +0900 Subject: [PATCH 2/3] fix(vue-query): allow computed ref as queryKey property in queryOptions (#10530) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(vue-query): allow computed ref as queryKey property in queryOptions Closes #10525 * fix(vue-query): widen queryKey to MaybeRefOrGetter to match enabled toValueDeep already calls `() => T` at runtime, so the queryKey type should accept the same reactive forms as enabled: Ref, ComputedRef, and getters. Adds a getter test and updates the changeset. --------- Co-authored-by: Dominik Dorfmeister 🔮 Co-authored-by: Damian Osipiuk --- ...ix-vue-query-options-query-key-reactive.md | 13 +++++++ .../src/__tests__/queryOptions.test-d.ts | 34 +++++++++++++++++++ packages/vue-query/src/queryOptions.ts | 16 +++++---- 3 files changed, 56 insertions(+), 7 deletions(-) create mode 100644 .changeset/fix-vue-query-options-query-key-reactive.md diff --git a/.changeset/fix-vue-query-options-query-key-reactive.md b/.changeset/fix-vue-query-options-query-key-reactive.md new file mode 100644 index 00000000000..744a0d8b49e --- /dev/null +++ b/.changeset/fix-vue-query-options-query-key-reactive.md @@ -0,0 +1,13 @@ +--- +'@tanstack/vue-query': patch +--- + +fix(vue-query): allow reactive and getter values as `queryKey` property in `queryOptions` + +This fixes a regression introduced in #10452 where `queryOptions` only accepted plain arrays for the `queryKey` property, but not `computed` refs, `Ref` values, or getter functions. The related fix in #10465 only covered the `enabled` property. + +Now the `queryKey` property in `queryOptions` accepts the same reactive forms as `enabled`: +- Plain `QueryKey` arrays +- `Ref` +- `ComputedRef` +- `() => QueryKey` (getter) diff --git a/packages/vue-query/src/__tests__/queryOptions.test-d.ts b/packages/vue-query/src/__tests__/queryOptions.test-d.ts index 481dd808fc5..a3e8c6d0d41 100644 --- a/packages/vue-query/src/__tests__/queryOptions.test-d.ts +++ b/packages/vue-query/src/__tests__/queryOptions.test-d.ts @@ -298,4 +298,38 @@ describe('queryOptions', () => { expectTypeOf(options.queryKey).not.toBeUndefined() }) + + it('should allow computed ref as queryKey', () => { + const id = ref('1') + + // This was broken in #10452, the #10465 fix only covered `enabled` + const options = queryOptions({ + queryKey: computed(() => ['foo', id.value] as const), + queryFn: () => Promise.resolve({ id: '1' }), + }) + + expectTypeOf(options.queryKey).not.toBeUndefined() + }) + + it('should allow ref as queryKey', () => { + const keyRef = ref(['foo', '1'] as const) + + const options = queryOptions({ + queryKey: keyRef, + queryFn: () => Promise.resolve({ id: '1' }), + }) + + expectTypeOf(options.queryKey).not.toBeUndefined() + }) + + it('should allow getter function as queryKey', () => { + const id = ref('1') + + const options = queryOptions({ + queryKey: () => ['foo', id.value] as const, + queryFn: () => Promise.resolve({ id: '1' }), + }) + + expectTypeOf(options.queryKey).not.toBeUndefined() + }) }) diff --git a/packages/vue-query/src/queryOptions.ts b/packages/vue-query/src/queryOptions.ts index bc0d578aebb..37e7f22b4f5 100644 --- a/packages/vue-query/src/queryOptions.ts +++ b/packages/vue-query/src/queryOptions.ts @@ -31,13 +31,15 @@ export type QueryOptions< TQueryData, DeepUnwrapRef >) - : QueryObserverOptions< - TQueryFnData, - TError, - TData, - TQueryData, - DeepUnwrapRef - >[Property] + : Property extends 'queryKey' + ? MaybeRefOrGetter + : QueryObserverOptions< + TQueryFnData, + TError, + TData, + TQueryData, + DeepUnwrapRef + >[Property] } & ShallowOption export type UndefinedInitialQueryOptions< From 65b9b72713536bd0bf2ef40571a1e10bfa19ad19 Mon Sep 17 00:00:00 2001 From: Corbin Crutchley Date: Thu, 14 May 2026 02:06:25 -0400 Subject: [PATCH 3/3] chore: add CODEOWNERS file (#10703) * chore: add CODEOWNERS file * chore: add Nx configs * chore: add NPMRC --- .github/CODEOWNERS | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .github/CODEOWNERS diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS new file mode 100644 index 00000000000..ec376708852 --- /dev/null +++ b/.github/CODEOWNERS @@ -0,0 +1,6 @@ +.github/ @TanStack/tanstack-core +.nx/ @TanStack/tanstack-core +nx.json @TanStack/tanstack-core +.changeset/config.json @TanStack/tanstack-core +scripts/ @TanStack/tanstack-core +.npmrc @TanStack/tanstack-core \ No newline at end of file